/* Progressive disclosure: the scene stays central, tools open on demand. */
:root{--line:#303a34;--muted:#a0aaa4}
.app-shell{height:100dvh;min-height:420px;grid-template-rows:68px minmax(0,1fr) 88px}
.workspace{position:relative;display:block;overflow:hidden}.stage-wrap{height:100%;min-height:0;width:100%}
.topbar{gap:16px}.top-stats{margin-left:auto;gap:18px}.top-stats #coords{display:none}
.workspace-actions{display:flex;gap:8px}.workspace-actions button,#statsToggle{border:1px solid var(--line);border-radius:8px;background:#19201c;color:var(--text);padding:10px 14px;font-size:12px;cursor:pointer;white-space:nowrap}
.workspace-actions button[aria-expanded=true],#statsToggle[aria-expanded=true]{border-color:var(--acid);background:#242c1c}
#currentTechnology{margin-left:9px;color:var(--acid);font:600 11px ui-monospace,monospace}
#editorOpen{display:none!important}
.settings-panel.side,.editor-panel{position:absolute;top:12px;bottom:12px;z-index:12;width:340px;max-width:calc(100% - 24px);border:1px solid var(--line);border-radius:14px;background:#141a17f5;box-shadow:0 20px 60px #0006;visibility:hidden;transition:transform .22s ease,visibility .22s}
.settings-panel.side{left:12px;transform:translateX(calc(-100% - 24px));gap:16px;padding:18px}
.editor-panel{right:12px;width:440px;display:flex;transform:translateX(calc(100% + 24px));padding:18px}
.settings-open .settings-panel.side,.code-open .editor-panel,.app-shell:has(#editorOpen:checked) .editor-panel{transform:translateX(0);visibility:visible}
.drawer-heading{display:flex;align-items:center;justify-content:space-between;padding-bottom:14px;border-bottom:1px solid var(--line)}
.drawer-heading small{font-size:9px;letter-spacing:.12em;color:var(--muted)}.drawer-heading h2{font-size:18px;margin:5px 0 0;font-weight:600}
.drawer-heading button{border:0;background:transparent;color:var(--muted);font-size:25px;cursor:pointer;padding:3px 8px}
.side-sec,.model-card{border-radius:9px}.side-sec>summary{padding:14px 12px;font-size:12px;text-transform:none;letter-spacing:0}.sec-body{padding:0 12px 12px;gap:12px}
.tech-btn{padding:11px 3px;border-radius:7px}.tech-btn b{font-size:12px}.tech-btn small{font-size:10px}
.technology-note{font-size:12px;line-height:1.5;padding:10px;border:0;background:transparent}.technology-note span{color:var(--muted)}
.side .machine-grid label{font-size:11px;letter-spacing:0;text-transform:none}.side .machine-grid input,.side .machine-grid select{padding:10px;font-size:13px;border-radius:6px}
.side .example{padding:11px;border-radius:6px}.side .example span{font-size:12px}.side .example small{font-size:11px}
.view-tools{top:18px;left:18px;border-radius:9px;padding:4px;gap:2px;flex-wrap:wrap;max-width:calc(100% - 220px)}.view-tools button{border-radius:6px;min-height:32px}
#statsToggle{position:absolute;right:18px;top:18px;z-index:5;background:#111815ed}
.print-card{top:66px;right:18px;left:auto;bottom:auto;border-radius:10px;padding:15px;gap:9px 18px;font-size:12px;z-index:5}.print-card[hidden]{display:none}
.scene-hint{top:auto;bottom:18px;left:20px;font-size:11px;max-width:55%;line-height:1.5;pointer-events:none;opacity:.7}.asset-ready .scene-hint:after{content:none}
.phase-caption{bottom:55px;border-radius:7px}.close-editor{display:block;cursor:pointer}.editor-actions>span{display:none}.editor-actions{flex-wrap:wrap}.editor-actions h2{font-size:14px;text-transform:none;letter-spacing:0}.editor-actions .ghost{padding:8px!important;border-radius:6px}
.transport{padding:14px 24px;gap:16px}.speed button{border-radius:5px;min-width:38px;min-height:34px}.play{box-shadow:0 0 24px #dfff3515}
button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:2px solid var(--acid);outline-offset:3px}
button,summary{touch-action:manipulation}button:hover{filter:brightness(1.12)}[inert]{pointer-events:none}
.tab-slicer .workspace-actions{display:none}.sl-settings details{border:1px solid var(--line);border-radius:8px;padding:12px}.sl-settings summary{cursor:pointer;font-size:12px;color:var(--text);margin-bottom:0}.sl-settings details[open]>summary{margin-bottom:14px}.sl-settings details .sl-fields{margin-top:14px}
@media(max-width:1000px){.top-stats span:nth-child(n+2){display:none}.brand div>span{display:none}.topbar{padding:0 16px;gap:10px}.app-tabs{margin-left:0}}
@media(max-width:650px){body{overflow:hidden}.app-shell{height:100dvh;min-height:380px;grid-template-rows:106px minmax(0,1fr) 110px}.topbar{display:flex;flex-wrap:wrap;align-content:center;gap:10px;padding:10px 14px}.brand{flex:1}.brand strong{font-size:12px}.brand-mark{width:28px;height:28px}.app-tabs{margin:0}.workspace-actions{width:100%}.workspace-actions button{padding:7px 12px}.top-stats{display:none}.stage-wrap{height:100%;min-height:0}.settings-panel.side{width:340px;order:initial}.view-tools{top:10px;left:10px;max-width:calc(100% - 20px);gap:0}.view-tools button{padding:6px 8px;font-size:11px}#statsToggle{top:auto;bottom:12px;right:12px;padding:8px;font-size:11px}.print-card{top:auto;bottom:54px;right:12px;font-size:11px}.scene-hint{display:none}.transport{position:relative;grid-template-columns:40px 28px minmax(0,1fr);gap:8px;padding:10px 14px}.play{width:38px;height:38px}.speed{display:flex;grid-column:1/-1;justify-content:flex-end}.speed>span{margin-right:auto}.speed button{min-height:28px;padding:4px 9px}.phase-caption{bottom:58px;font-size:11px}.editor-panel{top:12px;bottom:12px;width:440px}.editor-panel textarea{min-height:80px}.tab-slicer .app-shell{height:100dvh}.tab-slicer .slicer-app{overflow:auto;grid-template-rows:minmax(360px,55dvh) auto auto}.tab-slicer .topbar{flex-wrap:nowrap}.tab-slicer .app-shell{grid-template-rows:60px minmax(0,1fr)}.toast{bottom:125px;max-width:90vw}}
/* Keep the mode switch anchored when simulator-only controls disappear. */
.topbar{display:grid;grid-template-columns:minmax(0,1fr) auto auto 248px;justify-content:initial}
.topbar .brand{grid-column:1;grid-row:1}.topbar .top-stats{grid-column:2;grid-row:1;margin-left:0}
.topbar .workspace-actions{grid-column:3;grid-row:1}
.topbar .app-tabs{grid-column:4;grid-row:1;position:relative;isolation:isolate;display:grid;grid-template-columns:1fr 1fr;gap:0;width:248px;margin:0;padding:3px;flex-shrink:0}
.app-tabs::before{content:"";position:absolute;z-index:-1;top:3px;bottom:3px;left:3px;width:calc((100% - 6px)/2);border-radius:4px;background:var(--acid);transform:translateX(0);transition:transform .22s ease}
.tab-slicer .app-tabs::before{transform:translateX(100%)}
.app-tabs button{padding:9px 6px;font-size:12px;min-width:0;transition:color .22s ease}
.app-tabs button.active{background:transparent;color:#111}
@media(max-width:1000px){.topbar .top-stats{display:none}}
@media(max-width:650px){.topbar,.tab-slicer .topbar{display:grid;grid-template-columns:minmax(0,1fr) 212px;grid-template-rows:38px;align-content:start;padding:10px 14px;gap:10px}.topbar .app-tabs{grid-column:2;width:212px}.app-tabs button{font-size:11px}.topbar .workspace-actions{grid-column:1/-1;grid-row:2}.brand{gap:6px}.brand div>span{display:none}.brand strong{font-size:11px}}
@media(max-width:880px){body.tab-slicer .slicer-app{overflow:auto;grid-template-rows:minmax(360px,55dvh) auto auto;align-content:start}.sl-view{min-height:360px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}}
