:root{--cream:#fff4e0;--card:#fff9ee;--ink:#3c2a1a;--ink-soft:#7a6248;--orange:#e8762d;--orange-deep:#c85a17;--green:#5c8a3c;--gold:#f2b53d;--shadow:0 12px 40px #3c220a59;--radius:18px;font-size:16px}*{box-sizing:border-box;-webkit-user-select:none;user-select:none}html,body{height:100%;color:var(--ink);background:#2c1d0f;margin:0;padding:0;font-family:Avenir Next,Trebuchet MS,Segoe UI,system-ui,sans-serif;overflow:hidden}#app{outline:none;position:fixed;inset:0}.screen{flex-direction:column;justify-content:center;align-items:center;gap:18px;padding:20px;display:flex;position:absolute;inset:0}.hidden{display:none!important}.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:26px 30px}.menu-backdrop{z-index:-1;background:radial-gradient(1200px 600px at 70% -10%,#ffdf9e 0%,#ffdf9e00 60%),linear-gradient(#f7b267 0%,#e8863a 34%,#a8542c 68%,#57351b 100%);position:absolute;inset:0}.menu-backdrop:after{content:"";background:radial-gradient(8px 8px at 12% 30%,#fff4e040 40%,#0000 41%),radial-gradient(10px 10px at 78% 18%,#fff4e033 40%,#0000 41%),radial-gradient(7px 7px at 40% 72%,#fff4e029 40%,#0000 41%),radial-gradient(9px 9px at 62% 55%,#fff4e024 40%,#0000 41%);position:absolute;inset:0}.menu-card{flex-direction:column;gap:14px;width:min(430px,94vw);display:flex;position:relative}.logo{letter-spacing:.5px;color:var(--orange-deep);text-shadow:0 2px #fff,0 4px 14px #c85a1740;margin:0;font-size:2.6rem;font-weight:800;line-height:1}.logo em{color:var(--green);font-style:normal}.tagline{color:var(--ink-soft);margin:-6px 0 2px;font-size:.95rem}.field{color:var(--ink-soft);flex-direction:column;gap:6px;font-size:.9rem;font-weight:700;display:flex}input{font:inherit;color:var(--ink);-webkit-user-select:text;user-select:text;background:#fffdf7;border:2px solid #e4cdb0;border-radius:10px;outline:none;padding:10px 12px}input:focus{border-color:var(--orange)}.char-picker{flex-wrap:wrap;gap:8px;display:flex}.char-swatch{cursor:pointer;color:#fff;text-shadow:0 1px 2px #0006;border:3px solid #0000;border-radius:12px;justify-content:center;align-items:center;width:38px;height:38px;font-weight:800;transition:transform 80ms;display:flex;box-shadow:inset 0 -6px 10px #0000002e}.char-swatch:hover{transform:translateY(-2px)}.char-swatch.sel{border-color:var(--ink);transform:translateY(-2px)scale(1.06)}.char-picker.small .char-swatch{border-radius:9px;width:30px;height:30px;font-size:.8rem}.menu-actions{flex-direction:column;gap:10px;margin-top:4px;display:flex}.join-row{gap:10px;display:flex}.join-row input{text-transform:uppercase;letter-spacing:4px;text-align:center;flex:1;font-weight:800}.btn{font:inherit;color:var(--ink);cursor:pointer;background:#f3e3c8;border:0;border-radius:12px;padding:12px 18px;font-weight:800;transition:transform 60ms,filter .12s;box-shadow:0 3px #d8c09a}.btn:hover{filter:brightness(1.05)}.btn:active{transform:translateY(2px);box-shadow:0 1px #d8c09a}.btn.primary{background:linear-gradient(180deg, #f68b3c, var(--orange-deep));color:#fff;text-shadow:0 1px 2px #00000040;box-shadow:0 3px #96430f}.btn.primary:active{box-shadow:0 1px #96430f}.btn.small{padding:8px 12px;font-size:.85rem}.btn.ghost{box-shadow:none;color:var(--ink-soft);background:0 0;border:2px solid #e4cdb0}.btn.big{width:100%;padding:14px;font-size:1.15rem}.btn:disabled{opacity:.55;cursor:not-allowed}.error{color:#a33a24;background:#ffe3dd;border:2px solid #f2a08e;border-radius:10px;padding:9px 12px;font-size:.9rem;font-weight:600}.hint{color:var(--ink-soft);text-align:center;margin:0;font-size:.83rem}.controls-note{color:var(--ink-soft);flex-wrap:wrap;justify-content:center;align-items:center;gap:14px;max-width:min(860px,94vw);padding:12px 18px;font-size:.85rem;display:flex}.controls-note b{color:var(--ink)}kbd{background:#f1e2c8;border:1px solid #d8c09a;border-bottom-width:3px;border-radius:6px;padding:1px 6px;font-family:inherit;font-size:.8rem;font-weight:800}.lobby-card{flex-direction:column;gap:16px;width:min(560px,94vw);display:flex}.lobby-head{justify-content:space-between;align-items:center;gap:12px;display:flex}.room-code-wrap{align-items:baseline;gap:10px;display:flex}.room-code-label{color:var(--ink-soft);text-transform:uppercase;letter-spacing:1px;font-size:.8rem;font-weight:800}.room-code{letter-spacing:8px;color:var(--orange-deep);background:#f7e8cd;border-radius:12px;padding:2px 10px 2px 18px;font-size:2.2rem;font-weight:900}.lobby-title{text-align:center;color:var(--ink-soft);margin:0;font-size:1.1rem}.lobby-players{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;min-height:96px;display:grid}.lobby-seat{background:#fdf1da;border:2px dashed #e4cdb0;border-radius:14px;align-items:center;gap:10px;padding:10px 12px;font-weight:700;display:flex}.lobby-seat.filled{background:#fffdf7;border-style:solid;border-color:#ead9b8}.lobby-seat .dot{border-radius:9px;flex:none;width:26px;height:26px;box-shadow:inset 0 -6px 8px #0003}.lobby-seat .who{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.lobby-seat .tag{text-transform:uppercase;letter-spacing:.5px;border-radius:6px;margin-left:auto;padding:2px 6px;font-size:.68rem;font-weight:800}.tag.host{background:var(--gold);color:#6b4a08}.tag.waiting{color:#4c3a80;background:#dcd4f5}.tag.off{color:#999;background:#eee}.char-line{color:var(--ink-soft);flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;font-weight:700;display:flex}.lobby-actions{flex-direction:column;align-items:center;gap:8px;display:flex}.lobby-share{margin-top:-4px}#screen-game{padding:0}#gl{width:100%;height:100%;display:block;position:absolute;inset:0}#hud{pointer-events:none;font-weight:800;position:absolute;inset:0}.hud-chip{color:var(--cream);letter-spacing:1px;background:#2e1c0cb8;border-radius:12px;padding:8px 14px;font-size:1.05rem;position:absolute;top:14px;box-shadow:0 4px 14px #00000040}#hud-lap{left:14px}#hud-lap b{color:var(--gold);font-size:1.3rem}#hud-time{letter-spacing:0;font-size:.95rem;left:50%;transform:translate(-50%)}.dim{opacity:.6;font-weight:400}.mono{font-variant-numeric:tabular-nums;font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace}.hud-place{color:#fff;text-shadow:0 2px #3c1e05e6,0 6px 18px #0006;font-size:3.4rem;font-style:italic;position:absolute;top:8px;right:16px}.hud-place sup{font-size:1.3rem}#hud-standings{flex-direction:column;align-items:flex-end;gap:3px;display:flex;position:absolute;top:78px;right:16px}.stand-row{color:var(--cream);background:#2e1c0c8c;border-radius:8px;align-items:center;gap:7px;max-width:200px;padding:3px 9px;font-size:.78rem;display:flex}.stand-row.me{background:#e8762de6}.stand-row .pos{color:var(--gold);text-align:right;min-width:14px}.stand-row .nm{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.stand-row .sw{border-radius:3px;flex:none;width:10px;height:10px}#hud-item{background:#2e1c0cb8;border:3px solid #fff4e059;border-radius:16px;justify-content:center;align-items:center;width:74px;height:74px;font-size:2.3rem;display:flex;position:absolute;bottom:16px;left:14px;box-shadow:0 4px 14px #00000040}#hud-item .key-hint{background:var(--gold);color:#5c3d05;border-radius:8px;padding:2px 7px;font-size:.75rem;position:absolute;top:-8px;right:-8px;box-shadow:0 2px 6px #0000004d}#hud-speed{color:#fff;text-shadow:0 2px 6px #00000080;text-align:right;font-size:1rem;position:absolute;bottom:18px;right:18px}#hud-speed b{font-size:2rem;font-style:italic}#minimap{opacity:.92;filter:drop-shadow(0 4px 10px #00000059);position:absolute;bottom:102px;left:14px}#hud-notify{flex-direction:column;align-items:center;gap:6px;display:flex;position:absolute;top:64px;left:50%;transform:translate(-50%)}.notify{color:var(--cream);white-space:nowrap;background:#2e1c0cc7;border-radius:999px;padding:7px 16px;font-size:.95rem;animation:.18s pop}.notify.gold{background:var(--gold);color:#5c3d05}@keyframes pop{0%{opacity:0;transform:scale(.6)}}#hud-countdown{color:#fff;text-shadow:0 4px #3c1e05e6,0 10px 40px #00000080;justify-content:center;align-items:center;font-size:9rem;font-style:italic;animation:.9s infinite count-zoom;display:flex;position:absolute;inset:0}#hud-countdown.go{color:#8fe86b;animation-duration:.5s}@keyframes count-zoom{0%{opacity:.2;transform:scale(1.25)}30%{opacity:1;transform:scale(1)}}#hud-banner{color:var(--gold);text-shadow:0 3px #3c1e05e6,0 8px 30px #00000080;text-align:center;font-size:2.4rem;font-style:italic;animation:.25s pop;position:absolute;top:34%;left:50%;transform:translate(-50%,-50%)}#hud-controls{color:#fff4e0bf;text-shadow:0 1px 3px #0009;font-size:.72rem;position:absolute;bottom:8px;left:50%;transform:translate(-50%)}.overlay{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);pointer-events:auto;background:#1e12088c;justify-content:center;align-items:center;padding:20px;display:flex;position:absolute;inset:0}.results-card{flex-direction:column;gap:12px;width:min(440px,94vw);max-height:88vh;display:flex;overflow:auto}.results-card h2{text-align:center;color:var(--orange-deep);margin:0}.results-card p{text-align:center}#results-rows{flex-direction:column;gap:6px;display:flex}.result-row{background:#fdf1da;border-radius:12px;align-items:center;gap:10px;padding:8px 12px;font-weight:700;display:flex}.result-row.me{outline:3px solid var(--orange)}.result-row .place{text-align:center;width:34px;font-size:1.2rem;font-style:italic}.result-row .dot{border-radius:8px;flex:none;width:22px;height:22px}.result-row .nm{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.result-row .tm{font-variant-numeric:tabular-nums;color:var(--ink-soft);font-family:ui-monospace,Menlo,monospace;font-size:.9rem}.result-row.dnf{opacity:.65}.results-actions{flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;display:flex}#waiting-list{flex-direction:column;gap:6px;display:flex}.wait-row{background:#fdf1da;border-radius:10px;align-items:center;gap:8px;padding:6px 10px;font-weight:700;display:flex}.wait-row .dot{border-radius:6px;width:18px;height:18px}.spin{vertical-align:-4px;border:3px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:18px;height:18px;margin-right:8px;animation:.8s linear infinite rot;display:inline-block}@keyframes rot{to{transform:rotate(360deg)}}