@font-face {
    font-family: "Inter";
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url("../../fonts/inter/InterVariable-4.1.woff2") format("woff2");
}

:root {
    font-optical-sizing: auto;

    --maxiflow-blue: #0A92D5;
    --maxiflow-orange: #FB7F0E;
    --maxiflow-metallic-blue: #3B5994;
    --maxiflow-navy: #072C4C;
    --maxiflow-white: #FFFFFF;
    --maxiflow-light-gray: #F4F7FA;
    --maxiflow-text-gray: #334155;

    --color-action-primary: #B84A00;
    --color-action-primary-hover: #A84200;
    --color-action-secondary: #006AA3;
    --color-action-secondary-hover: #005F93;
    --color-focus-ring: #0A92D5;

    --color-bg-page: #FFFFFF;
    --color-bg-soft: #F4F7FA;
    --color-bg-inverse: #072C4C;
    --color-bg-card: #FFFFFF;

    --color-text-primary: #072C4C;
    --color-text-secondary: #334155;
    --color-text-muted: #64748B;
    --color-text-inverse: #FFFFFF;

    --color-border-subtle: #E2E8F0;
    --color-border-strong: #CBD5E1;

    --color-success-bg: #EAF7F0;
    --color-success-text: #166534;
    --color-info-bg: #EAF6FE;
    --color-info-text: #075985;
    --color-warning-bg: #FFF4E6;
    --color-warning-text: #B84A00;
    --color-danger-bg: #FDECEC;
    --color-danger-text: #B42318;
    --color-neutral-bg: #F4F7FA;
    --color-neutral-text: #334155;
    --color-processing-bg: #EEF2FF;
    --color-processing-text: #3730A3;
    --color-navigation-active-bg: #EFF6FF;
    --color-overlay: rgb(7 44 76 / 48%);

    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 20px;
    --space-6: 24px;
    --space-8: 32px;
    --space-10: 40px;
    --space-12: 48px;
    --space-16: 64px;
    --space-20: 80px;

    --radius-sm: 4px;
    --radius-md: 6px;
    --radius-lg: 8px;
    --radius-xl: 12px;

    --font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --font-size-caption: 12px;
    --font-size-small: 14px;
    --font-size-body: 16px;
    --font-size-h4: 20px;
    --font-size-h3: 24px;
    --font-size-h2: 32px;
    --font-size-h1: 44px;
    --font-size-display: 56px;

    --button-height-sm: 32px;
    --button-height-md: 40px;
    --button-padding-x: 16px;
    --button-radius: var(--radius-md);
    --button-font-weight: 600;
    --input-height-md: 40px;
    --input-padding-x: 12px;
    --input-radius: var(--radius-md);
    --input-border: var(--color-border-strong);
    --card-padding: 24px;
    --card-radius: var(--radius-lg);
    --card-border: var(--color-border-subtle);
    --layout-content-max: 1200px;
    --layout-text-max: 720px;
    --layout-dashboard-gutter: 24px;

    /* Temporary compatibility aliases for existing app CSS. */
    --color-primary: var(--color-action-secondary);
    --color-primary-strong: var(--color-action-secondary-hover);
    --color-accent: var(--maxiflow-blue);
    --color-background: var(--color-bg-soft);
    --color-surface: var(--color-bg-card);
    --color-surface-strong: var(--color-bg-card);
    --color-text: var(--color-text-primary);
    --color-muted: var(--color-text-secondary);
    --color-border: var(--color-border-subtle);
    --color-danger: var(--color-danger-text);
    --color-success: var(--color-success-text);
    --color-warning: var(--color-warning-text);
    --color-info: var(--color-info-text);
    --shadow-soft: 0 1px 2px rgba(7, 44, 76, 0.06);
    --shadow-md: 0 8px 24px rgba(7, 44, 76, 0.08);
    --shadow-xl: 0 18px 48px rgba(7, 44, 76, 0.10);
}