/* Navigation feedback lives above the workspace without moving the sidebar or page layout. */
body.dashboard-navigation-pending::before {
    content: "";
    position: fixed;
    inset: 0 auto auto 0;
    z-index: 2000;
    width: 100%;
    height: 3px;
    background: hsl(var(--primary));
    box-shadow: 0 1px 8px hsl(var(--primary) / .3);
    transform-origin: left center;
    animation: dashboard-navigation-progress 12s cubic-bezier(.12, .55, .2, 1) 160ms both;
    pointer-events: none;
}

@keyframes dashboard-navigation-progress {
    0% { opacity: 0; transform: scaleX(.04); }
    1% { opacity: 1; transform: scaleX(.08); }
    100% { opacity: 1; transform: scaleX(.92); }
}

.shell #main-content.content-ready {
    animation: dashboard-content-enter 180ms ease-out both;
}

@keyframes dashboard-content-enter {
    from { opacity: .6; transform: translateY(4px); }
    to { opacity: 1; transform: translateY(0); }
}

.shell .dashboard-data-skeleton {
    display: grid;
    gap: 18px;
    width: 100%;
    opacity: 0;
    animation: dashboard-skeleton-reveal 1ms linear 180ms forwards;
}

@keyframes dashboard-skeleton-reveal { to { opacity: 1; } }

.shell .dashboard-skeleton-heading,
.shell .dashboard-skeleton-cards,
.shell .dashboard-skeleton-table {
    display: grid;
    gap: 12px;
}

.shell .dashboard-skeleton-heading {
    padding: 6px 0;
}

.shell .dashboard-skeleton-heading span,
.shell .dashboard-skeleton-cards span,
.shell .dashboard-skeleton-table span {
    position: relative;
    display: block;
    overflow: hidden;
    border-radius: var(--radius-md);
    background: hsl(var(--muted));
}

.shell .dashboard-skeleton-heading span:first-child { width: min(38%, 320px); height: 18px; }
.shell .dashboard-skeleton-heading span:last-child { width: min(60%, 490px); height: 12px; }
.shell .dashboard-skeleton-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.shell .dashboard-skeleton-cards span { height: 104px; border: 1px solid hsl(var(--border)); background: hsl(var(--card)); }
.shell .dashboard-skeleton-table { padding: 20px; border: 1px solid hsl(var(--border)); border-radius: var(--radius-xl); background: hsl(var(--card)); }
.shell .dashboard-skeleton-table span { height: 17px; }
.shell .dashboard-skeleton-table span:first-child { width: 34%; height: 20px; margin-bottom: 8px; }
.shell .dashboard-skeleton-table span:last-child { width: 72%; }

.shell .dashboard-skeleton-heading span::after,
.shell .dashboard-skeleton-cards span::after,
.shell .dashboard-skeleton-table span::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent, hsl(var(--foreground) / .045), transparent);
    transform: translateX(-100%);
    animation: dashboard-skeleton-shimmer 1.7s ease-in-out infinite;
}

@keyframes dashboard-skeleton-shimmer { to { transform: translateX(100%); } }

@media (max-width: 700px) {
    .shell .dashboard-skeleton-cards { grid-template-columns: 1fr; }
    .shell .dashboard-skeleton-cards span { height: 68px; }
}

@media (prefers-reduced-motion: reduce) {
    body.dashboard-navigation-pending::before { animation: none; transform: scaleX(.35); }
    .shell #main-content.content-ready { animation: none; }
    .shell .dashboard-data-skeleton { animation: none; opacity: 1; }
    .shell .dashboard-skeleton-heading span::after,
    .shell .dashboard-skeleton-cards span::after,
    .shell .dashboard-skeleton-table span::after { animation: none; }
}