/* ASTILLAS DEL VACÍO · Libro I · tormenta por capas (2026-10-30)
   NO se retoca, escala, desenfoca ni reexporta la ilustración principal.
   La niebla queda físicamente recortada al 50% inferior del viewport.
   Las nubes superiores son contornos de nube que se desplazan, NO vapor/bruma.
   Lluvia, flashes y relámpagos se pintan aparte y no afectan a las fichas. */
body.library-app{isolation:isolate}
body.library-app .library-bg{
 position:fixed;inset:0;z-index:0;
 filter:none!important;opacity:1!important;
 transform:none!important;animation:none!important
}
body.library-app .library-tint{position:fixed;inset:0;z-index:1;pointer-events:none}
body.library-app .library-atmosphere{
 position:fixed;inset:0;z-index:2;overflow:hidden;pointer-events:none;
 contain:paint;isolation:isolate
}
body.library-app .library-page{position:relative;z-index:3}
body.library-app.theme-crimson .library-atmosphere{display:none!important}

/* Cielo: textura de nubes ORIGINALES trasladada sobre el cielo estático,
   con píxeles originales y sin contornos de dibujos ni una capa de bruma. */
.atm-cloud-detail{
 position:absolute;inset:0;pointer-events:none;
 background-size:cover;background-position:center center;background-repeat:no-repeat;
 will-change:transform;
}
.atm-cloud-detail-west{background-image:url('../assets/atm-real-clouds-west.webp');
 animation:storm-cloud-west 15s ease-in-out infinite alternate}
.atm-cloud-detail-east{background-image:url('../assets/atm-real-clouds-east.webp');
 animation:storm-cloud-east 19s ease-in-out infinite alternate}
@keyframes storm-cloud-west{
 0%{transform:translate3d(-2.7%,0,0)}100%{transform:translate3d(3.1%,.4%,0)}
}
@keyframes storm-cloud-east{
 0%{transform:translate3d(2.6%,.3%,0)}100%{transform:translate3d(-3.4%,0,0)}
}

