/* Layout contracts for the three new worlds. Existing controls and canvases stay mounted. */
.console-controls-toggle[hidden]{display:none!important}
:root[data-theme=early-console] body .console-controls-toggle{min-height:38px;padding:7px 12px;border-color:var(--ui-mark);color:var(--ui-ink);background:var(--ui-panel)}

@media(min-width:900px){
 /* The shape bank is a scrollable tool drawer, not a wall between screen and controls. */
 :root[data-theme-generation=new] body .seed-shelf{max-height:330px;overflow-y:auto;overscroll-behavior:contain;scrollbar-color:var(--ui-etch) var(--ui-panel)}
 /* A stompbox is one object: signal window above its wide lower control deck. */
 :root[data-theme=stompbox] body main,
 :root[data-theme=stompbox] body.instrument-panel main{display:flex;flex-direction:column;gap:18px;max-width:1480px;height:auto;min-height:0;margin:0 auto;padding:20px 30px 45px}
 :root[data-theme=stompbox] body .stage,
 :root[data-theme=stompbox] body.instrument-panel .stage{position:relative;top:auto;width:100%;padding-left:70px;min-height:0;overflow:visible}
 :root[data-theme=stompbox] body main>aside{width:100%;max-height:none;overflow:visible;align-self:stretch}
 :root[data-theme=stompbox] body .monitor{width:100%;max-width:none;min-height:min(52vw,550px)}
 :root[data-theme=stompbox] body .rack-tabs{grid-template-columns:repeat(7,minmax(0,1fr))}
 :root[data-theme=stompbox] body .rack-tabs button{min-height:44px}
 :root[data-theme=stompbox] body :is(.field-dock,.scope-dock){max-width:none}
 :root[data-theme=stompbox] body .theme-world-label{letter-spacing:3px}

 /* A grimoire opens as two pages: mutable notation left, live portal right. */
 :root[data-theme=light-wizard] body main,
 :root[data-theme=light-wizard] body.instrument-panel main{display:grid;grid-template-columns:minmax(300px,36%) minmax(0,1fr);gap:24px;height:auto;min-height:0;padding:22px 30px 40px}
 :root[data-theme=light-wizard] body main>aside{grid-column:1;grid-row:1;align-self:start;max-height:none;overflow:visible}
 :root[data-theme=light-wizard] body .stage,
 :root[data-theme=light-wizard] body.instrument-panel .stage{grid-column:2;grid-row:1;position:sticky;top:18px;min-width:0;padding:0 0 0 65px;overflow:visible}
 :root[data-theme=light-wizard] body .command-rail{left:0;top:30px}
 :root[data-theme=light-wizard] body .monitor{width:100%;min-height:min(48vw,540px)}
 :root[data-theme=light-wizard] body main>aside:before{border-radius:inherit}
 :root[data-theme=light-wizard] body .workspace-tabs{gap:2px;transform:rotate(-1deg)}
 :root[data-theme=light-wizard] body .rack-tabs{grid-template-columns:repeat(2,minmax(0,1fr));padding:11px}
 :root[data-theme=light-wizard] body .rack-tabs button{min-height:45px;text-align:left;padding-left:13px}

 /* A console gives the screen the room; modes live in a persistent system rail. */
 :root[data-theme=early-console] body header{min-height:78px}
 :root[data-theme=early-console] body .workspace-tabs{position:fixed;z-index:22;top:104px;left:15px;display:grid;grid-template-columns:1fr;gap:8px;width:95px;padding:8px}
 :root[data-theme=early-console] body .workspace-tabs button{min-height:62px;white-space:normal;line-height:1.25}
 :root[data-theme=early-console] body main,
 :root[data-theme=early-console] body.instrument-panel main{display:block;max-width:none;height:auto;min-height:calc(100dvh - 78px);padding:20px 28px 36px 130px}
 :root[data-theme=early-console] body .stage,
 :root[data-theme=early-console] body.instrument-panel .stage{position:relative;top:auto;width:100%;min-height:0;padding:0 0 0 65px;overflow:visible}
 :root[data-theme=early-console] body .monitor{width:100%;min-height:min(61vh,680px)}
 :root[data-theme=early-console] body main>aside{position:fixed;z-index:21;top:96px;right:22px;width:min(410px,calc(100vw - 145px));max-height:calc(100dvh - 112px);overflow:auto;transform:translateX(0);visibility:visible;transition:transform .18s ease,visibility .18s ease}
 :root[data-theme=early-console] body.console-controls-closed main>aside{transform:translateX(calc(100% + 40px));visibility:hidden;pointer-events:none}
 :root[data-theme=early-console] body .theme-world-label{position:relative;letter-spacing:2px}
 :root[data-theme=early-console] body .rack-tabs{grid-template-columns:repeat(3,minmax(0,1fr))}
}

@media(max-width:899px){
 :root[data-theme=early-console] body .console-controls-toggle{display:none!important}
 :root[data-theme=early-console] body main>aside{visibility:visible!important;transform:none!important;pointer-events:auto!important}
}

@media(prefers-reduced-motion:reduce){:root[data-theme=early-console] body main>aside{transition:none}}
