:root{--race-ink: #1f3a2b;--race-forest: #2f6b45;--race-cream: #fff6e0;--race-carrot: #f08a3c;--race-sun: #ffd34d;--race-mint: #2fb79b;--race-sky: #bfe6f2;--race-round: ui-rounded, "Arial Rounded MT Bold", "Trebuchet MS", sans-serif}body:has(#scooter-race){margin:0;min-width:320px;overflow:hidden;background:var(--race-forest);color:var(--race-ink);font-family:Trebuchet MS,Arial,sans-serif;color-scheme:light}#scooter-race{display:flex;flex-direction:column;block-size:100svh;background:var(--race-forest)}#scooter-race *,#scooter-race *:before,#scooter-race *:after{box-sizing:border-box}#scooter-race button,#scooter-race a{font-family:inherit;-webkit-tap-highlight-color:transparent}.race-topbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-block-size:3.25rem;padding:.5rem clamp(.75rem,3vw,1.75rem);padding-inline:max(clamp(.75rem,3vw,1.75rem),env(safe-area-inset-left));background:var(--race-forest);color:var(--race-cream)}.race-back{color:var(--race-cream);font-weight:800;text-decoration:none}.race-back:hover span{text-decoration:underline}.race-topbar-title{margin:0;font:900 1.15rem/1 var(--race-round);letter-spacing:.02em}.race-controls{display:flex;gap:.5rem}.race-chip{min-block-size:2.25rem;padding:0 .9rem;border:2px solid color-mix(in srgb,var(--race-cream) 55%,transparent);border-radius:999px;background:transparent;color:var(--race-cream);font-weight:800;cursor:pointer}.race-chip:hover:not(:disabled){background:color-mix(in srgb,var(--race-cream) 15%,transparent)}.race-chip:disabled{opacity:.45;cursor:default}.race-chip:focus-visible,.race-go:focus-visible,.race-secondary:focus-visible,.race-back:focus-visible{outline:3px solid var(--race-sun);outline-offset:3px}.race-stage{position:relative;flex:1;min-block-size:0;overflow:hidden;background:var(--race-sky)}#race-canvas{display:block;inline-size:100%;block-size:100%;touch-action:none}#race-canvas:focus{outline:none}.race-hud{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .3s ease}[data-mode=countdown] .race-hud,[data-mode=racing] .race-hud,[data-mode=paused] .race-hud,[data-mode=finished] .race-hud{opacity:1}.race-hud-place{position:absolute;inset-block-start:clamp(.6rem,2vw,1.2rem);inset-inline-start:clamp(.6rem,2vw,1.2rem);display:flex;align-items:baseline;gap:.35rem;padding:.35rem 1rem .45rem;border:3px solid var(--race-ink);border-radius:1.25rem;background:var(--race-cream);box-shadow:0 .3rem 0 var(--race-ink)}.race-hud-place strong{font:900 clamp(2rem,6vw,3.4rem) / 1 var(--race-round);color:var(--race-carrot);-webkit-text-stroke:1.5px var(--race-ink)}.race-hud-place span{font-weight:800;font-size:.9rem}.race-hud-place.is-pop{animation:race-pop .38s ease-out}@keyframes race-pop{40%{transform:scale(1.15) rotate(-3deg)}}.race-hud-stack{position:absolute;inset-block-start:clamp(.6rem,2vw,1.2rem);inset-inline-end:clamp(.6rem,2vw,1.2rem);display:flex;flex-direction:column;align-items:flex-end;gap:.4rem}.race-pill{display:inline-flex;align-items:center;gap:.35rem;padding:.3rem .8rem;border:2px solid var(--race-ink);border-radius:999px;background:var(--race-cream);font-weight:800;font-variant-numeric:tabular-nums}.race-pill strong{font-family:var(--race-round);font-size:1.1rem}.race-carrot-icon{inline-size:.7rem;block-size:1.05rem;border-radius:50%/30% 30% 70% 70%;background:var(--race-carrot);box-shadow:inset 0 .25rem #4caf50}.race-map{position:absolute;inset-block-end:clamp(.6rem,2vw,1.2rem);inset-inline-end:clamp(.6rem,2vw,1.2rem);inline-size:clamp(6.5rem,16vw,9.5rem);block-size:auto;aspect-ratio:1;border:3px solid var(--race-ink);border-radius:1.25rem;background:color-mix(in srgb,var(--race-cream) 85%,transparent)}.race-countdown{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;font:900 clamp(5rem,22vw,12rem) / 1 var(--race-round);color:var(--race-sun);-webkit-text-stroke:4px var(--race-ink);text-shadow:0 .5rem 0 var(--race-ink)}.race-countdown.is-tick{animation:race-count .9s ease-out both}@keyframes race-count{0%{transform:scale(1.6);opacity:0}20%{transform:scale(1);opacity:1}80%{opacity:1}to{transform:scale(.85);opacity:0}}.race-toast{position:absolute;inset-block-start:22%;inset-inline:0;text-align:center;pointer-events:none;font:900 clamp(1.6rem,5vw,2.8rem) / 1 var(--race-round);color:var(--race-cream);-webkit-text-stroke:2px var(--race-ink);text-shadow:0 .25rem 0 var(--race-ink);opacity:0}.race-toast.is-showing{animation:race-toast 1.3s ease-out both}@keyframes race-toast{0%{transform:translateY(1rem) scale(.8);opacity:0}15%{transform:none;opacity:1}75%{opacity:1}to{transform:translateY(-.6rem);opacity:0}}.race-panel{position:absolute;inset-block-start:50%;inset-inline-start:clamp(.75rem,5vw,4rem);inline-size:min(28rem,calc(100% - 1.5rem));max-block-size:calc(100% - 1.5rem);overflow:auto;translate:0 -50%;padding:clamp(1.1rem,3vw,1.8rem);border:3px solid var(--race-ink);border-radius:1.75rem;background:var(--race-cream);box-shadow:.45rem .5rem 0 var(--race-ink)}.race-panel[hidden]{display:none}.race-paused,.race-error{inset-inline-start:50%;translate:-50% -50%;text-align:center}.race-eyebrow{margin:0 0 .4rem;color:var(--race-carrot);font-size:.78rem;font-weight:900;letter-spacing:.14em;text-transform:uppercase}.race-panel h1,.race-panel h2{margin:0;font:900 clamp(2.2rem,7vw,3.4rem) / .95 var(--race-round);letter-spacing:-.03em;color:var(--race-forest)}.race-panel h2{font-size:clamp(1.9rem,6vw,2.6rem)}.race-copy{margin:.75rem 0 0;line-height:1.45}.race-picker{margin:1.1rem 0 0;padding:0;border:0}.race-picker legend{margin-block-end:.5rem;font-weight:900}.race-picker-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem}.race-pick{position:relative;display:grid;justify-items:center;gap:.2rem;padding:.5rem .25rem .45rem;border:2px solid color-mix(in srgb,var(--race-ink) 25%,transparent);border-radius:1rem;background:#fff;font-weight:800;font-size:.9rem;cursor:pointer;transition:transform .14s ease,border-color .14s ease}.race-pick input{position:absolute;opacity:0;pointer-events:none}.race-pick svg{inline-size:100%;max-inline-size:3.6rem;block-size:auto}.race-pick:hover{transform:translateY(-2px)}.race-pick:has(input:checked){border-color:var(--race-ink);background:color-mix(in srgb,var(--scooter) 22%,#fff);box-shadow:0 .2rem 0 var(--race-ink)}.race-pick:has(input:focus-visible){outline:3px solid var(--race-carrot);outline-offset:2px}.race-go,.race-secondary{display:inline-flex;align-items:center;justify-content:center;min-block-size:3.25rem;padding:0 1.6rem;border:3px solid var(--race-ink);border-radius:999px;font-weight:900;font-size:1.15rem;text-decoration:none;cursor:pointer;transition:transform .12s ease,box-shadow .12s ease}.race-go{margin-block-start:1.2rem;background:var(--race-carrot);color:#fff;box-shadow:0 .3rem 0 var(--race-ink);text-shadow:0 2px 0 rgb(0 0 0 / .2)}.race-ready .race-go{inline-size:100%}.race-secondary{margin-block-start:1.2rem;background:#fff;color:var(--race-ink)}.race-go:hover,.race-secondary:hover{transform:translateY(-2px)}.race-go:active{transform:translateY(2px);box-shadow:0 .1rem 0 var(--race-ink)}.race-actions{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center}.race-results .race-actions{justify-content:flex-start}.race-help{margin:.8rem 0 0;font-size:.9rem;text-align:center;color:#4a5d4f}kbd{display:inline-block;min-inline-size:1.6em;padding:.05em .4em;border:2px solid #b8c4b5;border-radius:.4em;background:#fff;font:800 .85em/1.3 Trebuchet MS,Arial,sans-serif;text-align:center}.race-best{margin:.5rem 0 0;font-size:.85rem;font-weight:800;text-align:center;color:var(--race-forest)}.race-results-list{display:grid;gap:.4rem;margin:1rem 0 0;padding:0;list-style:none}.race-results-list li{display:grid;grid-template-columns:2.6rem 1fr auto;align-items:center;gap:.6rem;padding:.45rem .8rem;border:2px solid color-mix(in srgb,var(--race-ink) 18%,transparent);border-radius:.9rem;background:#fff;font-weight:800}.race-results-list li.is-player{border-color:var(--race-ink);background:color-mix(in srgb,var(--race-sun) 45%,#fff)}.race-results-list .place{font:900 1.3rem/1 var(--race-round);color:var(--race-carrot)}.race-results-list .swatch{display:inline-block;inline-size:.8rem;block-size:.8rem;margin-inline-end:.45rem;border:2px solid var(--race-ink);border-radius:50%;vertical-align:-.05rem}.race-results-list .time{font-variant-numeric:tabular-nums;color:#4a5d4f}.race-touch{position:absolute;inset-block-end:max(.9rem,env(safe-area-inset-bottom));inset-inline:max(.9rem,env(safe-area-inset-left)) max(.9rem,env(safe-area-inset-right));display:none;justify-content:space-between;align-items:flex-end;pointer-events:none}@media(pointer:coarse){[data-mode=racing] .race-touch,[data-mode=countdown] .race-touch{display:flex}[data-mode=racing] .race-map,[data-mode=countdown] .race-map{inset-block-end:auto;inset-block-start:9.5rem}}.race-touch-steer{display:flex;gap:.75rem}.race-touch-button{inline-size:4.75rem;block-size:4.75rem;border:3px solid var(--race-ink);border-radius:50%;background:color-mix(in srgb,var(--race-cream) 88%,transparent);color:var(--race-ink);font:900 1.6rem/1 var(--race-round);pointer-events:auto;touch-action:none;-moz-user-select:none;user-select:none;-webkit-user-select:none;box-shadow:0 .25rem 0 var(--race-ink)}.race-touch-button.is-down{translate:0 3px;box-shadow:0 .05rem 0 var(--race-ink);background:var(--race-sun)}.race-touch-hop{inline-size:5.5rem;block-size:5.5rem;background:color-mix(in srgb,var(--race-carrot) 92%,transparent);color:#fff;font-size:1.3rem}.race-sr{position:absolute;inline-size:1px;block-size:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}@media(max-width:40rem){.race-topbar-title,.race-back span{display:none}.race-panel{inset-inline-start:50%;translate:-50% -50%}}@media(max-height:34rem){.race-copy{display:none}.race-panel{padding-block:.9rem}}@media(prefers-reduced-motion:reduce){.race-countdown.is-tick,.race-hud-place.is-pop{animation:none}.race-toast.is-showing{animation:none;opacity:1}.race-pick,.race-go,.race-secondary{transition:none}}