@keyframes softEnter {
    from {
        opacity: 0;
        transform: translateY(8px);
    }

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

@keyframes modalBackdropIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes modalCardIn {
    from {
        opacity: 0;
        transform: translateY(8px) scale(0.98);
    }

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

@keyframes checkPop {
    0% {
        opacity: 0;
        transform: scale(0.82);
    }

    70% {
        transform: scale(1.06);
    }

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

.card,
.person-card,
.filter-tab,
.method-card,
.recent-payment,
.timeline-item,
.quick-action,
.suggested-edit-card,
.settings-card,
.report-card,
.method,
.suggested-amount {
    animation: softEnter 180ms ease-out both;
}

a,
button,
.filter-tab,
.bottom-item,
.person-card,
.quick-action,
.fab,
.method,
.suggested-amount,
.status-option {
    transition:
        transform 140ms ease,
        box-shadow 140ms ease,
        border-color 140ms ease,
        background-color 140ms ease,
        color 140ms ease,
        opacity 140ms ease;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible {
    outline: 3px solid rgba(79, 114, 187, 0.24);
    outline-offset: 2px;
}

.primary-form-button:hover,
.confirm-button:hover,
.register-payment:hover,
.primary-success-button:hover,
.settings-primary-button:hover,
.fab:hover {
    transform: translateY(-1px);
    box-shadow: 0 14px 26px rgba(44, 87, 154, 0.24);
}

.secondary-success-button:hover,
.settings-secondary-button:hover,
.payment-secondary-button:hover,
.load-more-link:hover,
.suggested-amount:hover,
.method:hover,
.quick-action:hover,
.filter-tab:hover,
.bottom-item:hover {
    transform: translateY(-1px);
}

.person-card:hover {
    background: #fafcff;
}

.filter-tab:hover,
.bottom-item:hover {
    color: var(--primary);
}

.suggested-amount:hover,
.method:hover {
    border-color: var(--primary);
    background: #f5f8ff;
}

a:active,
button:active,
.filter-tab:active,
.bottom-item:active,
.person-card:active,
.quick-action:active,
.fab:active,
.method:active,
.suggested-amount:active,
.status-option:active {
    transform: scale(0.985);
}

.modal-overlay:not([hidden]) {
    animation: modalBackdropIn 140ms ease-out both;
}

.modal-overlay:not([hidden]) .modal-card {
    animation: modalCardIn 180ms ease-out both;
}

.success-card {
    animation: softEnter 220ms ease-out both;
}

.success-check {
    animation: checkPop 260ms ease-out both;
}

@media (prefers-reduced-motion: reduce) {
    * {
        animation: none !important;
        transition: none !important;
    }
}