html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#8fb3c2}#application-canvas{display:block;width:100%;height:100%;outline:none}#hud{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;color:#fff8de;font:14px/1.4 system-ui,-apple-system,sans-serif;z-index:5}.panel{background:#132a35c9;border:1px solid #fffae833;border-radius:14px;box-shadow:0 3px 16px #0003;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.scoreboard{position:absolute;top:14px;left:50%;transform:translate(-50%);width:min(460px,calc(100vw - 260px));padding:10px 16px 12px;text-align:center}.scoreboard header{display:flex;justify-content:space-between;align-items:baseline}.scoreboard header strong{letter-spacing:3px;font-size:16px}#turn{font-size:12px;font-weight:600;color:#abffd6}.scores{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:6px 0 4px}.scores div{border-radius:10px;padding:4px 0;background:#ffffff0d;border:1px solid transparent}.scores div.mine{border-color:#9bffd4aa;background:#35634f66}.scores div.turn b:after{content:" ●";color:#ffd36b;font-size:12px;vertical-align:middle}.scores b{display:block;font-size:26px;font-variant-numeric:tabular-nums}.scores small{font-size:11px;letter-spacing:.5px;opacity:.8}#message{margin:4px 0 0;font-size:13px;min-height:1.4em}#crosshair{position:absolute;top:50%;left:50%;width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%;background:#fff8de;box-shadow:0 0 0 1.5px #0007}#pickup-prompt{position:absolute;transform:translate(-50%,-100%);padding:6px 10px;border-radius:8px;background:#ffffffe8;color:#132a35;font:700 19px system-ui,sans-serif;box-shadow:0 2px 8px #0005}#power{position:absolute;left:50%;bottom:90px;width:200px;height:20px;margin-left:-100px;border-radius:6px;background:#12202ae6;padding:2px;box-sizing:border-box}#power i{display:block;height:100%;width:0;border-radius:4px;background:#66ffc7}#camera-toggle,#sound-toggle{position:absolute;pointer-events:auto;display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 12px;border:1px solid #fffae84d;border-radius:999px;background:#132a35cf;color:#fff8de;font:600 12px system-ui,sans-serif;cursor:pointer}#camera-toggle{top:74px;right:14px}#camera-toggle svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8}#sound-toggle{top:116px;right:14px}#sound-toggle[aria-pressed=true]{color:#ffd2d2;background:#2a1d24cc}#help{position:absolute;left:50%;bottom:14px;transform:translate(-50%);max-width:min(900px,calc(100vw - 28px));padding:7px 14px;font-size:12px;text-align:center;opacity:.9}#help b{color:#abffd6;font-weight:600}#click-to-play,#connecting{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;pointer-events:none}#click-to-play>div,#connecting>div{display:grid;gap:6px;padding:18px 26px;border-radius:16px;background:#132a35e0;text-align:center;box-shadow:0 4px 24px #0005}#click-to-play strong,#connecting strong{font-size:20px;letter-spacing:1px}#connecting{background:#172b34cc}#connecting[hidden],#click-to-play[hidden],#pickup-prompt[hidden],#power[hidden],.touch-controls #help,.touch-controls #click-to-play,.touch-controls #sound-toggle{display:none}.touch-controls .scoreboard{top:calc(10px + env(safe-area-inset-top));width:min(340px,calc(100vw - 300px));padding:6px 12px 8px}.touch-controls .scores{margin:2px 0}.touch-controls .scores b{font-size:18px}.touch-controls .scores small{font-size:10px}.touch-controls #message{font-size:11px}.touch-controls #camera-toggle{top:calc(120px + env(safe-area-inset-top));right:14px}@media(max-width:720px){#help{display:none}.scoreboard{width:calc(100vw - 200px);left:14px;transform:none}}