@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@400;500;600;700&display=swap');
:root{font-family:'Noto Sans TC',system-ui,sans-serif;color:#17263b;background:#f4f7fb;font-size:16px;font-synthesis:none}*{box-sizing:border-box}body{margin:0}a{color:inherit;text-decoration:none}button{font:inherit}a:focus-visible,button:focus-visible{outline:3px solid #4386ff;outline-offset:4px}h1,h2,h3,p{margin:0}button,a{-webkit-tap-highlight-color:transparent}.skip{position:fixed;left:16px;top:-100px;background:white;padding:12px;z-index:10}.skip:focus{top:10px}.loading{padding:40px}.sidebar{position:fixed;inset:0 auto 0 0;width:292px;background:#101f34;color:#c7d4e8;overflow-y:auto;padding:34px 22px 22px;border-right:1px solid #22344f;z-index:5}.brand{display:flex;gap:14px;align-items:center;color:#fff;font-weight:600;letter-spacing:.03em}.brand-mark{display:grid;place-content:center;background:#2d69e6;border:1px solid #6595f8;width:44px;height:44px;font-size:24px;position:relative;border-radius:8px;flex-shrink:0}.brand-mark span{font-size:14px;position:absolute;top:1px;right:1px}.brand small{display:block;color:#a0b2cc;font-size:12px;letter-spacing:.12em;margin-top:5px;font-weight:400}.nav-caption{margin:38px 12px 18px;font-size:12px;letter-spacing:.1em;color:#7791b3;display:flex;justify-content:space-between}.nav-caption span{letter-spacing:0}.overview{display:flex;justify-content:space-between;padding:12px 14px;border-radius:5px;font-size:14px}.overview>span{font-size:12px;color:#b7c9e5}.active{background:#224576;color:#fff}.nav-group{margin-top:27px}.nav-group h2{font-size:12px;color:#92aacb;font-weight:500;margin:0 12px 10px;letter-spacing:.06em}.nav-group h2 span{margin-right:10px;font-family:monospace}.lesson-link{font-size:14px;line-height:1.65;display:flex;gap:12px;padding:9px 12px;border-radius:5px}.lesson-link>span:first-child{font-family:monospace;font-size:12px;color:#7793b9;margin-top:3px}.lesson-link.active>span:first-child{color:#9ec4ff}.lesson-link:hover,.overview:hover{background:#1e3655;color:white}.sidebar-foot{border-top:1px solid #2a3a50;margin-top:34px;padding-top:20px;display:flex;gap:10px;font-size:12px;color:#a2b7d4}.sidebar-foot small{display:block;margin-top:5px;color:#738bab;font-size:12px}.outline-icon{font-size:22px}.main-shell{margin-left:292px}.topbar{min-height:70px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #dde5ef;background:#fff;padding:16px 48px;font-size:14px;color:#566881;gap:20px}.top-note{font-size:12px;letter-spacing:.04em;color:#75869a}.menu{display:none}main{max-width:1280px;margin:auto;padding:48px 48px 24px}.eyebrow{color:#587294;font-size:12px;letter-spacing:.13em;margin-bottom:18px;font-weight:600}h1{font-size:clamp(2rem,3.3vw,3rem);line-height:1.4;letter-spacing:-.035em;font-weight:700}h1 span{color:#285ed0}.intro{font-size:16px;line-height:1.9;color:#5b6d84;margin-top:18px;max-width:760px}.overview-panel{margin-top:32px;background:#e8effc;border:1px solid #d5e2fa;border-radius:9px;display:grid;grid-template-columns:1fr 1.8fr;overflow:hidden}.panel-text{padding:26px 28px}.small-label{font-size:12px;font-weight:600;letter-spacing:.09em;color:#58749d}.panel-text h2{font-size:20px;line-height:1.7;margin:10px 0}.panel-text p{font-size:14px;line-height:1.9;color:#5f7493}.diagram{color:#3460ac;align-self:center;padding:12px 24px;border-left:1px solid #d0def6}.diagram svg{display:block;width:100%;height:auto}.diagram-note{text-align:center;font-size:12px;color:#6480ad;padding-bottom:10px}.framework-note{display:flex;align-items:flex-start;gap:16px;margin-top:22px;font-size:14px;line-height:1.8}.note-label{color:#315da7;border:1px solid #c8d8f2;border-radius:4px;padding:2px 9px;white-space:nowrap;font-size:12px;margin-top:2px}.framework-note p{color:#64758a}.curriculum{margin-top:44px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:28px}.section-heading h2{font-size:22px}.section-heading>span{font-size:12px;color:#75869b}.stage-section+.stage-section{margin-top:32px}.stage-heading{display:flex;align-items:center;gap:12px;margin-bottom:14px;flex-wrap:wrap}.stage-heading>span{font-family:monospace;color:#2f65c6;font-size:14px}.stage-heading h3{font-size:16px;font-weight:600}.stage-heading p{font-size:12px;color:#7a8a9e}.topic-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.topic-card{position:relative;background:white;border:1px solid #dfe6ef;border-radius:7px;padding:21px 20px;display:flex;gap:15px;min-height:170px;transition:border-color .15s,box-shadow .15s}.topic-card:hover{border-color:#6d9ae8;box-shadow:0 5px 16px #2455a10d}.card-index{font-family:monospace;font-size:14px;color:#6990c5;padding-top:3px}.topic-card h3{font-size:16px;font-weight:600;line-height:1.65}.topic-card p{font-size:14px;color:#6b7c91;line-height:1.8;margin-top:8px;padding-bottom:26px}.card-status{color:#8492a5;font-size:12px}.card-open{position:absolute;bottom:21px;right:20px;font-size:12px;color:#3c68b2}.title-row{display:flex;align-items:flex-start;gap:18px}.lesson-heading h1{font-size:clamp(1.8rem,3vw,2.5rem)}.status{font-size:12px;white-space:nowrap;color:#72849c;background:#e7edf5;padding:6px 10px;border-radius:4px;margin-top:10px}.goal-box{background:#e8effc;border-left:3px solid #3d73db;border-radius:0 7px 7px 0;padding:24px 28px;margin-top:32px}.goal-box h2{font-size:18px;margin-top:10px}.goal-box ol{display:flex;gap:28px;flex-wrap:wrap;font-size:14px;line-height:1.8;margin:16px 0 0;padding-left:20px}.goal-box li{padding-right:18px}.plan-caption{font-size:12px;color:#7185a1;margin-top:15px}.section-tabs{display:flex;gap:28px;flex-wrap:wrap;border-bottom:1px solid #dce4ee;margin-top:30px;padding:0 0 15px;font-size:14px;color:#526b90}.section-tabs a:hover{color:#2d68d6}.lesson-sections{display:grid;gap:24px;margin-top:26px}.placeholder{scroll-margin-top:24px;border:1px solid #dde5ef;border-radius:8px;background:white;overflow:hidden}.placeholder-heading{display:flex;align-items:center;gap:12px;padding:19px 24px;border-bottom:1px solid #ecf0f5}.placeholder-heading>span:first-child{font-family:monospace;color:#7692bb;font-size:14px}.placeholder h2{font-size:18px;font-weight:600}.pending{margin-left:auto;font-size:12px;color:#7a8b9f}.placeholder-body{min-height:170px;background:linear-gradient(0deg,#fafcfe,#fff);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:28px;gap:8px}.placeholder-symbol{font-size:28px;color:#a4b7d1;line-height:1.2}.placeholder-body p{font-size:14px;color:#5c708d;line-height:1.8}.placeholder-body small{font-size:12px;color:#8b99aa;line-height:1.8}.pagination{display:flex;justify-content:space-between;gap:24px;padding:24px 0;margin-top:15px}.pagination a{max-width:48%;padding:12px 0}.pagination small{display:block;font-size:12px;color:#7b8da5;margin-bottom:8px}.pagination span{font-size:14px;color:#365e9b}.next{text-align:right}footer{display:flex;justify-content:space-between;gap:16px;border-top:1px solid #dde5ef;margin-top:42px;padding:20px 0;font-size:12px;color:#8492a3}html{scroll-behavior:smooth}@media(min-width:1600px){main{padding-top:60px}}@media(max-width:1150px){.sidebar{width:260px;padding:28px 16px}.main-shell{margin-left:260px}main{padding:36px 28px 24px}.topbar{padding:18px 28px}.overview-panel{grid-template-columns:1fr}.diagram{border-left:0;border-top:1px solid #d0def6}.panel-text h2 br{display:none}.topic-grid{grid-template-columns:1fr}.topic-card{min-height:145px}}@media(max-width:760px){.sidebar{display:none;top:65px;width:min(330px,90vw);padding-top:24px;box-shadow:10px 0 30px #101f3440}.sidebar.is-open{display:block}.main-shell{margin-left:0}.topbar{padding:14px 20px;min-height:65px;position:sticky;top:0;z-index:6;gap:12px}.menu{display:block;border:1px solid #d5e0ef;background:#f6f9fd;color:#315da7;border-radius:5px;padding:7px 10px;font-size:14px;white-space:nowrap}.topbar>span{font-size:12px}.top-note{display:none}main{padding:30px 20px 18px}.intro{font-size:16px}.overview-panel{margin-top:26px}.panel-text{padding:22px}.diagram{padding:10px 14px}.framework-note{gap:12px}.section-heading{align-items:flex-start;flex-direction:column;gap:8px}.stage-heading p{width:100%;padding-left:29px;line-height:1.8}.topic-card{padding:20px 16px}.title-row{flex-direction:column;gap:6px}.status{margin-top:5px}.goal-box{padding:22px}.goal-box ol{display:block}.goal-box li+li{margin-top:8px}.section-tabs{gap:12px 22px}.placeholder-heading{padding:18px}.placeholder-body{padding:22px}.pagination{gap:16px}footer{flex-direction:column;gap:8px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
.lesson-reading{line-height:1.95}.teaching{background:#fff;border:1px solid #dde5ef;border-radius:8px;padding:28px;scroll-margin-top:85px}.teaching h2{font-size:24px;line-height:1.5;margin:10px 0 20px}.teaching h3{font-size:18px;margin:24px 0 10px}.teaching p+p{margin-top:16px}.teaching p{color:#52657e}.concept-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:24px 0}.concept-grid article{padding:18px;background:#f4f7fc;border-radius:6px}.concept-grid h3{margin:0 0 10px;color:#285ed0}.concept-grid p{font-size:14px}.optical-figure,.simulation{margin:24px 0}.optical-figure svg{display:block;width:100%;height:auto;background:#f4f7fc;border-radius:6px}figcaption,.model-caption{font-size:13px;color:#6d809a;margin-top:10px}.equation{font-size:clamp(16px,2.4vw,23px);font-family:system-ui,sans-serif;line-height:2;background:#e8effc;padding:20px;border-radius:6px;margin:18px 0;overflow-x:auto}.teaching-note{padding:20px;border-left:3px solid #3876d9;background:#f1f6ff;margin:24px 0}.teaching-note p{margin-top:10px}.experiment-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:24px}.experiment-controls label{font-size:14px}.experiment-controls output{float:right;color:#285ed0;font-weight:600}.experiment-controls input{display:block;width:100%;margin:14px 0;accent-color:#285ed0;min-height:28px}.simulation canvas{width:100%;height:auto;display:block;border-radius:6px}.sim-values{padding:12px;background:#e8effc;border-radius:6px;font-size:14px}.lesson-button{display:inline-block;border:1px solid #bad0f2;border-radius:5px;background:#edf4ff;color:#285ed0;padding:8px 14px;margin-top:18px;cursor:pointer}.reference-link{display:inline-block;color:#285ed0;margin:18px 0 0 18px;font-size:14px}.model-caption{margin-top:20px!important}@media(max-width:1000px){.concept-grid,.experiment-controls{grid-template-columns:1fr}}@media(max-width:760px){.teaching{padding:22px 18px}.teaching h2{font-size:21px}}
.bench-figure svg{max-height:650px;background:#334456}.wave-scene canvas{touch-action:none;cursor:grab;background:#080d14}.wave-scene canvas.dragging{cursor:grabbing}.wave-profile canvas{background:#101922}.film-controls{display:grid;grid-template-columns:1fr 1fr;gap:20px}.film-controls fieldset{border:1px solid #cbd9ed;border-radius:6px;padding:16px;min-width:0}.film-controls legend{font-size:15px;color:#365e9b;padding:0 6px}.film-controls label{display:block;font-size:14px}.film-controls label+label{margin-top:12px}.film-controls input{display:block;width:100%;accent-color:#285ed0;min-height:30px}.film-controls output{float:right;font-variant-numeric:tabular-nums}.live-formula{padding:20px;background:#e8effc;border-radius:6px;margin-top:22px;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}.live-formula h3{margin:0 0 12px}.live-formula div{margin:10px 0}.live-formula p{font-size:14px}.wave-scene{margin-left:-12px;margin-right:-12px}@media(max-width:760px){.film-controls{grid-template-columns:1fr}.live-formula{padding:16px}.wave-scene{margin-left:-12px;margin-right:-12px}}
.film-controls.wavelength-only{grid-template-columns:1fr}.wave-scene canvas:focus-visible{outline:3px solid #4386ff;outline-offset:4px}
.hologram-controls{grid-template-columns:repeat(3,minmax(0,1fr))}.hologram-controls .model-caption{font-size:13px}@media(max-width:1100px){.hologram-controls{grid-template-columns:1fr}}
.math-lines{font-family:'Cambria Math','STIX Two Math',Georgia,serif;font-size:clamp(17px,2vw,22px);line-height:2.25}.math-lines>div{white-space:nowrap}.math-lines sup{font-size:.72em}.result-equation{border-left:3px solid #3876d9}.derivation{margin-top:30px}.interference-views .wave-profile{margin-bottom:12px}.interference-views .wave-scene{margin-top:12px}.interference-views{max-width:880px;margin:0 auto}
.teaching,.derivation,.interference-views{min-width:0}.math-lines{max-width:100%}

.light-control{max-width:560px;margin-top:24px}.light-control label{display:block;font-size:16px}.light-control output{float:right;font-weight:600;color:#285ed0}.light-control input{width:100%;min-height:32px;accent-color:#285ed0}.light-results{background:#e8effc;padding:18px;border-radius:6px;font-size:16px}.frequency-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:24px 0;text-align:center}.frequency-strip>span{padding:16px;background:#edf4ff;border:1px solid #c8d8f2;border-radius:6px;color:#285ed0}.frequency-strip>span:nth-child(2){background:#f1f3f7;color:#52657e}.frequency-strip small{display:block;font-size:14px;color:#52657e}.lesson-reading figure{margin-left:0;margin-right:0}.lesson-reading .equation{font-size:clamp(16px,1.8vw,21px)}@media(max-width:560px){.frequency-strip{grid-template-columns:1fr}.light-control output{float:none;margin-left:12px}}
.spatial-lesson .sf-domain-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:24px 0}.spatial-lesson .sf-domain-pair article{background:#f4f7fc;border-left:3px solid #285ed0;padding:20px}.spatial-lesson .sf-domain-pair h3{margin:0 0 12px}.spatial-lesson .sf-table-wrap{overflow-x:auto;margin:24px 0}.spatial-lesson .sf-table{width:100%;border-collapse:collapse;font-size:16px;text-align:left}.spatial-lesson .sf-table caption{text-align:left;font-size:14px;color:#52657e;margin-bottom:12px}.spatial-lesson .sf-table th,.spatial-lesson .sf-table td{padding:14px;border-bottom:1px solid #dde5ef;min-width:150px}.spatial-lesson .sf-table th{background:#e8effc}.spatial-lesson .sf-direction-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:24px 0}.spatial-lesson .sf-direction-cards figure{margin:0;padding:16px;background:#f4f7fc;border-radius:6px;min-width:0}.spatial-lesson .sf-direction-cards h3{margin:0;font-size:16px}.spatial-lesson .sf-direction-cards svg{display:block;width:100%;height:auto}.spatial-lesson figcaption{font-size:14px;line-height:1.8}.spatial-lesson .sf-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:26px}.spatial-lesson .sf-controls label{display:block;font-size:16px}.spatial-lesson .sf-controls output{display:block;color:#285ed0;font-weight:600;font-variant-numeric:tabular-nums}.spatial-lesson .sf-controls input{width:100%;min-height:40px;accent-color:#285ed0;margin:8px 0}.spatial-lesson input:focus-visible{outline:3px solid #4386ff;outline-offset:4px}.spatial-lesson .sf-preset-row{display:flex;flex-wrap:wrap;gap:10px;margin:4px 0 26px}.spatial-lesson .sf-preset-row .lesson-button{margin:0;font-size:14px;min-height:44px}.spatial-lesson .sf-views{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.spatial-lesson .sf-views figure{margin:0;min-width:0}.spatial-lesson .sf-views h3{font-size:17px;margin:0 0 14px}.spatial-lesson .sf-views canvas{width:100%;height:auto;display:block;background:#f4f7fc;border:1px solid #dde5ef;border-radius:6px}.spatial-lesson .sf-readouts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;background:#e8effc;padding:20px;border-radius:6px;margin:24px 0 16px}.spatial-lesson .sf-readouts span,.spatial-lesson .sf-readouts small{display:block;font-size:14px;color:#52657e}.spatial-lesson .sf-readouts strong{font-size:24px;color:#285ed0;font-variant-numeric:tabular-nums}.spatial-lesson .sf-summary{font-size:16px;overflow-wrap:anywhere}.spatial-lesson .sf-scale{border-top:1px solid #dde5ef;margin-top:24px;padding-top:20px}.spatial-lesson .sf-scale label{display:block;font-size:16px}.spatial-lesson .sf-scale input{display:block;width:min(100%,220px);font:inherit;padding:10px 12px;border:1px solid #94a9c6;border-radius:5px;margin:12px 0;background:#fff;color:#17263b}.spatial-lesson .model-caption{font-size:14px;line-height:1.85}.spatial-lesson .teaching-note p{margin-top:0}.spatial-lesson .teaching-note strong+p{margin-top:10px}@media(max-width:1100px){.spatial-lesson .sf-direction-cards{grid-template-columns:1fr}.spatial-lesson .sf-direction-cards svg{max-width:320px;margin:auto}.spatial-lesson .sf-controls{grid-template-columns:1fr}.spatial-lesson .sf-controls output{display:inline;margin-left:12px}}@media(max-width:760px){.spatial-lesson .sf-domain-pair,.spatial-lesson .sf-views{grid-template-columns:1fr}.spatial-lesson .sf-readouts{grid-template-columns:1fr;gap:12px}.spatial-lesson .sf-readouts>div{border-bottom:1px solid #cad8ed;padding-bottom:12px}.spatial-lesson .sf-readouts>div:last-child{border:0;padding-bottom:0}.spatial-lesson .sf-readouts strong{font-size:22px}}

.fft-lesson{background:#fff;border:1px solid #dde5ef;border-radius:8px;padding:28px;margin-top:26px;scroll-margin-top:80px;line-height:1.9}.fft-lesson h2{font-size:22px;margin-bottom:20px}.fft-lesson h3{font-size:18px;margin:28px 0 12px}.fft-lesson p{margin:12px 0}.fft-formula{padding:18px;background:#edf3fe;font-family:monospace;font-size:16px;overflow-wrap:anywhere}.fft-note{border-left:3px solid #3d73db;padding:12px 18px;background:#edf3fe}.fft-video{border:1px solid #d5e2fa;padding:16px;margin-top:22px}.fft-video summary{cursor:pointer;color:#285ed0}.fft-video iframe{border:0;width:100%;aspect-ratio:16/9;display:block;margin:16px 0}.fft-video a{color:#285ed0;text-decoration:underline}.fft-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:22px 0}.fft-controls label{display:block}.fft-controls select,.fft-controls input[type=range]{display:block;width:100%;font:inherit}.fft-controls select{padding:8px}.fft-panels{display:grid;grid-template-columns:1fr 1fr;gap:20px}.fft-panels figure{margin:0;min-width:0}.fft-panels canvas{display:block;width:100%;image-rendering:pixelated;background:#000;aspect-ratio:1}.fft-panels figcaption{font-size:14px;margin-top:8px}input:focus-visible,select:focus-visible,summary:focus-visible,canvas:focus-visible{outline:3px solid #4386ff;outline-offset:4px}@media(max-width:600px){.fft-lesson{padding:20px}.fft-controls,.fft-panels{grid-template-columns:1fr}}
.fft-shift-comparison{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:24px 0}.fft-shift-comparison figure{margin:0;min-width:0}.fft-shift-comparison img{width:100%;height:auto;display:block;border:1px solid #dde5ef}.fft-shift-comparison figcaption{font-size:14px;line-height:1.8;margin-top:12px}.fft-shift-comparison strong{display:block;margin-bottom:6px}.fft-frequency-editor{margin:24px 0;padding:20px;border:1px solid #c8d8f2;border-radius:8px;background:#f6f9ff}.fft-frequency-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}.fft-frequency-heading h3{margin:0}.fft-frequency-editor button{padding:9px 14px;border:1px solid #3768be;border-radius:5px;background:white;color:#285ed0;cursor:pointer;font-size:14px}.fft-frequency-editor button:disabled{cursor:default;color:#75869b;border-color:#c5d0df}.fft-frequency-editor.is-inactive{border-style:dashed}.fft-component{padding:16px;margin:18px 0;border:1px solid #d5e0ef;border-radius:6px;min-width:0;background:white}.fft-component legend{padding:0 8px;font-weight:600}.fft-component-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-bottom:14px}.fft-component label{display:block;font-size:14px}.fft-component output{float:right;color:#526b90}.fft-component input{display:block;width:100%;margin-top:12px;accent-color:#285ed0}.fft-component button{border-color:#c5d0df;color:#566881}input:disabled{opacity:.4}@media(max-width:1100px){.fft-shift-comparison{grid-template-columns:1fr}.fft-shift-comparison figure{max-width:580px;width:100%;margin:auto}}@media(max-width:600px){.fft-component-controls{grid-template-columns:1fr}.fft-frequency-editor{padding:14px}}
.fft-lesson h4{font-size:17px;margin:26px 0 12px}.fft-index-table{width:100%;border-collapse:collapse;margin:22px 0;font-size:14px}.fft-index-table caption{text-align:left;font-weight:600;margin-bottom:10px}.fft-index-table th,.fft-index-table td{border:1px solid #d5e0ef;padding:10px;text-align:left;overflow-wrap:anywhere}.fft-index-table th{background:#edf3fe}.fft-workspace{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:start;margin:24px 0}.fft-parameters{min-width:0;grid-column:1;grid-row:1}.fft-parameters .fft-controls{margin-top:0;grid-template-columns:1fr}.fft-parameters .fft-frequency-editor{margin-bottom:0;padding:16px}.fft-parameters .fft-component-controls{grid-template-columns:1fr}.fft-live-results{position:sticky;top:24px;grid-column:2;grid-row:1;min-width:0;background:#fff;border:1px solid #d5e0ef;border-radius:8px;padding:14px;box-shadow:0 4px 16px #1737660d;max-height:calc(100vh - 48px);overflow:auto}.fft-live-results .fft-panels{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.fft-live-results #fft-readout{font-size:14px;line-height:1.7;max-height:5.1em;overflow:auto}.fft-live-results #fft-coordinate{font-size:14px;line-height:1.7}.fft-live-results figcaption{font-size:14px;line-height:1.6}@media(max-width:1100px){.fft-workspace{display:flex;flex-direction:column;gap:20px}.fft-live-results{order:-1;top:24px;width:100%;z-index:2;max-height:45vh;padding:10px;flex:none}.fft-live-results .fft-panels canvas{width:100%;max-height:19vh;object-fit:contain}.fft-live-results .fft-panels{gap:10px}.fft-live-results #fft-readout{max-height:3.4em;margin:8px 0}.fft-live-results #fft-coordinate{margin:8px 0}.fft-parameters{width:100%}.fft-index-table th,.fft-index-table td{padding:7px}.fft-live-results figcaption{font-size:14px}}

@media(max-width:760px){.fft-live-results{top:76px}}
.fft-dft-explanation{border-top:1px solid #dce5f1;margin-top:28px;padding-top:8px}.fft-dft-figure{margin:24px 0}.fft-dft-figure img{width:100%;height:auto;display:block;border:1px solid #dce5f1;border-radius:6px}.fft-dft-figure figcaption{font-size:14px;line-height:1.8;color:#526b90;margin-top:12px}.fft-table-scroll{max-width:100%;overflow-x:auto}.fft-table-scroll table{min-width:540px}.fft-table-scroll:focus-visible{outline:3px solid #4386ff;outline-offset:3px}
.fft-figure-guide{margin:20px 0;padding:18px 22px;border-left:3px solid #3d73db;background:#f5f8ff;border-radius:0 6px 6px 0}.fft-figure-guide h4:first-child{margin-top:0}@media(max-width:600px){.fft-figure-guide{padding:16px}}
.dft-multiply-demo{margin:26px 0;padding:20px;border:1px solid #c8d8f2;border-radius:8px;background:#f7faff}.dft-multiply-demo h4{margin-top:0}.dft-plot-legend{display:flex;gap:10px 22px;flex-wrap:wrap;font-size:14px;margin:16px 0}.dft-legend-input{color:#245cc5}.dft-legend-test{color:#b42e3b}.dft-legend-product{color:#946000}.dft-point-control{display:block;font-size:14px;max-width:450px}.dft-point-control input{display:block;width:100%;margin-top:12px;accent-color:#245cc5}.dft-multiply-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:22px 0}.dft-multiply-group{min-width:0;background:white;border:1px solid #d5e0ef;border-radius:7px;padding:14px}.dft-group-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.dft-group-heading h5{font-size:16px;margin:0}.dft-group-heading label{font-size:14px}.dft-group-heading select{font:inherit;padding:6px 10px;border:1px solid #b9cce7;border-radius:4px;background:white;margin-left:6px}.dft-k-frequency{font-size:14px;color:#526b90}.dft-multiply-group figure{margin:20px 0}.dft-multiply-group figcaption{font-size:14px;font-weight:600;line-height:1.8}.dft-chart svg{display:block;width:100%;height:auto;cursor:crosshair}.dft-chart svg:focus-visible{outline:3px solid #4386ff;outline-offset:2px}.dft-point-equation{font-size:14px;color:#52647a}.dft-multiply-group .dft-sum{font-size:16px;font-weight:600;background:#fff4df;padding:8px 12px}.dft-coefficient{font-size:16px;font-weight:600;background:#edf3fe;padding:12px;overflow-wrap:anywhere}@media(max-width:1150px){.dft-multiply-groups{grid-template-columns:1fr}}@media(max-width:600px){.dft-multiply-demo{padding:14px}.dft-multiply-group{padding:10px}}
.fft-subheading{font-size:16px;margin:22px 0 12px}.fft-rotation-figure{max-width:680px;margin:24px auto}.dft-multiply-groups{grid-template-columns:1fr}.dft-multiply-group{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:20px}.dft-group-heading,.dft-k-frequency,.dft-coefficient{grid-column:1/-1}@media(max-width:850px){.dft-multiply-group{grid-template-columns:1fr}}
.fft-concepts{margin:24px 0}.fft-alias-demo{margin:24px 0;padding:20px;background:#f7faff;border:1px solid #c8d8f2;border-radius:8px}.fft-alias-demo .fft-subheading{margin-top:0}.fft-alias-controls{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:18px 0}.fft-alias-controls label{font-size:16px}.fft-alias-controls select{font:inherit;padding:6px 10px;margin-left:6px;border:1px solid #b9cce7;border-radius:4px;background:white}.fft-alias-controls button{padding:8px 12px;background:white;color:#245cc5;border:1px solid #b9cce7;border-radius:4px;cursor:pointer}.fft-alias-blue{color:#245cc5}.fft-alias-orange{color:#a85c00}.fft-alias-demo .dft-chart{max-width:640px;margin:20px auto}.fft-alias-verdict{background:#edf3fe;padding:12px;font-weight:600}.fft-alias-point{font-size:16px;margin:12px 0!important}.fft-alias-table{min-width:440px}.fft-alias-table .is-selected td,.fft-alias-table .is-selected th{background:#fff4df}@media(max-width:600px){.fft-alias-demo{padding:14px}.fft-alias-controls{gap:12px}}

.fft-extra{margin:22px 0;border-top:1px solid #d5e0ef;padding-top:16px}.fft-extra>summary{cursor:pointer;color:#285ed0;font-size:16px;font-weight:600;padding:8px 0}.fft-extra[open]>summary{margin-bottom:16px}.fft-lesson ul{padding-left:24px}.fft-lesson li{margin:8px 0}
.fft-intro-list{padding-left:28px}.fft-intro-list>li{padding-left:6px;margin:24px 0}.fft-intro-list h3{margin:0 0 10px}.fft-intro-list>li::marker{font-weight:600;color:#285ed0}

/* Lesson 05 follows the FFT lesson's reading and experiment layout. */
.ifft-pipeline{margin:24px 0}.ifft-pipeline svg{display:block;width:100%;height:auto}.ifft-workspace{display:grid;grid-template-columns:minmax(200px,.75fr) minmax(0,1.6fr);gap:24px;margin:24px 0;align-items:start}.ifft-controls{grid-template-columns:1fr;margin:0}.ifft-controls small{display:block;font-size:13px;color:#52657e;line-height:1.7}.ifft-controls output{font-weight:600;color:#285ed0}.ifft-controls input[type=range]{accent-color:#285ed0;min-height:32px}.ifft-manual{border:1px solid #c8d8f2;padding:14px;border-radius:6px;min-width:0}.ifft-manual legend{padding:0 6px;font-size:14px}.ifft-manual input{width:100%;padding:8px;border:1px solid #b9cce7;border-radius:4px;font:inherit}.ifft-manual label+label{margin-top:12px}.ifft-manual p{font-size:13px}.ifft-manual:disabled{opacity:.55}.ifft-results{position:sticky;top:24px;min-width:0;border:1px solid #d5e0ef;border-radius:8px;padding:16px;background:white}.ifft-panels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.ifft-panels figure{margin:0;min-width:0}.ifft-panels canvas{display:block;width:100%;height:auto;image-rendering:pixelated;background:#000}.ifft-panels figcaption{font-size:13px;line-height:1.7}.ifft-panels strong{display:block;color:#17263b}.ifft-readout{font-size:14px;font-variant-numeric:tabular-nums;overflow-wrap:anywhere;background:#edf3fe;padding:12px}.ifft-results .fft-note{font-size:14px}@media(max-width:1100px){.ifft-workspace{grid-template-columns:1fr}.ifft-results{position:static}.ifft-controls{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.ifft-controls{grid-template-columns:1fr}.ifft-panels{grid-template-columns:1fr}.ifft-panels canvas{max-width:280px;margin:auto}.ifft-results{padding:12px}.ifft-pipeline{overflow-x:auto}.ifft-pipeline svg{min-width:600px}}

.ifft-sum-demo{padding:20px;border:1px solid #c8d8f2;border-radius:8px;background:#f7faff;margin:26px 0}.ifft-sum-demo h4{margin-top:0}.ifft-sum-controls{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:20px 0}.ifft-sum-controls fieldset{min-width:0;border:1px solid #c8d8f2;padding:14px;background:white;border-radius:6px}.ifft-sum-controls legend{padding:0 6px;font-size:14px}.ifft-sum-controls label{display:block;font-size:14px;margin:10px 0}.ifft-sum-controls input[type=range]{display:block;width:100%;min-height:32px;accent-color:#285ed0}.ifft-sum-controls input[type=checkbox]{accent-color:#285ed0;margin-right:8px}.ifft-sum-controls output{font-weight:600;color:#285ed0}.ifft-sum-charts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.ifft-sum-charts figure{margin:0;min-width:0;background:white;padding:12px;border:1px solid #d5e0ef;border-radius:6px}.ifft-sum-charts figcaption{font-size:13px;line-height:1.8}.ifft-sum-gray{color:#68788f}.ifft-sum-blue{color:#245cc5}.ifft-sum-orange{color:#a85c00}.ifft-sum-purple{color:#763ab3}.ifft-sum-table tr.is-selected>*{background:#fff4df}.ifft-sum-table{min-width:580px}#phase .fft-intro-list h4{margin-top:0}#filtering .fft-extra{background:#f7faff;border:1px solid #d5e0ef;border-radius:6px;padding:16px}@media(max-width:1000px){.ifft-sum-charts{grid-template-columns:1fr}}@media(max-width:600px){.ifft-sum-controls,.ifft-sum-demo{padding:14px}.ifft-sum-charts figure{padding:8px}}

.ifft-sum-readout{margin-top:24px}.ifft-sum-table{min-width:700px}

.ifft-phase-shift{margin:24px 0;overflow-x:auto}.ifft-phase-row{display:grid;grid-template-columns:100px repeat(8,minmax(42px,1fr));gap:4px;min-width:490px;margin:6px 0;align-items:center}.ifft-phase-row>span,.ifft-phase-row>strong{padding:12px 4px;text-align:center;font-size:14px;border-radius:4px}.ifft-phase-index{color:#52657e}.ifft-phase-row>strong{text-align:left}.ifft-level-2{background:#fff;color:#17263b;border:1px solid #b9cce7}.ifft-level-1{background:#a0a9b6;color:#17263b;border:1px solid #a0a9b6}.ifft-level-0{background:#17263b;color:#fff;border:1px solid #17263b}.ifft-phase-shift figcaption{line-height:1.8}

/* Keep lesson 05 synthesis settings immediately beside the plotted results. */
.ifft-sum-workspace{border:1px solid #c8d8f2;border-radius:8px;background:white;margin-top:24px;padding:14px;min-width:0}.ifft-sum-workspace .ifft-sum-controls{position:sticky;top:16px;z-index:3;background:#f7faff;border:1px solid #d5e0ef;border-radius:6px;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;margin:0;padding:12px}.ifft-sum-workspace .ifft-sum-controls fieldset{padding:8px 10px}.ifft-sum-workspace .ifft-sum-controls label{margin:6px 0;font-size:13px;line-height:1.6}.ifft-sum-workspace .ifft-sum-controls input[type=range]{min-height:26px;margin:2px 0}.ifft-sum-workspace .lesson-button{margin:4px 0 0;padding:6px 12px;font-size:13px}.ifft-sum-plots{min-width:0}.ifft-sum-plots .dft-plot-legend{margin:12px 0;font-size:12px;gap:4px 16px}.ifft-sum-plots .ifft-sum-charts{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.ifft-sum-plots .ifft-sum-charts figure{padding:8px}.ifft-sum-plots figcaption{font-size:12px;line-height:1.65}@media(max-width:760px){.ifft-sum-workspace{padding:8px}.ifft-sum-workspace .ifft-sum-controls{top:72px;grid-template-columns:1fr;padding:8px;gap:6px}.ifft-sum-workspace .ifft-sum-controls fieldset{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:6px}.ifft-sum-workspace .ifft-sum-controls fieldset label{display:flex;align-items:flex-start;gap:4px;font-size:12px;line-height:1.5;margin:2px 0;overflow-wrap:anywhere}.ifft-sum-workspace .ifft-sum-controls input[type=checkbox]{margin:3px 0 0;flex-shrink:0}.ifft-sum-sliders{display:grid;grid-template-columns:1fr 1fr;gap:0 12px;align-items:start}.ifft-sum-sliders .lesson-button{grid-column:1/-1;justify-self:start}.ifft-sum-plots .ifft-sum-charts{grid-template-columns:1fr}.ifft-sum-plots .dft-chart{max-width:530px;margin:auto}}
/* Lesson 06: optical setup and sampling */
.optical-lesson .section-tabs{gap:12px 24px}.os-section{background:#fff;border:1px solid #dde5ef;border-radius:9px;overflow:hidden;scroll-margin-top:85px}.os-heading{display:flex;gap:14px;align-items:center;padding:22px 28px;border-bottom:1px solid #e7edf5}.os-heading>span{font:14px monospace;color:#6687b5}.os-heading h2{font-size:21px}.os-prose{padding:24px 28px;color:#415572;line-height:1.95}.os-prose p+p{margin-top:14px}.os-prose strong{color:#193964}.os-formula{padding:17px 20px;background:#eef4ff;border-left:3px solid #3974d6;margin:18px 0;font-size:18px;color:#193964;overflow-x:auto}.os-lab{padding:24px 28px;background:#f9fbff;border-top:1px solid #e7edf5}.os-lab-label{display:block;font-size:12px;color:#647e9f;margin-bottom:18px;letter-spacing:.04em}.os-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 28px;margin:20px 0}.os-control{display:block;font-size:14px;min-width:0}.os-control>span{display:flex;justify-content:space-between;gap:10px;color:#415572}.os-control output{color:#245fbd;font-variant-numeric:tabular-nums;white-space:nowrap}.os-control input{width:100%;margin:14px 0 0;accent-color:#2c67cf;cursor:pointer;min-height:26px}.os-control input:focus-visible{outline:3px solid #4386ff;outline-offset:3px}.os-lab canvas{display:block;width:100%;height:auto;border:1px solid #dce6f3;border-radius:6px;margin:16px 0;background:#f7faff}.os-result{background:#e9f1ff;border-left:3px solid #3c74d4;padding:14px 18px;line-height:1.85;font-size:14px;color:#254b7e;overflow-wrap:anywhere}.os-note{font-size:13px;line-height:1.9;color:#697d97;margin-top:14px}.os-buttons{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0}.os-buttons button{border:1px solid #c9d8ed;border-radius:5px;padding:9px 16px;color:#305b96;background:white;cursor:pointer;font-size:14px}.os-buttons button:hover{background:#edf4ff}.os-buttons button[aria-pressed=true]{background:#285fc0;border-color:#285fc0;color:#fff}@media(max-width:760px){.os-heading,.os-prose,.os-lab{padding:20px 16px}.os-heading h2{font-size:19px}.os-controls{grid-template-columns:1fr;gap:14px}.os-formula{font-size:16px;padding:14px}.os-control>span{font-size:14px}.os-result{padding:12px}.os-section{scroll-margin-top:82px}}
/* Parameter/result consoles: keep controls visible while inspecting each figure. */
.optical-lesson .os-section{overflow:visible}.os-lab{border-radius:0 0 9px 9px}.os-console{display:grid;grid-template-columns:minmax(210px,260px) minmax(0,1fr);gap:24px;align-items:start}.os-parameters{position:sticky;top:24px;background:#f0f5fe;border:1px solid #d5e2f5;border-radius:7px;padding:16px;z-index:2}.os-parameters h3,.os-results h3{font-size:14px;color:#34567e;margin-bottom:12px}.os-parameters .os-controls{grid-template-columns:1fr;gap:14px;margin:12px 0 0}.os-parameters .os-control>span{flex-wrap:wrap;gap:3px 8px}.os-parameters .os-control input{margin-top:5px;min-height:24px}.os-parameters .os-buttons{gap:7px;margin:10px 0}.os-parameters .os-buttons button{padding:7px 10px;font-size:13px}.os-results{min-width:0}.os-results canvas{max-height:200px;object-fit:contain;margin:10px 0}.os-results #os-path{max-height:135px}.os-results #os-beam-angle{max-height:95px}.os-results #os-fringes{max-height:105px}.os-readings{display:grid;gap:8px}.os-readings .os-result{font-size:13px;padding:10px 12px;line-height:1.75}.os-model-notes{border-top:1px solid #e1e9f5;margin-top:16px;padding-top:2px}@media(max-width:1000px) and (min-width:761px){.os-console{grid-template-columns:minmax(180px,210px) minmax(0,1fr);gap:14px}.os-lab{padding:20px 16px}}@media(max-width:760px){.os-console{grid-template-columns:minmax(0,1fr);gap:16px}.os-parameters{top:76px;padding:12px;box-shadow:0 4px 12px #1939640c}.os-parameters h3{margin-bottom:7px}.os-parameters .os-controls{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px 12px;margin-top:6px}.os-parameters .os-control>span{font-size:12px;display:block;line-height:1.6}.os-parameters .os-control output{display:block;font-size:12px}.os-parameters .os-control input{margin:2px 0 0;min-height:22px}.os-parameters .os-buttons{margin:6px 0;gap:6px}.os-parameters .os-buttons button{padding:6px 8px;font-size:12px}.os-results h3{margin-bottom:8px}.os-readings .os-result{font-size:12px;padding:8px 10px}.os-results canvas{max-height:160px}.os-results #os-path{max-height:100px}.os-results #os-beam-angle{max-height:65px}.os-results #os-fringes{max-height:70px}}
.os-watch{font-size:13px;line-height:1.8;color:#385d85;padding:10px 12px;background:#f0f6ff;border:1px solid #dce8fa;border-radius:5px;margin-top:10px}.os-parameters [data-sampling-preset],.os-parameters [data-resolution-preset]{text-align:left}.os-results #os-samples,.os-results #os-resolution{max-height:240px}@media(max-width:1100px){.optical-page .sidebar{display:none;top:65px;width:min(330px,90vw);box-shadow:10px 0 30px #101f3440}.optical-page .sidebar.is-open{display:block}.optical-page .main-shell{margin-left:0}.optical-page .topbar{position:sticky;top:0;z-index:6;min-height:65px;padding:14px 20px}.optical-page .menu{display:block;border:1px solid #d5e0ef;background:#f6f9fd;color:#315da7;border-radius:5px;padding:7px 10px;font-size:14px}.os-parameters{top:80px}}@media(max-width:760px){.os-watch{font-size:12px;line-height:1.75;padding:8px 10px}.os-results #os-samples,.os-results #os-resolution{max-height:180px}}
/* Lesson 07: parameters and FFT results share the same console. */
.rc-section{scroll-margin-top:80px}.rc-flow{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:30px;padding:0;list-style:none;margin:28px 0;counter-reset:rc-step}.rc-flow li{position:relative;background:#edf3fc;border:1px solid #c7d9f3;border-radius:10px;padding:16px 12px;min-width:0;counter-increment:rc-step}.rc-flow li::before{content:counter(rc-step,decimal-leading-zero);display:block;color:#4675b5;font-size:12px;font-weight:700;margin-bottom:8px}.rc-flow li:not(:last-child)::after{content:"→";position:absolute;left:100%;top:50%;width:30px;text-align:center;transform:translateY(-50%);color:#3769b3;font-size:24px}.rc-flow strong{font-size:17px}.rc-flow span{display:block;font-size:12px;line-height:1.8;margin-top:8px;overflow-wrap:anywhere}.rc-flow li:last-child{background:#e7f5ef;border-color:#b7daca}@media(max-width:900px){.rc-flow{grid-template-columns:1fr;gap:30px;max-width:520px;margin:28px auto}.rc-flow li{padding:14px 18px}.rc-flow li:not(:last-child)::after{content:"↓";left:50%;top:100%;height:30px;line-height:30px;transform:translateX(-50%)}}.rc-console{display:grid;grid-template-columns:220px minmax(0,1fr);gap:18px;margin:20px 0;align-items:start}.rc-controls{position:sticky;top:18px;background:#edf3fb;padding:18px;border-radius:8px;display:grid;gap:14px}.rc-controls h3{margin:0}.rc-controls label{font-size:13px;display:grid;gap:6px}.rc-controls output{color:#315da7;font-family:monospace}.rc-controls input[type=range],.rc-controls select{width:100%;min-width:0}.rc-controls select{padding:8px;background:white;border:1px solid #b9cce5;border-radius:4px;font:inherit}.rc-controls .rc-check{display:flex;gap:8px;align-items:center}.rc-controls input[type=checkbox]{width:18px;height:18px}.rc-controls button,#rc-quiz button{background:white;border:1px solid #aebfdb;border-radius:5px;padding:9px 10px;color:#244f99;font:inherit;font-size:13px;cursor:pointer}.rc-presets{display:grid;gap:6px}.rc-controls p{font-size:12px;line-height:1.65!important}.rc-images{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.rc-images figure{margin:0;border:2px solid #dfe6ef;border-radius:6px;padding:7px;background:#fafcfe;min-width:0}.rc-images .rc-current{border-color:#2f6fe2;background:#edf4ff}.rc-images figcaption{font-size:12px;font-weight:600;margin-bottom:7px}.rc-images canvas{width:100%;height:auto;display:block;image-rendering:pixelated}.rc-images small{display:block;font-size:10px;line-height:1.5;color:#64758c;margin-top:5px}.rc-results{min-width:0}.rc-watch{background:#eaf1fc;border-left:3px solid #3d73db;padding:12px;font-size:13px!important;margin-top:12px!important}.rc-results #rc-metrics,.rc-model{font-size:12px!important;color:#60718a;line-height:1.8!important}.rc-colorbar{display:flex;gap:8px;align-items:center;font-size:11px!important;margin-top:10px!important}.rc-colorbar span{display:block;flex:0 0 100px;height:12px;background:linear-gradient(to right,#e60000,#e6e600,#00e600,#00e6e6,#0000e6,#e600e6,#e60000)}#rc-quiz fieldset{border:1px solid #d6e1ef;margin:18px 0;padding:18px}#rc-quiz legend{font-weight:600;font-size:14px}#rc-quiz label{display:block;margin:10px 0;font-size:14px}#rc-quiz p{font-size:13px;color:#315da7}#rc-quiz button+button{margin-left:10px}input:focus-visible,select:focus-visible{outline:3px solid #4386ff;outline-offset:3px}
@media(max-width:1100px){.reconstruction-page .sidebar{display:none;top:65px;width:min(330px,90vw)}.reconstruction-page .sidebar.is-open{display:block}.reconstruction-page .main-shell{margin-left:0}.reconstruction-page .menu{display:block}.rc-console{grid-template-columns:200px minmax(0,1fr)}}
@media(max-width:760px){.rc-console{grid-template-columns:1fr}.rc-controls{position:static;padding:12px;grid-template-columns:1fr 1fr;gap:10px}.rc-controls h3,.rc-presets,.rc-controls p{grid-column:1/-1}.rc-presets{grid-template-columns:repeat(3,minmax(0,1fr))}.rc-presets button{font-size:11px;padding:7px 4px}.rc-controls #rc-next{grid-column:1/-1}.rc-images{gap:6px}.rc-images figure{padding:4px}.rc-images figcaption{font-size:10px}.rc-images small{font-size:9px}.rc-colorbar{flex-wrap:wrap}.rc-section{padding:18px!important}.rc-controls select{font-size:11px}}
/* Lesson 08: propagation on a shared spatial grid. */
.pg-section{scroll-margin-top:80px}.pg-geometry{margin:24px 0}.pg-geometry svg{display:block;width:100%;height:auto;background:#f0f5fc;border-radius:6px}.pg-console{display:grid;grid-template-columns:230px minmax(0,1fr);gap:18px;margin:20px 0;align-items:start}.pg-controls{position:sticky;top:18px;background:#edf3fb;border-radius:8px;padding:16px;display:grid;gap:14px}.pg-controls label{display:grid;gap:6px;font-size:13px}.pg-controls select{width:100%;min-width:0;padding:8px;background:white;border:1px solid #b9cce5;border-radius:4px;font:inherit;font-size:12px}.pg-controls input{width:100%}.pg-controls output{font-family:monospace;color:#315da7}.pg-controls button{background:white;border:1px solid #aebfdb;border-radius:5px;padding:9px;color:#244f99;font:inherit;font-size:12px;cursor:pointer}.pg-buttons{display:grid;grid-template-columns:1fr 1fr;gap:6px}.pg-controls p{font-size:12px!important;line-height:1.7!important;margin:0!important}.pg-results{min-width:0}.pg-images{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.pg-images figure{margin:0;border:1px solid #dbe5f2;background:#fafcfe;padding:6px;border-radius:6px;min-width:0}.pg-images figcaption{font-size:11px;font-weight:600;margin:0 0 7px}.pg-images canvas{width:100%;height:auto;display:block;image-rendering:pixelated}.pg-images small{display:block;font-size:10px;line-height:1.5;color:#64758c;margin-top:5px}.pg-results #pg-curve{display:block;width:100%;height:auto;margin-top:15px;border:1px solid #dbe5f2;border-radius:5px}.pg-results #pg-values,.pg-model{font-size:12px!important;line-height:1.8!important;color:#60718a}.pg-results #pg-values{background:#edf3fb;padding:10px}.pg-controls #pg-watch{border-top:1px solid #cbdaf0;padding-top:10px}
@media(max-width:1100px){.propagation-page .sidebar{display:none;top:65px;width:min(330px,90vw)}.propagation-page .sidebar.is-open{display:block}.propagation-page .main-shell{margin-left:0}.propagation-page .menu{display:block}.pg-console{grid-template-columns:210px minmax(0,1fr)}.pg-images{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.pg-console{grid-template-columns:1fr;gap:12px}.pg-controls{position:static;padding:12px;grid-template-columns:1fr 1fr;gap:10px}.pg-controls select{font-size:11px}.pg-buttons,.pg-controls p{grid-column:1/-1}.pg-buttons{grid-template-columns:repeat(4,minmax(0,1fr))}.pg-buttons button{font-size:10px;padding:6px 3px}.pg-images{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.pg-images figure{padding:4px}.pg-images figcaption{font-size:9px}.pg-images small{font-size:8px}.pg-section{padding:18px!important}.pg-results #pg-curve{margin-top:8px}.pg-results #pg-values{padding:8px;margin-top:8px!important}.pg-geometry figcaption{font-size:11px}}
.pg-symbols{overflow-x:auto;margin:20px 0}.pg-symbols table{width:100%;border-collapse:collapse;font-size:14px;line-height:1.8}.pg-symbols caption{text-align:left;font-weight:600;padding:10px;color:#285ed0}.pg-symbols th,.pg-symbols td{padding:12px;text-align:left;vertical-align:top;border:1px solid #d9e4f3}.pg-symbols th{background:#edf3fb}.pg-symbols td:first-child{white-space:nowrap}.pg-live{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:10px}.pg-comparison{grid-template-columns:repeat(4,minmax(0,1fr))}.pg-comparison[hidden]{display:none}.pg-images .pg-active-plane{border:2px solid #2c65cd;background:#edf4ff}.pg-buttons button[hidden]{display:none}
@media(max-width:900px){.pg-console{grid-template-columns:1fr}.pg-controls{position:static;grid-template-columns:repeat(3,minmax(0,1fr));padding:12px;gap:10px}.pg-buttons,.pg-controls p{grid-column:1/-1}.pg-buttons{grid-template-columns:repeat(4,minmax(0,1fr))}.pg-comparison{grid-template-columns:repeat(4,minmax(0,1fr))}.pg-live{grid-template-columns:repeat(3,minmax(0,1fr))}.pg-images canvas{max-height:155px;object-fit:contain}.pg-results #pg-curve{max-height:180px;object-fit:fill}}
@media(max-width:760px){.pg-controls{grid-template-columns:repeat(2,minmax(0,1fr))}.pg-comparison{gap:4px}.pg-comparison figcaption{font-size:9px}.pg-results #pg-curve{max-height:none}.pg-symbols table{font-size:12px}.pg-symbols th,.pg-symbols td{padding:8px}}
.pg-comparison.pg-single{grid-template-columns:repeat(2,minmax(0,1fr))}.pg-images figure[hidden]{display:none}
.uw-section{scroll-margin-top:80px}.uw-console{display:grid;grid-template-columns:220px minmax(0,1fr);gap:18px;align-items:start;margin:24px 0}.uw-controls{background:#edf3fb;border-radius:8px;padding:16px;display:grid;gap:14px;position:sticky;top:18px}.uw-controls label{display:grid;gap:5px;font-size:13px}.uw-controls output{color:#315da7;font-family:monospace}.uw-controls input[type=range],.uw-controls select{width:100%;min-width:0}.uw-controls select,.uw-controls button{padding:9px;background:white;border:1px solid #b9cce5;border-radius:5px;font:inherit;font-size:12px;color:#244f99}.uw-controls button{cursor:pointer}.uw-controls .uw-check{display:flex;gap:8px;align-items:center}.uw-check input{width:18px;height:18px}.uw-presets{display:grid;gap:6px}.uw-controls p{font-size:12px!important;line-height:1.75!important;margin:0!important}.uw-results{min-width:0}.uw-results>canvas{display:block;width:100%;height:auto;border:1px solid #dbe5f2;border-radius:5px}.uw-results>p,.uw-model{font-size:12px!important;line-height:1.8!important;color:#60718a}.uw-legend{display:flex;flex-wrap:wrap;gap:8px 16px;margin:8px 0!important}.uw-blue{color:#2868d4}.uw-orange{color:#b9671e}.uw-green{color:#188667}.uw-images{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.uw-images figure{margin:0;padding:6px;background:#fafcfe;border:1px solid #dbe5f2;border-radius:5px;min-width:0}.uw-images figcaption{font-size:11px;min-height:32px;font-weight:600}.uw-images canvas{display:block;width:100%;height:auto;image-rendering:pixelated}.uw-images small{font-size:10px}.uw-map-key{display:flex;flex-wrap:wrap;gap:7px;align-items:center}.uw-map-key span{height:12px;width:100px;background:linear-gradient(to right,blue,#ffcf00,red)}.uw-section details{font-size:13px;border-top:1px solid #dbe5f2;padding-top:14px}.uw-section summary{cursor:pointer;color:#315da7}
@media(max-width:1100px){.unwrapping-page .sidebar{display:none;top:65px;width:min(330px,90vw)}.unwrapping-page .sidebar.is-open{display:block}.unwrapping-page .main-shell{margin-left:0}.unwrapping-page .menu{display:block}}
@media(max-width:900px){.uw-console{grid-template-columns:1fr}.uw-controls{position:static;grid-template-columns:repeat(3,minmax(0,1fr));padding:12px;gap:10px}.uw-controls p,.uw-presets{grid-column:1/-1}.uw-presets{grid-template-columns:repeat(3,minmax(0,1fr))}.uw-images canvas{max-height:170px;object-fit:contain}}
@media(max-width:760px){.uw-section{padding:18px!important}.uw-controls{grid-template-columns:repeat(2,minmax(0,1fr))}.uw-controls label{font-size:12px}.uw-presets button{font-size:11px;padding:7px 4px}.uw-images{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.uw-images figcaption{min-height:0;font-size:10px}.uw-images canvas{max-height:110px;object-fit:contain}.uw-images small{font-size:9px}}
/* Lessons 10–12: compare controls, model and measurements in the same view. */
.mt-section{scroll-margin-top:80px}.mt-console{display:grid;grid-template-columns:225px minmax(0,1fr);gap:18px;align-items:start;margin:24px 0}.mt-controls{position:sticky;top:18px;display:grid;gap:13px;padding:16px;background:#edf3fb;border-radius:8px}.mt-controls label{display:grid;gap:5px;font-size:13px}.mt-controls output{color:#315da7;font-family:monospace;font-variant-numeric:tabular-nums}.mt-controls input[type=range],.mt-controls select{width:100%;min-width:0}.mt-controls select,.mt-controls button{padding:8px;background:white;border:1px solid #b9cce5;border-radius:5px;color:#244f99;font:inherit;font-size:12px}.mt-controls button{cursor:pointer}.mt-controls input:disabled{opacity:.35}.mt-controls label:has(input:disabled){color:#72839b}.mt-controls p{font-size:12px!important;line-height:1.75!important;margin:0!important;border-top:1px solid #cfddf0;padding-top:10px}.mt-buttons{display:grid;gap:6px}.mt-results{min-width:0}.mt-results canvas{display:block;width:100%;height:auto;background:#fafcff;border:1px solid #dbe5f2;border-radius:5px}.mt-results canvas+canvas{margin-top:12px}.mt-readings{font-size:13px;line-height:1.8;padding:12px;background:#edf3fb;border-radius:5px;margin-top:12px}.mt-readings p{font-size:13px!important;line-height:1.8!important;margin:0!important}.mt-readings p+p{margin-top:6px!important}.mt-readings strong{color:#214f8a}.mt-legend{display:flex;flex-wrap:wrap;gap:5px 14px;font-size:11px!important;margin:8px 0 12px!important;line-height:1.7!important}.mt-model{font-size:12px!important;line-height:1.85!important;color:#63758f;margin-top:14px!important}.mt-table{overflow-x:auto;margin:22px 0}.mt-table table{width:100%;border-collapse:collapse;min-width:500px;font-size:14px;line-height:1.9}.mt-table th,.mt-table td{border:1px solid #d9e4f3;padding:12px;text-align:left;vertical-align:top}.mt-table th{background:#edf3fb;color:#315575}.mt-table td:first-child{font-weight:600;color:#284f82;width:24%}.mt-steps{padding-left:22px;font-size:15px;line-height:1.95}.mt-steps li+li{margin-top:12px}.mt-section details{border-top:1px solid #dbe5f2;padding-top:15px;font-size:13px}.mt-section summary{cursor:pointer;color:#315da7}.mt-section details a{color:#285ed0;text-decoration:underline}.mt-budget{margin-top:15px;font-size:12px}.mt-budget h3{font-size:13px;margin-bottom:10px}.mt-budget>div{display:grid;grid-template-columns:1fr 1fr;gap:5px 10px;margin:10px 0}.mt-budget small{font-size:10px;color:#60718a}.mt-bar{display:block;background:#e1e9f4;height:12px;border-radius:3px;overflow:hidden}.mt-bar i{display:block;height:100%}.mt-budget>p{font-size:11px!important;line-height:1.8!important}.mt-readings .mt-alert{color:#a65317!important}.mt-readings .mt-good{color:#197558!important}
@media(max-width:1100px){.metrology-page .sidebar{display:none;top:65px;width:min(330px,90vw)}.metrology-page .sidebar.is-open{display:block}.metrology-page .main-shell{margin-left:0}.metrology-page .menu{display:block}}
@media(max-width:950px){.mt-console{grid-template-columns:1fr;gap:14px}.mt-controls{position:static;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:12px}.mt-controls p,.mt-buttons{grid-column:1/-1}.mt-buttons{grid-template-columns:repeat(3,minmax(0,1fr))}.mt-controls label{font-size:12px}.mt-results canvas{max-width:760px;margin-left:auto;margin-right:auto}}
@media(max-width:760px){.mt-section{padding:18px!important}.mt-console{margin:18px 0;gap:12px}.mt-controls{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px 12px}.mt-controls label,.mt-controls select{font-size:11px}.mt-controls p{font-size:11px!important}.mt-buttons button{font-size:11px;padding:7px 4px}.mt-readings{padding:10px}.mt-readings p{font-size:12px!important}.mt-legend{font-size:10px!important}.mt-table table{font-size:12px}.mt-table th,.mt-table td{padding:9px}.mt-budget>div{grid-template-columns:1fr}.mt-steps{font-size:14px}}
@media(max-width:760px){.mt-controls{position:sticky;top:70px;z-index:3;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px 9px;box-shadow:0 4px 12px #19396412}.mt-controls label{font-size:10px}.mt-controls output{font-size:10px}.mt-controls select{padding:6px 3px;font-size:10px}.mt-controls input[type=range]{min-height:22px;margin:0}.mt-controls p{font-size:10px!important;line-height:1.6!important;padding-top:7px}.mt-buttons button{font-size:10px}.mt-controls:focus-within{outline-offset:2px}}
@media(min-width:761px) and (max-width:950px){.mt-controls{position:sticky;top:80px;z-index:3;box-shadow:0 4px 12px #19396412}}
.mt-lesson .formula{margin:20px 0;padding:18px 20px;background:#edf3fb;border:1px solid #d5e2f5;border-radius:6px;color:#244f86;font-size:18px;line-height:1.9;overflow-wrap:anywhere}.mt-lesson .formula sub{font-size:.7em}@media(max-width:760px){.mt-lesson .formula{padding:14px;font-size:15px}}