:root{font-family:'Segoe UI',Arial,sans-serif;color:#20272f;background:#f3f3f1;font-synthesis:none;--ink:#20272f;--muted:#59626c;--line:#cbd0d5;--blue:#0865cf;--accent:#cb750e}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button{cursor:pointer;color:inherit;border:1px solid var(--line);border-radius:3px;background:white;padding:8px 12px;font-weight:600;font-size:13px;min-height:36px}button:hover{border-color:var(--blue);background:#f0f3f6}button:disabled{opacity:.4;cursor:default}button[aria-pressed=true]{color:white;background:var(--blue);border-color:var(--blue)}button:active{transform:translateY(1px)}a{color:var(--blue);text-decoration:none}a:hover{text-decoration:underline}:focus-visible{outline:3px solid #d97706;outline-offset:3px}.skip{position:fixed;top:-100px;padding:12px;background:white;z-index:100}.skip:focus{top:10px}.site-header{height:58px;background:#202832;color:#fff;display:flex;align-items:center;gap:30px;padding:0 28px}.brand{font-size:22px;font-weight:800;color:white;white-space:nowrap}.brand span{font-size:11px;font-weight:600;letter-spacing:.14em;margin-left:10px}.header-route{font-size:12px;color:#b9cada}.site-header nav{margin-left:auto;display:flex;gap:18px;align-items:center}.site-header nav a{color:#e5eef6;font-size:13px}.site-header button{color:white;background:#243f55;border-color:#486074}main{max-width:1840px;margin:auto;padding:24px 28px 16px}.intro{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.eyebrow{font-size:10px;font-weight:750;letter-spacing:.12em;color:#526d83;margin:0 0 6px}h1{font-size:32px;letter-spacing:-.03em;margin:5px 0}h2{font-size:22px;letter-spacing:-.02em;margin:0;line-height:1.25}h3{font-size:16px;margin:0 0 8px}.intro p{font-size:13px;line-height:1.6;color:var(--muted);margin:0}.chapter-nav{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));position:sticky;top:0;z-index:20;background:#fff;border:1px solid #bac7d2;box-shadow:0 3px 8px #20272f09}.chapter-nav button{border:0;border-right:1px solid #d8e0e7;border-radius:0;text-align:left;min-height:52px;padding:8px 12px;display:flex;align-items:center;gap:9px;line-height:1.3}.chapter-nav button:last-child{border-right:0}.chapter-nav button span{font-size:10px;color:#688198;font-variant-numeric:tabular-nums}.chapter-nav button[aria-current]{background:#202832;color:white;box-shadow:inset 0 -3px #ee9b31}.chapter-nav button[aria-current] span{color:#a9cbeb}.configuration{display:flex;align-items:center;gap:7px 22px;flex-wrap:wrap;padding:10px 3px;font-size:12px;color:#4b6174;font-variant-numeric:tabular-nums;border-bottom:1px solid var(--line)}.configuration b{color:var(--ink);font-weight:650}.configuration .config-label{font-size:10px;letter-spacing:.1em;font-weight:750}.chapter-head{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;align-items:start;padding:20px 0 12px}.chapter-summary>p{font-size:13px;line-height:1.6;color:#455e72;max-width:100ch;margin:0}.reading-tools{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:12px}.reading-tools span{flex:1}.reading-tools button{font-size:12px;min-height:32px;padding:6px 10px}.reading-tools button:first-child{background:#202832;color:white;border-color:#202832}.reading-tools button[aria-expanded=true]{box-shadow:inset 0 -3px #ee9b31}.work-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;align-items:start}.work-layout.reading-open{grid-template-columns:minmax(0,1fr) 350px}.visual-workspace{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:14px;align-items:start}.mechanism-panel,.image-panel{background:white;border:1px solid #bfcbd5;border-radius:4px;overflow:hidden;box-shadow:0 2px 7px #24394c07}.panel-bar{min-height:47px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 13px;background:#f8f8f7;border-bottom:1px solid var(--line);font-size:10px;letter-spacing:.055em}.panel-bar strong{font-weight:750}.tools{display:flex;gap:5px;flex-wrap:wrap;justify-content:end}.tools button{font-size:11px;padding:5px 8px;min-height:30px}.visual-stage{position:relative;background:#fff}#camera-model{height:390px;position:relative;min-width:0}#camera-model canvas{display:block;width:100%;height:100%;touch-action:none}#mechanism-svg{aspect-ratio:760/440;width:100%;display:flex;align-items:center}svg{display:block;width:100%;height:auto;overflow:visible}svg text{font-family:'Segoe UI',Arial,sans-serif;fill:#25313e;font-size:16px}svg .eyebrow{font-size:12px;letter-spacing:1px;fill:#875814;font-weight:700}svg .note{font-size:14px;fill:#4a5664}svg .small{font-size:12px;fill:#4a5664}svg .value-end{text-anchor:end;font-weight:700}svg .cfa-letter{fill:white;font-size:11px;font-weight:700}#model-tip{position:absolute;bottom:8px;left:12px;font-size:10px;color:#536e83;pointer-events:none;background:#ffffffd9;padding:4px 6px;border-radius:3px}.selection-label{position:absolute;top:12px;left:12px;background:#fff;color:#124b7b;border:2px solid #0865cf;border-radius:3px;padding:7px 11px;font-size:12px;font-weight:700;box-shadow:0 2px 12px #102b4330;max-width:75%;pointer-events:none;z-index:2}.selection-label::before{content:'●';color:#0865cf;margin-right:7px}.component-toolbar{display:flex;align-items:center;gap:8px;padding:10px 12px;border-top:1px solid var(--line);background:#f8fafb}.component-toolbar label{font-size:11px;font-weight:700;white-space:nowrap}.component-toolbar select{min-width:0;flex:1;border:1px solid #b8c7d3;background:white;border-radius:3px;color:#15394e;padding:7px 8px;font-size:12px;min-height:34px}.component-toolbar button{font-size:11px;padding:5px 7px;min-height:32px}.part-inspector{padding:13px 15px;border-top:1px solid #b4cde1;border-left:4px solid var(--blue);background:#f3f6fa}.part-inspector small{font-size:9px;color:#246295;letter-spacing:.12em;font-weight:750}.part-inspector h3{margin:4px 0 7px;font-size:15px}.part-inspector p{font-size:12px;line-height:1.65;margin:0 0 10px;color:#3c576d}.part-actions{display:flex;gap:6px;flex-wrap:wrap}.part-actions button{font-size:11px;min-height:31px;padding:5px 8px}.part-actions button:first-child{background:#0865cf;color:white;border-color:#0865cf}.term-legend{display:flex;gap:5px;flex-wrap:wrap;padding:9px 12px;border-top:1px solid var(--line);background:#fff}.term-legend:empty{display:none}.term-legend button{font-size:11px;min-height:28px;padding:4px 7px;font-weight:500;background:#f7f7f5;border-color:#dae3eb}.image-wrap{background:#0e2534;aspect-ratio:16/9}.image-wrap canvas{display:block;width:100%;height:100%}#image-state{font-size:9px;letter-spacing:.04em;color:#315f80;font-weight:700;text-align:right}.image-caption{display:flex;justify-content:space-between;gap:5px;padding:9px 12px;border-bottom:1px solid var(--line);font-size:11px;color:#5d7080;font-variant-numeric:tabular-nums}.image-caption b{color:#1a3f5a}.context-controls{padding:12px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px 18px}.control label{display:flex;justify-content:space-between;align-items:center;gap:5px;margin-bottom:7px;font-size:11px;font-weight:600}.control label button,.term-button{border:0;border-bottom:1px dotted #7192ab;border-radius:0;background:none;padding:0;min-height:20px;font-size:inherit;color:#294e6b;font-weight:inherit;text-align:left}.control output{font-variant-numeric:tabular-nums;font-size:12px;white-space:nowrap;color:#163b59;font-weight:750}.control input[type=range]{width:100%;margin:0;accent-color:#0865cf;height:19px;cursor:pointer}.control input[type=number]{width:100%;border:1px solid #b7c5d1;border-radius:3px;padding:8px;font-variant-numeric:tabular-nums}.control select{width:100%;border:1px solid #b7c5d1;background:#fff;color:var(--ink);font-size:12px;padding:7px;border-radius:3px}.context-actions{grid-column:1/-1;display:flex;gap:6px;flex-wrap:wrap}.context-actions button{font-size:11px;padding:5px 8px;min-height:30px}.overview-invite{grid-column:1/-1;display:flex;align-items:center;gap:10px;font-size:12px;line-height:1.6;color:var(--muted)}.overview-invite button{background:#202832;color:white;white-space:nowrap}.metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;margin:0 12px;border-top:1px solid var(--line)}.metric{padding:10px 9px 8px 0;min-width:0}.metric small{font-size:10px;display:block;color:#456176}.metric strong{display:block;font-size:20px;line-height:1.5;font-variant-numeric:tabular-nums;letter-spacing:-.02em}.metric p{font-size:10px;line-height:1.4;color:#526b7e;margin:0}.consequence{margin:3px 12px 12px;padding:9px 10px;background:#f3f5f7;border-left:3px solid #4180b3;font-size:12px;line-height:1.55;color:#304f67}.mode-switch{display:flex;gap:5px;padding:8px 12px;border-bottom:1px solid var(--line)}.mode-switch button{font-size:11px;min-height:30px;padding:5px 9px}.algorithm-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:9px 12px;border-bottom:1px solid var(--line)}.algorithm-strip button{text-align:left;font-size:10px;padding:6px;min-height:32px}.algorithm-strip button span{color:#7490a6;margin-right:5px}.algorithm-strip button[aria-pressed=true] span{color:#cee1f3}#pixel-playbar{padding:8px 12px;border-top:1px solid var(--line);display:flex;align-items:center;gap:6px;flex-wrap:wrap}#pixel-playbar button{font-size:11px;padding:6px 8px;min-height:31px}#pixel-phase{font-size:11px;color:#305f85;font-weight:650}.timing-strip{padding:9px 12px 0}.time-label{display:flex;justify-content:space-between;font-size:10px;color:#4d6479;margin-bottom:5px}.time-track{position:relative;height:12px;border:1px solid #aac0d3;background:#f1f5f9}.time-track span{display:block;height:100%;background:#3a78aa}.time-warning{font-size:11px;color:#9d420d;margin:5px 0}.reader{position:sticky;top:67px;background:#fff;border:1px solid #9cb3c6;border-top:3px solid #0865cf;border-radius:3px;box-shadow:0 4px 20px #22394d13;min-width:0}.reader-head{display:flex;justify-content:space-between;gap:10px;padding:15px 16px;border-bottom:1px solid var(--line);align-items:start}.reader-head small{font-size:10px;font-weight:700;color:#315e81;letter-spacing:.07em}.reader-head h2{font-size:18px;margin:5px 0 0}.reader-head button{font-size:21px;padding:0;width:30px;min-height:30px;flex-shrink:0}.reader-body{padding:16px;max-height:calc(100vh - 180px);overflow:auto;overscroll-behavior:contain;font-size:13px;line-height:1.75}.reader-body h3{font-size:14px;line-height:1.4;margin:20px 0 7px}.reader-body h3:first-child{margin-top:0}.reader-body p{margin:0 0 12px}.reader-body ul{padding-left:19px;margin:10px 0}.reader-body li{margin-bottom:10px}.reader-body a{text-decoration:underline;overflow-wrap:anywhere}.reader-body .current-value{padding:10px 12px;background:#f3f5f7;border-left:3px solid #0865cf;font-variant-numeric:tabular-nums}.reader-body .reader-index{display:grid;gap:4px;margin-bottom:20px}.reader-index button{font-size:12px;text-align:left;background:#f5f8fb;font-weight:500}.reader-body math{font-size:17px}.reader-body math[display=block]{overflow-x:auto;padding:12px 0}.reader-body .formula-note{font-size:12px}.reader-body .reading-section{scroll-margin-top:12px}.reader-body .route-button{width:100%;text-align:left;margin-top:15px}.lesson-footer{display:flex;justify-content:space-between;align-items:center;margin-top:18px;padding:12px 0;border-top:1px solid var(--line)}.lesson-footer span{font-size:11px;color:var(--muted)}#next{background:#202832;color:#fff;border-color:#202832}footer{display:flex;justify-content:space-between;gap:10px;font-size:10px;color:#627687;padding:8px 0}.figure-dialog-bar{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:12px 16px;border-bottom:1px solid var(--line)}dialog{border:1px solid #8da5b9;border-radius:4px;padding:0;width:min(1100px,94vw);max-height:94vh;color:var(--ink);background:#f8f8f7}dialog::backdrop{background:#142a40b3}#large-figure{overflow:auto;padding:12px}#large-figure svg{min-width:700px}#figure-dialog-title{font-size:15px}.webgl-note{padding:35px;line-height:1.6;font-size:13px}svg [data-term]{cursor:pointer;text-decoration:underline;text-decoration-style:dotted}svg [data-term]:focus{outline:2px solid #0865cf}
@media(min-width:1600px){#camera-model{height:440px}.work-layout.reading-open #camera-model{height:360px}}
@media(max-width:1250px){.header-route{display:none}.chapter-nav button{padding:8px;font-size:11px;gap:5px}.work-layout.reading-open{grid-template-columns:minmax(0,1fr)}.reader{position:fixed;right:16px;top:72px;bottom:18px;width:390px;max-width:calc(100vw - 32px);z-index:40;box-shadow:-10px 6px 50px #142a4040}.reader-body{max-height:calc(100% - 90px)}.chapter-head{gap:8px}#camera-model{height:360px}}
@media(max-width:760px){main{padding:15px 12px}.site-header{padding:0 12px;height:52px;gap:10px}.brand{font-size:18px}.brand span{display:none}.site-header nav{gap:10px}.site-header button{font-size:10px;min-height:31px;padding:5px 7px}.intro{margin-bottom:12px}.intro p{display:none}h1{font-size:27px}.chapter-nav{grid-template-columns:repeat(4,minmax(0,1fr));top:0}.chapter-nav button{min-height:42px;border-bottom:1px solid #d8e0e7;font-size:11px}.configuration{gap:7px 12px;font-size:10px}.configuration .config-label{display:none}.chapter-head{grid-template-columns:1fr;gap:8px;padding:16px 0 12px}.chapter-summary>p{font-size:12px}.chapter-head h2{font-size:21px}.reading-tools{gap:5px}.reading-tools span{display:none}.reading-tools button{font-size:10px;padding:5px 7px}.visual-workspace{grid-template-columns:1fr;gap:12px}#camera-model{height:310px}.panel-bar{padding:8px 10px;font-size:9px}.reader{top:12px;right:10px;bottom:12px;max-width:calc(100vw - 20px);width:440px}.reader-body{max-height:calc(100% - 88px)}.component-toolbar{flex-wrap:wrap}.component-toolbar select{flex-basis:65%}.metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.metric strong{font-size:19px}footer{font-size:9px}.lesson-footer button{font-size:11px;padding:7px 9px}.lesson-footer span{font-size:10px}.term-legend button{font-size:10px}#model-tip{font-size:9px}.selection-label{font-size:11px}svg .small{font-size:13px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
.reader{position:fixed;top:70px;bottom:20px;right:max(28px,calc((100vw - 1784px)/2));width:350px;display:flex;flex-direction:column;z-index:40}.reader-head{flex-shrink:0}.reader-body{flex:1;min-height:0;max-height:none}
@media(max-width:1250px){.reader{right:16px;top:72px;bottom:18px;width:390px}.reader-body{max-height:none}}
@media(max-width:760px){.reader{left:10px;right:10px;top:12px;bottom:12px;width:auto;max-width:none}.reader-body{max-height:none}}

/* Both teaching columns share the document scroll, including tall diagrams. */
.mechanism-panel{position:static}

/* v0.9.2: neutral instrument surfaces; colour identifies selection and signal. */
.site-header{background:#202832;border-bottom:3px solid #0865cf}.chapter-nav{border-color:#aeb5bd;box-shadow:none}.chapter-nav button{font-size:12px;font-weight:700;min-height:52px}.chapter-nav button[aria-current]{background:#202832;box-shadow:inset 0 -3px #0878f9}.chapter-nav button span{color:#67717c}.chapter-nav button[aria-current] span{color:#a2cafa}
button{border-radius:2px;border-color:#b5bec7}button:hover{background:#f0f3f6;border-color:#0865cf}.mechanism-panel,.image-panel{border-radius:2px;border-color:#b8bec5;box-shadow:0 2px 8px #11182008}.panel-bar{background:#fff;border-bottom:2px solid #303b48;min-height:48px;font-size:11px;letter-spacing:.025em}.chapter-head{padding-top:22px}.chapter-head h2{font-size:25px}.chapter-summary>p{color:#344351;font-size:16px;line-height:1.65}.eyebrow{color:#596673}.reading-tools{gap:7px;margin-bottom:14px}.reading-tools button{min-height:33px}.reading-tools button:first-child{background:#202832;border-color:#202832}
#camera-model{height:470px;background:#e5e7e8}.visual-stage{background:#fff}.selection-label{border-color:#0865cf;color:#17395a}.part-inspector{border-left-color:#0865cf;background:#f4f6f9}.part-inspector p{color:#3b4856}.context-controls{gap:16px;padding:16px}.control label{font-size:12px}.control output{font-size:13px;color:#202832}.control input[type=range]{accent-color:#0865cf}.range-row{display:flex;gap:10px;align-items:center}.range-row input[type=range]{flex:1;min-width:40px}.range-row input.exact-value{width:78px;flex:none;padding:5px 7px;font-size:12px;border-color:#aeb7c1}.context-actions button{font-size:12px}.metrics{margin:0 16px;gap:4px 16px}.metric strong{font-size:23px;font-weight:650}.metric small{font-size:12px}.metric p{font-size:11px}.consequence{background:#f4f5f6;border-left:3px solid #0865cf;color:#344251;margin:8px 16px 16px;padding:11px 12px;font-size:13px}.image-wrap{position:relative;background:#20272d}.image-ruler{position:absolute;inset:0;pointer-events:none}.image-ruler svg{height:100%}.scene-tag{position:absolute;top:10px;left:10px;background:#17222cda;color:#fff;padding:5px 8px;font-size:10px;letter-spacing:.02em}.image-caption{font-size:12px}.term-legend{background:#fafafa}.term-legend button{background:white;border-color:#c8cdd2}.reader{border-top-color:#0865cf}.reader-body{font-size:14px;line-height:1.7}.reader-body h3{font-size:15px}.reader-body .current-value{background:#f3f5f7}.reader-index button{background:#f8f8f8}
.overview-opening{padding:23px 24px 17px}.overview-opening .eyebrow{color:#0761bb}.overview-opening h3{font-size:23px;line-height:1.3;margin:9px 0 12px;letter-spacing:-.025em}.overview-opening p{font-size:14px;line-height:1.65;color:#4b5764;margin:0}.system-flow{list-style:none;margin:0;padding:0 24px}.system-flow li+li{border-top:1px solid #d7dadd}.system-flow button{display:flex;align-items:center;gap:13px;width:100%;text-align:left;padding:13px 0;border:0;background:white;border-radius:0}.flow-num{width:26px;height:26px;display:grid;place-items:center;border:1px solid #a9b4be;font-size:12px;color:#4f5c69;flex:none}.system-flow strong{font-size:14px;display:block}.system-flow small{font-size:11px;display:block;margin-top:4px;color:#5b6772;font-weight:400;line-height:1.5}.system-flow button[aria-pressed=true]{background:#fff;color:#075bba}.system-flow button[aria-pressed=true] .flow-num{background:#0865cf;border-color:#0865cf;color:#fff}.system-flow button:hover{background:#f7f8fa}.flow-arrow{margin-left:auto;padding-right:4px}.system-support{padding:18px 24px;background:#f5f5f3;border-top:1px solid #d7dadd;font-size:12px}.system-support p{margin:7px 0 0;color:#4d5965;line-height:1.6}.flow-next{display:flex;flex-wrap:wrap;gap:8px;padding:15px 24px;border-top:1px solid #d7dadd}.flow-next button{font-size:12px}.flow-next button:first-child{color:#fff;background:#0865cf;border-color:#0865cf}#pixel-explanation{width:100%;margin:5px 0 2px;color:#384957;font-size:13px;line-height:1.6}#geometry-scale{align-items:center;font-size:11px}#geometry-scale select{font-size:12px;border:1px solid #b5bec7;border-radius:2px;background:white;padding:6px}.mode-switch button{border-radius:2px}.time-track{background:#f2f3f5}.time-track span{background:#0865cf}
@media(min-width:1600px){#camera-model{height:510px}.work-layout.reading-open #camera-model{height:430px}}
@media(max-width:1250px){.chapter-nav button{font-size:11px}.overview-opening{padding:19px}.overview-opening h3{font-size:21px}.system-flow{padding:0 19px}.system-flow small{font-size:11px}#camera-model{height:430px}}
@media(max-width:760px){.chapter-head h2{font-size:22px}.chapter-summary>p{font-size:15px}.chapter-nav button{min-height:45px;font-size:10px}.chapter-nav button span{display:none}.overview-opening{padding:18px}.overview-opening h3{font-size:21px}.system-flow{padding:0 18px}.system-flow strong{font-size:13px}.system-support{padding:15px 18px}.context-controls{padding:12px;gap:13px 12px}.control label{font-size:11px}.control output{font-size:11px}.range-row{gap:6px}.range-row input.exact-value{width:61px}.metrics{margin:0 12px}.metric strong{font-size:20px}.consequence{margin:8px 12px 12px;font-size:12px}#camera-model{height:320px}#geometry-scale{flex-wrap:wrap}.scene-tag{font-size:9px}}

@media(max-width:480px){.context-controls{grid-template-columns:1fr}.range-row input[type=range]{min-width:120px}.control label,.control output{font-size:12px}}

/* v0.9.3: explanatory views next to the operation they describe. */
.stage-detail{padding:16px 18px;border-bottom:1px solid var(--line);background:#fff}.stage-detail h3{font-size:17px;color:#1b354e;margin:0 0 8px}.stage-detail p{font-size:13px;line-height:1.6;margin:0 0 7px;color:#374756}.stage-detail .stage-look{font-size:12px;border-left:3px solid #0865cf;padding-left:10px;margin-bottom:0}.experiment-control{padding:12px 16px;border-bottom:1px solid var(--line)}.experiment-control label{display:flex;justify-content:space-between;gap:10px;font-size:12px;font-weight:650}.experiment-control input{width:100%;accent-color:#0865cf;margin-top:10px}.experiment-control p{font-size:12px;line-height:1.5;margin:5px 0 0;color:#4b5968}.reading-figure{margin:16px 0 22px;padding:8px;border:1px solid #c5cdd5;background:#fff}.reading-figure-scroll{overflow-x:auto}.reading-figure svg{min-width:510px}.reading-figure figcaption{font-size:11px;line-height:1.5;margin:8px 0}.reading-figure button{font-size:12px;min-height:32px}.visual-stage:has(svg[viewBox="0 0 760 570"]) #mechanism-svg{aspect-ratio:760/570}
@media(max-width:760px){.stage-detail{padding:13px}.stage-detail h3{font-size:16px}.stage-detail p{font-size:12px}.experiment-control label{flex-wrap:wrap}}
/* Explicit hardware choice and an annotated measurement target. */
.hardware-control{padding:16px 0;border-block:1px solid var(--line,#c7cfd6);margin:20px 0}
.hardware-control label{display:flex;justify-content:space-between;gap:12px;align-items:center;font-weight:700}
.hardware-control input[type=range]{width:100%;margin:18px 0;accent-color:#0865cf}
.hardware-exact{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.hardware-exact input{width:90px;padding:9px;border:1px solid #aebbc7;font:inherit}
.hardware-summary{padding:14px;background:#f1f3f5;border-left:3px solid #0865cf}
.hardware-summary small,.hardware-summary strong{display:block}
.hardware-summary strong{font-size:1.4rem;margin-top:8px;color:#182d42}
.hardware-summary svg{display:block;width:100%;height:auto}
.image-caption{align-items:center;flex-wrap:wrap}.target-help{font-size:11px;font-weight:500;min-height:24px;padding:0 2px;border:0;border-bottom:1px dotted #7192ab;border-radius:0;background:transparent;color:#294e6b}
@media(min-width:761px){.work-layout.hardware-open{grid-template-columns:minmax(0,1fr)}.hardware-open .reader{right:auto;left:max(28px,calc((100vw - 1784px)/2));width:min(460px,calc(50vw - 42px))}}
button[aria-pressed=true]:hover{color:#fff;background:#0759b7;border-color:#0759b7}.chapter-nav button[aria-current]:hover{color:#fff;background:#202832}

.adc-status{margin:0;padding:10px 16px;border-bottom:1px solid #cbd3da;font-size:12px;color:#344657;background:#f4f6f8;line-height:1.5}.adc-status.has-clipping{color:#823600;background:#fff4e8;border-left:3px solid #bb6c11}

.detector-presets{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:14px 0}.detector-dimensions{display:grid;grid-template-columns:1fr 1fr;gap:12px}.detector-dimensions label{font-size:12px;font-weight:600}.detector-dimensions input{display:block;width:100%;min-width:0;margin-top:5px;padding:8px;border:1px solid #aebbc7}.compression-note{border-top:1px solid #cbd0d5;padding:12px 16px;font-size:12px;line-height:1.6}.compression-note p{margin:6px 0}.compression-note button{font-size:12px}

.camera-load-status{margin:16px 0;padding:18px;border:1px solid #b8c2cd;background:#fff;display:flex;gap:18px;align-items:center;flex-wrap:wrap}.camera-load-status a{font-weight:700}.camera-load-status[role=alert]{border-left:4px solid #b24e18}

/* Objective groups: one selection, its motion and the associated image control. */
.motion-workspace{background:#fff;border:1px solid #adb6c0;min-width:0}.motion-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;padding:20px;border-bottom:2px solid #293440}.motion-control{display:block;min-width:0}.motion-control>span{display:flex;justify-content:space-between;gap:10px;font-size:13px;font-weight:700}.motion-control output{font-variant-numeric:tabular-nums;color:#075cbc}.motion-control input{display:block;width:100%;margin:14px 0 7px;accent-color:#0865cf}.motion-control small{font-size:11px;color:#576371}.motion-command{padding:12px 20px;display:flex;gap:8px;align-items:center;flex-wrap:wrap;border-bottom:1px solid var(--line)}.motion-command button{font-size:12px}.motion-command button:first-child{background:#202832;color:white;border-color:#202832}.motion-command span{font-size:12px;color:#87540c}.motion-pair{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:20px 20px 0}.motion-card{min-width:0;border:1px solid #b5c0cb}.motion-card header{display:flex;justify-content:space-between;gap:10px;padding:12px;font-size:11px;border-bottom:1px solid #aeb7c0;flex-wrap:wrap}.motion-card header span{color:#476580}.motion-card canvas,.motion-frames canvas{width:100%;display:block;image-rendering:pixelated;background:#121820}.motion-card p{margin:0;padding:12px;font-size:13px;line-height:1.6;min-height:66px}.motion-timeline{padding:16px 20px;border-bottom:1px solid var(--line)}#motion-timeline-label{display:flex;gap:15px;justify-content:space-between;font-size:12px;flex-wrap:wrap}#motion-timeline-label span{color:#536170}.motion-timeline label{display:flex;justify-content:space-between;gap:12px;font-size:12px}.motion-timeline input{width:100%;accent-color:#cf8211}.motion-frames{padding:16px 20px}.motion-section-head{display:flex;align-items:baseline;gap:10px;justify-content:space-between;flex-wrap:wrap}.motion-section-head h3{font-size:15px}.motion-section-head span{font-size:11px;color:#596673}.motion-frame-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.motion-frame-row figure{margin:0;border:1px solid #c1c7ce}.motion-frame-row figcaption{padding:8px;font-size:11px;font-variant-numeric:tabular-nums}.motion-results{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0 20px;border-top:2px solid #2d3a47;border-bottom:1px solid var(--line);gap:20px;padding:15px 0}.motion-results small{font-size:12px}.motion-results strong{display:block;font-size:25px;margin-top:5px}.motion-results p{font-size:12px;margin:5px 0;color:#5b6470}.motion-context{padding:10px 20px 18px;font-size:12px;line-height:1.6}.motion-context summary{cursor:pointer;font-weight:700;padding:8px 0}.motion-extra{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;padding:15px 0}.motion-extra p{grid-column:1/-1;margin:0}.motion-method{margin-bottom:0;color:#52606c}.motion-method button{font-size:11px;border:0;color:#075fb7;background:transparent}.isp-roi{position:absolute;border:2px solid #ffad00;outline:1px solid #17222c;pointer-events:none;box-shadow:0 0 0 1px white inset}.isp-selection-tools{padding:10px 13px;display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:12px;border-bottom:1px solid var(--line)}.isp-selection-tools span{color:#526473}.isp-selection-tools button{font-size:11px;padding:4px 8px;min-height:28px}.image-wrap:has(.isp-roi:not([hidden])){cursor:crosshair}svg [data-isp-pixel]{cursor:pointer}svg [data-isp-pixel]:focus{outline:none}svg [data-isp-pixel]:focus rect:first-child{stroke:#e68400;stroke-width:3}#pixel-measurement{width:100%;border-top:1px solid var(--line);margin-top:8px;padding:8px 0}#mechanism-svg:has(svg[viewBox="0 0 760 470"]),#mechanism-svg:has(svg[viewBox="0 0 760 490"]){aspect-ratio:auto}
@media(max-width:850px){.motion-controls{gap:12px;padding:14px}.motion-pair{gap:12px;padding:14px 14px 0}.motion-card header{font-size:10px}.motion-card p{font-size:12px}.motion-results{gap:12px}.motion-results strong{font-size:21px}}
@media(max-width:600px){.motion-controls{grid-template-columns:1fr;gap:16px}.motion-pair{grid-template-columns:1fr}.motion-command{padding:12px}.motion-command button{font-size:11px}.motion-timeline{padding:14px 12px}.motion-frame-row{gap:5px}.motion-frame-row figcaption{font-size:9px;padding:6px}.motion-frames{padding:14px 12px}.motion-results{grid-template-columns:1fr;margin:0 12px;gap:12px}.motion-results>div{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:3px}.motion-results strong{font-size:21px;text-align:right;margin:0}.motion-results p{grid-column:1/-1}.motion-extra{grid-template-columns:1fr}.motion-context{padding:12px}.lens-switch{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
.lens-switch{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-bottom:1px solid var(--line);background:#fff}
.lens-switch button{border:0;border-right:1px solid var(--line);border-radius:0;text-align:left;padding:12px 10px;min-height:60px}
.lens-switch button:last-child{border-right:0}.lens-switch b{display:block;font-size:12px}.lens-switch small{display:block;font-size:10px;line-height:1.4;margin-top:4px;font-weight:400}
.lens-switch button[aria-pressed=true]{background:#202832;color:white;box-shadow:inset 0 -3px #1783dd}.lens-switch [data-lens=focus][aria-pressed=true]{box-shadow:inset 0 -3px #d78925}
.lens-status{display:flex;gap:9px 18px;flex-wrap:wrap;border-top:1px solid var(--line);padding:10px 13px;font-size:11px;background:#f7f8f9}.lens-status span{display:flex;gap:6px;align-items:center}.lens-status i{width:10px;height:10px;display:inline-block}.zoom-key{background:#166eb3}.focus-key{background:#be741c}.lens-status small{width:100%;font-size:10px;color:#5c6570}
.control.active-optical-control{box-shadow:0 0 0 2px #0865cf;outline-offset:3px;border-radius:2px;padding:6px;margin:-6px}
@media(max-width:760px){.lens-switch{grid-template-columns:repeat(2,minmax(0,1fr))}.lens-switch button{min-height:53px;padding:9px 10px;border-bottom:1px solid var(--line)}}

@media(min-width:761px){.optics-workbench #camera-model{height:360px}}

/* A selection colours its surfaces; navigation keeps the blue accent. */
.selection-label{color:#633400;border-color:#dc8507;background:#fffaf0}.selection-label::before{color:#df8708}.part-inspector{border-left-color:#dc8507}.part-inspector small{color:#945400}.lens-switch button[aria-pressed=true],.lens-switch [data-lens=focus][aria-pressed=true]{box-shadow:inset 0 -3px #ed980c}.control.active-optical-control{box-shadow:0 0 0 2px #dc8507}
.diffraction-panel{padding:14px 18px 18px;border-top:1px solid #b6c2cc;background:#fff}.diffraction-panel svg{width:100%;height:auto;display:block}.diffraction-panel .eyebrow{font-size:12px;font-weight:700;letter-spacing:1px;fill:#8b5706}.diffraction-panel .label{font-size:16px;font-weight:700;fill:#172f43}.diffraction-panel .small{font-size:12px;fill:#40566a}.diffraction-panel p{font-size:13px;line-height:1.55;margin:5px 0 10px;max-width:65ch}.diffraction-panel button{font-size:13px}
.transfer-settings{display:flex;flex-wrap:wrap;gap:12px;padding:8px 15px 14px;border-bottom:1px solid #c2ccd5}.transfer-settings label{font-size:13px;display:flex;align-items:center;gap:8px}.transfer-settings input{width:68px;padding:7px;border:1px solid #8ba0b2;border-radius:2px}.transfer-settings select{padding:7px;border:1px solid #8ba0b2;background:white;color:#182b3c}.transfer-format{grid-template-columns:repeat(3,1fr)}

/* Optical paths and shared pixel evidence. */
.ray-lesson{background:#fff}.ray-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;padding:13px 16px 0}.ray-steps button{font-size:12px;padding:10px 6px}.ray-steps [aria-pressed=true]{background:#173a62;color:#fff;border-color:#173a62}.ray-step-description{padding:0 20px;margin:12px 0;font-size:14px;line-height:1.65;min-height:66px}.ray-playbar,.ray-actions{display:flex;align-items:center;gap:12px;padding:9px 18px;border-top:1px solid #d0d6dd}.ray-playbar span,.ray-actions span{font-size:11px;color:#596779}.ray-playbar button,.ray-actions button{font-size:12px;white-space:nowrap}.ray-travel{animation:ray-travel 3.5s linear infinite}@keyframes ray-travel{to{stroke-dashoffset:-100}}.refraction-detail{margin:12px 18px 18px;border:1px solid #abb7c5;padding:12px 15px}.refraction-detail summary{font-weight:650;cursor:pointer;font-size:13px}.refraction-detail p{font-size:13px;line-height:1.65}.refraction-detail label{font-size:13px;display:block}.refraction-detail output{float:right;font-weight:650}.refraction-detail input{width:100%;accent-color:#0865cf;display:block;margin:10px 0}.refraction-detail svg{display:block;width:100%;max-width:470px;margin:auto}.isp-origin{border-top:1px solid #c1cad5;display:grid;grid-template-columns:130px 1fr;gap:18px;padding:16px 25px}.isp-origin strong{font-size:11px}.isp-origin svg{width:128px!important;min-width:0!important;display:block;margin-top:9px}.isp-origin h4{margin:0;font-size:14px}.isp-origin p{font-size:12px;line-height:1.6;margin:5px 0}.isp-origin button{font-size:12px;padding:5px 8px;margin-top:4px}.isp-sampling-note{padding:0 25px 15px;margin:0;font-size:11px;color:#5f6c7d}.isp-roi{border-color:#ff9900!important}.stage-detail [data-neutral-wb]{font-size:12px;padding:6px 9px;margin-top:5px}.reading-figure .ray-steps{display:none}.reading-figure .ray-step-description{min-height:0}.reading-figure .ray-playbar{flex-wrap:wrap}
@media(prefers-reduced-motion:reduce){.ray-travel{animation:none}}
@media(max-width:760px){.ray-steps{padding:10px 8px 0}.ray-steps button{font-size:10px;padding:8px 4px}.ray-playbar,.ray-actions{flex-wrap:wrap}.isp-origin{grid-template-columns:96px 1fr;padding:12px;gap:12px}.isp-origin svg{width:96px!important}.ray-step-description{font-size:13px;padding:0 12px}.refraction-detail{margin:10px}.isp-sampling-note{padding:0 12px 12px}}

/* Context follows the selection; optional detail stays folded. */
#mechanism-svg:has(.isp-stage-explanation),#mechanism-svg:has(.gsd-region){display:block;aspect-ratio:auto}
.isp-stage-explanation,.gsd-region{border-top:1px solid #c1cad5;padding:18px 24px;background:white}
.isp-stage-explanation small,.gsd-region header small{font-size:10px;letter-spacing:.09em;font-weight:750;color:#8a5409}
.isp-stage-explanation h3,.gsd-region h3{font-size:16px;margin:8px 0 10px}.isp-stage-explanation p,.gsd-region p,.el-study p{font-size:13px;line-height:1.65}
.isp-stage-explanation .isp-effect{border-left:3px solid #0865cf;padding-left:12px;font-variant-numeric:tabular-nums}
.isp-stage-explanation button{font-size:12px}.isp-stage-explanation details,.gsd-region details,.el-study details{border-top:1px solid #d4dae0;margin-top:14px;padding-top:12px}
.isp-stage-explanation summary,.gsd-region summary,.el-study summary{font-size:12px;font-weight:650;cursor:pointer;line-height:1.6}
.gsd-region-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px;align-items:start}.gsd-region-body svg{border:2px solid #e68b00;background:#17222c;overflow:hidden;min-width:0;width:100%;image-rendering:pixelated}
.gsd-region dl{margin:0}.gsd-region dt{font-size:11px;color:#556370;margin-top:12px}.gsd-region dt:first-child{margin-top:0}.gsd-region dd{margin:4px 0 0;font-size:18px;font-weight:700;color:#19394f}
.el-study{border-top:2px solid #293d50;padding-top:15px;margin-top:20px}.el-study h4{font-size:16px;margin:0 0 12px}.el-study code{font-family:Consolas,monospace;word-break:break-all}.el-study details a{font-size:12px}
.el-mini-flow{list-style:none;padding:0;display:flex;gap:6px;margin:12px 0;flex-wrap:wrap}.el-mini-flow li{flex:1;padding:10px 8px;min-width:75px;background:#f1f4f7;border-top:3px solid #1768b7;font-size:12px;line-height:1.5}.el-mini-flow li+li:before{content:'→ ';color:#1768b7;font-weight:750}
@media(max-width:760px){.isp-stage-explanation,.gsd-region{padding:14px}.gsd-region-body{gap:12px}.gsd-region dd{font-size:15px}.gsd-region-body p{font-size:12px}.el-mini-flow{gap:4px}.el-mini-flow li{font-size:11px}}

.frequency-spaces{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;margin:14px 0}.frequency-spaces>div{border-top:2px solid #a8bbc9;padding-top:8px;min-width:0}.frequency-spaces span,.frequency-spaces small{display:block;font-size:12px;line-height:1.6;color:#4d6172}.frequency-spaces strong{display:block;font-size:18px;margin:3px 0}.target-calculation{background:#eef5f8;padding:10px 12px;border-left:3px solid #1769a4}.target-meaning{padding-bottom:14px;margin-bottom:14px;border-bottom:1px solid #c8d3dc}.frequency-equations{margin:12px 0}.frequency-equations dt{font-weight:600;margin-top:10px}.frequency-equations dd{margin:4px 0 12px;padding:8px;background:#f1f5f8;overflow-wrap:anywhere}@media(max-width:700px){.frequency-spaces{grid-template-columns:1fr}.frequency-spaces>div{display:grid;grid-template-columns:1fr 1fr;gap:0 10px}.frequency-spaces small{grid-column:1/-1}.frequency-spaces strong{font-size:16px;margin:0}}

.reading-tools .chapter-source-link{display:inline-block;margin:0 4px;padding:4px 2px;min-height:28px;border:0;background:transparent;color:#456277;font-size:12px;font-weight:600;text-decoration:underline;text-underline-offset:3px}.chapter-source-link:hover{background:transparent;color:#0866c7}

.atlas-model-explode{display:flex;align-items:center;gap:8px;white-space:nowrap;font-size:12px;color:#405a6c}.atlas-model-explode input{width:95px;min-width:70px;accent-color:#9b702b;cursor:pointer}.panel-bar .tools{flex-wrap:wrap}@media(max-width:480px){.panel-bar:has(#explode-control:not([hidden])){flex-wrap:wrap}.panel-bar:has(#explode-control:not([hidden])) .tools{width:100%;justify-content:flex-start}.atlas-model-explode{min-height:36px;flex:1}.atlas-model-explode input{flex:1;max-width:150px}}

/* Shared inspection target outside the native-pixel analysis chapters. */
.isp-roi[data-selection-point="true"]{transform:translate(-50%,-50%);border-radius:50%;box-shadow:0 0 0 1px #fff8 inset,0 0 0 1px #17222c}
.isp-roi[data-selection-point="true"]::before,.isp-roi[data-selection-point="true"]::after{content:"";position:absolute;background:#ff9900;box-shadow:0 0 1px #17222c}
.isp-roi[data-selection-point="true"]::before{width:1px;height:24px;left:5.5px;top:-6px}
.isp-roi[data-selection-point="true"]::after{height:1px;width:24px;top:5.5px;left:-6px}
