.scene { position:relative; isolation:isolate; min-height:0; display:grid; align-items:center; padding-block:var(--e-20); overflow:clip; }
.scene-picture { display:block; overflow:hidden; }
.scene-picture img { display:block; width:100%; height:100%; object-fit:cover; object-position:var(--image-position,center); }
.scene-noche { background:var(--film-shade); color:var(--film-text); padding-block:var(--e-10) calc(55svh + var(--e-10)); }
.scene-noche .scene-picture,.scene-noche .scene-veil { position:absolute; inset:auto 0 0; width:100%; height:55svh; z-index:-2; }
.scene-veil { z-index:-1 !important; pointer-events:none; background:linear-gradient(to bottom,color-mix(in srgb,var(--film-shade) 85%,transparent) 0%,transparent 60%); }
.scene-noche .scene-inner { display:block; }
.scene.scene-split { padding:0; display:grid; align-items:start; background:var(--papel); color:var(--tinta); }
.scene-split .scene-picture { position:relative; width:100%; height:55svh; }
.scene-split .scene-inner { display:block; width:100%; max-width:none; padding:var(--e-10) var(--margen); }
.scene-split .scene-copy { max-width:58ch; margin-inline:auto; }
.scene-split .airway-group { margin-top:var(--e-10); }
.scene-inner { display:grid; gap:var(--e-10); align-items:center; }
.scene-copy { min-width:0; max-width:58ch; }
.scene-prose h2 { font:700 30px/34px var(--font-display); letter-spacing:-0.01em; margin-bottom:var(--e-6); text-wrap:balance; }
.scene-prose p { margin-block:var(--e-6); }
.scene-prose ul,.scene-prose ol { margin-block:var(--e-6); padding-left:var(--e-6); }
.scene-prose li { margin-block:var(--e-4); }
.scene-prose .citation { color:inherit; text-underline-offset:4px; }
.cinema-header h1 { text-wrap:balance; }
.cinema-header .article-byline { display:grid; justify-items:start; }
.cinema-header .article-byline p { color:var(--film-text); }
.cinema-header .review-notice { color:var(--tinta); }
.motion-control { display:flex; align-items:center; gap:var(--e-2); margin-top:var(--e-6); padding-block:var(--e-2); width:fit-content; cursor:pointer; }
.motion-control input { accent-color:var(--violeta); width:20px; height:20px; flex:none; }
.scene .dialogue { color:var(--tinta); }
.scene .dialogue p { margin:0; }
.scene-noche :focus-visible,.scene-tratamiento :focus-visible { outline-color:var(--film-text); }
.scene-via,.scene-manana { background:var(--azul-suave); }
.scene-pausa { background:var(--superficie); }
.scene-pausa::before { content:""; position:absolute; inset:0; background:var(--film-shade); opacity:0; z-index:-1; pointer-events:none; }
.scene-pausa .scene-copy { position:relative; background:var(--superficie); border-radius:var(--r-globo); padding:var(--e-6); }
.airway-figure { width:min(100%,420px); margin:auto; padding:var(--e-6); background:var(--azul-suave); border-radius:var(--r-globo); color:var(--tinta); }
.airway-figure figcaption { text-align:center; }
.airway-svg { display:block; width:100%; max-height:54svh; }
.profile-fill { fill:var(--papel); }
.profile-line,.anatomy-line { fill:none; stroke:var(--tinta-suave); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.air-channel { fill:none; stroke:var(--azul-suave); stroke-width:22; stroke-linecap:round; }
.air-stream { fill:none; stroke:var(--azul); stroke-width:4; stroke-linecap:round; stroke-dasharray:8 12; }
.air-arrow { fill:var(--azul); }
.gate-left,.gate-right { fill:var(--rosa); stroke:var(--rosa-texto); stroke-width:1.5; }
.airway-gate { transform-origin:244px 237px; }
.motion-counter { display:none; align-items:center; justify-content:center; gap:var(--e-2); font-variant-numeric:tabular-nums; }
.counter-window { display:block; height:31px; overflow:hidden; font-weight:700; }
.counter-digits { display:block; line-height:31px; }
.scene-checklist ul { list-style:none; padding:0; }
.scene-checklist li { background:var(--superficie); color:var(--tinta); border-radius:var(--r-chico); }
.scene-checklist label { display:flex; align-items:flex-start; gap:var(--e-4); padding:var(--e-4); cursor:pointer; }
.scene-checklist input { flex:none; width:24px; height:24px; margin:var(--e-1) 0 0; accent-color:var(--violeta); }
.scene-checklist label:has(input:checked) { outline:2px solid var(--violeta); outline-offset:-2px; border-radius:var(--r-chico); }
.morning-illustration { width:min(100%,500px); margin:auto; }
.morning-window { fill:var(--papel); stroke:var(--azul); stroke-width:2; }
.morning-sun { fill:var(--rosa); }
.morning-frame,.morning-hands { fill:none; stroke:var(--tinta); stroke-width:3; stroke-linecap:round; }
.morning-mug { fill:var(--superficie); stroke:var(--azul); stroke-width:3; }
.morning-clock { fill:var(--superficie); stroke:var(--tinta); stroke-width:3; }
.scene-pasos .scene-copy { max-width:none; width:100%; }
.scene-steps ol { list-style:none; padding:0; display:grid; gap:var(--e-6); counter-reset:step; }
.scene-steps li { counter-increment:step; position:relative; padding:var(--e-6); background:var(--superficie); border-radius:var(--r-globo); margin:0; }
.scene-steps li::before { content:counter(step,decimal-leading-zero); display:block; color:var(--azul); font:800 44px/46px var(--font-display); letter-spacing:-0.02em; margin-bottom:var(--e-6); }
.scene-steps strong { display:block; font:700 22px/28px var(--font-display); margin-bottom:var(--e-4); }
.scene-tratamiento { background:var(--film-blue); color:var(--film-text); }
.scene-tratamiento .scene-copy { max-width:66ch; }
.scene-cierre { background:var(--papel); }
.science-button { display:inline-flex; align-items:center; gap:var(--e-6); padding:var(--e-4) var(--e-6); margin-top:var(--e-6); background:var(--violeta); color:var(--papel); border-radius:var(--r-globo); }
.closing-friends { display:flex; justify-content:center; align-items:center; gap:var(--e-2); }
.closing-friends > div { width:min(44%,240px); overflow:hidden; border-radius:var(--r-mirilla); }
.closing-friends picture { display:block; width:100%; }
.closing-otto { background:var(--violeta-suave); }
.closing-rhino { background:var(--azul-suave); margin-top:var(--e-20); }
.closing-friends img { display:block; width:100%; }
.cinema-sources { margin-block:0; padding-block:var(--e-10) var(--e-20); }
.science-bridge { display:flex; align-items:flex-start; gap:var(--e-4); font-size:17px; line-height:26px; padding:var(--e-6); margin-top:var(--e-10); background:var(--superficie); color:var(--tinta); border:1px solid var(--tinta-suave); border-radius:var(--r-globo); }
.science-bridge .bridge-text { margin:0; }
.science-bridge .bridge-link { display:inline-flex; gap:var(--e-2); color:var(--violeta); margin-top:var(--e-4); padding-block:var(--e-2); }
.bridge-book { flex:none; width:24px; height:24px; margin-top:var(--e-1); color:var(--violeta); }
.scene-image .science-bridge :focus-visible { outline-color:var(--foco); }
.signal-note { display:flex; align-items:center; gap:var(--e-4); }
.signal-art { width:56px; height:126px; flex:none; fill:var(--superficie); stroke:var(--tinta-suave); stroke-width:2; stroke-linecap:round; }
.signal-art circle { fill:none; stroke:var(--azul); }
.scene-art { display:block; width:min(100%,500px); margin:auto; }
.art-panel { fill:var(--azul-suave); }
.art-paper { fill:var(--papel); stroke:var(--tinta-suave); stroke-width:2; }
.art-line,.art-outline { stroke:var(--tinta); stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }
.art-line { fill:none; }
.art-outline { fill:var(--papel); }
.art-accent { fill:var(--azul); }
.hose-body { fill:none; stroke:var(--azul-suave); stroke-width:52; stroke-linecap:round; }
.hose-ring { stroke:var(--azul); stroke-width:5; }
.rigid-hose { transform-origin:250px 55px; transform:scaleY(1); }
.soft-hose { transform-origin:250px 135px; transform:scaleY(.25); }
.airway-group { min-width:0; }
.hose-art { margin-bottom:var(--e-6); background:var(--superficie); border-radius:var(--r-globo); padding:var(--e-4); }
.scene-ronquido,.scene-silencio { background:var(--film-shade); color:var(--film-text); }
.snore-art { position:relative; width:min(100%,500px); margin:auto; }
.snore-art picture { display:block; border-radius:var(--r-globo); overflow:hidden; }
.snore-art img { display:block; width:100%; height:auto; }
.snore-zzz { position:absolute; top:var(--e-6); right:var(--e-6); color:var(--film-shade); background:var(--film-text); padding:var(--e-2); border-radius:var(--r-chico); }
.scene-silencio .scene-copy { background:var(--film-shade); }
.silence-button { color:var(--tinta); background:var(--superficie); border:2px solid var(--tinta-suave); padding:var(--e-4) var(--e-6); border-radius:var(--r-globo); cursor:pointer; }
.silence-button:disabled { cursor:wait; }
.silence-button[hidden],.silence-seconds[hidden] { display:none; }
.silence-seconds { display:block; margin-top:var(--e-6); }
.scene-silencio .motion-counter { display:none !important; }
.scene-silencio::before { display:none; }
.silence-result { min-height:28px; }
.cycle-art { width:100%; }
.cycle-track { fill:none; stroke:var(--azul); stroke-width:4; stroke-dasharray:6 8; }
.cycle-orbit { transform-origin:250px 230px; }
.cycle-labels,.cycle-center { fill:var(--tinta); text-anchor:middle; font:700 14px/18px var(--font-texto); }
.bedside-art { margin-top:var(--e-10); }
.dawn-sky { fill:var(--azul-suave); }
.dawn-sun { fill:var(--rosa); transform:translateY(0); }
.inflating-hose { stroke:var(--film-text); fill:none; stroke-width:4; transform-origin:250px 125px; transform:scaleY(1); }
.treatment-flow { stroke:var(--film-text); stroke-width:4; stroke-dasharray:8 12; fill:none; }
.treatment-arrow { stroke:var(--film-text); stroke-width:4; fill:none; }
.scene-tratamiento .scene-art { margin-top:var(--e-10); }
@media(min-width:900px) {
  .scene-inner { grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); }
  .scene-image .scene-inner,.scene-tratamiento .scene-inner,.scene-pasos .scene-inner { display:block; }
  .scene-prose h2 { font-size:44px; line-height:46px; font-weight:800; letter-spacing:-0.02em; }
  .cinema-header h1 { font-size:64px; line-height:62px; letter-spacing:-0.03em; }
  .scene-steps ol { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media(min-width:1024px) {
  .scene.scene-split { grid-template-columns:minmax(0,3fr) minmax(0,2fr); }
  .scene-split .scene-picture { grid-column:1; grid-row:1; position:sticky; top:0; height:100svh; }
  .scene-split .scene-inner { grid-column:2; grid-row:1; min-height:100svh; padding:var(--e-20) var(--margen); }
  .scene-split.image-right { grid-template-columns:minmax(0,2fr) minmax(0,3fr); }
  .scene-split.image-right .scene-picture { grid-column:2; }
  .scene-split.image-right .scene-inner { grid-column:1; }
  .scene-noche { padding-block:var(--e-20); }
  .scene-noche .scene-picture,.scene-noche .scene-veil { inset:0; height:100%; }
  .scene-noche .scene-picture img { object-position:0% 50%; }
  .scene-noche .scene-veil { background:linear-gradient(to right,color-mix(in srgb,var(--film-shade) 85%,transparent) 0%,transparent 60%); }
  .scene-noche .scene-inner { width:100%; max-width:none; padding-inline:var(--margen); }
  .scene-noche .scene-copy { width:31%; max-width:480px; }
  .scene-noche .cinema-header h1 { font-size:clamp(44px,4.4vw,64px); line-height:1; }
}
/* Default and no-JS state is fully readable. Motion only enhances entered scenes. */
@media(prefers-reduced-motion:no-preference) {
  .scene.is-in-view .air-stream { animation:air-flow 2s linear infinite; }
  .scene-via.is-in-view .gate-left { animation:narrow-left 5s ease-in-out infinite; }
  .scene-via.is-in-view .gate-right { animation:narrow-right 5s ease-in-out infinite; }
  .scene-via.is-in-view .airway-gate { animation:vibration 180ms linear infinite; }
  .scene-pausa.is-in-view .gate-left { animation:close-left 12s linear infinite; }
  .scene-pausa.is-in-view .gate-right { animation:close-right 12s linear infinite; }
  .scene-pausa.is-in-view .air-stream-lower { animation:pause-flow 12s linear infinite; }
  .scene-pausa.is-in-view::before { animation:night-dim 12s linear infinite; }
  .scene-pausa.is-in-view .motion-counter { display:flex; }
  .scene-pausa.is-in-view .counter-digits { animation:pause-clock 12s step-end infinite; }
  .scene.has-entered .rigid-hose { animation:rigid-compress 3s ease-in-out 1 both; }
  .scene.has-entered .soft-hose { animation:soft-collapse 3s ease-in-out 1 both; }
  .scene-ronquido.is-in-view .snore-zzz { animation:snore-drift 4s ease-in-out infinite; }
  .scene-ciclo.is-in-view .cycle-orbit { animation:cycle-orbit 12s linear infinite; }
  .scene-examen.has-entered .dawn-sun { animation:dawn-rise 4s ease-out 1 both; }
  .scene-tratamiento.has-entered .inflating-hose { animation:inflate 3s ease-in-out 1 both; }
  .scene-tratamiento.is-in-view .treatment-flow { animation:air-flow 2s linear infinite; }
  .scene-silencio.is-in-view .gate-left,.scene-silencio.is-in-view .gate-right,.scene-silencio.is-in-view .air-stream { animation:none; }
  .scene-silencio.silence-running .gate-left { transform:translateX(22px); }
  .scene-silencio.silence-running .gate-right { transform:translateX(-22px); }
  .scene-silencio.silence-running .air-stream-lower { opacity:0; }
  .scene-silencio.silence-running .airway-figure { animation:quiet-dim 10s linear forwards; }
  .scene-silencio.silence-finished .air-stream { animation:air-flow 800ms linear 1; }
  .scene-silencio.silence-finished .silence-result { animation:micro-wake 800ms ease-out 1; }
}
@keyframes rigid-compress { 0%,100%{transform:scaleY(1);}35%{transform:scaleY(.4);} }
@keyframes soft-collapse { from{transform:scaleY(1);}to{transform:scaleY(.25);} }
@keyframes dawn-rise { from{transform:translateY(145px);}to{transform:translateY(0);} }
@keyframes image-enter { from{opacity:.72;transform:scale(1.04);}to{opacity:1;transform:scale(1);} }
@keyframes snore-drift { 0%,100%{transform:translateY(0);opacity:1;}50%{transform:translateY(-8px);opacity:.8;} }
@keyframes cycle-orbit { to{transform:rotate(360deg);} }
@keyframes inflate { from{transform:scaleY(.25);}to{transform:scaleY(1);} }
@keyframes quiet-dim { from{box-shadow:inset 0 0 0 0 var(--film-shade);}to{box-shadow:inset 0 0 0 16px var(--film-shade);} }
@keyframes micro-wake { from{outline:2px solid var(--film-text);outline-offset:8px;}to{outline:2px solid transparent;outline-offset:16px;} }
@keyframes scene-enter { from{opacity:1;transform:translateY(16px);}to{opacity:1;transform:translateY(0);} }
@keyframes air-flow { to{stroke-dashoffset:-80;} }
@keyframes narrow-left { 0%,100%{transform:translateX(0);}50%{transform:translateX(10px);} }
@keyframes narrow-right { 0%,100%{transform:translateX(0);}50%{transform:translateX(-10px);} }
@keyframes vibration { 0%,100%{transform:translateY(0);}50%{transform:translateY(1px);} }
@keyframes close-left { 0%,80%,100%{transform:translateX(0);}15%,70%{transform:translateX(22px);} }
@keyframes close-right { 0%,80%,100%{transform:translateX(0);}15%,70%{transform:translateX(-22px);} }
@keyframes pause-flow { 0%,80%,100%{opacity:1;stroke-dashoffset:0;}15%,70%{opacity:0;stroke-dashoffset:0;}71%{opacity:1;stroke-dashoffset:0;}79%{opacity:1;stroke-dashoffset:-160;} }
@keyframes night-dim { 0%,80%,100%{opacity:0;}15%{opacity:.08;}70%{opacity:.42;} }
@keyframes pause-clock { 0%,15%{transform:translateY(0);}23.333%{transform:translateY(-31px);}31.666%{transform:translateY(-62px);}40%{transform:translateY(-93px);}48.333%{transform:translateY(-124px);}56.666%{transform:translateY(-155px);}65%{transform:translateY(-186px);}80%,100%{transform:translateY(-217px);} }
html:has(#pausar-movimiento:checked) .scene *,html:has(#pausar-movimiento:checked) .scene::before { animation-play-state:paused !important; }
@media(prefers-reduced-motion:reduce) {
  .scene *,.scene::before { animation:none !important; transition:none !important; }
  .scene-copy,.scene-prose,.scene-prose > *,.scene-steps li,.cinema-header { opacity:1 !important; transform:none !important; }
  .motion-counter,.motion-control { display:none !important; }
  .scene-pausa::before { opacity:0 !important; }
}
@media print {
  .scene { min-height:auto; padding-block:var(--e-6); break-inside:avoid; background:var(--papel); color:var(--tinta); }
  .scene-picture,.scene-veil,.airway-figure,.morning-illustration,.closing-friends,.motion-control { display:none; }
  .cinema-header .article-byline p { color:var(--tinta); }
}

/* Tinnitus shares the scene, prose, dialogue and bridge engine with Apnea. */
.tinnitus .scene{background:var(--papel);color:var(--tinta);padding-block:var(--e-10);}
.tinnitus .scene:nth-child(even){background:var(--violeta-suave)}
.tinnitus .scene-inner{display:grid;width:min(100%,1216px);padding-inline:var(--margen);gap:var(--e-10)}
.tinnitus .scene-copy{width:100%;max-width:58ch}
.tinnitus .cinema-header .article-byline p{color:var(--tinta-suave)}
.tinnitus .chip{background:var(--violeta)}
.tinnitus .review-notice{border-color:var(--violeta)}
.tinnitus-art{position:relative;width:min(100%,320px);margin:auto;color:var(--violeta)}
.tinnitus-art>svg{display:block;width:100%;height:auto}
.tinnitus-guide{position:absolute;right:0;bottom:0;width:96px}
.tinnitus-guide img{border-radius:var(--r-mirilla)}
.scene-alert p:has(strong){padding:var(--e-6);border:2px solid var(--rosa-texto);border-radius:var(--r-globo);background:var(--superficie);color:var(--tinta)}
@media(min-width:1024px){.tinnitus .scene-inner{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}.tinnitus .scene:nth-child(even) .tinnitus-art{grid-column:1;grid-row:1}.tinnitus .scene:nth-child(even) .scene-copy{grid-column:2}}
/* The illustrated cover keeps its image contrast; solid scenes stay light. */
.scene-ronquido,.scene-silencio,.scene-tratamiento,.scene-silencio .scene-copy{background:var(--papel);color:var(--tinta)}
.scene-ronquido :focus-visible,.scene-silencio :focus-visible,.scene-tratamiento :focus-visible{outline-color:var(--violeta)}
@media(max-width:1023px){
.cinema:not(.tinnitus) .scene-noche{background:var(--papel);color:var(--tinta)}
.cinema:not(.tinnitus) .cinema-header .article-byline p{color:var(--tinta-suave)}
}

.vertigo .scene:nth-child(even){background:var(--superficie)}
.vertigo .scene-pieza{background:var(--aguamarina)}
.vertigo .chip{background:var(--aguamarina-texto)}
.vertigo .review-notice{border-color:var(--aguamarina-texto)}
.vertigo .tinnitus-art{color:var(--aguamarina-texto)}
.vertigo .scene-inner{display:grid}

/* Pulido editorial compartido: escenas de contenido, sin altura de pantalla. */
.cinema { --scene-accent:var(--azul); font:400 17px/1.6 var(--font-texto); }
.cinema.tinnitus { --scene-accent:var(--violeta); }
.cinema.vertigo { --scene-accent:var(--aguamarina-texto); }
.cinema .scene:not(.scene-image) { min-height:0; padding-block:48px; background:var(--papel); color:var(--tinta); }
.cinema .scene:not(.scene-image):nth-child(even) { background:var(--superficie); }
.cinema .scene-inner { align-items:start; gap:32px; }
.cinema .scene-copy,.tinnitus .scene-copy { max-width:62ch; }
.cinema .scene-prose h2 { font-size:clamp(2.25rem,3.5vw,3.25rem); line-height:1.15; }
.cinema .scene-prose p { margin-block:20px; }
.cinema .science-bridge { width:100%; margin-top:24px; padding:20px; border:0; border-radius:8px; background:var(--papel); }
.cinema .scene:nth-child(odd) .science-bridge { background:var(--superficie); }
.cinema .dialogue { margin-block:24px; padding:16px; border-radius:8px; }
.cinema .dialogue picture { width:56px; height:56px; }
.cinema .dialogue p { font:400 17px/1.6 var(--font-texto); }
.cinema .chip { font:600 12px/1.5 var(--font-texto); letter-spacing:.1em; text-transform:uppercase; padding:4px 10px; }
.cinema .tipo-etiqueta:not(.chip),.cinema .tipo-h3,.cinema .scene-steps strong,.cinema .scene-steps li::before { font-family:var(--font-texto); }
.cinema .scene-alert p:has(strong) { border:0; border-left:4px solid var(--rosa-texto); background:var(--rosa-suave); color:var(--tinta); border-radius:4px; padding:20px; }
.cinema .scene-art,.cinema .tinnitus-art,.cinema .airway-figure,.cinema .morning-illustration { width:min(100%,320px); max-width:320px; margin:0 auto; padding:0; background:none; border-radius:0; color:var(--tinta); }
.cinema .airway-svg { max-width:320px; }
.cinema .scene-pausa .scene-copy { padding:0; background:none; border-radius:0; }
.cinema .scene-art *,.cinema .tinnitus-art svg *,.cinema .airway-svg * { fill:none; stroke:var(--tinta); stroke-width:1.75px; }
.cinema .tinnitus-art svg text,.cinema .scene-art text { fill:var(--tinta); stroke:none; font-family:var(--font-texto); }
.cinema .tinnitus-art svg .editorial-accent,.cinema .art-accent,.cinema .air-stream-upper { stroke:var(--scene-accent); }
.cinema .scene-art *,.cinema .tinnitus-art svg *,.cinema .airway-svg * { vector-effect:non-scaling-stroke; }
.cinema h3,.cinema .snore-zzz,.cinema output.tipo-h2 { font-family:var(--font-texto); }
.cinema .hose-body { stroke-width:1.75px; }
.cinema .treatment-flow,.cinema .treatment-arrow,.cinema .inflating-hose { stroke:var(--tinta); stroke-width:1.75px; }
@media(min-width:900px) {
 .cinema { font-size:19px; }
 .cinema .scene:not(.scene-image) { padding-block:72px; }
 .cinema .scene:not(.scene-image) .scene-inner { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); }
 .cinema .scene:not(.scene-image) .scene-copy { grid-column:1 / span 7; grid-row:1; width:100%; }
 .cinema .scene:not(.scene-image) .scene-inner > :not(.scene-copy) { grid-column:8 / span 5; grid-row:1; }
}

/* Muse: imágenes a sangre y escenas de texto sin dibujo de relleno. */
.tinnitus .scene:not(.scene-image) .scene-inner { display:block; }
.tinnitus .scene:not(.scene-image) .scene-copy { margin-inline:auto; }
.tinnitus .scene.scene-image { padding:0; }
.tinnitus .scene.scene-split { background:var(--papel); }
.tinnitus .scene-split .scene-inner { display:block; width:100%; max-width:none; padding:40px var(--margen); }
.tinnitus .scene-noche { display:flex; flex-direction:column; background:var(--papel); }
.tinnitus .scene-noche .scene-picture { position:relative; inset:auto; height:55svh; z-index:0; flex:none; }
.tinnitus .scene-noche .scene-inner { display:block; padding:40px var(--margen); }
.tinnitus .scene-noche .scene-veil { display:none; }
@media(min-width:1024px){
 .tinnitus .scene-split .scene-inner { padding:64px var(--margen); }
 .tinnitus .scene-split .scene-copy { grid-column:auto; }
 .tinnitus .scene-noche { display:grid; min-height:100svh; background:var(--film-shade); color:var(--film-text); }
 .tinnitus .scene-noche .scene-picture { position:absolute; inset:0; height:100%; z-index:-2; }
 .tinnitus .scene-noche .scene-veil { display:block; position:absolute; inset:0; height:100%; background:linear-gradient(to right,color-mix(in srgb,var(--film-shade) 95%,transparent),color-mix(in srgb,var(--film-shade) 80%,transparent) 30%,transparent 70%); }
 .tinnitus .scene-noche .scene-inner { padding:64px var(--margen); }
 .tinnitus .scene-noche .scene-copy { max-width:40%; }
 .tinnitus .scene-noche .article-byline p { color:var(--film-text); }
}
.tinnitus .scene:not(.scene-image) .scene-copy { width:100%; }
@media(min-width:1024px){
 .tinnitus .scene-noche.scene-image .scene-copy { width:40%; max-width:40%; }
 .tinnitus .scene-noche.scene-image .scene-picture img { object-position:var(--image-position); }
}

/* Vértigo: portada Muse y ausencia absoluta de movimiento. */
.vertigo .scene-pieza , .migrana .scene-entrada , .garganta .hero-cover  , .laser .scene-noche { display:flex; flex-direction:column; background:var(--papel); }
.vertigo .scene-pieza .scene-picture , .migrana .scene-entrada .scene-picture , .garganta .hero-cover .scene-picture  , .laser .scene-noche .scene-picture { position:relative; inset:auto; height:55svh; z-index:0; flex:none; }
.vertigo .scene-pieza .scene-inner , .migrana .scene-entrada .scene-inner , .garganta .hero-cover .scene-inner  , .laser .scene-noche .scene-inner { display:block; padding:40px var(--margen); }
.vertigo .scene-pieza .scene-veil , .migrana .scene-entrada .scene-veil , .garganta .hero-cover .scene-veil  , .laser .scene-noche .scene-veil { display:none; }
@media(min-width:1024px){
 .vertigo .scene-pieza { display:grid; min-height:100svh; background:var(--film-shade); color:var(--film-text); }
 .vertigo .scene-pieza .scene-picture { position:absolute; inset:0; height:100%; z-index:-2; }
 .vertigo .scene-pieza .scene-veil { display:block; position:absolute; inset:0; height:100%; background:linear-gradient(to right,color-mix(in srgb,var(--film-shade) 95%,transparent),color-mix(in srgb,var(--film-shade) 80%,transparent) 30%,transparent 70%); }
 .vertigo .scene-pieza .scene-inner { padding:64px var(--margen); }
 .vertigo .scene-pieza .scene-copy { max-width:40%; }
 .vertigo .scene-pieza .article-byline p { color:var(--film-text); }
}
.vertigo .scene-pieza.scene-image .scene-picture img { object-position:var(--image-position); }
.vertigo .scene, .vertigo .scene *, .vertigo .scene::before, .vertigo .scene::after { animation:none !important; transform:none !important; transition:none !important; }

/* Claude 26-oct: portada de Vértigo con texto largo → la imagen se estiraba a 1.400 px y solo mostraba las rodillas.
   Escritorio: texto 40 % sobre papel a la izquierda, imagen 60 % fija (sticky) a la derecha, sin velo y sin zoom. */
@media(min-width:1024px){
 .vertigo .scene-pieza , .migrana .scene-entrada , .garganta .hero-cover  , .laser .scene-noche { display:grid; grid-template-columns:40% 60%; align-items:start; min-height:0; background:var(--papel); color:var(--tinta); }
 .vertigo .scene-pieza .scene-picture , .migrana .scene-entrada .scene-picture , .garganta .hero-cover .scene-picture  , .laser .scene-noche .scene-picture { position:sticky; top:0; inset:auto; grid-column:2; grid-row:1; height:min(100svh,760px); z-index:0; }
 .vertigo .scene-pieza .scene-veil , .migrana .scene-entrada .scene-veil , .garganta .hero-cover .scene-veil  , .laser .scene-noche .scene-veil { display:none; }
 .vertigo .scene-pieza .scene-inner , .migrana .scene-entrada .scene-inner , .garganta .hero-cover .scene-inner  , .laser .scene-noche .scene-inner { grid-column:1; grid-row:1; padding:56px var(--margen); }
 .vertigo .scene-pieza .scene-copy , .migrana .scene-entrada .scene-copy , .garganta .hero-cover .scene-copy  , .laser .scene-noche .scene-copy { max-width:100%; }
 .vertigo .scene-pieza h1, .vertigo .scene-pieza p , .migrana .scene-entrada p , .garganta .hero-cover p  , .laser .scene-noche p { color:var(--tinta); }
 .vertigo .scene-pieza .article-byline p , .migrana .scene-entrada .article-byline p , .garganta .hero-cover .article-byline p  , .laser .scene-noche .article-byline p { color:var(--tinta-suave); }
}

/* Alineación: una columna editorial y un solo nivel de caja. Portadas intactas. */
.cinema .scene:not(.scene-image) { padding-block:20px; }
.cinema .scene:not(.scene-image) .scene-inner { width:min(100%,1200px); }
.cinema .scene:not(.scene-image) .scene-copy { width:100%; max-width:720px; margin-inline:0; }
.cinema .scene-split .scene-copy { width:100%; max-width:720px; margin-inline:0; }
.cinema .scene:not(.scene-noche):not(.scene-pieza) .scene-prose > :is(p,h2,h3,ul,ol,aside) { margin-block:0; }
.cinema .scene:not(.scene-noche):not(.scene-pieza) .scene-prose > :is(p,h2,h3,ul,ol,aside) + :is(p,h2,h3,ul,ol,aside) { margin-top:24px; }
.cinema .scene:not(.scene-noche):not(.scene-pieza) .scene-prose > p + p { margin-top:16px; }
.cinema .scene:not(.scene-noche):not(.scene-pieza) .scene-prose p { width:100%; margin-inline:0; margin-bottom:0; }
.cinema .scene:not(.scene-noche):not(.scene-pieza) .dialogue,.cinema .scene:not(.scene-noche):not(.scene-pieza) .science-bridge,.cinema .scene:not(.scene-noche):not(.scene-pieza) .scene-alert > p { width:100%; margin-inline:0; }
.cinema .scene:not(.scene-noche):not(.scene-pieza) .dialogue { padding:16px; border:0; border-radius:var(--r-globo); align-items:flex-start; }
.cinema .scene:not(.scene-noche):not(.scene-pieza) .dialogue-otto { background:var(--violeta-suave); }
.cinema .scene:not(.scene-noche):not(.scene-pieza) .dialogue picture { width:48px; height:48px; }
.cinema .scene:not(.scene-noche):not(.scene-pieza) .scene-alert .dialogue p { border:0; padding:0; background:none; border-radius:0; margin:0; }
.cinema .scene:not(.scene-noche):not(.scene-pieza) .science-bridge { padding:16px; }
.cinema .scene:not(.scene-noche):not(.scene-pieza) .science-bridge .bridge-link { margin-top:4px; padding-block:0; }
.cinema .scene:not(.scene-noche):not(.scene-pieza) .science-bridge .bridge-book { margin-top:0; }
@media(min-width:900px) {
 .cinema .scene:not(.scene-image) { padding-block:28px; }
}
@media(min-width:1024px) {
 .cinema .scene-split .scene-inner { min-height:0; padding-block:48px; align-self:start; }
}

.cinema .scene:not(.scene-image) .scene-copy:only-child { grid-column:1 / -1; }

/* Claude 26-oct: que se vean Migzy y la paciente en la consulta (Migzy está al 20-30 % del ancho). */
.tinnitus .scene-tratamiento .scene-picture img, .vertigo .scene-tratamiento .scene-picture img { object-position:30% 50% !important; }

/* Migraña: portada compartida, sin movimiento. */
.migrana .scene, .migrana .scene *, .migrana .scene::before, .migrana .scene::after { animation:none !important; transform:none !important; transition:none !important; }

/* Ender 26-oct (3.ª vez): «una columna casi completa del lado derecho en blanco».
   Escenas solo texto en pantallas anchas: 2 columnas. Texto a la izquierda; globo de Otto y puente al blog
   en la columna derecha. Usa los 1200 px del contenedor. */
@media(min-width:1100px){
 .cinema .scene:not(.scene-image) .scene-copy { width:100% !important; max-width:none !important; }
 .cinema .scene:not(.scene-image) .scene-prose { display:grid; grid-template-columns:minmax(0,1fr) 360px; column-gap:56px; align-items:start; grid-auto-flow:row dense; }
 .cinema .scene:not(.scene-image) .scene-prose > * { grid-column:1; margin-top:0; }
 .cinema .scene:not(.scene-image) .scene-prose > h2 { grid-column:1 / -1; }
 .cinema .scene:not(.scene-image) .scene-prose > aside { grid-column:2; grid-row-end:span 2; }
 .cinema .scene:not(.scene-image) .scene-prose > p { max-width:72ch; }
}
/* Mismo borde para todo el texto en pantallas anchas: el texto de las escenas con imagen arranca
   en el borde del contenedor de 1200 px (antes quedaba pegado al borde de la ventana). */
@media(min-width:1280px){
 .cinema .scene-image:not(.scene-split) .scene-inner,
 .cinema .scene-image.image-right .scene-inner { padding-left:max(40px, calc((100vw - 1200px) / 2)) !important; }
 .cinema .scene-image.scene-split:not(.image-right) .scene-inner { padding-right:max(40px, calc((100vw - 1200px) / 2)) !important; }
}

/* Nariz: eje azul; misma composición de escenas, sin velo. */
.laser { --violeta:var(--azul); --violeta-suave:var(--azul-suave); }
.garganta .hero-cover .scene-picture img  , .laser .scene-noche .scene-picture img { object-position:var(--image-position); }
.garganta .hero-cover .scene-inner  , .laser .scene-noche .scene-inner { background:var(--papel); color:var(--tinta); }
.garganta .hero-cover :is(h1,p) , .laser .scene-noche :is(h1,p) { color:var(--tinta); }
.laser .scene-laser .scene-picture img { object-position:30% 50%; }

@media(min-width:1024px){ .garganta .hero-cover.scene-image .scene-copy  , .laser .scene-noche.scene-image .scene-copy { width:100%; max-width:100%; } }

/* Apnea sin dibujos: las escenas de texto comparten la composición editorial. */
.apnea .scene:not(.scene-image) .scene-inner { display:block; }

/* Claude 26-oct (Ender: «mira los espacios, no entiendo»): portadas de tema con texto largo dejaban un vacío bajo la imagen.
   Escritorio: fila 1 = encabezado (40 %) | imagen (60 %, alto acotado); fila 2 = franja a todo el ancho con
   entrada, globo, alerta y puente lado a lado. Aplica a la primera escena de cada página de pacientes. */
@media(min-width:1100px){
 article.cinema > .scene.scene-image:first-of-type { display:grid !important; grid-template-columns:40% 60%; grid-template-rows:auto auto; min-height:0 !important; align-items:stretch; overflow:visible; background:var(--papel); color:var(--tinta); }
 article.cinema > .scene.scene-image:first-of-type .scene-inner,
 article.cinema > .scene.scene-image:first-of-type .scene-copy { display:contents !important; }
 article.cinema > .scene.scene-image:first-of-type .scene-veil { display:none !important; }
 article.cinema > .scene.scene-image:first-of-type .cinema-header { grid-column:1; grid-row:1; align-self:center; padding:48px 40px 40px max(40px, calc((100vw - 1200px) / 2)); }
 article.cinema > .scene.scene-image:first-of-type .scene-picture { grid-column:2; grid-row:1; position:relative !important; inset:auto !important; height:min(68vh,620px) !important; z-index:0; }
 article.cinema > .scene.scene-image:first-of-type .scene-picture img { width:100%; height:100%; object-fit:cover; }
 article.cinema > .scene.scene-image:first-of-type .scene-prose { grid-column:1 / -1; grid-row:2; display:grid !important; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:24px; align-items:start; padding:40px max(40px, calc((100vw - 1200px) / 2)) 56px; }
 article.cinema > .scene.scene-image:first-of-type .scene-prose > * { margin:0 !important; max-width:none !important; grid-column:auto !important; grid-row:auto !important; }
 article.cinema > .scene.scene-image:first-of-type h1, article.cinema > .scene.scene-image:first-of-type p { color:var(--tinta); }
}
/* Globo de Otto/Rhino: una sola caja (sin caja rosada interna con borde). */
.cinema .dialogue p { background:none !important; border:0 !important; padding:0 !important; box-shadow:none !important; }
/* Tarjeta del puente al blog: compacta, sin hueco entre el texto y el enlace. */
.cinema .science-bridge { padding:16px 20px !important; display:flex !important; gap:12px; align-items:flex-start; }
.cinema .science-bridge > div { display:flex; flex-direction:column; gap:6px; }
.cinema .science-bridge p { margin:0 !important; }

/* Garganta y voz uses the same blue axis and shared scene composition. */
.garganta { --violeta:var(--azul); --violeta-suave:var(--azul-suave); }
.garganta .hero-cover { padding:0; }
.garganta .hero-cover .scene-inner { background:var(--papel); color:var(--tinta); }
.garganta .hero-cover .article-byline p { color:var(--tinta-suave); }
.cinema .scene-prose > p.clinical-alert { padding:16px 20px; border:1px solid var(--rosa-texto); border-radius:var(--r-globo); background:var(--superficie); color:var(--tinta); opacity:1; }
.related-topics { padding-block:40px; }
.related-topics ul { display:flex; flex-wrap:wrap; gap:24px; padding:0; list-style:none; }
.related-topics a { color:var(--azul); }

/* Amígdalas: static alarms and media, independent of client scripts. */
.cinema.amigdalas .scene-prose > p.clinical-alert{border:2px solid #ff72a0;background:#fff;color:#15161d;padding:16px 20px;border-radius:12px}
.amigdalas .table-scroll{max-width:100%;overflow-x:auto;background:#fff;color:#15161d}
.amigdalas table{border-collapse:collapse;width:max(100%,640px)}
.amigdalas th,.amigdalas td{padding:12px;border:1px solid var(--tinta-suave);text-align:left;vertical-align:top}
.media-card{padding:24px;border:1px solid var(--rosa-texto);border-radius:16px;background:var(--superficie);color:var(--tinta);margin-block:24px;overflow-wrap:anywhere}
.media-card video,.media-card img{max-width:100%}
.print-guide{font:inherit;padding:12px 20px;margin-block:16px;cursor:pointer}
@media print{
 body,main,.cinema.amigdalas,.amigdalas .scene,.amigdalas .scene-copy,.amigdalas .media-card{background:#fff!important;color:black!important;background-image:none!important}
 .site-header,.site-footer,.theme-picker,.related-topics,.print-guide,.amigdalas picture,.amigdalas .scene-veil{display:none!important}
 .cinema.amigdalas .scene{display:block!important;min-height:0!important;padding:16px 0!important;break-inside:auto}
 .amigdalas .scene-inner,.amigdalas .scene-copy{width:100%!important;max-width:none!important;margin:0!important;padding:0!important}
 .amigdalas *{color:black!important;text-shadow:none!important;animation:none!important;background-image:none!important}
 .cinema.amigdalas .scene-prose > p.clinical-alert{background:#fff!important;border-color:black!important;break-inside:avoid}
 .amigdalas .table-scroll{overflow:visible!important}.amigdalas table{width:100%!important;min-width:0!important;font-size:10pt}
}
@media print{
 .cinema.amigdalas > .scene.scene-image:first-of-type{display:block!important;grid-template-columns:none!important}
 .cinema.amigdalas .scene-prose{display:block!important}
 .cinema.amigdalas .cinema-header{padding:0!important}
 .cinema.amigdalas .scene-prose > *{max-width:none!important}
 .cinema.amigdalas .scene-prose > aside{break-inside:avoid}
}

.scene-picture video { display:block; width:100%; height:100%; object-fit:cover; object-position:var(--image-position,center); }
.media-card video { display:block; width:100%; aspect-ratio:16/9; height:auto; }
.media-card details { margin-block:1rem; }
.media-card summary { cursor:pointer; }
/* Claude 27-oct (Ender: «hay hipervínculos que quedan pegados al borde»). El botón de la aventura solo tenía estilo
   en aventura.css: en las guías salía como texto suelto y, en la portada de escritorio (display:contents), caía a 0 px
   del borde. Ahora tiene estilo propio y una fila propia con el mismo margen que la franja de texto. */
.cinema .adventure-entry { display:inline-block; padding:12px 20px; background:var(--violeta-suave); color:var(--violeta); border:2px solid var(--violeta); border-radius:var(--r-chico); font-weight:700; text-decoration:none; }
.cinema .adventure-entry:hover { background:var(--violeta); color:var(--superficie); }
.cinema [data-copy-ui]:has(> .adventure-entry) { margin-block:24px; }
/* Una tabla ancha no puede ensanchar la escena: se desliza dentro de su recuadro. */
.scene > .scene-inner, .scene-copy, .scene-prose { min-width:0; }
@media(min-width:1100px){
 article.cinema > .scene.scene-image:first-of-type .scene-copy > [data-copy-ui] { grid-column:1 / -1; grid-row:3; margin:0; padding:0 max(40px, calc((100vw - 1200px) / 2)) 48px; }
 article.cinema > .scene.scene-image:first-of-type .scene-copy > .print-guide { grid-column:1 / -1; grid-row:4; justify-self:start; margin:0 0 48px max(40px, calc((100vw - 1200px) / 2)); }
}
