/* getnobody.org shared base: self-hosted fonts, palette tokens, footer.
   Fonts: IBM Plex Mono (display and UI), Source Serif 4 (blog body). Latin subset, OFL (see /fonts/LICENSE-*.txt).
   Palette contrast (WCAG): light ink/bg 15.4, muted/bg 5.2, accent/bg 5.1, white text on accent 5.8;
   dark ink/bg 14.7, muted/bg 5.9, accent/bg 7.4, bg/accent 7.4. Code and surface tints keep every pair above 4.5. */

@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 400; font-display: swap; src: url(/fonts/ibm-plex-mono-latin-400-normal.woff2) format("woff2"); }
@font-face { font-family: "IBM Plex Mono"; font-style: italic; font-weight: 400; font-display: swap; src: url(/fonts/ibm-plex-mono-latin-400-italic.woff2) format("woff2"); }
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 600; font-display: swap; src: url(/fonts/ibm-plex-mono-latin-600-normal.woff2) format("woff2"); }
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 700; font-display: swap; src: url(/fonts/ibm-plex-mono-latin-700-normal.woff2) format("woff2"); }
@font-face { font-family: "Source Serif 4"; font-style: normal; font-weight: 400; font-display: swap; src: url(/fonts/source-serif-4-latin-400-normal.woff2) format("woff2"); }
@font-face { font-family: "Source Serif 4"; font-style: italic; font-weight: 400; font-display: swap; src: url(/fonts/source-serif-4-latin-400-italic.woff2) format("woff2"); }
@font-face { font-family: "Source Serif 4"; font-style: normal; font-weight: 600; font-display: swap; src: url(/fonts/source-serif-4-latin-600-normal.woff2) format("woff2"); }

:root {
  --mono: "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
  --serif: "Source Serif 4", Charter, "Iowan Old Style", Georgia, serif;
  --bg: #F3EFE6;        /* page */
  --surface: #F8F5EE;   /* panels: a tint, never #FFFFFF */
  --code-bg: #EBE6DA;   /* code, chart tracks */
  --ink: #1B1813;
  --muted: #6A6358;
  --line: #D8D1C2;
  --line-strong: #B9B0A0;
  --accent: #B43C0E;
  --on-accent: #FFFFFF; /* text on accent fills only (5.8:1); never a surface */
  --bar-dim: #C9C1B2;   /* secondary chart bars (ink on it: 9.9) */
  --r-1: 2px; --r-2: 4px;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #17150F; --surface: #1F1C15; --code-bg: #25221A;
    --ink: #ECE6DA; --muted: #9A9284; --line: #332F26; --line-strong: #4A4539;
    --accent: #F2894A; --on-accent: #17150F; --bar-dim: #4A4539;
    color-scheme: dark;
  }
}

* { box-sizing: border-box; }
html { background: var(--bg); }
body { margin: 0; background: var(--bg); color: var(--ink); }
a { color: var(--accent); text-underline-offset: 0.18em; }
a:hover { text-decoration-thickness: 2px; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

.site-footer {
  font-family: var(--mono); font-size: 0.8rem; color: var(--muted);
  margin-top: 64px; padding-top: 16px; border-top: 1px solid var(--line);
  display: flex; flex-wrap: wrap; gap: 6px 20px; justify-content: space-between;
}
.site-footer nav { display: flex; flex-wrap: wrap; gap: 6px 16px; }
.site-footer a { color: var(--muted); }
.site-footer a:hover { color: var(--ink); }