/* House tokens. Generated by derive/tokens.py from the bowls; do not edit by hand.
   Each bowl gives hue and chroma; each role gives lightness. Paper is Ding, ink is
   Jian, and dark mode swaps the two bowls. Base: a glaze at its own chroma. Accent:
   the same hue lifted to the most vivid bowl's chroma. Both read at 5:1 on paper.
   Wash: a glaze at its own chroma, near the paper's lightness, for fills only. */

@font-face { font-family: "House Book"; src: url("house-book.woff2") format("woff2"); font-display: swap; }
@font-face { font-family: "House Sans"; src: url("house-sans.woff2") format("woff2"); font-display: swap; }
@font-face { font-family: "House Typewriter"; src: url("house-typewriter.woff2") format("woff2"); font-display: swap; }

:root {
  --ding: 0.026 87.1;      /* Cleveland 1929.995 */
  --jian: 0.014 257.3;      /* Cleveland 1948.206 */
  --longquan: 0.043 137.4;  /* Cleveland 1957.54, celadon */
  --ru: 0.023 155.9;        /* Cleveland 1957.40, celadon */
  --qingbai: 0.029 176.9;   /* Cleveland 2020.182, celadon */
  --jun: 0.022 224.6;       /* Cleveland 1942.665, jun */
  --junsplash: 0.023 310.6; /* Cleveland 1942.665, jun */
  --crimson: 0.047 355.2;   /* Cleveland 1956.701, jun */
  --rust: 0.048 40.5;      /* Cleveland 2020.176, tenmoku */
  --amber: 0.074 58.4;     /* Cleveland 1989.274, tenmoku */
  --gold: 0.056 74.8;      /* Cleveland 2020.177, tenmoku */
  --lift: 0.074;              /* the most vivid bowl's own chroma */

  --paper: oklch(0.95 var(--ding));
  --ink: oklch(0.22 var(--jian));
  --rule: oklch(0.86 var(--ding));
  --longquan-base: oklch(0.504 var(--longquan));
  --longquan-accent: oklch(0.502 var(--lift) 137.4);
  --longquan-wash: oklch(0.89 var(--longquan));
  --ru-base: oklch(0.506 var(--ru));
  --ru-accent: oklch(0.500 var(--lift) 155.9);
  --ru-wash: oklch(0.89 var(--ru));
  --qingbai-base: oklch(0.505 var(--qingbai));
  --qingbai-accent: oklch(0.499 var(--lift) 176.9);
  --qingbai-wash: oklch(0.89 var(--qingbai));
  --jun-base: oklch(0.507 var(--jun));
  --jun-accent: oklch(0.503 var(--lift) 224.6);
  --jun-wash: oklch(0.89 var(--jun));
  --junsplash-base: oklch(0.511 var(--junsplash));
  --junsplash-accent: oklch(0.516 var(--lift) 310.6);
  --junsplash-wash: oklch(0.89 var(--junsplash));
  --crimson-base: oklch(0.515 var(--crimson));
  --crimson-accent: oklch(0.518 var(--lift) 355.2);
  --crimson-wash: oklch(0.89 var(--crimson));
  --rust-base: oklch(0.513 var(--rust));
  --rust-accent: oklch(0.516 var(--lift) 40.5);
  --rust-wash: oklch(0.89 var(--rust));
  --amber-base: oklch(0.514 var(--amber));
  --amber-accent: oklch(0.514 var(--lift) 58.4);
  --amber-wash: oklch(0.89 var(--amber));
  --gold-base: oklch(0.510 var(--gold));
  --gold-accent: oklch(0.511 var(--lift) 74.8);
  --gold-wash: oklch(0.89 var(--gold));
  --book: "House Book", "Iowan Old Style", Georgia, serif;
  --sans: "House Sans", "Helvetica Neue", Arial, sans-serif;
  --typewriter: "House Typewriter", ui-monospace, monospace;
  --fade: color .5s ease, background-color .5s ease, border-color .5s ease, box-shadow .5s ease,
          outline-color .5s ease, text-decoration-color .5s ease, fill .5s ease, stroke .5s ease;
  color-scheme: light;
}
/* A change of theme fades. Everything inherits the root's transition, so a page that
   turns the root's off (as a page does on load) stops every fade at once. */
