@expcat/tigercat-core 1.1.0 → 1.2.14

package/tokens/tokens.css

@@ -0,0 +1,640 @@
+/* Auto-generated by generate-tokens.js — Do not edit manually */
+
+:root {
+  color-scheme: light;
+
+  /* Primitive tokens */
+  --tiger-primitive-color-primary-50: #f0f9ff;
+  --tiger-primitive-color-primary-100: #e0f2fe;
+  --tiger-primitive-color-primary-200: #bae6fd;
+  --tiger-primitive-color-primary-300: #7dd3fc;
+  --tiger-primitive-color-primary-400: #38bdf8;
+  --tiger-primitive-color-primary-500: #0ea5e9;
+  --tiger-primitive-color-primary-600: #0284c7;
+  --tiger-primitive-color-primary-700: #0369a1;
+  --tiger-primitive-color-primary-800: #075985;
+  --tiger-primitive-color-primary-950: #0c3d66;
+  --tiger-primitive-color-secondary-50: #f8fafc;
+  --tiger-primitive-color-secondary-100: #f1f5f9;
+  --tiger-primitive-color-secondary-200: #e2e8f0;
+  --tiger-primitive-color-secondary-300: #cbd5e1;
+  --tiger-primitive-color-secondary-400: #94a3b8;
+  --tiger-primitive-color-secondary-500: #64748b;
+  --tiger-primitive-color-secondary-600: #475569;
+  --tiger-primitive-color-secondary-700: #334155;
+  --tiger-primitive-color-secondary-800: #1e293b;
+  --tiger-primitive-color-secondary-950: #0f172a;
+  --tiger-primitive-color-success-50: #f0fdf4;
+  --tiger-primitive-color-success-100: #dcfce7;
+  --tiger-primitive-color-success-200: #bbf7d0;
+  --tiger-primitive-color-success-300: #86efac;
+  --tiger-primitive-color-success-400: #4ade80;
+  --tiger-primitive-color-success-500: #22c55e;
+  --tiger-primitive-color-success-600: #16a34a;
+  --tiger-primitive-color-success-700: #15803d;
+  --tiger-primitive-color-success-800: #166534;
+  --tiger-primitive-color-success-950: #052e16;
+  --tiger-primitive-color-warning-50: #fffbeb;
+  --tiger-primitive-color-warning-100: #fef3c7;
+  --tiger-primitive-color-warning-200: #fde68a;
+  --tiger-primitive-color-warning-300: #fcd34d;
+  --tiger-primitive-color-warning-400: #fbbf24;
+  --tiger-primitive-color-warning-500: #f59e0b;
+  --tiger-primitive-color-warning-600: #d97706;
+  --tiger-primitive-color-warning-700: #b45309;
+  --tiger-primitive-color-warning-800: #92400e;
+  --tiger-primitive-color-warning-950: #451a03;
+  --tiger-primitive-color-error-50: #fef2f2;
+  --tiger-primitive-color-error-100: #fee2e2;
+  --tiger-primitive-color-error-200: #fecaca;
+  --tiger-primitive-color-error-300: #fca5a5;
+  --tiger-primitive-color-error-400: #f87171;
+  --tiger-primitive-color-error-500: #ef4444;
+  --tiger-primitive-color-error-600: #dc2626;
+  --tiger-primitive-color-error-700: #b91c1c;
+  --tiger-primitive-color-error-800: #991b1b;
+  --tiger-primitive-color-error-950: #450a0a;
+  --tiger-primitive-color-info-50: #eff6ff;
+  --tiger-primitive-color-info-100: #dbeafe;
+  --tiger-primitive-color-info-200: #bfdbfe;
+  --tiger-primitive-color-info-300: #93c5fd;
+  --tiger-primitive-color-info-400: #60a5fa;
+  --tiger-primitive-color-info-500: #3b82f6;
+  --tiger-primitive-color-info-600: #2563eb;
+  --tiger-primitive-color-info-700: #1d4ed8;
+  --tiger-primitive-color-info-800: #1e40af;
+  --tiger-primitive-color-info-950: #172554;
+  --tiger-primitive-color-neutral-50: #fafafa;
+  --tiger-primitive-color-neutral-100: #f5f5f5;
+  --tiger-primitive-color-neutral-200: #e5e5e5;
+  --tiger-primitive-color-neutral-300: #d4d4d4;
+  --tiger-primitive-color-neutral-400: #a3a3a3;
+  --tiger-primitive-color-neutral-500: #737373;
+  --tiger-primitive-color-neutral-600: #525252;
+  --tiger-primitive-color-neutral-700: #404040;
+  --tiger-primitive-color-neutral-800: #262626;
+  --tiger-primitive-color-neutral-950: #0a0a0a;
+  --tiger-primitive-space-xs: 2px;
+  --tiger-primitive-space-sm: 4px;
+  --tiger-primitive-space-md: 8px;
+  --tiger-primitive-space-lg: 16px;
+  --tiger-primitive-space-xl: 24px;
+  --tiger-primitive-space-2xl: 32px;
+  --tiger-primitive-space-3xl: 48px;
+  --tiger-primitive-space-4xl: 64px;
+  --tiger-primitive-radius-none: 0;
+  --tiger-primitive-radius-sm: 2px;
+  --tiger-primitive-radius-md: 4px;
+  --tiger-primitive-radius-lg: 8px;
+  --tiger-primitive-radius-xl: 12px;
+  --tiger-primitive-radius-full: 9999px;
+  --tiger-primitive-shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
+  --tiger-primitive-shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);
+  --tiger-primitive-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
+  --tiger-primitive-shadow-lg:
+    0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
+  --tiger-primitive-shadow-xl:
+    0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
+  --tiger-primitive-font-family-base:
+    -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+  --tiger-primitive-font-family-mono:
+    'SF Mono', Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
+  --tiger-primitive-font-size-xs: 12px;
+  --tiger-primitive-font-size-sm: 14px;
+  --tiger-primitive-font-size-base: 16px;
+  --tiger-primitive-font-size-lg: 18px;
+  --tiger-primitive-font-size-xl: 20px;
+  --tiger-primitive-font-size-2xl: 24px;
+  --tiger-primitive-font-size-3xl: 30px;
+  --tiger-primitive-font-size-4xl: 36px;
+  --tiger-primitive-font-weight-normal: 400;
+  --tiger-primitive-font-weight-medium: 500;
+  --tiger-primitive-font-weight-semibold: 600;
+  --tiger-primitive-font-weight-bold: 700;
+  --tiger-primitive-font-lh-tight: 1.25;
+  --tiger-primitive-font-lh-normal: 1.5;
+  --tiger-primitive-font-lh-relaxed: 1.625;
+  --tiger-primitive-font-lh-loose: 2;
+  --tiger-primitive-duration-fast: 100ms;
+  --tiger-primitive-duration-base: 200ms;
+  --tiger-primitive-duration-slow: 300ms;
+  --tiger-primitive-duration-slower: 500ms;
+  --tiger-primitive-easing-in: cubic-bezier(0.4, 0, 1, 1);
+  --tiger-primitive-easing-out: cubic-bezier(0, 0, 0.2, 1);
+  --tiger-primitive-easing-in-out: cubic-bezier(0.4, 0, 0.2, 1);
+  --tiger-primitive-easing-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
+  --tiger-primitive-easing-smooth: cubic-bezier(0.25, 0.1, 0.25, 1);
+
+  /* Semantic tokens */
+  --tiger-semantic-color-bg-primary: #f0f9ff;
+  --tiger-semantic-color-bg-secondary: #fafafa;
+  --tiger-semantic-color-bg-success: #f0fdf4;
+  --tiger-semantic-color-bg-warning: #fffbeb;
+  --tiger-semantic-color-bg-error: #fef2f2;
+  --tiger-semantic-color-bg-info: #eff6ff;
+  --tiger-semantic-color-bg-surface: #fafafa;
+  --tiger-semantic-color-bg-surface-raised: #ffffff;
+  --tiger-semantic-color-bg-overlay: rgba(0, 0, 0, 0.45);
+  --tiger-semantic-color-text-primary: #0a0a0a;
+  --tiger-semantic-color-text-secondary: #525252;
+  --tiger-semantic-color-text-tertiary: #a3a3a3;
+  --tiger-semantic-color-text-disabled: #d4d4d4;
+  --tiger-semantic-color-text-inverse: #ffffff;
+  --tiger-semantic-color-text-link: #0284c7;
+  --tiger-semantic-color-text-link-hover: #0369a1;
+  --tiger-semantic-color-text-success: #15803d;
+  --tiger-semantic-color-text-warning: #b45309;
+  --tiger-semantic-color-text-error: #dc2626;
+  --tiger-semantic-color-border-default: #e5e5e5;
+  --tiger-semantic-color-border-strong: #a3a3a3;
+  --tiger-semantic-color-border-focus: #0ea5e9;
+  --tiger-semantic-color-border-error: #ef4444;
+  --tiger-semantic-color-border-success: #22c55e;
+  --tiger-semantic-color-icon-primary: #404040;
+  --tiger-semantic-color-icon-secondary: #a3a3a3;
+  --tiger-semantic-color-icon-disabled: #d4d4d4;
+  --tiger-semantic-color-interactive-primary: #0284c7;
+  --tiger-semantic-color-interactive-primary-hover: #0369a1;
+  --tiger-semantic-color-interactive-primary-active: #075985;
+  --tiger-semantic-color-interactive-secondary: #475569;
+  --tiger-semantic-color-interactive-secondary-hover: #334155;
+  --tiger-semantic-color-interactive-danger: #dc2626;
+  --tiger-semantic-color-interactive-danger-hover: #b91c1c;
+  --tiger-semantic-color-focus-ring: #0ea5e9;
+  --tiger-semantic-space-component-gap: 8px;
+  --tiger-semantic-space-section-gap: 24px;
+  --tiger-semantic-space-page-padding: 32px;
+  --tiger-semantic-radius-component: 8px;
+  --tiger-semantic-radius-card: 12px;
+  --tiger-semantic-radius-pill: 9999px;
+
+  /* Component tokens */
+  --tiger-component-button-height-sm: 32px;
+  --tiger-component-button-height-md: 36px;
+  --tiger-component-button-height-lg: 40px;
+  --tiger-component-button-padding-x-sm: 8px;
+  --tiger-component-button-padding-x-md: 16px;
+  --tiger-component-button-padding-x-lg: 24px;
+  --tiger-component-button-border-radius: 8px;
+  --tiger-component-button-font-size-sm: 14px;
+  --tiger-component-button-font-size-md: 16px;
+  --tiger-component-button-font-size-lg: 18px;
+  --tiger-component-button-font-weight: 500;
+  --tiger-component-input-height-sm: 32px;
+  --tiger-component-input-height-md: 36px;
+  --tiger-component-input-height-lg: 40px;
+  --tiger-component-input-padding-x: 16px;
+  --tiger-component-input-border-radius: 8px;
+  --tiger-component-input-font-size: 16px;
+  --tiger-component-input-border-color: #e5e5e5;
+  --tiger-component-input-border-color-focus: #0ea5e9;
+  --tiger-component-input-border-color-error: #ef4444;
+  --tiger-component-select-height-sm: 32px;
+  --tiger-component-select-height-md: 36px;
+  --tiger-component-select-height-lg: 40px;
+  --tiger-component-select-padding-x: 16px;
+  --tiger-component-select-border-radius: 8px;
+  --tiger-component-select-dropdown-shadow:
+    0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
+  --tiger-component-select-option-height: 36px;
+  --tiger-component-select-option-padding-x: 16px;
+  --tiger-component-modal-border-radius: 12px;
+  --tiger-component-modal-padding: 24px;
+  --tiger-component-modal-shadow:
+    0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
+  --tiger-component-modal-header-font-size: 18px;
+  --tiger-component-modal-header-font-weight: 600;
+  --tiger-component-modal-overlay-bg: rgba(0, 0, 0, 0.45);
+  --tiger-component-modal-width-sm: 400px;
+  --tiger-component-modal-width-md: 520px;
+  --tiger-component-modal-width-lg: 680px;
+  --tiger-component-modal-width-xl: 860px;
+  --tiger-component-drawer-padding: 24px;
+  --tiger-component-drawer-shadow:
+    0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
+  --tiger-component-drawer-header-font-size: 18px;
+  --tiger-component-drawer-header-font-weight: 600;
+  --tiger-component-drawer-overlay-bg: rgba(0, 0, 0, 0.45);
+  --tiger-component-drawer-width-sm: 256px;
+  --tiger-component-drawer-width-md: 378px;
+  --tiger-component-drawer-width-lg: 520px;
+  --tiger-component-drawer-width-xl: 680px;
+  --tiger-component-card-border-radius: 12px;
+  --tiger-component-card-padding: 24px;
+  --tiger-component-card-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);
+  --tiger-component-card-border-color: #e5e5e5;
+  --tiger-component-badge-font-size: 12px;
+  --tiger-component-badge-font-weight: 500;
+  --tiger-component-badge-padding-x: 8px;
+  --tiger-component-badge-border-radius: 9999px;
+  --tiger-component-avatar-size-sm: 32px;
+  --tiger-component-avatar-size-md: 40px;
+  --tiger-component-avatar-size-lg: 48px;
+  --tiger-component-avatar-size-xl: 64px;
+  --tiger-component-avatar-border-radius: 9999px;
+  --tiger-component-avatar-font-size-sm: 12px;
+  --tiger-component-avatar-font-size-md: 14px;
+  --tiger-component-avatar-font-size-lg: 16px;
+  --tiger-component-table-header-bg: #fafafa;
+  --tiger-component-table-header-font-weight: 600;
+  --tiger-component-table-cell-padding-x: 16px;
+  --tiger-component-table-cell-padding-y-sm: 8px;
+  --tiger-component-table-cell-padding-y-md: 16px;
+  --tiger-component-table-cell-padding-y-lg: 24px;
+  --tiger-component-table-border-color: #e5e5e5;
+  --tiger-component-table-stripe-bg: #fafafa;
+  --tiger-component-table-hover-bg: #f0f9ff;
+  --tiger-component-tooltip-bg: #262626;
+  --tiger-component-tooltip-text-color: #ffffff;
+  --tiger-component-tooltip-font-size: 14px;
+  --tiger-component-tooltip-padding-x: 8px;
+  --tiger-component-tooltip-padding-y: 4px;
+  --tiger-component-tooltip-border-radius: 8px;
+  --tiger-component-tooltip-shadow:
+    0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
+  --tiger-component-tooltip-max-width: 280px;
+  --tiger-component-alert-border-radius: 8px;
+  --tiger-component-alert-padding-x: 16px;
+  --tiger-component-alert-padding-y: 16px;
+  --tiger-component-alert-font-size: 16px;
+  --tiger-component-alert-icon-size: 20px;
+  --tiger-component-tabs-height: 40px;
+  --tiger-component-tabs-font-size: 16px;
+  --tiger-component-tabs-font-weight-active: 500;
+  --tiger-component-tabs-indicator-height: 2px;
+  --tiger-component-tabs-gap: 24px;
+  --tiger-component-pagination-item-size: 32px;
+  --tiger-component-pagination-font-size: 14px;
+  --tiger-component-pagination-border-radius: 8px;
+  --tiger-component-pagination-gap: 4px;
+  --tiger-component-tag-height-sm: 22px;
+  --tiger-component-tag-height-md: 26px;
+  --tiger-component-tag-height-lg: 32px;
+  --tiger-component-tag-padding-x: 8px;
+  --tiger-component-tag-font-size: 12px;
+  --tiger-component-tag-border-radius: 6px;
+  --tiger-component-progress-height-sm: 4px;
+  --tiger-component-progress-height-md: 8px;
+  --tiger-component-progress-height-lg: 12px;
+  --tiger-component-progress-border-radius: 9999px;
+  --tiger-component-progress-track-bg: #e5e5e5;
+  --tiger-component-skeleton-bg: #e5e5e5;
+  --tiger-component-skeleton-shimmer-bg: #f5f5f5;
+  --tiger-component-skeleton-border-radius: 8px;
+  --tiger-component-divider-color: #e5e5e5;
+  --tiger-component-divider-text-padding: 16px;
+  --tiger-component-collapse-header-padding-x: 16px;
+  --tiger-component-collapse-header-padding-y: 16px;
+  --tiger-component-collapse-content-padding: 16px;
+  --tiger-component-collapse-border-color: #e5e5e5;
+  --tiger-component-steps-icon-size: 32px;
+  --tiger-component-steps-font-size: 16px;
+  --tiger-component-steps-connector-width: 1px;
+  --tiger-component-breadcrumb-font-size: 14px;
+  --tiger-component-breadcrumb-separator-margin: 8px;
+  --tiger-component-dropdown-min-width: 120px;
+  --tiger-component-dropdown-padding-y: 4px;
+  --tiger-component-dropdown-item-height: 36px;
+  --tiger-component-dropdown-item-padding-x: 16px;
+  --tiger-component-dropdown-border-radius: 12px;
+  --tiger-component-dropdown-shadow:
+    0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
+  --tiger-component-menu-item-height: 40px;
+  --tiger-component-menu-item-padding-x: 16px;
+  --tiger-component-menu-group-title-padding: 8px;
+  --tiger-component-menu-indent-width: 24px;
+  --tiger-component-menu-border-radius: 8px;
+  --tiger-component-notification-width: 384px;
+  --tiger-component-notification-padding: 16px;
+  --tiger-component-notification-border-radius: 12px;
+  --tiger-component-notification-shadow:
+    0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
+  --tiger-component-notification-title-font-size: 16px;
+  --tiger-component-notification-title-font-weight: 500;
+  --tiger-component-popover-padding: 16px;
+  --tiger-component-popover-border-radius: 12px;
+  --tiger-component-popover-shadow:
+    0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
+  --tiger-component-popover-max-width: 320px;
+
+  /* Compatibility variables */
+  --tiger-color-primary-50: #f0f9ff;
+  --tiger-color-primary-100: #e0f2fe;
+  --tiger-color-primary-200: #bae6fd;
+  --tiger-color-primary-300: #7dd3fc;
+  --tiger-color-primary-400: #38bdf8;
+  --tiger-color-primary-500: #0ea5e9;
+  --tiger-color-primary-600: #0284c7;
+  --tiger-color-primary-700: #0369a1;
+  --tiger-color-primary-800: #075985;
+  --tiger-color-primary-950: #0c3d66;
+  --tiger-color-secondary-50: #f8fafc;
+  --tiger-color-secondary-100: #f1f5f9;
+  --tiger-color-secondary-200: #e2e8f0;
+  --tiger-color-secondary-300: #cbd5e1;
+  --tiger-color-secondary-400: #94a3b8;
+  --tiger-color-secondary-500: #64748b;
+  --tiger-color-secondary-600: #475569;
+  --tiger-color-secondary-700: #334155;
+  --tiger-color-secondary-800: #1e293b;
+  --tiger-color-secondary-950: #0f172a;
+  --tiger-color-success-50: #f0fdf4;
+  --tiger-color-success-100: #dcfce7;
+  --tiger-color-success-200: #bbf7d0;
+  --tiger-color-success-300: #86efac;
+  --tiger-color-success-400: #4ade80;
+  --tiger-color-success-500: #22c55e;
+  --tiger-color-success-600: #16a34a;
+  --tiger-color-success-700: #15803d;
+  --tiger-color-success-800: #166534;
+  --tiger-color-success-950: #052e16;
+  --tiger-color-warning-50: #fffbeb;
+  --tiger-color-warning-100: #fef3c7;
+  --tiger-color-warning-200: #fde68a;
+  --tiger-color-warning-300: #fcd34d;
+  --tiger-color-warning-400: #fbbf24;
+  --tiger-color-warning-500: #f59e0b;
+  --tiger-color-warning-600: #d97706;
+  --tiger-color-warning-700: #b45309;
+  --tiger-color-warning-800: #92400e;
+  --tiger-color-warning-950: #451a03;
+  --tiger-color-error-50: #fef2f2;
+  --tiger-color-error-100: #fee2e2;
+  --tiger-color-error-200: #fecaca;
+  --tiger-color-error-300: #fca5a5;
+  --tiger-color-error-400: #f87171;
+  --tiger-color-error-500: #ef4444;
+  --tiger-color-error-600: #dc2626;
+  --tiger-color-error-700: #b91c1c;
+  --tiger-color-error-800: #991b1b;
+  --tiger-color-error-950: #450a0a;
+  --tiger-color-info-50: #eff6ff;
+  --tiger-color-info-100: #dbeafe;
+  --tiger-color-info-200: #bfdbfe;
+  --tiger-color-info-300: #93c5fd;
+  --tiger-color-info-400: #60a5fa;
+  --tiger-color-info-500: #3b82f6;
+  --tiger-color-info-600: #2563eb;
+  --tiger-color-info-700: #1d4ed8;
+  --tiger-color-info-800: #1e40af;
+  --tiger-color-info-950: #172554;
+  --tiger-color-neutral-50: #fafafa;
+  --tiger-color-neutral-100: #f5f5f5;
+  --tiger-color-neutral-200: #e5e5e5;
+  --tiger-color-neutral-300: #d4d4d4;
+  --tiger-color-neutral-400: #a3a3a3;
+  --tiger-color-neutral-500: #737373;
+  --tiger-color-neutral-600: #525252;
+  --tiger-color-neutral-700: #404040;
+  --tiger-color-neutral-800: #262626;
+  --tiger-color-neutral-950: #0a0a0a;
+  --tiger-space-xs: 2px;
+  --tiger-space-sm: 4px;
+  --tiger-space-md: 8px;
+  --tiger-space-lg: 16px;
+  --tiger-space-xl: 24px;
+  --tiger-space-2xl: 32px;
+  --tiger-space-3xl: 48px;
+  --tiger-space-4xl: 64px;
+  --tiger-radius-none: 0;
+  --tiger-radius-sm: 2px;
+  --tiger-radius-md: 4px;
+  --tiger-radius-lg: 8px;
+  --tiger-radius-xl: 12px;
+  --tiger-radius-full: 9999px;
+  --tiger-shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
+  --tiger-shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);
+  --tiger-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
+  --tiger-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
+  --tiger-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
+  --tiger-font-family-base:
+    -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+  --tiger-font-family-mono:
+    'SF Mono', Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
+  --tiger-font-size-xs: 12px;
+  --tiger-font-size-sm: 14px;
+  --tiger-font-size-base: 16px;
+  --tiger-font-size-lg: 18px;
+  --tiger-font-size-xl: 20px;
+  --tiger-font-size-2xl: 24px;
+  --tiger-font-size-3xl: 30px;
+  --tiger-font-size-4xl: 36px;
+  --tiger-font-weight-normal: 400;
+  --tiger-font-weight-medium: 500;
+  --tiger-font-weight-semibold: 600;
+  --tiger-font-weight-bold: 700;
+  --tiger-font-lh-tight: 1.25;
+  --tiger-font-lh-normal: 1.5;
+  --tiger-font-lh-relaxed: 1.625;
+  --tiger-font-lh-loose: 2;
+  --tiger-duration-fast: 100ms;
+  --tiger-duration-base: 200ms;
+  --tiger-duration-slow: 300ms;
+  --tiger-duration-slower: 500ms;
+  --tiger-easing-in: cubic-bezier(0.4, 0, 1, 1);
+  --tiger-easing-out: cubic-bezier(0, 0, 0.2, 1);
+  --tiger-easing-in-out: cubic-bezier(0.4, 0, 0.2, 1);
+  --tiger-easing-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
+  --tiger-easing-smooth: cubic-bezier(0.25, 0.1, 0.25, 1);
+  --tiger-color-bg-primary: #f0f9ff;
+  --tiger-color-bg-secondary: #fafafa;
+  --tiger-color-bg-success: #f0fdf4;
+  --tiger-color-bg-warning: #fffbeb;
+  --tiger-color-bg-error: #fef2f2;
+  --tiger-color-bg-info: #eff6ff;
+  --tiger-color-bg-surface: #fafafa;
+  --tiger-color-bg-surface-raised: #ffffff;
+  --tiger-color-bg-overlay: rgba(0, 0, 0, 0.45);
+  --tiger-color-text-primary: #0a0a0a;
+  --tiger-color-text-secondary: #525252;
+  --tiger-color-text-tertiary: #a3a3a3;
+  --tiger-color-text-disabled: #d4d4d4;
+  --tiger-color-text-inverse: #ffffff;
+  --tiger-color-text-link: #0284c7;
+  --tiger-color-text-link-hover: #0369a1;
+  --tiger-color-text-success: #15803d;
+  --tiger-color-text-warning: #b45309;
+  --tiger-color-text-error: #dc2626;
+  --tiger-color-border-default: #e5e5e5;
+  --tiger-color-border-strong: #a3a3a3;
+  --tiger-color-border-focus: #0ea5e9;
+  --tiger-color-border-error: #ef4444;
+  --tiger-color-border-success: #22c55e;
+  --tiger-color-icon-primary: #404040;
+  --tiger-color-icon-secondary: #a3a3a3;
+  --tiger-color-icon-disabled: #d4d4d4;
+  --tiger-color-interactive-primary: #0284c7;
+  --tiger-color-interactive-primary-hover: #0369a1;
+  --tiger-color-interactive-primary-active: #075985;
+  --tiger-color-interactive-secondary: #475569;
+  --tiger-color-interactive-secondary-hover: #334155;
+  --tiger-color-interactive-danger: #dc2626;
+  --tiger-color-interactive-danger-hover: #b91c1c;
+  --tiger-color-focus-ring: #0ea5e9;
+  --tiger-space-component-gap: 8px;
+  --tiger-space-section-gap: 24px;
+  --tiger-space-page-padding: 32px;
+  --tiger-radius-component: 8px;
+  --tiger-radius-card: 12px;
+  --tiger-radius-pill: 9999px;
+  --tiger-button-height-sm: 32px;
+  --tiger-button-height-md: 36px;
+  --tiger-button-height-lg: 40px;
+  --tiger-button-padding-x-sm: 8px;
+  --tiger-button-padding-x-md: 16px;
+  --tiger-button-padding-x-lg: 24px;
+  --tiger-button-border-radius: 8px;
+  --tiger-button-font-size-sm: 14px;
+  --tiger-button-font-size-md: 16px;
+  --tiger-button-font-size-lg: 18px;
+  --tiger-button-font-weight: 500;
+  --tiger-input-height-sm: 32px;
+  --tiger-input-height-md: 36px;
+  --tiger-input-height-lg: 40px;
+  --tiger-input-padding-x: 16px;
+  --tiger-input-border-radius: 8px;
+  --tiger-input-font-size: 16px;
+  --tiger-input-border-color: #e5e5e5;
+  --tiger-input-border-color-focus: #0ea5e9;
+  --tiger-input-border-color-error: #ef4444;
+  --tiger-select-height-sm: 32px;
+  --tiger-select-height-md: 36px;
+  --tiger-select-height-lg: 40px;
+  --tiger-select-padding-x: 16px;
+  --tiger-select-border-radius: 8px;
+  --tiger-select-dropdown-shadow:
+    0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
+  --tiger-select-option-height: 36px;
+  --tiger-select-option-padding-x: 16px;
+  --tiger-modal-border-radius: 12px;
+  --tiger-modal-padding: 24px;
+  --tiger-modal-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
+  --tiger-modal-header-font-size: 18px;
+  --tiger-modal-header-font-weight: 600;
+  --tiger-modal-overlay-bg: rgba(0, 0, 0, 0.45);
+  --tiger-modal-width-sm: 400px;
+  --tiger-modal-width-md: 520px;
+  --tiger-modal-width-lg: 680px;
+  --tiger-modal-width-xl: 860px;
+  --tiger-drawer-padding: 24px;
+  --tiger-drawer-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
+  --tiger-drawer-header-font-size: 18px;
+  --tiger-drawer-header-font-weight: 600;
+  --tiger-drawer-overlay-bg: rgba(0, 0, 0, 0.45);
+  --tiger-drawer-width-sm: 256px;
+  --tiger-drawer-width-md: 378px;
+  --tiger-drawer-width-lg: 520px;
+  --tiger-drawer-width-xl: 680px;
+  --tiger-card-border-radius: 12px;
+  --tiger-card-padding: 24px;
+  --tiger-card-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);
+  --tiger-card-border-color: #e5e5e5;
+  --tiger-badge-font-size: 12px;
+  --tiger-badge-font-weight: 500;
+  --tiger-badge-padding-x: 8px;
+  --tiger-badge-border-radius: 9999px;
+  --tiger-avatar-size-sm: 32px;
+  --tiger-avatar-size-md: 40px;
+  --tiger-avatar-size-lg: 48px;
+  --tiger-avatar-size-xl: 64px;
+  --tiger-avatar-border-radius: 9999px;
+  --tiger-avatar-font-size-sm: 12px;
+  --tiger-avatar-font-size-md: 14px;
+  --tiger-avatar-font-size-lg: 16px;
+  --tiger-table-header-bg: #fafafa;
+  --tiger-table-header-font-weight: 600;
+  --tiger-table-cell-padding-x: 16px;
+  --tiger-table-cell-padding-y-sm: 8px;
+  --tiger-table-cell-padding-y-md: 16px;
+  --tiger-table-cell-padding-y-lg: 24px;
+  --tiger-table-border-color: #e5e5e5;
+  --tiger-table-stripe-bg: #fafafa;
+  --tiger-table-hover-bg: #f0f9ff;
+  --tiger-tooltip-bg: #262626;
+  --tiger-tooltip-text-color: #ffffff;
+  --tiger-tooltip-font-size: 14px;
+  --tiger-tooltip-padding-x: 8px;
+  --tiger-tooltip-padding-y: 4px;
+  --tiger-tooltip-border-radius: 8px;
+  --tiger-tooltip-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
+  --tiger-tooltip-max-width: 280px;
+  --tiger-alert-border-radius: 8px;
+  --tiger-alert-padding-x: 16px;
+  --tiger-alert-padding-y: 16px;
+  --tiger-alert-font-size: 16px;
+  --tiger-alert-icon-size: 20px;
+  --tiger-tabs-height: 40px;
+  --tiger-tabs-font-size: 16px;
+  --tiger-tabs-font-weight-active: 500;
+  --tiger-tabs-indicator-height: 2px;
+  --tiger-tabs-gap: 24px;
+  --tiger-pagination-item-size: 32px;
+  --tiger-pagination-font-size: 14px;
+  --tiger-pagination-border-radius: 8px;
+  --tiger-pagination-gap: 4px;
+  --tiger-tag-height-sm: 22px;
+  --tiger-tag-height-md: 26px;
+  --tiger-tag-height-lg: 32px;
+  --tiger-tag-padding-x: 8px;
+  --tiger-tag-font-size: 12px;
+  --tiger-tag-border-radius: 6px;
+  --tiger-progress-height-sm: 4px;
+  --tiger-progress-height-md: 8px;
+  --tiger-progress-height-lg: 12px;
+  --tiger-progress-border-radius: 9999px;
+  --tiger-progress-track-bg: #e5e5e5;
+  --tiger-skeleton-bg: #e5e5e5;
+  --tiger-skeleton-shimmer-bg: #f5f5f5;
+  --tiger-skeleton-border-radius: 8px;
+  --tiger-divider-color: #e5e5e5;
+  --tiger-divider-text-padding: 16px;
+  --tiger-collapse-header-padding-x: 16px;
+  --tiger-collapse-header-padding-y: 16px;
+  --tiger-collapse-content-padding: 16px;
+  --tiger-collapse-border-color: #e5e5e5;
+  --tiger-steps-icon-size: 32px;
+  --tiger-steps-font-size: 16px;
+  --tiger-steps-connector-width: 1px;
+  --tiger-breadcrumb-font-size: 14px;
+  --tiger-breadcrumb-separator-margin: 8px;
+  --tiger-dropdown-min-width: 120px;
+  --tiger-dropdown-padding-y: 4px;
+  --tiger-dropdown-item-height: 36px;
+  --tiger-dropdown-item-padding-x: 16px;
+  --tiger-dropdown-border-radius: 12px;
+  --tiger-dropdown-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
+  --tiger-menu-item-height: 40px;
+  --tiger-menu-item-padding-x: 16px;
+  --tiger-menu-group-title-padding: 8px;
+  --tiger-menu-indent-width: 24px;
+  --tiger-menu-border-radius: 8px;
+  --tiger-notification-width: 384px;
+  --tiger-notification-padding: 16px;
+  --tiger-notification-border-radius: 12px;
+  --tiger-notification-shadow:
+    0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
+  --tiger-notification-title-font-size: 16px;
+  --tiger-notification-title-font-weight: 500;
+  --tiger-popover-padding: 16px;
+  --tiger-popover-border-radius: 12px;
+  --tiger-popover-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
+  --tiger-popover-max-width: 320px;
+
+  /* Legacy variables (backward-compat with pre-0.5.0) */
+  --tiger-primary: var(--tiger-color-primary-600);
+  --tiger-primary-hover: var(--tiger-color-primary-700);
+  --tiger-primary-active: var(--tiger-color-primary-800);
+  --tiger-primary-disabled: var(--tiger-color-primary-300);
+  --tiger-secondary: var(--tiger-color-secondary-600);
+  --tiger-secondary-hover: var(--tiger-color-secondary-700);
+  --tiger-secondary-active: var(--tiger-color-secondary-800);
+  --tiger-secondary-disabled: var(--tiger-color-secondary-300);
+  --tiger-focus-ring: var(--tiger-color-focus-ring);
+  --tiger-surface: var(--tiger-color-bg-surface);
+  --tiger-outline-bg-hover: var(--tiger-color-primary-50);
+  --tiger-ghost-bg-hover: var(--tiger-color-primary-50);
+}
+
+.dark {
+  color-scheme: dark;
+}