:root {
  color-scheme: light;
  --font-sans: "Microsoft JhengHei", "Noto Sans TC", Arial, sans-serif;
  --color-ink: #172426;
  --color-muted: #607073;
  --color-subtle: #839093;
  --color-canvas: #f4f7f7;
  --color-surface: #ffffff;
  --color-surface-alt: #eef3f3;
  --color-border: #d7e0e0;
  --color-border-strong: #bac8c8;
  --color-sidebar: #1b2a2d;
  --color-sidebar-hover: #263b3e;
  --color-sidebar-active: #315153;
  --color-primary: #0f766e;
  --color-primary-hover: #0b5f59;
  --color-primary-soft: #dff3ef;
  --color-blue: #2563a6;
  --color-blue-soft: #e6f0fb;
  --color-warning: #a45b08;
  --color-warning-soft: #fff2d6;
  --color-danger: #b4232f;
  --color-danger-soft: #fde9eb;
  --color-success: #1d7a47;
  --color-success-soft: #e3f4e9;
  --color-neutral-soft: #edf1f1;
  --shadow-panel: 0 1px 2px rgba(23, 36, 38, 0.07);
  --radius-sm: 4px;
  --radius-md: 6px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --control-height: 42px;
  --sidebar-width: 252px;
  --topbar-height: 72px;
}