/* Mapa visual de cada clase (pestaña "Mapa") */
.mapa{--tej:#F3C9D1;--arm:#B9D79A;--hoja:#5E8B3A;--crem2:#FFF7EC}
.pt{display:inline-block;border-radius:8px;padding:1px 8px;margin:2px 1px;font-size:13.5px;font-weight:500;white-space:nowrap;line-height:1.55;border:1px solid transparent;color:#3a2a2e}
.pt b{font-weight:800;margin-right:1px}
.pt.cad{background:#EFE7DA}.pt.pe{background:#E6DDF0}.pt.mp{background:#FCE7A9}.pt.mv{background:#F8D2B0}.pt.v{background:#F3BEC4}.pt.vd{background:#D8C9EC}
.pt.pic{background:#fff;border-color:var(--bordo-2);color:var(--bordo)}.pt.aum{border:1.5px dashed rgba(58,42,46,.5)}
.hilo{display:inline-block;width:13px;height:13px;border-radius:50%;margin-right:3px;vertical-align:-2px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.14),0 1px 2px rgba(0,0,0,.12)}

/* cabecera */
.m-hero{display:flex;gap:18px;align-items:center;background:linear-gradient(135deg,#fff 0%,var(--crem2) 100%);border-radius:22px;box-shadow:var(--sombra);padding:18px;position:relative;overflow:hidden}
.m-hero::after{content:"";position:absolute;right:-40px;top:-40px;width:160px;height:160px;border-radius:50%;background:radial-gradient(circle,var(--rosa-2) 0,transparent 70%);opacity:.55}
.m-foto{--p:0;flex:none;width:112px;height:112px;border-radius:50%;padding:5px;background:conic-gradient(var(--verde) calc(var(--p)*1%),var(--rosa-2) 0);position:relative;z-index:1}
.m-foto .in{width:100%;height:100%;border-radius:50%;overflow:hidden;border:4px solid #fff;background:#fff}
.m-foto img{width:100%;height:100%;object-fit:cover;transform:translateY(-6%) scale(1.45)}
.m-datos{position:relative;z-index:1;min-width:0}
.m-datos small{font-size:13px;color:var(--suave);font-weight:600;text-transform:uppercase;letter-spacing:.08em}
.m-datos>b{display:block;font-family:'Playfair Display',Georgia,serif;font-size:30px;color:var(--bordo);line-height:1.05;margin:2px 0 8px}
.m-filas{display:flex;flex-wrap:wrap;gap:6px}
.m-filas span{background:#fff;border:1px solid var(--borde);border-radius:99px;padding:4px 11px;font-size:13px;font-weight:600;white-space:nowrap}
.m-filas .m-prog{background:#EAF7EE;border-color:#cdebd6;color:var(--verde-2)}
.m-prog em{font-style:normal}
.ag{display:inline-block;width:14px;height:3px;background:var(--bordo);border-radius:2px;transform:rotate(-40deg);vertical-align:3px;margin:0 3px 0 4px;box-shadow:-5px 0 0 0 #E8743B}
.m-ley{display:flex;flex-wrap:wrap;gap:4px;align-items:center;margin:14px 0 6px}
.m-ley small{width:100%;font-size:12px;font-weight:700;color:var(--suave);text-transform:uppercase;letter-spacing:.06em}

/* el camino */
.ruta{list-style:none;margin:10px 0 0;padding:0;position:relative}
.ruta::before{content:"";position:absolute;left:27px;top:20px;bottom:60px;width:4px;border-radius:4px;background:repeating-linear-gradient(180deg,var(--hoja) 0 14px,transparent 14px 22px);opacity:.45}
.nodo{display:grid;grid-template-columns:58px 1fr;gap:10px;margin-bottom:16px;position:relative}
.bola{width:58px;height:58px;border-radius:50%;background:#fff;box-shadow:0 0 0 4px var(--tej),0 6px 14px rgba(91,35,51,.14);display:flex;align-items:center;justify-content:center;font-size:28px;position:relative;z-index:1;margin-top:6px}
.nodo.arm .bola{box-shadow:0 0 0 4px var(--arm),0 6px 14px rgba(91,35,51,.14)}
.bola i{position:absolute;right:-4px;bottom:-4px;min-width:22px;height:22px;border-radius:11px;background:var(--bordo);color:#fff;font-style:normal;font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center;border:2px solid #fff;padding:0 4px}
.nodo.listo .bola{box-shadow:0 0 0 4px var(--verde),0 6px 14px rgba(34,197,94,.25)}
.nodo.listo .bola i{background:var(--verde-2);font-size:0}
.nodo.listo .bola i::after{content:"✓";font-size:12px}

/* ficha de cada etapa */
.ficha{background:#fff;border-radius:20px;box-shadow:var(--sombra);overflow:hidden;min-width:0}
.ficha>summary{list-style:none;display:flex;gap:12px;align-items:center;padding:14px;cursor:pointer}
.ficha>summary::-webkit-details-marker{display:none}
.fz{width:74px;height:74px;border-radius:14px;object-fit:cover;flex:none;box-shadow:0 2px 6px rgba(0,0,0,.12)}
.cab{flex:1;min-width:0}
.cab>b{display:block;font-family:'Playfair Display',Georgia,serif;font-size:19px;color:var(--bordo);line-height:1.15}
.tags{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:6px}
.cant{background:var(--bordo);color:#fff;border-radius:99px;padding:2px 10px;font-size:12.5px;font-weight:700;white-space:nowrap}
.np{font-size:12.5px;color:var(--suave);font-weight:600}
.np em{font-style:normal;color:var(--verde-2);font-weight:800}
.aviso-n{margin:6px 0 0;font-size:13px;color:#8a5a12;background:#FFF3D6;border-radius:8px;padding:4px 8px}
.abrir{flex:none;width:32px;height:32px;border-radius:50%;background:var(--rosa);display:flex;align-items:center;justify-content:center}
/* botón "Ver patrón" dentro de cada etapa (pisa el círculo de antes) */
.abrir{display:inline-flex !important;width:auto !important;height:auto !important;gap:8px;align-items:center;margin-top:10px;background:var(--bordo) !important;color:#fff;border-radius:99px !important;padding:7px 14px !important;font-size:13.5px;font-weight:700}
.abrir::before{content:"Ver el patrón"}
.ficha[open] .abrir{background:var(--rosa) !important;color:var(--bordo)}
.ficha[open] .abrir::before{content:"Ocultar el patrón"}
.abrir::after{content:"";width:7px;height:7px;border-right:2.5px solid currentColor;border-bottom:2.5px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .2s}
.ficha[open] .abrir::after{transform:translateY(2px) rotate(225deg)}
.m-guia{background:#fff;border:1.5px dashed var(--rosa-2);border-radius:16px;padding:12px 14px;font-size:14.5px;color:var(--txt);margin:6px 0 14px;line-height:1.45}
.m-guia b{color:var(--bordo)}
.pestanas button{white-space:nowrap}
.ficha.fin img{object-position:50% 80%}
.ficha[open]>summary{border-bottom:1px dashed var(--borde)}

/* vuelta por vuelta */
.filas{list-style:none;margin:0;padding:8px 10px 12px}
.filas li{display:grid;grid-template-columns:46px 1fr auto;gap:8px;align-items:center;padding:8px 6px;border-radius:12px;font-size:15px;cursor:pointer;transition:background .15s}
.filas li:nth-child(odd){background:#FBF7F1}
.filas li .et{justify-self:center;min-width:38px;text-align:center;background:var(--hoja);color:#fff;font-weight:800;font-size:13px;border-radius:99px;padding:3px 6px}
.filas li .to{background:var(--rosa);color:var(--bordo);font-weight:800;font-size:14px;border-radius:10px;padding:3px 9px;white-space:nowrap}
.filas li .to::before{content:"= "}
.filas li .sb{margin-top:3px}
.filas li.hecho .tx{opacity:.45;text-decoration:line-through}
.filas li.hecho .et{background:var(--verde);font-size:0}
.filas li.hecho .et::after{content:"✓";font-size:14px}
.filas li.nt,.filas li.st{display:block;cursor:default;background:#FFF3D6 !important;font-size:14px;color:#6b4a12}
.filas li.st{background:var(--rosa) !important;color:var(--bordo);font-weight:700}

/* cruce "a armar" y meta */
.cruce{list-style:none;display:flex;flex-direction:column;align-items:center;text-align:center;margin:6px 0 20px;position:relative;z-index:1}
.cruce span{width:46px;height:46px;border-radius:50%;background:var(--arm);display:flex;align-items:center;justify-content:center;font-size:22px;box-shadow:0 0 0 6px var(--crema)}
.cruce b{font-family:'Playfair Display',Georgia,serif;color:var(--hoja);font-size:20px;margin-top:6px}
.cruce small{color:var(--suave);font-size:13px}
.nodo.meta .bola{box-shadow:0 0 0 4px #F2B70F,0 6px 14px rgba(242,183,15,.3)}
.ficha.fin{display:flex;flex-direction:column}
.ficha.fin img{width:100%;aspect-ratio:4/3;object-fit:cover}
.ficha.fin div{padding:14px 16px 16px}
.ficha.fin b{display:block;font-family:'Playfair Display',Georgia,serif;font-size:22px;color:var(--bordo)}
.ficha.fin small{color:var(--suave);font-size:14px}
@media(min-width:960px){
  .ruta::before{left:31px}.nodo{grid-template-columns:66px 1fr;gap:14px}.bola{width:66px;height:66px;font-size:32px}
  .ficha.fin{flex-direction:row}.ficha.fin img{width:46%;aspect-ratio:1}.ficha.fin div{align-self:center}
}
@media print{.mapa .ficha{break-inside:avoid}}

/* foto grande + diagrama de puntos dentro de cada etapa */
.m-media{display:grid;gap:12px;padding:12px 12px 4px}
@media(min-width:760px){.m-media{grid-template-columns:1fr 1.25fr;align-items:start}}
.m-fotog{margin:0;border-radius:16px;overflow:hidden;background:#fff;box-shadow:0 2px 10px rgba(91,35,51,.10);cursor:zoom-in}
.m-fotog img{width:100%;aspect-ratio:3/2;object-fit:cover}
.m-fotog figcaption{font-size:12.5px;color:var(--suave);padding:7px 10px;text-align:center}
.molde{margin:0;background:#FFFDF8;border:1.5px solid var(--borde);border-radius:16px;padding:10px 12px 12px}
.molde-cab{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.molde-cab b{font-family:'Playfair Display',Georgia,serif;color:var(--bordo);font-size:16px}
.molde-cab small{font-size:12px;color:var(--suave)}
.molde-zoom{cursor:zoom-in;background-image:radial-gradient(circle,#EADBD3 1px,transparent 1.2px);background-size:14px 14px;border-radius:12px;margin:6px 0}
.molde-svg{width:100%;height:auto;max-height:460px;display:block}
.molde-svg .cadena .lleno{fill:#8A7A70}
.molde-svg .lleno{fill:currentColor}
.molde-svg .cadena{stroke:#8A7A70}
.molde-svg .anillo,.ley-s .anillo{fill:none;stroke:#8A7A70;stroke-dasharray:2 2}
.molde-svg .alambre,.ley-s .alambre{fill:none;stroke:#9AA0A6;stroke-width:1.6;stroke-dasharray:4 3}
.molde-svg .nv text{font:700 6.5px Inter,sans-serif;fill:#fff;text-anchor:middle}
.molde-ley{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:12.5px;color:var(--txt);margin-top:4px}
.molde-ley span{display:inline-flex;align-items:center;gap:4px}
.ley-s{width:22px;height:26px}
.ley-s .lleno{fill:#5B2333}
.molde-nota{margin:8px 0 0;font-size:13px;color:var(--suave);line-height:1.45}
/* pantalla completa */
.lupa{position:fixed;inset:0;z-index:100;background:rgba(30,16,20,.88);display:flex;align-items:center;justify-content:center;padding:16px}
.lupa-in{max-width:100%;max-height:100%;overflow:auto;background:#fff;border-radius:14px}
.lupa-in img{max-width:92vw;max-height:86vh;display:block}
.lupa-in .molde-svg{width:94vw;max-width:900px;max-height:86vh}
.lupa button{position:absolute;top:12px;right:14px;width:42px;height:42px;border-radius:50%;border:0;background:#fff;color:var(--bordo);font-size:26px;line-height:1}