/* ══════════════════════════════════════════════════════════════════
   Mapa Geolingüístico — tokens de diseño v3 (T-011, dirección v3 §4).
   Paleta híbrida (decisión D-1 del 2026-10-01):
     · interfaz de A «Cuaderno»: neutros, acción, estados, carril y línea;
     · de C «Obsidiana»: las rampas del mapa (len, ofe, asi, dif), el velo
       de la fotografía y el texto sobre ella, y --oferta-texto.
   Único archivo con valores crudos de color, tamaño, espacio y duración.

   Tres niveles:
     1. primitivos  (--p-*): solo se usan dentro de este archivo;
     2. semánticos  (--fondo, --texto, --accion, escalas de datos…);
     3. de componente (--carril-*, --boton-*, --tabla-*, --tramo-*…).

   Los colores que necesitan MapLibre, WebGL o canvas los resuelve el núcleo
   con getComputedStyle (nucleo/color.js); var(--…) solo en CSS, SVG y HTML.
   ══════════════════════════════════════════════════════════════════ */

:root {
  /* ════════════ 1. primitivos ════════════ */

  /* neutros (A) */
  --p-blanco: #FFFFFF;
  --p-gris-25: #F8F9FB;
  --p-gris-50: #F2F5F8;
  --p-gris-100: #EAEDF2;
  --p-gris-200: #DEE2E8;
  --p-gris-300: #C9CFD6;
  --p-gris-500: #8C949F;
  --p-gris-600: #636B76;
  --p-tinta-3: #5A616B;
  --p-tinta-2: #3B424A;
  --p-tinta: #13181E;

  /* acción (A; azul institucional aprobado el 29-09) */
  --p-accion-50: #E9EFF8;
  --p-accion-600: #1D4F91;
  --p-accion-700: #163D70;
  --p-accion-900: #0F2A4E;
  --p-foco: #FFBF47;

  /* estado */
  --p-rojo-700: #B42318;
  --p-rojo-50: #FBE9E7;
  --p-ambar-700: #B54708;
  --p-ambar-50: #FEF6E7;

  /* velo de la fotografía y sombra (componentes rgb para rgb(… / a)) */
  --p-velo: 12 12 14;             /* C */
  --p-sobre-velo-2: #DADADD;      /* C */
  --p-sombra: 19 24 30;           /* A */

  /* rampas del mapa (C, §4.5): 7 clases aptas para el daltonismo */
  --p-len-0: #F2F0FF;
  --p-len-1: #CCCCEE;
  --p-len-2: #A7ACDE;
  --p-len-3: #838FCE;
  --p-len-4: #5C72B8;
  --p-len-5: #3A599D;
  --p-len-6: #0E3D7D;
  --p-ofe-0: #D9F6F6;
  --p-ofe-1: #A3D7D9;
  --p-ofe-2: #72BBC1;
  --p-ofe-3: #42A1AC;
  --p-ofe-4: #288793;
  --p-ofe-5: #006A78;
  --p-ofe-6: #004D5A;
  /* asistencia escolar (I-6): ColorBrewer YlOrBr de 7 clases (T-048). La primera clase se oscurece
     de #FFFFD4 a #FFF2A8 (1,13:1 sobre el fondo blanco, como la primera clase gris que reemplaza) */
  --p-asi-0: #FFF2A8;
  --p-asi-1: #FEE391;
  --p-asi-2: #FEC44F;
  --p-asi-3: #FE9929;
  --p-asi-4: #EC7014;
  --p-asi-5: #CC4C02;
  --p-asi-6: #8C2D04;
  /* grises de los gráficos (la rampa gris que usó la asistencia hasta T-048): niñas y niños, país, resto */
  --p-neutro-1: #C8CACF;
  --p-neutro-2: #A6A9AE;
  --p-neutro-3: #898D92;
  --p-neutro-4: #6A6D73;
  --p-neutro-5: #4C4F55;
  /* diferencia población–oferta, DIVERGENTE: 3 clases ≤ 0 (la oferta iguala o supera)
     y 4 clases > 0 (la población supera) */
  --p-dif-n3: #276D81;
  --p-dif-n2: #77B6C8;
  --p-dif-n1: #CFECF4;
  --p-dif-p1: #F7E8C8;
  --p-dif-p2: #EAC07F;
  --p-dif-p3: #C98E44;
  --p-dif-p4: #83501C;
  --p-ofe-texto: #004D5A;         /* = --p-ofe-6 */

  /* idiomas: paleta del mapa lingüístico Retal Iximulew (MINEDUC, DIGEBI),
     con claves en glotónimo ALMG. Validación de nombres con DIGEBI pendiente (RNF-10). */
  --p-idioma-chuj: #D49E60;
  --p-idioma-qanjobal: #FDC182;
  --p-idioma-akateko: #F9A350;
  --p-idioma-popti: #F39A3C;
  --p-idioma-mam: #FEE893;
  --p-idioma-tektiteko: #F6D27A;
  --p-idioma-awakateko: #F5D35A;
  --p-idioma-ixil: #FFE675;
  --p-idioma-sipakapense: #F3DD8A;
  --p-idioma-uspanteko: #FFE14F;
  --p-idioma-kiche: #A0CF67;
  --p-idioma-kaqchikel: #D1E3A5;
  --p-idioma-tzutujil: #B7D98C;
  --p-idioma-achi: #DBE8A2;
  --p-idioma-sakapulteko: #C9E3B4;
  --p-idioma-qeqchi: #9BC4C8;
  --p-idioma-poqomchi: #76C6B9;
  --p-idioma-poqomam: #AEDBD6;
  --p-idioma-chorti: #EEB8D2;
  --p-idioma-mopan: #ECB3BF;
  --p-idioma-itza: #D9606A;
  --p-idioma-garifuna: #8A4FA0;
  --p-idioma-xinka: #C9C3A0;
  --p-esp: #D9D4C7;               /* español: categoría con nombre, no fondo */
  --p-chalchiteko: #E3C04D;       /* no está en Retal: pendiente de validar con DIGEBI */
  --p-agua: #DCE6EE;              /* cuerpos de agua: mapa base, sin leyenda */

  /* noche de la portada (boceto 11, aprobado el 2026-10-04) */
  --p-noche: #0B121A;
  --p-noche-rgb: 11 18 26;        /* componentes para rgb(… / a) */
  --p-noche-2: #121C27;
  --p-noche-3: #1B2733;
  --p-noche-filete: #2A3846;
  --p-noche-borde: #3B4B5C;
  --p-noche-control: #617188;     /* borde de control: 3,79:1 sobre la noche, 3,46:1 sobre la tarjeta y 3,05:1 al pasar (WCAG 1.4.11) */
  --p-noche-texto: #E8EDF2;       /* 16,0:1 */
  --p-noche-texto-2: #B4C0CC;     /* 10,2:1 */
  --p-noche-texto-3: #8D9AA8;     /*  6,4:1 */
  --p-noche-sin: #1E2935;         /* municipio sin color en el mapa nocturno */
  --p-noche-mapa: #2E3B49;        /* municipio sin dato del capítulo (póster) */
  --p-noche-horizonte: #1B2A3A;
  --p-noche-sombra: #05090D;      /* sombreado del relieve */
  --p-noche-luz: #5B7088;
  --p-noche-borde-mapa: #DCE6F2;
  --p-accion-200: #8FB3E8;        /* acción sobre la noche: 8,6:1 */
  --p-oferta-noche: #5FD3D9;      /* establecimiento bilingüe sobre la noche */
  --p-len-noche: #2B3F66;         /* primera clase de la rampa de niñez sobre la noche */

  /* rosa de los cuatro rumbos (marca) */
  --p-rumbo-norte: #FFFFFF;
  --p-rumbo-oeste: #4C4B50;
  --p-rumbo-este: #FE5353;
  --p-rumbo-sur: #FFFE53;

  /* ════════════ 2. semánticos ════════════ */

  --fondo: var(--p-blanco);
  --lienzo: var(--p-gris-25);               /* vistas de herramienta, bajo las superficies */
  --superficie: var(--p-blanco);            /* paneles, cifras, tabla, listas emergentes */
  --fondo-banda: var(--p-gris-25);
  --fondo-sutil: var(--p-gris-50);
  --fondo-esqueleto: var(--p-gris-100);
  --texto: var(--p-tinta);                  /* 17,84:1 sobre blanco */
  --texto-2: var(--p-tinta-2);              /* 10,17:1 */
  --texto-3: var(--p-tinta-3);              /*  6,26:1; 5,72:1 sobre gris 50 */
  --filete: var(--p-gris-300);              /* decorativo */
  --filete-suave: var(--p-gris-200);
  --borde-control: var(--p-gris-600);       /* 5,39:1 ≥ 3:1 (WCAG 1.4.11) */
  --accion: var(--p-accion-600);            /* solo enlaces, botones y selección (8,14:1) */
  --accion-hover: var(--p-accion-700);
  --accion-suave: var(--p-accion-50);
  --accion-sobre: var(--p-blanco);
  --foco: var(--p-foco);
  --error: var(--p-rojo-700);               /* solo errores del sistema */
  --error-suave: var(--p-rojo-50);
  --aviso: var(--p-ambar-700);              /* avisos de calidad del dato (5,43:1) */
  --aviso-suave: var(--p-ambar-50);
  --sin-dato-trazo: var(--p-tinta-3);       /* trama de «sin dato» */
  --no-aplica-punto: var(--p-tinta-3);      /* puntos de «no aplica» (§4.5; F3) */
  --no-aplica-fondo: var(--p-blanco);
  --pendiente-trazo: var(--p-gris-500);     /* contorno de lo pendiente de publicación oficial */
  --sobre-oscuro: var(--p-blanco);
  --sobre-velo: var(--p-blanco);
  --sobre-velo-2: var(--p-sobre-velo-2);
  --velo: linear-gradient(to top, rgb(var(--p-velo) / .80) 0%, rgb(var(--p-velo) / .74) 58%, rgb(var(--p-velo) / .28) 100%);
  --fondo-oscuro: var(--p-tinta);
  --linea-fondo: var(--p-blanco);           /* línea superior */
  --linea-borde: var(--p-gris-200);
  --fase-texto: var(--p-tinta);             /* «Demostración» */
  --fase-borde: var(--p-tinta);
  --tooltip-fondo: var(--p-tinta);          /* nombre emergente del carril */
  --tooltip-texto: var(--p-blanco);
  --fila-activa: var(--p-accion-50);        /* buscador: opción activa */
  --mark-subrayado: var(--p-accion-600);    /* buscador: coincidencia */
  --scrim: rgb(var(--p-sombra) / .45);      /* fondo del cajón */
  --sombra-flotante: 0 1px 2px rgb(var(--p-sombra) / .12), 0 6px 16px rgb(var(--p-sombra) / .14);
  --carril-fondo: var(--p-gris-25);
  --carril-borde: var(--p-gris-200);
  --carril-texto: var(--p-tinta-2);         /* 9,66:1 */
  --carril-hover: var(--p-gris-100);
  --carril-activo-fondo: var(--p-accion-50);
  --carril-activo-texto: var(--p-accion-700);  /* 9,39:1 */
  --carril-activo-marca: var(--p-accion-600);  /* 7,73:1 frente al carril */
  --marca-trazo: var(--p-tinta);

  /* escalas de datos: 7 clases (D-6). Con 5 clases se usan las posiciones 0, 2, 4, 5 y 6 */
  --dif-n3: var(--p-dif-n3);
  --dif-n2: var(--p-dif-n2);
  --dif-n1: var(--p-dif-n1);
  --dif-p1: var(--p-dif-p1);
  --dif-p2: var(--p-dif-p2);
  --dif-p3: var(--p-dif-p3);
  --dif-p4: var(--p-dif-p4);
  --len-0: var(--p-len-0);
  --len-1: var(--p-len-1);
  --len-2: var(--p-len-2);
  --len-3: var(--p-len-3);
  --len-4: var(--p-len-4);
  --len-5: var(--p-len-5);
  --len-6: var(--p-len-6);
  --ofe-0: var(--p-ofe-0);
  --ofe-1: var(--p-ofe-1);
  --ofe-2: var(--p-ofe-2);
  --ofe-3: var(--p-ofe-3);
  --ofe-4: var(--p-ofe-4);
  --ofe-5: var(--p-ofe-5);
  --ofe-6: var(--p-ofe-6);
  --asi-0: var(--p-asi-0);
  --asi-1: var(--p-asi-1);
  --asi-2: var(--p-asi-2);
  --asi-3: var(--p-asi-3);
  --asi-4: var(--p-asi-4);
  --asi-5: var(--p-asi-5);
  --asi-6: var(--p-asi-6);
  --neutro-1: var(--p-neutro-1);
  --neutro-2: var(--p-neutro-2);
  --neutro-3: var(--p-neutro-3);
  --neutro-4: var(--p-neutro-4);
  --neutro-5: var(--p-neutro-5);
  --oferta-texto: var(--p-ofe-texto);       /* cuadrado y cifra de oferta en el tramo (9,51:1) */
  --poblacion-texto: var(--p-tinta);        /* punto y cifra de población en el tramo */

  /* idiomas (una sola paleta en el mapa, la ficha y el reporte) */
  --idioma-chuj: var(--p-idioma-chuj);
  --idioma-qanjobal: var(--p-idioma-qanjobal);
  --idioma-akateko: var(--p-idioma-akateko);
  --idioma-popti: var(--p-idioma-popti);
  --idioma-mam: var(--p-idioma-mam);
  --idioma-tektiteko: var(--p-idioma-tektiteko);
  --idioma-awakateko: var(--p-idioma-awakateko);
  --idioma-ixil: var(--p-idioma-ixil);
  --idioma-sipakapense: var(--p-idioma-sipakapense);
  --idioma-uspanteko: var(--p-idioma-uspanteko);
  --idioma-kiche: var(--p-idioma-kiche);
  --idioma-kaqchikel: var(--p-idioma-kaqchikel);
  --idioma-tzutujil: var(--p-idioma-tzutujil);
  --idioma-achi: var(--p-idioma-achi);
  --idioma-sakapulteko: var(--p-idioma-sakapulteko);
  --idioma-qeqchi: var(--p-idioma-qeqchi);
  --idioma-poqomchi: var(--p-idioma-poqomchi);
  --idioma-poqomam: var(--p-idioma-poqomam);
  --idioma-chorti: var(--p-idioma-chorti);
  --idioma-mopan: var(--p-idioma-mopan);
  --idioma-itza: var(--p-idioma-itza);
  --idioma-garifuna: var(--p-idioma-garifuna);
  --idioma-xinka: var(--p-idioma-xinka);
  --idioma-chalchiteko: var(--p-chalchiteko);
  --idioma-espanol: var(--p-esp);
  --idioma-otro: var(--p-gris-300);         /* inglés, otro idioma, señas, no habla */

  /* cartografía */
  --mapa-fondo: var(--p-blanco);
  --mapa-borde: var(--p-blanco);            /* límites municipales: blanco de 1 px sobre los rellenos */
  --mapa-trazo: var(--p-tinta-3);
  --mapa-realce: var(--p-tinta);
  --mapa-depto: var(--p-tinta-2);           /* límites departamentales */
  --mapa-agua: var(--p-agua);
  --territorio-trazo: var(--p-tinta-2);     /* contorno de territorios SEGEPLAN */
  --relieve-opacidad: 1;

  --rumbo-norte: var(--p-rumbo-norte);
  --rumbo-oeste: var(--p-rumbo-oeste);
  --rumbo-este: var(--p-rumbo-este);
  --rumbo-sur: var(--p-rumbo-sur);

  /* tipografía (§4.8): Alegreya 500 solo en topónimos y en el título de la obra;
     Alegreya Sans en lo demás. Mínimo de 14 px fuera del mapa. */
  --fuente-ui: "Alegreya Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --fuente-titulo: "Alegreya", Georgia, serif;
  --t-nota: 0.875rem;        /* 14 · 1.45 */
  --t-control: 1rem;         /* 16 · 1.4 */
  --t-cuerpo: 1.0625rem;     /* 17 · 1.55 */
  --t-entradilla: 1.25rem;   /* 20 · 1.45 */
  --t-h3: 1.25rem;           /* 20 · 1.3 */
  --t-h2: 1.625rem;          /* 26 · 1.25 */
  --t-h1: 2rem;              /* 32 · 1.15, Sans 700 (antes 36 px) */
  --t-obra: 2.25rem;         /* 36: título de la obra en la portada (Alegreya 500) */
  --t-cifra: 2.5rem;         /* 40 · 1.0 */
  --t-cifra-s: 1.75rem;      /* 28 · 1.05 */
  --t-toponimo: 3.5rem;      /* 56 · 1.05 */
  --t-mapa-depto: 12px;
  --t-mapa-territorio: 13px;
  --t-mapa-municipio: 12px;
  --i-nota: 1.45;
  --i-control: 1.4;
  --i-cuerpo: 1.55;
  --i-entradilla: 1.45;
  --i-h3: 1.3;
  --i-h2: 1.25;
  --i-h1: 1.15;
  --i-cifra: 1;
  --i-cifra-s: 1.05;
  --i-toponimo: 1.05;
  --peso-h1: 700;
  --tracking-h1: -0.01em;

  /* rejilla, espacio y filetes */
  --ancho: 1232px;
  --ancho-texto: 66ch;
  --ancho-prosa: 72ch;
  --gutter: 24px;
  --e-0: 2px;
  --e-1: 4px;
  --e-2: 8px;
  --e-3: 12px;
  --e-4: 16px;
  --e-5: 24px;
  --e-6: 32px;
  --e-7: 48px;
  --e-8: 64px;
  --e-9: 96px;
  --filete-fino: 1px solid var(--p-gris-300);
  --filete-tabla: 1px solid var(--p-gris-200);
  --filete-cuadro: 2px solid var(--p-tinta);
  --filete-marca: 4px solid var(--p-accion-600);

  /* forma (§4.7) */
  --radio-etiqueta: 4px;     /* «Demostración», tecla, sello */
  --radio-control: 6px;      /* botones, campos, ítems del carril, nombre emergente */
  --radio-superficie: 8px;   /* superficies, avisos, listas emergentes */
  --duracion-corta: 120ms;   /* color y fondo al pasar */
  --duracion-media: 160ms;   /* ancho del carril */
  --curva: cubic-bezier(.2, 0, 0, 1);

  /* foco y objetivos táctiles */
  --foco-anillo: 3px solid var(--foco);
  --foco-interior: inset 0 0 0 2px var(--texto);
  --foco-enlace-barra: 0 4px var(--texto);
  --tactil: 44px;
  --tactil-escritorio: 32px;
  --objetivo-minimo: 24px;   /* WCAG 2.5.8: alto mínimo de un enlace suelto */

  /* ════════════ 3. componente ════════════ */

  /* armazón v3 (§4.4) */
  --carril-ancho-plegado: 56px;
  --carril-ancho-desplegado: 240px;
  --carril-ancho: var(--carril-ancho-plegado);
  --carril-item-alto: 44px;
  --carril-item-margen: 6px;
  --carril-icono: 20px;
  --carril-marca-alto: 48px;
  --carril-barra-activa: 3px;
  --carril-barra-alto: 24px;
  --carril-barra-radio: 0 2px 2px 0;
  --carril-item-relleno: 12px;          /* icono en x = 18 (6 de margen + 12) */
  --carril-item-hueco: 14px;            /* nombre en x = 52 */
  --carril-marca-relleno: 14px;         /* glifo en x = 14; texto en x = 54 */
  --menu-relleno: 10px;
  --carril-glifo: 28px;
  --linea-alto: 48px;
  --barra-movil-alto: 56px;
  --buscador-ancho: 320px;              /* 360 px desde 1536 px */
  --buscador-alto: 40px;
  --buscador-movil-alto: 48px;
  --resultados-ancho-min: 420px;
  --resultados-alto-max: 60vh;
  --fase-alto: 28px;
  --cajon-ancho: min(320px, 85vw);
  --cajon-item-alto: 48px;
  --emergente-alto: 30px;
  --emergente-retardo: 400ms;
  --emergente-separacion: 6px;
  --filtros-alto: 56px;
  --segmentado-alto: 44px;
  --lamina-alto: 420px;                 /* C-11 aprobado (RF-29 §8.1): desde 1280 px el contenido ya mide 421, el dvh nunca decidía */
  --kbd-alto: 24px;
  --mark-peso: 700;
  --mark-subrayado-grosor: 2px;
  --mark-subrayado-separacion: 3px;
  --separador-migas: 12px;
  --icono-tamano: 20px;

  --boton-primario-fondo: var(--accion);
  --boton-primario-texto: var(--accion-sobre);
  --boton-primario-borde-inferior: var(--p-accion-700);
  --boton-secundario-borde: var(--accion);
  --boton-secundario-texto: var(--accion);
  --boton-alto: 40px;
  --tabla-cabecera-fondo: var(--fondo);
  --tabla-cabecera-filete: 2px solid var(--texto);
  --tabla-fila-filete: 1px solid var(--filete-suave);
  --tabla-fila-alto: 44px;
  --tabla-trama: 8px;                   /* casilla de «Sin dato» en una celda (§4.2, /municipios) */
  --tabla-municipio-ancho: 10.5em;       /* primera columna de /municipios, fija al desplazar */
  --tabla-municipio-ancho-movil: 8.5em; /* a 390 px deja ver dos columnas más junto a la fija */
  --tabla-avisos-ancho: 6.5em;
  --tabla-nota-pendiente-ancho: 14em;
  --tabla-municipios-cabecera-alto: 8rem; /* cabecera de cuatro líneas: margen al desplazar con el foco */
  --tabla-municipios-total-alto: 6rem;    /* total con tres líneas de avisos */
  --tabla-municipios-cabecera-max: 7.5em; /* 10 columnas en los 1 232 px del contenido a 1366 */
  /* Gráfico de tramos de /municipios (ECharts; los lee GraficoTramos.jsx con getComputedStyle). */
  --tramos-fila: 32px;
  --tramos-arriba: 32px;                /* eje de 0 a 100 % arriba */
  --tramos-abajo: 8px;
  --tramos-nombres: 300px;              /* número, municipio y departamento */
  --tramos-nombres-movil: 128px;        /* solo número y municipio */
  --tramos-valor-movil: 72px;
  --tramos-estrecho: 600px;             /* por debajo, sin departamento */
  --tramos-valor: 88px;                 /* diferencia a la derecha («+79.2 pp») */
  --tramos-separacion: 16px;
  --tramos-numero: 24px;
  --tramos-letra: 14px;
  --tramos-apilado: 720px;              /* por debajo, el nombre va encima de cada tramo (RF-29 §7.4) */
  --tramos-fila-apilada: 52px;          /* nombre de 20 + tramo de 24 + 8 de aire */
  --tramos-nombre-apilado: 20px;
  --tramos-tramo-apilado: 24px;
  --tramos-aire-apilado: 8px;
  --cifra-tamano: var(--t-cifra);
  --cifra-nota-color: var(--texto-3);
  --cifra-filete: 3px solid var(--texto);   /* tarjeta de cifra (C-4) */
  --tramo-poblacion: var(--poblacion-texto);
  --tramo-oferta: var(--oferta-texto);
  --tramo-dif-pos: var(--dif-p4);           /* corrige la v2 (p3 y n2 daban 2,79:1 y 2,03:1) */
  --tramo-dif-neg: var(--dif-n3);
  --tramo-pendiente: var(--p-gris-500);
  --tramo-eje: var(--filete);
  --tramo-poblacion-oscuro: var(--p-blanco);
  --tramo-oferta-oscuro: var(--p-ofe-1);
  --leyenda-casilla: 16px;
  --leyenda-marcador: var(--texto);
  /* lámina municipal (F2, C-11). El texto de la portada va sobre su propio velo de 0,88: con el
     píxel más claro posible de la foto (blanco) da 9,2:1 para --p-ofe-1, 10,4:1 para --sobre-velo-2
     y 14,5:1 para el blanco (criterio F2: ≥ 9:1). La foto conserva solo un tinte suave fuera del texto. */
  --velo-lamina: linear-gradient(to top, rgb(var(--p-velo) / .30), rgb(var(--p-velo) / .10));
  --velo-lamina-texto: rgb(var(--p-velo) / .88);
  --velo-lamina-fundido: var(--e-8);
  --lamina-texto-ancho: calc((var(--ancho) - 11 * var(--gutter)) / 12 * 7 + 6 * var(--gutter));   /* 7 columnas */
  --lamina-foto-movil: 144px;           /* franja de foto visible sobre el texto en móvil */
  --lamina-alto-movil: 360px;           /* C-11: alto automático en móvil, con este mínimo */
  --lamina-silueta-ancho: 36%;          /* portada sin foto: silueta a la derecha del texto */
  --lamina-credito-ancho: 40ch;
  --lamina-foto-proporcion: 3 / 2;      /* foto impresa de 60 mm */
  --comparacion-cifra-ancho: 4.5em;
  --conteo-columna: 15em;
  --establecimiento-nombre-min: 14em;   /* tabla de la lámina en móvil: el nombre no se estrecha */
  --tabla-movil-alto-max: 70vh;         /* y la tabla se desplaza dentro de su caja */
  --lamina-foto-impresa: 60mm;
  --impresion-raiz: 75%;                /* lámina impresa: raíz de 12 px, todo lo que va en rem se reduce igual */
  --lamina-indice-ancho: 200px;
  --lamina-filete-oscuro: 1px solid var(--p-tinta-3);
  --lamina-silueta-trazo: var(--p-gris-600);
  --esqueleto-oscuro: var(--p-tinta-2);   /* bloques del esqueleto sobre el velo */
  --esqueleto-portada: var(--p-gris-200); /* bloques del esqueleto sobre el gris de la portada sin datos */
  --tramo-ficha-alto: 56px;
  --tramo-eje-oscuro: var(--p-gris-500);
  --tramo-dif-pos-oscuro: var(--dif-p2);
  --tramo-dif-neg-oscuro: var(--dif-n2);
  --tramo-pendiente-oscuro: var(--p-gris-300);
  --trama-sin-dato: repeating-linear-gradient(45deg, var(--sin-dato-trazo) 0 1px, transparent 1px 4px);
  --territorio-alto: 280px;
  --ficha-termino-ancho: 13em;          /* «Sobre este dato»: columna de los términos */
  --comparacion-nombre-ancho: 13em;
  --aviso-calidad-barra: 4px solid var(--aviso);
  --aviso-calidad-fondo: var(--aviso-suave);
  --panel-mapa-ancho: 360px;

  /* /mapa (F3, dirección §6.1 y §5.7). MapLibre los lee con getComputedStyle. */
  --mapa-bilingue: var(--oferta-texto);       /* establecimiento bilingüe registrado: círculo lleno */
  --mapa-no-bilingue: var(--p-gris-600);      /* sin modalidad bilingüe: círculo hueco */
  --mapa-agrupacion: var(--p-gris-600);       /* agrupación a zoom < 8 (relleno al 30 %) */
  --mapa-dudosa: var(--aviso);                /* rombo de ubicación dudosa */
  --mapa-halo: var(--p-blanco);               /* halo de los rótulos ×n y «n est.» */
  --mapa-control-fondo: var(--superficie);
  --mapa-control-hover: var(--fondo-sutil);
  --mapa-control-borde: var(--borde-control); /* 5,39:1: H-05, WCAG 1.4.11 */
  --mapa-control-alto: 36px;                  /* 44 px (--tactil) en pantallas táctiles y por debajo de 1024 */
  --opcion-alto: 52px;                        /* radio de «Qué ver»: nombre de 16 px y una línea de 14 px */
  --leyenda-hueco-cero: 4px;                  /* hueco en el 0 de la escala divergente */
  --leyenda-muestra: 12px;                    /* casillas de la leyenda categórica y de las claves */
  --hoja-baja: 96px;                          /* hoja inferior de /mapa en móvil: tres alturas */
  --hoja-media: 50%;
  --hoja-alta: 90%;
  --hoja-asa: 44px;
  --hoja-agarre-ancho: 32px;
  --hoja-agarre-alto: 4px;
  --previa-ancho: 380px;
  --logo-alto: 44px;
  --esqueleto-pulso: 1.2s;
  --esqueleto-bloque: 240px;
  --mapa-portada-proporcion: 600 / 633;     /* figura del mapa de la portada */
  --respuesta-lineas: 5;                    /* entradilla con la respuesta corta de la portada */
  --hoja-carta-ancho: 216mm;
  --banda-prueba-fondo: var(--p-ambar-50);
  --banda-prueba-borde: 4px solid var(--aviso);

  /* portada con relato (T-024, boceto 11). Fondo de noche; MapLibre lee los de mapa con getComputedStyle. */
  --portada-fondo: var(--p-noche);
  --portada-fondo-rgb: var(--p-noche-rgb);
  --portada-superficie: var(--p-noche-2);
  --portada-superficie-2: var(--p-noche-3);
  --portada-filete: var(--p-noche-filete);
  --portada-borde: var(--p-noche-borde);
  --portada-control: var(--p-noche-control);
  --portada-texto: var(--p-noche-texto);
  --portada-texto-fuerte: var(--p-blanco);
  --portada-texto-2: var(--p-noche-texto-2);
  --portada-texto-3: var(--p-noche-texto-3);
  --portada-accion: var(--p-accion-200);
  --portada-oferta: var(--p-oferta-noche);
  --portada-alerta: var(--p-dif-p2);
  --portada-claro: var(--p-gris-25);         /* «Detrás del mapa» */
  --portada-claro-filete: var(--p-gris-200);
  --portada-boton-fondo: var(--p-blanco);
  --portada-boton-texto: var(--p-tinta);
  --portada-boton-hover: var(--p-noche-borde-mapa);
  --portada-tarjeta: rgb(var(--p-noche-rgb) / .94);
  --portada-velo: linear-gradient(90deg, rgb(var(--p-noche-rgb) / .94) 0%, rgb(var(--p-noche-rgb) / .86) 36%, rgb(var(--p-noche-rgb) / .35) 52%, rgb(var(--p-noche-rgb) / 0) 64%);
  --portada-velo-movil: linear-gradient(to top, rgb(var(--p-noche-rgb) / 1) 0%, rgb(var(--p-noche-rgb) / 0) 28%);
  --portada-barra-velo: linear-gradient(rgb(var(--p-noche-rgb) / 1) 0%, rgb(var(--p-noche-rgb) / 0) 100%);
  --portada-mapa-fondo: var(--p-noche);
  --portada-mapa-sin: var(--p-noche-sin);
  --portada-mapa-sin-dato: var(--p-noche-mapa);
  --portada-mapa-horizonte: var(--p-noche-horizonte);
  --portada-mapa-sombra: var(--p-noche-sombra);
  --portada-mapa-luz: var(--p-noche-luz);
  --portada-mapa-borde: var(--p-noche-borde-mapa);
  --portada-mapa-realce: var(--p-blanco);
  --portada-mapa-bilingue: var(--p-oferta-noche);
  --portada-mapa-no-bilingue: var(--p-gris-500);
  /* rampa de niñez sobre la noche: más clara, mayor proporción (5 clases, cortes del contrato) */
  --portada-len-0: var(--p-len-noche);
  --portada-len-1: var(--p-len-5);
  --portada-len-2: var(--p-len-4);
  --portada-len-3: var(--p-len-2);
  --portada-len-4: var(--p-len-0);
  --portada-barra-alto: 60px;
  --portada-barra-alto-movil: 56px;
  --portada-mapa-alto-movil: 42svh;          /* el mapa arriba; el relato sube debajo */
  --portada-tarjeta-ancho: 470px;
  --portada-tarjeta-ancha: 560px;
  --portada-margen-relato: 56px;             /* deja sitio al índice de capítulos */
  --portada-indice-punto: 10px;
  --portada-ficha-ancho: 290px;
  --portada-ficha-separacion: 18px;
  --portada-chip-alto: 36px;                 /* 44 px (--tactil) en pantallas táctiles */
  --portada-boton-alto: 46px;
  --portada-logo-mineduc: 50px;
  --portada-logo-digebi: 34px;
  --portada-logo-umg: 66px;
  --portada-logo-movil: 36px;
  --portada-fundido: 600ms;                  /* del póster al mapa; 0 con movimiento reducido */
  --portada-inclinacion: 38deg;              /* póster: inclinación que imita la cámara del inicio */
  --portada-giro: 12deg;
  --portada-radio-hoja: 12px;
  --portada-t-titulo: clamp(2.75rem, 5.4vw, 4.75rem);   /* Alegreya 500: el título de la obra */
  --portada-t-titulo-movil: 2.25rem;
  --portada-t-capitulo: clamp(2rem, 3.2vw, 2.75rem);
  --portada-t-capitulo-movil: 1.75rem;
  --portada-t-cifra: 2.125rem;
  --portada-t-cifra-movil: 2rem;
  --portada-t-nombre: 1.0625rem;             /* nombre del municipio en la ficha y de los accesos */
  --portada-t-detras: 1.1875rem;
  --portada-i-titulo: 1.02;
  --portada-i-capitulo: 1.08;
  --portada-tracking-etiqueta: .06em;
  --portada-idioma-nombre: 7.5rem;           /* columna del nombre en la lista de idiomas */
  --portada-idioma-nombre-movil: 6.5rem;
  --portada-muestra: 10px;                   /* puntos de color, barras de idioma y claves */
  --portada-rampa-alto: 12px;
  --portada-icono-detras: 40px;
  --portada-ficha-min: 230px;
  --portada-envoltura: calc(var(--ancho) - 2 * var(--gutter) - var(--e-1));
  --portada-poster-alto: min(84%, 46vw);
  --portada-poster-alto-movil: 94%;
  --portada-perspectiva: 1400px;
  --portada-perspectiva-movil: 900px;
  --portada-inclinacion-movil: 23deg;
  --portada-rebote: 2.2s;                    /* la flecha de «Desplácese» */

  /* herramientas de RF-29 (dirección RF-29 §5.3) */
  --herramientas-alto: 40px;                 /* 44 px por debajo de 1024 y en pantallas táctiles */
  --herramientas-activo-fondo: var(--accion-suave);
  --herramientas-activo-texto: var(--accion);
  --herramientas-activo-marca: 3px solid var(--accion);
  --herramientas-hueco: 6px;                 /* entre el icono de 20 px y el rótulo */
  --herramientas-arriba: calc(var(--e-4) + var(--herramientas-alto) + var(--e-2));   /* lo que queda bajo la barra: 64 px */
  --herramientas-menu-ancho: 130px;          /* «Herramientas» en móvil */
  --herramientas-lista-ancho: 260px;
  --herramientas-item-alto: 48px;
  --respaldo-enlace-ancho: 400px;            /* «Copie el enlace» bajo la barra */
  --panel-medir-ancho: 320px;
  --cruz-tamano: 40px;
  --cruz-trazo: var(--texto);
  --cruz-halo: var(--fondo);
  --medicion-linea: var(--texto);
  --medicion-casco: var(--fondo);
  --medicion-relleno: rgb(var(--p-sombra) / .12);
  --dialogo-ancho: 640px;
  --dialogo-imagen-ancho: 560px;
  --vista-previa-ancho: 512px;               /* 512 × 384, 4:3 */
  --contexto-impreso-ancho: 62mm;
  --contexto-impreso-alto: 46mm;
  --contexto-recuadro: 18mm;
  --contexto-municipio: var(--texto);
  --contexto-departamento: var(--p-gris-100);
  --contexto-pais: var(--p-gris-200);
  --contexto-departamento-en-pais: var(--texto-3);
  --cabecera-impresa-logo: 46px;

  /* ════════════ transición (de F1 a F2–F6) ════════════
     Nombres que el CSS de F1 trasladado con las vistas (css/*.css) todavía usa.
     Apuntan a los tokens v3 y se retiran cuando F2–F6 rehagan cada vista.
     Los de la cabecera y la banda de F1 se retiraron en M1-d. */
  --nav-subrayado: 4px;
  --buscador-grande-alto: 60px;
  --resultados-ancho: 400px;
  --no-aplica: var(--p-gris-50);            /* relleno liso de «no aplica» hasta F3 (puntos, §4.5) */
  --papel: var(--fondo);
  --superficie-2: var(--fondo-sutil);
  --superficie-3: var(--fondo-esqueleto);
  --linea: var(--filete);
  --linea-suave: var(--filete-suave);
  --tinta: var(--texto);
  --tinta-2: var(--texto-2);
  --tinta-3: var(--texto-3);
  --alerta: var(--error);
  --alerta-suave: var(--error-suave);
  --bil: var(--oferta-texto);
  --mono: var(--p-gris-500);
  --sin-dato: var(--p-gris-300);
  --radio: var(--radio-control);
  --t-xs: var(--t-nota);
  --t-s: var(--t-control);
  --t-m: var(--t-cuerpo);
  --t-l: var(--t-h2);
  --t-xl: var(--t-cifra-s);
  --t-xxl: var(--t-h1);
}

@media (min-width: 1536px) {
  :root { --buscador-ancho: 360px; }
  /* Modo fijo: desplegado salvo que la persona lo haya plegado (estado-carril.js, antes de pintar). */
  html:not([data-carril="plegado"]) { --carril-ancho: var(--carril-ancho-desplegado); }
}

/* Pantallas táctiles y por debajo de 1024 px: los controles del mapa llegan a 44 px (RF-29 §5.1). */
@media (max-width: 1023px), (pointer: coarse) {
  :root { --mapa-control-alto: var(--tactil); --herramientas-alto: var(--tactil); --portada-chip-alto: var(--tactil); }
}

@media (max-width: 720px) {
  :root {
    --t-toponimo: 2.5rem;
    --t-h1: 1.75rem;
    --t-obra: 1.75rem;
    --t-cifra: 2rem;
    --respuesta-lineas: 9;
    --gutter: 16px;
    --velo: linear-gradient(rgb(var(--p-velo) / .76), rgb(var(--p-velo) / .76));
  }
}

@media (prefers-reduced-motion: reduce) {
  :root { --duracion-corta: 0ms; --duracion-media: 0ms; --portada-fundido: 0ms; }
}