/* SAPAR AT SAPAR — Voyage Scripturaire : nine cinematic chapters.
   Image-safe: always contain, never crop, replace, distort or draw over faces.
   No external dependencies. Motion can be paused and respects system preferences. */
.scripture-journey{--voyage-light:#eec583;--voyage-ambient:rgba(219,165,78,.19)}
.scripture-journey .journey-heading{position:relative}
.scripture-journey .journey-heading:after{content:'';position:absolute;bottom:-1px;left:0;width:clamp(30px,20%,190px);height:1px;background:linear-gradient(90deg,#fff0c0,transparent);box-shadow:0 0 16px #edba68;pointer-events:none}
/* On large displays, the existing sticky stage gains depth, light shafts and seamless arrival. */
.scripture-journey .journey-stage{--voyage-orbit:0deg;--voyage-focus:0;transition:background .7s ease,box-shadow .7s ease;background:radial-gradient(ellipse at 52% 47%,var(--voyage-ambient),transparent 68%),linear-gradient(155deg,rgba(12,39,57,.78),rgba(3,14,27,.88));}
.journey-stage .voyage-stage-lights{position:absolute;inset:0;z-index:2;overflow:hidden;pointer-events:none;isolation:isolate}
.journey-stage .voyage-stage-lights:before{content:'';position:absolute;inset:-55%;background:conic-gradient(from 90deg at 50% 50%,transparent 0deg,transparent 55deg,rgba(247,198,117,.09) 70deg,transparent 84deg,transparent 176deg,rgba(244,204,143,.06) 195deg,transparent 211deg,transparent 360deg);transform:rotate(var(--voyage-orbit));transition:transform .15s linear;mix-blend-mode:screen}
.journey-stage .voyage-stage-lights:after{content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 40%,rgba(255,229,166,.13),transparent 27%),linear-gradient(180deg,transparent 55%,rgba(2,11,22,.55));pointer-events:none;opacity:.75}
.journey-art{isolation:isolate}
.voyage-cinema-ready .journey-art.is-active{animation:voyageStageArrival 1.28s cubic-bezier(.13,.82,.2,1) both;filter:drop-shadow(0 18px 55px rgba(0,0,0,.5))}
.voyage-cinema-ready .journey-art.is-active img{filter:drop-shadow(0 20px 42px rgba(0,0,0,.39)) drop-shadow(0 0 20px rgba(236,184,99,.16))}
@keyframes voyageStageArrival{0%{opacity:0;transform:translate3d(16%,12%,-180px) rotateY(-12deg) scale(.76)}42%{opacity:1}100%{opacity:1;transform:translate3d(0,0,0) rotateY(0) scale(1)}}
.journey-stage[data-voyage-scene="0"]{--voyage-ambient:rgba(255,227,145,.24)}
.journey-stage[data-voyage-scene="1"]{--voyage-ambient:rgba(189,149,78,.13)}
.journey-stage[data-voyage-scene="2"],.journey-stage[data-voyage-scene="4"]{--voyage-ambient:rgba(83,141,169,.17)}
.journey-stage[data-voyage-scene="3"]{--voyage-ambient:rgba(215,161,100,.22)}
.journey-stage[data-voyage-scene="5"]{--voyage-ambient:rgba(110,74,59,.12)}
.journey-stage[data-voyage-scene="6"]{--voyage-ambient:rgba(246,193,103,.2)}
.journey-stage[data-voyage-scene="7"]{--voyage-ambient:rgba(252,216,123,.32)}
.journey-stage[data-voyage-scene="8"]{--voyage-ambient:rgba(232,199,116,.28)}
/* A reading-friendly progression HUD, never obscuring the Scripture descriptions. */
.voyage-hud{position:fixed;z-index:80;bottom:calc(16px + env(safe-area-inset-bottom,0px));left:16px;width:min(310px,calc(100vw - 132px));padding:11px 13px 12px;background:rgba(4,17,30,.88);border:1px solid rgba(227,186,112,.45);border-radius:10px;box-shadow:0 15px 35px rgba(0,0,0,.35),inset 0 1px rgba(255,226,175,.1);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:#f8e5be;transform:translate3d(0,22px,0);opacity:0;visibility:hidden;transition:opacity .36s,transform .36s,visibility .36s;pointer-events:none}
.voyage-hud.is-visible{opacity:1;visibility:visible;transform:translate3d(0,0,0);pointer-events:auto}
.voyage-hud-top{display:flex;align-items:baseline;gap:9px;font:600 10px/1.3 var(--sans,Arial,sans-serif);letter-spacing:.17em;text-transform:uppercase;white-space:nowrap}
.voyage-hud-count{color:#e9bc74;flex-shrink:0}
.voyage-hud-label{color:#efe2cd;min-width:0;overflow:hidden;text-overflow:ellipsis;letter-spacing:.08em}
.voyage-hud-dots{display:flex;gap:5px;margin-top:10px;align-items:center}
.voyage-hud-dots button{flex:1;height:13px;position:relative;border:0;padding:0;border-radius:2px;background:transparent;cursor:pointer;min-width:0}
.voyage-hud-dots button:before{content:'';position:absolute;left:0;right:0;top:5px;height:3px;background:rgba(231,199,145,.23);border-radius:4px;transition:background .3s,box-shadow .3s}
.voyage-hud-dots button.is-done:before{background:rgba(217,169,93,.67)}
.voyage-hud-dots button.is-current:before{background:#ffe1a6;box-shadow:0 0 9px rgba(255,215,144,.77)}
.voyage-hud-dots button:focus-visible{outline:2px solid #ffe1a6;outline-offset:2px}
/* Content remains visible even when scripting is unavailable. */
.voyage-cinema-ready .journey-chapter{--scene-gold:243,202,126}
.voyage-cinema-ready .journey-chapter[data-voyage-scene="1"]{--scene-gold:227,188,114}
.voyage-cinema-ready .journey-chapter[data-voyage-scene="2"]{--scene-gold:163,195,207}
.voyage-cinema-ready .journey-chapter[data-voyage-scene="3"]{--scene-gold:246,203,140}
.voyage-cinema-ready .journey-chapter[data-voyage-scene="4"]{--scene-gold:214,193,147}
.voyage-cinema-ready .journey-chapter[data-voyage-scene="5"]{--scene-gold:183,144,93}
.voyage-cinema-ready .journey-chapter[data-voyage-scene="6"]{--scene-gold:255,209,145}
.voyage-cinema-ready .journey-chapter[data-voyage-scene="7"]{--scene-gold:255,220,148}
.voyage-cinema-ready .journey-chapter[data-voyage-scene="8"]{--scene-gold:255,226,160}
/* Mobile = scene-by-scene cinematic canvases, all artwork shown in full. */
.journey-mobile-art{position:relative;isolation:isolate;overflow:hidden!important;perspective:1000px;transform-style:preserve-3d}
.journey-mobile-art .voyage-art-motion{position:relative;z-index:3;width:100%;display:flex;align-items:center;justify-content:center;transform-origin:50% 53%;backface-visibility:hidden}
.journey-mobile-art .voyage-art-motion img{max-width:100%;width:100%;height:auto;object-fit:contain!important;transform:translate3d(var(--voyage-pan-x,0px),var(--voyage-pan-y,0px),0) scale(var(--voyage-zoom,1));transition:transform .21s linear;transform-origin:center center;backface-visibility:hidden}
.journey-mobile-art::before{content:'';position:absolute;inset:-25%;z-index:1;pointer-events:none;background:radial-gradient(ellipse at center,rgba(var(--scene-gold,243,202,126),.22),transparent 54%);opacity:.45;transform:scale(.76);transition:transform 2.4s ease-out,opacity 2s ease-out}
.journey-mobile-art::after{content:'';position:absolute;inset:-55% -100%;z-index:6;pointer-events:none;background:linear-gradient(115deg,transparent 43%,rgba(255,237,186,.0) 46%,rgba(255,230,170,.16) 49%,rgba(255,250,227,.25) 50%,rgba(255,227,164,.10) 52%,transparent 57%);opacity:0;transform:translateX(-36%) rotate(8deg)}
.journey-mobile-art .voyage-aura{position:absolute;inset:5%;z-index:0;pointer-events:none;background:radial-gradient(circle at 50% 47%,rgba(var(--scene-gold,243,202,126),.10),transparent 54%);opacity:.7;filter:blur(5px)}
.journey-mobile-art .voyage-dust{position:absolute;inset:0;z-index:5;overflow:hidden;pointer-events:none}
.journey-mobile-art .voyage-dust i{position:absolute;left:var(--p-x);top:var(--p-y);width:var(--p-s,3px);height:var(--p-s,3px);border-radius:50%;background:rgba(255,226,159,.84);opacity:0;box-shadow:0 0 8px rgba(250,209,131,.7);animation:voyageFireflies var(--p-d,7s) ease-in-out infinite;animation-delay:var(--p-l,0s);animation-play-state:paused}
.voyage-cinema-ready .journey-chapter.voyage-in-focus .voyage-dust i{animation-play-state:running}
.voyage-cinema-ready .journey-chapter.voyage-entered .journey-mobile-art::before{opacity:1;transform:scale(1.1)}
.voyage-cinema-ready .journey-chapter.voyage-entered .journey-mobile-art::after{animation:voyageLightPass 2.4s .2s ease-out 1 both}
.voyage-cinema-ready .journey-chapter .voyage-art-motion{opacity:.47;transform:translate3d(0,42px,-80px) rotateX(-6deg) scale(.9);filter:blur(3px);transition:opacity 1s cubic-bezier(.16,1,.3,1),transform 1.35s cubic-bezier(.12,.8,.17,1),filter 1.1s ease}
.voyage-cinema-ready .journey-chapter.voyage-entered .voyage-art-motion{opacity:1;transform:translate3d(0,0,0) rotateX(0) scale(1);filter:blur(0)}
.voyage-cinema-ready .journey-chapter .journey-chapter-category,.voyage-cinema-ready .journey-chapter h3,.voyage-cinema-ready .journey-chapter .journey-scripture-ref{transition:opacity 1s,transform 1s cubic-bezier(.15,.85,.3,1)}
.voyage-cinema-ready .journey-chapter:not(.voyage-entered) .journey-chapter-category,.voyage-cinema-ready .journey-chapter:not(.voyage-entered) h3,.voyage-cinema-ready .journey-chapter:not(.voyage-entered) .journey-scripture-ref{opacity:.55;transform:translateY(13px)}
.voyage-cinema-ready .journey-chapter.voyage-entered h3{transition-delay:.10s}
.voyage-cinema-ready .journey-chapter.voyage-entered .journey-scripture-ref{transition-delay:.18s}
.voyage-cinema-ready .journey-chapter.voyage-in-focus .journey-mobile-art{box-shadow:inset 0 0 0 1px rgba(var(--scene-gold,243,202,126),.45),0 0 45px rgba(var(--scene-gold,243,202,126),.08)}
/* Individual choreography; no artwork is manipulated or replaced. */
.journey-chapter[data-voyage-scene="0"] .journey-mobile-art::before{background:radial-gradient(circle at 50% 52%,rgba(255,245,199,.32) 0%,rgba(234,172,65,.15) 36%,transparent 72%)}
.journey-chapter[data-voyage-scene="1"] .journey-mobile-art::after{background:linear-gradient(120deg,transparent 36%,rgba(250,221,162,.16) 50%,transparent 64%)}
.journey-chapter[data-voyage-scene="2"] .journey-mobile-art::before{background:radial-gradient(ellipse at 50% 73%,rgba(149,187,202,.19),transparent 58%)}
.journey-chapter[data-voyage-scene="3"] .journey-mobile-art::before{background:radial-gradient(ellipse at 50% 28%,rgba(255,218,149,.22),transparent 56%)}
.journey-chapter[data-voyage-scene="4"] .journey-mobile-art::before{background:radial-gradient(ellipse at 45% 60%,rgba(217,189,136,.18),transparent 61%)}
.journey-chapter[data-voyage-scene="5"] .journey-mobile-art::before{background:radial-gradient(ellipse at 50% 55%,rgba(189,128,70,.11),transparent 54%)}
.journey-chapter[data-voyage-scene="5"] .journey-mobile-art::after{background:linear-gradient(115deg,transparent 46%,rgba(230,178,111,.09) 50%,transparent 54%)}
.journey-chapter[data-voyage-scene="6"] .journey-mobile-art::before{background:radial-gradient(ellipse at 50% 65%,rgba(255,210,125,.28),transparent 62%)}
.journey-chapter[data-voyage-scene="7"] .journey-mobile-art::before{background:radial-gradient(ellipse at 50% 45%,rgba(255,222,145,.38),transparent 63%)}
.journey-chapter[data-voyage-scene="8"] .journey-mobile-art::before{background:radial-gradient(ellipse at 50% 63%,rgba(255,228,156,.34),transparent 70%)}
.journey-chapter[data-voyage-scene="7"] .journey-mobile-art .voyage-art-motion{transition-duration:1.7s}
.journey-chapter[data-voyage-scene="8"] .journey-mobile-art .voyage-art-motion{transition-duration:1.85s}
@keyframes voyageLightPass{0%,9%{opacity:0;transform:translateX(-36%) rotate(8deg)}24%{opacity:.9}69%{opacity:.48}100%{opacity:0;transform:translateX(46%) rotate(8deg)}}
@keyframes voyageFireflies{0%{opacity:0;transform:translate3d(0,16px,0) scale(.55)}25%{opacity:.8}60%{opacity:.45}100%{opacity:0;transform:translate3d(var(--p-drift,15px),-90px,0) scale(1.2)}}
/* The mini HUD is compact on phones and leaves the existing motion control clear. */
@media(max-width:780px){.voyage-hud{width:min(238px,calc(100vw - 140px));padding:9px 11px;bottom:calc(13px + env(safe-area-inset-bottom,0px));left:10px}.voyage-hud-top{font-size:9px}.voyage-hud-dots{gap:4px;margin-top:8px}.journey-mobile-art .voyage-art-motion img{max-height:clamp(275px,125vw,650px)!important}}
@media(max-width:440px){.voyage-hud{width:min(220px,calc(100vw - 136px))}.voyage-hud-label{font-size:8px}.journey-mobile-art .voyage-dust i:nth-child(n+7){display:none}}
@media(min-width:781px){.journey-mobile-art{display:none!important}.journey-stage .journey-stage-caption{transition:opacity .35s,transform .35s}}
/* Freeze ALL chapter effects when paused; keep reading and image viewer usable. */
body:is(.cinema-paused,.journey-motion-paused) .scripture-journey .voyage-dust i,body:is(.cinema-paused,.journey-motion-paused) .scripture-journey .journey-mobile-art::after,body:is(.cinema-paused,.journey-motion-paused) .scripture-journey .journey-stage-ring{animation-play-state:paused!important}
body:is(.cinema-paused,.journey-motion-paused) .scripture-journey .voyage-art-motion,body:is(.cinema-paused,.journey-motion-paused) .scripture-journey .voyage-art-motion img{transition:none!important;transform:none!important;filter:none!important;opacity:1!important}
@media(prefers-reduced-motion:reduce){.scripture-journey .journey-art,.scripture-journey .voyage-stage-lights,.scripture-journey .journey-mobile-art::before,.scripture-journey .journey-mobile-art::after,.scripture-journey .voyage-dust{animation:none!important;transition:none!important;transform:none!important}.scripture-journey .voyage-art-motion,.scripture-journey .voyage-art-motion img,.scripture-journey .journey-chapter-category,.scripture-journey .journey-chapter h3,.scripture-journey .journey-scripture-ref{animation:none!important;transition:none!important;transform:none!important;filter:none!important;opacity:1!important}.voyage-hud{transition:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}}