/* EstadiGol — tokens de diseño únicos (color, espaciado, tipografía base).
   Se carga en el <head> de cada página, antes del <style> propio de esa página. */
:root{
  --bg-void:#000000;
  --bg-elevated:#0d0d0d;
  --bg-card:#161616;
  --bg-card-hover:#1e1e1e;
  --border-subtle:rgba(255,255,255,0.08);
  --border-strong:rgba(255,255,255,0.16);
  --accent:#1DB954;
  --accent-bright:#22e56a;
  --accent-dark:#14833d;
  --accent-dim:rgba(29,185,84,0.14);
  --accent-glow:rgba(29,185,84,0.35);
  --accent-border:rgba(29,185,84,0.18);
  --accent-tint:rgba(29,185,84,0.06);
  --accent-wash:rgba(29,185,84,0.04);
  --accent-ink:#04150a;
  --red:#e5484d;
  --red-dim:rgba(229,72,77,0.14);
  --amber:#e8b93f;
  --text-primary:#ffffff;
  --text-secondary:#a6a6a6;
  --text-tertiary:#8a8a8a;
  --radius-sm:8px;
  --radius-md:14px;
  --radius-lg:20px;
  --radius-pill:999px;
  --shadow-card:0 10px 30px rgba(0,0,0,0.45);
  --ease:cubic-bezier(.4,0,.2,1);

  /* ===== Grises neutros =====
     --neutral-soft tiene el mismo valor que --border-subtle pero OTRO
     significado (fondo, no borde), por eso es un token aparte y no un alias.
     Unifica los dos blancos que convivian hoy (0.06 y 0.08): se queda el 0.08,
     que es el mas usado en codigo fuente. */
  --neutral-soft:rgba(255,255,255,0.08);
  --neutral-bar:#5a5a5a;
  --amber-dim:rgba(232,185,63,0.15);

  /* ===== Bordes y texto de las familias de color =====
     Las tres familias quedan completas: color, fondo tenue y borde. Ninguno
     de estos tres valores es nuevo; los tres estaban ya en linea en el repo
     y aqui solo se les pone nombre.
       --amber-border  de .muestra-banner (resultados.html)
       --red-border    de .form-pill.loss y .pred-result.fallo, en las 148
                       paginas de equipo, y de .form-message.error
       --red-text      de .form-message.error (cuenta.html y premium.html)
     --red-text existe aparte de --red porque son dos cosas: --red (#e5484d)
     es el rojo de la marca, y --red-text es la version aclarada que se usa
     cuando el rojo va sobre un fondo rojo tenue y necesita contraste. */
  --amber-border:rgba(232,185,63,0.3);
  --red-border:rgba(229,72,77,0.25);
  --red-text:#e8888c;

  /* ===== Escala tipografica =====
     Once escalones. Cubren los 42 tamaños que habia en el repo sin que se note
     el redondeo. Un tamaño literal en una hoja de estilos es un error a
     corregir, no una decision; las excepciones van con un comentario que diga
     por que (hoy: el minimo legible del logotipo, 64px, y las alturas de barra
     calculadas a partir de un dato).
     Pesos, tres y solo tres: 400 cuerpo, 700 enfasis y titulos, 900 cifras.
     Fuera de alcance: plantilla-instagram.html y plantilla-stories.html, que
     son lienzos de 1080px para redes. */
  --fs-micro:10px;      /* etiquetas en versalitas */
  --fs-xs:11.5px;       /* pies, notas, fechas */
  --fs-sm:13px;         /* texto secundario, filas */
  --fs-base:14.5px;     /* cuerpo */
  --fs-lg:17px;         /* titulos de tarjeta */
  --fs-xl:21px;         /* titulo de veredicto (= .cta-title base) */
  --fs-xxl:24px;        /* .cta-title y .section-title en pantalla grande */
  --fs-2xl:28px;        /* cifras destacadas */
  --fs-3xl:34px;        /* marcador del partido, marcador mas probable */
  --fs-hero:40px;       /* cifras de cabecera */
  --fs-display:52px;    /* la cifra de la tira de confianza */

  /* ===== Escala de espaciado =====
     Base 4, sin valores intermedios. --sp-7 existe porque 28px ya se usa en
     siete sitios. */
  --sp-1:4px;
  --sp-2:8px;
  --sp-3:12px;
  --sp-4:16px;
  --sp-5:20px;
  --sp-6:24px;
  --sp-7:28px;
  --sp-8:32px;

  /* ===== Minimo tactil =====
     No es tipografia ni espaciado: es el lado minimo de cualquier cosa que
     se toque con el dedo. 44px es lo que ya usan .form-pill (las 148 paginas
     de equipo), .consent-btn y .pick-btn--full, y lo que necesitan las dos
     piezas nuevas que tienen celda estrecha. Era el cuarto hueco del
     inventario: el unico numero repetido en el repo que no era ni un tamaño
     de texto ni una separacion, y por eso no lo cubria ninguna escala.
     Los tres usos que ya existen lo adoptan en su propia ronda: cambiarlos
     aqui no movería ni un pixel, pero sacaria a esta ronda de su unica
     garantia, que es no tocar nada que hoy se vea. */
  --tap-min:44px;
}
