:root {
  --green: #00a862;
  --green-deep: #00784a;
  --slate: #16232e;
  --ink: #1b2733;
  --val: #41535f;
  --muted: #6a7a86;
  --line: #e6ebee;
  --surface: #ffffff;
  --search-bg: #26333f;
  --search-line: #33424e;
  --nav-link: #cdd7de;
  --on-slate: #ffffff;
  --best-bg: rgba(0, 168, 98, 0.13);
  --best-ink: #00693f;
  --worst-bg: rgba(214, 64, 64, 0.1);
  --worst-ink: #b23636;
  --zebra: #f6f8f9;
  --zebra-lbl: #eef2f4;
  --cat-bg: #d3dde3;
  --cat-rule: #8a9aa6;
  --ad-line: #c9d3d9;
  --ad-ink: #9aa8b1;
}

[data-theme="dark"] {
  --green: #12c074;
  --green-deep: #12c074;
  --slate: #0e171e;
  --ink: #e8edf0;
  --val: #aebac3;
  --muted: #7d8c96;
  --line: #28353f;
  --surface: #121b22;
  --best-ink: #2fd68f;
  --worst-ink: #e07b7b;
  --zebra: #17222b;
  --zebra-lbl: #1a2630;
  --cat-bg: #22303b;
  --cat-rule: #3d4f5d;
  --ad-line: #33424e;
  --ad-ink: #6a7a86;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]):not([data-theme="dark"]) {
    --green: #12c074;
    --green-deep: #12c074;
    --slate: #0e171e;
    --ink: #e8edf0;
    --val: #aebac3;
    --muted: #7d8c96;
    --line: #28353f;
    --surface: #121b22;
    --best-ink: #2fd68f;
    --worst-ink: #e07b7b;
    --zebra: #17222b;
    --zebra-lbl: #1a2630;
    --cat-bg: #22303b;
    --cat-rule: #3d4f5d;
    --ad-line: #33424e;
    --ad-ink: #6a7a86;
  }
}