/* Generated by scripts/build-tokens.py from design/tokens.json. Do not edit. */

/* Light: the page's light theme, chosen by data-light on <html>; Paper when none is. */
:root {
  --paper: #fbf9f3;
  --chrome: #f3efe6;
  --ink: #1f1b16;
  --muted: #6e665a;
  --rule: #e2ddd1;
  --accent: #8c3a2b;
  --code: #f0ece1;
  --code-string: #3e6a34;
  --code-number: #2d5e7e;
  --hover: rgba(31, 27, 22, 0.05);
  --selected: rgba(140, 58, 43, 0.1);
  --button: #000;
  --button-ink: #fff;
  --theme-font: "Newsreader", "Iowan Old Style", Charter, Georgia, serif;
}
:root[data-light="library"] {
  --paper: #f3f1e8;
  --chrome: #eceae1;
  --ink: #1f2a24;
  --muted: #5e6b62;
  --rule: #dad8cb;
  --accent: #2f5d46;
  --code: #e8e7de;
  --code-string: #3a6b3d;
  --code-number: #1c6589;
  --hover: rgba(31, 42, 36, 0.05);
  --selected: rgba(47, 93, 70, 0.1);
  --button: #000;
  --button-ink: #fff;
  --theme-font: "Literata", Georgia, serif;
}
:root[data-light="vellum"] {
  --paper: #f1e7d3;
  --chrome: #ebe1cd;
  --ink: #3a2e22;
  --muted: #6e5a45;
  --rule: #ddcfb4;
  --accent: #8a4f17;
  --code: #e8deca;
  --code-string: #356537;
  --code-number: #186286;
  --hover: rgba(58, 46, 34, 0.05);
  --selected: rgba(138, 79, 23, 0.1);
  --button: #000;
  --button-ink: #fff;
  --theme-font: "EB Garamond", Georgia, serif;
}
:root[data-light="slate"] {
  --paper: #f4f5f7;
  --chrome: #eceef0;
  --ink: #1c2230;
  --muted: #5f6778;
  --rule: #dcdfe5;
  --accent: #3b5ba9;
  --code: #e9eaed;
  --code-string: #3a6b3d;
  --code-number: #20688c;
  --hover: rgba(28, 34, 48, 0.05);
  --selected: rgba(59, 91, 169, 0.1);
  --button: #000;
  --button-ink: #fff;
  --theme-font: "IBM Plex Sans", system-ui, sans-serif;
}
:root[data-light="newsprint"] {
  --paper: #f7f7f4;
  --chrome: #efefec;
  --ink: #141414;
  --muted: #5c5c58;
  --rule: #deded8;
  --accent: #b3261e;
  --code: #ecece9;
  --code-string: #3d6e3f;
  --code-number: #20688c;
  --hover: rgba(20, 20, 20, 0.05);
  --selected: rgba(179, 38, 30, 0.1);
  --button: #000;
  --button-ink: #fff;
  --theme-font: "Source Serif 4", Georgia, serif;
}
:root[data-light="harbor"] {
  --paper: #f5f2ea;
  --chrome: #edebe4;
  --ink: #17263b;
  --muted: #56627a;
  --rule: #e0dacb;
  --accent: #1f5f8b;
  --code: #eae8e1;
  --code-string: #3a6b3d;
  --code-number: #20688c;
  --hover: rgba(23, 38, 59, 0.05);
  --selected: rgba(31, 95, 139, 0.1);
  --button: #000;
  --button-ink: #fff;
  --theme-font: "Lora", Georgia, serif;
}
:root[data-light="rosewood"] {
  --paper: #f8f0ee;
  --chrome: #f1e9e7;
  --ink: #2e1d20;
  --muted: #6e5558;
  --rule: #e8d8d5;
  --accent: #9b2f4e;
  --code: #eee5e4;
  --code-string: #3a6b3d;
  --code-number: #1c6589;
  --hover: rgba(46, 29, 32, 0.05);
  --selected: rgba(155, 47, 78, 0.1);
  --button: #000;
  --button-ink: #fff;
  --theme-font: "Crimson Pro", Georgia, serif;
}
:root[data-light="sunlit"] {
  --paper: #fff8e6;
  --chrome: #f8f1df;
  --ink: #2b2416;
  --muted: #6b5e44;
  --rule: #efe3c2;
  --accent: #9c5414;
  --code: #f4eddc;
  --code-string: #3d6e3f;
  --code-number: #236b8f;
  --hover: rgba(43, 36, 22, 0.05);
  --selected: rgba(156, 84, 20, 0.1);
  --button: #000;
  --button-ink: #fff;
  --theme-font: "Fraunces", Georgia, serif;
}
:root[data-light="clear"] {
  --paper: #ffffff;
  --chrome: #f6f6f6;
  --ink: #000000;
  --muted: #4a4a4a;
  --rule: #d9d9d9;
  --accent: #0050b3;
  --code: #f2f2f2;
  --code-string: #407142;
  --code-number: #236b8f;
  --hover: rgba(0, 0, 0, 0.05);
  --selected: rgba(0, 80, 179, 0.1);
  --button: #000;
  --button-ink: #fff;
  --theme-font: "Atkinson Hyperlegible", system-ui, sans-serif;
}

