/* ══════════════════════════════
   1. WARM — handwritten, cozy
══════════════════════════════ */
body.theme-warm {
  background: #fdf6ee; color: #2d2013;
  font-family: 'Caveat', cursive;
}
body.theme-warm h1 { color: #c0392b; transform: rotate(-1.5deg); }
body.theme-warm #counter { color: #c0392b; }
body.theme-warm button { background: #e74c3c; border-color: #8b1a0e; border-radius: 50%; font-family: 'Caveat', cursive; }
body.theme-warm button:hover { background: #ec5f50; }
body.theme-warm .btn-shadow { background: #8b1a0e; border-radius: 50%; }
body.theme-warm p { color: #a0856a; transform: rotate(0.8deg); }
body.theme-warm .records { font-family: 'Caveat', cursive; }
body.theme-warm .records caption { color: #2d2013; }
body.theme-warm .records th { color: #a0856a; border-color: #e8d5c0; }
body.theme-warm .records td { border-color: #f0e0cc; color: #2d2013; }
body.theme-warm .records tbody tr:first-child td { color: #c0392b; font-weight: 700; }

/* ══════════════════════════════
   2. MIDNIGHT — sci-fi, neon
══════════════════════════════ */
body.theme-midnight {
  background: #050510; color: #a0c4ff;
  font-family: 'Orbitron', sans-serif;
}
body.theme-midnight h1 { color: #00f0ff; font-size: 1.8rem; letter-spacing: 3px; text-shadow: 0 0 20px #00f0ff88; }
body.theme-midnight #counter { color: #00f0ff; text-shadow: 0 0 30px #00f0ff; font-family: 'Orbitron', sans-serif; }
body.theme-midnight button { background: transparent; border-color: #00f0ff; border-width: 2px; border-radius: 8px; font-family: 'Orbitron', sans-serif; font-size: 1rem; color: #00f0ff; letter-spacing: 2px; box-shadow: 0 0 20px #00f0ff44, inset 0 0 20px #00f0ff11; }
body.theme-midnight button:hover { background: #00f0ff22; box-shadow: 0 0 40px #00f0ff88; }
body.theme-midnight button.held { background: #00f0ff33; }
body.theme-midnight .btn-shadow { background: #00f0ff22; border-radius: 8px; box-shadow: 0 0 30px #00f0ff44; }
body.theme-midnight p { color: #4a7aaa; font-size: 0.75rem; letter-spacing: 2px; text-transform: uppercase; }
body.theme-midnight .records { font-family: 'Orbitron', sans-serif; }
body.theme-midnight .records caption { color: #00f0ff; font-size: 1rem; letter-spacing: 2px; }
body.theme-midnight .records th { color: #4a7aaa; border-color: #0a1a2a; font-size: 0.7rem; }
body.theme-midnight .records td { border-color: #0a1020; color: #a0c4ff; font-size: 0.85rem; }
body.theme-midnight .records tbody tr:first-child td { color: #00f0ff; font-weight: 700; }

/* ══════════════════════════════
   3. FOREST — elegant, serif
══════════════════════════════ */
body.theme-forest {
  background: #f5f0e8; color: #2c1810;
  font-family: 'Playfair Display', serif;
}
body.theme-forest h1 { color: #5c3d1e; font-style: italic; }
body.theme-forest #counter { color: #8b5e3c; font-family: 'Playfair Display', serif; }
body.theme-forest button { background: #6b4226; border-color: #3d2010; border-radius: 4px; font-family: 'Playfair Display', serif; font-style: italic; font-size: 1.3rem; }
body.theme-forest button:hover { background: #7d4e30; }
body.theme-forest .btn-shadow { background: #3d2010; border-radius: 4px; }
body.theme-forest p { color: #8b7355; font-style: italic; }
body.theme-forest .records { font-family: 'Playfair Display', serif; }
body.theme-forest .records caption { color: #2c1810; font-style: italic; }
body.theme-forest .records th { color: #8b7355; border-color: #d4c4a8; }
body.theme-forest .records td { border-color: #e8dcc8; color: #2c1810; }
body.theme-forest .records tbody tr:first-child td { color: #6b4226; font-weight: 700; }

/* ══════════════════════════════
   4. CANDY — bubbly, fun
══════════════════════════════ */
body.theme-candy {
  background: #fff0fb; color: #4a0030;
  font-family: 'Fredoka One', cursive;
}
body.theme-candy h1 { color: #ff2d9b; text-shadow: 3px 3px 0 #ffb3e6; }
body.theme-candy #counter { color: #ff2d9b; font-family: 'Fredoka One', cursive; text-shadow: 2px 2px 0 #ffb3e6; }
body.theme-candy button { background: linear-gradient(135deg, #ff6ec7, #ff2d9b); border-color: #cc007a; border-radius: 50%; font-family: 'Fredoka One', cursive; font-size: 1.4rem; }
body.theme-candy button:hover { background: linear-gradient(135deg, #ff85d0, #ff4dac); }
body.theme-candy .btn-shadow { background: #cc007a; border-radius: 50%; }
body.theme-candy p { color: #cc60a0; }
body.theme-candy .records { font-family: 'Fredoka One', cursive; }
body.theme-candy .records caption { color: #ff2d9b; }
body.theme-candy .records th { color: #cc60a0; border-color: #f5c0e0; }
body.theme-candy .records td { border-color: #fad8f0; color: #4a0030; }
body.theme-candy .records tbody tr:first-child td { color: #ff2d9b; font-weight: 700; }

/* ══════════════════════════════
   5. RETRO — typewriter, worn
══════════════════════════════ */
body.theme-retro {
  background: #f4efe0; color: #2a2018;
  font-family: 'Special Elite', cursive;
}
body.theme-retro h1 { color: #8b0000; letter-spacing: 4px; text-transform: uppercase; }
body.theme-retro #counter { color: #8b0000; font-family: 'Special Elite', cursive; }
body.theme-retro button { background: #8b0000; border-color: #4a0000; border-width: 4px; border-radius: 0; font-family: 'Special Elite', cursive; font-size: 1rem; letter-spacing: 2px; text-transform: uppercase; }
body.theme-retro button:hover { background: #a00000; }
body.theme-retro .btn-shadow { background: #4a0000; border-radius: 0; }
body.theme-retro p { color: #7a6a50; letter-spacing: 1px; }
body.theme-retro .records { font-family: 'Special Elite', cursive; }
body.theme-retro .records caption { color: #2a2018; letter-spacing: 2px; text-transform: uppercase; }
body.theme-retro .records th { color: #7a6a50; border-color: #d4c8a8; }
body.theme-retro .records td { border-color: #e8dcc0; color: #2a2018; }
body.theme-retro .records tbody tr:first-child td { color: #8b0000; font-weight: 700; }

/* ══════════════════════════════
   6. OCEAN — deep sea, calm
══════════════════════════════ */
body.theme-ocean {
  background: #e8f4f8; color: #0a2a3a;
  font-family: 'Inter', sans-serif;
}
body.theme-ocean h1 { color: #0077aa; letter-spacing: 1px; }
body.theme-ocean #counter { color: #0077aa; }
body.theme-ocean button { background: #0077aa; border-color: #004466; border-radius: 50%; font-family: 'Inter', sans-serif; font-size: 1rem; font-weight: 600; letter-spacing: 1px; }
body.theme-ocean button:hover { background: #0088cc; }
body.theme-ocean .btn-shadow { background: #004466; border-radius: 50%; }
body.theme-ocean p { color: #4a8aaa; }
body.theme-ocean .records { font-family: 'Inter', sans-serif; }
body.theme-ocean .records caption { color: #0a2a3a; }
body.theme-ocean .records th { color: #4a8aaa; border-color: #b0d8e8; }
body.theme-ocean .records td { border-color: #d0eaf4; color: #0a2a3a; }
body.theme-ocean .records tbody tr:first-child td { color: #0077aa; font-weight: 700; }

/* ══════════════════════════════
   7. HACKER — terminal green
══════════════════════════════ */
body.theme-hacker {
  background: #0a0a0a; color: #00ff41;
  font-family: 'Courier New', monospace;
}
body.theme-hacker h1 { color: #00ff41; font-size: 1.6rem; letter-spacing: 5px; text-transform: uppercase; text-shadow: 0 0 10px #00ff41; }
body.theme-hacker #counter { color: #00ff41; text-shadow: 0 0 20px #00ff41; font-family: 'Courier New', monospace; }
body.theme-hacker button { background: #001a00; border-color: #00ff41; border-width: 2px; border-radius: 0; font-family: 'Courier New', monospace; font-size: 0.9rem; letter-spacing: 3px; text-transform: uppercase; color: #00ff41; box-shadow: 0 0 15px #00ff4144; }
body.theme-hacker button:hover { background: #003300; box-shadow: 0 0 30px #00ff4188; }
body.theme-hacker button.held { background: #004400; }
body.theme-hacker .btn-shadow { background: #00ff4133; border-radius: 0; }
body.theme-hacker p { color: #007a20; font-size: 0.85rem; letter-spacing: 3px; text-transform: uppercase; }
body.theme-hacker .records { font-family: 'Courier New', monospace; }
body.theme-hacker .records caption { color: #00ff41; letter-spacing: 3px; text-transform: uppercase; font-size: 1rem; }
body.theme-hacker .records th { color: #007a20; border-color: #003300; font-size: 0.75rem; letter-spacing: 2px; }
body.theme-hacker .records td { border-color: #001a00; color: #00ff41; font-size: 0.9rem; }
body.theme-hacker .records tbody tr:first-child td { color: #00ff41; font-weight: 700; text-shadow: 0 0 8px #00ff41; }

/* ══════════════════════════════
   9. LAVENDER — soft, dreamy
══════════════════════════════ */
body.theme-lavender {
  background: #f3f0ff; color: #2d1b69;
  font-family: 'Playfair Display', serif;
}
body.theme-lavender h1 { color: #6c3fc5; font-style: italic; }
body.theme-lavender #counter { color: #6c3fc5; font-family: 'Playfair Display', serif; }
body.theme-lavender button { background: linear-gradient(135deg, #9b59b6, #6c3fc5); border-color: #4a2080; border-radius: 50%; font-family: 'Playfair Display', serif; font-style: italic; font-size: 1.3rem; }
body.theme-lavender button:hover { background: linear-gradient(135deg, #a96cc6, #7d50d5); }
body.theme-lavender .btn-shadow { background: #4a2080; border-radius: 50%; }
body.theme-lavender p { color: #8a70c0; font-style: italic; }
body.theme-lavender .records { font-family: 'Playfair Display', serif; }
body.theme-lavender .records caption { color: #2d1b69; font-style: italic; }
body.theme-lavender .records th { color: #8a70c0; border-color: #d8ccf0; }
body.theme-lavender .records td { border-color: #ece8f8; color: #2d1b69; }
body.theme-lavender .records tbody tr:first-child td { color: #6c3fc5; font-weight: 700; }