/* NEON VOID — Color tokens
 * "Techno-Cosmic Pulse": Vantablack-tiered neutrals + hyper-saturated neon accents.
 * Base values first, then semantic aliases consumers should reach for.
 */
:root {
  /* ---- Neutrals: tiered near-blacks (the "void") ---- */
  --void-900: #050505;   /* deepest — page void / hero base */
  --void-850: #0e0e0f;   /* container lowest */
  --void-800: #131314;   /* surface / background (canonical page bg) */
  --void-750: #1c1b1c;   /* container low */
  --void-700: #201f20;   /* container */
  --void-650: #2a2a2b;   /* container high */
  --void-600: #353436;   /* container highest / surface variant */
  --void-500: #3a393a;   /* surface bright */

  /* ---- Neon accents ---- */
  --neon-green: #c3f400;        /* PRIMARY — lime/chartreuse, CTAs + live states */
  --neon-green-dim: #abd600;    /* pressed / surface tint */
  --neon-green-deep: #556d00;   /* on-primary-container text */
  --neon-green-ink: #283500;    /* text ON neon green fills */

  --neon-cyan: #00eefc;         /* SECONDARY — electric plasma cyan */
  --neon-cyan-dim: #00dbe9;
  --neon-cyan-soft: #7df4ff;
  --neon-cyan-ink: #00363a;     /* text ON cyan fills */

  --neon-magenta: #ff00ff;      /* TERTIARY — cosmic nebula magenta */
  --neon-magenta-soft: #ffb1c3;
  --neon-magenta-ink: #3f0019;

  /* ---- Text on dark ---- */
  --ink-100: #e5e2e3;   /* on-surface — primary text */
  --ink-300: #b9b6b7;   /* muted body */
  --ink-500: #8e8d8e;   /* tertiary / captions */

  /* ---- Lines & outlines ---- */
  --outline: #444444;
  --outline-soft: rgba(255, 255, 255, 0.08);  /* hairline list dividers */
  --outline-neon: rgba(195, 244, 0, 0.5);

  /* ---- Semantic / status ---- */
  --error: #ffb4ab;
  --error-container: #93000a;
  --success: var(--neon-green);
  --live: var(--neon-green);

  /* ---- Semantic aliases (prefer these in product code) ---- */
  --bg-page: var(--void-800);
  --bg-void: var(--void-900);
  --surface-card: var(--void-750);
  --surface-raised: var(--void-700);
  --surface-overlay: var(--void-650);

  --text-strong: var(--ink-100);
  --text-body: var(--ink-300);
  --text-muted: var(--ink-500);

  --accent-primary: var(--neon-green);
  --accent-secondary: var(--neon-cyan);
  --accent-tertiary: var(--neon-magenta);

  --border-hairline: var(--outline-soft);
  --border-default: var(--outline);

  /* ---- Glassmorphism fills ---- */
  --glass-fill: rgba(255, 255, 255, 0.04);
  --glass-fill-strong: rgba(255, 255, 255, 0.08);
  --glass-border: rgba(255, 255, 255, 0.12);
  --glass-cyan: rgba(0, 238, 252, 0.10);
  --glass-cyan-border: rgba(0, 238, 252, 0.40);

  /* ---- Cosmic gradients ---- */
  --grad-cosmic: radial-gradient(120% 120% at 50% 0%, rgba(124, 58, 237, 0.35) 0%, rgba(0, 238, 252, 0.18) 35%, rgba(5, 5, 5, 0) 70%); /* @kind other */
  --grad-plasma: linear-gradient(135deg, var(--neon-cyan) 0%, var(--neon-magenta) 100%); /* @kind other */
  --grad-portal: radial-gradient(60% 60% at 50% 45%, rgba(255, 0, 255, 0.35) 0%, rgba(0, 238, 252, 0.25) 45%, rgba(5, 5, 5, 0) 75%); /* @kind other */
}