/* Design Tokens - Auto-generated */
/* Do not edit directly - modify tokens.json instead */

/* === PRIMITIVES === */
:root {
  --primitive-color-blue-50: #F4F7FE;
  --primitive-color-blue-100: #E5ECFD;
  --primitive-color-blue-200: #C9D8FA;
  --primitive-color-blue-300: #9DB9F6;
  --primitive-color-blue-400: #6792F2;
  --primitive-color-blue-500: #2663EC;
  --primitive-color-blue-600: #2054C8;
  --primitive-color-blue-700: #1B45A5;
  --primitive-color-blue-800: #133176;
  --primitive-color-blue-900: #0B1E47;
  --primitive-color-blue-950: #060F23;
  --primitive-color-blue-alt-300: #B2D7F9;
  --primitive-color-blue-alt-400: #338FE5;
  --primitive-color-blue-alt-500: #248CED;
  --primitive-color-blue-alt-700: #15548E;
  --primitive-color-blue-alt-800: #0E385F;
  --primitive-color-indigo-200: #C6D1FD;
  --primitive-color-indigo-400: #6265F0;
  --primitive-color-indigo-500: #4E45E4;
  --primitive-color-indigo-gradient-start: #808BF7;
  --primitive-color-indigo-gradient-end: #483DD0;
  --primitive-color-gray-0: #FFFFFF;
  --primitive-color-gray-50: #F9FAFB;
  --primitive-color-gray-100: #F1F3F5;
  --primitive-color-gray-200: #E2E5E9;
  --primitive-color-gray-300: #C8CDD3;
  --primitive-color-gray-400: #9CA3AC;
  --primitive-color-gray-500: #6B7480;
  --primitive-color-gray-600: #515964;
  --primitive-color-gray-700: #3F4650;
  --primitive-color-gray-800: #272C34;
  --primitive-color-gray-900: #171B21;
  --primitive-color-gray-950: #090B0E;
  --primitive-color-gray-black: #000000;
  --primitive-color-orange-50: #FEF7F5;
  --primitive-color-orange-100: #FCEDE7;
  --primitive-color-orange-200: #FAD8CD;
  --primitive-color-orange-300: #F6BAA5;
  --primitive-color-orange-400: #F09372;
  --primitive-color-orange-500: #EA6536;
  --primitive-color-orange-600: #C7562E;
  --primitive-color-orange-700: #A44726;
  --primitive-color-orange-800: #75321B;
  --primitive-color-orange-900: #461E10;
  --primitive-color-orange-950: #230F08;
  --primitive-color-dark-navy-500: #0A2945;
  --primitive-color-dark-navy-600: #08233B;
  --primitive-color-dark-navy-700: #071D30;
  --primitive-color-dark-navy-800: #051523;
  --primitive-color-dark-navy-900: #030C15;
  --primitive-color-dark-navy-950: #01060A;
  --primitive-color-success-50: #EFFAF3;
  --primitive-color-success-100: #D7F2E1;
  --primitive-color-success-200: #B1E6C5;
  --primitive-color-success-300: #8CD9A6;
  --primitive-color-success-400: #21B859;
  --primitive-color-success-500: #1B9347;
  --primitive-color-success-600: #146E36;
  --primitive-color-success-700: #0D4924;
  --primitive-color-error-50: #FDF1F1;
  --primitive-color-error-100: #FADBDB;
  --primitive-color-error-200: #F6B9B8;
  --primitive-color-error-300: #F08886;
  --primitive-color-error-400: #E53836;
  --primitive-color-error-500: #B82D2B;
  --primitive-color-error-600: #8A2220;
  --primitive-color-error-700: #5C1615;
  --primitive-color-warning-50: #FEFAF0;
  --primitive-color-warning-100: #FDF3D8;
  --primitive-color-warning-200: #FBE7B3;
  --primitive-color-warning-300: #F5BA26;
  --primitive-color-warning-400: #C4951F;
  --primitive-color-warning-500: #937017;
  --primitive-color-warning-600: #624A0F;
  --primitive-color-info-50: #F0F7FE;
  --primitive-color-info-100: #D8EAFC;
  --primitive-color-info-200: #B2D7F9;
  --primitive-color-info-500: #248CED;
  --primitive-color-info-700: #15548E;
  --primitive-color-info-800: #0E385F;
  --primitive-color-info-blue: #386BF2;
  --primitive-color-presence-online: #38C773;
  --primitive-color-presence-offline: #B3B3B3;
  --primitive-color-presence-away: #FFC208;
  --primitive-color-presence-busy: #F54236;
  --primitive-color-presence-neutral: #99A1AD;
  --primitive-color-switch-on: #3D61ED;
  --primitive-color-switch-on-pressed: #2440C2;
  --primitive-color-switch-off: #D9DEE3;
  --primitive-color-switch-off-pressed: #B8BFC9;
  --primitive-color-switch-disabled: #E8EBF0;
  --primitive-color-switch-focus-ring: 0 0 0 3px rgba(61, 97, 237, 0.3);
  --primitive-color-progress-track: #F0F0F5;
  --primitive-color-progress-fill-default: #386BF2;
  --primitive-color-progress-fill-success: #38C773;
  --primitive-color-progress-fill-warning: #F5B021;
  --primitive-color-progress-fill-error: #F54236;
  --primitive-color-tooltip-bg: #262933;
  --primitive-color-avatar-placeholder: #E8EBF0;
  --primitive-color-avatar-initials: #667385;
  --primitive-spacing-0: 0px;
  --primitive-spacing-1: 2px;
  --primitive-spacing-2: 4px;
  --primitive-spacing-3: 6px;
  --primitive-spacing-4: 8px;
  --primitive-spacing-5: 12px;
  --primitive-spacing-6: 16px;
  --primitive-spacing-7: 20px;
  --primitive-spacing-8: 24px;
  --primitive-spacing-9: 32px;
  --primitive-spacing-10: 40px;
  --primitive-spacing-11: 48px;
  --primitive-spacing-12: 64px;
  --primitive-spacing-13: 80px;
  --primitive-spacing-14: 96px;
  --primitive-spacing-15: 128px;
  --primitive-spacing-16: 160px;
  --primitive-spacing-px: 1px;
  --primitive-spacing-2-half: 5px;
  --primitive-spacing-4-half: 9px;
  --primitive-spacing-5-half: 10px;
  --primitive-spacing-5-lg: 14px;
  --primitive-fontSize-text-2xs: 10px;
  --primitive-fontSize-text-xs: 12px;
  --primitive-fontSize-text-sm: 14px;
  --primitive-fontSize-text-md: 16px;
  --primitive-fontSize-text-lg: 18px;
  --primitive-fontSize-text-xl: 20px;
  --primitive-fontSize-display-xs: 24px;
  --primitive-fontSize-display-sm: 30px;
  --primitive-fontSize-display-md: 36px;
  --primitive-fontSize-display-lg: 48px;
  --primitive-fontSize-display-xl: 60px;
  --primitive-fontSize-display-2xl: 72px;
  --primitive-lineHeight-text-2xs: 16px;
  --primitive-lineHeight-text-xs: 18px;
  --primitive-lineHeight-text-sm: 20px;
  --primitive-lineHeight-text-md: 24px;
  --primitive-lineHeight-text-lg: 28px;
  --primitive-lineHeight-text-xl: 30px;
  --primitive-lineHeight-text-body: 22px;
  --primitive-lineHeight-display-xs: 32px;
  --primitive-lineHeight-display-sm: 38px;
  --primitive-lineHeight-display-md: 44px;
  --primitive-lineHeight-display-lg: 60px;
  --primitive-lineHeight-display-xl: 72px;
  --primitive-lineHeight-display-2xl: 90px;
  --primitive-letterSpacing-normal: 0em;
  --primitive-letterSpacing-caps: 0.0833em;
  --primitive-letterSpacing-tight: -0.02em;
  --primitive-letterSpacing-wide: 0.01em;
  --primitive-letterSpacing-wider: 0.02em;
  --primitive-letterSpacing-display-md: -0.0556em;
  --primitive-letterSpacing-display-lg: -0.0417em;
  --primitive-letterSpacing-display-xl: -0.0333em;
  --primitive-letterSpacing-display-2xl: -0.0278em;
  --primitive-fontWeight-thin: 100;
  --primitive-fontWeight-extralight: 200;
  --primitive-fontWeight-light: 300;
  --primitive-fontWeight-regular: 400;
  --primitive-fontWeight-medium: 500;
  --primitive-fontWeight-semibold: 600;
  --primitive-fontWeight-bold: 700;
  --primitive-fontWeight-extrabold: 800;
  --primitive-fontWeight-black: 900;
  --primitive-fontFamily-display: Poppins;
  --primitive-fontFamily-ui: Inter;
  --primitive-radius-none: 0px;
  --primitive-radius-xs: 2px;
  --primitive-radius-ms: 4px;
  --primitive-radius-sm: 6px;
  --primitive-radius-md: 8px;
  --primitive-radius-lg: 12px;
  --primitive-radius-xl: 16px;
  --primitive-radius-2xl: 24px;
  --primitive-radius-full: 9999px;
  --primitive-borderWidth-hairline: 0.5px;
  --primitive-borderWidth-thin: 1px;
  --primitive-borderWidth-default: 1.5px;
  --primitive-borderWidth-medium: 2px;
  --primitive-borderWidth-strong: 3px;
  --primitive-sizing-control-xs: 24px;
  --primitive-sizing-control-sm: 32px;
  --primitive-sizing-control-md: 40px;
  --primitive-sizing-control-lg: 48px;
  --primitive-sizing-control-xl: 56px;
  --primitive-sizing-icon-xs: 12px;
  --primitive-sizing-icon-sm: 16px;
  --primitive-sizing-icon-md: 20px;
  --primitive-sizing-icon-lg: 24px;
  --primitive-sizing-icon-xl: 32px;
  --primitive-sizing-touch-target: 44px;
  --primitive-sizing-avatar-xs: 24px;
  --primitive-sizing-avatar-sm: 32px;
  --primitive-sizing-avatar-md: 40px;
  --primitive-sizing-avatar-lg: 48px;
  --primitive-sizing-avatar-xl: 64px;
  --primitive-opacity-disabled: 0.5;
  --primitive-opacity-disabled-dark: 0.4;
  --primitive-opacity-hover: 0.08;
  --primitive-opacity-active: 0.2;
  --primitive-opacity-scrim: 0.4;
  --primitive-shadow-elevation-card-default: 0 1px 2px 0 rgba(0, 0, 0, 0.04), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  --primitive-shadow-elevation-card-hover: 0 2px 4px -1px rgba(0, 0, 0, 0.04), 0 4px 8px -2px rgba(0, 0, 0, 0.08);
  --primitive-shadow-elevation-card-pressed: 0 1px 2px 0 rgba(0, 0, 0, 0.04);
  --primitive-shadow-elevation-card-selected: 0 1px 2px 0 rgba(51, 92, 245, 0.08), 0 2px 6px 0 rgba(51, 92, 245, 0.06);
  --primitive-shadow-elevation-card-raised: 0 2px 4px -1px rgba(0, 0, 0, 0.04), 0 6px 12px -2px rgba(0, 0, 0, 0.08);
  --primitive-shadow-elevation-card-floating: 0 4px 8px -2px rgba(0, 0, 0, 0.04), 0 8px 16px -2px rgba(0, 0, 0, 0.10);
  --primitive-shadow-elevation-card-dragging: 0 6px 12px -2px rgba(0, 0, 0, 0.06), 0 12px 24px -2px rgba(0, 0, 0, 0.12);
  --primitive-shadow-elevation-popover: 0 4px 8px -2px rgba(0, 0, 0, 0.06), 0 8px 16px -2px rgba(0, 0, 0, 0.10);
  --primitive-shadow-elevation-tooltip: 0 2px 4px -1px rgba(0, 0, 0, 0.08), 0 4px 12px -2px rgba(0, 0, 0, 0.10);
  --primitive-shadow-elevation-toast: 0 4px 8px -2px rgba(0, 0, 0, 0.06), 0 8px 24px -2px rgba(0, 0, 0, 0.12);
  --primitive-shadow-elevation-drawer: -4px 0 8px -2px rgba(0, 0, 0, 0.06), -8px 0 24px -2px rgba(0, 0, 0, 0.14);
  --primitive-shadow-elevation-modal: 0 8px 16px -2px rgba(0, 0, 0, 0.06), 0 16px 48px -2px rgba(0, 0, 0, 0.16);
  --primitive-shadow-elevation-dropdown: 0 4px 12px 0 rgba(0, 0, 0, 0.08);
  --primitive-shadow-focus-ring-primary: 0 0 0 3px rgba(51, 92, 245, 0.2);
  --primitive-shadow-focus-ring-error: 0 0 0 3px rgba(229, 56, 54, 0.12);
  --primitive-shadow-tooltip-figma: 0 2px 8px rgba(0, 0, 0, 0.12);
  --primitive-shadow-drop-xs: 0 1px 2px 0 rgba(19, 26, 41, 0.06);
  --primitive-shadow-drop-sm: 0 1px 2px 0 rgba(19, 26, 41, 0.04), 0 1px 3px 0 rgba(19, 26, 41, 0.12);
  --primitive-shadow-drop-md: 0 2px 4px -2px rgba(19, 26, 41, 0.04), 0 4px 8px -2px rgba(19, 26, 41, 0.12);
  --primitive-duration-instant: 0ms;
  --primitive-duration-fast: 100ms;
  --primitive-duration-normal: 150ms;
  --primitive-duration-slow: 300ms;
  --primitive-easing-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --primitive-easing-decelerate: cubic-bezier(0, 0, 0.2, 1);
  --primitive-easing-accelerate: cubic-bezier(0.4, 0, 1, 1);
  --primitive-zIndex-dropdown: 1000;
  --primitive-zIndex-sticky: 1020;
  --primitive-zIndex-popover: 1030;
  --primitive-zIndex-tooltip: 1040;
  --primitive-zIndex-drawer: 1050;
  --primitive-zIndex-modal: 1060;
  --primitive-zIndex-toast: 1070;
  --primitive-breakpoint-mobile-sm: 320px;
  --primitive-breakpoint-mobile: 375px;
  --primitive-breakpoint-mobile-lg: 414px;
  --primitive-breakpoint-tablet: 768px;
  --primitive-breakpoint-tablet-landscape: 1024px;
  --primitive-breakpoint-desktop-sm: 1280px;
  --primitive-breakpoint-desktop: 1440px;
  --primitive-breakpoint-desktop-lg: 1920px;
  --primitive-breakpoint-desktop-wide: 2560px;
  --primitive-layout-page-margin-sm: 16px;
  --primitive-layout-page-margin-md: 24px;
  --primitive-layout-page-margin-lg: 40px;
  --primitive-layout-container-max-width-sm: 720px;
  --primitive-layout-container-max-width-md: 1200px;
  --primitive-layout-container-max-width-full: 100%;
  --primitive-layout-container-padding: 16px;
  --primitive-layout-grid-columns-mobile: 4;
  --primitive-layout-grid-columns-tablet: 8;
  --primitive-layout-grid-columns-desktop: 12;
  --primitive-layout-gutter-sm: 16px;
  --primitive-layout-gutter-md: 20px;
  --primitive-layout-gutter-lg: 24px;
  --primitive-layout-card-spacing: 16px;
  --primitive-layout-row-gap: 24px;
  --primitive-layout-safe-area-top: 44px;
  --primitive-layout-safe-area-top-tablet: 20px;
  --primitive-layout-safe-area-top-desktop: 0px;
  --primitive-layout-safe-area-bottom: 34px;
  --primitive-layout-safe-area-bottom-tablet: 0px;
  --primitive-layout-safe-area-bottom-desktop: 0px;
  --primitive-layout-section-spacing-sm: 48px;
  --primitive-layout-section-spacing-md: 64px;
  --primitive-layout-section-spacing-lg: 96px;
  --primitive-layout-component-gap-sm: 8px;
  --primitive-layout-component-gap-md: 12px;
  --primitive-layout-component-gap-lg: 16px;
  --primitive-paragraphSpacing-none: 0px;
  --primitive-paragraphSpacing-sm: 8px;
  --primitive-paragraphSpacing-md: 16px;
  --primitive-paragraphSpacing-lg: 24px;
}

