/* Reading measure and body links (all four handbooks; Bryan approved
 * 14 November 2026).
 *
 * On desktop the body column is about 790px wide, which set running text at
 * about 95 characters a line. Long expert reading is most comfortable near
 * 65 to 75. Paragraphs, lists, definition lists, block quotes, callouts and
 * highlighted blocks in the running text share one measure of 68ch (about
 * 68 characters of body text), and the headings and rules between them end
 * at the same edge; tables, figures, code and interactive panels keep the
 * full column. Only direct children of the
 * page and its sections are capped, so boxes built from their own markup
 * (the Welcome page boxes among them) are untouched.
 *
 * Body links are underlined, so they no longer rely on color alone (WCAG
 * 1.4.1). Citation badges sit inside their links as inline boxes, which the
 * underline never reaches; they are unchanged.
 */
/* The measure is set in rem, which every element resolves against the same
   root size as the body text (body is 1rem), so headings and rules set in
   larger or no type end at exactly the same right edge as the paragraphs.
   43.25rem is 68ch of the body face (Source Sans at 17px: 735px). A plain
   length, not a registered @property: an unregistered custom property holding
   "68ch" is resolved per element, which let headings run wider. */
main.content {
  --handbook-measure: 43.25rem;
}

@media (min-width: 768px) {
  main.content > :is(p, ul, ol, dl, blockquote, .callout, .highlight-block, hr),
  main.content section > :is(p, ul, ol, dl, blockquote, .callout, .highlight-block, hr, h2, h3, h4, h5, h6) {
    max-width: var(--handbook-measure);
  }
}

main.content > :is(p, ul, ol, dl, blockquote) a:not(.btn):not(.nav-link):not(.anchorjs-link):not(.footnote-ref),
main.content section > :is(p, ul, ol, dl, blockquote) a:not(.btn):not(.nav-link):not(.anchorjs-link):not(.footnote-ref),
main.content section > .table-responsive td a,
main.content section > table td a,
main.content .callout-body-container > :is(p, ul, ol) a:not(.btn) {
  text-decoration-line: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
  text-decoration-color: color-mix(in srgb, currentColor 45%, transparent);
}

main.content > :is(p, ul, ol, dl, blockquote) a:not(.btn):hover,
main.content section > :is(p, ul, ol, dl, blockquote) a:not(.btn):hover,
main.content section > .table-responsive td a:hover,
main.content section > table td a:hover,
main.content .callout-body-container > :is(p, ul, ol) a:not(.btn):hover {
  text-decoration-color: currentColor;
}