:root {
  /* Brand */
  --brand-red: #e53935;

  /* Light mode */
  --bg: #f7f7f8;
  --surface: #ffffff;
  --text: #111111;
  --muted: #666666;
  --border: #dddddd;

  /* UI */
  --radius: 8px;
  --shadow: 0 2px 8px rgba(0, 0, 0, 0.06);

  /* Type scale */
  --text-xl: clamp(36px, 4vw, 56px);
  --text-lg: clamp(22px, 2.4vw, 28px);
  --text-md: 18px;
  --text-sm: 15px;
}

[data-theme="dark"] {
  --bg: #0e0e10;
  --surface: #16161a;
  --text: #f2f2f2;
  --muted: #9a9a9a;
  --border: #2a2a2a;

  --shadow: 0 2px 10px rgba(0, 0, 0, 0.4);
}