/* === SEMANTIC === */
:root {
  --color-background-primary: #F9FAFB;
  --color-background-secondary: #F1F3F5;
  --color-background-tertiary: #E2E5E9;
  --color-surface-default: #FFFFFF;
  --color-surface-elevated: #FFFFFF;
  --color-text-primary: #171B21;
  --color-text-secondary: #515964;
  --color-text-tertiary: #6B7480;
  --color-text-inverse: #FFFFFF;
  --color-text-placeholder: #9CA3AC;
  --color-text-disabled: #9CA3AC;
  --color-brand-primary: #2663EC;
  --color-brand-secondary: #EA6536;
  --color-brand-tertiary: #0A2945;
  --color-interactive-default: #2663EC;
  --color-interactive-hover: #2054C8;
  --color-interactive-pressed: #1B45A5;
  --color-interactive-disabled: #C8CDD3;
  --color-interactive-hover-bg: #F4F7FE;
  --color-border-default: #E2E5E9;
  --color-border-strong: #C8CDD3;
  --color-border-brand: #C9D8FA;
  --color-status-success: #1B9347;
  --color-status-success-bg: #EFFAF3;
  --color-status-success-strong: #21B859;
  --color-status-warning: #C4951F;
  --color-status-warning-bg: #FEFAF0;
  --color-status-warning-strong: #F5BA26;
  --color-status-error: #E53836;
  --color-status-error-bg: #FDF1F1;
  --color-status-error-strong: #F08886;
  --color-status-info: #248CED;
  --color-status-info-bg: #F0F7FE;
  --color-status-info-strong: #338FE5;
  --color-button-primary-bg-default: #2663EC;
  --color-button-primary-bg-hover: #2054C8;
  --color-button-primary-bg-active: #1B45A5;
  --color-button-primary-bg-disabled: #E2E5E9;
  --color-button-primary-text-default: #FFFFFF;
  --color-button-primary-text-disabled: #6B7480;
  --color-button-secondary-bg-default: #FFFFFF;
  --color-button-secondary-bg-hover: #F1F3F5;
  --color-button-secondary-bg-active: #E2E5E9;
  --color-button-secondary-bg-disabled: #F1F3F5;
  --color-button-secondary-text-default: #171B21;
  --color-button-secondary-text-disabled: #9CA3AC;
  --color-button-secondary-border-default: #C8CDD3;
  --color-button-secondary-border-hover: #9CA3AC;
  --color-button-secondary-border-disabled: #E2E5E9;
  --color-button-tertiary-bg-default: transparent;
  --color-button-tertiary-bg-hover: #F1F3F5;
  --color-button-tertiary-bg-active: #E2E5E9;
  --color-button-tertiary-bg-disabled: transparent;
  --color-button-tertiary-text-default: #2663EC;
  --color-button-tertiary-text-disabled: #9CA3AC;
  --color-button-ghost-bg-hover: #F1F3F5;
  --color-button-ghost-bg-active: #E2E5E9;
  --color-button-ghost-text-default: #171B21;
  --color-button-ghost-text-disabled: #9CA3AC;
  --color-button-outline-bg-hover: #F4F7FE;
  --color-button-outline-bg-active: #E5ECFD;
  --color-button-outline-text-default: #2663EC;
  --color-button-outline-text-disabled: #9CA3AC;
  --color-button-outline-border-default: #2663EC;
  --color-button-outline-border-hover: #2054C8;
  --color-button-outline-border-disabled: #C8CDD3;
  --color-button-text-btn-bg-hover: #F4F7FE;
  --color-button-text-btn-color-default: #2663EC;
  --color-button-text-btn-color-hover: #2054C8;
  --color-button-text-btn-color-disabled: #9CA3AC;
  --color-button-destructive-bg-default: #E53836;
  --color-button-destructive-bg-hover: #B82D2B;
  --color-button-destructive-bg-active: #8A2220;
  --color-button-destructive-bg-disabled: #FADBDB;
  --color-button-destructive-text-default: #FFFFFF;
  --color-button-destructive-text-disabled: #F08886;
  --color-button-destructive-outline-text: #E53836;
  --color-button-destructive-outline-border: #F08886;
  --color-button-destructive-outline-bg-hover: #FDF1F1;
  --color-button-destructive-ghost-text: #E53836;
  --color-button-destructive-ghost-bg-hover: #FDF1F1;
  --color-button-success-bg-default: #1B9347;
  --color-button-success-bg-hover: #146E36;
  --color-button-success-bg-active: #0D4924;
  --color-button-success-text-default: #FFFFFF;
  --color-button-success-text-disabled: #8CD9A6;
  --color-button-warning-bg-default: #C4951F;
  --color-button-warning-bg-hover: #937017;
  --color-button-warning-bg-active: #624A0F;
  --color-button-warning-text-default: #171B21;
  --color-button-warning-text-disabled: #937017;
  --color-button-toggle-bg-selected: #2663EC;
  --color-button-toggle-text-selected: #FFFFFF;
  --color-button-toggle-border-selected: #2663EC;
  --color-button-inverse-bg-default: #FFFFFF;
  --color-button-inverse-bg-hover: #F1F3F5;
  --color-button-inverse-text-default: #171B21;
  --color-input-bg-default: #FFFFFF;
  --color-input-bg-hover: #FFFFFF;
  --color-input-bg-disabled: #F1F3F5;
  --color-input-bg-readonly: #F9FAFB;
  --color-input-border-default: #C8CDD3;
  --color-input-border-hover: #9CA3AC;
  --color-input-border-focus: #2663EC;
  --color-input-border-error: #E53836;
  --color-input-border-success: #1B9347;
  --color-input-border-warning: #C4951F;
  --color-input-border-info: #248CED;
  --color-input-border-disabled: #E2E5E9;
  --color-input-border-readonly: #E2E5E9;
  --color-input-text-value: #171B21;
  --color-input-text-placeholder: #9CA3AC;
  --color-input-text-label: #272C34;
  --color-input-text-helper: #6B7480;
  --color-input-text-error: #E53836;
  --color-input-text-success: #1B9347;
  --color-input-text-warning: #937017;
  --color-input-text-info: #248CED;
  --color-input-text-disabled: #9CA3AC;
  --color-input-text-readonly: #515964;
  --color-input-icon-default: #6B7480;
  --color-input-icon-focus: #2663EC;
  --color-input-icon-error: #E53836;
  --color-input-icon-success: #1B9347;
  --color-input-icon-warning: #937017;
  --color-input-icon-info: #248CED;
  --color-input-icon-disabled: #C8CDD3;
  --color-input-icon-readonly: #9CA3AC;
  --color-input-focus-ring: 0 0 0 3px rgba(51, 92, 245, 0.2);
  --color-input-error-ring: 0 0 0 3px rgba(229, 56, 54, 0.12);
  --color-input-warning-ring: 0 0 0 3px rgba(245, 186, 38, 0.15);
  --color-input-info-ring: 0 0 0 3px rgba(36, 140, 237, 0.15);
  --color-input-addon-bg: #F1F3F5;
  --color-input-addon-border: #C8CDD3;
  --color-input-addon-text: #515964;
  --color-input-prefix-bg: #F1F3F5;
  --color-input-prefix-text: #515964;
  --color-input-prefix-border: #C8CDD3;
  --color-input-counter-text: #6B7480;
  --color-input-shadow-focus: 0 0 0 3px rgba(51, 92, 245, 0.2);
  --color-input-shadow-error: 0 0 0 3px rgba(229, 56, 54, 0.12);
  --color-feedback-info-surface: #F0F7FE;
  --color-feedback-info-surface-strong: #D8EAFC;
  --color-feedback-info-border: #D8EAFC;
  --color-feedback-info-border-strong: #248CED;
  --color-feedback-info-icon: #248CED;
  --color-feedback-info-text: #0E385F;
  --color-feedback-info-text-strong: #15548E;
  --color-feedback-success-surface: #EFFAF3;
  --color-feedback-success-surface-strong: #D7F2E1;
  --color-feedback-success-border: #D7F2E1;
  --color-feedback-success-border-strong: #21B859;
  --color-feedback-success-icon: #1B9347;
  --color-feedback-success-text: #0D4924;
  --color-feedback-success-text-strong: #146E36;
  --color-feedback-warning-surface: #FEFAF0;
  --color-feedback-warning-surface-strong: #FDF3D8;
  --color-feedback-warning-border: #FDF3D8;
  --color-feedback-warning-border-strong: #F5BA26;
  --color-feedback-warning-icon: #C4951F;
  --color-feedback-warning-text: #624A0F;
  --color-feedback-warning-text-strong: #937017;
  --color-feedback-error-surface: #FDF1F1;
  --color-feedback-error-surface-strong: #FADBDB;
  --color-feedback-error-border: #FADBDB;
  --color-feedback-error-border-strong: #E53836;
  --color-feedback-error-icon: #E53836;
  --color-feedback-error-text: #5C1615;
  --color-feedback-error-text-strong: #8A2220;
  --color-feedback-critical-surface: #F6B9B8;
  --color-feedback-critical-surface-strong: #B82D2B;
  --color-feedback-critical-border: #F08886;
  --color-feedback-critical-border-strong: #E53836;
  --color-feedback-critical-icon: #8A2220;
  --color-feedback-critical-text: #5C1615;
  --color-feedback-critical-text-on-surface: #FFFFFF;
  --color-feedback-neutral-surface: #F1F3F5;
  --color-feedback-neutral-surface-strong: #E2E5E9;
  --color-feedback-neutral-border: #E2E5E9;
  --color-feedback-neutral-border-strong: #C8CDD3;
  --color-feedback-neutral-icon: #515964;
  --color-feedback-neutral-text: #3F4650;
  --color-feedback-neutral-text-strong: #272C34;
  --color-feedback-toast-surface: #FFFFFF;
  --color-feedback-toast-border: #E2E5E9;
  --color-feedback-toast-text-primary: #171B21;
  --color-feedback-toast-text-secondary: #6B7480;
  --color-feedback-toast-accent-info: #248CED;
  --color-feedback-toast-accent-success: #21B859;
  --color-feedback-toast-accent-warning: #F5BA26;
  --color-feedback-toast-accent-error: #E53836;
  --color-feedback-banner-surface: #171B21;
  --color-feedback-banner-border: #272C34;
  --color-feedback-banner-text: #FFFFFF;
  --color-feedback-banner-icon: #C8CDD3;
  --color-feedback-notification-surface-read: #FFFFFF;
  --color-feedback-notification-surface-unread: #F4F7FE;
  --color-feedback-notification-border: #E2E5E9;
  --color-feedback-notification-dot: #E53836;
  --color-feedback-dismiss-icon-default: #6B7480;
  --color-feedback-dismiss-icon-hover: #3F4650;
  --color-nav-surface-elevated: #FFFFFF;
  --color-nav-pill-bg: #E5ECFD;
  --color-nav-pill-text: #2663EC;
  --color-nav-item-text: #515964;
  --color-segmented-soft-bg-selected: #E5ECFD;
  --color-segmented-soft-text-selected: #1B45A5;
  --color-segmented-soft-text-default: #3F4650;
  --color-segmented-soft-border: #C8CDD3;
  --color-fab-bg: #2054C8;
  --color-fab-text: #FFFFFF;
  --color-elevation-card-default: 0 1px 2px 0 rgba(0, 0, 0, 0.04), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  --color-elevation-card-hover: 0 2px 4px -1px rgba(0, 0, 0, 0.04), 0 4px 8px -2px rgba(0, 0, 0, 0.08);
  --color-elevation-card-pressed: 0 1px 2px 0 rgba(0, 0, 0, 0.04);
  --color-elevation-card-selected: 0 1px 2px 0 rgba(51, 92, 245, 0.08), 0 2px 6px 0 rgba(51, 92, 245, 0.06);
  --color-elevation-card-raised: 0 2px 4px -1px rgba(0, 0, 0, 0.04), 0 6px 12px -2px rgba(0, 0, 0, 0.08);
  --color-elevation-card-floating: 0 4px 8px -2px rgba(0, 0, 0, 0.04), 0 8px 16px -2px rgba(0, 0, 0, 0.10);
  --color-elevation-card-dragging: 0 6px 12px -2px rgba(0, 0, 0, 0.06), 0 12px 24px -2px rgba(0, 0, 0, 0.12);
  --color-elevation-popover: 0 4px 8px -2px rgba(0, 0, 0, 0.06), 0 8px 16px -2px rgba(0, 0, 0, 0.10);
  --color-elevation-tooltip: 0 2px 4px -1px rgba(0, 0, 0, 0.08), 0 4px 12px -2px rgba(0, 0, 0, 0.10);
  --color-elevation-toast: 0 4px 8px -2px rgba(0, 0, 0, 0.06), 0 8px 24px -2px rgba(0, 0, 0, 0.12);
  --color-elevation-drawer: -4px 0 8px -2px rgba(0, 0, 0, 0.06), -8px 0 24px -2px rgba(0, 0, 0, 0.14);
  --color-elevation-modal: 0 8px 16px -2px rgba(0, 0, 0, 0.06), 0 16px 48px -2px rgba(0, 0, 0, 0.16);
  --color-elevation-dropdown: 0 4px 12px 0 rgba(0, 0, 0, 0.08);
  --spacing-component: 8px;
  --spacing-component-sm: 6px;
  --spacing-component-lg: 16px;
  --spacing-section: 64px;
  --spacing-section-sm: 32px;
  --spacing-section-lg: 160px;
  --spacing-page-x: 40px;
  --spacing-page-y: 64px;
  --spacing-form-field-gap: 16px;
  --spacing-grid-gutter: 20px;
  --typography-font-heading: Poppins;
  --typography-font-body: Inter;
  --typography-font-label: Inter;
  --typography-font-caption: Inter;
  --typography-weight-regular: 400;
  --typography-weight-medium: 500;
  --typography-weight-semibold: 600;
  --typography-weight-bold: 700;
  --radius-control: 8px;
  --radius-control-sm: 4px;
  --radius-control-lg: 12px;
  --radius-card: 12px;
  --radius-card-sm: 8px;
  --radius-panel: 16px;
  --radius-full: 9999px;
  --border-width-thin: 1px;
  --border-width-medium: 2px;
  --border-width-strong: 3px;
  --opacity-disabled: 0.5;
}

