:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-synthesis:none;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html,body{background:#050a18;width:100%;height:100%;margin:0;overflow:hidden}button{color:inherit;font:inherit}#game{isolation:isolate;touch-action:none;-webkit-user-select:none;user-select:none;background:radial-gradient(circle at 50% 72%,#505cb133,#0000 34%),linear-gradient(#24325f 0%,#7c476e 38%,#111a36 68%,#050914 100%);width:100%;height:100dvh;min-height:420px;position:relative;overflow:hidden}.skyline{z-index:-2;filter:saturate(.82)brightness(.72);background-image:linear-gradient(#0000 32%,#070c1d2b 58%,#070b15 100%),url(../assets/skyline.png);background-position:50% 57%;background-size:cover;transition:filter 80s linear;position:absolute;inset:0;transform:scale(1.04)}.is-running .skyline{filter:saturate(1.08)brightness(.42)hue-rotate(8deg)}#road{width:100%;height:100%;position:absolute;inset:0}.vignette{pointer-events:none;background:linear-gradient(#01040e2e,#0000 38%,#00020942),radial-gradient(#0000 48%,#00020ca8 118%);position:absolute;inset:0}.topbar{z-index:5;padding:max(18px, env(safe-area-inset-top)) clamp(18px, 3.2vw, 52px) 0;pointer-events:none;justify-content:space-between;align-items:center;display:flex;position:absolute;top:0;left:0;right:0}h1{color:#f3f8ff;letter-spacing:.28em;text-shadow:0 0 22px #6fd0ff66;margin:0;font-size:clamp(1rem,1.8vw,1.6rem);font-weight:820;line-height:1}h1 span{color:#68e4ff}.icon-controls{pointer-events:auto;gap:10px;display:flex}.icon-button,.restart{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);cursor:pointer;background:#080f228a;border:1px solid #b1e1ff3d;border-radius:50%;place-items:center;width:46px;height:46px;padding:0;display:grid;position:relative;box-shadow:inset 0 0 20px #47a0ff0f,0 7px 30px #0000003d}.icon-button svg,.restart svg{fill:none;stroke:#dff9ff;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.7px;width:23px;height:23px}.is-muted{opacity:.45}.hud{z-index:4;color:#effaff;text-align:center;pointer-events:none;grid-template-columns:repeat(2,1fr);gap:4px 44px;width:min(310px,100vw - 40px);display:grid;position:absolute;top:clamp(76px,10vh,112px);left:50%;transform:translate(-50%)}.hud span{color:#daf0ff8f;letter-spacing:.28em;margin-bottom:2px;font-size:.58rem;font-weight:760;display:block}.hud strong{font-variant-numeric:tabular-nums;letter-spacing:.11em;text-shadow:0 0 20px #57e0ff61;font-size:clamp(1rem,2vw,1.35rem)}.run-progress{background:#d2efff24;border-radius:99px;grid-column:1/-1;height:3px;margin-top:7px;overflow:hidden;box-shadow:0 0 16px #3cd7ff1a}.run-progress i{border-radius:inherit;transform-origin:0;background:linear-gradient(90deg,#65e9ff,#bd76ff 74%,#fff1a8);width:100%;height:100%;transition:transform .16s linear;display:block;transform:scaleX(0);box-shadow:0 0 16px #59e6ffb8}.pause-button .play-icon,.pause-button.is-paused .pause-icon{display:none}.pause-button.is-paused .play-icon{display:block}.pause-button.is-paused{background:#124b66b8;border-color:#6eefffdb;box-shadow:0 0 28px #41ddff4d}.speedometer{--speed-angle:0deg;z-index:5;aspect-ratio:1;background:radial-gradient(circle at 50% 52%, #0a142adb 0 44%, #050c1c94 45% 66%, transparent 67%), repeating-conic-gradient(from 235deg, #e1f7ffb8 0 1deg, transparent 1deg 12.5deg);width:clamp(152px,17vw,208px);box-shadow:inset 0 0 34px #41ceff14, 0 12px 40px #00000052, 0 0 28px rgba(73, 219, 255, calc(var(--speed-ratio) * .34));-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);pointer-events:none;border:1px solid #b8e7ff3d;border-radius:50%;position:absolute;bottom:clamp(22px,5vh,54px);right:clamp(22px,4vw,64px)}.speedometer:before{background:conic-gradient(from 235deg, #52e7ff 0deg, #a874ff, #ffbd59 var(--speed-angle), #abd7ee21 var(--speed-angle) 250deg, transparent 250deg);content:"";border-radius:50%;position:absolute;inset:7%;-webkit-mask:radial-gradient(farthest-side,#0000 calc(100% - 10px),#000 calc(100% - 9px));mask:radial-gradient(farthest-side,#0000 calc(100% - 10px),#000 calc(100% - 9px))}.speed-ring{position:absolute;inset:12%}.speed-needle{width:3px;height:40%;transform:rotate(calc(-125deg + var(--speed-angle)));transform-origin:50% 100%;background:linear-gradient(#fff5ce,#ff9c35 72%,#ff4f52);border-radius:4px;transition:transform .12s linear;position:absolute;bottom:50%;left:calc(50% - 1px);box-shadow:0 0 12px #ffa137d9}.speed-hub{background:#17223a;border:3px solid #dff9ff;border-radius:50%;width:14px;height:14px;position:absolute;top:calc(50% - 7px);left:calc(50% - 7px);box-shadow:0 0 12px #61e1ffb8}.speed-readout{align-content:end;justify-items:center;padding-bottom:20%;display:grid;position:absolute;inset:0}.speed-readout strong{color:#f5fbff;font-variant-numeric:tabular-nums;letter-spacing:-.04em;text-shadow:0 0 22px #59e7ff8c;font-size:clamp(1.55rem,3.2vw,2.7rem);font-style:italic;line-height:.9}.speed-readout span{color:#d1edff99;letter-spacing:.24em;margin-top:5px;font-size:.52rem;font-weight:800}.is-paused .vignette{background:linear-gradient(#0206105c,#0206105c),radial-gradient(#0000 40%,#00020cc7 112%)}.is-paused .speedometer,.is-paused .hud{opacity:.72}.is-paused .skyline{filter:saturate(.58)brightness(.3)}.opening-signal{z-index:3;opacity:.86;pointer-events:none;width:min(46vw,420px);height:80px;transition:opacity 1s,transform 1s;position:absolute;bottom:clamp(38px,8vh,82px);left:50%;transform:translate(-50%)}.opening-signal svg{fill:#59e6ff14;stroke:#7aeaff;stroke-width:1.35px;filter:drop-shadow(0 0 13px #4ae1ff94);width:52px;height:52px;animation:2.6s ease-in-out infinite steer-sway;position:absolute;top:4px;left:50%;transform:translate(-50%)}.steer-line{background:linear-gradient(90deg,#0000,#69e7ffa6,#0000);height:1px;position:absolute;top:32px;left:0;right:0}.steer-line:before,.steer-line:after{content:"";border-top:1px solid #79eaff;border-left:1px solid #79eaff;width:9px;height:9px;position:absolute;top:-4px}.steer-line:before{left:4%;transform:rotate(-45deg)}.steer-line:after{right:4%;transform:rotate(135deg)}.is-running .opening-signal{opacity:0;transform:translate(-50%,18px)scale(.94)}.reward{z-index:6;color:#8ff2ff;letter-spacing:.08em;opacity:0;text-shadow:0 0 28px #43e1ffb8;pointer-events:none;font-size:clamp(1.7rem,5vw,4rem);font-style:italic;font-weight:900;transition:opacity .14s,transform .26s cubic-bezier(.2,.9,.3,1.2);position:absolute;top:33%;left:50%;transform:translate(-50%,16px)scale(.88)}.reward.is-visible{opacity:1;transform:translate(-50%)scale(1)}.end-panel{z-index:8;-webkit-backdrop-filter:blur(5px)saturate(.7);backdrop-filter:blur(5px)saturate(.7);background:radial-gradient(circle,#09142e38,#02050fd1);align-content:center;justify-items:center;display:grid;position:absolute;inset:0}.end-panel[hidden]{display:none}.end-panel span{color:#76eaff;letter-spacing:.42em;font-size:clamp(.68rem,1.3vw,.9rem);font-weight:800}.end-panel strong{color:#f5fbff;font-variant-numeric:tabular-nums;letter-spacing:-.06em;text-shadow:0 0 42px #4fdbff52;margin:12px 0 26px;font-size:clamp(3rem,11vw,8rem);font-style:italic;line-height:.95}.restart{border-color:#69e8ffa3;width:62px;height:62px;animation:1.8s ease-in-out infinite restart-pulse}.restart svg{width:30px;height:30px}.is-crashed .vignette{background:radial-gradient(circle,#0000 25%,#460010b8 110%)}.is-running:not(.is-paused) .speedometer strong{animation:1.4s ease-in-out infinite speed-pulse}.is-crashed #road{animation:.42s cubic-bezier(.16,.8,.2,1) impact-shake}.is-finished .vignette{background:radial-gradient(circle,#6eeeff0d 28%,#030818a3 110%)}@keyframes radar{0%{opacity:.75;transform:scale(.82)}to{opacity:0;transform:scale(1.42)}}@keyframes steer-sway{0%,to{transform:translate(-50%)rotate(-20deg)}50%{transform:translate(-50%)rotate(20deg)}}@keyframes restart-pulse{50%{transform:scale(1.06);box-shadow:0 0 34px #4ee4ff57}}@keyframes speed-pulse{50%{color:#d9fbff;text-shadow:0 0 28px #69e8ffb8}}@keyframes impact-shake{20%{transform:translate(-12px,5px)rotate(-.7deg)}45%{transform:translate(9px,-4px)rotate(.5deg)}70%{transform:translate(-5px,2px)rotate(-.25deg)}to{transform:none}}@media (width<=600px){.topbar{padding-left:16px;padding-right:14px}h1{letter-spacing:.2em;max-width:118px;font-size:.88rem}.icon-button{width:42px;height:42px}.hud{gap:2px 24px;width:min(240px,100vw - 150px);top:72px}.hud span{letter-spacing:.18em;font-size:.5rem}.hud strong{font-size:.94rem}.opening-signal{width:66vw;bottom:24px}.speedometer{width:136px;bottom:12px;right:10px}.speed-readout{padding-bottom:18%}.end-panel strong{margin-bottom:24px;font-size:clamp(3.2rem,19vw,5rem)}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto;transition-duration:1ms!important;animation-duration:1ms!important;animation-iteration-count:1!important}}