/* zenith — the reading room's ink, for the web.
   Generated by `zenith --css`; the palettes live in src/theme.rs. */

:root {
  --paper: #f5f1e8;
  --panel: #eee9dc;
  --panel-deep: #e5decd;
  --edge: #d6ccb8;
  --ink: #2a2c30;
  --ink-soft: #5f646b;
  --ink-faint: #8b9099;
  --accent: #2f6b96;
  --accent-soft: #8fb2cc;
  --selection: #dee7ee;
  --tone-plain: #33363b;
  --tone-comment: #8a9098;
  --tone-doc: #6b727b;
  --tone-keyword: #1f4e75;
  --tone-keyword-soft: #537a9c;
  --tone-type: #2e6b5e;
  --tone-call: #a25b32;
  --tone-constant: #9c4636;
  --tone-str: #56682f;
  --tone-number: #55507e;
  --tone-operator: #767c83;
  --tone-punct: #a2a8af;
  --tone-meta: #a8792a;
  --tone-raw: #33363b;
  --tone-invalid: #b23127;
}

[data-theme="lugano"] {
  --paper: #f5f1e8;
  --panel: #eee9dc;
  --panel-deep: #e5decd;
  --edge: #d6ccb8;
  --ink: #2a2c30;
  --ink-soft: #5f646b;
  --ink-faint: #8b9099;
  --accent: #2f6b96;
  --accent-soft: #8fb2cc;
  --selection: #dee7ee;
  --tone-plain: #33363b;
  --tone-comment: #8a9098;
  --tone-doc: #6b727b;
  --tone-keyword: #1f4e75;
  --tone-keyword-soft: #537a9c;
  --tone-type: #2e6b5e;
  --tone-call: #a25b32;
  --tone-constant: #9c4636;
  --tone-str: #56682f;
  --tone-number: #55507e;
  --tone-operator: #767c83;
  --tone-punct: #a2a8af;
  --tone-meta: #a8792a;
  --tone-raw: #33363b;
  --tone-invalid: #b23127;
}

[data-theme="maionese"] {
  --paper: #fbf7e2;
  --panel: #f3edd1;
  --panel-deep: #eae2bf;
  --edge: #dacfaa;
  --ink: #2f2c1e;
  --ink-soft: #6b6650;
  --ink-faint: #98926f;
  --accent: #b98e14;
  --accent-soft: #dfc87e;
  --selection: #efe6bc;
  --tone-plain: #3a3626;
  --tone-comment: #948c63;
  --tone-doc: #736c46;
  --tone-keyword: #45401a;
  --tone-keyword-soft: #6f6832;
  --tone-type: #4f6b33;
  --tone-call: #a05a28;
  --tone-constant: #a8442e;
  --tone-str: #5e6b2e;
  --tone-number: #6a5a8c;
  --tone-operator: #7c7654;
  --tone-punct: #ada47e;
  --tone-meta: #a8791a;
  --tone-raw: #3a3626;
  --tone-invalid: #b23127;
}

[data-theme="bibione"] {
  --paper: #f7f2e4;
  --panel: #efe8d4;
  --panel-deep: #e5dcc2;
  --edge: #d5c8a8;
  --ink: #27302c;
  --ink-soft: #5a6660;
  --ink-faint: #8b968f;
  --accent: #1f7a8c;
  --accent-soft: #86bcc4;
  --selection: #dbe8e1;
  --tone-plain: #303a34;
  --tone-comment: #88958a;
  --tone-doc: #69755f;
  --tone-keyword: #1d5f6e;
  --tone-keyword-soft: #4e8494;
  --tone-type: #2f6b45;
  --tone-call: #b4622f;
  --tone-constant: #a6432f;
  --tone-str: #5b6b2c;
  --tone-number: #4e5a86;
  --tone-operator: #6f7a70;
  --tone-punct: #9ba496;
  --tone-meta: #b0812a;
  --tone-raw: #303a34;
  --tone-invalid: #b23127;
}

[data-theme="kununurra"] {
  --paper: #341a12;
  --panel: #2b140d;
  --panel-deep: #22100a;
  --edge: #5a3220;
  --ink: #f2dec4;
  --ink-soft: #c9a98b;
  --ink-faint: #8e7660;
  --accent: #4fb3a8;
  --accent-soft: #2c6a63;
  --selection: #4a2718;
  --tone-plain: #f2dec4;
  --tone-comment: #9e8168;
  --tone-doc: #c0a183;
  --tone-keyword: #f4794a;
  --tone-keyword-soft: #c25b36;
  --tone-type: #e8a165;
  --tone-call: #ff9e5c;
  --tone-constant: #e2633f;
  --tone-str: #a9c06a;
  --tone-number: #f0c070;
  --tone-operator: #c39c7a;
  --tone-punct: #8a6c55;
  --tone-meta: #ffe0a0;
  --tone-raw: #f2dec4;
  --tone-invalid: #ff6b5a;
}

