/* ============================================
   ROLL CALL — Theme Presets
   ============================================ */

body[data-theme="cyberpunk"],
body:not([data-theme]) {
  background-image: radial-gradient(ellipse 70% 60% at 20% 30%, rgba(0, 255, 247, 0.05) 0%, transparent 50%), radial-gradient(ellipse 80% 70% at 80% 60%, rgba(255, 0, 170, 0.05) 0%, transparent 50%), linear-gradient(180deg, #0a0a14 0%, #0d0d1a 50%, #0a0a0f 100%);
  --neon-cyan: #00fff7;
  --neon-pink: #ff00aa;
  --neon-purple: #b300ff;
  --neon-yellow: #ffea00;
  --neon-green: #39ff14;
  --dark-bg: #0a0a0f;
  --dark-card: #12121a;
  --darker-card: #0d0d15;
  --border-cyan: rgba(0, 255, 247, 0.2);
  --border-pink: rgba(255, 0, 170, 0.25);
  --glow-cyan: 0 0 8px rgba(0, 255, 247, 0.5), 0 0 20px rgba(0, 255, 247, 0.15);
  --glow-pink: 0 0 8px rgba(255, 0, 170, 0.5), 0 0 20px rgba(255, 0, 170, 0.15);
  --text-dim: #888899;
  --text-bright: #e8e8f0;
  --scanlines: repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(0,0,0,0.06) 2px, rgba(0,0,0,0.06) 4px);
}

