:root{--bg: #0a0b14;--panel: rgba(14, 16, 30, .92);--neon: #39ff8a;--pink: #ff5c8a;--warn: #ffc23a;--bad: #ff3355;--text: #e8e6f2;--dim: #8d8aa8;--font: "Trebuchet MS", "Segoe UI", system-ui, sans-serif;--mono: "Courier New", ui-monospace, monospace}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--text);font-family:var(--font);overflow:hidden;-webkit-user-select:none;user-select:none;touch-action:none}#app{position:fixed;inset:0}#game-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}.hidden{display:none!important}button{font-family:var(--font);font-weight:700;letter-spacing:.06em;background:#1d2036;color:var(--text);border:1px solid #3a3f66;border-radius:6px;padding:10px 16px;cursor:pointer;transition:transform .08s,background .15s,box-shadow .15s;text-transform:uppercase}button:hover{background:#262a4a;box-shadow:0 0 12px #39ff8a40}button:active{transform:scale(.97)}button:disabled{opacity:.4;cursor:default}button.big{padding:14px 26px;font-size:16px}button.primary{background:var(--neon);color:#05140a;border-color:var(--neon);box-shadow:0 0 18px #39ff8a66}button.primary:hover{background:#6fffab}button.mini{padding:4px 8px;font-size:11px;border-radius:4px}button.mini.sel{background:var(--neon);color:#05140a}input{font-family:var(--mono);font-size:16px;background:#0b0d1a;color:var(--text);border:1px solid #3a3f66;border-radius:6px;padding:10px 12px;text-transform:uppercase;letter-spacing:.15em}input:focus{outline:none;border-color:var(--neon)}#screens{position:absolute;inset:0;z-index:20}.screen{position:absolute;inset:0;display:none;align-items:center;justify-content:center;padding:16px;overflow:auto;background:radial-gradient(ellipse at center,#14193cd9,#06060ef7)}.screen.dim{background:#04050cb8}.screen.on{display:flex}.panel{background:var(--panel);border:1px solid #2c3055;border-radius:12px;padding:26px 30px;max-width:760px;width:100%;box-shadow:0 0 40px #39ff8a1f,inset 0 0 60px #0006;position:relative}.panel.small{max-width:480px}.panel h2{margin:0 0 12px;font-size:26px;letter-spacing:.15em;color:var(--neon);text-shadow:0 0 14px rgba(57,255,138,.6)}.logo{display:flex;align-items:center;gap:18px}.logo-rat{font-size:64px;filter:drop-shadow(0 0 14px var(--pink));animation:bob 2.4s ease-in-out infinite}@keyframes bob{0%,to{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-6px) rotate(4deg)}}.logo h1{margin:0;font-size:44px;line-height:.95;letter-spacing:.12em;color:#fff;text-shadow:0 0 18px var(--pink),0 0 40px rgba(255,92,138,.5)}.tag{color:var(--dim);font-size:14px;margin:14px 0 18px}.profile{display:flex;gap:18px;align-items:center;flex-wrap:wrap;margin-bottom:14px}.profile label{display:flex;flex-direction:column;gap:4px;font-size:11px;color:var(--dim);letter-spacing:.15em}.swatches{display:flex;gap:6px}.swatch{width:28px;height:28px;border-radius:50%;padding:0;border:2px solid transparent}.swatch.sel{border-color:#fff;box-shadow:0 0 10px currentColor}.btnrow{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:12px 0}.solo-bots{font-size:12px;color:var(--dim);display:flex;gap:4px;align-items:center}.joinrow{display:flex;gap:8px}.joinrow input{width:110px;text-align:center}.status{min-height:18px;font-size:13px;color:var(--dim);font-family:var(--mono)}.status.error{color:var(--bad)}.howto{margin-top:12px;font-size:13px;color:var(--dim)}.howto summary{cursor:pointer;color:var(--text);letter-spacing:.1em}.howto .cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin:10px 0}.howto b{color:var(--neon)}.forms{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px}.formcard{background:#10122a;border:1px solid #2c3055;border-radius:8px;padding:8px;display:flex;flex-direction:column;gap:4px}.formcard b{color:var(--text)}.formcard em{color:var(--warn);font-size:11px}.fineprint{margin-top:12px;font-size:11px;color:#55587a}.fineprint code{font-family:var(--mono)}.code{font-size:20px;letter-spacing:.2em;display:flex;align-items:center;gap:12px;margin-bottom:14px}.code b{font-family:var(--mono);font-size:34px;color:var(--warn);text-shadow:0 0 12px rgba(255,194,58,.6)}.players{display:grid;gap:8px;margin-bottom:14px}.lp{display:flex;align-items:center;gap:12px;background:#10122a;border:1px solid #2c3055;border-radius:8px;padding:10px 14px;font-size:16px}.lp i{width:16px;height:16px;border-radius:50%;display:inline-block;box-shadow:0 0 8px currentColor}.lp em{font-style:normal;font-size:10px;letter-spacing:.15em;background:#2c3055;padding:2px 6px;border-radius:3px;color:var(--neon)}.lp.empty{color:#44476a;border-style:dashed;justify-content:center}.lp .mini{margin-left:auto}.controls-list{display:grid;grid-template-columns:1fr 1fr;gap:6px;font-size:13px;color:var(--dim);margin:10px 0 16px}.controls-list b{color:var(--text)}#result-title.win{color:var(--neon)}#result-title.lose{color:var(--bad);text-shadow:0 0 14px rgba(255,51,85,.6)}.reason{color:var(--dim);font-style:italic}.summary{display:flex;gap:20px;flex-wrap:wrap;font-size:13px;color:var(--dim);margin-bottom:10px}.summary b{color:var(--text)}#result-stats table{width:100%;border-collapse:collapse;font-size:14px}#result-stats th{text-align:left;color:var(--dim);font-size:11px;letter-spacing:.15em;padding:6px 8px;border-bottom:1px solid #2c3055}#result-stats td{padding:8px;border-bottom:1px solid #1a1d38}#result-stats td.num{font-family:var(--mono);color:var(--warn);text-align:right}.dot{width:10px;height:10px;display:inline-block;border-radius:50%;margin-right:8px}.total{text-align:right;margin-top:10px;letter-spacing:.15em;color:var(--dim)}.total b{color:var(--neon);font-size:24px;margin-left:10px}#hud{position:absolute;inset:0;z-index:10;pointer-events:none;font-size:13px}#hud-top{position:absolute;top:12px;left:50%;transform:translate(-50%);width:min(520px,70vw)}#wake-label{display:flex;justify-content:space-between;font-weight:700;letter-spacing:.15em;font-size:12px;margin-bottom:4px}#wake-clock{font-family:var(--mono);color:var(--text)}#wake-bar{height:14px;background:#0a0c18cc;border:1px solid #3a3f66;border-radius:7px;position:relative;overflow:hidden}#wake-fill{height:100%;width:0;background:var(--neon);transition:width .15s linear;box-shadow:0 0 10px currentColor}.wake-tick{position:absolute;top:0;bottom:0;width:1px;background:#ffffff59}#wake-sub{text-align:center;font-size:9px;letter-spacing:.3em;color:var(--dim);margin-top:3px}#hud-objective{position:absolute;top:12px;left:14px;background:#0a0c18b3;border-left:3px solid var(--warn);padding:8px 12px;max-width:300px}#obj-title{font-size:9px;letter-spacing:.3em;color:var(--dim)}#obj-text{font-weight:700;color:var(--warn);font-size:13px;margin:2px 0}#obj-room{font-family:var(--mono);font-size:11px;color:var(--dim)}#minimap{position:absolute;top:12px;right:14px;border:1px solid #3a3f66;border-radius:6px;width:220px;height:160px}#hud-form{position:absolute;left:14px;bottom:14px;background:#0a0c18bf;border:1px solid #2c3055;border-radius:10px;padding:12px 14px;width:300px}#hud-form.downed{border-color:var(--bad);opacity:.7}#form-name{font-size:22px;font-weight:900;letter-spacing:.2em;color:#fff;text-shadow:0 0 10px var(--pink)}#form-tag{font-size:10px;letter-spacing:.25em;color:var(--dim);margin-bottom:6px}.bar{height:10px;background:#0b0d1a;border:1px solid #3a3f66;border-radius:5px;overflow:hidden;position:relative}.bar>div{height:100%;background:#7cff9e;transition:width .15s}.bar.hp{height:16px}.bar.hp span{position:absolute;inset:0;text-align:center;font-size:10px;line-height:15px;font-family:var(--mono);color:#fff;text-shadow:0 0 3px #000}#form-kit{display:grid;gap:4px;margin:8px 0;font-size:12px}.kit b{display:inline-block;min-width:34px;background:#2c3055;border-radius:3px;padding:1px 5px;font-size:10px;text-align:center;margin-right:6px}.cdbar{height:4px;background:#0b0d1a;margin-top:3px;border-radius:2px;overflow:hidden}.cdbar>div{height:100%}#form-keys{display:flex;gap:4px;flex-wrap:wrap;align-items:center}.fkey{display:inline-flex;flex-direction:column;align-items:center;width:40px;padding:3px 0;border:1px solid #3a3f66;border-radius:4px;font-weight:700;font-size:13px;color:var(--dim);line-height:1}.fkey small{font-size:8px;letter-spacing:.1em;margin-top:2px}.fkey.cur{border-color:var(--pink);color:#fff;background:#ff5c8a40}.fkey.ok{border-color:var(--neon);color:var(--neon)}.fkey.no{opacity:.4}.stn{font-size:10px;color:var(--neon);letter-spacing:.1em;margin-left:4px}#gene{font-size:11px;color:var(--warn);margin-top:6px;letter-spacing:.1em}#hud-squad{position:absolute;right:14px;bottom:14px;display:grid;gap:6px;width:220px}.sq{background:#0a0c18bf;border:1px solid #2c3055;border-radius:6px;padding:6px 8px;display:grid;grid-template-columns:12px 1fr auto;gap:6px;align-items:center;font-size:12px}.sq i{width:10px;height:10px;border-radius:50%;display:block}.sq .st{font-size:9px;letter-spacing:.15em;color:var(--dim)}.sq .bar{grid-column:1 / -1;height:5px}.sq.down{border-color:var(--bad)}.sq.down .st{color:var(--bad)}#hud-hint{position:absolute;bottom:14px;left:50%;transform:translate(-50%);font-size:13px;letter-spacing:.1em;color:var(--text);background:#0a0c18b3;padding:6px 14px;border-radius:6px;border:1px solid #2c3055;min-height:30px}#hud-hint:empty{display:none}#hud-seen{position:absolute;top:90px;left:50%;transform:translate(-50%);font-weight:900;letter-spacing:.3em;color:var(--bad);font-size:16px;opacity:0;text-shadow:0 0 14px var(--bad)}#hud-spectate{position:absolute;top:120px;left:50%;transform:translate(-50%);background:#f353;border:1px solid var(--bad);padding:8px 16px;border-radius:6px;letter-spacing:.1em;font-size:13px}#hud-score{position:absolute;top:180px;right:14px;font-family:var(--mono);color:var(--warn);font-size:14px;letter-spacing:.1em}#toasts{position:absolute;top:40%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:6px}.toast{background:#0a0c18d9;border:1px solid var(--neon);color:var(--text);padding:8px 18px;border-radius:6px;font-weight:700;letter-spacing:.12em;font-size:15px;animation:pop .25s ease-out;transition:opacity .5s,transform .5s}.toast.bad{border-color:var(--bad);color:#ffb0c0}.toast.warn{border-color:var(--warn);color:#ffe0a0}.toast.out{opacity:0;transform:translateY(-10px)}@keyframes pop{0%{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}#eventlog{position:absolute;left:14px;top:100px;display:flex;flex-direction:column;gap:3px;font-size:11px;font-family:var(--mono);color:var(--dim)}.logline{transition:opacity .6s}.logline.out{opacity:0}.logline.bad{color:var(--bad)}.logline.good{color:var(--neon)}#tags{position:absolute;inset:0;z-index:0}#hud>*:not(#tags):not(#hurt){z-index:1}.ntag{position:absolute;left:0;top:0;transform:translate(-50%,-100%);font-size:11px;font-weight:700;letter-spacing:.1em;text-shadow:0 0 4px #000,0 0 8px #000;white-space:nowrap;margin-left:-20px}#hurt{position:absolute;inset:0;box-shadow:inset 0 0 120px #f350;pointer-events:none}#hurt.on{animation:hurt .5s ease-out}@keyframes hurt{0%{box-shadow:inset 0 0 160px #ff3355bf}to{box-shadow:inset 0 0 120px #f350}}#stage-flash{position:absolute;top:30%;left:50%;transform:translate(-50%,-50%);font-size:42px;font-weight:900;letter-spacing:.3em;color:var(--bad);text-shadow:0 0 30px var(--bad);opacity:0;pointer-events:none;white-space:nowrap}#stage-flash.on{animation:stageflash 2.2s ease-out}@keyframes stageflash{0%{opacity:0;transform:translate(-50%,-50%) scale(1.6)}15%{opacity:1;transform:translate(-50%,-50%) scale(1)}80%{opacity:1}to{opacity:0}}#touch{position:absolute;inset:0;z-index:15}.stick{position:absolute;width:0;height:0;opacity:0;pointer-events:none}.stick.on{opacity:1}.stick .base{position:absolute;left:-55px;top:-55px;width:110px;height:110px;border-radius:50%;border:2px solid rgba(57,255,138,.4);background:#39ff8a0f}.stick .knob{position:absolute;left:-22px;top:-22px;width:44px;height:44px;border-radius:50%;background:#39ff8a80}.tbtns{position:absolute;right:16px;bottom:120px;display:grid;grid-template-columns:1fr 1fr;gap:10px;pointer-events:auto}.tbtn{width:62px;height:62px;border-radius:50%;font-size:15px;background:#141832bf;border:2px solid #3a3f66;padding:0}.tbtn.small{width:44px;height:44px;font-size:12px}.tbtn.on{background:var(--neon);color:#05140a}.formmenu{position:absolute;right:16px;bottom:300px;display:grid;gap:6px;pointer-events:auto}.formmenu button{width:130px;display:flex;gap:8px;align-items:center;justify-content:flex-start}.formmenu small{font-size:10px;color:var(--dim)}@media(max-width:720px){#minimap{width:140px;height:100px}#hud-form{width:220px;padding:8px 10px}#form-name{font-size:16px}#hud-squad{width:150px;bottom:auto;top:120px}#hud-top{width:60vw}#hud-objective{max-width:200px;font-size:11px}#hud-score{top:116px}.logo h1{font-size:30px}.panel{padding:16px}}.touch-on #minimap{width:130px;height:92px}.touch-on #hud-score{top:112px;font-size:12px}.touch-on #hud-squad{inset:76px auto auto 14px;width:150px;gap:4px}.touch-on .sq{padding:4px 6px;font-size:11px}.touch-on #eventlog{display:none}.touch-on #hud-form{width:210px;padding:8px 10px}.touch-on #form-name{font-size:16px}.touch-on #form-kit{display:none}.touch-on .tbtns{bottom:64px;right:12px;gap:8px}.touch-on .tbtn{width:56px;height:56px;font-size:13px}.touch-on #hud-hint{bottom:8px;font-size:11px;max-width:45vw;text-align:center}.touch-on #hud-top{width:44vw}.touch-on #hud-objective{max-width:190px;font-size:10px;padding:6px 8px}.touch-on #obj-text{font-size:11px}