:root{--bg: #121a10;--bg-2: #1b2617;--panel: rgba(30, 42, 26, .86);--panel-solid: #1e2a1a;--line: rgba(245, 192, 74, .2);--gold: #f5c04a;--gold-ink: #2a1d05;--gold-tint: rgba(245, 192, 74, .14);--leaf: #6fbf73;--ember: #e8503a;--text: #f6f0e0;--text-dim: rgba(246, 240, 224, .64);--font-display: "Fraunces", Georgia, serif;--font-body: "Outfit", system-ui, -apple-system, sans-serif;--ease: cubic-bezier(.22, 1, .36, 1);--safe-b: env(safe-area-inset-bottom, 0px)}*{box-sizing:border-box}[hidden]{display:none!important}html,body{margin:0;height:100%}body{background:radial-gradient(900px 420px at 50% -8%,rgba(245,192,74,.13),transparent 60%),radial-gradient(700px 380px at 50% 112%,rgba(111,191,115,.12),transparent 60%),linear-gradient(var(--bg-2),var(--bg));color:var(--text);font-family:var(--font-body);-webkit-font-smoothing:antialiased;overscroll-behavior:none;-webkit-tap-highlight-color:transparent}button,input{font-family:inherit}button{cursor:pointer}a{color:var(--gold)}#app{min-height:100dvh}:focus-visible{outline:3px solid var(--gold);outline-offset:2px}.enter{animation:rise .45s var(--ease) both}@keyframes rise{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 22px;border-radius:999px;border:1px solid var(--line);background:#ffffff0f;color:var(--text);font-weight:700;font-size:16px;text-decoration:none;transition:transform .15s var(--ease),background .2s,box-shadow .2s}.btn:active{transform:scale(.97)}.btn--gold{background:var(--gold);color:var(--gold-ink);border-color:transparent;box-shadow:0 8px 28px #f5c04a47}.btn--ghost{background:transparent}.btn--wide{width:100%}.icon-btn{width:44px;height:44px;border-radius:14px;border:1px solid var(--line);background:#ffffff0d;color:var(--text);font-size:20px;display:grid;place-items:center}.chips{display:flex;gap:8px;overflow-x:auto;padding:2px;scrollbar-width:none}.chips--wrap{flex-wrap:wrap;overflow:visible}.chip{min-height:44px;padding:8px 14px;border-radius:12px;border:1px solid var(--line);background:#ffffff0a;color:var(--text);font-size:15px;white-space:nowrap}.chip b{color:var(--gold);margin-right:4px}.chip.on{background:var(--gold-tint);border-color:var(--gold);box-shadow:inset 0 0 0 1px var(--gold)}.home{max-width:520px;margin:0 auto;padding:14px 16px calc(28px + var(--safe-b));display:flex;flex-direction:column;gap:14px}.home-top{display:flex;justify-content:space-between;align-items:center}.player-chip{display:flex;align-items:center;gap:8px;padding:6px 12px 6px 6px;border-radius:999px;background:#ffffff0d;border:1px solid var(--line);font-size:14px}.chip-avatar{width:28px;height:28px;border-radius:50%;background:var(--gold);color:var(--gold-ink);display:grid;place-items:center;font-weight:800}.hero{display:grid;place-items:center}.hero-art{width:min(100%,360px);filter:drop-shadow(0 18px 40px rgba(0,0,0,.45))}.title{font-family:var(--font-display);font-weight:900;font-size:clamp(40px,11vw,60px);line-height:.95;text-align:center;margin:0;letter-spacing:-.01em}.title span{color:var(--gold);font-style:italic;font-weight:700}.sub{text-align:center;color:var(--text-dim);margin:0 0 6px}.modes{display:grid;gap:10px}.mode{text-align:left;padding:16px 18px;border-radius:18px;border:1px solid var(--line);background:var(--panel);color:var(--text);display:flex;flex-direction:column;gap:4px;transition:transform .15s var(--ease),border-color .2s}.mode b{font-size:18px}.mode span{color:var(--text-dim);font-size:14px}.mode:active{transform:scale(.985)}.mode--primary{border-color:var(--gold);background:linear-gradient(135deg,rgba(245,192,74,.18),var(--panel))}.mode:disabled{opacity:.5;cursor:not-allowed}.foot{text-align:center;color:var(--text-dim);font-size:13px}.sheet{max-width:560px;margin:0 auto;padding:14px 16px calc(28px + var(--safe-b));display:flex;flex-direction:column;gap:18px}.sheet-top{display:grid;grid-template-columns:44px 1fr 44px;align-items:center}.sheet-top h2{margin:0;text-align:center;font-family:var(--font-display);font-size:24px}.sheet h3{margin:0 0 8px;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-dim)}.hint{color:var(--text-dim);font-size:13px;margin:8px 0 0}.card-ish{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:16px;display:flex;flex-direction:column;gap:10px}.row{display:flex;gap:8px}.row input{flex:1;min-height:48px;border-radius:12px;border:1px solid var(--line);background:#00000040;color:var(--text);padding:0 14px;font-size:18px;letter-spacing:.2em;text-transform:uppercase}.waiting{display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center;padding-top:30px}.spinner{width:44px;height:44px;border-radius:50%;border:4px solid var(--gold-tint);border-top-color:var(--gold);animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.room-code{font-family:var(--font-display);font-size:48px;letter-spacing:.18em;color:var(--gold);padding:8px 18px;border:2px dashed var(--line);border-radius:16px}.slider{display:flex;align-items:center;gap:12px;margin-top:10px;color:var(--text-dim)}.slider input{flex:1;accent-color:var(--gold)}.race{height:100dvh;display:flex;flex-direction:column;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none}.race-top{display:grid;grid-template-columns:44px 1fr 44px;align-items:center;gap:8px;padding:8px 10px}.race-title{text-align:center;line-height:1.15}.race-title b{display:block;font-size:15px}.race-title span{font-size:12px;color:var(--text-dim)}.stage{position:relative;flex:1;min-height:0;margin-bottom:var(--safe-b)}.view-host{position:absolute;inset:0}.view-canvas,.view-host canvas{position:absolute;inset:0;width:100%;height:100%;display:block}.lane{position:absolute;display:flex;flex-direction:column;pointer-events:none}.lane-view{position:relative;pointer-events:auto;border-radius:10px}.lane-strip{flex:1;display:flex;align-items:center;gap:10px;padding:8px 12px;pointer-events:auto}.lefty .lane-strip{flex-direction:row-reverse}.lane-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}.lane-name{font-weight:700;font-size:14px;display:flex;align-items:center;gap:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lane-name i,.dot{width:10px;height:10px;border-radius:50%;background:var(--lane);display:inline-block;flex:none}.lane-stats{font-size:13px;color:var(--text-dim);font-variant-numeric:tabular-nums}.lane-stats .t{color:var(--text);font-weight:700;font-size:18px}.bars{display:flex;flex-direction:column;gap:4px}.bar{display:grid;grid-template-columns:64px 1fr auto;align-items:center;gap:6px;font-size:12px;color:var(--text-dim)}.bar.me{color:var(--text);font-weight:700}.bar-l{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bar-t{height:8px;border-radius:99px;background:#ffffff1a;overflow:hidden}.bar-t i{display:block;height:100%;border-radius:99px;transition:width .25s var(--ease)}.bar em{font-style:normal;font-variant-numeric:tabular-nums}.lane.bumped .lane-view{animation:bumpflash .25s ease-out}@keyframes bumpflash{0%{box-shadow:inset 0 0 0 3px #e8503ab3}to{box-shadow:inset 0 0 #e8503a00}}.stick{position:relative;flex:none;border-radius:50%;background:radial-gradient(circle at 50% 45%,#ffffff1a,#ffffff08 70%);border:2px solid color-mix(in srgb,var(--lane) 55%,transparent);box-shadow:inset 0 2px 14px #00000080;touch-action:none}.stick.active{border-color:var(--lane)}.stick-arrows{position:absolute;inset:0;width:100%;height:100%}.arr{fill:#ffffff1f;transition:fill .12s}.arr.open{fill:#fff9}.arr.lit{fill:var(--gold)}.stick-knob{position:absolute;left:50%;top:50%;width:42%;height:42%;margin:-21% 0 0 -21%;border-radius:50%;background:radial-gradient(circle at 40% 35%,color-mix(in srgb,var(--lane) 70%,white),var(--lane));box-shadow:0 6px 16px #00000073;transition:transform .18s var(--ease);pointer-events:none}.stick.active .stick-knob{transition:none}.countdown{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;font-family:var(--font-display);font-weight:900;font-size:clamp(56px,16vmin,140px);color:#fff;text-shadow:0 6px 30px rgba(0,0,0,.6);opacity:0;transform:scale(.8);transition:opacity .2s,transform .3s var(--ease)}.countdown.show{opacity:1;transform:none}.countdown.go{color:var(--gold)}.banner{position:fixed;left:50%;top:64px;transform:translate(-50%);z-index:10;pointer-events:none;background:var(--panel-solid);border:1px solid var(--gold);color:var(--text);padding:10px 16px;border-radius:14px;font-weight:600;box-shadow:0 10px 30px #0006;max-width:calc(100vw - 32px);text-align:center}.banner.in{animation:drop .35s var(--ease) both}@keyframes drop{0%{opacity:0;transform:translate(-50%,-10px)}to{opacity:1;transform:translate(-50%)}}.results{position:fixed;inset:0;z-index:20;display:grid;place-items:end center;padding:16px;background:linear-gradient(transparent 30%,#0000008c)}.results .card{width:min(520px,100%);background:var(--panel-solid);border:1px solid var(--line);border-radius:22px;padding:18px;box-shadow:0 20px 60px #00000080;margin-bottom:var(--safe-b)}.results h2{margin:0 0 10px;font-family:var(--font-display);font-size:28px}.verdict{font-weight:800;font-size:18px;margin-bottom:8px;color:var(--text-dim)}.verdict.win{color:var(--gold)}.standings{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}.standings li{display:grid;grid-template-columns:28px 1fr auto;grid-template-rows:auto auto;column-gap:8px;padding:8px 10px;border-radius:12px;background:#ffffff0a}.standings li.me{background:var(--gold-tint)}.standings b{grid-row:span 2;align-self:center;font-family:var(--font-display);font-size:20px;color:var(--gold)}.standings span{font-weight:700;display:flex;align-items:center;gap:6px}.standings em{font-style:normal;font-variant-numeric:tabular-nums;font-weight:700}.standings small{grid-column:2 / 4;color:var(--text-dim)}.actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.actions .btn{flex:1 1 140px}.toast{position:fixed;left:50%;bottom:calc(24px + var(--safe-b));transform:translate(-50%);z-index:30;background:var(--panel-solid);border:1px solid var(--line);padding:10px 16px;border-radius:12px;animation:rise .3s var(--ease) both}@media (prefers-reduced-motion: reduce){.enter,.banner.in,.toast{animation:none}.countdown{transition:none}}