/* AI Camper · Copiloto — tokens definitivos (30-10-2026)
 * Solo custom properties: ni una regla de componente. Parten de docs/project/estudio/2026-10-22-tres-direcciones/tokens/direccion-c.css
 * con las correcciones de QA y accesibilidad; el detalle, en docs/project/estudio/2026-10-30-copiloto/tokens-v2.md.
 * Temas, todos sobre <html data-theme="...">, el mismo atributo que ya pone aplicarTema() en app.js:
 *   (sin atributo o "light")  claro, texto ≥ 7:1
 *   "dark"                    oscuro hondo, texto ≥ 4,5:1
 *   "sol"                     al sol: contraste máximo, borde de 3 px, rem al 125 %, sin movimiento, copiloto solo en el saludo
 * Los contrastes se miden con docs/project/estudio/2026-10-30-copiloto/contrastes-v2.js, que lee este fichero. */

:root {
  color-scheme: light;
  --escala-raiz: 112.5%;

  /* Color · claro */
  --fondo: #e9f2f8;
  --superficie: #ffffff;
  --superficie-2: #d9e8f2;
  --tinta: #13203a;
  --tinta-2: #3b4964;
  --linea: #b9cddd;
  --linea-fuerte: #13203a;
  --accion: #ffb81f;
  --sobre-accion: #13203a;
  --borde-accion: #13203a;
  --enlace: #13203a;
  --foco: #13203a;
  --foco-halo: #ffffff;
  --foco-sobre-protagonista: #13203a;
  --protagonista: #ffe3a3;
  --sobre-protagonista: #13203a;
  --sobre-protagonista-2: #3b4964;
  --exito: #0f5230;
  --exito-fondo: #dcf0e3;
  --aviso: #5e3800;
  --aviso-fondo: #ffedc2;
  --error: #8f1226;
  --error-fondo: #fde3e7;
  --prisa: #2f6fe4;
  --prisa-texto: #173f8c;
  --prisa-relleno: #cfe0ff;
  --sobre-prisa: #13203a;
  --prisa-velo: #cfe0ff;
  --calma: #f5a50a;
  --calma-texto: #6b3f00;
  --calma-relleno: #ffe3a3;
  --sobre-calma: #13203a;
  --calma-velo: #ffe3a3;
  --sinpeajes: #5d6879;
  --sinpeajes-texto: #3b4964;
  --sinpeajes-relleno: #dfe3ea;
  --sobre-sinpeajes: #13203a;
  --sinpeajes-velo: #dfe3ea;
  --sobre-velo: #13203a;
  --minificha-fondo: #ffffff;
  --minificha-texto: #13203a;
  --minificha-borde: #13203a;
  --noche-fondo: #ddd6f6;
  --sobre-noche: #13203a;
  --velo-hoja: rgba(19, 32, 58, 0.55);
  --mapa-prisa: #2f6fe4;
  --mapa-calma: #f5a50a;
  --mapa-sinpeajes: #8a95a4;
  --mapa-contorno: #13203a;
  --mapa-nucleo: #d81b3a;
  --mapa-fondo: #d9e8f2;
  --sombra-plana: #13203a;
  --borde-pegatina: #13203a;
  --escena-cielo: #c9e4f8;
  --escena-suelo: #5d6879;
  --escena-sol: #ffb81f;
  --copiloto-carroceria: #ffffff;
  --copiloto-trazo: #13203a;
  --copiloto-parabrisas: #c9e4f8;
  --copiloto-faro: #13203a;
  --copiloto-sombra-suelo: rgba(19, 32, 58, 0.18);

  /* Tipografía */
  --f-display: Rubik, system-ui, sans-serif;
  --f-texto: Lexend, system-ui, sans-serif;
  --t-pie: 0.8889rem; /* 16 px */
  --t-cuerpo: 1rem; /* 18 px */
  --t-destacado: 1.1111rem; /* 20 px */
  --t-titulo: 1.3333rem; /* 24 px */
  --t-seccion: 1.6667rem; /* 30 px */
  --t-cifra: 2rem; /* 36 px */
  --t-protagonista: 2.6667rem; /* 48 px */
  --peso-normal: 400;
  --peso-medio: 500;
  --peso-fuerte: 700;
  --peso-titular: 800;
  --lh-texto: 1.5;
  --lh-titular: 1.15;
  --lh-cifra: 1;

  /* Espacio (px a propósito: el texto crece con la preferencia del usuario, el ritmo no) */
  --e-medio: 2px;
  --e-1: 4px; --e-2: 8px; --e-3: 12px; --e-4: 16px; --e-5: 20px; --e-6: 24px; --e-8: 32px; --e-10: 40px; --e-12: 48px; --e-16: 64px;
  --tactil-minimo: 48px; --tactil-grande: 56px; --tactil-barra: 64px;

  /* Forma */
  --r-sm: 10px; --r-md: 16px; --r-lg: 24px; --r-full: 9999px;
  --borde-fino: 2px; --borde-control: 2px; --borde-protagonista: 2px; --borde-filete: 2px;
  --sombra-nivel-0: none;
  --sombra-nivel-1: 3px 3px 0 0 var(--sombra-plana);
  --sombra-nivel-2: 4px 4px 0 0 var(--sombra-plana);
  --sombra-nivel-3: 6px 6px 0 0 var(--sombra-plana);
  --hundir: 2px;
  --hundir-sombra: 1px;

  /* Foco: anillo de --foco-grosor con --foco-aire de separación y halo del color contrario; nunca amarillo */
  --foco-grosor: 3px;
  --foco-aire: 2px;

  /* Iconos, marcadores y escena */
  --icono-sm: 20px; --icono-md: 24px; --icono-lg: 28px;
  --marcador-md: 22px; --marcador-lg: 28px;
  --escena-alto: 188px;
  --copiloto-chat-display: block;

  /* Movimiento */
  --m-pulsar: 100ms;
  --m-micro: 160ms;
  --m-transicion: 250ms;
  --m-entrada: 500ms;
  --m-escalonado: 60ms;
  --escalonado-tope: 6;
  --m-cifra: 900ms;
  --m-trazo-ruta: 1000ms;
  --m-parpadeo: 180ms;
  --m-celebracion: 1200ms;
  --curva-salida: cubic-bezier(0.22, 1, 0.36, 1);
  --curva-entrada: cubic-bezier(0.4, 0, 1, 1);
  --curva-pulsar: cubic-bezier(0.3, 0, 0.6, 1);
  --curva-rebote: cubic-bezier(0.34, 1.56, 0.64, 1);

  /* Mapa */
  --mapa-filtro: saturate(0.65) brightness(1.03);
  --mapa-trazo: 6px; --mapa-trazo-contorno: 3px; --mapa-trazo-recomendada: 8px;

  /* Forma por ruta: el color nunca va solo. Trazo, raya (stroke-dasharray; "none" = continua) y marcador */
  --ruta-prisa-ancho: var(--mapa-trazo);
  --ruta-prisa-raya: none;
  --ruta-prisa-marcador: "\25B2"; /* ▲ */
  --ruta-calma-ancho: var(--mapa-trazo-recomendada);
  --ruta-calma-raya: none;
  --ruta-calma-marcador: "\25CF"; /* ● */
  --ruta-sinpeajes-ancho: var(--mapa-trazo);
  --ruta-sinpeajes-raya: 10 7;
  --ruta-sinpeajes-marcador: "\25A0"; /* ■ */
}

