/* ══════════════════════════════════════════════════════════
   ESCALERILLA — DESIGN TOKENS · tema "night court"
   Fondos navy + verde pelota como único acento.
   Única fuente de verdad: ningún color vive fuera de aquí.
   ══════════════════════════════════════════════════════════ */
:root {
  /* Fondos */
  --bg: #0B1220;
  --surface: #121B2E;
  --surface-hi: #1A2540;
  /* versiones translúcidas para barras con blur */
  --bg-scrim: rgba(11, 18, 32, 0.88);
  --surface-scrim: rgba(18, 27, 46, 0.9);

  /* Borde universal */
  --border: 1px solid rgba(255, 255, 255, 0.08);
  --border-color: rgba(255, 255, 255, 0.08);

  /* Radius */
  --r-card: 12px;
  --r-btn: 8px;
  --r-pill: 999px;

  /* Acento — SOLO: CTAs, badges del podio (top 3), flechas ▲,
     posición en perfil, barras y nav activa. Números #4+ en blanco. */
  --accent: #CFFF04;
  --accent-num: #CFFF04;
  --accent-up: #CFFF04;
  --on-accent: #0B1220;
  --on-accent-num: #0B1220;

  /* Texto */
  --text: #FAFAF5;
  --text-2: rgba(255, 255, 255, 0.55);
  --text-3: rgba(255, 255, 255, 0.25); /* placeholders */

  /* Semánticos (uso puntual) */
  --danger: #F87171;
  --gold: #D9B23C;
  --silver: #A9B2BA;
  --bronze: #B0805B;

  /* Barras de stats */
  --bar-track: rgba(255, 255, 255, 0.08);
  /* Velo de acento para filas destacadas (líder de tabla) */
  --accent-veil: rgba(207, 255, 4, 0.07);

  /* Tipografía */
  --display: 'Anton', 'Arial Black', sans-serif;
  --sans: 'Inter', system-ui, sans-serif;

  /* Label estilo broadcast: uppercase 11px, tracking abierto */
  --label-size: 11px;
  --label-track: 0.08em;

  /* Motion */
  --t: 150ms ease-out;

  /* Layout */
  --nav-h: 62px;
}