:root {
  color-scheme: light;
  --canvas: #f4f7fa;
  --surface: #ffffff;
  --surface-subtle: #eaf0f4;
  --sidebar: #102a43;
  --sidebar-hover: #173f5f;
  --sidebar-active: #e6f4f1;
  --text: #102a43;
  --muted: #52667a;
  --line: #cbd7e1;
  --accent: #0d7c74;
  --accent-dark: #075e59;
  --accent-soft: #e2f3f0;
  --success: #18794e;
  --success-bg: #e7f5ed;
  --warning: #8a4b08;
  --warning-bg: #fff3d6;
  --danger: #a61b1b;
  --danger-bg: #fce8e8;
  --info: #245a83;
  --info-bg: #e8f1f8;
  --focus: #d97706;
  --radius: 8px;
  --font: "Segoe UI", Arial, sans-serif;
}

@media (prefers-color-scheme: dark) {
  :root[data-theme="system"] {
    color-scheme: dark;
  }
}