:root {
  --bg: #FFFFFF;
  --surface: #F9F9F9;
  --surface-2: #2C363C;
  --text: #444444;
  --muted: #7A7A7A;
  --border: #E5E5E5;

  --brand: #FF6300;
  --brand-2: #E13833;
  --brand-grad: linear-gradient(135deg, var(--brand), var(--brand-2));

  --shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
  --shadow-hover: 0 15px 35px rgba(0, 0, 0, 0.12);
  --radius: 8px;
  --radius-sm: 4px;

  --container: 1120px;
}

@media (prefers-color-scheme: light) {
  /* We keep the same variables to lock the brand colors regardless of system settings unless dark mode is distinctly requested. */
  :root {
    --bg: #FFFFFF;
    --surface: #F9F9F9;
    --surface-2: #2C363C;
    --text: #444444;
    --muted: #7A7A7A;
    --border: #E5E5E5;
    --shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
  }
}