/* ============================================================
   剣・マールのドロップアニメーション
   ============================================================ */

/* 剣のドロップアニメーション */
.sword-drop-img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 70%;
    height: 70%;
    max-width: 70%;
    max-height: 70%;
    object-fit: contain;
    transform-origin: center center;
    filter: drop-shadow(0 0 2px rgba(255, 215, 0, 1))drop-shadow(0 0 4px rgba(255, 215, 0, 0.8))drop-shadow(0 0 6px rgba(255, 215, 0, 0.6));
    animation: sword-appear 0.5s ease-out;
    z-index: 5;
}

@keyframes sword-appear {
    0% {
        opacity: 0;
        transform: scale(0.5);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }
}

/* マールドロップアニメーション */
.malle-drop-img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 55%;
    height: 55%;
    max-width: 55%;
    max-height: 55%;
    object-fit: contain;
    filter: drop-shadow(0 0 4px rgba(255, 215, 0, 1)) drop-shadow(0 0 10px rgba(255, 215, 0, 0.8)) drop-shadow(0 0 20px rgba(255, 215, 0, 0.5));
    animation: malle-appear 0.5s ease-out;
    z-index: 5;
}

@keyframes malle-appear {
    0% {
        opacity: 0;
        transform: scale(0.3) translateY(30px);
    }

    60% {
        opacity: 1;
        transform: scale(1.1) translateY(-10px);
    }

    100% {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}