html{height:auto}
body{height:auto}
body.t-lista,body.t-detalle{height:100dvh; overflow:hidden; display:flex; flex-direction:column}
.env{width:min(93.75rem,100%); margin:0 auto; padding:0 1.5rem; display:block; flex:none; min-height:0}
:focus-visible{outline:2px solid var(--cian2); outline-offset:2px}

.barra{border-bottom:1px solid var(--linea); flex:0 0 auto}
.barra .env{display:flex; flex-direction:row; align-items:center; justify-content:space-between; gap:0.875rem; height:3.25rem}
.barra .marca{margin:0; font-size:1rem}
.barra .acciones{display:flex; align-items:center; gap:0.625rem}
.vuelta{font-size:.82rem; color:var(--suave); text-decoration:none; padding:0.5rem 0.25rem}
.vuelta:hover{color:var(--tinta)}
.tema{background:none; border:1px solid var(--linea); color:var(--suave); border-radius:0.625rem;
  width:2.125rem; height:2.125rem; display:inline-flex; align-items:center; justify-content:center; cursor:pointer}
.tema:hover{border-color:var(--linea2); color:var(--tinta)}
html[data-tema=claro] .luna{display:none}
html:not([data-tema=claro]) .sol{display:none}
html[data-tema=claro] .p-oscuro,html:not([data-tema=claro]) .p-claro{display:none}

.accion{display:inline-flex; align-items:center; justify-content:center; gap:0.4375rem; min-height:2.75rem; padding:0 1.125rem;
  border-radius:0.6875rem; text-decoration:none; font:600 .88rem var(--texto); border:1px solid var(--linea2);
  color:var(--tinta); background:transparent; cursor:pointer}