@media (prefers-color-scheme: dark) {
  :root {
    --paper: #341a12;
    --panel: #2b140d;
    --panel-deep: #22100a;
    --edge: #5a3220;
    --ink: #f2dec4;
    --ink-soft: #c9a98b;
    --ink-faint: #8e7660;
    --accent: #4fb3a8;
    --accent-soft: #2c6a63;
    --selection: #4a2718;
    --tone-plain: #f2dec4;
    --tone-comment: #9e8168;
    --tone-doc: #c0a183;
    --tone-keyword: #f4794a;
    --tone-keyword-soft: #c25b36;
    --tone-type: #e8a165;
    --tone-call: #ff9e5c;
    --tone-constant: #e2633f;
    --tone-str: #a9c06a;
    --tone-number: #f0c070;
    --tone-operator: #c39c7a;
    --tone-punct: #8a6c55;
    --tone-meta: #ffe0a0;
    --tone-raw: #f2dec4;
    --tone-invalid: #ff6b5a;
  }
}

[data-theme="panittha"] {
  --paper: #16130f;
  --panel: #120f0c;
  --panel-deep: #0e0c0a;
  --edge: #33291d;
  --ink: #efe6d2;
  --ink-soft: #a79778;
  --ink-faint: #7a6c52;
  --accent: #d9a93c;
  --accent-soft: #6e5522;
  --selection: #2a2114;
  --tone-plain: #e7dcc4;
  --tone-comment: #92805f;
  --tone-doc: #af9b75;
  --tone-keyword: #e5b84a;
  --tone-keyword-soft: #b08f3c;
  --tone-type: #6fbf9b;
  --tone-call: #e39a3c;
  --tone-constant: #d4553f;
  --tone-str: #9bb86a;
  --tone-number: #d98ba8;
  --tone-operator: #a79372;
  --tone-punct: #75654a;
  --tone-meta: #e8c46a;
  --tone-raw: #e7dcc4;
  --tone-invalid: #e8604a;
}

[data-theme="newsprint"] {
  --paper: #f2f3f4;
  --panel: #eaecee;
  --panel-deep: #e2e5e8;
  --edge: #d2d7dc;
  --ink: #1e2124;
  --ink-soft: #5c6369;
  --ink-faint: #8a9299;
  --accent: #2f5d8a;
  --accent-soft: #93aec4;
  --selection: #dce3ea;
  --tone-plain: #2a2e32;
  --tone-comment: #7c848b;
  --tone-doc: #626b73;
  --tone-keyword: #24557f;
  --tone-keyword-soft: #4a7ca8;
  --tone-type: #2f6b70;
  --tone-call: #9a6430;
  --tone-constant: #9c4a3f;
  --tone-str: #4f6b3a;
  --tone-number: #4f4a8a;
  --tone-operator: #6e767d;
  --tone-punct: #98a0a7;
  --tone-meta: #9a6430;
  --tone-raw: #2a2e32;
  --tone-invalid: #b03a33;
}

:root {
  --voice-code: ui-monospace, "SF Mono", "JetBrains Mono", "Hack", "DejaVu Sans Mono",
    "Liberation Mono", Menlo, Consolas, monospace;
  --voice-prose: "Iowan Old Style", "Charter", "Palatino Linotype", "Athelas", Georgia,
    ui-serif, serif;
  --voice-ui: ui-sans-serif, -apple-system, "SF Pro Text", "Helvetica Neue", "Avenir Next",
    "Optima", "Segoe UI", sans-serif;

  --measure: 34rem;
  --leading: 1.62;
  --h1: 1.7em;
  --h2: 1.4em;
  --h3: 1.22em;
  --h4: 1.12em;
}

