:root {
  --primary: #000000;
  --primary-dark: #000000;
  --primary-light: #f5f5f5;
  --secondary: #4f46e5;
  --secondary-dark: #4338ca;
  --secondary-light: #eef2ff;
  --text-dark: #000000;
  --text-medium: #525252;
  --text-light: #a3a3a3;
  --bg-white: #ffffff;
  --bg-gray: #fafafa;
  --bg-gray-light: #f5f5f5;
  --border-gray: #e5e5e5;
  --border-dark: #e5e5e5;
  
  /* Consistent Border Radius System */
  --border-radius-xs: 2px;
  --border-radius-sm: 4px;
  --border-radius: 8px;
  --border-radius-lg: 12px;
  --border-radius-xl: 16px;
  
  /* Animation System */
  --transition-fast: all 0.15s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-normal: all 0.2s ease;
  --transition-slow: all 0.3s ease;
  
  /* Legacy support */
  --border-radius: var(--border-radius);
  --transition: var(--transition-fast);
}

.primary {
  color: var(--primary);
}

.secondary {
  color: var(--secondary);
}