:root {
  color-scheme: light;
  --surface: #e9e9e5;
  --surface-raised: #f6f6f2;
  --surface-sunk: #d5d6d1;
  --ink: #171916;
  --ink-muted: #62655f;
  --line: #b9bbb5;
  --brick: #86483f;
  --field: #66705e;
  --rail: #85877f;
  --quiet: #c9c8c0;
  --focus: #355f97;
  --shadow: 0 .5rem 2rem rgb(22 24 21 / .14);
}

[data-theme="dark"] {
  color-scheme: dark;
  --surface: #131512;
  --surface-raised: #1d201c;
  --surface-sunk: #292c27;
  --ink: #ecece5;
  --ink-muted: #adb0a8;
  --line: #3f443d;
  --brick: #c47a6f;
  --field: #98a38e;
  --rail: #a7aaa3;
  --quiet: #4a4d47;
  --focus: #8ab4ee;
  --shadow: 0 .5rem 2rem rgb(0 0 0 / .38);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --surface: #131512;
    --surface-raised: #1d201c;
    --surface-sunk: #292c27;
    --ink: #ecece5;
    --ink-muted: #adb0a8;
    --line: #3f443d;
    --brick: #c47a6f;
    --field: #98a38e;
    --rail: #a7aaa3;
    --quiet: #4a4d47;
    --focus: #8ab4ee;
    --shadow: 0 .5rem 2rem rgb(0 0 0 / .38);
  }
}