/* Mapa de cobertura Loto: carta celeste de noche con las ciudades encendidas. Toma fuentes de la página si existen. */
.lc-mapa{
  --lm-noche:#0F1840; --lm-noche-2:#16224F; --lm-crema:#F6F5D2; --lm-crema-2:#D8D8C0; --lm-azul:#93A6E2; --lm-loto:#556FB6; --lm-amarillo:#F2C94C;
  --lm-linea:rgba(246,245,210,.42);
  --lm-display:var(--f-display,"Bagel Fat One",system-ui,sans-serif); --lm-body:var(--f-body,"Figtree",system-ui,sans-serif); --lm-mono:var(--f-mono,"DM Mono",ui-monospace,monospace);
  font-family:var(--lm-body);min-width:0
}
.lc-mapa *{box-sizing:border-box}
.lc-mapa :focus-visible{outline:3px solid var(--lm-amarillo);outline-offset:3px}

/* Respaldo sin JS (lo reemplaza mapa.js) */
.lm-respaldo{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));margin:0;padding:0;list-style:none}
.lm-respaldo li{padding:20px;border-radius:14px;background:var(--lm-noche);color:var(--lm-crema);font-size:16px;line-height:1.5}
.lm-respaldo b{display:block;font-size:20px;margin-bottom:4px}

.lm-carta{position:relative;display:grid;grid-template-columns:minmax(0,1fr);background:var(--lm-noche);color:var(--lm-crema);border-radius:18px;overflow:hidden;isolation:isolate}
@media (min-width:900px){.lm-carta{grid-template-columns:minmax(0,1.55fr) minmax(320px,1fr)}}

