:root{color-scheme:dark;--bg:#08151c;--panel:#10252e;--surface:#16323c;--text:#effbf7;--muted:#aac3c8;--line:#294550;--accent:#9aeac6;--accent-ink:#092c22;--danger:#ffb3b6;--shadow:0 20px 70px #0004;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-size:16px}
:root[data-theme=light]{color-scheme:light;--bg:#f0f5ef;--panel:#fffefa;--surface:#e7efe5;--text:#15312c;--muted:#4b6861;--line:#cbdcd1;--accent:#236c50;--accent-ink:#fff;--danger:#a62c37;--shadow:0 20px 70px #21452d12}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);line-height:1.55}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button{border:1px solid var(--line);border-radius:14px;padding:.75rem 1rem;background:var(--surface);color:var(--text);cursor:pointer;font-weight:650;min-height:46px}button:hover:not(:disabled){filter:brightness(1.13)}button:disabled{opacity:.45;cursor:not-allowed}a{color:var(--accent);text-underline-offset:4px}input,select{display:block;width:100%;min-width:0;padding:.75rem;border:1px solid var(--line);border-radius:12px;background:var(--bg);color:var(--text);min-height:46px}input:invalid:not(:placeholder-shown){border-color:var(--danger)}label{display:block;font-size:.85rem;font-weight:650;color:var(--muted)}label input,label select{margin-top:.35rem}label.check{display:flex;align-items:center;gap:.5rem}label.check input{width:20px;min-height:20px;margin:0}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:4px}h1,h2,p{margin-top:0}h1{font-size:clamp(2rem,5vw,3.9rem);line-height:1.08;letter-spacing:-.055em;margin-bottom:1.1rem}h2{font-size:1.15rem;letter-spacing:-.02em;margin-bottom:1.1rem}em{font-style:normal;color:var(--accent)}[hidden]{display:none!important}.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}.danger{color:var(--danger)}.muted{color:var(--muted);font-size:.9rem}.eyebrow{color:var(--accent);font-size:.72rem;letter-spacing:.2em;font-weight:750}.notice{position:relative;z-index:30;max-width:1152px;margin:0 auto;padding:0 1.25rem;color:var(--accent)}.notice:not(:empty){padding-block:.8rem;border-bottom:1px solid var(--line)}#site-header{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:calc(1.25rem + env(safe-area-inset-top)) max(1.25rem,env(safe-area-inset-right)) 1.25rem max(1.25rem,env(safe-area-inset-left));max-width:1200px;margin:auto}.brand{text-decoration:none;white-space:nowrap;font-size:1.25rem;font-weight:850;letter-spacing:-.04em;color:var(--text)}.brand span{color:var(--accent)}.brand small{font-size:.55rem;letter-spacing:.14em;padding:.3rem .45rem;background:var(--surface);border:1px solid var(--line);border-radius:5px;margin-left:.6rem;vertical-align:middle}.header-actions,.actions{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap}#connection{font-size:.8rem;color:var(--muted);max-width:220px}.header-actions button{font-size:.8rem;min-height:40px;padding:.55rem .7rem}#portal{max-width:1152px;margin:auto;padding:0 1.25rem 3rem}.hero{padding:2.5rem 0 2rem;max-width:850px}.hero>p:not(.eyebrow){color:var(--muted)}.chips{display:flex;gap:.55rem;flex-wrap:wrap}.chips span{border:1px solid var(--line);padding:.35rem .7rem;border-radius:100px;font-size:.75rem;color:var(--muted)}.portal-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr);gap:1rem}.panel{background:var(--panel);border:1px solid var(--line);border-radius:22px;padding:1.4rem;box-shadow:var(--shadow);min-width:0}.wide{grid-column:1/-1}.panel>label,.identity>button,.identity>details{margin-bottom:1rem}.identity>.primary{width:100%}.secondary-link{display:block;margin:.5rem 0 1rem}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1rem}.section-heading h2{margin:0}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-bottom:1rem}.form-grid .span-two{grid-column:1/-1}.form-help{font-size:.82rem;color:var(--muted)}.settings-form>.actions{margin-top:1rem}.room-list{display:grid;gap:.75rem;max-height:420px;overflow:auto}.room-card,.member,.voice-peer{display:flex;align-items:center;justify-content:space-between;gap:.7rem;padding:1rem;border:1px solid var(--line);border-radius:14px;background:var(--bg)}.room-card p,.member p,.voice-peer p{margin:0}.room-card small,.member small{display:block;color:var(--muted)}.join-row{display:flex;align-items:end;gap:.7rem;margin-top:1.5rem}.join-row label{flex:1}#room-code{text-transform:uppercase;letter-spacing:.13em}#room-code-display{color:var(--accent);font-family:ui-monospace,monospace;letter-spacing:.15em}#members{display:grid;gap:.5rem;margin-bottom:1rem}.member[data-ready=true]{border-color:var(--accent)}.member strong{overflow-wrap:anywhere}details{border-top:1px solid var(--line);padding-top:1rem}summary{cursor:pointer;color:var(--muted);margin-bottom:.5rem}#boards-panel{margin-top:1.5rem}.table-wrap{overflow:auto;margin:1rem 0}table{width:100%;border-collapse:collapse;text-align:left;font-size:.85rem}th,td{padding:.8rem;border-bottom:1px solid var(--line);white-space:nowrap}th{font-size:.72rem;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}td:first-child{white-space:normal;overflow-wrap:anywhere;min-width:120px}tr[data-winner=true]{color:var(--accent)}#results{padding-top:2rem}#report-form{margin-top:1.5rem}#footer{max-width:1152px;margin:auto;padding:1rem 1.25rem calc(2rem + env(safe-area-inset-bottom));color:var(--muted);font-size:.8rem}#footer a{margin-left:.5rem}
dialog{color:var(--text);background:var(--panel);border:1px solid var(--line);border-radius:22px;padding:1.5rem;width:min(620px,calc(100% - 2rem));max-height:calc(100dvh - 2rem);overflow:auto;box-shadow:var(--shadow)}dialog::backdrop{background:#031017bf;backdrop-filter:blur(7px)}dialog .actions{margin-block:1rem}#voice-ptt{width:100%;margin:.6rem 0;touch-action:none}#voice-ptt.held{background:var(--accent);color:var(--accent-ink)}#voice-peers{display:grid;gap:.5rem}#voice-status{color:var(--accent)}#game{position:fixed;inset:0;overflow:hidden;background:var(--bg);z-index:20}#arena{position:absolute;inset:0;width:100%;height:100%;touch-action:none;outline:none}.game-top{position:absolute;top:max(14px,env(safe-area-inset-top));left:max(14px,env(safe-area-inset-left));right:max(14px,env(safe-area-inset-right));display:flex;align-items:start;justify-content:space-between;gap:.7rem}.score-pill{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;border:1px solid var(--line);background:var(--panel);padding:.65rem .9rem;border-radius:100px;box-shadow:var(--shadow);font-variant-numeric:tabular-nums}.score-pill>span{font-weight:800}.score-pill small{font-size:.6rem;color:var(--muted)}#timer{margin-left:.5rem}.game-message{position:absolute;left:50%;top:90px;transform:translateX(-50%);text-align:center;max-width:90vw;width:max-content;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:.65rem 1rem;font-size:.85rem;pointer-events:none}.game-message:empty{display:none}.game-bottom{position:absolute;left:max(16px,env(safe-area-inset-left));right:max(16px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));display:flex;align-items:end;justify-content:space-between;gap:.7rem;pointer-events:none}.game-bottom>*,.skill-buttons>*{pointer-events:auto}.joystick{width:84px;height:84px;min-width:84px;border-radius:50%;padding:0;background:var(--panel);opacity:.7;touch-action:none}.joystick span{display:block;width:30px;height:30px;border-radius:50%;background:var(--accent);margin:auto;transform:translate(var(--jx,0),var(--jy,0))}.skill-buttons{display:flex;align-items:end;gap:.45rem;flex-wrap:wrap;justify-content:center;max-width:270px}.skill-buttons button{font-size:.73rem;width:78px;min-height:60px;padding:.45rem;white-space:pre-line}.boost{width:86px;height:86px;border-radius:50%;font-size:.8rem;touch-action:none;padding:.6rem}.boost.held{background:var(--accent);color:var(--accent-ink)}progress{display:block;width:100%;height:6px;accent-color:var(--accent);margin:.35rem 0}.live-board{position:absolute;top:165px;right:14px;max-width:190px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:.6rem .8rem;opacity:.9;pointer-events:none;font-size:.7rem}.live-board:empty{display:none}.live-board p{margin:0;display:flex;justify-content:space-between;gap:1rem}#worm-labels{position:absolute;inset:0;pointer-events:none;overflow:hidden}#worm-labels span{position:absolute;top:0;left:0;font-size:10px;color:var(--text);background:var(--panel);border:1px solid var(--line);padding:2px 6px;border-radius:6px}#worm-labels .is-you{color:var(--accent)}#spectate-next{position:absolute;left:50%;bottom:130px;transform:translateX(-50%)}body.in-game .notice{position:fixed;z-index:35;top:70px;left:10%;right:10%;background:var(--panel);border-radius:12px}body.in-game .notice:empty{display:none}body.in-game #site-header,body.in-game #footer,body.in-game #portal{display:none}
@media(max-width:700px){#site-header{align-items:start;flex-wrap:wrap;gap:.7rem}.header-actions{width:100%}.header-actions #connection{flex:1;max-width:none}.hero{padding-top:1.25rem}.portal-grid{grid-template-columns:1fr}.panel{padding:1.1rem}.hero h1{font-size:2.6rem}.section-heading{align-items:start}.wide{grid-column:auto}.form-grid{gap:.75rem}dialog{padding:1.15rem}.live-board{display:none}#game .skill-buttons{max-width:180px}.skill-buttons button{width:72px;min-height:56px}.joystick{width:64px;height:64px;min-width:64px}.boost{width:72px;height:72px}.score-pill{gap:.4rem;padding:.6rem}.score-pill small{font-size:.55rem}.game-bottom{gap:.4rem}#power{width:100%;min-height:36px}}
@media(max-height:520px) and (orientation:landscape){.game-top{top:8px}.game-bottom{bottom:8px}.game-message{top:64px;font-size:.75rem}.live-board{display:none}.joystick{width:64px;height:64px;min-width:64px}.boost{width:68px;height:68px}.game-bottom .skill-buttons{max-width:none}.skill-buttons button{min-height:46px}}
@media(prefers-reduced-motion:no-preference){button{transition:background .15s,filter .15s}.panel{animation:arrive .25s ease-out}@keyframes arrive{from{opacity:.3;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}}
