*{box-sizing:border-box}html,body{margin:0;height:100%;background:#12141f;color:#e8e8f0;font-family:ui-monospace,Cascadia Mono,Consolas,monospace;overflow:hidden}#game{position:fixed;inset:0;display:grid;place-items:center}#game canvas{image-rendering:pixelated;display:block}#hud{position:fixed;inset:0;pointer-events:none;display:flex;flex-direction:column;justify-content:space-between;padding:12px 16px;font-size:12px;line-height:1.6;text-shadow:0 1px 2px #000}#hud-top{display:flex;justify-content:space-between;gap:16px}#players{display:flex;flex-direction:column;gap:2px}#players .slot{display:flex;align-items:center;gap:6px;opacity:.95}#players .dot{width:8px;height:8px;border-radius:2px}#players .me{font-weight:700}#players .off{opacity:.4}#stats{text-align:right;color:#9aa0b5;white-space:pre}#controls{color:#9aa0b5;align-self:center}#controls kbd{background:#262a3d;border:1px solid #3a3f57;border-bottom-width:2px;border-radius:3px;padding:1px 5px;margin:0 1px;color:#e8e8f0}#overlay{position:fixed;inset:0;display:grid;place-items:center;background:#12141feb;text-align:center;padding:24px;transition:opacity .25s}#overlay.hidden{opacity:0;pointer-events:none}#overlay h1{font-size:18px;margin:0 0 10px;letter-spacing:.05em}#overlay p{margin:0;color:#9aa0b5;font-size:13px;max-width:460px;line-height:1.7}#overlay button{pointer-events:auto;margin-top:18px;cursor:pointer;font:inherit;font-size:13px;padding:8px 20px;background:#4cc9f0;color:#12141f;border:0;border-radius:4px}#overlay button:hover{background:#7ad8f5}#touch-controls{position:fixed;inset:0;pointer-events:none;z-index:10}#touch-controls .touch-btn{pointer-events:auto;position:absolute;bottom:28px;display:grid;place-items:center;width:64px;height:64px;border-radius:16px;border:2px solid rgba(255,255,255,.25);background:#14182873;color:#e8e8f0;font-size:28px;font-weight:700;user-select:none;-webkit-user-select:none;touch-action:none;-webkit-touch-callout:none}#touch-controls .touch-btn.pressed{background:#4cc9f08c;border-color:#fff9}#touch-controls .touch-left{left:20px}#touch-controls .touch-right{left:96px}#touch-controls .touch-jump{right:20px;bottom:40px;border-radius:50%;width:76px;height:76px}@media(pointer:coarse){#controls{display:none}}#lobby{position:fixed;inset:0;display:grid;place-items:center;background:#0b0e16eb;z-index:30}.lobby-box{width:min(360px,calc(100vw - 32px));display:flex;flex-direction:column;gap:10px;text-align:center}.lobby-title{font-size:26px;letter-spacing:.08em;margin:0 0 6px;color:#4cc9f0}.lobby-label{font-size:12px;text-align:left;color:#9aa0b5;margin-top:4px}.lobby-input{font:inherit;font-size:15px;padding:10px 12px;background:#1a1e2f;border:1px solid #333a55;border-radius:6px;color:#e8e8f0;outline:none}.lobby-input:focus{border-color:#4cc9f0}.lobby-chars{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:4px}.lobby-char{cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 4px 8px;background:#1a1e2f;border:2px solid #333a55;border-radius:8px;color:#e8e8f0;font:inherit}.lobby-char canvas{image-rendering:pixelated;width:48px;height:72px}.lobby-char.selected{border-color:#4cc9f0;background:#20263c}.lobby-char-name{font-size:12px;font-weight:700}.lobby-char-dot{width:10px;height:10px;border-radius:50%}.lobby-start{cursor:pointer;margin-top:8px;font:inherit;font-size:15px;font-weight:700;padding:12px;background:#4cc9f0;border:0;border-radius:6px;color:#12141f}.lobby-start:hover:not(:disabled){background:#7ad8f5}.lobby-start:disabled{opacity:.4;cursor:not-allowed}#chat-btn{position:fixed;left:50%;bottom:14px;transform:translate(-50%);z-index:20;width:48px;height:48px;border-radius:50%;border:2px solid rgba(255,255,255,.25);background:#14182880;font-size:20px;cursor:pointer;pointer-events:auto;touch-action:manipulation}#chat-btn.active{background:#4cc9f08c}#chat-input{position:fixed;left:50%;bottom:14px;transform:translate(-50%);z-index:21;width:min(380px,calc(100vw - 160px));padding:10px 12px;font:inherit;font-size:14px;background:#1a1e2f;border:1px solid #333a55;border-radius:8px;color:#e8e8f0;outline:none}#chat-input:focus{border-color:#4cc9f0}#chat-send{position:fixed;right:24px;bottom:14px;z-index:21;padding:10px 16px;font:inherit;font-size:14px;font-weight:700;background:#4cc9f0;border:0;border-radius:8px;color:#12141f;cursor:pointer}@media(pointer:coarse){#chat-btn{bottom:108px}}