:root{--ink:#193a4b;--muted:#6d7d83;--line:#dce5e6;--paper:#fafbf8;--teal:#24a5a1;--mint:#dff4eb;--orange:#bc652e;--blue:#657ebd;--serif:'Instrument Serif',Georgia,serif;--sans:'DM Sans',Arial,sans-serif}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:var(--paper);font:16px/1.55 var(--sans)}button,a,summary{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:default}button:focus-visible,a:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:3px solid #bc652e;outline-offset:4px}button{border:0;background:none}a{color:inherit}.header{height:82px;padding:0 4.4vw;display:flex;align-items:center;border-bottom:1px solid var(--line);gap:24px}.brand{text-decoration:none;font-size:13px;font-weight:700;letter-spacing:1.8px;display:flex;gap:11px;align-items:center}.brand-icon{font-size:34px;line-height:1;color:var(--teal)}.edition{font:italic 18px var(--serif);color:var(--muted)}.context-button{margin-left:auto;font-size:14px;display:flex;gap:15px;align-items:center}.context-button span{color:var(--teal);font-size:22px}.tracker{position:sticky;top:0;z-index:5;background:#fafbf8f5;backdrop-filter:blur(12px);display:flex;align-items:center;gap:14px;padding:13px 4.4vw;border-bottom:1px solid var(--line);white-space:nowrap;overflow-x:auto;font-size:14px}.tracker button{padding:0}.tracker button:hover{text-decoration:underline}.crumb-icon{font-size:25px;line-height:1;margin-right:10px}.relation{font-size:11px;color:var(--muted);display:flex;align-items:center;gap:14px}.relation span{font-size:20px}.current{font-weight:700}.tracker-tag{margin-left:auto;font-size:10px;letter-spacing:1.4px;border:1px solid var(--line);padding:4px 8px;border-radius:5px}main{max-width:1440px;margin:auto;padding:0 4.4vw}.intro{display:flex;justify-content:space-between;align-items:end;padding:34px 0 30px;gap:32px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2px;margin:0 0 10px}.intro h1{font:56px/.98 var(--serif);letter-spacing:-1.6px;margin:0}.intro h1 em{color:#438a79;font-weight:400}.intro-note{font-size:14px;line-height:1.7;color:var(--muted);max-width:310px;margin:0 0 3px}.workbench{display:grid;grid-template-columns:minmax(290px,.79fr) minmax(0,1.5fr);gap:40px;border-top:1px solid var(--line);padding-top:22px}.lesson{padding:15px 0 0}.step-kicker{display:flex;align-items:center;gap:13px;margin-bottom:18px;font-size:10px;font-weight:700;letter-spacing:1.7px}.step-kicker>span:first-child{font:26px var(--serif);color:#448a79;letter-spacing:0;border-bottom:1px solid #a9c9bd;padding-bottom:3px}.step-copy h2{font:40px/1.1 var(--serif);letter-spacing:-.5px;margin:0 0 16px;max-width:340px}.lede{font-size:16px;line-height:1.6;margin:0 0 22px;max-width:365px;color:#556c77}.recipe{font-size:15px;line-height:1.9;max-width:385px}.recipe p{margin:0 0 13px}.node{border:1px solid #c7ddd7;background:#edf7f2;border-radius:6px;padding:3px 7px;display:inline-flex;gap:5px;align-items:center;vertical-align:baseline;font-size:14px;font-weight:500;line-height:1.4}.node:hover{background:#d8eee3;border-color:#98bbb0}.node .type{font-size:10px;border-right:1px solid #c0d7ce;padding-right:5px;letter-spacing:.35px;font-weight:700;line-height:1.1}.node.tool{background:#f4f1fb;border-color:#d6cee6}.node.tool:hover{background:#e7dff4}.node.tool .type{border-color:#d6cee6}.node.energy{background:#fff5e3;border-color:#e8d5ae}.node.material{background:#f6f2ee;border-color:#e3d7cd}.node.material .type{border-color:#ded1c8}.why{margin:24px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:13px 0;max-width:385px;font-size:14px}.why summary{cursor:pointer;font-weight:600;list-style:none;display:flex;justify-content:space-between}.why summary::-webkit-details-marker{display:none}.why summary span{font-size:22px;color:#438a79;line-height:1}.why[open] summary span{transform:rotate(45deg)}.why p{color:#5c727d;line-height:1.7;margin:10px 0 2px}.check{display:flex;gap:12px;align-items:start;max-width:350px;margin-top:20px}.check-icon{background:var(--mint);border-radius:50%;font-size:14px;line-height:27px;width:27px;text-align:center;color:#458a78;flex-shrink:0}.small-label{font-size:9px;letter-spacing:1.2px;font-weight:700;margin:0 0 4px}.check p:last-child{font-size:14px;margin:0;color:#526f78}.concept-note{font-size:11px;color:var(--muted);margin:20px 0 0;max-width:350px}.visual-column{min-width:0}.stage-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}.view-switch{display:flex;gap:3px;background:#edf0ed;padding:4px;border-radius:8px}.view-switch button{font-size:12px;padding:6px 13px;border-radius:5px}.view-switch button.active{background:white;box-shadow:0 1px 5px #193a4b12;font-weight:600}.motion-btn{font-size:12px;padding:8px}.motion-btn span{margin-right:6px;color:#568e7d}.stage{border:1px solid #d6e2e0;border-radius:14px;background:radial-gradient(ellipse at 50% 50%,#e9f7f044,transparent 65%),linear-gradient(#ffffff,#f8fcfa);position:relative;overflow:hidden;min-height:420px}.stage-heading{position:absolute;left:20px;top:16px;right:20px;display:flex;justify-content:space-between;gap:12px;font-size:12px;color:#637e82;z-index:1}.scale-label{font-size:8px;letter-spacing:1.2px;white-space:nowrap;margin-top:3px}#speaker-svg{width:100%;height:auto;display:block;aspect-ratio:760/600;margin:16px 0 13px;overflow:visible}svg .part,svg [data-part]{cursor:pointer;outline:none}svg .part:hover{filter:drop-shadow(0 0 5px #4b8f8355)}svg [data-part]:focus-visible{filter:drop-shadow(0 0 7px #bc652e);outline:none}.part-label{fill:var(--ink);stroke:#b3c5c9;stroke-width:1}.part-label circle{fill:white;stroke:#7eaaac}.part-label text{stroke:none;font:bold 14px var(--sans);text-anchor:middle}.part-label .label-name{font:14px var(--sans);text-anchor:start}.part-label path{fill:none}.layer{transition:transform 1050ms cubic-bezier(.22,.9,.3,1),opacity 500ms,filter 500ms;transform-box:view-box;transform-origin:380px 300px}.guide-lines{transition:opacity 500ms}.stage[data-step="0"] #layer-magnet{filter:drop-shadow(0 5px 10px #6a91b433)}.stage[data-step="1"] #layer-film{transform:translateY(94px)}.stage[data-step="1"] #layer-coil{filter:drop-shadow(0 5px 12px #ce743344)}.stage[data-step="1"] #layer-film .part-label{opacity:0}.stage[data-step="2"] #layer-film,.stage[data-step="3"] #layer-film{transform:translateY(245px)}.stage[data-step="2"] #layer-coil,.stage[data-step="3"] #layer-coil{transform:translateY(151px)}.stage[data-step="2"] #layer-magnet,.stage[data-step="3"] #layer-magnet{transform:translateY(76px)}.stage[data-step="2"] .part-label,.stage[data-step="3"] .part-label{opacity:0}.stage[data-step="2"] .guide-lines,.stage[data-step="3"] .guide-lines{opacity:0}.stage[data-step="3"] #layer-film{animation:film-vibration 1400ms ease-in-out 1100ms infinite}.stage[data-step="3"] #layer-coil{animation:coil-vibration 1400ms ease-in-out 1100ms infinite}#sound-waves{opacity:0;transition:opacity 600ms}.stage[data-step="3"] #sound-waves{opacity:.8;animation:waves 1400ms ease-in-out infinite}#section-diagram{display:none}#section-moving{animation:section-motion 1.4s ease-in-out infinite}.stage[data-step="0"] #section-moving,.stage[data-step="1"] #section-moving,.stage[data-step="2"] #section-moving{animation:none}#section-wave{opacity:0}.stage[data-step="3"] #section-wave{animation:waves 1.4s ease-in-out infinite}.stage[data-view="section"] #section-diagram{display:block}.stage[data-view="section"] #exploded-diagram{display:none}.svg-note{font:11px var(--sans);fill:#718895;stroke:none;letter-spacing:.5px}.section-label{font:16px var(--sans);fill:var(--ink)}.stage-foot{position:absolute;left:20px;right:20px;bottom:17px;display:flex;justify-content:space-between;gap:10px;font-size:10px;color:#687f80}.stage-foot>span:first-child{display:flex;align-items:center;gap:7px}.status-dot{width:6px;height:6px;border-radius:50%;background:#56a88e;display:inline-block}.tap-hint{color:#3c7e74;white-space:nowrap}.legend{display:flex;justify-content:center;gap:24px;margin-top:12px;font-size:11px;color:#637f87}.legend span{display:flex;gap:6px;align-items:center}.legend i{width:7px;height:7px;border-radius:50%;display:inline-block}.teal{background:#24a5a1}.copper{background:#db884c}.blue{background:#718bc5}.assembly-nav{margin:27px 0 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:20px 0;display:flex;align-items:center;gap:25px}.arrow-control{font-size:14px;min-width:95px;padding:11px 17px;border:1px solid #c9d8d9;border-radius:8px;display:flex;gap:15px;align-items:center;justify-content:center}.arrow-control:hover:not(:disabled){background:#edf4ee}.arrow-control:disabled{opacity:.38}.arrow-control.primary{background:var(--ink);border-color:var(--ink);color:white}.arrow-control.primary:hover{background:#2f5b68}.steps{display:flex;align-items:center;justify-content:center;flex:1;gap:13px}.steps button{display:flex;align-items:center;gap:8px;padding:2px;color:#7c8e94;font-size:11px;white-space:nowrap}.steps button>span:first-child{border:1px solid #cbd9d9;border-radius:50%;width:27px;height:27px;line-height:25px;font-size:10px;text-align:center}.steps button[aria-current="step"]{color:var(--ink);font-weight:700}.steps button[aria-current="step"]>span:first-child{background:#dff2e9;border-color:#96baaa}.steps button.complete>span:first-child{background:var(--ink);border-color:var(--ink);color:white}.step-line{height:1px;width:25px;background:#d1dfdf}.below-note{display:flex;justify-content:space-between;gap:20px;align-items:center;font-size:12px;padding:18px 0 30px}.below-note p{margin:0}.tiny-tag{font-size:9px;letter-spacing:1.2px;color:#729088;margin-right:13px}.below-note button{font-size:12px;color:#438a79;padding:0;text-align:right}footer{font-size:9px;color:#73888f;letter-spacing:1.3px;border-top:1px solid var(--line);padding:16px 0 22px;display:flex;justify-content:space-between;gap:16px}footer span{letter-spacing:0;font-size:10px}footer button{padding:0;font-size:10px;text-decoration:underline}dialog{border:1px solid #cbded9;border-radius:18px;padding:32px;width:min(560px,calc(100vw - 32px));max-height:85vh;overflow-y:auto;color:var(--ink);background:var(--paper);box-shadow:0 20px 70px #163e5133}dialog::backdrop{background:#102c4266;backdrop-filter:blur(5px)}dialog .close{position:absolute;right:17px;top:13px;width:34px;height:34px;font-size:27px;line-height:1;border-radius:50%;background:#e8f0ec}dialog h2{font:36px/1.1 var(--serif);margin:15px 0}dialog p{font-size:15px;color:#536e79;line-height:1.7}dialog .inspector-type{font-size:10px;font-weight:700;letter-spacing:1.3px;display:inline-block;padding:4px 9px;border-radius:4px;background:#dfefe7}dialog .dependency-path{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:13px;border-bottom:1px solid var(--line);padding-bottom:16px;margin-bottom:20px}.dependency-path .path-link{color:#438a79;text-decoration:underline;padding:0;font-size:13px}.dependency-path .link-relation{font-size:10px;color:var(--muted)}.inspection-requirement{border-left:3px solid #7eb6a0;padding:8px 0 8px 16px;margin:22px 0}.inspection-requirement strong{font-size:13px}.inspection-requirement p{font-size:14px;margin:5px 0}.preview-scope{background:#eef3f0;border:1px solid #dbe4df;border-radius:9px;padding:12px 15px;font-size:13px;line-height:1.6;color:#668179}.return-button{background:var(--ink);border-radius:7px;color:white;padding:10px 15px;font-size:14px;margin-top:20px}.inventory{display:grid;gap:12px;margin:22px 0}.inventory-row{border:1px solid #dce5df;border-radius:8px;padding:10px 13px;font-size:14px;display:flex;align-items:center;justify-content:space-between;gap:10px}.inventory-row span{font-size:10px;color:#6e888c}.source-links{display:flex;flex-direction:column;gap:10px;font-size:14px}.paused *{animation-play-state:paused!important}.paused #section-moving{transform:translateY(0)}@keyframes film-vibration{0%,100%{transform:translateY(245px)}50%{transform:translateY(239px)}}@keyframes coil-vibration{0%,100%{transform:translateY(151px)}50%{transform:translateY(145px)}}@keyframes section-motion{0%,100%{transform:translateY(5px)}50%{transform:translateY(-5px)}}@keyframes waves{0%,100%{opacity:.18}50%{opacity:.85}}
@media(min-width:1450px){main{padding:0 64px}.stage{max-height:620px}.intro{padding-top:44px;padding-bottom:38px}.intro h1{font-size:68px}.workbench{gap:65px}.lesson{padding-top:26px}.step-copy h2{font-size:46px}.header,.tracker{padding-left:max(4.4vw,calc((100vw - 1312px)/2));padding-right:max(4.4vw,calc((100vw - 1312px)/2))}}
@media(max-width:1100px){.workbench{gap:28px;grid-template-columns:minmax(265px,.82fr) minmax(0,1.3fr)}.step-nav-label{display:none}.intro h1{font-size:49px}.step-copy h2{font-size:35px}.stage{min-height:405px}.stage-heading{font-size:11px}.scale-label{display:none}.tap-hint{display:none}#speaker-svg{min-height:380px}.legend{gap:14px;font-size:10px}.intro-note{font-size:13px;max-width:250px}.edition{display:none}}
@media(max-width:760px){.header{height:60px;padding:0 20px}.brand{font-size:10px;letter-spacing:1.3px;gap:8px}.brand-icon{font-size:29px}.context-button{font-size:0;gap:0}.context-button span{font-size:21px}.tracker{padding:10px 20px;gap:9px;font-size:12px}.relation{font-size:8px;gap:8px}.tracker-tag{display:none}.crumb-icon{font-size:22px;margin-right:6px}main{padding:0 20px}.intro{padding:24px 0 19px;display:block}.eyebrow{font-size:9px;letter-spacing:1.5px}.intro h1{font-size:40px;letter-spacing:-.6px}.intro-note{display:none}.workbench{display:flex;flex-direction:column;gap:20px;padding-top:18px}.lesson{padding:0}.step-kicker{margin-bottom:9px;font-size:9px;letter-spacing:1.1px;gap:10px}.step-kicker>span:first-child{font-size:20px}.step-copy h2{font-size:30px;max-width:none;margin-bottom:10px}.lede{font-size:15px;margin-bottom:12px;max-width:none;line-height:1.5}.recipe{font-size:14px;max-width:none;line-height:1.8}.recipe p{margin-bottom:7px}.node{font-size:14px;padding:2px 6px}.why{margin:13px 0 0;max-width:none;padding:10px 0;font-size:14px}.why p{font-size:14px}.check,.concept-note{display:none}.stage-toolbar{margin-bottom:8px}.view-switch button,.motion-btn{font-size:11px}.view-switch button{padding:5px 10px}.stage{min-height:0;border-radius:10px}.stage-heading{top:12px;left:13px;right:13px;font-size:10px}.stage-foot{bottom:10px;left:13px;right:13px;font-size:9px}#speaker-svg{min-height:0;margin:18px 0 8px;aspect-ratio:760/600}.part-label .label-name{font-size:20px}.part-label text{font-size:19px}.part-label circle{r:22}.section-label{font-size:23px}.svg-note{font-size:17px}.gap-label{font-size:18px}.legend{margin-top:10px;gap:15px;font-size:9px}.assembly-nav{position:sticky;bottom:0;background:#fafbf8f5;backdrop-filter:blur(12px);z-index:4;margin:20px -20px 0;padding:13px 16px;gap:12px;box-shadow:0 -4px 20px #193a4b05}.arrow-control{min-width:79px;font-size:14px;padding:10px 12px;gap:10px}.steps{gap:5px}.steps button>span:first-child{width:24px;height:24px;line-height:22px;font-size:9px}.step-line{width:9px}.below-note{display:block;padding:17px 0 24px}.below-note p{font-size:11px;margin-bottom:13px}.below-note button{text-align:left;font-size:12px}.tiny-tag{margin-right:8px}footer{font-size:8px;display:block;padding-bottom:16px}footer span{display:block;margin-top:7px;font-size:9px}footer button{font-size:9px}dialog{padding:27px 22px}dialog h2{font-size:32px}}
@media(max-width:370px){main{padding:0 15px}.tracker{padding-left:15px;padding-right:15px}.intro h1{font-size:35px}.assembly-nav{margin-left:-15px;margin-right:-15px;padding:12px 10px;gap:6px}.step-line{width:5px}.steps{gap:3px}.arrow-control{min-width:72px;padding:9px}.legend{gap:10px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}#section-wave{opacity:.45!important}.stage[data-step="3"] #sound-waves{opacity:.6!important}}
@media(min-width:761px){.stage{height:500px;min-height:0}.stage #speaker-svg{height:465px;min-height:0;margin:14px 0;width:100%}.assembly-nav{position:sticky;bottom:0;z-index:4;background:#fafbf8f5;backdrop-filter:blur(12px)}.legend{font-size:14px;gap:20px}.steps button{font-size:14px}.stage-heading{font-size:14px}.stage-foot{font-size:12px}.view-switch button,.motion-btn{font-size:14px}}
@media(min-width:761px) and (max-height:850px){.header{height:64px}.tracker{padding-top:8px;padding-bottom:8px}.intro{padding-top:21px;padding-bottom:22px}.intro h1{font-size:49px}.workbench{padding-top:15px}.stage{height:410px}.stage #speaker-svg{height:370px}.step-kicker{margin-bottom:12px}.step-copy h2{font-size:35px}.lede{margin-bottom:17px}.assembly-nav{padding-top:13px;padding-bottom:13px}.legend{font-size:12px}}
@media(max-width:1100px) and (min-width:761px){.stage-heading{font-size:12px}.stage-foot{font-size:10px}.legend{font-size:11px}.view-switch button,.motion-btn{font-size:12px}.steps button{font-size:12px}}
@media(max-width:760px){.part-label circle{r:40}.part-label text{font-size:32px}.part-label .label-name{display:none}.legend{font-size:12px;gap:10px;flex-wrap:wrap}.view-switch button,.motion-btn{font-size:14px;min-height:40px}.steps button{min-width:27px;min-height:44px}.stage-heading{font-size:12px}.stage-foot{font-size:11px}.stage{margin-left:-6px;margin-right:-6px}.stage #speaker-svg{margin-top:24px}.gap-label{display:none}.section-label{font-size:28px}.section-annotations path:nth-child(2){display:none}}
.tracker{scrollbar-width:none}.tracker::-webkit-scrollbar{display:none}
@media(max-width:760px){.intro h1{font-size:32px;line-height:1.05;letter-spacing:-1px}.workbench{gap:0}.lesson,.step-copy{display:contents}.step-kicker{order:1}.step-copy h2{order:2;font-size:28px;line-height:1.13;margin:0}.visual-column{order:3;margin-top:15px;margin-bottom:15px}.lede{order:4;margin:0 0 10px}.recipe{order:5}.why{order:6}.legend{font-size:11px}.intro{padding-top:19px;padding-bottom:18px}.stage-toolbar{gap:6px}.motion-btn{padding:8px 3px}.stage-foot{font-size:10px}}
@media(max-width:760px){.step-kicker{scroll-margin-top:65px}}