html { background: var(--paper); }
body {
  margin: 0 auto;
  padding: 3rem 1.25rem 6rem;
  max-width: var(--measure);
  background: var(--paper);
  color: var(--ink-soft);
  font-family: var(--voice-prose);
  font-size: 17px;
  line-height: var(--leading);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
::selection { background: var(--selection); }

/* Chrome: the strip along the top and the foot, in the furniture's colour. */
header, footer, nav {
  font-family: var(--voice-ui);
  font-size: 0.82em;
  color: var(--ink-faint);
  letter-spacing: 0.01em;
}
header { padding-bottom: 0.6rem; border-bottom: 1px solid var(--edge); margin-bottom: 2rem; }
footer { margin-top: 4rem; border-top: 1px solid var(--edge); padding-top: 0.8rem; }

/* Headings are the same serif, larger, in the page's strongest ink, with air above. */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--voice-prose);
  font-weight: 400;
  color: var(--tone-keyword);
  line-height: 1.25;
  margin: 2.2em 0 0.5em;
}
h1 { font-size: var(--h1); margin-top: 1.4em; }
h2 { font-size: var(--h2); }
h3 { font-size: var(--h3); }
h4 { font-size: var(--h4); }
h5, h6 { font-size: 1em; }

p { margin: 0 0 1.1em; }
a { color: var(--accent); text-decoration: none; border-bottom: 1px solid var(--accent-soft); }
a:hover { border-bottom-color: var(--accent); }
strong { color: var(--tone-keyword); letter-spacing: 0.01em; font-weight: 600; }
em { font-style: italic; }
/* An underscore between word characters is not emphasis, and neither is a name. */
code, kbd, samp {
  font-family: var(--voice-code);
  font-size: 0.92em;
  color: var(--tone-str);
  background: color-mix(in srgb, var(--ink-faint) 10%, transparent);
  border-radius: 3px;
  padding: 0.05em 0.28em;
}
pre {
  font-family: var(--voice-code);
  font-size: 0.86em;
  line-height: 1.5;
  background: color-mix(in srgb, var(--ink-faint) 10%, transparent);
  border-radius: 4px;
  padding: 0.9rem 1rem;
  overflow-x: auto;
}
pre code { background: none; padding: 0; font-size: 1em; color: var(--tone-plain); }

blockquote {
  margin: 1.4em 0;
  padding: 0.7rem 1rem;
  background: color-mix(in srgb, var(--ink-faint) 8%, transparent);
  border-left: 2px solid var(--accent-soft);
  font-style: italic;
  color: var(--ink-faint);
}
blockquote p:last-child { margin-bottom: 0; }

hr { border: 0; border-top: 1px solid var(--edge); margin: 2.4em 0; }
ul, ol { padding-left: 1.4em; }
li::marker { color: var(--ink-faint); }
img { max-width: 100%; height: auto; border-radius: 3px; }

/* The line-number gutter Chroma leaves in the margin, as a file's would be. */
.highlight { position: relative; }
.ln, .lnt {
  font-family: var(--voice-code);
  color: color-mix(in srgb, var(--ink-faint) 45%, transparent);
  user-select: none;
}

/* Syntax highlighting, in the same fourteen inks the app uses. */
.chroma { color: var(--tone-plain); }
.chroma .c, .chroma .c1, .chroma .cm, .chroma .cs, .chroma .cd {
  font-family: var(--voice-prose);
  font-style: italic;
  color: var(--tone-comment);
}
.chroma .k, .chroma .kc, .chroma .kn, .chroma .kr, .chroma .kd, .chroma .kt {
  color: var(--tone-keyword);
}
.chroma .kc, .chroma .kn { color: var(--tone-keyword-soft); }
.chroma .nc, .chroma .nn, .chroma .no, .chroma .nb, .chroma .bp {
  color: var(--tone-type);
}
.chroma .nf, .chroma .fm, .chroma .nd { color: var(--tone-call); }
.chroma .nd, .chroma .na, .chroma .nt { color: var(--tone-meta); }
.chroma .s, .chroma .s1, .chroma .s2, .chroma .sb, .chroma .sc, .chroma .sd,
.chroma .se, .chroma .sh, .chroma .si, .chroma .sx, .chroma .sr, .chroma .ss {
  color: var(--tone-str);
}
.chroma .m, .chroma .mb, .chroma .mf, .chroma .mh, .chroma .mi, .chroma .mo,
.chroma .il, .chroma .no { color: var(--tone-number); }
.chroma .o, .chroma .ow, .chroma .p { color: var(--tone-operator); }
.chroma .p { color: var(--tone-punct); }
.chroma .n, .chroma .nx, .chroma .nv, .chroma .nl, .chroma .py { color: var(--tone-plain); }
.chroma .err, .chroma .gd { color: var(--tone-invalid); }
