.app-bar { z-index:10; min-width:0; display:flex; align-items:center; gap:8px; padding:4px 8px; border:2px solid #506182; border-radius:8px; background:linear-gradient(#212b46,#11182a); box-shadow:inset 0 2px #7b88a344,0 3px 0 var(--shadow-deep); }
.brand { flex:0 0 auto; align-self:center; display:grid; place-content:center; gap:2px; color:var(--text-primary); white-space:nowrap; font:var(--type-label)/1 var(--font-display); letter-spacing:.04em; text-decoration:none; text-shadow:2px 2px #000; }
.brand > span { display:block; }
.brand small { color:var(--text-muted); font:700 9px/1 var(--font-ui); text-shadow:none; }
.brand-mark { display:grid; place-items:center; width:34px; height:34px; color:#160d25; border:2px solid #ffd75a; border-radius:7px; background:linear-gradient(135deg,#ffe66d,#ff9f1c); font:900 15px/1 var(--font-ui); box-shadow:inset 2px 2px #fff7,2px 2px #050811; }
.transport { min-width:0; display:flex; align-items:center; gap:8px; }
.workspace { --lower-panel-height:160px; min-width:0; min-height:0; display:grid; grid-template-columns:minmax(380px,40%) minmax(0,60%); gap:8px; }
.workspace.code-hidden,.workspace.studio-hidden { grid-template-columns:1fr; }
.code-stack { min-width:0; min-height:0; display:grid; grid-template-rows:minmax(0,1fr) var(--lower-panel-height); gap:8px; }
.code-stack.code-hidden,.code-stack.console-hidden { grid-template-rows:1fr; }
.studio-region { min-width:0; min-height:0; display:grid; grid-template-rows:minmax(0,1fr) var(--lower-panel-height); gap:8px; }
.studio-top { min-width:0; min-height:0; display:grid; grid-template-columns:208px minmax(0,1fr); gap:8px; }
.studio-top.controls-hidden,.studio-top.canvas-hidden { grid-template-columns:1fr; }
.editor-region,.inputs-region,.canvas-region { min-width:0; min-height:0; display:flex; flex-direction:column; }
.window-panel { min-width:0; min-height:0; overflow:hidden; border:2px solid var(--line-bright); border-radius:var(--panel-radius); background:var(--bg-panel); box-shadow:inset 0 0 0 1px #090d18,inset 0 2px #96a5c033,0 3px 0 var(--shadow); }
.panel-title { flex:0 0 28px; min-height:28px; display:flex; align-items:center; justify-content:space-between; padding:0 8px; color:var(--text-heading); border-top:1px solid #8291b022; border-bottom:2px solid var(--border-dark); background:var(--surface-title); box-shadow:inset 0 2px #96a5c02e,inset 0 -1px #11192b; font-size:var(--type-title); font-weight:var(--weight-heavy); letter-spacing:.04em; text-transform:uppercase; }
.panel-title > span:first-child { flex:1; }
.panel-title .panel-action { flex:0 0 auto; width:auto; min-width:48px; height:22px; min-height:22px; max-height:22px; margin:0; padding:1px 7px; overflow:visible; line-height:16px; }
.code-title-actions { min-width:0; display:flex; align-items:center; gap:6px; white-space:nowrap; }
.code-title-actions .panel-action { min-width:54px; }
.wrap-control,.zoom-control { display:flex; align-items:center; gap:4px; font-size:var(--type-caption); }
.wrap-control input { width:14px; height:14px; margin:0; accent-color:var(--state-accent); }
.zoom-control { display:flex; align-items:center; gap:4px; font-size:var(--type-caption); }
.zoom-control select { min-width:62px; height:22px; padding:0 4px; font-size:var(--type-label); }
#editor-pane { flex:1; min-height:0; font-family:var(--font-code) !important; line-height:1.6 !important; }
#editor-pane,#editor-pane * { font-variant-ligatures:none !important; font-feature-settings:'liga' 0,'calt' 0 !important; }
.empty-workspace { position:absolute; inset:0; display:grid; place-items:center; margin:0; color:var(--text-muted); background:var(--bg-panel); }
.console-panel { display:grid; grid-template-rows:28px minmax(0,1fr) 36px; }