/* Loading states keep the existing image dimensions, corners and layout. */
img.ns-media-pending {
    background-color: #edf0f5;
    background-image: linear-gradient(100deg, transparent 30%, rgba(255,255,255,.75) 50%, transparent 70%);
    background-size: 200% 100%;
    animation: ns-media-shimmer 1.6s ease-in-out infinite;
}

/* Home cards keep a dark surface so their white text remains readable. */
.item-image.ns-media-pending::after {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-color: #28354a;
    background-image: linear-gradient(100deg, transparent 30%, rgba(255,255,255,.1) 50%, transparent 70%);
    background-size: 200% 100%;
    animation: ns-media-shimmer 1.6s ease-in-out infinite;
}
.item-image.ns-media-error { background-color: #28354a; }

html[dir="rtl"] img.ns-media-pending,
html[dir="rtl"] .item-image.ns-media-pending::after { animation-direction: reverse; }

@keyframes ns-media-shimmer {
    from { background-position: 100% 0; }
    to { background-position: -100% 0; }
}

@media (prefers-reduced-motion: reduce) {
    img.ns-media-pending,
    .item-image.ns-media-pending::after {
        animation: none;
        background-image: none;
    }
}