:root{--bg:#0a0b10;--surface:#13151e;--surface-2:#1a1d2a;--border:#ffffff0f;--text:#e2e4ea;--text-muted:#6b7280;--text-dim:#3d4250;--player:#4ecdc4;--player-dim:#4ecdc426;--opponent:#ff6b6b;--opponent-dim:#ff6b6b26;--accent:#4ecdc4;--accent-hover:#5de0d7;--hit:#ff9f43;--tri-a:#1e2030;--tri-b:#282b3a;--bar-bg:#111320;--glass:#13151ecc;--glass-border:#ffffff14;--radius:16px;--radius-sm:8px;--shadow:0 8px 32px #0006;--shadow-sm:0 2px 8px #0000004d;--font:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif}[data-theme=light]{--bg:#f0f1f5;--surface:#fff;--surface-2:#e8eaef;--border:#00000014;--text:#1a1d2a;--text-muted:#6b7280;--text-dim:#9ca3af;--player:#0ea5a0;--player-dim:#0ea5a01f;--opponent:#e84545;--opponent-dim:#e845451f;--accent:#0ea5a0;--accent-hover:#0d9590;--tri-a:#d6d9e2;--tri-b:#c5c9d4;--bar-bg:#bcc0cc;--glass:#ffffffd9;--glass-border:#00000014}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{background:var(--bg);height:100%;color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased;overflow:hidden}button{font-family:inherit}.app{-webkit-user-select:none;user-select:none;flex-direction:column;height:100dvh;display:flex}.top-bar{background:var(--glass);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--glass-border);z-index:10;flex-shrink:0;justify-content:space-between;align-items:center;padding:10px 20px;display:flex}.player-info{align-items:center;gap:10px;min-width:0;display:flex}.player-info.right{flex-direction:row-reverse}.player-info.right .player-meta{text-align:right}.avatar{border:2px solid var(--border);width:34px;height:34px;color:var(--text-muted);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:13px;font-weight:700;transition:border-color .3s,box-shadow .3s;display:flex}.avatar.active{border-color:var(--player);color:var(--player);box-shadow:0 0 12px #4ecdc44d}.avatar.active.opp{border-color:var(--opponent);color:var(--opponent);box-shadow:0 0 12px #ff6b6b4d}.player-name{color:var(--text-dim);letter-spacing:.5px;text-transform:uppercase;font-size:10px;font-weight:600}.player-score{color:var(--text);font-variant-numeric:tabular-nums;font-size:18px;font-weight:700;line-height:1}.match-info{text-align:center;flex-shrink:0}.match-label{color:var(--text-dim);letter-spacing:.5px;text-transform:uppercase;font-size:9px}.pip-row{justify-content:center;gap:4px;margin-top:2px;display:flex}.pip-count{font-variant-numeric:tabular-nums;border-radius:8px;padding:1px 6px;font-size:10px;font-weight:600}.pip-count.you{background:var(--player-dim);color:var(--player)}.pip-count.opp{background:var(--opponent-dim);color:var(--opponent)}.board-area{flex:1;justify-content:center;align-items:center;min-height:0;padding:8px;display:flex;overflow:hidden}.board-wrap{aspect-ratio:680/580;width:100%;max-width:680px;max-height:100%;position:relative}.board-svg{border-radius:var(--radius);filter:drop-shadow(0 12px 40px #00000080);touch-action:none;width:100%;height:100%}[data-theme=light] .board-svg{filter:drop-shadow(0 8px 32px #0000002e)}.checker-group{cursor:grab;transition:filter .2s}.checker-group:active{cursor:grabbing}.checker-group.dragging{filter:drop-shadow(0 6px 20px #00000080)}@keyframes dest-pulse{0%,to{opacity:.5}50%{opacity:1}}.dest-glow{animation:1.5s ease-in-out infinite dest-pulse}@keyframes ai-move-glow{0%{opacity:0;r:10}30%{opacity:.8}to{opacity:.5}}.ai-highlight{animation:.4s ease-out forwards ai-move-glow}@keyframes dice-in{0%{opacity:0;transform:scale(0)rotate(-180deg)}60%{opacity:1;transform:scale(1.15)rotate(10deg)}to{opacity:1;transform:scale(1)rotate(0)}}.die-group{animation:.5s cubic-bezier(.34,1.56,.64,1) both dice-in}.die-group:nth-child(2){animation-delay:80ms}.die-group:nth-child(3){animation-delay:.16s}.die-group:nth-child(4){animation-delay:.24s}@keyframes thinking-dots{0%,80%,to{opacity:.3}40%{opacity:1}}.thinking-dot{animation:1.4s ease-in-out infinite thinking-dots}.thinking-dot:nth-child(2){animation-delay:.16s}.thinking-dot:nth-child(3){animation-delay:.32s}.action-bar{background:var(--glass);-webkit-backdrop-filter:blur(20px);border-top:1px solid var(--glass-border);z-index:10;flex-shrink:0;justify-content:center;align-items:center;gap:8px;padding:10px 16px;display:flex}.action-btn{height:38px;font-family:var(--font);cursor:pointer;color:#fff;border:none;border-radius:19px;justify-content:center;align-items:center;gap:6px;padding:0 18px;font-size:13px;font-weight:600;transition:all .2s;display:flex}.action-btn:active{transform:scale(.95)}.action-btn.primary{background:var(--accent);color:#0a0b10}.action-btn.primary:hover{background:var(--accent-hover)}.action-btn.secondary{background:var(--surface-2);color:var(--text-muted);border:1px solid var(--glass-border)}.action-btn.secondary:hover{color:var(--text);background:#2a2d3a}.action-btn.icon-only{width:38px;padding:0}.seed-label{color:var(--text-dim);cursor:pointer;font-family:SF Mono,Fira Code,monospace;font-size:10px;transition:color .2s}.seed-label:hover{color:var(--text-muted)}.overlay-backdrop{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:200;background:#0009;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.overlay-card{background:var(--surface);border:1px solid var(--glass-border);border-radius:var(--radius);text-align:center;width:90%;max-width:360px;box-shadow:var(--shadow);padding:32px 28px}.overlay-card h2{margin-bottom:4px;font-size:20px;font-weight:700}.overlay-card p{color:var(--text-muted);margin-bottom:24px;font-size:13px}@keyframes win-scale{0%{opacity:0;transform:scale(.8)}50%{transform:scale(1.05)}to{opacity:1;transform:scale(1)}}.win-overlay{animation:.5s cubic-bezier(.34,1.56,.64,1) both win-scale}.match-selector{justify-content:center;gap:8px;margin-bottom:24px;display:flex}.match-option{border:2px solid var(--border);width:42px;height:42px;color:var(--text-muted);font-size:14px;font-weight:600;font-family:var(--font);cursor:pointer;background:0 0;border-radius:50%;transition:all .2s}.auth-input{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-2);width:100%;height:40px;color:var(--text);font-family:var(--font);outline:none;padding:0 14px;font-size:14px;transition:border-color .2s}.auth-input:focus{border-color:var(--accent)}.auth-input::placeholder{color:var(--text-dim)}.match-option.active{border-color:var(--accent);background:var(--accent);color:var(--bg)}@media (height<=650px){.top-bar,.action-bar{padding:6px 12px}.avatar{width:28px;height:28px;font-size:11px}.player-score{font-size:15px}.player-name{font-size:9px}}@media (width<=420px){.top-bar{padding:8px 12px}.player-info{gap:6px}.avatar{width:28px;height:28px;font-size:11px}.player-score{font-size:15px}.match-label{font-size:8px}.pip-count{padding:1px 4px;font-size:9px}.action-btn{height:34px;padding:0 14px;font-size:12px}.action-btn.icon-only{width:34px}}
