:root {
  --font: 'Segoe UI', system-ui, -apple-system, sans-serif;

  --color-bg: #f5f5f5;
  --color-surface: #ffffff;
  --color-text: #1a1a1a;
  --color-text-secondary: #666666;
  --color-primary: #e74c3c;
  --color-primary-hover: #c0392b;
  --color-primary-light: #fde8e8;
  --color-secondary: #f0f0f0;
  --color-secondary-hover: #e0e0e0;
  --color-ring-bg: #e0e0e0;
  --color-ring-progress: #e74c3c;
  --color-success: #27ae60;
  --color-danger: #e74c3c;
  --color-bar: #3498db;
  --color-break-long: #8e44ad;

  --radius: 12px;
  --radius-sm: 8px;
  --radius-full: 9999px;

  --shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.12);

  --transition: 0.2s ease;
  --logo-shine: #ff6b6b;
  --logo-mid: #e74c3c;
  --logo-dark: #c0392b;

  --max-width: 480px;
}

[data-theme="dark"] {
  --color-bg: #1a1a2e;
  --color-surface: #16213e;
  --color-text: #eaeaea;
  --color-text-secondary: #a0a0b0;
  --color-primary: #e74c3c;
  --color-primary-hover: #ff6b6b;
  --color-primary-light: #2d1b1b;
  --color-secondary: #2a2a4a;
  --color-secondary-hover: #3a3a5a;
  --color-ring-bg: #2a2a4a;
  --color-ring-progress: #e74c3c;
  --color-success: #2ecc71;
  --color-danger: #e74c3c;
  --color-bar: #3498db;
  --color-break-long: #9b59b6;
  --logo-shine: #c0392b;
  --logo-mid: #a93226;
  --logo-dark: #7b241c;

  --shadow: 0 2px 12px rgba(0, 0, 0, 0.3);
  --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.4);
}