/* Full-screen confetti rain from scripts/confetti.js. The page-wide effect
   opens above the header as a popover. Inside a modal it uses the dialog's
   existing top layer. ~180
   particles fall from above the top edge to past the bottom edge over
   1.4-2.2s each, staggered by up to 800ms, with a horizontal sway and
   randomized rotation for a natural-looking drift. Suppressed under
   prefers-reduced-motion. */
.s9bn-confetti-rain {
    position: fixed;
    inset: 0;
    pointer-events: none;
    overflow: hidden;
    z-index: 2147483646;
}
.s9bn-confetti-rain[popover] {
    width: auto;
    height: auto;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
}
.s9bn-confetti-rain__p {
    position: absolute;
    top: -24px;
    left: var(--x, 50%);
    width: var(--w, 8px);
    height: var(--h, 8px);
    will-change: transform, opacity;
    animation: s9bn-confetti-rain-fall var(--dur, 1.8s) cubic-bezier(.45, .1, .65, 1) forwards;
    animation-delay: var(--d, 0ms);
    opacity: 0;
}
@keyframes s9bn-confetti-rain-fall {
    0%   { transform: translate3d(-50%, 0, 0) rotate(0deg); opacity: 0; }
    6%   { opacity: 1; }
    92%  { opacity: 1; }
    100% { transform: translate3d(calc(-50% + var(--sway, 0px)), calc(100vh + 60px), 0) rotate(var(--rot, 0deg)); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
    .s9bn-confetti-rain { display: none; }
}