/* Media frames already reserve their dimensions. These layers never move content. */
[data-loading-media] { position: relative; isolation: isolate; overflow: hidden; }
.founder-photo .founder-image { display: block; width: 100%; height: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: center; border-radius: inherit; }
.media-skeleton {
  position: absolute; inset: 0; z-index: 1; display: block; overflow: hidden;
  border-radius: inherit; background: #edf1f7; pointer-events: none;
  opacity: 0; visibility: hidden; transition: opacity 160ms ease-out, visibility 0s 160ms;
}
[data-media-state="loading"] > .media-skeleton,
[data-media-state="waiting"] > .media-skeleton,
[data-media-state="error"] > .media-skeleton { opacity: 1; visibility: visible; transition-delay: 0s; }
.media-skeleton-lines {
  position: absolute; inset: 12%; display: block; border-radius: 8px;
  background:
    linear-gradient(#d5deed, #d5deed) left top / 58% 8% no-repeat,
    linear-gradient(#e0e6f0, #e0e6f0) left 20% / 82% 5% no-repeat,
    linear-gradient(#e0e6f0, #e0e6f0) left 34% / 65% 5% no-repeat,
    linear-gradient(#dce4f0, #dce4f0) left bottom / 47% 46% no-repeat,
    linear-gradient(#e0e6f0, #e0e6f0) right bottom / 47% 46% no-repeat;
}
.media-skeleton::after {
  content: ""; position: absolute; inset: 0; transform: translateX(-110%);
  background: linear-gradient(100deg, transparent 20%, #ffffff80 50%, transparent 80%);
}
@keyframes stix-skeleton { to { transform: translateX(110%); } }
@media (prefers-reduced-motion: no-preference) {
  [data-media-state="loading"] > .media-skeleton::after { animation: stix-skeleton 1600ms ease-in-out 3; }
  [data-media-visible="false"] > .media-skeleton::after { animation-play-state: paused; }
}
[data-media-state="error"] > .media-skeleton .media-skeleton-lines { background: none; display: grid; place-items: center; }
[data-media-state="error"] > .media-skeleton .media-skeleton-lines::after { content: "Изображение недоступно"; font: 500 13px/1.6 Manrope, sans-serif; color: #616b7c; text-align: center; }
@media (prefers-reduced-motion: reduce) { .media-skeleton { transition: none; } }