:root{--bg: #030308;--text: #f2fbff;--text-dim: #5c6975;--neon: #ff2d78;--neon-soft: rgba(255, 45, 120, .4);--ok: #39ffa4;--warn: #ffce54;--danger: #ff5a36;--mono: "JetBrains Mono", "Fira Code", ui-monospace, monospace;--snap: cubic-bezier(.16, 1, .3, 1)}@media(prefers-reduced-motion:reduce){*{animation-duration:.001ms!important;transition-duration:.001ms!important}#join h1:after{animation:none!important;opacity:1!important}#join h1{animation:none!important;opacity:1!important;text-shadow:0 0 24px var(--neon-soft)!important}}html,body{margin:0;height:100%;background:var(--bg);overflow:hidden}#game{display:block;width:100vw;height:100vh}::selection{background:var(--neon);color:var(--bg)}:focus-visible{outline:1px solid var(--neon);outline-offset:3px}#debug{position:fixed;top:8px;left:8px;font:12px/1.5 var(--mono);color:var(--text-dim);padding:2px 0;pointer-events:none}#join{position:fixed;inset:0;display:flex;flex-direction:column;gap:20px;align-items:center;justify-content:center;background:var(--bg);color:var(--text);font-family:var(--mono)}#join[hidden]{display:none}#join h1{position:relative;margin:0 0 6px;font-size:clamp(32px,6vw,52px);font-weight:700;letter-spacing:8px;color:var(--neon);animation:tube-on 1.3s linear both,breathe 5s ease-in-out 1.3s infinite}#join h1:after{content:"_";margin-left:6px;animation:caret 1s steps(1) infinite}@keyframes tube-on{0%,2%{opacity:.25;text-shadow:none}3%{opacity:1;text-shadow:0 0 2px var(--neon)}6%,7%{opacity:.3;text-shadow:none}9%{opacity:1;text-shadow:0 0 2px var(--neon),0 0 24px var(--neon-soft)}10%,20%{opacity:.4;text-shadow:none}22%{opacity:1;text-shadow:0 0 2px var(--neon),0 0 30px var(--neon-soft),0 0 60px var(--neon-soft)}to{opacity:1;text-shadow:0 0 2px var(--neon),0 0 30px var(--neon-soft),0 0 60px var(--neon-soft)}}@keyframes breathe{0%,to{text-shadow:0 0 2px var(--neon),0 0 30px var(--neon-soft),0 0 60px var(--neon-soft)}50%{text-shadow:0 0 2px var(--neon),0 0 18px var(--neon-soft),0 0 40px var(--neon-soft)}}@keyframes caret{0%,49%{opacity:1}50%,to{opacity:0}}#join input{font:15px/1 var(--mono);width:220px;padding:8px 2px;text-align:center;background-color:transparent;background-image:linear-gradient(var(--neon),var(--neon));background-repeat:no-repeat;background-position:center bottom;background-size:0% 2px;color:var(--text);border:none;border-bottom:1px solid rgba(242,251,255,.2);border-radius:0;transition:background-size .26s var(--snap),border-color .16s var(--snap)}#join input::placeholder{color:var(--text-dim)}#join input:hover{border-color:#f2fbff66}#join input:focus{outline:none;background-size:100% 2px}#join button{font:15px/1 var(--mono);font-weight:700;letter-spacing:1px;padding:10px 30px;cursor:pointer;background:transparent;color:var(--neon);border:1px solid var(--neon);border-radius:0;transition:transform .16s var(--snap),background .16s var(--snap),color .16s var(--snap)}#join button:hover,#join button:focus-visible{background:var(--neon);color:var(--bg);transform:translateY(-2px);animation:ignite .48s var(--snap)}#join button:active{transform:translateY(0) scale(.98)}@keyframes ignite{0%{box-shadow:0 0 0 transparent,0 0 0 transparent}12%{box-shadow:0 0 2px var(--neon),0 0 0 transparent}22%{box-shadow:0 0 0 transparent,0 0 0 transparent}40%{box-shadow:0 0 10px var(--neon-soft),0 0 26px var(--neon-soft)}to{box-shadow:0 0 14px var(--neon-soft),0 0 32px var(--neon-soft)}}#join-error{color:var(--danger);min-height:1.5em;font-size:13px}#reload{position:relative;font:13px var(--mono);padding:4px 0;cursor:pointer;background:none;border:none;color:var(--danger)}#reload:after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:var(--danger);transform:scaleX(0);transition:transform .22s var(--snap)}#reload:hover:after,#reload:focus-visible:after{transform:scaleX(1)}#toplink{position:relative;color:var(--text-dim);text-decoration:none;font-size:13px;padding-bottom:2px;transition:color .16s var(--snap)}#toplink:after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:var(--neon);transform:scaleX(0);transform-origin:left;transition:transform .22s var(--snap)}#toplink:hover,#toplink:focus-visible{color:var(--text)}#toplink:hover:after,#toplink:focus-visible:after{transform:scaleX(1)}#hud{position:fixed;left:0;right:0;bottom:16px;display:flex;gap:18px;align-items:center;justify-content:center;font-family:var(--mono);pointer-events:none}#hud[hidden]{display:none}#hpbar{width:220px;height:6px;background:#f2fbff1a}#hpfill{height:100%;width:100%;background:linear-gradient(90deg,var(--ok),var(--warn) 65%,var(--danger));background-size:220px 100%;transition:width .22s var(--snap)}#timer{color:var(--text);font-size:15px;letter-spacing:1px}#mute{pointer-events:auto;font-size:15px;padding:2px 6px;background:none;border:none;color:var(--text-dim);cursor:pointer;transition:color .16s var(--snap),transform .16s var(--snap)}#mute:hover,#mute:focus-visible{color:var(--neon);transform:scale(1.15)}#dead{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;color:var(--danger);font:28px/1 var(--mono);letter-spacing:1px;text-shadow:0 0 20px var(--danger);background:#03030899;pointer-events:none}#dead[hidden]{display:none}#dead:not([hidden]){animation:punch-in .32s var(--snap) both}@keyframes punch-in{0%{opacity:0;transform:scale(.92)}60%{opacity:1;transform:scale(1.03)}to{opacity:1;transform:scale(1)}}#scoreboard{position:fixed;top:8px;right:8px;min-width:160px;padding:8px 10px;font:12px/1.6 var(--mono);color:var(--text-dim);background:linear-gradient(180deg,#030308b3,#0303084d)}#scoreboard[hidden]{display:none}#killfeed{position:fixed;top:8px;left:50%;transform:translate(-50%);font:12px/1.8 var(--mono);color:var(--text);text-align:center;pointer-events:none}#killfeed>*{animation:feed-in .26s var(--snap) both}@keyframes feed-in{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}#round{position:fixed;top:30%;left:0;right:0;text-align:center;font:32px/1 var(--mono);font-weight:700;letter-spacing:3px;color:var(--neon);text-shadow:0 0 30px var(--neon-soft);pointer-events:none}#round[hidden]{display:none}#round:not([hidden]){animation:punch-in .36s var(--snap) both}
