/* Emanation — a broadsheet. Newsprint cream, black rules, a masthead, column text; Newsreader for
   headlines and prose, IBM Plex Mono for code and figures. */
:root {
  --page-bg: #f4efe3; --page-text: #1a1712; --page-muted: #5d554a; --page-line: #cfc5b2; --page-accent: #8c1c13;
  --strong: #0d0b08; --surface: #fbf8f0; --raise: #ece5d4; --code-bg: #1d1a15; --code-text: #efe6d2;
  --page-ui: "Newsreader", Georgia, serif; --display: "Newsreader", Georgia, serif; --mono: "IBM Plex Mono", ui-monospace, monospace;
  --k-ink: #1a1712; --k-accent: #8c1c13; --k-a: #9a5b12; --k-b: #2c4f73; --k-c: #5b3f86; --k-d: #8a3a63;
  --k-ok: #2f6a3e; --k-warn: #8a6a12; --k-err: #8c1c13; --k-muted: #8a8172; --k-file: #5d554a;
  --measure: 70ch; --wide: 1040px;
  color-scheme: light;
}
body { font: 18px/1.62 var(--page-ui); }
.masthead { border-top: 4px solid var(--strong); border-bottom: 1px solid var(--strong); margin: 22px 0 6px; padding: 10px 0 8px; text-align: center; }
.masthead h1 { font: 800 clamp(48px, 9vw, 104px)/0.95 var(--display); letter-spacing: 0.02em; margin: 0; text-transform: uppercase; }
.dateline { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; border-bottom: 3px double var(--strong);
  padding: 6px 0; margin-bottom: 26px; font: 500 13px/1.3 var(--mono); text-transform: uppercase; letter-spacing: 0.04em; color: var(--page-muted); }
.lede { font: 400 22px/1.5 var(--page-ui); }
.lede::first-letter { float: left; font: 800 64px/0.85 var(--display); margin: 6px 8px 0 0; color: var(--page-accent); }
h2 { font: 750 clamp(26px, 3.4vw, 38px)/1.1 var(--display); margin: 52px 0 12px; padding-top: 12px; border-top: 1px solid var(--strong); }
h3 { font: italic 600 21px/1.3 var(--display); margin: 22px 0 6px; }
.cols { column-width: 320px; column-gap: 34px; column-rule: 1px solid var(--page-line); }
.cols p { margin-top: 0; }
.fig { margin: 22px 0; padding: 14px 10px; background: var(--surface); border: 1px solid var(--page-line); }
.dg .lab-bg { fill: var(--surface); } .dg .halo { stroke: var(--surface); }
figure.code { margin: 16px 0; }
figure.code figcaption { font: 12.5px var(--mono); color: var(--page-muted); margin-bottom: 4px; }
figure.code pre { margin: 0; padding: 14px 16px; background: var(--code-bg); color: var(--code-text); font: 13.5px/1.55 var(--mono); overflow-x: auto; white-space: pre-wrap; overflow-wrap: anywhere; }
p.stats { display: flex; flex-wrap: wrap; gap: 6px 26px; font: 14px var(--mono); color: var(--page-muted); }
p.stats b { color: var(--strong); font-weight: 600; }
ul.topics { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
ul.topics li { font: italic 15px/1.3 var(--display); padding: 4px 10px; border: 1px solid var(--page-line); background: var(--surface); }
.pull { font: italic 500 24px/1.4 var(--display); border-left: 3px solid var(--page-accent); padding: 4px 0 4px 18px; margin: 24px 0; max-width: 60ch; }
.note { color: var(--page-muted); font-size: 16px; }
.dateline { max-width: none; }
:not(pre) > code { background: var(--raise); color: var(--strong); padding: 1px 5px; border-radius: 3px; font-size: 0.86em; }
figure.code figcaption code { background: none; color: var(--page-muted); padding: 0; }
