*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:#0b0e11;color:#cfe8d4;font-family:ui-monospace,Cascadia Mono,JetBrains Mono,Consolas,monospace;user-select:none}#app{position:fixed;inset:0}canvas#gl{position:absolute;inset:0;width:100%;height:100%;display:block}#hud{position:absolute;inset:0;pointer-events:none;z-index:5}#hud .cam{position:absolute;top:14px;left:16px;font-size:13px;letter-spacing:.08em;color:#9fffc7;text-shadow:0 0 6px rgba(90,255,150,.35);display:flex;align-items:center;gap:8px}#hud .rec-dot{width:9px;height:9px;border-radius:50%;background:#ff3b30;box-shadow:0 0 8px #ff3b30;animation:recblink 1.2s steps(2,start) infinite}@keyframes recblink{50%{opacity:.25}}#hud .timer{position:absolute;top:14px;right:178px;font-size:13px;color:#9fffc7;letter-spacing:.1em}#hud .score{position:absolute;top:36px;right:178px;width:150px;font-size:11px;text-align:right;color:#9fffc7}#hud .srow{display:flex;justify-content:space-between;gap:8px;padding:1px 0;opacity:.85}#hud .srow.me{color:#eaffea;font-weight:700}#hud .tdm-score,#hud .zscore{display:flex;align-items:baseline;gap:6px;justify-content:flex-end;flex-wrap:wrap}#hud .tdm-score b{font-size:20px}#hud .zscore b{font-size:13px}#hud small{opacity:.7}#hud .hp{position:absolute;bottom:18px;left:18px;font-size:30px;font-weight:700;color:#9fffc7;text-shadow:0 0 8px rgba(90,255,150,.4)}#hud .hp.low{color:#ff6b5d;text-shadow:0 0 10px rgba(255,60,40,.7)}#hud .reloadbar{position:absolute;bottom:56px;left:18px;height:4px;width:0%;background:#9fffc7;opacity:0;transition:opacity .15s}#hud .weapon{position:absolute;bottom:20px;right:18px;font-size:16px;letter-spacing:.12em;color:#9fffc7}#hud .crosshair{position:absolute;top:50%;left:50%;width:0;height:0}#hud .crosshair i{position:absolute;background:#c9ffdd;opacity:.9;box-shadow:0 0 4px #78ffaa99}#hud .crosshair i:nth-child(1){width:2px;height:6px;left:-1px;top:-12px}#hud .crosshair i:nth-child(2){width:2px;height:6px;left:-1px;top:6px}#hud .crosshair i:nth-child(3){width:6px;height:2px;left:-12px;top:-1px}#hud .crosshair i:nth-child(4){width:6px;height:2px;left:6px;top:-1px}#hud .crosshair b{position:absolute;width:2px;height:2px;left:-1px;top:-1px;background:#c9ffdd}#hud .hitmark{position:absolute;top:50%;left:50%;width:22px;height:22px;transform:translate(-50%,-50%) rotate(45deg);opacity:0}#hud .hitmark:before,#hud .hitmark:after{content:"";position:absolute;background:#fff}#hud .hitmark:before{left:10px;top:0;width:2px;height:22px}#hud .hitmark:after{top:10px;left:0;width:22px;height:2px}#hud .banner{position:absolute;top:22%;left:0;right:0;text-align:center;font-size:26px;letter-spacing:.15em;color:#eaffea;text-shadow:0 0 12px rgba(120,255,170,.5);opacity:0;transition:opacity .25s}#hud .banner .sub{display:block;font-size:13px;opacity:.8;margin-top:6px;letter-spacing:.25em}#hud .respawn{position:absolute;top:60%;left:0;right:0;text-align:center;font-size:20px;letter-spacing:.2em;color:#ff9d92;opacity:0;transition:opacity .3s}#hud .dmg-flash{position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 45%,rgba(255,30,20,.55) 100%);opacity:0;pointer-events:none}#hud .killfeed{position:absolute;top:130px;right:178px;width:210px;font-size:11px;text-align:right}#hud .kf{display:flex;justify-content:flex-end;gap:6px;padding:2px 0;opacity:.9}#hud .kf .w{opacity:.65;font-size:10px;align-self:center}#hud .kf.me{color:#ffd2c9}#hud .minimap-wrap{position:absolute;top:14px;right:14px;border:1px solid rgba(120,255,170,.25);background:#080c0ad9}#hud .minimap{display:block}#hud .chat-log{position:absolute;bottom:90px;left:18px;width:420px;font-size:12px;color:#bfe9c9}#hud .cmsg{padding:1px 0;text-shadow:0 1px 2px #000}#hud .cmsg b{color:#8fe8a8}.grain{position:absolute;inset:0;width:100%;height:100%;image-rendering:pixelated;opacity:1;pointer-events:none;mix-blend-mode:screen}#hud .scoreboard{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:460px;background:#060c09e0;border:1px solid rgba(120,255,170,.3);padding:14px 18px}#hud .scoreboard.hidden{display:none}#hud .sb-teams{display:flex;justify-content:space-between;font-size:20px;font-weight:700;margin-bottom:8px;letter-spacing:.1em}#hud .sb-teams .a{color:#6db3ff}#hud .sb-teams span:last-child{color:#ff9d7a}#hud .sb-table{width:100%;border-collapse:collapse;font-size:13px}#hud .sb-table td{padding:3px 6px;text-align:left}#hud .sb-table td:nth-child(3),#hud .sb-table td:nth-child(4){text-align:right}#hud .sb-table tr.me td{color:#8dffb0;font-weight:700}#hud .sb-table tr:nth-child(n+6){opacity:.65}#hud:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at center,transparent 55%,rgba(0,0,0,.5) 100%)}#hud:after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(0,0,0,.12) 0 1px,transparent 1px 3px);opacity:.5}.screen{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:10}.screen.hidden{display:none!important}.screen.dim{background:#0408068c;pointer-events:none}.pause-msg{font-size:18px;letter-spacing:.2em;color:#9fffc7;text-shadow:0 0 10px rgba(90,255,150,.4)}.menu-inner,.lobby-inner,.end-inner{text-align:center}.title{font-size:56px;letter-spacing:.3em;margin:0;color:#d6ffe0;text-shadow:0 0 18px rgba(90,255,150,.45)}.title span{color:#57e389}.tagline{margin-top:6px;font-size:12px;letter-spacing:.25em;color:#6fae86}.field{display:flex;flex-direction:column;align-items:center;gap:6px;margin:26px 0 18px}.field span{font-size:11px;letter-spacing:.3em;color:#6fae86}.field input{background:#14281c99;border:1px solid rgba(120,255,170,.3);color:#d6ffe0;font:inherit;font-size:18px;letter-spacing:.1em;padding:8px 14px;width:260px;text-align:center;outline:none;user-select:text}.field input:focus{border-color:#57e389;box-shadow:0 0 12px #57e38940}.modes,.maps{display:flex;gap:10px;justify-content:center;margin-bottom:14px;flex-wrap:wrap}.mode{display:flex;flex-direction:column;align-items:flex-start;gap:4px;background:#14281c80;color:#9fcdb2;border:1px solid rgba(120,255,170,.18);padding:10px 14px;font:inherit;font-size:12px;text-align:left;cursor:pointer;min-width:150px}.mode b{font-size:14px;color:#cfe8d4;letter-spacing:.08em}.mode span{font-size:10px;opacity:.75}.mode.sel{border-color:#57e389;background:#264e348c;box-shadow:0 0 14px #57e38940}.mode:hover{border-color:#57e389}button.big{margin-top:10px;padding:14px 54px;font:inherit;font-size:20px;letter-spacing:.35em;color:#0b0e11;background:#57e389;border:none;cursor:pointer;box-shadow:0 0 24px #57e38966}button.big:hover{background:#74f0a1}button.ghost{margin-top:18px;background:none;border:1px solid rgba(120,255,170,.3);color:#9fcdb2;font:inherit;padding:8px 22px;cursor:pointer}button.ghost:hover{border-color:#57e389}.hint{margin-top:18px;font-size:10px;letter-spacing:.08em;color:#5d8a6d}.lobby-inner h2,.end-inner h2{font-size:26px;letter-spacing:.2em;color:#d6ffe0}#lobby-players{margin:18px auto;min-width:280px;display:flex;flex-direction:column;gap:6px}.lp{display:flex;justify-content:space-between;background:#14281c80;border:1px solid rgba(120,255,170,.15);padding:7px 14px;font-size:14px}.lp.bot span{opacity:.6}.lp i{font-size:10px;color:#57e389;letter-spacing:.15em}.lp.bot i{color:#6fae86}#lobby-start{font-size:13px;color:#57e389;letter-spacing:.2em}#end-sub{margin-top:14px;font-size:13px;color:#6fae86;letter-spacing:.15em}.conn-msg{font-size:16px;letter-spacing:.2em;color:#ffd27f;animation:recblink 1s steps(2,start) infinite}#lobby-side{display:flex;gap:10px;align-items:center;justify-content:center;margin:14px 0 4px}.side-q{font-size:10px;letter-spacing:.25em;color:#57a07a;margin-right:8px}.side{background:#1222188c;color:#9fcdb2;border:1px solid rgba(120,255,170,.25);font:inherit;font-size:12px;letter-spacing:.15em;padding:8px 18px;cursor:pointer}.side:hover{background:#57e3892e}.side.on{background:#57e38947;color:#c9ffdc;border-color:#8cffb499}.lp .zb{color:#ff5d52;font-style:normal;margin-left:6px;font-size:11px}#rooms-panel{margin-top:16px;text-align:left}.rp-title{font-size:10px;letter-spacing:.3em;color:#57a07a;margin-bottom:6px}.rooms-list{display:flex;flex-direction:column;gap:4px;min-height:28px}.room{display:flex;align-items:center;gap:10px;background:#1222188c;border:1px solid rgba(120,255,170,.14);padding:6px 12px;font-size:12px}.room .rname{min-width:190px;letter-spacing:.05em}.room .rmeta{opacity:.65;font-size:11px;flex:1;text-align:right}.room .join{background:#57e3891f;color:#8dffb0;border:1px solid rgba(120,255,170,.35);font:inherit;font-size:11px;letter-spacing:.15em;padding:3px 12px;cursor:pointer}.room .join:hover{background:#57e3894d}.room.empty{justify-content:center;opacity:.5;font-size:11px;letter-spacing:.05em}.set-title{font-size:22px;letter-spacing:.25em;color:#d6ffe0;margin-bottom:22px}.set-row{display:flex;align-items:center;gap:14px;margin-bottom:14px;background:#12221880;border:1px solid rgba(120,255,170,.15);padding:10px 16px;min-width:420px}.set-row label{flex:1;font-size:12px;letter-spacing:.1em;color:#9fcdb2}.set-row input[type=range]{width:180px;accent-color:#57e389}.set-row select{background:#122218;color:#cfe8d4;font:inherit;padding:4px 8px;border:1px solid rgba(120,255,170,.3)}.set-val{width:40px;text-align:right;font-size:13px;color:#8dffb0}button.big.small{padding:10px 34px;font-size:15px;margin-top:8px}#end-top{margin-top:22px;min-width:340px;text-align:left}.et-row{display:flex;gap:18px;padding:4px 14px;font-size:13px;color:#cfe8d4;border-bottom:1px solid rgba(120,255,170,.12)}.et-row span:nth-child(2),.et-row span:nth-child(3){text-align:right}.et-row span:nth-child(1){flex:1}.et-head{color:#57a07a;font-size:10px;letter-spacing:.2em}#intro{position:absolute;inset:0;z-index:15;background:#04070a;display:flex;align-items:center;justify-content:center;transition:opacity .55s}#intro.fade{opacity:0;pointer-events:none}#intro.hidden{display:none}.intro-inner{text-align:center;animation:introflicker .9s steps(3,end) 2}.intro-rec{font-size:18px;letter-spacing:.4em;color:#ff5d52;display:flex;gap:10px;align-items:center;justify-content:center}.intro-name{margin-top:14px;font-size:30px;letter-spacing:.35em;color:#d6ffe0;text-shadow:0 0 14px rgba(90,255,150,.4)}.intro-sub{margin-top:8px;font-size:11px;letter-spacing:.3em;color:#57a07a}@keyframes introflicker{0%{opacity:1}40%{opacity:.55}80%{opacity:.9}to{opacity:1}}#chatbox{position:absolute;bottom:60px;left:50%;transform:translate(-50%);z-index:20}#chatbox input{background:#08100ce6;border:1px solid rgba(120,255,170,.4);color:#d6ffe0;font:inherit;font-size:14px;padding:8px 12px;width:420px;outline:none;user-select:text}
