/* Consolidada R4 · EXPERIMENT (Claude R1 · 1.4: la cita fijada, abajo). Sólo el actor listo oculta sus originales.
   El DOM sigue aportando lectura y accesibilidad, también sin JS o reducido. */
.magia-final-lienzo { position:fixed; inset:0; width:100%; height:100%; pointer-events:none; z-index:24; visibility:hidden; }
html.magia-final-lista .cita .guia { opacity:var(--r4-cita-opacity,1); }
html.magia-final-lista #noche .noche-ene,
html.magia-final-lista #noche .noche-frase { opacity:var(--r4-final-opacity,0) !important; }
#noche .pista-cierre-r4 > .noche-escena { position:sticky; top:0; height:100svh !important; min-height:0 !important; }
/* Claude R1 · 1.4 [EXPERIMENT] · la cita se lee QUIETA: la frase se fija en el centro de la vista dentro de su pista (el blockquote,
   alargado con ::after: 0,82 de la vista en vertical y 0,72 en horizontal; magia-final.js la suelta 0,15 antes del final de la pista).
   Sin JS el centro es una estimación en em; magia-final.js le da la mitad exacta de su alto (--cita-mitad). Con la magia lista, la
   frase no hace su aparición propia: la forma la corriente (opacidad en --r4-cita-opacity). */
/* 1.4 · verificación: la pista en lvh (la vista con las barras recogidas). En iOS/Android, al bajar, las barras se recogen e innerHeight
   crece hasta lvh: con svh la pista se quedaba corta y la frase empezaba a subir con la página antes de terminar su fundido. En el Mac y en
   las emulaciones, lvh = svh = vh: las cifras no cambian. */
.cita { --cita-tramo:calc(.72 * 100vh); }
@media (orientation:portrait) { .cita { --cita-tramo:calc(.82 * 100vh); } }
@supports (height:1lvh) {
  .cita { --cita-tramo:calc(.72 * 100lvh); }
  @media (orientation:portrait) { .cita { --cita-tramo:calc(.82 * 100lvh); } }
}
.cita::after { content:''; display:block; height:var(--cita-tramo); }
.cita .guia { position:sticky; top:calc(50svh - var(--cita-mitad,1.3em)); }
html.magia-final-lista .cita.aparece { opacity:1; transform:none; transition:none; }
@media (prefers-reduced-motion:reduce) {
  .magia-final-lienzo { display:none; }
  html.magia-final-lista .cita .guia,
  html.magia-final-lista #noche .noche-ene,
  html.magia-final-lista #noche .noche-frase { opacity:1 !important; }
}