/* ══════════════════════════════════════════════════════════════════════════
   RECO-LAB · CORRECCION FINAL DE PUBLICACION · 4 SEP 2026 (pasada b)
   Decimosexta capa. Se carga LA ULTIMA, despues de
   `owner-correction-2026-09-04.css`. Retirar la linea que la carga revierte
   esta pasada entera y deja intacto todo lo anterior.

   ALCANCE. Cinco puntos de la revision visual del propietario. Ninguno toca
   datos, formulas, umbrales, pesos, rankings, cifras ni clasificacion:
   IVUB, HAR, UPI y FAI quedan exactamente como estaban. No se introduce
   ningun color, familia tipografica, escala de espaciado ni patron de
   interaccion nuevo: todo sale de los tokens y de las capas anteriores.

     §1  Salida del mapa · franja propia fuera del area de mapa.
     §2  Par de retornos · vuelve a una sola linea en escritorio.
     §3  Cierre Aliyah/retornos · titulo en negrita y parrafos separados.
     §4  HAR · la caja compensa el aire nuevo del encabezado.
   ══════════════════════════════════════════════════════════════════════════ */


/* ══ §1 · SALIDA DEL MAPA · ZONA PROPIA ═══════════════════════════════════
   MEDIDO 4 Sep 2026 sobre el mapa IVUB del Proyecto 01, el que se lee ANTES
   del dashboard, a 1440px.

   La salida "Bloquear mapa · seguir leyendo" se dibujaba dentro del mapa en
   `top:10px; right:10px`, ocupando 1168-1352 x 10-50. El selector de capas
   de Leaflet -- Calles, Base clara, IVUB, Etiquetas territoriales -- vive en
   `leaflet-top leaflet-right`: su conmutador cae en 1349,10 y desplegado
   ocupa 1176-1349 x 120-229. Los dos controles se montaban uno sobre otro.

   Mudar la salida a otra esquina solo cambia de victima. Medido en las cinco
   figuras con guarda, no queda ninguna esquina libre en todas ellas:

     P01 mapa IVUB ..... capas arriba-dcha · escala arriba-izq ·
                         LEYENDA `.tf-legend` abajo-izq (22-276 x 584-738) ·
                         zoom y atribucion abajo-dcha
     P01 serie animada . zoom izq. medio · atribucion abajo-centro
     P02 Aliyah ........ zoom arriba-izq · capas arriba-dcha · atrib. abajo-dcha
     P02 retornos ...... zoom arriba-izq · capas arriba-dcha · atrib. abajo-dcha
     P02 destino ....... zoom arriba-izq · atribucion abajo-dcha

   Asi que la salida sale del area de mapa. Su zona propia es una franja
   inmediatamente DEBAJO del marco, que no comparte con nadie. La franja se
   dibuja siempre y reserva su alto, de modo que activar o bloquear el mapa no
   desplaza la pagina bajo el cursor: lo que cambia es la visibilidad del
   boton, no el flujo del documento. Ni el selector de capas ni la leyenda ni
   la atribucion se ocultan ni cambian de tamano. */
/* Franja propia bajo los marcos de bloque. */
.rl-mapbar{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  min-height:40px;
  margin-top:8px;
}

/* `.rl-pair-col` es un subgrid de cinco pistas heredadas de `.rl-pair`: un
   hijo mas no abre pista nueva, se superpone al enlace de la ultima. En el
   par, por tanto, la franja ENVUELVE el enlace "Abrir mapa interactivo" y
   ocupa su misma pista: enlace a la izquierda, salida a la derecha, y los dos
   envuelven en vez de pisarse cuando la columna se estrecha. El enlace es un
   <a>, asi que la salida va a su lado y nunca dentro. */
.rl-mapbar-pair{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  min-height:0;
  margin-top:0;
}

/* El boton deja de ser una capa flotante sobre el mapa y pasa a ocupar su
   sitio en la franja. Conserva su dress -- forma, color, tipografia, sombra --
   de `polish-2026-09-01.css`; lo que cambia es el posicionamiento.
   `visibility` en lugar de `display` mantiene el hueco reservado, de modo que
   activar o bloquear el mapa no mueve la pagina bajo el cursor. */
.rl-mapbar-host > .rl-maprelease{
  position:static;
  display:inline-flex;
  visibility:hidden;
  right:auto; top:auto; bottom:auto; left:auto;
}

.rl-mapbar-host.is-live > .rl-maprelease{
  visibility:visible;
}

@media (max-width:640px){
  .rl-mapbar{ min-height:36px; margin-top:6px; }
  .rl-mapbar-host > .rl-maprelease{
    font-size:12px;
    padding:7px 13px;
    min-height:34px;
  }
}


/* ══ §2 · PAR DE RETORNOS · UNA SOLA LINEA EN ESCRITORIO ══════════════════
   "Retornos por país y año" y "Ranking acumulado · 2021–2024" son dos
   paneles de un mismo `.rl-fig-duo`, y su propio subtitulo los describe
   como "a la izquierda" y "a la derecha". `qa-final-2026-08-16.css` los
   apilaba por debajo de 1340px de VIEWPORT, de modo que un portatil de
   1280 o 1366 los recibia uno debajo del otro.

   El limite real es de legibilidad, no de gusto. Los dos lienzos miden 680
   y 524 unidades; con el reparto 1,12fr / 0,88fr, el padding de 14px del
   contenedor, el hueco de 14px y los 24px de padding lateral de cada panel,
   la escala de dibujo cae por debajo de 0,88 -- el piso que esta misma
   figura ya usa cuando se apila -- cuando el ancho de contenido baja de
   ~1200px, es decir un viewport de ~1280px.

   Ese, y no 1340, es el punto de apilado. Por encima van lado a lado; por
   debajo se apilan con el mismo filete horizontal y el mismo desplazamiento
   interno que ya definia `release-final-2026-08-30.css`. No cambia ni un
   dato, ni una barra, ni una etiqueta de los dos graficos. */