html { font-size: var(--escala-raiz); }

/* Oscuro hondo: superficies más bajas y velos oscuros con tinta clara, para que la pegatina no deslumbre de noche. */
[data-theme="dark"] {
  color-scheme: dark;
  --fondo: #0b1120;
  --superficie: #131b30;
  --superficie-2: #1b2540;
  --tinta: #f2f5fb;
  --tinta-2: #b4bfd4;
  --linea: #28324e;
  --linea-fuerte: #8795b2;
  --accion: #f2b230;
  --sobre-accion: #0b1120;
  --borde-accion: #f2b230;
  --enlace: #f2f5fb;
  --foco: #ffffff;
  --foco-halo: #0b1120;
  --foco-sobre-protagonista: #ffffff;
  --protagonista: #4a360d;
  --sobre-protagonista: #fff3d6;
  --sobre-protagonista-2: #e8d3a0;
  --exito: #7fd9a0;
  --exito-fondo: #0f2418;
  --aviso: #ffcf66;
  --aviso-fondo: #261f0f;
  --error: #ff95a5;
  --error-fondo: #2c1219;
  --prisa: #7aa7ff;
  --prisa-texto: #9cc0ff;
  --prisa-relleno: #7aa7ff;
  --sobre-prisa: #0b1120;
  --prisa-velo: #1c3366;
  --calma: #ffbd3d;
  --calma-texto: #ffcf66;
  --calma-relleno: #f2b230;
  --sobre-calma: #0b1120;
  --calma-velo: #4a360d;
  --sinpeajes: #a5afbf;
  --sinpeajes-texto: #c9d1de;
  --sinpeajes-relleno: #a5afbf;
  --sobre-sinpeajes: #0b1120;
  --sinpeajes-velo: #2c3547;
  --sobre-velo: #f2f5fb;
  --minificha-fondo: #131b30;
  --minificha-texto: #f2f5fb;
  --minificha-borde: #8795b2;
  --noche-fondo: #2a2650;
  --sobre-noche: #ece9ff;
  --velo-hoja: rgba(2, 5, 12, 0.7);
  --mapa-prisa: #7aa7ff;
  --mapa-calma: #ffbd3d;
  --mapa-sinpeajes: #b8c3d7;
  --mapa-contorno: #070b14;
  --mapa-nucleo: #ff6b80;
  --mapa-fondo: #1b2540;
  --sombra-plana: #02050c;
  --borde-pegatina: #8795b2;
  --escena-cielo: #1b2a4d;
  --escena-suelo: #28324e;
  --escena-sol: #f2b230;
  --copiloto-carroceria: #c3cde0;
  --copiloto-trazo: #0b1120;
  --copiloto-parabrisas: #8fb0d0;
  --copiloto-faro: #0b1120;
  --copiloto-sombra-suelo: rgba(0, 0, 0, 0.4);
  --mapa-filtro: invert(1) hue-rotate(180deg) saturate(0.5) brightness(0.9);
}

