#hanacon-petals-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 0;
    pointer-events: none;
    z-index: 2147483000;
    overflow: hidden;
}

.hanacon-petal {
    position: absolute;
    top: 0;
    background: linear-gradient(135deg, #ffffff, var(--hana-pink));
    border-radius: 50% 0 50% 0;
    opacity: 0.8;
    box-shadow: 0 0 5px rgba(255, 183, 197, 0.5);
    animation-name: hanacon-fall, hanacon-sway;
    animation-timing-function: linear, ease-in-out;
    animation-iteration-count: infinite, infinite;
    animation-direction: normal, alternate;
}

@keyframes hanacon-fall {
    0% {
        margin-top: 0;
    }

    100% {
        margin-top: var(--hanacon-fall-distance, 124vh);
    }
}

@keyframes hanacon-sway {
    0% {
        transform: translateX(0) rotate(0deg);
    }

    100% {
        transform: translateX(2vw) rotate(45deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .hanacon-petal {
        animation: none;
        opacity: 0.35;
    }
}
