:root {
  color-scheme: light;
  --canvas: #f3eee5;
  --page: #fcfaf6;
  --surface: #fff;
  --soft: #f5f1e9;
  --line: #e5ded2;
  --ink: #202d25;
  --muted: #637066;
  --green: #08783f;
  --green-soft: #e9f3e9;
  --shadow: 0 8px 40px #3227110a;
  --header-height: 76px;
  --top-height: 28px;
  font-family: "Segoe UI", sans-serif;
  font-synthesis: none;
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --canvas: #101713;
  --page: #162019;
  --surface: #1b281f;
  --soft: #223027;
  --line: #34463a;
  --ink: #eff4ee;
  --muted: #b0bfb2;
  --green: #75d49a;
  --green-soft: #263f30;
  --shadow: 0 8px 40px #0002;
}