/* Dark: when the computer is, unless Settings says Light, or whenever Settings says Dark.
   The theme is data-dark on <html>; Lamplight when none is. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --paper: #221f1a;
    --chrome: #2a2621;
    --ink: #ede8df;
    --muted: #9a9184;
    --rule: #38332b;
    --accent: #ce7a5c;
    --code: #2c2822;
    --code-string: #a3c28e;
    --code-number: #8fb6cf;
    --hover: rgba(237, 232, 223, 0.06);
    --selected: rgba(206, 122, 92, 0.16);
    --button: #fff;
    --button-ink: #000;
    --theme-font: "Newsreader", "Iowan Old Style", Charter, Georgia, serif;
  }
  :root:not([data-theme="light"])[data-dark="midnight"] {
    --paper: #121722;
    --chrome: #1a1f2a;
    --ink: #dce3ee;
    --muted: #8892a3;
    --rule: #252d3b;
    --accent: #8fb3e8;
    --code: #1d222d;
    --code-string: #99ce9a;
    --code-number: #82c7f0;
    --hover: rgba(220, 227, 238, 0.06);
    --selected: rgba(143, 179, 232, 0.16);
    --button: #fff;
    --button-ink: #000;
    --theme-font: "Literata", Georgia, serif;
  }
  :root:not([data-theme="light"])[data-dark="graphite"] {
    --paper: #1c1c1e;
    --chrome: #242426;
    --ink: #e8e8e6;
    --muted: #9a9a96;
    --rule: #2e2e30;
    --accent: #e0a458;
    --code: #272729;
    --code-string: #99ce9a;
    --code-number: #82c7f0;
    --hover: rgba(232, 232, 230, 0.06);
    --selected: rgba(224, 164, 88, 0.16);
    --button: #fff;
    --button-ink: #000;
    --theme-font: "IBM Plex Sans", system-ui, sans-serif;
  }
}
:root[data-theme="dark"] {
  --paper: #221f1a;
  --chrome: #2a2621;
  --ink: #ede8df;
  --muted: #9a9184;
  --rule: #38332b;
  --accent: #ce7a5c;
  --code: #2c2822;
  --code-string: #a3c28e;
  --code-number: #8fb6cf;
  --hover: rgba(237, 232, 223, 0.06);
  --selected: rgba(206, 122, 92, 0.16);
  --button: #fff;
  --button-ink: #000;
  --theme-font: "Newsreader", "Iowan Old Style", Charter, Georgia, serif;
}
:root[data-theme="dark"][data-dark="midnight"] {
  --paper: #121722;
  --chrome: #1a1f2a;
  --ink: #dce3ee;
  --muted: #8892a3;
  --rule: #252d3b;
  --accent: #8fb3e8;
  --code: #1d222d;
  --code-string: #99ce9a;
  --code-number: #82c7f0;
  --hover: rgba(220, 227, 238, 0.06);
  --selected: rgba(143, 179, 232, 0.16);
  --button: #fff;
  --button-ink: #000;
  --theme-font: "Literata", Georgia, serif;
}
:root[data-theme="dark"][data-dark="graphite"] {
  --paper: #1c1c1e;
  --chrome: #242426;
  --ink: #e8e8e6;
  --muted: #9a9a96;
  --rule: #2e2e30;
  --accent: #e0a458;
  --code: #272729;
  --code-string: #99ce9a;
  --code-number: #82c7f0;
  --hover: rgba(232, 232, 230, 0.06);
  --selected: rgba(224, 164, 88, 0.16);
  --button: #fff;
  --button-ink: #000;
  --theme-font: "IBM Plex Sans", system-ui, sans-serif;
}