body[data-theme="medieval"] {
  background-image: radial-gradient(ellipse 50% 40% at 50% 90%, rgba(240, 150, 40, 0.12) 0%, transparent 55%), radial-gradient(ellipse 60% 45% at 25% 15%, rgba(180, 120, 40, 0.05) 0%, transparent 60%), radial-gradient(ellipse 40% 35% at 75% 25%, rgba(200, 60, 30, 0.04) 0%, transparent 50%), linear-gradient(180deg, #1c120c 0%, #261810 40%, #1a100a 100%);
  --neon-cyan: #c89020;
  --neon-pink: #b84020;
  --neon-purple: #6b3040;
  --neon-yellow: #e8b840;
  --neon-green: #5a7030;
  --dark-bg: #1a100c;
  --dark-card: #2a1a10;
  --darker-card: #140c08;
  --border-cyan: rgba(200, 140, 30, 0.18);
  --border-pink: rgba(180, 64, 32, 0.22);
  --glow-cyan: 0 0 10px rgba(240, 180, 50, 0.3), 0 0 25px rgba(200, 130, 30, 0.08);
  --glow-pink: 0 0 8px rgba(180, 64, 32, 0.35), 0 0 20px rgba(180, 64, 32, 0.08);
  --text-dim: #b89878;
  --text-bright: #f0dcc0;
  --scanlines: repeating-linear-gradient(0deg, transparent, transparent 3px, rgba(140,80,30,0.04) 3px, rgba(140,80,30,0.04) 6px);
}

body[data-theme="space"] {
  background-image: radial-gradient(ellipse 50% 50% at 25% 25%, rgba(180, 130, 255, 0.06) 0%, transparent 60%), radial-gradient(ellipse 60% 40% at 70% 70%, rgba(100, 181, 246, 0.06) 0%, transparent 50%), radial-gradient(ellipse 40% 30% at 80% 15%, rgba(255, 128, 213, 0.04) 0%, transparent 50%), linear-gradient(180deg, #03081a 0%, #081028 30%, #050d20 60%, #03081a 100%);
  --neon-cyan: #64b5f6;
  --neon-pink: #ff80d5;
  --neon-purple: #b388ff;
  --neon-yellow: #ffd54f;
  --neon-green: #69f0ae;
  --dark-bg: #050a1a;
  --dark-card: #0d1528;
  --darker-card: #080c1a;
  --border-cyan: rgba(100, 181, 246, 0.2);
  --border-pink: rgba(255, 128, 213, 0.25);
  --glow-cyan: 0 0 10px rgba(100, 181, 246, 0.4), 0 0 25px rgba(100, 181, 246, 0.1);
  --glow-pink: 0 0 8px rgba(255, 128, 213, 0.3), 0 0 20px rgba(255, 128, 213, 0.08);
  --text-dim: #8899aa;
  --text-bright: #eef2ff;
  --scanlines: repeating-linear-gradient(0deg, transparent, transparent 3px, rgba(100, 181, 246, 0.02) 3px, rgba(100, 181, 246, 0.02) 6px);
}

body[data-theme="gothic"] {
  background-image: radial-gradient(ellipse 50% 40% at 50% 90%, rgba(160, 0, 0, 0.18) 0%, transparent 55%), radial-gradient(ellipse 40% 30% at 20% 15%, rgba(160, 160, 180, 0.04) 0%, transparent 50%), radial-gradient(ellipse 50% 40% at 80% 25%, rgba(60, 0, 120, 0.08) 0%, transparent 55%), linear-gradient(180deg, #040000 0%, #0a0000 35%, #060000 100%);
  --neon-cyan: #b8b8c8;
  --neon-pink: #a00000;
  --neon-purple: #3c0060;
  --neon-yellow: #c89820;
  --neon-green: #1e5a20;
  --dark-bg: #040000;
  --dark-card: #0e0202;
  --darker-card: #060000;
  --border-cyan: rgba(184, 184, 200, 0.15);
  --border-pink: rgba(160, 0, 0, 0.35);
  --glow-cyan: 0 0 6px rgba(184, 184, 200, 0.15), 0 0 15px rgba(184, 184, 200, 0.04);
  --glow-pink: 0 0 14px rgba(160, 0, 0, 0.55), 0 0 35px rgba(160, 0, 0, 0.18);
  --text-dim: #8a7878;
  --text-bright: #e0d0d0;
  --scanlines: repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(120,0,0,0.05) 2px, rgba(120,0,0,0.05) 4px);
}

body[data-theme="classic"] {
  background-image: radial-gradient(ellipse 60% 40% at 50% 85%, rgba(198, 150, 60, 0.06) 0%, transparent 50%), radial-gradient(ellipse 50% 30% at 20% 20%, rgba(46, 125, 50, 0.03) 0%, transparent 50%), linear-gradient(180deg, #1c1a17 0%, #22201c 50%, #1b1a17 100%);
  --neon-cyan: #2e7d32;
  --neon-pink: #c62828;
  --neon-purple: #6a1b9a;
  --neon-yellow: #f9a825;
  --neon-green: #43a047;
  --dark-bg: #1b1a17;
  --dark-card: #262420;
  --darker-card: #181714;
  --border-cyan: rgba(46, 125, 50, 0.2);
  --border-pink: rgba(198, 40, 40, 0.2);
  --glow-cyan: 0 0 8px rgba(46, 125, 50, 0.3), 0 0 20px rgba(46, 125, 50, 0.08);
  --glow-pink: 0 0 8px rgba(198, 40, 40, 0.3), 0 0 20px rgba(198, 40, 40, 0.08);
  --text-dim: #a09888;
  --text-bright: #f5f0e8;
  --scanlines: none;
}

body[data-theme="cthulhu"] {
  background-image: radial-gradient(ellipse 60% 50% at 30% 70%, rgba(0, 191, 80, 0.08) 0%, transparent 50%), radial-gradient(ellipse 50% 40% at 70% 30%, rgba(180, 50, 220, 0.06) 0%, transparent 50%), radial-gradient(ellipse 80% 60% at 50% 50%, rgba(0, 180, 100, 0.03) 0%, transparent 70%), linear-gradient(180deg, #080312 0%, #0e0820 30%, #0c0418 60%, #080312 100%);
  --neon-cyan: #00bfa5;
  --neon-pink: #e040fb;
  --neon-purple: #4a148c;
  --neon-yellow: #d4af37;
  --neon-green: #76ff03;
  --dark-bg: #0c0515;
  --dark-card: #1a0a2e;
  --darker-card: #0e0418;
  --border-cyan: rgba(0, 191, 165, 0.2);
  --border-pink: rgba(224, 64, 251, 0.25);
  --glow-cyan: 0 0 10px rgba(0, 191, 80, 0.35), 0 0 25px rgba(0, 191, 165, 0.1);
  --glow-pink: 0 0 10px rgba(224, 64, 251, 0.4), 0 0 25px rgba(224, 64, 251, 0.1);
  --text-dim: #9a8bae;
  --text-bright: #e8dff0;
  --scanlines: repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(74,20,140,0.03) 2px, rgba(74,20,140,0.03) 4px);
}

body[data-theme="retrowave"] {
  background-image: radial-gradient(ellipse 60% 50% at 30% 20%, rgba(255, 20, 147, 0.10) 0%, transparent 50%), radial-gradient(ellipse 50% 40% at 70% 15%, rgba(255, 120, 0, 0.10) 0%, transparent 50%), radial-gradient(ellipse 120% 50% at 50% 85%, rgba(255, 70, 0, 0.18) 0%, transparent 50%), radial-gradient(ellipse 80% 50% at 50% 60%, rgba(255, 20, 140, 0.08) 0%, transparent 60%), linear-gradient(180deg, #180030 0%, #10052e 20%, #1a0640 45%, #200840 70%, #0d0028 100%);
  --neon-cyan: #00f5ff;
  --neon-pink: #ff1493;
  --neon-purple: #c840ff;
  --neon-yellow: #ff8c00;
  --neon-green: #0aff6a;
  --dark-bg: #0a0020;
  --dark-card: #15052e;
  --darker-card: #0a0018;
  --border-cyan: rgba(0, 245, 255, 0.35);
  --border-pink: rgba(255, 20, 147, 0.35);
  --glow-cyan: 0 0 14px rgba(0, 245, 255, 0.7), 0 0 35px rgba(0, 245, 255, 0.25), 0 0 60px rgba(0, 245, 255, 0.1);
  --glow-pink: 0 0 14px rgba(255, 20, 147, 0.7), 0 0 35px rgba(255, 20, 147, 0.25), 0 0 60px rgba(255, 20, 147, 0.1);
  --text-dim: #b8a8e0;
  --text-bright: #f8f0ff;
  --scanlines: repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(200,64,255,0.03) 2px, rgba(200,64,255,0.03) 4px);
}

body[data-theme="minimal"] {
  background-image: radial-gradient(ellipse 50% 40% at 50% 100%, rgba(255, 255, 255, 0.02) 0%, transparent 60%);
  --neon-cyan: #78909c;
  --neon-pink: #e53935;
  --neon-purple: #5e35b1;
  --neon-yellow: #fbc02d;
  --neon-green: #43a047;
  --dark-bg: #1a1a1a;
  --dark-card: #242424;
  --darker-card: #1a1a1a;
  --border-cyan: rgba(84, 110, 122, 0.2);
  --border-pink: rgba(229, 57, 53, 0.2);
  --glow-cyan: 0 0 6px rgba(84, 110, 122, 0.2), 0 0 15px rgba(84, 110, 122, 0.05);
  --glow-pink: 0 0 6px rgba(229, 57, 53, 0.2), 0 0 15px rgba(229, 57, 53, 0.05);
  --text-dim: #999;
  --text-bright: #eaeaea;
  --scanlines: none;
}

body[data-theme="poe"] {
  background-image: radial-gradient(ellipse 50% 40% at 50% 85%, rgba(0, 0, 0, 0.7) 0%, transparent 55%), radial-gradient(ellipse 45% 35% at 50% 50%, rgba(120, 0, 20, 0.04) 0%, transparent 70%), radial-gradient(ellipse 55% 45% at 65% 25%, rgba(120, 0, 20, 0.10) 0%, transparent 50%), radial-gradient(ellipse 50% 40% at 20% 30%, rgba(140, 160, 200, 0.04) 0%, transparent 55%), linear-gradient(180deg, #040510 0%, #060412 35%, #050208 100%);
  --neon-cyan: #a0b0cc;
  --neon-pink: #8b0018;
  --neon-purple: #301850;
  --neon-yellow: #b89838;
  --neon-green: #304a30;
  --dark-bg: #040208;
  --dark-card: #0a0616;
  --darker-card: #040108;
  --border-cyan: rgba(160, 176, 204, 0.10);
  --border-pink: rgba(139, 0, 24, 0.35);
  --glow-cyan: 0 0 8px rgba(160, 176, 204, 0.12), 0 0 18px rgba(160, 176, 204, 0.04);
  --glow-pink: 0 0 12px rgba(139, 0, 24, 0.45), 0 0 30px rgba(139, 0, 24, 0.12);
  --text-dim: #8888a0;
  --text-bright: #d0d4e8;
  --scanlines: repeating-linear-gradient(0deg, transparent, transparent 3px, rgba(48,24,80,0.04) 3px, rgba(48,24,80,0.04) 6px);
}

body[data-theme="forest"] {
  background-image: radial-gradient(ellipse 60% 40% at 50% 90%, rgba(180, 200, 80, 0.06) 0%, transparent 50%), radial-gradient(ellipse 50% 50% at 25% 25%, rgba(100, 200, 60, 0.06) 0%, transparent 60%), radial-gradient(ellipse 40% 40% at 75% 30%, rgba(220, 160, 40, 0.04) 0%, transparent 50%), linear-gradient(180deg, #0c120b 0%, #141d12 40%, #0f140d 100%);
  --neon-cyan: #7cbd5a;
  --neon-pink: #c97a3a;
  --neon-purple: #8a6bb0;
  --neon-yellow: #e8c84a;
  --neon-green: #5ca84a;
  --dark-bg: #0f140d;
  --dark-card: #1a2216;
  --darker-card: #0c100a;
  --border-cyan: rgba(124, 189, 90, 0.2);
  --border-pink: rgba(201, 122, 58, 0.25);
  --glow-cyan: 0 0 10px rgba(124, 189, 90, 0.35), 0 0 25px rgba(124, 189, 90, 0.08);
  --glow-pink: 0 0 8px rgba(201, 122, 58, 0.3), 0 0 20px rgba(201, 122, 58, 0.08);
  --text-dim: #8a9a7e;
  --text-bright: #e8ecd8;
  --scanlines: repeating-linear-gradient(0deg, transparent, transparent 4px, rgba(80,120,60,0.03) 4px, rgba(80,120,60,0.03) 8px);
}

body[data-theme="steampunk"] {
  background-image: radial-gradient(ellipse 50% 40% at 50% 85%, rgba(220, 170, 40, 0.10) 0%, transparent 55%), radial-gradient(ellipse 60% 50% at 25% 20%, rgba(160, 180, 190, 0.04) 0%, transparent 55%), radial-gradient(ellipse 40% 35% at 80% 25%, rgba(180, 90, 30, 0.04) 0%, transparent 50%), linear-gradient(180deg, #161412 0%, #1c1a16 40%, #141210 100%);
  --neon-cyan: #c89830;
  --neon-pink: #a8582e;
  --neon-purple: #5c3850;
  --neon-yellow: #e0c040;
  --neon-green: #588a68;
  --dark-bg: #141210;
  --dark-card: #1e1c18;
  --darker-card: #100e0c;
  --border-cyan: rgba(200, 152, 48, 0.18);
  --border-pink: rgba(168, 88, 46, 0.22);
  --glow-cyan: 0 0 10px rgba(220, 180, 50, 0.35), 0 0 22px rgba(200, 152, 48, 0.08);
  --glow-pink: 0 0 6px rgba(168, 88, 46, 0.3), 0 0 16px rgba(168, 88, 46, 0.08);
  --text-dim: #9a9488;
  --text-bright: #e8e0d0;
  --scanlines: repeating-linear-gradient(0deg, transparent, transparent 1px, rgba(150,130,100,0.03) 1px, rgba(150,130,100,0.03) 2px);
}