:root{--ink:#193e38;--green:#176d51;--mint:#e7f2e9;--paper:#faf9f3;--line:#c9d8cf;--muted:#4d655e;--gold:#c38b32}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.5 system-ui,-apple-system,Segoe UI,Arial,sans-serif}header,main{max-width:1080px;margin:auto;padding:20px 24px}header{display:flex;align-items:center;justify-content:space-between;gap:16px}.brand{font-size:23px;font-weight:850;letter-spacing:-1px;text-decoration:none}.brand span{display:block;font-size:11px;letter-spacing:1px;font-weight:500}a{color:var(--green);text-underline-offset:4px}a,button,select,input,summary{-webkit-tap-highlight-color:transparent}header>a:last-child{padding:10px 0;min-height:44px}.hero{padding:8px 0 22px}.hero p{margin:6px 0}.eyebrow{font-size:11px;letter-spacing:1.5px;font-weight:800;color:var(--green)}h1{font-size:clamp(28px,4vw,45px);line-height:1.12;letter-spacing:-1.3px;margin:8px 0}h2{font-size:clamp(23px,2.8vw,31px);line-height:1.2;margin:8px 0}h3{font-size:18px;margin:0 0 8px}.journey{display:flex;align-items:center;gap:12px;font-size:13px}.journey label{font-weight:750}.journey select{flex:1}.journey span{white-space:nowrap}select,input{font:inherit;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:9px;padding:10px;min-width:0;max-width:100%;min-height:44px}progress{display:block;width:100%;height:5px;margin:12px 0 22px;accent-color:var(--green);border:0}.scene{border:1px solid var(--line);border-radius:22px;background:white;padding:26px;overflow-wrap:anywhere}.scene-heading p{margin:10px 0 20px;max-width:700px}.workspace{display:grid;grid-template-columns:1.1fr 1fr;gap:26px;align-items:start}.workspace>*{min-width:0}.model{background:var(--mint);border-radius:16px;padding:20px}.model:empty{display:none}.model p{margin:10px 0}.formula{font-size:clamp(26px,3vw,38px);line-height:1.5;text-align:center;margin:16px 0;font-weight:750}.formula sub{font-size:.55em}.formula sup{font-size:.65em}.kicker{font-size:12px;text-transform:uppercase;letter-spacing:1px;color:var(--muted)}.control{display:block;margin:16px 0 0;font-size:14px;font-weight:650}input[type=range]{width:100%;padding:0;accent-color:var(--green);background:transparent;border:0}.steps{display:flex;gap:5px;flex-wrap:wrap;margin:10px 0}.power-tile{flex:1;min-width:52px;border:1px solid #b4cdbd;border-radius:8px;text-align:center;padding:7px 3px;background:#f7fcf7}.power-tile b{display:block;font-size:23px}.power-tile small{font-size:11px}.power-tile.active{background:var(--green);color:white}.dots{display:grid;grid-template-columns:repeat(8,1fr);gap:5px;max-width:260px;margin:12px auto;min-height:55px;align-content:start}.dot{aspect-ratio:1;border-radius:50%;background:var(--green)}.inverse{display:flex;align-items:center;justify-content:center;gap:15px}.inverse span{background:#fff;border-radius:12px;padding:10px 16px}.bridge{display:grid;gap:8px;text-align:center}.bridge p{font-size:14px}.bridge .formula{margin:0}.rule{padding:10px 12px;border-left:3px solid var(--green);background:#fff;border-radius:0 8px 8px 0}.rule small{display:block;color:var(--muted)}.question{border-bottom:1px solid var(--line);padding:0 0 16px;margin:0 0 18px}.question:last-child{margin-bottom:0}.question label{display:block;font-weight:700;margin:0 0 10px}.answer-row{display:flex;gap:8px}.answer-row input{width:100%;font-size:21px}.answer-row button{flex-shrink:0}button,.button{font:700 15px/1.35 system-ui;color:var(--ink);border:1px solid var(--line);border-radius:10px;background:#fff;min-height:44px;padding:10px 15px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center}.primary{background:var(--green);color:white;border-color:var(--green)}button:disabled{opacity:.5;cursor:default}.choices{display:flex;flex-wrap:wrap;gap:7px}.choices button{flex:1 1 100px}.choices button[aria-pressed=true]{border:2px solid var(--green);background:var(--mint)}.feedback{margin:10px 0 0;font-size:14px}.feedback:empty{display:none}.feedback.good{color:#155b41}.feedback.bad{color:#8d301e;background:#fff4e9;padding:10px;border-radius:8px}.hint{margin-top:10px;font-size:14px;color:var(--muted)}.hint summary{cursor:pointer;min-height:44px;padding:9px 0}.scene-navigation{display:flex;gap:12px;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding-top:18px;margin-top:24px}.scene-navigation span{font-size:12px;flex:1;text-align:center;color:var(--muted)}.discoveries{margin-top:18px;border:1px solid var(--line);border-radius:14px;padding:12px 18px;background:#f0f5ed}.discoveries summary{cursor:pointer;min-height:34px;font-weight:700}.discoveries li{padding:8px 0;font-size:15px}.small,footer{font-size:13px;color:var(--muted)}footer{margin-top:22px}.takeaway{text-align:center;background:var(--mint);padding:22px;border-radius:14px}.takeaway strong{display:inline-block;font-size:clamp(24px,3vw,36px);margin:12px 0}.practice-links{display:flex;gap:10px;flex-wrap:wrap}.practice-links a{flex:1}.board{margin-top:16px;border-color:var(--green)}.graph-buttons{display:flex;flex-wrap:wrap;gap:8px}.graph-buttons button[aria-pressed=true]{background:var(--green);color:#fff}.graph{width:100%;height:auto;display:block;background:#fff;border-radius:12px;margin-top:12px;aspect-ratio:460/300}.graph text{font:14px system-ui;fill:var(--ink)}.graph .grid{stroke:#d8e3dc;stroke-width:1}.graph .axis{stroke:#6b8278;stroke-width:1.5}.graph .curve{stroke:var(--green);stroke-width:3;fill:none}.graph .point{fill:#a9601b;stroke:#fff;stroke-width:2}.point-readout{font-weight:700;font-size:16px;text-align:center}.graph-note{font-size:13px}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #bb7718;outline-offset:3px}[hidden]{display:none!important}@media(max-width:720px){.workspace{grid-template-columns:1fr;gap:20px}.model{padding:16px}.scene{padding:20px}.hero{padding-top:0}header,main{padding:16px}.scene-heading p{margin-bottom:16px}}@media(max-width:400px){body{font-size:16px}header,main{padding:12px}.hero{padding-bottom:14px}.hero .eyebrow{font-size:9px;letter-spacing:1px}.journey{gap:8px;flex-wrap:wrap}.journey label{display:none}.journey select{font-size:13px}.journey span{font-size:12px}.scene{padding:15px;border-radius:15px}.scene-heading p{font-size:15px}.scene-heading h2{font-size:23px}.model{padding:12px}.formula{font-size:27px}.power-tile{min-width:40px}.power-tile b{font-size:20px}.answer-row{flex-wrap:wrap}.answer-row input{flex:1;min-width:100px}.scene-navigation{flex-wrap:wrap;gap:8px}.scene-navigation span{order:3;flex-basis:100%}.scene-navigation button{font-size:14px}.practice-links{display:grid}.graph-buttons button{padding:8px;font-size:13px}.dots{max-width:180px;gap:4px}.question{padding-bottom:12px}.model .kicker{font-size:10px}}@media(prefers-reduced-motion:no-preference){.dot{animation:appear .18s ease-out}@keyframes appear{from{transform:scale(.6)}to{transform:scale(1)}}}
/* Compact introduction on phones: keep the experiment above the fold. */
@media(max-width:480px){header{padding:8px 12px}.brand{font-size:20px}.brand span{display:none}main{padding-top:0}.hero{padding:0 0 8px}.hero .eyebrow,.hero>p:last-child{display:none}.hero h1{font-size:26px;margin:4px 0;line-height:1.15}.journey{gap:8px}.journey select{font-size:12px}progress{height:4px;margin:8px 0 12px}.scene{padding:14px}.scene-heading h2{font-size:22px}.scene-heading p{margin:8px 0 12px;line-height:1.4}.model{padding:12px}.model .formula{font-size:26px;line-height:1.35;margin:8px 0}.model p{margin:8px 0}.power-tile{min-width:0;padding:4px 0}.power-tile b{font-size:18px}.power-tile small{font-size:10px}.steps{gap:4px;margin:8px 0}.dots{max-width:144px;min-height:40px;margin:8px auto}.control{margin-top:8px}.graph text{font-size:22px}}
@media(min-width:481px){header{padding:12px 24px}main{padding-top:0}.hero{padding:0 0 10px}.hero>p:last-child{display:none}.hero h1{font-size:36px;line-height:1.1}.hero .eyebrow{font-size:10px}progress{margin:8px 0 14px}.scene{padding:22px}.scene-heading h2{font-size:28px}.scene-heading p{max-width:none;margin:8px 0 14px}.model{padding:16px}.model p{margin:8px 0}.model .control{margin-top:12px}.graph{max-width:320px;margin:12px auto}.graph text{font-size:22px}}
@media(max-width:480px){.choices button{flex-basis:140px;overflow-wrap:normal}}

/* Keep both lesson buttons left of the floating site navigator. */
.scene-navigation{justify-content:flex-start}.scene-navigation span{order:2}
