/* One sticky owner and stable viewport units, including during iOS toolbar motion. */
.cosmic-journey{position:relative;isolation:isolate;background:#020307;color:#f7faff}
.cosmic-visual{position:sticky;top:0;height:100vh;height:calc(var(--baiyun-lvh, 1lvh) * 100);min-height:0;margin-bottom:-100vh;margin-bottom:calc(var(--baiyun-lvh, 1lvh) * -100);z-index:0;pointer-events:none;overflow:hidden}
.cosmic-visual #journey-canvas{width:100%;height:100%;inset:0}
.home .odyssey{height:calc(var(--baiyun-svh, 1svh) * 440);min-height:0;background:transparent;z-index:1}
.home .odyssey-stage{position:sticky;top:0;height:calc(var(--baiyun-svh, 1svh) * 100);min-height:0;background:transparent}
.odyssey-stage:after{background:linear-gradient(0deg,#020307cf,transparent 72%),linear-gradient(90deg,#02030750,transparent 65%)}
.odyssey-controls button{display:inline-flex;align-items:center;gap:8px}
.odyssey-controls .by-icon{width:15px;height:15px}#tour-toggle{min-width:114px;justify-content:center}
.cosmic-journey .nebula-section{height:calc(var(--baiyun-svh, 1svh) * 560);margin-top:calc(var(--baiyun-svh, 1svh) * -100);background:transparent;overflow:visible;z-index:1;pointer-events:none}
.cosmic-journey .nebula-stage{height:calc(var(--baiyun-svh, 1svh) * 100);min-height:0;background:transparent;overflow:hidden}
.cosmic-journey .nebula-stage:after{background:linear-gradient(0deg,#02030770,transparent 75%);z-index:0}
.nebula-content{z-index:2}.nebula-beat{pointer-events:none}.nebula-beat.is-active{pointer-events:auto}
.nebula-beat[data-nebula-beat="0"]{top:23%;left:8%}.nebula-beat[data-nebula-beat="1"]{top:52%;right:7%}.nebula-beat[data-nebula-beat="2"]{top:28%;left:8%}
.nebula-beat[data-nebula-beat="3"],.nebula-beat[data-nebula-beat="4"]{left:8%;top:auto;bottom:18%;width:min(620px,75%)}
.nebula-beat h2{text-shadow:0 2px 22px #020307d0}.nebula-beat>p:not(.nebula-kicker){color:#d2d8e6;text-shadow:0 1px 10px #020307}
.nebula-kicker{color:#d0d9ed;text-shadow:0 1px 8px #020307}.nebula-kicker:before{background:#d7e7ff}
.nebula-scroll-cue{z-index:3;color:#dce6f8;text-shadow:0 1px 6px #020307}
.nebula-scroll-cue .by-icon{width:17px;height:17px}
.ocean-explore{display:inline-flex;align-items:center;gap:16px;border-bottom:1px solid #d4dfee70;padding:16px 0 10px;margin-top:12px;color:#fff;font-size:13px}
.odyssey-static .cosmic-visual{display:none}.home.odyssey-static .odyssey{background:#020713 url('./odyssey-v9/poster.jpg') center/cover no-repeat}
.odyssey-static .nebula-section{height:auto;margin-top:0;background:#030714 url(./odyssey-v27/cluster-poster.jpg) center top/100% auto no-repeat}
.odyssey-static .nebula-stage{height:auto;min-height:0;padding:100px 7%;position:relative}
.odyssey-static .nebula-content{display:grid;gap:90px}.odyssey-static .nebula-beat[data-nebula-beat]{position:relative;inset:auto;width:100%;max-width:680px;opacity:1;transform:none;pointer-events:auto}
.odyssey-static .nebula-scroll-cue{display:none}
@media(max-width:760px){
 .cosmic-journey .nebula-section{height:calc(var(--baiyun-svh, 1svh) * 530)}.nebula-beat[data-nebula-beat]{top:auto;bottom:19%;left:7%;right:7%;width:auto}
 .nebula-beat[data-nebula-beat="3"],.nebula-beat[data-nebula-beat="4"]{bottom:15%;width:auto}.nebula-beat h2{font-size:clamp(28px,7.8vw,40px)}
 .cosmic-journey .nebula-stage:after{background:linear-gradient(0deg,#020307b0,transparent 75%)}
 #tour-toggle{min-width:102px}.odyssey-static .nebula-section{height:auto}
}

.odyssey-static .nebula-beat.ocean-beat{box-sizing:border-box;min-height:calc(var(--baiyun-svh, 1svh) * 72);padding:160px 7% 60px;max-width:none;background:linear-gradient(0deg,#020307b0,transparent 85%),url(./odyssey-v15/ocean-poster.jpg) center/cover no-repeat}

.home.odyssey-static .odyssey{height:calc(var(--baiyun-svh, 1svh) * 100);min-height:680px}.home.odyssey-static .odyssey-stage{position:relative;height:100%}
.odyssey-static .nebula-beat.night-beat{box-sizing:border-box;min-height:calc(var(--baiyun-svh, 1svh) * 72);padding:150px 7% 60px;max-width:none;background:linear-gradient(0deg,#020307b0,transparent 85%),url(./odyssey-v27/night-poster.jpg) center/cover no-repeat}
.odyssey-controls button[hidden]{display:none}

/* Keep the close-up near the visual center and leave the lower third for community copy. */
@media(max-width:760px){.home .odyssey-copy{bottom:18%;}.home .odyssey-copy h1{font-size:clamp(30px,8.3vw,40px);line-height:1.38}.home #odyssey-terms{bottom:11.5%;}}

/* Community information remains readable alongside the scene at every phase. */
.home .odyssey-copy{width:min(570px,43vw);max-width:none;bottom:19%}
.home .odyssey-copy h1{font-size:clamp(34px,3.65vw,58px);line-height:1.32}
.home .odyssey-copy>p:last-child{max-width:46ch;font-size:14px;line-height:1.85}
.nebula-beat>p:not(.nebula-kicker){max-width:42ch}
@media(max-width:760px){
 .home .odyssey-copy{left:7%;right:7%;width:auto;bottom:20%}
 .home .odyssey-copy h1{font-size:clamp(28px,7.9vw,38px);line-height:1.34;margin:14px 0}
 .home .odyssey-copy>p:last-child{font-size:12px;line-height:1.75;max-width:38ch}
 .nebula-beat>p:not(.nebula-kicker){max-width:38ch}
}
@media(max-height:580px) and (prefers-reduced-motion:no-preference){
 .home .odyssey-copy{bottom:23%;width:48%;right:auto}
 .home .odyssey-copy h1{font-size:clamp(22px,4vw,34px);margin:8px 0;line-height:1.2}
 .home .odyssey-copy>p:last-child{font-size:11px;line-height:1.5}
 .home .odyssey-controls{bottom:15px;padding-top:10px}
 .home #odyssey-terms{inset:auto 5% 25% auto;width:35%;gap:5px}
 .cosmic-journey .nebula-beat[data-nebula-beat]{top:auto;bottom:18%;width:min(580px,80%)}
 .nebula-beat h2{font-size:28px;line-height:1.2}
 .nebula-kicker{margin-bottom:10px}.nebula-beat>p:not(.nebula-kicker){font-size:12px;margin-top:12px;line-height:1.5}
}


/* The reduced-motion phone view uses the same brighter phone particle scene. */
@media(max-width:760px){
 .odyssey-static .nebula-section{background-image:url(./odyssey-v27/cluster-mobile-poster.jpg)}
 .odyssey-static .nebula-beat.night-beat{background-image:linear-gradient(0deg,#020307b0,transparent 85%),url(./odyssey-v27/night-mobile-poster.jpg)}
}

.cosmic-journey .nebula-scroll-cue{opacity:var(--story-entered,0)}

/* The chapter elements are scroll spacers only while WebGL is enhanced. Their
   existing content lives in this common layer, so it releases with the canvas. */
.cosmic-unified{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:calc(var(--baiyun-svh, 1svh) * 340) auto}
.cosmic-unified>.cosmic-visual{grid-area:1/1/3/2;align-self:start;margin-bottom:0}
.home .cosmic-unified>.odyssey{grid-area:1/1/2/2;align-self:start;pointer-events:none}
.cosmic-unified>.nebula-section{grid-area:2/1/3/2;margin-top:0}
.cosmic-interface{position:absolute;inset:0;z-index:2;pointer-events:none}
.cosmic-unified .cosmic-interface .odyssey-stage,
.cosmic-unified .cosmic-interface .nebula-stage{position:absolute;top:0;left:0;width:100%;height:calc(var(--baiyun-svh, 1svh) * 100);min-height:0;pointer-events:none}
.cosmic-interface .odyssey-stage{z-index:1}
.cosmic-interface .nebula-stage{z-index:2;opacity:0}
.cosmic-interface .nebula-beat{opacity:var(--nebula-copy-alpha,0)}
.cosmic-interface .odyssey-controls,.cosmic-interface #odyssey-terms,
.cosmic-interface .odyssey-copy,.cosmic-interface .nebula-beat.is-active{pointer-events:auto}
.cosmic-interface .odyssey-copy{max-height:calc(calc(var(--baiyun-svh, 1svh) * 80) - 112px);overflow-y:auto;overscroll-behavior-y:auto;scrollbar-width:thin;overflow-wrap:anywhere}
.cosmic-interface .nebula-beat[data-nebula-beat]{top:auto;bottom:calc(var(--baiyun-svh, 1svh) * 18);max-height:calc(calc(var(--baiyun-svh, 1svh) * 82) - 112px);overflow-y:auto;scrollbar-width:thin;overflow-wrap:anywhere}
.cosmic-interface .nebula-beat h2{font-size:clamp(28px,3.65vw,60px)}
.cosmic-interface .nebula-content{height:100%}
/* Navigation changes at the same native boundary as the content, rather than
   interpolating a white backdrop behind a newly white logo for 700ms. */
.home .site-header{transition:none}
.home:not(.odyssey-day) .site-header{background:#06101a;backdrop-filter:none}
.home.odyssey-day .site-header{background:#f7fbff;backdrop-filter:none}
@media(max-width:760px){
 .cosmic-interface .nebula-beat[data-nebula-beat]{bottom:calc(var(--baiyun-svh, 1svh) * 16);max-height:calc(calc(var(--baiyun-svh, 1svh) * 84) - 102px)}
 .cosmic-interface .nebula-beat h2{font-size:clamp(28px,7.8vw,40px)}
 .cosmic-interface .odyssey-copy{max-height:calc(calc(var(--baiyun-svh, 1svh) * 80) - 102px)}
}
@media(max-height:580px){
 .cosmic-interface .odyssey-copy{max-height:calc(calc(var(--baiyun-svh, 1svh) * 77) - 82px)}
 .cosmic-interface .nebula-beat[data-nebula-beat]{bottom:calc(var(--baiyun-svh, 1svh) * 12);max-height:calc(calc(var(--baiyun-svh, 1svh) * 88) - 82px)}
}

/* These animated spacers must never become scroll-anchoring candidates. */
.cosmic-journey{overflow-anchor:none}
@media (min-width:1000px) and (min-height:650px){
 .ss-v10 .network-layout{min-height:min(calc(var(--baiyun-svh,1svh) * 70),720px)}
 .ss-v10 .network-globe-frame{width:min(100%,calc(var(--baiyun-svh,1svh) * 68))}
 .ss-practice-stage{min-height:min(calc(var(--baiyun-svh,1svh) * 75),760px)}
}
