/* Experiencia integrada · estilos. Base: la vista previa del bloque 1 (portada B, controles,
   transiciones) + las pantallas de los bloques 3, 4 y 5. Tamaños de texto en rem: el zoom de
   texto del navegador los agranda sin romper la distribución. */
@font-face{font-family:Prata;src:url(../fuentes/prata-400.woff2) format('woff2');font-display:swap}
@font-face{font-family:Jost;src:url(../fuentes/jost-400.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Jost;src:url(../fuentes/jost-500.woff2) format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:Jost;src:url(../fuentes/jost-600.woff2) format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:SpaceMono;src:url(../fuentes/space-mono-400.woff2) format('woff2');font-display:swap}
:root{
  --senal:#A8B5A2; --papel:#1D2423; --papel-rgb:29,36,35; --tinta:#14170F; --detalle:#D0C1A5; --base:#FAF9F5;
  /* v1.2: el tema del caso los reemplaza al cargar (app.js · aplicarTema); estos son los valores por omisión */
  --senal-rgb:168,181,162; --detalle-rgb:208,193,165; --tinta-rgb:20,23,15; --senal-hover:#b9c5b3; --detalle-texto:var(--detalle);
  --velo:rgba(29,36,35,.94); --borde:rgba(250,249,245,.18); --linea:rgba(250,249,245,.16); --suave:rgba(250,249,245,.06);
  --ui:'Century Gothic',Jost,system-ui,sans-serif; --tit:Prata,Georgia,serif; --dato:SpaceMono,ui-monospace,monospace;
  --t-hover:150ms; --t-tarjeta:220ms; --t-panel:280ms; --r:16px;
  --ancho-panel:min(440px,42vw); --margen:16px;
}
@media (prefers-reduced-motion:reduce){:root{--t-hover:0ms;--t-tarjeta:0ms;--t-panel:0ms}}
html.movimiento-reducido{--t-hover:0ms;--t-tarjeta:0ms;--t-panel:0ms}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--tinta);color:var(--base);font-family:var(--ui);overflow:hidden}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:2px solid var(--base);outline-offset:3px}
#tour{position:fixed;inset:0}
.oculto{display:none!important}
[hidden]{display:none!important}
[inert]{pointer-events:none!important}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
#nl-badge-frame,iframe[title="Powered by Netlify"]{display:none!important}
svg.ico,.espacial svg,nav.principal svg,#b-guia svg{fill:none;stroke:currentColor;stroke-width:1.6;flex:none}
svg.ico{width:1.15em;height:1.15em}

/* ── PORTADA ── */
#portada{position:fixed;inset:0;z-index:50;display:flex;flex-direction:column;justify-content:flex-start;overflow-y:auto;overscroll-behavior:contain;
  padding:clamp(20px,5vw,64px);padding-top:calc(clamp(20px,4vw,40px) + 56px);padding-bottom:max(clamp(24px,6vh,72px),env(safe-area-inset-bottom));
  background:linear-gradient(180deg,rgba(15,17,16,.45) 0%,rgba(15,17,16,0) 18%,rgba(15,17,16,0) 58%,rgba(15,17,16,.35) 72%,rgba(15,17,16,.78) 100%);
  transition:opacity 600ms ease}
#portada .fondo{position:absolute;inset:0;z-index:-1;background:var(--papel);transition:opacity 900ms ease}
#portada.pano-listo .fondo{opacity:0}
#portada.con-firma{padding-top:calc(clamp(20px,4vw,40px) + 56px + 2rem)}   /* logo y firma de autoría */
#portada .identidad{position:absolute;top:clamp(20px,4vw,40px);left:max(clamp(20px,5vw,64px),env(safe-area-inset-left));display:flex;flex-direction:column;align-items:flex-start;gap:8px;opacity:0;transition:opacity 700ms ease 100ms}
#portada .logo{height:var(--logo-alto,40px);display:block}
#portada .firma-autor{margin:0;max-width:min(60vw,300px);font-size:.72rem;letter-spacing:.04em;line-height:1.35;color:var(--base);
  text-shadow:0 0 2px #000,0 0 4px #000,0 0 8px rgba(0,0,0,.9),0 1px 14px rgba(0,0,0,.85)}   /* texto, no botón: la sombra lo hace legible sobre el cielo */
#portada.credito-suave .firma-autor{text-shadow:0 1px 2px rgba(0,0,0,.55),0 0 6px rgba(0,0,0,.35)}   /* v1.16.1-tinajones.8: por caso (portada.credito_sombra: "suave"), sin halo */
#portada .copia{margin-top:auto;flex:none;max-width:480px;padding:18px 20px;border-radius:18px;background:rgba(15,17,16,.42);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  opacity:0;transform:translateY(8px);transition:opacity 700ms ease 350ms,transform 700ms ease 350ms}
#portada.revelada .identidad,#portada.revelada .copia{opacity:1;transform:none}
#portada .lugar{font-size:.72rem;letter-spacing:.3em;text-transform:uppercase;color:var(--detalle-texto);margin:0 0 14px}
#portada h1{font-family:var(--tit);font-weight:400;font-size:clamp(1.6rem,3.4vw,2.5rem);line-height:1.12;margin:0 0 14px;text-wrap:balance}
#portada p.texto{font-size:clamp(.94rem,1.4vw,1.06rem);line-height:1.5;margin:0 0 26px;opacity:.92;max-width:34em}
.acciones{display:flex;gap:12px;flex-wrap:wrap}
#portada .discreto{position:absolute;top:clamp(20px,4vw,40px);right:clamp(20px,5vw,64px);display:flex;gap:16px;font-size:.75rem;opacity:0;transition:opacity 700ms ease 600ms}
#portada.revelada .discreto{opacity:1}
#portada .discreto button{min-height:44px;padding:0 14px;border-radius:999px;border:0;background:rgba(15,17,16,.62);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);text-decoration:underline;text-underline-offset:3px}
#portada.fuera{opacity:0;pointer-events:none}
.bloqueo{position:fixed;inset:0;z-index:49}
#fallo-motor{margin-top:6px;max-width:520px;padding:16px 18px;border-radius:var(--r);background:rgba(20,23,15,.9);border:1px solid rgba(var(--detalle-rgb),.45)}
#fallo-motor h2{font-family:var(--tit);font-weight:400;font-size:1.375rem;margin:0 0 8px}
#fallo-motor p{margin:0 0 12px;font-size:.9rem;line-height:1.5}

/* ── BOTONES ── */
.btn{min-height:48px;padding:12px 22px;border-radius:999px;border:1px solid rgba(250,249,245,.5);background:rgba(250,249,245,.1);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);font-size:.9rem;font-weight:500;letter-spacing:.02em;
  transition:background var(--t-hover)}
.btn:hover{background:rgba(250,249,245,.2)}
.btn.primario{background:var(--senal);border-color:var(--senal);color:var(--tinta);font-weight:600}
.btn.primario:hover{background:var(--senal-hover)}
.btn[aria-busy=true]{opacity:.8;cursor:progress}
.btn:disabled,.btn[aria-disabled=true]{opacity:.38;cursor:not-allowed;filter:saturate(.3)}
.b{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 18px;border-radius:999px;border:1px solid rgba(250,249,245,.45);background:none;font-size:.94rem;font-weight:500;text-decoration:none;color:inherit;text-align:center;line-height:1.2}
.b:hover{background:rgba(250,249,245,.08)}
.b.pri{background:var(--senal);border-color:var(--senal);color:var(--tinta)}
.b.pri:hover{background:var(--senal-hover)}
.b.flex{flex:1 1 auto}
.b.txt{border:0;padding:0 6px;text-decoration:underline;text-underline-offset:4px;font-weight:400;min-height:40px}
.b.ter{border:0;min-height:44px;padding:0 10px;font-weight:400;opacity:.92}
.b:active{transform:scale(.98)}
.enlace{background:none;border:0;padding:0;text-decoration:underline;text-underline-offset:4px;font-size:.9rem;min-height:44px;text-align:left;color:inherit}

