/* ===========================================================================
   base.css — CAPA DE TOKENS CANÓNICA. Se carga ANTES que todo lo demás.

   Por qué existe: el sitio venía con CUATRO juegos de variables inventados en
   momentos distintos (estilo.css, arte.css, landing.css y un bloque inline en
   cuenta.php). Entre los cuatro había CINCO oros, dos negros, dos grises y dos
   rojos, y en la portada conviven en pantalla el oro frío del nav (#c9a227) con
   el oro cálido de los botones (#d8a24a). Eso no es una paleta: es sedimento.

   Este archivo define las PRIMITIVAS una sola vez. Las hojas viejas ya no
   declaran colores propios: alias apuntando acá. Así un cambio de identidad es
   una línea en un archivo y no una cacería por cinco.

   REGLA para adelante: ningún hex nuevo fuera de este archivo. Si hace falta un
   color que acá no está, se agrega acá y se consume por variable.
   =========================================================================== */

:root {
  /* ---------- primitivas de color ----------
     Nombradas por lo que SON, no por dónde se usan: el rol se asigna abajo. */
  --c-negro-azulado:  #080b11;   /* fondo histórico del sitio */
  --c-negro-calido:   #0a0a0c;   /* fondo de la landing */
  --c-negro-calido-2: #111119;

  /* Los cinco oros heredados. La unificación es un commit aparte (cambia el
     aspecto y necesita ojo humano); acá sólo quedan censados y con nombre. */
  --c-oro-frio:        #c9a227;
  --c-oro-frio-claro:  #d8b23a;
  --c-oro-calido:      #d8a24a;
  --c-oro-calido-claro:#f0c877;
  --c-oro-vivo:        #e0c063;

  /* Rampa metálica del lockup del hero (banner "Trono del Plata"): brillo
     arriba, sombra abajo, y el marrón profundo del contorno del texto. */
  --c-oro-brillo:      #ffe9a8;
  --c-oro-sombra:      #9a6b1e;
  --c-oro-profundo:    #3a2703;

  --c-naranja:      #ff8a2a;   /* energía de las alas evo3 */
  --c-violeta:      #c86eff;   /* Rey de Arena */
  --c-rojo:         #c9564e;
  /* --c-rojo sobre panel (#111722) da 4.3:1 — falla AA (4.5:1) en texto chico.
     Este es el MISMO rojo levantado lo justo para pasar (5.0:1). Solo para
     TEXTO menor a 24px; los numeros grandes y los fondos siguen con --c-rojo. */
  --c-rojo-texto:   #d4685f;
  --c-rojo-vivo:    #c0392b;
  --c-verde:        #5bbd68;
  --c-navy:         #14183a;

  --c-blanco:       #eef1f4;
  --c-hueso:        #e9e6df;
  --c-plata:        #c8ccd0;
  --c-gris:         #6f7684;
  --c-gris-calido:  #9a978f;

  --c-panel:        #111722;
  --c-panel-2:      #0d121b;
  --c-borde:        #1c2433;

  /* ---------- tipografía ----------
     OJO con la trampa heredada: en estilo.css `--texto` es una FAMILIA
     tipográfica y en landing.css `--tdp-texto` es un COLOR. Mismo sustantivo,
     dos cosas distintas. Acá las familias se llaman `--fuente-*` y punto. */
  --fuente-titulos: 'Cinzel', Georgia, serif;
  --fuente-texto:   'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;

  /* ---------- escala de espaciado (base 4) ----------
     Hoy el sitio usa valores sueltos (11px, 13px, 22px, 26px, 34px…). La
     migración es gradual; lo nuevo sale de acá. */
  --e-1: 4px;  --e-2: 8px;  --e-3: 12px; --e-4: 16px;
  --e-5: 24px; --e-6: 32px; --e-7: 48px; --e-8: 64px;

  /* ---------- medidas de contenido ---------- */
  --medida-lectura: 1020px;   /* páginas de texto */
  --medida-tablero: 1180px;   /* /rankings y futuros dashboards */

  /* ---------- radios y sombras ---------- */
  --radio-chico: 8px;
  --radio:       11px;
  --radio-grande:16px;
  --sombra-honda: 0 24px 60px rgba(0, 0, 0, .55);

  /* ---------- movimiento ----------
     Una sola fuente para las duraciones: hoy hay 180/420/1000 ms repartidos a
     ojo por tres archivos. */
  --dur-rapida: 180ms;
  --dur-media:  420ms;
  --dur-lenta:  1000ms;
  --ease-suave: cubic-bezier(.4, 0, .2, 1);

  /* ---------- escalera de z-index ----------
     Documentada porque ya se pisó DOS veces: una capa `position:fixed` emitida
     dentro de <main> con z-index:0 se pinta ENCIMA del texto (el contenido de
     bloque se pinta antes que los posicionados). Las capas de arte van en
     NEGATIVO. La migración de los z-index sueltos es un commit posterior. */
  --z-veladura:  -2;   /* body::before de arte.css */
  --z-escena:    -1;   /* fondos fijos dentro de <main> (elf, arena) */
  --z-contenido:  1;
  --z-cabecera:  50;
  --z-overlay:   60;
  --z-destello:  70;
}