.accion:hover{border-color:var(--cian)}
.accion--primaria{background:var(--cian); color:var(--carbon); border-color:transparent}
html[data-tema=claro] .accion--primaria{color:#fff}
.accion--primaria:hover{filter:brightness(1.08); border-color:transparent}
.accion--wa{background:var(--wa); color:var(--waTinta); border-color:transparent}
.accion--wa:hover{filter:brightness(1.07)}

.foto{position:relative; aspect-ratio:16/10; overflow:hidden; background:linear-gradient(135deg,var(--panel2),var(--halo2));
  border:1px solid var(--linea); border-radius:0.625rem}
.captura{width:100%; height:100%; object-fit:cover; object-position:center top; display:block}
.foto--dibujo{display:flex; align-items:center; justify-content:center; color:var(--cian2)}
.foto--dibujo svg{height:62%; width:auto}
.foto .icono{position:absolute; right:0.4375rem; bottom:0.4375rem; width:2rem; height:2rem; border-radius:0.5rem;
  border:2px solid #fff; box-shadow:0 0.25rem 0.75rem rgba(0,0,0,.35); background:#fff}
.etiquetas{display:flex; gap:0.375rem; flex-wrap:wrap}
.etiquetas span{font:500 .7rem var(--mono); color:var(--suave); border:1px solid var(--linea); border-radius:0.375rem; padding:0.1875rem 0.5rem}
.etiquetas .estado-etq{color:var(--waTexto); border-color:var(--waBorde); background:var(--waFondo)}

.escena{flex:1; min-height:0; display:grid; grid-template-columns:minmax(13.75rem,34%) minmax(0,1fr); align-items:center;
  gap:0.375rem 1.25rem; width:min(73.75rem,100%); margin:0 auto; padding:0.625rem 1.5rem 0.875rem}
.nodite-fig{margin:0; display:flex; justify-content:center}
.nodite-img{height:min(46vh,20.625rem); width:auto; filter:drop-shadow(0 1rem 1.75rem var(--sombra))}
.ventana{display:flex; flex-direction:column; gap:0.625rem; min-width:0; max-height:100%}
.titulo-pagina{font:700 1.35rem/1.2 var(--titular); margin:0 0 2px}
.titulo-pagina span{color:var(--cian2)}
.t-paso{font:600 .78rem var(--texto); color:var(--suave); margin:0}

.t-globo{position:relative; background:var(--panel); border:1px solid var(--linea); border-radius:0.875rem; padding:0.875rem 1rem;
  box-shadow:var(--sombraCaja)}
.t-globo::before{content:''; position:absolute; left:-0.4375rem; top:1.625rem; width:0.75rem; height:0.75rem; background:var(--panel);
  border-left:1px solid var(--linea); border-bottom:1px solid var(--linea); transform:rotate(45deg)}
.t-dice{font:600 1.1rem/1.35 var(--titular); color:var(--tinta); margin:0}

.respuestas{display:flex; flex-direction:column; gap:0.4375rem}
.t-resp{display:flex; align-items:center; gap:0.75rem; width:100%; min-height:3.25rem; padding:0.4375rem 0.75rem; text-align:left;
  background:var(--panel); border:1px solid var(--linea); border-radius:0.75rem; color:var(--tinta); cursor:pointer;
  font:inherit}
.t-resp:hover{border-color:var(--cian)}
.t-resp .num{flex:0 0 1.375rem; height:1.375rem; border-radius:50%; display:inline-flex; align-items:center; justify-content:center;
  font:500 .72rem var(--mono); background:var(--halo2); color:var(--tinta)}
.t-resp .tx{display:flex; flex-direction:column; min-width:0}
.t-resp b{font:600 .95rem/1.25 var(--texto)}
.t-resp small{font-size:.78rem; line-height:1.3; color:var(--suave); display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden}
.mini{flex:0 0 4rem; width:4rem; height:2.5rem; object-fit:cover; object-position:center top; border-radius:0.375rem; border:1px solid var(--linea)}
.mini--vacio{background:linear-gradient(135deg,var(--panel2),var(--halo2))}
.t-resp--volver{min-height:2.25rem; width:auto; background:transparent; border-color:transparent; color:var(--suave); font-size:.82rem; padding:0 0.5rem}
.t-resp--volver:hover{color:var(--tinta); border-color:transparent}
.pager{display:flex; align-items:center; justify-content:center; gap:0.875rem; font-size:.8rem; color:var(--suave)}
.pager button{width:2.75rem; height:2.25rem; border-radius:0.625rem; background:var(--panel); border:1px solid var(--linea);
  color:var(--tinta); font-size:1.1rem; cursor:pointer}
.pager button:disabled{opacity:.35; cursor:default}
.llevamos{font-size:.78rem; color:var(--tenue); margin:0; min-height:1em}
.salidas{display:flex; gap:0.5rem; flex-wrap:wrap}
.salidas .accion{flex:1 1 10.625rem}
.salidas--atras{gap:2px}

.tarjeta{display:grid; grid-template-columns:13.125rem minmax(0,1fr); gap:0.875rem; background:var(--panel);
  border:1px solid var(--linea); border-radius:0.75rem; padding:0.625rem; align-items:center}
.tarjeta .foto{border-radius:0.5rem}
.tarjeta-tx{display:flex; flex-direction:column; gap:0.3125rem; min-width:0}
.tarjeta-tx h2{font:700 1.15rem/1.2 var(--titular); margin:0}
.tarjeta-tx p{font-size:.84rem; line-height:1.45; color:var(--suave); margin:0}
.tarjeta-tx .dolor{color:var(--tinta); font-weight:600}
.medio[hidden]{display:none}

.lista-completa{font-size:.78rem; color:var(--tenue)}
.lista-completa summary{cursor:pointer; padding:0.25rem 0; width:max-content}
.lista-completa ul{list-style:none; margin:0.375rem 0 0; padding:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0.375rem 1rem}
.lista-completa li{display:flex; flex-direction:column}
.lista-completa a{color:var(--cian2); font-weight:600; text-decoration:none; display:inline-block; padding:0.25rem 0; min-height:1.5rem}
.lista-completa span{color:var(--suave)}

.migas{display:flex; flex-wrap:wrap; align-items:center; gap:0.5rem; font-size:.76rem; color:var(--tenue)}
.migas a{color:var(--suave); text-decoration:none}
.migas a:hover{color:var(--tinta)}
.ficha-cab{display:flex; gap:0.875rem; align-items:center}
.foto--mini{flex:0 0 9.875rem}
.ficha-texto{display:flex; flex-direction:column; gap:0.25rem; min-width:0}
.cat-nombre{font:600 .78rem var(--texto); color:var(--cian2)}
.ficha-texto h1{font:700 1.7rem/1.1 var(--titular); margin:0}
.lead{font-size:.92rem; color:var(--suave); margin:0}
.t-globo--contenido .t-dice{font-size:1rem; margin-bottom:0.5rem}
.contenidos{min-height:8rem}
.parte h2{font:700 .88rem var(--titular); margin:0 0 0.375rem; color:var(--cian2)}
.parte p,.parte li{font-size:.92rem; line-height:1.55; color:var(--tinta)}
.parte p+p{margin-top:0.375rem}
.parte ul,.parte ol{margin:0; padding-left:1.1875rem; display:grid; gap:0.25rem}

body.guiado .parte{display:none}
body.guiado .parte.activa{display:block}
body.guiado .parte h2{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
.respuestas--partes{flex-direction:row; flex-wrap:wrap; gap:0.375rem; align-items:center}
.respuestas--partes[hidden]{display:none}
.parte-btn{font:500 .8rem var(--texto); color:var(--suave); background:var(--panel); border:1px solid var(--linea);
  border-radius:0.625rem; min-height:2.25rem; padding:0 0.75rem; cursor:pointer}
.parte-btn:hover{border-color:var(--linea2); color:var(--tinta)}
.parte-btn[aria-pressed=true]{border-color:var(--cian); background:var(--halo2); color:var(--tinta)}
.respuestas--partes .accion{margin-left:auto; min-height:2.25rem}

html.vm .env,html.vt .env{padding:0 1rem}
html.vm .escena,html.vt .escena{display:block; position:relative; padding:0.75rem 1rem 0.75rem; overflow-y:auto}
html.vm .nodite-fig,html.vt .nodite-fig{position:absolute; left:1rem; top:0.875rem}
html.vm .nodite-img,html.vt .nodite-img{height:6.25rem}
html.vm .ventana,html.vt .ventana{gap:0.5625rem; padding-top:0}
html.vm .titulo-pagina,html.vt .titulo-pagina{font-size:1.22rem; margin-left:6.125rem; min-height:6.25rem; display:flex; flex-direction:column; justify-content:center; align-items:flex-start}
html.vm .titulo-pagina span,html.vt .titulo-pagina span{display:block; font-size:.92em}
html.vm .t-paso,html.vt .t-paso{margin-top:0.5rem}
html.vm .t-globo,html.vt .t-globo{padding:0.5625rem 0.8125rem}
html.vm .t-globo::before,html.vt .t-globo::before{left:1.25rem; top:-0.4375rem; border:0; border-left:1px solid var(--linea); border-top:1px solid var(--linea)}
html.vm .t-dice,html.vt .t-dice{font-size:.98rem}
html.vm .t-resp,html.vt .t-resp{min-height:3.125rem}
html.vm .tarjeta,html.vt .tarjeta{grid-template-columns:6rem minmax(0,1fr); gap:0.625rem}
html.vm .tarjeta-tx h2,html.vt .tarjeta-tx h2{font-size:1rem}
html.vm .tarjeta-tx p:not(.dolor),html.vt .tarjeta-tx p:not(.dolor){display:none}
html.vm .tarjeta .etiquetas,html.vt .tarjeta .etiquetas{display:none}
html.vm .lista-completa ul,html.vt .lista-completa ul{grid-template-columns:1fr}
html.vm .vuelta,html.vt .vuelta{display:none}
html.vm .ficha-cab,html.vt .ficha-cab{margin-left:6.125rem; min-height:6.25rem}
html.vm .foto--mini,html.vt .foto--mini{display:none}
html.vm .ficha-texto h1,html.vt .ficha-texto h1{font-size:1.3rem}
html.vm .migas,html.vt .migas{margin-left:6.125rem}
html.vm .contenidos,html.vt .contenidos{min-height:0}
html.vm .respuestas--partes .accion,html.vt .respuestas--partes .accion{margin-left:0}

html.vm .ventana,html.vt .ventana{max-height:none}
html.vm .ventana > *,html.vt .ventana > *{flex-shrink:0}
html.vm .ficha-cab,html.vt .ficha-cab{background:none; border:0; box-shadow:none; padding:0; -webkit-backdrop-filter:none; backdrop-filter:none; margin-left:6.125rem; min-height:0}
html.vm .escena--detalle .etiquetas,html.vt .escena--detalle .etiquetas{display:none}
html.vm .escena--detalle .cat-nombre,html.vt .escena--detalle .cat-nombre{display:none}
html.vm .cats-cruz,html.vt .cats-cruz{margin-top:0.25rem}
@media (prefers-reduced-motion:reduce){ *{transition:none!important} }

.grupo-tit{font:600 .8rem var(--texto); color:var(--suave); margin:0.375rem 0 -2px}
.rej2{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0.4375rem}
.rej2 .t-resp{min-height:3rem}
.pill{font:500 .62rem var(--texto); font-style:normal; letter-spacing:.02em; color:var(--suave); border:1px solid var(--linea);
  border-radius:62.4375rem; padding:1px 0.4375rem; margin-left:0.375rem; white-space:nowrap; vertical-align:middle}
.pill--ok{color:var(--waTexto); border-color:var(--waBorde); background:var(--waFondo)}

.cruz{display:flex; align-items:center; gap:0.4375rem; flex-wrap:wrap; font-size:.78rem; color:var(--suave)}
.cats-cruz{font-size:.78rem; color:var(--suave); margin:2px 0 0; display:flex; gap:0.5rem; flex-wrap:wrap; align-items:center}
.cats-cruz a{color:var(--cian2); font-weight:600; text-decoration:none; border:1px solid var(--linea); border-radius:0.5rem; padding:2px 0.5625rem}
.cats-cruz a:hover{border-color:var(--cian)}

html.vm .rej2,html.vt .rej2{grid-template-columns:1fr; gap:0.3125rem}
html.vm .rej2 .t-resp,html.vt .rej2 .t-resp{min-height:2.5rem; padding:0.1875rem 0.625rem}
html.vm .escena,html.vt .escena{padding-bottom:0.375rem}
html.vm .rej2 .t-resp .tx,html.vt .rej2 .t-resp .tx{flex-direction:row; align-items:center; justify-content:space-between; gap:0.5rem; width:100%}
html.vm .rej2 .t-resp small,html.vt .rej2 .t-resp small{white-space:nowrap}
html.vm .grupo-tit,html.vt .grupo-tit{margin:2px 0 -0.1875rem}
html.vm .pill,html.vt .pill{margin-left:0.25rem}

.cats-cruz a,.parte-btn--cat{display:inline-flex; align-items:center; gap:.4rem; white-space:nowrap; padding:0 .75rem}
.cats-cruz a svg,.parte-btn--cat svg{width:1.1rem; height:1.1rem; flex:0 0 auto}
.cats-cruz,.cruz{flex-wrap:nowrap; gap:.4rem}
.cats-cruz{align-items:center}