:root{
  /* ---- Brand spectrum — sampled verbatim from the logo SVG gradient stops ---- */
  --wl-magenta:#ff00cc;      /* bulb gradient 0%   */
  --wl-violet:#cc00ff;       /* bulb gradient 60%  */
  --wl-purple:#8833ff;       /* bulb gradient 100% */
  --wl-indigo:#7722ff;       /* wordmark 0%        */
  --wl-spring:#00ffb3;       /* wordmark 55%       */
  --wl-cyan:#00e8ff;         /* wordmark 100%      */

  /* ---- Tints / shades used for hover, glow and low-alpha washes ---- */
  --wl-cyan-bright:#5cf4ff;
  --wl-cyan-deep:#00b8cc;
  --wl-spring-deep:#00c98d;
  --wl-magenta-deep:#c400a0;
  --wl-cyan-a08:rgba(0,232,255,.08);
  --wl-cyan-a16:rgba(0,232,255,.16);
  --wl-cyan-a32:rgba(0,232,255,.32);
  --wl-spring-a10:rgba(0,255,179,.10);
  --wl-spring-a28:rgba(0,255,179,.28);
  --wl-magenta-a12:rgba(255,0,204,.12);
  --wl-magenta-a30:rgba(255,0,204,.30);
  --wl-purple-a14:rgba(136,51,255,.14);

  /* ---- Neutral ramp — cool, blue-shifted near-blacks ---- */
  --wl-ink-000:#04050a;
  --wl-ink-050:#070911;
  --wl-ink-100:#0b0e17;
  --wl-ink-200:#11151f;
  --wl-ink-300:#181d2a;
  --wl-ink-400:#222836;
  --wl-ink-500:#333b4d;
  --wl-ink-600:#5b647a;
  --wl-ink-700:#8d96a8;
  --wl-ink-800:#c3c9d4;
  --wl-ink-900:#e8ebf1;
  --wl-white:#ffffff;

  /* ---- Semantic status ---- */
  --wl-ok:#00ffb3;
  --wl-warn:#ffb020;
  --wl-crit:#ff3d5e;
  --wl-info:#00e8ff;
  --wl-ok-a12:rgba(0,255,179,.12);
  --wl-warn-a12:rgba(255,176,32,.12);
  --wl-crit-a12:rgba(255,61,94,.12);

  /* ---- Severity scale (findings / report language) ---- */
  --wl-sev-critical:#ff3d5e;
  --wl-sev-high:#ff7a18;
  --wl-sev-medium:#ffb020;
  --wl-sev-low:#00e8ff;
  --wl-sev-info:#8d96a8;

  /* ================= Semantic aliases ================= */
  --surface-page:var(--wl-ink-000);
  --surface-raised:var(--wl-ink-100);
  --surface-card:var(--wl-ink-200);
  --surface-card-hover:var(--wl-ink-300);
  --surface-inset:var(--wl-ink-050);
  --surface-terminal:#05070d;
  --surface-overlay:rgba(4,5,10,.82);

  --text-heading:var(--wl-white);
  --text-body:var(--wl-ink-800);
  --text-muted:var(--wl-ink-700);
  --text-faint:var(--wl-ink-600);
  --text-accent:var(--wl-cyan);
  --text-on-accent:var(--wl-ink-000);

  --border-hairline:rgba(255,255,255,.07);
  --border-subtle:var(--wl-ink-400);
  --border-strong:var(--wl-ink-500);
  --border-accent:var(--wl-cyan-a32);

  --accent-primary:var(--wl-cyan);
  --accent-secondary:var(--wl-spring);
  --accent-hot:var(--wl-magenta);
  --link-color:var(--wl-cyan);
  --link-color-hover:var(--wl-cyan-bright);

  --gradient-brand:linear-gradient(90deg,var(--wl-indigo) 0%,var(--wl-spring) 55%,var(--wl-cyan) 100%);
  --gradient-bulb:linear-gradient(180deg,var(--wl-magenta) 0%,var(--wl-violet) 60%,var(--wl-purple) 100%);
  --gradient-hot:linear-gradient(90deg,var(--wl-magenta) 0%,var(--wl-purple) 100%);
  --gradient-hairline:linear-gradient(90deg,transparent,var(--wl-cyan-a32),transparent);
  --gradient-protect:linear-gradient(180deg,transparent,rgba(4,5,10,.92)); /* @kind color */
  --grid-line:rgba(0,232,255,.045);
}