/* ============================================================================
   Typography and palette.

   Two goals, in tension, resolved deliberately:

   1. Readability for long-form argument. The posts are proofs, so the body is
      a serif at 19px with a 1.72 line-height and a ~68-character measure. That
      is the classic setting for sustained reading, and it is what makes a
      "Forbids / Does not forbid" section scan as prose rather than as a spec.

   2. A terminal register, not a terminal costume. Monospace is used only where
      it carries meaning -- IDs, tags, headings, code, the index table -- so it
      reads as an engineer's document rather than as a CRT pastiche. No scanline
      overlays, no blinking cursors, no #00FF00 on black: those cost legibility,
      and this site is 100+ posts of dense math.

   All fonts are system-local. No webfont request, so there is no FOUT on a
   page whose first paint is the theorem statement, and no third-party origin.
   ============================================================================ */

:root {
  --font-serif: "Iowan Old Style", "Charter", "Source Serif 4", Charter,
    "Bitstream Charter", "Sitka Text", Cambria, Georgia, serif;
  --font-mono: ui-monospace, "SF Mono", "JetBrains Mono", "Menlo",
    "Cascadia Code", "Roboto Mono", "Liberation Mono", monospace;

  /* 720 was PaperMod's default and runs long at 19px; 46rem lands near the
     66-72 character measure that typographic convention settles on. */
  --main-width: 46rem;
  --content-gap: 22px;

  /* Light mode is warmed slightly off pure white: less glare under a wall of
     KaTeX, and the accent stays legible against it. */
  --theme: #fbfaf8;
  --entry: #ffffff;
  --primary: #16181d;
  --secondary: #5c6270;
  --tertiary: #d9d6cf;
  --content: #24272e;
  --border: #e4e0d8;
  --code-bg: #f1eee8;
  --accent: #0a6c58;
}

:root[data-theme="dark"] {
  /* A muted slate rather than black. Pure black plus a bright serif produces
     halation on LCDs, which is exactly the wrong trade for proof-reading. */
  --theme: #14161a;
  --entry: #1a1d22;
  --primary: #e6e5e1;
  --secondary: #9aa1ae;
  --tertiary: #333941;
  --content: #ccccc6;
  --border: #2a2f37;
  --code-bg: #1e2228;
  --code-block-bg: #15181d;
  --accent: #5ec9a5;
}

/* ---------------------------------------------------------------- body text */

body {
  font-family: var(--font-serif);
  font-size: 19px;
  line-height: 1.72;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Old-style figures sit on the baseline like lowercase letters, which is what
   you want in a sentence ("in 1936 Turing showed"). They are wrong inside math
   and code, where digits must align, so both opt back out below. */
.post-content {
  font-variant-numeric: oldstyle-nums proportional-nums;
}

.post-content code,
.post-content pre,
.post-content table,
.katex,
.theorem-meta {
  font-variant-numeric: lining-nums tabular-nums;
}

.post-content p {
  margin: 0 0 1.15em;
}

/* Hyphenation matters at this measure: without it, a line broken by a long
   term like "incompressibility" leaves a river down the paragraph. */
.post-content p,
.post-content li {
  hyphens: auto;
  -webkit-hyphens: auto;
}

.post-content a {
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  text-decoration-color: var(--tertiary);
}

.post-content a:hover {
  text-decoration-color: var(--accent);
  color: var(--accent);
}

/* --------------------------------------------------------- headings and nav */

/* The monospace register lives here: structural elements are machine-labelled,
   prose is not. The 7 beats are h2s, so this is what makes the skeleton of a
   post visible at a glance while scrolling. */
h1, h2, h3, h4, h5, h6,
.logo a, #menu a, .post-title, .entry-header h2, .archive-year {
  font-family: var(--font-mono);
  font-weight: 600;
  letter-spacing: -0.015em;
}

.post-content h2 {
  font-size: 1.12em;
  margin: 2.2em 0 0.7em;
  padding-bottom: 0.35em;
  border-bottom: 1px solid var(--border);
}

/* Beat headings are a fixed vocabulary, so numbering them tells the reader
   where they are in the argument without the author writing "3." by hand. */
.post-content h2::before {
  content: "§ ";
  color: var(--accent);
  font-weight: 400;
}

.post-content h3 {
  font-size: 1em;
  margin: 1.8em 0 0.5em;
  color: var(--secondary);
}

.post-title {
  font-size: 1.9em;
  line-height: 1.25;
}

.logo a {
  font-weight: 700;
  letter-spacing: -0.02em;
}

/* A terminal prompt on the site name: one small, cheap signal of register,
   placed where it can never interfere with reading a proof. */
.logo a::before {
  content: "~ $ ";
  color: var(--accent);
  font-weight: 400;
}

#menu a {
  font-size: 0.8em;
  text-transform: lowercase;
  letter-spacing: 0.02em;
}

#menu .active {
  border-bottom-color: var(--accent);
}

/* -------------------------------------------------------- code and math */

code, pre, kbd, samp, .katex-display > .katex {
  font-feature-settings: "liga" 0;
}

.post-content code {
  font-family: var(--font-mono);
  font-size: 0.84em;
  border-radius: 3px;
  padding: 2px 5px;
}

.post-content pre {
  border: 1px solid var(--border);
  border-radius: 6px;
  font-size: 0.78em;
  line-height: 1.6;
}

/* Display math is the densest thing on the page; give it room and let a wide
   derivation scroll rather than overflow the column. */
.katex-display {
  margin: 1.5em 0;
  padding: 2px 0;
  overflow-x: auto;
  overflow-y: hidden;
}

/* --------------------------------------------------------- block elements */

blockquote {
  border-inline-start: 2px solid var(--accent) !important;
  font-style: normal;
  color: var(--secondary);
}

.post-content table {
  font-family: var(--font-mono);
  font-size: 0.8em;
}

hr {
  border-top: 1px solid var(--border);
}

/* ---------------------------------------------------- lists and metadata */

.post-meta,
.post-entry .entry-footer,
.breadcrumbs,
.archive-meta,
.footer {
  font-family: var(--font-mono);
  font-size: 0.72em;
  letter-spacing: 0.01em;
}

.post-entry {
  border: 1px solid var(--border);
  border-radius: 6px;
  transition: border-color 0.15s ease;
}

.post-entry:hover {
  border-color: var(--accent);
  box-shadow: none;
  transform: none;
}

.entry-content {
  font-size: 0.85em;
  line-height: 1.6;
}

.toc {
  font-family: var(--font-mono);
  font-size: 0.76em;
  border-color: var(--border);
}

/* ------------------------------------------------------------------ print */

@media print {
  body { font-size: 11pt; }
  .logo a::before,
  .post-content h2::before { content: none; }
}

@media (max-width: 42rem) {
  body { font-size: 17px; }
  .post-title { font-size: 1.5em; }
}