/* One finite celebration per earned reward batch; navigation stays available. */
.reward-celebration{position:relative;isolation:isolate;overflow:hidden}
.reward-celebration> :not(.treasure-confetti){position:relative;z-index:1}
.reward-celebration .treasure-confetti{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden}
.treasure-confetti span{position:absolute;left:var(--spark-x);top:10%;font-size:19px;color:var(--spark-colour);opacity:0;pointer-events:none;will-change:auto}
.celebration-buddy{width:132px;margin:-8px auto 0;transform-origin:50% 90%}
.celebration-buddy .buddy-portrait{width:100%;margin:0}
.reward-celebration .reward-sparkles{margin-top:-8px;font-size:23px;animation:none}
.reward-celebration .new-treasure>span{animation:none}
.is-celebrating .treasure-confetti span{animation:treasure-spark-shower 2400ms ease-out var(--spark-delay) both}
.is-celebrating .celebration-buddy{animation:coco-treasure-hop 1050ms ease-in-out 120ms both}
.is-celebrating .reward-sparkles{animation:treasure-star-open 950ms ease-out 100ms both}
.is-celebrating .new-treasure{animation:treasure-card-reveal 700ms cubic-bezier(.2,.8,.3,1.2) var(--reveal-delay) both}
.is-celebrating .new-treasure>span{animation:treasure-badge-bounce 900ms ease-out calc(var(--reveal-delay) + 100ms) both}
@keyframes treasure-spark-shower{
 0%{opacity:0;transform:translate(0,-35px) rotate(0deg) scale(.5)}
 15%{opacity:1}
 70%{opacity:.85}
 100%{opacity:0;transform:translate(var(--spark-drift),390px) rotate(var(--spark-turn)) scale(.8)}
}
@keyframes coco-treasure-hop{
 0%,100%{transform:translateY(0) rotate(0)}
 25%{transform:translateY(-10px) rotate(-6deg)}
 45%{transform:translateY(0) rotate(3deg)}
 70%{transform:translateY(-6px) rotate(5deg)}
}
@keyframes treasure-star-open{
 0%{opacity:0;transform:scale(.5)}
 65%{opacity:1;transform:scale(1.2)}
 100%{opacity:1;transform:scale(1)}
}
@keyframes treasure-card-reveal{
 0%{opacity:0;transform:translateY(18px) scale(.86)}
 75%{opacity:1;transform:translateY(-3px) scale(1.02)}
 100%{opacity:1;transform:translateY(0) scale(1)}
}
@keyframes treasure-badge-bounce{
 0%{transform:scale(.65) rotate(-12deg)}
 45%{transform:scale(1.22) rotate(7deg)}
 75%{transform:scale(.96) rotate(-3deg)}
 100%{transform:scale(1) rotate(0)}
}
@media(prefers-reduced-motion:reduce){
 .reward-celebration .treasure-confetti{display:none}
 .reward-celebration .celebration-buddy,.reward-celebration .reward-sparkles,.reward-celebration .new-treasure,.reward-celebration .new-treasure>span{animation:none!important;opacity:1;transform:none}
}

