/* 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: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 .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:max(52px,3rem) 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:max(52px,3rem) 1fr;gap:12px;align-items:center;border-radius:14px;padding:8px 12px;margin:0 0 8px}
.datos.comercial dd{font-weight:600}
/* v1.16.1-pedasi.8 · ficha con datos: la cuota se destaca y, con texto grande, cada dato pasa a ocupar su línea */
dl.datos.ficha-datos{margin:14px 0 4px}
dl.datos.ficha-datos dd.cuota{font-weight:600}
body.letra-grande dl.datos.ficha-datos{grid-template-columns:1fr;gap:2px}
body.letra-grande dl.datos.ficha-datos dd{margin-bottom:8px}
/* v1.16.1-pedasi.8: con ficha_datos el número va solo en la cabecera del panel; en pantallas bajas la cabecera desplaza con el panel (no se pierde al bajar) */
@media (max-height:400px){body.ficha-datos #panel .cab{position:sticky;top:0;z-index:2;background:var(--velo,inherit)}}
/* 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 medida 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 otro caso; 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: p10 3,3 sobre un cielo de 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 (los casos sin la clase 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-pedasi.18 · «Entorno y ubicación» (portado de v1.16.1-tinajones.12/.21): mapa de contexto dentro del panel Proyecto.
   Solo aparece con datos/entorno.json (módulo entorno_mapa); sin él estas reglas no tocan nada. Sin las del control «Referencias»
   de tinajones.12 (body.con-entorno-mapa): en esta línea el control y los rótulos siguen siendo los de «Qué hay cerca». ── */
.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}
/* pedasi.18: una ruta sin color propio (id que el CSS no nombra) va en el color claro de las rutas; las de abajo lo cambian por id */
.ctx-svg .ruta .linea{stroke:#f3efe3}
.ctx-svg .borde .flecha{fill:#f3efe3}
.ctx-ley .sw-ruta{stroke:#f3efe3}
.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} }
@media (max-height:500px){ .mapa-ctx.arrastrable{touch-action:pan-y} }   /* tinajones.21: en pantallas bajas el mapa ampliado deja el gesto vertical al panel */

/* ── v1.16.1-pedasi.18 · «Acerca de» por apartados (portado de v1.16.1-tinajones.20/.21; solo con experiencia.apartados_acerca) ──
   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 y crédito pequeño. */
.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}
.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}
/* revisión de tinajones.20 (accesibilidad): un control enfocado no queda debajo de las pestañas fijas (--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 */
#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}
.apartados{scroll-padding-inline:16px}
/* tinajones.22 · «Abrir en Google Maps» junto al mapa de «Cómo llegar» (cierre_entrega.como_llegar) */
.salida-mapas{margin:4px 0 12px}
.salida-mapas .abrir-mapas{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;text-decoration:none;width:100%;color:var(--base)}   /* secundario: la acción principal del panel es la consulta */
.salida-mapas .abrir-mapas svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8}
/* Avisos estándar (13 oct 2026): el texto, la procedencia del caso si la hay y, debajo, «Condiciones de servicio» en otra pestaña */
.aviso-txt,.aviso-fuente{display:block}
.aviso-fuente{margin-top:.35em;opacity:.85}
a.aviso-cond{display:inline-flex;align-items:center;min-height:24px;margin-top:.3em;color:inherit;text-decoration:underline;text-underline-offset:2px;overflow-wrap:anywhere}
a.aviso-cond>span[aria-hidden]{margin-left:.25em}
.aviso-info{margin-top:18px}