:root{color-scheme:dark;--bg: #0e0f1a;--panel: rgb(16 18 34 / .82);--panel-border: rgb(255 255 255 / .12);--text: #f1eee6;--muted: #a9a7b8;--accent: #f2b544;--danger: #ff7a6b;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--text)}body{display:grid;place-items:center}#stage{position:relative;width:min(100vw,200vh);aspect-ratio:2 / 1;container-type:size;font-size:clamp(10px,1.9cqh,20px)}#game,#overlay{position:absolute;inset:0}#game canvas{display:block;touch-action:none}#overlay{pointer-events:none;display:grid;place-items:center}.panel{pointer-events:auto;background:var(--panel);border:1px solid var(--panel-border);border-radius:.8em;padding:1em 1.4em;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}[hidden]{display:none!important}.status{grid-area:1 / 1;z-index:1;text-align:center;max-width:70%}.status .detail{color:var(--muted);font-size:.85em}.status button{font:inherit;padding:.4em 1.2em;border-radius:.5em;border:none;background:var(--accent);color:#1b1405;font-weight:600;cursor:pointer}.lobby{position:absolute;top:.8em;left:.8em;width:13em;max-height:calc(100% - 1.6em);overflow:auto;padding:.6em .75em;background:#101222b8}.lobby header{margin-bottom:.3em;position:relative}.lobby header .mute{position:absolute;top:0;right:0;padding:.1em .25em;font-size:.95em;line-height:1;background:none;border:1px solid transparent;border-radius:4px;cursor:pointer}.lobby header .mute:hover,.lobby header .mute:focus-visible{border-color:var(--muted)}.lobby h1{margin:0;font-size:1.15em;color:var(--accent);letter-spacing:.02em}.lobby .tagline{margin:.15em 0 0;color:var(--muted);font-size:.72em;line-height:1.3}.lobby h2{font-size:.8em;margin:.6em 0 .35em;font-weight:600}.lobby .count{color:var(--muted);font-weight:400}.players{list-style:none;margin:0;padding:0;display:grid;gap:.25em}.player{display:flex;align-items:center;gap:.45em;padding:.2em .4em;border-radius:.45em;background:#ffffff0d;min-width:0;font-size:.85em}.player.me{outline:1px solid var(--accent)}.player .name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.player .tag{font-size:.7em;text-transform:uppercase;letter-spacing:.06em;color:var(--accent)}.player .tag.bot{color:var(--muted)}.tag.dq{color:var(--danger);font-weight:700}.player .score{font-variant-numeric:tabular-nums;font-weight:600;min-width:1.6em;text-align:right}.player .score:empty{display:none}.player[data-status=spectating]:not([data-role=trapper]),.player[data-status=dead],.player.away{opacity:.5}.tag.trapper{display:inline-block;flex:none;width:1.4em;height:1.1em;background-size:300% 100%;background-position:50% 0;background-repeat:no-repeat;image-rendering:pixelated;vertical-align:middle}.lobby.placing{opacity:.35;pointer-events:none}.lobby{transition:opacity .15s ease}.lobby.behind{opacity:.2}.player .tag.away{color:var(--muted)}.lobby .controls{margin-top:.6em;font-size:.7em;color:var(--muted)}.lobby .controls p{margin:.1em 0}.lobby .controls .hint{opacity:.75}.tune{position:absolute;top:2.2em;right:.8em;width:17em;max-height:calc(100% - 3em);overflow:auto;padding:.5em .7em;font-size:.72em;background:#101222d9}.tune h2{margin:0 0 .3em;font-size:1em}.tune label{display:grid;grid-template-columns:7.5em 1fr 3em;align-items:center;gap:.4em}.tune input{width:100%}.tune output{text-align:right;font-variant-numeric:tabular-nums}.tune div{display:flex;gap:.5em;margin-top:.4em}.tune button{font:inherit;padding:.2em .8em;border-radius:.4em;border:none;cursor:pointer}.tune .note{margin:.5em 0 0;color:var(--muted);line-height:1.3}.avatar{position:relative;flex:none;width:1.8em;height:1.8em;border-radius:50%;display:grid;place-items:center;overflow:hidden;font-weight:700;font-size:.95em;color:#fff;background:hsl(var(--hue, 200) 55% 45%)}.avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.round{position:absolute;top:.6em;left:50%;transform:translate(-50%);display:grid;justify-items:center;gap:.25em;max-width:46%;text-align:center;text-shadow:0 1px 2px rgb(0 0 0 / .8)}.round p{margin:0}.round .start{pointer-events:auto;font:inherit;font-weight:700;padding:.45em 1.4em;border-radius:.6em;border:none;background:var(--accent);color:#1b1405;cursor:pointer;box-shadow:0 .2em .8em #0006}.round .start:disabled{opacity:.6;cursor:default}.round .pick{pointer-events:auto;display:flex;align-items:center;gap:.4em;font-size:.8em;color:var(--muted)}.round .pick select{font:inherit;max-width:14em;padding:.2em .4em;border-radius:.4em;border:1px solid rgb(255 255 255 / .25);background:#101222d9;color:#f4ecd8;cursor:pointer}.round .start-hint{font-size:.7em;color:var(--muted)}.round .round-label{font-size:.75em;color:var(--muted);letter-spacing:.04em;text-transform:uppercase}.round .timer{font-size:1.5em;font-weight:700;font-variant-numeric:tabular-nums}.round .round-status{font-size:.85em;padding:.2em .7em;border-radius:.5em;background:#101222b8}.round .traps{padding:.25em .8em;border-radius:.5em;background:#101222b8;border:1px solid var(--accent)}.round .traps .left{font-weight:700;color:var(--accent)}.round .traps .hint{font-size:.7em;color:var(--muted)}.round .traps .tool{margin:.2em 0;padding:.15em .7em;font:inherit;font-size:.8em;color:var(--fg);background:#2a2f4c;border:1px solid rgb(92 99 140);border-radius:.5em;cursor:pointer;pointer-events:auto}.countdown{grid-area:1 / 1;font-size:6em;font-weight:800;color:var(--accent);font-variant-numeric:tabular-nums;text-shadow:0 .06em 0 #1b1405,0 0 .3em rgb(0 0 0 / .6)}.countdown.go{color:#9be37a}.standings{grid-area:1 / 1;min-width:18em;max-width:60%;max-height:80%;display:flex;flex-direction:column;pointer-events:none}.standings .rows{overflow:auto;min-height:0;flex:1 1 auto}.standings thead th{position:sticky;top:0;z-index:1;background:#101222}.standings h2{margin:0 0 .4em;font-size:1em;color:var(--accent);text-align:center}.standings table{width:100%;border-collapse:collapse;font-size:.85em}.standings th{font-weight:600;color:var(--muted);font-size:.8em;text-align:left;padding:0 .4em .2em}.standings td{padding:.2em .4em;font-variant-numeric:tabular-nums}.standings tr.me td{color:var(--accent)}.standings tr[data-status=dead] td,.standings tr[data-status=racing] td{color:var(--muted)}.standings tr[data-dq] .time{color:var(--danger)}.standings .tag.dq{font-size:.7em;letter-spacing:.06em}.standings .who{display:flex;align-items:center;gap:.45em;min-width:0}.standings .who .name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:10em}.standings .place,.standings .points,.standings .score{text-align:right}.standings .next{margin:.5em 0 0;text-align:center;color:var(--muted);font-size:.8em}.standings[data-mode=cup] h2{font-size:1.15em}.standings[data-mode=cup] tr.winner td{color:#ffd34d;font-weight:600}
