:root {
    color-scheme: light;

    /* Core brand colors from the designer material */
    --er-color-brand-navy: #0A2463;
    --er-color-brand-red: #FB3640;
    --er-color-brand-blue-strong: #0053FF;
    --er-color-brand-blue-neutral: #042DA5;
    --er-color-brand-blue-soft: #D6E5F4;

    /* Functional neutrals from the brand guide */
    --er-color-ink-primary: #101010;
    --er-color-surface-muted: #EEEBED;
    --er-color-surface-base: #FFFFFF;
    --er-color-page-base: #F8F8F8;

    /* Semantic color roles for application UI */
    --er-color-action-primary: var(--er-color-brand-blue-strong);
    --er-color-action-primary-hover: var(--er-color-brand-blue-neutral);
    --er-color-action-secondary: var(--er-color-brand-blue-neutral);
    --er-color-action-accent: var(--er-color-brand-red);
    --er-color-text-primary: var(--er-color-ink-primary);
    --er-color-text-secondary: rgba(16, 16, 16, 0.72);
    --er-color-text-on-dark: #FFFFFF;
    --er-color-border-subtle: rgba(10, 36, 99, 0.12);
    --er-color-border-soft: rgba(10, 36, 99, 0.08);
    --er-color-fill-soft: rgba(214, 229, 244, 0.48);
    --er-color-fill-accent-soft: rgba(251, 90, 108, 0.14);
    --er-color-focus-ring: rgba(4, 45, 165, 0.4);

    /* Brand gradients */
    --er-gradient-brand-hero: linear-gradient(135deg, var(--er-color-brand-blue-strong), var(--er-color-brand-blue-neutral));
    --er-gradient-brand-accent: linear-gradient(135deg, var(--er-color-brand-blue-strong), var(--er-color-brand-red));

    /* Typography roles */
    --er-font-family-display: 'filson-pro', sans-serif;
    --er-font-family-body: 'filson-pro', sans-serif;
    --er-font-family-action: 'montserrat', sans-serif;
    --er-font-size-caption: 0.6rem;
    --er-font-size-body-sm: 0.875rem;
    --er-font-size-body-md: 1rem;
    --er-font-size-body-lg: 1.125rem;
    --er-font-size-heading-sm: 1.125rem;
    --er-font-size-heading-md: 1.375rem;
    --er-font-size-heading-lg: 1.625rem;
    --er-font-size-display-sm: 2rem;
    --er-font-size-display-md: 3rem;
    --er-font-weight-regular: 400;
    --er-font-weight-medium: 500;
    --er-font-weight-bold: 700;
    --er-line-height-tight: 1.15;
    --er-line-height-body: 1.6;
    --er-letter-spacing-action: 0.07em;

    /* Spacing scale */
    --er-space-1: 0.25rem;
    --er-space-2: 0.5rem;
    --er-space-3: 0.75rem;
    --er-space-4: 1rem;
    --er-space-5: 1.5rem;
    --er-space-6: 2rem;
    --er-space-7: 3rem;

    /* Shape */
    --er-radius-card: 1rem;
    --er-radius-soft: 0.75rem;
    --er-radius-pill: 999px;

    /* Elevation */
    --er-shadow-soft: 0 6px 16px rgba(10, 36, 99, 0.06);
    --er-shadow-raised: 0 12px 28px rgba(10, 36, 99, 0.09);

    /* Motion */
    --er-motion-fast: 150ms ease;

    /* Primitive component tokens */
    --er-button-height-md: 2.75rem;
    --er-button-height-sm: 2.25rem;
    --er-button-padding-inline-md: 1.25rem;
    --er-button-padding-block-md: 0.625rem;
    --er-button-padding-inline-sm: 0.875rem;
    --er-button-padding-block-sm: 0.45rem;
    --er-card-padding-md: 1rem;
    --er-card-padding-sm: 0.75rem;

    /* Temporary aliases for the first design-system iteration */
    --er-ds-color-brand-primary: var(--er-color-action-primary);
    --er-ds-color-brand-secondary: var(--er-color-action-secondary);
    --er-ds-color-brand-accent: var(--er-color-action-accent);
    --er-ds-color-brand-surface-tint: var(--er-color-brand-blue-soft);
    --er-ds-color-brand-ink: var(--er-color-text-primary);
    --er-ds-color-brand-deep: var(--er-color-brand-navy);
    --er-ds-color-brand-surface: var(--er-color-surface-base);
    --er-ds-color-brand-page: var(--er-color-page-base);
    --er-ds-color-brand-border: var(--er-color-border-subtle);
    --er-ds-color-brand-divider: var(--er-color-border-soft);
    --er-ds-font-family-body: var(--er-font-family-body);
    --er-ds-font-family-heading: var(--er-font-family-display);
    --er-ds-font-family-action: var(--er-font-family-action);
    --er-ds-font-size-xs: var(--er-font-size-caption);
    --er-ds-font-size-sm: var(--er-font-size-body-sm);
    --er-ds-font-size-md: var(--er-font-size-body-md);
    --er-ds-font-size-lg: var(--er-font-size-heading-sm);
    --er-ds-font-size-xl: var(--er-font-size-heading-md);
    --er-ds-font-size-2xl: var(--er-font-size-heading-lg);
    --er-ds-line-height-tight: var(--er-line-height-tight);
    --er-ds-line-height-body: var(--er-line-height-body);
    --er-ds-letter-spacing-action: var(--er-letter-spacing-action);
    --er-ds-space-1: var(--er-space-1);
    --er-ds-space-2: var(--er-space-2);
    --er-ds-space-3: var(--er-space-3);
    --er-ds-space-4: var(--er-space-4);
    --er-ds-space-5: var(--er-space-5);
    --er-ds-space-6: var(--er-space-6);
    --er-ds-space-7: var(--er-space-7);
    --er-ds-radius-sm: var(--er-radius-soft);
    --er-ds-radius-md: var(--er-radius-card);
    --er-ds-radius-pill: var(--er-radius-pill);
    --er-ds-shadow-sm: var(--er-shadow-soft);
    --er-ds-shadow-md: var(--er-shadow-raised);
    --er-ds-button-height: var(--er-button-height-md);
    --er-ds-button-height-sm: var(--er-button-height-sm);
    --er-ds-button-padding-x: var(--er-button-padding-inline-md);
    --er-ds-button-padding-y: var(--er-button-padding-block-md);
    --er-ds-button-padding-x-sm: var(--er-button-padding-inline-sm);
    --er-ds-button-padding-y-sm: var(--er-button-padding-block-sm);
    --er-ds-card-padding: var(--er-card-padding-md);
    --er-ds-card-padding-sm: var(--er-card-padding-sm);
}