/* Manual typography uses the existing theme's typeface and colour tokens. */
article .typography {
  line-height: 1.75;
}
article .typography > p,
article .typography > ul,
article .typography > ol {
  max-width: 72ch;
}
article .typography h2 {
  margin-top: 2.5rem;
  margin-bottom: 1rem;
}
article .typography h3 {
  margin-top: 1.75rem;
}
/* The theme supplies a page title; keep the Markdown title for anchors. */
article .typography > h1:first-child {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
}
article .typography img {
  display: block;
  width: 512px;
  max-width: 100%;
  height: auto;
  margin: 1.5rem 0;
  padding: 16px;
  box-sizing: content-box;
  max-width: calc(100% - 34px);
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 4px;
  image-rendering: pixelated;
}
article .table-wrapper {
  margin: 1.5rem 0;
  overflow-x: auto;
}
article .table-wrapper table {
  width: 100%;
}
article .table-wrapper th,
article .table-wrapper td {
  vertical-align: top;
  padding: .75rem .85rem;
  line-height: 1.55;
  overflow-wrap: normal;
  word-break: normal;
}
article details {
  margin: 1.5rem 0;
}
article details summary {
  cursor: pointer;
}
@media (max-width: 640px) {
  article .table-wrapper th,
  article .table-wrapper td {
    padding: .6rem;
    font-size: .875rem;
  }
  article .typography img { padding: 8px; max-width: calc(100% - 18px); }
}
@media print {
  article img, article tr { break-inside: avoid; }
  article h2, article h3 { break-after: avoid; }
}
/* Caption paragraphs immediately follow screen illustrations. */
article .typography p:has(> img) { margin-bottom: .5rem; }
article .typography p:has(> img) + p:has(> em:only-child) {
  margin-top: 0;
  margin-bottom: 2rem;
  font-size: .85rem;
  color: var(--muted-foreground);
}

/* Typefaces: Atkinson Hyperlegible body, Fraunces headings, JetBrains Mono code (css/fonts.css). */
:root {
  --font-sans: "Atkinson Hyperlegible", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --font-heading: "Fraunces", Georgia, "Times New Roman", serif;
}
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  font-weight: 700;
  font-variation-settings: "WONK" 0, "SOFT" 0;
}
