/* v0.8: one primary stage, predictable controls, detail on demand. */
:root{--line:#284457;--muted:#a6bdcd;--cyan:#6be4dc;--amber:#f4c47b}
.appbar{background:#091a29;border-bottom:1px solid #294254;gap:20px}
.brand{letter-spacing:.055em;font-size:16px}.header-actions{margin-left:auto}
.teaching{background:radial-gradient(ellipse at 25% 35%,#17334766,transparent 70%);gap:9px}
.lesson-head h1{font-weight:550;max-width:56ch}.eyebrow{color:#8bb4c8;letter-spacing:.12em}
.stage,.parallel-card{border-color:#325165;background:linear-gradient(155deg,#122c3d,#091c2b);box-shadow:0 8px 24px #0002}
.world-stage{background:radial-gradient(ellipse at 50% 65%,#29455788,#0c2030 76%)}
.stage-top{height:38px;border-bottom:1px solid #2b495960;color:#d9e9f3}
.stage-bottom{height:auto;min-height:23px;padding:4px 10px;color:#a6bdcd;font-size:12px;line-height:1.3}
.model-switch{position:static;align-self:flex-start;padding:3px 6px;border:1px solid var(--line);background:#102b3c}
.model-switch[hidden]{display:none}.model-switch span{font-size:12px;color:var(--muted)}
#ontology-world-mode:not([hidden]){display:flex;gap:5px;align-items:center}
.world-label{color:#e6f2f8;border-color:#608094;background:#102636ed;border-radius:8px;box-shadow:0 4px 12px #0003;font-weight:500}
.world-label[aria-pressed=true]{background:#174947;border-color:var(--cyan);color:#eafffc}
.flow-label{border:1px solid #5b7a8a;background:#102535ed}.flow-label.active{border-color:var(--amber)}
.diagram-edge{stroke-width:2.1;stroke:#8eacbf}.diagram-edge.active{stroke:#f4c47b;stroke-width:3}
.diagram-node rect,.diagram-node polygon{stroke-width:1.6}.diagram-node.selected rect,.diagram-node.selected polygon{stroke-width:3.3}
.diagram-node text{font-weight:500}.edge-label{paint-order:stroke;stroke:#0e2434;stroke-width:4;stroke-linejoin:round}
.reveal{background:#112b3a;border:1px solid #315064;border-radius:10px;padding:10px 12px;gap:6px 14px}
.reveal-label{display:flex;flex-direction:column;align-items:flex-start;min-width:85px;color:#a9c6d5}
#step-number{font-size:12px;color:var(--cyan)}#step-title{font-weight:550}
#step-copy{font-size:16px;line-height:1.4}#step-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
#step-actions:empty{display:none}#step-actions button{text-align:left;min-width:0;padding:7px 10px;line-height:1.3}
#step-actions button[aria-pressed=true]{border-color:var(--cyan);background:#174447}
.selection{font-size:14px;line-height:1.4;border-left:3px solid var(--cyan);padding:5px 10px;background:#173545;border-radius:0 6px 6px 0}
.selection:empty{display:none}.simulation-controls{gap:8px}.simulation-controls[hidden]{display:none}
.navigation{border-top:0;gap:10px;margin:0;padding:0}.navigation #next-scene{display:block;font-size:12px;color:var(--muted)}
.step-dots{gap:4px}.step-dots button{width:auto;height:38px;min-width:38px;padding:4px 8px;display:flex;align-items:center;gap:6px}
.step-dots small{font-size:12px}.step-dots button[aria-current=true]{background:#215054;color:#e7fffa}
.desk-drawer{width:350px;box-shadow:0 0 30px #0003}.desk-rail{background:#0b1e2b}.desk-rail button[aria-pressed=true]{border-color:var(--cyan);background:#183b48}
.drawer-body{gap:12px}.drawer-body select{width:100%;min-height:36px;background:#0b2233;color:var(--ink);font:inherit;border:1px solid #527185;border-radius:7px;padding:6px}
.drawer-body .catalog-filter{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center;margin:0;color:var(--muted);font-size:13px}
.catalog-grid{gap:10px}.catalog-grid button{position:relative;min-height:108px;padding:12px;text-align:left;background:#142e40}
.catalog-number{display:block;font-size:12px;color:var(--cyan);margin-bottom:6px}.catalog-grid strong{font-size:15px;line-height:1.25}.catalog-grid small{font-size:12px;line-height:1.3}
.drawer-body .pager span{font-size:13px;color:var(--muted)}.drawer-body .pager button{min-width:40px;text-align:center}
.parallel-card{padding:14px}.parallel-card h3{color:#e9f5fc}.parallel-card p{color:#a9c7d6}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #91f1e8;outline-offset:3px}
.diagram-node:focus-visible rect,.diagram-node:focus-visible polygon{stroke:#fff;stroke-width:3.5}.numeric-node:focus-visible rect{stroke:#fff;stroke-width:3}
.skip-link{position:fixed;top:-70px;left:16px;z-index:50;background:#e1fffa;color:#103637;padding:10px;border-radius:6px}.skip-link:focus{top:12px}
@media(max-width:1599px){.desk-drawer{position:absolute;right:70px;top:0;bottom:0;z-index:12;border:1px solid #4b7187;box-shadow:-16px 0 45px #0006}.catalog-left #desk-drawer{left:0;right:auto;box-shadow:16px 0 45px #0006}}
@media(max-width:1250px){.desk-drawer{right:62px;width:330px}.step-dots small{display:none}.brand{font-size:14px}.navigation #next-scene{max-width:100px;padding:4px}.stage-top{font-size:13px}}
@media(max-height:800px){.teaching{gap:6px;padding:8px 12px}.reveal{padding:7px 10px}.lesson-head h1{font-size:22px}.stage-top{height:30px}.catalog-grid button{min-height:86px}.drawer-body{gap:9px}.navigation button{min-height:32px}.step-dots button{height:34px}.stage-bottom{font-size:11px;min-height:20px}.world-label{font-size:12px}.reveal #feedback:not(:empty){font-size:13px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(forced-colors:active){button[aria-pressed=true],button[aria-current=true]{border:3px solid Highlight}.diagram-edge{stroke:CanvasText}.diagram-node rect,.diagram-node polygon{fill:Canvas;stroke:CanvasText}.diagram-node text,.edge-label{fill:CanvasText;stroke:none}}

.world-label:hover{background:#244759;color:#fff;border-color:#8fb4c9}

/* Shared asset identity: readable labels, discreet symbols, warm active paths. */
.world-label{display:flex;align-items:center;gap:6px;max-width:156px;font-size:13px;line-height:1.25;padding:6px 9px}
.world-label::before{content:attr(data-ordinal);display:inline-grid;place-items:center;flex:none;width:20px;height:20px;border:1px solid #648697;border-radius:50%;font-size:11px;color:#c9e9ee;background:#234252}
.world-label[aria-pressed=true]::before{background:#77dfd2;color:#082a32;border-color:#77dfd2}
.node-symbol{color:#aacddd;opacity:.9;pointer-events:none}.diagram-node.active .node-symbol{color:#f6cc8a}.diagram-node.selected .node-symbol{color:#8dffe9}
@media(max-height:800px){.world-label{font-size:12px;padding:4px 7px}.world-label::before{width:17px;height:17px}}

.world-label::before{display:none}.world-label>svg{width:19px;height:19px;flex:none;color:#a8ddd8;pointer-events:none}

.world-label{font-size:14px}@media(max-height:800px){.world-label{font-size:13px}}

/* Concept-specific contexts: exactly three choices; longer names fit on laptops. */
.scene-toolbar>.contexts{display:flex;gap:5px;min-width:0;flex:1}.scene-toolbar>.contexts button{min-width:0;max-width:190px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.scene-toolbar>.contexts button[aria-pressed=true]{background:#23474c;color:#dcfff8;border-color:#79cfc2}
.stages.compare,.ontology-layout.compare{grid-template-columns:1.16fr 1fr}
.related-world{display:block;color:var(--cyan);font-size:12px;margin-top:5px}
#place-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.world-stage{background:radial-gradient(ellipse at 50% 66%,#3a596c77,#102735 74%)}
@media(max-width:1250px){.scene-toolbar>.contexts{gap:4px}.scene-toolbar>.contexts button{font-size:13px;padding:5px 8px;max-width:157px}.segmented button{font-size:13px;padding:5px 8px}}

/* Cyan means the current selection and its immediate relations; gold remains the route. */
.diagram-edge.related{stroke:var(--cyan);stroke-width:3.2}.edge-label.related{fill:var(--cyan)}
.diagram-node.neighbor:not(.selected) rect,.diagram-node.neighbor:not(.selected) polygon{stroke:#6bbaaF;stroke-width:2.3}
.world-label.neighbor:not([aria-pressed=true]){border-color:#6bbaaf;box-shadow:0 0 0 1px #6bbaaf22}
.flow-label.related{color:#a9fff0;border-color:var(--cyan)}.flow-label.disabled{opacity:.4}
.numeric-node.neighbor circle{stroke:#6bbaaf;stroke-width:2.5}.numeric-node.selected circle{stroke:var(--cyan);stroke-width:3}
/* Object labels stay attached while the camera moves; controls occupy the existing header. */
.world-leaders{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2;overflow:visible}.world-leaders path{fill:none;stroke:#9cbbcd;stroke-width:1;opacity:.62}.world-leaders circle{fill:#aecbd6;opacity:.85}.world-leaders .selected{stroke:#82f0d7;opacity:1;stroke-width:1.7}.world-leaders circle.selected{fill:#82f0d7}
#world-labels{z-index:3}.world-presentation-controls{display:flex;gap:5px;align-items:center}.world-presentation-controls button{font-size:12px;min-height:26px;padding:3px 7px;white-space:nowrap}.world-presentation-controls #camera{font-size:19px;padding:0 8px}.world-presentation-controls button[aria-pressed=true]{color:#b8ffec;border-color:#6dcab7;background:#194d47}
.world-heading{font-size:14px;min-width:0;white-space:nowrap}.world-stage .stage-top{gap:8px;padding-right:8px}
.selection{display:flex;gap:12px;align-items:center}.selection-copy{flex:1;min-width:0}.selection>button{flex:none;font-size:13px;min-height:28px;padding:4px 8px}
.world-label{background:#102838ee;border-color:#6b90a4;box-shadow:0 5px 12px #0004;max-width:158px}.world-label[aria-pressed=true]{box-shadow:0 0 0 2px #76ddc324,0 5px 14px #0005}
.world-stage{background:radial-gradient(ellipse at 48% 65%,#3b647a77,#0e2433 77%)}
@media(max-width:1250px){.world-heading{font-size:12px}.world-presentation-controls{gap:3px}.world-presentation-controls button{font-size:12px;padding:3px 5px}.world-stage .stage-top{padding-left:8px}}
@media(max-width:1080px){.world-heading{display:none}.world-stage .stage-top{justify-content:flex-end}.selection-copy{font-size:13px}}

/* The teaching rhythm changes emphasis, while the spatial map stays stable. */
.presentation-strip{display:flex;align-items:center;gap:10px;min-height:32px;flex:none;color:#b8cfdb;font-size:14px}
.presentation-strip>button{min-height:29px;font-size:14px;padding:4px 11px;border-radius:18px}.presentation-strip>button[aria-pressed=true]{border-color:#65bbad;background:#1c4746;color:#c7fff0}
#presentation-status{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}
#beat-nav{display:flex;align-items:center;gap:8px;flex:none}#beat-nav[hidden]{display:none}#beat-nav button{min-height:28px;padding:3px 10px}#beat-count{font-size:13px;color:#a6bdcd;min-width:35px;text-align:center}
.diagram-node.unfocused{opacity:.40}.diagram-node.teaching-focus rect,.diagram-node.teaching-focus polygon{stroke:#8edbcc;stroke-width:2.5}
.world-label.unfocused{opacity:.32}.world-label.teaching-focus{border-color:#7cd7c5;background:#1a4247}
.world-leaders .unfocused{opacity:.18}.flow-label[hidden]{display:none!important}
@media(max-height:800px){.presentation-strip{min-height:29px}.presentation-strip>button{min-height:27px;padding:3px 9px}.teaching{gap:5px}.presentation-strip{font-size:13px}}

.diagram-edge.active.related{stroke:var(--amber)}.edge-label.active.related{fill:var(--amber)}.flow-label.active.related{color:#ffe0ae;border-color:var(--amber)}

#step-actions[hidden],#presentation-experiment[hidden]{display:none!important}

.diagram-node.selected.teaching-focus rect,.diagram-node.selected.teaching-focus polygon{stroke:var(--cyan);stroke-width:3.5}.world-label.teaching-focus[aria-pressed=true]{border-color:var(--cyan);background:#174947}

/* Direct concept access, without scrolling through card pages. */
.catalog-left #desk-drawer{width:min(560px,calc(100vw - 80px))}.catalog-profile{display:flex;align-items:center;gap:8px}.catalog-profile label{margin:0;font-size:13px}.catalog-profile select{flex:1;min-width:0}.catalog-profile button{padding:4px 9px;min-height:32px}.catalog-ranges{display:flex;flex-wrap:wrap;gap:5px}.catalog-ranges button{min-height:29px;padding:4px 8px;font-size:13px}.catalog-index{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:repeat(5,minmax(0,1fr));gap:7px;flex:1;min-height:0}.catalog-index button{display:flex;align-items:center;gap:10px;min-width:0;min-height:0;padding:9px;text-align:left}.catalog-index button>span{color:var(--cyan);font-size:13px;flex:none}.catalog-index strong{font-size:14px;line-height:1.25;font-weight:500}.catalog-index button[aria-current=true]{border-color:var(--cyan);background:#23504f}.audience-list{display:grid;grid-template-columns:1fr 1fr;gap:8px;flex:1;min-height:0}.audience-list label{display:flex;align-items:center;gap:8px;font-size:14px;margin:0}.audience-list input{width:17px;min-height:0;padding:0;accent-color:#79dfcc}.audience-actions{display:flex;gap:8px}.comparison-reason{grid-column:1/-1;margin:0;padding:8px 12px;border-left:3px solid var(--cyan);font-size:16px;color:#cbe5e8}.parallel-stage{grid-template-rows:auto minmax(0,1fr)}.comparison-definition{font-size:14px!important;color:#cadce4!important}.desk-rail button{min-height:48px}.desk-rail{gap:7px}#compare-target{max-width:100%;font-size:14px;min-height:36px}

.chapter-controls{display:flex;align-items:center;gap:4px;margin:auto}.chapter-controls select{max-width:290px;width:23vw;min-width:160px;border:1px solid #46616d;border-radius:7px;background:#112b3a;color:#e0edf0;padding:7px;font:inherit;font-size:12px}.chapter-controls button{padding:4px 9px;font-size:20px}.scene-toolbar{gap:9px}.catalog-index button strong{line-height:1.25}.comparison-definition{font-size:12px;line-height:1.45}
@media(max-width:1150px){.chapter-controls select{max-width:205px;min-width:130px}.scene-toolbar button{padding-inline:7px}.scene-toolbar{gap:5px}.contexts{gap:3px}}

.comparing-concepts .reveal,.comparing-concepts .presentation-strip,.comparing-concepts .navigation,.comparing-concepts .selection,.comparing-concepts .simulation-controls,.comparing-concepts .scene-toolbar>.contexts,.comparing-concepts .segmented,.comparing-concepts #chapter-controls{display:none!important}.comparing-concepts .scene-toolbar{justify-content:flex-end}.parallel-stage{gap:10px}.parallel-diagram .ontology-half h3{font-size:11px}.parallel-diagram .ontology-half p{font-size:11px}