/* Sparkle bursts (dist/effects.js) */
.sparkle-burst{position:absolute;width:0;height:0;z-index:6;pointer-events:none}
.sparkle-burst span{position:absolute;left:0;top:0;font-size:var(--size);line-height:1;color:var(--colour);text-shadow:0 1px 2px #3d5b4440;opacity:0;transform:translate(-50%,-50%);animation:sparkle-fly 1.1s cubic-bezier(.2,.7,.3,1) var(--delay) both}
@keyframes sparkle-fly{
 0%{opacity:0;transform:translate(-50%,-50%) rotate(var(--angle)) translateY(0) scale(.3)}
 20%{opacity:1}
 70%{opacity:1}
 100%{opacity:0;transform:translate(-50%,-50%) rotate(var(--angle)) translateY(calc(-1 * var(--reach))) scale(1)}
}

/* A new Treehouse building springs up from the ground */
.treehouse-celebrate .part-wrap{transform-box:fill-box;transform-origin:50% 100%;animation:part-build 1.1s cubic-bezier(.2,.9,.3,1.3) .2s both}
@keyframes part-build{0%{opacity:0;transform:translateY(-40px) scale(.3)}60%{opacity:1;transform:translateY(0) scale(1.1)}80%{transform:scale(.96)}100%{transform:scale(1)}}
.treehouse-built-note{animation:note-pop .7s cubic-bezier(.2,.9,.3,1.4) .9s both}
@keyframes note-pop{0%{opacity:0;transform:scale(.6)}100%{opacity:1;transform:scale(1)}}
.treehouse-celebrate .treehouse-coco{animation:coco-treasure-hop 1050ms ease-in-out 1s both}

/* The next chapter, just unlocked */
.treehouse-mission.just-unlocked{animation:chapter-glow 1.6s ease-in-out 1.4s 2 both}
.new-badge{position:absolute;top:14px;right:14px;background:#f2c14e;color:#4a3a12;font-weight:900;font-size:13px;letter-spacing:.5px;padding:5px 11px;border-radius:999px;box-shadow:0 3px 8px #b8862b40;animation:badge-pop .6s cubic-bezier(.2,.9,.3,1.5) 1.6s both}
@keyframes chapter-glow{50%{box-shadow:0 0 0 6px #f2c14e55,0 12px 26px #406e4b22}}
@keyframes badge-pop{0%{opacity:0;transform:scale(.4) rotate(-12deg)}100%{opacity:1;transform:scale(1) rotate(0)}}

/* New treasures: soft rays turn behind each one */
.new-treasure>span{position:relative;isolation:isolate}
.is-celebrating .new-treasure>span::before{content:'';position:absolute;inset:-26%;z-index:-1;border-radius:50%;background:repeating-conic-gradient(from 0deg,#ffe79a88 0 10deg,transparent 10deg 30deg);mask:radial-gradient(circle,#000 35%,transparent 70%);animation:treasure-rays 3.2s linear calc(var(--reveal-delay) + 150ms) both}
@keyframes treasure-rays{0%{opacity:0;transform:rotate(0) scale(.6)}20%{opacity:1;transform:rotate(40deg) scale(1)}80%{opacity:1}100%{opacity:0;transform:rotate(200deg) scale(1.05)}}

/* A decoration pops into its spot */
.garden-spot.just-placed>*{animation:decoration-land .8s cubic-bezier(.2,.9,.3,1.4) both}
@keyframes decoration-land{0%{opacity:0;transform:translateY(-30px) scale(.4)}100%{opacity:1;transform:none}}

@media(prefers-reduced-motion:reduce){
 .sparkle-burst,.treehouse-celebrate .part-wrap,.treehouse-built-note,.treehouse-mission.just-unlocked,.new-badge,.is-celebrating .new-treasure>span::before,.garden-spot.just-placed>*{animation:none!important}
 .is-celebrating .new-treasure>span::before{display:none}
}
.burst-glow{position:absolute;left:0;top:0;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,#fff6c9ee 0,#ffe28a88 35%,transparent 70%);transform:translate(-50%,-50%) scale(.2);opacity:0;animation:burst-glow 1.3s ease-out var(--delay) both}
@keyframes burst-glow{0%{opacity:0;transform:translate(-50%,-50%) scale(.2)}35%{opacity:1;transform:translate(-50%,-50%) scale(1)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.4)}}
@media(max-width:600px){.burst-glow{width:140px;height:140px}}
@media(prefers-reduced-motion:reduce){.burst-glow{display:none}}

/* Treehouse reveal, tuned after UX review: a slower, bigger landing; a ring glow after it lands */
.treehouse-celebrate .part-wrap{animation:part-build 1.4s cubic-bezier(.3,1.5,.5,1) .5s both}
@keyframes part-build{0%{opacity:0;transform:translateY(-160px) scale(0)}60%{opacity:1;transform:translateY(0) scale(1.12)}80%{transform:scale(.96)}100%{transform:scale(1)}}
.burst-glow{background:radial-gradient(circle,transparent 30%,#ffe28a99 45%,transparent 70%);mix-blend-mode:screen}
.sparkle-burst span{font-size:clamp(14px,2.2vw,28px)}
.sparkle-burst span:nth-child(3n+1){font-size:clamp(9px,1.2vw,14px)}
.treehouse-scene.treehouse-celebrate .treehouse-coco{animation:coco-treasure-hop 1050ms ease-in-out 1.4s both}
.new-part-tag{position:absolute;z-index:5;transform:translate(-50%,-140%);background:#f2c14e;color:#4a3a12;font:900 14px/1 Nunito,sans-serif;padding:6px 12px;border-radius:999px;box-shadow:0 3px 8px #6b4c1240;white-space:nowrap;pointer-events:none;animation:badge-pop .6s cubic-bezier(.2,.9,.3,1.5) 1.1s both}
.treehouse-built{text-align:center;max-width:1100px;margin:0 auto 22px}
.treehouse-built .eyebrow{margin-bottom:4px}
.treehouse-next-button{animation:note-pop .6s ease-out 1.8s both}
.treehouse-mission.just-unlocked{animation:none}

/* Treasure rays stay behind each treasure, not over the words */
.new-treasure{overflow:hidden}
.new-treasure>h3,.new-treasure>p{position:relative;z-index:1}
.is-celebrating .new-treasure>span::before{inset:-8%;background:repeating-conic-gradient(from 0deg,#ffe08a66 0 10deg,transparent 10deg 30deg);animation-duration:2.4s}
@media(prefers-reduced-motion:reduce){.new-part-tag,.treehouse-next-button{animation:none!important}}
