:root {
    color-scheme: light;
    --mc-color-navy-950: #07182e;
    --mc-color-navy-900: #0b2342;
    --mc-color-navy-800: #12345b;
    --mc-color-yellow-500: #f5b700;
    --mc-color-yellow-600: #d99b00;
    --mc-color-blue-500: #2878d0;
    --mc-color-green-500: #198754;
    --mc-color-orange-500: #d97706;
    --mc-color-red-500: #dc3545;
    --mc-color-purple-500: #7c3aed;
    --mc-color-white: #fff;
    --mc-surface-page: #f4f6f9;
    --mc-surface-card: #fff;
    --mc-surface-muted: #f8fafc;
    --mc-surface-selected: #fff8dc;
    --mc-text-strong: #142033;
    --mc-text-body: #334155;
    --mc-text-muted: #64748b;
    --mc-text-inverse: #fff;
    --mc-border-subtle: #e2e8f0;
    --mc-border-strong: #cbd5e1;
    --mc-focus-ring: rgba(40, 120, 208, .28);
    --mc-space-1: .25rem;
    --mc-space-2: .5rem;
    --mc-space-3: .75rem;
    --mc-space-4: 1rem;
    --mc-space-5: 1.25rem;
    --mc-space-6: 1.5rem;
    --mc-space-8: 2rem;
    --mc-space-10: 2.5rem;
    --mc-radius-sm: .375rem;
    --mc-radius-md: .5rem;
    --mc-radius-lg: .75rem;
    --mc-radius-pill: 999px;
    --mc-shadow-card: 0 1px 2px rgba(15, 23, 42, .04);
    --mc-shadow-overlay: 0 18px 48px rgba(15, 23, 42, .18);
    --mc-font-ui: "HKGrotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --mc-font-size-xs: .75rem;
    --mc-font-size-sm: .8125rem;
    --mc-font-size-md: .875rem;
    --mc-font-size-lg: 1rem;
    --mc-font-size-title: clamp(1.25rem, 2vw, 1.75rem);
    --mc-control-height: 2.625rem;
    --mc-sidebar-bg: var(--mc-color-navy-950);
    --mc-sidebar-width: 250px;
    --mc-header-height: 70px;
    --mc-z-sticky: 1020;
    --mc-z-overlay: 1055;
}

[data-bs-theme="dark"] {
    color-scheme: dark;
    --mc-surface-page: #091525;
    --mc-surface-card: #10223a;
    --mc-surface-muted: #142943;
    --mc-surface-selected: #3b3317;
    --mc-text-strong: #f1f5f9;
    --mc-text-body: #d7e0eb;
    --mc-text-muted: #9fb0c4;
    --mc-border-subtle: #263c56;
    --mc-border-strong: #3b526d;
    /* Bridge the theme variables used by Bootstrap and the legacy shell. */
    --bs-body-bg: var(--mc-surface-page);
    --bs-body-color: var(--mc-text-body);
    --bs-emphasis-color: var(--mc-text-strong);
    --bs-secondary-color: var(--mc-text-muted);
    --bs-secondary-bg: var(--mc-surface-muted);
    --bs-tertiary-bg: var(--mc-surface-muted);
    --bs-border-color: var(--mc-border-subtle);
    --bs-card-bg: var(--mc-surface-card);
    --bs-card-color: var(--mc-text-body);
    --bs-card-cap-bg: var(--mc-surface-muted);
    --bs-card-cap-color: var(--mc-text-strong);
    --vz-body-bg: var(--mc-surface-page);
    --vz-body-color: var(--mc-text-body);
    --vz-card-bg: var(--mc-surface-card);
    --vz-heading-color: var(--mc-text-strong);
    --vz-secondary-color: var(--mc-text-muted);
    --vz-border-color: var(--mc-border-subtle);
}