/* ═══════════════════════════════════════════
   ALL THEME OVERRIDES
═══════════════════════════════════════════ */

/* ─── RANCH / ELA ─────────────────────────── */
body.theme-ranch { background: #C07828; }
body.theme-ranch #screen-title { background: linear-gradient(180deg, #D4922A 0%, #B87020 50%, #8C5010 100%); }
body.theme-ranch #screen-mode,
body.theme-ranch #screen-stats,
body.theme-ranch #screen-summary { background: linear-gradient(180deg, #B87020 0%, #A06018 100%); }
body.theme-ranch #screen-question { background: linear-gradient(180deg, #B87020 0%, #A06018 100%); }
body.theme-ranch #screen-levelup { background: radial-gradient(circle, #D4922A 0%, #8C5010 100%); }
body.theme-ranch .mc-panel { background: #362010; border-color: #1E0E04; box-shadow: inset -4px -4px 0 #080402, inset 4px 4px 0 #5A3018; }
body.theme-ranch .screen-header { background: #0E0604; border-color: #1E0E04; }
body.theme-ranch .hud { background: #080402; }
body.theme-ranch .xp-bar-fill { background: #D4921A; box-shadow: 0 0 4px #D4921A; }
body.theme-ranch .xp-label    { color: #D4921A; }
body.theme-ranch .hud-value   { color: #D4921A; }
body.theme-ranch .hud-streak  { color: #D4921A; }
body.theme-ranch .section-title { color: #D4921A; }
body.theme-ranch .mode-name   { color: #D4921A; }
body.theme-ranch .logo-block  { background: #8B4513; }
body.theme-ranch .choice-btn { background: #362010; border-color: #5A3820; box-shadow: inset -3px -3px 0 #080402, inset 3px 3px 0 #644030; }
body.theme-ranch .mode-card { background: #2A1608; border-color: #1E0E04; box-shadow: inset -3px -3px 0 #080402, inset 3px 3px 0 #5A3018; }
body.theme-ranch .mode-card.selected { border-color: #D4921A; box-shadow: inset -3px -3px 0 #080402, inset 3px 3px 0 #D4921A, 0 0 12px #D4921A; }
body.theme-ranch .diff-btn { background: #3A2010; border-color: #1E0E04; }
body.theme-ranch .diff-btn.active { background: #4A5A28; border-color: #6A8A38; }
body.theme-ranch .hint-text { background: #1E1004; border-color: #D4921A; color: #D4921A; }
body.theme-ranch .levelup-title { color: #D4921A; text-shadow: 0 0 20px #D4921A, 3px 3px 0 #000; }
body.theme-ranch .levelup-level { color: #D4921A; text-shadow: 0 0 30px #D4921A; }
body.theme-ranch .levelup-title-text { color: #E8B060; }
body.theme-ranch .q-standard { background: #6B4A1A; }
body.theme-ranch .grass-icon { font-size: 1.8rem; }

/* ─── SPACE / SCIENCE ─────────────────────── */
body.theme-space { background: #070714; }
body.theme-space #screen-title,
body.theme-space #screen-mode,
body.theme-space #screen-question,
body.theme-space #screen-stats,
body.theme-space #screen-summary {
  background-color: #070714;
  background-image:
    radial-gradient(1px 1px at  4%  8%, rgba(255,255,255,0.95) 0%, transparent 100%),
    radial-gradient(2px 2px at 12% 35%, rgba(255,255,255,0.85) 0%, transparent 100%),
    radial-gradient(1px 1px at 20%  6%, rgba(255,255,255,0.90) 0%, transparent 100%),
    radial-gradient(2px 2px at 28% 78%, rgba(255,255,255,0.80) 0%, transparent 100%),
    radial-gradient(1px 1px at 35% 22%, rgba(255,255,255,0.95) 0%, transparent 100%),
    radial-gradient(1px 1px at 42% 55%, rgba(255,255,255,0.70) 0%, transparent 100%),
    radial-gradient(2px 2px at 50% 13%, rgba(255,255,255,0.90) 0%, transparent 100%),
    radial-gradient(1px 1px at 58% 88%, rgba(255,255,255,0.85) 0%, transparent 100%),
    radial-gradient(1px 1px at 65% 42%, rgba(255,255,255,0.80) 0%, transparent 100%),
    radial-gradient(2px 2px at 72%  5%, rgba(255,255,255,0.95) 0%, transparent 100%),
    radial-gradient(1px 1px at 78% 68%, rgba(255,255,255,0.75) 0%, transparent 100%),
    radial-gradient(1px 1px at 85% 30%, rgba(255,255,255,0.90) 0%, transparent 100%),
    radial-gradient(2px 2px at 92% 52%, rgba(255,255,255,0.85) 0%, transparent 100%),
    radial-gradient(1px 1px at 97% 18%, rgba(255,255,255,0.95) 0%, transparent 100%),
    radial-gradient(1px 1px at  8% 60%, rgba(255,255,255,0.80) 0%, transparent 100%),
    radial-gradient(2px 2px at 16% 92%, rgba(255,255,255,0.70) 0%, transparent 100%),
    radial-gradient(1px 1px at 45% 72%, rgba(255,255,255,0.88) 0%, transparent 100%),
    radial-gradient(1px 1px at 55% 48%, rgba(255,255,255,0.75) 0%, transparent 100%),
    radial-gradient(2px 2px at 88% 82%, rgba(255,255,255,0.90) 0%, transparent 100%),
    radial-gradient(1px 1px at 95% 95%, rgba(255,255,255,0.80) 0%, transparent 100%);
}
body.theme-space #screen-levelup { background: radial-gradient(circle at 50% 40%, #1A0A4A 0%, #070714 70%); }
body.theme-space .mc-panel { background: #0E0D2A; border-color: #1E1C50; box-shadow: inset -3px -3px 0 #050414, inset 3px 3px 0 #2A2860; }
body.theme-space .screen-header { background: #050414; border-color: #1E1C50; }
body.theme-space .hud { background: #040312; }
body.theme-space .xp-bar-fill { background: #00C8FF; box-shadow: 0 0 6px #00C8FF; }
body.theme-space .xp-label    { color: #00C8FF; }
body.theme-space .hud-value   { color: #00C8FF; }
body.theme-space .hud-streak  { color: #FFD700; }
body.theme-space .section-title { color: #00C8FF; }
body.theme-space .mode-name   { color: #00C8FF; }
body.theme-space .logo-block  { background: #1A0A4A; }
body.theme-space .choice-btn { background: #0E0D2A; border-color: #2A2860; color: #C8D8FF; }
body.theme-space .mode-card { background: #0E0D2A; border-color: #1E1C50; box-shadow: inset -3px -3px 0 #040312, inset 3px 3px 0 #2A2860; }
body.theme-space .mode-card.selected { border-color: #00C8FF; box-shadow: inset -3px -3px 0 #040312, inset 3px 3px 0 #00C8FF, 0 0 14px #00C8FF; }
body.theme-space .diff-btn { background: #0E0D2A; border-color: #1E1C50; }
body.theme-space .diff-btn.active { background: #1A3A5A; border-color: #00C8FF; }
body.theme-space .hint-text { background: #070714; border-color: #00C8FF; color: #A8D8FF; }
body.theme-space .levelup-title { color: #00C8FF; text-shadow: 0 0 20px #00C8FF, 3px 3px 0 #000; }
body.theme-space .levelup-level { color: #FFD700; text-shadow: 0 0 30px #FFD700; }
body.theme-space .levelup-title-text { color: #A8D8FF; }
body.theme-space .q-standard { background: #1A1A4A; }
body.theme-space .grass-icon { font-size: 1.8rem; }

/* ─── OCEAN ───────────────────────────────── */
body.theme-ocean { background: #0a1a3a; }
body.theme-ocean #screen-title { background: linear-gradient(180deg, #0d2a5a 0%, #081830 100%); }
body.theme-ocean #screen-mode,
body.theme-ocean #screen-stats,
body.theme-ocean #screen-summary,
body.theme-ocean #screen-question,
body.theme-ocean #screen-levelup { background: linear-gradient(180deg, #0d2a5a 0%, #081428 100%); }
body.theme-ocean .mc-panel { background: #071020; border-color: #0a2040; box-shadow: inset -4px -4px 0 #030810, inset 4px 4px 0 #1a4060; }
body.theme-ocean .screen-header,
body.theme-ocean .hud           { background: #04080f; }
body.theme-ocean .xp-bar-fill   { background: #00bcd4; box-shadow: 0 0 6px #00bcd4; }
body.theme-ocean .xp-label,
body.theme-ocean .hud-value,
body.theme-ocean .hud-streak,
body.theme-ocean .section-title,
body.theme-ocean .mode-name     { color: #00e5ff; }
body.theme-ocean .logo-block    { background: #005f7f; }
body.theme-ocean .choice-btn { background: #071020; border-color: #0d3050; box-shadow: inset -3px -3px 0 #030810, inset 3px 3px 0 #1a5070; }
body.theme-ocean .mode-card { background: #050e1c; border-color: #0a2040; box-shadow: inset -3px -3px 0 #030810, inset 3px 3px 0 #1a4060; }
body.theme-ocean .mode-card.selected { border-color: #00bcd4; box-shadow: inset -3px -3px 0 #030810, inset 3px 3px 0 #00bcd4, 0 0 12px #00bcd4; }
body.theme-ocean .diff-btn        { background: #071828; border-color: #0a2040; }
body.theme-ocean .diff-btn.active { background: #0a3050; border-color: #00bcd4; }
body.theme-ocean .hint-text       { background: #030810; border-color: #00bcd4; color: #00e5ff; }
body.theme-ocean .levelup-title   { color: #00e5ff; text-shadow: 0 0 20px #00bcd4, 3px 3px 0 #000; }
body.theme-ocean .levelup-level   { color: #00e5ff; text-shadow: 0 0 30px #00bcd4; }
body.theme-ocean .levelup-title-text { color: #80d8ff; }
body.theme-ocean .q-standard      { background: #0a2848; }

/* ─── FOREST ──────────────────────────────── */
body.theme-forest { background: #0d2010; }
body.theme-forest #screen-title { background: linear-gradient(180deg, #153218 0%, #0a1e0c 100%); }
body.theme-forest #screen-mode,
body.theme-forest #screen-stats,
body.theme-forest #screen-summary,
body.theme-forest #screen-question,
body.theme-forest #screen-levelup { background: linear-gradient(180deg, #153218 0%, #0a1a0d 100%); }
body.theme-forest .mc-panel { background: #081408; border-color: #0f240f; box-shadow: inset -4px -4px 0 #030803, inset 4px 4px 0 #1a3a1a; }
body.theme-forest .screen-header,
body.theme-forest .hud           { background: #040804; }
body.theme-forest .xp-bar-fill   { background: #66bb6a; box-shadow: 0 0 6px #66bb6a; }
body.theme-forest .xp-label,
body.theme-forest .hud-value,
body.theme-forest .hud-streak,
body.theme-forest .section-title,
body.theme-forest .mode-name     { color: #a5d6a7; }
body.theme-forest .logo-block    { background: #2e5e2e; }
body.theme-forest .choice-btn { background: #081408; border-color: #143014; box-shadow: inset -3px -3px 0 #030803, inset 3px 3px 0 #204020; }
body.theme-forest .mode-card { background: #060f06; border-color: #0f240f; box-shadow: inset -3px -3px 0 #030803, inset 3px 3px 0 #1a3a1a; }
body.theme-forest .mode-card.selected { border-color: #66bb6a; box-shadow: inset -3px -3px 0 #030803, inset 3px 3px 0 #66bb6a, 0 0 12px #66bb6a; }
body.theme-forest .diff-btn        { background: #0a180a; border-color: #0f240f; }
body.theme-forest .diff-btn.active { background: #1a3a1a; border-color: #66bb6a; }
body.theme-forest .hint-text       { background: #030803; border-color: #66bb6a; color: #a5d6a7; }
body.theme-forest .levelup-title   { color: #a5d6a7; text-shadow: 0 0 20px #66bb6a, 3px 3px 0 #000; }
body.theme-forest .levelup-level   { color: #a5d6a7; text-shadow: 0 0 30px #66bb6a; }
body.theme-forest .levelup-title-text { color: #c8e6c9; }
body.theme-forest .q-standard      { background: #142814; }

/* ─── LAB ─────────────────────────────────── */
body.theme-lab { background: #12001a; }
body.theme-lab #screen-title { background: linear-gradient(180deg, #1e0030 0%, #0e0018 100%); }
body.theme-lab #screen-mode,
body.theme-lab #screen-stats,
body.theme-lab #screen-summary,
body.theme-lab #screen-question,
body.theme-lab #screen-levelup { background: linear-gradient(180deg, #1e0030 0%, #0a0014 100%); }
body.theme-lab .mc-panel { background: #0e0018; border-color: #200030; box-shadow: inset -4px -4px 0 #060008, inset 4px 4px 0 #380058; }
body.theme-lab .screen-header,
body.theme-lab .hud           { background: #060008; }
body.theme-lab .xp-bar-fill   { background: #ce93d8; box-shadow: 0 0 6px #ce93d8; }
body.theme-lab .xp-label,
body.theme-lab .hud-value,
body.theme-lab .hud-streak,
body.theme-lab .section-title,
body.theme-lab .mode-name     { color: #e040fb; }
body.theme-lab .logo-block    { background: #5a0080; }
body.theme-lab .choice-btn { background: #0e0018; border-color: #200038; box-shadow: inset -3px -3px 0 #060008, inset 3px 3px 0 #3a0060; }
body.theme-lab .mode-card { background: #0a0012; border-color: #200030; box-shadow: inset -3px -3px 0 #060008, inset 3px 3px 0 #380058; }
body.theme-lab .mode-card.selected { border-color: #ce93d8; box-shadow: inset -3px -3px 0 #060008, inset 3px 3px 0 #ce93d8, 0 0 12px #ce93d8; }
body.theme-lab .diff-btn        { background: #10001a; border-color: #200030; }
body.theme-lab .diff-btn.active { background: #2a0048; border-color: #ce93d8; }
body.theme-lab .hint-text       { background: #060008; border-color: #ce93d8; color: #e040fb; }
body.theme-lab .levelup-title   { color: #e040fb; text-shadow: 0 0 20px #ce93d8, 3px 3px 0 #000; }
body.theme-lab .levelup-level   { color: #e040fb; text-shadow: 0 0 30px #ce93d8; }
body.theme-lab .levelup-title-text { color: #f3e5f5; }
body.theme-lab .q-standard      { background: #280048; }

/* ─── PIZZA ───────────────────────────────── */
body.theme-pizza { background: #2a0e00; }
body.theme-pizza #screen-title { background: linear-gradient(180deg, #5a1e00 0%, #2a0e00 100%); }
body.theme-pizza #screen-mode,
body.theme-pizza #screen-stats,
body.theme-pizza #screen-summary,
body.theme-pizza #screen-question,
body.theme-pizza #screen-levelup { background: linear-gradient(180deg, #4a1800 0%, #200a00 100%); }
body.theme-pizza .mc-panel { background: #1e0800; border-color: #3a1200; box-shadow: inset -4px -4px 0 #0e0400, inset 4px 4px 0 #6a2800; }
body.theme-pizza .screen-header,
body.theme-pizza .hud           { background: #0e0400; }
body.theme-pizza .xp-bar-fill   { background: #ffc107; box-shadow: 0 0 6px #ffc107; }
body.theme-pizza .xp-label,
body.theme-pizza .hud-value,
body.theme-pizza .hud-streak,
body.theme-pizza .section-title,
body.theme-pizza .mode-name     { color: #ffd54f; }
body.theme-pizza .logo-block    { background: #c62828; }
body.theme-pizza .choice-btn { background: #1e0800; border-color: #3a1200; box-shadow: inset -3px -3px 0 #0e0400, inset 3px 3px 0 #5a2000; }
body.theme-pizza .mode-card { background: #180600; border-color: #3a1200; box-shadow: inset -3px -3px 0 #0e0400, inset 3px 3px 0 #6a2800; }
body.theme-pizza .mode-card.selected { border-color: #ffc107; box-shadow: inset -3px -3px 0 #0e0400, inset 3px 3px 0 #ffc107, 0 0 12px #ffc107; }
body.theme-pizza .diff-btn        { background: #1e0800; border-color: #3a1200; }
body.theme-pizza .diff-btn.active { background: #4a1800; border-color: #ffc107; }
body.theme-pizza .hint-text       { background: #0e0400; border-color: #ffc107; color: #ffd54f; }
body.theme-pizza .levelup-title   { color: #ffd54f; text-shadow: 0 0 20px #ffc107, 3px 3px 0 #000; }
body.theme-pizza .levelup-level   { color: #ffd54f; text-shadow: 0 0 30px #ffc107; }
body.theme-pizza .levelup-title-text { color: #ffe082; }
body.theme-pizza .q-standard      { background: #3a1200; }

/* ─── UNICORN / SHEEP ─────────────────────── */
body.theme-sheep { background: #1a0028; }
body.theme-sheep #screen-title { background: linear-gradient(180deg, #2e0050 0%, #1a0028 100%); }
body.theme-sheep #screen-mode,
body.theme-sheep #screen-stats,
body.theme-sheep #screen-summary,
body.theme-sheep #screen-question,
body.theme-sheep #screen-levelup { background: linear-gradient(180deg, #280040 0%, #140020 100%); }
body.theme-sheep .mc-panel { background: #1e0030; border-color: #4a0070; box-shadow: inset -4px -4px 0 #0e0018, inset 4px 4px 0 #7a20a0; }
body.theme-sheep .screen-header,
body.theme-sheep .hud           { background: #0e0018; }
body.theme-sheep .xp-bar-fill   { background: #f06292; box-shadow: 0 0 8px #f06292; }
body.theme-sheep .xp-label,
body.theme-sheep .hud-value,
body.theme-sheep .hud-streak,
body.theme-sheep .section-title,
body.theme-sheep .mode-name     { color: #f48fb1; }
body.theme-sheep .logo-block    { background: #6a0090; }
body.theme-sheep .choice-btn { background: #1e0030; border-color: #4a0070; box-shadow: inset -3px -3px 0 #0e0018, inset 3px 3px 0 #7a20a0; }
body.theme-sheep .mode-card { background: #180024; border-color: #4a0070; box-shadow: inset -3px -3px 0 #0e0018, inset 3px 3px 0 #7a20a0; }
body.theme-sheep .mode-card.selected { border-color: #f06292; box-shadow: inset -3px -3px 0 #0e0018, inset 3px 3px 0 #f06292, 0 0 14px #f06292; }
body.theme-sheep .diff-btn        { background: #1e0030; border-color: #4a0070; }
body.theme-sheep .diff-btn.active { background: #4a0078; border-color: #f06292; }
body.theme-sheep .hint-text       { background: #0e0018; border-color: #f06292; color: #f48fb1; }
body.theme-sheep .levelup-title   { color: #f48fb1; text-shadow: 0 0 20px #f06292, 3px 3px 0 #000; }
body.theme-sheep .levelup-level   { color: #f48fb1; text-shadow: 0 0 30px #f06292; }
body.theme-sheep .levelup-title-text { color: #fce4ec; }
body.theme-sheep .q-standard      { background: #4a0070; }

/* ─── ROBOT ───────────────────────────────── */
body.theme-robot { background: #0a0f14; }
body.theme-robot #screen-title { background: linear-gradient(180deg, #141e28 0%, #0a0f14 100%); }
body.theme-robot #screen-mode,
body.theme-robot #screen-stats,
body.theme-robot #screen-summary,
body.theme-robot #screen-question,
body.theme-robot #screen-levelup { background: linear-gradient(180deg, #141e28 0%, #080c10 100%); }
body.theme-robot .mc-panel { background: #0e1620; border-color: #1e3040; box-shadow: inset -4px -4px 0 #060a0e, inset 4px 4px 0 #2a4860; }
body.theme-robot .screen-header,
body.theme-robot .hud           { background: #060a0e; }
body.theme-robot .xp-bar-fill   { background: #00e5ff; box-shadow: 0 0 8px #00e5ff; }
body.theme-robot .xp-label,
body.theme-robot .hud-value,
body.theme-robot .hud-streak,
body.theme-robot .section-title,
body.theme-robot .mode-name     { color: #00e5ff; }
body.theme-robot .logo-block    { background: #1e3a50; }
body.theme-robot .choice-btn { background: #0e1620; border-color: #1e3040; box-shadow: inset -3px -3px 0 #060a0e, inset 3px 3px 0 #2a4860; }
body.theme-robot .mode-card { background: #0a1018; border-color: #1e3040; box-shadow: inset -3px -3px 0 #060a0e, inset 3px 3px 0 #2a4860; }
body.theme-robot .mode-card.selected { border-color: #00e5ff; box-shadow: inset -3px -3px 0 #060a0e, inset 3px 3px 0 #00e5ff, 0 0 12px #00e5ff; }
body.theme-robot .diff-btn        { background: #0e1620; border-color: #1e3040; }
body.theme-robot .diff-btn.active { background: #1a3050; border-color: #00e5ff; }
body.theme-robot .hint-text       { background: #060a0e; border-color: #00e5ff; color: #00e5ff; }
body.theme-robot .levelup-title   { color: #00e5ff; text-shadow: 0 0 20px #00e5ff, 3px 3px 0 #000; }
body.theme-robot .levelup-level   { color: #00e5ff; text-shadow: 0 0 30px #00e5ff; }
body.theme-robot .levelup-title-text { color: #80deea; }
body.theme-robot .q-standard      { background: #1e3040; }