/* Cloud curtain is fixed in front of content, outside the main stacking context. */
.forest-viewport>.story-clouds{z-index:0}
.sunlit-scene{position:absolute;inset:0;z-index:2;opacity:0;overflow:hidden;isolation:isolate;pointer-events:none;will-change:opacity}
.sunlit-scene>img{display:block;position:absolute;left:50%;bottom:calc(var(--forest-vh,100svh)*-.42);width:100%;min-width:calc(var(--forest-vh,100svh)*1.5);height:auto;transform:translateX(-50%);filter:saturate(.92)}
.sunlit-scene:after,.cloud-passage-photo:after{content:'';position:absolute;inset:0;pointer-events:none;background:url('nature/film-grain.svg') repeat;background-size:180px 180px;opacity:.12;mix-blend-mode:soft-light}
.cloud-reference-field{position:fixed;inset:0;width:100%;height:100svh;z-index:50;overflow:hidden;pointer-events:none;visibility:hidden;opacity:0;contain:layout paint}
.cloud-deck{position:absolute;top:0;left:0;width:100%;height:135%;overflow:hidden;will-change:transform;mask-image:url('nature/cloud-deck-mask.svg');mask-size:100% 100%;mask-repeat:no-repeat;-webkit-mask-image:url('nature/cloud-deck-mask.svg');-webkit-mask-size:100% 100%;-webkit-mask-repeat:no-repeat}
.cloud-passage-photo{position:absolute;inset:-18% -8%;z-index:0;opacity:0;isolation:isolate;will-change:transform,opacity;transform-origin:center}
.cloud-passage-photo>img{display:block;width:100%;height:100%;object-fit:cover;filter:none}
.cloud-descent-plane{position:absolute;z-index:1;opacity:0;will-change:transform;transform-origin:center}
.cloud-descent-plane img{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:none;mask-image:none;-webkit-mask-image:none;user-select:none}
.hero-edge-clouds{position:absolute;inset:0;z-index:1;overflow:hidden;pointer-events:none}
.hero-edge-cloud{position:absolute;width:100%;will-change:transform;opacity:.42}
.hero-edge-cloud img{display:block;width:100%;height:100%;object-fit:contain;object-position:center bottom;filter:brightness(.55) saturate(.5)}
.edge-left{left:-40%;top:0;height:60%}
.edge-bottom-left{left:-50%;bottom:-30%;height:80%}
.edge-right{right:-55%;top:-10%;height:60%}
.edge-bottom-right{right:-50%;bottom:-10%;height:80%}
body.cloud-transiting .to-top{opacity:0!important;pointer-events:none}
@media(max-width:1024px){.cloud-descent-plane{width:var(--mobile-width)!important}}
@media(prefers-reduced-motion:reduce){.cloud-descent-plane,.hero-edge-clouds{display:none}.cloud-passage-photo,.sunlit-scene,.cloud-deck{will-change:auto}.cloud-deck{transform:none!important;mask-image:none;-webkit-mask-image:none}}