/* === COMPONENTS === */
:root {
  --button-font-size: var(--primitive-fontSize-text-md);
  --button-font-size-sm: var(--primitive-fontSize-text-sm);
  --button-font-size-lg: var(--primitive-fontSize-text-lg);
  --button-font-weight: var(--primitive-fontWeight-semibold);
  --button-height-xs: var(--primitive-sizing-control-xs);
  --button-height-sm: var(--primitive-sizing-control-sm);
  --button-height-md: var(--primitive-sizing-control-md);
  --button-height-lg: var(--primitive-sizing-control-lg);
  --button-height-xl: var(--primitive-sizing-control-xl);
  --button-padding-x: var(--primitive-spacing-6);
  --button-padding-x-xs: var(--primitive-spacing-4);
  --button-padding-x-sm: var(--primitive-spacing-5);
  --button-padding-x-lg: var(--primitive-spacing-7);
  --button-padding-x-xl: var(--primitive-spacing-8);
  --button-radius: var(--primitive-radius-md);
  --button-radius-sm: var(--primitive-radius-ms);
  --button-radius-lg: var(--primitive-radius-lg);
  --button-icon-gap: var(--primitive-spacing-2);
  --button-icon-gap-sm: var(--primitive-spacing-2);
  --button-icon-gap-md: var(--primitive-spacing-3);
  --button-icon-gap-lg: var(--primitive-spacing-4);
  --button-icon-size-xs: var(--primitive-sizing-icon-xs);
  --button-icon-size-sm: var(--primitive-sizing-icon-sm);
  --button-icon-size-md: var(--primitive-sizing-icon-md);
  --button-icon-size-lg: var(--primitive-sizing-icon-lg);
  --button-focus-ring: var(--primitive-shadow-focus-ring-primary);
  --button-disabled-opacity: var(--primitive-opacity-disabled);
  --button-transition: 100ms cubic-bezier(0.4, 0, 0.2, 1);
  --input-font-size: var(--primitive-fontSize-text-md);
  --input-height-sm: var(--primitive-sizing-control-sm);
  --input-height-md: var(--primitive-sizing-control-md);
  --input-height-lg: var(--primitive-sizing-control-lg);
  --input-padding-x: var(--primitive-spacing-5);
  --input-padding-x-sm: var(--primitive-spacing-4);
  --input-padding-x-lg: var(--primitive-spacing-6);
  --input-radius: var(--primitive-radius-md);
  --input-radius-sm: var(--primitive-radius-ms);
  --input-radius-lg: var(--primitive-radius-lg);
  --input-border-width: var(--primitive-borderWidth-default);
  --input-focus-ring: var(--primitive-shadow-focus-ring-primary);
  --input-error-ring: var(--primitive-shadow-focus-ring-error);
  --input-label-gap: var(--primitive-spacing-3);
  --input-helper-gap: var(--primitive-spacing-2);
  --input-icon-gap: var(--primitive-spacing-2);
  --input-textarea-min-height-sm: 80px;
  --input-textarea-min-height-md: 120px;
  --input-textarea-min-height-lg: 160px;
  --card-bg: var(--color-surface-default);
  --card-border: var(--color-border-default);
  --card-radius: var(--radius-card);
  --card-shadow: var(--primitive-shadow-elevation-card-default);
  --card-shadow-hover: var(--primitive-shadow-elevation-card-hover);
  --card-shadow-pressed: var(--primitive-shadow-elevation-card-pressed);
  --card-shadow-selected: var(--primitive-shadow-elevation-card-selected);
  --card-shadow-raised: var(--primitive-shadow-elevation-card-raised);
  --card-padding: var(--primitive-spacing-6);
  --card-padding-sm: var(--primitive-spacing-5);
  --card-padding-lg: var(--primitive-spacing-8);
  --card-gap: var(--primitive-spacing-4);
  --card-border-width: var(--primitive-borderWidth-thin);
  --card-header-gap: var(--primitive-spacing-2);
  --badge-bg: var(--primitive-color-gray-100);
  --badge-text: var(--primitive-color-gray-600);
  --badge-bg-info: var(--color-status-info-bg);
  --badge-text-info: var(--color-status-info);
  --badge-bg-success: var(--color-status-success-bg);
  --badge-text-success: var(--color-status-success);
  --badge-bg-warning: var(--color-status-warning-bg);
  --badge-text-warning: var(--color-status-warning);
  --badge-bg-error: var(--color-status-error-bg);
  --badge-text-error: var(--color-status-error);
  --badge-bg-purple: #F5EDFF;
  --badge-text-purple: #8C3DD9;
  --badge-font-size: var(--primitive-fontSize-text-xs);
  --badge-font-size-sm: var(--primitive-fontSize-text-2xs);
  --badge-font-weight: var(--primitive-fontWeight-medium);
  --badge-height-sm: 20px;
  --badge-height-md: 24px;
  --badge-height-lg: 28px;
  --badge-radius: var(--primitive-radius-full);
  --badge-padding-x: var(--primitive-spacing-2);
  --badge-dot-size: 6px;
  --avatar-bg: var(--primitive-color-avatar-placeholder);
  --avatar-text: var(--primitive-color-avatar-initials);
  --avatar-radius: var(--primitive-radius-full);
  --avatar-font-weight: var(--primitive-fontWeight-semibold);
  --avatar-border: var(--color-surface-default);
  --avatar-border-width: 2px;
  --avatar-dot-size-xs: 8px;
  --avatar-dot-size-sm: 8px;
  --avatar-dot-size-md: 10px;
  --avatar-dot-size-lg: 12px;
  --avatar-dot-size-xl: 16px;
  --avatar-ring-width: 2px;
  --table-header-bg: var(--color-background-secondary);
  --table-header-text: var(--color-text-secondary);
  --table-header-font-size: var(--primitive-fontSize-text-xs);
  --table-header-font-weight: var(--primitive-fontWeight-semibold);
  --table-row-height-sm: var(--primitive-sizing-control-sm);
  --table-row-height-md: var(--primitive-sizing-control-md);
  --table-row-height-lg: var(--primitive-sizing-control-lg);
  --table-row-hover-bg: var(--color-background-secondary);
  --table-row-selected-bg: var(--primitive-color-blue-50);
  --table-border: var(--color-border-default);
  --table-border-width: var(--primitive-borderWidth-thin);
  --table-cell-padding-x: var(--primitive-spacing-6);
  --table-cell-padding-y: var(--primitive-spacing-4);
  --table-radius: var(--primitive-radius-lg);
  --tooltip-bg: var(--primitive-color-tooltip-bg);
  --tooltip-text: var(--color-text-inverse);
  --tooltip-font-size: var(--primitive-fontSize-text-xs);
  --tooltip-radius: var(--primitive-radius-ms);
  --tooltip-shadow: var(--primitive-shadow-tooltip-figma);
  --tooltip-padding-x: 10px;
  --tooltip-padding-y: var(--primitive-spacing-3);
  --modal-bg: var(--color-surface-default);
  --modal-radius: var(--primitive-radius-xl);
  --modal-shadow: var(--primitive-shadow-elevation-modal);
  --modal-scrim: rgba(0, 0, 0, 0.4);
  --modal-padding: var(--primitive-spacing-8);
  --modal-max-width-sm: 384px;
  --modal-max-width-md: 448px;
  --modal-max-width-lg: 560px;
  --modal-max-width-xl: 672px;
  --modal-max-width-2xl: 768px;
  --drawer-bg: var(--color-surface-default);
  --drawer-shadow: var(--primitive-shadow-elevation-drawer);
  --drawer-width: 360px;
  --drawer-width-lg: 400px;
  --drawer-width-mini: 64px;
  --drawer-width-max: 600px;
  --drawer-bottom-radius: 12px 12px 0px 0px;
  --drawer-drag-handle-width: 40px;
  --drawer-drag-handle-height: 4px;
  --drawer-scrim: rgba(0, 0, 0, 0.4);
  --dialog-max-width: var(--modal-max-width-md);
  --select-trigger-height-sm: 36px;
  --select-trigger-height-md: 40px;
  --select-trigger-height-lg: 44px;
  --select-menu-shadow: var(--primitive-shadow-elevation-dropdown);
  --select-menu-radius: var(--primitive-radius-md);
  --select-menu-padding-y: var(--primitive-spacing-3);
  --select-menu-max-height: 320px;
  --select-item-height: 40px;
  --select-item-padding-x: var(--primitive-spacing-5);
  --select-item-padding-y: var(--primitive-spacing-4);
  --select-item-radius: var(--primitive-radius-sm);
  --select-item-hover-bg: var(--color-background-secondary);
  --switch-track-width: 44px;
  --switch-track-height: 24px;
  --switch-track-radius: var(--primitive-radius-full);
  --switch-thumb-size: 20px;
  --switch-thumb-gap: 2px;
  --checkbox-box-xs: 14px;
  --checkbox-box-sm: 16px;
  --checkbox-box-md: 20px;
  --checkbox-box-lg: 24px;
  --checkbox-box-xl: 28px;
  --checkbox-radius-xs: 2px;
  --checkbox-radius-sm: var(--primitive-radius-ms);
  --checkbox-radius-md: var(--primitive-radius-ms);
  --checkbox-radius-lg: var(--primitive-radius-md);
  --checkbox-radius-xl: var(--primitive-radius-md);
  --checkbox-border-xs: var(--primitive-borderWidth-thin);
  --checkbox-border-sm: var(--primitive-borderWidth-default);
  --checkbox-border-md: var(--primitive-borderWidth-default);
  --checkbox-border-lg: var(--primitive-borderWidth-medium);
  --checkbox-border-xl: var(--primitive-borderWidth-medium);
  --checkbox-check-xs: 10px;
  --checkbox-check-sm: 12px;
  --checkbox-check-md: 14px;
  --checkbox-check-lg: 16px;
  --checkbox-check-xl: 20px;
  --checkbox-touch-xs: 24px;
  --checkbox-touch-sm: 32px;
  --checkbox-touch-md: 40px;
  --checkbox-touch-lg: 48px;
  --checkbox-touch-xl: 56px;
  --checkbox-label-gap-xs: 6px;
  --checkbox-label-gap-sm: var(--primitive-spacing-4);
  --checkbox-label-gap-md: var(--primitive-spacing-4);
  --checkbox-label-gap-lg: var(--primitive-spacing-5);
  --checkbox-label-gap-xl: var(--primitive-spacing-5);
  --checkbox-checked-bg: var(--color-brand-primary);
  --checkbox-checked-text: var(--color-text-inverse);
  --checkbox-unchecked-border: var(--color-border-strong);
  --checkbox-hover-bg: var(--color-background-primary);
  --checkbox-focus-border: var(--color-interactive-default);
  --checkbox-error-border: var(--color-status-error);
  --checkbox-disabled-bg: var(--color-background-tertiary);
  --checkbox-disabled-border: var(--color-border-default);
  --checkbox-disabled-opacity: 0.5;
  --checkbox-focus-ring: var(--primitive-shadow-focus-ring-primary);
  --radio-size-xs: 14px;
  --radio-size-sm: 16px;
  --radio-size-md: 20px;
  --radio-size-lg: 24px;
  --radio-size-xl: 28px;
  --radio-dot-xs: 6px;
  --radio-dot-sm: 7px;
  --radio-dot-md: 8px;
  --radio-dot-lg: 10px;
  --radio-dot-xl: 12px;
  --radio-border-xs: var(--primitive-borderWidth-thin);
  --radio-border-sm: var(--primitive-borderWidth-default);
  --radio-border-md: var(--primitive-borderWidth-medium);
  --radio-border-lg: var(--primitive-borderWidth-medium);
  --radio-border-xl: var(--primitive-borderWidth-medium);
  --radio-touch-xs: 24px;
  --radio-touch-sm: 28px;
  --radio-touch-md: 32px;
  --radio-touch-lg: 40px;
  --radio-touch-xl: 48px;
  --radio-label-gap-xs: 6px;
  --radio-label-gap-sm: var(--primitive-spacing-4);
  --radio-label-gap-md: var(--primitive-spacing-4);
  --radio-label-gap-lg: var(--primitive-spacing-5);
  --radio-label-gap-xl: var(--primitive-spacing-5);
  --radio-radius: var(--primitive-radius-full);
  --radio-unchecked-border: var(--color-border-strong);
  --radio-checked-dot: var(--primitive-color-blue-600);
  --radio-checked-border: var(--primitive-color-blue-600);
  --radio-hover-bg: var(--color-background-primary);
  --radio-focus-border: var(--color-interactive-default);
  --radio-error-border: var(--color-status-error);
  --radio-disabled-bg: var(--color-background-tertiary);
  --radio-disabled-border: var(--color-border-default);
  --radio-disabled-opacity: 0.5;
  --radio-focus-ring: var(--primitive-shadow-focus-ring-primary);
  --slider-track-height-xs: 2px;
  --slider-track-height-sm: 3px;
  --slider-track-height-md: 4px;
  --slider-track-height-lg: 6px;
  --slider-track-height-xl: 8px;
  --slider-thumb-xs: 12px;
  --slider-thumb-sm: 16px;
  --slider-thumb-md: 20px;
  --slider-thumb-lg: 24px;
  --slider-thumb-xl: 28px;
  --slider-thumb-border-xs: var(--primitive-borderWidth-default);
  --slider-thumb-border-sm: var(--primitive-borderWidth-default);
  --slider-thumb-border-md: var(--primitive-borderWidth-medium);
  --slider-thumb-border-lg: var(--primitive-borderWidth-medium);
  --slider-thumb-border-xl: var(--primitive-borderWidth-medium);
  --slider-touch-target: 44px;
  --slider-radius: var(--primitive-radius-full);
  --slider-track-bg: var(--primitive-color-gray-200);
  --slider-track-hover: var(--primitive-color-gray-300);
  --slider-track-disabled: var(--primitive-color-gray-100);
  --slider-fill-default: var(--primitive-color-blue-500);
  --slider-fill-hover: var(--primitive-color-blue-600);
  --slider-fill-active: var(--primitive-color-blue-700);
  --slider-fill-disabled: var(--primitive-color-gray-300);
  --slider-thumb-bg: var(--primitive-color-gray-0);
  --slider-thumb-border: var(--primitive-color-blue-500);
  --slider-thumb-border-hover: var(--primitive-color-blue-600);
  --slider-thumb-border-active: var(--primitive-color-blue-700);
  --slider-thumb-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
  --slider-tooltip-bg: var(--primitive-color-tooltip-bg);
  --slider-tooltip-text: var(--color-text-inverse);
  --slider-tooltip-radius: var(--primitive-radius-ms);
  --slider-label-gap: var(--primitive-spacing-3);
  --slider-helper-gap: var(--primitive-spacing-2);
  --slider-disabled-opacity: 0.5;
  --slider-readonly-opacity: 0.7;
  --slider-focus-ring: var(--primitive-shadow-focus-ring-primary);
  --divider-border: var(--color-border-default);
  --divider-border-width: var(--primitive-borderWidth-thin);
  --toast-bg: var(--color-feedback-toast-surface);
  --toast-text-primary: var(--color-feedback-toast-text-primary);
  --toast-text-secondary: var(--color-feedback-toast-text-secondary);
  --toast-radius: var(--primitive-radius-lg);
  --toast-shadow: var(--primitive-shadow-elevation-toast);
  --toast-padding: 12px 16px;
  --toast-accent-bar-width: 3px;
  --toast-accent-bar-radius: 2px;
  --nav-bg: var(--color-surface-default);
  --nav-border: var(--color-border-default);
  --nav-item-height: 40px;
  --nav-item-padding-x: var(--primitive-spacing-4);
  --nav-item-radius: var(--primitive-radius-md);
  --nav-item-text: var(--color-text-secondary);
  --nav-item-text-active: var(--color-brand-primary);
  --nav-item-bg-active: var(--color-background-secondary);
  --nav-sidebar-width: 256px;
  --nav-sidebar-width-collapsed: 64px;
  --nav-mobile-nav-height: 80px;
  --nav-surface-elevated: var(--color-nav-surface-elevated);
  --nav-pill-bg: var(--color-nav-pill-bg);
  --nav-pill-text: var(--color-nav-pill-text);
  --nav-icon-size: var(--primitive-sizing-icon-lg);
  --nav-label-size: var(--primitive-fontSize-text-xs);
  --nav-label-weight: var(--primitive-fontWeight-semibold);
  --nav-icon-label-gap: var(--primitive-spacing-3);
  --nav-pill-padding-x: 16px;
  --nav-pill-padding-y: 12px;
  --nav-pill-radius: var(--primitive-radius-full);
  --nav-bar-padding-x: var(--primitive-spacing-5);
  --nav-bar-padding-y: var(--primitive-spacing-5);
  --nav-bar-padding-bottom: 20px;
  --nav-bar-shadow: var(--primitive-shadow-elevation-toast);
  --icon-button-size-xs: var(--primitive-sizing-control-xs);
  --icon-button-size-sm: var(--primitive-sizing-control-sm);
  --icon-button-size-md: var(--primitive-sizing-control-md);
  --icon-button-size-lg: var(--primitive-sizing-control-lg);
  --icon-button-size-xl: var(--primitive-sizing-control-xl);
  --icon-button-radius: var(--primitive-radius-md);
  --icon-button-radius-sm: var(--primitive-radius-ms);
  --icon-button-radius-lg: var(--primitive-radius-lg);
  --icon-button-icon-size-sm: var(--primitive-sizing-icon-sm);
  --icon-button-icon-size-md: var(--primitive-sizing-icon-md);
  --icon-button-icon-size-lg: var(--primitive-sizing-icon-lg);
  --icon-button-focus-ring: var(--primitive-shadow-focus-ring-primary);
  --fab-size-sm: 40px;
  --fab-size-md: 56px;
  --fab-size-lg: 72px;
  --fab-radius: var(--primitive-radius-lg);
  --fab-radius-md: var(--primitive-radius-xl);
  --fab-radius-lg: var(--primitive-radius-2xl);
  --fab-bg: var(--color-fab-bg);
  --fab-text: var(--color-fab-text);
  --fab-shadow: var(--primitive-shadow-elevation-card-floating);
  --fab-icon-size: var(--primitive-sizing-icon-lg);
  --fab-icon-size-sm: var(--primitive-sizing-icon-md);
  --fab-icon-size-lg: var(--primitive-sizing-icon-xl);
  --extended-fab-height: 48px;
  --extended-fab-padding-x: var(--primitive-spacing-6);
  --extended-fab-gap: var(--primitive-spacing-3);
  --extended-fab-radius: var(--primitive-radius-full);
  --split-button-divider-width: var(--primitive-borderWidth-thin);
  --split-button-divider-color: var(--color-border-default);
  --segmented-height: var(--primitive-sizing-control-md);
  --segmented-radius: var(--primitive-radius-md);
  --segmented-padding: var(--primitive-spacing-1);
  --segmented-item-gap: var(--primitive-spacing-1);
  --segmented-item-bg-active: var(--color-surface-default);
  --segmented-item-text-active: var(--color-text-primary);
  --segmented-item-bg-default: var(--color-background-secondary);
  --segmented-item-text-default: var(--color-text-secondary);
  --segmented-shadow: var(--primitive-shadow-drop-xs);
  --segmented-soft-item-bg-selected: var(--color-segmented-soft-bg-selected);
  --segmented-soft-item-text-selected: var(--color-segmented-soft-text-selected);
  --segmented-soft-item-text-default: var(--color-segmented-soft-text-default);
  --segmented-soft-border: var(--color-segmented-soft-border);
  --button-group-gap: 0px;
  --button-group-joint-radius: var(--primitive-radius-ms);
  --link-button-padding-x: var(--primitive-spacing-2);
  --link-button-underline-color: var(--color-brand-primary);
  --link-button-underline-width: var(--primitive-borderWidth-thin);
  --ai-button-bg: var(--primitive-color-indigo-400);
  --ai-button-bg-hover: var(--primitive-color-indigo-500);
  --ai-button-text: var(--color-text-inverse);
  --ai-button-gradient-start: var(--primitive-color-indigo-gradient-start);
  --ai-button-gradient-end: var(--primitive-color-indigo-gradient-end);
  --ai-button-focus-ring: 0 0 0 3px rgba(98, 101, 240, 0.25);
  --toggle-button-height-xs: 24px;
  --toggle-button-height-sm: 32px;
  --toggle-button-height-md: 40px;
  --toggle-button-height-lg: 48px;
  --toggle-button-height-xl: 56px;
  --toggle-button-padding-x-xs: var(--primitive-spacing-4);
  --toggle-button-padding-x-sm: var(--primitive-spacing-5);
  --toggle-button-padding-x-md: var(--primitive-spacing-6);
  --toggle-button-gap: var(--primitive-spacing-3);
  --toggle-button-gap-sm: var(--primitive-spacing-2);
  --toggle-button-gap-lg: var(--primitive-spacing-4);
  --toggle-button-radius: var(--primitive-radius-md);
  --toggle-button-radius-sm: var(--primitive-radius-ms);
  --toggle-button-radius-lg: var(--primitive-radius-lg);
  --toggle-button-selected-bg: var(--primitive-color-blue-100);
  --toggle-button-selected-text: var(--primitive-color-blue-600);
  --toggle-button-selected-border: var(--primitive-color-blue-400);
  --toggle-button-icon-size: var(--primitive-sizing-icon-md);
  --toggle-button-icon-size-xs: var(--primitive-sizing-icon-xs);
  --toggle-button-icon-size-sm: var(--primitive-sizing-icon-sm);
  --toggle-button-icon-size-lg: var(--primitive-sizing-icon-lg);
  --toggle-button-disabled-opacity: 0.6;
  --search-input-icon-size: var(--primitive-sizing-icon-md);
  --search-input-icon-gap: var(--primitive-spacing-3);
  --search-input-clear-size: var(--primitive-sizing-icon-sm);
  --password-input-eye-size: var(--primitive-sizing-icon-md);
  --password-input-eye-gap: var(--primitive-spacing-3);
  --otp-input-cell-width: 48px;
  --otp-input-cell-height: 48px;
  --otp-input-cell-width-sm: 40px;
  --otp-input-cell-height-sm: 40px;
  --otp-input-gap: 8px;
  --otp-input-gap-sm: 12px;
  --otp-input-radius: var(--primitive-radius-md);
  --otp-input-font-size: var(--primitive-fontSize-text-lg);
  --file-upload-padding: var(--primitive-spacing-9);
  --file-upload-radius: var(--primitive-radius-lg);
  --file-upload-border-width: var(--primitive-borderWidth-thin);
  --file-upload-border-color: var(--color-border-strong);
  --file-upload-icon-size: var(--primitive-sizing-icon-lg);
  --tag-input-chip-height: var(--primitive-sizing-control-sm);
  --tag-input-chip-radius: var(--primitive-radius-full);
  --tag-input-chip-gap: var(--primitive-spacing-2);
  --tag-input-remove-size: var(--primitive-sizing-icon-xs);
  --number-input-stepper-width: var(--primitive-sizing-control-sm);
  --number-input-stepper-color: var(--color-text-secondary);
  --number-input-stepper-hover: var(--color-background-secondary);
  --date-input-icon-size: var(--primitive-sizing-icon-md);
  --date-input-icon-gap: var(--primitive-spacing-3);
  --date-cell-width: 40px;
  --date-cell-height: 40px;
  --date-cell-radius: var(--primitive-radius-full);
  --date-cell-selected-bg: var(--color-brand-primary);
  --date-cell-selected-text: var(--color-text-inverse);
  --date-cell-hover-bg: var(--color-background-secondary);
  --date-cell-today-text: var(--color-brand-primary);
  --date-cell-today-border: var(--color-brand-primary);
  --date-cell-today-border-width: 1.5px;
  --date-cell-range-middle-bg: var(--primitive-color-blue-50);
  --date-cell-disabled-opacity: var(--primitive-opacity-disabled);
  --calendar-width: 320px;
  --calendar-padding: var(--primitive-spacing-6);
  --calendar-gap: var(--primitive-spacing-4);
  --calendar-radius: var(--primitive-radius-lg);
  --calendar-shadow: var(--primitive-shadow-elevation-dropdown);
  --calendar-weekday-size: var(--primitive-fontSize-text-xs);
  --progress-height-sm: 4px;
  --progress-height-md: 6px;
  --progress-height-lg: 8px;
  --progress-radius: var(--primitive-radius-full);
  --progress-radius-sm: 2px;
  --progress-radius-md: 3px;
  --progress-radius-lg: 4px;
  --progress-track: var(--primitive-color-progress-track);
  --progress-fill: var(--primitive-color-progress-fill-default);
  --progress-fill-success: var(--primitive-color-progress-fill-success);
  --progress-fill-warning: var(--primitive-color-progress-fill-warning);
  --progress-fill-error: var(--primitive-color-progress-fill-error);
  --status-indicator-dot-sm: 6px;
  --status-indicator-dot-md: 8px;
  --status-indicator-dot-lg: 10px;
  --status-indicator-gap: var(--primitive-spacing-3);
  --status-indicator-label-size: var(--primitive-fontSize-text-xs);
  --status-indicator-label-color: var(--primitive-color-gray-600);
  --status-indicator-online: var(--primitive-color-presence-online);
  --status-indicator-offline: var(--primitive-color-presence-offline);
  --status-indicator-away: var(--primitive-color-presence-away);
  --status-indicator-busy: var(--primitive-color-presence-busy);
  --status-indicator-info: var(--primitive-color-info-blue);
  --status-indicator-neutral: var(--primitive-color-presence-neutral);
  --divider-dashed-border: var(--color-border-default);
  --divider-dashed-border-width: var(--primitive-borderWidth-thin);
  --divider-dashed-dash-length: 4px;
  --divider-dashed-dash-gap: 4px;
  --divider-dashed-label-gap: var(--primitive-spacing-5);
  --divider-dashed-label-size: var(--primitive-fontSize-text-xs);
  --divider-dashed-label-color: var(--color-text-tertiary);
  --tabs-height: var(--primitive-sizing-control-sm);
  --tabs-item-padding-x: var(--primitive-spacing-4);
  --tabs-item-gap: var(--primitive-spacing-2);
  --tabs-radius: var(--primitive-radius-md);
  --tabs-container-bg: var(--color-background-secondary);
  --tabs-container-padding: var(--primitive-spacing-1);
  --tabs-container-radius: var(--primitive-radius-lg);
  --tabs-active-text: var(--color-brand-primary);
  --tabs-active-bg: var(--color-surface-default);
  --tabs-inactive-text: var(--color-text-secondary);
  --tabs-indicator-width: 2px;
  --tabs-indicator-color: var(--color-brand-primary);
  --step-circle-size: 32px;
  --step-radius: var(--primitive-radius-full);
  --step-connector-width: 2px;
  --step-connector-color: var(--color-border-default);
  --step-connector-complete: var(--color-status-success);
  --step-active-bg: var(--color-brand-primary);
  --step-active-text: var(--color-text-inverse);
  --step-complete-bg: var(--color-status-success);
  --step-complete-text: var(--color-text-inverse);
  --step-error-bg: var(--color-status-error);
  --step-error-text: var(--color-text-inverse);
  --step-pending-bg: var(--color-background-secondary);
  --step-pending-text: var(--color-text-tertiary);
  --accordion-item-padding: var(--primitive-spacing-4);
  --accordion-content-padding: 4px 8px 8px;
  --accordion-item-gap: var(--primitive-spacing-2);
  --accordion-radius: var(--primitive-radius-md);
  --accordion-chevron-size: var(--primitive-sizing-icon-md);
  --accordion-border: var(--color-border-default);
  --accordion-divider: var(--color-border-default);
  --accordion-disabled-opacity: 0.5;
  --disclosure-header-height: var(--primitive-sizing-control-md);
  --disclosure-padding-x: var(--primitive-spacing-4);
  --disclosure-chevron-size: var(--primitive-sizing-icon-sm);
  --snackbar-bg: var(--color-feedback-toast-surface);
  --snackbar-text: var(--color-feedback-toast-text-primary);
  --snackbar-text-secondary: var(--color-feedback-toast-text-secondary);
  --snackbar-radius: var(--primitive-radius-md);
  --snackbar-padding: 12px 16px;
  --snackbar-shadow: var(--primitive-shadow-elevation-dropdown);
  --snackbar-max-width: 480px;
  --field-message-font-size: var(--primitive-fontSize-text-xs);
  --field-message-gap: var(--primitive-spacing-2);
  --field-message-icon-size: 14px;
  --field-message-error: var(--color-input-text-error);
  --field-message-success: var(--color-input-text-success);
  --field-message-warning: var(--color-input-text-warning);
  --field-message-info: var(--color-input-text-info);
  --notification-card-padding: var(--primitive-spacing-6);
  --notification-card-radius: var(--primitive-radius-lg);
  --notification-card-title-size: var(--primitive-fontSize-text-sm);
  --notification-card-body-size: var(--primitive-fontSize-text-sm);
  --notification-card-unread-bg: var(--color-feedback-notification-surface-unread);
  --notification-card-read-bg: var(--color-feedback-notification-surface-read);
  --notification-card-dot-size: 8px;
  --notification-card-dot: var(--color-feedback-notification-dot);
  --notification-card-border: var(--color-feedback-notification-border);
  --empty-state-padding: 32px 24px;
  --empty-state-icon-wrap-size: 56px;
  --empty-state-icon-size: 24px;
  --empty-state-title-size: var(--primitive-fontSize-text-md);
  --empty-state-body-size: var(--primitive-fontSize-text-sm);
  --empty-state-gap: var(--primitive-spacing-6);
  --empty-state-icon-gap: var(--primitive-spacing-6);
  --skeleton-bg: var(--primitive-color-gray-200);
  --skeleton-highlight: var(--primitive-color-gray-100);
  --skeleton-radius: var(--primitive-radius-ms);
  --tag-height-sm: 20px;
  --tag-height-md: 24px;
  --tag-radius: var(--primitive-radius-sm);
  --tag-font-size-sm: var(--primitive-fontSize-text-2xs);
  --tag-font-size-md: var(--primitive-fontSize-text-xs);
  --tag-font-weight: var(--primitive-fontWeight-medium);
  --tag-padding-x: var(--primitive-spacing-2);
  --tag-text: var(--primitive-color-gray-800);
  --tag-bg: var(--color-background-secondary);
  --tag-border: var(--color-border-default);
  --tag-outline-bg: var(--color-surface-default);
  --tag-outline-border: var(--color-border-strong);
  --tag-remove-size: 14px;
  --tag-remove-gap: var(--primitive-spacing-1);
  --metric-card-padding: var(--primitive-spacing-6);
  --metric-card-kpi-size: var(--primitive-fontSize-text-xl);
  --metric-card-kpi-weight: var(--primitive-fontWeight-bold);
  --metric-card-label-size: var(--primitive-fontSize-text-sm);
  --metric-card-gap: var(--primitive-spacing-2);
  --metric-card-delta-up: var(--color-status-success);
  --metric-card-delta-down: var(--color-status-error);
  --metric-comparison-padding: var(--primitive-spacing-6);
  --metric-comparison-radius: var(--primitive-radius-lg);
  --metric-comparison-gap: var(--primitive-spacing-4);
  --metric-comparison-title-size: var(--primitive-fontSize-text-sm);
  --metric-comparison-title-weight: var(--primitive-fontWeight-semibold);
  --metric-comparison-overline-size: var(--primitive-fontSize-text-xs);
  --metric-comparison-overline-weight: var(--primitive-fontWeight-medium);
  --metric-comparison-overline-spacing: var(--primitive-letterSpacing-caps);
  --metric-comparison-value-size: var(--primitive-fontSize-display-xs);
  --metric-comparison-value-weight: var(--primitive-fontWeight-medium);
  --metric-comparison-value-line-height: var(--primitive-lineHeight-display-xs);
  --metric-comparison-delta-up-color: var(--color-status-success-strong);
  --metric-comparison-row-gap: var(--primitive-spacing-4);
  --metric-comparison-row-padding-y: var(--primitive-spacing-4);
  --metric-comparison-row-value-size: var(--primitive-fontSize-text-xs);
  --metric-comparison-divider: var(--color-border-default);
  --metric-comparison-profit-text: var(--color-interactive-default);
  --metric-comparison-profit-label-weight: var(--primitive-fontWeight-semibold);
  --selection-card-padding: var(--primitive-spacing-6);
  --selection-card-radius: var(--primitive-radius-lg);
  --selection-card-selected-border: var(--color-brand-primary);
  --selection-card-selected-border-width: var(--primitive-borderWidth-medium);
  --selection-card-selected-bg: var(--primitive-color-blue-50);
  --pricing-card-padding: var(--primitive-spacing-8);
  --pricing-card-price-size: var(--primitive-fontSize-text-xl);
  --pricing-card-price-weight: var(--primitive-fontWeight-bold);
  --pricing-card-feature-gap: var(--primitive-spacing-3);
  --pricing-card-highlight-border: var(--color-brand-primary);
  --pricing-card-highlight-bg: var(--primitive-color-blue-50);
  --media-card-media-ratio: 16/9;
  --media-card-caption-size: var(--primitive-fontSize-text-xs);
  --profile-card-avatar-size: var(--primitive-sizing-avatar-lg);
  --profile-card-name-size: var(--primitive-fontSize-text-md);
  --profile-card-role-size: var(--primitive-fontSize-text-sm);
  --settings-card-row-height: 56px;
  --settings-card-row-padding-x: var(--primitive-spacing-6);
  --settings-card-row-gap: var(--primitive-spacing-4);
  --settings-card-divider: var(--color-border-default);
  --settings-card-label-size: var(--primitive-fontSize-text-sm);
  --ai-card-bg: var(--primitive-color-indigo-gradient-start);
  --ai-card-accent: var(--primitive-color-indigo-400);
  --ai-card-radius: var(--primitive-radius-lg);
  --dashboard-widget-padding: var(--primitive-spacing-6);
  --dashboard-widget-title-size: var(--primitive-fontSize-text-md);
  --dashboard-widget-title-weight: var(--primitive-fontWeight-semibold);
  --dashboard-widget-chart-height: 180px;
  --table-toolbar-padding: var(--primitive-spacing-6);
  --table-toolbar-gap: var(--primitive-spacing-6);
  --table-toolbar-border: var(--color-border-default);
  --table-toolbar-title-size: var(--primitive-fontSize-text-md);
  --table-toolbar-count-size: var(--primitive-fontSize-text-sm);
  --table-cell-padding-y-compact: 8px;
  --table-cell-padding-y-default: 12px;
  --table-cell-padding-y-comfortable: 16px;
  --table-cell-padding-y-spacious: 20px;
  --table-cell-text-size: var(--primitive-fontSize-text-sm);
  --table-cell-secondary-size: var(--primitive-fontSize-text-xs);
  --table-cell-dense-text-size: 13px;
  --table-pagination-item-size: 32px;
  --table-pagination-gap: var(--primitive-spacing-1);
  --table-pagination-radius: var(--primitive-radius-ms);
  --table-pagination-active-bg: var(--color-brand-primary);
  --table-pagination-active-text: var(--color-text-inverse);
  --table-pagination-default-text: var(--color-text-secondary);
  --table-pagination-disabled-opacity: var(--primitive-opacity-disabled);
  --nav-topbar-height: 64px;
  --nav-topbar-height-standard: 56px;
  --nav-topbar-height-compact: 48px;
  --nav-topbar-padding-x: var(--primitive-spacing-9);
  --nav-topbar-item-gap: var(--primitive-spacing-7);
  --nav-topbar-bg: var(--color-surface-default);
  --nav-topbar-border: var(--color-border-default);
  --nav-sidebar-padding: var(--primitive-spacing-6);
  --nav-sidebar-item-height: 40px;
  --nav-sidebar-item-padding-x: var(--primitive-spacing-5);
  --nav-sidebar-item-gap: var(--primitive-spacing-4);
  --nav-sidebar-section-label-size: var(--primitive-fontSize-text-2xs);
  --nav-sidebar-section-label-gap: var(--primitive-spacing-4);
  --nav-rail-width: 72px;
  --nav-rail-item-size: 56px;
  --nav-rail-item-radius: var(--primitive-radius-lg);
  --nav-rail-item-gap: var(--primitive-spacing-2);
  --nav-rail-active-bg: var(--color-background-secondary);
  --nav-rail-active-text: var(--color-brand-primary);
  --nav-mobile-height: 56px;
  --nav-mobile-item-min-width: 48px;
  --nav-mobile-icon-size: var(--primitive-sizing-icon-lg);
  --nav-mobile-label-size: var(--primitive-fontSize-text-2xs);
  --nav-mobile-active-pill-bg: var(--primitive-color-blue-100);
  --nav-mobile-active-pill-text: var(--color-brand-primary);
  --nav-mobile-badge-min-width: 16px;
  --nav-mobile-badge-size: var(--primitive-fontSize-text-2xs);
  --nav-mobile-badge-bg: var(--color-status-error);
  --nav-mobile-badge-text: var(--color-text-inverse);
  --nav-mobile-center-action-size: 56px;
  --nav-mobile-safe-area: 34px;
}

