/* Confetti container behind card */
#yw-sparks-layer {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    pointer-events: none !important;
    z-index: 5 !important;
    overflow: visible !important;
}

/* Confetti particles placed BEHIND the card, responsive in rem units */
.yw-confetti {
    position: absolute;
    top: calc(50% - 4.4rem); /* Origin locked to rocket medal */
    left: 50%;
    width: var(--yw-size);
    height: var(--yw-height);
    border-radius: var(--yw-radius, 2px);
    background: var(--yw-color);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
    z-index: 5 !important;
    pointer-events: none;
    opacity: 0;
    will-change: transform, opacity;
    transform: translate3d(calc(-50% + var(--yw-origin-x)), calc(-50% + var(--yw-origin-y)), 0) scale(.3) rotate(var(--yw-rotate));
    animation: yw-sparks-burst var(--yw-duration) cubic-bezier(.21, .61, .35, 1) var(--yw-delay) forwards;
}

/* Winning popup backdrop */
.WinningTip__C {
    position: fixed !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 99990 !important;
    background-color: rgba(0, 0, 0, 0.75) !important;
    top: 0 !important;
    left: 0 !important;
    animation: yw-winning-overlay-in 0.25s ease-out both;
}

.WinningTip__C[style*="display: none"],
.WinningTip__C[style*="display:none"] {
    display: none !important;
    animation: none !important;
}

/* Winning card is centered with translate(-50%, -50%) and in front of confetti (z-index: 10) */
.WinningTip__C-body {
    position: absolute !important;
    width: 7.73333rem !important;
    height: 10.93333rem !important;
    background-image: url(/assets/png/missningBg-c1f02bcd.webp) !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: cover !important;
    padding-top: 3.33333rem !important;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
    z-index: 10 !important;
    animation: yw-winning-popup-in 0.32s cubic-bezier(0.175, 0.885, 0.32, 1.275) both;
}

.WinningTip__C-body.isL {
    background-image: url(/assets/png/missningLBg-ca049a47.webp) !important;
}

/* Hard safety guard: never show sparks if loss element is present */
.WinningTip__C:has(.WinningTip__C-body.isL) .yw-confetti,
.WinningTip__C:has(.isLose) .yw-confetti {
    display: none !important;
    animation: none !important;
}

@keyframes yw-winning-overlay-in {
    from {
        background-color: rgba(0, 0, 0, 0);
    }
    to {
        background-color: rgba(0, 0, 0, 0.75);
    }
}

/* Popup emerges smoothly centered with translate(-50%, -50%) */
@keyframes yw-winning-popup-in {
    0% {
        opacity: 0;
        transform: translate(-50%, -50%) scale(0.3);
    }
    75% {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1.04);
    }
    100% {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1);
    }
}

/* Authentic party popper fountain burst with gravity float and fluttering sway */
@keyframes yw-sparks-burst {
    0% {
        opacity: 0;
        transform: translate3d(calc(-50% + var(--yw-origin-x)), calc(-50% + var(--yw-origin-y)), 0) scale(.2) rotate(var(--yw-rotate));
    }
    10% {
        opacity: 1;
        transform: translate3d(calc(-50% + var(--yw-origin-x)), calc(-50% + var(--yw-origin-y)), 0) scale(1.25) rotate(var(--yw-rotate));
    }
    30% {
        opacity: 1;
        transform: translate3d(calc(-50% + var(--yw-x-mid)), calc(-50% + var(--yw-y-mid)), 0) scale(1.0) rotate(calc(var(--yw-rotate) + 150deg));
    }
    65% {
        opacity: 0.95;
        transform: translate3d(calc(-50% + var(--yw-x-hold)), calc(-50% + var(--yw-y-hold)), 0) scale(0.9) rotate(calc(var(--yw-rotate) + 280deg));
    }
    100% {
        opacity: 0;
        transform: translate3d(calc(-50% + var(--yw-x-end)), calc(-50% + var(--yw-y-end)), 0) scale(0.3) rotate(calc(var(--yw-rotate) + 420deg));
    }
}

@media (prefers-reduced-motion: reduce) {
    .yw-confetti { display: none; }
}