@keyframes fadeIn {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes scaleIn {
    from { opacity: 0; transform: scale(0.98); }
    to { opacity: 1; transform: scale(1); }
}

@keyframes gentlePulse {
    0%, 100% { box-shadow: var(--shadow-solid); }
    50% { box-shadow: var(--shadow-solid-hover); }
}

.fade-in {
    animation: fadeIn 0.28s ease-out forwards;
}

.scale-in {
    animation: scaleIn 0.22s ease-out forwards;
}

.shadow-glow {
    animation: gentlePulse 3.4s ease-in-out infinite;
}

.task-item {
    transition: transform 0.2s ease, background 0.2s ease, border-color 0.2s ease;
}