/* Focused workspace shell. Shared controls and platform pages retain their themes. */
#studio { display:flex; flex-direction:column; height:100dvh; overflow:hidden; }
#studio .topbar { height:62px; min-height:62px; gap:20px; }
#studio .app-shell { display:grid; grid-template-columns:72px minmax(0,1fr); flex:1; min-height:0; }
#studio .sidebar { display:flex; flex-direction:column; align-items:center; padding:16px 8px 12px; gap:16px; overflow:auto; background:var(--color-kumo-tint); }
#studio .sidebar nav { display:flex; flex-direction:column; gap:8px; overflow:visible; flex-shrink:0; }
#studio .sidebar button { position:relative; justify-content:center; min-width:0; width:48px; height:48px; min-height:48px; padding:12px; border:1px solid transparent; border-radius:14px; background:transparent; color:var(--text-color-kumo-subtle); }
#studio .sidebar button .icon { width:23px; height:23px; }
#studio .sidebar .rail-label { display:none; }
#studio .sidebar button:hover { background:var(--color-kumo-control); color:var(--text-color-kumo-default); }
#studio .sidebar nav button[aria-current=page] { background:color-mix(in srgb,var(--text-color-kumo-default) 7%,var(--color-kumo-tint)); border-color:transparent; color:var(--text-color-kumo-default); box-shadow:none; }
#studio .sidebar button:focus-visible { outline:2px solid var(--color-kumo-brand); outline-offset:-2px; }
#studio .sidebar-bottom { display:flex; flex-direction:column; flex-shrink:0; gap:8px; margin-top:auto; padding:12px 0 0; }
#studio :is(.activity-dot,.app-ready) { position:absolute; top:7px; right:6px; width:7px; height:7px; box-shadow:0 0 0 2px var(--color-kumo-tint); }
.rail-tooltip { position:fixed; inset:auto; margin:0; padding:7px 11px; border:1px solid var(--color-kumo-line); border-radius:8px; background:var(--color-kumo-base); color:var(--text-color-kumo-default); font:13px/1.5 var(--font-sans); box-shadow:var(--shadow-stack); white-space:nowrap; }
#studio .workspace { padding:0 20px 16px; overflow:hidden; }
#studio .workspace-heading { display:flex; flex-direction:row; align-items:center; justify-content:space-between; height:auto; min-height:92px; padding:16px 0; gap:12px; flex-wrap:wrap; }
#studio .workspace-heading h1 { font-size:18px; line-height:1.4; text-wrap:pretty; }
.build-identity { margin:0 0 4px; color:var(--text-color-kumo-subtle); font-size:12px; }
#studio .build-actions { display:flex; flex-wrap:wrap; width:auto; gap:6px; }
#studio .build-actions button { min-height:38px; font-size:13px; padding:7px 10px; }
#studio .workbench { display:flex; flex:1; width:100%; border:0; border-radius:0; box-shadow:none; background:transparent; overflow:hidden; min-height:0; }
#studio :is(.workspace-surface,.agent-panel,.instructions-panel) { flex:1; min-width:0; min-height:0; border:1px solid var(--color-kumo-line); border-radius:12px; background:var(--color-kumo-base); box-shadow:var(--shadow-stack); }
#studio .workspace-surface { display:flex; }
#studio .surface-content { display:flex; flex:1; min-height:0; }
#studio .agent-panel { display:flex; overflow:auto; }
#studio .agent-title { display:flex; }
#studio .conversation { min-height:80px; padding:24px max(24px,calc((100% - 800px)/2)); scroll-behavior:auto; }
#studio .welcome { padding:12px 0 24px; }
#studio .welcome h2 { max-width:none; }
#studio .composer { flex-shrink:0; width:calc(100% - 32px); max-width:800px; margin:0 auto 16px; padding:12px; }
#studio .composer textarea { min-height:64px; max-height:160px; font-size:16px; }
#studio .composer .reasoning { margin-top:4px; }
#studio :is(.agent-progress,.agent-continuation) { padding:10px 20px; }
#studio .editor-panel,#studio .preview-panel { flex:1; min-height:0; }
#studio .terminal-panel { display:flex; height:auto; max-height:none; min-height:0; flex:1; border:0; box-shadow:none; }
#studio .terminal-title { min-height:48px; flex-wrap:wrap; height:auto; padding:6px 12px; }
.terminal-feedback { flex-shrink:0; margin:0; padding:8px 14px; font-size:13px; line-height:1.5; color:var(--text-color-kumo-subtle); border-bottom:1px solid var(--color-kumo-line); }
#studio #terminal { min-height:80px; }
#studio .file-toolbar { min-height:48px; height:auto; gap:8px; }
#studio #fileTree { position:static; width:210px; max-width:35%; }
#studio .instructions-panel { overflow:hidden; display:flex; }
.instructions-content { flex:1; overflow:auto; overscroll-behavior:contain; padding:32px max(24px,calc((100% - 840px)/2)); }
.instructions-content:focus-visible { outline:2px solid var(--color-kumo-brand); outline-offset:-3px; }
.instructions-content h2 { font-size:28px; font-weight:550; line-height:1.25; letter-spacing:-.03em; margin:8px 0 16px; }
.instructions-content h3 { font-size:18px; margin:28px 0 12px; }
#instructionsObjective { font-size:17px; color:var(--text-color-kumo-subtle); line-height:1.7; }
.build-path { padding-left:24px; line-height:1.8; color:var(--text-color-kumo-subtle); }
.build-path li { padding-left:4px; margin:4px 0; }
#inlineMission { font:15px/1.8 var(--font-sans); overflow-wrap:anywhere; margin:16px 0 24px; padding-top:4px; }
#inlineMission :is(h3,h4) { font-size:18px; margin:28px 0 12px; }
#inlineMission :is(ul,ol) { padding-left:24px; }
#inlineMission li { margin:10px 0; }
#inlineMission code { font-size:.9em; background:var(--color-kumo-tint); padding:2px 4px; border-radius:4px; }
#inlineMission :is(blockquote,pre) { margin:16px 0; padding:16px; background:var(--color-kumo-tint); border-left:3px solid var(--color-kumo-line); white-space:pre-wrap; }
.mission-table { overflow:auto; margin:20px 0; border:1px solid var(--color-kumo-line); border-radius:8px; }
.mission-table table { width:100%; border-collapse:collapse; font-size:14px; }
.mission-table :is(th,td) { text-align:left; vertical-align:top; padding:10px 12px; border-bottom:1px solid var(--color-kumo-line); }
.mission-table th { background:var(--color-kumo-tint); }
.activity-dot { width:7px; height:7px; border-radius:50%; background:var(--color-kumo-brand); flex-shrink:0; }
#studio .lab-cover { overflow:auto; align-items:safe center; }
#studio .lab-cover-card { margin:auto; }
.lab-menu { max-height:calc(100dvh - 76px); overflow:auto; overscroll-behavior:contain; }
#studio .action-availability { display:block; font-size:13px; flex-shrink:0; }
/* Feedback occupies layout space rather than covering the editor or composer. */
#studio > #toast:not([hidden]) { position:static; transform:none; translate:none; max-width:none; width:auto; margin:0; border-radius:0; border-inline:0; padding:10px 20px; flex-shrink:0; font-size:13px; }
@media(max-width:1000px) {
 #studio .topbar { gap:12px; padding:0 16px; }
 #studio .topbar .brand>span { display:none; }
 #studio .workspace { padding-inline:12px; }
 #studio .workspace-heading { min-height:100px; }
 #studio .heading-copy { width:100%; }
}
@media(max-width:760px) {
 #studio .topbar { height:56px; min-height:56px; padding:0 10px; }
 #studio .app-shell { display:flex; flex-direction:column; min-height:0; }
 #studio .sidebar { flex:none; display:block; padding:0 6px; overflow:visible; background:var(--color-kumo-base); }
 #studio .sidebar-label,#studio .sidebar-bottom { display:none; }
 #studio .sidebar .workspace-nav { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:0; }
 #studio .sidebar nav button { position:relative; flex-direction:column; gap:3px; width:100%; height:auto; min-height:60px; padding:8px 2px; font-size:clamp(10px,2.8vw,11px); line-height:1.4; border-radius:0; border:0; }
 #studio .sidebar .rail-label { display:inline; }
 #studio .sidebar nav button[aria-current=page] { box-shadow:inset 0 -3px var(--color-kumo-brand); background:var(--color-kumo-tint); }
 #studio .sidebar nav .icon { width:18px; height:18px; }
 #studio :is(.activity-dot,.app-ready) { position:absolute; top:8px; right:15%; }
 #studio .workspace { padding:8px; }
 #studio .workspace-heading { display:none; }
 #studio .conversation { padding:18px; }
 #studio .composer { margin:0 10px 10px; width:auto; }
 #studio .panel-title { min-height:44px; height:auto; padding:8px 12px; }
 #studio .service-badge { font-size:12px; }
 #studio .file-toolbar { gap:4px; padding-inline:6px; }
 #studio .file-toolbar button { padding-inline:5px; }
 #studio #fileTree { position:absolute; inset:0; width:100%; max-width:none; z-index:3; }
 #studio #editor[inert] { visibility:hidden; }
 #studio .terminal-title { gap:4px; }
 #studio .terminal-title small { display:none; }
 .instructions-content { padding:20px; }
 .instructions-content h2 { font-size:24px; }
 .instructions-content button { white-space:normal; text-align:left; }
 #inlineMission { padding:12px; font-size:13px; }
 #studio .action-availability { display:none; }
}
@media(max-height:560px) {
 #studio .workspace-heading { min-height:72px; padding-block:8px; }
 #studio .composer textarea { min-height:44px; max-height:80px; line-height:1.4; }
 #studio .composer { padding:8px; margin-bottom:8px; }
 #studio .composer-footer { margin-top:0; }
 #studio .conversation { padding-block:12px; }
}