/* ---- Lienzo ---- */
.lm-lienzo{position:relative;aspect-ratio:5/4;overflow:hidden;background:radial-gradient(120% 90% at 60% 70%,#1B2A66 0,var(--lm-noche) 62%);touch-action:manipulation;user-select:none;-webkit-user-select:none}
@media (min-width:620px){.lm-lienzo{aspect-ratio:3/2}}
@media (min-width:900px){.lm-lienzo{aspect-ratio:auto;min-height:560px;height:100%}}
.lm-svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.lm-svg path,.lm-svg polyline{vector-effect:non-scaling-stroke;stroke-linejoin:round;stroke-linecap:round}
.lm-reticula{fill:none;stroke:rgba(147,166,226,.16);stroke-width:1;stroke-dasharray:2 6}
.lm-edo{fill:rgba(147,166,226,.07);stroke:rgba(246,245,210,.24);stroke-width:.8;transition:fill .3s}
.lm-pais .lm-edo[data-region]{fill:url(#lm-st);stroke:rgba(147,166,226,.75);cursor:pointer}
.lm-pais .lm-edo.lm-on{fill:url(#lm-st-on);stroke:var(--lm-amarillo)}
.lm-zoom .lm-edo{stroke-width:1}
.lm-zoom .lm-edo[data-region]{fill:url(#lm-stz);stroke:rgba(147,166,226,.8);cursor:pointer}
.lm-zoom .lm-edo.lm-on{fill:url(#lm-stz-on);stroke:var(--lm-amarillo);stroke-width:1.5;cursor:default}
.lm-st-base{fill:rgba(85,111,182,.2)} .lm-st-dot{fill:rgba(147,166,226,.55)}
.lm-st-on-base{fill:rgba(85,111,182,.42)} .lm-st-on-dot{fill:rgba(242,201,76,.5)}

/* Capas: el país y cada acercamiento se cruzan durante el viaje */
.lm-pais,.lm-zoom,.lm-lineas polyline{transition:opacity .35s ease}
.lm-zoom{opacity:0;pointer-events:none}
.lm-lienzo[data-capa="centro"] .lm-zoom[data-zoom="centro"],.lm-lienzo[data-capa="oaxaca"] .lm-zoom[data-zoom="oaxaca"]{opacity:1;pointer-events:auto}
.lm-lienzo:not([data-capa="pais"]) .lm-pais{opacity:0;pointer-events:none}
.lm-lineas polyline{fill:none;stroke:var(--lm-amarillo);stroke-width:1.5;opacity:0}
.lm-lienzo:not([data-capa="pais"]) .lm-lineas polyline{opacity:.35}
.lm-lienzo:not([data-capa="pais"]) .lm-lineas polyline.lm-on{opacity:.9}

/* ---- Estrellas (capa HTML: el tamaño no cambia con el acercamiento) ---- */
.lm-marcas{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .4s}
.lm-listo .lm-marcas{opacity:1}
.lm-estrella{position:absolute;left:0;top:0;width:0;height:0;padding:0;margin:0;border:0;background:none;color:var(--lm-crema);font:inherit;cursor:pointer;pointer-events:auto;will-change:transform;-webkit-tap-highlight-color:transparent}
.lm-estrella::before{content:"";position:absolute;left:-14px;top:-14px;width:28px;height:28px;border-radius:50%}
.lm-lienzo:not([data-capa="pais"]) .lm-estrella::before{left:-20px;top:-20px;width:40px;height:40px}
.lm-estrella::after{content:"";position:absolute;left:-20px;top:-20px;width:40px;height:40px;border-radius:50%;background:radial-gradient(closest-side,rgba(242,201,76,.42),rgba(242,201,76,0));pointer-events:none}
.lm-estrella svg{position:absolute;left:-8px;top:-8px;width:16px;height:16px;fill:var(--lm-amarillo);overflow:visible;transform-origin:50% 50%;transition:transform .25s ease;animation:lm-titila 3.2s ease-in-out infinite}
.lm-estrella:nth-child(3n+1) svg{animation-delay:-1.1s} .lm-estrella:nth-child(3n+2) svg{animation-delay:-2.3s}
@keyframes lm-titila{0%,100%{transform:scale(1)}50%{transform:scale(.72)}}
.lm-estrella span{position:absolute;top:0;left:14px;transform:translateY(-50%);white-space:nowrap;font:700 13px/1.2 var(--lm-body);letter-spacing:.01em;color:var(--lm-crema);
  text-shadow:0 0 3px var(--lm-noche),0 0 3px var(--lm-noche),0 0 6px var(--lm-noche),0 0 10px var(--lm-noche);opacity:0;transition:opacity .25s;pointer-events:none}
.lm-estrella[data-lado="izq"] span{left:auto;right:14px}
/* En el país completo solo se nombra la estrella señalada; en los acercamientos, las de la zona elegida
   (las vecinas quedan tenues y se nombran al pasar el puntero) */
.lm-estrella:hover span,.lm-estrella.lm-sel span,.lm-lienzo:not([data-capa="pais"]) .lm-estrella.lm-on span{opacity:1}
.lm-lienzo:not([data-capa="pais"]) .lm-estrella:not(.lm-on) span{color:var(--lm-crema-2)}
.lm-lienzo:not([data-capa="pais"]) .lm-estrella:not(.lm-on) svg{fill:#C9B46A;transform:scale(.8)}
.lm-estrella.lm-sel svg{transform:scale(1.55);animation:none}
.lm-estrella.lm-sel span{font-size:15px}
.lm-estrella.lm-sel::after{animation:lm-pulso 1.8s ease-out infinite}
@keyframes lm-pulso{0%{transform:scale(.6);opacity:1}100%{transform:scale(1.8);opacity:0}}
@media (min-width:620px){.lm-estrella span{font-size:14px}.lm-estrella.lm-sel span{font-size:16px}}

.lm-sello{position:absolute;left:16px;bottom:14px;margin:0;display:grid;gap:4px;font:500 13px/1.2 var(--lm-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--lm-crema-2);pointer-events:none}
.lm-sello-coord{font-variant-numeric:tabular-nums;color:var(--lm-azul)}
.lm-sin-mapa .lm-sello{display:none}
@media (max-width:619px){.lm-sello{display:none}}

/* ---- Panel ---- */
.lm-panel{display:grid;align-content:start;gap:22px;padding:clamp(20px,3vw,32px);border-top:1.5px solid var(--lm-linea);min-width:0}
@media (min-width:900px){.lm-panel{border-top:0;border-left:1.5px solid var(--lm-linea)}}
.lm-vistas{display:flex;flex-wrap:wrap;gap:8px}
.lm-corto{display:none}
@media (max-width:619px){
  .lm-vistas{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
  .lm-vistas button{justify-content:center;padding:0 6px;gap:5px}
  .lm-largo{display:none} .lm-corto{display:inline}
  .lm-vistas .lm-punto{display:none}
}
.lm-vistas button,.lm-ciudades button{display:inline-flex;white-space:nowrap;align-items:center;gap:8px;min-height:44px;padding:0 16px;border-radius:999px;border:1.5px solid var(--lm-linea);background:transparent;color:var(--lm-crema);font:600 16px/1.1 var(--lm-body);cursor:pointer;touch-action:manipulation;transition:background-color .2s,color .2s,border-color .2s}
.lm-vistas button:hover,.lm-ciudades button:hover{border-color:var(--lm-crema)}
.lm-vistas button[aria-pressed="true"]{background:var(--lm-crema);border-color:var(--lm-crema);color:var(--lm-noche)}
.lm-punto{width:9px;height:9px;flex:none;background:var(--lm-amarillo);clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%);transform:scale(1.5)}
.lm-detalle{display:grid;gap:12px;min-width:0}
.lm-eyebrow{margin:0;font:700 14px/1.3 var(--lm-body);letter-spacing:.01em;color:var(--lm-azul);font-variant-numeric:tabular-nums}
.lm-titulo{margin:0;font:400 clamp(28px,3.2vw,36px)/1.05 var(--lm-display);text-wrap:balance;color:var(--lm-crema)}
.lm-texto{margin:0;font-size:16px;line-height:1.5;color:var(--lm-crema-2);max-width:44ch}
.lm-ciudades{display:flex;flex-wrap:wrap;gap:8px;margin:2px 0 0;padding:0;list-style:none}
.lm-ciudades button{border-style:dashed;font-weight:600}
.lm-ciudades button[aria-pressed="true"]{background:var(--lm-amarillo);border:1.5px solid var(--lm-amarillo);color:var(--lm-noche)}
.lm-wa{justify-self:start;display:inline-flex;align-items:center;gap:10px;min-height:52px;margin-top:6px;padding:0 22px 0 16px;border-radius:999px;background:var(--lm-amarillo);color:var(--lm-noche);font:700 16px/1.15 var(--lm-body);text-decoration:none;box-shadow:4px 4px 0 var(--lm-loto);transition:transform .15s,box-shadow .15s}
.lm-wa:hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 var(--lm-loto)}
.lm-wa:active{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--lm-loto)}
.lm-wa-ico{width:26px;height:26px;flex:none;--lc-accent:var(--lm-noche)}
.lm-lejos{margin:0;padding-top:18px;border-top:1.5px dashed var(--lm-linea);font-size:16px;line-height:1.5;color:var(--lm-crema-2)}
.lm-lejos a{color:var(--lm-crema);font-weight:700;text-decoration:underline;text-decoration-color:var(--lm-amarillo);text-decoration-thickness:2px;text-underline-offset:4px}
.lm-lejos a:hover{text-decoration-thickness:3px}

@media (prefers-reduced-motion:reduce){
  .lm-estrella svg,.lm-estrella.lm-sel::after{animation:none}
  .lm-pais,.lm-zoom,.lm-lineas polyline,.lm-marcas,.lm-estrella span{transition:none}
}