/* Dark website chrome around the original educational visualization. */
:root{--ink:#eeede8;--muted:#aaa9a2;--line:#ffffff24;--accent:#c7b07e;--accent-soft:#28251e;--paper:#121416;--canvas:#090a0b;--warm:#c7b07e;font-size:14px;color-scheme:dark}
#classroom{height:calc(100dvh - 88px);background:var(--canvas)}
.lesson-header{background:var(--canvas)}.lesson-brand h1{font-size:24px;font-weight:400}.eyebrow{color:var(--accent);font-size:12px}
button,select,.process-bar select,.view-modes,.view-settings summary,.settings-panel,.playback,dialog{background:#17191b;border-color:var(--line);border-radius:3px;color:var(--ink)}button:hover,summary:hover{background:#272721;border-color:#c7b07e80}button.dark,button[aria-pressed=true],#lesson-fullscreen{background:var(--accent);color:#111;border-color:var(--accent)}
.process-bar,.lesson-timeline,.lesson-detail{background:#101214}.process-bar label{font-size:14px}.process-note{font-size:12px}
.stage-group,#stages button .stage-number{color:var(--muted)}#stages button{color:var(--ink);border-radius:3px}#stages button:hover{background:#ffffff0a}#stages button[aria-current=step]{background:#c7b07e1a;border-color:#c7b07e55;color:var(--accent);box-shadow:inset 2px 0 var(--accent)}#stages button[aria-current=step] .stage-number{color:var(--accent)}.standard-dot{color:var(--accent);background:#c7b07e16}
.view-modes{border-radius:3px}.view-modes button{border-radius:2px}.view-modes button[aria-pressed=true]{color:#111}.view-settings summary{border-radius:3px}.settings-panel{box-shadow:0 16px 50px #0008}.visual-area{border-radius:3px;border-color:var(--line)}
.scene-caption{padding:9px 12px;background:#101214d9;border-left:2px solid var(--accent)}.scene-caption span{color:#f2f1ed}.scene-caption small{color:#c3bcae}.scene-hint{color:#eee;background:#101214d9;border:0;border-radius:3px}.playback{border-radius:3px}.time-note{color:var(--muted);font-size:12px}
.detail-tabs{background:#1c1e20;border-radius:3px}.detail-tabs button[aria-selected=true]{background:#c7b07e22;color:var(--accent);box-shadow:none}.detail-tabs button{border-radius:2px}.lesson-detail h2{font-weight:400}.lesson-detail h3,.node-standard-card h4{color:var(--ink)}.lesson-detail li:before{color:var(--accent);border-color:#c7b07e50}.lesson-detail li.is-current{color:var(--ink)}.check-card,.node-standard-card{background:#c7b07e0a;border-color:#c7b07e30;border-radius:3px}.node-standard-card small,.lesson-detail .scope-note{color:var(--muted);font-size:12px}.standard-empty{background:#151719;border-color:var(--line);border-radius:3px}#detail-toggle{background:#c7b07e15;color:var(--accent);border-color:#c7b07e55}#peer-options{background:#181a1c;border-color:var(--line);border-radius:3px}#peer-toggle{background:#c7b07e15;color:var(--accent);border-color:#c7b07e50}#peer-toggle[aria-pressed=true]{background:var(--accent);color:#111}dialog{box-shadow:0 24px 100px #0009}dialog::backdrop{background:#000b}#export-download{color:#111;border-radius:3px}.lesson-detail{border-radius:0}
#classroom:fullscreen{height:100dvh}
@media(max-width:1100px){.lesson-detail{background:#101214}.detail-backdrop:not([hidden]){background:#0008}.lesson-header{flex-wrap:wrap}.header-tools{gap:6px}}
@media(max-width:900px){#classroom{height:calc(100dvh - 130px)}}
@media(max-width:760px){#classroom{height:auto;min-height:calc(100dvh - 130px);overflow:visible}.lesson-header{gap:12px}.header-tools{margin-left:0;flex-wrap:wrap}.lesson-header h1{font-size:23px}.header-tools button{font-size:13px}.lesson-layout{flex:none}.lesson-center{flex:none;min-height:520px;overflow:visible}.visual-area{min-height:300px;flex:1}.process-bar label{font-size:13px}.process-bar select{font-size:13px}.view-modes button{font-size:12px}.playback-actions{flex-wrap:wrap}.lesson-brand .eyebrow{font-size:11px}#classroom:fullscreen{overflow:auto;height:100dvh}}