html,body{background:#000;height:100%;margin:0}body{place-items:center;display:grid}#game{aspect-ratio:16/9;width:min(100vw,177.778vh);position:relative;container-type:inline-size}#screen{width:100%;height:100%;image-rendering:pixelated;display:block}#crosshair,#flash,#ammo,#banner,#room{pointer-events:none;position:absolute}#crosshair{aspect-ratio:1;filter:drop-shadow(0 0 1px #000);background:linear-gradient(#fff,#fff) 50%/100% 2px no-repeat,linear-gradient(#fff,#fff) 50%/2px 100% no-repeat;width:2cqw;top:50%;left:50%;translate:-50% -50%}#flash{aspect-ratio:1;background:radial-gradient(closest-side,#fffbe0,#ffd56a 45%,#ff9a2a00);width:14cqw;bottom:0;left:50%;translate:-50% 35%}#ammo,#banner,#room{color:#f2dfa7;letter-spacing:.4cqw;text-shadow:0 0 .3cqw #000;font:3cqw/1 sans-serif}#ammo{bottom:1.5cqw;left:2cqw}#banner{letter-spacing:0;font-size:10cqw;top:25%;left:50%;translate:-50% -50%}#room{font-size:2cqw;top:1.5cqw;right:2cqw}#lobby{color:#f2dfa7;background:#000c;place-content:center;justify-items:center;gap:1.5cqw;margin:0;font:2cqw/1.2 sans-serif;display:grid;position:absolute;inset:0}#lobby[hidden],#ready-bar[hidden]{display:none}#lobby fieldset{border:0;gap:1cqw;margin:0;padding:0;display:flex}#lobby button,#lobby input,#ready{font:inherit;padding:.6cqw 1.2cqw}#code{text-transform:uppercase;width:9ch}#status{min-height:1.2em;margin:0}#ready-bar{color:#f2dfa7;text-shadow:0 0 .3cqw #000;align-items:center;gap:1cqw;font:2cqw/1.2 sans-serif;display:flex;position:absolute;bottom:1.5cqw;left:50%;translate:-50%}
