/* ============================================================
   PRICE TRACKER V3 - ALL THEMES COMBINED
   Auto-generated by deploy.sh on 20260212_124521
   ============================================================ */


/* === attack-titan.css === */
/* ============================================================
   THEME: Attack on Titan
   ============================================================ */

[data-theme="attack-titan-light"] {
  --font-primary: 'Cinzel', serif;
  --font-mono: 'Space Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #efebe9; --bg-surface: #d7ccc8; --bg-elevated: #bcaaa4;
  --bg-hover: #a1887f; --bg-active: #8d6e63; --bg-glass: rgba(255,255,255,0.9);
  --text-primary: #3e2723; --text-secondary: #4e342e;
  --text-tertiary: #5d4037; --text-muted: #6d4c41;
  --border: rgba(121,85,72,0.3); --border-subtle: rgba(121,85,72,0.15);
  --border-hover: rgba(121,85,72,0.5);
  --accent: #795548; --accent-hover: #8d6e63;
  --accent-muted: #79554820; --accent-glow: #79554840;
  --accent-gradient: linear-gradient(135deg, #795548 0%, #5d4037 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.12);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.12);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.12);
}

[data-theme="attack-titan-light"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme75-aot-wall-light.jpg') center/cover no-repeat;
  opacity: 0.15; pointer-events: none; z-index: -1;
}

[data-theme="attack-titan-dark"] {
  --font-primary: 'Cinzel', serif;
  --font-mono: 'Space Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #1a0f0a; --bg-surface: #2a1810; --bg-elevated: #3a2218;
  --bg-hover: #4a2c20; --bg-active: #5a3628; --bg-glass: rgba(0,0,0,0.85);
  --text-primary: #d7ccc8; --text-secondary: #bcaaa4;
  --text-tertiary: #a1887f; --text-muted: #8d6e63;
  --border: rgba(255,87,34,0.4); --border-subtle: rgba(255,87,34,0.2);
  --border-hover: rgba(255,87,34,0.7);
  --accent: #ff5722; --accent-hover: #ff7043;
  --accent-muted: #ff572225; --accent-glow: #ff572250;
  --accent-gradient: linear-gradient(135deg, #ff5722 0%, #bf360c 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.15);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="attack-titan-dark"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme75-aot-breach-dark.jpg') center/cover no-repeat;
  opacity: 0.35; pointer-events: none; z-index: -1;
}

[data-theme="attack-titan-dark"] .btn-accent,
[data-theme="attack-titan-dark"] .btn-primary { box-shadow: 0 0 20px var(--accent-glow); }

/* === botanical.css === */
/* ============================================================
   THEME: Botanical Study
   ============================================================ */

[data-theme="botanical-light"] {
  --font-primary: 'Cormorant Garamond', serif;
  --font-mono: 'Space Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #e8f5e9; --bg-surface: #c8e6c9; --bg-elevated: #a5d6a7;
  --bg-hover: #81c784; --bg-active: #66bb6a; --bg-glass: rgba(255,255,255,0.9);
  --text-primary: #1b5e20; --text-secondary: #2e7d32;
  --text-tertiary: #388e3c; --text-muted: #43a047;
  --border: rgba(76,175,80,0.3); --border-subtle: rgba(76,175,80,0.15);
  --border-hover: rgba(76,175,80,0.5);
  --accent: #4caf50; --accent-hover: #66bb6a;
  --accent-muted: #4caf5020; --accent-glow: #4caf5040;
  --accent-gradient: linear-gradient(135deg, #4caf50 0%, #8bc34a 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.12);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.12);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.12);
}

[data-theme="botanical-light"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme4-greenhouse-light.jpg') center/cover no-repeat;
  opacity: 0.12; pointer-events: none; z-index: -1;
}

[data-theme="botanical-dark"] {
  --font-primary: 'Cormorant Garamond', serif;
  --font-mono: 'Space Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #050a08; --bg-surface: #0a1410; --bg-elevated: #0f1e18;
  --bg-hover: #142820; --bg-active: #193228; --bg-glass: rgba(0,0,0,0.85);
  --text-primary: #c8e6c9; --text-secondary: #a5d6a7;
  --text-tertiary: #81c784; --text-muted: #66bb6a;
  --border: rgba(0,230,255,0.4); --border-subtle: rgba(0,230,255,0.2);
  --border-hover: rgba(0,230,255,0.7);
  --accent: #00e5ff; --accent-hover: #18ffff;
  --accent-muted: #00e5ff25; --accent-glow: #00e5ff50;
  --accent-gradient: linear-gradient(135deg, #4caf50 0%, #00e5ff 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.15);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="botanical-dark"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme4-bioluminescent-dark.jpg') center/cover no-repeat;
  opacity: 0.35; pointer-events: none; z-index: -1;
}

[data-theme="botanical-dark"] .btn-accent,
[data-theme="botanical-dark"] .btn-primary { box-shadow: 0 0 20px var(--accent-glow); }

/* === bsd.css === */
/* ============================================================
   THEME: BSD (BUNGO STRAY DOGS)
   Japanese noir aesthetic inspired by BSD anime
   Light: Armed Detective Agency (warm sepia/brown)
   Dark: Port Mafia (deep crimson/black)
   Fonts: Noto Serif JP + Playfair Display (elegant serif)
   ============================================================ */

/* === LIGHT MODE (Armed Detective Agency) === */
[data-theme="bsd-light"] {
  --font-primary: 'Noto Serif JP', 'Playfair Display', 'Georgia', serif;
  --font-mono: 'Cinzel', 'Times New Roman', serif;
  
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  
  --bg-base: #f5f0e8;
  --bg-surface: #faf7f2;
  --bg-elevated: #fffefb;
  --bg-hover: #efe9de;
  --bg-active: #e5ddd0;
  --bg-glass: rgba(250, 247, 242, 0.92);
  
  --text-primary: #3d3225;
  --text-secondary: #6b5d4a;
  --text-tertiary: #9a8b75;
  --text-muted: #b8aa95;
  
  --border: #d9cfc0;
  --border-subtle: #e8e0d5;
  --border-hover: #c4b8a5;
  
  /* Agency accent - warm gold/brown (like Dazai's coat) */
  --accent: #a67c52;
  --accent-hover: #c49464;
  --accent-muted: rgba(166, 124, 82, 0.12);
  --accent-glow: rgba(166, 124, 82, 0.2);
  --accent-gradient: linear-gradient(135deg, #a67c52 0%, #c49464 50%, #d4a574 100%);
  
  --success: #5a8a5a;
  --success-muted: rgba(90, 138, 90, 0.12);
  --warning: #c9a227;
  --warning-muted: rgba(201, 162, 39, 0.12);
  --danger: #a65050;
  --danger-muted: rgba(166, 80, 80, 0.12);
}

/* === DARK MODE (Port Mafia) === */
[data-theme="bsd-dark"] {
  --font-primary: 'Noto Serif JP', 'Playfair Display', 'Georgia', serif;
  --font-mono: 'Cinzel', 'Times New Roman', serif;
  
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  
  --bg-base: #0d0a0a;
  --bg-surface: #151010;
  --bg-elevated: #1e1616;
  --bg-hover: #281e1e;
  --bg-active: #322626;
  --bg-glass: rgba(21, 16, 16, 0.92);
  
  --text-primary: #e8ddd8;
  --text-secondary: #b8a89c;
  --text-tertiary: #8a786c;
  --text-muted: #5a4d45;
  
  --border: #2a1f1f;
  --border-subtle: #1f1717;
  --border-hover: #3d2e2e;
  
  /* Port Mafia accent - crimson red */
  --accent: #c41e3a;
  --accent-hover: #e03050;
  --accent-muted: rgba(196, 30, 58, 0.12);
  --accent-glow: rgba(196, 30, 58, 0.25);
  --accent-gradient: linear-gradient(135deg, #8b1538 0%, #c41e3a 50%, #e03050 100%);
  
  --success: #4a8a5a;
  --success-muted: rgba(74, 138, 90, 0.12);
  --warning: #c9a227;
  --warning-muted: rgba(201, 162, 39, 0.12);
  --danger: #d04040;
  --danger-muted: rgba(208, 64, 64, 0.12);
}

/* === THEME EFFECTS: Noir atmosphere === */
[data-theme="bsd-light"] body::before {
  content: '';
  position: fixed;
  inset: 0;
  background: url('/static/images/themes/bsd_agency_bg.jpg') center/cover no-repeat fixed;
  opacity: 0.12;
  pointer-events: none;
  z-index: 0;
}

[data-theme="bsd-light"] body::after {
  content: '';
  position: fixed;
  inset: 0;
  background: 
    linear-gradient(180deg, var(--bg-base) 0%, transparent 20%, transparent 80%, var(--bg-base) 100%),
    radial-gradient(ellipse at 50% 0%, rgba(166, 124, 82, 0.08) 0%, transparent 60%);
  pointer-events: none;
  z-index: 0;
}

[data-theme="bsd-dark"] body::before {
  content: '';
  position: fixed;
  inset: 0;
  background: url('/static/images/themes/bsd_mafia_bg.jpg') center/cover no-repeat fixed;
  opacity: 0.15;
  pointer-events: none;
  z-index: 0;
}

[data-theme="bsd-dark"] body::after {
  content: '';
  position: fixed;
  inset: 0;
  background: 
    linear-gradient(180deg, var(--bg-base) 0%, transparent 25%, transparent 75%, var(--bg-base) 100%),
    radial-gradient(ellipse at 50% 100%, rgba(196, 30, 58, 0.08) 0%, transparent 60%);
  pointer-events: none;
  z-index: 0;
}

/* Elegant serif typography */
[data-theme^="bsd"] .welcome-card h1,
[data-theme^="bsd"] .section-title,
[data-theme^="bsd"] .modal-title {
  font-family: var(--font-mono);
  letter-spacing: 0.05em;
}

[data-theme^="bsd"] .brand {
  font-family: var(--font-mono);
  font-weight: 600;
  letter-spacing: 0.1em;
}

/* Japanese-inspired subtle shadows */
[data-theme="bsd-light"] .bento-card,
[data-theme="bsd-light"] .welcome-card,
[data-theme="bsd-light"] .card {
  box-shadow: 
    0 2px 8px rgba(61, 50, 37, 0.08),
    0 8px 24px rgba(61, 50, 37, 0.06);
}

[data-theme="bsd-dark"] .bento-card,
[data-theme="bsd-dark"] .welcome-card,
[data-theme="bsd-dark"] .card {
  box-shadow: 
    0 2px 8px rgba(0, 0, 0, 0.3),
    0 8px 24px rgba(196, 30, 58, 0.08);
}

[data-theme="bsd-dark"] .bento-card:hover {
  box-shadow: 
    0 4px 12px rgba(0, 0, 0, 0.4),
    0 12px 32px rgba(196, 30, 58, 0.12);
}

/* Mafia red glow on dark mode accents */
[data-theme="bsd-dark"] .nav-link.active,
[data-theme="bsd-dark"] .btn-accent,
[data-theme="bsd-dark"] .btn-primary {
  box-shadow: 0 0 20px var(--accent-glow);
}

[data-theme="bsd-dark"] .fab {
  box-shadow: 0 4px 24px var(--accent-glow);
}

/* Agency warm glow on light mode */
[data-theme="bsd-light"] .btn-accent,
[data-theme="bsd-light"] .btn-primary {
  box-shadow: 0 4px 16px var(--accent-glow);
}

/* === cloud.css === */
/* ============================================================
   THEME: CLOUD SKY
   Soft, fluffy aesthetic with dreamy clouds
   Fonts: Nunito + Quicksand
   Style: Very rounded corners, soft shadows, airy feel
   ============================================================ */

/* === LIGHT MODE (Default - Daytime Sky) === */
[data-theme="cloud-light"] {
  --font-primary: 'Nunito', 'Quicksand', -apple-system, sans-serif;
  --font-mono: 'Space Mono', monospace;
  
  --radius-sm: 16px;
  --radius-md: 24px;
  --radius-lg: 32px;
  --radius-xl: 40px;
  
  --bg-base: #e8f4fc;
  --bg-surface: rgba(255, 255, 255, 0.85);
  --bg-elevated: rgba(255, 255, 255, 0.95);
  --bg-hover: rgba(255, 255, 255, 0.98);
  --bg-active: #f0f8ff;
  --bg-glass: rgba(255, 255, 255, 0.8);
  
  --text-primary: #3d5a73;
  --text-secondary: #5a7a94;
  --text-tertiary: #8aa8c0;
  --text-muted: #a8c4d8;
  
  --border: rgba(180, 210, 235, 0.5);
  --border-subtle: rgba(200, 225, 245, 0.4);
  --border-hover: rgba(150, 190, 220, 0.6);
  
  --accent: #4a9fd4;
  --accent-hover: #6bb8e8;
  --accent-muted: rgba(74, 159, 212, 0.15);
  --accent-glow: rgba(74, 159, 212, 0.25);
  --accent-gradient: linear-gradient(135deg, #4a9fd4 0%, #7bc8f0 50%, #a8e0ff 100%);
  
  --success: #5cb85c;
  --success-muted: rgba(92, 184, 92, 0.15);
  --warning: #f0ad4e;
  --warning-muted: rgba(240, 173, 78, 0.15);
  --danger: #d9534f;
  --danger-muted: rgba(217, 83, 79, 0.15);
}

/* === DARK MODE (Night Sky) === */
[data-theme="cloud-dark"] {
  --font-primary: 'Nunito', 'Quicksand', -apple-system, sans-serif;
  --font-mono: 'Space Mono', monospace;
  
  --radius-sm: 16px;
  --radius-md: 24px;
  --radius-lg: 32px;
  --radius-xl: 40px;
  
  --bg-base: #0a0e1a;
  --bg-surface: rgba(20, 25, 45, 0.85);
  --bg-elevated: rgba(25, 30, 55, 0.95);
  --bg-hover: rgba(30, 35, 65, 0.98);
  --bg-active: #1a1f3a;
  --bg-glass: rgba(20, 25, 45, 0.8);
  
  --text-primary: #d8e0f0;
  --text-secondary: #a8b8d8;
  --text-tertiary: #7888b0;
  --text-muted: #586080;
  
  --border: rgba(80, 90, 140, 0.4);
  --border-subtle: rgba(60, 70, 110, 0.3);
  --border-hover: rgba(100, 110, 170, 0.5);
  
  --accent: #9d8ec4;
  --accent-hover: #b8a8e0;
  --accent-muted: rgba(157, 142, 196, 0.15);
  --accent-glow: rgba(157, 142, 196, 0.3);
  --accent-gradient: linear-gradient(135deg, #7a6aa8 0%, #9d8ec4 50%, #c4b8e8 100%);
  
  --success: #7bc97b;
  --success-muted: rgba(123, 201, 123, 0.15);
  --warning: #e8c46b;
  --warning-muted: rgba(232, 196, 107, 0.15);
  --danger: #e87b7b;
  --danger-muted: rgba(232, 123, 123, 0.15);
}

/* === THEME EFFECTS: Floating clouds === */
[data-theme="cloud-light"] body::before {
  content: '';
  position: fixed;
  inset: 0;
  background: url('/static/images/themes/cloud_day_bg.jpg') center/cover no-repeat fixed;
  opacity: 0.35;
  pointer-events: none;
  z-index: 0;
}

[data-theme="cloud-dark"] body::before {
  content: '';
  position: fixed;
  inset: 0;
  background: url('/static/images/themes/cloud_night_bg.jpg') center/cover no-repeat fixed;
  opacity: 0.3;
  pointer-events: none;
  z-index: 0;
}

/* Floating animation for cards */
@keyframes cloudFloat {
  0%, 100% { transform: translateY(0px); }
  50% { transform: translateY(-4px); }
}

[data-theme^="cloud"] .bento-card,
[data-theme^="cloud"] .welcome-card,
[data-theme^="cloud"] .card {
  box-shadow: 0 8px 32px rgba(74, 159, 212, 0.12);
  transition: transform 0.4s ease, box-shadow 0.4s ease;
}

[data-theme^="cloud"] .bento-card:hover,
[data-theme^="cloud"] .welcome-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 40px rgba(74, 159, 212, 0.18);
}

/* Soft, puffy buttons */
[data-theme^="cloud"] .btn-accent,
[data-theme^="cloud"] .btn-primary {
  box-shadow: 0 4px 16px var(--accent-glow);
}

[data-theme^="cloud"] .fab {
  box-shadow: 0 8px 24px var(--accent-glow);
}

/* === cyberpunk.css === */
/* ============================================================
   THEME: CYBERPUNK NEON
   Neon magenta/cyan aesthetic with scanlines and glitch effects
   Fonts: Orbitron (headings) + Rajdhani (body)
   Style: Sharp edges, neon glow, futuristic
   ============================================================ */

/* === DARK MODE === */
[data-theme="cyberpunk-dark"] {
  --font-primary: 'Rajdhani', 'Exo 2', sans-serif;
  --font-mono: 'Orbitron', 'Share Tech Mono', monospace;
  
  --radius-sm: 2px;
  --radius-md: 4px;
  --radius-lg: 6px;
  --radius-xl: 8px;
  
  --bg-base: #050508;
  --bg-surface: rgba(10, 10, 18, 0.9);
  --bg-elevated: rgba(15, 15, 28, 0.95);
  --bg-hover: rgba(25, 25, 45, 0.98);
  --bg-active: #1a1a30;
  --bg-glass: rgba(10, 10, 18, 0.85);
  
  --text-primary: #e0e0ff;
  --text-secondary: #a0a0d0;
  --text-tertiary: #7070a0;
  --text-muted: #505070;
  
  --border: rgba(255, 0, 255, 0.2);
  --border-subtle: rgba(0, 255, 255, 0.1);
  --border-hover: rgba(255, 0, 255, 0.4);
  
  --accent: #ff00ff;
  --accent-hover: #ff40ff;
  --accent-muted: rgba(255, 0, 255, 0.15);
  --accent-glow: rgba(255, 0, 255, 0.4);
  --accent-gradient: linear-gradient(135deg, #ff00ff 0%, #ff40ff 50%, #00ffff 100%);
  
  --success: #00ff88;
  --success-muted: rgba(0, 255, 136, 0.15);
  --warning: #ffcc00;
  --warning-muted: rgba(255, 204, 0, 0.15);
  --danger: #ff3366;
  --danger-muted: rgba(255, 51, 102, 0.15);
}

/* === LIGHT MODE === */
[data-theme="cyberpunk-light"] {
  --font-primary: 'Rajdhani', 'Exo 2', sans-serif;
  --font-mono: 'Orbitron', 'Share Tech Mono', monospace;
  
  --radius-sm: 2px;
  --radius-md: 4px;
  --radius-lg: 6px;
  --radius-xl: 8px;
  
  --bg-base: #f0f0f8;
  --bg-surface: rgba(255, 255, 255, 0.9);
  --bg-elevated: rgba(250, 250, 255, 0.95);
  --bg-hover: rgba(240, 240, 250, 0.98);
  --bg-active: #e8e8f5;
  --bg-glass: rgba(255, 255, 255, 0.85);
  
  --text-primary: #1a1a3a;
  --text-secondary: #4a4a7a;
  --text-tertiary: #7a7aaa;
  --text-muted: #aaaacc;
  
  --border: rgba(200, 0, 200, 0.2);
  --border-subtle: rgba(0, 180, 200, 0.15);
  --border-hover: rgba(200, 0, 200, 0.35);
  
  --accent: #cc00cc;
  --accent-hover: #e040e0;
  --accent-muted: rgba(200, 0, 200, 0.12);
  --accent-glow: rgba(200, 0, 200, 0.25);
  --accent-gradient: linear-gradient(135deg, #cc00cc 0%, #e040e0 50%, #00cccc 100%);
  
  --success: #00cc66;
  --success-muted: rgba(0, 204, 102, 0.12);
  --warning: #ddaa00;
  --warning-muted: rgba(221, 170, 0, 0.12);
  --danger: #dd2255;
  --danger-muted: rgba(221, 34, 85, 0.12);
}

/* === THEME EFFECTS: Scanlines + Neon Glow === */
[data-theme="cyberpunk-dark"] body::before {
  content: '';
  position: fixed;
  inset: 0;
  background: 
    url('/static/images/themes/cyberpunk_bg.jpg') center/cover no-repeat fixed;
  opacity: 0.25;
  pointer-events: none;
  z-index: 0;
}

[data-theme="cyberpunk-dark"] body::after {
  content: '';
  position: fixed;
  inset: 0;
  background: 
    repeating-linear-gradient(
      0deg,
      transparent,
      transparent 2px,
      rgba(0, 255, 255, 0.03) 2px,
      rgba(0, 255, 255, 0.03) 4px
    );
  pointer-events: none;
  z-index: 1;
}

[data-theme="cyberpunk-light"] body::before {
  content: '';
  position: fixed;
  inset: 0;
  background: 
    radial-gradient(ellipse at 30% 10%, rgba(200, 0, 200, 0.08) 0%, transparent 50%),
    radial-gradient(ellipse at 70% 90%, rgba(0, 200, 200, 0.08) 0%, transparent 50%);
  pointer-events: none;
  z-index: 0;
}

/* Neon glow on key elements */
[data-theme^="cyberpunk"] .brand,
[data-theme^="cyberpunk"] .plan-chip,
[data-theme^="cyberpunk"] .btn-accent,
[data-theme^="cyberpunk"] .btn-primary {
  text-shadow: 0 0 10px var(--accent-glow);
}

[data-theme^="cyberpunk"] .nav-link.active,
[data-theme^="cyberpunk"] .bento-card:hover {
  box-shadow: 0 0 20px var(--accent-glow);
}

/* Glitch animation for brand (subtle) */
@keyframes cyberpunkFlicker {
  0%, 95%, 100% { opacity: 1; }
  96% { opacity: 0.8; }
  97% { opacity: 1; }
  98% { opacity: 0.9; }
}

[data-theme^="cyberpunk"] .brand {
  animation: cyberpunkFlicker 4s ease-in-out infinite;
}

/* === dbz.css === */
/* ============================================================
   THEME: Dragon Ball Z
   ============================================================ */

[data-theme="dbz-light"] {
  --font-primary: 'Bangers', cursive;
  --font-mono: 'Space Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #e8f5e9; --bg-surface: #f1f8e9; --bg-elevated: #f9fbe7;
  --bg-hover: #dcedc8; --bg-active: #c5e1a5; --bg-glass: rgba(255,255,255,0.9);
  --text-primary: #1b5e20; --text-secondary: #388e3c;
  --text-tertiary: #689f38; --text-muted: #7cb342;
  --border: rgba(76,175,80,0.3); --border-subtle: rgba(76,175,80,0.15);
  --border-hover: rgba(76,175,80,0.5);
  --accent: #4caf50; --accent-hover: #66bb6a;
  --accent-muted: #4caf5020; --accent-glow: #4caf5040;
  --accent-gradient: linear-gradient(135deg, #4caf50 0%, #8bc34a 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.12);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.12);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.12);
}

[data-theme="dbz-light"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme72-dbz-capsule-light.jpg') center/cover no-repeat;
  opacity: 0.15; pointer-events: none; z-index: -1;
}

[data-theme="dbz-dark"] {
  --font-primary: 'Bangers', cursive;
  --font-mono: 'Space Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #0a0f05; --bg-surface: #0f1a08; --bg-elevated: #141f0a;
  --bg-hover: #1a280c; --bg-active: #1f3010; --bg-glass: rgba(0,0,0,0.85);
  --text-primary: #c8e6c9; --text-secondary: #a5d6a7;
  --text-tertiary: #81c784; --text-muted: #66bb6a;
  --border: rgba(255,235,59,0.3); --border-subtle: rgba(255,235,59,0.15);
  --border-hover: rgba(255,235,59,0.6);
  --accent: #ffeb3b; --accent-hover: #fff176;
  --accent-muted: #ffeb3b25; --accent-glow: #ffeb3b50;
  --accent-gradient: linear-gradient(135deg, #ffeb3b 0%, #ffc107 50%, #ff9800 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.15);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="dbz-dark"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme72-dbz-saiyan-dark.jpg') center/cover no-repeat;
  opacity: 0.25; pointer-events: none; z-index: -1;
}

[data-theme="dbz-dark"] .btn-accent,
[data-theme="dbz-dark"] .btn-primary { box-shadow: 0 0 20px var(--accent-glow); }

/* === death-note.css === */
/* ============================================================
   THEME: Death Note
   ============================================================ */

[data-theme="death-note-light"] {
  --font-primary: 'Playfair Display', serif;
  --font-mono: 'Space Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #fafafa; --bg-surface: #f5f5f5; --bg-elevated: #eeeeee;
  --bg-hover: #e0e0e0; --bg-active: #bdbdbd; --bg-glass: rgba(255,255,255,0.9);
  --text-primary: #212121; --text-secondary: #424242;
  --text-tertiary: #616161; --text-muted: #757575;
  --border: rgba(97,97,97,0.3); --border-subtle: rgba(97,97,97,0.15);
  --border-hover: rgba(97,97,97,0.5);
  --accent: #616161; --accent-hover: #757575;
  --accent-muted: #61616120; --accent-glow: #61616140;
  --accent-gradient: linear-gradient(135deg, #424242 0%, #757575 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.12);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.12);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.12);
}

[data-theme="death-note-light"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme77-deathnote-day-light.jpg') center/cover no-repeat;
  opacity: 0.1; pointer-events: none; z-index: -1;
}

[data-theme="death-note-dark"] {
  --font-primary: 'Playfair Display', serif;
  --font-mono: 'Space Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #0a0a0a; --bg-surface: #121212; --bg-elevated: #1a1a1a;
  --bg-hover: #222222; --bg-active: #2a2a2a; --bg-glass: rgba(0,0,0,0.85);
  --text-primary: #fafafa; --text-secondary: #f5f5f5;
  --text-tertiary: #eeeeee; --text-muted: #e0e0e0;
  --border: rgba(244,67,54,0.5); --border-subtle: rgba(244,67,54,0.25);
  --border-hover: rgba(244,67,54,0.8);
  --accent: #f44336; --accent-hover: #ef5350;
  --accent-muted: #f4433625; --accent-glow: #f4433650;
  --accent-gradient: linear-gradient(135deg, #f44336 0%, #b71c1c 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.15);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="death-note-dark"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme77-deathnote-kira-dark.jpg') center/cover no-repeat;
  opacity: 0.35; pointer-events: none; z-index: -1;
}

[data-theme="death-note-dark"] .btn-accent,
[data-theme="death-note-dark"] .btn-primary { box-shadow: 0 0 20px var(--accent-glow); }

/* === demon-slayer.css === */
/* ============================================================
   THEME: Demon Slayer
   ============================================================ */

[data-theme="demon-slayer-light"] {
  --font-primary: 'Cinzel', serif;
  --font-mono: 'Space Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #f3e5f5; --bg-surface: #e1bee7; --bg-elevated: #ce93d8;
  --bg-hover: #ba68c8; --bg-active: #ab47bc; --bg-glass: rgba(255,255,255,0.9);
  --text-primary: #4a148c; --text-secondary: #6a1b9a;
  --text-tertiary: #7b1fa2; --text-muted: #8e24aa;
  --border: rgba(156,39,176,0.3); --border-subtle: rgba(156,39,176,0.15);
  --border-hover: rgba(156,39,176,0.5);
  --accent: #9c27b0; --accent-hover: #ab47bc;
  --accent-muted: #9c27b020; --accent-glow: #9c27b040;
  --accent-gradient: linear-gradient(135deg, #9c27b0 0%, #e91e63 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.12);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.12);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.12);
}

[data-theme="demon-slayer-light"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme80-demonslayer-mansion-light.jpg') center/cover no-repeat;
  opacity: 0.12; pointer-events: none; z-index: -1;
}

[data-theme="demon-slayer-dark"] {
  --font-primary: 'Cinzel', serif;
  --font-mono: 'Space Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #0f050a; --bg-surface: #1a0a14; --bg-elevated: #250f1e;
  --bg-hover: #301428; --bg-active: #3b1932; --bg-glass: rgba(0,0,0,0.85);
  --text-primary: #f3e5f5; --text-secondary: #e1bee7;
  --text-tertiary: #ce93d8; --text-muted: #ba68c8;
  --border: rgba(255,87,34,0.5); --border-subtle: rgba(255,87,34,0.25);
  --border-hover: rgba(255,87,34,0.8);
  --accent: #ff5722; --accent-hover: #ff7043;
  --accent-muted: #ff572225; --accent-glow: #ff572250;
  --accent-gradient: linear-gradient(135deg, #9c27b0 0%, #ff5722 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.15);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="demon-slayer-dark"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme80-demonslayer-hinokami-dark.jpg') center/cover no-repeat;
  opacity: 0.35; pointer-events: none; z-index: -1;
}

[data-theme="demon-slayer-dark"] .btn-accent,
[data-theme="demon-slayer-dark"] .btn-primary { box-shadow: 0 0 20px var(--accent-glow); }

/* === drone-controller.css === */
/* ============================================================
   THEME: Drone Controller
   ============================================================ */

[data-theme="drone-controller-light"] {
  --font-primary: 'Orbitron', sans-serif;
  --font-mono: 'Share Tech Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #f1f8e9; --bg-surface: #dcedc8; --bg-elevated: #c5e1a5;
  --bg-hover: #aed581; --bg-active: #9ccc65; --bg-glass: rgba(255,255,255,0.9);
  --text-primary: #33691e; --text-secondary: #558b2f;
  --text-tertiary: #689f38; --text-muted: #7cb342;
  --border: rgba(139,195,74,0.3); --border-subtle: rgba(139,195,74,0.15);
  --border-hover: rgba(139,195,74,0.5);
  --accent: #8bc34a; --accent-hover: #9ccc65;
  --accent-muted: #8bc34a20; --accent-glow: #8bc34a40;
  --accent-gradient: linear-gradient(135deg, #8bc34a 0%, #4caf50 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.12);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.12);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.12);
}

[data-theme="drone-controller-light"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme62-drone-day-light.jpg') center/cover no-repeat;
  opacity: 0.12; pointer-events: none; z-index: -1;
}

[data-theme="drone-controller-dark"] {
  --font-primary: 'Orbitron', sans-serif;
  --font-mono: 'Share Tech Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #050505; --bg-surface: #0a0a0a; --bg-elevated: #0f0f0f;
  --bg-hover: #141414; --bg-active: #1a1a1a; --bg-glass: rgba(0,0,0,0.85);
  --text-primary: #ffffff; --text-secondary: #f5f5f5;
  --text-tertiary: #eeeeee; --text-muted: #e0e0e0;
  --border: rgba(255,255,255,0.3); --border-subtle: rgba(255,255,255,0.15);
  --border-hover: rgba(255,255,255,0.6);
  --accent: #ffffff; --accent-hover: #f5f5f5;
  --accent-muted: #ffffff25; --accent-glow: #ffffff50;
  --accent-gradient: linear-gradient(135deg, #ffffff 0%, #9e9e9e 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.15);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="drone-controller-dark"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme62-drone-night-dark.jpg') center/cover no-repeat;
  opacity: 0.35; pointer-events: none; z-index: -1;
}

[data-theme="drone-controller-dark"] .btn-accent,
[data-theme="drone-controller-dark"] .btn-primary { box-shadow: 0 0 20px var(--accent-glow); }

/* === ember.css === */
/* ============================================================
   THEME: EMBER
   Unified with FlamingPanel color system
   Pure neutral darks, no purple tints
   Fonts: Inter + Poppins (display) + JetBrains Mono
   ============================================================ */

/* === DARK MODE === */
[data-theme="ember-dark"] {
  --font-primary: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-display: 'Poppins', 'Inter', sans-serif;
  --font-mono: 'JetBrains Mono', 'Space Mono', monospace;

  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 20px;

  /* FlamingPanel-matched backgrounds - pure neutral, no purple */
  --bg-base: #0d0d0d;
  --bg-surface: #111111;
  --bg-elevated: #161616;
  --bg-hover: #1a1a1a;
  --bg-active: #222222;
  --bg-glass: rgba(13, 13, 13, 0.88);

  /* FlamingPanel-matched text - pure white + neutral grays */
  --text-primary: #f3f4f6;
  --text-secondary: #9ca3af;
  --text-tertiary: #6b7280;
  --text-muted: #4b5563;

  /* FlamingPanel-matched borders - rgba white overlays */
  --border: rgba(255, 255, 255, 0.06);
  --border-subtle: rgba(255, 255, 255, 0.03);
  --border-hover: rgba(255, 255, 255, 0.12);

  /* Accent - flame orange */
  --accent: #f97316;
  --accent-hover: #fb923c;
  --accent-muted: rgba(249, 115, 22, 0.10);
  --accent-glow: rgba(249, 115, 22, 0.12);
  --accent-gradient: linear-gradient(135deg, #f97316 0%, #ef4444 100%);

  /* Status colors */
  --success: #22c55e;
  --success-muted: rgba(34, 197, 94, 0.12);
  --warning: #eab308;
  --warning-muted: rgba(234, 179, 8, 0.12);
  --danger: #ef4444;
  --danger-muted: rgba(239, 68, 68, 0.12);

  /* Ember-specific tokens */
  --ember-core: #f97316;
  --ember-hot: #ef4444;
  --ember-warm: #eab308;
  --ember-glow: rgba(249, 115, 22, 0.30);
  --ember-gradient: linear-gradient(135deg, #f97316 0%, #ef4444 100%);

  /* Glass morphism tokens (new - for unified glass components) */
  --bg-glass-surface: rgba(255,255,255,0.03);
  --bg-glass-elevated: rgba(255,255,255,0.06);
  --shadow-flame: 0 0 20px rgba(249,115,22,0.3);
  --shadow-flame-lg: 0 0 40px rgba(249,115,22,0.4);
}

/* === LIGHT MODE === */
[data-theme="ember-light"] {
  --font-primary: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-display: 'Poppins', 'Inter', sans-serif;
  --font-mono: 'JetBrains Mono', 'Space Mono', monospace;

  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 20px;

  --bg-base: #f5f5f5;
  --bg-surface: #ffffff;
  --bg-elevated: #ffffff;
  --bg-hover: #f0f0f0;
  --bg-active: #e5e5e5;
  --bg-glass: rgba(255, 255, 255, 0.92);

  --text-primary: #111111;
  --text-secondary: #4b5563;
  --text-tertiary: #6b7280;
  --text-muted: #9ca3af;

  --border: rgba(0, 0, 0, 0.08);
  --border-subtle: rgba(0, 0, 0, 0.04);
  --border-hover: rgba(0, 0, 0, 0.15);

  --accent: #ea580c;
  --accent-hover: #f97316;
  --accent-muted: rgba(234, 88, 12, 0.08);
  --accent-glow: rgba(234, 88, 12, 0.12);
  --accent-gradient: linear-gradient(135deg, #ea580c 0%, #dc2626 100%);

  --success: #16a34a;
  --success-muted: rgba(22, 163, 74, 0.10);
  --warning: #ca8a04;
  --warning-muted: rgba(202, 138, 4, 0.10);
  --danger: #dc2626;
  --danger-muted: rgba(220, 38, 38, 0.10);

  --ember-core: #ea580c;
  --ember-hot: #dc2626;
  --ember-warm: #ca8a04;
  --ember-glow: rgba(234, 88, 12, 0.20);
  --ember-gradient: linear-gradient(135deg, #ea580c 0%, #dc2626 100%);

  --bg-glass-surface: rgba(255,255,255,0.6);
  --bg-glass-elevated: rgba(255,255,255,0.8);
  --shadow-flame: 0 0 20px rgba(234,88,12,0.2);
  --shadow-flame-lg: 0 0 40px rgba(234,88,12,0.25);
}

/* === evangelion.css === */
/* ============================================================
   THEME: Evangelion
   ============================================================ */

[data-theme="evangelion-light"] {
  --font-primary: 'Orbitron', sans-serif;
  --font-mono: 'Share Tech Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #e8f5e9; --bg-surface: #c8e6c9; --bg-elevated: #a5d6a7;
  --bg-hover: #81c784; --bg-active: #66bb6a; --bg-glass: rgba(255,255,255,0.9);
  --text-primary: #1b5e20; --text-secondary: #2e7d32;
  --text-tertiary: #388e3c; --text-muted: #43a047;
  --border: rgba(76,175,80,0.3); --border-subtle: rgba(76,175,80,0.15);
  --border-hover: rgba(76,175,80,0.5);
  --accent: #4caf50; --accent-hover: #66bb6a;
  --accent-muted: #4caf5020; --accent-glow: #4caf5040;
  --accent-gradient: linear-gradient(135deg, #4caf50 0%, #ff5722 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.12);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.12);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.12);
}

[data-theme="evangelion-light"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme84-eva-entry-light.jpg') center/cover no-repeat;
  opacity: 0.12; pointer-events: none; z-index: -1;
}

[data-theme="evangelion-dark"] {
  --font-primary: 'Orbitron', sans-serif;
  --font-mono: 'Share Tech Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #050a05; --bg-surface: #0a140a; --bg-elevated: #0f1e0f;
  --bg-hover: #142814; --bg-active: #193219; --bg-glass: rgba(0,0,0,0.85);
  --text-primary: #c8e6c9; --text-secondary: #a5d6a7;
  --text-tertiary: #81c784; --text-muted: #66bb6a;
  --border: rgba(255,87,34,0.5); --border-subtle: rgba(255,87,34,0.25);
  --border-hover: rgba(255,87,34,0.8);
  --accent: #ff5722; --accent-hover: #ff7043;
  --accent-muted: #ff572225; --accent-glow: #ff572250;
  --accent-gradient: linear-gradient(135deg, #4caf50 0%, #ff5722 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.15);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="evangelion-dark"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme84-eva-third-dark.jpg') center/cover no-repeat;
  opacity: 0.4; pointer-events: none; z-index: -1;
}

[data-theme="evangelion-dark"] .btn-accent,
[data-theme="evangelion-dark"] .btn-primary { box-shadow: 0 0 20px var(--accent-glow); }

/* === fighter-hud.css === */
/* ============================================================
   THEME: Fighter HUD
   ============================================================ */

[data-theme="fighter-hud-light"] {
  --font-primary: 'Orbitron', sans-serif;
  --font-mono: 'Share Tech Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #e3f2fd; --bg-surface: #bbdefb; --bg-elevated: #90caf9;
  --bg-hover: #64b5f6; --bg-active: #42a5f5; --bg-glass: rgba(255,255,255,0.9);
  --text-primary: #0d47a1; --text-secondary: #1565c0;
  --text-tertiary: #1976d2; --text-muted: #1e88e5;
  --border: rgba(33,150,243,0.3); --border-subtle: rgba(33,150,243,0.15);
  --border-hover: rgba(33,150,243,0.5);
  --accent: #2196f3; --accent-hover: #42a5f5;
  --accent-muted: #2196f320; --accent-glow: #2196f340;
  --accent-gradient: linear-gradient(135deg, #2196f3 0%, #4caf50 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.12);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.12);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.12);
}

[data-theme="fighter-hud-light"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme56-fighter-day-light.jpg') center/cover no-repeat;
  opacity: 0.12; pointer-events: none; z-index: -1;
}

[data-theme="fighter-hud-dark"] {
  --font-primary: 'Orbitron', sans-serif;
  --font-mono: 'Share Tech Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #000a00; --bg-surface: #001400; --bg-elevated: #001e00;
  --bg-hover: #002800; --bg-active: #003200; --bg-glass: rgba(0,0,0,0.85);
  --text-primary: #90ee90; --text-secondary: #7cfc00;
  --text-tertiary: #7fff00; --text-muted: #adff2f;
  --border: rgba(0,255,0,0.4); --border-subtle: rgba(0,255,0,0.2);
  --border-hover: rgba(0,255,0,0.7);
  --accent: #00ff00; --accent-hover: #7fff00;
  --accent-muted: #00ff0025; --accent-glow: #00ff0050;
  --accent-gradient: linear-gradient(135deg, #00ff00 0%, #adff2f 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.15);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="fighter-hud-dark"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme56-fighter-night-dark.jpg') center/cover no-repeat;
  opacity: 0.35; pointer-events: none; z-index: -1;
}

[data-theme="fighter-hud-dark"] .btn-accent,
[data-theme="fighter-hud-dark"] .btn-primary { box-shadow: 0 0 20px var(--accent-glow); }

/* === forest.css === */
/* ============================================================
   THEME: MYSTICAL FOREST
   Nature aesthetic with earthy tones and ethereal feel
   Fonts: Cormorant Garamond (elegant serif) + Cinzel (headings)
   Style: Organic curves, natural greens/browns, mystical glow
   ============================================================ */

/* === DARK MODE (Deep Forest) === */
[data-theme="forest-dark"] {
  --font-primary: 'Cormorant Garamond', 'Georgia', serif;
  --font-mono: 'Cinzel', 'Times New Roman', serif;
  
  --radius-sm: 8px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-xl: 32px;
  
  --bg-base: #0a1510;
  --bg-surface: rgba(15, 30, 22, 0.92);
  --bg-elevated: rgba(20, 40, 30, 0.95);
  --bg-hover: rgba(28, 55, 40, 0.98);
  --bg-active: #1e3a2a;
  --bg-glass: rgba(15, 30, 22, 0.88);
  
  --text-primary: #d4e8d8;
  --text-secondary: #8fb89a;
  --text-tertiary: #5a8a6a;
  --text-muted: #3a5a45;
  
  --border: rgba(90, 150, 100, 0.25);
  --border-subtle: rgba(70, 120, 80, 0.15);
  --border-hover: rgba(120, 180, 130, 0.35);
  
  --accent: #7dd87d;
  --accent-hover: #a0f0a0;
  --accent-muted: rgba(125, 216, 125, 0.15);
  --accent-glow: rgba(125, 216, 125, 0.3);
  --accent-gradient: linear-gradient(135deg, #4a9a5a 0%, #7dd87d 50%, #a0f0a0 100%);
  
  --success: #5dd85d;
  --success-muted: rgba(93, 216, 93, 0.15);
  --warning: #e8c46b;
  --warning-muted: rgba(232, 196, 107, 0.15);
  --danger: #e87b7b;
  --danger-muted: rgba(232, 123, 123, 0.15);
}

/* === LIGHT MODE (Sunlit Forest) === */
[data-theme="forest-light"] {
  --font-primary: 'Cormorant Garamond', 'Georgia', serif;
  --font-mono: 'Cinzel', 'Times New Roman', serif;
  
  --radius-sm: 8px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-xl: 32px;
  
  --bg-base: #e8f0e5;
  --bg-surface: rgba(255, 255, 255, 0.9);
  --bg-elevated: rgba(250, 252, 248, 0.95);
  --bg-hover: rgba(240, 248, 238, 0.98);
  --bg-active: #e0ece0;
  --bg-glass: rgba(255, 255, 255, 0.85);
  
  --text-primary: #1a3a25;
  --text-secondary: #4a7a55;
  --text-tertiary: #7aaa85;
  --text-muted: #aaccaa;
  
  --border: rgba(100, 160, 110, 0.25);
  --border-subtle: rgba(120, 180, 130, 0.15);
  --border-hover: rgba(80, 140, 90, 0.35);
  
  --accent: #3a8a4a;
  --accent-hover: #4aaa5a;
  --accent-muted: rgba(58, 138, 74, 0.12);
  --accent-glow: rgba(58, 138, 74, 0.2);
  --accent-gradient: linear-gradient(135deg, #2a6a3a 0%, #3a8a4a 50%, #5aaa6a 100%);
  
  --success: #3aaa3a;
  --success-muted: rgba(58, 170, 58, 0.12);
  --warning: #c9a020;
  --warning-muted: rgba(201, 160, 32, 0.12);
  --danger: #c05050;
  --danger-muted: rgba(192, 80, 80, 0.12);
}

/* === THEME EFFECTS: Ethereal forest overlay === */
[data-theme="forest-dark"] body::before {
  content: '';
  position: fixed;
  inset: 0;
  background: url('/static/images/themes/forest_bg.jpg') center/cover no-repeat fixed;
  opacity: 0.2;
  pointer-events: none;
  z-index: 0;
}

[data-theme="forest-dark"] body::after {
  content: '';
  position: fixed;
  inset: 0;
  background: 
    radial-gradient(ellipse at 20% 20%, rgba(125, 216, 125, 0.05) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 80%, rgba(212, 165, 116, 0.04) 0%, transparent 50%);
  pointer-events: none;
  z-index: 0;
}

[data-theme="forest-light"] body::before {
  content: '';
  position: fixed;
  inset: 0;
  background: url('/static/images/themes/forest_bg.jpg') center/cover no-repeat fixed;
  opacity: 0.1;
  pointer-events: none;
  z-index: 0;
}

[data-theme="forest-light"] body::after {
  content: '';
  position: fixed;
  inset: 0;
  background: 
    radial-gradient(ellipse at 70% 10%, rgba(255, 220, 130, 0.12) 0%, transparent 50%),
    radial-gradient(ellipse at 30% 90%, rgba(58, 138, 74, 0.06) 0%, transparent 40%);
  pointer-events: none;
  z-index: 0;
}

/* Leaf/organic shadow on cards */
[data-theme^="forest"] .bento-card,
[data-theme^="forest"] .welcome-card,
[data-theme^="forest"] .card,
[data-theme^="forest"] .items-list {
  box-shadow: 0 4px 20px rgba(30, 60, 40, 0.15);
}

[data-theme^="forest"] .bento-card:hover {
  box-shadow: 0 8px 30px rgba(30, 60, 40, 0.2);
}

/* Elegant typography */
[data-theme^="forest"] .welcome-card h1,
[data-theme^="forest"] .section-title {
  font-family: var(--font-mono);
  letter-spacing: 0.05em;
}

[data-theme^="forest"] .brand {
  font-family: var(--font-mono);
  font-weight: 600;
  letter-spacing: 0.08em;
}

/* Organic button styling */
[data-theme^="forest"] .btn-accent,
[data-theme^="forest"] .btn-primary {
  box-shadow: 0 4px 16px var(--accent-glow);
}

[data-theme^="forest"] .fab {
  box-shadow: 0 6px 24px var(--accent-glow);
}

/* === gundam.css === */
/* ============================================================
   THEME: Gundam
   ============================================================ */

[data-theme="gundam-light"] {
  --font-primary: 'Orbitron', sans-serif;
  --font-mono: 'Share Tech Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #e3f2fd; --bg-surface: #bbdefb; --bg-elevated: #90caf9;
  --bg-hover: #64b5f6; --bg-active: #42a5f5; --bg-glass: rgba(255,255,255,0.9);
  --text-primary: #0d47a1; --text-secondary: #1565c0;
  --text-tertiary: #1976d2; --text-muted: #1e88e5;
  --border: rgba(33,150,243,0.3); --border-subtle: rgba(33,150,243,0.15);
  --border-hover: rgba(33,150,243,0.5);
  --accent: #2196f3; --accent-hover: #42a5f5;
  --accent-muted: #2196f320; --accent-glow: #2196f340;
  --accent-gradient: linear-gradient(135deg, #2196f3 0%, #f44336 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.12);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.12);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.12);
}

[data-theme="gundam-light"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme85-gundam-colony-light.jpg') center/cover no-repeat;
  opacity: 0.12; pointer-events: none; z-index: -1;
}

[data-theme="gundam-dark"] {
  --font-primary: 'Orbitron', sans-serif;
  --font-mono: 'Share Tech Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #050510; --bg-surface: #0a0a1a; --bg-elevated: #0f0f24;
  --bg-hover: #14142e; --bg-active: #1a1a38; --bg-glass: rgba(0,0,0,0.85);
  --text-primary: #bbdefb; --text-secondary: #90caf9;
  --text-tertiary: #64b5f6; --text-muted: #42a5f5;
  --border: rgba(244,67,54,0.4); --border-subtle: rgba(244,67,54,0.2);
  --border-hover: rgba(244,67,54,0.7);
  --accent: #f44336; --accent-hover: #ef5350;
  --accent-muted: #f4433625; --accent-glow: #f4433650;
  --accent-gradient: linear-gradient(135deg, #2196f3 0%, #f44336 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.15);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="gundam-dark"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme85-gundam-battle-dark.jpg') center/cover no-repeat;
  opacity: 0.35; pointer-events: none; z-index: -1;
}

[data-theme="gundam-dark"] .btn-accent,
[data-theme="gundam-dark"] .btn-primary { box-shadow: 0 0 20px var(--accent-glow); }

/* === haikyuu.css === */
/* ============================================================
   THEME: Haikyuu
   ============================================================ */

[data-theme="haikyuu-light"] {
  --font-primary: 'Rajdhani', sans-serif;
  --font-mono: 'Space Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #fff3e0; --bg-surface: #ffe0b2; --bg-elevated: #ffcc80;
  --bg-hover: #ffb74d; --bg-active: #ffa726; --bg-glass: rgba(255,255,255,0.9);
  --text-primary: #e65100; --text-secondary: #ef6c00;
  --text-tertiary: #f57c00; --text-muted: #fb8c00;
  --border: rgba(255,152,0,0.3); --border-subtle: rgba(255,152,0,0.15);
  --border-hover: rgba(255,152,0,0.5);
  --accent: #ff9800; --accent-hover: #ffa726;
  --accent-muted: #ff980020; --accent-glow: #ff980040;
  --accent-gradient: linear-gradient(135deg, #ff9800 0%, #ff5722 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.12);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.12);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.12);
}

[data-theme="haikyuu-light"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme79-haikyuu-gym-light.jpg') center/cover no-repeat;
  opacity: 0.12; pointer-events: none; z-index: -1;
}

[data-theme="haikyuu-dark"] {
  --font-primary: 'Rajdhani', sans-serif;
  --font-mono: 'Space Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #1a0f00; --bg-surface: #2a1800; --bg-elevated: #3a2200;
  --bg-hover: #4a2c00; --bg-active: #5a3600; --bg-glass: rgba(0,0,0,0.85);
  --text-primary: #ffe0b2; --text-secondary: #ffcc80;
  --text-tertiary: #ffb74d; --text-muted: #ffa726;
  --border: rgba(255,87,34,0.4); --border-subtle: rgba(255,87,34,0.2);
  --border-hover: rgba(255,87,34,0.7);
  --accent: #ff5722; --accent-hover: #ff7043;
  --accent-muted: #ff572225; --accent-glow: #ff572250;
  --accent-gradient: linear-gradient(135deg, #ff9800 0%, #ff5722 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.15);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="haikyuu-dark"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme79-haikyuu-match-dark.jpg') center/cover no-repeat;
  opacity: 0.3; pointer-events: none; z-index: -1;
}

[data-theme="haikyuu-dark"] .btn-accent,
[data-theme="haikyuu-dark"] .btn-primary { box-shadow: 0 0 20px var(--accent-glow); }

/* === initial-d.css === */
/* ============================================================
   THEME: Initial D
   ============================================================ */

[data-theme="initial-d-light"] {
  --font-primary: 'Orbitron', sans-serif;
  --font-mono: 'Share Tech Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #e3f2fd; --bg-surface: #bbdefb; --bg-elevated: #90caf9;
  --bg-hover: #64b5f6; --bg-active: #42a5f5; --bg-glass: rgba(255,255,255,0.9);
  --text-primary: #0d47a1; --text-secondary: #1565c0;
  --text-tertiary: #1976d2; --text-muted: #1e88e5;
  --border: rgba(33,150,243,0.3); --border-subtle: rgba(33,150,243,0.15);
  --border-hover: rgba(33,150,243,0.5);
  --accent: #2196f3; --accent-hover: #42a5f5;
  --accent-muted: #2196f320; --accent-glow: #2196f340;
  --accent-gradient: linear-gradient(135deg, #2196f3 0%, #03a9f4 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.12);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.12);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.12);
}

[data-theme="initial-d-light"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme74-initiald-day-light.jpg') center/cover no-repeat;
  opacity: 0.15; pointer-events: none; z-index: -1;
}

[data-theme="initial-d-dark"] {
  --font-primary: 'Orbitron', sans-serif;
  --font-mono: 'Share Tech Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #050510; --bg-surface: #0a0a1a; --bg-elevated: #0f0f24;
  --bg-hover: #14142e; --bg-active: #1a1a38; --bg-glass: rgba(0,0,0,0.85);
  --text-primary: #e3f2fd; --text-secondary: #bbdefb;
  --text-tertiary: #90caf9; --text-muted: #64b5f6;
  --border: rgba(244,67,54,0.4); --border-subtle: rgba(244,67,54,0.2);
  --border-hover: rgba(244,67,54,0.7);
  --accent: #f44336; --accent-hover: #ef5350;
  --accent-muted: #f4433625; --accent-glow: #f4433650;
  --accent-gradient: linear-gradient(135deg, #2196f3 0%, #f44336 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.15);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="initial-d-dark"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme74-initiald-night-dark.jpg') center/cover no-repeat;
  opacity: 0.35; pointer-events: none; z-index: -1;
}

[data-theme="initial-d-dark"] .btn-accent,
[data-theme="initial-d-dark"] .btn-primary { box-shadow: 0 0 20px var(--accent-glow); }

/* === jjk.css === */
/* ============================================================
   THEME: Jujutsu Kaisen
   ============================================================ */

[data-theme="jjk-light"] {
  --font-primary: 'Rajdhani', sans-serif;
  --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #e8eaf6; --bg-surface: #c5cae9; --bg-elevated: #9fa8da;
  --bg-hover: #7986cb; --bg-active: #5c6bc0; --bg-glass: rgba(255,255,255,0.9);
  --text-primary: #1a237e; --text-secondary: #283593;
  --text-tertiary: #303f9f; --text-muted: #3949ab;
  --border: rgba(63,81,181,0.3); --border-subtle: rgba(63,81,181,0.15);
  --border-hover: rgba(63,81,181,0.5);
  --accent: #3f51b5; --accent-hover: #5c6bc0;
  --accent-muted: #3f51b520; --accent-glow: #3f51b540;
  --accent-gradient: linear-gradient(135deg, #3f51b5 0%, #673ab7 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.12);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.12);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.12);
}

[data-theme="jjk-light"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme81-jjk-school-light.jpg') center/cover no-repeat;
  opacity: 0.12; pointer-events: none; z-index: -1;
}

[data-theme="jjk-dark"] {
  --font-primary: 'Rajdhani', sans-serif;
  --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #05050f; --bg-surface: #0a0a1a; --bg-elevated: #0f0f25;
  --bg-hover: #141430; --bg-active: #19193b; --bg-glass: rgba(0,0,0,0.85);
  --text-primary: #c5cae9; --text-secondary: #9fa8da;
  --text-tertiary: #7986cb; --text-muted: #5c6bc0;
  --border: rgba(156,39,176,0.5); --border-subtle: rgba(156,39,176,0.25);
  --border-hover: rgba(156,39,176,0.8);
  --accent: #9c27b0; --accent-hover: #ab47bc;
  --accent-muted: #9c27b025; --accent-glow: #9c27b050;
  --accent-gradient: linear-gradient(135deg, #3f51b5 0%, #9c27b0 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.15);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="jjk-dark"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme81-jjk-domain-dark.jpg') center/cover no-repeat;
  opacity: 0.35; pointer-events: none; z-index: -1;
}

[data-theme="jjk-dark"] .btn-accent,
[data-theme="jjk-dark"] .btn-primary { box-shadow: 0 0 20px var(--accent-glow); }

/* === midnight.css === */
/* ============================================================
   THEME: MIDNIGHT TEAL
   Modern dark theme with teal/cyan gradient accents
   Fonts: Plus Jakarta Sans + Space Mono
   ============================================================ */

/* === DARK MODE === */
[data-theme="midnight-dark"] {
  --font-primary: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono: 'Space Mono', monospace;
  
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 20px;
  
  --bg-base: #0a0f14;
  --bg-surface: #0f1419;
  --bg-elevated: #151c24;
  --bg-hover: #1a232d;
  --bg-active: #212c38;
  --bg-glass: rgba(15, 20, 25, 0.85);
  
  --text-primary: #ecf0f3;
  --text-secondary: #8899a6;
  --text-tertiary: #657786;
  --text-muted: #4a5568;
  
  --border: #1e2a36;
  --border-subtle: #162029;
  --border-hover: #2a3a4a;
  
  --accent: #0ea5e9;
  --accent-hover: #38bdf8;
  --accent-muted: rgba(14, 165, 233, 0.1);
  --accent-glow: rgba(14, 165, 233, 0.2);
  --accent-gradient: linear-gradient(135deg, #0ea5e9 0%, #06b6d4 50%, #14b8a6 100%);
  
  --success: #10b981;
  --success-muted: rgba(16, 185, 129, 0.12);
  --warning: #f59e0b;
  --warning-muted: rgba(245, 158, 11, 0.12);
  --danger: #f43f5e;
  --danger-muted: rgba(244, 63, 94, 0.12);
}

/* === LIGHT MODE === */
[data-theme="midnight-light"] {
  --font-primary: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono: 'Space Mono', monospace;
  
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 20px;
  
  --bg-base: #f0f4f8;
  --bg-surface: #ffffff;
  --bg-elevated: #ffffff;
  --bg-hover: #e8ecf0;
  --bg-active: #dce1e7;
  --bg-glass: rgba(255, 255, 255, 0.9);
  
  --text-primary: #0a0f14;
  --text-secondary: #4a5568;
  --text-tertiary: #657786;
  --text-muted: #8899a6;
  
  --border: #dce1e7;
  --border-subtle: #e8ecf0;
  --border-hover: #c8d0da;
  
  --accent: #0284c7;
  --accent-hover: #0ea5e9;
  --accent-muted: rgba(2, 132, 199, 0.08);
  --accent-glow: rgba(2, 132, 199, 0.12);
  --accent-gradient: linear-gradient(135deg, #0284c7 0%, #0891b2 50%, #0d9488 100%);
  
  --success: #059669;
  --success-muted: rgba(5, 150, 105, 0.1);
  --warning: #d97706;
  --warning-muted: rgba(217, 119, 6, 0.1);
  --danger: #dc2626;
  --danger-muted: rgba(220, 38, 38, 0.1);
}

/* === THEME EFFECTS === */
[data-theme="midnight-dark"] body::before,
[data-theme="midnight-light"] body::before {
  content: '';
  position: fixed;
  inset: 0;
  background: radial-gradient(ellipse at 20% 0%, rgba(14, 165, 233, 0.06) 0%, transparent 60%),
              radial-gradient(ellipse at 80% 100%, rgba(20, 184, 166, 0.04) 0%, transparent 60%);
  pointer-events: none;
  z-index: 0;
}

/* === naruto.css === */
/* ============================================================
   THEME: Naruto
   ============================================================ */

[data-theme="naruto-light"] {
  --font-primary: 'Rajdhani', sans-serif;
  --font-mono: 'Space Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #fff8e1; --bg-surface: #ffecb3; --bg-elevated: #ffe082;
  --bg-hover: #ffd54f; --bg-active: #ffca28; --bg-glass: rgba(255,255,255,0.9);
  --text-primary: #e65100; --text-secondary: #ef6c00;
  --text-tertiary: #f57c00; --text-muted: #fb8c00;
  --border: rgba(255,152,0,0.3); --border-subtle: rgba(255,152,0,0.15);
  --border-hover: rgba(255,152,0,0.5);
  --accent: #ff9800; --accent-hover: #ffa726;
  --accent-muted: #ff980020; --accent-glow: #ff980040;
  --accent-gradient: linear-gradient(135deg, #ff9800 0%, #ff5722 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.12);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.12);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.12);
}

[data-theme="naruto-light"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme73-naruto-konoha-light.jpg') center/cover no-repeat;
  opacity: 0.12; pointer-events: none; z-index: -1;
}

[data-theme="naruto-dark"] {
  --font-primary: 'Rajdhani', sans-serif;
  --font-mono: 'Space Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #1a0a00; --bg-surface: #2a1000; --bg-elevated: #3a1800;
  --bg-hover: #4a2000; --bg-active: #5a2800; --bg-glass: rgba(0,0,0,0.85);
  --text-primary: #ffe0b2; --text-secondary: #ffcc80;
  --text-tertiary: #ffb74d; --text-muted: #ffa726;
  --border: rgba(156,39,176,0.4); --border-subtle: rgba(156,39,176,0.2);
  --border-hover: rgba(156,39,176,0.7);
  --accent: #9c27b0; --accent-hover: #ab47bc;
  --accent-muted: #9c27b025; --accent-glow: #9c27b050;
  --accent-gradient: linear-gradient(135deg, #ff9800 0%, #9c27b0 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.15);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="naruto-dark"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme73-naruto-summon-dark.jpg') center/cover no-repeat;
  opacity: 0.3; pointer-events: none; z-index: -1;
}

[data-theme="naruto-dark"] .btn-accent,
[data-theme="naruto-dark"] .btn-primary { box-shadow: 0 0 20px var(--accent-glow); }

/* === neo-tokyo.css === */
/* ============================================================
   THEME: Neo-Tokyo Rain
   ============================================================ */

[data-theme="neo-tokyo-light"] {
  --font-primary: 'Orbitron', sans-serif;
  --font-mono: 'Share Tech Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #e0f7fa; --bg-surface: #b2ebf2; --bg-elevated: #80deea;
  --bg-hover: #4dd0e1; --bg-active: #26c6da; --bg-glass: rgba(255,255,255,0.9);
  --text-primary: #006064; --text-secondary: #00838f;
  --text-tertiary: #0097a7; --text-muted: #00acc1;
  --border: rgba(0,188,212,0.3); --border-subtle: rgba(0,188,212,0.15);
  --border-hover: rgba(0,188,212,0.5);
  --accent: #00bcd4; --accent-hover: #26c6da;
  --accent-muted: #00bcd420; --accent-glow: #00bcd440;
  --accent-gradient: linear-gradient(135deg, #00bcd4 0%, #e91e63 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.12);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.12);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.12);
}

[data-theme="neo-tokyo-light"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme32-neo-overcast-light.jpg') center/cover no-repeat;
  opacity: 0.15; pointer-events: none; z-index: -1;
}

[data-theme="neo-tokyo-dark"] {
  --font-primary: 'Orbitron', sans-serif;
  --font-mono: 'Share Tech Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #050a0f; --bg-surface: #0a1419; --bg-elevated: #0f1e23;
  --bg-hover: #14282d; --bg-active: #193237; --bg-glass: rgba(0,0,0,0.85);
  --text-primary: #b2ebf2; --text-secondary: #80deea;
  --text-tertiary: #4dd0e1; --text-muted: #26c6da;
  --border: rgba(233,30,99,0.4); --border-subtle: rgba(233,30,99,0.2);
  --border-hover: rgba(233,30,99,0.7);
  --accent: #e91e63; --accent-hover: #ec407a;
  --accent-muted: #e91e6325; --accent-glow: #e91e6350;
  --accent-gradient: linear-gradient(135deg, #00bcd4 0%, #e91e63 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.15);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="neo-tokyo-dark"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme32-neo-midnight-dark.jpg') center/cover no-repeat;
  opacity: 0.4; pointer-events: none; z-index: -1;
}

[data-theme="neo-tokyo-dark"] .btn-accent,
[data-theme="neo-tokyo-dark"] .btn-primary { box-shadow: 0 0 20px var(--accent-glow); }

/* === neural-network.css === */
/* ============================================================
   THEME: Neural Network
   ============================================================ */

[data-theme="neural-network-light"] {
  --font-primary: 'Exo 2', sans-serif;
  --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #f3e5f5; --bg-surface: #e1bee7; --bg-elevated: #ce93d8;
  --bg-hover: #ba68c8; --bg-active: #ab47bc; --bg-glass: rgba(255,255,255,0.9);
  --text-primary: #4a148c; --text-secondary: #6a1b9a;
  --text-tertiary: #7b1fa2; --text-muted: #8e24aa;
  --border: rgba(156,39,176,0.3); --border-subtle: rgba(156,39,176,0.15);
  --border-hover: rgba(156,39,176,0.5);
  --accent: #9c27b0; --accent-hover: #ab47bc;
  --accent-muted: #9c27b020; --accent-glow: #9c27b040;
  --accent-gradient: linear-gradient(135deg, #9c27b0 0%, #673ab7 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.12);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.12);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.12);
}

[data-theme="neural-network-light"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme70-neural-training-light.jpg') center/cover no-repeat;
  opacity: 0.1; pointer-events: none; z-index: -1;
}

[data-theme="neural-network-dark"] {
  --font-primary: 'Exo 2', sans-serif;
  --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #0a050f; --bg-surface: #140a1e; --bg-elevated: #1e0f2d;
  --bg-hover: #28143c; --bg-active: #32194b; --bg-glass: rgba(0,0,0,0.85);
  --text-primary: #e1bee7; --text-secondary: #ce93d8;
  --text-tertiary: #ba68c8; --text-muted: #ab47bc;
  --border: rgba(156,39,176,0.5); --border-subtle: rgba(156,39,176,0.25);
  --border-hover: rgba(156,39,176,0.8);
  --accent: #9c27b0; --accent-hover: #ab47bc;
  --accent-muted: #9c27b025; --accent-glow: #9c27b050;
  --accent-gradient: linear-gradient(135deg, #9c27b0 0%, #673ab7 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.15);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="neural-network-dark"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme70-neural-inference-dark.jpg') center/cover no-repeat;
  opacity: 0.4; pointer-events: none; z-index: -1;
}

[data-theme="neural-network-dark"] .btn-accent,
[data-theme="neural-network-dark"] .btn-primary { box-shadow: 0 0 20px var(--accent-glow); }

/* === noir-detective.css === */
/* ============================================================
   THEME: Noir Detective
   ============================================================ */

[data-theme="noir-detective-light"] {
  --font-primary: 'Playfair Display', serif;
  --font-mono: 'Space Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #efebe9; --bg-surface: #d7ccc8; --bg-elevated: #bcaaa4;
  --bg-hover: #a1887f; --bg-active: #8d6e63; --bg-glass: rgba(255,255,255,0.9);
  --text-primary: #3e2723; --text-secondary: #4e342e;
  --text-tertiary: #5d4037; --text-muted: #6d4c41;
  --border: rgba(121,85,72,0.3); --border-subtle: rgba(121,85,72,0.15);
  --border-hover: rgba(121,85,72,0.5);
  --accent: #795548; --accent-hover: #8d6e63;
  --accent-muted: #79554820; --accent-glow: #79554840;
  --accent-gradient: linear-gradient(135deg, #795548 0%, #5d4037 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.12);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.12);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.12);
}

[data-theme="noir-detective-light"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme43-noir-office-light.jpg') center/cover no-repeat;
  opacity: 0.12; pointer-events: none; z-index: -1;
}

[data-theme="noir-detective-dark"] {
  --font-primary: 'Playfair Display', serif;
  --font-mono: 'Space Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #0a0808; --bg-surface: #141010; --bg-elevated: #1e1818;
  --bg-hover: #282020; --bg-active: #322828; --bg-glass: rgba(0,0,0,0.85);
  --text-primary: #d7ccc8; --text-secondary: #bcaaa4;
  --text-tertiary: #a1887f; --text-muted: #8d6e63;
  --border: rgba(244,67,54,0.4); --border-subtle: rgba(244,67,54,0.2);
  --border-hover: rgba(244,67,54,0.7);
  --accent: #f44336; --accent-hover: #ef5350;
  --accent-muted: #f4433625; --accent-glow: #f4433650;
  --accent-gradient: linear-gradient(135deg, #795548 0%, #f44336 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.15);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="noir-detective-dark"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme43-noir-alley-dark.jpg') center/cover no-repeat;
  opacity: 0.35; pointer-events: none; z-index: -1;
}

[data-theme="noir-detective-dark"] .btn-accent,
[data-theme="noir-detective-dark"] .btn-primary { box-shadow: 0 0 20px var(--accent-glow); }

/* === one-punch.css === */
/* ============================================================
   THEME: One Punch Man
   ============================================================ */

[data-theme="one-punch-light"] {
  --font-primary: 'Bangers', cursive;
  --font-mono: 'Space Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #fffde7; --bg-surface: #fff9c4; --bg-elevated: #fff59d;
  --bg-hover: #fff176; --bg-active: #ffee58; --bg-glass: rgba(255,255,255,0.9);
  --text-primary: #f57f17; --text-secondary: #f9a825;
  --text-tertiary: #fbc02d; --text-muted: #fdd835;
  --border: rgba(255,235,59,0.4); --border-subtle: rgba(255,235,59,0.4);
  --border-hover: rgba(255,235,59,0.4);
  --accent: #ffeb3b; --accent-hover: #fff176;
  --accent-muted: #ffeb3b20; --accent-glow: #ffeb3b40;
  --accent-gradient: linear-gradient(135deg, #ffeb3b 0%, #ffc107 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.12);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.12);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.12);
}

[data-theme="one-punch-light"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme82-opm-hero-light.jpg') center/cover no-repeat;
  opacity: 0.1; pointer-events: none; z-index: -1;
}

[data-theme="one-punch-dark"] {
  --font-primary: 'Bangers', cursive;
  --font-mono: 'Space Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #0f0a00; --bg-surface: #1a1200; --bg-elevated: #251a00;
  --bg-hover: #302200; --bg-active: #3b2a00; --bg-glass: rgba(0,0,0,0.85);
  --text-primary: #fff9c4; --text-secondary: #fff59d;
  --text-tertiary: #fff176; --text-muted: #ffee58;
  --border: rgba(244,67,54,0.5); --border-subtle: rgba(244,67,54,0.25);
  --border-hover: rgba(244,67,54,0.8);
  --accent: #f44336; --accent-hover: #ef5350;
  --accent-muted: #f4433625; --accent-glow: #f4433650;
  --accent-gradient: linear-gradient(135deg, #ffeb3b 0%, #f44336 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.15);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="one-punch-dark"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme82-opm-serious-dark.jpg') center/cover no-repeat;
  opacity: 0.35; pointer-events: none; z-index: -1;
}

[data-theme="one-punch-dark"] .btn-accent,
[data-theme="one-punch-dark"] .btn-primary { box-shadow: 0 0 20px var(--accent-glow); }

/* === radar.css === */
/* ============================================================
   THEME: RADAR
   Military/tactical aesthetic with scan effects
   Fonts: Exo 2 + Share Tech Mono
   Style: Grid overlay, subtle glow
   ============================================================ */

/* === DARK MODE === */
[data-theme="radar-dark"] {
  --font-primary: 'Exo 2', 'Rajdhani', sans-serif;
  --font-mono: 'Share Tech Mono', monospace;
  
  --radius-sm: 2px;
  --radius-md: 4px;
  --radius-lg: 6px;
  --radius-xl: 8px;
  
  --bg-base: #020a0f;
  --bg-surface: #071520;
  --bg-elevated: #0c1e2e;
  --bg-hover: #0f2538;
  --bg-active: #142d42;
  --bg-glass: rgba(7, 21, 32, 0.9);
  
  --text-primary: #c8e6d0;
  --text-secondary: #6fa87a;
  --text-tertiary: #3d7a4a;
  --text-muted: #2a5a35;
  
  --border: #0e2a1e;
  --border-subtle: #091e15;
  --border-hover: #164030;
  
  --accent: #22c55e;
  --accent-hover: #4ade80;
  --accent-muted: rgba(34, 197, 94, 0.06);
  --accent-glow: rgba(34, 197, 94, 0.15);
  --accent-gradient: linear-gradient(135deg, #22c55e 0%, #16a34a 50%, #15803d 100%);
  
  --success: #22c55e;
  --success-muted: rgba(34, 197, 94, 0.12);
  --warning: #eab308;
  --warning-muted: rgba(234, 179, 8, 0.12);
  --danger: #ef4444;
  --danger-muted: rgba(239, 68, 68, 0.12);
}

/* === LIGHT MODE === */
[data-theme="radar-light"] {
  --font-primary: 'Exo 2', 'Rajdhani', sans-serif;
  --font-mono: 'Share Tech Mono', monospace;
  
  --radius-sm: 2px;
  --radius-md: 4px;
  --radius-lg: 6px;
  --radius-xl: 8px;
  
  --bg-base: #f0f5f2;
  --bg-surface: #ffffff;
  --bg-elevated: #f7faf8;
  --bg-hover: #e8f0eb;
  --bg-active: #d5e5da;
  --bg-glass: rgba(255, 255, 255, 0.95);
  
  --text-primary: #0a1f10;
  --text-secondary: #3d6b48;
  --text-tertiary: #6a9975;
  --text-muted: #a0c4aa;
  
  --border: #d0e2d5;
  --border-subtle: #e5f0e8;
  --border-hover: #b5d4bd;
  
  --accent: #16a34a;
  --accent-hover: #22c55e;
  --accent-muted: rgba(22, 163, 74, 0.06);
  --accent-glow: rgba(22, 163, 74, 0.08);
  --accent-gradient: linear-gradient(135deg, #16a34a 0%, #15803d 100%);
  
  --success: #16a34a;
  --success-muted: rgba(22, 163, 74, 0.1);
  --warning: #ca8a04;
  --warning-muted: rgba(202, 138, 4, 0.1);
  --danger: #dc2626;
  --danger-muted: rgba(220, 38, 38, 0.1);
}

/* === THEME EFFECTS: Grid overlay === */
[data-theme="radar-dark"] body::before {
  content: '';
  position: fixed;
  inset: 0;
  background: 
    linear-gradient(rgba(34, 197, 94, 0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(34, 197, 94, 0.03) 1px, transparent 1px);
  background-size: 48px 48px;
  pointer-events: none;
  z-index: 0;
}

/* Optional: Sweep animation (can be disabled for performance) */
[data-theme="radar-dark"] body::after {
  content: '';
  position: fixed;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: conic-gradient(
    from 0deg at 50% 50%,
    transparent 0deg,
    rgba(34, 197, 94, 0.02) 30deg,
    transparent 60deg
  );
  animation: radarSweep 12s linear infinite;
  pointer-events: none;
  z-index: 0;
}

@keyframes radarSweep {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

/* Disable sweep animation for reduced motion preference */
@media (prefers-reduced-motion: reduce) {
  [data-theme="radar-dark"] body::after {
    animation: none;
    display: none;
  }
}

/* === rezero.css === */
/* ============================================================
   THEME: Re:Zero
   ============================================================ */

[data-theme="rezero-light"] {
  --font-primary: 'Quicksand', sans-serif;
  --font-mono: 'Space Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #e3f2fd; --bg-surface: #bbdefb; --bg-elevated: #90caf9;
  --bg-hover: #64b5f6; --bg-active: #42a5f5; --bg-glass: rgba(255,255,255,0.9);
  --text-primary: #0d47a1; --text-secondary: #1565c0;
  --text-tertiary: #1976d2; --text-muted: #1e88e5;
  --border: rgba(33,150,243,0.3); --border-subtle: rgba(33,150,243,0.15);
  --border-hover: rgba(33,150,243,0.5);
  --accent: #2196f3; --accent-hover: #42a5f5;
  --accent-muted: #2196f320; --accent-glow: #2196f340;
  --accent-gradient: linear-gradient(135deg, #2196f3 0%, #673ab7 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.12);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.12);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.12);
}

[data-theme="rezero-light"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme83-rezero-mansion-light.jpg') center/cover no-repeat;
  opacity: 0.12; pointer-events: none; z-index: -1;
}

[data-theme="rezero-dark"] {
  --font-primary: 'Quicksand', sans-serif;
  --font-mono: 'Space Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #05051a; --bg-surface: #0a0a28; --bg-elevated: #0f0f36;
  --bg-hover: #141444; --bg-active: #191952; --bg-glass: rgba(0,0,0,0.85);
  --text-primary: #bbdefb; --text-secondary: #90caf9;
  --text-tertiary: #64b5f6; --text-muted: #42a5f5;
  --border: rgba(156,39,176,0.5); --border-subtle: rgba(156,39,176,0.25);
  --border-hover: rgba(156,39,176,0.8);
  --accent: #9c27b0; --accent-hover: #ab47bc;
  --accent-muted: #9c27b025; --accent-glow: #9c27b050;
  --accent-gradient: linear-gradient(135deg, #2196f3 0%, #9c27b0 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.15);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="rezero-dark"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme83-rezero-death-dark.jpg') center/cover no-repeat;
  opacity: 0.35; pointer-events: none; z-index: -1;
}

[data-theme="rezero-dark"] .btn-accent,
[data-theme="rezero-dark"] .btn-primary { box-shadow: 0 0 20px var(--accent-glow); }

/* === sao.css === */
/* ============================================================
   THEME: Sword Art Online
   ============================================================ */

[data-theme="sao-light"] {
  --font-primary: 'Exo 2', sans-serif;
  --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #e1f5fe; --bg-surface: #b3e5fc; --bg-elevated: #81d4fa;
  --bg-hover: #4fc3f7; --bg-active: #29b6f6; --bg-glass: rgba(255,255,255,0.9);
  --text-primary: #01579b; --text-secondary: #0277bd;
  --text-tertiary: #0288d1; --text-muted: #039be5;
  --border: rgba(3,169,244,0.3); --border-subtle: rgba(3,169,244,0.15);
  --border-hover: rgba(3,169,244,0.5);
  --accent: #03a9f4; --accent-hover: #29b6f6;
  --accent-muted: #03a9f420; --accent-glow: #03a9f440;
  --accent-gradient: linear-gradient(135deg, #03a9f4 0%, #00bcd4 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.12);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.12);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.12);
}

[data-theme="sao-light"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme76-sao-aincrad-light.jpg') center/cover no-repeat;
  opacity: 0.12; pointer-events: none; z-index: -1;
}

[data-theme="sao-dark"] {
  --font-primary: 'Exo 2', sans-serif;
  --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #0a0515; --bg-surface: #100a20; --bg-elevated: #160f2b;
  --bg-hover: #1c1436; --bg-active: #221941; --bg-glass: rgba(0,0,0,0.85);
  --text-primary: #e1f5fe; --text-secondary: #b3e5fc;
  --text-tertiary: #81d4fa; --text-muted: #4fc3f7;
  --border: rgba(156,39,176,0.4); --border-subtle: rgba(156,39,176,0.2);
  --border-hover: rgba(156,39,176,0.7);
  --accent: #9c27b0; --accent-hover: #ab47bc;
  --accent-muted: #9c27b025; --accent-glow: #9c27b050;
  --accent-gradient: linear-gradient(135deg, #03a9f4 0%, #9c27b0 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.15);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="sao-dark"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme76-sao-link-dark.jpg') center/cover no-repeat;
  opacity: 0.3; pointer-events: none; z-index: -1;
}

[data-theme="sao-dark"] .btn-accent,
[data-theme="sao-dark"] .btn-primary { box-shadow: 0 0 20px var(--accent-glow); }

/* === term-ansible.css === */
/* THEME: Ansible Terminal */

[data-theme="term-ansible-light"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #fff0f0; --bg-surface: #fff0f0; --bg-elevated: #fff0f0;
  --bg-hover: #f0f0f0; --bg-active: #e8e8e8; --bg-glass: rgba(255,255,255,0.95);
  --text-primary: #1a1a1a; --text-secondary: #404040; --text-tertiary: #606060; --text-muted: #808080;
  --border: rgba(0,0,0,0.2); --border-subtle: rgba(0,0,0,0.1); --border-hover: rgba(0,0,0,0.3);
  --accent: #ee0000; --accent-hover: #ee0000; --accent-muted: #ee000020; --accent-glow: #ee000030;
  --accent-gradient: linear-gradient(135deg, #ee0000 0%, #ee0000 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.15);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="term-ansible-dark"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #1a1a1a; --bg-surface: #1a1a1a; --bg-elevated: #242424;
  --bg-hover: #2e2e2e; --bg-active: #383838; --bg-glass: rgba(0,0,0,0.9);
  --text-primary: #e0e0e0; --text-secondary: #b0b0b0; --text-tertiary: #808080; --text-muted: #606060;
  --border: rgba(255,255,255,0.15); --border-subtle: rgba(255,255,255,0.08); --border-hover: rgba(255,255,255,0.25);
  --accent: #ee0000; --accent-hover: #ee0000; --accent-muted: #ee000030; --accent-glow: #ee000050;
  --accent-gradient: linear-gradient(135deg, #ee0000 0%, #ee0000 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.2);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.2);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.2);
}

[data-theme="term-ansible-dark"] body::before {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 9999;
  background: repeating-linear-gradient(0deg, rgba(0,0,0,0.15) 0px, rgba(0,0,0,0.15) 1px, transparent 1px, transparent 2px);
}

/* === term-aws.css === */
/* THEME: AWS CLI Terminal */

[data-theme="term-aws-light"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #f8f8f8; --bg-surface: #f8f8f8; --bg-elevated: #f8f8f8;
  --bg-hover: #f0f0f0; --bg-active: #e8e8e8; --bg-glass: rgba(255,255,255,0.95);
  --text-primary: #1a1a1a; --text-secondary: #404040; --text-tertiary: #606060; --text-muted: #808080;
  --border: rgba(0,0,0,0.2); --border-subtle: rgba(0,0,0,0.1); --border-hover: rgba(0,0,0,0.3);
  --accent: #ff9900; --accent-hover: #ff9900; --accent-muted: #ff990020; --accent-glow: #ff990030;
  --accent-gradient: linear-gradient(135deg, #ff9900 0%, #ff9900 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.15);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="term-aws-dark"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #232f3e; --bg-surface: #1a1a1a; --bg-elevated: #242424;
  --bg-hover: #2e2e2e; --bg-active: #383838; --bg-glass: rgba(0,0,0,0.9);
  --text-primary: #e0e0e0; --text-secondary: #b0b0b0; --text-tertiary: #808080; --text-muted: #606060;
  --border: rgba(255,255,255,0.15); --border-subtle: rgba(255,255,255,0.08); --border-hover: rgba(255,255,255,0.25);
  --accent: #ff9900; --accent-hover: #ff9900; --accent-muted: #ff990030; --accent-glow: #ff990050;
  --accent-gradient: linear-gradient(135deg, #ff9900 0%, #ff9900 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.2);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.2);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.2);
}

[data-theme="term-aws-dark"] body::before {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 9999;
  background: repeating-linear-gradient(0deg, rgba(0,0,0,0.15) 0px, rgba(0,0,0,0.15) 1px, transparent 1px, transparent 2px);
}

/* === term-bash.css === */
/* THEME: Bash Terminal */

[data-theme="term-bash-light"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #ffffff; --bg-surface: #ffffff; --bg-elevated: #ffffff;
  --bg-hover: #f0f0f0; --bg-active: #e8e8e8; --bg-glass: rgba(255,255,255,0.95);
  --text-primary: #1a1a1a; --text-secondary: #404040; --text-tertiary: #606060; --text-muted: #808080;
  --border: rgba(0,0,0,0.2); --border-subtle: rgba(0,0,0,0.1); --border-hover: rgba(0,0,0,0.3);
  --accent: #4e9a06; --accent-hover: #4e9a06; --accent-muted: #4e9a0620; --accent-glow: #4e9a0630;
  --accent-gradient: linear-gradient(135deg, #4e9a06 0%, #4e9a06 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.15);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="term-bash-dark"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #0d0d0d; --bg-surface: #1a1a1a; --bg-elevated: #242424;
  --bg-hover: #2e2e2e; --bg-active: #383838; --bg-glass: rgba(0,0,0,0.9);
  --text-primary: #e0e0e0; --text-secondary: #b0b0b0; --text-tertiary: #808080; --text-muted: #606060;
  --border: rgba(255,255,255,0.15); --border-subtle: rgba(255,255,255,0.08); --border-hover: rgba(255,255,255,0.25);
  --accent: #4e9a06; --accent-hover: #4e9a06; --accent-muted: #4e9a0630; --accent-glow: #4e9a0650;
  --accent-gradient: linear-gradient(135deg, #4e9a06 0%, #4e9a06 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.2);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.2);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.2);
}

[data-theme="term-bash-dark"] body::before {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 9999;
  background: repeating-linear-gradient(0deg, rgba(0,0,0,0.15) 0px, rgba(0,0,0,0.15) 1px, transparent 1px, transparent 2px);
}

/* === term-dmesg.css === */
/* THEME: Kernel dmesg Terminal */

[data-theme="term-dmesg-light"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #f5f5ff; --bg-surface: #f5f5ff; --bg-elevated: #f5f5ff;
  --bg-hover: #f0f0f0; --bg-active: #e8e8e8; --bg-glass: rgba(255,255,255,0.95);
  --text-primary: #1a1a1a; --text-secondary: #404040; --text-tertiary: #606060; --text-muted: #808080;
  --border: rgba(0,0,0,0.2); --border-subtle: rgba(0,0,0,0.1); --border-hover: rgba(0,0,0,0.3);
  --accent: #6a5acd; --accent-hover: #6a5acd; --accent-muted: #6a5acd20; --accent-glow: #6a5acd30;
  --accent-gradient: linear-gradient(135deg, #6a5acd 0%, #6a5acd 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.15);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="term-dmesg-dark"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #0a0a1a; --bg-surface: #1a1a1a; --bg-elevated: #242424;
  --bg-hover: #2e2e2e; --bg-active: #383838; --bg-glass: rgba(0,0,0,0.9);
  --text-primary: #e0e0e0; --text-secondary: #b0b0b0; --text-tertiary: #808080; --text-muted: #606060;
  --border: rgba(255,255,255,0.15); --border-subtle: rgba(255,255,255,0.08); --border-hover: rgba(255,255,255,0.25);
  --accent: #6a5acd; --accent-hover: #6a5acd; --accent-muted: #6a5acd30; --accent-glow: #6a5acd50;
  --accent-gradient: linear-gradient(135deg, #6a5acd 0%, #6a5acd 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.2);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.2);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.2);
}

[data-theme="term-dmesg-dark"] body::before {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 9999;
  background: repeating-linear-gradient(0deg, rgba(0,0,0,0.15) 0px, rgba(0,0,0,0.15) 1px, transparent 1px, transparent 2px);
}

/* === term-docker.css === */
/* THEME: Docker Terminal */

[data-theme="term-docker-light"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #f6f8fa; --bg-surface: #f6f8fa; --bg-elevated: #f6f8fa;
  --bg-hover: #f0f0f0; --bg-active: #e8e8e8; --bg-glass: rgba(255,255,255,0.95);
  --text-primary: #1a1a1a; --text-secondary: #404040; --text-tertiary: #606060; --text-muted: #808080;
  --border: rgba(0,0,0,0.2); --border-subtle: rgba(0,0,0,0.1); --border-hover: rgba(0,0,0,0.3);
  --accent: #0db7ed; --accent-hover: #0db7ed; --accent-muted: #0db7ed20; --accent-glow: #0db7ed30;
  --accent-gradient: linear-gradient(135deg, #0db7ed 0%, #0db7ed 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.15);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="term-docker-dark"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #0d1117; --bg-surface: #1a1a1a; --bg-elevated: #242424;
  --bg-hover: #2e2e2e; --bg-active: #383838; --bg-glass: rgba(0,0,0,0.9);
  --text-primary: #e0e0e0; --text-secondary: #b0b0b0; --text-tertiary: #808080; --text-muted: #606060;
  --border: rgba(255,255,255,0.15); --border-subtle: rgba(255,255,255,0.08); --border-hover: rgba(255,255,255,0.25);
  --accent: #0db7ed; --accent-hover: #0db7ed; --accent-muted: #0db7ed30; --accent-glow: #0db7ed50;
  --accent-gradient: linear-gradient(135deg, #0db7ed 0%, #0db7ed 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.2);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.2);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.2);
}

[data-theme="term-docker-dark"] body::before {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 9999;
  background: repeating-linear-gradient(0deg, rgba(0,0,0,0.15) 0px, rgba(0,0,0,0.15) 1px, transparent 1px, transparent 2px);
}

/* === term-git.css === */
/* THEME: Git Terminal */

[data-theme="term-git-light"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #f6f8fa; --bg-surface: #f6f8fa; --bg-elevated: #f6f8fa;
  --bg-hover: #f0f0f0; --bg-active: #e8e8e8; --bg-glass: rgba(255,255,255,0.95);
  --text-primary: #1a1a1a; --text-secondary: #404040; --text-tertiary: #606060; --text-muted: #808080;
  --border: rgba(0,0,0,0.2); --border-subtle: rgba(0,0,0,0.1); --border-hover: rgba(0,0,0,0.3);
  --accent: #f05033; --accent-hover: #f05033; --accent-muted: #f0503320; --accent-glow: #f0503330;
  --accent-gradient: linear-gradient(135deg, #f05033 0%, #f05033 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.15);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="term-git-dark"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #0d1117; --bg-surface: #1a1a1a; --bg-elevated: #242424;
  --bg-hover: #2e2e2e; --bg-active: #383838; --bg-glass: rgba(0,0,0,0.9);
  --text-primary: #e0e0e0; --text-secondary: #b0b0b0; --text-tertiary: #808080; --text-muted: #606060;
  --border: rgba(255,255,255,0.15); --border-subtle: rgba(255,255,255,0.08); --border-hover: rgba(255,255,255,0.25);
  --accent: #f05033; --accent-hover: #f05033; --accent-muted: #f0503330; --accent-glow: #f0503350;
  --accent-gradient: linear-gradient(135deg, #f05033 0%, #f05033 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.2);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.2);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.2);
}

[data-theme="term-git-dark"] body::before {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 9999;
  background: repeating-linear-gradient(0deg, rgba(0,0,0,0.15) 0px, rgba(0,0,0,0.15) 1px, transparent 1px, transparent 2px);
}

/* === terminal.css === */
/* ============================================================
   THEME: TERMINAL
   Classic hacker aesthetic - green on black
   Fonts: JetBrains Mono (monospace throughout)
   Style: Sharp corners, scanline effect
   ============================================================ */

/* === DARK MODE === */
[data-theme="terminal-dark"] {
  --font-primary: 'JetBrains Mono', 'SF Mono', 'Fira Code', 'Consolas', monospace;
  --font-mono: 'JetBrains Mono', 'SF Mono', 'Fira Code', 'Consolas', monospace;
  
  --radius-sm: 0px;
  --radius-md: 0px;
  --radius-lg: 2px;
  --radius-xl: 2px;
  
  --bg-base: #000000;
  --bg-surface: #0a0a0a;
  --bg-elevated: #111111;
  --bg-hover: #171717;
  --bg-active: #1f1f1f;
  --bg-glass: rgba(0, 0, 0, 0.9);
  
  --text-primary: #e5e5e5;
  --text-secondary: #a3a3a3;
  --text-tertiary: #737373;
  --text-muted: #525252;
  
  --border: #1a1a1a;
  --border-subtle: #111111;
  --border-hover: #2a2a2a;
  
  --accent: #22c55e;
  --accent-hover: #4ade80;
  --accent-muted: rgba(34, 197, 94, 0.08);
  --accent-glow: rgba(34, 197, 94, 0.15);
  --accent-gradient: linear-gradient(135deg, #22c55e 0%, #16a34a 100%);
  
  --success: #22c55e;
  --success-muted: rgba(34, 197, 94, 0.12);
  --warning: #eab308;
  --warning-muted: rgba(234, 179, 8, 0.12);
  --danger: #ef4444;
  --danger-muted: rgba(239, 68, 68, 0.12);
}

/* === LIGHT MODE === */
[data-theme="terminal-light"] {
  --font-primary: 'JetBrains Mono', 'SF Mono', 'Fira Code', 'Consolas', monospace;
  --font-mono: 'JetBrains Mono', 'SF Mono', 'Fira Code', 'Consolas', monospace;
  
  --radius-sm: 0px;
  --radius-md: 0px;
  --radius-lg: 2px;
  --radius-xl: 2px;
  
  --bg-base: #ffffff;
  --bg-surface: #fafafa;
  --bg-elevated: #f5f5f5;
  --bg-hover: #f0f0f0;
  --bg-active: #e5e5e5;
  --bg-glass: rgba(255, 255, 255, 0.95);
  
  --text-primary: #0a0a0a;
  --text-secondary: #525252;
  --text-tertiary: #737373;
  --text-muted: #a3a3a3;
  
  --border: #e5e5e5;
  --border-subtle: #f0f0f0;
  --border-hover: #d4d4d4;
  
  --accent: #16a34a;
  --accent-hover: #22c55e;
  --accent-muted: rgba(22, 163, 74, 0.06);
  --accent-glow: rgba(22, 163, 74, 0.1);
  --accent-gradient: linear-gradient(135deg, #16a34a 0%, #15803d 100%);
  
  --success: #16a34a;
  --success-muted: rgba(22, 163, 74, 0.1);
  --warning: #ca8a04;
  --warning-muted: rgba(202, 138, 4, 0.1);
  --danger: #dc2626;
  --danger-muted: rgba(220, 38, 38, 0.1);
}

/* === THEME EFFECTS: Scanlines === */
[data-theme="terminal-dark"] body::after {
  content: '';
  position: fixed;
  inset: 0;
  background: repeating-linear-gradient(
    0deg,
    transparent,
    transparent 2px,
    rgba(0, 0, 0, 0.03) 2px,
    rgba(0, 0, 0, 0.03) 4px
  );
  pointer-events: none;
  z-index: 9999;
}

/* Green cursor for inputs */
[data-theme^="terminal"] input:focus,
[data-theme^="terminal"] textarea:focus {
  caret-color: var(--accent);
}

/* === term-jenkins.css === */
/* THEME: Jenkins Terminal */

[data-theme="term-jenkins-light"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #fff5f5; --bg-surface: #fff5f5; --bg-elevated: #fff5f5;
  --bg-hover: #f0f0f0; --bg-active: #e8e8e8; --bg-glass: rgba(255,255,255,0.95);
  --text-primary: #1a1a1a; --text-secondary: #404040; --text-tertiary: #606060; --text-muted: #808080;
  --border: rgba(0,0,0,0.2); --border-subtle: rgba(0,0,0,0.1); --border-hover: rgba(0,0,0,0.3);
  --accent: #d33833; --accent-hover: #d33833; --accent-muted: #d3383320; --accent-glow: #d3383330;
  --accent-gradient: linear-gradient(135deg, #d33833 0%, #d33833 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.15);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="term-jenkins-dark"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #1a0a0a; --bg-surface: #1a1a1a; --bg-elevated: #242424;
  --bg-hover: #2e2e2e; --bg-active: #383838; --bg-glass: rgba(0,0,0,0.9);
  --text-primary: #e0e0e0; --text-secondary: #b0b0b0; --text-tertiary: #808080; --text-muted: #606060;
  --border: rgba(255,255,255,0.15); --border-subtle: rgba(255,255,255,0.08); --border-hover: rgba(255,255,255,0.25);
  --accent: #d33833; --accent-hover: #d33833; --accent-muted: #d3383330; --accent-glow: #d3383350;
  --accent-gradient: linear-gradient(135deg, #d33833 0%, #d33833 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.2);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.2);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.2);
}

[data-theme="term-jenkins-dark"] body::before {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 9999;
  background: repeating-linear-gradient(0deg, rgba(0,0,0,0.15) 0px, rgba(0,0,0,0.15) 1px, transparent 1px, transparent 2px);
}

/* === term-journal.css === */
/* THEME: Systemd Journal Terminal */

[data-theme="term-journal-light"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #f8f8f8; --bg-surface: #f8f8f8; --bg-elevated: #f8f8f8;
  --bg-hover: #f0f0f0; --bg-active: #e8e8e8; --bg-glass: rgba(255,255,255,0.95);
  --text-primary: #1a1a1a; --text-secondary: #404040; --text-tertiary: #606060; --text-muted: #808080;
  --border: rgba(0,0,0,0.2); --border-subtle: rgba(0,0,0,0.1); --border-hover: rgba(0,0,0,0.3);
  --accent: #a0a0a0; --accent-hover: #a0a0a0; --accent-muted: #a0a0a020; --accent-glow: #a0a0a030;
  --accent-gradient: linear-gradient(135deg, #a0a0a0 0%, #a0a0a0 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.15);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="term-journal-dark"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #1c1c1c; --bg-surface: #1a1a1a; --bg-elevated: #242424;
  --bg-hover: #2e2e2e; --bg-active: #383838; --bg-glass: rgba(0,0,0,0.9);
  --text-primary: #e0e0e0; --text-secondary: #b0b0b0; --text-tertiary: #808080; --text-muted: #606060;
  --border: rgba(255,255,255,0.15); --border-subtle: rgba(255,255,255,0.08); --border-hover: rgba(255,255,255,0.25);
  --accent: #a0a0a0; --accent-hover: #a0a0a0; --accent-muted: #a0a0a030; --accent-glow: #a0a0a050;
  --accent-gradient: linear-gradient(135deg, #a0a0a0 0%, #a0a0a0 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.2);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.2);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.2);
}

[data-theme="term-journal-dark"] body::before {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 9999;
  background: repeating-linear-gradient(0deg, rgba(0,0,0,0.15) 0px, rgba(0,0,0,0.15) 1px, transparent 1px, transparent 2px);
}

/* === term-kubectl.css === */
/* THEME: Kubernetes Terminal */

[data-theme="term-kubectl-light"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #f0f5ff; --bg-surface: #f0f5ff; --bg-elevated: #f0f5ff;
  --bg-hover: #f0f0f0; --bg-active: #e8e8e8; --bg-glass: rgba(255,255,255,0.95);
  --text-primary: #1a1a1a; --text-secondary: #404040; --text-tertiary: #606060; --text-muted: #808080;
  --border: rgba(0,0,0,0.2); --border-subtle: rgba(0,0,0,0.1); --border-hover: rgba(0,0,0,0.3);
  --accent: #326ce5; --accent-hover: #326ce5; --accent-muted: #326ce520; --accent-glow: #326ce530;
  --accent-gradient: linear-gradient(135deg, #326ce5 0%, #326ce5 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.15);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="term-kubectl-dark"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #0a1525; --bg-surface: #1a1a1a; --bg-elevated: #242424;
  --bg-hover: #2e2e2e; --bg-active: #383838; --bg-glass: rgba(0,0,0,0.9);
  --text-primary: #e0e0e0; --text-secondary: #b0b0b0; --text-tertiary: #808080; --text-muted: #606060;
  --border: rgba(255,255,255,0.15); --border-subtle: rgba(255,255,255,0.08); --border-hover: rgba(255,255,255,0.25);
  --accent: #326ce5; --accent-hover: #326ce5; --accent-muted: #326ce530; --accent-glow: #326ce550;
  --accent-gradient: linear-gradient(135deg, #326ce5 0%, #326ce5 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.2);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.2);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.2);
}

[data-theme="term-kubectl-dark"] body::before {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 9999;
  background: repeating-linear-gradient(0deg, rgba(0,0,0,0.15) 0px, rgba(0,0,0,0.15) 1px, transparent 1px, transparent 2px);
}

/* === term-mongo.css === */
/* THEME: MongoDB Terminal */

[data-theme="term-mongo-light"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #f0fff0; --bg-surface: #f0fff0; --bg-elevated: #f0fff0;
  --bg-hover: #f0f0f0; --bg-active: #e8e8e8; --bg-glass: rgba(255,255,255,0.95);
  --text-primary: #1a1a1a; --text-secondary: #404040; --text-tertiary: #606060; --text-muted: #808080;
  --border: rgba(0,0,0,0.2); --border-subtle: rgba(0,0,0,0.1); --border-hover: rgba(0,0,0,0.3);
  --accent: #4db33d; --accent-hover: #4db33d; --accent-muted: #4db33d20; --accent-glow: #4db33d30;
  --accent-gradient: linear-gradient(135deg, #4db33d 0%, #4db33d 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.15);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="term-mongo-dark"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #0a1a0a; --bg-surface: #1a1a1a; --bg-elevated: #242424;
  --bg-hover: #2e2e2e; --bg-active: #383838; --bg-glass: rgba(0,0,0,0.9);
  --text-primary: #e0e0e0; --text-secondary: #b0b0b0; --text-tertiary: #808080; --text-muted: #606060;
  --border: rgba(255,255,255,0.15); --border-subtle: rgba(255,255,255,0.08); --border-hover: rgba(255,255,255,0.25);
  --accent: #4db33d; --accent-hover: #4db33d; --accent-muted: #4db33d30; --accent-glow: #4db33d50;
  --accent-gradient: linear-gradient(135deg, #4db33d 0%, #4db33d 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.2);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.2);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.2);
}

[data-theme="term-mongo-dark"] body::before {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 9999;
  background: repeating-linear-gradient(0deg, rgba(0,0,0,0.15) 0px, rgba(0,0,0,0.15) 1px, transparent 1px, transparent 2px);
}

/* === term-netstat.css === */
/* THEME: Network Status Terminal */

[data-theme="term-netstat-light"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #f0ffff; --bg-surface: #f0ffff; --bg-elevated: #f0ffff;
  --bg-hover: #f0f0f0; --bg-active: #e8e8e8; --bg-glass: rgba(255,255,255,0.95);
  --text-primary: #1a1a1a; --text-secondary: #404040; --text-tertiary: #606060; --text-muted: #808080;
  --border: rgba(0,0,0,0.2); --border-subtle: rgba(0,0,0,0.1); --border-hover: rgba(0,0,0,0.3);
  --accent: #00ced1; --accent-hover: #00ced1; --accent-muted: #00ced120; --accent-glow: #00ced130;
  --accent-gradient: linear-gradient(135deg, #00ced1 0%, #00ced1 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.15);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="term-netstat-dark"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #0a1a1a; --bg-surface: #1a1a1a; --bg-elevated: #242424;
  --bg-hover: #2e2e2e; --bg-active: #383838; --bg-glass: rgba(0,0,0,0.9);
  --text-primary: #e0e0e0; --text-secondary: #b0b0b0; --text-tertiary: #808080; --text-muted: #606060;
  --border: rgba(255,255,255,0.15); --border-subtle: rgba(255,255,255,0.08); --border-hover: rgba(255,255,255,0.25);
  --accent: #00ced1; --accent-hover: #00ced1; --accent-muted: #00ced130; --accent-glow: #00ced150;
  --accent-gradient: linear-gradient(135deg, #00ced1 0%, #00ced1 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.2);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.2);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.2);
}

[data-theme="term-netstat-dark"] body::before {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 9999;
  background: repeating-linear-gradient(0deg, rgba(0,0,0,0.15) 0px, rgba(0,0,0,0.15) 1px, transparent 1px, transparent 2px);
}

/* === term-nginx.css === */
/* THEME: Nginx Terminal */

[data-theme="term-nginx-light"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #f0fff0; --bg-surface: #f0fff0; --bg-elevated: #f0fff0;
  --bg-hover: #f0f0f0; --bg-active: #e8e8e8; --bg-glass: rgba(255,255,255,0.95);
  --text-primary: #1a1a1a; --text-secondary: #404040; --text-tertiary: #606060; --text-muted: #808080;
  --border: rgba(0,0,0,0.2); --border-subtle: rgba(0,0,0,0.1); --border-hover: rgba(0,0,0,0.3);
  --accent: #009639; --accent-hover: #009639; --accent-muted: #00963920; --accent-glow: #00963930;
  --accent-gradient: linear-gradient(135deg, #009639 0%, #009639 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.15);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="term-nginx-dark"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #0a1a0a; --bg-surface: #1a1a1a; --bg-elevated: #242424;
  --bg-hover: #2e2e2e; --bg-active: #383838; --bg-glass: rgba(0,0,0,0.9);
  --text-primary: #e0e0e0; --text-secondary: #b0b0b0; --text-tertiary: #808080; --text-muted: #606060;
  --border: rgba(255,255,255,0.15); --border-subtle: rgba(255,255,255,0.08); --border-hover: rgba(255,255,255,0.25);
  --accent: #009639; --accent-hover: #009639; --accent-muted: #00963930; --accent-glow: #00963950;
  --accent-gradient: linear-gradient(135deg, #009639 0%, #009639 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.2);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.2);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.2);
}

[data-theme="term-nginx-dark"] body::before {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 9999;
  background: repeating-linear-gradient(0deg, rgba(0,0,0,0.15) 0px, rgba(0,0,0,0.15) 1px, transparent 1px, transparent 2px);
}

/* === term-node.css === */
/* THEME: Node.js Terminal */

[data-theme="term-node-light"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #f7f7f7; --bg-surface: #f7f7f7; --bg-elevated: #f7f7f7;
  --bg-hover: #f0f0f0; --bg-active: #e8e8e8; --bg-glass: rgba(255,255,255,0.95);
  --text-primary: #1a1a1a; --text-secondary: #404040; --text-tertiary: #606060; --text-muted: #808080;
  --border: rgba(0,0,0,0.2); --border-subtle: rgba(0,0,0,0.1); --border-hover: rgba(0,0,0,0.3);
  --accent: #68a063; --accent-hover: #68a063; --accent-muted: #68a06320; --accent-glow: #68a06330;
  --accent-gradient: linear-gradient(135deg, #68a063 0%, #68a063 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.15);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="term-node-dark"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #0d0d0d; --bg-surface: #1a1a1a; --bg-elevated: #242424;
  --bg-hover: #2e2e2e; --bg-active: #383838; --bg-glass: rgba(0,0,0,0.9);
  --text-primary: #e0e0e0; --text-secondary: #b0b0b0; --text-tertiary: #808080; --text-muted: #606060;
  --border: rgba(255,255,255,0.15); --border-subtle: rgba(255,255,255,0.08); --border-hover: rgba(255,255,255,0.25);
  --accent: #68a063; --accent-hover: #68a063; --accent-muted: #68a06330; --accent-glow: #68a06350;
  --accent-gradient: linear-gradient(135deg, #68a063 0%, #68a063 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.2);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.2);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.2);
}

[data-theme="term-node-dark"] body::before {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 9999;
  background: repeating-linear-gradient(0deg, rgba(0,0,0,0.15) 0px, rgba(0,0,0,0.15) 1px, transparent 1px, transparent 2px);
}

/* === term-powershell.css === */
/* THEME: PowerShell Terminal */

[data-theme="term-powershell-light"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #eeedf0; --bg-surface: #eeedf0; --bg-elevated: #eeedf0;
  --bg-hover: #f0f0f0; --bg-active: #e8e8e8; --bg-glass: rgba(255,255,255,0.95);
  --text-primary: #1a1a1a; --text-secondary: #404040; --text-tertiary: #606060; --text-muted: #808080;
  --border: rgba(0,0,0,0.2); --border-subtle: rgba(0,0,0,0.1); --border-hover: rgba(0,0,0,0.3);
  --accent: #012456; --accent-hover: #012456; --accent-muted: #01245620; --accent-glow: #01245630;
  --accent-gradient: linear-gradient(135deg, #012456 0%, #012456 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.15);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="term-powershell-dark"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #012456; --bg-surface: #1a1a1a; --bg-elevated: #242424;
  --bg-hover: #2e2e2e; --bg-active: #383838; --bg-glass: rgba(0,0,0,0.9);
  --text-primary: #e0e0e0; --text-secondary: #b0b0b0; --text-tertiary: #808080; --text-muted: #606060;
  --border: rgba(255,255,255,0.15); --border-subtle: rgba(255,255,255,0.08); --border-hover: rgba(255,255,255,0.25);
  --accent: #012456; --accent-hover: #012456; --accent-muted: #01245630; --accent-glow: #01245650;
  --accent-gradient: linear-gradient(135deg, #012456 0%, #012456 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.2);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.2);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.2);
}

[data-theme="term-powershell-dark"] body::before {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 9999;
  background: repeating-linear-gradient(0deg, rgba(0,0,0,0.15) 0px, rgba(0,0,0,0.15) 1px, transparent 1px, transparent 2px);
}

/* === term-python.css === */
/* THEME: Python Terminal */

[data-theme="term-python-light"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #fafbfc; --bg-surface: #fafbfc; --bg-elevated: #fafbfc;
  --bg-hover: #f0f0f0; --bg-active: #e8e8e8; --bg-glass: rgba(255,255,255,0.95);
  --text-primary: #1a1a1a; --text-secondary: #404040; --text-tertiary: #606060; --text-muted: #808080;
  --border: rgba(0,0,0,0.2); --border-subtle: rgba(0,0,0,0.1); --border-hover: rgba(0,0,0,0.3);
  --accent: #ffd43b; --accent-hover: #ffd43b; --accent-muted: #ffd43b20; --accent-glow: #ffd43b30;
  --accent-gradient: linear-gradient(135deg, #ffd43b 0%, #ffd43b 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.15);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="term-python-dark"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #1e1e1e; --bg-surface: #1a1a1a; --bg-elevated: #242424;
  --bg-hover: #2e2e2e; --bg-active: #383838; --bg-glass: rgba(0,0,0,0.9);
  --text-primary: #e0e0e0; --text-secondary: #b0b0b0; --text-tertiary: #808080; --text-muted: #606060;
  --border: rgba(255,255,255,0.15); --border-subtle: rgba(255,255,255,0.08); --border-hover: rgba(255,255,255,0.25);
  --accent: #ffd43b; --accent-hover: #ffd43b; --accent-muted: #ffd43b30; --accent-glow: #ffd43b50;
  --accent-gradient: linear-gradient(135deg, #ffd43b 0%, #ffd43b 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.2);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.2);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.2);
}

[data-theme="term-python-dark"] body::before {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 9999;
  background: repeating-linear-gradient(0deg, rgba(0,0,0,0.15) 0px, rgba(0,0,0,0.15) 1px, transparent 1px, transparent 2px);
}

/* === term-redis.css === */
/* THEME: Redis Terminal */

[data-theme="term-redis-light"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #fff5f5; --bg-surface: #fff5f5; --bg-elevated: #fff5f5;
  --bg-hover: #f0f0f0; --bg-active: #e8e8e8; --bg-glass: rgba(255,255,255,0.95);
  --text-primary: #1a1a1a; --text-secondary: #404040; --text-tertiary: #606060; --text-muted: #808080;
  --border: rgba(0,0,0,0.2); --border-subtle: rgba(0,0,0,0.1); --border-hover: rgba(0,0,0,0.3);
  --accent: #dc382d; --accent-hover: #dc382d; --accent-muted: #dc382d20; --accent-glow: #dc382d30;
  --accent-gradient: linear-gradient(135deg, #dc382d 0%, #dc382d 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.15);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="term-redis-dark"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #1a0a0a; --bg-surface: #1a1a1a; --bg-elevated: #242424;
  --bg-hover: #2e2e2e; --bg-active: #383838; --bg-glass: rgba(0,0,0,0.9);
  --text-primary: #e0e0e0; --text-secondary: #b0b0b0; --text-tertiary: #808080; --text-muted: #606060;
  --border: rgba(255,255,255,0.15); --border-subtle: rgba(255,255,255,0.08); --border-hover: rgba(255,255,255,0.25);
  --accent: #dc382d; --accent-hover: #dc382d; --accent-muted: #dc382d30; --accent-glow: #dc382d50;
  --accent-gradient: linear-gradient(135deg, #dc382d 0%, #dc382d 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.2);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.2);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.2);
}

[data-theme="term-redis-dark"] body::before {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 9999;
  background: repeating-linear-gradient(0deg, rgba(0,0,0,0.15) 0px, rgba(0,0,0,0.15) 1px, transparent 1px, transparent 2px);
}

/* === term-sql.css === */
/* THEME: SQL Terminal */

[data-theme="term-sql-light"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #f8f8f8; --bg-surface: #f8f8f8; --bg-elevated: #f8f8f8;
  --bg-hover: #f0f0f0; --bg-active: #e8e8e8; --bg-glass: rgba(255,255,255,0.95);
  --text-primary: #1a1a1a; --text-secondary: #404040; --text-tertiary: #606060; --text-muted: #808080;
  --border: rgba(0,0,0,0.2); --border-subtle: rgba(0,0,0,0.1); --border-hover: rgba(0,0,0,0.3);
  --accent: #336791; --accent-hover: #336791; --accent-muted: #33679120; --accent-glow: #33679130;
  --accent-gradient: linear-gradient(135deg, #336791 0%, #336791 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.15);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="term-sql-dark"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #1e1e2e; --bg-surface: #1a1a1a; --bg-elevated: #242424;
  --bg-hover: #2e2e2e; --bg-active: #383838; --bg-glass: rgba(0,0,0,0.9);
  --text-primary: #e0e0e0; --text-secondary: #b0b0b0; --text-tertiary: #808080; --text-muted: #606060;
  --border: rgba(255,255,255,0.15); --border-subtle: rgba(255,255,255,0.08); --border-hover: rgba(255,255,255,0.25);
  --accent: #336791; --accent-hover: #336791; --accent-muted: #33679130; --accent-glow: #33679150;
  --accent-gradient: linear-gradient(135deg, #336791 0%, #336791 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.2);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.2);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.2);
}

[data-theme="term-sql-dark"] body::before {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 9999;
  background: repeating-linear-gradient(0deg, rgba(0,0,0,0.15) 0px, rgba(0,0,0,0.15) 1px, transparent 1px, transparent 2px);
}

/* === term-terraform.css === */
/* THEME: Terraform Terminal */

[data-theme="term-terraform-light"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #faf0ff; --bg-surface: #faf0ff; --bg-elevated: #faf0ff;
  --bg-hover: #f0f0f0; --bg-active: #e8e8e8; --bg-glass: rgba(255,255,255,0.95);
  --text-primary: #1a1a1a; --text-secondary: #404040; --text-tertiary: #606060; --text-muted: #808080;
  --border: rgba(0,0,0,0.2); --border-subtle: rgba(0,0,0,0.1); --border-hover: rgba(0,0,0,0.3);
  --accent: #7b42bc; --accent-hover: #7b42bc; --accent-muted: #7b42bc20; --accent-glow: #7b42bc30;
  --accent-gradient: linear-gradient(135deg, #7b42bc 0%, #7b42bc 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.15);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="term-terraform-dark"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #1a0a2a; --bg-surface: #1a1a1a; --bg-elevated: #242424;
  --bg-hover: #2e2e2e; --bg-active: #383838; --bg-glass: rgba(0,0,0,0.9);
  --text-primary: #e0e0e0; --text-secondary: #b0b0b0; --text-tertiary: #808080; --text-muted: #606060;
  --border: rgba(255,255,255,0.15); --border-subtle: rgba(255,255,255,0.08); --border-hover: rgba(255,255,255,0.25);
  --accent: #7b42bc; --accent-hover: #7b42bc; --accent-muted: #7b42bc30; --accent-glow: #7b42bc50;
  --accent-gradient: linear-gradient(135deg, #7b42bc 0%, #7b42bc 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.2);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.2);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.2);
}

[data-theme="term-terraform-dark"] body::before {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 9999;
  background: repeating-linear-gradient(0deg, rgba(0,0,0,0.15) 0px, rgba(0,0,0,0.15) 1px, transparent 1px, transparent 2px);
}

/* === term-vim.css === */
/* THEME: Vim Terminal */

[data-theme="term-vim-light"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #fbf1c7; --bg-surface: #fbf1c7; --bg-elevated: #fbf1c7;
  --bg-hover: #f0f0f0; --bg-active: #e8e8e8; --bg-glass: rgba(255,255,255,0.95);
  --text-primary: #1a1a1a; --text-secondary: #404040; --text-tertiary: #606060; --text-muted: #808080;
  --border: rgba(0,0,0,0.2); --border-subtle: rgba(0,0,0,0.1); --border-hover: rgba(0,0,0,0.3);
  --accent: #87d787; --accent-hover: #87d787; --accent-muted: #87d78720; --accent-glow: #87d78730;
  --accent-gradient: linear-gradient(135deg, #87d787 0%, #87d787 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.15);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="term-vim-dark"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #1c1c1c; --bg-surface: #1a1a1a; --bg-elevated: #242424;
  --bg-hover: #2e2e2e; --bg-active: #383838; --bg-glass: rgba(0,0,0,0.9);
  --text-primary: #e0e0e0; --text-secondary: #b0b0b0; --text-tertiary: #808080; --text-muted: #606060;
  --border: rgba(255,255,255,0.15); --border-subtle: rgba(255,255,255,0.08); --border-hover: rgba(255,255,255,0.25);
  --accent: #87d787; --accent-hover: #87d787; --accent-muted: #87d78730; --accent-glow: #87d78750;
  --accent-gradient: linear-gradient(135deg, #87d787 0%, #87d787 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.2);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.2);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.2);
}

[data-theme="term-vim-dark"] body::before {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 9999;
  background: repeating-linear-gradient(0deg, rgba(0,0,0,0.15) 0px, rgba(0,0,0,0.15) 1px, transparent 1px, transparent 2px);
}

/* === term-zsh.css === */
/* THEME: ZSH Terminal */

[data-theme="term-zsh-light"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #fdf6e3; --bg-surface: #fdf6e3; --bg-elevated: #fdf6e3;
  --bg-hover: #f0f0f0; --bg-active: #e8e8e8; --bg-glass: rgba(255,255,255,0.95);
  --text-primary: #1a1a1a; --text-secondary: #404040; --text-tertiary: #606060; --text-muted: #808080;
  --border: rgba(0,0,0,0.2); --border-subtle: rgba(0,0,0,0.1); --border-hover: rgba(0,0,0,0.3);
  --accent: #2aa198; --accent-hover: #2aa198; --accent-muted: #2aa19820; --accent-glow: #2aa19830;
  --accent-gradient: linear-gradient(135deg, #2aa198 0%, #2aa198 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.15);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="term-zsh-dark"] {
  --font-primary: 'JetBrains Mono', monospace; --font-mono: 'JetBrains Mono', monospace;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 4px; --radius-xl: 4px;
  --bg-base: #002b36; --bg-surface: #1a1a1a; --bg-elevated: #242424;
  --bg-hover: #2e2e2e; --bg-active: #383838; --bg-glass: rgba(0,0,0,0.9);
  --text-primary: #e0e0e0; --text-secondary: #b0b0b0; --text-tertiary: #808080; --text-muted: #606060;
  --border: rgba(255,255,255,0.15); --border-subtle: rgba(255,255,255,0.08); --border-hover: rgba(255,255,255,0.25);
  --accent: #2aa198; --accent-hover: #2aa198; --accent-muted: #2aa19830; --accent-glow: #2aa19850;
  --accent-gradient: linear-gradient(135deg, #2aa198 0%, #2aa198 100%);
  --success: #22c55e; --success-muted: rgba(34,197,94,0.2);
  --warning: #eab308; --warning-muted: rgba(234,179,8,0.2);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.2);
}

[data-theme="term-zsh-dark"] body::before {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 9999;
  background: repeating-linear-gradient(0deg, rgba(0,0,0,0.15) 0px, rgba(0,0,0,0.15) 1px, transparent 1px, transparent 2px);
}

/* === tokyo-ghoul.css === */
/* ============================================================
   THEME: Tokyo Ghoul
   ============================================================ */

[data-theme="tokyo-ghoul-light"] {
  --font-primary: 'Playfair Display', serif;
  --font-mono: 'Space Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #fafafa; --bg-surface: #f5f5f5; --bg-elevated: #eeeeee;
  --bg-hover: #e0e0e0; --bg-active: #bdbdbd; --bg-glass: rgba(255,255,255,0.9);
  --text-primary: #212121; --text-secondary: #424242;
  --text-tertiary: #616161; --text-muted: #757575;
  --border: rgba(97,97,97,0.3); --border-subtle: rgba(97,97,97,0.15);
  --border-hover: rgba(97,97,97,0.5);
  --accent: #616161; --accent-hover: #757575;
  --accent-muted: #61616120; --accent-glow: #61616140;
  --accent-gradient: linear-gradient(135deg, #9e9e9e 0%, #616161 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.12);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.12);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.12);
}

[data-theme="tokyo-ghoul-light"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme86-tg-coffee-light.jpg') center/cover no-repeat;
  opacity: 0.1; pointer-events: none; z-index: -1;
}

[data-theme="tokyo-ghoul-dark"] {
  --font-primary: 'Playfair Display', serif;
  --font-mono: 'Space Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #0a0505; --bg-surface: #140a0a; --bg-elevated: #1e0f0f;
  --bg-hover: #281414; --bg-active: #321919; --bg-glass: rgba(0,0,0,0.85);
  --text-primary: #fafafa; --text-secondary: #f5f5f5;
  --text-tertiary: #eeeeee; --text-muted: #e0e0e0;
  --border: rgba(244,67,54,0.6); --border-subtle: rgba(244,67,54,0.3);
  --border-hover: rgba(244,67,54,0.6);
  --accent: #f44336; --accent-hover: #ef5350;
  --accent-muted: #f4433625; --accent-glow: #f4433650;
  --accent-gradient: linear-gradient(135deg, #9e9e9e 0%, #f44336 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.15);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="tokyo-ghoul-dark"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme86-tg-reaper-dark.jpg') center/cover no-repeat;
  opacity: 0.4; pointer-events: none; z-index: -1;
}

[data-theme="tokyo-ghoul-dark"] .btn-accent,
[data-theme="tokyo-ghoul-dark"] .btn-primary { box-shadow: 0 0 20px var(--accent-glow); }

/* === vaporwave.css === */
/* ============================================================
   THEME: VAPORWAVE
   Retro 80s aesthetic with neon pastels and grid
   Fonts: VT323 (retro) + Audiowide (headings)
   Style: Pink/purple/cyan gradient, grid pattern, nostalgic
   ============================================================ */

/* === DARK MODE (Default - Night Aesthetic) === */
[data-theme="vaporwave-dark"] {
  --font-primary: 'VT323', 'Courier New', monospace;
  --font-mono: 'Audiowide', 'VT323', monospace;
  
  --radius-sm: 0px;
  --radius-md: 4px;
  --radius-lg: 8px;
  --radius-xl: 12px;
  
  --bg-base: #0d0221;
  --bg-surface: rgba(20, 10, 50, 0.9);
  --bg-elevated: rgba(30, 15, 70, 0.95);
  --bg-hover: rgba(45, 25, 100, 0.98);
  --bg-active: #3d2080;
  --bg-glass: rgba(20, 10, 50, 0.85);
  
  --text-primary: #ff71ce;
  --text-secondary: #b967ff;
  --text-tertiary: #01cdfe;
  --text-muted: #6a4a8a;
  
  --border: rgba(255, 113, 206, 0.25);
  --border-subtle: rgba(185, 103, 255, 0.15);
  --border-hover: rgba(255, 113, 206, 0.4);
  
  --accent: #ff71ce;
  --accent-hover: #ff99e0;
  --accent-muted: rgba(255, 113, 206, 0.15);
  --accent-glow: rgba(255, 113, 206, 0.4);
  --accent-gradient: linear-gradient(135deg, #ff71ce 0%, #b967ff 50%, #01cdfe 100%);
  
  --success: #05ffa1;
  --success-muted: rgba(5, 255, 161, 0.15);
  --warning: #fffb96;
  --warning-muted: rgba(255, 251, 150, 0.15);
  --danger: #ff3860;
  --danger-muted: rgba(255, 56, 96, 0.15);
}

/* === LIGHT MODE (Pastel Daydream) === */
[data-theme="vaporwave-light"] {
  --font-primary: 'VT323', 'Courier New', monospace;
  --font-mono: 'Audiowide', 'VT323', monospace;
  
  --radius-sm: 0px;
  --radius-md: 4px;
  --radius-lg: 8px;
  --radius-xl: 12px;
  
  --bg-base: #ffe0f0;
  --bg-surface: rgba(255, 240, 250, 0.9);
  --bg-elevated: rgba(255, 245, 252, 0.95);
  --bg-hover: rgba(255, 235, 248, 0.98);
  --bg-active: #ffd0e8;
  --bg-glass: rgba(255, 240, 250, 0.85);
  
  --text-primary: #c04090;
  --text-secondary: #8040c0;
  --text-tertiary: #2090c0;
  --text-muted: #c0a0c0;
  
  --border: rgba(200, 100, 160, 0.25);
  --border-subtle: rgba(160, 100, 200, 0.15);
  --border-hover: rgba(200, 100, 160, 0.35);
  
  --accent: #e050a0;
  --accent-hover: #f070c0;
  --accent-muted: rgba(224, 80, 160, 0.12);
  --accent-glow: rgba(224, 80, 160, 0.25);
  --accent-gradient: linear-gradient(135deg, #e050a0 0%, #a050d0 50%, #40a0d0 100%);
  
  --success: #20c080;
  --success-muted: rgba(32, 192, 128, 0.12);
  --warning: #d0c040;
  --warning-muted: rgba(208, 192, 64, 0.12);
  --danger: #d04060;
  --danger-muted: rgba(208, 64, 96, 0.12);
}

/* === THEME EFFECTS: Retro grid + sunset === */
[data-theme="vaporwave-dark"] body::before {
  content: '';
  position: fixed;
  inset: 0;
  background: url('/static/images/themes/vaporwave_bg.jpg') center/cover no-repeat fixed;
  opacity: 0.3;
  pointer-events: none;
  z-index: 0;
}

[data-theme="vaporwave-dark"] body::after {
  content: '';
  position: fixed;
  inset: 0;
  background: 
    linear-gradient(transparent 50%, rgba(255, 113, 206, 0.02) 50%),
    linear-gradient(90deg, rgba(1, 205, 254, 0.01), rgba(185, 103, 255, 0.01), rgba(255, 113, 206, 0.01));
  background-size: 100% 4px, 100% 100%;
  pointer-events: none;
  z-index: 1;
}

[data-theme="vaporwave-light"] body::before {
  content: '';
  position: fixed;
  inset: 0;
  background: 
    radial-gradient(ellipse at 50% 0%, rgba(255, 113, 206, 0.15) 0%, transparent 60%),
    radial-gradient(ellipse at 0% 100%, rgba(1, 205, 254, 0.1) 0%, transparent 50%),
    radial-gradient(ellipse at 100% 100%, rgba(185, 103, 255, 0.1) 0%, transparent 50%);
  pointer-events: none;
  z-index: 0;
}

/* Retro text effects */
[data-theme^="vaporwave"] .brand {
  text-transform: uppercase;
  letter-spacing: 0.15em;
}

[data-theme^="vaporwave"] .bento-value,
[data-theme^="vaporwave"] .price-main {
  text-shadow: 2px 2px 0 var(--accent-muted);
}

/* Chrome/metallic effect on buttons */
[data-theme^="vaporwave"] .btn-accent,
[data-theme^="vaporwave"] .btn-primary {
  background: var(--accent-gradient);
  box-shadow: 
    0 4px 0 rgba(0, 0, 0, 0.3),
    0 8px 20px var(--accent-glow);
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

[data-theme^="vaporwave"] .btn-accent:hover,
[data-theme^="vaporwave"] .btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 
    0 6px 0 rgba(0, 0, 0, 0.3),
    0 12px 30px var(--accent-glow);
}

/* Larger font size for VT323 readability */
[data-theme^="vaporwave"] {
  font-size: 18px;
}

[data-theme^="vaporwave"] .nav-link,
[data-theme^="vaporwave"] .btn {
  font-size: 1rem;
  letter-spacing: 0.05em;
}

/* === your-name.css === */
/* ============================================================
   THEME: Your Name
   ============================================================ */

[data-theme="your-name-light"] {
  --font-primary: 'Noto Serif JP', serif;
  --font-mono: 'Space Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #e8eaf6; --bg-surface: #c5cae9; --bg-elevated: #9fa8da;
  --bg-hover: #7986cb; --bg-active: #5c6bc0; --bg-glass: rgba(255,255,255,0.9);
  --text-primary: #1a237e; --text-secondary: #283593;
  --text-tertiary: #303f9f; --text-muted: #3949ab;
  --border: rgba(63,81,181,0.3); --border-subtle: rgba(63,81,181,0.15);
  --border-hover: rgba(63,81,181,0.5);
  --accent: #3f51b5; --accent-hover: #5c6bc0;
  --accent-muted: #3f51b520; --accent-glow: #3f51b540;
  --accent-gradient: linear-gradient(135deg, #7986cb 0%, #ff8a65 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.12);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.12);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.12);
}

[data-theme="your-name-light"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme78-yourname-day-light.jpg') center/cover no-repeat;
  opacity: 0.15; pointer-events: none; z-index: -1;
}

[data-theme="your-name-dark"] {
  --font-primary: 'Noto Serif JP', serif;
  --font-mono: 'Space Mono', monospace;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --bg-base: #0a0a1e; --bg-surface: #0f0f28; --bg-elevated: #141432;
  --bg-hover: #19193c; --bg-active: #1e1e46; --bg-glass: rgba(0,0,0,0.85);
  --text-primary: #c5cae9; --text-secondary: #9fa8da;
  --text-tertiary: #7986cb; --text-muted: #5c6bc0;
  --border: rgba(255,138,101,0.4); --border-subtle: rgba(255,138,101,0.2);
  --border-hover: rgba(255,138,101,0.7);
  --accent: #ff8a65; --accent-hover: #ffab91;
  --accent-muted: #ff8a6525; --accent-glow: #ff8a6550;
  --accent-gradient: linear-gradient(135deg, #3f51b5 0%, #ff5722 100%);
  --success: #10b981; --success-muted: rgba(16,185,129,0.15);
  --warning: #f59e0b; --warning-muted: rgba(245,158,11,0.15);
  --danger: #ef4444; --danger-muted: rgba(239,68,68,0.15);
}

[data-theme="your-name-dark"] body::before {
  content: ''; position: fixed; inset: 0;
  background: url('/static/images/themes/theme78-yourname-twilight-dark.jpg') center/cover no-repeat;
  opacity: 0.35; pointer-events: none; z-index: -1;
}

[data-theme="your-name-dark"] .btn-accent,
[data-theme="your-name-dark"] .btn-primary { box-shadow: 0 0 20px var(--accent-glow); }