:root{color-scheme:dark;--bg: #14161f;--panel: #1f2230;--panel-border: #33384d;--text: #e8e9f0;--text-dim: #9aa0b4;--accent: #5fd6e0;--accent-strong: #38b6c2;--danger: #e0544f;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,sans-serif}#app{min-height:100%;display:flex;align-items:center;justify-content:center;padding:16px}img{max-width:100%}[hidden]{display:none!important}.screen{width:100%;max-width:960px;display:flex;flex-direction:column;align-items:center;gap:16px}.logo{font-size:clamp(2rem,8vw,3.5rem);letter-spacing:.05em;color:var(--accent);margin:0}.menu-actions{display:flex;flex-direction:column;gap:12px;width:100%;max-width:320px}.btn{padding:14px 20px;font-size:1rem;border-radius:10px;border:1px solid var(--panel-border);background:var(--panel);color:var(--text);cursor:pointer;touch-action:manipulation}.btn:hover{border-color:var(--accent)}.btn-primary{background:var(--accent-strong);border-color:var(--accent-strong);color:#06202a;font-weight:600}.btn-small{padding:8px 12px;font-size:.85rem}.btn-back{margin-top:8px;opacity:.7}.lobby-code-box{display:flex;align-items:center;gap:12px}.lobby-code{font-size:2.5rem;letter-spacing:.2em;font-weight:700;color:var(--accent)}.code-input{font-size:1.5rem;letter-spacing:.3em;text-align:center;text-transform:uppercase;padding:12px;border-radius:10px;border:1px solid var(--panel-border);background:var(--panel);color:var(--text);width:220px}.lobby-status{color:var(--text-dim);min-height:1.2em}.screen-game{position:relative;gap:8px;max-width:none;width:100%}.gesture-surface{position:absolute;top:0;right:0;bottom:0;left:0;touch-action:none;z-index:5;background:transparent}.game-hud{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:center;gap:16px;width:100%}.hud-side-panels{display:contents}.hold-panel{order:1}.own-board-panel{order:2}.next-panel{order:3}.opponent-panel{order:4}.hud-panel{background:var(--panel);border:1px solid var(--panel-border);border-radius:12px;padding:8px;display:flex;flex-direction:column;align-items:center;gap:6px}.hud-label{font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim)}canvas{display:block;background:#0a0b12;border-radius:6px}.board-canvas{width:min(40vh,320px);height:auto;aspect-ratio:10 / 20}.opponent-canvas{width:min(20vh,160px);height:auto;aspect-ratio:10 / 20}.garbage-counters{display:flex;flex-direction:column;align-items:center;gap:2px;font-size:.75rem;color:var(--text-dim)}.score-display,.level-display{display:flex;flex-direction:column;align-items:center;gap:2px}.score-value,.level-value{font-size:1.25rem;font-weight:700;font-variant-numeric:tabular-nums}.final-score{font-size:1.1rem;color:var(--text-dim)}.screen-gameover h2{color:var(--accent)}@media(max-width:900px),(max-height:500px)and (pointer:coarse){.screen-game{position:fixed;top:0;right:0;bottom:0;left:0;max-width:none;width:100vw;height:100vh;height:100svh;height:100dvh;padding:calc(env(safe-area-inset-top,0px) + 8px) calc(env(safe-area-inset-right,0px) + 8px) calc(env(safe-area-inset-bottom,0px) + 8px) calc(env(safe-area-inset-left,0px) + 8px);margin:0;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:8px;overflow:hidden}.game-hud{flex:1 1 auto;min-height:0;flex-wrap:nowrap;flex-direction:row;align-items:stretch;justify-content:center;gap:8px;width:100%}.own-board-panel{order:1;flex:1 1 auto;min-width:0;min-height:0;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:6px;gap:4px}.own-board-panel .board-canvas{flex:1 1 auto;min-height:0;width:auto;height:100%;max-width:100%;aspect-ratio:10 / 20}.own-board-panel .score-display,.own-board-panel .level-display{flex:0 0 auto}.hud-side-panels{display:flex;flex-direction:column;order:2;flex:0 0 auto;justify-content:center;align-items:center;gap:6px;height:100%;overflow:hidden}.hud-side-panels .hud-panel{padding:4px;gap:2px;flex:0 0 auto}.hud-side-panels .hold-canvas,.hud-side-panels .next-canvas,.hud-side-panels .opponent-canvas{width:52px;height:auto}.hud-side-panels .opponent-canvas{aspect-ratio:10 / 20}.hud-side-panels .hud-label,.hud-side-panels .garbage-counters{font-size:.6rem}}