:root{--sans:system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;font-family:var(--sans);color:#e7eef3;font-synthesis:none;--muted:#94a5b5;--dim:#81919f;--line:#29343e;--mint:#93e8d3;--mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;background:#10171f}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input,select,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit}button:disabled{opacity:.28;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible,select:focus-visible{outline:2px solid var(--mint);outline-offset:5px}button{border:0}a{color:var(--mint)}.site-header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:24px;height:87px;padding:0 3.25%;display:flex}.brand{color:#f1f6f9;letter-spacing:-1.5px;align-items:center;gap:12px;font-size:27px;font-weight:650;text-decoration:none;display:flex}.brand svg{width:35px;height:35px;stroke:var(--mint);stroke-width:1.7px;fill:none}.brand-light{color:#aebdc8;font-weight:400}.brand-dot{color:var(--mint)}.header-caption{font:12px var(--mono);letter-spacing:2.4px;color:var(--muted);margin-left:30px}.quiet-button{color:#bdc8d1;background:0 0;align-items:center;gap:9px;padding:10px 0;font-size:14px;display:flex}.circle-help{width:17px;height:17px;font:12px var(--mono);border:1px solid #778795;border-radius:50%;place-items:center;display:grid}.intro{justify-content:space-between;align-items:center;padding:38px 0 31px;display:flex}.eyebrow{font:11px var(--mono);letter-spacing:1.8px;color:var(--mint);align-items:center;gap:10px;display:flex}.small-line{background:var(--mint);width:20px;height:1px}h1{letter-spacing:-1.7px;margin:14px 0 10px;font-size:clamp(28px,2.9vw,46px);font-weight:450;line-height:1.15}h1 span{color:#b1beca}.intro p{color:var(--muted);margin:0;font-size:15px}.intro-aside{color:#d1dce3;align-items:center;gap:17px;font-size:13px;line-height:1.7;display:flex}.intro-aside strong{color:var(--dim);font-weight:400}.tiny-grid{color:#728b93;font-size:43px;line-height:1}.technology-nav{border:1px solid var(--line);background:#131c25;border-bottom:0;border-radius:8px 8px 0 0;gap:0;display:flex;overflow:hidden}.technology{border-right:1px solid var(--line);text-align:left;color:#a8b7c4;background:0 0;flex:1;align-items:center;gap:15px;min-width:0;padding:23px 27px;font-size:16px;font-weight:500;display:flex;position:relative}.technology:last-child{border-right:0}.technology.active{color:#d9f8ee;background:#1a2b30}.technology.active:after{content:"";background:var(--mint);height:2px;position:absolute;bottom:0;left:0;right:0}.tech-number{font:12px var(--mono);color:#82939e}.technology.active .tech-number{color:var(--mint)}.technology svg{fill:none;stroke:currentColor;stroke-width:1.2px;width:31px;min-width:31px;height:26px}.tech-tag{font:9px var(--mono);letter-spacing:1px;color:#899fa5;max-width:130px;margin-left:auto;line-height:1.7}.lab-layout{border:1px solid var(--line);background:#121c25;border-radius:0 0 8px 8px;grid-template-columns:232px minmax(300px,1fr) 308px;min-height:690px;display:grid;overflow:hidden}.process-panel{border-right:1px solid var(--line);background:#131c25;flex-direction:column;padding:24px 16px 18px;display:flex}.panel-heading{justify-content:space-between;align-items:center;gap:6px;padding:0 7px 21px;display:flex}.panel-heading h2{font:10px var(--mono);letter-spacing:1.5px;color:#bfccd5;margin:0}.panel-heading>span{font:9px var(--mono);color:#8d9eab}.step-list{margin:0;padding:0;list-style:none}.step-list li{position:relative}.step-list li:not(:first-child):before,.step-list li:not(:last-child):after{content:"";pointer-events:none;z-index:1;background:#35424e;width:1px;position:absolute;left:21px}.step-list li:not(:first-child):before{top:0;bottom:calc(50% + 12.5px)}.step-list li:not(:last-child):after{top:calc(50% + 12.5px);bottom:0}.step-button{text-align:left;color:#a9b7c4;background:0 0;border:1px solid #0000;border-radius:5px;align-items:center;gap:12px;width:100%;min-height:46px;padding:11px 8px;font-size:12px;line-height:1.35;display:flex}.step-button:hover{color:#ecf8ff;background:#1a2934}.step-button.active{color:#bdf5df;background:#203932;border-color:#42675f}.step-button.active .step-num{background:var(--mint);color:#142a29;border-color:var(--mint)}.step-num{width:25px;height:25px;font:10px var(--mono);color:#acbbc5;background:#131c25;border:1px solid #3a4a57;border-radius:50%;flex-shrink:0;place-items:center;display:grid}.step-button.completed .step-num{color:var(--mint);border-color:#547c73}.step-arrow{color:var(--mint);margin-left:auto}.flow-footer{align-items:center;gap:11px;margin-top:auto;padding:26px 10px 0;display:flex}.flow-footer p{color:#7d929f;margin:0;font-size:11px;line-height:1.7}.flow-footer strong{color:#a4b5c0;font-weight:400}.outline-chip{color:#6d8e95;font-size:28px}.viewer-panel{background:radial-gradient(at 55% 46%,#243a4a 0%,#182735 38%,#101b25 78%);flex-direction:column;min-width:0;display:flex;position:relative;overflow:hidden}.viewer-top{z-index:2;justify-content:space-between;align-items:center;height:57px;padding:0 24px;display:flex}.viewer-top>div{font:9px var(--mono);letter-spacing:1.2px;color:#93a7b6;align-items:center;gap:9px;display:flex}.viewer-top>div>span:nth-child(2){color:#c2d6dc}.live-dot{background:var(--mint);border-radius:50%;width:5px;height:5px;box-shadow:0 0 10px #93e8d340}.viewer-divider{color:#506575}.viewer-top button{color:#bad0db;background:#20303b;border:1px solid #334552;border-radius:5px;width:29px;height:29px;font-size:20px}.focus-controls{z-index:2;background:#121e28;border:1px solid #30424f;border-radius:5px;align-self:flex-start;gap:2px;margin:0 24px;padding:3px;display:flex}.focus-controls button{color:#9bafbd;background:0 0;border-radius:3px;padding:7px 11px;font-size:11px}.focus-controls button[aria-pressed=true]{color:#e3eff4;background:#344955}#scene-container{flex:1;min-height:415px;position:relative}#scene{touch-action:none;width:100%;height:100%;display:block;position:absolute;inset:0}#scene-labels{pointer-events:none;position:absolute;inset:0;overflow:hidden}.model-label{font:10px var(--mono);color:#cee6ed;letter-spacing:.2px;text-shadow:0 1px 6px #102132;white-space:nowrap;background:#152733cc;border:1px solid #52738166;border-radius:2px;padding:6px 9px;position:absolute;transform:translate(-50%,-100%)}.model-label:after{content:"";background:#88bbce88;width:1px;height:20px;position:absolute;top:100%;left:50%}.model-label.material-label{color:#baf2e4}.scene-caption{font:9px var(--mono);color:#aac3d2;letter-spacing:1px;justify-content:space-between;gap:12px;margin:0 24px 22px;display:flex}.scene-caption>span:last-child{color:#7d95a6;font-size:8px}.view-controls{align-items:center;gap:12px;padding:0 24px 20px;display:flex}.segmented{background:#18232d;border:1px solid #3b4d5a;border-radius:4px;padding:2px;display:flex}.segmented button{color:#9fb3c2;background:0 0;border-radius:2px;padding:6px 11px;font-size:11px}.segmented button[aria-pressed=true]{color:#dbe7eb;background:#364651}.view-controls select{color:#adc0cd;background:#17242e;border:1px solid #344854;border-radius:4px;max-width:174px;padding:8px 21px 8px 9px;font-size:10px}.orbit-hint{color:#92a9b9;white-space:nowrap;margin-left:auto;font-size:9px}.orbit-hint span{padding:0 5px}.playback{background:#15222df2;border-top:1px solid #314350;align-items:center;gap:13px;min-height:83px;padding:17px 21px;display:flex}.playback-main{align-items:center;gap:8px;display:flex}.icon-button{color:#99afbe;background:0 0;min-width:25px;min-height:32px;padding:4px;font-size:17px}.play-button{background:var(--mint);color:#173a36;border-radius:50%;place-items:center;width:38px;height:38px;display:grid;box-shadow:0 0 18px #93e8d315}.play-button svg{width:18px;height:18px}.scrub-container{flex:1;min-width:0}.scrub-label{color:#bbcbd5;justify-content:space-between;align-items:center;gap:10px;margin-bottom:4px;font-size:10px;display:flex}.scrub-label span:first-child{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.scrub-label span:last-child{font:9px var(--mono);color:#93adba}input[type=range]{width:100%;accent-color:var(--mint);cursor:pointer;height:12px;margin:0;display:block}.step-counter{font:10px var(--mono);color:#a2b7c5;white-space:nowrap;border-left:1px solid #354653;padding-left:14px}.detail-panel{border-left:1px solid var(--line);background:#15202a;padding:27px 25px 22px;font-size:13px;line-height:1.7}.detail-overline{font:9px var(--mono);letter-spacing:1px;color:var(--mint);justify-content:space-between;gap:8px;margin-bottom:17px;display:flex}.detail-overline span:last-child{color:#8aa0af;white-space:nowrap}.detail-panel h2{letter-spacing:-.7px;margin:0 0 12px;font-size:25px;font-weight:500;line-height:1.2}.step-summary{color:#a5b9c8;margin:0;font-size:14px;line-height:1.65}.detail-rule{background:#33414d;height:1px;margin:24px 0}.detail-panel h3{font:10px var(--mono);letter-spacing:1.1px;color:#d0dce4;margin:21px 0 9px}.detail-panel p:not(.step-summary){color:#a9bbc9;margin:0;font-size:12px;line-height:1.85}.why-icon{color:var(--mint);padding-right:5px;font-size:13px}.materials-heading{justify-content:space-between;align-items:center;gap:6px;margin-top:23px;display:flex}.materials-heading h3{margin:0;font-size:9px}.materials-heading>span{font:7px var(--mono);color:#91a5b3;letter-spacing:.6px}.material-list{flex-wrap:wrap;gap:7px;margin-top:12px;display:flex}.material-button{color:#c3d3dd;background:#1c2c38;border:1px solid #3a4a57;border-radius:4px;align-items:center;gap:7px;padding:7px 8px;font-size:10px;display:flex}.material-button[aria-pressed=true]{background:#203c3b;border-color:#90d7c6}.material-swatch{background:var(--swatch);border-radius:2px;width:8px;height:8px;display:block}.material-detail{color:#b5cbd4;margin-top:12px;font-size:11px;line-height:1.75}.material-detail:empty{display:none}.material-detail strong{color:#d4e8ec;font-weight:500;display:block}details{border-top:1px solid #33414d;border-bottom:1px solid #33414d;margin-top:24px;padding:14px 0}summary{cursor:pointer;color:#bdcdd7;justify-content:space-between;align-items:center;font-size:12px;list-style:none;display:flex}summary::-webkit-details-marker{display:none}summary span{color:#8ca8b5;font-size:17px}details[open] summary span{transform:rotate(45deg)}#technical-content{color:#a8bbc9;padding-top:13px;font-size:12px;line-height:1.8}#technical-content a{margin-top:9px;font-size:11px;display:block}.learning-note{gap:8px;margin-top:24px;display:flex}.learning-note>span{color:#8ea8b7;font-size:13px}.detail-panel .learning-note p{color:#8da5b5;font-size:10px;line-height:1.6}.page-footer{font:8px var(--mono);letter-spacing:1px;color:#8397a6;justify-content:space-between;align-items:center;gap:20px;padding:24px 0 30px;display:flex}.page-footer>span,.page-footer>div{align-items:center;gap:10px;display:flex}.footer-square{border:1px solid #759990;width:5px;height:5px}.footer-line{background:#475c69;width:24px;height:1px;margin:0 6px}.mobile-step{display:none}.sr-only,.skip-link:not(:focus){clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.skip-link:focus{z-index:10;background:#10252c;padding:14px;position:fixed;top:10px;left:10px}dialog{color:#e3eef3;background:#172631;border:1px solid #42616b;border-radius:10px;width:min(520px,90vw);max-height:85vh;padding:30px}dialog::backdrop{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#050d16ba}.dialog-heading{justify-content:space-between;align-items:center;display:flex}dialog h2{letter-spacing:-1px;margin:20px 0 10px;font-size:30px;font-weight:500}dialog p,dialog dd{color:#b4c7d2;font-size:14px;line-height:1.7}dialog dt{color:#b6efdd;margin-top:18px;font-size:14px}dialog dd{margin:4px 0 0}.primary-button{background:var(--mint);color:#173a36;border-radius:5px;justify-content:space-between;width:100%;margin-top:14px;padding:13px;font-weight:600;display:flex}#fallback{text-align:center;color:#b9d1df;padding:20px;font-size:14px}#fallback svg{width:100%;max-width:500px}#fallback span{max-width:400px;margin:auto;font-size:12px;line-height:1.7;display:block}.noscript-message{color:#fff;text-align:center;background:#28463f;padding:16px;position:fixed;bottom:0;left:0;right:0}@media (width>=1600px){.lab-layout{grid-template-columns:255px minmax(300px,1fr) 340px;min-height:750px}.step-button{min-height:48px;font-size:14px}.detail-panel p:not(.step-summary){font-size:14px}.detail-panel h2{font-size:29px}.detail-panel{padding:30px}.detail-panel h3{font-size:11px}.material-button{font-size:12px}}@media (width<=1250px){.lab-layout{grid-template-columns:200px minmax(290px,1fr) 270px}.technology{gap:10px;padding:21px 19px}.tech-tag{display:none}.detail-panel{padding:23px 19px}.orbit-hint{display:none}.viewer-top,.view-controls{padding-left:18px;padding-right:18px}.viewer-top>div{gap:6px;font-size:8px}.playback{gap:8px;padding:17px 13px}.step-button{gap:9px;font-size:11px}.process-panel{padding:22px 10px 18px}.focus-controls{margin:0 18px}.scene-caption{margin-left:18px;margin-right:18px}.scene-caption>span:last-child,.materials-heading>span{display:none}.step-counter{padding-left:8px;font-size:9px}.replay{display:none}}@media (width<=1000px){.lab-layout{grid-template-columns:190px 1fr}.detail-panel{border-left:0;border-top:1px solid var(--line);grid-column:1/-1;grid-template-columns:1fr 1fr;column-gap:30px;padding:24px;display:grid}.detail-overline,.detail-panel h2,.step-summary,.detail-rule,.material-list,.material-detail,details,.learning-note,.materials-heading{grid-column:1/-1}.detail-panel h3{margin-top:12px}.detail-panel>h3{grid-column:1}.detail-panel>p:not(.step-summary){grid-column:2}.detail-rule{margin:20px 0 10px}.material-list{margin-bottom:8px}.viewer-panel{min-height:670px}.intro-aside{display:none}.detail-panel p:not(.step-summary){font-size:14px}.materials-heading>span{display:block}.header-caption{font-size:10px}.technology{gap:9px;font-size:14px}.detail-panel .learning-note p{font-size:12px}}@media (width<=650px){.site-header{height:70px;padding:0 20px}.brand{font-size:24px}.brand svg{width:29px}.header-caption{display:none}.quiet-button{font-size:12px}main{padding:0 16px}.intro{padding:29px 0 26px}h1{letter-spacing:-1.1px;font-size:30px}.intro p{font-size:13px}.eyebrow{font-size:9px}.technology{flex-wrap:wrap;justify-content:center;gap:7px;padding:15px 8px;font-size:12px}.tech-number{font-size:9px}.technology svg{width:24px;min-width:24px;height:22px}.technology>span:not(.tech-number):not(.tech-tag){text-align:center;width:100%}.lab-layout{flex-direction:column;display:flex}.process-panel{border-right:0;border-bottom:1px solid var(--line);padding:14px 16px}.panel-heading,.step-list,.flow-footer{display:none}.mobile-step{justify-content:space-between;align-items:center;gap:12px;display:flex}.mobile-step label{font:9px var(--mono);color:#8ea8b7;text-transform:uppercase;letter-spacing:.6px}.mobile-step select{color:#d0e2e8;background:#1b2e38;border:1px solid #39535f;border-radius:4px;max-width:65%;padding:9px;font-size:12px}.viewer-panel{min-height:540px}.viewer-top{height:49px;padding:0 15px}.viewer-top>div{letter-spacing:.7px;font-size:8px}.focus-controls{margin:0 15px}.focus-controls button{font-size:10px}#scene-container{min-height:305px}.scene-caption{margin-bottom:15px;font-size:8px}.view-controls{gap:9px;padding:0 15px 17px}.view-controls select{font-size:10px}.playback{padding:16px 12px}.step-counter{font-size:8px}.scrub-label{font-size:9px}.playback-main{gap:4px}.play-button{width:32px;height:32px}.detail-panel{padding:25px 22px;display:block}.detail-overline{font-size:10px}.detail-panel h2{font-size:27px}.detail-panel h3{margin-top:22px;font-size:11px}.detail-panel p:not(.step-summary){font-size:14px}.step-summary{font-size:15px}.material-button{font-size:12px}.materials-heading>h3{margin:0}.material-detail{font-size:13px}summary{font-size:14px}#technical-content{font-size:13px}.page-footer{padding:19px 0;font-size:8px;line-height:1.7}.page-footer>div{display:none}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}[hidden]{display:none!important}.step-button{font-size:.875rem}.detail-panel p:not(.step-summary){font-size:.875rem;line-height:1.8}.detail-panel h3,.panel-heading h2,.detail-overline{font-size:.6875rem}.material-button{min-height:34px;font-size:.75rem}.material-detail,#technical-content,summary{font-size:.8125rem}.focus-controls button,.segmented button{min-height:32px;font-size:.75rem}.view-controls select{min-height:36px;font-size:.6875rem}.scrub-label{font-size:.6875rem}.scrub-label span:last-child,.step-counter{font-size:.625rem}.scrub-container input{appearance:none;background:0 0;height:20px}.scrub-container input::-webkit-slider-runnable-track{background:#43616c;border-radius:2px;height:3px}.scrub-container input::-webkit-slider-thumb{appearance:none;background:var(--mint);border-radius:50%;width:11px;height:11px;margin-top:-4px;box-shadow:0 0 0 3px #93e8d315}.scrub-container input::-moz-range-track{background:#43616c;height:3px}.scrub-container input::-moz-range-thumb{background:var(--mint);border:0;border-radius:50%;width:11px;height:11px}.replay{display:block}.model-label,.detail-panel .learning-note p{font-size:.6875rem}.flow-footer p{font-size:.75rem}.tech-tag{font-size:.5625rem}.technology{min-height:72px}@media (width<=1250px){.step-button{font-size:.8125rem}.lab-layout{grid-template-columns:214px minmax(285px,1fr) 280px}.viewer-top>div>span:last-child,.viewer-divider,.step-counter{display:none}}@media (width<=1000px){.lab-layout{grid-template-columns:210px minmax(0,1fr)}.detail-panel>h3{margin:18px 0}.detail-panel>p:not(.step-summary){margin:12px 0}}@media (width<=650px){.focus-controls button,.segmented button,.icon-button,.viewer-top button{min-width:40px;min-height:40px}.focus-controls button{font-size:.6875rem}.focus-controls{margin-top:4px}.viewer-top{min-height:56px}.view-controls{flex-wrap:wrap}.view-controls select{flex:1;min-height:44px}.playback{gap:6px;padding:14px 9px}.playback-main{gap:0}.play-button{min-width:40px;min-height:40px}.icon-button{min-width:29px}.scrub-label{font-size:.625rem}.scrub-container input{height:36px}.material-button{min-height:44px}.model-label{padding:5px;font-size:.5625rem}.replay{font-size:21px}.mobile-step select{min-height:44px}}.scene-leaders{pointer-events:none;stroke-width:1px;opacity:.9;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.layer-callout,.optics-callout{color:#f2f7ff;z-index:2;background:#0b1726ed;border:1px solid #607380;box-shadow:0 3px 12px #0008}.layer-callout{border-left:3px solid var(--layer-color)}.layer-callout:after,.optics-callout:after{display:none}.optics-callout{color:#efdfff;border-color:#9b79c4}.optics-note{z-index:3;font:10px var(--mono);color:#ccb2f1;letter-spacing:.06em;pointer-events:none;position:absolute;top:10px;left:18px}.phase-list{background:#0d1920;border-top:1px solid #21323c;flex-wrap:wrap;gap:6px;padding:12px 16px 16px;display:flex}.phase-list button{font:11px var(--sans);text-align:left;color:#9cb0bd;cursor:pointer;background:#14242d;border:1px solid #2b3c48;border-radius:4px;padding:7px 9px}.phase-list button:hover{color:#fff;border-color:#9ac4d8}.phase-list button[aria-current=step]{color:#d9ffee;background:#263740;border-color:#78cdb8}.detail-panel .color-note{color:#8195a5;margin:0 0 10px;font-size:11px!important;line-height:1.5!important}.material-list{gap:7px}.material-button{text-align:left}@media (width<=650px){.phase-list{gap:5px;padding:10px}.phase-list button{min-height:38px;font-size:11px}.optics-note{font-size:8px;left:10px}}.lesson-bar{border-bottom:1px solid #293d49;padding:12px 18px}.lesson-bar .focus-controls{gap:4px;margin:0;display:flex;position:static}.lesson-bar>span{color:#91a8b5;margin-top:9px;font-size:11px;display:block}.model-workspace{background:radial-gradient(at 50% 45%,#243c50 0%,#101d28 65%);grid-template-columns:112px minmax(0,1fr) 112px;min-height:470px;display:grid}#scene-container{background:0 0;min-width:0;height:470px;margin:0;position:relative}#scene{width:100%;height:100%;display:block}.annotation-rail{z-index:1;flex-direction:column;justify-content:center;gap:34px;padding:28px 10px;display:flex}.scene-callout strong{letter-spacing:.07em;color:#a4dace;margin-bottom:9px;font-size:10px;display:block}.scene-callout span{color:#b0c3cf;font-size:11px;line-height:1.7;display:block}.scene-callout:before{content:"";background:#779ba7;width:22px;height:1px;margin-bottom:12px;display:block}.selection-anchor{pointer-events:none;border:1px solid;border-radius:50%;width:9px;height:9px;position:absolute;transform:translate(-50%,-50%)}.transparency-control{color:#9eb5c3;align-items:center;gap:14px;padding:8px 18px 14px;font-size:10px;display:flex}.transparency-control input{accent-color:#89cbbd;flex:1;min-width:60px}.operation-description{color:#bbd7db;background:#0e1b24;margin:0;padding:12px 18px;font-size:12px}.layer-row{border-bottom:1px solid #263c48;grid-template-columns:16px minmax(0,1fr);align-items:center;column-gap:5px;width:100%;padding:5px 0;display:grid}.layer-row>input[type=range]{accent-color:#82bcbd;grid-column:2;width:100%;height:20px}.layer-row>input[type=checkbox]{accent-color:#91d6c9}.layer-row .material-button{background:0 0;border:0;min-width:0;padding:4px;font-size:11px}.material-list{display:block}#concentration-key{color:#a4bdcd;margin:8px 0 15px;font-size:10px}.density-gradient{background:linear-gradient(90deg,#338ab315,#30baf1);border-radius:4px;height:7px;margin-top:8px}.density-labels{justify-content:space-between;margin-top:4px;font-size:9px;display:flex}.inverter-layout{background:#101f2b;border-bottom:1px solid #36505d;grid-template-columns:minmax(170px,1fr) 190px;gap:10px;padding:14px 20px;display:grid}.inverter-layout h3{letter-spacing:.12em;color:#a0d4d0;margin:0 0 8px;font-size:10px}.inverter-layout p{color:#b0c0cb;margin:0 0 8px;font-size:11px}.inverter-layout svg{align-self:center;width:100%;height:200px;max-height:230px}.mask-key{color:#bd9cda;font-size:10px}.net-list{gap:4px;margin-top:12px;display:grid}.net-list button{text-align:left;border:0;border-left:2px solid var(--net-color);color:#bacecf;cursor:pointer;background:#1c2e3a;padding:5px 8px;font-size:10px}.net-list button[aria-pressed=true]{color:#fff;background:#334c59}.view-controls{flex-wrap:wrap;gap:8px}.orbit-hint{font-size:9px}#renderer-notice{color:#dec9ee;background:#342c3e;padding:10px 16px;font-size:12px}#fallback{padding:15px;font-size:12px;position:absolute;inset:0}#fallback svg{width:100%;max-height:250px}@media (width>=1500px){.lab-layout{grid-template-columns:230px minmax(620px,1fr) 310px}.model-workspace{grid-template-columns:120px minmax(0,1fr) 120px}#scene-container{height:520px}}@media (width<=1250px){.model-workspace{grid-template-columns:1fr;min-height:0}.annotation-rail{flex-direction:row;justify-content:space-between;gap:20px;padding:12px 16px}.annotation-rail .scene-callout{flex:1}.scene-callout span{font-size:10px}.scene-callout:before{display:none}#scene-container{grid-row:1;height:420px}#annotation-left{grid-row:2}#annotation-right{grid-row:3;padding-top:0}.inverter-layout{grid-template-columns:minmax(140px,1fr) 160px}}@media (width<=650px){.lab-layout{flex-direction:column;display:flex}.process-panel,.viewer-panel,.detail-panel{width:100%}.lesson-bar{padding:10px}#scene-container{height:360px}.inverter-layout{grid-template-columns:minmax(120px,1fr) 145px;padding:12px}.inverter-layout svg{height:195px}.transparency-control{gap:7px;padding:10px;font-size:9px}.lesson-bar .focus-controls button{flex:1;padding:5px;font-size:11px}.annotation-rail{gap:12px;padding:12px}.scene-callout strong{font-size:9px}.phase-list button{flex:40%}.layer-row>input[type=range]{height:30px}.layer-row .material-button{min-height:38px}.view-controls{padding:10px}.scrub-container{min-width:0}}.viewer-panel{align-self:start}.inverter-layout{grid-template-columns:minmax(180px,1fr) minmax(220px,42%)}.inverter-layout .net-list{max-width:300px}.density-gradient{background:linear-gradient(90deg,#328db020,#30baf1 49%,#a63c7520 51%,#f37dba)}@media (width<=650px){.inverter-layout{grid-template-columns:minmax(120px,1fr) 155px}.inverter-layout svg{height:210px}}.density-gradient{background:linear-gradient(90deg,#328db020,#30baf1) 0 0/100% 6px no-repeat,linear-gradient(90deg,#a63c7520,#f37dba) 0 100%/100% 6px no-repeat;height:15px}.site-header h1{letter-spacing:0;margin:0;font-size:22px;font-weight:550}.github-button{color:#c4d0d9;background:0 0;border:1px solid #3a4e5e;border-radius:5px;place-items:center;width:40px;height:40px;text-decoration:none;display:grid}.github-button:hover{color:var(--mint);border-color:var(--mint)}.github-button svg{width:23px;height:23px}main{max-width:2100px;margin:auto;padding:20px 24px 32px}.lab-layout{grid-template-columns:210px minmax(0,1fr) 285px}.detail-panel{padding:22px 18px}.process-views{border-bottom:1px solid #314554;grid-template-columns:minmax(0,1fr) minmax(0,1fr);display:grid}.section-pane,.three-pane{background:#13212f;min-width:0}.section-pane{border-right:1px solid #344a5c}.view-heading{color:#deebf5;border-bottom:1px solid #293d4e;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:5px 12px;margin:0;padding:12px 14px;font-size:12px;font-weight:500;display:flex}.view-heading span{color:#acbdcc;font-size:10px;font-weight:400}#process-section svg{width:100%;min-height:290px;max-height:420px;display:block}.diagram-label{fill:#e5edf6;font:15px var(--sans)}.diagram-small{fill:#bfd0df;font:12px var(--sans)}.section-material{cursor:pointer}.section-key{flex-wrap:wrap;gap:4px 8px;padding:0 14px 10px;display:flex}.section-key button{text-align:left;color:#c3d2e2;background:0 0;align-items:center;gap:5px;padding:3px 0;font-size:10px;display:flex}.section-key button[aria-pressed=true]{color:#fff;text-underline-offset:3px;text-decoration:underline}.section-key i{border:1px solid #cbd9e455;flex-shrink:0;width:9px;height:9px;display:block}.section-note{color:#a8bfd2;margin:0;padding:8px 14px 14px;font-size:10px;line-height:1.6}.process-views .model-workspace{grid-template-columns:1fr;min-height:0}.process-views #scene-container{grid-row:1;height:370px;min-height:0}.process-views .annotation-rail{flex-direction:row;justify-content:start;gap:12px;padding:8px 14px}.process-views #annotation-left{grid-row:2}.process-views #annotation-right{grid-row:3;padding-top:0}.process-views .scene-callout:before{display:none}.process-views .scene-callout strong{margin-bottom:3px;font-size:9px}.process-views .scene-callout span{font-size:10px;line-height:1.6}.layer-row{column-gap:6px;min-height:29px;padding:0}.layer-row .material-button{min-height:29px;padding:4px;font-size:11px}.layer-row>input[type=range]{height:24px;margin:0 0 5px;display:none}.layer-row:focus-within>input[type=range]{display:block}@media (hover:hover){.layer-row:hover>input[type=range]{display:block}}.material-list{margin-top:8px}.inverter-layout .net-list{grid-template-columns:repeat(2,1fr)}@media (width<=1350px){.lab-layout{grid-template-columns:190px minmax(0,1fr)}.detail-panel{border-top:1px solid #293d4e;border-left:0;grid-column:1/-1;grid-template-columns:1fr 1fr;column-gap:30px;display:grid}.detail-overline,.detail-panel h2,.detail-rule,.materials-heading,.material-list,.material-detail,#concentration-key,details,.learning-note{grid-column:1/-1}.detail-panel>h3{grid-column:1}.detail-panel>p{grid-column:2}.material-list{grid-template-columns:1fr 1fr;align-items:start;gap:0 25px;display:grid}}@media (width<=800px){.process-views{grid-template-columns:1fr}.section-pane{border-bottom:1px solid #344a5c;border-right:0}#process-section svg{min-height:0;max-height:340px}.process-views #scene-container{height:330px}}@media (width<=650px){.site-header{height:60px;padding:0 14px}main{padding:12px 10px 24px}.technology{min-height:62px;padding:9px 5px}.technology .tech-number,.technology svg{display:none}.detail-panel,.material-list{display:block}.layer-row .material-button{min-height:36px}.layer-row>input[type=range]{height:36px}.process-views #scene-container{height:310px}.inverter-layout{grid-template-columns:minmax(120px,1fr) 145px}.inverter-layout svg{height:175px}.section-key button{min-height:28px}}.site-header{height:52px;padding:0 14px}main{max-width:none;padding:10px 12px 18px}.technology{min-height:44px;padding:9px 16px}.lab-layout{grid-template-columns:190px minmax(0,1fr) 36px;align-items:start;position:relative}.lab-layout.explanation-pinned{grid-template-columns:190px minmax(0,1fr) 356px}.viewer-panel{min-height:0}.viewer-top{height:38px;min-height:38px;padding:0 12px}.lesson-bar{align-items:center;gap:14px;padding:6px 12px;display:flex}.lesson-bar>span{margin:0}.lesson-bar .focus-controls{flex:1}.view-heading{gap:5px 8px;min-height:38px;padding:5px 10px}.view-heading h3{font:inherit;margin:0}.section-zoom-controls{align-items:center;gap:3px;margin-left:auto;display:flex}.section-zoom-controls button{background:#20323f;border:1px solid #3b5365;border-radius:3px;width:28px;height:27px;font-size:17px}.section-zoom-controls span{font:10px var(--mono);text-align:center;min-width:36px}#process-section svg{touch-action:none;cursor:grab;height:clamp(280px,46vh,490px);min-height:0;max-height:none;overflow:hidden}#process-section svg:active{cursor:grabbing}#process-section svg:focus-visible{outline:2px solid var(--mint);outline-offset:-3px}.process-views #scene-container{height:clamp(280px,46vh,490px)}.section-key{gap:2px 9px;padding:4px 10px 8px}.process-views .annotation-rail{padding:5px 10px}.scene-caption{margin:6px 12px}.view-controls{padding:4px 12px 8px}.transparency-control{padding:2px 12px 9px}.playback{min-height:65px;padding:10px 12px}.operation-description,.phase-list{padding:8px 12px}.inverter-layout{grid-template-columns:minmax(160px,1fr) 125px;padding:7px 12px}.inverter-layout svg{height:125px}.inverter-layout .net-list{grid-template-columns:repeat(4,minmax(0,1fr));max-width:650px;margin-top:7px}.inverter-layout h3,.inverter-layout p{margin-bottom:4px}.explanation-drawer{z-index:5;background:#15232e;border-left:1px solid #354b5b;align-self:stretch;position:relative}.drawer-tab{writing-mode:vertical-rl;color:#c2d5e0;background:#203440;align-items:center;gap:10px;width:35px;min-height:130px;padding:14px 8px;font-size:12px;display:flex;position:sticky;top:8px}.drawer-tab[aria-expanded=true]{color:#c6fff1;background:#2c4b53}.drawer-content{overscroll-behavior:contain;background:#15202a;border:1px solid #476372;width:320px;max-width:calc(100vw - 54px);max-height:calc(100dvh - 125px);position:absolute;top:0;right:35px;overflow:auto;box-shadow:-12px 8px 30px #0005}.drawer-toolbar{z-index:2;background:#21333f;border-bottom:1px solid #3e5362;align-items:center;gap:8px;padding:8px 10px;font-size:12px;display:flex;position:sticky;top:0}.drawer-toolbar>span{flex:1}.drawer-toolbar button{background:#324c57;border-radius:3px;min-height:30px;padding:5px 8px;font-size:12px}.drawer-toolbar button[aria-pressed=true]{color:#133c35;background:#93e8d3}.explanation-pinned .explanation-drawer{grid-template-columns:35px minmax(0,1fr);align-content:start;display:grid}.explanation-pinned .drawer-content{width:320px;max-width:100%;box-shadow:none;border-right:0;position:sticky;top:8px}.drawer-content .detail-panel{border:0;padding:16px;display:block}.drawer-content .material-list{display:block}.drawer-content .detail-overline{margin-bottom:12px}.drawer-content .detail-panel h2{font-size:23px}.drawer-content .detail-rule{margin:14px 0}.drawer-content .detail-panel p{font-size:13px}@media (width<=1150px){.lab-layout,.lab-layout.explanation-pinned{grid-template-columns:170px minmax(0,1fr) 36px}.explanation-pinned .explanation-drawer{display:block}.explanation-pinned .drawer-content{width:320px;max-width:calc(100vw - 54px);position:absolute;top:0}.lesson-bar>span{display:none}}@media (width<=800px){.process-views{grid-template-columns:1fr}#process-section svg,.process-views #scene-container{height:300px}.inverter-layout .net-list{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=650px){main{padding:6px}.lab-layout,.lab-layout.explanation-pinned{grid-template-columns:minmax(0,1fr) 32px;display:grid}.process-panel{grid-column:1/-1;padding:6px 10px}.viewer-panel{grid-column:1}.explanation-drawer{grid-area:2/2}.drawer-tab{width:31px;padding:12px 6px}.drawer-content,.explanation-pinned .drawer-content{max-width:calc(100vw - 45px);max-height:calc(100dvh - 150px);right:31px}.technology{min-height:38px;padding:8px}.view-heading>#section-direction{display:none}.section-zoom-controls button{width:32px;height:32px}.viewer-top{padding:0 10px}.view-controls{padding:6px}.transparency-control{padding:4px 6px}.playback{padding:8px 4px}.lesson-bar{padding:5px}.inverter-layout{grid-template-columns:minmax(110px,1fr) 110px}}.process-panel{scrollbar-width:thin;max-height:calc(100dvh - 110px);padding:14px 8px;overflow-y:auto}.panel-heading{margin-bottom:12px;padding:0 8px}.panel-heading h2{white-space:nowrap;font-size:10px}.step-button{gap:8px;min-height:42px;padding:7px 8px;font-size:12px}.explanation-pinned .drawer-content{right:auto}@media (width<=1150px){.explanation-pinned .drawer-content{right:35px}}@media (width<=650px){.process-panel{max-height:none;padding:6px 10px;overflow:visible}.explanation-pinned .drawer-content{right:31px}}#explanation-pin{align-items:center;gap:5px;display:inline-flex}.process-views:has(>.top-pane:not([hidden])){grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,.8fr)}.process-views>.top-pane{background:#13212f;border:0;border-left:1px solid #344a5c;min-width:0;padding:0;display:block}.process-views>.top-pane>.view-heading{color:#deebf5;letter-spacing:normal;margin:0;font-size:12px}.process-views>.top-pane>svg{width:100%;height:clamp(280px,46vh,490px);max-height:none;padding:10px;display:block}.top-view-details{padding:5px 10px 10px}.process-views>.top-pane .net-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;max-width:none;margin-top:8px}@media (width<=800px){.process-views:has(>.top-pane:not([hidden])){grid-template-columns:minmax(0,1fr)}.process-views>.top-pane{border-top:1px solid #344a5c;border-left:0}.process-views>.top-pane>svg{height:300px}}