@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap";:root{color:#eaf0f6;--muted:#9ca8b7;--accent:#a4dfff;--line:#ffffff19;font-synthesis:none;background:#03050a;font-family:DM Sans,sans-serif}*{box-sizing:border-box}body{margin:0}button,a,input,summary{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;border:1px solid var(--line);background:#ffffff08;border-radius:6px;padding:8px 12px}button:hover{background:#ffffff20}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px}a{color:inherit;text-decoration:none}main{height:100dvh;min-height:520px;position:relative;overflow:hidden}.stage,#viewport{position:absolute;inset:0}canvas{touch-action:none;width:100%;height:100%;display:block}header{pointer-events:none;width:252px;position:absolute;top:23px;left:24px}.wordmark{letter-spacing:2.5px;pointer-events:auto;font-family:Space Grotesk,sans-serif;font-size:20px;font-weight:700}.edition{letter-spacing:2px;color:#a8b1bd;margin:4px 0 16px;font-size:7px;display:block}h1{letter-spacing:-.5px;margin:0 0 11px;font-size:19px;line-height:1.04}h1 em{color:var(--accent);letter-spacing:-1.5px;font-family:Space Grotesk,sans-serif;font-size:35px;font-style:normal;font-weight:700}.intro{color:#d0d4dc;margin:0 0 14px;font-size:11px;line-height:1.7}.specs{gap:5px;margin-bottom:10px;display:flex}.specs>div{border:1px solid var(--line);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#080e19bd;border-radius:6px;flex:1;padding:8px 10px}.specs small{letter-spacing:1px;color:var(--muted);font-size:7px;display:block}.specs strong{color:var(--accent);margin-top:4px;font:12px Space Grotesk,sans-serif;display:block}article{border:1px solid var(--line);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#080d17b8;border-radius:8px;padding:12px}#lesson-kicker{color:var(--accent);letter-spacing:1px;font-size:8px}h2{font:500 19px/1.2 Space Grotesk,sans-serif}article h2{margin:7px 0;font-size:13px}article>p{color:#c7d0dd;margin:0;font-size:10px;line-height:1.65}.try{color:#c7d0dd;border-top:1px solid var(--line);margin-top:12px;padding-top:10px;font-size:10px;line-height:1.6;display:none}.try span{color:var(--accent);letter-spacing:1px;font-size:8px}.try p{margin:5px 0 0}#learn-toggle{pointer-events:auto;text-align:left;background:#080d17ab;justify-content:space-between;width:100%;margin-top:7px;font-size:10px;display:flex}.controls{border:1px solid var(--line);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#090e18d9;border-radius:10px;width:460px;padding:12px;position:absolute;top:20px;right:20px;box-shadow:0 8px 25px #0005}.control-row{align-items:end;gap:9px;display:flex}.control-row+.control-row{margin-top:9px}.controls label{color:#b8c2ce;margin-bottom:5px;font-size:9px;display:block}.follow{flex:1}.segmented{background:#ffffff05;border-radius:5px;gap:2px;padding:3px;display:flex}.segmented button{white-space:nowrap;color:#b9c2ce;border:0;border-radius:4px;flex:1;padding:6px 10px;font-size:9px}.segmented button[aria-pressed=true]{color:#111724;background:#f1f5fa;box-shadow:0 1px 8px #0003}[data-follow=oxygen][aria-pressed=true]{background:#9ddfff!important}[data-follow=fuel][aria-pressed=true]{background:#fc7!important}[data-follow=fire][aria-pressed=true]{background:#ffa783!important}.slider{width:110px}.slider output{float:right;color:#fff;font-size:9px}input[type=range]{width:100%;accent-color:var(--accent);cursor:pointer;height:14px;margin:8px 0 3px}.control-row>button{height:29px;padding:6px 8px}#ambient-note{color:#8492a3;margin-top:8px;font-size:8px;display:block}.view-switch{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#070e18d9;border:1px solid #ffffff25;border-radius:9px;padding:4px;display:flex;position:absolute;bottom:22px;left:50%;transform:translate(-50%)}.view-switch button{text-align:left;background:0 0;border:0;align-items:center;gap:9px;padding:7px 13px;font-size:10px;display:flex}.view-switch button+button{border-left:1px solid var(--line);border-radius:0}.view-switch button[aria-pressed=true]{background:#ffffff0d;border-radius:5px}.view-switch i{background:#4e5d6b;border-radius:50%;width:5px;height:5px}.view-switch [aria-pressed=true] i{background:#b0e9ff;box-shadow:0 0 7px #b0e9ff}.view-switch small{color:#8593a4;margin-top:3px;font-size:8px;display:block}.stage-bottom{color:#778595;pointer-events:none;gap:4px;font-size:8px;display:grid;position:absolute;bottom:22px;left:22px}.utilities{gap:7px;display:flex;position:absolute;bottom:22px;right:20px}.utilities button{background:#070e18cc;font-size:9px}.utilities [aria-pressed=true]{color:var(--accent);border-color:var(--accent)}.lesson{border:1px solid var(--line);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#080e18ed;border-radius:8px;width:252px;max-height:calc(100dvh - 425px);padding:14px;position:absolute;top:350px;left:24px;overflow:auto}body.learning .lesson{max-height:calc(100dvh - 580px);top:510px}.panel-head{justify-content:space-between;align-items:center;display:flex}.panel-head button{border:0;padding:3px}.eyebrow{letter-spacing:1px;color:var(--accent);font-size:8px}#progress{margin-left:10px}#chapters{grid-template-columns:repeat(6,1fr);gap:4px;margin:12px 0;display:grid}#chapters button{padding:8px 0;font-size:10px}#chapters [aria-current=true]{background:var(--accent);color:#14212b}#experiment-caption{color:var(--muted);font-size:11px;line-height:1.5}.next,#quiz-open{text-align:left;width:100%;margin:4px 0;font-size:10px}details{color:var(--muted);margin-top:14px;font-size:10px;line-height:1.6}summary{cursor:pointer}details a{color:var(--accent);margin-top:7px;display:block}.equation{color:var(--muted);margin-top:14px;font-size:13px}dialog{color:#eaf0f6;background:#0d1521;border:1px solid #536477;border-radius:12px;width:min(1000px,95vw);max-height:90dvh;padding:22px;overflow:auto}dialog::backdrop{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#030609dc}dialog p{color:var(--muted);font-size:12px;line-height:1.7}.dialog-head{justify-content:space-between;align-items:center;margin-bottom:15px;display:flex}.dialog-head button{border:0}#quiz-dialog{max-width:560px}#answers{gap:10px;display:grid}#answers button{text-align:left}.correct{color:var(--accent);border-color:var(--accent)}#feedback{min-height:45px}#render-error{background:#111;padding:20px;position:absolute;inset:40%}.part-label{white-space:nowrap;color:#d7e3f1;pointer-events:none;background:#070b12cf;border:1px solid #ffffff25;border-radius:8px;padding:4px 7px;font-size:8px;position:absolute;transform:translate(-50%,-50%)}.part-label:before{content:"";background:var(--label-color,#a6dafa);border-radius:50%;width:4px;height:4px;margin-right:5px;display:inline-block}#labels{pointer-events:none;position:absolute;inset:0}[hidden]{display:none!important}@media (width<=900px){header{width:210px;top:16px;left:16px}.controls{width:410px;top:14px;right:14px}.segmented button{padding:6px 7px}header article{font-size:10px}.lesson{width:235px;left:16px}}@media (width<=650px){main{min-height:650px}header{width:195px;top:15px;left:14px}.wordmark{font-size:15px}.edition{margin-bottom:10px;font-size:6px}h1{font-size:15px}h1 em{font-size:28px}.intro{font-size:9px}.specs{display:none}header article{margin-top:8px;padding:9px}article h2{font-size:11px}article>p{font-size:9px}#lesson-kicker{font-size:7px}.controls{width:auto;padding:10px;inset:auto 12px 86px}.follow{min-width:0}.slider{width:95px}.control-row{gap:6px}.segmented button{padding:7px 8px;font-size:9px}.control-row:nth-child(2)>div{flex:1}.controls #ambient-note{display:none}.view-switch{bottom:28px}.utilities{flex-direction:column;top:15px;bottom:auto;right:12px}.stage-bottom{justify-content:space-between;font-size:7px;display:flex;bottom:5px;left:14px;right:14px}.lesson,body.learning .lesson{width:240px;max-height:calc(100dvh - 565px);top:340px;left:14px}.part-label{padding:3px 5px;font-size:7px}body{overflow:hidden}.control-row:nth-child(2){grid-template-columns:minmax(0,1fr) minmax(0,1.1fr) 25px 25px;gap:4px;display:grid}.control-row:nth-child(2) .segmented button{padding:7px 4px;font-size:8px}.control-row>button{width:25px;padding:5px}.controls,.segmented{min-width:0}.stage-bottom{font-size:6px}}