/* Generated by @fudo/tokens — do not edit by hand. */
:root {

    /* core */
    --fui-color-brand-300: #4a98ff;
    /* Fudo action / accent blue. */
    --fui-color-brand-500: #197bfe;
    --fui-color-brand-700: #0a5bd0;
    --fui-color-gray-0: #ffffff;
    --fui-color-gray-50: #fcfcfc;
    --fui-color-gray-200: #dedede;
    --fui-color-gray-400: #b5b7c9;
    /* Mid-gray calibrated for WCAG SC 1.4.11 (>=3:1) form-control borders against both light and dark surfaces. */
    --fui-color-gray-500: #6b7280;
    --fui-color-gray-700: #2c2d44;
    --fui-color-gray-900: #1c1c22;
    --fui-color-status-warning: #ed8a2c;
    --fui-color-status-error: #c0392b;
    --fui-color-status-success: #3aa76d;
    --fui-space-1: 0.25rem;
    --fui-space-2: 0.5rem;
    --fui-space-3: 0.75rem;
    --fui-space-4: 1rem;
    --fui-space-6: 1.5rem;
    --fui-space-8: 2rem;
    --fui-radius-sm: 4px;
    --fui-radius-md: 8px;
    --fui-radius-lg: 1rem;
    /* Compact control height — dense forms, inline actions. */
    --fui-size-control-height-sm: 1.5rem;
    /* Default (md) control height for inputs and buttons — 32px so it lands on the modular scale. */
    --fui-size-control-height: 2rem;
    /* Generous control height — prominent CTAs, hero inputs. */
    --fui-size-control-height-lg: 2.5rem;
    /* Subtle resting depth — data-entry surfaces (input, textarea, select trigger, datepicker input). Extracted from the fuui input/selector resting shadow. */
    --fui-shadow-xs: 0 2px 4px 0 rgba(0, 0, 0, 0.07);
    /* Lightweight elevation — tooltips, small floating cues. */
    --fui-shadow-sm: 0 4px 12px -4px rgba(0, 0, 0, 0.45);
    /* Floating popover surfaces (dropdown, datepicker, select). */
    --fui-shadow-md: 0 8px 24px -6px rgba(0, 0, 0, 0.35);
    /* Modal-tier — multi-layer ring + halo around dialogs. */
    --fui-shadow-lg: 0 0 3px 0 rgba(0, 0, 0, 0.6), 0 0 0 8px rgba(59, 59, 59, 0.2);
    /* Native system stack. No web font shipped — matches the host OS UI. */
    --fui-typography-family-system: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
    --fui-typography-family-mono: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace;
    /* 12px at base — micro labels, eyebrow alternates. */
    --fui-typography-size-xs: 0.75rem;
    /* 14px — captions, eyebrow. */
    --fui-typography-size-sm: 0.875rem;
    /* Root font-size. 1rem = 16px so the modular scale lands on whole pixels (1, 2, 4, 8, 16, 32 → 0.0625, 0.125, 0.25, 0.5, 1, 2 rem). */
    --fui-typography-size-base: 16px;
    /* 20px — subsection heading (H3). */
    --fui-typography-size-lg: 1.25rem;
    /* 24px — section heading (H2). */
    --fui-typography-size-xl: 1.5rem;
    /* 32px — page title (H1). */
    --fui-typography-size-2xl: 2rem;
    --fui-typography-line-height-base: 1.5;

    /* semantic */
    /* Primary interactive accent. */
    --fui-action-color: var(--fui-color-brand-500);
    --fui-action-hover: var(--fui-color-brand-300);
    --fui-surface-page: var(--fui-color-gray-50);
    --fui-surface-raised: var(--fui-color-gray-0);
    --fui-surface-inverted: var(--fui-color-gray-900);
    /* Floating surfaces (dialog, dropdown, tooltip). Dark, per Fudo's overlay look. */
    --fui-surface-overlay: var(--fui-color-gray-900);
    --fui-border-default: var(--fui-color-gray-200);
    /* Higher-contrast border (WCAG 1.4.11) for form controls where the border IS the affordance — checkbox, radio, switch unchecked state. */
    --fui-border-strong: var(--fui-color-gray-500);
    /* Border on dark overlay surfaces. */
    --fui-border-overlay: var(--fui-color-gray-700);
    --fui-text-default: var(--fui-color-gray-900);
    --fui-text-muted: var(--fui-color-gray-400);
    --fui-text-on-action: var(--fui-color-gray-0);
    /* Text on dark overlay surfaces. */
    --fui-text-on-overlay: var(--fui-color-gray-50);
    /* Informational state — the brand accent. */
    --fui-feedback-info: var(--fui-color-brand-500);
    --fui-feedback-warning: var(--fui-color-status-warning);
    --fui-feedback-error: var(--fui-color-status-error);
    --fui-feedback-success: var(--fui-color-status-success);
    /* Keyboard focus indicator — shared by every interactive element. */
    --fui-focus-ring: var(--fui-action-color);
    /* Font-size for interactive form controls (input, textarea, select, password input). Denser than body text — 14px @ 16px root — keeps forms compact and visually distinct from prose. One place to change if the form scale needs a global shift. */
    --fui-control-font-size: var(--fui-typography-size-sm);

    /* component */
    --fui-button-height: var(--fui-size-control-height);
    --fui-button-height-sm: var(--fui-size-control-height-sm);
    --fui-button-height-lg: var(--fui-size-control-height-lg);
    --fui-button-radius: var(--fui-radius-md);
    --fui-button-font-size: var(--fui-control-font-size);
    --fui-button-color: var(--fui-text-default);
    --fui-button-border-color: var(--fui-border-default);
    --fui-button-action-background: var(--fui-action-color);
    --fui-button-action-color: var(--fui-text-on-action);
    --fui-button-action-hover-background: var(--fui-action-hover);
    --fui-button-danger-background: var(--fui-feedback-error);
    --fui-button-danger-color: var(--fui-text-on-action);
    --fui-checkbox-font-size: var(--fui-control-font-size);
    --fui-input-height: var(--fui-size-control-height);
    --fui-input-height-sm: var(--fui-size-control-height-sm);
    --fui-input-height-lg: var(--fui-size-control-height-lg);
    --fui-input-radius: var(--fui-radius-md);
    --fui-input-font-size: var(--fui-control-font-size);
    --fui-input-background: var(--fui-surface-raised);
    --fui-input-color: var(--fui-text-default);
    --fui-input-border-color: var(--fui-border-default);
    --fui-input-focus-border-color: var(--fui-action-color);
    --fui-radio-font-size: var(--fui-control-font-size);
}

:root[data-theme="dark"] {
    --fui-surface-page: #0f0f0f;
    --fui-surface-raised: #171717;
    --fui-border-default: #2a2a2a;
    --fui-text-default: #cccccc;
    --fui-text-muted: #949494;
}

:root[data-theme="terminal"] {
    --fui-surface-page: #161818;
    --fui-surface-raised: #031710;
    --fui-border-default: #1a1a1a;
    --fui-text-default: #bbcacd;
    --fui-text-muted: #c0cfd2;
}