:root{--bg: #e7ecf0;--panel: #ffffff;--ink: #171d24;--muted: #4d5a68;--line: #cbd5e1;--accent: #155e75;--danger: #b93535}*{box-sizing:border-box}html,body,#root{margin:0;width:100%;height:100%}body{font-family:IBM Plex Sans,Avenir Next,Segoe UI,sans-serif;color:var(--ink);background:radial-gradient(circle at 15% 5%,rgba(21,94,117,.12),transparent 48%),radial-gradient(circle at 90% 90%,rgba(45,212,191,.12),transparent 40%),var(--bg)}.app{height:100%;min-height:0;display:flex;flex-direction:column}.workspace-shell{flex:1;min-height:0;display:flex;gap:.75rem;padding:.75rem}.project-drawer{width:16rem;min-width:16rem;min-height:0;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:12px;background:var(--panel);overflow:hidden;transition:width .2s ease,min-width .2s ease,opacity .2s ease,margin-right .2s ease}.project-drawer.collapsed{width:0;min-width:0;opacity:0;margin-right:-.75rem;border-width:0;pointer-events:none}.project-drawer-header{padding:.65rem .75rem .6rem;border-bottom:1px solid var(--line);background:#f8fafc}.project-drawer-heading-row{display:flex;align-items:center;justify-content:space-between;gap:.55rem}.project-app-heading{display:flex;align-items:center;gap:.45rem}.project-open-button{padding:.32rem .5rem;font-size:.8rem;white-space:nowrap}.project-status{margin-top:.35rem;min-width:0;width:auto;text-align:left}.project-drawer-body{flex:1;min-height:0;overflow:auto;padding:.55rem}.project-empty{margin:0;font-size:.9rem;color:var(--muted);line-height:1.4}.project-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.35rem}.project-list li{margin:0}.project-list-item{position:relative}.project-row{position:relative;display:flex;align-items:center;gap:.35rem}.project-item{flex:1 1 auto;min-width:0;text-align:left;border:1px solid var(--line);background:#fff;border-radius:8px;padding:.45rem .55rem;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.project-item:hover:not(:disabled){border-color:#9fb2be;background:#f8fafc}.project-item.active{color:#0f4656;border-color:#95b2bb;background:#e7f3f7;font-weight:600}.project-item:disabled{opacity:1;cursor:default}.project-menu-trigger{width:1.9rem;height:1.9rem;flex:0 0 auto;padding:0;border-radius:8px;line-height:1;font-size:1rem;display:inline-flex;align-items:center;justify-content:center}.project-menu{position:absolute;top:calc(100% + .25rem);right:0;z-index:20;min-width:11rem;padding:.3rem;border:1px solid var(--line);border-radius:10px;background:#fff;box-shadow:0 10px 22px #0f172a2e,0 2px 8px #0f172a1a}.project-menu-item{width:100%;border:0;background:transparent;border-radius:6px;text-align:left;padding:.35rem .45rem}.project-menu-item:hover:not(:disabled){background:#eef2f4}.project-menu-item.danger{color:#9f1239}.project-menu-item.danger:hover:not(:disabled){background:#fee2e2}.project-menu-item:disabled{opacity:.5}.brand{margin:0;font-size:1.05rem;letter-spacing:.08em;text-transform:uppercase}button,select{font:inherit}button,select{border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:8px;padding:.45rem .65rem}button{cursor:pointer}button:disabled,select:disabled{cursor:not-allowed;opacity:.55}.status{font-size:.86rem;color:var(--muted);min-width:16ch;text-align:right}.status.error{color:var(--danger)}.help-button{width:1.65rem;height:1.65rem;padding:0;border-radius:999px;font-weight:700;line-height:1;display:inline-flex;align-items:center;justify-content:center}.help-overlay{position:fixed;inset:0;z-index:40;display:flex;align-items:center;justify-content:center;padding:1rem;background:#0f172a59}.help-dialog{width:min(36rem,100%);margin:0;border:1px solid var(--line);border-radius:12px;padding:.95rem 1rem .9rem;background:#fff;box-shadow:0 16px 36px #0f172a38,0 4px 10px #0f172a1f}.help-dialog h2{margin:0 0 .55rem;font-size:1rem;letter-spacing:.02em}.help-dialog p{margin:0;color:#24303c;line-height:1.5}.help-dialog ul{margin:.6rem 0 0;padding-left:1.2rem;color:#24303c;line-height:1.45}.help-dialog li+li{margin-top:.25rem}.help-dialog-actions{margin-top:.85rem;display:flex;justify-content:flex-end}.panes{flex:1;min-height:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;padding:0}.panel{min-height:0;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--panel)}.panel-header{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.6rem .75rem;border-bottom:1px solid var(--line);background:#f8fafc}.panel-controls{display:flex;align-items:center;gap:.5rem}.panel-controls select{min-width:12rem}.save-indicator{width:.55rem;height:.55rem;border-radius:999px;border:1px solid #6b7280;display:inline-block;flex:0 0 auto}.save-indicator.saved{background:#16a34a;border-color:#15803d}.save-indicator.dirty{background:#eab308;border-color:#ca8a04}.tab-controls{display:none}.tab-controls.active{display:flex}.editor-tabs{display:flex;align-items:center;gap:.4rem}.editor-tab{border:1px solid var(--line);background:#eef2f4;color:var(--muted);border-radius:8px;padding:.35rem .65rem;font-size:.78rem;letter-spacing:.06em;text-transform:uppercase}.editor-tab.active{background:#fff;color:var(--ink);border-color:#aeb8c0}.panel-title{margin:0;font-size:.8rem;text-transform:uppercase;letter-spacing:.07em;color:var(--muted)}.panel-body{flex:1;min-height:0;overflow:auto}.panel-body.tabbed{overflow:hidden}.tab-pane{display:none;width:100%;height:100%}.tab-pane.active{display:block}.editor-host{height:100%}.editor-host .cm-editor{height:100%;border:0;background:#fff}.editor-host .cm-scroller,.editor-host .cm-content,.editor-host .cm-gutters{background:#fff}.editor-host .cm-content,.editor-host .cm-gutter{padding-top:.75rem;padding-bottom:.75rem}.editor-host .cm-content{padding-left:.5rem;padding-right:.5rem}.editor-host .cm-code-block-wrap{margin:.22rem 0;border:1px solid #d3dbe5;border-radius:8px;background:#f8fafc}.editor-host .cm-code-block-wrap .cm-line{padding-left:.45rem;padding-right:.45rem}.editor-host .cm-code-block-wrap .cm-line span{background-color:transparent!important}.editor-host .cm-scroller{font-family:IBM Plex Sans,Avenir Next,Segoe UI,sans-serif;line-height:1.45}.editor-host .cm-focused{outline:none}.editor-host .cm-editor .cm-selectionBackground{background:#155e7533!important}.editor-host .cm-editor.cm-focused .cm-selectionBackground{background:#155e7547!important}.editor-host .cm-editor .cm-content ::selection,.editor-host .cm-editor .cm-line::selection,.editor-host .cm-editor .cm-line>span::selection,.editor-host .cm-editor .cm-line>span>span::selection{background:#155e7547!important}.style-editor{display:block;width:100%;height:100%;min-height:100%;margin:0;border:0;background:#fff}.style-editor .cm-scroller{font-family:IBM Plex Sans,Avenir Next,Segoe UI,sans-serif;font-size:.92rem;line-height:1.4;color:#11151a}.style-editor .cm-editor.cm-focused{outline:2px solid rgba(21,94,117,.24);outline-offset:-2px}.output-body{padding:.4rem}.output-frame{display:block;width:100%;height:100%;min-height:100%;border:0;background:#fff}.output-empty{margin:0;color:var(--muted)}.markdown-output{margin:0;color:var(--ink);line-height:1.5}.markdown-output>:first-child{margin-top:0}.markdown-output>:last-child{margin-bottom:0}.markdown-output h1,.markdown-output h2,.markdown-output h3,.markdown-output h4,.markdown-output h5,.markdown-output h6{margin:1rem 0 .55rem;line-height:1.25}.markdown-output p{margin:0 0 .75rem}.markdown-output ul,.markdown-output ol{margin:0 0 .8rem;padding-left:1.35rem}.markdown-output li+li{margin-top:.2rem}.markdown-output a{color:var(--accent);text-underline-offset:.12em}.markdown-output blockquote{margin:0 0 .9rem;padding:.1rem 0 .1rem .8rem;border-left:3px solid #94a3b8;color:#334155}.markdown-output code{font-family:IBM Plex Mono,Fira Code,monospace;font-size:.88em;background:#f1f5f9;border-radius:4px;padding:.1em .28em}.markdown-output pre{margin:0 0 .9rem;padding:.7rem .8rem;border-radius:8px;border:1px solid var(--line);background:#f8fafc;overflow-x:auto}.markdown-output pre code{background:transparent;padding:0}.markdown-output hr{border:0;border-top:1px solid var(--line);margin:1rem 0}.markdown-output img{max-width:100%;height:auto;display:block;margin:.35rem 0 .9rem;border-radius:6px;border:1px solid var(--line)}.math-inline{display:inline-block;vertical-align:middle}.math-display{display:block;overflow-x:auto;overflow-y:hidden}@media print{body *{visibility:hidden}.output-body,.output-body *{visibility:visible}.output-body{position:absolute;inset:0;overflow:visible;padding:0;background:#fff}}@media(max-width:980px){.status{min-width:0;text-align:left;width:auto}.panel-controls{flex-wrap:wrap;justify-content:flex-end}.panel-controls select{min-width:0}.workspace-shell{flex-direction:column}.project-drawer{width:100%;min-width:0}.project-drawer.collapsed{width:100%;min-width:0;margin-right:0;max-height:0}.panes{grid-template-columns:1fr}}