:root{--night:#071424;--cream:#f4ead8;--sun:#ffbd59;--coral:#f26c5e;--aqua:#62d9ca;--muted:#a7b2bc}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--night);color:var(--cream);font-family:Manrope,system-ui,sans-serif}button,a{font:inherit}button{color:inherit}#world{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none}
.grain{position:fixed;inset:0;pointer-events:none;z-index:20;opacity:.12;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.32'/%3E%3C/svg%3E");mix-blend-mode:soft-light}
.topbar{position:fixed;z-index:8;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:flex-start;padding:clamp(1.2rem,3vw,2.4rem);pointer-events:none}.brand{display:flex;align-items:center;gap:.8rem;color:var(--cream);text-decoration:none;pointer-events:auto}.brand>span{display:grid;place-items:center;width:46px;height:46px;border:1px solid rgba(244,234,216,.48);border-radius:50%;font:500 .85rem DM Mono}.brand b{font-size:.72rem;line-height:1.25;letter-spacing:.16em}.coordinates{display:grid;grid-template-columns:auto auto;align-items:center;column-gap:.65rem;text-align:right;font-family:DM Mono}.coordinates i{grid-row:1/3;width:8px;height:8px;border-radius:50%;background:var(--coral);box-shadow:0 0 18px var(--coral)}.coordinates span{font-size:1.1rem}.coordinates small{font-size:.6rem;letter-spacing:.14em;color:var(--muted)}
.life-inventory{position:fixed;z-index:9;top:1.45rem;left:50%;transform:translateX(-50%);display:none;align-items:center;gap:.42rem;min-height:42px;padding:.42rem .55rem;border:1px solid rgba(244,234,216,.3);background:rgba(7,20,36,.68);box-shadow:0 10px 30px rgba(7,20,36,.24),0 0 22px rgba(255,189,89,.12);backdrop-filter:blur(10px);pointer-events:none}.life-inventory.is-open{display:flex}.life-inventory b{padding:0 .35rem 0 .15rem;color:var(--muted);font:800 .5rem/1 DM Mono;letter-spacing:.14em}.life-inventory span{display:grid;place-items:center;min-width:42px;height:28px;padding:0 .45rem;border-radius:4px;background:rgba(244,234,216,.1);color:var(--sun);font:800 .58rem/1 DM Mono;letter-spacing:.08em;box-shadow:inset 0 0 0 1px rgba(255,189,89,.28),0 0 14px rgba(255,189,89,.18)}
.intro{position:fixed;z-index:7;inset:0;display:none;align-items:center;padding:clamp(2rem,8vw,8rem);background:linear-gradient(90deg,rgba(7,20,36,.95) 0%,rgba(7,20,36,.74) 45%,transparent 75%)}.intro.is-open{display:flex}.intro-copy{width:min(760px,92vw)}.kicker{margin:0 0 1rem;font:500 .72rem DM Mono;letter-spacing:.22em;color:var(--aqua)}h1{margin:0;font-size:clamp(3.2rem,8.8vw,8.7rem);line-height:.82;letter-spacing:-.065em;font-weight:800}h1 em{font-style:normal;color:var(--coral)}.lede{width:min(560px,90%);font-size:clamp(1rem,1.7vw,1.28rem);line-height:1.65;color:#d6d7d5;margin:2rem 0}.ride-button{display:flex;align-items:center;gap:1.3rem;border:0;background:transparent;cursor:pointer;padding:0;font-weight:800;letter-spacing:.08em}.ride-button span{padding:.95rem 1.3rem;background:var(--cream);color:var(--night)}.ride-button i{display:grid;place-items:center;width:48px;height:48px;border:1px solid rgba(244,234,216,.45);border-radius:50%;font-style:normal;transition:.2s}.ride-button:hover i{background:var(--coral);border-color:var(--coral);transform:translateX(5px)}.controls{display:flex;gap:1.2rem;flex-wrap:wrap;margin-top:2rem;color:var(--muted);font:400 .68rem DM Mono}.controls kbd{color:var(--cream);font:inherit;border:1px solid rgba(244,234,216,.35);padding:.2rem .35rem;border-radius:3px}.intro-index{position:absolute;right:6vw;bottom:8vh;display:flex;align-items:end;gap:1rem}.intro-index b{font-size:5rem;line-height:.8;color:transparent;-webkit-text-stroke:1px rgba(244,234,216,.55)}.intro-index span{font:500 .65rem/1.6 DM Mono;letter-spacing:.13em;color:var(--muted)}
.timeline{position:fixed;z-index:6;left:clamp(1.1rem,3vw,2.5rem);top:20%;bottom:20%;display:none;gap:.8rem}.timeline.is-open{display:flex}.timeline-track{position:relative;width:1px;background:rgba(244,234,216,.2)}.timeline-track i{position:absolute;left:0;top:0;width:1px;height:0;background:var(--sun);box-shadow:0 0 8px var(--sun)}.timeline ol{list-style:none;padding:0;margin:0;height:100%;display:flex;flex-direction:column;justify-content:space-between}.timeline li{display:flex;align-items:center;gap:.55rem;font:500 .75rem DM Mono;letter-spacing:.08em;color:rgba(244,234,216,.8);transition:.25s}.timeline li:before{content:"";width:5px;height:5px;border:1px solid currentColor;border-radius:50%;margin-left:-11px;background:var(--night)}.timeline li button{-webkit-appearance:none;appearance:none;border:1px solid rgba(244,234,216,.12);padding:.34rem .5rem;background:rgba(7,20,36,.78);color:inherit;font:inherit;letter-spacing:inherit;line-height:1;cursor:pointer;border-radius:4px;box-shadow:0 3px 14px rgba(7,20,36,.24);transition:background .2s,color .2s,border-color .2s}.timeline li button:hover,.timeline li button:focus-visible{color:var(--sun);background:rgba(7,20,36,.96);border-color:rgba(255,189,89,.55);outline:1px solid rgba(255,189,89,.55);outline-offset:2px}.timeline li.active{color:var(--sun);transform:translateX(4px)}.timeline li.reached{color:var(--cream)}
.ride-hud{position:fixed;z-index:6;left:0;right:0;bottom:0;display:none;align-items:end;gap:1.4rem;padding:1.2rem clamp(1.2rem,3vw,2.5rem);background:linear-gradient(transparent,rgba(7,20,36,.82));pointer-events:none}.ride-hud.is-open{display:flex}.pause{pointer-events:auto;width:44px;height:44px;border:1px solid rgba(244,234,216,.35);border-radius:50%;background:rgba(7,20,36,.4);cursor:pointer}.speed{display:flex;align-items:end;gap:.35rem}.speed b{font:500 2.5rem/1 DM Mono}.speed span{font:500 .55rem DM Mono;color:var(--muted);margin-bottom:.25rem}.route-progress{flex:1;display:grid;grid-template-columns:auto 1fr auto;gap:.7rem;align-items:center;font:500 .55rem DM Mono;letter-spacing:.1em}.route-progress>div{height:2px;background:rgba(244,234,216,.2)}.route-progress i{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--coral),var(--sun))}.money-total{display:grid;gap:.15rem;text-align:right;font-family:DM Mono;letter-spacing:.1em}.money-total span{font-size:.5rem;color:var(--muted)}.money-total b{position:relative;display:inline-block;font-size:1.15rem;line-height:1;color:var(--sun);font-weight:500;text-shadow:0 0 0 rgba(255,189,89,0)}.money-total b.score-pop{animation:scorePop .48s cubic-bezier(.12,.9,.22,1)}.money-total b.score-pop:after{content:attr(data-delta);position:absolute;right:0;bottom:100%;white-space:nowrap;color:var(--cream);font:800 .7rem/1 DM Mono;text-shadow:0 0 14px rgba(255,189,89,.9);animation:scoreFloat .48s cubic-bezier(.12,.9,.22,1) both}.money-total b.score-loss{color:var(--coral);animation:scoreShake .42s cubic-bezier(.12,.9,.22,1)}.money-total b.score-loss:after{color:var(--coral);text-shadow:0 0 14px rgba(242,108,94,.95)}.money-total b.score-win:after{color:var(--aqua);text-shadow:0 0 14px rgba(98,217,202,.95)}.sound-note{font:500 .58rem DM Mono;color:var(--muted);letter-spacing:.12em}
@keyframes scorePop{0%{transform:scale(.86);color:var(--cream);text-shadow:0 0 0 rgba(255,189,89,0)}38%{transform:scale(1.36);color:var(--cream);text-shadow:0 0 22px rgba(255,189,89,.9)}100%{transform:scale(1);color:var(--sun);text-shadow:0 0 0 rgba(255,189,89,0)}}@keyframes scoreFloat{0%{opacity:0;transform:translateY(.45rem) scale(.8)}22%{opacity:1}100%{opacity:0;transform:translateY(-1rem) scale(1.15)}}@keyframes scoreShake{0%,100%{transform:translateX(0);text-shadow:0 0 0 rgba(242,108,94,0)}25%{transform:translateX(-3px);text-shadow:0 0 16px rgba(242,108,94,.9)}55%{transform:translateX(3px) scale(1.12);text-shadow:0 0 22px rgba(242,108,94,1)}}
.milestone{position:fixed;z-index:12;right:0;top:0;width:min(620px,100%);height:100%;padding:clamp(5rem,8vw,8rem) clamp(2rem,5vw,5rem);background:rgba(7,20,36,.97);border-left:1px solid rgba(244,234,216,.18);transform:translateX(105%);transition:transform .55s cubic-bezier(.2,.8,.2,1);overflow:auto}.milestone.is-open{transform:none}.milestone-close{position:absolute;right:1.5rem;top:1.5rem;width:42px;height:42px;border:1px solid rgba(244,234,216,.35);border-radius:50%;background:transparent;font-size:1.5rem;cursor:pointer}.milestone-number{position:absolute;right:2rem;top:6rem;color:transparent;-webkit-text-stroke:1px rgba(244,234,216,.14);font-size:8rem;font-weight:800;line-height:1}.milestone-content{position:relative}.milestone-years{margin:0;color:var(--sun);font:500 .8rem DM Mono;letter-spacing:.12em}.milestone h2{font-size:clamp(2.5rem,6vw,4.8rem);line-height:.95;letter-spacing:-.045em;margin:.7rem 0}.milestone h3{font-size:1rem;color:var(--aqua);font-weight:600;line-height:1.5;margin:0 0 1.5rem}.milestone-content>p:not(.kicker):not(.milestone-years){color:#c9ced2;line-height:1.75;font-size:.98rem}.milestone ul{display:flex;gap:.5rem;flex-wrap:wrap;list-style:none;padding:0;margin:1.7rem 0}.milestone li{padding:.4rem .65rem;border:1px solid rgba(244,234,216,.22);border-radius:999px;font:500 .62rem DM Mono;color:var(--cream)}.project-link{display:none;color:var(--aqua);font:500 .7rem DM Mono;letter-spacing:.1em;text-decoration:none;margin:0 0 1.5rem}.project-link.is-open{display:block}.continue-button{width:100%;display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:.75rem;border:0;border-top:1px solid rgba(244,234,216,.25);padding:1rem 0;background:transparent;cursor:pointer;text-align:left;font-weight:700;font-size:.78rem;letter-spacing:.12em}.continue-button small{color:var(--muted);font:500 .62rem DM Mono;letter-spacing:.1em}.continue-button kbd{color:var(--cream);font:inherit;border:1px solid rgba(244,234,216,.35);padding:.18rem .32rem;border-radius:3px}.continue-button i{color:var(--coral);font-style:normal;font-size:1.2rem}
.mobile-controls{display:none;position:fixed;z-index:7;left:.8rem;right:.8rem;bottom:5.3rem;justify-content:space-between;align-items:center;pointer-events:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.mobile-control-group{display:flex;gap:.45rem;pointer-events:none}.mobile-controls button{display:grid;place-content:center;gap:.05rem;pointer-events:auto;width:64px;height:64px;padding:0;border-radius:50%;border:1px solid rgba(244,234,216,.48);background:rgba(7,20,36,.68);color:var(--cream);font:500 .6rem DM Mono;line-height:1;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;cursor:pointer;box-shadow:0 6px 24px rgba(7,20,36,.3);transition:transform .12s,background .12s,border-color .12s}.mobile-controls button b{font:500 1.25rem/1 DM Mono}.mobile-controls button span{font-size:.48rem;letter-spacing:.08em}.mobile-controls button.is-pressed{transform:scale(.92);background:rgba(255,189,89,.8);border-color:var(--sun);color:var(--night)}.mobile-controls .mobile-brake{background:rgba(242,108,94,.76)}.mobile-controls .mobile-ride{background:rgba(98,217,202,.72);color:var(--night)}.mobile-controls .mobile-honk{background:rgba(255,189,89,.82);color:var(--night);border-color:rgba(255,236,184,.85);box-shadow:0 6px 24px rgba(7,20,36,.3),0 0 20px rgba(255,189,89,.32)}
@media(max-width:760px){.intro{padding:6rem 1.4rem 5rem;background:rgba(7,20,36,.76);align-items:end}.intro-index{display:none}.controls{display:none}.timeline{left:.9rem;top:17%;bottom:27%}.sound-note{display:none}.brand b{display:none}.life-inventory{top:4.4rem;max-width:72vw;overflow:hidden}.life-inventory span{min-width:36px;font-size:.5rem}.milestone{border-left:0}.route-progress>span{display:none}.route-progress{grid-template-columns:1fr}.money-total span{display:none}.money-total b{font-size:.9rem}.mobile-controls.is-open{display:flex}.ride-hud{bottom:0}.coordinates small{display:none}}
@media(prefers-reduced-motion:reduce){.milestone,.ride-button i{transition:none}}