:root{--bg: #0d0b1a;--panel: #15112b;--border: #2a1f4d;--cyan: #00f0ff;--pink: #ff2ea6;--yellow: #faff00;--green: #7dff5b;--purple: #a06bff;--text: #e8f1ff;--text-dim: #7fa8d9}*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:Courier New,ui-monospace,monospace;min-height:100vh}#app{max-width:640px;margin:0 auto;padding:12px;display:flex;flex-direction:column;gap:12px}.topbar{display:flex;justify-content:space-between;align-items:center}.logo{font-size:20px;letter-spacing:3px;color:var(--cyan);margin:0}.topbar-actions{display:flex;gap:8px}.icon-btn{background:transparent;border:1px solid var(--cyan);color:var(--cyan);width:36px;height:36px;border-radius:4px;font-size:16px;cursor:pointer}.icon-btn:active{background:var(--cyan);color:var(--bg)}.game-layout{display:flex;gap:10px;justify-content:center;align-items:flex-start}.side-panel{display:flex;flex-direction:column;gap:10px;width:96px}.panel-box{background:var(--panel);border:1px solid var(--border);border-radius:6px;padding:8px;text-align:center}.panel-box h2{font-size:11px;color:var(--text-dim);margin:0 0 6px;font-weight:500;letter-spacing:1px}.panel-box p{margin:0 0 8px;font-size:16px;color:var(--text)}.board-wrap{position:relative;border:2px solid var(--cyan);border-radius:4px;background:var(--panel);line-height:0}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#0d0b1aeb;display:flex;align-items:center;justify-content:center}.overlay.hidden{display:none}.overlay-box{text-align:center;padding:16px}.overlay-box h2{color:var(--cyan);font-size:16px;letter-spacing:2px;margin:0 0 8px}.overlay-box p{color:var(--text-dim);font-size:12px;margin:0 0 16px;white-space:pre-line}.primary-btn{background:transparent;border:1px solid var(--pink);color:var(--pink);padding:10px 20px;font-family:inherit;font-size:13px;letter-spacing:1px;border-radius:4px;cursor:pointer}.primary-btn:active{background:var(--pink);color:var(--bg)}.touch-controls{display:flex;flex-direction:column;gap:8px}.tc-row{display:flex;gap:8px;justify-content:center}.tc-btn{background:transparent;border:1px solid var(--cyan);color:var(--cyan);font-family:inherit;font-size:13px;padding:14px 0;border-radius:4px;flex:1;cursor:pointer;user-select:none;-webkit-user-select:none}.tc-btn:active{background:var(--cyan);color:var(--bg)}.tc-btn.wide{flex:1}.tc-btn.full{flex:1;border-color:var(--pink);color:var(--pink)}.tc-btn.full:active{background:var(--pink);color:var(--bg)}.panel-modal{position:fixed;top:0;right:0;bottom:0;left:0;background:#0d0b1aeb;display:flex;align-items:center;justify-content:center;z-index:10}.panel-modal.hidden{display:none}.panel-modal-box{background:var(--panel);border:1px solid var(--cyan);border-radius:6px;padding:20px;width:min(320px,90vw)}.panel-modal-box h2{color:var(--cyan);font-size:15px;letter-spacing:1px;margin:0 0 16px}.toggle-row{display:flex;justify-content:space-between;align-items:center;font-size:13px;margin-bottom:12px;color:var(--text)}.toggle-row select{background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:4px;padding:4px 6px;font-family:inherit;font-size:13px}#highscores-list{padding-left:20px;font-size:13px;color:var(--text)}#highscores-list li{margin-bottom:6px}#highscores-list .hs-empty{color:var(--text-dim);list-style:none;margin-left:-20px}