@font-face{font-family:Manrope;src:url('./assets/manrope-regular.ttf') format('truetype');font-weight:200 500;font-display:swap}
@font-face{font-family:Manrope;src:url('./assets/manrope-semibold.ttf') format('truetype');font-weight:600 800;font-display:swap}
:root{color-scheme:dark;--paper:#edf0e8;--ink:#151b18;--muted:#aeb8af;--line:#414a43;--green:#b7edcf;--rust:#ff795e;--ochre:#eac780;--panel:#212a24;--font:Manrope,Arial,sans-serif;--gutter:clamp(22px,4.5vw,76px)}
html{scroll-padding-top:70px;scrollbar-color:#78897a #151b18}body{background:var(--ink);color:var(--paper);font:15px/1.65 var(--font)}::selection{background:var(--green);color:var(--ink)}a{text-decoration:none}button{color:var(--paper);border-color:var(--line);border-radius:3px;padding:12px 18px;transition:background .2s,color .2s}button:hover{background:#364339;border-color:#8ea795}:focus-visible{outline:2px solid var(--green)!important;outline-offset:5px}h1,h2,h3{font-family:var(--font);font-weight:500;line-height:1.1;letter-spacing:-.035em;text-wrap:balance}h2{font-size:clamp(34px,4.2vw,64px)}h3{font-size:21px}svg.icon{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}[hidden]{display:none!important}.skip-link{position:fixed;top:-100px;left:20px;z-index:100;background:var(--green);color:var(--ink);padding:12px}.skip-link:focus{top:12px}main{padding:0;max-width:none}.masthead{height:90px;padding:0 var(--gutter);max-width:none;border:0;position:absolute;inset:0 0 auto;z-index:5}.wordmark{font-size:16px;gap:12px}.wordmark svg{width:30px;height:30px;stroke-width:1.5}.masthead nav{display:flex;align-items:center;gap:35px;font-size:12px}.masthead nav a:hover{color:var(--green)}.nav-lab{display:flex;align-items:center;gap:18px;border-bottom:1px solid #7b8c7d;padding:8px 0}.edition{font-size:10px;color:var(--muted);margin-left:22px;border-left:1px solid var(--line);padding-left:20px;letter-spacing:.04em}.brand-group{display:flex;align-items:center}
.hero{position:relative;min-height:820px;height:100svh;max-height:1100px;overflow:hidden;background:#151b18}.hero:after{content:'';position:absolute;inset:auto var(--gutter) 0;height:1px;background:var(--line)}.hero-copy{position:absolute;top:clamp(145px,19vh,225px);left:var(--gutter);z-index:2;max-width:550px;pointer-events:none}.hero h1{font-size:clamp(66px,7.6vw,96px);line-height:.99;letter-spacing:-.04em}.hero h1 span{display:block;color:var(--green)}.hero-copy p{font-size:15px;line-height:1.7;color:var(--muted);max-width:300px;margin:26px 0 28px}.hero-copy a{pointer-events:auto}.cta{display:inline-flex;align-items:center;gap:35px;background:var(--green);color:var(--ink);padding:15px 21px;font-size:12px;font-weight:700;border-radius:2px;transition:background .2s,transform .2s}.cta:hover{background:#d4f5e3;transform:translateY(-2px)}.hero-scene{position:absolute;width:70%;height:76%;right:-5%;top:19%}.scene-canvas{display:block;width:100%;height:100%;touch-action:pan-y;cursor:grab;outline-offset:-5px}.scene-canvas.dragging{cursor:grabbing}.scene-caption{position:absolute;bottom:2%;left:35%;font-size:10px;letter-spacing:.04em;color:var(--muted);display:flex;align-items:center;gap:10px;pointer-events:none}.scene-caption svg{width:17px}.hero-top-note{position:absolute;right:var(--gutter);top:140px;width:220px;color:var(--muted);font-size:11px;line-height:1.8;text-align:right}.hero-bottom{position:absolute;bottom:30px;left:var(--gutter);right:var(--gutter);display:flex;align-items:end;justify-content:space-between;font-size:11px;z-index:2}.hero-bottom>div{display:flex;align-items:center;gap:24px}.hero-bottom .live{display:flex;align-items:center;gap:8px}.live i{width:5px;height:5px;border-radius:50%;background:var(--green);display:inline-block}.hero-bottom .muted{color:var(--muted)}.hero-pause{font-size:11px;padding:5px 12px}.scroll-link{display:flex;gap:22px;align-items:center}.hero-index{position:absolute;left:var(--gutter);bottom:135px;color:var(--muted);font-size:10px;max-width:170px;line-height:1.8}.hero-index:before{content:'';display:block;width:40px;height:1px;background:var(--line);margin-bottom:14px}
.story{background:#d98360;color:#241c17;padding:100px var(--gutter);display:grid;grid-template-columns:1.1fr 1fr;gap:12%;position:relative}.story-intro{position:sticky;top:110px;align-self:start}.story-intro h2{font-size:clamp(46px,5.1vw,76px);max-width:560px}.story-intro>p{max-width:340px;font-size:14px;margin-top:26px}.story-glyph{margin-top:45px;height:105px;display:flex;align-items:center;gap:8px;overflow:hidden;border-block:1px solid #855d46}.story-glyph i{display:block;width:37px;height:14px;flex-shrink:0;background:#442c20;border-radius:3px;transition:transform .65s cubic-bezier(.16,1,.3,1),background .4s}.story-glyph i:nth-child(-n+4){background:#f8e5c7}.story-glyph[data-phase='1'] i:nth-child(5){transform:translateX(-20px)}.story-glyph[data-phase='1'] i:nth-child(6){transform:translateX(-18px)}.story-glyph[data-phase='2'] i:nth-child(n+4){transform:translateX(40px)}.story-glyph[data-phase='2'] i:nth-child(-n+3){background:#442c20}.story-glyph[data-phase='2'] i:nth-child(n+6){background:#f8e5c7}.story-glyph-label{display:flex;justify-content:space-between;font-size:10px;margin-top:9px}.story-step{min-height:340px;padding:32px 0 80px;border-top:1px solid #855d46;opacity:.65;transition:opacity .4s}.story-step.active{opacity:1}.story-step:last-child{min-height:270px;padding-bottom:15px}.story-step h3{font-size:clamp(27px,3vw,39px);margin:0 0 22px;max-width:370px}.story-step p{font-size:14px;max-width:410px}.story-step .story-fact{font-size:11px;display:flex;gap:16px;align-items:center;padding-top:20px}.story-fact svg{width:32px;height:24px;stroke:currentColor;fill:none;stroke-width:1.2}.story-bottom-link{display:inline-flex;align-items:center;gap:25px;border-bottom:1px solid;padding-bottom:6px;font-size:12px;font-weight:700}
.experiment{padding:95px var(--gutter) 0;max-width:1680px;margin:auto}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:40px;margin-bottom:45px}.section-heading>p{max-width:320px;color:var(--muted);font-size:13px;margin:0}.section-heading h2{max-width:600px}.lab{grid-template-columns:minmax(0,1.65fr) minmax(300px,1fr)}.road-panel{background:#1b231e;padding:24px 26px;position:relative;display:flex;flex-direction:column}.live-label{font-size:11px}.live-label i{background:var(--green)}.measurement{color:var(--muted)}.road-wrap{height:400px;flex:1;min-height:340px}.road-wrap canvas{position:absolute;inset:0}.camera-controls{display:flex;gap:2px;margin-top:18px;width:max-content;border:1px solid var(--line);padding:3px;position:relative;z-index:1}.camera-controls button{font-size:10px;padding:6px 12px;border:0;border-radius:0}.camera-controls button[aria-pressed=true]{background:#3b4c40;color:var(--paper)}.camera-hint{font-size:10px;color:var(--muted);position:absolute;bottom:16px;left:0;right:0;text-align:center;pointer-events:none}.car-inspector{position:absolute;left:0;bottom:40px;color:var(--green);font:11px 'Courier New',monospace;padding:9px 12px;background:#151b18;border:1px solid var(--line)}.road-footer{border-top:1px solid var(--line);padding-top:18px;gap:15px}.road-center{position:static;transform:none;text-align:left;pointer-events:auto;width:auto;display:flex;align-items:center;gap:9px}.road-center strong{font:400 33px/1 var(--font)}.road-center>div{font-size:9px;color:var(--muted);line-height:1.8}.road-center #flow-state{color:var(--paper);font-size:11px}.legend{font-size:9px}.legend i{width:6px;height:6px;border-radius:50%}.controls{padding:30px 0 30px 35px}.controls h3{font-size:22px;margin:0}.control-intro{font-size:12px;max-width:360px;margin-top:12px}.presets{gap:5px;margin:22px 0 30px}.presets button{font-size:10px;padding:9px 10px;flex:1;white-space:nowrap;border-radius:3px}.presets button.selected{background:var(--green);color:var(--ink);border-color:var(--green)}.slider-group{margin-bottom:25px}.slider-group label{font-size:12px}.slider-group output{font-size:12px;color:var(--green)}.slider-group input[type=range]{appearance:none;height:25px;background:transparent;margin:10px 0 0;--fill:37.5%}input[type=range]::-webkit-slider-runnable-track{height:3px;background:linear-gradient(to right,var(--green) var(--fill),#49594c var(--fill))}input[type=range]::-webkit-slider-thumb{appearance:none;width:13px;height:13px;background:var(--green);border-radius:50%;margin-top:-5px;border:3px solid #b7edcf;box-shadow:0 2px 5px #0005}input[type=range]::-moz-range-track{height:3px;background:#49594c}input[type=range]::-moz-range-progress{background:var(--green);height:3px}input[type=range]::-moz-range-thumb{width:12px;height:12px;border:0;border-radius:50%;background:var(--green)}.range-ends{font-size:9px}.slider-group p{font-size:10px}.check-label{font-size:11px}.check-label input{accent-color:var(--green)}.reset-note{margin:6px 0 20px}.primary{background:var(--green);color:var(--ink);border-color:var(--green)}.primary:hover{background:#d2f8e4;border-color:#d2f8e4}.playback button,.playback select{font-size:11px}.playback .primary{min-width:85px}.playback select{background:var(--ink);color:var(--paper)}.experiment-note{font-size:10px;max-width:350px}
.history-section{padding:50px 0 55px;border-bottom:0}.history-heading h2{font-size:28px}.history-heading p{max-width:550px;margin-top:13px}#history{height:190px;background:#1b231e}.measurements{font-size:11px}.measurements strong{color:var(--green)}.guard-note{color:var(--rust)}.evidence{background:#e5e9df;color:#25372c;padding:90px var(--gutter)}.explanation{max-width:1400px;margin:auto;grid-template-columns:1fr 1.2fr;gap:100px;padding:0 0 70px;border-bottom-color:#a4b0a0}.explanation-title h2{font-size:clamp(40px,4.2vw,64px);max-width:450px}.explanation-title p{max-width:300px;font-size:14px;margin-top:24px;color:#52604f}.explanation-body h3{font-size:19px;letter-spacing:-.02em;margin-bottom:12px;line-height:1.4}.explanation-body>p{font-size:13px;color:#52604f;margin-bottom:30px}details{border-color:#a4b0a0;padding:16px 0}summary{font-size:12px}.rules{font-size:12px;color:#52604f}.rules a{text-decoration:underline}.rules pre{background:#d6ddd0;color:#25372c}.verification{max-width:1400px;margin:auto;grid-template-columns:1fr 1.2fr;gap:100px;padding:65px 0 0}.verification h2{font-size:40px;max-width:420px}.verification>div>p{color:#52604f;margin:20px 0}.verification .primary{background:#25372c;color:#e5e9df;border-color:#25372c}.verification .primary:hover{background:#405a46}#verify{display:inline-flex;align-items:center;gap:30px}.verification-results,.verification-row{border-color:#a4b0a0}.verification-row{padding:15px 0}.verification-row h3{gap:12px;letter-spacing:0;line-height:1.5}.verification-row h3 span{color:#315d3d;padding-top:3px}.verification-row.fail h3 span{color:#943722}.verification-row p{color:#52604f}.empty-results{max-width:440px}.evidence :focus-visible,.story :focus-visible{outline-color:#25372c!important}
.endnote{padding:90px var(--gutter) 55px;display:flex;align-items:end;justify-content:space-between;gap:30px}.endnote h2{font-size:clamp(46px,5.4vw,80px)}.endnote h2 span{color:var(--green)}.endnote a{width:65px;height:65px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:50%;transition:background .2s}.endnote a:hover{background:#35463a}.endnote svg{width:28px;height:28px}footer{max-width:none;padding:25px var(--gutter);font-size:10px}footer a{text-decoration:underline}.scroll-progress{position:fixed;left:0;top:0;height:2px;width:100%;transform-origin:left;transform:scaleX(0);background:var(--green);z-index:20;pointer-events:none}
@media(min-width:1600px){.hero-scene{right:0;width:67%}}
@media(max-width:1050px){.hero-copy{top:150px}.hero h1{font-size:78px}.hero-scene{width:76%;right:-13%;top:28%;height:66%}.hero-top-note{top:125px}.hero-index{bottom:120px}.story{gap:8%}.lab{grid-template-columns:minmax(0,1.3fr) minmax(295px,1fr)}.controls{padding-left:25px}.road-panel{padding:20px 18px}.road-footer{align-items:start;flex-direction:column}.road-wrap{min-height:340px}.explanation,.verification{gap:50px}.masthead .edition{display:none}}
@media(max-width:700px){html{scroll-padding-top:20px}.masthead{height:76px}.wordmark{font-size:14px}.wordmark svg{width:25px;height:25px}.masthead nav{gap:20px;font-size:11px}.masthead nav a:first-child{display:none}.nav-lab{gap:10px}.hero{min-height:780px;height:100svh;max-height:920px}.hero-copy{top:120px;max-width:90%}.hero h1{font-size:clamp(58px,12vw,78px)}.hero-copy p{font-size:13px;max-width:270px;margin:20px 0}.hero-copy .cta{font-size:11px;padding:12px 16px;gap:28px}.hero-top-note,.hero-index{display:none}.hero-scene{top:350px;height:350px;width:110%;right:-5%}.scene-caption{bottom:0;left:0;right:0;justify-content:center;font-size:9px}.hero-bottom{bottom:25px;font-size:9px;align-items:center;gap:15px}.hero-bottom>div{gap:10px}.hero-bottom .muted{display:none}.hero-pause{font-size:9px;padding:5px 9px}.scroll-link{gap:8px}.story{padding-block:65px;grid-template-columns:1fr;gap:45px}.story-intro{position:relative;top:auto}.story-intro h2{font-size:48px}.story-intro>p{max-width:360px;font-size:13px}.story-glyph{margin-top:25px;height:75px}.story-glyph i{width:30px}.story-step{min-height:0;padding:25px 0 30px;opacity:1}.story-step:last-child{min-height:0}.story-step h3{font-size:28px;max-width:none;margin-bottom:15px}.story-step p{font-size:13px}.story-step .story-fact{padding-top:0}.experiment{padding-top:65px}.section-heading{display:block;margin-bottom:30px}.section-heading h2{font-size:43px;max-width:400px}.section-heading>p{margin-top:20px;max-width:350px;font-size:12px}.lab{grid-template-columns:1fr}.road-panel{padding:20px 16px}.road-wrap{height:320px;min-height:320px;flex:auto}.camera-controls{margin-top:15px}.road-footer{flex-direction:row;align-items:center;justify-content:space-between}.road-center strong{font-size:29px}.legend{font-size:8px;gap:8px}.controls{padding:30px 0}.controls h3{font-size:25px}.presets button{font-size:11px;padding:10px 7px}.slider-group label{font-size:13px}.slider-group input[type=range]{height:34px}.range-ends,.slider-group p,.reset-note,.experiment-note{font-size:11px}.check-label{font-size:12px}.playback button{padding:13px 21px;font-size:12px}.history-section{padding-top:35px}.history-heading{display:block}.history-heading h2{font-size:29px}.history-heading>.measurement{display:block;margin:0 0 18px}#history{height:165px}.measurements{padding-left:0;gap:15px;flex-wrap:wrap;font-size:10px}.measurements strong{margin-left:6px}.history-grid{grid-template-columns:29px minmax(0,1fr);gap:4px}.axis-labels{font-size:9px}.guard-note{margin-left:0}.evidence{padding-block:60px}.explanation,.verification{grid-template-columns:1fr;gap:30px}.explanation{padding-bottom:45px}.explanation-title h2{font-size:45px}.explanation-title p{max-width:350px}.verification{padding-top:45px}.verification h2{font-size:36px}.verification>div>p{font-size:12px}.endnote{padding-block:60px 40px}.endnote h2{font-size:44px}.endnote a{width:48px;height:48px;flex-shrink:0}footer{font-size:9px;flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}.story-step{opacity:1}}
/* Keep data and controls readable at every viewport. */
.edition,.hero-index,.scene-caption,.hero-bottom,.hero-pause,.story-glyph-label,.story-fact,.camera-controls button,.camera-hint,.legend,.range-ends,.slider-group p,.reset-note,.experiment-note,.check-label span,.time-labels,.axis-labels,.measurements,footer,.presets button,.road-center>div{font-size:11px}
.story-intro,.story-steps{min-width:0}.story-glyph{width:100%;min-width:0}.wordmark{white-space:nowrap}.hero h1{font-weight:600}.story-step{opacity:1}.story-step.active h3{color:#241c17}.story-step h3{color:#553a2b}.road-footer{flex-wrap:wrap}.camera-controls button{min-height:35px}.hero-pause{min-height:35px}
@media(max-width:700px){.masthead nav a:not(.nav-lab){display:none}.masthead nav{gap:0}.nav-lab{font-size:11px;gap:10px}.nav-lead{display:none}.story{grid-template-columns:minmax(0,1fr)}.hero-scene{top:390px;height:310px}.hero{min-height:810px}.hero-bottom{align-items:start}.hero-bottom>div{gap:8px;flex-wrap:wrap}.hero-bottom .live{font-size:10px}.road-footer{gap:14px}.road-center{width:auto}.hero-copy p{max-width:280px}.scene-caption{bottom:-8px}.hero-bottom .scroll-link{padding-top:8px;white-space:nowrap}.hero-index{display:none}}
.hero-scene .car-inspector{left:35%;bottom:7%;z-index:2}
@media(max-width:700px){.hero-scene .car-inspector{left:10%;bottom:10%}}
