:root{--ink:#0e1b2b;--ink-2:#4a5566;--paper:#fafcffeb;--line:#0e1b2b1f;--accent:#f26b1d;--radius:14px;--shadow:0 10px 30px #0e1b2b2e, 0 2px 6px #0e1b2b1f;color:var(--ink);font-family:Nunito,system-ui,-apple-system,Segoe UI,sans-serif}*{box-sizing:border-box}html,body{background:#8ccaf3;height:100%;margin:0;overflow:hidden}#scene{touch-action:none;outline:none;width:100%;height:100%;display:block;position:fixed;inset:0}#ui{pointer-events:none;position:fixed;inset:0}#ui>*{pointer-events:auto}#ui .tag,#ui .markers{pointer-events:none}button{font:inherit;color:var(--ink);border:1px solid var(--line);cursor:pointer;background:#fff;border-radius:999px;padding:9px 16px;font-size:14px;font-weight:800;transition:transform .12s,box-shadow .12s,background .12s;box-shadow:0 2px 6px #0e1b2b14}button:hover{transform:translateY(-1px);box-shadow:0 4px 12px #0e1b2b24}button:focus-visible{outline-offset:2px;outline:3px solid #1e4fd8}.btn-link{color:var(--ink);border:1px solid var(--line);background:#fff;border-radius:999px;padding:9px 16px;font-size:14px;font-weight:800;text-decoration:none;box-shadow:0 2px 6px #0e1b2b14}.btn-link:focus-visible{outline-offset:2px;outline:3px solid #1e4fd8}button.primary{background:var(--ink);color:#fff;border-color:var(--ink)}button[aria-pressed=true]{color:#fff;background:#2d7ff9;border-color:#2d7ff9}.topbar{padding:max(12px, env(safe-area-inset-top)) 16px 12px;pointer-events:none;justify-content:space-between;align-items:center;gap:12px;display:flex;position:absolute;top:0;left:0;right:0}.topbar>*{pointer-events:auto}.brand{letter-spacing:.02em;background:var(--paper);box-shadow:var(--shadow);border-radius:999px;align-items:center;gap:10px;padding:8px 14px;font-size:20px;font-weight:900;display:flex}.brand .mark{background:conic-gradient(#f26b1d 0 25%, #1fb5b0 0 50%, #5b2bb5 0 75%, #1e4fd8 0);border-radius:50%;width:22px;height:22px;box-shadow:inset 0 0 0 4px #fff}.actions-top{flex-wrap:wrap;justify-content:flex-end;gap:8px;display:flex}.tag{background:var(--paper);border:2px solid var(--accent);white-space:nowrap;box-shadow:var(--shadow);opacity:0;border-radius:10px;margin-top:-10px;padding:6px 12px;font-size:13px;font-weight:800;transition:opacity .15s;position:absolute;top:0;left:0}.tag.on{opacity:1}.tag .num{background:var(--accent);color:#fff;text-align:center;border-radius:6px;min-width:26px;margin-right:6px;padding:0 6px;display:inline-block}.tag.pulse .icon{animation:.9s ease-in-out infinite pulse;display:inline-block}@keyframes pulse{50%{transform:scale(1.35)}}.panel{background:var(--paper);border-radius:var(--radius);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.card{border-top:6px solid var(--accent);width:min(380px,100vw - 32px);max-height:calc(100vh - 170px);padding:16px 18px 14px;position:absolute;top:76px;right:16px;overflow:auto}.card .kicker{text-transform:uppercase;letter-spacing:.08em;color:var(--ink-2);font-size:12px;font-weight:800}.card h2{margin:2px 0 8px;font-size:22px;font-weight:900}.card .body{color:var(--ink);font-size:14px;line-height:1.45}.card .body p{margin:0 0 8px}.card .body table{border-collapse:collapse;font-variant-numeric:tabular-nums;width:100%}.card .body td{border-bottom:1px solid var(--line);padding:3px 0}.card .body td:last-child{text-align:right;font-weight:800}.card .actions{flex-wrap:wrap;gap:8px;margin-top:12px;display:flex}.card .actions button{padding:7px 12px;font-size:13px}.swatches{gap:6px;margin:8px 0;display:flex}.swatch{width:26px;height:26px;box-shadow:0 0 0 1px var(--line);border:2px solid #fff;border-radius:50%}.chip{background:#eef1f5;border-radius:999px;padding:2px 8px;font-size:12px;font-weight:800;display:inline-block}.helmet-shot{background-position:50%;background-size:cover;border-radius:10px;width:100%;height:120px;margin:6px 0 8px}.back{position:absolute;top:72px;left:16px}.toast{background:var(--ink);color:#fff;box-shadow:var(--shadow);border-left:5px solid var(--accent);border-radius:16px;align-items:center;gap:10px;max-width:min(520px,100vw - 32px);padding:10px 16px;font-size:14px;font-weight:700;display:flex;position:absolute;top:72px;left:50%;transform:translate(-50%)}.toast.in{animation:.25s ease-out toast-in}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,-8px)}}.toast .icon{font-size:18px}.hud{left:50%;bottom:max(16px, env(safe-area-inset-bottom));background:var(--ink);color:#fff;box-shadow:var(--shadow);border-radius:18px;align-items:center;gap:16px;padding:10px 18px;display:flex;position:absolute;transform:translate(-50%)}.hud .time{font-variant-numeric:tabular-nums;text-align:center;min-width:110px;font-size:34px;font-weight:900}.hud .meta{opacity:.9;font-size:13px;line-height:1.35}.hud .order{gap:6px;display:flex}.hud .order span{background:#ffffff1f;border-radius:8px;place-items:center;width:34px;height:26px;font-size:12px;font-weight:900;display:grid}.hud .order span.done{background:#35b04a}.hud .order span.next{color:var(--ink);background:#f5c518}.markers{position:absolute;inset:0}.marker{color:#fff;pointer-events:auto;background:#0e1b2bb8;border:4px solid #fff;border-radius:50%;place-items:center;width:64px;height:64px;margin:-32px 0 0 -32px;padding:0;font-size:24px;font-weight:900;display:grid;position:absolute;top:0;left:0;box-shadow:0 6px 16px #0000004d}.marker small{color:#fff;text-shadow:0 1px 2px #000;font-size:11px;position:absolute;bottom:-20px}.marker.next{color:var(--ink);background:#f5c518;animation:.6s ease-in-out infinite bump}.marker.done{background:#35b04a;border-color:#e8ffe8}.marker.wrong{background:#e03a3a;animation:.3s shake}@keyframes bump{50%{transform:scale(1.1)}}@keyframes shake{25%{transform:translate(-6px)}75%{transform:translate(6px)}}.modal-wrap{background:#0e1b2b59;place-items:center;padding:16px;display:grid;position:absolute;inset:0}.modal-wrap[hidden]{display:none}.modal{width:min(460px,100%);max-height:calc(100vh - 32px);padding:20px;overflow:auto}.modal h2{margin:0 0 6px;font-size:26px;font-weight:900}.modal .big{font-variant-numeric:tabular-nums;margin:8px 0;font-size:56px;font-weight:900;line-height:1}.modal .row{flex-wrap:wrap;gap:8px;margin-top:14px;display:flex}.modal img{width:100%;box-shadow:var(--shadow);border-radius:10px;margin-top:10px}.modal ul{margin:8px 0;padding-left:18px;line-height:1.6}.modal select{font:inherit;border:1px solid var(--line);border-radius:8px;width:100%;padding:6px 8px;font-weight:700}.modal label{margin-top:8px;font-size:13px;font-weight:800;display:block}.loading{background:#8ccaf3;place-items:center;font-size:20px;font-weight:900;transition:opacity .5s;display:grid;position:absolute;inset:0}#ui>.loading.done{opacity:0;pointer-events:none}#ui>.topbar{pointer-events:none}[hidden]{display:none!important}.view-ctl{right:16px;bottom:max(16px, env(safe-area-inset-bottom));border-radius:999px;gap:6px;padding:6px;display:flex;position:absolute}.view-ctl button{min-width:40px;padding:8px 10px}.walk-hud{border-top:6px solid #f5c518;width:min(360px,100vw - 32px);max-height:calc(100vh - 170px);padding:14px 16px;position:absolute;top:76px;right:16px;overflow:auto}.card.panel,.walk-hud.panel{-webkit-backdrop-filter:blur(18px)saturate(170%);backdrop-filter:blur(18px)saturate(170%);background:linear-gradient(135deg,#ffffff8c,#ffffff47);border:1px solid #fff9;box-shadow:0 12px 34px #0e1b2b2e,inset 0 1px #ffffffbf}.walk-hud .kicker{text-transform:uppercase;letter-spacing:.08em;color:var(--ink-2);font-size:12px;font-weight:800}.walk-hud h2{margin:2px 0 4px;font-size:20px;font-weight:900}.walk-hud .walk-help{color:var(--ink-2);margin:0 0 8px;font-size:13px}.walk-hud .actions{flex-wrap:wrap;gap:6px;margin-top:6px;display:flex}.walk-hud .actions button{padding:7px 12px;font-size:13px}button.ghost{background:0 0}button.accent{background:#f5c518;border-color:#e0b000}.place-list{gap:8px;margin:10px 0;display:grid}.place-list .place{text-align:left;border-radius:12px;gap:2px;padding:10px 14px;display:grid}.place-list .place span{color:var(--ink-2);font-size:13px;font-weight:600}.joy{touch-action:none;background:#0e1b2b40;border:2px solid #ffffffb3;border-radius:50%;place-items:center;width:120px;height:120px;display:grid;position:absolute;bottom:150px;right:24px}.joy-knob{width:52px;height:52px;box-shadow:var(--shadow);pointer-events:none;background:#ffffffe6;border-radius:50%}body.walking .view-ctl,body.driving .actions-top{display:none}.drive-hud{left:50%;bottom:max(14px, env(safe-area-inset-bottom));color:#f4f5f7;box-shadow:var(--shadow);font-variant-numeric:tabular-nums;background:#080b10e0;border-radius:22px 22px 16px 16px;min-width:min(460px,100vw - 32px);padding:10px 16px;position:absolute;transform:translate(-50%)}.drive-hud.compact{width:300px;min-width:0;padding:8px 12px;left:auto;right:16px;transform:none}.drive-hud.compact .d-rev i{width:10px;height:10px}.drive-hud.compact .d-gear{font-size:34px}.drive-hud.compact .d-speed{font-size:26px}.drive-hud.compact .d-lap{font-size:18px}.drive-hud.compact .d-row{gap:10px}.d-rev{justify-content:center;gap:5px;margin-bottom:6px;display:flex}.d-rev i{background:#222;border-radius:50%;width:14px;height:14px;box-shadow:inset 0 0 0 1px #333}.d-rev i.g{background:#35d45a;box-shadow:0 0 8px #35d45a}.d-rev i.r{background:#ff3b30;box-shadow:0 0 8px #ff3b30}.d-rev i.b{background:#4a7dff;box-shadow:0 0 8px #4a7dff}.d-row{justify-content:space-between;align-items:center;gap:18px;display:flex}.d-col{text-align:center}.d-gear{font-size:46px;font-weight:900;line-height:1}.d-speed{font-size:34px;font-weight:900;line-height:1}.d-label{letter-spacing:.14em;opacity:.6;font-size:10px;font-weight:800}.d-lap{font-size:24px;font-weight:900}.d-small{opacity:.75;font-size:12px;font-weight:700}.d-drs{color:#888;background:#333;border-radius:8px;padding:6px 10px;font-size:14px;font-weight:900}.d-drs.avail{color:#0e1b2b;background:#f5c518}.d-drs.on{color:#0e1b2b;background:#35d45a}.d-drift{color:#666;text-align:center;background:#333;border-radius:8px;min-width:92px;padding:6px 10px;font-size:14px;font-weight:900}.d-drift.on{color:#0e1b2b;background:linear-gradient(90deg,#ff7ac8,#ffb020)}.d-help{opacity:.6;text-align:center;margin-top:6px;font-size:11px}.d-actions{justify-content:center;gap:8px;margin-top:8px;display:flex}.d-actions button{padding:6px 12px;font-size:12px}.drive-pads{pointer-events:none;position:absolute;inset:0}.drive-pads .pads-left,.drive-pads .pads-right,.drive-pads .pads-mid{bottom:max(16px, env(safe-area-inset-bottom));pointer-events:auto;position:absolute}.pads-left{left:max(18px, env(safe-area-inset-left));gap:16px;display:flex}.pads-right{right:max(18px, env(safe-area-inset-right));grid-template-columns:auto auto;grid-template-areas:"drift drift""gas brake";justify-items:center;gap:10px 16px;display:grid}.pads-mid{left:50%;transform:translate(-50%)}.pad{letter-spacing:.02em;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;opacity:.74;-webkit-backdrop-filter:blur(6px);place-items:center;padding:0;font-weight:900;transition:transform 80ms,opacity 80ms;display:grid;box-shadow:0 6px 16px #0e1b2b40}.pad.down{opacity:1;transform:scale(.92)}.pad.steer{color:#26282c;background:#ffffffe0;border:3px solid #282a2ed9;border-radius:50%;width:78px;height:78px;font-size:34px}.pad.gas,.pad.brake{color:#fff;border:3px solid #ffffff80;border-radius:50%;width:86px;height:86px;font-size:17px}.pad.gas{background:#35b04ae6;grid-area:gas}.pad.brake{background:#e03a3ae6;grid-area:brake;font-size:15px}.pad.drift{color:#0e1b2b;background:#b98cffe6;border:2px solid #ffffff8c;border-radius:999px;grid-area:drift;width:120px;height:40px;font-size:14px}.pad.drs{color:#16171a;background:#ffffffdb;border:3px solid #282a2ed9;border-radius:10px;width:156px;height:50px;font-size:24px}.pad.drs.avail{background:#f5c518eb;border-color:#785a00cc}.pad.drs.on{background:#35d45aeb;border-color:#146e28cc}body.touch-drive .drive-hud{top:max(8px, env(safe-area-inset-top));transform-origin:top;background:#080b10b3;width:auto;min-width:0;bottom:auto;left:50%;right:auto;transform:translate(-50%)scale(.82)}body.touch-drive .d-help{display:none}body.touch-drive .drive-hud{z-index:2}.drive-pads{z-index:1}.rotate-note{display:none}@media (orientation:portrait){body.touch-drive .pads-left,body.touch-drive .pads-right,body.touch-drive .pads-mid,body.touch-drive .drive-hud .d-row,body.touch-drive .drive-hud .d-rev{display:none}body.touch-drive .rotate-note{text-align:center;pointer-events:auto;color:#fff;-webkit-backdrop-filter:blur(10px);background:#0e1b2b8c;align-content:center;place-items:center;gap:8px;padding:24px;display:grid;position:absolute;inset:0}body.touch-drive .rotate-note b{font-size:20px}body.touch-drive .rotate-note span{opacity:.8;font-weight:700}body.touch-drive .rotate-icon{font-size:54px;animation:1.6s ease-in-out infinite turn-phone}}@keyframes turn-phone{0%,30%{transform:rotate(0)}60%,to{transform:rotate(-90deg)}}@media (prefers-reduced-motion:reduce){.rotate-icon{animation:none!important}}@media (width<=640px){.brand{padding:6px 12px;font-size:16px}.actions-top button{padding:7px 10px;font-size:12px}.topbar{flex-direction:column;align-items:stretch}.actions-top{justify-content:flex-start}.back,.toast{top:118px}.hud .time{min-width:84px;font-size:26px}.hud .meta{display:none}.marker{width:56px;height:56px;margin:-28px 0 0 -28px}.view-ctl{top:118px;bottom:auto;right:16px}.view-ctl button{min-width:34px;padding:6px 8px;font-size:12px}.helmet-shot{height:72px}.card{max-height:48vh}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}.styler{gap:8px;margin-top:6px;display:grid}.sty-row{grid-template-columns:92px 1fr;align-items:center;gap:8px;display:grid}.sty-label{color:var(--ink-2);font-size:12px;font-weight:800}.sty-opts{flex-wrap:wrap;gap:5px;display:flex}.sty-opts button{padding:5px 9px;font-size:12px}.sty-opts button[aria-checked=true]{background:var(--ink);color:#fff;border-color:var(--ink)}.sty-opts .sty-swatch{width:22px;height:22px;box-shadow:0 0 0 1px var(--line);border:2px solid #fff;border-radius:50%;padding:0}.sty-opts .sty-swatch[aria-checked=true]{box-shadow:0 0 0 3px var(--ink)}body.touch-drive .drive-hud.compact{left:auto;right:max(10px, env(safe-area-inset-right));top:max(8px, env(safe-area-inset-top));background:#080b1073;border-radius:999px;padding:6px;transform:none}body.touch-drive .drive-hud.compact .d-rev,body.touch-drive .drive-hud.compact .d-row{display:none}body.touch-drive .drive-hud.compact .d-actions{margin:0}body.touch-drive .drive-hud:not(.compact){transform:translate(-50%)scale(.7)}.hud.pit{-webkit-backdrop-filter:blur(10px);background:#0e1b2bdb;gap:14px;padding:10px 12px 10px 18px}.pit-body{min-width:150px}.hud.pit .time{text-align:left;min-width:0}.pit-pad{grid-template-rows:54px 54px;grid-template-columns:66px 30px 66px;place-items:center;gap:6px 8px;display:grid}.pit-car{background:linear-gradient(#5b6778,#3a4556);border-radius:13px 13px 4px 4px;align-self:end;width:26px;height:58px}.pit-car.rear{border-radius:4px 4px 8px 8px;align-self:start;height:48px}.pit-wheel{width:66px;height:54px;color:var(--ink);touch-action:manipulation;-webkit-user-select:none;user-select:none;background:#f5c518;border:none;border-radius:14px;font-size:17px;font-weight:900;transition:transform 80ms,background .15s}.pit-wheel:active:not(:disabled){transform:scale(.92)}.pit-wheel:disabled:not(.done){color:#ffffff8c;background:#ffffff24}.pit-wheel.done{color:#fff;background:#35b04a}.pit-quit{color:#fff;background:0 0;border:1px solid #ffffff59;border-radius:50%;width:36px;height:36px;padding:0}.pit-actions{flex-wrap:wrap;gap:8px;display:flex}.hud.pit .meta b{color:#f5c518}.hud.go{animation:.45s ease-out pit-go}@keyframes pit-go{0%{box-shadow:0 0 #35d45ae6}to{box-shadow:0 0 0 18px #35d45a00}}@media (width<=520px){.hud.pit{flex-wrap:wrap;justify-content:center;width:calc(100vw - 24px)}}@media (prefers-reduced-motion:reduce){.hud.go{animation:none}}body:has(.hud.pit:not([hidden])) .view-ctl{display:none}body.landing-on .topbar,body.landing-on .view-ctl,body.landing-on .card,body.landing-on .back{visibility:hidden}.landing{padding:max(16px, env(safe-area-inset-top)) 16px max(16px, env(safe-area-inset-bottom));opacity:0;background:linear-gradient(#8ccaf326,#0e1b2b40);place-items:center;transition:opacity .4s;display:grid;position:absolute;inset:0;overflow:auto}.landing.in{opacity:1}.landing.out{opacity:0;pointer-events:none}.landing-card{width:min(400px,100%);color:var(--ink);-webkit-backdrop-filter:blur(18px)saturate(170%);backdrop-filter:blur(18px)saturate(170%);background:linear-gradient(135deg,#ffffffb8,#ffffff6b);border:1px solid #ffffffb3;border-radius:24px;padding:22px 22px 16px;transition:transform .45s cubic-bezier(.2,.8,.2,1);transform:translateY(12px);box-shadow:0 18px 50px #0e1b2b40,inset 0 1px #fffc}.landing.in .landing-card{transform:none}.landing-brand{align-items:center;gap:10px;font-size:18px;font-weight:900;display:flex}.landing-brand .mark{background:conic-gradient(#f26b1d 0 25%, #1fb5b0 0 50%, #5b2bb5 0 75%, #1e4fd8 0);border-radius:50%;width:24px;height:24px;box-shadow:inset 0 0 0 4px #fff}.landing h1{margin:10px 0 6px;font-size:28px;font-weight:900;line-height:1.1}.landing-tag{color:var(--ink-2);margin:0 0 16px;font-size:14px;font-weight:700}.landing-form{gap:8px;display:grid}.landing-form label,.landing-label{text-transform:uppercase;letter-spacing:.08em;color:var(--ink-2);font-size:12px;font-weight:900}.landing-form input{font:inherit;border:1px solid var(--line);color:var(--ink);background:#ffffffd9;border-radius:14px;padding:11px 14px;font-size:16px;font-weight:800}.landing-form input:focus-visible{outline-offset:1px;outline:3px solid #1e4fd8}.landing-teams{flex-wrap:wrap;gap:6px;display:flex}.landing-teams button{background:#fffc;align-items:center;gap:6px;padding:6px 11px;font-size:13px;display:inline-flex}.landing-teams button[aria-checked=true]{background:var(--ink);color:#fff;border-color:var(--ink)}.landing .dot,.profile-chip .dot{border-radius:50%;width:12px;height:12px;display:inline-block;box-shadow:0 0 0 2px #fff}.landing-hint{color:#b3261e;min-height:1.1em;margin:0;font-size:13px;font-weight:800}.landing-go{border-radius:14px;padding:12px;font-size:16px}.landing-guest{background:0 0;border-radius:14px;padding:10px}.landing-welcome{align-items:center;gap:10px;margin:4px 0 8px;font-size:18px;font-weight:900;display:flex}.landing-note{color:var(--ink-2);text-align:center;margin:12px 0 0;font-size:12px;font-weight:700}.profile-chip{background:var(--paper);box-shadow:var(--shadow);border-radius:999px;align-items:center;gap:8px;padding:8px 14px;font-weight:900;display:inline-flex}@media (height<=480px){.landing h1{font-size:22px}.landing-tag{display:none}.landing-card{padding:16px}}@media (prefers-reduced-motion:reduce){.landing,.landing-card{transition:none}}@media (width>=1000px){.landing{place-items:center start;padding-left:max(6vw,32px)}}@media (height<=480px) and (orientation:landscape){.landing-card{width:min(700px,100%);padding:14px 18px 10px}.landing h1{margin:6px 0 10px}.landing-form{grid-template-columns:1fr 1fr;grid-template-areas:"nl tl""ni tt""h h""g q";align-items:start;column-gap:18px}.landing-form>label{grid-area:nl}.landing-form>input{grid-area:ni}.landing-form>.landing-label{grid-area:tl}.landing-form>.landing-teams{grid-area:tt}.landing-form>.landing-hint{grid-area:h;min-height:0}.landing-form>.landing-go{grid-area:g}.landing-form>.landing-guest{grid-area:q}.landing-note{margin-top:6px}}