/* === DARK MODE === */
.dark {
  --color-background-primary: #051523;
  --color-background-secondary: #071D30;
  --color-background-tertiary: #08233B;
  --color-surface-default: #08233B;
  --color-surface-elevated: #0A2945;
  --color-text-primary: #F9FAFB;
  --color-text-secondary: #C8CDD3;
  --color-text-tertiary: #6B7480;
  --color-text-inverse: #171B21;
  --color-text-placeholder: #6B7480;
  --color-text-disabled: #6B7480;
  --color-border-default: #0A2945;
  --color-border-strong: #272C34;
  --color-border-brand: #1B45A5;
  --color-interactive-hover-bg: rgba(38, 99, 236, 0.16);
  --color-interactive-disabled: #08233B;
  --color-button-primary-bg-disabled: #08233B;
  --color-button-primary-text-disabled: #515964;
  --color-button-secondary-bg-default: #08233B;
  --color-button-secondary-bg-hover: #0A2945;
  --color-button-secondary-bg-active: #272C34;
  --color-button-secondary-bg-disabled: #071D30;
  --color-button-secondary-text-default: #F9FAFB;
  --color-button-secondary-text-disabled: #515964;
  --color-button-secondary-border-default: #3F4650;
  --color-button-secondary-border-hover: #515964;
  --color-button-secondary-border-disabled: #0A2945;
  --color-button-tertiary-bg-hover: #0A2945;
  --color-button-tertiary-bg-active: #272C34;
  --color-button-ghost-bg-hover: #0A2945;
  --color-button-ghost-bg-active: #272C34;
  --color-button-ghost-text-default: #F9FAFB;
  --color-button-ghost-text-disabled: #515964;
  --color-button-outline-bg-hover: rgba(38, 99, 236, 0.16);
  --color-button-outline-bg-active: rgba(38, 99, 236, 0.24);
  --color-button-text-btn-bg-hover: rgba(38, 99, 236, 0.16);
  --color-button-destructive-bg-disabled: #08233B;
  --color-button-destructive-text-disabled: #B82D2B;
  --color-button-destructive-outline-border: #8A2220;
  --color-button-destructive-outline-bg-hover: rgba(229, 56, 54, 0.12);
  --color-button-destructive-ghost-bg-hover: rgba(229, 56, 54, 0.12);
  --color-button-inverse-bg-default: #171B21;
  --color-button-inverse-bg-hover: #272C34;
  --color-button-inverse-text-default: #F9FAFB;
  --color-input-bg-default: #071D30;
  --color-input-bg-hover: #071D30;
  --color-input-bg-disabled: #051523;
  --color-input-bg-readonly: #051523;
  --color-input-border-default: #3F4650;
  --color-input-border-hover: #515964;
  --color-input-border-disabled: #0A2945;
  --color-input-border-readonly: #0A2945;
  --color-input-text-value: #F9FAFB;
  --color-input-text-placeholder: #6B7480;
  --color-input-text-label: #E2E5E9;
  --color-input-text-helper: #9CA3AC;
  --color-input-text-disabled: #515964;
  --color-input-text-readonly: #9CA3AC;
  --color-input-icon-default: #9CA3AC;
  --color-input-icon-disabled: #515964;
  --color-input-icon-readonly: #6B7480;
  --color-input-addon-bg: #08233B;
  --color-input-addon-border: #3F4650;
  --color-input-addon-text: #9CA3AC;
  --color-input-prefix-bg: #08233B;
  --color-input-prefix-text: #9CA3AC;
  --color-input-prefix-border: #3F4650;
  --color-input-counter-text: #6B7480;
  --color-feedback-info-surface: rgba(36, 140, 237, 0.12);
  --color-feedback-info-border: rgba(36, 140, 237, 0.3);
  --color-feedback-info-text: #B2D7F9;
  --color-feedback-success-surface: rgba(33, 184, 89, 0.12);
  --color-feedback-success-border: rgba(33, 184, 89, 0.3);
  --color-feedback-success-text: #B1E6C5;
  --color-feedback-warning-surface: rgba(245, 186, 38, 0.12);
  --color-feedback-warning-border: rgba(245, 186, 38, 0.3);
  --color-feedback-warning-text: #FBE7B3;
  --color-feedback-error-surface: rgba(229, 56, 54, 0.12);
  --color-feedback-error-border: rgba(229, 56, 54, 0.3);
  --color-feedback-error-text: #F6B9B8;
  --color-feedback-critical-surface: rgba(184, 45, 43, 0.2);
  --color-feedback-critical-text: #FADBDB;
  --color-feedback-neutral-surface: #08233B;
  --color-feedback-neutral-border: #0A2945;
  --color-feedback-neutral-text: #C8CDD3;
  --color-feedback-toast-surface: #F1F3F5;
  --color-feedback-toast-border: #E2E5E9;
  --color-feedback-toast-text-primary: #171B21;
  --color-feedback-toast-text-secondary: #515964;
  --color-feedback-banner-surface: #F1F3F5;
  --color-feedback-banner-border: #E2E5E9;
  --color-feedback-banner-text: #171B21;
  --color-feedback-banner-icon: #3F4650;
  --color-feedback-notification-surface-read: #08233B;
  --color-feedback-notification-surface-unread: rgba(38, 99, 236, 0.12);
  --color-feedback-notification-border: #0A2945;
  --color-nav-surface-elevated: #08233B;
  --color-nav-pill-bg: #0A2945;
  --color-nav-pill-text: #6792F2;
  --color-nav-item-text: #C8CDD3;
  --color-segmented-soft-bg-selected: #0A2945;
  --color-segmented-soft-text-selected: #6792F2;
  --color-segmented-soft-text-default: #C8CDD3;
  --color-segmented-soft-border: #3F4650;
  --color-fab-bg: #2663EC;
  --color-fab-text: #FFFFFF;
  --opacity-disabled: 0.4;
}