/* In-flow content placeholders, using theme tokens. No global overlay. */
.md-loading-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.md-skeleton { display: grid; gap: 1rem; width: 100%; min-width: 0; box-sizing: border-box; padding: .75rem 0; }
.md-skeleton-row { display: flex; align-items: center; gap: .85rem; min-height: 2.5rem; }
.md-skeleton-copy { display: grid; flex: 1; min-width: 0; gap: .6rem; }
.md-skeleton-shape { display: block; height: .75rem; border-radius: .3rem; background: var(--md-line, #dce3e9); animation: md-skeleton-pulse 1.6s ease-in-out infinite; }
.md-skeleton-copy > :first-child { width: 72%; }
.md-skeleton-copy > :last-child { width: 48%; height: .55rem; }
.md-skeleton-row:nth-child(even) .md-skeleton-copy > :first-child { width: 88%; }
.md-skeleton-avatar { width: 2.5rem; height: 2.5rem; flex: 0 0 2.5rem; border-radius: .55rem; }
.md-skeleton-cell { width: 18%; }
.md-skeleton-heading { margin-bottom: .6rem; }
.md-skeleton-heading > span { width: 45%; height: 1.25rem; }
.md-content-state[data-state="loading"] { display: block; text-align: start; padding: 1rem; border: 0; background: transparent; box-shadow: none; }
.md-content-state[data-state="loading"]::before { content: none; }
/* Existing content stays in place while its own region refreshes. */
.md-loading-region { animation: md-region-pulse 1.6s ease-in-out infinite; }
/* Avoid multiplying the pulse when nested requests concern the same content. */
.md-loading-region .md-loading-region, .md-loading-region:has(.md-skeleton) { animation: none; }
@keyframes md-skeleton-pulse { 0%, 100% { opacity: .45; } 50% { opacity: .95; } }
@keyframes md-region-pulse { 0%, 100% { opacity: .6; } 50% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .md-skeleton-shape, .md-loading-region { animation: none; } }