/* A transitional preview only; the actual dashboard remains unchanged. */
.loading-dialog {
  position: fixed;
  inset: 0;
  margin: 0;
  padding: 0;
  width: 100%;
  max-width: none;
  height: 100vh;
  height: 100svh;
  max-height: none;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  border: 0;
  background: #fff;
  color: #1d2d3e;
}
.loading-dialog::backdrop { background: #fff; }
.loading-dialog * { box-sizing: border-box; }
.loading-header {
  min-height: 80px;
  padding: 18px 24px;
  display: flex;
  align-items: center;
  gap: 24px;
  border-bottom: 1px solid #e7ecf1;
}
.loading-brand { width: 140px; height: 32px; flex: none; }
.loading-message { margin-left: auto; }
.loading-message h2 { margin: 0; font-size: 14px; line-height: 1.5; font-weight: 600; }
.loading-message p { margin: 3px 0 0; color: #67728a; font-size: 12px; line-height: 1.5; }
.loading-tabs { display: flex; gap: 24px; padding: 16px 24px; border-bottom: 1px solid #e7ecf1; }
.loading-tabs .skeleton { flex: 1; max-width: 88px; height: 13px; min-width: 0; }
.loading-body { max-width: 1680px; margin-inline: auto; padding: 22px 24px; }
.loading-kpis { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; margin-bottom: 16px; }
.skeleton-card { min-width: 0; padding: 18px; border: 1px solid #e3e9ef; border-radius: 8px; background: #fff; }
.skeleton {
  display: block;
  position: relative;
  overflow: hidden;
  background: #e9edf2;
  border-radius: 4px;
}
.skeleton::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg,transparent,rgba(255,255,255,.65),transparent);
  transform: translateX(-100%);
  animation: skeleton-shimmer 1.6s ease-in-out infinite;
}
.skeleton-label { width: 70%; height: 11px; margin-bottom: 14px; }
.skeleton-value { width: 82%; max-width: 160px; height: 28px; margin-bottom: 12px; }
.skeleton-detail { width: 54%; height: 10px; }
.loading-grid { display: grid; grid-template-columns: minmax(0,1fr) 336px; gap: 16px; }
.loading-primary { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.skeleton-title { width: 48%; max-width: 190px; height: 15px; margin-bottom: 16px; }
.skeleton-chart { height: 224px; padding: 18px 0 0; display: flex; align-items: flex-end; gap: 12px; border-bottom: 1px solid #e3e9ef; }
.skeleton-chart .skeleton { flex: 1; min-width: 0; border-radius: 4px 4px 0 0; }
.skeleton-axis { display: flex; justify-content: space-between; gap: 12px; margin-top: 12px; }
.skeleton-axis .skeleton { width: 10%; height: 9px; }
.skeleton-row { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 16px; padding: 12px 0; border-bottom: 1px solid #edf0f3; }
.skeleton-row:last-child { border: 0; }
.skeleton-row .skeleton { height: 11px; min-width: 0; }
.loading-aside { padding: 0; overflow: hidden; }
.skeleton-section { padding: 18px; border-bottom: 1px solid #e7ecf1; }
.skeleton-section:last-child { border: 0; }
.skeleton-line { height: 11px; margin-top: 12px; }
.skeleton-line.short { width: 68%; }
.skeleton-control { height: 8px; margin: 22px 0; }
.skeleton-ring { width: 76px; height: 76px; border-radius: 50%; margin-top: 20px; }
.enter-button[aria-disabled="true"] { pointer-events: none; }
@keyframes skeleton-shimmer { to { transform: translateX(100%); } }
@media (max-width:1199px) {
  .loading-grid { grid-template-columns: minmax(0,1fr); }
  .loading-aside { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width:760px) {
  .loading-header { display: block; padding: 16px; }
  .loading-brand { width: 112px; height: 28px; }
  .loading-message { margin: 12px 0 0; }
  .loading-tabs { padding: 14px 16px; gap: 18px; }
  .loading-body { padding: 16px 12px; }
  .loading-kpis { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  .skeleton-card { padding: 14px; }
  .loading-aside { display: block; padding: 0; }
  .skeleton-chart { height: 190px; gap: 8px; }
  .skeleton-row { gap: 10px; }
  .skeleton-section { padding: 16px; }
}
@media (prefers-reduced-motion:reduce) { .skeleton::after { animation: none; display: none; } }