html { transition: var(--fade); }
html * { transition: inherit; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --paper: oklch(0.20 var(--jian));
    --ink: oklch(0.88 var(--ding));
    --rule: oklch(0.30 var(--jian));
    --longquan-base: oklch(0.617 var(--longquan));
    --longquan-accent: oklch(0.614 var(--lift) 137.4);
    --longquan-wash: oklch(0.29 var(--longquan));
    --ru-base: oklch(0.619 var(--ru));
    --ru-accent: oklch(0.613 var(--lift) 155.9);
    --ru-wash: oklch(0.29 var(--ru));
    --qingbai-base: oklch(0.618 var(--qingbai));
    --qingbai-accent: oklch(0.612 var(--lift) 176.9);
    --qingbai-wash: oklch(0.29 var(--qingbai));
    --jun-base: oklch(0.620 var(--jun));
    --jun-accent: oklch(0.616 var(--lift) 224.6);
    --jun-wash: oklch(0.29 var(--jun));
    --junsplash-base: oklch(0.624 var(--junsplash));
    --junsplash-accent: oklch(0.629 var(--lift) 310.6);
    --junsplash-wash: oklch(0.29 var(--junsplash));
    --crimson-base: oklch(0.628 var(--crimson));
    --crimson-accent: oklch(0.631 var(--lift) 355.2);
    --crimson-wash: oklch(0.29 var(--crimson));
    --rust-base: oklch(0.626 var(--rust));
    --rust-accent: oklch(0.629 var(--lift) 40.5);
    --rust-wash: oklch(0.29 var(--rust));
    --amber-base: oklch(0.626 var(--amber));
    --amber-accent: oklch(0.626 var(--lift) 58.4);
    --amber-wash: oklch(0.29 var(--amber));
    --gold-base: oklch(0.623 var(--gold));
    --gold-accent: oklch(0.624 var(--lift) 74.8);
    --gold-wash: oklch(0.29 var(--gold));
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --paper: oklch(0.20 var(--jian));
  --ink: oklch(0.88 var(--ding));
  --rule: oklch(0.30 var(--jian));
  --longquan-base: oklch(0.617 var(--longquan));
  --longquan-accent: oklch(0.614 var(--lift) 137.4);
  --longquan-wash: oklch(0.29 var(--longquan));
  --ru-base: oklch(0.619 var(--ru));
  --ru-accent: oklch(0.613 var(--lift) 155.9);
  --ru-wash: oklch(0.29 var(--ru));
  --qingbai-base: oklch(0.618 var(--qingbai));
  --qingbai-accent: oklch(0.612 var(--lift) 176.9);
  --qingbai-wash: oklch(0.29 var(--qingbai));
  --jun-base: oklch(0.620 var(--jun));
  --jun-accent: oklch(0.616 var(--lift) 224.6);
  --jun-wash: oklch(0.29 var(--jun));
  --junsplash-base: oklch(0.624 var(--junsplash));
  --junsplash-accent: oklch(0.629 var(--lift) 310.6);
  --junsplash-wash: oklch(0.29 var(--junsplash));
  --crimson-base: oklch(0.628 var(--crimson));
  --crimson-accent: oklch(0.631 var(--lift) 355.2);
  --crimson-wash: oklch(0.29 var(--crimson));
  --rust-base: oklch(0.626 var(--rust));
  --rust-accent: oklch(0.629 var(--lift) 40.5);
  --rust-wash: oklch(0.29 var(--rust));
  --amber-base: oklch(0.626 var(--amber));
  --amber-accent: oklch(0.626 var(--lift) 58.4);
  --amber-wash: oklch(0.29 var(--amber));
  --gold-base: oklch(0.623 var(--gold));
  --gold-accent: oklch(0.624 var(--lift) 74.8);
  --gold-wash: oklch(0.29 var(--gold));
  color-scheme: dark;
}