*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#10150f;color:#fff;font:16px system-ui,sans-serif;user-select:none}canvas{display:block;width:100%;height:100%;cursor:crosshair;touch-action:none}#hud,#controls,#online{position:fixed;background:#071007df;border:1px solid #384a31}#hud{top:16px;left:16px;display:flex;gap:18px;padding:10px 14px;border-left:4px solid #9bbc67}#hud b{color:#d8edaa}#health{color:#8cff83}#score{color:#ffd477}#controls{bottom:14px;left:50%;transform:translateX(-50%);padding:8px 14px;font-size:11px;letter-spacing:.1em;pointer-events:none}#online{right:16px;top:16px;padding:9px 13px;color:#d8edaa;text-decoration:none;font-weight:800}#banner{position:fixed;top:26%;left:0;right:0;text-align:center;font-size:44px;font-weight:900;letter-spacing:.16em;text-shadow:0 4px 18px #000;pointer-events:none;opacity:0;transition:opacity .3s}#game-over{position:fixed;inset:0;display:grid;place-items:center;background:#080b08eF}#game-over>div{width:min(440px,90vw);padding:36px;text-align:center;border:1px solid #7da05b;background:#172016;box-shadow:0 20px 80px #000}#game-over h1{color:#ef786c;letter-spacing:.12em}button,#game-over a{display:block;width:100%;padding:14px;margin-top:12px;border:1px solid #71845d;background:#68853e;color:#fff;font:inherit;font-weight:800;text-decoration:none;cursor:pointer}.hidden{display:none!important}@media(max-width:760px){#hud{gap:8px;font-size:12px;flex-wrap:wrap;right:16px;padding-right:110px}#controls{display:none}}