/* Shared ESA palette, typography and UI tokens. */
:root {
    --gs-typeface: Montserrat, sans-serif;
    --gs-font-size-base: 0.85rem;
    --gs-font-size-small: 0.8125rem;
    --gs-font-size-heading: 1.75rem;
    --gs-font-weight-semibold: 600;
    --gs-font-weight-bold: 700;
    --gs-line-height: 1.5;

    --gs-color-secondary: #234168;
    --gs-color-secondary-dark: #182c47;
    --gs-color-primary: #63bc48;
    --gs-color-brand-green: #338802;
    --gs-color-brand-green-dark: #145e00;
    --gs-text-color: #000000;
    --gs-muted-text-color: #626b70;
    --gs-page-bg: #f2f2f2;
    --gs-surface-bg: #ffffff;
    --gs-border-color: #dee2e6;
    --gs-error-color: #b02a37;
    --gs-color-success: #1e7b34;
    --gs-color-warning: #946200;
    --gs-color-info: #0b5ed7;
    --gs-focus-ring-color: var(--gs-color-primary);
    --gs-focus-ring-shadow-color: color-mix(in srgb, var(--gs-focus-ring-color) 45%, transparent);

    /* Semantic roles keep component styles independent of palette values. */
    --gs-input-border-color: var(--gs-muted-text-color);
    --gs-readonly-bg: var(--gs-page-bg);
    --gs-disabled-bg: var(--gs-border-color);
    --gs-action-bg: var(--gs-color-brand-green);
    --gs-action-hover-bg: var(--gs-color-brand-green-dark);
    --gs-action-text-color: var(--gs-surface-bg);
    --gs-error-text-color: var(--gs-surface-bg);

    --gs-space-1: 0.25rem;
    --gs-space-2: 0.5rem;
    --gs-space-3: 0.75rem;
    --gs-space-4: 1rem;
    --gs-space-5: 1.5rem;
    --gs-space-6: 2rem;
    --gs-space-7: 3rem;
    --gs-field-gap: 0.375rem;
    --gs-control-padding-block: 0.625rem;
    --gs-control-padding-inline: var(--gs-space-3);
    --gs-touch-target: 2.75rem;
    --gs-border-width: 1px;
    --gs-card-radius: 0.25rem;
    --gs-focus-ring-width: 3px;
    --gs-focus-ring-offset: 2px;
    --gs-field-focus-shadow: 0 0 0 var(--gs-focus-ring-width) var(--gs-focus-ring-shadow-color);
    --gs-motion-duration: 200ms;
    --gs-form-card-max-width: 42rem;
    --gs-content-max-width: 75rem;
    --gs-header-height: 4.5rem;
    --gs-header-logo-height: 3.5rem;
    --gs-header-logo-mobile-width: 8.25rem;
    --gs-brand-bar-height: 5px;
    --gs-brand-strip-lime: #8dc63f;
    --gs-brand-strip-green: #62bb46;
    --gs-brand-strip-emerald: #4ab969;
    --gs-brand-strip-teal: #1cb78d;
    --gs-brand-strip-cyan: #27aae1;
    --gs-brand-strip-blue: #2a4096;
    --gs-brand-strip-navy: #2d3b7a;
    --gs-brand-strip: linear-gradient(to right,
        var(--gs-brand-strip-lime) 0% 14.2857%,
        var(--gs-brand-strip-green) 14.2857% 28.5714%,
        var(--gs-brand-strip-emerald) 28.5714% 42.8571%,
        var(--gs-brand-strip-teal) 42.8571% 57.1429%,
        var(--gs-brand-strip-cyan) 57.1429% 71.4286%,
        var(--gs-brand-strip-blue) 71.4286% 85.7143%,
        var(--gs-brand-strip-navy) 85.7143% 100%);
    --gs-page-gutter: var(--gs-space-5);
    --gs-page-gutter-wide: 2.5rem;
    --gs-z-toast: 400;
    --gs-z-modal: 300;
    --gs-modal-width-standard: 32rem;
    --gs-modal-width-large: 48rem;
    --gs-modal-width-wide: 75rem;
    --gs-modal-radius: 0.5rem;
    --gs-modal-title-font-size: 1.125rem;
    --gs-modal-backdrop-color: color-mix(in srgb, var(--gs-text-color) 50%, transparent);
    --gs-icon-size: 1.25rem;
    --gs-icon-size-small: 1rem;
    --gs-toast-max-width: 23rem;
    --gs-toast-surface: var(--gs-surface-bg);
    --gs-toast-ink: #30363a;
    --gs-toast-muted: var(--gs-muted-text-color);
    --gs-toast-success-accent: var(--gs-color-success);
    --gs-toast-warning-accent: var(--gs-color-warning);
    --gs-toast-error-accent: var(--gs-error-color);
    --gs-toast-shadow-color: rgba(23, 32, 39, 0.16);
    --gs-toast-shadow: 0 0.35rem 1rem var(--gs-toast-shadow-color);
    --gs-toast-icon-size: 1.5rem;
    --gs-toast-min-height: 3.75rem;
    --gs-toast-padding-block: 0.45rem;
    --gs-toast-padding-end: 0.35rem;
    --gs-toast-accent-width: 0.2rem;
    --gs-toast-message-gap: 0.125rem;
    --gs-toast-message-font-size: 0.8rem;
    --gs-toast-title-line-height: 1.2;
    --gs-toast-message-line-height: 1.35;
    --gs-z-dropdown: 200;
    --gs-dropdown-max-height: 18rem;
    --gs-dropdown-option-hover-bg: color-mix(in srgb, var(--gs-text-color) 8%, var(--gs-page-bg));
    --gs-badge-primary-bg: var(--gs-color-primary);
    --gs-badge-secondary-bg: var(--gs-color-secondary);
    --gs-badge-info-bg: var(--gs-color-info);
    --gs-badge-success-bg: var(--gs-color-success);
    --gs-badge-warning-bg: var(--gs-color-warning);
    --gs-badge-danger-bg: var(--gs-error-color);
    --gs-badge-on-dark: var(--gs-surface-bg);
    --gs-badge-on-light: var(--gs-text-color);
    --gs-badge-font-size: 0.75rem;
    --gs-badge-padding-block: var(--gs-space-1);
    --gs-badge-padding-inline: var(--gs-space-2);
    --gs-badge-line-height: 1.2;
    --gs-filter-chip-bg: color-mix(in srgb, var(--gs-color-secondary) 4%, var(--gs-surface-bg));
    --gs-filter-chip-border: color-mix(in srgb, var(--gs-color-secondary) 20%, var(--gs-surface-bg));
    --gs-filter-chip-hover-bg: color-mix(in srgb, var(--gs-color-primary) 10%, var(--gs-surface-bg));
    --gs-radius-pill: 999px;
    --gs-loader-size: var(--gs-icon-size);
    --gs-loader-stroke-width: calc(var(--gs-border-width) * 2);
    --gs-loader-accent: var(--gs-color-primary);
    --gs-loader-track: var(--gs-border-color);
    --gs-loader-duration: 800ms;
    --gs-loader-gap: var(--gs-space-2);
    --gs-z-table-header: 1;
    --gs-table-max-height: 36rem;
    --gs-table-min-width: 48rem;
    --gs-table-cell-padding-block: var(--gs-space-5);
    --gs-table-cell-padding-inline: var(--gs-space-4);
    --gs-table-row-hover-bg: color-mix(in srgb, var(--gs-color-primary) 5%, var(--gs-surface-bg));
    --gs-task-tile-height: 4rem;
    --gs-task-tile-edge: 0.25rem;
    --gs-task-info-wash: #edf5ff;
    --gs-task-warning-wash: #fff8e9;
    --gs-task-success-wash: #edf7eb;
    --gs-task-danger-wash: #fff1f2;
    --gs-task-control-border: #cccccc;
    --gs-task-detail-ink: #30363a;
    --gs-task-discussion-wash: color-mix(in srgb, var(--gs-color-secondary) 4%, var(--gs-surface-bg));
    --gs-task-composer-wash: color-mix(in srgb, var(--gs-color-primary) 5%, var(--gs-surface-bg));
    --gs-task-avatar-size: 2.5rem;
    --gs-task-card-title-size: 1rem;
    --gs-task-thumbnail-size: 5rem;
    --gs-card-shadow: 0 0.1rem 0.35rem color-mix(in srgb, var(--gs-text-color) 8%, transparent);
}