/* ============ Table themes — CSS variable swaps ============ */
.theme-classic { --felt: #1a472a; --felt-dark: #0d2818; --accent: #d4af37; --chalk: #f5f5f5; }
.theme-neon    { --felt: #1a0a2e; --felt-dark: #0d0518; --accent: #00f5ff; --chalk: #ff00ff; --gold: #00f5ff; --gold-glow: rgba(0,245,255,0.5); }
.theme-gold    { --felt: #0a0a0a; --felt-dark: #050505; --accent: #ffd700; --chalk: #c0c0c0; --gold: #ffd700; --gold-glow: rgba(255,215,0,0.5); }
.theme-ocean   { --felt: #0a2e3e; --felt-dark: #051a24; --accent: #c0c0c0; --chalk: #88d5e8; --gold: #88d5e8; --gold-glow: rgba(136,213,232,0.4); }
.theme-crimson { --felt: #2e0a0a; --felt-dark: #1a0505; --accent: #c0c0c0; --chalk: #fff; --gold: #e0c0c0; --gold-glow: rgba(224,192,192,0.4); }

/* Apply theme to a screen's felt background */
.screen.theme-classic { background: radial-gradient(ellipse at center top, var(--felt) 0%, var(--felt-dark) 70%); }
.screen.theme-neon    { background: radial-gradient(ellipse at center top, var(--felt) 0%, var(--felt-dark) 70%); }
.screen.theme-gold    { background: radial-gradient(ellipse at center top, var(--felt) 0%, var(--felt-dark) 70%); }
.screen.theme-ocean   { background: radial-gradient(ellipse at center top, var(--felt) 0%, var(--felt-dark) 70%); }
.screen.theme-crimson { background: radial-gradient(ellipse at center top, var(--felt) 0%, var(--felt-dark) 70%); }

/* Theme picker swatches */
.theme-swatches { display: flex; gap: 0.6rem; justify-content: center; margin: 1rem 0; }
.theme-swatch {
  width: 44px; height: 44px;
  border-radius: 50%;
  border: 2px solid transparent;
  cursor: pointer;
}
.theme-swatch.selected { border-color: #fff; box-shadow: 0 0 12px rgba(255,255,255,0.5); }
.theme-swatch[data-theme="classic"] { background: #1a472a; }
.theme-swatch[data-theme="neon"]    { background: #1a0a2e; }
.theme-swatch[data-theme="gold"]    { background: #0a0a0a; border-color: #ffd700; }
.theme-swatch[data-theme="ocean"]   { background: #0a2e3e; }
.theme-swatch[data-theme="crimson"] { background: #2e0a0a; }