/* Al sol: claro fijo, tinta negra, borde de 3 px, rem al 125 %, trazos más gruesos, sin movimiento y el copiloto solo en el saludo. */
[data-theme="sol"] {
  color-scheme: light;
  --escala-raiz: 125%;
  --fondo: #ffffff;
  --superficie: #ffffff;
  --superficie-2: #eef2f6;
  --tinta: #000000;
  --tinta-2: #1a2438;
  --linea: #0a1224;
  --linea-fuerte: #000000;
  --accion: #ffb81f;
  --sobre-accion: #000000;
  --borde-accion: #000000;
  --enlace: #000000;
  --foco: #000000;
  --foco-halo: #ffffff;
  --foco-sobre-protagonista: #000000;
  --protagonista: #ffe3a3;
  --sobre-protagonista: #000000;
  --sobre-protagonista-2: #1a2438;
  --exito: #0a4524;
  --exito-fondo: #dcf0e3;
  --aviso: #4d2d00;
  --aviso-fondo: #ffedc2;
  --error: #7a0c1c;
  --error-fondo: #fde3e7;
  --prisa: #2f6fe4;
  --prisa-texto: #0f2f73;
  --prisa-relleno: #cfe0ff;
  --sobre-prisa: #000000;
  --prisa-velo: #cfe0ff;
  --calma: #f5a50a;
  --calma-texto: #4d2d00;
  --calma-relleno: #ffe3a3;
  --sobre-calma: #000000;
  --calma-velo: #ffe3a3;
  --sinpeajes: #3b4964;
  --sinpeajes-texto: #1a2438;
  --sinpeajes-relleno: #dfe3ea;
  --sobre-sinpeajes: #000000;
  --sinpeajes-velo: #dfe3ea;
  --sobre-velo: #000000;
  --minificha-fondo: #ffffff;
  --minificha-texto: #000000;
  --minificha-borde: #000000;
  --noche-fondo: #ddd6f6;
  --sobre-noche: #000000;
  --velo-hoja: rgba(0, 0, 0, 0.7);
  --mapa-prisa: #2f6fe4;
  --mapa-calma: #f5a50a;
  --mapa-sinpeajes: #8a95a4;
  --mapa-contorno: #000000;
  --mapa-nucleo: #d81b3a;
  --mapa-fondo: #eef2f6;
  --sombra-plana: #000000;
  --borde-pegatina: #000000;
  --escena-cielo: #c9e4f8;
  --escena-suelo: #3b4964;
  --escena-sol: #ffb81f;
  --copiloto-carroceria: #ffffff;
  --copiloto-trazo: #000000;
  --copiloto-parabrisas: #c9e4f8;
  --copiloto-faro: #000000;
  --copiloto-sombra-suelo: rgba(0, 0, 0, 0.25);
  --mapa-filtro: saturate(0.5) contrast(1.2);
  --mapa-trazo: 8px; --mapa-trazo-recomendada: 10px;
  --ruta-sinpeajes-raya: 14 9;
  --borde-fino: 3px; --borde-control: 3px; --borde-protagonista: 3px; --borde-filete: 3px;
  --sombra-nivel-1: 4px 4px 0 0 var(--sombra-plana);
  --sombra-nivel-2: 5px 5px 0 0 var(--sombra-plana);
  --sombra-nivel-3: 7px 7px 0 0 var(--sombra-plana);
  --foco-grosor: 4px;
  --icono-sm: 24px; --icono-md: 28px; --icono-lg: 32px;
  --marcador-md: 28px; --marcador-lg: 34px;
  --copiloto-chat-display: none;
  --m-pulsar: 0ms; --m-micro: 0ms; --m-transicion: 0ms; --m-entrada: 0ms; --m-escalonado: 0ms; --m-cifra: 0ms; --m-trazo-ruta: 0ms; --m-parpadeo: 0ms; --m-celebracion: 0ms;
}

/* Reducir movimiento: sin rebote, sin hundimiento y sin escalonado; los fundidos de 160 ms se quedan. El copiloto no parpadea ni celebra. */
@media (prefers-reduced-motion: reduce) {
  :root { --m-entrada: 0ms; --m-escalonado: 0ms; --m-cifra: 0ms; --m-trazo-ruta: 0ms; --m-parpadeo: 0ms; --m-celebracion: 0ms; --hundir: 0px; --hundir-sombra: 0px; }
}