:root {
  --color-primary: #667eea;
        --color-primary-dark: #5a67d8;
        --color-secondary: #764ba2;
        --color-accent: #f59e0b;
        --gradient-primary: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
        --color-primary-rgb: 102, 126, 234;
        --color-secondary-rgb: 118, 75, 162;
        --color-primary-dark-rgb: 90, 103, 216;
        --gradient-primary-subtle: linear-gradient(135deg, rgba(102, 126, 234, 0.1) 0%, rgba(118, 75, 162, 0.1) 100%);
        --surface-page: #f0f2f5;
        --surface-card: #ffffff;
        --surface-input: #ffffff;
        --surface-muted: #f8f9fa;
        --text-body: #222222;
        --text-heading: #222222;
        --text-muted: #666666;
        --border-soft: #e0e0e0;
        --shadow-card-color: rgba(0, 0, 0, 0.08);
        --on-primary: #ffffff;
        --font-body: 'Inter', sans-serif;
        --font-heading: 'Inter', sans-serif;
}