img.image-load-managed {
    background-color: rgba(148, 170, 165, .12);
    background-image: linear-gradient(110deg, rgba(255, 255, 255, .04) 8%, rgba(255, 255, 255, .16) 18%, rgba(255, 255, 255, .04) 33%);
    background-size: 220% 100%;
    transition: filter .24s ease, opacity .24s ease, transform .24s ease;
}

img.image-load-managed.is-image-loading {
    animation: image-loading-shimmer 1.1s linear infinite;
    filter: blur(8px);
    opacity: .72;
    transform: scale(1.01);
}

img.image-load-managed.is-image-loaded {
    background-color: transparent;
    background-image: none;
    filter: none;
    opacity: 1;
    transform: none;
}

img.image-load-managed.is-image-error {
    animation: none;
    background-color: rgba(220, 53, 69, .12);
    background-image: none;
    filter: grayscale(1);
    opacity: .65;
    transform: none;
}

@keyframes image-loading-shimmer {
    0% { background-position: 220% 0; }
    100% { background-position: -220% 0; }
}

@media (prefers-reduced-motion: reduce) {
    img.image-load-managed,
    img.image-load-managed.is-image-loading {
        animation: none;
        transition: none;
        transform: none;
    }
}
