/* ===== THEMES ===== */
/* All theme color variations + toasts + vs-mode + score comparison */

/* === CASINO THEME === */
[data-theme="casino"] .home-screen {
  background: linear-gradient(180deg, #14532d 0%, #166534 50%, #15803d 100%);
}

[data-theme="casino"] .home-die {
  background: linear-gradient(180deg, #dc2626 0%, #b91c1c 100%);
}

[data-theme="casino"] .home-die .pip {
  background: #fff;
}

[data-theme="casino"] .settings-screen {
  background: linear-gradient(180deg, #14532d 0%, #166534 50%, #052e16 100%);
}

[data-theme="casino"] .app {
  background: radial-gradient(ellipse at center, rgba(255,255,255,0.05) 0%, transparent 70%), #166534;
}

[data-theme="casino"] .header {
  background: linear-gradient(180deg, #14532d 0%, #052e16 100%);
}

[data-theme="casino"] .die-face {
  background: linear-gradient(180deg, #dc2626 0%, #b91c1c 100%);
}

[data-theme="casino"] .die .pip {
  background: #fff;
}

/* === NEON THEME === */
[data-theme="neon"] .home-screen {
  background: linear-gradient(180deg, #312e81 0%, #1e1b4b 50%, #0f0a2e 100%);
}

[data-theme="neon"] .home-die {
  background: linear-gradient(180deg, #0a0a0a 0%, #1a1a1a 100%);
  box-shadow: 0 0 20px rgba(0, 255, 255, 0.5), 0 8px 20px rgba(0,0,0,0.3);
  border: 1px solid rgba(0, 255, 255, 0.4);
}

[data-theme="neon"] .home-die .pip {
  background: #00ffff;
  box-shadow: 0 0 8px rgba(0, 255, 255, 0.8);
}

[data-theme="neon"] .settings-screen {
  background: linear-gradient(180deg, #312e81 0%, #1e1b4b 50%, #0f0a2e 100%);
}

[data-theme="neon"] .app {
  background: #1e1b4b;
}

[data-theme="neon"] .header {
  background: linear-gradient(180deg, #312e81 0%, #1e1b4b 100%);
}

[data-theme="neon"] .die-face {
  background: linear-gradient(180deg, #0a0a0a 0%, #1a1a1a 100%);
  box-shadow: 0 0 15px rgba(0, 255, 255, 0.4), 0 8px 20px rgba(0,0,0,0.3);
  border: 1px solid rgba(0, 255, 255, 0.3);
}

[data-theme="neon"] .die .pip {
  background: #00ffff;
  box-shadow: 0 0 6px rgba(0, 255, 255, 0.8);
}

[data-theme="neon"] .die.held .die-face {
  box-shadow: 0 0 25px rgba(255, 0, 255, 0.6), 0 4px 10px rgba(0,0,0,0.3);
  border-color: rgba(255, 0, 255, 0.5);
}

[data-theme="neon"] .die.held .pip {
  background: #ff00ff;
  box-shadow: 0 0 6px rgba(255, 0, 255, 0.8);
}

[data-theme="neon"] .scorecard {
  box-shadow: 0 0 20px rgba(138, 43, 226, 0.3);
}

[data-theme="neon"] .score-tile.available:hover {
  box-shadow: 0 0 15px rgba(0, 255, 255, 0.5);
}

/* === DARK THEME === */
[data-theme="dark"] .home-screen {
  background: linear-gradient(180deg, #3f3f46 0%, #27272a 50%, #18181b 100%);
}

[data-theme="dark"] .home-die {
  background: linear-gradient(180deg, #52525b 0%, #3f3f46 100%);
  box-shadow: 0 8px 20px rgba(0,0,0,0.4), inset 0 1px 0 rgba(255,255,255,0.1);
}

[data-theme="dark"] .home-die .pip {
  background: #e4e4e7;
}

[data-theme="dark"] .settings-screen {
  background: linear-gradient(180deg, #3f3f46 0%, #27272a 50%, #18181b 100%);
}

[data-theme="dark"] .app {
  background: #27272a;
}

[data-theme="dark"] .header {
  background: linear-gradient(180deg, #3f3f46 0%, #27272a 100%);
}

[data-theme="dark"] .die-face {
  background: linear-gradient(180deg, #52525b 0%, #3f3f46 100%);
  box-shadow: 0 8px 20px rgba(0,0,0,0.4), inset 0 1px 0 rgba(255,255,255,0.1);
}

[data-theme="dark"] .die .pip {
  background: #e4e4e7;
}

/* === RETRO/ARCADE THEME === */
[data-theme="retro"] .home-screen {
  background: linear-gradient(180deg, #1a1a2e 0%, #0f0f1a 100%);
}

[data-theme="retro"] .home-die {
  background: #000;
  border: 2px solid #f0f;
  box-shadow: 0 0 10px #f0f, 0 0 20px rgba(255,0,255,0.3);
}

[data-theme="retro"] .home-die .pip {
  background: #0ff;
  box-shadow: 0 0 6px #0ff;
}

[data-theme="retro"] .settings-screen {
  background: linear-gradient(180deg, #1a1a2e 0%, #0f0f1a 100%);
}

[data-theme="retro"] .app {
  background: #0f0f1a;
}

[data-theme="retro"] .header {
  background: linear-gradient(180deg, #1a1a2e 0%, #0f0f1a 100%);
}

[data-theme="retro"] .die-face {
  background: #000;
  border: 2px solid #f0f;
  box-shadow: 0 0 10px #f0f, 0 0 20px rgba(255,0,255,0.3);
}

[data-theme="retro"] .die .pip {
  background: #0ff;
  box-shadow: 0 0 6px #0ff;
}

[data-theme="retro"] .die.held .die-face {
  border-color: #0ff;
  box-shadow: 0 0 15px #0ff, 0 0 30px rgba(0,255,255,0.4);
}

/* === OCEAN/BEACH THEME === */
[data-theme="ocean"] .home-screen {
  background: linear-gradient(180deg, #0ea5e9 0%, #0284c7 50%, #0369a1 100%);
}

[data-theme="ocean"] .home-die {
  background: linear-gradient(180deg, #fef3c7 0%, #fde68a 100%);
}

[data-theme="ocean"] .home-die .pip {
  background: #0369a1;
}

[data-theme="ocean"] .settings-screen {
  background: linear-gradient(180deg, #0ea5e9 0%, #0284c7 50%, #0369a1 100%);
}

[data-theme="ocean"] .app {
  background: linear-gradient(180deg, #0ea5e9 0%, #0284c7 100%);
}

[data-theme="ocean"] .header {
  background: linear-gradient(180deg, #0369a1 0%, #075985 100%);
}

[data-theme="ocean"] .die-face {
  background: linear-gradient(180deg, #fef3c7 0%, #fde68a 100%);
}

[data-theme="ocean"] .die .pip {
  background: #0369a1;
}

/* === ROYAL/LUXURY THEME === */
[data-theme="royal"] .home-screen {
  background: linear-gradient(180deg, #7c3aed 0%, #5b21b6 50%, #4c1d95 100%);
}

[data-theme="royal"] .home-die {
  background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
  box-shadow: 0 8px 20px rgba(0,0,0,0.3), inset 0 2px 0 rgba(255,255,255,0.4);
}

[data-theme="royal"] .home-die .pip {
  background: #4c1d95;
}

[data-theme="royal"] .settings-screen {
  background: linear-gradient(180deg, #7c3aed 0%, #5b21b6 50%, #4c1d95 100%);
}

[data-theme="royal"] .app {
  background: linear-gradient(180deg, #5b21b6 0%, #4c1d95 100%);
}

[data-theme="royal"] .header {
  background: linear-gradient(180deg, #7c3aed 0%, #5b21b6 100%);
}

[data-theme="royal"] .die-face {
  background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
  box-shadow: 0 8px 20px rgba(0,0,0,0.3), inset 0 2px 0 rgba(255,255,255,0.4);
}

[data-theme="royal"] .die .pip {
  background: #4c1d95;
}

/* === SUNSET THEME === */
[data-theme="sunset"] .home-screen {
  background: linear-gradient(180deg, #f97316 0%, #ea580c 30%, #db2777 70%, #7c3aed 100%);
}

[data-theme="sunset"] .home-die {
  background: linear-gradient(180deg, #fff 0%, #fef3c7 100%);
}

[data-theme="sunset"] .home-die .pip {
  background: #ea580c;
}

[data-theme="sunset"] .settings-screen {
  background: linear-gradient(180deg, #f97316 0%, #ea580c 30%, #db2777 70%, #7c3aed 100%);
}

[data-theme="sunset"] .app {
  background: linear-gradient(180deg, #f97316 0%, #ea580c 100%);
}

[data-theme="sunset"] .header {
  background: linear-gradient(180deg, #c2410c 0%, #9a3412 100%);
}

[data-theme="sunset"] .die-face {
  background: linear-gradient(180deg, #fff 0%, #fef3c7 100%);
}

[data-theme="sunset"] .die .pip {
  background: #ea580c;
}

/* === ICE/WINTER THEME === */
[data-theme="ice"] .home-screen {
  background: linear-gradient(180deg, #bae6fd 0%, #7dd3fc 50%, #38bdf8 100%);
}

[data-theme="ice"] .home-die {
  background: linear-gradient(180deg, #fff 0%, #f0f9ff 100%);
  box-shadow: 0 0 15px rgba(56, 189, 248, 0.4), 0 8px 20px rgba(0,0,0,0.15);
}

[data-theme="ice"] .home-die .pip {
  background: #0284c7;
}

[data-theme="ice"] .settings-screen {
  background: linear-gradient(180deg, #bae6fd 0%, #7dd3fc 50%, #38bdf8 100%);
}

[data-theme="ice"] .app {
  background: linear-gradient(180deg, #7dd3fc 0%, #38bdf8 100%);
}

[data-theme="ice"] .header {
  background: linear-gradient(180deg, #0ea5e9 0%, #0284c7 100%);
}

[data-theme="ice"] .die-face {
  background: linear-gradient(180deg, #fff 0%, #f0f9ff 100%);
  box-shadow: 0 0 15px rgba(56, 189, 248, 0.4), 0 8px 20px rgba(0,0,0,0.15);
}

[data-theme="ice"] .die .pip {
  background: #0284c7;
}

/* === HALLOWEEN THEME === */
[data-theme="halloween"] .home-screen {
  background: linear-gradient(180deg, #1c1917 0%, #0c0a09 100%);
}

[data-theme="halloween"] .home-die {
  background: linear-gradient(180deg, #f97316 0%, #ea580c 100%);
}

[data-theme="halloween"] .home-die .pip {
  background: #000;
}

[data-theme="halloween"] .settings-screen {
  background: linear-gradient(180deg, #1c1917 0%, #0c0a09 100%);
}

[data-theme="halloween"] .app {
  background: #0c0a09;
}

[data-theme="halloween"] .header {
  background: linear-gradient(180deg, #1c1917 0%, #0c0a09 100%);
}

[data-theme="halloween"] .die-face {
  background: linear-gradient(180deg, #f97316 0%, #ea580c 100%);
}

[data-theme="halloween"] .die .pip {
  background: #000;
}

/* === PASTEL THEME === */
[data-theme="pastel"] .home-screen {
  background: linear-gradient(180deg, #fbcfe8 0%, #f9a8d4 50%, #c4b5fd 100%);
}

[data-theme="pastel"] .home-die {
  background: linear-gradient(180deg, #fef3c7 0%, #fef9c3 100%);
}

[data-theme="pastel"] .home-die .pip {
  background: #db2777;
}

[data-theme="pastel"] .settings-screen {
  background: linear-gradient(180deg, #fbcfe8 0%, #f9a8d4 50%, #c4b5fd 100%);
}

[data-theme="pastel"] .app {
  background: linear-gradient(180deg, #f9a8d4 0%, #c4b5fd 100%);
}

[data-theme="pastel"] .header {
  background: linear-gradient(180deg, #ec4899 0%, #a855f7 100%);
}

[data-theme="pastel"] .die-face {
  background: linear-gradient(180deg, #fef3c7 0%, #fef9c3 100%);
}

[data-theme="pastel"] .die .pip {
  background: #db2777;
}

/* === MATRIX THEME === */
[data-theme="matrix"] .home-screen {
  background: linear-gradient(180deg, #052e16 0%, #022c22 100%);
}

[data-theme="matrix"] .home-die {
  background: #000;
  border: 1px solid #22c55e;
  box-shadow: 0 0 10px rgba(34, 197, 94, 0.5);
}

[data-theme="matrix"] .home-die .pip {
  background: #22c55e;
  box-shadow: 0 0 6px #22c55e;
}

[data-theme="matrix"] .settings-screen {
  background: linear-gradient(180deg, #052e16 0%, #022c22 100%);
}

[data-theme="matrix"] .app {
  background: #022c22;
}

[data-theme="matrix"] .header {
  background: linear-gradient(180deg, #052e16 0%, #022c22 100%);
}

[data-theme="matrix"] .die-face {
  background: #000;
  border: 1px solid #22c55e;
  box-shadow: 0 0 10px rgba(34, 197, 94, 0.5);
}

[data-theme="matrix"] .die .pip {
  background: #22c55e;
  box-shadow: 0 0 6px #22c55e;
}

[data-theme="matrix"] .die.held .die-face {
  box-shadow: 0 0 20px rgba(34, 197, 94, 0.8);
}

/* ===== BODY BACKGROUND THEMES (side borders on wide screens) ===== */
/* Match home screen gradients for seamless appearance */
[data-theme="casino"] body {
  background: linear-gradient(180deg, #14532d 0%, #166534 50%, #15803d 100%);
}

[data-theme="neon"] body {
  background: linear-gradient(180deg, #312e81 0%, #1e1b4b 50%, #0f0a2e 100%);
}

[data-theme="dark"] body {
  background: linear-gradient(180deg, #3f3f46 0%, #27272a 50%, #18181b 100%);
}

[data-theme="retro"] body {
  background: linear-gradient(180deg, #1a1a2e 0%, #0f0f1a 100%);
}

[data-theme="ocean"] body {
  background: linear-gradient(180deg, #0ea5e9 0%, #0284c7 50%, #0369a1 100%);
}

[data-theme="royal"] body {
  background: linear-gradient(180deg, #7c3aed 0%, #5b21b6 50%, #4c1d95 100%);
}

[data-theme="sunset"] body {
  background: linear-gradient(180deg, #f97316 0%, #ea580c 30%, #db2777 70%, #7c3aed 100%);
}

[data-theme="ice"] body {
  background: linear-gradient(180deg, #bae6fd 0%, #7dd3fc 50%, #38bdf8 100%);
}

[data-theme="halloween"] body {
  background: linear-gradient(180deg, #1c1917 0%, #0c0a09 100%);
}

[data-theme="pastel"] body {
  background: linear-gradient(180deg, #fbcfe8 0%, #f9a8d4 50%, #c4b5fd 100%);
}

[data-theme="matrix"] body {
  background: linear-gradient(180deg, #052e16 0%, #022c22 100%);
}

/* ===== GAME OVER OVERLAY THEMES ===== */
/* Match home screen gradients for consistent appearance */
[data-theme="casino"] .game-over-overlay {
  background: linear-gradient(180deg, #14532d 0%, #166534 50%, #15803d 100%);
}

[data-theme="neon"] .game-over-overlay {
  background: linear-gradient(180deg, #312e81 0%, #1e1b4b 50%, #0f0a2e 100%);
}

[data-theme="dark"] .game-over-overlay {
  background: linear-gradient(180deg, #3f3f46 0%, #27272a 50%, #18181b 100%);
}

[data-theme="retro"] .game-over-overlay {
  background: linear-gradient(180deg, #1a1a2e 0%, #0f0f1a 100%);
}

[data-theme="ocean"] .game-over-overlay {
  background: linear-gradient(180deg, #0ea5e9 0%, #0284c7 50%, #0369a1 100%);
}

[data-theme="royal"] .game-over-overlay {
  background: linear-gradient(180deg, #7c3aed 0%, #5b21b6 50%, #4c1d95 100%);
}

[data-theme="sunset"] .game-over-overlay {
  background: linear-gradient(180deg, #f97316 0%, #ea580c 30%, #db2777 70%, #7c3aed 100%);
}

[data-theme="ice"] .game-over-overlay {
  background: linear-gradient(180deg, #bae6fd 0%, #7dd3fc 50%, #38bdf8 100%);
}

[data-theme="ice"] .game-over-overlay .game-over-message,
[data-theme="ice"] .game-over-overlay .game-over-score-value {
  color: #0c4a6e;
  text-shadow: 0 2px 0 rgba(255,255,255,0.5);
}

[data-theme="halloween"] .game-over-overlay {
  background: linear-gradient(180deg, #1c1917 0%, #0c0a09 100%);
}

[data-theme="pastel"] .game-over-overlay {
  background: linear-gradient(180deg, #fbcfe8 0%, #f9a8d4 50%, #c4b5fd 100%);
}

[data-theme="pastel"] .game-over-overlay .game-over-message,
[data-theme="pastel"] .game-over-overlay .game-over-score-value {
  color: #831843;
  text-shadow: 0 2px 0 rgba(255,255,255,0.5);
}

[data-theme="matrix"] .game-over-overlay {
  background: linear-gradient(180deg, #052e16 0%, #022c22 100%);
}

/* ===== GAME OVER NAV BUTTON THEMES ===== */
[data-theme="casino"] .nav-btn {
  background: linear-gradient(180deg, #dc2626 0%, #b91c1c 100%);
  box-shadow: 0 4px 0 #991b1b;
}
[data-theme="casino"] .nav-btn:hover { box-shadow: 0 6px 0 #991b1b; }
[data-theme="casino"] .nav-btn:active { box-shadow: 0 2px 0 #991b1b; }

[data-theme="neon"] .nav-btn {
  background: linear-gradient(180deg, #1a1a2a 0%, #0a0a15 100%);
  border: 1px solid rgba(0, 255, 255, 0.5);
  box-shadow: 0 4px 0 #000, 0 0 15px rgba(0, 255, 255, 0.4);
}
[data-theme="neon"] .nav-btn:hover { box-shadow: 0 6px 0 #000, 0 0 20px rgba(0, 255, 255, 0.6); }
[data-theme="neon"] .nav-btn:active { box-shadow: 0 2px 0 #000, 0 0 10px rgba(0, 255, 255, 0.3); }
[data-theme="neon"] .nav-btn svg { fill: #0ff; }

[data-theme="dark"] .nav-btn {
  background: linear-gradient(180deg, #52525b 0%, #3f3f46 100%);
  box-shadow: 0 4px 0 #27272a;
}
[data-theme="dark"] .nav-btn:hover { box-shadow: 0 6px 0 #27272a; }
[data-theme="dark"] .nav-btn:active { box-shadow: 0 2px 0 #27272a; }

[data-theme="retro"] .nav-btn {
  background: linear-gradient(180deg, #2a2a4a 0%, #1a1a2e 100%);
  border: 2px solid #0f0;
  box-shadow: 0 4px 0 #0a0a15, 0 0 10px rgba(0, 255, 0, 0.3);
}
[data-theme="retro"] .nav-btn:hover { box-shadow: 0 6px 0 #0a0a15, 0 0 15px rgba(0, 255, 0, 0.5); }
[data-theme="retro"] .nav-btn:active { box-shadow: 0 2px 0 #0a0a15, 0 0 8px rgba(0, 255, 0, 0.2); }
[data-theme="retro"] .nav-btn svg { fill: #0f0; }

[data-theme="ocean"] .nav-btn {
  background: linear-gradient(180deg, #0284c7 0%, #0369a1 100%);
  box-shadow: 0 4px 0 #075985;
}
[data-theme="ocean"] .nav-btn:hover { box-shadow: 0 6px 0 #075985; }
[data-theme="ocean"] .nav-btn:active { box-shadow: 0 2px 0 #075985; }

[data-theme="royal"] .nav-btn {
  background: linear-gradient(180deg, #7c3aed 0%, #5b21b6 100%);
  box-shadow: 0 4px 0 #4c1d95;
}
[data-theme="royal"] .nav-btn:hover { box-shadow: 0 6px 0 #4c1d95; }
[data-theme="royal"] .nav-btn:active { box-shadow: 0 2px 0 #4c1d95; }

[data-theme="sunset"] .nav-btn {
  background: linear-gradient(180deg, #f97316 0%, #ea580c 100%);
  box-shadow: 0 4px 0 #c2410c;
}
[data-theme="sunset"] .nav-btn:hover { box-shadow: 0 6px 0 #c2410c; }
[data-theme="sunset"] .nav-btn:active { box-shadow: 0 2px 0 #c2410c; }

[data-theme="ice"] .nav-btn {
  background: linear-gradient(180deg, #e0f2fe 0%, #bae6fd 100%);
  box-shadow: 0 4px 0 #7dd3fc;
}
[data-theme="ice"] .nav-btn:hover { box-shadow: 0 6px 0 #7dd3fc; }
[data-theme="ice"] .nav-btn:active { box-shadow: 0 2px 0 #7dd3fc; }
[data-theme="ice"] .nav-btn svg { fill: #0c4a6e; }

[data-theme="halloween"] .nav-btn {
  background: linear-gradient(180deg, #f97316 0%, #ea580c 100%);
  border: 2px solid #000;
  box-shadow: 0 4px 0 #7c2d12;
}
[data-theme="halloween"] .nav-btn:hover { box-shadow: 0 6px 0 #7c2d12; }
[data-theme="halloween"] .nav-btn:active { box-shadow: 0 2px 0 #7c2d12; }

[data-theme="pastel"] .nav-btn {
  background: linear-gradient(180deg, #f9a8d4 0%, #f472b6 100%);
  box-shadow: 0 4px 0 #db2777;
}
[data-theme="pastel"] .nav-btn:hover { box-shadow: 0 6px 0 #db2777; }
[data-theme="pastel"] .nav-btn:active { box-shadow: 0 2px 0 #db2777; }
[data-theme="pastel"] .nav-btn svg { fill: #831843; }

[data-theme="matrix"] .nav-btn {
  background: linear-gradient(180deg, #052e16 0%, #022c22 100%);
  border: 1px solid #22c55e;
  box-shadow: 0 4px 0 #014737, 0 0 10px rgba(34, 197, 94, 0.3);
}
[data-theme="matrix"] .nav-btn:hover { box-shadow: 0 6px 0 #014737, 0 0 15px rgba(34, 197, 94, 0.5); }
[data-theme="matrix"] .nav-btn:active { box-shadow: 0 2px 0 #014737, 0 0 8px rgba(34, 197, 94, 0.2); }
[data-theme="matrix"] .nav-btn svg { fill: #22c55e; }

/* ===== MODAL THEMES ===== */
[data-theme="casino"] .modal-content {
  background: linear-gradient(180deg, #166534 0%, #14532d 100%);
}

[data-theme="neon"] .modal-content {
  background: linear-gradient(180deg, #1e1b4b 0%, #0f0a2e 100%);
  box-shadow: 0 0 30px rgba(0, 255, 255, 0.3), 0 20px 60px rgba(0, 0, 0, 0.4);
}

[data-theme="dark"] .modal-content {
  background: linear-gradient(180deg, #3f3f46 0%, #27272a 100%);
}

[data-theme="retro"] .modal-content {
  background: linear-gradient(180deg, #1a1a2e 0%, #0f0f1a 100%);
  border: 2px solid #f0f;
  box-shadow: 0 0 20px rgba(255, 0, 255, 0.4), 0 20px 60px rgba(0, 0, 0, 0.4);
}

[data-theme="ocean"] .modal-content {
  background: linear-gradient(180deg, #0284c7 0%, #0369a1 100%);
}

[data-theme="royal"] .modal-content {
  background: linear-gradient(180deg, #5b21b6 0%, #4c1d95 100%);
}

[data-theme="sunset"] .modal-content {
  background: linear-gradient(180deg, #ea580c 0%, #c2410c 100%);
}

[data-theme="ice"] .modal-content {
  background: linear-gradient(180deg, #7dd3fc 0%, #38bdf8 100%);
}

[data-theme="ice"] .modal-title,
[data-theme="ice"] .modal-message {
  color: #0c4a6e;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
}

[data-theme="halloween"] .modal-content {
  background: linear-gradient(180deg, #1c1917 0%, #0c0a09 100%);
  border: 2px solid #f97316;
}

[data-theme="pastel"] .modal-content {
  background: linear-gradient(180deg, #f9a8d4 0%, #c4b5fd 100%);
}

[data-theme="pastel"] .modal-title,
[data-theme="pastel"] .modal-message {
  color: #831843;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
}

[data-theme="matrix"] .modal-content {
  background: linear-gradient(180deg, #052e16 0%, #022c22 100%);
  border: 1px solid #22c55e;
  box-shadow: 0 0 20px rgba(34, 197, 94, 0.4), 0 20px 60px rgba(0, 0, 0, 0.4);
}

/* ===== DROPDOWN MENU THEME STYLES ===== */
[data-theme="casino"] .dropdown-menu {
  background: linear-gradient(180deg, #166534 0%, #14532d 100%);
}

[data-theme="neon"] .dropdown-menu {
  background: linear-gradient(180deg, #312e81 0%, #1e1b4b 100%);
  border: 1px solid #a855f7;
  box-shadow: 0 0 20px rgba(168, 85, 247, 0.3), 0 10px 40px rgba(0, 0, 0, 0.4);
}

[data-theme="dark"] .dropdown-menu {
  background: linear-gradient(180deg, #3f3f46 0%, #27272a 100%);
}

[data-theme="retro"] .dropdown-menu {
  background: linear-gradient(180deg, #1a1a2e 0%, #0f0f1a 100%);
  border: 2px solid #00ff00;
  box-shadow: 0 0 15px rgba(0, 255, 0, 0.3), 0 10px 40px rgba(0, 0, 0, 0.4);
}

[data-theme="ocean"] .dropdown-menu {
  background: linear-gradient(180deg, #0284c7 0%, #0369a1 100%);
}

[data-theme="royal"] .dropdown-menu {
  background: linear-gradient(180deg, #5b21b6 0%, #4c1d95 100%);
}

[data-theme="sunset"] .dropdown-menu {
  background: linear-gradient(180deg, #ea580c 0%, #db2777 100%);
}

[data-theme="ice"] .dropdown-menu {
  background: linear-gradient(180deg, #7dd3fc 0%, #38bdf8 100%);
}
[data-theme="ice"] .dropdown-label {
  color: #0c4a6e;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
}
[data-theme="ice"] .dropdown-icon svg {
  fill: #0c4a6e;
}
[data-theme="ice"] .dropdown-item:hover {
  background: rgba(0, 0, 0, 0.1);
}

[data-theme="halloween"] .dropdown-menu {
  background: linear-gradient(180deg, #1c1917 0%, #0c0a09 100%);
  border: 2px solid #f97316;
  box-shadow: 0 0 15px rgba(249, 115, 22, 0.3), 0 10px 40px rgba(0, 0, 0, 0.4);
}

[data-theme="pastel"] .dropdown-menu {
  background: linear-gradient(180deg, #f9a8d4 0%, #c4b5fd 100%);
}
[data-theme="pastel"] .dropdown-label {
  color: #831843;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
}
[data-theme="pastel"] .dropdown-icon svg {
  fill: #831843;
}
[data-theme="pastel"] .dropdown-item:hover {
  background: rgba(255, 255, 255, 0.3);
}

[data-theme="matrix"] .dropdown-menu {
  background: linear-gradient(180deg, #052e16 0%, #022c22 100%);
  border: 1px solid #22c55e;
  box-shadow: 0 0 20px rgba(34, 197, 94, 0.4), 0 10px 40px rgba(0, 0, 0, 0.4);
}

/* ===== STATISTICS MODAL THEME STYLES ===== */
[data-theme="casino"] .statistics-content {
  background: linear-gradient(180deg, #166534 0%, #14532d 100%);
}

[data-theme="neon"] .statistics-content {
  background: linear-gradient(180deg, #312e81 0%, #1e1b4b 100%);
  box-shadow: 0 20px 60px rgba(168, 85, 247, 0.4), 0 0 30px rgba(0, 255, 255, 0.2);
}

[data-theme="dark"] .statistics-content {
  background: linear-gradient(180deg, #3f3f46 0%, #27272a 100%);
}

[data-theme="retro"] .statistics-content {
  background: linear-gradient(180deg, #1a1a2e 0%, #0f0f1a 100%);
  box-shadow: 0 20px 60px rgba(0, 255, 0, 0.3);
}

[data-theme="ocean"] .statistics-content {
  background: linear-gradient(180deg, #0284c7 0%, #0369a1 100%);
}

[data-theme="royal"] .statistics-content {
  background: linear-gradient(180deg, #5b21b6 0%, #4c1d95 100%);
}

[data-theme="sunset"] .statistics-content {
  background: linear-gradient(180deg, #ea580c 0%, #db2777 100%);
}

[data-theme="ice"] .statistics-content {
  background: linear-gradient(180deg, #7dd3fc 0%, #38bdf8 100%);
}
[data-theme="ice"] .statistics-title,
[data-theme="ice"] .stat-label,
[data-theme="ice"] .stat-value,
[data-theme="ice"] .stat-value-col {
  color: #0c4a6e;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
}
[data-theme="ice"] .stat-value.highlight {
  color: #0369a1;
}
[data-theme="ice"] .statistics-table-header {
  border-color: rgba(12, 74, 110, 0.3);
}
[data-theme="ice"] .stat-row {
  border-color: rgba(12, 74, 110, 0.15);
}
[data-theme="ice"] .statistics-divider {
  background: linear-gradient(90deg, transparent, rgba(12, 74, 110, 0.4), transparent);
}

[data-theme="halloween"] .statistics-content {
  background: linear-gradient(180deg, #1c1917 0%, #0c0a09 100%);
  box-shadow: 0 20px 60px rgba(249, 115, 22, 0.4);
}

[data-theme="pastel"] .statistics-content {
  background: linear-gradient(180deg, #f9a8d4 0%, #c4b5fd 100%);
}
[data-theme="pastel"] .statistics-title,
[data-theme="pastel"] .stat-label,
[data-theme="pastel"] .stat-value,
[data-theme="pastel"] .stat-value-col {
  color: #831843;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
}
[data-theme="pastel"] .stat-value.highlight {
  color: #9333ea;
}
[data-theme="pastel"] .statistics-table-header {
  border-color: rgba(131, 24, 67, 0.3);
}
[data-theme="pastel"] .stat-row {
  border-color: rgba(131, 24, 67, 0.15);
}
[data-theme="pastel"] .statistics-divider {
  background: linear-gradient(90deg, transparent, rgba(131, 24, 67, 0.4), transparent);
}

[data-theme="matrix"] .statistics-content {
  background: linear-gradient(180deg, #052e16 0%, #022c22 100%);
  box-shadow: 0 20px 60px rgba(34, 197, 94, 0.4);
}
[data-theme="matrix"] .stat-value.highlight {
  color: #22c55e;
}

/* ===== RULES MODAL THEME STYLES ===== */
[data-theme="casino"] .rules-content {
  background: linear-gradient(180deg, #166534 0%, #14532d 100%);
}

[data-theme="neon"] .rules-content {
  background: linear-gradient(180deg, #312e81 0%, #1e1b4b 100%);
  box-shadow: 0 20px 60px rgba(168, 85, 247, 0.4), 0 0 30px rgba(0, 255, 255, 0.2);
}
[data-theme="neon"] .rules-section h2 {
  color: #0ff;
}
[data-theme="neon"] .rules-dot.active {
  background: #0ff;
}
[data-theme="neon"] .rules-bonus {
  border-color: #0ff;
  background: rgba(0, 255, 255, 0.1);
}
[data-theme="neon"] .rules-bonus strong {
  color: #0ff;
}

[data-theme="dark"] .rules-content {
  background: linear-gradient(180deg, #3f3f46 0%, #27272a 100%);
}

[data-theme="retro"] .rules-content {
  background: linear-gradient(180deg, #1a1a2e 0%, #0f0f1a 100%);
  border: 2px solid #f0f;
  box-shadow: 0 20px 60px rgba(0, 255, 0, 0.3);
}
[data-theme="retro"] .rules-section h2 {
  color: #0f0;
}
[data-theme="retro"] .rules-dot.active {
  background: #0f0;
}
[data-theme="retro"] .rules-bonus {
  border-color: #0f0;
  background: rgba(0, 255, 0, 0.1);
}
[data-theme="retro"] .rules-bonus strong {
  color: #0f0;
}

[data-theme="ocean"] .rules-content {
  background: linear-gradient(180deg, #0284c7 0%, #0369a1 100%);
}

[data-theme="royal"] .rules-content {
  background: linear-gradient(180deg, #5b21b6 0%, #4c1d95 100%);
}

[data-theme="sunset"] .rules-content {
  background: linear-gradient(180deg, #ea580c 0%, #db2777 100%);
}

[data-theme="ice"] .rules-content {
  background: linear-gradient(180deg, #7dd3fc 0%, #38bdf8 100%);
}
[data-theme="ice"] .rules-title,
[data-theme="ice"] .rules-section h2,
[data-theme="ice"] .rules-section p,
[data-theme="ice"] .rules-score-item span {
  color: #0c4a6e;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
}
[data-theme="ice"] .rules-section h2 {
  color: #0369a1;
}
[data-theme="ice"] .rules-score-item {
  background: rgba(12, 74, 110, 0.1);
}
[data-theme="ice"] .rules-dot.active {
  background: #0369a1;
}
[data-theme="ice"] .rules-bonus {
  border-color: #0369a1;
  background: rgba(3, 105, 161, 0.15);
}
[data-theme="ice"] .rules-bonus strong {
  color: #0369a1;
}
[data-theme="ice"] .rules-nav-arrow svg {
  fill: #0c4a6e;
}

[data-theme="halloween"] .rules-content {
  background: linear-gradient(180deg, #1c1917 0%, #0c0a09 100%);
  border: 2px solid #f97316;
  box-shadow: 0 20px 60px rgba(249, 115, 22, 0.4);
}
[data-theme="halloween"] .rules-section h2 {
  color: #f97316;
}
[data-theme="halloween"] .rules-dot.active {
  background: #f97316;
}
[data-theme="halloween"] .rules-bonus {
  border-color: #f97316;
  background: rgba(249, 115, 22, 0.15);
}
[data-theme="halloween"] .rules-bonus strong {
  color: #f97316;
}

[data-theme="pastel"] .rules-content {
  background: linear-gradient(180deg, #f9a8d4 0%, #c4b5fd 100%);
}
[data-theme="pastel"] .rules-title,
[data-theme="pastel"] .rules-section h2,
[data-theme="pastel"] .rules-section p,
[data-theme="pastel"] .rules-score-item span {
  color: #831843;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
}
[data-theme="pastel"] .rules-section h2 {
  color: #9333ea;
}
[data-theme="pastel"] .rules-score-item {
  background: rgba(131, 24, 67, 0.1);
}
[data-theme="pastel"] .rules-dot.active {
  background: #9333ea;
}
[data-theme="pastel"] .rules-bonus {
  border-color: #9333ea;
  background: rgba(147, 51, 234, 0.15);
}
[data-theme="pastel"] .rules-bonus strong {
  color: #9333ea;
}
[data-theme="pastel"] .rules-nav-arrow svg {
  fill: #831843;
}

[data-theme="matrix"] .rules-content {
  background: linear-gradient(180deg, #052e16 0%, #022c22 100%);
  border: 1px solid #22c55e;
  box-shadow: 0 20px 60px rgba(34, 197, 94, 0.4);
}
[data-theme="matrix"] .rules-section h2 {
  color: #22c55e;
}
[data-theme="matrix"] .rules-dot.active {
  background: #22c55e;
}
[data-theme="matrix"] .rules-bonus {
  border-color: #22c55e;
  background: rgba(34, 197, 94, 0.1);
}
[data-theme="matrix"] .rules-bonus strong {
  color: #22c55e;
}
[data-theme="matrix"] .rules-learn-more span,
[data-theme="matrix"] .rules-learn-more svg {
  color: #22c55e;
  fill: #22c55e;
}

/* Learn more link theme overrides */
[data-theme="neon"] .rules-learn-more span,
[data-theme="neon"] .rules-learn-more svg {
  color: #0ff;
  fill: #0ff;
}

[data-theme="retro"] .rules-learn-more span,
[data-theme="retro"] .rules-learn-more svg {
  color: #0f0;
  fill: #0f0;
}

[data-theme="ice"] .rules-learn-more span,
[data-theme="ice"] .rules-learn-more svg {
  color: #0369a1;
  fill: #0369a1;
}

[data-theme="pastel"] .rules-learn-more span,
[data-theme="pastel"] .rules-learn-more svg {
  color: #9333ea;
  fill: #9333ea;
}

[data-theme="halloween"] .rules-learn-more span,
[data-theme="halloween"] .rules-learn-more svg {
  color: #f97316;
  fill: #f97316;
}

/* ===== CONTENT PAGES (Terms, Privacy, Guide pages) ===== */
/* page-container is used on terms, privacy, faq, odds, strategy pages */
/* guide-container is used on guide/index.html */

[data-theme="casino"] .page-container,
[data-theme="casino"] .guide-container {
  background: linear-gradient(180deg, #14532d 0%, #166534 50%, #15803d 100%);
}

[data-theme="neon"] .page-container,
[data-theme="neon"] .guide-container {
  background: linear-gradient(180deg, #312e81 0%, #1e1b4b 50%, #0f0a2e 100%);
}

[data-theme="dark"] .page-container,
[data-theme="dark"] .guide-container {
  background: linear-gradient(180deg, #3f3f46 0%, #27272a 50%, #18181b 100%);
}

[data-theme="retro"] .page-container,
[data-theme="retro"] .guide-container {
  background: linear-gradient(180deg, #1a1a2e 0%, #0f0f1a 100%);
}

[data-theme="ocean"] .page-container,
[data-theme="ocean"] .guide-container {
  background: linear-gradient(180deg, #0ea5e9 0%, #0284c7 50%, #0369a1 100%);
}

[data-theme="royal"] .page-container,
[data-theme="royal"] .guide-container {
  background: linear-gradient(180deg, #7c3aed 0%, #5b21b6 50%, #4c1d95 100%);
}

[data-theme="sunset"] .page-container,
[data-theme="sunset"] .guide-container {
  background: linear-gradient(180deg, #f97316 0%, #ea580c 30%, #db2777 70%, #7c3aed 100%);
}

[data-theme="ice"] .page-container,
[data-theme="ice"] .guide-container {
  background: linear-gradient(180deg, #bae6fd 0%, #7dd3fc 50%, #38bdf8 100%);
}

[data-theme="halloween"] .page-container,
[data-theme="halloween"] .guide-container {
  background: linear-gradient(180deg, #1c1917 0%, #0c0a09 100%);
}

[data-theme="pastel"] .page-container,
[data-theme="pastel"] .guide-container {
  background: linear-gradient(180deg, #fbcfe8 0%, #f9a8d4 50%, #c4b5fd 100%);
}

[data-theme="matrix"] .page-container,
[data-theme="matrix"] .guide-container {
  background: linear-gradient(180deg, #052e16 0%, #022c22 100%);
}

/* ===== DICE PLACEHOLDERS ===== */
/* Dark themes need lighter placeholders for visibility */
[data-theme="neon"] .dice-placeholder {
  background: rgba(139, 92, 246, 0.25);
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .dice-placeholder {
  background: rgba(255, 255, 255, 0.1);
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.3);
}

[data-theme="retro"] .dice-placeholder {
  background: rgba(255, 255, 255, 0.08);
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.4);
}

[data-theme="matrix"] .dice-placeholder {
  background: rgba(34, 197, 94, 0.15);
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.4);
}

[data-theme="halloween"] .dice-placeholder {
  background: rgba(249, 115, 22, 0.2);
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.4);
}

[data-theme="casino"] .dice-placeholder {
  background: rgba(234, 179, 8, 0.15);
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.3);
}

[data-theme="royal"] .dice-placeholder {
  background: rgba(196, 181, 253, 0.2);
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.3);
}

/* ===== BONUS SECTION (progress circle + label) ===== */
/* Dark themes need lighter text for visibility */
[data-theme="neon"] .bonus-label {
  color: rgba(167, 139, 250, 0.7);
}
[data-theme="neon"] .progress-circle {
  background: rgba(139, 92, 246, 0.2);
  border-color: rgba(139, 92, 246, 0.3);
}
[data-theme="neon"] .progress-current,
[data-theme="neon"] .progress-total {
  color: rgba(196, 181, 253, 0.7);
}

[data-theme="dark"] .bonus-label {
  color: rgba(255, 255, 255, 0.5);
}
[data-theme="dark"] .progress-circle {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.15);
}
[data-theme="dark"] .progress-current,
[data-theme="dark"] .progress-total {
  color: rgba(255, 255, 255, 0.5);
}

[data-theme="retro"] .bonus-label {
  color: rgba(255, 255, 255, 0.5);
}
[data-theme="retro"] .progress-circle {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.12);
}
[data-theme="retro"] .progress-current,
[data-theme="retro"] .progress-total {
  color: rgba(255, 255, 255, 0.5);
}

[data-theme="matrix"] .bonus-label {
  color: rgba(34, 197, 94, 0.6);
}
[data-theme="matrix"] .progress-circle {
  background: rgba(34, 197, 94, 0.1);
  border-color: rgba(34, 197, 94, 0.2);
}
[data-theme="matrix"] .progress-current,
[data-theme="matrix"] .progress-total {
  color: rgba(34, 197, 94, 0.6);
}

[data-theme="halloween"] .bonus-label {
  color: rgba(251, 146, 60, 0.7);
}
[data-theme="halloween"] .progress-circle {
  background: rgba(249, 115, 22, 0.15);
  border-color: rgba(249, 115, 22, 0.25);
}
[data-theme="halloween"] .progress-current,
[data-theme="halloween"] .progress-total {
  color: rgba(251, 146, 60, 0.7);
}

[data-theme="casino"] .bonus-label {
  color: rgba(253, 224, 71, 0.7);
}
[data-theme="casino"] .progress-circle {
  background: rgba(234, 179, 8, 0.12);
  border-color: rgba(234, 179, 8, 0.2);
}
[data-theme="casino"] .progress-current,
[data-theme="casino"] .progress-total {
  color: rgba(253, 224, 71, 0.6);
}

[data-theme="royal"] .bonus-label {
  color: rgba(196, 181, 253, 0.7);
}
[data-theme="royal"] .progress-circle {
  background: rgba(167, 139, 250, 0.15);
  border-color: rgba(167, 139, 250, 0.25);
}
[data-theme="royal"] .progress-current,
[data-theme="royal"] .progress-total {
  color: rgba(196, 181, 253, 0.6);
}

/* ===== TOAST NOTIFICATIONS ===== */
.toast-container {
  position: fixed;
  top: 15%;
  left: 50%;
  transform: translateX(-50%);
  z-index: 4000;
  pointer-events: none;
}

.toast {
  background: rgba(0,0,0,0.85);
  color: #fff;
  padding: 16px 24px;
  border-radius: 14px;
  font-size: clamp(14px, 4vw, 20px);
  font-weight: 700;
  text-align: center;
  box-shadow: 0 8px 30px rgba(0,0,0,0.3);
  opacity: 0;
  transform: translateY(-20px) scale(0.9);
  transition: opacity 0.3s ease, transform 0.3s ease;
  white-space: normal;
  max-width: calc(100vw - 32px);
  word-wrap: break-word;
}

.toast.visible {
  opacity: 1;
  transform: translateY(0) scale(1);
}

.toast.bot-turn {
  background: linear-gradient(180deg, #dc2626 0%, #b91c1c 100%);
}

.toast.player-turn {
  background: linear-gradient(180deg, #4ade80 0%, #22c55e 100%);
}

.toast.bot-score {
  background: linear-gradient(180deg, #7c3aed 0%, #5b21b6 100%);
}

/* ===== BOT MODE DICE (red) ===== */
.dice-row.bot-mode .die-face {
  background: linear-gradient(180deg, #ff6b6b 0%, #dc2626 100%) !important;
}

.dice-row.bot-mode .die-face .pip {
  background: #fff !important;
}

/* Header VS mode - hide vs elements by default */
.vs-score-section,
.vs-divider,
.turn-indicator {
  display: none;
}

.header.vs-mode .solo-display {
  display: none;
}

.header.vs-mode {
  padding-bottom: 2.5vh;
}

.header.vs-mode .header-row {
  align-items: flex-start;
}

.header.vs-mode .header-btn {
  margin-top: 0.25vh;
}

.header.vs-mode .header-center {
  display: flex;
  align-items: center;
  gap: 12px;
}

.header.vs-mode .vs-score-section,
.header.vs-mode .vs-divider {
  display: block;
}

/* Turn indicator hidden - toasts and red dice make it obvious */
.header.vs-mode .turn-indicator {
  display: none;
}

.vs-score-section {
  text-align: center;
  padding: 4px 8px;
  border-radius: 8px;
  border: 2px solid transparent;
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

@media (max-width: 420px) {
  .vs-score-section {
    padding: 2px 6px;
    border-radius: 6px;
  }
}

.vs-score-section.active-turn {
  border-color: rgba(255,255,255,0.5);
  box-shadow: 0 0 12px rgba(255,255,255,0.3);
}

.vs-score-section.player.active-turn {
  border-color: rgba(255,255,255,0.6);
  box-shadow: 0 0 12px rgba(255,255,255,0.35);
}

.vs-score-section.bot.active-turn {
  border-color: rgba(255,107,107,0.7);
  box-shadow: 0 0 12px rgba(255,107,107,0.4);
}

/* Theme-specific active turn styles */
[data-theme="neon"] .vs-score-section.player.active-turn {
  border-color: rgba(0,255,136,0.8);
  box-shadow: 0 0 15px rgba(0,255,136,0.5), 0 0 25px rgba(0,255,136,0.2);
}
[data-theme="neon"] .vs-score-section.bot.active-turn {
  border-color: rgba(255,0,128,0.8);
  box-shadow: 0 0 15px rgba(255,0,128,0.5), 0 0 25px rgba(255,0,128,0.2);
}

[data-theme="casino"] .vs-score-section.player.active-turn {
  border-color: rgba(255,215,0,0.8);
  box-shadow: 0 0 12px rgba(255,215,0,0.4);
}
[data-theme="casino"] .vs-score-section.bot.active-turn {
  border-color: rgba(220,20,60,0.8);
  box-shadow: 0 0 12px rgba(220,20,60,0.4);
}

[data-theme="dark"] .vs-score-section.player.active-turn {
  border-color: rgba(100,200,255,0.7);
  box-shadow: 0 0 12px rgba(100,200,255,0.35);
}
[data-theme="dark"] .vs-score-section.bot.active-turn {
  border-color: rgba(255,100,100,0.7);
  box-shadow: 0 0 12px rgba(255,100,100,0.35);
}

[data-theme="retro"] .vs-score-section.player.active-turn {
  border-color: rgba(255,255,0,0.8);
  box-shadow: 0 0 10px rgba(255,255,0,0.4);
}
[data-theme="retro"] .vs-score-section.bot.active-turn {
  border-color: rgba(255,0,255,0.8);
  box-shadow: 0 0 10px rgba(255,0,255,0.4);
}

[data-theme="ocean"] .vs-score-section.player.active-turn {
  border-color: rgba(0,255,200,0.7);
  box-shadow: 0 0 12px rgba(0,255,200,0.35);
}
[data-theme="ocean"] .vs-score-section.bot.active-turn {
  border-color: rgba(255,100,150,0.7);
  box-shadow: 0 0 12px rgba(255,100,150,0.35);
}

[data-theme="royal"] .vs-score-section.player.active-turn {
  border-color: rgba(255,215,0,0.8);
  box-shadow: 0 0 12px rgba(255,215,0,0.4);
}
[data-theme="royal"] .vs-score-section.bot.active-turn {
  border-color: rgba(255,100,100,0.7);
  box-shadow: 0 0 12px rgba(255,100,100,0.35);
}

[data-theme="sunset"] .vs-score-section.player.active-turn {
  border-color: rgba(255,200,100,0.8);
  box-shadow: 0 0 12px rgba(255,200,100,0.4);
}
[data-theme="sunset"] .vs-score-section.bot.active-turn {
  border-color: rgba(255,80,80,0.8);
  box-shadow: 0 0 12px rgba(255,80,80,0.4);
}

[data-theme="ice"] .vs-score-section.player.active-turn {
  border-color: rgba(150,220,255,0.8);
  box-shadow: 0 0 12px rgba(150,220,255,0.4);
}
[data-theme="ice"] .vs-score-section.bot.active-turn {
  border-color: rgba(255,150,180,0.8);
  box-shadow: 0 0 12px rgba(255,150,180,0.4);
}

[data-theme="halloween"] .vs-score-section.player.active-turn {
  border-color: rgba(255,150,0,0.8);
  box-shadow: 0 0 12px rgba(255,150,0,0.4);
}
[data-theme="halloween"] .vs-score-section.bot.active-turn {
  border-color: rgba(150,0,200,0.8);
  box-shadow: 0 0 12px rgba(150,0,200,0.4);
}

[data-theme="pastel"] .vs-score-section.player.active-turn {
  border-color: rgba(180,150,255,0.8);
  box-shadow: 0 0 12px rgba(180,150,255,0.4);
}
[data-theme="pastel"] .vs-score-section.bot.active-turn {
  border-color: rgba(255,150,180,0.8);
  box-shadow: 0 0 12px rgba(255,150,180,0.4);
}

[data-theme="matrix"] .vs-score-section.player.active-turn {
  border-color: rgba(0,255,65,0.8);
  box-shadow: 0 0 15px rgba(0,255,65,0.5), 0 0 25px rgba(0,255,65,0.2);
}
[data-theme="matrix"] .vs-score-section.bot.active-turn {
  border-color: rgba(255,0,0,0.8);
  box-shadow: 0 0 15px rgba(255,0,0,0.5), 0 0 25px rgba(255,0,0,0.2);
}

.vs-score-value {
  font-size: clamp(20px, 3.5vh, 36px);
  font-weight: 900;
  line-height: 1;
}

.vs-score-label {
  font-size: clamp(10px, 1.8vh, 16px);
  font-weight: 700;
  opacity: 0.85;
}

.vs-divider {
  font-size: clamp(16px, 2.5vh, 24px);
  font-weight: 900;
  opacity: 0.6;
}

.vs-score-section.bot .vs-score-value {
  color: #ff6b6b;
}

.turn-indicator {
  position: absolute;
  bottom: -22px;
  left: 50%;
  transform: translateX(-50%);
  font-size: clamp(10px, 1.8vh, 14px);
  font-weight: 800;
  color: #fff;
  background: linear-gradient(180deg, #4ade80 0%, #22c55e 100%);
  padding: 4px 14px;
  border-radius: 12px;
  text-transform: uppercase;
  box-shadow: 0 3px 0 #16a34a;
  white-space: nowrap;
}

.turn-indicator.bot-turn {
  background: linear-gradient(180deg, #f87171 0%, #dc2626 100%);
  box-shadow: 0 3px 0 #b91c1c;
}

/* Score comparison in game over */
.score-comparison {
  background: rgba(255,255,255,0.95);
  border-radius: 16px;
  padding: 16px;
  margin: 20px auto;
  max-width: 320px;
  width: 90%;
  box-shadow: 0 8px 30px rgba(0,0,0,0.2);
  max-height: 40vh;
  overflow-y: auto;
}

.score-comparison.hidden {
  display: none;
}

.comparison-header {
  display: grid;
  grid-template-columns: 1fr 50px 50px;
  gap: 8px;
  padding-bottom: 8px;
  border-bottom: 2px solid #e5e5e5;
  margin-bottom: 8px;
  font-weight: 800;
  font-size: 12px;
  text-transform: uppercase;
  color: #666;
}

.comparison-header .you-label {
  color: #22c55e;
  text-align: center;
}

.comparison-header .bot-label {
  color: #dc2626;
  text-align: center;
}

.comparison-rows {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.comparison-row {
  display: grid;
  grid-template-columns: 1fr 50px 50px;
  gap: 8px;
  font-size: 13px;
  padding: 4px 0;
  border-bottom: 1px solid #f0f0f0;
}

.comparison-row .cat-name {
  font-weight: 700;
  color: #333;
}

.comparison-row .player-val,
.comparison-row .bot-val {
  text-align: center;
  font-weight: 800;
}

.comparison-row .player-val.winner {
  color: #22c55e;
}

.comparison-row .bot-val.winner {
  color: #dc2626;
}

.comparison-row.bonus-row {
  background: #fef3c7;
}

.comparison-totals {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 3px solid #333;
}

.comparison-total-row {
  display: grid;
  grid-template-columns: 1fr 50px 50px;
  gap: 8px;
  font-size: 16px;
  font-weight: 900;
}

.comparison-total-row .player-val {
  text-align: center;
  color: #22c55e;
}

.comparison-total-row .bot-val {
  text-align: center;
  color: #dc2626;
}