/* ===========================================================================
   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. */
  /* UN SOLO FONDO desde el 2026-09-21. Habia dos: el "histórico" #080b11 y
     el de la landing #0a0a0c. Medidos uno contra otro dan 1.004:1 — o sea
     que eran el MISMO color a ojo: dos puntos de azul sobre 255. Sostener
     dos nombres para eso era lo que hacia que el sitio no pareciera uno.
     Los nombres viejos quedan como alias un ciclo, asi ninguna hoja se
     rompe mientras se migran sus usos. */
  --c-negro:          #0a0a0c;
  --c-negro-2:        #111119;
  --c-negro-azulado:  var(--c-negro);   /* retirado: era #080b11 */
  --c-negro-calido:   var(--c-negro);   /* retirado: mismo valor */
  --c-negro-calido-2: var(--c-negro-2);

  /* UN SOLO ORO desde el 2026-09-21. Eran cinco, censados acá esperando
     "ojo humano": Rudi eligio el CALIDO mirando las cinco opciones sobre
     componentes reales. Los cinco pasaban AA con holgura (7.4:1 a 12.5:1
     sobre las tres superficies), asi que la decision era estetica y no de
     accesibilidad — conviene dejarlo dicho, porque el plan suponia lo
     contrario.

     Queda el oro y su estado claro, que no es un segundo oro: es el mismo
     tono mas alto, para hover, links y enfasis. Lo que se fue es el FRIO,
     que era el que peleaba en pantalla con este.
     Los nombres viejos quedan como alias un ciclo. */
  --c-oro:             #d8a24a;
  --c-oro-claro:       #f0c877;
  --c-oro-frio:        var(--c-oro);        /* retirado: era #c9a227 */
  --c-oro-calido:      var(--c-oro);
  --c-oro-calido-claro:var(--c-oro-claro);
  --c-oro-vivo:        var(--c-oro);        /* retirado: era #e0c063 */
  /* --c-oro-frio-claro #d8b23a se retiro el 2026-09-21: estaba declarado y
     no lo consumia NADIE (0 usos en todo web/). Era censo, no paleta. */

  /* 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;
}