@media (min-width:1280px){
  .rl-fig-duo{
    grid-template-columns:1.12fr 0.88fr !important;
  }
}


/* ══ §3 · CIERRE ALIYAH / RETORNOS · JERARQUIA DEL BLOQUE ═════════════════
   `.rl-read-tight p` llega con `margin:0` de `v3-reco-lab.css`, de modo que
   los tres parrafos del cierre se leian como un unico bloque corrido y su
   primera linea -- que es la conclusion -- no se distinguia del cuerpo.

   La primera linea pasa a funcionar como titulo del cierre y los parrafos
   reciben separacion visible. Sigue siendo el mismo texto, la misma familia
   serif y el mismo color de tinta: solo cambia el peso y el aire. */
.rl-read-tight.is-closing-note .rl-read-lead{
  font-weight:600;
  color:var(--ink);
  margin-bottom:14px;
}

/* Acotado a ESTE cierre: los demas `.rl-read-tight` del sitio ya pasaron
   QA con su interlineado actual y no se tocan. */
.rl-read-tight.is-closing-note p + p{
  margin-top:16px;
}

/* El parrafo guia ya aporta su propio margen inferior; sumar el del
   hermano lo dejaria al doble de aire que la separacion entre cuerpos. */
.rl-read-tight.is-closing-note .rl-read-lead + p{
  margin-top:0;
}


/* ══ §4 · HAR · LA CAJA COMPENSA EL AIRE NUEVO DEL ENCABEZADO ═════════════
   MEDIDO 4 Sep 2026 a 1440px: el subtitulo terminaba en y=70,1 y la banda
   de anios (2021 / 2023 / 2024) empezaba en y=66,5 -- se solapaban 3,6px.

   La banda de anios va anclada por su BASE al borde superior del area de
   dibujo y mide 23px, de modo que sube o baja con `margin.t`. El titulo, en
   cambio, esta colocado con `title.y:0.97` sobre el CONTENEDOR, asi que se
   desplaza al crecer la caja: medido, media caja de cada pixel. Con el area
   util fija, la separacion resulta ser `0,5 · margin.t - 48,6`, de modo que
   los 12px (0,32 cm) pedidos como MINIMO salen con `margin.t = 124`:
   13,4px medidos.

   Pasa de 78 a 124. Esos 46px saldrian del area de dibujo y encogerian la
   nube de puntos, asi que la caja crece lo mismo y la escala queda intacta:
   726-124-46 = 556px de area util, exactamente los 680-78-46 de antes.

   La caja del HAR no tiene UNA altura: la cascada le da cuatro segun el
   ancho, porque por debajo de 1024px la figura pasa de tres columnas a tres
   filas. Se replica exactamente esa cascada sumando el mismo aire a cada rama,
   de modo que el area de dibujo conserva su tamano en todos los anchos.

     1024-1919 ....  680 -> 726   (v3-reco-lab)
     >=1920 .......  720 -> 766   (responsive-2026-08-29 §7)
     <=1023 ....... 1120 -> 1132  (responsive-2-2026-08-29, figura apilada)
     <=767 ........ 1190 -> 1202  (responsive-2-2026-08-29)

   Por debajo de 1024px la figura se apila y los anios se reanclan al
   dominio de SU panel, de modo que la banda superior ya no los aloja: alli
   el incremento es el de la formula responsive, +12px. */
.rl-embed-body.is-har-head-air{
  height:726px;
}

@media (min-width:1920px){
  .rl-embed-body.is-har-head-air{ height:766px; }
}

/* ── El punto de apilado no es el viewport, es el ancho del propio marco.
   MEDIDO 4 Sep 2026 a un viewport de 1024px: el iframe recibe 964px, de
   modo que su hoja interna (`@media max-width:1023px`, min-height 1080) y
   su `band(g.clientWidth)` apilan la figura en tres filas, mientras que la
   altura de la caja, decidida por el viewport, seguia siendo la de la
   version en tres columnas. El SVG medi­a 1080px dentro de una caja de 726
   con `overflow:hidden`: el corte de 2024 quedaba fuera.

   La caja pasa a decidir su altura con el MISMO ancho que usa la figura,
   consultando el contenedor en lugar del viewport. Asi los dos umbrales
   -- 1024 y 768 -- caen en el mismo sitio y no queda banda muerta ni
   contenido cortado en ningun ancho intermedio. */
.rl-embed:has(> .rl-embed-body.is-har-head-air){
  container-type:inline-size;
  container-name:harfig;
}

/* Las reglas de `responsive-2-2026-08-29.css` para esta misma figura pesan
   (0,2,1) por el `:has(iframe[data-href-es*=...])`. La consulta de
   contenedor no aporta especificidad, asi que el selector se apoya en
   `.rl-embed` para pesar (0,3,0) y decidir el resultado de forma
   deterministica en lugar de por orden de carga. */
@container harfig (max-width:1023px){
  .rl-embed .rl-embed-body.is-har-head-air{ height:1132px; min-height:1132px; }
}

@container harfig (max-width:767px){
  .rl-embed .rl-embed-body.is-har-head-air{ height:1202px; min-height:1202px; }
}