/* ============================================================
   THEME: CYBERPUNK — deep violet ink, STRONG YELLOW accent,
   neon magenta as the secondary signal. Yellow on near-black
   violet reads loud and electric — Joker / blade-runner streets.
   ============================================================ */
[data-theme="cyberpunk"] {
  color-scheme: dark;

  --bg-0:     #06010f;
  --bg-1:     #0a0420;
  --bg-2:     #100829;
  --bg-3:     #170d3a;
  --bg-inset: #02000a;
  --bg-sheen: rgba(255,224,0,0.05);

  --fg-1: #f5ecff;
  --fg-2: #b0a0e0;
  --fg-3: #8371b3;
  --fg-4: #4a3d70;
  --fg-on-brand: #1a0033;

  --line-1:     rgba(255,224,0,0.08);
  --line-2:     rgba(255,224,0,0.16);
  --line-3:     rgba(255,224,0,0.28);
  --line-focus: #ffe000;

  --accent:       #ffe000;
  --accent-hover: #fff04d;
  --accent-press: #d6ba00;
  --accent-soft:  rgba(255,224,0,0.18);
  --accent-ring:  rgba(255,224,0,0.55);

  --hot:        #ff00aa;
  --hot-soft:   rgba(255,0,170,0.20);
  --info:       #00fff7;
  --info-soft:  rgba(0,255,247,0.14);
  /* Distinct amber from the pure-yellow --accent (#ffe000) so the XP value and a
     difficulty-1 chip don't render as the same yellow side by side (U99). */
  --xp:         #ffc400;
  --xp-soft:    rgba(255,196,0,0.20);
  --warn:       #ff9100;
  --warn-soft:  rgba(255,145,0,0.18);
  --danger:     #ff0044;
  --danger-soft: rgba(255,0,68,0.18);
  --boss:       #bb00ff;
  --boss-soft:  rgba(187,0,255,0.18);

  --logoPrimary:   #ffe000;
  --logoSecondary: #ff00aa;

  --glow-lime:    0 0 0 1px rgba(255,224,0,0.50), 0 0 30px -2px rgba(255,224,0,0.75);
  --glow-magenta: 0 0 0 1px rgba(255,0,170,0.45), 0 0 30px -2px rgba(255,0,170,0.70);
  --glow-cyan:    0 0 0 1px rgba(0,255,247,0.45), 0 0 30px -2px rgba(0,255,247,0.70);
  --glow-gold:    0 0 0 1px rgba(255,224,0,0.50), 0 0 30px -2px rgba(255,224,0,0.75);

  --shadow-xs: 0 1px 0 rgba(0,0,0,0.5);
  --shadow-sm: 0 0 0 1px rgba(255,224,0,0.12), 0 1px 0 rgba(255,255,255,0.06) inset;
  --shadow-md: 0 0 0 1px rgba(255,224,0,0.16), 0 12px 28px -8px rgba(0,0,0,0.85);
  --shadow-lg: 0 0 0 1px rgba(255,224,0,0.20), 0 24px 56px -16px rgba(0,0,0,0.92);
  --shadow-pop: 0 0 0 1px rgba(255,224,0,0.32), 0 26px 56px -16px rgba(255,0,170,0.30);

  --grid-color: rgba(255,224,0,0.06);
  --grid-size:  28px;

  --grad-brand: linear-gradient(135deg, #ffe000 0%, #ff00aa 100%);
  --grad-hot:   linear-gradient(135deg, #ff00aa 0%, #bb00ff 100%);
  --grad-hud:   linear-gradient(135deg, #ffe000 0%, #00fff7 100%);
  --grad-xp:    linear-gradient(90deg,  #ffe000 0%, #ff00aa 100%);
}