.sky{
  position:absolute;inset:0;z-index:0;
  background:linear-gradient(180deg,
    #2A1233 0%,
    #4A1D38 22%,
    #7A2E3E 42%,
    #B04F38 60%,
    #DE8449 74%,
    #F4B56A 86%,
    #FBD98F 100%);
}

.sun-glow{
  top:34%;left:33%;width:520px;height:520px;margin-left:-260px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,224,160,.75),rgba(255,170,90,.28) 45%,transparent 72%);
}
.light-shaft{
  top:-6%;left:30%;width:420px;height:130%;
  background:linear-gradient(180deg,rgba(255,220,170,.20),rgba(255,200,140,0) 70%);
  clip-path:polygon(46% 0%,54% 0%,100% 100%,0% 100%);
  mix-blend-mode:screen;
  animation:shaftPulse 7s ease-in-out infinite;
}
.light-shaft.s2{
  left:41%;width:190px;opacity:.55;
  animation-delay:-3.2s;animation-duration:9s;
}
@keyframes shaftPulse{0%,100%{opacity:.5;}50%{opacity:.85;}}

.stars-host,.motes-host{position:absolute;inset:0;}
#particles-sky{position:absolute;inset:0;}
#particles-motes{position:absolute;inset:0;}

.shooting-star{
  position:absolute;top:12%;left:-10%;width:120px;height:2px;border-radius:2px;
  background:linear-gradient(90deg,rgba(255,240,214,0),rgba(255,240,214,.95));
  opacity:0;transform:rotate(18deg);pointer-events:none;
  filter:drop-shadow(0 0 6px rgba(255,200,120,.9));
}
.shooting-star.fly{animation:shoot 1.4s ease-out forwards;}
@keyframes shoot{
  0%{opacity:0;transform:translate(0,0) rotate(18deg);}
  8%{opacity:1;}
  100%{opacity:0;transform:translate(115vw,42vh) rotate(18deg);}
}

.mountains{left:-2%;right:-2%;bottom:26%;height:40%;}
.mountains svg{width:100%;height:100%;display:block;}
.mountains.far{filter:blur(2.5px);opacity:.8;}

.horizon-haze{
  position:absolute;left:-2%;right:-2%;bottom:23.5%;height:8.5%;z-index:4;
  background:linear-gradient(180deg,
    rgba(251,215,150,0) 0%,
    rgba(246,186,116,.5) 45%,
    rgba(228,142,90,.82) 100%);
  filter:blur(7px);
  pointer-events:none;
}

.clouds{inset:0;overflow:hidden;}
.cloud{
  position:absolute;left:-30%;
  will-change:transform;
  animation:cloudDrift linear infinite;
}
.cloud svg{display:block;width:100%;height:auto;}
.cloud.back{opacity:.32;}
.cloud.front{opacity:.14;filter:blur(1.5px);}
@keyframes cloudDrift{
  from{transform:translateX(-15vw);}
  to{transform:translateX(135vw);}
}

.birds-layer{position:absolute;inset:0;z-index:8;pointer-events:none;overflow:hidden;}
.bird-flock{position:absolute;display:flex;gap:14px;will-change:transform;}
.bird{width:22px;height:12px;animation:flap .5s ease-in-out infinite alternate;}
.bird:nth-child(2){animation-delay:-.15s;margin-top:8px;}
.bird:nth-child(3){animation-delay:-.32s;margin-top:-4px;}
.bird:nth-child(4){animation-delay:-.08s;margin-top:12px;}
.bird:nth-child(5){animation-delay:-.25s;margin-top:4px;}
.bird svg{display:block;width:100%;height:100%;}
@keyframes flap{from{transform:scaleY(1);}to{transform:scaleY(.45);}}

.px.water-px{
  left:-4%;right:-4%;bottom:-2%;top:auto;height:33%;z-index:5;
}
.water{
  position:absolute;inset:0;overflow:hidden;
  background:linear-gradient(180deg,
    rgba(251,215,150,0) 0%,
    rgba(244,181,106,.42) 8%,
    rgba(176,79,56,.74) 24%,
    rgba(90,36,58,.93) 52%,
    rgba(42,18,51,.98) 100%);
}

.sea-sun-column{
  position:absolute;top:-4%;left:33%;width:360px;height:64%;margin-left:-180px;
  background:radial-gradient(ellipse at 50% 0%,rgba(255,228,165,.5),rgba(255,180,90,.16) 48%,transparent 72%);
  filter:blur(7px);
  animation:seaGlow 6s ease-in-out infinite alternate;
  pointer-events:none;
}
.sea-sun-core{
  position:absolute;top:-1%;left:33%;width:130px;height:40%;margin-left:-65px;
  background:linear-gradient(180deg,rgba(255,240,196,.8),rgba(255,192,115,.28) 55%,transparent 100%);
  filter:blur(3px);
  animation:seaGlow 5s ease-in-out infinite alternate-reverse;
  pointer-events:none;
}
@keyframes seaGlow{from{opacity:.7;}to{opacity:1;}}

.sea-patch{
  position:absolute;border-radius:50%;filter:blur(11px);pointer-events:none;
  background:radial-gradient(ellipse at center,rgba(255,212,152,.26),transparent 66%);
  animation:patchSway ease-in-out infinite alternate;
  will-change:transform;
}
@keyframes patchSway{
  from{transform:translateX(-26px) scale(1);}
  to{transform:translateX(26px) scale(1.07);}
}

.ripple{
  position:absolute;height:2px;border-radius:2px;pointer-events:none;
  background:linear-gradient(90deg,transparent,var(--rc,rgba(255,232,190,.75)),transparent);
  animation:rippleDrift ease-in-out infinite alternate;
  will-change:transform,opacity;
}
@keyframes rippleDrift{
  from{transform:translateX(calc(var(--rx,-14px)*-1)) scaleX(.94);opacity:var(--ro,.3);}
  to{transform:translateX(var(--rx,14px)) scaleX(1.06);opacity:calc(var(--ro,.3)*2.1);}
}

.water-glint{
  position:absolute;height:3px;border-radius:3px;
  background:linear-gradient(90deg,transparent,rgba(255,236,200,.7),transparent);
  opacity:0;animation:glint 5s ease-in-out infinite;
}
@keyframes glint{0%,100%{opacity:0;transform:scaleX(.4);}50%{opacity:.8;transform:scaleX(1);}}

#reflections{position:absolute;inset:0;pointer-events:none;}
.reflection{
  position:absolute;border-radius:50%;
  filter:blur(7px);
  opacity:.28;
  transform-origin:top center;
  animation:reflWave 5s ease-in-out infinite alternate;
  pointer-events:none;
}
.reflection::after{
  content:'';position:absolute;inset:0;border-radius:inherit;
  background:repeating-linear-gradient(180deg,rgba(245,250,255,.14) 0 3px,transparent 3px 9px);
  mix-blend-mode:overlay;
}
@keyframes reflWave{
  from{transform:scaleY(1) scaleX(1);}
  to{transform:scaleY(1.25) scaleX(.94);opacity:.18;}
}