/* ── INTERFAZ COMÚN ── */
#ui{position:fixed;inset:0;z-index:20;pointer-events:none;opacity:0;transition:opacity 500ms ease}
#ui.visible{opacity:1}
#ui > *{pointer-events:auto}
.velo-arriba{position:fixed;top:0;left:0;right:0;height:190px;pointer-events:none!important;background:linear-gradient(180deg,rgba(8,10,9,.72),rgba(8,10,9,.35) 55%,rgba(8,10,9,0))}
.velo-abajo{position:fixed;bottom:0;left:0;right:0;height:160px;pointer-events:none!important;background:linear-gradient(0deg,rgba(8,10,9,.5),rgba(8,10,9,0))}
.marca{position:fixed;top:20px;left:24px;display:flex;flex-direction:column;gap:10px;pointer-events:none!important;max-width:calc(100vw - 260px)}
.marca img{height:34px;width:auto;align-self:flex-start}
.marca .escena{font-family:var(--tit);font-size:1.5rem;line-height:1.1;text-shadow:0 1px 3px rgba(0,0,0,.85),0 1px 12px rgba(0,0,0,.6)}
.marca .sub{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;margin-top:4px;font-weight:500;text-shadow:0 1px 2px rgba(0,0,0,.95),0 0 8px rgba(0,0,0,.8)}
.demo{position:fixed;left:24px;top:calc(20px + 7.5rem);min-height:32px;padding:0 12px;border-radius:999px;border:1px solid var(--linea);background:rgba(29,36,35,.82);font-size:.8rem;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.pop{position:fixed;z-index:40;width:min(340px,calc(100vw - 32px));padding:14px 16px;border-radius:14px;font-size:.875rem;line-height:1.45;background:var(--velo);border:1px solid var(--borde);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.pop p{margin:0 0 10px}
.pop h3{font:400 1.25rem var(--tit);margin:0 0 8px}
#demo-exp{left:24px;top:calc(20px + 10rem)}
#pop-aviso{left:50%;top:50%;transform:translate(-50%,-50%);z-index:60;width:min(460px,calc(100vw - 32px))}

/* navegación principal · abajo al centro del espacio libre */
nav.principal{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);display:flex;gap:4px;padding:5px;border-radius:999px;max-width:calc(100vw - 32px);overflow-x:auto;scrollbar-width:none;
  background:rgba(var(--papel-rgb),.8);border:1px solid var(--borde);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transition:left var(--t-panel)}
nav.principal button{display:flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border:0;border-radius:999px;background:none;font-size:.875rem;transition:background var(--t-hover);white-space:nowrap}
nav.principal button:hover{background:rgba(250,249,245,.12)}
nav.principal button[aria-pressed=true]{background:var(--senal);color:var(--tinta)}
nav.principal button.mia{border:1px solid var(--senal)}
nav.principal button.mia b{font-weight:500;color:var(--senal)}
nav.principal button.mia[aria-pressed=true] b{color:var(--tinta)}
nav.principal svg{width:18px;height:18px}

/* controles espaciales · a la derecha, se apartan del panel */
.espacial{position:fixed;top:20px;right:22px;display:flex;flex-direction:column;align-items:flex-end;gap:8px;transition:right var(--t-panel)}
.espacial .grupo{display:flex;flex-direction:column;gap:2px;padding:4px;border-radius:14px;background:rgba(var(--papel-rgb),.74);border:1px solid var(--borde);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.espacial button{display:flex;align-items:center;justify-content:flex-end;gap:10px;min-height:40px;min-width:40px;padding:0 12px;border:0;border-radius:10px;background:none;font-size:.8rem;white-space:nowrap}
.espacial button:hover{background:rgba(250,249,245,.12)}
.espacial button[aria-pressed=true]{color:var(--tinta);background:var(--senal)}
.espacial svg{width:18px;height:18px}
.rumbo{font-family:var(--dato);font-size:.75rem;display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:12px;background:rgba(var(--papel-rgb),.74);border:1px solid var(--borde)}
.rumbo i{display:block;width:14px;height:14px;border-radius:50%;border:1.5px solid var(--base);position:relative}
.rumbo i:after{content:"";position:absolute;left:50%;top:-1px;width:2px;height:7px;margin-left:-1px;background:var(--senal);border-radius:1px}
.zoom{flex-direction:row!important}
.leyenda-limite{position:fixed;left:24px;top:calc(20px + 7.5rem);display:flex;align-items:flex-start;gap:8px;max-width:min(330px,calc(100vw - 48px));padding:8px 12px;border-radius:12px;background:rgba(var(--papel-rgb),.82);border:1px solid var(--borde);font-size:.78rem;line-height:1.4}
.leyenda-limite i{flex:none;width:18px;height:0;margin-top:.6em;border-top:2px dashed var(--detalle)}
body.demo-activo .leyenda-limite{top:calc(20px + 10.2rem)}

/* menú de vistas */
#vistas{position:fixed;top:20px;right:212px;width:290px;padding:10px;border-radius:var(--r);background:var(--velo);border:1px solid var(--borde);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
#vistas h3{margin:6px 8px 8px;font-size:.69rem;letter-spacing:.2em;text-transform:uppercase;opacity:.7;font-weight:500}
#vistas button{display:flex;justify-content:space-between;align-items:baseline;gap:10px;width:100%;min-height:44px;padding:8px 10px;border:0;border-radius:10px;background:none;text-align:left;font-size:.9rem}
#vistas button:hover{background:rgba(250,249,245,.1)}
#vistas button[aria-current=true]{background:rgba(var(--senal-rgb),.2)}
#vistas small{font-family:var(--dato);font-size:.69rem;opacity:.65;white-space:nowrap}

/* ── PANEL · uno solo; escritorio lateral, móvil hoja inferior ── */
#panel{position:fixed;top:var(--margen);right:var(--margen);bottom:var(--margen);width:var(--ancho-panel);z-index:30;border-radius:22px;display:flex;flex-direction:column;overflow:hidden;
  background:var(--velo);border:1px solid var(--borde);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  transform:translateX(calc(100% + 24px));transition:transform var(--t-panel) cubic-bezier(.2,.8,.2,1)}
#panel.abierto{transform:none}
#panel .asa{display:none}
#panel .cab{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:12px 12px 10px;border-bottom:1px solid var(--linea)}
#panel .cab h2{font:400 1.375rem var(--tit);margin:0 0 0 8px;flex:1 1 40%;min-width:5ch;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;outline:none}
#panel .volver{display:flex;align-items:center;gap:4px;min-height:44px;padding:0 12px 0 8px;border-radius:12px;border:0;background:var(--suave);font-size:.9rem;white-space:nowrap}
#panel .cerrar,#reproductor .cerrar{width:44px;height:44px;border-radius:12px;border:0;background:var(--suave);font-size:1.1rem;flex:none}
#panel .plegar{display:none;min-height:40px;padding:0 12px;border-radius:12px;border:0;background:var(--suave);font-size:.85rem;white-space:nowrap}
#panel.plegado{bottom:auto}
#panel.plegado .cuerpo,#panel.plegado .pie,#panel.plegado .tira-guia,#panel.plegado .volver{display:none!important}
#panel.plegado .plegar{display:inline-flex;align-items:center}
#panel .cuerpo{flex:1;min-height:0;overflow:auto;padding:16px 18px 22px;overscroll-behavior:contain}
#panel .pie{padding:12px 14px;border-top:1px solid var(--linea);display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.tira-guia{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 8px 8px 14px;margin:10px 14px 0;border-radius:12px;background:rgba(var(--detalle-rgb),.14);border:1px solid rgba(var(--detalle-rgb),.4);font-size:.8rem;color:var(--detalle)}
.tira-guia .b{min-height:38px;padding:0 14px;font-size:.8rem;flex:none}
.tira-guia .tira-etapa{display:flex;flex-direction:column;gap:6px;width:100%;color:var(--base)}
.tira-guia .tira-etapa b{font-weight:500;color:var(--detalle-texto)}
.tira-guia .tira-etapa p{margin:0;font-size:.84rem;line-height:1.4;opacity:.92}
.tira-guia .tira-etapa .fila{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
body.con-panel .espacial{right:calc(var(--ancho-panel) + var(--margen) + 16px)}
body.con-panel nav.principal{max-width:calc(100vw - var(--ancho-panel) - 48px)}
body.con-panel.dock-apartado nav.principal{left:calc((100vw - var(--ancho-panel) - var(--margen)) / 2)}   /* solo si centrada quedaría bajo el panel: no se corre bajo el puntero sin necesidad */
body.con-panel #carga,body.con-panel .caja-fallo,body.con-panel #aviso,body.con-panel .volver-vista,body.con-panel .estado-vis{left:calc((100vw - var(--ancho-panel) - var(--margen)) / 2)}
body.con-panel #vistas{right:calc(var(--ancho-panel) + var(--margen) + 200px)}

/* contenido del panel · comunes */
.ey{font:.75rem var(--dato);letter-spacing:.08em;opacity:.78;text-transform:uppercase}
.nota{font-size:.82rem;opacity:.78;line-height:1.45}
.fuente{font-size:.78rem;opacity:.65;margin:4px 0 0}
.fuente-sec{font-size:.78rem;opacity:.65;margin:14px 0 0;line-height:1.45}
.aviso-caja{margin:0 0 12px;padding:12px 14px;border-radius:14px;background:rgba(var(--detalle-rgb),.12);border:1px solid rgba(var(--detalle-rgb),.35);font-size:.875rem;line-height:1.45}
.aviso-caja strong{font-weight:500}
.info-disp{font-size:.84rem;margin:0 0 12px;padding:10px 12px;border-radius:12px;background:var(--suave);line-height:1.45}
.vacio{padding:26px 10px;text-align:center}
.vacio h3{font:400 1.375rem var(--tit);margin:0 0 6px}
.bloque{margin-top:18px;padding-top:16px;border-top:1px solid var(--linea)}
.bloque h4{font-weight:500;font-size:1rem;margin:0 0 8px}
/* v1.16.2 · ficha: chip de fuente de la compatibilidad, medidas en línea y fuentes plegadas */
.chip-fuente{display:inline-block;margin:0 0 10px;padding:3px 10px;border-radius:999px;border:1px solid var(--linea);font-size:.76rem;opacity:.9}
.medidas-linea{font-size:.94rem;margin:0 0 12px;opacity:.92}
.det-datos{margin-top:14px;font-size:.9rem}.det-datos summary{cursor:pointer;padding:8px 0;font-weight:500}.det-datos .datos{margin-top:6px}
#panel .pie{position:relative;z-index:1;background:var(--velo)}
@media (max-height:720px){ .recorte{height:130px} #panel .pie{padding:10px 14px} #panel .pie .ayuda{display:none} }   /* v1.16.2: pantallas bajas: el bloque de viviendas y sus acciones a la vista sin desplazar */
.marca-sel{display:inline-flex;align-items:center;gap:4px;font-size:.78rem;padding:3px 9px;border-radius:999px;background:var(--senal);color:var(--tinta);font-weight:500;white-space:nowrap}
.ok-sel{display:flex;align-items:center;gap:8px;flex:1;min-height:46px;font-size:.94rem;margin:0}
.acc-sec{display:flex;gap:4px;flex-wrap:wrap;justify-content:center;width:100%}
.acc-col{display:flex;flex-direction:column;gap:8px}
.giro{width:26px;height:26px;border-radius:50%;border:3px solid var(--linea);border-top-color:var(--senal);animation:vgGiro 1s linear infinite}
.cargando{display:flex;flex-direction:column;align-items:center;gap:8px}
@keyframes vgGiro{to{transform:rotate(360deg)}}

/* lotes (bloque 3) */
.buscar{display:flex;gap:8px;margin-bottom:10px}
.buscar label{flex:1;display:flex;align-items:center;gap:8px;min-height:46px;padding:0 14px;border-radius:14px;border:1px solid var(--linea);background:var(--suave)}
.buscar input{border:0;background:none;outline:0;width:100%;font-size:.97rem}
.buscar label:focus-within{outline:2px solid var(--base);outline-offset:2px}
.filtro{display:flex;align-items:center;gap:8px;font-size:.875rem;margin:0 0 12px}
.filtro select{min-height:40px;border-radius:12px;border:1px solid var(--linea);background:#232b2a;padding:0 10px}
.lista{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.lista .fila{display:grid;grid-template-columns:52px 1fr auto;gap:12px;align-items:center;width:100%;text-align:left;min-height:64px;padding:8px 12px 8px 8px;border-radius:14px;border:1px solid transparent;background:var(--suave)}
.lista .fila:hover{border-color:var(--linea)}
.lista .fila .n{font:400 1.6rem var(--tit);text-align:center}
.lista .fila .d{font-size:.9rem}.lista .fila .d small{display:block;font-size:.8rem;opacity:.75;margin-top:2px}
.lista .fila .chev{opacity:.6}
.lista .fila.elegida{border-color:var(--senal);box-shadow:inset 4px 0 0 var(--senal)}
.sec{font-size:.8rem;opacity:.72;margin:18px 4px 8px}
.modo-cambio{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 12px;padding:10px 12px;border-radius:12px;border:1px solid var(--senal);font-size:.875rem}
.titulo-lote{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.titulo-lote h3{font:400 2.75rem/1 var(--tit);margin:0}
.disp{font-size:.875rem;margin:8px 0 14px;opacity:.88}
.disp-et{display:inline-block;font-size:.8rem;font-weight:500;padding:3px 10px;border-radius:6px;border:1px solid var(--linea)}
.disp-et.e-disponible{border-color:var(--senal);color:var(--senal)}
.disp-et.e-reservado{border-color:var(--detalle);color:var(--detalle-texto)}
.disp-et.e-vendido{background:rgba(250,249,245,.12);border-color:transparent}
.lista .fila.vendida{opacity:.85}
/* v1.16.1: fila estática de un vendido (no es botón): número, «Vendido» y relleno rayado */
.lista li.fila.vendida,.sup-lista li.fila.vendida{cursor:default;border:1px solid var(--linea);background:repeating-linear-gradient(135deg,rgba(250,249,245,.07) 0 4px,transparent 4px 10px),var(--suave);min-height:56px}
.lista li.fila.vendida:hover,.sup-lista li.fila.vendida:hover{border-color:var(--linea)}
.lista li.fila.vendida .n{opacity:.7}
.sup-lista li.fila.vendida{display:grid;grid-template-columns:52px 1fr;gap:12px;align-items:center;border-radius:14px;padding:8px 12px;margin:0 0 8px}
.datos.comercial dd{font-weight:600}
/* v1.7 · superficies: referencia de 1 ha y barras proporcionales desde cero a la superficie del plano (línea en 1 ha) */
.b.sup-abrir{width:100%;justify-content:flex-start;gap:10px;margin:0 0 10px;text-align:left}
.b.sup-abrir .chev{margin-left:auto;opacity:.6}
.sup-abrir .cuadro,.sup-ref .cuadro{flex:none;display:inline-grid;place-items:center;border:2px solid var(--detalle);border-radius:3px}
.sup-abrir .cuadro{width:1rem;height:1rem}
.sup-ref{display:flex;gap:12px;align-items:center;margin:0 0 12px;padding:12px 14px;border-radius:14px;background:rgba(var(--detalle-rgb),.12);border:1px solid rgba(var(--detalle-rgb),.35)}
.sup-ref .cuadro{width:min(2.9rem,56px);height:min(2.9rem,56px);font:500 min(.72rem,14px) var(--dato);white-space:nowrap}   /* con texto grande el cuadro no se come la hoja */
.sup-ref p{margin:0;font-size:.9rem;line-height:1.45}
.sup-suelo{margin:0 0 10px}
.sup-orden{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin:0 0 8px;font-size:.8rem}
.sup-orden>span{opacity:.75;margin-right:2px}
.sup-orden .b{min-height:34px;padding:4px 12px;font-size:.8rem}
.sup-orden .b[aria-pressed=true]{background:var(--senal);border-color:var(--senal);color:var(--tinta)}
.sup-lista{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}
.sup-fila,.sup-eje{display:grid;grid-template-columns:40px 1fr 12px;gap:10px;align-items:center;padding:7px 10px 7px 4px;border:1px solid transparent}
.sup-eje{padding-top:0;padding-bottom:0}
.sup-fila{width:100%;text-align:left;border-radius:14px;background:var(--suave);color:inherit;font:inherit;cursor:pointer}
.sup-fila:hover{border-color:var(--linea)}
.sup-fila.vendida{opacity:.62}
.sup-fila .n{font:400 1.35rem var(--tit);text-align:center}
.sup-dato{display:block;min-width:0}
.sup-fila .barra{margin:2px 0 6px}
.sup-fila .sup-cifra{font-size:.84rem;margin-right:8px}
.sup-fila small{display:inline-block;font-size:.76rem;opacity:.75}
.sup-fila .chev{opacity:.6}
.barra{position:relative;display:block;height:10px;border-radius:5px;background:rgba(var(--senal-rgb),.16)}
.barra i{position:absolute;left:0;top:0;bottom:0;border-radius:5px;background:var(--senal)}
.barra:after,.sup-eje .eje:after{content:"";position:absolute;left:var(--ha);top:-4px;bottom:-4px;width:2px;margin-left:-1px;background:var(--detalle)}
.sup-eje .eje{position:relative;display:block;height:1.35rem;font:400 .72rem var(--dato)}
.sup-eje .eje:after{top:auto;bottom:-6px;height:6px}
.sup-eje .eje b{position:absolute;top:0;font-weight:400;opacity:.8;white-space:nowrap}
.sup-eje .eje b.ha{left:var(--ha);transform:translateX(-50%);opacity:1;color:var(--detalle-texto)}
@media (max-height:480px){.sup-ref{padding:8px 12px;margin-bottom:8px}.sup-ref .cuadro{width:2.2rem;height:2.2rem}.sup-ref p{font-size:.84rem}}   /* teléfono horizontal: más filas a la vista */
/* v1.8 · tu selección con la ficha simple: guardar un lote desde su ficha, verlo arriba en «Lotes» y el contacto «por confirmar» */
.sel-lote{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin:14px 0 6px}
.sel-lote .nota{flex:1 0 100%;margin:0}
.sel-lote .ok-sel{flex:0 1 auto}
.b.sel-abrir{width:100%;justify-content:flex-start;gap:10px;margin:0 0 10px;text-align:left;border-color:var(--senal)}
.b.sel-abrir .chev{margin-left:auto;opacity:.6}
.ctc-pendiente{display:flex;align-items:center;gap:10px;margin:14px 0 10px;padding:12px 14px;border-radius:14px;border:1px dashed rgba(250,249,245,.35);font-size:.9rem;line-height:1.4}
.ctc-pendiente .ico{flex:none;opacity:.75}
.sel-acc{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin:6px 0 0}
/* v1.10: textos del caso en la selección simple: qué hace guardar (ficha) y qué hacer con ella sin contacto (vista) */
.sel-lote .sel-nota{margin:8px 0 0}
.sel-uso{margin:0 0 10px;font-size:.9rem;line-height:1.45}
.recorte{position:relative;height:170px;border-radius:14px;background:rgba(0,0,0,.25);overflow:hidden;margin:0}
.recorte .svgw,.recorte svg{width:100%;height:100%}
.recorte figcaption{position:absolute;left:8px;bottom:8px;font-size:.75rem;padding:2px 8px;border-radius:6px;background:rgba(20,23,15,.8)}
figure{margin:0}
dl.datos{display:grid;grid-template-columns:auto 1fr;gap:8px 18px;margin:16px 0 4px;font-size:.97rem}
dl.datos dt{opacity:.72}
dl.datos dd{margin:0}
.falta{font-size:.875rem;opacity:.82;font-style:italic}
.casa{display:grid;grid-template-columns:96px 1fr;gap:12px;align-items:center;width:100%;text-align:left;padding:8px;border-radius:14px;border:1px solid transparent;background:var(--suave);margin-bottom:8px}
.casa img{width:96px;height:72px;object-fit:cover;border-radius:10px;display:block}
.casa h5{font:400 1.125rem var(--tit);margin:0 0 3px}
.casa p{margin:0;font-size:.84rem;opacity:.86}
.estado{display:inline-flex;align-items:center;gap:6px;font-size:.78rem;margin-top:5px}
.estado i{font-style:normal;display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;font-size:.69rem}
.e-si i{background:var(--senal);color:var(--tinta)}
.e-condicionada i{background:var(--detalle);color:var(--tinta)}
.e-no i{border:1px solid rgba(250,249,245,.5)}
.e-por_confirmar i{border:1px dashed rgba(250,249,245,.6)}
.casa.no,.casa.por_confirmar{opacity:.74}
details summary{cursor:pointer;min-height:44px;display:flex;align-items:center;font-size:.9rem}
.galeria{display:grid;grid-template-columns:2fr 1fr;gap:6px;border-radius:14px;overflow:hidden}
.galeria button{position:relative;padding:0;border:0;background:#000;display:block;width:100%}
.galeria img{width:100%;height:100%;object-fit:cover;display:block}
.galeria .g1{grid-row:span 2;height:210px}
.galeria .g2,.galeria .g3{height:102px}
.galeria .rot{position:absolute;left:6px;bottom:6px;right:6px;text-align:left;font-size:.69rem;padding:2px 7px;border-radius:6px;background:rgba(20,23,15,.8)}
.cifras{display:flex;gap:10px;margin:14px 0}
.cifras div{flex:1;padding:10px;border-radius:12px;background:var(--suave);text-align:center}
.cifras b{display:block;font:400 1.375rem var(--tit)}
.cifras span{font-size:.78rem;opacity:.78}
.rel{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:14px;border:1px solid var(--senal);font-size:.9rem}
.par{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 12px}
.par .c{padding:14px;border-radius:14px;background:var(--suave)}
.par .c b{display:block;font:400 1.6rem var(--tit);margin:4px 0}
.par img{width:100%;height:84px;object-fit:cover;border-radius:10px;margin-top:6px}
.conf h3{font:400 1.6rem/1.2 var(--tit);margin:2px 0 14px}
.conf .tarjeta{border-radius:16px;background:var(--suave);overflow:hidden}
.conf .tarjeta .recorte{height:128px;border-radius:0}
.conf .tarjeta .txt{padding:12px 14px}
.conf .tarjeta .l{font:400 1.375rem var(--tit)}
.conf .tarjeta .v{font-size:.97rem;margin-top:2px}
.conf .exp{font-size:.97rem;line-height:1.5;margin:14px 0 0}
.conf .cond,.cond{margin-top:10px;padding:10px 12px;border-radius:12px;border:1px solid rgba(var(--detalle-rgb),.4);font-size:.875rem;line-height:1.45}
.resumen-lote{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;align-items:center}
.resumen-lote h3{font:400 2.5rem/1 var(--tit);margin:0;grid-row:span 2}

/* plano (bloque 2) y entorno (bloque 5) */
.tabs{display:flex;margin:0 0 12px;padding:4px;border-radius:999px;background:rgba(250,249,245,.07)}
.tabs button{flex:1;min-height:40px;border:0;border-radius:999px;background:none;font-size:.875rem}
.tabs button[aria-selected=true]{background:var(--base);color:var(--tinta);font-weight:500}
.plano{position:relative;border-radius:14px;background:rgba(0,0,0,.28);overflow:hidden;margin:0 0 10px}
.plano svg{display:block;width:100%;height:min(52vh,460px)}
.plano .lindero,.recorte .lindero{fill:none;stroke:var(--detalle);stroke-width:1.4;stroke-dasharray:5 4;vector-effect:non-scaling-stroke}
.plano .u path,.recorte .u path{fill:rgba(var(--senal-rgb),.14);stroke:rgba(250,249,245,.55);stroke-width:1;vector-effect:non-scaling-stroke;transition:fill var(--t-hover)}
.plano .u text,.recorte .u text{fill:rgba(250,249,245,.9);font-size:9px;text-anchor:middle;dominant-baseline:middle;pointer-events:none;font-family:var(--ui)}
.plano .u.comercial text,.plano .u.comun text,.recorte .u.comercial text,.recorte .u.comun text{fill:var(--detalle);font-size:7px}
.plano .u{cursor:pointer;outline:none}
.plano .u:hover path,.plano .u:focus-visible path{fill:rgba(var(--senal-rgb),.4);stroke:#fff}
.plano .u:focus-visible path{stroke-width:2.5}
.plano .u.elegido path,.recorte .u.elegido path{fill:rgba(var(--senal-rgb),.85);stroke:#fff;stroke-width:2}
.plano .u.elegido text,.recorte .u.elegido text{fill:var(--tinta);font-weight:600}
.plano .u.marcado path{fill:rgba(var(--detalle-rgb),.55);stroke:#fff;stroke-width:2.5}
.plano .u.vendido path,.plano .u.reservado path{fill:rgba(250,249,245,.04);stroke:rgba(250,249,245,.3);stroke-dasharray:3 2}
.plano .u.vendido text{fill:rgba(250,249,245,.5);text-decoration:line-through}
.plano .norte{fill:none;stroke:var(--base);stroke-width:1.2;vector-effect:non-scaling-stroke}
.plano .norte-t,.plano .escala-t{fill:rgba(250,249,245,.85);font-size:8px;font-family:var(--dato)}
.plano .escala{stroke:rgba(250,249,245,.8);stroke-width:1.5;vector-effect:non-scaling-stroke}
.plano-ley{display:flex;flex-direction:column;gap:6px;font-size:.8rem;line-height:1.4;opacity:.9;margin:0 0 12px}
.plano-ley span{display:flex;gap:8px;align-items:flex-start}
.plano-ley i{flex:none;width:18px;height:0;margin-top:.6em;border-top:2px dashed var(--detalle)}
.plano-ley i.l{height:12px;margin-top:.15em;border:1px solid rgba(250,249,245,.55);background:rgba(var(--senal-rgb),.14)}
.plano-ley i.v{height:12px;margin-top:.15em;border:1px dashed rgba(250,249,245,.3);background:rgba(250,249,245,.04)}
.mapa{position:relative;height:250px;border-radius:14px;background:rgba(0,0,0,.28);overflow:hidden;margin:0 0 10px}
.mapa svg{width:100%;height:100%}
.mapa .mapa-nota{position:absolute;left:10px;right:10px;top:10px;margin:0;padding:8px 10px;border-radius:10px;background:rgba(20,23,15,.85);font-size:.8rem;line-height:1.35}
.mapa .proyecto{fill:rgba(var(--senal-rgb),.75);stroke:#fff}
.mapa .proy-t{fill:var(--senal);font-size:calc(12px*var(--k,1));font-weight:600;paint-order:stroke;stroke:rgba(20,23,15,.85);stroke-width:calc(3px*var(--k,1))}
.mapa .mk{cursor:pointer}
.mapa .mk circle{fill:var(--detalle);stroke:rgba(20,23,15,.8);stroke-width:calc(2px*var(--k,1))}
.mapa .mk text{fill:var(--base);font-size:calc(12px*var(--k,1));paint-order:stroke;stroke:rgba(20,23,15,.85);stroke-width:calc(3px*var(--k,1))}
.mapa .mk.elegido circle{fill:var(--senal);stroke:#fff}
.mapa .mk.tenue{opacity:.28}
.mapa .mk.aprox circle{fill:none;stroke:var(--detalle);stroke-dasharray:calc(3px*var(--k,1)) calc(2px*var(--k,1))}
#panel .ref-toggle{display:flex;align-items:center;gap:10px;margin:0 0 12px;font-size:.88rem;cursor:pointer}
#panel .ref-toggle input{width:18px;height:18px;accent-color:var(--senal);flex:none}
.mapa .mk .flecha{fill:var(--detalle);stroke:rgba(20,23,15,.8);stroke-width:calc(1.5px*var(--k,1));stroke-linejoin:round}
.mapa .mk.aprox .flecha{fill:rgba(var(--detalle-rgb),.45)}
.mapa .mk.elegido .flecha{fill:var(--senal);stroke:#fff}
.mapa .escala-mapa line{stroke:rgba(250,249,245,.7);stroke-width:calc(2px*var(--k,1))}
.mapa .escala-mapa text{fill:rgba(250,249,245,.75);font-size:calc(11px*var(--k,1))}
.mapa .leyenda-mapa{position:absolute;right:10px;bottom:8px;margin:0;font-size:.75rem;opacity:.85;display:flex;align-items:center;gap:6px}
.mapa .leyenda-mapa i{width:10px;height:10px;border-radius:50%;border:1.5px dashed var(--detalle);display:inline-block}
.cats{display:flex;gap:6px;overflow-x:auto;margin:0 0 10px;padding-bottom:2px}
.cats button{flex:none;min-height:36px;padding:0 12px;border-radius:999px;border:1px solid var(--linea);background:none;font-size:.84rem}
.cats button[aria-pressed=true]{background:var(--senal);color:var(--tinta);border-color:var(--senal)}
.lugares{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.lugares button{display:grid;grid-template-columns:1fr auto;gap:2px 10px;width:100%;text-align:left;padding:10px 12px;border-radius:12px;border:1px solid transparent;background:var(--suave)}
.lugares button[aria-current=true]{border-color:var(--senal)}
.lugares b{font-weight:500;font-size:.94rem}
.lugares small{grid-column:1;font-size:.8rem;opacity:.78}
.lugares .d{grid-row:span 2;align-self:center;font-size:.8rem;opacity:.82;text-align:right}
.ficha-lugar h3{font:400 1.6rem/1.15 var(--tit);margin:4px 0 6px;outline:none}
.ficha-lugar .cat{font:.75rem var(--dato);letter-spacing:.08em;opacity:.78;text-transform:uppercase}
.ficha-lugar dl{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;font-size:.9rem;margin:12px 0}
.ficha-lugar dt{opacity:.72}
.ficha-lugar dd{margin:0}
.ext{display:inline-flex;align-items:center;gap:6px}

/* proyecto y contacto (bloque 5) */
.video-destacado{display:flex;flex-direction:column;gap:6px;align-items:flex-start;margin:0 0 18px;padding:12px 14px;border-radius:14px;background:var(--suave)}
.pie .copia-manual{max-height:38vh;overflow:auto}
.indice{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 14px}
.indice button{min-height:36px;padding:0 12px;border-radius:999px;border:1px solid var(--linea);background:var(--suave);font-size:.84rem}
.seccion{margin:0 0 22px;scroll-margin-top:8px}
.seccion h3{font:400 1.375rem/1.2 var(--tit);margin:0 0 8px;outline:none}
.seccion p{font-size:.94rem;line-height:1.55;margin:0 0 10px}
.seccion figure{position:relative;margin:0 0 12px;border-radius:14px;overflow:hidden}
.seccion figure img{width:100%;display:block;aspect-ratio:16/9;object-fit:cover}
.seccion figcaption{position:absolute;left:8px;bottom:8px;font-size:.72rem;padding:2px 8px;border-radius:6px;background:rgba(20,23,15,.8)}
.seccion figure.entera img{aspect-ratio:auto;object-fit:contain}
.seccion figure.entera figcaption{position:static;margin-top:8px;padding:0;background:none;font-size:.78rem;line-height:1.45;opacity:.85}
.seccion figure.entera figcaption a{color:inherit;text-decoration:underline;white-space:nowrap}
.rasgos{list-style:none;margin:0 0 10px;padding:0;display:flex;flex-direction:column;gap:6px}
.rasgos li{display:flex;gap:10px;align-items:flex-start;font-size:.9rem;line-height:1.45;padding:8px 10px;border-radius:12px;background:var(--suave)}
.rasgos .et{flex:none;font-size:.72rem;padding:2px 8px;border-radius:999px;border:1px solid var(--linea);opacity:.88;margin-top:1px}
.rasgos .et.proy{border-color:rgba(var(--detalle-rgb),.55)}
.ctx{padding:12px 14px;border-radius:14px;background:var(--suave);margin:0 0 12px}
.ctx .ey{display:block;margin-bottom:4px}
.ctx b{font:400 1.25rem var(--tit);display:block}
.ctx .nota{margin:6px 0 0}
.wa-b{white-space:normal}
.pie .wa-b{flex:1.4 1 auto;padding:0 14px}
.wa-ayuda{width:100%;margin:2px 0 0;font-size:.8rem;opacity:.82;line-height:1.4;display:flex;flex-wrap:wrap;align-items:center;gap:2px 8px}
.wa-ayuda .b.txt{min-height:36px;font-size:.8rem;opacity:.92}
.copia-manual{width:100%;margin:4px 0 0;padding:10px 12px;border-radius:12px;border:1px solid rgba(var(--detalle-rgb),.45);font-size:.875rem}
.copia-manual p{margin:0 0 6px}
.texto-manual{max-height:120px;overflow:auto;white-space:pre-wrap;word-break:break-word;padding:8px 10px;border-radius:10px;background:rgba(0,0,0,.25);font-size:.84rem;user-select:all;-webkit-user-select:all}
.viv{padding:12px 14px;border-radius:14px;background:var(--suave);margin:0 0 12px}
.viv .ey{display:block}
.viv b{font:400 1.25rem var(--tit);display:block;margin:2px 0}

/* visualización en el terreno (bloque 4) */
.terreno{margin-top:18px;padding:14px;border-radius:14px;border:1px solid var(--linea)}
.terreno h4{font-weight:500;font-size:1rem;margin:0 0 6px}
.terreno p{margin:0 0 10px;font-size:.9rem;line-height:1.45}
.estado-vis{position:fixed;left:50%;top:18px;transform:translateX(-50%);z-index:26;display:flex;align-items:center;gap:12px;flex-wrap:wrap;max-width:calc(100vw - 24px);padding:8px 8px 8px 16px;border-radius:18px;
  background:var(--velo);border:1px solid var(--borde);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);font-size:.875rem}
.estado-vis .b{min-height:40px;padding:0 14px;font-size:.84rem}
.estado-vis .punto{width:10px;height:10px;border-radius:50%;background:var(--senal);animation:vgLatido 1.2s ease-in-out infinite}
@keyframes vgLatido{50%{opacity:.35}}
.estado-vis.activa{top:auto;bottom:92px;left:24px!important;transform:none;flex-direction:column;align-items:stretch;gap:8px;padding:14px 16px;width:min(360px,calc(100vw - 24px))}
body[data-vis="activa"] #b-guia{display:none!important}
.estado-vis.activa h3{font:400 1.375rem var(--tit);margin:0;outline:none}
.estado-vis.activa .sub{margin:0;font-size:.84rem;opacity:.85}
.estado-vis.activa .acc{display:flex;gap:8px;flex-wrap:wrap}
.chip-rec{position:fixed;left:24px;top:50%;display:inline-flex;align-items:center;gap:6px;min-height:34px;padding:0 12px;border-radius:999px;border:1px solid var(--linea);background:rgba(20,23,15,.78);font-size:.8rem;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.chip-rec i{font-style:normal;opacity:.75}
#pop-rec{left:24px;bottom:136px}
.volver-vista{position:fixed;left:50%;top:18px;transform:translateX(-50%);z-index:25;display:flex;align-items:center;gap:10px;padding:6px 6px 6px 14px;border-radius:999px;background:var(--velo);border:1px solid var(--borde);font-size:.875rem}
.volver-vista .b{min-height:36px;padding:0 12px;font-size:.84rem}
.volver-vista .cerrar{width:36px;height:36px;border-radius:10px;border:0;background:var(--suave)}

/* ── REPRODUCTOR · persistente, fuera del panel ── */
#reproductor{position:fixed;left:var(--margen);top:var(--margen);bottom:92px;right:var(--margen);z-index:32;border-radius:20px;display:flex;flex-direction:column;overflow:hidden;
  background:var(--velo);border:1px solid var(--borde);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
body.con-panel #reproductor{right:calc(var(--ancho-panel) + var(--margen) * 2)}
#reproductor .cab{display:flex;align-items:center;gap:8px;padding:10px 10px 10px 18px;border-bottom:1px solid var(--linea)}
#reproductor .cab h2{font:400 1.25rem var(--tit);margin:0;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;outline:none}
#reproductor .medio{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;background:#000}
#reproductor img,#reproductor video{max-width:100%;max-height:100%;display:block}
#reproductor .pie-v{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 14px;font-size:.875rem}
#reproductor .pie-v .chip{display:inline-flex;align-items:center;min-height:30px;padding:0 12px;border-radius:999px;border:1px solid var(--linea);font-size:.8rem}
#reproductor .err{padding:24px;text-align:center}
#reproductor .tira-guia{margin:0 14px 12px}
body.con-reproductor #guia,body.con-reproductor #b-guia,body.con-reproductor .espacial,body.con-reproductor .marca,body.con-reproductor #vistas,body.con-reproductor .leyenda-limite,body.con-reproductor #chip-rec{display:none!important}

/* recorrido guiado · tarjeta de etapa */
#guia{position:fixed;left:24px;bottom:92px;width:min(420px,calc(100vw - 48px));max-height:calc(100vh - 220px);overflow:auto;padding:18px 20px 16px;border-radius:var(--r);background:var(--velo);border:1px solid var(--borde);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
#guia .prog{display:flex;gap:4px;margin-bottom:12px}
#guia .prog i{flex:1;height:3px;border-radius:2px;background:rgba(250,249,245,.2)}
#guia .prog i.hecho{background:var(--senal)}
#guia .n{font-family:var(--dato);font-size:.69rem;opacity:.75}
#guia h2{font-family:var(--tit);font-weight:400;font-size:1.5rem;margin:4px 0 8px;outline:none}
#guia p{margin:0 0 12px;line-height:1.5;font-size:.9rem;opacity:.94}
#guia .firma{font-family:var(--tit);font-size:1rem;opacity:.9}
#guia .pausa{font-size:.8rem;color:var(--detalle-texto)}
#guia .carga-etapa{display:flex;align-items:center;gap:10px;margin:0 0 10px;font-size:.8rem;color:var(--detalle-texto)}
#guia .carga-etapa i{width:12px;height:12px;border-radius:50%;border:2px solid rgba(250,249,245,.3);border-top-color:var(--senal);animation:vgGiro 900ms linear infinite}
#guia .carga-etapa .enlace{min-height:32px;font-size:.8rem}
body.guia-visible #carga{display:none!important}
#guia .extra{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 12px}
#guia .extra:empty{display:none}
#guia .extra .b{min-height:40px;font-size:.84rem}
#guia .fila{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
#guia.fila-suelta .fila{position:static!important}
.fotos-lote{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:10px 0 4px;position:relative}
.fotos-lote button{padding:0;border:0;border-radius:10px;overflow:hidden;aspect-ratio:4/3;background:rgba(0,0,0,.25);cursor:pointer}
.fotos-lote button img{width:100%;height:100%;object-fit:cover;display:block}
.fotos-lote button:focus-visible{outline:2px solid var(--senal);outline-offset:2px}
.fotos-lote .mas{position:absolute;right:6px;bottom:6px;font:600 .75rem var(--dato);padding:2px 7px;border-radius:999px;background:rgba(20,23,15,.8)}
.fotos-lote + .fuente{margin-top:0}   /* v1.16.1-pedasi.1: la fila fija no puede tapar la tarjeta entera (texto al 200 %) */
#guia.limitada .fila{position:sticky;bottom:-12px;margin-bottom:-12px;padding:10px 0 12px;background:rgb(var(--papel-rgb));box-shadow:0 -10px 12px -10px rgba(0,0,0,.45)}   /* v1.5.6: tarjeta limitada por los controles: las acciones siempre a la vista */
#guia .fila .btn{min-height:44px;padding:10px 18px;font-size:.875rem;backdrop-filter:none;-webkit-backdrop-filter:none}
#guia .invitacion{margin:12px 0 0;padding-top:10px;border-top:1px solid var(--linea);font-size:.78rem;line-height:1.45;opacity:.86}
#guia .invitacion a{color:inherit;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
@media (pointer:coarse){ #guia .invitacion a{display:inline-block;padding:13px 0;margin:-13px 0} }   /* 44 px de toque sin cambiar el aspecto */
#guia .invitacion a:hover{color:var(--base);opacity:1}
.acerca a{color:var(--base);text-decoration:underline;text-underline-offset:3px}
.acerca .autor-logo{display:block;height:22px;width:auto;margin:2px 0 8px}
.acerca .autor-marca{margin-top:18px;padding-top:14px;border-top:1px solid var(--linea)}
.acerca .autor-marca p{margin:0 0 6px}
#panel .cuerpo{position:relative}   /* contiene a los textos solo para lectores (.sr): el panel nunca se desplaza entero */
#panel{overflow:clip}
.acerca h4{font-weight:500;font-size:.94rem;margin:16px 0 6px}
.acerca dl.creditos{display:grid;grid-template-columns:1fr;gap:2px 0;margin:0;font-size:.875rem;line-height:1.45}
.acerca dl.creditos dt{opacity:.72;margin-top:6px}
.acerca dl.creditos dd{margin:0}
.acerca ul.material{margin:0;padding-left:18px;font-size:.875rem;line-height:1.5;opacity:.9}
#guia .salir{margin-left:auto;background:none;border:0;font-size:.8rem;text-decoration:underline;text-underline-offset:3px;padding:10px 4px;opacity:.88}
#b-guia{position:fixed;left:24px;bottom:92px;display:flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border-radius:999px;
  border:1px solid rgba(250,249,245,.35);background:rgba(var(--papel-rgb),.8);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);font-size:.84rem}
#b-guia svg{width:14px;height:14px;fill:currentColor;stroke:none}
#eleccion{position:fixed;left:24px;bottom:92px;width:min(360px,calc(100vw - 48px));padding:16px;border-radius:var(--r);background:var(--velo);border:1px solid var(--borde);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
#eleccion p{margin:0 0 12px;font-size:.875rem;line-height:1.45}
#eleccion .fila{display:flex;flex-direction:column;gap:8px}
#eleccion .btn{width:100%;text-align:left}

/* carga, fallo, ayuda, avisos */
#carga{position:fixed;left:50%;top:18px;transform:translateX(-50%);display:flex;align-items:center;gap:12px;padding:6px 6px 6px 16px;border-radius:999px;background:rgba(12,14,11,.88);font-size:.8rem;z-index:25}
#carga i{width:12px;height:12px;border-radius:50%;border:2px solid rgba(250,249,245,.3);border-top-color:var(--senal);animation:vgGiro 900ms linear infinite}
#carga button,.caja-fallo button.enlace{background:none;border:0;text-decoration:underline;text-underline-offset:3px;padding:8px 10px;font-size:.8rem;min-height:36px}
.caja-fallo{position:fixed;left:50%;top:18px;transform:translateX(-50%);width:min(440px,calc(100vw - 24px));padding:16px 18px;border-radius:var(--r);background:rgba(20,23,15,.96);border:1px solid rgba(var(--detalle-rgb),.45);z-index:26}
.caja-fallo p{margin:0 0 12px;font-size:.875rem;line-height:1.45}
.caja-fallo .fila{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.caja-fallo .btn{min-height:40px;padding:8px 16px;font-size:.84rem}
#ayuda{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);padding:12px 20px;border-radius:999px;background:rgba(12,14,11,.82);font-size:.875rem;pointer-events:none!important}
#aviso{position:fixed;left:50%;top:76px;transform:translateX(-50%);z-index:45;max-width:calc(100vw - 32px);padding:10px 16px;border-radius:14px;background:rgba(12,14,11,.92);font-size:.84rem;line-height:1.4;pointer-events:none!important;text-align:center}
#rev{position:fixed;left:50%;transform:translateX(-50%);bottom:4px;z-index:60;font-family:var(--dato);font-size:10px;opacity:.6;background:rgba(0,0,0,.55);padding:3px 8px;border-radius:6px;pointer-events:none;white-space:nowrap}
@media (prefers-reduced-motion:reduce){#carga i,.giro,.estado-vis .punto{animation:none}}
html.movimiento-reducido #carga i,html.movimiento-reducido .giro,html.movimiento-reducido .estado-vis .punto{animation:none}

/* escritorio estrecho con el panel abierto: controles e índice compactos, nada se monta */
@media (min-width:701px){
  body.con-panel .marca{max-width:calc(100vw - var(--ancho-panel) - 260px)}
  body.con-panel #guia{width:min(420px,calc(100vw - var(--ancho-panel) - 72px))}
}
@media (min-width:701px) and (max-width:1180px){
  body.con-panel .espacial button span{display:none}
  body.con-panel .espacial button{justify-content:center;padding:0 10px}
  body.con-panel .marca{max-width:calc(100vw - var(--ancho-panel) - 120px)}
  body.con-panel nav.principal button{flex-direction:column;gap:2px;padding:4px 10px;font-size:.69rem;min-height:48px;white-space:normal;text-align:center;line-height:1.1}
  body.con-panel nav.principal button.mia b{display:none}
  body.con-panel #vistas{right:calc(var(--ancho-panel) + var(--margen) + 76px)}
}
/* ── MÓVIL · un solo corte (700 px) ── */
@media (max-width:700px){
  :root{--margen:0px}
  .marca{top:14px;left:16px;max-width:calc(100vw - 150px)}
  #rev{bottom:0;top:auto;font-size:8px;padding:1px 6px;max-width:100vw;overflow:hidden}
  .marca img{height:24px}
  .marca .escena{font-size:1.2rem}
  .marca .sub{font-size:.62rem}
  .demo{left:16px;top:calc(14px + 5.1rem);min-height:28px;font-size:.75rem}
  #demo-exp{left:16px;top:calc(14px + 7.4rem)}
  .leyenda-limite{left:16px;top:calc(14px + 8.2rem);max-width:calc(100vw - 110px)}
  body.demo-activo .leyenda-limite{top:calc(14px + 10.5rem)}
  nav.principal{left:10px;right:10px;bottom:max(10px,env(safe-area-inset-bottom));transform:none;justify-content:space-between;border-radius:20px;padding:4px}
  nav.principal button{flex:1 0 auto;min-width:60px;flex-direction:column;gap:3px;padding:6px 2px;min-height:52px;font-size:.69rem;border-radius:14px;white-space:normal;line-height:1.1;text-align:center}
  nav.principal button.mia b{display:none}
  .espacial{top:14px;right:12px}
  .espacial button span{display:none}
  .espacial button{padding:0 10px;justify-content:center}
  .rumbo{padding:6px 10px}
  .zoom{flex-direction:column!important}
  .zoom #c-pantalla{display:none}
  #vistas{top:auto;bottom:calc(84px + env(safe-area-inset-bottom));left:10px;right:10px;width:auto}
  #panel{top:auto;left:0;right:0;bottom:0;width:auto;height:min(62vh,560px);border-radius:22px 22px 0 0;border-bottom:0;transform:translateY(calc(100% + 24px));padding-bottom:env(safe-area-inset-bottom)}
  #panel.abierto{transform:none}
  #panel.expandido{height:calc(100% - 56px)}
  #panel.plegado{height:auto;top:auto;bottom:0}
  #panel.plegado .cuerpo,#panel.plegado .pie,#panel.plegado .tira-guia,#panel.plegado .volver{display:none!important}
  #panel .asa{display:block;width:40px;height:5px;border-radius:3px;background:rgba(250,249,245,.35);margin:8px auto 0;flex:none}
  #panel .cab{padding:6px 10px 8px}
  #panel .cab h2{font-size:1.2rem}
  #panel .plegar{display:inline-flex;align-items:center}
  #panel .cuerpo{padding:14px 16px 16px}
  #panel .pie{padding:10px 12px}
  #panel .pie .b{padding:0 12px}
  body.con-panel .espacial{right:12px}
  body.con-panel nav.principal{left:10px}
  body.con-panel:not(.panel-plegado) nav.principal,body.con-panel:not(.panel-plegado) #guia,body.con-panel #b-guia,
  body.con-panel:not(.panel-plegado) .espacial .grupo,body.con-panel .leyenda-limite{display:none!important}
  body.con-panel.panel-plegado nav.principal{display:none!important}
  body.con-panel #carga,body.con-panel .caja-fallo,body.con-panel #aviso,body.con-panel .volver-vista,body.con-panel .estado-vis{left:50%}
  #guia{left:10px;right:10px;width:auto;bottom:calc(84px + env(safe-area-inset-bottom));padding:14px 16px 12px;max-height:calc(100vh - 200px)}
  #guia h2{font-size:1.25rem}
  #guia p{font-size:.875rem;margin-bottom:10px}
  #b-guia{left:16px;bottom:auto;top:calc(14px + 5.1rem);min-height:40px;padding:0 12px;font-size:.78rem}
  body.demo-activo #b-guia{top:calc(14px + 7.4rem)}
  #eleccion{left:10px;right:10px;width:auto;top:auto;bottom:calc(84px + env(safe-area-inset-bottom));max-height:calc(100vh - 200px);overflow:auto}
  #carga,.caja-fallo{top:auto;bottom:calc(92px + env(safe-area-inset-bottom))}
  #guia{max-height:calc(100vh - 380px)}
  .volver-vista{top:calc(14px + 5.1rem)}
  body.con-panel #carga,body.con-panel .caja-fallo{top:84px;bottom:auto;z-index:35}
  #aviso{top:calc(14px + 7.8rem)}
  #reproductor{left:0;right:0;top:auto;bottom:0;height:calc(100% - 56px);border-radius:22px 22px 0 0;border-bottom:0}
  body.con-panel #reproductor{right:0}
  body.con-reproductor #panel{display:none}
  .estado-vis{top:auto;bottom:calc(84px + env(safe-area-inset-bottom))}
  .estado-vis.activa{left:10px!important;right:10px;transform:none;width:auto;bottom:calc(84px + env(safe-area-inset-bottom))}
  .chip-rec{left:16px;bottom:auto;top:96px}
  #pop-rec{left:16px;right:16px;bottom:auto;top:136px}
  .titulo-lote h3{font-size:2.3rem}
  .plano svg{height:min(62vh,560px)}
  .conf .tarjeta .recorte{height:96px}
}
@media (max-width:700px) and (max-height:779px){ .zoom{display:none!important} }   /* en teléfonos no cabe: se acerca con los dedos */
/* pantalla baja (teléfono horizontal): controles en fila arriba, la guía como columna a la izquierda */
@media (max-height:500px){
  .marca{top:10px;left:12px;flex-direction:row;align-items:center;gap:10px}
  .marca img{height:20px}
  .marca .escena{font-size:1.05rem}
  .marca .sub{display:none}
  .espacial{flex-direction:row;align-items:flex-start;top:8px;right:10px}
  .espacial .grupo{flex-direction:row}
  .espacial button span{display:none}
  .espacial button{padding:0 8px;justify-content:center;min-height:36px;min-width:36px}
  .rumbo{padding:6px 10px}
  .zoom{display:none!important}
  #vistas{top:56px;bottom:auto;right:10px;left:auto;width:min(290px,60vw);max-height:calc(100vh - 130px);overflow:auto}
  #guia{top:52px;bottom:auto;left:10px;right:auto;width:min(380px,50vw);max-height:calc(100vh - 140px);overflow:auto;padding:12px 14px}
  body.demo-activo #guia,body.demo-activo #eleccion{top:80px;max-height:calc(100vh - 168px)}
  #guia h2{font-size:1.15rem}
  #eleccion{top:52px;bottom:auto;left:10px;right:auto;width:min(360px,60vw);max-height:calc(100vh - 130px);overflow:auto}
  #b-guia{top:auto;bottom:76px;left:10px}
  .demo{top:44px;left:12px}
  .leyenda-limite{top:auto;bottom:76px;left:auto;right:10px;max-width:min(330px,45vw)}
  nav.principal button{min-height:44px;padding:4px 8px}
  .estado-vis.activa{bottom:86px;left:10px!important;width:min(340px,50vw);max-height:calc(100vh - 150px);overflow:auto}
  #carga,.caja-fallo{top:52px;bottom:auto}
  #aviso{top:52px}
  .volver-vista{top:52px}
}
@media (min-width:701px) and (max-height:500px){ body.con-panel .espacial{right:calc(var(--ancho-panel) + var(--margen) + 12px)} }
@media (max-width:700px) and (max-height:640px){
  #panel{height:calc(100% - 48px)}
  .conf .tarjeta .recorte{display:none}
  .conf h3{font-size:1.375rem;margin-bottom:10px}
}
@media (max-height:520px){
  #guia{max-height:calc(100vh - 110px)}
  .ctx{padding:8px 12px}
}

/* ── QA general (23 sep) · lo que va al final gana a los bloques anteriores ── */
img.rota{visibility:hidden}
.sin-imagen{background:rgba(250,249,245,.05)!important}
/* toque: nada de uso frecuente por debajo de 44 px */
@media (pointer:coarse){
  .espacial button{min-height:44px;min-width:44px}
  .tira-guia .b,#guia .salir,.b.txt,.tabs button,.indice button,.cats button,#panel .plegar,#b-guia,.volver-vista .b,.volver-vista .cerrar,.wa-ayuda .b.txt{min-height:44px}
  .plano svg{height:auto}                              /* el plano a todo el ancho: lotes más grandes para el dedo */
}
/* controles de la vista sin texto (móvil, tableta con panel): el nombre aparece al entrar y al tocar */
.espacial.rotular button span{display:inline!important;position:absolute;right:calc(100% + 8px);padding:4px 10px;border-radius:8px;background:rgba(var(--papel-rgb),.92);border:1px solid var(--borde);font-size:.78rem;pointer-events:none;white-space:nowrap}
.espacial button{position:relative}
.espacial button:focus-visible span{display:inline!important;position:absolute;right:calc(100% + 8px);padding:4px 10px;border-radius:8px;background:rgba(var(--papel-rgb),.92);border:1px solid var(--borde);font-size:.78rem;pointer-events:none;white-space:nowrap}
@media (max-width:700px){
  #portada .identidad{gap:12px}
  #guia.con-invitacion{max-height:calc(100vh - 300px)}
  #panel.de-guia:not(.expandido):not(.plegado){height:min(48vh,440px)}
  #panel .cab{flex-wrap:nowrap}
  #panel .cab h2{flex:1 1 0;min-width:0}
  #panel .volver{padding:0 10px 0 6px}
  .volver-vista{top:auto;bottom:calc(84px + env(safe-area-inset-bottom));max-width:calc(100vw - 24px)}
  body.panel-plegado #guia{bottom:calc(76px + env(safe-area-inset-bottom));max-height:calc(100vh - 260px)}
  #rev{top:0;bottom:auto}
}
@media (max-height:500px){
  #portada .identidad{flex-direction:row;align-items:center;gap:14px}   /* teléfono horizontal: la firma al lado del logo, sin robar alto */
  #portada.con-firma{padding-top:calc(clamp(20px,4vw,40px) + 56px)}
  .plano svg{height:auto}
  body.con-panel #b-guia{display:none!important}
  #guia{max-height:calc(100vh - 128px)}
  body.demo-activo #guia{max-height:calc(100vh - 156px)}
}
@media (max-height:400px){
  #panel{overflow-y:auto}
  #panel .cuerpo{flex:none;overflow:visible}
}

/* ── IDIOMA Y CRÉDITO DE REVISIÓN (v1.2) ── */
.selector-idioma{display:flex;gap:2px;padding:3px;border-radius:999px;background:rgba(15,17,16,.62);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.selector-idioma button{min-height:44px;min-width:44px;padding:0 12px;border:0;border-radius:999px;background:none;font-size:.78rem;font-weight:600;letter-spacing:.08em;text-decoration:none!important;color:var(--base)}
.selector-idioma button:hover{background:rgba(250,249,245,.12)}
.selector-idioma button[aria-pressed=true]{background:var(--senal);color:var(--tinta)}
#portada .discreto .selector-idioma button{padding:0 12px;background:none}
#portada .discreto .selector-idioma button[aria-pressed=true]{background:var(--senal)}
#portada .discreto{align-items:center}
.espacial .grupo.idiomas{flex-direction:row;border-radius:999px;padding:3px}
.espacial .grupo.idiomas button{justify-content:center;min-width:40px;padding:0 10px;border-radius:999px;font-size:.74rem;font-weight:600;letter-spacing:.08em}
#portada .credito-revision{margin:0;font-size:.72rem;letter-spacing:.04em;line-height:1.35;text-shadow:0 0 2px #000,0 0 4px #000,0 0 8px rgba(0,0,0,.9)}
#portada .credito-revision a{color:var(--base);text-decoration:underline;text-underline-offset:3px;display:inline-block;padding:12px 0;margin:-12px 0}
/* v1.2 · con los controles en fila (teléfono horizontal) los nombres de presentación se pisaban entre sí: ahí no se
   presentan (cada botón conserva su nombre accesible y su título); con el foco, el nombre va debajo del botón */
@media (max-height:500px){
  .espacial.rotular button:not(:focus-visible) span{display:none!important}
  .espacial button:focus-visible span{right:auto;left:50%;top:calc(100% + 6px);transform:translateX(-50%)}
}
@media (max-width:700px){ #b-guia{white-space:normal;text-align:left;line-height:1.25} }
/* ── GUÍA MINIMIZABLE Y COMPACTA EN EL TELÉFONO (v1.3) ── */
#guia .g-min{position:absolute;top:8px;right:8px;min-height:36px;padding:0 10px;border:0;border-radius:999px;background:rgba(250,249,245,.08);font-size:.74rem;text-decoration:underline;text-underline-offset:3px}
@media (pointer:coarse){ #guia .g-min{min-height:44px} }
body.guia-minimizable #guia .prog{margin-right:110px}
#guia .g-min{z-index:2}
body.guia-minimizable #guia .n{margin-right:110px}
#guia.min #g-txt,#guia.min .n,#guia.min .extra,#guia.min #g-firma,#guia.min #g-ant,#guia.min .salir,#guia.min #g-pausa{display:none!important}
#guia.min h2{font-size:1.05rem;margin:2px 0 8px}
.rasgos-lote{margin:10px 0 6px;padding-left:18px;font-size:.9rem;line-height:1.45}
.rasgos-lote li{margin:0 0 4px}
@media (max-width:700px){      /* la tarjeta compacta va con la guía minimizable (opción del caso) */
  body.guia-minimizable #guia{padding:12px 14px 10px}
  body.guia-minimizable #guia h2{font-size:1.15rem;margin:2px 0 6px}
  body.guia-minimizable #guia p:not(.invitacion){font-size:.84rem;line-height:1.42;margin:0 0 8px}
  body.guia-minimizable #guia .n{font-size:.64rem}
}
@media (max-width:700px){ #panel.compacta:not(.plegado):not(.expandido){height:auto;max-height:min(62vh,560px)} #panel.compacta .cuerpo{flex:0 1 auto} }
@media (max-width:700px) and (max-height:400px){ #panel.compacta .cuerpo{flex:none} }   /* v1.7.1: en el teléfono horizontal se desplaza el panel entero: la ficha breve no se encoge bajo su pie */
.marca>div{position:relative}.marca .aqui{position:absolute;left:0;top:calc(100% + 6px);white-space:nowrap;padding:3px 9px;border-radius:999px;background:rgba(20,23,15,.72);border:1px solid rgba(var(--detalle-rgb),.6);font-size:.78rem;letter-spacing:.02em}
.marca .aqui[hidden]{display:none}
/* v1.9 · teléfono vertical: con «Recorrido guiado» / «Ver el recorrido desde el inicio» a la vista (dos líneas posibles),
   la leyenda del lindero baja lo justo para no quedar debajo del botón. */
@media (max-width:700px) and (min-height:501px){ body:has(#b-guia:not([hidden])) .leyenda-limite{top:calc(14px + 5.1rem + 62px)} }
/* v1.9 · teléfono: mientras los controles se presentan con su nombre (5 s al entrar), la leyenda del lindero espera. */
@media (max-width:700px){ body:has(.espacial.rotular) .leyenda-limite{visibility:hidden} }
/* v1.9 · teléfono horizontal: la leyenda del lindero cede mientras la tarjeta del recorrido está a la vista (la etapa
   ya lo explica y en ese alto no caben las dos). El ancho de la tarjeta no cambia: ensancharla tapaba el rótulo del
   proyecto en otros casos (regresión de Las Palmas a 667×375). */
@media (max-height:500px){ body:has(#guia:not([hidden])) .leyenda-limite{display:none} }
/* v1.8.2 · El título del panel no se corta con «…» (QA integral de Terra Jungla, bloque 6; en v1.8.1 era solo
   «Tu selección»). En el teléfono pasa a dos líneas si no cabe. Con el panel estrecho en em (≤ 17 em: 360 px al 150 %,
   teléfono o tableta al 200 %), va en su propia línea bajo «‹ Atrás», «Ocultar» y «✕». Está al final para pesar más
   que las reglas del teléfono. Sin container queries (navegadores viejos) queda el corte de siempre. */
#panel{container:panel / inline-size}
@media (max-width:700px){ #panel .cab h2{white-space:normal;overflow-wrap:break-word;line-height:1.15} }
@container panel (max-width:17em){
  #panel .cab{flex-wrap:wrap;justify-content:flex-end;row-gap:2px;padding-top:4px;padding-bottom:6px}
  #panel .cab .volver{margin-right:auto}
  #panel .cab h2{order:9;flex:1 0 100%;min-width:0;margin:0 0 0 4px;line-height:1.15;white-space:normal;overflow:visible;text-overflow:clip}
  /* con texto grande, la etapa entera que el recorrido pone en la hoja (teléfono) no puede comerse el panel: se limita y
     se desplaza sola, y el contenido (p. ej., «Entender las superficies» desde la etapa 4) queda a la vista (v1.8.2) */
  #panel .tira-guia{flex:none;max-height:40%;overflow-y:auto;align-items:flex-start}
}
/* v1.8.2 · Con texto grande en el teléfono, la hoja breve (ficha, «Tu selección») puede crecer casi a toda la pantalla:
   con el encabezado, la tira del recorrido en pausa y el pie, a 62 vh le quedaban 30 px al contenido (360×640 al 200 %).
   El mínimo en rem (22rem = 352 px a texto normal, 704 px al 200 %) sigue al tamaño de letra al instante; a texto normal
   manda 62 vh, como siempre. Una container query en em no sirve aquí: Chrome no la vuelve a evaluar si solo cambia la
   letra. */
@media (max-width:700px){ #panel.compacta:not(.plegado):not(.expandido){max-height:min(calc(100% - 56px), max(min(62vh,560px), 22rem))} }
/* v1.10 · …pero sin llegar al nombre de la vista (arriba): al 200 % en 390×844, 22rem lo pisaba 10 px. --marca-abajo lo
   mide paneles.js (borde inferior del nombre, que crece con la letra). Sin la variable, la regla de arriba. */
@media (max-width:700px){ #panel.compacta:not(.plegado):not(.expandido){max-height:min(calc(100% - 56px), calc(100% - var(--marca-abajo, 0px) - 8px), max(min(62vh,560px), 22rem))} }

/* v1.8.4 · Con texto grande en un teléfono chico, si la hoja no deja leer (con el recorrido en pausa, la ficha dejaba
   65 px en 360×640 al 200 %), el nombre de la vista se oculta mientras la hoja está abierta y la hoja breve sube hasta su
   tope de 56 px. Una hoja que llega igual al nombre (la alta de «Entender las superficies») también lo oculta, en vez de
   cortarlo. Decide paneles.js (body.sin-marca); al plegar o cerrar la hoja, el nombre vuelve. */
@media (max-width:700px){
  body.con-panel.sin-marca:not(.panel-plegado) .marca{visibility:hidden}
  body.sin-marca #panel.compacta:not(.plegado):not(.expandido){max-height:min(calc(100% - 56px), max(min(62vh,560px), 22rem))}
}

/* v1.11 · capas del masterplan (solo si el caso las trae) */
#capas-panel{position:fixed;top:20px;right:212px;z-index:30;width:300px;padding:10px 12px 12px;border-radius:var(--r);background:var(--velo);border:1px solid var(--borde);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);font-size:.86rem}
#capas-panel h3{margin:4px 2px 8px;font-size:.69rem;letter-spacing:.2em;text-transform:uppercase;opacity:.7;font-weight:500}
.capa-fila{display:flex;align-items:center;gap:10px;min-height:44px;padding:4px 6px;border-radius:10px;cursor:pointer}
.capa-fila:hover{background:rgba(250,249,245,.08)}
.capa-fila input{width:18px;height:18px;margin:0;accent-color:var(--senal);flex:none}
.capa-fila .chips{display:flex;gap:3px;flex:none}
.chip{display:inline-block;width:14px;height:14px;border-radius:4px;background:var(--c);border:1px solid rgba(255,255,255,.75);flex:none}
.chip.linea{background:none;border:0;border-top:3px solid var(--c);height:0;margin-top:0;width:16px;border-radius:0}
.capas-sub{margin:10px 2px 2px;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;opacity:.7}
.capas-nota{margin:10px 2px 0;font-size:.76rem;line-height:1.4;opacity:.85}
.leyenda-capas{position:fixed;right:24px;bottom:24px;z-index:12;display:flex;flex-direction:column;gap:6px;max-width:min(430px,calc(100vw - 48px));padding:9px 12px;border-radius:12px;background:rgba(var(--papel-rgb),.86);border:1px solid var(--borde);font-size:.78rem;line-height:1.35}
.leyenda-capas strong{font-weight:600}
.leyenda-capas .items{display:flex;flex-wrap:wrap;gap:4px 12px}
.leyenda-capas .item{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
body.con-panel .leyenda-capas{right:calc(var(--ancho-panel) + var(--margen) + 16px)}
body.con-reproductor .leyenda-capas,body.con-reproductor #capas-panel{display:none!important}
.en-plano{margin:14px 0 4px;padding:10px 12px;border-radius:12px;border:1px dashed var(--borde)}
.en-plano h4{margin:0 0 6px;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;opacity:.75;font-weight:500}
.en-plano ul{margin:0;padding-left:18px;font-size:.88rem;line-height:1.45}
.en-plano .b{margin-top:8px}
@media (max-width:700px){
  #capas-panel{top:auto;bottom:calc(76px + env(safe-area-inset-bottom));left:12px;right:12px;width:auto;max-height:60vh;overflow:auto}
  .leyenda-capas{left:10px;right:10px;bottom:calc(72px + env(safe-area-inset-bottom));max-width:none;font-size:.74rem;padding:7px 10px}
  body.con-panel .leyenda-capas{display:none!important}
  body.con-capas-panel .leyenda-capas{display:none!important}
}

/* v1.11.2 · Título de la vista con fondo (opcional por caso: `marca_fondo` en el manifiesto). Sobre cielo claro la sombra
   sola no alcanza 4,5 de contraste (medido en Pedasí: p10 3,3 sobre el cielo de la vista general). Un velo del color del
   papel detrás del nombre y el subtítulo; el logo queda fuera. */
body.marca-fondo .marca > div{padding:6px 10px 7px;margin:-6px 0 -7px -10px;border-radius:12px;background:rgba(var(--papel-rgb),.62);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
/* v1.11.2 · Teléfono: la leyenda del lindero cede si la tarjeta del recorrido la tocaría (texto grande en 360×640). La
   decide motor.js midiendo las dos cajas; sin choque, nada cambia. En horizontal ya cedía siempre (v1.9). */
body.leyenda-cede .leyenda-limite{display:none!important}

/* v1.13.1 · En el teléfono, «Qué hay cerca» solo desde la pestaña del dock (opcional por caso: `cerca_solo_dock`). El
   botón de la columna de controles duplicaba el acceso y, con texto al 200 % en 360×640, alargaba la columna y dejaba la
   tarjeta del recorrido sin título ni texto. */
@media (max-width:700px){ body.cerca-solo-dock #c-cerca{display:none!important} }

/* ── v1.14 · JERARQUÍA COMPACTA (opcional por caso: experiencia.jerarquia = "compacta"; body.jer-compacta) ──────────────
   Cinco tamaños de letra en rem (respetan la letra grande del sistema): meta .75 · cuerpo .9375 · acción .9375 · título
   1.625 (1.25 en el teléfono) · cifra 2.125. Una idea y una acción por etapa; el detalle bajo demanda. Sin esta clase,
   nada de lo que sigue aplica (Las Palmas y los demás casos quedan idénticos). */
body.jer-compacta{--t-meta:.75rem;--t-cuerpo:.9375rem;--t-tit:1.625rem;--t-cifra:2.125rem}
/* controles: íconos; «Vistas» conserva su nombre, el resto lo muestra al enfocarlo o en la presentación inicial */
body.jer-compacta .espacial button:not(#c-vistas) > span{display:none}
body.jer-compacta .marca .sub{font-family:var(--dato);letter-spacing:.04em;text-transform:none;font-weight:400;font-size:var(--t-meta)}
/* tarjeta del recorrido */
body.jer-compacta #guia .prog{margin:0 44px 10px 0}
body.jer-compacta #guia .n{position:absolute;top:12px;right:50px;font-size:var(--t-meta);opacity:.8}
body.jer-compacta.guia-minimizable #guia .prog,body.jer-compacta.guia-minimizable #guia .n{margin-right:0}
body.jer-compacta.guia-minimizable #guia .prog{margin-right:84px}
body.jer-compacta #guia .g-min{top:6px;right:6px;width:36px;min-height:36px;padding:0;display:grid;place-items:center;background:none;text-decoration:none}
body.jer-compacta #guia .g-min svg{display:block}
body.jer-compacta #guia .ceja{font-family:var(--dato);font-size:var(--t-meta);opacity:.8;margin:0 0 4px;line-height:1.4}
body.jer-compacta #guia h2{font-size:var(--t-tit);line-height:1.15;margin:2px 0 12px}
body.jer-compacta #guia p{font-size:var(--t-cuerpo)}
body.jer-compacta #guia .g-resumen{margin:0 0 12px}
body.jer-compacta #guia .g-fuente{font-size:var(--t-meta);opacity:.78}
.g-mas{margin:0 0 12px}
.g-mas summary{cursor:pointer;min-height:36px;display:flex;align-items:center;gap:8px;font-size:var(--t-meta);opacity:.88;list-style:none;border-radius:8px}
.g-mas summary::-webkit-details-marker{display:none}
.g-mas summary::before{content:"+";font-family:var(--dato);width:1ch}
.g-mas[open] summary::before{content:"−"}
.g-mas #g-mas-cuerpo{padding-top:4px}
.g-mas #g-mas-cuerpo p{margin:0 0 8px}
@media (pointer:coarse){ .g-mas summary{min-height:44px} }
/* acciones secundarias como enlaces; la principal, sola */
body.jer-compacta #guia .extra{gap:2px 16px;margin:0 0 8px}
body.jer-compacta #guia .extra .b{min-height:36px;padding:0;border:0;background:none;font-size:var(--t-meta);text-decoration:underline;text-underline-offset:4px;opacity:.92}
@media (pointer:coarse){ body.jer-compacta #guia .extra .b{min-height:44px} }
body.jer-compacta #guia .fila .btn{font-size:var(--t-cuerpo)}
body.jer-compacta #guia #g-ant{width:44px;min-width:44px;padding:0;display:grid;place-items:center;border-radius:50%}
body.jer-compacta #guia #g-ant svg{display:block}
body.jer-compacta #guia .salir{flex-basis:100%;margin:2px 0 0;padding:6px 0;text-align:left;font-size:var(--t-meta)}
body.jer-compacta #guia.min .ceja,body.jer-compacta #guia.min .g-resumen,body.jer-compacta #guia.min .g-mas,body.jer-compacta #guia.min .g-fuente{display:none!important}
/* cifras y formas (tarjeta, ficha y selección) */
.vg-cifras{display:flex;gap:18px;align-items:flex-end;flex-wrap:wrap}
.vg-cifra b{display:block;font-family:var(--dato);font-weight:400;font-size:var(--t-cifra,2.125rem);line-height:1}
.vg-cifra span{display:block;margin-top:4px;font-size:var(--t-meta,.75rem);opacity:.82}
.formas{display:flex;gap:16px;align-items:flex-end;flex-wrap:wrap}
.formas figure{margin:0;display:flex;flex-direction:column;gap:6px}
.formas figcaption{font-family:var(--dato);font-size:var(--t-meta,.75rem);line-height:1.3}
.formas figcaption b{display:block;font-weight:400;font-size:1.125rem}
.formas.mini{gap:12px;align-items:center}
.formas.mini figure{flex-direction:row;align-items:center;gap:6px}
.formas.mini figcaption{font-size:.6875rem}.formas.mini figcaption b{font-size:.875rem}
svg.forma{display:block;overflow:visible}
svg.forma path{fill:rgba(var(--detalle-rgb),.24);stroke:var(--detalle);stroke-width:1.5;stroke-linejoin:round;vector-effect:non-scaling-stroke}
svg.forma-ha{display:block;flex:none}
svg.forma-ha rect{fill:none;stroke:var(--detalle-texto);stroke-width:2;stroke-dasharray:5 4;opacity:.9}
.vg-chip{display:inline-flex;align-items:center;gap:6px;margin-top:10px;padding:5px 10px;border-radius:999px;background:var(--suave);border:1px solid var(--linea);font-size:var(--t-meta,.75rem);line-height:1.35}
/* lista única de lotes con formas */
.lista-formas .fila.fila-forma{grid-template-columns:40px 64px 1fr auto;gap:10px;min-height:60px;padding:6px 10px 6px 6px}
.lista-formas .fila .n{font-size:1.375rem}
.lista-formas .fila .f{display:grid;place-items:center;min-height:44px}
.lista-formas .fila .d .ha{display:block;font-family:var(--dato);font-weight:400;font-size:1.0625rem}
.lista-formas .fila .d small{margin-top:1px}
.lista-formas .fila .marca-e{display:flex;align-items:center;gap:6px}
.lista-formas .fila .marca-e svg{width:18px;height:18px}
.sup-ref.ref-forma{font-size:.8125rem;line-height:1.4}
.sup-ref.ref-forma p{margin:0}
/* ficha y selección */
.ficha-cab{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin:0 0 6px}
.ficha-formas{margin:14px 0 6px}
.det-lote{margin:14px 0 0}
.det-lote summary{cursor:pointer;min-height:44px;display:flex;align-items:center;gap:8px;font-size:.8125rem;opacity:.9;list-style:none}
.det-lote summary::-webkit-details-marker{display:none}
.det-lote summary::before{content:"+";font-family:var(--dato);width:1ch}
.det-lote[open] summary::before{content:"−"}
.det-lote .fuente{margin:4px 0 0}
.sel-actual{margin:10px 0 0}
body.jer-compacta .rasgos-lote{margin-top:14px}
/* teléfono: tarjeta más baja y cifras un paso menor */
@media (max-width:700px){
  body.jer-compacta{--t-tit:1.25rem;--t-cifra:1.75rem}
  body.jer-compacta #guia{padding:12px 14px 10px}
  body.jer-compacta #guia .prog{margin-bottom:8px}
  body.jer-compacta #guia .g-resumen{margin-bottom:8px}
  body.jer-compacta #guia .vg-chip{display:none}
  .lista-formas .fila.fila-forma{grid-template-columns:34px 52px 1fr auto;gap:8px}
}
@media (prefers-reduced-motion:reduce){ .g-mas summary,.det-lote summary{transition:none} }
body.jer-compacta #guia #g-ant:disabled{display:none}
body.jer-compacta #guia .salir.ico-salir{position:absolute;top:6px;right:44px;width:36px;min-height:36px;padding:0;margin:0;display:grid;place-items:center;flex-basis:auto;text-decoration:none;opacity:.88;z-index:2}
body.jer-compacta:not(.guia-minimizable) #guia .salir.ico-salir{right:6px}
body.jer-compacta.guia-minimizable #guia .prog{margin-right:124px}
body.jer-compacta #guia .n{right:88px}
body.jer-compacta #guia #g-mas-cuerpo .extra{margin:4px 0 0}
body.jer-compacta .formas.mini{flex-wrap:nowrap;gap:10px}
@media (pointer:coarse){ body.jer-compacta #guia .salir.ico-salir{width:44px;min-height:44px;top:2px} }
@media (pointer:coarse){ body.jer-compacta.guia-minimizable #guia .salir.ico-salir{right:50px} body.jer-compacta #guia .n{right:100px} body.jer-compacta.guia-minimizable #guia .prog{margin-right:136px} }
.ficha-cab .ey{white-space:nowrap;align-self:flex-start}
/* la fila de la lista con formas se reacomoda con texto grande (al 200 % en 360 px la grilla fija se desbordaba) */
.lista-formas .fila.fila-forma{display:flex;flex-wrap:wrap;align-items:center;column-gap:10px;row-gap:2px}
.lista-formas .fila .n{flex:0 0 auto;min-width:1.6em}
.lista-formas .fila .f{flex:0 0 auto;width:56px}
.lista-formas .fila .d{flex:1 1 6.5em;min-width:0;overflow-wrap:anywhere}
.lista-formas .fila .marca-e{flex:0 0 auto;margin-left:auto}
/* v1.14 · la acción principal nunca queda fuera de la vista: si la tarjeta no cabe (texto grande, teléfono horizontal),
   la fila de acciones queda fija al pie y lo del medio se desplaza; el título queda arriba. */
body.jer-compacta #guia .fila{position:sticky;bottom:-10px;margin-bottom:-10px;padding:8px 0 10px;background:linear-gradient(rgba(var(--papel-rgb),.94),rgb(var(--papel-rgb)));z-index:1}
/* con «Más detalle» abierto, la fila vuelve a su lugar: al 200 % en el teléfono, fija ocupaba casi toda la tarjeta y lo abierto no se alcanzaba */
body.jer-compacta #guia:has(#g-mas[open]) .fila{position:static;margin-bottom:0;background:none}
/* v1.14 · el menú Vistas del teléfono (anclado abajo) no pasa del borde de arriba: con diez vistas y texto al 200 % se
   salía de la pantalla y las primeras no se alcanzaban. Con pocas vistas no cambia nada (el tope no se alcanza). */
@media (max-width:700px){ #vistas{max-height:calc(100vh - 84px - env(safe-area-inset-bottom) - 16px);overflow:auto;overscroll-behavior:contain} }
body.jer-compacta .formas.mini figcaption{white-space:nowrap}
body.jer-compacta .formas.mini figcaption b{display:block}
body.jer-compacta .formas.mini{gap:8px}body.jer-compacta .formas.mini figure{gap:5px}

/* ── v1.15 · UNA SOLA ZONA DE LECTURA (jerarquía compacta) ──────────────────────────────────────────────────────────
   Con un panel abierto, la tarjeta del recorrido se contrae a la franja del panel: la etapa y «Volver al recorrido». */
body.jer-compacta .tira-guia{padding:6px 6px 6px 12px;gap:8px}
body.jer-compacta .tira-guia .franja{flex:1 1 auto;min-width:0;font-size:.8125rem;line-height:1.35;overflow-wrap:anywhere}
body.jer-compacta .tira-guia .franja b{font-weight:500;color:var(--detalle-texto)}
body.jer-compacta .tira-guia .b{flex:none}
/* «Ver terreno» / «Ver lista»: también en el teléfono horizontal (poca altura), donde lectura y terreno no caben juntos */
@media (max-height:500px){ body.jer-compacta #panel .plegar{display:inline-flex;align-items:center} }
/* «Volver al encuadre»: aparece solo si el visitante movió la cámara y los lotes de la etapa ya no se ven enteros */
body.jer-compacta #guia .g-encuadre{display:inline-flex;align-items:center;min-height:36px;margin:0 0 8px;padding:0;border:0;background:none;
  color:var(--base);font-size:var(--t-meta);text-decoration:underline;text-underline-offset:4px;cursor:pointer}
body.jer-compacta #guia .g-encuadre[hidden]{display:none}
@media (pointer:coarse){ body.jer-compacta #guia .g-encuadre{min-height:44px} }
body.jer-compacta.letra-grande #panel .plegar{display:inline-flex;align-items:center}
/* en el teléfono y con texto grande, la franja es de una línea: la etapa y la acción (el título ya está en la tarjeta al volver) */
@media (max-width:700px){ body.jer-compacta .tira-guia .franja-tit{display:none} }
body.jer-compacta.letra-grande .tira-guia .franja-tit{display:none}
/* v1.15: en poca altura (teléfono horizontal) con la jerarquía compacta, la cabecera del panel lleva «Ver terreno» y no
   puede partirse en dos filas (la ✕ bajaba sola): «‹ Atrás» queda en su flecha (el nombre accesible sigue siendo
   «Atrás») y el título se parte en su propio espacio en vez de cortarse */
@media (max-height:500px){
  body.jer-compacta #panel .cab{flex-wrap:nowrap}
  body.jer-compacta #panel .cab h2{flex:1 1 auto;min-width:0;white-space:normal;overflow-wrap:break-word;line-height:1.15}
  body.jer-compacta #panel .cab .volver{font-size:0;min-width:40px;justify-content:center}
  body.jer-compacta #panel .cab .volver::before{content:"‹";font-size:1.5rem;line-height:1}
}
/* ── v1.16 · ORIENTACIÓN Y SIGNIFICADO (jerarquía compacta) ────────────────────────────────────────────────────────────
   Controles con nombre corto visible: «Vistas» y «Conjunto» cambian de lugar; «Horizonte», en su propio grupo, orienta
   la cámara. En el teléfono y en pantallas bajas el nombre va chico, debajo del ícono (sin cartel flotante). */
body.jer-compacta .espacial button#c-general > span,body.jer-compacta .espacial button#c-horizonte > span{display:inline}
@media (max-width:700px),(max-height:500px){
  body.jer-compacta:not(.letra-grande) .espacial #c-vistas,body.jer-compacta:not(.letra-grande) .espacial #c-general,body.jer-compacta:not(.letra-grande) .espacial #c-horizonte{flex-direction:column-reverse;justify-content:center;gap:1px;padding:4px 4px 3px;min-width:54px}
  body.jer-compacta:not(.letra-grande) .espacial button#c-vistas > span,body.jer-compacta:not(.letra-grande) .espacial button#c-general > span,body.jer-compacta:not(.letra-grande) .espacial button#c-horizonte > span{display:block!important;position:static!important;transform:none!important;font-size:.625rem;line-height:1.1;padding:0;background:none;border:0;letter-spacing:.01em}
}
/* el tipo de vista (aérea con su altura, o a nivel de suelo) se conserva en pantallas bajas, en una línea bajo el nombre;
   el nombre se parte en su espacio en vez de pasar por debajo de los controles */
@media (max-height:500px){
  body.jer-compacta .marca > div{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:10px;max-width:calc(100vw - 420px)}
  body.jer-compacta .marca .escena{white-space:normal}
  body.jer-compacta .marca .sub{display:block;font-size:.6875rem;margin-top:0}
  /* si la cabecera crece (nombre largo, texto grande), la tarjeta del recorrido empieza debajo */
  body.jer-compacta #guia{top:max(52px,calc(var(--marca-abajo, 0px) + 8px));max-height:calc(100vh - max(52px,calc(var(--marca-abajo, 0px) + 8px)) - 88px)}
}
/* el desvío (la entrada desde la etapa 2): la tarjeta habla de esa vista y el regreso va como botón, a la vista */
body.jer-compacta #guia.en-desvio #g-extra{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 2px}
body.jer-compacta #guia.en-desvio #g-txt{margin-top:6px}
/* «Ver terreno» de la tarjeta: la misma forma que «Volver al encuadre» */
body.jer-compacta #guia .g-terreno{display:inline-flex}
body.jer-compacta #guia .g-terreno[hidden]{display:none}
/* «Trazado orientativo» bajo el nombre de la vista (se toca para leer la explicación y la fuente) */
.marca .trazo{pointer-events:auto;position:absolute;left:0;top:calc(100% + 6px);white-space:nowrap;display:inline-flex;align-items:center;gap:6px;min-height:28px;padding:3px 10px;border-radius:999px;border:1px solid rgba(250,249,245,.45);background:rgba(20,23,15,.55);color:var(--base);font-size:.75rem;line-height:1.2;cursor:pointer}
.marca .trazo i{width:14px;height:10px;border:1.5px dashed currentColor;border-radius:2px;flex:none}
.marca .trazo:focus-visible{outline:2px solid var(--base);outline-offset:2px}
@media (pointer:coarse){ .marca .trazo{min-height:36px} }
.trazo-info{max-width:min(340px,calc(100vw - 24px))}
@media (max-height:500px){ .marca .trazo{top:calc(100% + 4px);min-height:26px;padding:2px 8px;font-size:.6875rem} }
/* ficha: junto a «Guardar», qué es (selección personal) y qué no es (reserva); «Ver a nivel de suelo» con su aclaración */
body.jer-compacta #panel-pie .nota-guardar{flex:1 0 100%;margin:2px 0 0;font-size:var(--t-meta);line-height:1.35;opacity:.82;text-align:center}
body.jer-compacta #panel .ver-suelo{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin:8px 0 4px}
body.jer-compacta #panel .ver-suelo small{font-size:var(--t-meta);opacity:.8}
/* «Volver a …» flotante (hoja oculta tras ubicar un lote en otra vista): compacto, el nombre se parte si hace falta */
body.jer-compacta .volver-vista{border-radius:16px;max-width:calc(100vw - 24px)}
body.jer-compacta .volver-vista .b{white-space:normal;text-align:left;line-height:1.2;padding:6px 12px}
@media (max-width:700px){ body.jer-compacta .volver-vista{top:auto;bottom:calc(84px + env(safe-area-inset-bottom));left:12px;right:auto;transform:none} }
/* pantalla baja con la hoja abierta: los controles se corren junto a la hoja y ocupan la franja de arriba; el nombre de la
   vista (con su tipo) baja a la línea siguiente para no quedar debajo de ellos */
@media (min-width:701px) and (max-height:500px){
  body.jer-compacta.con-panel .marca{top:58px}
  body.jer-compacta.con-panel .marca > div{max-width:calc(100vw - var(--ancho-panel) - var(--margen) - 130px)}
}
/* el contenedor de los controles es más ancho que algunos grupos (el selector de idioma, con texto grande): en los huecos
   entre grupos, los toques y arrastres pasan a la panorámica */
body.jer-compacta #ui .espacial{pointer-events:none}
body.jer-compacta #ui .espacial > *{pointer-events:auto}
/* con texto grande en el teléfono, «Trazado orientativo» en su forma corta y en una línea (el completo, al tocarlo) */
.marca .trazo .corto{display:none}
@media (max-width:700px){ body.letra-grande .marca .trazo .largo{display:none} body.letra-grande .marca .trazo .corto{display:inline;white-space:nowrap} }
/* con texto grande en el teléfono, los nombres bajo los íconos (a doble tamaño) ensanchaban la columna de controles y
   tapaban el terreno: quedan los íconos, con su nombre en la presentación inicial, al enfocarlos y en el nombre accesible */
@media (max-width:700px),(max-height:500px){ body.jer-compacta.letra-grande .espacial:not(.rotular) button#c-general > span,body.jer-compacta.letra-grande .espacial:not(.rotular) button#c-horizonte > span{display:none} }
/* «Ver terreno» de la tarjeta, en la fila de «Más detalle» (a la derecha): aparecer no cambia el alto de la tarjeta */
body.jer-compacta #guia .g-terreno.en-fila{position:absolute;right:16px;margin:0}
/* el menú «Vistas» va por encima de «Trazado orientativo» (en el teléfono se abren en la misma zona) */
body.jer-compacta #vistas{z-index:27}
/* con texto grande en el teléfono, el pie de la ficha queda en «Guardar» y su nota corta («No es una reserva»); «Ubicar …»
   pasa al cuerpo como enlace (como «Ver a nivel de suelo»): la ficha conserva su contenido a la vista */
#panel-pie .nota-guardar .corto,#panel .ubicar-cuerpo{display:none}
@media (max-width:700px){
  body.letra-grande #panel-pie .nota-guardar .largo{display:none}
  body.letra-grande #panel-pie .nota-guardar .corto{display:inline}
  body.letra-grande #panel-pie .nota-guardar{margin:0;line-height:1.2}
  body.letra-grande #panel .ubicar-cuerpo{display:block;margin:8px 0 4px}
  body.letra-grande #panel-pie:has(.nota-guardar) [data-accion="terreno"]{display:none}
}
/* v1.16.1: relleno rayado del vendido en el plano (después de la regla general de vendido/reservado) */
.plano .u.vendido path{fill:url(#vg-rayado)}
/* v1.16.1-tinajones: pie de la ficha con contacto: WhatsApp principal, «Ver el terreno» al lado, guardar y volver como texto en una fila aparte */
#panel .pie .pie-sec{flex:1 0 100%;display:flex;gap:6px 14px;flex-wrap:wrap;justify-content:center;margin:2px 0 0}
#panel .pie .pie-sec .b.txt{min-height:40px}
/* v1.16.1-tinajones.1: en apaisado con un panel abierto, los controles (dos filas) rozaban el bloque del nombre de la vista por 4 px: el bloque baja */
@media (min-width:701px) and (max-height:500px){ body.con-panel .marca{margin-top:8px} }
/* ── v1.16.1-tinajones.3 · ESTADOS VISUALES DEL CASO, CAPAS CON CONTROL Y GRUPO DE CAPAS ───────────────────────────────
   Solo con `estados_visual` (body.estados-visual): el estado confirmado se pinta con el color del caso, sin rayado, y se
   escribe; un lote sin estado confirmado queda neutro (sin el tinte de la señal, que no debe leerse como «disponible»). */
body.estados-visual .plano .u path,body.estados-visual .recorte .u path{fill:rgba(250,249,245,.05)}
body.estados-visual .plano .u:hover path,body.estados-visual .plano .u:focus-visible path{fill:rgba(250,249,245,.16);stroke:var(--senal)}
body.estados-visual .plano .u.ev path,body.estados-visual .plano .u.vendido.ev path,body.estados-visual .plano .u.reservado.ev path,body.estados-visual .recorte .u.ev path{fill:var(--ev);fill-opacity:var(--ev-a);stroke:var(--ev);stroke-opacity:.95;stroke-dasharray:none}
body.estados-visual .plano .u.ev{cursor:default}
body.estados-visual .plano .u.ev text{fill:#FAF9F5;text-decoration:none}
body.estados-visual .plano .u .t-estado{font-weight:500;letter-spacing:.02em}
body.estados-visual .plano-ley i.l{background:rgba(250,249,245,.05)}
body.estados-visual .plano-ley i.v.ev{border:1px solid var(--ev);background:var(--ev);opacity:.75}
body.estados-visual .lista li.fila.vendida,body.estados-visual .sup-lista li.fila.vendida{background:rgba(var(--ev-vendido-rgb),.14);border-color:rgba(var(--ev-vendido-rgb),.5)}
body.estados-visual .lista .fila.vendida{opacity:1}
body.estados-visual .lista li.fila.vendida .n{opacity:.9}
body.estados-visual .disp-et.e-vendido{background:rgba(var(--ev-vendido-rgb),.5);border-color:rgba(var(--ev-vendido-rgb),.9);color:#FAF9F5}
body.estados-visual .disp-et.e-reservado{background:rgba(var(--ev-reservado-rgb),.35);border-color:rgba(var(--ev-reservado-rgb),.9);color:#FAF9F5}
body.estados-visual .disp-et.e-disponible{background:rgba(var(--ev-disponible-rgb),.3);border-color:var(--ev-disponible);color:#FAF9F5}
/* capas con control propio en el plano (quebradas, calles), debajo de los lotes */
.plano .capa{pointer-events:none}
.plano .capa-quebrada path{fill:#2E86D1;fill-opacity:.75;stroke:#9FD3FF;stroke-width:.8;stroke-opacity:.8;vector-effect:non-scaling-stroke}
.plano .capa-calles path{fill:#F1ECE1;fill-opacity:.42;stroke:none}
.plano .capa text{fill:#CFEAFF;font-style:italic;text-anchor:middle;dominant-baseline:middle;font-family:var(--ui);paint-order:stroke;stroke:rgba(10,14,12,.75);stroke-width:2px;vector-effect:non-scaling-stroke}
.plano-capas{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 10px}
.chip-capa{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 14px;border-radius:999px;border:1px solid var(--borde);background:rgba(250,249,245,.06);font-size:.84rem}
.chip-capa i{width:14px;height:10px;border-radius:3px;background:#2E86D1;opacity:.85}
.chip-capa.capa-calles i{background:#F1ECE1;opacity:.6}
.chip-capa[aria-pressed=false]{opacity:.62}
.chip-capa[aria-pressed=false] i{opacity:.25}
.chip-capa[aria-pressed=true]{border-color:rgba(250,249,245,.5);background:rgba(250,249,245,.12)}
/* grupo «Qué se muestra en la vista» (jerarquía compacta): cada capa con su nombre visible */
body.jer-compacta .espacial #u-capas button > span{display:inline}
/* encendido = ícono en la señal y fondo apenas marcado; apagado = atenuado (no un bloque de botones llenos) */
.espacial #u-capas button[aria-pressed=true]{background:rgba(var(--senal-rgb),.16);color:var(--base)}
.espacial #u-capas button[aria-pressed=true] svg{color:var(--senal);stroke:var(--senal)}
.espacial #u-capas button[aria-pressed=false]{color:rgba(250,249,245,.55)}
.espacial #u-capas button[aria-pressed=false] svg{opacity:.5}
@media (max-width:700px),(max-height:500px){
  body.jer-compacta:not(.letra-grande) .espacial #u-capas button{flex-direction:column-reverse;justify-content:center;gap:1px;padding:4px 4px 3px;min-width:54px}
  body.jer-compacta:not(.letra-grande) .espacial #u-capas button > span{display:block!important;position:static!important;transform:none!important;font-size:.625rem;line-height:1.1;padding:0;background:none;border:0;letter-spacing:.01em}
}
/* capas plegadas en pantallas chicas: un botón «Capas» abre la lista (en escritorio la lista va a la vista y el botón no está) */
#c-capas-menu{display:none}
#u-capas-lista{display:contents}
#u-capas{position:relative}
@media (max-width:700px),(max-height:500px){
  .espacial #c-capas-menu{display:flex}
  .espacial #u-capas-lista{display:none;position:absolute;right:0;top:calc(100% + 6px);flex-direction:column;gap:2px;padding:4px;border-radius:14px;background:rgba(var(--papel-rgb),.94);border:1px solid var(--borde);z-index:5;min-width:180px}
  .espacial #u-capas.abierto #u-capas-lista{display:flex}
  body.jer-compacta .espacial #u-capas-lista button{flex-direction:row!important;justify-content:flex-start!important;gap:10px!important;padding:0 12px!important;min-height:44px}
  body.jer-compacta .espacial #u-capas-lista button > span{display:inline!important;font-size:.84rem!important;position:static!important}
  .espacial #u-capas-lista button svg{order:-1}
}
body.letra-grande .espacial #c-capas-menu{display:flex}
body.letra-grande .espacial #u-capas-lista{display:none;position:absolute;right:0;top:calc(100% + 6px);flex-direction:column;gap:2px;padding:4px;border-radius:14px;background:rgba(var(--papel-rgb),.94);border:1px solid var(--borde);z-index:5}
body.letra-grande .espacial #u-capas.abierto #u-capas-lista{display:flex}
@media (max-width:700px),(max-height:500px){ body.jer-compacta:not(.letra-grande) .espacial #c-capas-menu{flex-direction:column-reverse;justify-content:center;gap:1px;padding:4px 4px 3px;min-width:54px}
  body.jer-compacta:not(.letra-grande) .espacial #c-capas-menu > span{display:block!important;position:static!important;transform:none!important;font-size:.625rem;line-height:1.1;padding:0;background:none;border:0;letter-spacing:.01em} }
body.jer-compacta .espacial button#c-capas-menu > span{display:inline}
.espacial #u-capas.abierto #c-capas-menu{background:rgba(250,249,245,.14)}
@media (max-width:700px),(max-height:500px){ body.jer-compacta.letra-grande .espacial:not(.rotular) button#c-capas-menu > span{display:none} }
/* ── v1.16.1-tinajones.4 · BLOQUE 2: portada, barra, panel unificado, controles a la izquierda ────────────────────────── */
#portada .acciones .btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linejoin:round;stroke-linecap:round;margin-right:8px;vertical-align:-3px}
#portada .acciones .btn.primario svg path{fill:currentColor;stroke:none}
#portada .desarrollador{margin:0;font-size:.78rem;letter-spacing:.06em;color:var(--base);opacity:.92;text-shadow:0 0 2px #000,0 0 6px rgba(0,0,0,.8)}
#portada .firma-autor a{color:var(--base);text-decoration:underline;text-underline-offset:3px;display:inline-block;padding:10px 0;margin:-10px 0}
#portada .logo{max-width:min(46vw,220px);width:auto;object-fit:contain}
/* barra: «Recorrido» separado del resto */
#dock button.recorrido{color:var(--senal)}
#dock i.sep{display:block;width:1px;align-self:stretch;margin:6px 2px;background:rgba(250,249,245,.22)}
/* grupo «Qué mostrar» con título */
.espacial .grupo-tit{font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;opacity:.7;padding:6px 10px 2px;text-align:right}
body.controles-izq .espacial .grupo-tit{text-align:left}
/* controles a la izquierda, bajo el nombre de la vista; el panel ya no los mueve */
body.controles-izq .espacial{left:24px;right:auto;align-items:flex-start;top:max(120px,calc(var(--marca-abajo,76px) + 48px))}   /* bajo el nombre de la vista y el chip «Trazado orientativo» */
body.controles-izq.con-panel .espacial{right:auto}
body.controles-izq .espacial button{justify-content:flex-start;flex-direction:row-reverse}
body.controles-izq .espacial.rotular button span,body.controles-izq .espacial button:focus-visible span{right:auto;left:calc(100% + 8px)}
body.controles-izq #u-capas-lista{left:0;right:auto}
body.controles-izq #guia{left:auto;right:24px}
body.controles-izq #b-guia{left:auto;right:24px}
body.controles-izq.con-panel #guia{right:calc(var(--ancho-panel) + var(--margen) + 16px)}
@media (max-width:700px){
  body.controles-izq .espacial{left:10px;right:auto;top:calc(var(--marca-abajo,76px) + 44px);bottom:auto;flex-direction:row;align-items:flex-start}
  body.controles-izq #u-capas-lista{left:0;right:auto;top:calc(100% + 6px)}
  body.controles-izq #guia{left:10px;right:10px}
}
@media (min-width:701px) and (max-height:500px){
  body.controles-izq .espacial{left:10px;right:auto;top:calc(var(--marca-abajo,52px) + 40px);flex-direction:row;align-items:flex-start}
  body.controles-izq #guia{left:auto;right:10px;width:min(380px,44vw);max-height:calc(100vh - 150px)}
  body.controles-izq #b-guia{left:auto;right:10px}
}
/* vendido en el plano: estado chico bajo el número */
.plano .u .t-estado{opacity:.9}
/* ── v1.16.1-tinajones.7 · BLOQUE 3: ficha «comprador», lista, máscara, WhatsApp directo ─────────────────────────────── */
.foto-lote-grande{display:block;width:100%;padding:0;border:0;border-radius:14px;overflow:hidden;background:rgba(0,0,0,.3);cursor:zoom-in;margin:0 0 14px}
.foto-lote-grande img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:contain;background:#0d110e}
.foto-lote-grande:focus-visible{outline:2px solid var(--senal);outline-offset:2px}
.lote-cab{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin:0 0 10px}
.lote-cab .ey{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;opacity:.8}
.lote-cab .num{font:400 2rem/1 var(--tit);margin:0}
.lote-cab .disp-et{margin-left:auto}
.disp-et.e-consultar{border-color:var(--linea);opacity:.85}
.precio-lote{display:flex;flex-direction:column;gap:4px;padding:12px 14px;border-radius:14px;background:rgba(250,249,245,.06);border:1px solid var(--linea);margin:0 0 12px}
.precio-lote b{font-family:var(--dato);font-weight:400;font-size:1.6rem;line-height:1.1}
.precio-lote.sin-precio b{font-size:1.15rem;opacity:.92}
.precio-lote .plan{font-size:.95rem}
.precio-lote .fuente{margin:2px 0 0;font-size:.74rem;opacity:.72}
.area-rasgos{margin:0 0 10px}
.area-rasgos .area{display:inline-block;font-family:var(--dato);font-size:1.05rem;margin:0 0 4px}
.area-rasgos .rasgos-lote{margin:4px 0 0}
#panel .ficha-comprador .det-lote{margin-top:10px}
.lista-comprador li{list-style:none}
.lista-comprador .fila-comprador{display:grid;grid-template-columns:44px 1fr auto;gap:10px;align-items:center;width:100%;min-height:60px;padding:10px 12px;border-radius:14px;border:1px solid var(--linea);background:var(--suave);text-align:left;margin:0 0 8px}
.lista-comprador .fila-comprador .n{font:400 1.4rem var(--tit)}
.lista-comprador .fila-comprador .d b{display:block;font-family:var(--dato);font-weight:400;font-size:1rem}
.lista-comprador .fila-comprador .d small{display:block;font-size:.8rem;opacity:.85;margin-top:2px}
.lista-comprador .fila-comprador .ver{font-size:.8rem;color:var(--senal);white-space:nowrap}
.lista-comprador .fila-comprador:hover,.lista-comprador .fila-comprador:focus-visible{border-color:var(--senal)}
.lista-comprador .fila.vendida{min-height:52px}
/* WhatsApp directo en la barra: un enlace con el aspecto de los botones */
#dock a.wa-dock{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border-radius:999px;text-decoration:none;color:inherit;font-size:.875rem}
#dock a.wa-dock:hover{background:rgba(250,249,245,.1)}
.ico-wa{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linejoin:round;stroke-linecap:round}
#panel a.wa-b .ico-wa{width:18px;height:18px;margin-right:4px}
/* máscara de «Ubicar lote»: sin bloquear clics ni tapar la interfaz */
#mascara-lote{position:fixed;inset:0;z-index:19;pointer-events:none;opacity:0;transition:opacity 400ms ease}
/* en el teléfono, durante el recorrido, la fila de controles deja ver la vista (el paso fija sus propias capas) */
/* v1.16.1-tinajones.8 (UX-02): durante el recorrido los controles espaciales se retiran en todos los tamaños (el paso fija sus capas) */
body.en-guia.controles-izq .espacial{display:none}
/* plano: rótulos de calle discretos, lejos de los números */
.plano .capa-calles text{font-size:7px;opacity:.75;letter-spacing:.02em}

/* ── v1.16.1-tinajones.8 · cierre UX/UI ───────────────────────────────────────────────────────────────────────────── */
/* ficha sin fotografía: el estado solo, alineado a la derecha, sin repetir «Lote N» */
.lote-cab.solo-estado{justify-content:flex-end;margin:-4px 0 10px}
.lote-cab.solo-estado .disp-et{margin-left:0}
.precio-lote{margin-bottom:12px}
.fuente.nota-publica{margin:0 0 10px}
.det-lote .fuente+.fuente{margin-top:6px}
/* barra inferior en teléfonos: el enlace de WhatsApp con la misma forma que los botones (UX-04, 320 px) */
@media (max-width:700px){
  nav.principal a.wa-dock,#dock a.wa-dock{flex:1 0 auto;min-width:56px;flex-direction:column;justify-content:center;gap:3px;padding:6px 2px;min-height:52px;font-size:.69rem;border-radius:14px;white-space:normal;line-height:1.1;text-align:center}
  nav.principal button{min-width:56px;padding:6px 2px}
  nav.principal i.sep{margin:6px 0}
  nav.principal a.wa-dock:focus-visible,nav.principal button:focus-visible{outline:2px solid var(--senal);outline-offset:-2px}
}
@media (max-width:360px){
  nav.principal{gap:2px;padding:3px}
  nav.principal button,nav.principal a.wa-dock,#dock a.wa-dock{min-width:0;font-size:.66rem;padding:6px 1px}
}
/* logo de la portada en el teléfono: alto propio (marca.alto_movil), sin trasladar el de escritorio */
@media (max-width:700px){ #portada .logo{height:var(--logo-alto-movil,var(--logo-alto,40px))} }
.descripcion-lote{margin:0 0 10px;font-size:.94rem;line-height:1.5}
/* v1.16.1-tinajones.10: en pantallas bajas (320×568) la tarjeta del recorrido deja ver el párrafo entero: más alto disponible,
   texto algo más compacto y espacio bajo el texto para que la fila de acciones (pegajosa) no tape la última línea */
@media (max-width:700px) and (max-height:640px){
  #guia{max-height:calc(100vh - 230px);padding:10px 14px 10px}
  #guia #g-tit{font-size:1.15rem;margin:2px 0 4px}
  #guia #g-txt{font-size:.86rem;line-height:1.35;padding-bottom:2px}
  body.jer-compacta #guia .fila{margin-top:2px;padding:6px 0 8px}
}

/* ── «Entorno y ubicación» (v1.16.1-tinajones.12): mapa de contexto dentro de la sección del panel Proyecto ── */
.entorno{margin:4px 0 14px}
.ctx-tabs{margin:0 0 10px}
.mapa-ctx{position:relative;height:300px;border-radius:14px;overflow:hidden;background:#2a3331;margin:0 0 10px;touch-action:pan-y}
.mapa-ctx.arrastrable{touch-action:none;cursor:grab}
.mapa-ctx.cargando,.mapa-ctx.error{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:16px;text-align:center}
.entorno .mapa-ctx.cargando p,.entorno .mapa-ctx.error p{margin:0;font-size:.9rem}
.ctx-svg{display:block;width:100%;height:100%;outline:none;font-family:var(--txt)}
.ctx-svg:focus-visible{box-shadow:inset 0 0 0 3px var(--senal)}
.ctx-svg .fondo{fill:#2a3331}
.ctx-svg .pais{fill:#36413d;stroke:rgba(250,249,245,.35);stroke-width:1}
.ctx-svg .agua{fill:#4b6b7a;stroke:rgba(250,249,245,.2);stroke-width:.6}
.ctx-svg .provincia{fill:rgba(168,181,162,.14);stroke:rgba(168,181,162,.55);stroke-width:1}
.ctx-svg .distrito{fill:rgba(168,181,162,.22);stroke:rgba(168,181,162,.8);stroke-width:1.2}
.ctx-svg .mk.area:hover path,.ctx-svg .mk.area:focus-visible path{stroke:#fff}
.ctx-svg .mk.area.elegido path{stroke:#fff;stroke-width:1.8}
.ctx-svg .via-r{fill:none;stroke:#d9c9a3;stroke-width:1.8;stroke-linejoin:round;stroke-linecap:round}
.ctx-svg .via-reg.autopista .via-r{stroke-width:2.6}
.ctx-svg .via-c{fill:none;stroke:rgba(250,249,245,.45);stroke-width:1.4;stroke-linejoin:round;stroke-linecap:round}
.ctx-svg .via-cerca.tertiary .via-c{stroke-width:1}
.ctx-svg .ruta .linea{fill:none;stroke-width:calc(3px*var(--k,1));stroke-linejoin:round;stroke-linecap:round}
.ctx-svg .ruta .halo-l,.ctx-svg .tramo .halo-l{fill:none;stroke:transparent;stroke-width:16}
.ctx-svg .ruta-trapichito .linea{stroke:#6fb3d6}
.ctx-svg .ruta-espino .linea{stroke:#e0a060}
.ctx-svg .ruta-comun .linea{stroke:#f3efe3;stroke-width:calc(3.6px*var(--k,1))}
.ctx-svg .ruta.elegido .linea{stroke-width:calc(5px*var(--k,1));stroke:#fff}
.ctx-svg .tramo .punteada{fill:none;stroke:#f3efe3;stroke-width:calc(2.2px*var(--k,1));stroke-dasharray:6 5;stroke-linecap:round}
.ctx-svg .tramo.elegido .punteada{stroke:#fff;stroke-width:3.2}
.ctx-svg .lindero{fill:rgba(var(--senal-rgb),.55);stroke:#fff;stroke-width:1.2}
.ctx-svg .rot{fill:var(--base);font-size:calc(12.5px*var(--k,1));paint-order:stroke;stroke:rgba(20,23,15,.85);stroke-width:calc(3px*var(--k,1));stroke-linejoin:round;pointer-events:none}
.ctx-svg .mk .rot{pointer-events:auto;cursor:pointer}
.ctx-svg .mk-halo{cursor:pointer}
.ctx-svg .mk-halo .halo{fill:transparent}
.ctx-svg .rot.zona{fill:rgba(250,249,245,.78);font-size:calc(11px*var(--k,1));letter-spacing:.06em;text-transform:uppercase}
.ctx-svg .rot.zona.agua{fill:#cfe3ec;font-style:italic;text-transform:none;letter-spacing:0}
.ctx-svg .rot.proy-t{fill:var(--senal);font-weight:700;font-size:calc(14px*var(--k,1))}
.ctx-svg .rot.tramo-t{fill:rgba(250,249,245,.85);font-size:calc(11px*var(--k,1))}
.ctx-svg .mk{cursor:pointer;outline:none}
.ctx-svg .mk .halo{fill:transparent}
.ctx-svg .mk circle:not(.halo){fill:var(--detalle);stroke:rgba(20,23,15,.85);stroke-width:calc(1.6px*var(--k,1))}
.ctx-svg .mk.aprox circle:not(.halo){fill:#2a3331;stroke:var(--detalle);stroke-dasharray:2.5 2}
.ctx-svg .mk.ciudad circle:not(.halo){fill:#f3efe3}
.ctx-svg .mk.vias circle:not(.halo){fill:#d9c9a3}
.ctx-svg .mk.referencias circle:not(.halo){fill:#cfe3ec}
.ctx-svg .mk:hover circle,.ctx-svg .mk:focus-visible circle{stroke:#fff}
.ctx-svg .mk.elegido circle:not(.halo){fill:var(--senal);stroke:#fff;stroke-dasharray:none}
.ctx-svg .mk.elegido .rot{fill:#fff}
.ctx-svg .mk.proy .aro{fill:rgba(var(--senal-rgb),.35);stroke:var(--senal);stroke-width:2.2}
.ctx-svg .mk.proy .centro{fill:#fff;stroke:var(--senal);stroke-width:1.5}
.ctx-svg .mk.proy.elegido .aro{fill:rgba(var(--senal-rgb),.6);stroke:#fff}
.ctx-svg .recuadro rect{fill:rgba(20,23,15,.78);stroke:rgba(250,249,245,.35);stroke-width:1}
.ctx-svg .recuadro path{fill:#4a564f;stroke:rgba(250,249,245,.6);stroke-width:.8}
.ctx-svg .recuadro .marco{fill:rgba(168,181,162,.18);stroke:var(--senal);stroke-width:1.2}
.ctx-svg .recuadro .punto{fill:var(--senal);stroke:#fff;stroke-width:1}
.ctx-svg .recuadro text{fill:rgba(250,249,245,.8);font-size:calc(9px*var(--k,1));letter-spacing:.06em;text-transform:uppercase}
.ctx-svg .escala line{stroke:rgba(250,249,245,.8);stroke-width:calc(2px*var(--k,1))}
.ctx-svg .escala text{fill:rgba(250,249,245,.85);font-size:calc(10.5px*var(--k,1))}
.ctx-svg .norte path{fill:rgba(250,249,245,.85)}
.ctx-svg .norte text{fill:rgba(250,249,245,.85);font-size:calc(10.5px*var(--k,1))}
.ctx-herr{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 10px}
.ctx-ctl{display:flex;gap:6px}
.ctx-ctl button{width:44px;height:40px;border-radius:10px;border:1px solid var(--linea);background:none;color:var(--base);font-size:1.3rem;line-height:1}
.ctx-ctl button:hover{background:rgba(250,249,245,.08)}
.ctx-herr .ctx-centrar{min-height:40px;padding:0 14px;border-radius:999px;border:1px solid var(--linea);background:none;color:var(--base);font-size:.86rem}
.ctx-herr .ctx-centrar:hover{background:rgba(250,249,245,.08)}
.entorno .ctx-atrib{position:absolute;right:8px;bottom:5px;margin:0;font-size:.64rem;line-height:1.2;opacity:.75;pointer-events:none;color:var(--base)}
.capas-ctx{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 10px}
.capas-ctx .capa-b{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 12px 0 10px;border-radius:999px;border:1px solid var(--linea);background:none;font-size:.84rem;color:var(--base)}
.capas-ctx .capa-b i{width:14px;height:14px;border-radius:4px;border:1.5px solid rgba(250,249,245,.5);display:inline-block;position:relative}
.capas-ctx .capa-b[aria-pressed=true]{border-color:var(--senal)}
.capas-ctx .capa-b[aria-pressed=true] i{background:var(--senal);border-color:var(--senal)}
.capas-ctx .capa-b[aria-pressed=true] i::after{content:"";position:absolute;left:4px;top:1px;width:4px;height:8px;border:solid var(--tinta);border-width:0 2px 2px 0;transform:rotate(45deg)}
.ctx-ficha{border:1px solid var(--linea);border-radius:12px;padding:12px 14px;outline:none}
.ctx-ficha:focus-visible{border-color:var(--senal)}
.ctx-ficha .cat{font:.72rem var(--dato);letter-spacing:.08em;opacity:.78;text-transform:uppercase}
.ctx-ficha h4{font:400 1.1rem/1.25 var(--tit);margin:2px 0 6px}
.entorno .ctx-ficha p{font-size:.92rem;line-height:1.5;margin:0 0 6px}
.entorno .ctx-ficha .fuente-sec{margin:8px 0 0;font-size:.78rem;opacity:.65;line-height:1.45}
.ctx-acc{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0 0}
.ctx-acc .b.ter{border:1px solid var(--linea);min-height:40px;padding:0 12px;font-size:.86rem}
.entorno p.ctx-nota{margin:8px 0 0;font-size:.8rem}
.ctx-svg .mk .rot.agua-t{fill:#d5e8f0;font-style:italic;font-weight:500}
.ctx-svg .rot.zona.mar{fill:#bcd6e2;font-style:italic;text-transform:none;letter-spacing:0}
.ctx-svg .mk.agua:hover .rot,.ctx-svg .mk.agua:focus-visible .rot,.ctx-svg .mk.agua.elegido .rot{fill:#fff;text-decoration:underline}
.ctx-svg .mk.proy .hit{fill:transparent}
.ctx-svg .mk.proy.sin-aro .rot.proy-t{fill:var(--senal)}
.ctx-svg .borde .flecha{stroke:rgba(20,23,15,.85);stroke-width:calc(1.2px*var(--k,1));stroke-linejoin:round}
.ctx-svg .borde.ruta-trapichito .flecha{fill:#6fb3d6}
.ctx-svg .borde.ruta-espino .flecha{fill:#e0a060}
.ctx-svg .borde.elegido .flecha{fill:#fff}
.ctx-svg .rot.borde-t{font-size:calc(11.5px*var(--k,1));fill:rgba(250,249,245,.92)}
.ctx-svg .mk.borde .rot{pointer-events:auto}
.ctx-svg .recuadro .caja{fill:rgba(20,23,15,.78);stroke:rgba(250,249,245,.35);stroke-width:1}
.ctx-ley{display:flex;flex-wrap:wrap;gap:4px 14px;list-style:none;margin:0 0 10px;padding:0;font-size:.78rem;opacity:.92}
.ctx-ley li{display:inline-flex;align-items:center;gap:6px}
.ctx-ley .sw{width:26px;height:12px;flex:none}
.ctx-ley .sw line{stroke-width:3;stroke-linecap:round}
.ctx-ley .sw-ruta-trapichito{stroke:#6fb3d6}
.ctx-ley .sw-ruta-espino{stroke:#e0a060}
.ctx-ley .sw-ruta-comun{stroke:#f3efe3}
.ctx-ley .sw-tramo{stroke:#f3efe3;stroke-dasharray:4 3}
.ctx-ley .sw-via-c{stroke:rgba(250,249,245,.5);stroke-width:2}
.ctx-ley .sw-via-r{stroke:#d9c9a3}
.ctx-ley .sw-proy{fill:rgba(var(--senal-rgb),.35);stroke:var(--senal);stroke-width:2}
.ctx-ley .sw-distrito{fill:rgba(168,181,162,.3);stroke:rgba(168,181,162,.9)}
.ctx-ley .sw-provincia{fill:rgba(168,181,162,.14);stroke:rgba(168,181,162,.55)}
.ctx-ley .sw-aprox{fill:#2a3331;stroke:var(--detalle);stroke-width:1.5;stroke-dasharray:2.5 2}
.ctx-herr .ctx-ctl button:disabled{opacity:.35;cursor:default}
.entorno .ctx-ficha{margin:0 0 10px}
.entorno p.ctx-nota a{color:inherit}
@media (max-width:700px){ .mapa-ctx{height:260px} .capas-ctx .capa-b,.ctx-tabs button,.ctx-herr .ctx-centrar{min-height:44px} .ctx-ctl button{width:48px;height:44px} }
@media (max-height:600px) and (max-width:700px){ .mapa-ctx{height:220px} }

/* v1.16.1-tinajones.12 · el control «Referencias» (con «Entorno y ubicación») lleva su nombre visible, como «Vistas» y «Vista general» */
body.jer-compacta.con-entorno-mapa .espacial button#c-cerca > span{display:inline}
@media (max-width:700px),(max-height:500px){
  body.jer-compacta.con-entorno-mapa:not(.letra-grande) .espacial #c-cerca{flex-direction:column-reverse;justify-content:center;gap:1px;padding:4px 4px 3px;min-width:54px}
  body.jer-compacta.con-entorno-mapa:not(.letra-grande) .espacial button#c-cerca > span{display:block!important;position:static!important;transform:none!important;font-size:.625rem;line-height:1.1;padding:0;background:none;border:0;letter-spacing:.01em}
  body.jer-compacta.con-entorno-mapa.letra-grande .espacial:not(.rotular) button#c-cerca > span{display:none}
}

/* ── v1.16.1-tinajones.13 · «Explorar»: vistas, capas y cámara en un panel junto a la barra (opcional por caso) ──
   El acceso es una pestaña apoyada en el borde superior de la barra, con su mismo material; el panel nace de ella. Los
   controles que antes formaban columnas sobre el terreno viven dentro del panel con su función y su estado. */
body.con-explorar .espacial,body.con-explorar #vistas{display:none!important}
.b-explorar{position:fixed;z-index:21;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px 0 14px;border:1px solid var(--borde);border-bottom:0;
  border-radius:16px 16px 0 0;background:rgba(var(--papel-rgb),.8);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:var(--base);font-size:.875rem;font-weight:500;transition:left var(--t-panel)}
.b-explorar svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;flex:none}
.b-explorar:hover{background:rgba(var(--papel-rgb),.94)}
.b-explorar:focus-visible{outline:2px solid var(--senal);outline-offset:2px}
.b-explorar.sin-barra,body.en-guia .b-explorar,body.con-reproductor .b-explorar{display:none}
body.explorar-abierto .b-explorar{visibility:hidden}
#explorar-velo{position:fixed;inset:0;z-index:25;background:transparent;touch-action:none}
body.explorar-abierto nav.principal{z-index:26}
#explorar{position:fixed;z-index:27;display:flex;flex-direction:column;border-radius:20px;background:var(--velo);border:1px solid var(--borde);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 12px 32px rgba(0,0,0,.3);overflow:hidden;animation:vgExplorar 180ms ease-out}
#explorar[hidden]{display:none}
@keyframes vgExplorar{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){ #explorar{animation:none} .b-explorar{transition:none} }
#explorar .ex-cab{display:flex;align-items:center;gap:8px;padding:8px 8px 4px 16px;flex:none}
#explorar .ex-cab h2{flex:1;margin:0;font:400 1.25rem var(--tit);outline:none}
#explorar .cerrar{width:44px;height:44px;border-radius:12px;border:0;background:var(--suave);font-size:1.05rem;flex:none}
#explorar .ex-volver{flex:none;margin:2px 12px 8px;min-height:44px;padding:0 14px;border-radius:12px;border:1px solid var(--linea);background:none;text-align:left;font-size:.86rem;color:var(--base)}
#explorar .ex-tabs{flex:none;margin:0 12px 6px}
#explorar .ex-tabs button{min-height:44px}
#explorar .ex-cuerpo{flex:1 1 auto;min-height:0;overflow:auto;padding:2px 8px 8px;overscroll-behavior:contain}
#explorar #vistas-lista button{display:flex;justify-content:space-between;align-items:baseline;gap:10px;width:100%;min-height:48px;padding:8px 12px;border:0;border-radius:12px;background:none;
  text-align:left;font-size:.95rem;color:var(--base)}
#explorar #vistas-lista button:hover{background:rgba(250,249,245,.08)}
#explorar #vistas-lista button[aria-current=true]{background:rgba(var(--senal-rgb),.22)}
#explorar #vistas-lista button{flex-wrap:wrap;row-gap:2px}     /* sin sitio para los dos, el subtítulo baja a su línea: el nombre no se corta */
#explorar #vistas-lista button > span{flex:1 1 auto;min-width:min-content}
#explorar #vistas-lista small{font-family:var(--dato);font-size:.69rem;opacity:.7;text-align:right;margin-left:auto;min-width:0}
#explorar .ex-grupo{margin:0 0 6px}
#explorar .ex-grupo[hidden]{display:none}
#explorar .ex-grupo h3{margin:8px 12px 4px;font-size:.69rem;letter-spacing:.16em;text-transform:uppercase;opacity:.7;font-weight:500}
#explorar .ex-grupo button{display:flex;align-items:center;gap:12px;width:100%;min-height:48px;padding:0 12px;border:0;border-radius:12px;background:none;text-align:left;
  font-size:.95rem;color:var(--base);white-space:normal}
#explorar .ex-grupo button[hidden]{display:none}
#explorar .ex-grupo button:hover{background:rgba(250,249,245,.08)}
#explorar .ex-grupo button svg{order:0;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;flex:none;opacity:.85}
#explorar .ex-grupo button > span{order:1;flex:1;display:inline!important;position:static!important;transform:none!important;padding:0!important;background:none!important;border:0!important;font-size:inherit!important}
#explorar .ex-grupo button::after{order:2;content:"";flex:none;width:40px;height:24px;border-radius:999px;background-color:rgba(250,249,245,.18);box-shadow:inset 0 0 0 1px rgba(250,249,245,.32);
  background-image:radial-gradient(circle at 12px 12px,#FAF9F5 8px,transparent 8.6px);transition:background-color .15s}
#explorar .ex-grupo button[aria-pressed=true]::after{background-color:var(--senal);box-shadow:none;background-image:radial-gradient(circle at 28px 12px,var(--tinta) 8px,transparent 8.6px)}
#explorar .ex-grupo button:focus-visible,#explorar #vistas-lista button:focus-visible,#explorar .ex-util button:focus-visible{outline:2px solid var(--senal);outline-offset:-2px}
#explorar .ex-vacio{margin:10px 12px;font-size:.9rem;opacity:.8}
#explorar .ex-util{display:flex;flex-wrap:wrap;gap:6px;margin:8px 4px 2px;padding:10px 0 2px;border-top:1px solid var(--linea)}
@media (max-width:700px){ #explorar #c-pantalla{display:none!important} }   /* como antes en el teléfono: sin pantalla completa */
#explorar .ex-util button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;min-width:44px;padding:0 12px;border:1px solid var(--linea);border-radius:12px;
  background:none;font-size:.86rem;color:var(--base)}
#explorar .ex-util button[hidden]{display:none}
#explorar .ex-util button:hover{background:rgba(250,249,245,.08)}
#explorar .ex-util #c-horizonte{flex:1 1 auto;justify-content:flex-start;flex-direction:row-reverse}
#explorar .ex-util #c-horizonte > span{display:inline!important;position:static!important;transform:none!important;padding:0!important;background:none!important;border:0!important;font-size:inherit!important}
#explorar .ex-util #c-menos,#explorar .ex-util #c-mas{font-size:1.25rem;line-height:1}
#explorar .ex-util svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;flex:none}

/* ── v1.16.1-tinajones.13 · Paneles ajustables (opcional por caso) ──
   Teléfono vertical: el asa es un botón (tocar alterna intermedia/ampliada; flechas suben y bajan; se arrastra junto con la
   cabecera). Escritorio y horizontal: el borde izquierdo del panel lateral cambia su ancho (arrastre o flechas). */
body.paneles-ajustables #panel .asa{display:none}
@media (max-width:700px) and (min-height:501px){
  body.paneles-ajustables #panel .asa{display:flex;align-items:center;justify-content:center;width:100%;height:44px;min-height:44px;margin:0;padding:0;border:0;background:none;flex:none;
    touch-action:none;cursor:grab}
  body.paneles-ajustables #panel .asa i{display:block;width:44px;height:5px;border-radius:3px;background:rgba(250,249,245,.45)}
  body.paneles-ajustables #panel .asa:hover i{background:rgba(250,249,245,.7)}
  body.paneles-ajustables #panel .asa:focus-visible{outline:none}
  body.paneles-ajustables #panel .asa:focus-visible i{background:var(--senal);box-shadow:0 0 0 3px rgba(var(--senal-rgb),.35)}
  body.paneles-ajustables #panel .cab{touch-action:none;padding-top:0}
  body.paneles-ajustables #panel.arrastrando{transition:none!important}
}
#panel-borde{position:absolute;left:0;top:0;bottom:0;width:14px;z-index:3;display:flex;align-items:center;justify-content:center;cursor:ew-resize;touch-action:none}
#panel-borde[hidden]{display:none}
#panel-borde i{display:block;width:4px;height:44px;border-radius:2px;background:rgba(250,249,245,.3);transition:background .15s,height .15s}
#panel-borde:hover i,#panel-borde:focus-visible i,body.ajustando-ancho #panel-borde i{background:var(--senal);height:72px}
#panel-borde:focus-visible{outline:2px solid var(--senal);outline-offset:-3px;border-radius:8px}
@media (max-width:700px){ #panel-borde{display:none!important} }
body.ajustando-ancho,body.ajustando-ancho *{cursor:ew-resize!important;user-select:none!important}
body.ajustando-ancho #panel,body.ajustando-ancho nav.principal,body.ajustando-ancho .b-explorar{transition:none!important}
/* v1.16.1-tinajones.13 · paneles ajustables: en pantallas muy bajas el panel entero se desplaza (v1.7.1);
   la cabecera (título, cierre) queda fija arriba para que cerrar siga a la vista mientras se lee */
@media (max-height:400px){
  body.paneles-ajustables #panel .cab{position:sticky;top:0;z-index:3;background:var(--velo);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
}
/* v1.16.1-tinajones.13 · con «Explorar»: con letra grande (≥ 150 %) la barra pasa a dos filas en el teléfono, para que
   sus cuatro accesos (WhatsApp incluido) queden a la vista sin desplazarla de lado */
@media (max-width:700px){   /* solo el teléfono vertical: en horizontal la fila única cabe y dos filas le quitan alto al resto */
  body.con-explorar.letra-grande nav.principal{display:grid;grid-template-columns:1fr 1fr;gap:2px;overflow:visible}
  body.con-explorar.letra-grande #dock i.sep{display:none}
  body.con-explorar.letra-grande #dock button,body.con-explorar.letra-grande #dock a.wa-dock{min-width:0;flex-direction:row;justify-content:center;gap:6px;min-height:48px;padding:4px 6px;white-space:normal;text-align:left}
}
/* … y lo que en el teléfono se apoya sobre la barra (recorrido, elección, estado, volver a la vista, leyenda) sube con ella:
   --dock-tope lo mide explorar.js (distancia del borde inferior de la ventana al borde superior de la barra) */
@media (max-width:700px){
  body.con-explorar.letra-grande #guia,body.con-explorar.letra-grande #eleccion,body.con-explorar.letra-grande .estado-vis,
  body.con-explorar.letra-grande .estado-vis.activa,body.con-explorar.letra-grande .volver-vista{bottom:calc(var(--dock-tope, 70px) + 14px)}
  body.con-explorar.letra-grande #guia,body.con-explorar.letra-grande #eleccion{max-height:calc(100vh - var(--dock-tope, 70px) - 130px)}
  body.con-explorar.letra-grande .leyenda-capas{bottom:calc(var(--dock-tope, 70px) + 2px)}
}
@media (max-height:500px){
  body.con-explorar.letra-grande #b-guia,body.con-explorar.letra-grande .leyenda-limite{bottom:calc(var(--dock-tope, 66px) + 10px)}
}
/* v1.16.1-tinajones.18 · REFERENCIAS DEL ENTORNO SOBRE LA PANORÁMICA (js/referencias.js; solo con referencias_panorama.activo).
   Entre la panorámica y la interfaz (z 10 < #ui 20): no tapan paneles ni barra, y el toque en una píldora no llega al lote. */
.refs-capa{position:fixed;inset:0;z-index:10;pointer-events:none}
body:not(.con-referencias) .refs-capa{display:none}
.refs-lineas{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.refs-lineas line{stroke:rgba(250,249,245,.92);stroke-width:1.4;stroke-linecap:round}
.refs-lineas line.halo{stroke:rgba(10,12,9,.55);stroke-width:3.6}
.refs-lineas circle{fill:#FAF9F5}
.refs-lineas circle.halo{fill:rgba(10,12,9,.62)}
.ref-pildora{position:absolute;left:0;top:0;pointer-events:auto;min-height:44px;min-width:44px;padding:8px 0;margin:0;border:0;background:none;color:#FAF9F5;display:flex;align-items:center;justify-content:center;cursor:pointer;font:inherit;will-change:transform}
.ref-pildora[hidden]{display:none}
.ref-pildora .pil{display:inline-flex;align-items:center;gap:5px;padding:5px 11px;border-radius:14px;background:rgba(20,23,15,.84);border:1px solid rgba(208,193,165,.72);font-family:Jost,'Century Gothic',sans-serif;font-size:12.5px;line-height:1.1;letter-spacing:.04em;white-space:nowrap;box-shadow:0 1px 6px rgba(0,0,0,.35)}
.ref-pildora .pil b{font-weight:500}
.ref-dir .pil{border-style:dashed;background:rgba(20,23,15,.76)}
.ref-dir .ico-dir{width:11px;height:11px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.ref-pildora.secundaria .pil{opacity:.9}
.ref-pildora:hover .pil{border-color:rgba(250,249,245,.95)}
.ref-pildora:focus-visible{outline:none}
.ref-pildora:focus-visible .pil{outline:2px solid #FAF9F5;outline-offset:2px;box-shadow:0 0 0 5px rgba(10,12,9,.8)}   /* doble anillo: se ve sobre cielo, agua o selva */
.ref-pildora.abierta .pil{border:1px solid var(--senal)}
.refs-chip{position:absolute;left:0;top:0;pointer-events:auto;display:flex;align-items:center;gap:6px;padding:3px 3px 3px 12px;border-radius:999px;background:rgba(20,23,15,.82);border:1px solid rgba(250,249,245,.22);color:#FAF9F5;font-size:.78rem;max-width:calc(100vw - 24px)}
.refs-chip[hidden]{display:none}
.refs-chip .b{min-height:36px;padding:0 12px;font-size:.78rem}
/* blancos de 44 px para el dedo sin agrandar lo que se ve: «Mirar», el cierre y «Ver en el mapa» extienden su zona de toque */
.refs-chip .b,.refs-tarjeta .cerrar,.refs-tarjeta .acc .b{position:relative}
.refs-chip .b::before{content:"";position:absolute;inset:-4px -2px}
.refs-tarjeta .cerrar::before{content:"";position:absolute;inset:-2px}
.refs-tarjeta .acc .b::before{content:"";position:absolute;inset:-2px 0}
.refs-velo{position:fixed;inset:0;pointer-events:auto;background:transparent}
.refs-velo[hidden]{display:none}
/* compacta: la categoría, «Ver en el mapa» y el cierre en una sola fila; debajo, el nombre y una o dos frases (cabe bajo el punto
   que explica, entre el título de la vista y Explorar, aun en 320 × 568) */
.refs-tarjeta{position:absolute;left:0;top:0;pointer-events:auto;display:grid;grid-template-columns:minmax(0,1fr) auto 40px;grid-template-areas:"cat acc x" "tit tit tit" "txt txt txt" "nota nota nota";align-items:center;column-gap:4px;padding:4px 4px 10px 14px;border-radius:14px;background:var(--velo);border:1px solid var(--borde);color:#FAF9F5;box-shadow:0 6px 24px rgba(0,0,0,.35)}
.refs-tarjeta[hidden]{display:none}
.refs-tarjeta .cat{grid-area:cat;font-size:.66rem;line-height:1.3;letter-spacing:.08em;text-transform:uppercase;opacity:.78}
.refs-tarjeta h4{grid-area:tit;margin:0 10px 3px 0;font-family:var(--tit);font-size:1rem;line-height:1.3;font-weight:400;outline:none}
.refs-tarjeta > p{grid-area:txt;margin:0 10px 0 0;font-size:.84rem;line-height:1.4}
.refs-tarjeta > p.nota{grid-area:nota;margin-top:4px;opacity:.75;font-size:.76rem}
.refs-tarjeta .cerrar{grid-area:x;width:40px;height:40px;border:0;border-radius:10px;background:none;color:inherit;font-size:1rem;cursor:pointer}
.refs-tarjeta .cerrar:focus-visible{outline:2px solid var(--senal)}
.refs-tarjeta .acc{grid-area:acc;display:flex}
.refs-tarjeta .acc .b{min-height:40px;padding:0 10px;font-size:.78rem;white-space:nowrap}
/* lista en Explorar › Capas › «En el entorno»: todas las de la vista, también las que no caben */
.ex-refs{margin:2px 0 4px 34px;display:flex;flex-direction:column;gap:2px}
.ex-refs[hidden]{display:none}
.ex-refs .ex-refs-tit{margin:4px 0 2px;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;opacity:.7}
.ex-refs button{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:44px;padding:4px 8px;border:0;border-radius:10px;background:none;color:inherit;font:inherit;font-size:.86rem;text-align:left;cursor:pointer}
.ex-refs button:hover,.ex-refs button:focus-visible{background:rgba(250,249,245,.08);outline:none}
.ex-refs button small{opacity:.7;font-size:.74rem;white-space:nowrap}

/* ── v1.16.1-tinajones.20 · «Acerca de» por apartados (bloque 4 UX/UI de Los Tinajones: AU-08, AU-11, AUX-5) ──
   Pestañas fijas arriba del cuerpo (se desplazan de lado si no caben: 320 px o texto al 200 %), un apartado a la vez,
   subtítulos por tema, crédito pequeño, galería en miniaturas de proporción fija y hoja breve para los avisos. */
.apartados{position:sticky;top:-16px;z-index:3;display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin:-16px -18px 14px;padding:12px 16px 10px;background:var(--velo);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-bottom:1px solid var(--linea)}
.apartados::-webkit-scrollbar{display:none}
.apartados [role=tab]{flex:none;min-height:44px;padding:0 10px;border-radius:999px;border:1px solid var(--linea);background:var(--suave);color:inherit;font:inherit;font-size:.86rem;white-space:nowrap;cursor:pointer}
.apartados [role=tab][aria-selected=true]{background:rgba(var(--senal-rgb),.22);border-color:rgba(var(--senal-rgb),.75);font-weight:500}
.apartados [role=tab]:focus-visible{outline:2px solid var(--base);outline-offset:2px}
@media (max-width:700px){ .apartados{top:-14px;margin:-14px -16px 12px;padding:10px 16px 8px} }
@media (max-height:400px){ .apartados{top:0} body.paneles-ajustables .apartados{top:var(--cab-alto,0px)} }
@media (pointer:fine){ .apartados{flex-wrap:wrap;row-gap:6px} }   /* con ratón no se desliza de lado: si no caben (panel estrecho, letra grande), pasan a otra fila en vez de quedar cortadas */   /* teléfono horizontal: se desplaza el panel entero (sin relleno arriba); con paneles ajustables, debajo de la cabecera fija */
/* las pestañas se pegan al borde del área que se desplaza (top negativo = relleno del cuerpo): el texto ya no asoma por encima */
.seccion.apartado{margin:0}
.seccion .sub-ap{font:500 .78rem/1.3 var(--ui);letter-spacing:.06em;text-transform:uppercase;opacity:.78;margin:16px 0 6px}
.seccion h3 + .sub-ap{margin-top:6px}
.seccion figure.entera figcaption .amp{min-height:36px;padding:0 4px;margin-left:4px;text-decoration:underline;background:none;border:0;color:inherit;font:inherit;cursor:pointer}
.salida-ap{margin:16px 0 4px;padding:12px 14px;border-radius:14px;background:var(--suave);display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.salida-ap .nota{margin:0;font-size:.86rem}
.salida-ap .b{display:inline-flex;align-items:center;gap:8px;min-height:44px}
.credito-ap{display:flex;gap:12px;align-items:center;margin:22px 0 0;padding-top:12px;border-top:1px solid var(--linea);font-size:.8rem;opacity:.85}
.credito-ap p{margin:0 0 2px;font-size:.8rem;line-height:1.4}
.credito-ap .autor-logo{width:36px;height:auto;flex:none;opacity:.9}
.galeria-ap{list-style:none;margin:6px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.galeria-ap .gal-b{display:flex;flex-direction:column;gap:6px;width:100%;padding:0;border:0;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer;border-radius:12px}
.galeria-ap .gal-b img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;border-radius:12px;display:block;background:var(--suave)}
.galeria-ap .gal-b span{font-size:.84rem;line-height:1.35;padding:0 2px 2px}
.galeria-ap .gal-b:focus-visible{outline:2px solid var(--base);outline-offset:3px}
#reproductor .pie-v .rp-pie-txt{flex:1 1 100%;margin:0 0 2px;font-size:.88rem;line-height:1.45;opacity:.92}
/* AUX-5 · aviso breve (vendido o enlace no disponible): la hoja mide su contenido, también como columna de escritorio */
@media (min-width:701px){ #panel.breve:not(.plegado){bottom:auto;max-height:calc(100% - var(--margen) * 2)} #panel.breve .cuerpo{flex:0 1 auto} }
/* v1.16.1-tinajones.20 · con letra grande en el teléfono horizontal (panel ≤ 17 em) la regla de poca altura de la jerarquía
   compacta impedía partir la cabecera y el título se cortaba dentro de la palabra («Acerc|a de»): ahí el título va en su
   propia línea bajo «Ver terreno» y «✕», como en el resto de los paneles estrechos */
@container panel (max-width:17em){
  body.jer-compacta #panel .cab{flex-wrap:wrap}
  body.jer-compacta #panel .cab h2{order:9;flex:1 0 100%;overflow-wrap:normal}
}
/* v1.16.1-tinajones.20 · revisión del bloque 4 (accesibilidad):
   · un control enfocado (Tab o Mayús+Tab) no queda debajo de las pestañas fijas: el cuerpo reserva su alto (--tabs-alto lo mide proyecto.js);
   · si las pestañas no caben (teléfono), el borde con más pestañas se desvanece: señal de que se deslizan;
   · «Ampliar mapa» con el dedo mide 44 px;
   · en el visor de «Acerca de», el título se parte en líneas y el pie se desplaza solo, para que la imagen y «‹ i de n ›» sigan a la vista con letra grande. */
#panel-cuerpo:has(> .apartados){scroll-padding-top:calc(var(--tabs-alto,66px) + 8px)}
@media (max-height:400px){ body.paneles-ajustables #panel:has(.apartados){scroll-padding-top:calc(var(--cab-alto,0px) + var(--tabs-alto,66px) + 8px)} }
.apartados::before,.apartados::after{content:"";display:none;position:sticky;z-index:1;flex:none;width:32px;align-self:stretch;pointer-events:none}
.apartados::before{left:-16px;margin-right:-38px;background:linear-gradient(to left,transparent,var(--velo) 70%)}
.apartados::after{right:-16px;margin-left:-38px;background:linear-gradient(to right,transparent,var(--velo) 70%)}
.apartados.mas-izq::before,.apartados.mas-der::after{display:block}
@media (pointer:coarse){ .seccion figure.entera figcaption .amp{min-height:44px} }
#reproductor[aria-modal=true] .cab h2{white-space:normal;overflow-wrap:break-word;line-height:1.2;text-overflow:clip}
#reproductor[aria-modal=true] .medio{min-height:min(45%,160px)}
#reproductor[aria-modal=true] .pie-v .rp-pie-txt{max-height:5.2em;overflow-y:auto}
@media (max-height:500px){ #reproductor[aria-modal=true] .pie-v .rp-pie-txt{max-height:2.9em} }