img.media-pending { opacity: 0 !important; }
.media-frame { position: relative; display: block; overflow: hidden; background: #f3f3f3; }
.media-frame img { transition: opacity .2s ease; }
.media-status { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 12px; font-size: 13px; color: #777; pointer-events: none; }
.media-loading .media-status::before { content: ''; width: 26px; height: 26px; border: 2px solid #d5d5d5; border-top-color: #555; border-radius: 50%; animation: media-spin .8s linear infinite; }
.media-error .media-status { pointer-events: auto; }
.media-status button { border: 1px solid #ccc; border-radius: 4px; padding: 10px 14px; color: #555; background: #fff; cursor: pointer; font: inherit; }
.client-graphic-card > .media-frame { width: 100%; height: 100%; min-width: 0; }
.client-graphic-card > .media-frame > img { display: block; width: 100%; height: 100%; object-fit: cover; }
.brand-news-image.media-frame { width: 100%; }
.news-content figure.media-frame > img { display: block; width: 100%; height: auto; }
@keyframes media-spin { to { transform: rotate(360deg); } }
@media(prefers-reduced-motion: reduce) { .media-frame img { transition: none; } .media-loading .media-status::before { animation: none; } }