/* Shared, non-blocking navigation feedback; no content is hidden without JS. */
.page-loading[hidden] { display: none !important; }
.page-loading [hidden], #page-content[hidden] { display: none !important; }
#page-content { display: contents; }
.skeleton-metrics, .skeleton-charts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; margin-bottom: 24px; }
.skeleton-charts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.skeleton-card { min-width: 0; padding: 24px; border: 1px solid #dfd8c8; border-radius: 16px; }
.skeleton-value { width: 45%; height: 38px; }
.skeleton-chart { height: 220px; }
.skeleton-filters { display: grid; grid-template-columns: 1fr 110px; gap: 20px; margin-bottom: 24px; }
.skeleton-filters > span { height: 44px; }
.skeleton-row { display: grid; grid-template-columns: 44px 2fr 1fr 1fr; gap: 20px; align-items: center; padding: 20px 0; border-top: 1px solid #dfd8c8; }
.skeleton-row .loading-skeleton-line { margin: 8px 0; }
.skeleton-avatar { width: 44px; height: 44px; border-radius: 50% !important; }
.skeleton-block { display: block; }
.page-loading {
    position: static; width: 100%; min-width: 0; grid-column: 1 / -1;
    box-sizing: border-box; padding: 0; color: #24231f;
}
.public-loading-region > .page-loading { max-width: 1200px; margin: 0 auto; padding: 32px 20px; }
.page-loading.is-slow { margin-bottom: 20px; }
.page-loading-heading { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.page-loading-heading p { flex: 1; margin: 0; font: 600 14px/1.5 Arial, sans-serif; }
.page-loading-heading button { pointer-events: auto; flex: none; width: 36px; height: 36px; border: 1px solid #dfd8c8; border-radius: 8px; background: transparent; color: inherit; font-size: 22px; cursor: pointer; }
.page-loading-heading button:focus-visible { outline: 2px solid #947516; outline-offset: 3px; }
.loading-skeleton { --skeleton-base: #ebe7de; --skeleton-highlight: #faf8f3; }
.loading-skeleton-line, .loading-skeleton-cards > span, .skeleton-block {
    display: block; border-radius: 6px; margin-bottom: 12px;
    background: linear-gradient(100deg, var(--skeleton-base) 25%, var(--skeleton-highlight) 45%, var(--skeleton-base) 65%);
    background-size: 220% 100%; animation: loading-shimmer 1.6s linear infinite;
}
.loading-skeleton-line.short { width: 55%; }
.loading-skeleton-line { height: 12px; }
.loading-skeleton-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.loading-skeleton-cards > span { height: 65px; }
.page-loading.is-slow .loading-skeleton { display: none; }
.rewards-result > .loading-skeleton { padding: 18px; border: 1px solid #dfd8c8; border-radius: 10px; }
[data-theme="dark"] .page-loading { color: #f6f3eb; }
[data-theme="dark"] .page-loading .loading-skeleton { --skeleton-base: #38362f; --skeleton-highlight: #48453b; }
[data-theme="dark"] .skeleton-card, [data-theme="dark"] .skeleton-row { border-color: #48453b; }
@media (max-width: 700px) {
    .skeleton-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
    .skeleton-charts { grid-template-columns: 1fr; }
    .skeleton-card { padding: 16px; }
    .skeleton-row { grid-template-columns: 36px minmax(0, 1fr); gap: 12px; }
    .skeleton-row > .loading-skeleton-line { display: none; }
    .skeleton-avatar { width: 36px; height: 36px; }
}
@keyframes loading-shimmer { from { background-position: 100% 0; } to { background-position: -100% 0; } }
@media (prefers-reduced-motion: reduce) {
    .loading-skeleton-line, .loading-skeleton-cards > span, .skeleton-block { animation: none; }
}
