/* Global, DOM-generated loading overlay. It never participates in page layout. */
#site-skeleton {
    position: fixed;
    inset: 0;
    z-index: 2147483647;
    overflow: hidden;
    pointer-events: none;
    background: #fff;
    opacity: 1;
    transition: opacity 360ms ease;
}

#site-skeleton.is-leaving { opacity: 0; }

.site-skeleton-block {
    position: absolute;
    box-sizing: border-box;
    min-width: 2px;
    min-height: 2px;
    border-radius: 6px;
    background: linear-gradient(90deg, #e7eaee 20%, #f5f6f8 50%, #e7eaee 80%);
    background-size: 200% 100%;
    animation: site-skeleton-shimmer 1.35s linear infinite;
}

.site-skeleton-image { border-radius: 8px; }
.site-skeleton-avatar { border-radius: 50%; }
.site-skeleton-button { border-radius: 999px; }
.site-skeleton-card { border-radius: 10px; opacity: .55; }

@keyframes site-skeleton-shimmer {
    from { background-position: 200% 0; }
    to { background-position: -200% 0; }
}

@media (prefers-reduced-motion: reduce) {
    .site-skeleton-block { animation: none; }
    #site-skeleton { transition: none; }
}