:root{
  /* ---- Campo azul oficial (ramp definido por Rodrigo) ----
     Oscuros / viñeteado (borde inferior y derecho): #01021C → #030535
     Tonos medios (transición y cuerpo central):     #001F6E → #0033A0
     Altas luces (núcleo de los halos):               #0075FF → #33A8FF   */
  --rg-abyss:#01021C; /* @kind color */         /* rgb(1,2,28) — viñeteado extremo */
  --rg-deepfield:#030535; /* @kind color */     /* rgb(3,5,53) — borde y base */
  --rg-navy-royal:#001F6E; /* @kind color */    /* rgb(0,31,110) — transición */
  --rg-royal:#0033A0; /* @kind color */         /* rgb(0,51,160) — cuerpo central */
  --rg-royal-bright:#0075FF; /* @kind color */  /* rgb(0,117,255) — halo */
  --rg-bloom:#33A8FF; /* @kind color */         /* rgb(51,168,255) — máxima luminancia */

  /* ---- Azules y cyanes del sistema ---- */
  --rg-blue-deep:#0A55D9; /* @kind color */
  --rg-blue:#098CFF; /* @kind color */
  --rg-blue-800:#0a4cd8; /* @kind color */
  --rg-cyan:#00D9FF; /* @kind color */
  --rg-cyan-bright:#12D9FF; /* @kind color */

  /* ---- Negros de soporte (dashboards, chat, no fondo de marca) ---- */
  --rg-black:#020711; /* @kind color */
  --rg-black-deep:#01040a; /* @kind color */
  --rg-navy:#06162F; /* @kind color */

  /* ---- Texto ---- */
  --rg-white:#F2F7FF; /* @kind color */
  --rg-grey:#AEB8C8; /* @kind color */

  /* ---- Semánticos (información, nunca decoración) ---- */
  --rg-success:#10B981; /* @kind color */
  --rg-danger:#EF4444; /* @kind color */
  --rg-warning:#F59E0B; /* @kind color */

  /* ---- E1637 (amarillo sobre el mismo campo azul) ---- */
  --e1637-yellow:#F5E63D; /* @kind color */
  --e1637-gold:#E0A200; /* @kind color */
  --e1637-black:#0B0B0B; /* @kind color */
  --e1637-white:#FFFFFF; /* @kind color */

  /* ---- Superficies ---- */
  --bg-dark:var(--rg-abyss); /* @kind color */ /* base sólida detrás del campo; el fondo visible es --bg-atmos */
  --bg-panel:rgba(0,31,110,.58); /* @kind color */
  --bg-panel-soft:rgba(0,51,160,.30); /* @kind color */
  --surface-card:linear-gradient(145deg,rgba(0,51,160,.52),rgba(3,5,53,.62)); /* @kind color */
  --surface-card-hover:linear-gradient(145deg,rgba(0,74,215,.60),rgba(0,31,110,.66)); /* @kind color */
  --surface-inset:rgba(1,2,28,.62); /* @kind color */

  /* ---- Texto semántico ---- */
  --text-main:var(--rg-white); /* @kind color */
  --text-muted:var(--rg-grey); /* @kind color */
  --text-faint:rgba(174,184,200,.62); /* @kind color */
  --text-accent:var(--rg-cyan); /* @kind color */
  --text-on-accent:#04121f; /* @kind color */

  /* ---- Bordes ---- */
  --border-glass:rgba(120,180,255,.22); /* @kind color */
  --border-glass-strong:rgba(0,217,255,.42); /* @kind color */
  --border-hairline:rgba(255,255,255,.10); /* @kind color */

  /* ---- Gradientes de marca ---- */
  --grad-cta:linear-gradient(135deg,#13cfff 0%,#087cff 62%,#0a4cd8 100%); /* @kind color */
  --grad-cta-soft:linear-gradient(135deg,rgba(0,167,255,.16),rgba(0,16,86,.55)); /* @kind color */
  --grad-text:linear-gradient(90deg,#fff 0%,#c8f8ff 36%,#39e6ff 66%,#8fa2ff 100%); /* @kind color */
  --grad-footer:linear-gradient(180deg,#f5efe8 0%,#edf3f8 5%,#dbeaff 11%,#b8d7f8 16%,#72aceb 22%,#33A8FF 28%,#0075FF 35%,#0033A0 46%,#001F6E 60%,#030535 82%,#01021C 100%); /* @kind color */
}