:root{--sky:#c8e6c0;--ink:#163044;--paper:#f4f1ea;--cyan:#3df0ff;--amber:#ffb040;--hedge:#4cae2a;--danger:#e24b4b}*{box-sizing:border-box;margin:0;padding:0}html,body{background:var(--sky);width:100%;height:100%;color:var(--ink);-webkit-user-select:none;user-select:none;font-family:Avenir Next,Segoe UI,sans-serif;overflow:hidden}#game,canvas{width:100%;height:100%;display:block;position:fixed;inset:0}#hud{pointer-events:none;z-index:10;position:fixed;inset:0}#hud .panel{pointer-events:auto}.crosshair{border:2px solid #ffffffe6;border-radius:50%;width:18px;height:18px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 1px #16304459}.crosshair.hit{border-color:var(--cyan)}.crosshair.head{border-color:var(--amber);transform:translate(-50%,-50%)scale(1.25)}.scope{background:radial-gradient(circle,#0000 18%,#061016e0 22%);display:none;position:absolute;inset:0}.scope.on{display:block}.scope .mil{pointer-events:none;position:absolute;top:50%;left:50%}.scope .mil-h{opacity:.8;background:repeating-linear-gradient(90deg,#fff 0 2px,#0000 2px 14px);width:220px;height:2px;margin:-1px 0 0 -110px}.scope .mil-v{opacity:.8;background:repeating-linear-gradient(#fff 0 2px,#0000 2px 14px);width:2px;height:220px;margin:-110px 0 0 -1px}.scope .dot{background:#fff;border-radius:50%;width:4px;height:4px;margin:-2px 0 0 -2px;position:absolute;top:50%;left:50%}.hp{width:220px;position:absolute;bottom:24px;left:24px}.hp .bar{background:#16304440;border:1px solid #ffffff80;border-radius:8px;height:14px;overflow:hidden}.hp .fill{transform-origin:0;background:linear-gradient(90deg,#e24b4b,#f4f1ea);width:100%;height:100%}.hp .label{letter-spacing:.08em;color:#163044;margin-bottom:4px;font-size:12px}.ammo{text-align:right;position:absolute;bottom:24px;right:24px}.ammo .mag{font-size:42px;font-weight:700;line-height:1}.ammo .res{opacity:.7;font-size:16px}.ammo .reload{background:#16304433;width:120px;height:4px;margin-top:6px;margin-left:auto}.ammo .reload>i{background:var(--cyan);width:0;height:100%;display:block}.slots{gap:8px;display:flex;position:absolute;bottom:110px;right:24px}.slots span{text-align:center;background:#f4f1ea8c;border:1px solid #16304426;border-radius:8px;min-width:72px;padding:6px 8px;font-size:12px}.slots span.on{color:#fff;background:#3d6f94}.score{background:#f4f1eab3;border-radius:999px;align-items:center;gap:16px;padding:6px 16px;font-weight:700;display:flex;position:absolute;top:16px;left:50%;transform:translate(-50%)}.score .a{color:#3d6f94}.score .b{color:#5a2a24}.score .t{font-variant-numeric:tabular-nums;opacity:.75;font-weight:500}.score .ot{letter-spacing:.08em;color:#5a2a24;font-size:11px;font-weight:700;display:none}.score.overtime .ot{display:inline}.feed{text-align:right;color:#163044;font-size:13px;position:absolute;top:16px;right:20px}.feed div{text-shadow:0 1px #fff9;margin-bottom:4px}.minimap{background:#b7d9a8;border:2px solid #ffffffb3;border-radius:12px;width:140px;height:140px;position:absolute;bottom:72px;left:24px;overflow:hidden}.minimap canvas{width:100%;height:100%;display:block}.dmg{position:absolute;inset:0}.dmg i{opacity:0;border:10px solid #0000;width:0;height:0;position:absolute}.dmg .n{border-bottom-color:#e24b4b;margin-left:-10px;top:38%;left:50%}.dmg .s{border-top-color:#e24b4b;margin-left:-10px;bottom:38%;left:50%}.dmg .e{border-left-color:#e24b4b;margin-top:-10px;top:50%;right:38%}.dmg .w{border-right-color:#e24b4b;margin-top:-10px;top:50%;left:38%}.dmg i.on{opacity:.9}.overlay{pointer-events:auto;background:linear-gradient(#c8e6c08c,#f4f1eab8);justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.card{background:#f4f1eaeb;border-radius:20px;width:min(440px,92vw);padding:28px 28px 24px;box-shadow:0 20px 50px #1630442e}.card h1{letter-spacing:.08em;text-transform:uppercase;font-size:36px}.card p{opacity:.75;margin:8px 0 18px}.card label{letter-spacing:.08em;text-transform:uppercase;margin:10px 0 4px;font-size:12px;display:block}.card input{width:100%;color:var(--ink);background:#fff;border:1px solid #16304433;border-radius:10px;padding:10px 12px;font-size:16px}.row{gap:10px;margin-top:18px;display:flex}.btn{cursor:pointer;color:#fff;background:#3d6f94;border:0;border-radius:12px;flex:1;padding:12px 14px;font-size:15px;font-weight:600}.btn.ghost{color:#163044;background:0 0;border:1px solid #16304440}.hint{opacity:.6;margin-top:14px;font-size:12px}.plist{margin-top:12px;font-size:14px}.plist div{padding:4px 0}.scoreboard{pointer-events:none;background:#f4f1eaf0;border-radius:16px;width:min(640px,92vw);padding:18px 20px 16px;display:none;position:absolute;top:16%;left:50%;transform:translate(-50%);box-shadow:0 16px 40px #16304429}.scoreboard.on{display:block}.scoreboard .sb-cols{grid-template-columns:1fr 1fr;gap:20px;display:grid}.scoreboard .sb-team h2{letter-spacing:.1em;margin-bottom:8px;font-size:14px}.scoreboard .sb-team.a h2{color:#3d6f94}.scoreboard .sb-team.b h2{color:#5a2a24}.scoreboard .sb-head,.scoreboard .sb-row{justify-content:space-between;gap:12px;padding:3px 0;font-size:14px;display:flex}.scoreboard .sb-head{letter-spacing:.08em;text-transform:uppercase;opacity:.55;font-size:11px}.scoreboard .sb-row.me{font-weight:700}.scoreboard .sb-row.gone{opacity:.45}.scoreboard .sb-row.empty{opacity:.4}.scoreboard .sb-win{text-align:center;letter-spacing:.12em;text-transform:uppercase;margin-top:14px;font-weight:800}.banner{letter-spacing:.12em;text-transform:uppercase;color:#163044;text-shadow:0 2px #fff;font-size:28px;font-weight:800;display:none;position:absolute;top:28%;left:50%;transform:translate(-50%)}.banner.on{display:block}.debug{color:#163044;background:#ffffff73;border-radius:6px;padding:6px 8px;font:11px/1.4 ui-monospace,monospace;display:none;position:absolute;top:12px;left:12px}.debug.on{display:block}.lag-ctl{color:#163044;pointer-events:auto;background:#ffffff73;border-radius:6px;flex-direction:column;gap:4px;min-width:160px;padding:6px 8px;font:11px/1.4 ui-monospace,monospace;display:none;position:absolute;top:92px;left:12px}.lag-ctl.on{display:flex}.lag-ctl input{width:100%}.nameplate{pointer-events:none;white-space:nowrap;background:#f4f1eacc;border-radius:6px;padding:2px 6px;font-size:12px;position:absolute;transform:translate(-50%,-100%)}