.area-loading { width: 100%; }
.load-caption { padding: 8px 3px 12px; color: var(--muted); font-size: 11px; font-weight: 600; }
.load-shapes { display: grid; gap: 8px; }
.load-row { display: flex; align-items: center; gap: 12px; min-height: 68px; padding: 13px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface); }
.load-copy { display: grid; flex: 1; min-width: 0; gap: 9px; }
.load-shape { border-radius: 6px; background: color-mix(in srgb, var(--muted) 14%, var(--surface-soft)); animation: area-loading-pulse 1.6s ease-in-out infinite; }
.load-avatar { flex: 0 0 32px; width: 32px; height: 32px; border-radius: 10px; }
.load-avatar.is-small { flex-basis: 24px; width: 24px; height: 24px; }
.load-line { width: 76%; height: 10px; }
.load-line.is-short { width: 48%; height: 7px; opacity: .6; }
.load-group { overflow: hidden; border: 1px solid var(--line); border-radius: 15px; background: var(--surface); }
.load-group-heading { width: 38%; height: 10px; margin: 18px 15px; }
.load-group .load-row { min-height: 53px; border: 0; border-top: 1px solid var(--line); border-radius: 0; }
.load-group .load-avatar { width: 24px; height: 24px; flex-basis: 24px; }
.fixture-content:has(.fixture-groups[aria-busy="true"]) > .fixture-status { min-height: 0; margin-bottom: 12px; padding: 14px; }
.fixture-content:has(.fixture-groups[aria-busy="true"]) > .fixture-status .fixture-spinner { display: none; }
.fixture-groups[aria-busy="true"] { height: calc(100% - 80px); }
.is-media-pending { background: var(--surface-soft); animation: area-loading-pulse 1.6s ease-in-out infinite; }
.is-media-pending-image { opacity: 0; }
@keyframes area-loading-pulse { 0%, 100% { opacity: .45; } 50% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .load-shape, .is-media-pending { animation: none; } }
