:root{--ink:#f4efe2;--dim:#f4efe299;--accent:#ffc35a;--boost:#59f0ff;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px);--safe-right:env(safe-area-inset-right,0px);color:var(--ink);background:#0b0a26;font-family:system-ui,-apple-system,Segoe UI,sans-serif}*{box-sizing:border-box}html,body{overscroll-behavior:none;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;height:100%;margin:0;overflow:hidden}#game,#game canvas{width:100%;height:100%;display:block;position:fixed;inset:0}#hud{pointer-events:none;padding:calc(10px + var(--safe-top)) calc(14px + var(--safe-right)) calc(14px + var(--safe-bottom)) calc(14px + var(--safe-left));text-shadow:0 1px 3px #000000b3;font-variant-numeric:tabular-nums;flex-direction:column;justify-content:space-between;display:flex;position:fixed;inset:0}.top,.bottom{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.bottom{align-items:flex-end}.cell{flex-direction:column;gap:2px;font-size:15px;display:flex}.cell.centre{max-width:340px;color:var(--dim);flex:1;align-items:center;font-size:13px}.cell.right{color:var(--dim);align-items:flex-end;font-size:13px}#position,#time{color:var(--ink);font-size:26px;font-weight:700}#speed{font-size:44px;font-style:italic;font-weight:800;line-height:1}.label{letter-spacing:.12em;text-transform:uppercase;color:var(--dim);font-size:11px}#progress{background:#ffffff26;border-radius:2px;width:100%;height:4px;margin:4px 0;overflow:hidden}#progress-fill{background:var(--accent);width:0;height:100%}#boost{pointer-events:auto;width:76px;height:76px;color:var(--boost);letter-spacing:-2px;touch-action:none;background:#08141e73;border:2px solid #59f0ff99;border-radius:50%;font-size:18px}#boost.active{color:#fff;background:#59f0ff59}#countdown{color:var(--accent);font-size:96px;font-style:italic;font-weight:900;position:absolute;top:38%;left:50%;transform:translate(-50%,-50%)}.overlay-card{background:radial-gradient(#0b0a268c,#0b0a26e6);place-items:center;padding:24px;display:grid;position:fixed;inset:0}#hud[hidden],#overlay[hidden],.overlay-card[hidden],#countdown[hidden]{display:none}.card{text-align:center;max-width:420px}.card h1{letter-spacing:.02em;margin:0;font-size:44px;font-style:italic}.sub{color:var(--accent);margin:6px 0 22px}#start,#resume,#restart{font:inherit;background:var(--accent);color:#1a1020;cursor:pointer;border:0;border-radius:999px;padding:14px 54px;font-size:20px;font-weight:700}.help{color:var(--dim);margin-top:22px;font-size:13px;line-height:1.5}.credit{color:#f4efe266;font-size:11px;line-height:1.4}#overlay{--mono:ui-monospace, "SF Mono", Menlo, Consolas, monospace;z-index:5;padding:calc(20px + var(--safe-top)) calc(24px + var(--safe-right)) calc(12px + var(--safe-bottom)) calc(24px + var(--safe-left));background:linear-gradient(#0b0a26d9,#0b0a2626 34%,#0b0a2633 62%,#0b0a26e6),radial-gradient(at 50% 58%,#0b0a268c,#0000 60%);grid-template:"brand event""go go"1fr"foot foot"/1fr auto;gap:12px 24px;display:grid;position:fixed;inset:0;overflow-y:auto}body:has(#overlay:not([hidden])) #hud{visibility:hidden}#overlay .brand{grid-area:brand;align-self:start;align-items:center;gap:14px;display:flex}#overlay .brand img{border-radius:12px;width:52px;height:52px;box-shadow:0 0 0 1px #ffc35a59,0 0 22px #ffc35a40}#overlay h1{letter-spacing:.16em;text-transform:uppercase;margin:0;font-size:30px;font-style:italic;font-weight:800;line-height:1}#overlay .tagline{font-family:var(--mono);letter-spacing:.08em;color:var(--accent);margin:6px 0 0;font-size:13px}#overlay .event{background:#0b0a26b8;border:1px solid #ffc35a8c;border-radius:8px;grid-area:event;align-self:start;width:300px;padding:12px 14px;box-shadow:0 0 24px #ffc35a1f}#overlay .event h2{font-family:var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin:0 0 6px;font-size:11px;font-weight:600}#overlay .event .site{color:var(--dim);margin:-4px 0 8px 15px;font-size:12px}#overlay .event .dot{vertical-align:middle;background:var(--accent);width:7px;height:7px;box-shadow:0 0 8px var(--accent);border-radius:50%;margin:0 8px 1px 0;display:inline-block}#start-nights{margin:0;padding:0;list-style:none}#start-nights li{--tone:#d9952f;border-left:3px solid var(--tone);border-top:1px solid #f4efe21a;grid-template-columns:1fr auto;padding:6px 0 6px 10px;display:grid}#start-nights li:first-child{border-top:0}#start-nights .night-2{--tone:#8fb4dd}#start-nights .night-3{--tone:#e8746a}#start-nights b{font-size:14px}#start-nights span{color:var(--dim);grid-column:1;font-size:12px}#start-nights small{font-family:var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--dim);grid-area:1/2/3;align-self:center;font-size:10px}#start-nights .tonight{background:linear-gradient(90deg, color-mix(in srgb, var(--tone) 22%, transparent), transparent)}#start-nights .tonight small{color:var(--accent)}#start-nights .later{opacity:.6}#start-new-event{margin-top:6px}button.link{font:inherit;font-family:var(--mono);color:var(--boost);cursor:pointer;background:0 0;border:0;padding:0;font-size:11px}#new-event.armed,#start-new-event.armed{color:#ff7a9c;box-shadow:inset 0 0 0 1.5px #ff7a9c}#start-new-event.armed{box-shadow:none}#start-points{font-family:var(--mono);color:var(--accent);margin:8px 0 0;font-size:11px}#overlay .go{text-align:center;text-shadow:0 1px 3px #0b0a26,0 0 14px #0b0a26;grid-area:go;place-self:center}#overlay .go .sub{font-family:var(--mono);letter-spacing:.06em;margin:0 0 14px;font-size:13px}#start{padding:15px 64px;font-size:22px;box-shadow:0 0 32px #ffc35a73}#overlay .hint{color:var(--dim);margin:12px 0 0;font-size:12px}#overlay footer{font-family:var(--mono);color:var(--dim);grid-area:foot;align-items:flex-end;gap:8px;font-size:11px;display:flex}#overlay footer a,#overlay footer summary{color:var(--boost);letter-spacing:.08em;cursor:pointer;text-decoration:none}#overlay .support-btn{color:#ff7a9c;font:inherit;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;background:#0b0a2699;border:1px solid #4a2a35;border-radius:3px;padding:5px 9px}#overlay .support-btn:hover{border-color:#ff7a9c}#overlay .social-link{color:var(--ink);background:#0b0a2699;border:1px solid #f4efe238;border-radius:3px;justify-content:center;align-items:center;padding:5px 7px;display:flex}#overlay .social-link:hover{border-color:var(--boost);color:var(--boost)}#overlay footer{align-items:center}#overlay footer>a:not(.social-link){margin-left:8px}.support-backdrop{z-index:20;background:#0000008c;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.support-backdrop[hidden]{display:none}.support-card{border:1px solid var(--accent);width:100%;max-width:360px;font-family:var(--mono);color:var(--ink);background:#0b0a26f7;border-radius:8px;padding:16px 18px 12px;position:relative}.support-close{color:var(--dim);cursor:pointer;background:0 0;border:0;font-size:14px;position:absolute;top:8px;right:10px}.support-title{color:#ff7a9c;letter-spacing:.15em;text-transform:uppercase;margin:0 0 8px;font-size:13px}.support-text{color:var(--dim);margin:0 0 12px;font-family:system-ui,-apple-system,Segoe UI,sans-serif;font-size:13px;line-height:1.5}.support-options{gap:8px;display:flex}.support-option{color:var(--accent);text-align:center;text-transform:uppercase;letter-spacing:.06em;background:#ffffff0a;border:1px solid #f4efe22e;border-radius:6px;flex-direction:column;flex:1;gap:3px;padding:10px 8px;font-size:12px;text-decoration:none;display:flex}.support-option span{color:var(--dim);text-transform:none;font-size:10px}.support-option:hover{border-color:var(--accent)}.support-note{letter-spacing:.08em;text-align:center;color:#f4efe266;margin:10px 0 0;font-size:9px}#overlay footer .maker{color:#d8dce2;background:#000000b3;border-radius:4px;align-items:center;gap:6px;margin-left:auto;padding:4px 8px;font-family:system-ui,-apple-system,Segoe UI,sans-serif;font-size:12px;display:flex}#overlay footer .maker img{width:20px;height:20px}#overlay .credits[open]{max-width:460px}#overlay .credits .credit{margin:6px 0 0;font-family:system-ui,-apple-system,Segoe UI,sans-serif}@media (height<=460px){#overlay{padding-top:calc(12px + var(--safe-top));gap:6px 16px}#overlay .brand img{width:40px;height:40px}#overlay h1{font-size:22px}#overlay .tagline{font-size:11px}#overlay .event{width:260px;padding:8px 12px}#start-nights li{padding-block:3px}#start-nights b{font-size:13px}#start-nights span{font-size:11px}#overlay .go .sub{margin-bottom:10px}#start{padding:12px 52px;font-size:19px}#overlay .hint{margin-top:8px}}@media (width<=640px){#overlay{grid-template:"brand""go"1fr"event""foot"/1fr}#overlay .event{width:auto}#overlay footer{flex-wrap:wrap}}#speedlines{pointer-events:none;opacity:0;background:repeating-conic-gradient(at 50% 45%,#fff0 0deg 2.6deg,#fffaeb52 2.6deg 3.1deg);transition:opacity .25s;position:fixed;inset:0;-webkit-mask-image:radial-gradient(circle at 50% 45%,#0000 0 30%,#000 75%);mask-image:radial-gradient(circle at 50% 45%,#0000 0 30%,#000 75%)}#speedlines.on{animation:.14s steps(2,end) infinite speedlines}@keyframes speedlines{0%{transform:rotate(0)scale(1.05)}to{transform:rotate(1.4deg)scale(1.05)}}#ticker{left:50%;bottom:calc(18px + var(--safe-bottom));border-left:4px solid var(--accent);background:#0a0816b8;align-items:baseline;gap:10px;max-width:min(640px,62vw);padding:8px 14px;font-size:15px;font-weight:600;line-height:1.35;display:flex;position:absolute;transform:translate(-50%)}#ticker[hidden]{display:none}#ticker .label{color:var(--accent);white-space:nowrap}#card{pointer-events:none;padding:24px 0;position:fixed;top:24%;left:0;right:0;overflow:hidden}#card .band{--tone:#d9952f;background:repeating-linear-gradient(100deg, #ffffff14 0 2px, transparent 2px 28px), var(--tone);border-top:4px solid #07070c;border-bottom:4px solid #07070c;flex-direction:column;align-items:center;gap:4px;padding:18px 24px 20px;display:flex;transform:skewY(-5deg)translate(-120%)}#card[data-tone=moon] .band{--tone:#1f4fa0}#card[data-tone=violet] .band{--tone:#8a2a8f}#card[data-tone=storm] .band{--tone:#1f4a33}#card[data-tone=fog] .band{--tone:#56657d}#card[data-tone=snow] .band{--tone:#4f78a8}#card[data-tone=dawn] .band{--tone:#d8664f}#card.show .band{animation:2.6s cubic-bezier(.2,.8,.2,1) forwards card}@keyframes card{0%{transform:skewY(-5deg)translate(-120%)}12%,78%{transform:skewY(-5deg)translate(0)}to{transform:skewY(-5deg)translate(120%)}}#card .title{text-transform:uppercase;letter-spacing:.04em;color:#fbf3df;text-shadow:4px 4px #07070c,-1px -1px #07070c;font-size:clamp(38px,9vw,92px);font-style:italic;font-weight:900;line-height:1}#card .sub{letter-spacing:.18em;text-transform:uppercase;color:#07070c;font-size:clamp(14px,2.4vw,20px);font-weight:700}#pads{display:none}body.touch #pads{display:block}.pad{bottom:calc(26px + var(--safe-bottom));background:#0c0a2229;border:2px solid #f4efe238;border-radius:50%;place-items:center;width:96px;height:96px;transition:background .12s,border-color .12s,transform .12s;display:grid;position:absolute}.pad.left{left:calc(22px + var(--safe-left))}.pad.right{right:calc(22px + var(--safe-right))}.pad .chev{color:#f4efe266;margin-top:-6px;font-size:54px;line-height:1}.pad.on{background:#ffc35a33;border-color:#ffc35acc;transform:scale(.94)}.pad.on .chev{color:var(--accent)}#pads.braking .pad{background:#ff465a38;border-color:#ff465ad9;transform:scale(.94)}#pads.braking .pad .chev{color:#ff5a6e}#pads .hint{letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;color:var(--ink);opacity:0;font-size:11px;font-weight:700;transition:opacity .6s;position:absolute}.pad .hint{top:-22px}#pads.coach .hint{opacity:.85}.brake-hint{left:50%;bottom:calc(10px + var(--safe-bottom));place-items:center;display:grid;position:absolute;transform:translate(-50%)}.brake-hint .hint{position:static}.brake-hint .brake{letter-spacing:.2em;text-transform:uppercase;color:#ff5a6e;opacity:0;font-size:18px;font-style:italic;font-weight:900;position:absolute}#pads.braking .brake{opacity:1}#pads.braking .brake-hint .hint{opacity:0}body.touch .bottom .cell{left:calc(30px + var(--safe-left));bottom:calc(150px + var(--safe-bottom));position:absolute}body.touch #boost{right:calc(32px + var(--safe-right));bottom:calc(150px + var(--safe-bottom));position:absolute}#boost{flex-direction:column;justify-content:center;align-items:center;line-height:1.1;display:flex;position:relative}#boost .tag{letter-spacing:.12em;text-transform:uppercase;opacity:.7;font-size:9px;font-weight:700}#boost .fly{letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;color:var(--accent);font-size:11px;font-weight:800;display:none;position:absolute;top:-24px}#boost.can-fly .fly{animation:1.1s ease-in-out infinite fly-pulse;display:block}@keyframes fly-pulse{50%{opacity:.35}}#rotate{display:none}@media (orientation:portrait){body.touch:not(:has(#overlay:not([hidden]))) #rotate{z-index:10;text-align:center;letter-spacing:.04em;background:#0b0a26f0;place-content:center;justify-items:center;gap:22px;font-weight:700;display:grid;position:fixed;inset:0}}#rotate .phone{border:3px solid var(--accent);border-radius:9px;width:46px;height:80px;animation:2.4s ease-in-out infinite turn-sideways}@keyframes turn-sideways{0%,25%{transform:rotate(0)}55%,to{transform:rotate(-90deg)}}.timeline{align-items:center;gap:10px;display:flex}#pause{pointer-events:auto;width:30px;height:30px;color:var(--ink);letter-spacing:-1px;touch-action:manipulation;background:#0a081659;border:1.5px solid #f4efe266;border-radius:50%;padding:0;font-size:12px}body.touch #pause{width:38px;height:38px;font-size:14px}body.touch .keys-only,body:not(.touch) .touch-only{display:none}#new-event{font:inherit;cursor:pointer;border:0;border-radius:999px}#new-event[hidden]{display:none}#restart.quiet,#new-event{color:var(--ink);background:0 0;padding:8px 28px;font-size:15px;box-shadow:inset 0 0 0 1.5px #f4efe266}body.touch #ticker{top:calc(60px + var(--safe-top));text-align:center;color:#f4efe2e6;background:#0a081666;border-left:0;border-radius:10px;justify-content:center;max-width:46vw;padding:3px 12px;font-size:12px;line-height:1.3;bottom:auto}body.touch #ticker .label{display:none}body.touch #card{left:calc(14px + var(--safe-left));right:auto;top:calc(64px + var(--safe-top));padding:0}body.touch #card .band{background:color-mix(in srgb, var(--tone) 72%, transparent);border:0;border-left:3px solid #fbf3df;border-radius:0 8px 8px 0;align-items:flex-start;gap:2px;padding:5px 12px 6px;transform:translate(-130%)}body.touch #card.show .band{animation:3.4s cubic-bezier(.2,.8,.2,1) forwards chip}@keyframes chip{0%{transform:translate(-130%)}10%,80%{opacity:1;transform:none}to{opacity:0;transform:none}}body.touch #card .title{text-shadow:2px 2px #07070c;font-size:20px}body.touch #card .sub{letter-spacing:.14em;color:#fbf3dfd9;margin:0;font-size:9px;line-height:1.2}#crawl{z-index:5;background:linear-gradient(#0b0a26f2,#0b0a2699 70%,#0b0a26d9);position:fixed;inset:0;overflow:hidden}#crawl[hidden]{display:none}.crawl-view{perspective:200px;perspective-origin:50% 0;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#0000 4%,#000 38%);mask-image:linear-gradient(#0000 4%,#000 38%)}.crawl-text{transform-origin:50% 100%;width:min(560px,74vw);color:var(--accent);text-align:justify;text-shadow:none;margin-left:calc(min(560px,74vw)/-2);font-size:clamp(17px,4.6vh,28px);font-weight:700;line-height:1.45;animation:52s linear forwards crawl;position:absolute;bottom:0;left:50%}.crawl-text p{margin:0 0 1.2em}.crawl-text .crawl-head{text-align:center;text-transform:uppercase;letter-spacing:.06em;font-size:1.5em;font-style:italic;font-weight:900;line-height:1.15}#crawl-site{letter-spacing:.2em;font-size:.6em}@keyframes crawl{0%{transform:rotateX(52deg)translateY(100%)}to{transform:rotateX(52deg)translateY(-230%)}}#crawl-ok{right:calc(22px + var(--safe-right));bottom:calc(18px + var(--safe-bottom));font:inherit;background:var(--accent);color:#1a1020;cursor:pointer;border:0;border-radius:999px;padding:10px 26px;font-size:16px;font-weight:700;position:absolute}#brake-cue{letter-spacing:.22em;text-transform:uppercase;color:#ff6b7d;text-shadow:0 0 12px #ff3c50b3;opacity:0;pointer-events:none;background:#0a06148c;border-radius:12px;flex-direction:column;align-items:center;gap:2px;padding:6px 18px 7px;font-size:22px;font-style:italic;font-weight:900;transition:opacity .15s;display:flex;position:absolute;top:38%;left:50%;transform:translate(-50%);box-shadow:inset 0 0 0 1.5px #ff465ab3}#brake-cue.show{opacity:1;animation:.5s ease-in-out infinite alternate cue}#brake-cue .how{letter-spacing:.14em;color:var(--ink);font-size:11px;font-style:normal}#brake-cue.taught .how{display:none}@keyframes cue{0%{transform:translate(-50%)scale(1)}to{transform:translate(-50%)scale(1.08)}}#pads.warn .pad{animation:.5s ease-in-out infinite alternate pad-warn}@keyframes pad-warn{0%{background:#ff465a1f;border-color:#ff465a99}to{background:#ff465a47;border-color:#ff465af2}}#finish{background:radial-gradient(#0b0a26b3,#0b0a2659)}#finish h1{font-size:40px}#finish-time{margin:4px 0 0}#finish-board{font-variant-numeric:tabular-nums;text-align:left;grid-template-rows:repeat(6,auto);grid-auto-flow:column;gap:2px 18px;width:max-content;margin:14px auto 0;padding:0;font-size:13px;list-style:none;display:grid}#finish-board li{border-left:4px solid var(--car);grid-template-columns:1.6em 3.2em 4em;align-items:baseline;padding:2px 8px 2px 6px;animation:.3s ease-out board-in;display:grid}#finish-board li span:last-child{text-align:right;color:var(--dim)}#finish-board li.me{color:var(--accent);background:#ffc35a2e}#finish-board li.me span:last-child{color:var(--accent)}@keyframes board-in{0%{opacity:0;transform:translate(-6px)}}@media (height<=420px){#finish .sub{margin-bottom:8px}#finish h1{font-size:32px}#finish .help{margin-top:10px}}.actions{flex-wrap:wrap;justify-content:center;gap:12px;margin:18px 0 0;display:flex}.actions[hidden]{display:none}.button{font:inherit;background:var(--accent);color:#1a1020;cursor:pointer;border:0;border-radius:999px;padding:11px 34px;font-size:17px;font-weight:700}.button.quiet{color:var(--ink);background:0 0;padding:9px 26px;font-size:15px;font-weight:600;box-shadow:inset 0 0 0 1.5px #f4efe266}.card.wide{width:100%;max-width:640px}#rest h1{font-size:30px}#rest h2{letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin:0 0 8px;font-size:12px;font-weight:600}.rest-columns{text-align:left;justify-content:center;align-items:flex-start;gap:28px;margin-top:16px;display:flex}.rest-columns section[hidden]{display:none}#rest-garage{flex:1;max-width:300px}#rest-garage .help{margin:0 0 10px}.standings{font-variant-numeric:tabular-nums;margin:0;padding:0;font-size:13px;list-style:none}.standings li{border-left:4px solid var(--car);grid-template-columns:1.6em 3.2em 2.4em 2.4em;align-items:baseline;padding:1px 8px 1px 6px;display:grid}.standings li span:nth-child(3){text-align:right;font-weight:700}.standings li small{text-align:right;color:var(--dim)}.standings li.me{color:var(--accent);background:#ffc35a2e}.upgrade{width:100%;font:inherit;text-align:left;color:var(--ink);border:0;border-left:4px solid var(--accent);cursor:pointer;background:#ffffff0f;border-radius:6px;margin:0 0 8px;padding:10px 14px;display:block}.upgrade:hover,.upgrade:focus-visible{background:#ffc35a29}.upgrade b{font-size:15px;display:block}.upgrade span{color:var(--dim);font-size:12.5px}@media (height<=420px){#rest .sub{margin-bottom:4px}#rest h1{font-size:22px}.rest-columns{margin-top:8px}.standings li{padding-block:0;font-size:12px}.actions{margin-top:10px}}