/* Tres nieblas exclusivas de la mitad INFERIOR de la imagen. */
.atm-ground-fog{position:absolute;inset:0;overflow:hidden;clip-path:inset(50% 0 0 0)}
.atm-mist{
 position:absolute;left:-17%;width:134%;pointer-events:none;
 background-repeat:no-repeat;background-position:center;background-size:100% 100%;
 mix-blend-mode:screen;will-change:transform,opacity;
 -webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 22%,#000 77%,transparent 100%);
 mask-image:linear-gradient(to bottom,transparent 0%,#000 22%,#000 77%,transparent 100%)
}
.atm-mist-far{top:45%;height:32%;opacity:.8;background-image:url('../assets/atm-mist-far.webp');animation:storm-fog-west 17s ease-in-out infinite alternate}
.atm-mist-mid{top:58%;height:32%;opacity:.85;background-image:url('../assets/atm-mist-mid.webp');animation:storm-fog-east 13s ease-in-out infinite alternate}
.atm-mist-front{top:71%;height:31%;opacity:.73;background-image:url('../assets/atm-mist-front.webp');animation:storm-fog-west 20s ease-in-out infinite alternate-reverse}
@keyframes storm-fog-west{from{transform:translate3d(-7%,0,0);opacity:.65}to{transform:translate3d(7%,-1%,0);opacity:.90}}
@keyframes storm-fog-east{from{transform:translate3d(8%,0,0);opacity:.91}to{transform:translate3d(-8%,1%,0);opacity:.65}}

/* Lluvia con canvas 2D en su propia capa: nunca toca la imagen original. */
.atm-rain{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity 1s ease;
 mix-blend-mode:screen;pointer-events:none}
.library-atmosphere.is-raining .atm-rain{opacity:1}

/* Los rayos mantienen un núcleo fino y blanco sobre un halo violeta. */
.atm-lightning{position:absolute;inset:0;width:100%;height:72%;overflow:visible;
 mix-blend-mode:screen;opacity:1;pointer-events:none}
.atm-lightning .storm-bolt{opacity:0;transition:opacity .065s linear}
.atm-lightning .storm-bolt.is-striking{opacity:1}
.atm-lightning .storm-bolt-halo{fill:none;stroke:#ba9dff;stroke-width:15;opacity:.80;
 filter:drop-shadow(0 0 11px #9d64ff);stroke-linecap:round;stroke-linejoin:round}
.atm-lightning .storm-bolt-core{fill:none;stroke:#faffff;stroke-width:3.4;stroke-linecap:round;stroke-linejoin:round;
 filter:drop-shadow(0 0 2px #faf0ff)}
.atm-lightning .storm-branch{fill:none;stroke:#d8c3ff;stroke-width:2.2;stroke-linecap:round;
 filter:drop-shadow(0 0 5px #9469ff)}
.atm-lightning-flash{position:absolute;inset:0;opacity:0;pointer-events:none;
 background:linear-gradient(to bottom,rgba(197,177,255,.33),rgba(119,84,232,.13) 47%,transparent 77%);
 mix-blend-mode:screen;transition:opacity .14s ease-out}
.library-atmosphere.is-flashing .atm-lightning-flash{opacity:1;transition:opacity .025s linear}

@media(max-width:700px),(max-height:510px){
 .atm-mist-far{top:45%;height:31%}
 .atm-mist-mid{top:60%;height:33%}
 .atm-mist-front{top:72%;height:31%}
 .atm-lightning{height:68%}
}
@media(prefers-reduced-motion:reduce){
 .atm-cloud-detail,.atm-mist{animation:none!important;will-change:auto!important}
 .atm-rain{display:none!important}
}

/* ===============================================================
   LIBRO II · AURORA FOTOGRÁFICA 4K + RAYOS SVG + REENTRADA CANVAS
   El Libro I y su audio permanecen completamente independientes.
   =============================================================== */
body.library-app.theme-crimson .library-bg{
 background-image:url('../assets/escenario-libro-ii-aurora-limpia-4k.webp') !important;
 background-size:cover !important;
 background-position:center center !important;
 filter:none !important;
}
body.library-app .library-atmosphere-book2{
 position:fixed;inset:0;z-index:2;display:none;overflow:hidden;
 isolation:isolate;contain:paint;pointer-events:none
}
body.library-app.theme-crimson .library-atmosphere-book2{display:block}
body.library-app.theme-crimson .library-atmosphere{display:none!important}
/* No se superpone una falsa aurora geométrica: solo partes del cielo original. */
.aurora-sky-fragment{
 position:absolute;inset:0;background-repeat:no-repeat;background-size:cover;
 background-position:center center;pointer-events:none;
 mix-blend-mode:normal;will-change:transform,opacity;z-index:1;
}
.aurora-sky-fragment-1{background-image:url('../assets/aurora-real-capa-1.webp');animation:auroraCurtainOne 13.4s ease-in-out infinite alternate}
.aurora-sky-fragment-2{background-image:url('../assets/aurora-real-capa-2.webp');animation:auroraCurtainTwo 11.1s ease-in-out infinite alternate}
.aurora-sky-fragment-3{background-image:url('../assets/aurora-real-capa-3.webp');animation:auroraCurtainThree 15.5s ease-in-out infinite alternate}
.aurora-sky-fragment-4{background-image:url('../assets/aurora-real-capa-4.webp');animation:auroraCurtainFour 12.2s ease-in-out infinite alternate}
@keyframes auroraCurtainOne{0%{transform:translate3d(-1.6%,-.6%,0) scale(1.012);opacity:.75}50%{transform:translate3d(1.1%,.8%,0) scale(1.020);opacity:1}100%{transform:translate3d(2.9%,0,0) scale(1.012);opacity:.83}}
@keyframes auroraCurtainTwo{0%{transform:translate3d(2.4%,.5%,0) scale(1.015);opacity:.93}52%{transform:translate3d(-.6%,-.9%,0) scale(1.026);opacity:.75}100%{transform:translate3d(-2.9%,.5%,0) scale(1.016);opacity:1}}
@keyframes auroraCurtainThree{0%{transform:translate3d(-2.0%,.7%,0) scale(1.018);opacity:.79}43%{transform:translate3d(.5%,-.6%,0) scale(1.013);opacity:1}100%{transform:translate3d(2.8%,.3%,0) scale(1.022);opacity:.85}}
@keyframes auroraCurtainFour{0%{transform:translate3d(1.8%,-.8%,0) scale(1.020);opacity:1}50%{transform:translate3d(-.8%,.5%,0) scale(1.014);opacity:.80}100%{transform:translate3d(-3%,0,0) scale(1.021);opacity:.97}}

/* Bruma baja: EXACTAMENTE el aspecto aprobado en la versión previa. */
.aurora-fog,.aurora-lightning,.aurora-flash,.aurora-satellite-canvas{position:absolute;inset:0;pointer-events:none}
.aurora-fog{overflow:hidden;clip-path:inset(54% 0 0 0);z-index:2}
.aurora-mist{
 position:absolute;left:-18%;width:136%;pointer-events:none;
 background-repeat:no-repeat;background-position:center;background-size:100% 100%;
 mix-blend-mode:screen;will-change:transform,opacity;
 filter:hue-rotate(-42deg) saturate(1.35) brightness(1.02);
 -webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 22%,#000 80%,transparent 100%);
 mask-image:linear-gradient(to bottom,transparent 0%,#000 22%,#000 80%,transparent 100%);
}
.aurora-mist-far{top:51%;height:30%;opacity:.58;background-image:url('../assets/atm-mist-far.webp');animation:auroraFogWest 18s ease-in-out infinite alternate}
.aurora-mist-mid{top:63%;height:28%;opacity:.66;background-image:url('../assets/atm-mist-mid.webp');animation:auroraFogEast 14s ease-in-out infinite alternate}
.aurora-mist-front{top:74%;height:26%;opacity:.59;background-image:url('../assets/atm-mist-front.webp');animation:auroraFogWest 21s ease-in-out infinite alternate-reverse}
@keyframes auroraFogWest{from{transform:translate3d(-6%,0,0);opacity:.48}to{transform:translate3d(6%,-.8%,0);opacity:.72}}
@keyframes auroraFogEast{from{transform:translate3d(7%,0,0);opacity:.74}to{transform:translate3d(-7%,.8%,0);opacity:.51}}

/* Un solo segundo por descarga; construida dinámicamente con docenas de bifurcaciones. */
.aurora-lightning{width:100%;height:100%;overflow:hidden;mix-blend-mode:screen;opacity:1;z-index:4}
.aurora-lightning path{fill:none;stroke-linecap:round;stroke-linejoin:round}
.aurora-ray-halo{stroke:#ff67bc;stroke-width:16;opacity:.37;filter:blur(5px)}
.aurora-ray-glow{stroke:#ff99d8;stroke-width:6.8;opacity:.8;filter:drop-shadow(0 0 10px #ff6faf)}
.aurora-ray-core{stroke:#fff8ec;stroke-width:2.7;opacity:1;filter:drop-shadow(0 0 3px #fff7ec)}
.aurora-ray-branch{stroke:#ffd3f0;stroke-width:1.5;opacity:.92;filter:drop-shadow(0 0 3px #f47cc5)}
.aurora-ray-fine{stroke:#ffdbe9;stroke-width:.82;opacity:.76}
.aurora-flash{z-index:3;opacity:0;mix-blend-mode:screen;background:radial-gradient(ellipse 40% 32% at 50% 14%,rgba(255,193,215,.24),rgba(255,113,173,.09) 55%,transparent 100%)}
/* TODOS los meteoritos, incluidos los lejanos, están delante de la aurora y de sus rayos. */
.aurora-satellite-canvas{width:100%;height:100%;z-index:8;mix-blend-mode:normal;isolation:isolate}
@media(max-width:700px),(max-height:510px){.aurora-fog{clip-path:inset(58% 0 0 0)}}
@media(prefers-reduced-motion:reduce){
 .aurora-sky-fragment,.aurora-mist{animation:none!important;will-change:auto!important}
 .aurora-lightning,.aurora-flash,.aurora-satellite-canvas{display:none!important}
}