/* PULSE 1.91.6 — mobile-safe cinematic stage built from existing fullbody hero art.
   Backgrounds are lightweight standalone WebP files; compositing uses GPU-friendly transforms. */
.hero1916-cinema{position:relative;isolation:isolate;height:clamp(276px,82vw,422px);width:calc(100% + 30px);margin:12px -15px 19px;border-block:1px solid #607b79;overflow:hidden;background:#142d39;box-shadow:inset 0 -20px 34px #09141f;color:#f5f0dd}
.hero1916-backdrop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;filter:saturate(.96) contrast(1.08) brightness(1.22);transform:scale(1.06);animation:hero1916-drift 17s ease-in-out infinite alternate;will-change:transform}
.hero1916-person{position:absolute;z-index:1;right:-2%;bottom:-13%;width:auto;height:117%;max-width:none;object-fit:contain;object-position:bottom center;filter:saturate(.69) brightness(.84) contrast(1.1) drop-shadow(-19px 7px 13px #03121dc2);transform:translateY(0);animation:hero1916-breathe 7s ease-in-out infinite alternate;will-change:transform}
.hero1916-cinema[data-hero-scene=mira] .hero1916-person{right:-14%;height:115%;bottom:-11%}
.hero1916-cinema[data-hero-scene=kai] .hero1916-person{right:-7%;height:117%}
.hero1916-cinema[data-hero-scene=nora] .hero1916-person{right:-9%;height:112%}
.hero1916-vignette{position:absolute;z-index:2;inset:0;background:linear-gradient(90deg,#0719226b 0%,#0b222e16 36%,transparent 65%),linear-gradient(0deg,#061821ed 0%,transparent 59%),radial-gradient(ellipse at 62% 36%,transparent 25%,#06131b2e 95%);pointer-events:none}
.hero1916-scan{position:absolute;z-index:3;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,transparent 0 5px,#90d2ca09 6px,transparent 7px);mix-blend-mode:screen;opacity:.63}
.hero1916-cinema:before{content:'';position:absolute;inset:12px;z-index:4;border:1px solid #d3bc7a58;clip-path:polygon(0 0,35% 0,35% 1px,0 1px,0 99%,1px 99%,1px 0,99% 0,99% 1px,100% 1px,100% 100%,0 100%);pointer-events:none}
.hero1916-cinema figcaption{position:absolute;z-index:5;bottom:14px;left:15px;right:12px;display:grid;gap:5px;max-width:75%;text-shadow:0 2px 6px #07151aff;pointer-events:none}
.hero1916-cinema figcaption span{font-size:10px;font-weight:800;letter-spacing:.12em;color:#e7b77c}
.hero1916-cinema figcaption b{font-size:clamp(19px,5.2vw,29px);line-height:1.18;letter-spacing:-.025em;color:#f4ecdb}
.hero1916-cinema figcaption small{font-size:9px;letter-spacing:.09em;color:#aecbc4}
.hero1914-scene .hero1916-cinema+p{font-size:14px;line-height:1.74;color:#e0e4d8;margin:6px 0 16px;padding-left:11px;border-left:2px solid #c7a16d}
.hero1914-choices button{position:relative;min-height:84px;gap:7px;transition:border-color .18s ease,background-color .18s ease}
.hero1914-choices button em{font-size:10px;line-height:1.45;font-weight:700;font-style:normal;color:#bce7d2;padding-top:6px;border-top:1px solid #b3cdc13e}
.hero1914-choices button:hover:not(:disabled),.hero1914-choices button:focus-visible{border-color:#f4d397;background:#3b514c;outline:2px solid #8dbaac;outline-offset:2px}
.hero1916-confirm{margin:14px 0 2px;padding:16px 14px;background:linear-gradient(130deg,#3f3332,#1b3035);border:1px solid #dfb57a;border-radius:11px;box-shadow:0 11px 25px #0c181c9c}
.hero1916-confirm>span{font-size:10px;letter-spacing:.12em;font-weight:800;color:#f8bd89}.hero1916-confirm h5{font-size:19px;line-height:1.24;margin:8px 0;color:#f8e8d3}.hero1916-confirm p{font-size:13px;line-height:1.5;color:#dfebde;margin:0 0 8px}.hero1916-confirm>small{display:block;font-size:11px;line-height:1.5;color:#c8c9c2}
.hero1916-confirm>div{margin-top:13px;display:grid;grid-template-columns:1fr 1.2fr;gap:8px}.hero1916-confirm button{padding:10px;min-height:46px;color:#f6efdf;background:#28424b;border:1px solid #64858a;border-radius:8px;font-weight:750;font-size:12px}.hero1916-confirm button:last-child{background:#8f6241;border-color:#e9ba78;color:#fff5dc}.hero1916-confirm button:disabled{opacity:.65}
.hero1916-result{margin:15px 12px 4px;background:linear-gradient(135deg,#22483f,#18323b);border:1px solid #8bb69f;border-radius:12px;padding:15px;box-shadow:0 8px 28px #081c1b88}
.hero1916-result small{font-size:10px;letter-spacing:.1em;color:#e6bf86}.hero1916-result b{display:block;font-size:15px;line-height:1.5;color:#e8efe3;margin:7px 0}.hero1916-result p{margin:6px 0;font-size:12px;font-weight:750;color:#bbe0c9}.hero1916-result span{font-size:11px;color:#c4d9cf}
@keyframes hero1916-drift{0%{transform:scale(1.055) translate3d(-5px,0,0)}100%{transform:scale(1.10) translate3d(6px,-4px,0)}}
@keyframes hero1916-breathe{0%{transform:translate3d(0,1px,0)}100%{transform:translate3d(0,-6px,0)}}
@media(max-width:345px){.hero1916-cinema{height:286px}.hero1916-cinema figcaption{left:12px;bottom:12px;max-width:76%}.hero1916-cinema figcaption b{font-size:19px}.hero1916-confirm{padding:13px 11px}}
@media(min-width:750px){.hero1916-cinema{height:410px}.hero1916-person{right:12%;height:121%}.hero1916-cinema figcaption{bottom:22px;left:22px}}
@media(prefers-reduced-motion:reduce){.hero1916-backdrop,.hero1916-person{animation:none!important;transform:none!important;will-change:auto!important}.hero1914-choices button{transition:none!important}}
/* Production compositor fallback: keep hero and environment static to avoid mobile
   WebView disappearing layers while the low-cost atmospheric sweep animates. */
.hero1916-backdrop{transform:none;animation:none;will-change:auto}
.hero1916-person{transform:none;animation:none;will-change:auto}
.hero1916-scan{background:linear-gradient(180deg,transparent 0%,#8ac9be10 43%,#b2f8ea2b 49%,#8ac9be12 53%,transparent 100%),repeating-linear-gradient(0deg,transparent 0 5px,#90d2ca06 6px,transparent 7px);background-size:100% 240%,100% 100%;background-position:0 100%,0 0;animation:hero1916-signal 13s ease-in-out infinite alternate}
@keyframes hero1916-signal{0%{background-position:0 100%,0 0;opacity:.3}100%{background-position:0 0%,0 0;opacity:.56}}
@media(prefers-reduced-motion:reduce){.hero1916-scan{animation:none!important}}
