/* Hero Vired Reporting Portal — tokens.css (v2 design system)
   Light is default. Dark via [data-theme="dark"] or prefers-color-scheme when [data-theme="auto"].
   Department accent via [data-dept="cs|delivery|ls|faculty|sales|admin|portal"] on <body>. */
:root, [data-theme="light"] {
  --hv-bg-page: #F6F7FB;
  --hv-bg-surface: #FFFFFF;
  --hv-bg-surface-2: #F1F2F8;
  --hv-bg-sunken: #EEF0F6;
  --hv-bg-overlay: rgba(22,24,29,.45);
  --hv-border: #E6E8EF;
  --hv-border-strong: #C9CBD6;
  --hv-text: #16181D;
  --hv-text-2: #2A2D36;
  --hv-text-muted: #6B7080;
  --hv-text-faint: #8A8FA0;
  --hv-text-inverse: #FFFFFF;
  --hv-brand-50: #EEEDFC;
  --hv-brand-100: #DDDAF9;
  --hv-brand-200: #C7C2F5;
  --hv-brand-300: #A49CEF;
  --hv-brand-400: #7B70E8;
  --hv-brand-500: #5547E0;
  --hv-brand-600: #3F33B8;
  --hv-brand-700: #2E2590;
  --hv-brand-800: #1B1740;
  --hv-brand-900: #0F0C29;
  --hv-orange-400: #F7931E;
  --hv-orange-500: #F0862E;
  --hv-orange-600: #FF6B35;
  --hv-ok: #15803D;
  --hv-ok-bg: #E8F7EE;
  --hv-warn: #B45309;
  --hv-warn-bg: #FEF3E2;
  --hv-bad: #B91C1C;
  --hv-bad-bg: #FDECEC;
  --hv-info: #1D4ED8;
  --hv-info-bg: #E6EEFC;
  --hv-na: #8A8FA0;
  --hv-na-bg: repeating-linear-gradient(135deg,#F6F7FB 0 6px,#FFFFFF 6px 12px);
  --hv-na-border: #C9CBD6;
  --hv-viz-1: #5547E0;
  --hv-viz-2: #0E9F8E;
  --hv-viz-3: #F0862E;
  --hv-viz-4: #D64D8E;
  --hv-viz-5: #2563EB;
  --hv-viz-6: #8A8FA0;
  --hv-viz-7: #A16207;
  --hv-viz-8: #7C3AED;
  /* Chart gradients: one hue pair per category (a = base, b = tip), ordered so that
     neighbouring slots differ in hue; 0 is the neutral for Unknown / Other.
     Sweep = the left-to-right colour run for time-based charts. */
  --hv-grad-0-a: #64748B;  --hv-grad-0-b: #CBD5E1;
  --hv-grad-1-a: #4F46E5;  --hv-grad-1-b: #A78BFA;
  --hv-grad-2-a: #EA580C;  --hv-grad-2-b: #FBBF24;
  --hv-grad-3-a: #0D9488;  --hv-grad-3-b: #22D3EE;
  --hv-grad-4-a: #DB2777;  --hv-grad-4-b: #FB7185;
  --hv-grad-5-a: #1D4ED8;  --hv-grad-5-b: #38BDF8;
  --hv-grad-6-a: #CA8A04;  --hv-grad-6-b: #FDE047;
  --hv-grad-7-a: #15803D;  --hv-grad-7-b: #84CC16;
  --hv-grad-8-a: #9333EA;  --hv-grad-8-b: #F0ABFC;
  --hv-grad-9-a: #E11D48;  --hv-grad-9-b: #FB923C;
  --hv-grad-10-a: #0E7490; --hv-grad-10-b: #818CF8;
  --hv-sweep-1: #4F46E5; --hv-sweep-2: #0891B2; --hv-sweep-3: #10B981; --hv-sweep-4: #F59E0B; --hv-sweep-5: #EC4899;
  --hv-viz-ink: #16181D;
  --hv-shadow-xs: 0 1px 2px rgba(22,24,29,.05);
  --hv-shadow-sm: 0 1px 2px rgba(22,24,29,.06),0 2px 6px rgba(22,24,29,.04);
  --hv-shadow-md: 0 4px 14px rgba(22,24,29,.08);
  --hv-shadow-lg: 0 12px 32px rgba(22,24,29,.16);
  --hv-focus: 0 0 0 3px rgba(85,71,224,.35);
  --hv-gradient-brand: linear-gradient(135deg,#667EEA 0%,#764BA2 100%);
  --hv-gradient-dark: linear-gradient(135deg,#0F0C29 0%,#302B63 55%,#24243E 100%);
  --hv-gradient-active: linear-gradient(90deg,#FF6B35,#F7931E);
  --hv-font-display: 'Bricolage Grotesque', 'Inter', system-ui, sans-serif;
  --hv-font-sans: 'Inter', system-ui, -apple-system, Segoe UI, sans-serif;
  --hv-font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;
  --hv-text-xs: 11px; --hv-text-sm: 12px; --hv-text-base: 13px; --hv-text-md: 14px; --hv-text-lg: 16px;
  --hv-text-xl: 20px; --hv-text-2xl: 24px; --hv-text-3xl: 28px; --hv-text-4xl: 36px;
  --hv-space-1: 4px; --hv-space-2: 8px; --hv-space-3: 12px; --hv-space-4: 16px; --hv-space-5: 20px; --hv-space-6: 24px; --hv-space-8: 32px; --hv-space-10: 40px; --hv-space-12: 48px;
  --hv-radius-sm: 6px; --hv-radius-md: 8px; --hv-radius-lg: 12px; --hv-radius-xl: 16px; --hv-radius-pill: 999px;
  --hv-ease: cubic-bezier(.2,.8,.2,1); --hv-dur-fast: 120ms; --hv-dur: 200ms; --hv-dur-slow: 320ms;
  --hv-sidebar-w: 248px; --hv-topbar-h: 56px; --hv-touch: 44px;
  color-scheme: light;
}
[data-theme="dark"] {
  --hv-bg-page: #0F1017;
  --hv-bg-surface: #1A1D26;
  --hv-bg-surface-2: #222634;
  --hv-bg-sunken: #12141C;
  --hv-bg-overlay: rgba(0,0,0,.6);
  --hv-border: #262A3A;
  --hv-border-strong: #3A3F55;
  --hv-text: #F2F3F8;
  --hv-text-2: #D5D8E3;
  --hv-text-muted: #9398AB;
  --hv-text-faint: #6B7085;
  --hv-text-inverse: #16181D;
  --hv-brand-50: #1E1B3F;
  --hv-brand-100: #2A2560;
  --hv-brand-200: #3A3380;
  --hv-brand-300: #5A4FBF;
  --hv-brand-400: #7B70E8;
  --hv-brand-500: #8F85F0;
  --hv-brand-600: #A89FF5;
  --hv-brand-700: #C7C2F5;
  --hv-brand-800: #DDDAF9;
  --hv-brand-900: #EEEDFC;
  --hv-orange-400: #F7931E;
  --hv-orange-500: #F0862E;
  --hv-orange-600: #FF6B35;
  --hv-ok: #4ADE80;
  --hv-ok-bg: rgba(74,222,128,.14);
  --hv-warn: #FBBF24;
  --hv-warn-bg: rgba(251,191,36,.14);
  --hv-bad: #F87171;
  --hv-bad-bg: rgba(248,113,113,.14);
  --hv-info: #60A5FA;
  --hv-info-bg: rgba(96,165,250,.14);
  --hv-na: #8A8FA0;
  --hv-na-bg: repeating-linear-gradient(135deg,#171925 0 6px,#1E2130 6px 12px);
  --hv-na-border: #3A3F55;
  --hv-viz-1: #8F85F0;
  --hv-viz-2: #2DD4BF;
  --hv-viz-3: #FBA74A;
  --hv-viz-4: #F472B6;
  --hv-viz-5: #60A5FA;
  --hv-viz-6: #9398AB;
  --hv-viz-7: #FACC15;
  --hv-viz-8: #A78BFA;
  --hv-grad-0-a: #64748B;  --hv-grad-0-b: #94A3B8;
  --hv-grad-1-a: #818CF8;  --hv-grad-1-b: #C4B5FD;
  --hv-grad-2-a: #FB923C;  --hv-grad-2-b: #FDE68A;
  --hv-grad-3-a: #2DD4BF;  --hv-grad-3-b: #67E8F9;
  --hv-grad-4-a: #F472B6;  --hv-grad-4-b: #FDA4AF;
  --hv-grad-5-a: #60A5FA;  --hv-grad-5-b: #7DD3FC;
  --hv-grad-6-a: #FACC15;  --hv-grad-6-b: #FEF08A;
  --hv-grad-7-a: #4ADE80;  --hv-grad-7-b: #D9F99D;
  --hv-grad-8-a: #C084FC;  --hv-grad-8-b: #F5D0FE;
  --hv-grad-9-a: #FB7185;  --hv-grad-9-b: #FDBA74;
  --hv-grad-10-a: #22D3EE; --hv-grad-10-b: #A5B4FC;
  --hv-sweep-1: #818CF8; --hv-sweep-2: #22D3EE; --hv-sweep-3: #34D399; --hv-sweep-4: #FBBF24; --hv-sweep-5: #F472B6;
  --hv-viz-ink: #0F1117;
  --hv-shadow-xs: 0 1px 2px rgba(0,0,0,.3);
  --hv-shadow-sm: 0 1px 2px rgba(0,0,0,.35),0 2px 6px rgba(0,0,0,.25);
  --hv-shadow-md: 0 4px 14px rgba(0,0,0,.4);
  --hv-shadow-lg: 0 12px 32px rgba(0,0,0,.55);
  --hv-focus: 0 0 0 3px rgba(143,133,240,.45);
  --hv-gradient-brand: linear-gradient(135deg,#667EEA 0%,#764BA2 100%);
  --hv-gradient-dark: linear-gradient(135deg,#0F0C29 0%,#302B63 55%,#24243E 100%);
  --hv-gradient-active: linear-gradient(90deg,#FF6B35,#F7931E);
  color-scheme: dark;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]), [data-theme="auto"] {
    --hv-bg-page: #0F1017;
    --hv-bg-surface: #1A1D26;
    --hv-bg-surface-2: #222634;
    --hv-bg-sunken: #12141C;
    --hv-bg-overlay: rgba(0,0,0,.6);
    --hv-border: #262A3A;
    --hv-border-strong: #3A3F55;
    --hv-text: #F2F3F8;
    --hv-text-2: #D5D8E3;
    --hv-text-muted: #9398AB;
    --hv-text-faint: #6B7085;
    --hv-text-inverse: #16181D;
    --hv-brand-50: #1E1B3F;
    --hv-brand-100: #2A2560;
    --hv-brand-200: #3A3380;
    --hv-brand-300: #5A4FBF;
    --hv-brand-400: #7B70E8;
    --hv-brand-500: #8F85F0;
    --hv-brand-600: #A89FF5;
    --hv-brand-700: #C7C2F5;
    --hv-brand-800: #DDDAF9;
    --hv-brand-900: #EEEDFC;
    --hv-orange-400: #F7931E;
    --hv-orange-500: #F0862E;
    --hv-orange-600: #FF6B35;
    --hv-ok: #4ADE80;
    --hv-ok-bg: rgba(74,222,128,.14);
    --hv-warn: #FBBF24;
    --hv-warn-bg: rgba(251,191,36,.14);
    --hv-bad: #F87171;
    --hv-bad-bg: rgba(248,113,113,.14);
    --hv-info: #60A5FA;
    --hv-info-bg: rgba(96,165,250,.14);
    --hv-na: #8A8FA0;
    --hv-na-bg: repeating-linear-gradient(135deg,#171925 0 6px,#1E2130 6px 12px);
    --hv-na-border: #3A3F55;
    --hv-viz-1: #8F85F0;
    --hv-viz-2: #2DD4BF;
    --hv-viz-3: #FBA74A;
    --hv-viz-4: #F472B6;
    --hv-viz-5: #60A5FA;
    --hv-viz-6: #9398AB;
    --hv-viz-7: #FACC15;
    --hv-viz-8: #A78BFA;
    --hv-grad-0-a: #64748B;  --hv-grad-0-b: #94A3B8;
    --hv-grad-1-a: #818CF8;  --hv-grad-1-b: #C4B5FD;
    --hv-grad-2-a: #FB923C;  --hv-grad-2-b: #FDE68A;
    --hv-grad-3-a: #2DD4BF;  --hv-grad-3-b: #67E8F9;
    --hv-grad-4-a: #F472B6;  --hv-grad-4-b: #FDA4AF;
    --hv-grad-5-a: #60A5FA;  --hv-grad-5-b: #7DD3FC;
    --hv-grad-6-a: #FACC15;  --hv-grad-6-b: #FEF08A;
    --hv-grad-7-a: #4ADE80;  --hv-grad-7-b: #D9F99D;
    --hv-grad-8-a: #C084FC;  --hv-grad-8-b: #F5D0FE;
    --hv-grad-9-a: #FB7185;  --hv-grad-9-b: #FDBA74;
    --hv-grad-10-a: #22D3EE; --hv-grad-10-b: #A5B4FC;
    --hv-sweep-1: #818CF8; --hv-sweep-2: #22D3EE; --hv-sweep-3: #34D399; --hv-sweep-4: #FBBF24; --hv-sweep-5: #F472B6;
    --hv-viz-ink: #0F1117;
    --hv-shadow-xs: 0 1px 2px rgba(0,0,0,.3);
    --hv-shadow-sm: 0 1px 2px rgba(0,0,0,.35),0 2px 6px rgba(0,0,0,.25);
    --hv-shadow-md: 0 4px 14px rgba(0,0,0,.4);
    --hv-shadow-lg: 0 12px 32px rgba(0,0,0,.55);
    --hv-focus: 0 0 0 3px rgba(143,133,240,.45);
    --hv-gradient-brand: linear-gradient(135deg,#667EEA 0%,#764BA2 100%);
    --hv-gradient-dark: linear-gradient(135deg,#0F0C29 0%,#302B63 55%,#24243E 100%);
    --hv-gradient-active: linear-gradient(90deg,#FF6B35,#F7931E);
    color-scheme: dark;
  }
}
/* Department accents (light) */
[data-dept="cs"] { --hv-accent: #5547E0; --hv-accent-soft: #EEEDFC; --hv-accent-text: #3F33B8; }
[data-dept="delivery"] { --hv-accent: #0E9F8E; --hv-accent-soft: #E3F6F3; --hv-accent-text: #0B7A6D; }
[data-dept="ls"] { --hv-accent: #7C3AED; --hv-accent-soft: #F1EAFE; --hv-accent-text: #5B21B6; }
[data-dept="faculty"] { --hv-accent: #B45309; --hv-accent-soft: #FEF3E2; --hv-accent-text: #92400E; }
[data-dept="sales"] { --hv-accent: #15803D; --hv-accent-soft: #E8F7EE; --hv-accent-text: #166534; }
[data-dept="admin"] { --hv-accent: #475569; --hv-accent-soft: #EEF1F6; --hv-accent-text: #334155; }
[data-dept="portal"] { --hv-accent: #5547E0; --hv-accent-soft: #EEEDFC; --hv-accent-text: #3F33B8; }
/* Department accents (dark) */
[data-theme="dark"] [data-dept="cs"], [data-theme="dark"][data-dept="cs"] { --hv-accent: #8F85F0; --hv-accent-soft: #1E1B3F; --hv-accent-text: #C7C2F5; }
[data-theme="dark"] [data-dept="delivery"], [data-theme="dark"][data-dept="delivery"] { --hv-accent: #2DD4BF; --hv-accent-soft: #0F2A27; --hv-accent-text: #99F6E4; }
[data-theme="dark"] [data-dept="ls"], [data-theme="dark"][data-dept="ls"] { --hv-accent: #A78BFA; --hv-accent-soft: #231B3F; --hv-accent-text: #DDD6FE; }
[data-theme="dark"] [data-dept="faculty"], [data-theme="dark"][data-dept="faculty"] { --hv-accent: #FBBF24; --hv-accent-soft: #2E2210; --hv-accent-text: #FDE68A; }
[data-theme="dark"] [data-dept="sales"], [data-theme="dark"][data-dept="sales"] { --hv-accent: #4ADE80; --hv-accent-soft: #0F2A1A; --hv-accent-text: #BBF7D0; }
[data-theme="dark"] [data-dept="admin"], [data-theme="dark"][data-dept="admin"] { --hv-accent: #94A3B8; --hv-accent-soft: #1A2030; --hv-accent-text: #CBD5E1; }
[data-theme="dark"] [data-dept="portal"], [data-theme="dark"][data-dept="portal"] { --hv-accent: #8F85F0; --hv-accent-soft: #1E1B3F; --hv-accent-text: #C7C2F5; }
@media (prefers-color-scheme: dark) {
  [data-theme="auto"] [data-dept="cs"], [data-theme="auto"][data-dept="cs"] { --hv-accent: #8F85F0; --hv-accent-soft: #1E1B3F; --hv-accent-text: #C7C2F5; }
  [data-theme="auto"] [data-dept="delivery"], [data-theme="auto"][data-dept="delivery"] { --hv-accent: #2DD4BF; --hv-accent-soft: #0F2A27; --hv-accent-text: #99F6E4; }
  [data-theme="auto"] [data-dept="ls"], [data-theme="auto"][data-dept="ls"] { --hv-accent: #A78BFA; --hv-accent-soft: #231B3F; --hv-accent-text: #DDD6FE; }
  [data-theme="auto"] [data-dept="faculty"], [data-theme="auto"][data-dept="faculty"] { --hv-accent: #FBBF24; --hv-accent-soft: #2E2210; --hv-accent-text: #FDE68A; }
  [data-theme="auto"] [data-dept="sales"], [data-theme="auto"][data-dept="sales"] { --hv-accent: #4ADE80; --hv-accent-soft: #0F2A1A; --hv-accent-text: #BBF7D0; }
  [data-theme="auto"] [data-dept="admin"], [data-theme="auto"][data-dept="admin"] { --hv-accent: #94A3B8; --hv-accent-soft: #1A2030; --hv-accent-text: #CBD5E1; }
  [data-theme="auto"] [data-dept="portal"], [data-theme="auto"][data-dept="portal"] { --hv-accent: #8F85F0; --hv-accent-soft: #1E1B3F; --hv-accent-text: #C7C2F5; }
}
/* Motion */
@keyframes hv-rise { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
@keyframes hv-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes hv-scale-in { from { opacity: 0; transform: scale(.96); } to { opacity: 1; transform: none; } }
@keyframes hv-slide-right { from { transform: translateX(-100%); } to { transform: none; } }
@keyframes hv-slide-up { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
@keyframes hv-shimmer { from { background-position: -400px 0; } to { background-position: 400px 0; } }
@keyframes hv-grow-x { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes hv-grow-y { from { transform: scaleY(0); } to { transform: scaleY(1); } }
@keyframes hv-pulse { 0%,100% { box-shadow: 0 0 0 0 rgba(21,128,61,.45); } 60% { box-shadow: 0 0 0 8px rgba(21,128,61,0); } }
@keyframes hv-spin { to { transform: rotate(360deg); } }
@keyframes hv-dash { to { stroke-dashoffset: 0; } }
/* v1.5 / v1.6 motion */
@keyframes hv-ring { 0% { box-shadow: 0 0 0 0 currentColor; opacity: .9; } 100% { box-shadow: 0 0 0 10px transparent; opacity: 1; } }
@keyframes hv-float-up { 0% { opacity: 0; transform: translateY(6px); } 20% { opacity: 1; } 100% { opacity: 0; transform: translateY(-14px); } }
@keyframes hv-sweep { from { background-position: 200% 0; } to { background-position: -200% 0; } }
@keyframes hv-page-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes hv-flash { 0% { background-color: var(--hv-accent-soft); } 100% { background-color: transparent; } }
@keyframes hv-slide-in-right { from { transform: translateX(24px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes hv-blink { 50% { opacity: 0; } }
@keyframes hv-ring-soft { 0% { transform: scale(.9); opacity: .6; } 70%, 100% { transform: scale(1.35); opacity: 0; } }
/* Interaction: a press gives way a little; rows ease their hover colour. */
button:not(:disabled):active { transform: scale(.98); transition: transform .06s var(--hv-ease); }
[data-theme] tbody tr { transition: background-color .15s var(--hv-ease); }
/* Row stagger: the first 12 rows fade in 30 ms apart.  Opacity only — a transform on a
   row would break the tables' sticky header cells and first column. */
.hv-stagger > *, .hv-table > tbody > tr { animation: hv-fade .3s var(--hv-ease) both; }
.hv-stagger > *:nth-child(2), .hv-table > tbody > tr:nth-child(2) { animation-delay: 30ms; }
.hv-stagger > *:nth-child(3), .hv-table > tbody > tr:nth-child(3) { animation-delay: 60ms; }
.hv-stagger > *:nth-child(4), .hv-table > tbody > tr:nth-child(4) { animation-delay: 90ms; }
.hv-stagger > *:nth-child(5), .hv-table > tbody > tr:nth-child(5) { animation-delay: 120ms; }
.hv-stagger > *:nth-child(6), .hv-table > tbody > tr:nth-child(6) { animation-delay: 150ms; }
.hv-stagger > *:nth-child(7), .hv-table > tbody > tr:nth-child(7) { animation-delay: 180ms; }
.hv-stagger > *:nth-child(8), .hv-table > tbody > tr:nth-child(8) { animation-delay: 210ms; }
.hv-stagger > *:nth-child(9), .hv-table > tbody > tr:nth-child(9) { animation-delay: 240ms; }
.hv-stagger > *:nth-child(10), .hv-table > tbody > tr:nth-child(10) { animation-delay: 270ms; }
.hv-stagger > *:nth-child(11), .hv-table > tbody > tr:nth-child(11) { animation-delay: 300ms; }
.hv-stagger > *:nth-child(n+12), .hv-table > tbody > tr:nth-child(n+12) { animation-delay: 330ms; }
.hv-stagger > *:nth-child(n+13), .hv-table > tbody > tr:nth-child(n+13) { animation: none; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 1ms !important; animation-iteration-count: 1 !important; transition-duration: 1ms !important; } }

/* Row density (v1.6): the user's choice, on <html data-density="compact">. */
[data-density="compact"] td { padding-top: 5px !important; padding-bottom: 5px !important; font-size: 12px; }