/* Site-wide overrides to the vendored pandoc-markdown-css-theme. */

/* ── Fonts ───────────────────────────────────────────── */

@font-face {
  font-family: "et-book";
  src: url("../fonts/et-book/et-book-roman-line-figures.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "et-book";
  src: url("../fonts/et-book/et-book-display-italic-old-style-figures.woff") format("woff");
  font-weight: normal;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "et-book";
  src: url("../fonts/et-book/et-book-bold-line-figures.woff") format("woff");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

:root {
  --font-family-prose: 'et-book', Palatino, 'Palatino Linotype', 'Palatino LT STD', 'Book Antiqua', Georgia, serif;
  --font-family-heading: 'et-book', Palatino, 'Palatino Linotype', 'Palatino LT STD', 'Book Antiqua', Georgia, serif;

  /* et-book has a smaller x-height than system-ui, so bump to compensate. */
  --font-size: 18px;
  /* Slightly tighter than Jez default (1.44) and old theme (1.7) — ratio 1.56. */
  --line-height: 28px;

  /* Smaller code than Jez defaults (15/14). */
  --inline-code-font-size: 13px;
  --code-block-font-size: 13px;

  /* Page title — slightly smaller than Jez defaults (42/40). */
  --title-font-size: 40px;
  --title-code-font-size: 32px;

  /* Inline code inside h1/h2 — smaller than Jez defaults (29/20). */
  --h1-code-font-size: 26px;
  --h2-code-font-size: 17px;

  /* Warm off-white background + burgundy warm accent. */
  --background-color: #fffffc;
  --color-accent-warm: #611;

  /* Link color (Jez default is #0070e0). */
  --color-link: #0075b0;

  /* Near-black body text — reads heavier than Jez's softer blue-gray default. */
  --color-text: #111;

  /* More generous heading margins (Tufte-style breathing room). */
  --h1-margin-bottom: 18px;
  --h2-margin-bottom: 12px;
}

/* Jez has no --h3/h4 margin variables (universal * reset zeros all margins).
   Give them explicit spacing. */
main h3 {
  margin-top: 18px;
  margin-bottom: 8px;
}
main h4 {
  margin-top: 12px;
  margin-bottom: 6px;
}
main h5 {
  margin-top: 10px;
  margin-bottom: 4px;
}

/* Paragraphs after h4/h5 otherwise inherit Jez's default `p { margin-top:
   var(--line-height) }` from theme.css:389, which is way too much gap.
   Match the pattern Jez uses for h3 (theme.css:378-384). */
main h4 + :is(*:not(.sidenote-wrapper), p),
main h4 + .sidenote-wrapper + :is(*:not(.sidenote-wrapper), p),
main h4 + .sidenote-wrapper + .sidenote-wrapper + :is(*:not(.sidenote-wrapper), p),
main h5 + :is(*:not(.sidenote-wrapper), p),
main h5 + .sidenote-wrapper + :is(*:not(.sidenote-wrapper), p),
main h5 + .sidenote-wrapper + .sidenote-wrapper + :is(*:not(.sidenote-wrapper), p) {
  margin-top: 0;
}

/* Restore browser-default font smoothing (subpixel AA on macOS) so strokes
   fill in more heavily. Jez forces grayscale AA via the universal selector
   (*, *:after, *:before), so we have to match that specificity to override
   — otherwise paragraphs, spans, and MathJax containers all keep grayscale AA. */
*, *::after, *::before {
  -webkit-font-smoothing: auto;
  -moz-osx-font-smoothing: auto;
}

/* Safari-only bug: hanging-punctuation: first on body (Jez's theme) makes
   MathJax's opening (, [, { hang into the left margin inside <mjx-container>.
   Reset just for math — prose still benefits from the hanging effect. */
mjx-container {
  hanging-punctuation: none;
}

h1.title {
  color: var(--color-accent-warm);
  /* Doubled top margin (breathing room above title); tight bottom so
     post-meta hugs the title. Jez default for both is var(--line-height). */
  margin-top: calc(var(--line-height) * 2);
  margin-bottom: 1.3rem;
}

/* ── Tufte-style italic headings ───────────────────── */

main h2,
main h3,
main h4 {
  font-style: italic;
}

/* ── Link hover: gray underline, slightly offset from baseline ─ */

a:hover {
  text-decoration-color: #bbb;
  text-underline-offset: 3px;
}

/* ── Section marks on headings (h1-h4) ─────────────── */
/* A light-gray § hangs in the left margin beside each section heading;
   visible on hover, clickable as a self-link. Injected by
   filters/heading-anchors.lua as <a class="section-mark" href="#id">§</a>. */

main h1:not(.title),
main h2,
main h3,
main h4 {
  position: relative;
}
.section-mark {
  position: absolute;
  left: -0.75em;
  color: #bbb;
  text-decoration: none;
  font-style: normal;
  font-weight: normal;
  opacity: 0;
  transition: opacity 0.15s, color 0.15s;
}
main h1:not(.title):hover .section-mark,
main h2:hover .section-mark,
main h3:hover .section-mark,
main h4:hover .section-mark {
  opacity: 1;
}
.section-mark:hover {
  color: #888;
}

/* ── TOC inline styling ────────────────────────────── */
/* Plain body text color (no link blue); underline on hover.
   No list bullets — nested indentation carries the hierarchy. Slightly
   smaller than body. */

nav#TOC a,
nav#TOC a:link,
nav#TOC a:visited {
  color: var(--color-text);
  text-decoration: none;
}
nav#TOC a:hover {
  text-decoration: underline;
}
/* Inline-TOC only (narrow): no list bullets, slightly smaller font.
   In wide sidebar mode (Jez's @media min-width 1260px+), Jez already
   sets list-style: none and font-size: 12px — leave those alone. */
@media not screen and (min-width: calc(745px + 2 * (52px + 206px + 52px) - 1px)) {
  nav#TOC ul {
    list-style: none;
    font-size: 16px;
  }
}