@keyframes show-from-top {
    0% {
        opacity: 0;
        transform: translateY(calc(-1 * var(--animation-offset)));
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes show-from-left {
    0% {
        opacity: 0;
        transform: translateX(calc(-1 * var(--animation-offset)));
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes show-from-right {
    0% {
        opacity: 0;
        transform: translateX(var(--animation-offset));
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes show-from-bottom {
    0% {
        opacity: 0;
        transform: translateY(var(--animation-offset));
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fade-in {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes rotate {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

@keyframes pulse {
    30% {
        opacity: 1;
    }
    50% {
        opacity: 0.6;
    }
    70% {
        opacity: 1;
    }
}

@keyframes show-dropdown {
    0% {
        opacity: 0;
        transform: translateY(-2px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes new-stamp-is-here {
    0% {
        opacity: 0;
        transform: scale(0.1);
    }
    5% {
        opacity: 1;
        transform: scale(0.2);
    }
    100% {
        opacity: 0;
        transform: scale(1.4);
    }
}

@keyframes stamp-in {
    0% {
        opacity: 0;
        transform: scale(1.3);
    }
    50% {
        opacity: 1;
        transform: scale(0.95);
    }
    70% {
        opacity: 1;
        transform: scale(1.1);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes wiggle {
    0%   { transform: rotate(0); }
    8%   { transform: rotate(18deg); }
    16%  { transform: rotate(-16deg); }
    24%  { transform: rotate(14deg); }
    32%  { transform: rotate(-12deg); }
    40%  { transform: rotate(10deg); }
    48%  { transform: rotate(-8deg); }
    56%  { transform: rotate(6deg); }
    64%  { transform: rotate(-4deg); }
    72%  { transform: rotate(3deg); }
    80%  { transform: rotate(-2deg); }
    90%  { transform: rotate(1deg); }
    100% { transform: rotate(0); }
}
