.playroom-celebration,.playroom-sparkle-trail{position:fixed;inset:0;z-index:1100;overflow:hidden;pointer-events:none;contain:strict}
.fx-star-crown{position:absolute;top:var(--fx-y);left:var(--fx-x);transform:translate(-50%,-50%);color:#d8b86f;font-family:Georgia,serif;font-size:32px;letter-spacing:8px;text-shadow:0 2px 0 #fff6,0 0 22px #f2d98a55;animation:playroom-crown 1.2s cubic-bezier(.2,.7,.2,1) both}
.fx-confetti{position:absolute;top:var(--fx-y);left:var(--fx-x);display:block;width:6px;height:10px;border-radius:2px;background:var(--fx-color);animation:playroom-confetti 1.2s var(--fx-delay) cubic-bezier(.2,.6,.3,1) both;will-change:transform,opacity}
.fx-confetti.is-spark{width:7px;height:7px;border-radius:2px;clip-path:polygon(50% 0,62% 36%,100% 50%,62% 64%,50% 100%,38% 64%,0 50%,38% 36%)}
.fx-trail-spark{position:absolute;display:grid;place-items:center;width:var(--spark-size);height:var(--spark-size);border-radius:50%;color:var(--spark-color);background:var(--spark-color);font-size:14px;line-height:1;box-shadow:0 0 9px color-mix(in srgb,var(--spark-color) 45%,transparent);transform:translate(-50%,-50%);animation:playroom-trail .55s var(--spark-delay) ease-out both}
.fx-trail-spark:nth-child(3n+1){background:none;box-shadow:none}
.playroom-celebration.is-quiet .fx-star-crown{animation:none;font-size:23px;opacity:.75}
@keyframes playroom-crown{0%{opacity:0;transform:translate(-50%,10px) scale(.7)}25%{opacity:1;transform:translate(-50%,-50%) scale(1.08)}55%{opacity:1;transform:translate(-50%,-65%) scale(1)}100%{opacity:0;transform:translate(-50%,-100%) scale(.95)}}
@keyframes playroom-confetti{0%{opacity:0;transform:translate(0,0) scale(.5) rotate(0)}15%{opacity:1}55%{opacity:1;transform:translate(var(--fx-dx),var(--fx-dy)) rotate(var(--fx-rotate))}100%{opacity:0;transform:translate(var(--fx-drift),var(--fx-fall)) rotate(var(--fx-rotate)) scale(.65)}}
@keyframes playroom-trail{0%{opacity:0;transform:translate(-50%,-50%) scale(.3)}20%{opacity:.8;transform:translate(-50%,-50%) scale(1.1)}100%{opacity:0;transform:translate(-50%,-75%) scale(.25)}}
html[data-theme=dark] .fx-star-crown,html[data-theme=aurora] .fx-star-crown{color:#f0d78f;text-shadow:0 0 20px #d9c98655}
@media(max-width:600px){.fx-star-crown{font-size:27px;letter-spacing:6px}.fx-confetti{width:5px;height:8px}}
@media(prefers-reduced-motion:reduce){.playroom-celebration *, .playroom-sparkle-trail *{animation:none!important}.playroom-sparkle-trail{display:none}.playroom-celebration .fx-star-crown{opacity:.7}}