:root{--bg-primary: #0f172a;--bg-secondary: #1e293b;--bg-card: #1e293b;--border-color: #334155;--text-primary: #f1f5f9;--text-secondary: #94a3b8;--player-a: #3b82f6;--player-a-light: #60a5fa;--player-a-glow: rgba(59, 130, 246, .5);--player-a-bg: rgba(59, 130, 246, .15);--player-b: #f97316;--player-b-light: #fb923c;--player-b-glow: rgba(249, 115, 22, .5);--player-b-bg: rgba(249, 115, 22, .15);--cell-empty: #1e293b;--cell-border: #334155;--cell-preview: rgba(59, 130, 246, .3);--radius: 6px;--radius-lg: 12px}*{box-sizing:border-box}body{margin:0;font-family:Segoe UI,system-ui,-apple-system,sans-serif;background:var(--bg-primary);color:var(--text-primary)}.game-title{font-size:1.8rem;font-weight:800;letter-spacing:.05em;margin:24px 0 8px;background:linear-gradient(135deg,var(--player-a-light),var(--player-b-light));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.board-grid{display:grid;gap:3px;padding:10px;background:var(--bg-secondary);border-radius:var(--radius-lg);border:1px solid var(--border-color)}.cell{width:34px;height:34px;border-radius:var(--radius);background:var(--cell-empty);border:1px solid var(--cell-border);cursor:pointer;transition:background .15s,transform .15s,box-shadow .15s}.cell:hover{transform:scale(1.05)}.cell-a{background:var(--player-a);border-color:var(--player-a-light);box-shadow:0 0 6px var(--player-a-glow)}.cell-b{background:var(--player-b);border-color:var(--player-b-light);box-shadow:0 0 6px var(--player-b-glow)}.cell-preview{background:var(--cell-preview);border-color:var(--player-a-light)}.cell-preview-invalid{background:#ef444433;border-color:#ef444466}.cell-pop{animation:pop .35s ease-out}.cell-clearing{animation:clearing-flash .5s ease-out forwards}.piece-selector{display:flex;align-items:center;justify-content:center;gap:4px;margin-top:24px;padding:16px 10px;border-radius:var(--radius-lg);border:1px solid var(--border-color);background:var(--bg-card);width:620px;height:232px;box-sizing:border-box}.piece-card{display:flex;align-items:center;justify-content:center;padding:8px;border-radius:var(--radius);border:2px solid transparent;cursor:pointer;transition:border-color .2s,box-shadow .2s,background .2s}.piece-card:hover{background:#ffffff0d;border-color:var(--text-secondary)}.piece-card.selected{border-color:var(--player-a-light);box-shadow:0 0 16px var(--player-a-glow);background:var(--player-a-bg);animation:bounce .35s ease-out}.piece-grid{display:grid;gap:3px}.piece-cell{width:34px;height:34px;border-radius:var(--radius);transition:background .15s}.piece-cell-filled-a{background:var(--player-a);box-shadow:inset 0 -2px 4px #0003}.piece-cell-filled-b{background:var(--player-b);box-shadow:inset 0 -2px 4px #0003}.piece-cell-empty{background:transparent}.scoreboard{display:flex;align-items:center;gap:16px;margin:16px 0 24px;width:100%;max-width:420px;justify-content:center}.player-card{flex:1;padding:12px 16px;border-radius:var(--radius-lg);border:2px solid var(--border-color);background:var(--bg-card);text-align:center;transition:border-color .3s,box-shadow .3s;min-height:80px}.player-card.active-a{border-color:var(--player-a);box-shadow:0 0 12px var(--player-a-glow)}.player-card.active-b{border-color:var(--player-b);box-shadow:0 0 12px var(--player-b-glow)}.player-label{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;margin-bottom:4px}.player-label-a{color:var(--player-a-light)}.player-label-b{color:var(--player-b-light)}.player-score{font-size:1.6rem;font-weight:800}.round-badge{padding:8px 14px;border-radius:var(--radius-lg);background:var(--bg-card);border:1px solid var(--border-color);text-align:center;font-size:.8rem;color:var(--text-secondary);font-weight:600;white-space:nowrap}.round-number{font-size:1.2rem;color:var(--text-primary);font-weight:800}.ai-thinking{display:flex;align-items:center;gap:4px;justify-content:center;margin-top:4px;font-size:.7rem;color:var(--player-b-light)}.ai-dot{width:6px;height:6px;border-radius:50%;background:var(--player-b-light);animation:pulse 1s infinite}.ai-dot:nth-child(2){animation-delay:.2s}.ai-dot:nth-child(3){animation-delay:.4s}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:100;animation:fadeIn .3s ease-out;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:16px;padding:40px 48px;text-align:center;animation:slideUp .4s ease-out;min-width:300px}.modal-title{font-size:2rem;font-weight:800;margin-bottom:16px}.modal-title.winner-a{color:var(--player-a-light)}.modal-title.winner-b{color:var(--player-b-light)}.modal-title.winner-draw{color:var(--text-secondary)}.modal-scores{display:flex;gap:32px;justify-content:center;margin-bottom:28px}.modal-score-item{text-align:center}.modal-score-label{font-size:.8rem;color:var(--text-secondary);margin-bottom:4px;font-weight:600}.modal-score-value{font-size:1.8rem;font-weight:800}.modal-score-value.score-a{color:var(--player-a-light)}.modal-score-value.score-b{color:var(--player-b-light)}.btn{padding:12px 32px;font-size:1rem;font-weight:700;border:none;border-radius:var(--radius-lg);cursor:pointer;transition:transform .15s,box-shadow .15s;color:#fff;background:linear-gradient(135deg,var(--player-a),var(--player-b))}.btn:hover{transform:scale(1.05);box-shadow:0 4px 20px #3b82f666}.btn:active{transform:scale(.97)}@keyframes pop{0%{transform:scale(.5);opacity:.5}60%{transform:scale(1.2)}to{transform:scale(1);opacity:1}}@keyframes clearing-flash{0%{opacity:1;transform:scale(1)}30%{opacity:1;background:#fbbf24;transform:scale(1.1)}60%{opacity:.6;background:#fbbf24;transform:scale(1.05)}to{opacity:0;transform:scale(.8)}}@keyframes pulse{0%,to{opacity:.3;transform:scale(.8)}50%{opacity:1;transform:scale(1.2)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(30px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes bounce{0%{transform:scale(1)}40%{transform:scale(1.12)}to{transform:scale(1)}}@media(max-width:480px){.game-title{font-size:1.4rem}.cell{width:28px;height:28px}.board-grid{gap:2px;padding:8px}.scoreboard{gap:8px}.player-card{padding:8px 10px}.modal{padding:28px 24px;min-width:unset;margin:0 16px}}