/* Wondermaths juice layer — Open Sky. Decorative only; never changes game state. */
#fx-layer{
  position:fixed;inset:0;z-index:58;overflow:hidden;pointer-events:none;
  contain:layout paint style;isolation:isolate
}
#fx-layer[hidden]{display:none}
#fx-layer.wmj-behind-panel{z-index:49}
#fx-layer.wmj-paused *{animation-play-state:paused!important}
#reward.wmj-celebrating,#finale.wmj-celebrating{background:rgba(51,36,65,.2);backdrop-filter:blur(1.5px)}
.wmj-particle,.wmj-confetti,.wmj-firework,.wmj-flight,.wmj-flight-trail,.wmj-starlet,.wmj-bloom,.wmj-ring,.wmj-thought,.wmj-water-drop,.wmj-water-ripple,.wmj-glint{
  position:fixed;pointer-events:none;will-change:transform,opacity
}
.wmj-particle{
  left:0;top:0;width:var(--s,9px);height:var(--s,9px);border-radius:50%;
  background:var(--c,#ffd75f);box-shadow:0 0 7px color-mix(in srgb,var(--c,#ffd75f) 70%,transparent);
  animation:wmj-particle var(--d,680ms) cubic-bezier(.18,.74,.25,1) forwards
}
.wmj-particle.diamond{border-radius:2px;transform:rotate(45deg)}
.wmj-particle.feather{
  width:calc(var(--s,9px) * .72);height:calc(var(--s,9px) * 1.75);border-radius:90% 10% 85% 15%;
  background:linear-gradient(135deg,#fffdf1 0 34%,var(--c,#d7b8e4) 37% 100%)
}
.wmj-ring{
  left:var(--x);top:var(--y);width:18px;height:18px;border:4px solid #ffe072;border-radius:50%;
  transform:translate(-50%,-50%);animation:wmj-ring 480ms ease-out forwards
}
.wmj-flight{
  left:0;top:0;width:clamp(34px,5vw,52px);height:clamp(34px,5vw,52px);object-fit:contain;
  filter:drop-shadow(0 0 9px #fff8bc) drop-shadow(0 3px 2px #6c4428aa);
  transform:translate3d(var(--sx),var(--sy),0) scale(.72) rotate(-16deg);z-index:4;
  animation:wmj-flight 920ms ease-in-out forwards
}
.wmj-flight::after{content:""}
.wmj-flight-trail{
  left:0;top:0;width:var(--s,7px);height:var(--s,7px);border-radius:50%;z-index:3;
  background:var(--c,#ffe279);box-shadow:0 0 8px var(--c,#ffe279);
  animation:wmj-flight-trail 820ms ease-in-out var(--delay,0ms) forwards
}
.wmj-starlet{
  left:0;top:0;width:var(--s,12px);height:var(--s,12px);z-index:3;
  opacity:0;background:var(--c,#ffe279);clip-path:polygon(50% 0,60% 40%,100% 50%,60% 60%,50% 100%,40% 60%,0 50%,40% 40%);
  filter:drop-shadow(0 0 1px #76502a) drop-shadow(0 0 5px #fff8c6) drop-shadow(0 0 9px var(--c,#ffe279))
}
.wmj-starlet.flight-star{
  animation:wmj-starlet-flight var(--d,1040ms) cubic-bezier(.2,.72,.22,1) var(--delay,0ms) both
}
.wmj-starlet.halo-star{
  animation:wmj-starlet-halo var(--d,760ms) cubic-bezier(.16,.72,.26,1) var(--delay,0ms) both
}
.wmj-starlet.sky-sweep{
  z-index:2;animation:wmj-starlet-sweep var(--d,1750ms) cubic-bezier(.18,.64,.26,1) var(--delay,0ms) both
}
.wmj-water-drop{
  left:0;top:0;width:var(--s,8px);height:calc(var(--s,8px) * 1.35);z-index:5;border-radius:55% 55% 64% 64%/58% 58% 42% 42%;
  background:linear-gradient(145deg,#effcff 0 24%,#78d5f6 30%,#2da9e4);box-shadow:0 0 6px #e9fbff;
  animation:wmj-water-drop var(--d,620ms) cubic-bezier(.17,.72,.24,1) forwards
}
.wmj-water-ripple{
  left:var(--x);top:var(--y);width:22px;height:8px;z-index:4;border:3px solid rgba(222,249,255,.95);border-radius:50%;
  transform:translate(-50%,-50%) scale(.4);box-shadow:0 0 8px rgba(88,198,239,.8);
  animation:wmj-water-ripple 620ms ease-out forwards
}
.wmj-glint{
  left:0;top:0;width:9px;height:58px;z-index:6;border-radius:8px;
  background:linear-gradient(90deg,transparent,#fff 45% 58%,transparent);filter:drop-shadow(0 0 5px #fff);
  animation:wmj-glint 560ms ease-out forwards
}
.round-star.wmj-land{
  animation:wmj-star-land 560ms cubic-bezier(.17,.85,.35,1) both;
  filter:saturate(1.25) drop-shadow(0 0 12px #ffe46f)!important
}
.wmj-bloom{
  inset:0;z-index:1;background:radial-gradient(circle at 50% 48%,rgba(255,248,188,.82),rgba(219,188,237,.2) 34%,transparent 68%);
  opacity:0;animation:wmj-bloom 1450ms ease-in-out forwards
}
.wmj-confetti{
  left:0;top:-30px;width:var(--w,9px);height:var(--h,20px);border-radius:4px;
  background:var(--c,#f7cc55);box-shadow:inset 0 2px rgba(255,255,255,.55);
  animation:wmj-confetti var(--d,2200ms) cubic-bezier(.18,.7,.28,1) var(--delay,0ms) forwards
}
.wmj-confetti.feather{
  border-radius:90% 10% 85% 15%;background:linear-gradient(135deg,#fffdf0 0 30%,var(--c,#d9b9e7) 34% 100%)
}
.wmj-firework{
  left:var(--x);top:var(--y);width:7px;height:7px;border-radius:50%;background:var(--c,#ffd65c);
  box-shadow:0 0 9px var(--c,#ffd65c);transform:translate(-50%,-50%);
  animation:wmj-firework var(--d,1050ms) cubic-bezier(.18,.68,.24,1) var(--delay,0ms) forwards
}
.wmj-ambient{
  position:fixed;z-index:0;pointer-events:none;opacity:0;will-change:transform,opacity
}
.wmj-ambient.feather{
  width:13px;height:29px;border-radius:90% 10% 85% 15%;
  background:linear-gradient(135deg,#fffdf2 0 35%,#d9b7e7 39% 72%,#a87dbd 76%);
  box-shadow:0 2px 5px rgba(78,64,104,.22);animation:wmj-drift-feather 17s ease-in-out infinite
}
.wmj-ambient.cloudlet{
  width:56px;height:19px;border-radius:30px;background:rgba(255,255,255,.6);filter:blur(.2px);
  box-shadow:17px -8px 0 -2px rgba(255,255,255,.55),-13px -4px 0 -3px rgba(255,255,255,.5);
  animation:wmj-drift-cloud 21s linear infinite
}
.wmj-ambient.ribbon{
  width:76px;height:22px;border-top:2px solid rgba(255,255,255,.45);border-radius:50%;
  animation:wmj-drift-ribbon 15s ease-in-out infinite
}
.wmj-idle.cloud-pour::before{
  animation:wmj-idle-cta 1.45s ease-in-out 2!important;
  box-shadow:0 3px 0 #9d632c,0 0 0 4px #fff2a9,0 0 18px #ffe26e!important
}
.wmj-touch-cup .cup-art{animation:wmj-touch-cup 330ms cubic-bezier(.2,.8,.25,1)}
.cloud-pour.wmj-cloud-tap::before{animation:wmj-cloud-badge-pop 330ms cubic-bezier(.17,.82,.28,1)!important}
.check.wmj-touch-check{animation:wmj-check-tap 360ms cubic-bezier(.2,.8,.25,1)}
.station .cup.wmj-gold-punch .cup-art{animation:wmj-gold-punch 730ms cubic-bezier(.17,.82,.28,1)}
.hero.wmj-round-cheer{animation:wmj-round-cheer 920ms cubic-bezier(.17,.82,.28,1)!important}
.guide-zone.wmj-round-cheer .guide{animation:wmj-guide-cheer 920ms cubic-bezier(.17,.82,.28,1)!important}
.round-track.wmj-streak-glow{animation:wmj-streak-glow 950ms ease-out}
.cup.retry{animation:nudge .42s ease}
.hero.wmj-beat-ma53{animation:wmj-ma53 1150ms ease-in-out!important}
.hero.wmj-beat-ma47{animation:wmj-ma47 1380ms ease-in-out!important}
.hero.wmj-beat-ma19{animation:wmj-ma19 1050ms ease-in-out!important}
.hero.wmj-beat-ma35{animation:wmj-ma35 1350ms ease-in-out!important}
.board.wmj-cloud-puff .rain-stream{animation:wmj-puff 620ms ease-out!important}
.wmj-thought{
  left:var(--x);top:var(--y);z-index:5;color:#ffe079;font-size:30px;font-weight:900;text-shadow:0 2px #795737,0 0 8px #fff;
  animation:wmj-thought 950ms ease-out forwards
}
#reward .panel.wmj-level-party,#finale .panel.wmj-final-party{animation:wmj-panel-arrive 900ms cubic-bezier(.17,.82,.28,1)}
#reward .highfive.wmj-highfive-cheer,#finale .highfive.wmj-highfive-cheer{animation:wmj-highfive-cheer 1250ms cubic-bezier(.17,.82,.28,1)}
#reward .reward-feather.wmj-feather-shine,#finale .final-feathers.wmj-feather-shine{
  animation:wmj-feather-shine 1200ms ease-out
}
#reward .reward-stars.wmj-star-cheer img{animation:wmj-earned-star-cheer 980ms cubic-bezier(.17,.82,.28,1) both}
#reward .reward-stars.wmj-star-cheer img:nth-child(2){animation-delay:80ms}
#reward .reward-stars.wmj-star-cheer img:nth-child(3){animation-delay:160ms}
#reward .reward-stars.wmj-star-cheer img:nth-child(4){animation-delay:240ms}

@keyframes wmj-particle{
  0%{opacity:0;transform:translate3d(var(--x),var(--y),0) scale(.25) rotate(0)}
  14%{opacity:1}
  100%{opacity:0;transform:translate3d(calc(var(--x) + var(--dx)),calc(var(--y) + var(--dy)),0) scale(.9) rotate(var(--r,150deg))}
}
@keyframes wmj-ring{0%{opacity:.9;transform:translate(-50%,-50%) scale(.35)}100%{opacity:0;transform:translate(-50%,-50%) scale(2.7)}}
@keyframes wmj-flight{
  0%{opacity:0;transform:translate3d(var(--sx),var(--sy),0) scale(.65) rotate(-18deg)}
  12%{opacity:1}
  48%{opacity:1;transform:translate3d(var(--mx),var(--my),0) scale(1.22) rotate(12deg)}
  100%{opacity:0;transform:translate3d(var(--tx),var(--ty),0) scale(.66) rotate(360deg)}
}
@keyframes wmj-flight-trail{
  0%{opacity:0;transform:translate3d(var(--sx),var(--sy),0) scale(.25)}
  18%{opacity:.95}
  55%{opacity:.8;transform:translate3d(var(--mx),var(--my),0) scale(1)}
  100%{opacity:0;transform:translate3d(var(--tx),var(--ty),0) scale(.2)}
}
@keyframes wmj-starlet-flight{
  0%{opacity:0;transform:translate3d(var(--sx),var(--sy),0) scale(.2) rotate(0)}
  16%{opacity:1}
  50%{opacity:.98;transform:translate3d(var(--mx),var(--my),0) scale(1.08) rotate(155deg)}
  100%{opacity:0;transform:translate3d(var(--tx),var(--ty),0) scale(.18) rotate(330deg)}
}
@keyframes wmj-starlet-halo{
  0%{opacity:0;transform:translate3d(var(--x),var(--y),0) scale(.25) rotate(0)}
  24%{opacity:1}
  100%{opacity:0;transform:translate3d(calc(var(--x) + var(--dx)),calc(var(--y) + var(--dy)),0) scale(.6) rotate(var(--r,210deg))}
}
@keyframes wmj-starlet-sweep{
  0%{opacity:0;transform:translate3d(var(--sx),var(--sy),0) scale(.25) rotate(0)}
  18%{opacity:.95}
  54%{opacity:1;transform:translate3d(var(--mx),var(--my),0) scale(1.12) rotate(170deg)}
  100%{opacity:0;transform:translate3d(var(--tx),var(--ty),0) scale(.45) rotate(350deg)}
}
@keyframes wmj-water-drop{
  0%{opacity:0;transform:translate3d(var(--x),var(--y),0) scale(.35) rotate(45deg)}
  16%{opacity:1}
  58%{opacity:1;transform:translate3d(calc(var(--x) + var(--dx)),calc(var(--y) + var(--peak)),0) scale(1) rotate(45deg)}
  100%{opacity:0;transform:translate3d(calc(var(--x) + var(--dx2)),calc(var(--y) + var(--dy)),0) scale(.72) rotate(45deg)}
}
@keyframes wmj-water-ripple{0%{opacity:.95;transform:translate(-50%,-50%) scale(.35)}100%{opacity:0;transform:translate(-50%,-50%) scale(3.1)}}
@keyframes wmj-glint{0%{opacity:0;transform:translate3d(var(--x),var(--y),0) rotate(18deg) scaleY(.55)}35%{opacity:.95}100%{opacity:0;transform:translate3d(calc(var(--x) + var(--dx)),var(--y),0) rotate(18deg) scaleY(1)}}
@keyframes wmj-star-land{0%{transform:scale(.78)}40%{transform:scale(1.46) rotate(8deg)}75%{transform:scale(.92) rotate(-4deg)}100%{transform:scale(1) rotate(0)}}
@keyframes wmj-bloom{0%{opacity:0}48%{opacity:.9}100%{opacity:0}}
@keyframes wmj-confetti{
  0%{opacity:0;transform:translate3d(var(--x),-20px,0) rotate(0)}
  10%{opacity:1}
  86%{opacity:1}
  100%{opacity:0;transform:translate3d(calc(var(--x) + var(--sway)),calc(100vh + 50px),0) rotate(var(--spin))}
}
@keyframes wmj-firework{
  0%{opacity:0;transform:translate(-50%,-50%) scale(.2)}
  8%{opacity:1}
  68%{opacity:.95}
  100%{opacity:0;transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) scale(.6)}
}
@keyframes wmj-drift-feather{0%,100%{opacity:0;transform:translate3d(0,15vh,0) rotate(-10deg)}12%,82%{opacity:.38}50%{transform:translate3d(28px,50vh,0) rotate(160deg)}100%{transform:translate3d(-5px,92vh,0) rotate(310deg)}}
@keyframes wmj-drift-cloud{0%{opacity:0;transform:translate3d(-90px,0,0)}12%,86%{opacity:.28}100%{opacity:0;transform:translate3d(calc(100vw + 110px),7px,0)}}
@keyframes wmj-drift-ribbon{0%,100%{opacity:.08;transform:translateX(-12px)}50%{opacity:.28;transform:translateX(18px)}}
@keyframes wmj-idle-cta{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-2px) scale(1.1)}}
@keyframes wmj-touch-cup{0%,100%{transform:scale(1)}48%{transform:scale(1.07) translateY(-3px)}}
@keyframes wmj-cloud-badge-pop{0%,100%{transform:translateY(0) scale(1)}42%{transform:translateY(-3px) scale(1.24)}70%{transform:translateY(1px) scale(.96)}}
@keyframes wmj-check-tap{0%,100%{filter:drop-shadow(0 5px 4px #53392966)}50%{filter:drop-shadow(0 0 13px #ffe36c) drop-shadow(0 4px 3px #53392966)}}
@keyframes wmj-gold-punch{0%,100%{transform:translateY(0) scale(1)}30%{transform:translateY(-6px) scale(1.05)}58%{transform:translateY(1px) scale(.99)}}
@keyframes wmj-round-cheer{0%,100%{transform:translateY(0) rotate(0)}28%{transform:translateY(-12px) rotate(-4deg)}52%{transform:translateY(-4px) rotate(4deg)}74%{transform:translateY(-8px) rotate(-2deg)}}
@keyframes wmj-guide-cheer{0%,100%{transform:translateY(0) rotate(0)}30%{transform:translateY(-8px) rotate(5deg)}58%{transform:translateY(-2px) rotate(-4deg)}}
@keyframes wmj-streak-glow{0%,100%{filter:none}42%{filter:drop-shadow(0 0 13px #ffe36c) brightness(1.12)}}
@keyframes wmj-highfive-cheer{0%,100%{transform:scale(1) rotate(0)}32%{transform:scale(1.075) rotate(-1.5deg)}58%{transform:scale(1.025) rotate(1.5deg)}78%{transform:scale(1.05) rotate(-.5deg)}}
@keyframes wmj-ma53{0%,100%{transform:translateY(0) rotate(0)}25%{transform:translateY(-3px) rotate(-8deg)}48%{transform:translateY(-1px) rotate(8deg)}72%{transform:translateY(-2px) rotate(-4deg)}}
@keyframes wmj-ma47{0%,100%{transform:translate(0,0) rotate(0)}28%{transform:translate(-8px,2px) rotate(-7deg)}52%{transform:translate(7px,-3px) rotate(6deg)}75%{transform:translate(-2px,0) rotate(-2deg)}}
@keyframes wmj-ma19{0%,100%{transform:translateX(0) rotate(0)}30%{transform:translateX(-5px) rotate(-4deg)}62%{transform:translateX(5px) rotate(4deg)}}
@keyframes wmj-ma35{0%,100%{transform:translateY(0) scale(1)}40%{transform:translateY(-6px) scale(1.035)}70%{transform:translateY(-1px) scale(1.01)}}
@keyframes wmj-puff{0%,100%{opacity:1;transform:translateX(-50%) scale(1)}45%{opacity:.45;transform:translateX(-50%) scale(.82)}}
@keyframes wmj-thought{0%{opacity:0;transform:translate(-50%,6px) scale(.6)}35%{opacity:1;transform:translate(-50%,-7px) scale(1.05)}100%{opacity:0;transform:translate(-50%,-32px) scale(.9)}}
@keyframes wmj-panel-arrive{0%{transform:scale(.92);filter:brightness(1)}42%{transform:scale(1.025);filter:brightness(1.06)}100%{transform:scale(1);filter:brightness(1)}}
@keyframes wmj-feather-shine{0%{filter:brightness(1)}45%{filter:brightness(1.28) drop-shadow(0 0 13px #ffe36c)}100%{filter:brightness(1)}}
@keyframes wmj-earned-star-cheer{0%{transform:translateY(10px) scale(.65);filter:brightness(1)}42%{transform:translateY(-5px) scale(1.24) rotate(8deg);filter:brightness(1.25) drop-shadow(0 0 12px #ffe36c)}72%{transform:translateY(1px) scale(.94) rotate(-4deg)}100%{transform:none;filter:drop-shadow(0 3px 3px #78492155)}}

@media (max-width:760px){
  .wmj-flight{width:34px;height:34px}
  .wmj-ambient.cloudlet{width:42px;height:14px}.wmj-ambient.feather{width:10px;height:23px}
}
@media (prefers-reduced-motion:reduce){
  #fx-layer .wmj-particle,#fx-layer .wmj-confetti,#fx-layer .wmj-firework,#fx-layer .wmj-flight,#fx-layer .wmj-flight-trail,#fx-layer .wmj-starlet,#fx-layer .wmj-water-drop,#fx-layer .wmj-water-ripple,#fx-layer .wmj-glint,#fx-layer .wmj-ambient,#fx-layer .wmj-bloom{display:none!important}
  .wmj-idle.cloud-pour::before,.wmj-touch-cup .cup-art,.check.wmj-touch-check,.station .cup.wmj-gold-punch .cup-art,
  .round-star.wmj-land,
  .hero.wmj-beat-ma53,.hero.wmj-beat-ma47,.hero.wmj-beat-ma19,.hero.wmj-beat-ma35,.board.wmj-cloud-puff .rain-stream,
  .hero.wmj-round-cheer,.guide-zone.wmj-round-cheer .guide,.round-track.wmj-streak-glow,.cloud-pour.wmj-cloud-tap::before,
  #reward .panel.wmj-level-party,#finale .panel.wmj-final-party,#reward .reward-feather.wmj-feather-shine,#finale .final-feathers.wmj-feather-shine,#reward .highfive.wmj-highfive-cheer,#finale .highfive.wmj-highfive-cheer,#reward .reward-stars.wmj-star-cheer img{
    animation:none!important
  }
}