.lazy-image {
    opacity: 0;
    transition: opacity 0.5s ease, filter 0.5s ease, transform 0.4s ease;
    filter: blur(8px);
    transform: scale(1.02);
    background: #e5e5ea;
    will-change: opacity, filter, transform;
}

body.dark-theme .lazy-image {
    background: #1e1e23;
}

.lazy-image.lazy-loaded-complete {
    opacity: 1;
    filter: blur(0);
    transform: scale(1);
    will-change: auto;
}

.lazy-image.lazy-loaded-error {
    opacity: 0.3;
    filter: grayscale(1);
    transform: scale(1);
}

@media (prefers-reduced-motion: reduce) {
    .lazy-image,
    .lazy-image.lazy-loaded-complete {
        transition: none;
        filter: none;
        transform: none;
    }
}