/* css/hunter/animations.css */


/* =========================
   Hunter Animations
========================= */

@keyframes hunterIdleFloat {
    0% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-3px);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes hunterPulse {
    0% {
        transform: scale(1);
    }

    45% {
        transform: scale(1.012);
    }

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

@keyframes hunterCoinFloat {
    0% {
        opacity: 0;
        transform: translate(-50%, 0) scale(.8);
    }

    15% {
        opacity: 1;
    }

    100% {
        opacity: 0;
        transform:
            translate(calc(-50% + var(--coin-x, 0px)),
                calc(-80px + var(--coin-y, 0px))) scale(1.12);
    }
}

@keyframes hunterToastSlide {
    0% {
        opacity: 0;
        transform: translate(-50%, 12px) scale(.96);
    }

    12% {
        opacity: 1;
        transform: translate(-50%, 0) scale(1);
    }

    82% {
        opacity: 1;
        transform: translate(-50%, 0) scale(1);
    }

    100% {
        opacity: 0;
        transform: translate(-50%, -8px) scale(.98);
    }
}

@keyframes petWiggle {
    0% {
        transform: rotate(0deg) translateY(0);
    }

    25% {
        transform: rotate(-2deg) translateY(-1px);
    }

    50% {
        transform: rotate(2deg) translateY(0);
    }

    75% {
        transform: rotate(-1deg) translateY(-1px);
    }

    100% {
        transform: rotate(0deg) translateY(0);
    }
}

@keyframes hunterDialoguePop {
    0% {
        transform: scale(1);
    }

    45% {
        transform: scale(1.012);
    }

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

@keyframes hunterGameViewIn {
    from {
        opacity: 0;
        transform: translateY(4px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.hunter-dialogue-box.dialogue-pop {
    animation: hunterDialoguePop .28s ease;
}

.hunter-dialogue-avatar,
.hunter-pet-image {
    animation: petWiggle 3.4s ease-in-out infinite;
    transform-origin: bottom center;
}

.hunter-character-card.selected .hunter-character-image,
.hunter-player-avatar {
    animation: hunterIdleFloat 2.8s ease-in-out infinite;
}

.hunter-player-card.checkin-pulse {
    animation: hunterPulse .34s ease;
}

.hunter-exp-bar.exp-burst {
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .72),
        0 0 14px rgba(250, 204, 21, .9);
}

.hunter-floating-coin {
    position: fixed;
    z-index: 9999;

    left: var(--coin-left);
    top: var(--coin-top);

    pointer-events: none;

    color: #92400e;
    font-size: 18px;
    font-weight: 900;

    text-shadow:
        0 1px 0 #ffffff,
        0 2px 6px rgba(15, 23, 42, .2);

    animation: hunterCoinFloat .9s ease-out forwards;
}

.hunter-toast {
    position: fixed;
    z-index: 10000;

    left: 50%;
    bottom: calc(108px + env(safe-area-inset-bottom, 0px));

    min-width: 220px;
    max-width: calc(100vw - 32px);

    padding: 12px 16px;
    border-radius: 999px;

    background: #111827;
    color: #facc15;

    border: 2px solid #f59e0b;

    font-size: 14px;
    font-weight: 900;
    text-align: center;

    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .18),
        0 4px 0 rgba(0, 0, 0, .35),
        0 12px 24px rgba(15, 23, 42, .22);

    animation: hunterToastSlide 2.2s ease forwards;
}


@keyframes hunterFloatingExp {
    0% {
        opacity: 0;
        transform: translate(-50%, 6px) scale(.9);
    }

    15% {
        opacity: 1;
        transform: translate(-50%, 0) scale(1);
    }

    100% {
        opacity: 0;
        transform: translate(-50%, -26px) scale(1.06);
    }
}

.hunter-floating-exp {
    position: fixed;
    z-index: 9999;

    left: var(--exp-left);
    top: var(--exp-top);

    pointer-events: none;

    color: #f59e0b;
    font-size: 13px;
    font-weight: 900;

    text-shadow:
        0 1px 0 #ffffff,
        0 2px 6px rgba(15, 23, 42, .18);

    animation: hunterFloatingExp .9s ease-out forwards;
}

@media (prefers-reduced-motion: reduce) {

    .hunter-character-card.selected .hunter-character-image,
    .hunter-player-avatar,
    .hunter-dialogue-avatar,
    .hunter-pet-image,
    .hunter-dialogue-box.dialogue-pop,
    .hunter-player-card.checkin-pulse,
    .hunter-floating-coin,
    .hunter-toast,
    .hunter-game-view {
        animation: none;
    }
}

@keyframes hunterChestPop {
    0% {
        transform: translateY(0) scale(1);
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, .9),
            0 2px 0 rgba(217, 119, 6, .22),
            0 8px 18px rgba(15, 23, 42, .06);
    }

    28% {
        transform: translateY(-2px) scale(1.012);
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, .95),
            0 0 0 4px rgba(250, 204, 21, .16),
            0 12px 24px rgba(245, 158, 11, .18);
    }

    60% {
        transform: translateY(1px) scale(.998);
    }

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