/* ─────────────────────────────────────────────────────────────
   _theme-vars.css — FUENTE ÚNICA DE VERDAD de tokens visuales.
   Namespace --gs-*. Se importa ANTES de styles.css.
   Los nombres antiguos (--bg, --accent, --surface…) quedan como
   alias de estos con el MISMO valor → cero cambio visual.
   Para componentes nuevos usar siempre --gs-*.
   ───────────────────────────────────────────────────────────── */
:root{
  /* Fondos */
  --gs-bg:#0a0e13;
  --gs-bg-2:#0f1620;
  --gs-bg-deep:#040308;
  --gs-surface:#121821;
  --gs-surface-2:#1a222d;
  /* Líneas / bordes */
  --gs-line:rgba(255,255,255,.08);
  --gs-line-2:rgba(255,255,255,.14);
  /* Texto */
  --gs-text:#e5e7eb;
  --gs-text-2:#cbd5e1;
  --gs-text-3:#94a3b8;
  /* Acentos de marca */
  --gs-accent:#4e63ee;
  --gs-accent-2:#a855f7;
  --gs-cyan:#22d3ee;
  --gs-magenta:#ec4899;
  --gs-accent-dim:rgba(78,99,238,.15);
  --gs-accent-grad:linear-gradient(135deg,#5b6efc 0%,#a855f7 60%,#ec4899 100%);
  /* Estado */
  --gs-ok:#22c55e;
  --gs-warn:#f59e0b;
  --gs-danger:#ef4444;
  /* Radios */
  --gs-radius:14px;
  --gs-radius-lg:22px;
}