:root {
  color-scheme: light;
  --paper: #faf4e6;
  --sheet: #fffcf3;
  --ink: #243c3c;
  --teal: #24575c;
  --pale: #e1e9df;
  --sand: #e9dfc8;
  --brass: #b29454;
  --brass-ink: #705226;
  --clay: #844f43;
  --line: #c7b991;
  --face: 'Gill Sans', 'Gill Sans MT', Candara, Corbel, 'Trebuchet MS', sans-serif;
  --text: 1.25rem;
  --small: 1.0625rem;
  --leading: 1.55;
  --measure: 65ch;
  --wide: 74rem;
  --gutter: clamp(1.25rem, 4vw, 4rem);
  --space: clamp(2.5rem, 5vw, 5rem);
  --arch: 12rem 12rem 1.5rem 1.5rem;
  --soft: 1rem;
  --target: 2.75rem;
}

* { box-sizing: border-box; }
html { background: var(--paper); scroll-padding-top: 1.5rem; }
body { margin: 0; color: var(--ink); background: var(--paper); font: var(--text)/var(--leading) var(--face); }
img { display: block; max-width: 100%; height: auto; }
a { color: var(--teal); text-underline-offset: .19em; text-decoration-thickness: .075em; }
a:hover { text-decoration-thickness: .15em; }
a:focus-visible { outline: 3px solid var(--clay); outline-offset: 5px; border-radius: .2rem; }
p, ul, ol, figure { margin: 0; }
p + p { margin-top: 1.05em; }
h1, h2, h3, .page-summary-title, .page-reading-title { margin: 0; font-weight: 600; line-height: 1.1; text-wrap: balance; }
h1 { font-size: clamp(2.6rem, 4.8vw, 4.25rem); letter-spacing: -.035em; max-width: 19ch; }
h2, .page-section-title, .page-summary-title, .page-reading-title { font-size: clamp(1.65rem, 2.65vw, 2.35rem); letter-spacing: -.018em; }
h3 { font-size: 1.25rem; }
ul { padding-left: 1.25em; }
li + li { margin-top: .65rem; }
::selection { background: var(--sand); color: var(--ink); }

.page-skip { position: fixed; z-index: 3; top: 1rem; left: 1rem; transform: translateY(-200%); padding: .65rem 1rem; min-height: var(--target); background: var(--sheet); }
.page-skip:focus { transform: translateY(0); }
.page-wrap { width: min(100% - var(--gutter) * 2, var(--wide)); margin-inline: auto; }
.page-masthead { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-block: 1.25rem; border-top: .45rem double var(--brass); border-bottom: 2px solid var(--line); }
.page-brand { display: flex; align-items: center; gap: .8rem; min-height: var(--target); padding-block: .25rem; text-decoration: none; font-weight: 600; font-size: 1.35rem; line-height: 1.1; max-width: 22rem; }
.page-brand-mark { flex: 0 0 2.2rem; width: 2.2rem; height: 2.6rem; border: .35rem solid var(--teal); border-bottom-width: .7rem; border-radius: 1.4rem 1.4rem 0 0; position: relative; }
.page-brand-mark::before { content: ''; position: absolute; inset: .3rem .25rem -.4rem; border: .15rem solid var(--paper); border-radius: 1rem 1rem 0 0; }
.page-directory-jump { display: inline-flex; align-items: center; gap: .65rem; min-height: var(--target); padding: .5rem .1rem .5rem .7rem; font-size: var(--small); white-space: nowrap; }
.page-directory-jump span { font-size: 1.4rem; }
.page-intro { padding-block: var(--space) 2.5rem; }
.page-topic { color: var(--brass-ink); font-size: var(--small); margin-bottom: 1.1rem; }
.page-deck { max-width: 52ch; margin-top: 1.25rem; font-size: clamp(1.25rem, 2vw, 1.5rem); line-height: 1.4; }
.page-date { display: block; margin-top: 1.5rem; font-size: var(--small); color: var(--teal); }
.page-article { padding-bottom: var(--space); }
.page-article-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(12rem, 18rem); gap: 5rem; align-items: start; }
.page-story { min-width: 0; max-width: var(--measure); }
.page-summary { position: relative; background: var(--pale); padding: clamp(1.5rem, 4vw, 2.25rem); border-radius: 1rem 4rem 1rem 1rem; margin-bottom: 3.25rem; }
.page-summary-title { font-size: 1.45rem; margin-bottom: 1rem; color: var(--teal); }
.page-summary p { max-width: var(--measure); }
.page-summary-title + p { margin-top: 0; }
.page-summary::after { content: ''; display: block; width: 5rem; border-bottom: .4rem double var(--brass); margin-top: 1.5rem; }
.page-section { margin-block: 0 3rem; scroll-margin-top: 2rem; }
.page-section-title { margin-bottom: 1.2rem; }
.page-section p { max-width: var(--measure); }
.page-section ul { margin-top: 1.25rem; }
.page-note { background: var(--sand); padding: 2rem; border-radius: 2rem 2rem 1rem 1rem; }
.page-note .page-section-title { font-size: 1.65rem; }
.page-urgent { padding: 2rem; background: var(--sheet); border: 3px solid var(--clay); border-radius: 1.5rem; }
.page-urgent .page-section-title { color: var(--clay); }
.page-links { display: flex; flex-wrap: wrap; gap: .5rem 1.3rem; margin-top: 1.5rem; }
.page-links a { display: inline-flex; align-items: center; min-height: var(--target); padding-block: .5rem; }
.page-reading-note { background: var(--sheet); padding: 1.6rem; border-radius: 5rem 5rem 1rem 1rem; padding-top: 3rem; margin-top: .4rem; }
.page-reading-note .page-reading-title { font-size: 1.45rem; }
.page-reading-note p:not(.page-reading-title) { font-size: var(--small); margin-top: 1rem; }
.page-reading-note a { display: flex; align-items: center; min-height: var(--target); font-size: var(--small); margin-top: .75rem; }
.page-reading-note::before { content: ''; display: block; width: 2rem; height: .7rem; background: var(--brass); margin: 0 auto 1.5rem; }
.page-source-link { background: var(--sheet); border-radius: var(--soft); padding: 1.25rem 1.5rem; display: flex; flex-wrap: wrap; align-items: center; gap: .25rem 1.25rem; font-size: var(--small); margin-top: 2rem; }
.page-source-link a { display: inline-flex; align-items: center; min-height: var(--target); }
.page-next { display: flex; justify-content: space-between; align-items: center; gap: 1.5rem; padding: 1.25rem 0; min-height: var(--target); border-top: 3px solid var(--brass); margin-top: 2rem; text-decoration: none; font-size: 1.4rem; line-height: 1.25; }
.page-next:hover .page-next-title { text-decoration: underline; text-underline-offset: .2em; }
.page-next-label { display: block; font-size: var(--small); color: var(--brass-ink); margin-bottom: .35rem; }
.page-arrow { font-size: 2rem; }
.page-plate { background: var(--pale); border-radius: var(--soft); overflow: hidden; margin: 0 0 3rem; }
.page-plate img { width: 100%; }
.page-plate figcaption { font-size: var(--small); padding: 1rem 1.5rem; color: var(--teal); background: var(--pale); }
.page-table { margin-top: 1.5rem; border-collapse: collapse; width: 100%; text-align: left; }
.page-table th, .page-table td { border-bottom: 2px solid var(--line); padding: 1.1rem 1rem 1.1rem 0; vertical-align: top; }
.page-table th { font-weight: 600; width: 36%; color: var(--teal); }
.page-table a { display: flex; align-items: center; min-height: var(--target); font-size: var(--text); }
.page-table td a { margin-top: .5rem; font-size: var(--small); }
.page-table td p { margin: 0; }

.page-home .page-intro { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(18rem, .85fr); gap: 4rem; align-items: center; padding-block: 3.25rem 3rem; }
.page-home h1 { font-size: clamp(2.9rem, 5.6vw, 5rem); max-width: 14ch; }
.page-cover-plate { align-self: center; margin: 0; }
.page-cover-plate img { width: 100%; border-radius: var(--arch); }
.page-cover-plate figcaption { font-size: var(--small); color: var(--brass-ink); padding: .8rem .5rem 0; }
.page-home .page-article-grid { grid-template-columns: minmax(0, 1fr); }
.page-home .page-story { max-width: none; }
.page-home .page-summary { display: grid; grid-template-columns: 1fr 1.5fr; column-gap: 3rem; border-radius: 1rem 5rem 1rem 1rem; padding: 2.5rem; }
.page-home .page-summary-title { grid-row: span 3; font-size: 2rem; }
.page-home .page-summary p { max-width: var(--measure); }
.page-home .page-summary::after { grid-column: 2; }
.page-home .page-section { display: grid; grid-template-columns: 1fr 1.5fr; column-gap: 3rem; padding: 2.5rem 0; margin-bottom: 1rem; border-bottom: 2px solid var(--line); }
.page-home .page-section-title { grid-row: span 6; max-width: 14ch; }
.page-home .page-section > :not(.page-section-title) { grid-column: 2; }
.page-home .page-section .page-links { margin-top: 1rem; }
.page-home .page-table th { width: 38%; }
.page-home .page-source-link, .page-home .page-next { max-width: 44rem; margin-left: auto; }
.page-missing .page-article-grid { grid-template-columns: 1fr; }
.page-missing .page-story { max-width: 44rem; }

.page-source-groups { display: grid; grid-template-columns: 1fr 1fr; gap: 3.5rem 4rem; margin-bottom: 3rem; }
.page-source-group { min-width: 0; border-top: 4px solid var(--brass); padding-top: 1.5rem; scroll-margin-top: 2rem; }
.page-source-group h2 { font-size: 1.75rem; }
.page-source-group ul { list-style: none; padding: 0; margin-top: 1rem; }
.page-source-group li + li { margin-top: 1.5rem; }
.page-source-group a { display: flex; align-items: center; min-height: var(--target); font-weight: 600; line-height: 1.35; }
.page-source-group p { font-size: 1.125rem; margin-top: .5rem; }
.page-sources .page-article-grid { grid-template-columns: 1fr; }
.page-sources .page-story { max-width: none; }
.page-sources .page-summary { max-width: 46rem; }
.page-sources .page-section, .page-sources .page-next { max-width: 46rem; }

.page-footer { background: var(--sand); padding-block: var(--space) 2rem; border-top: .5rem double var(--brass); }
.page-footer-heading { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; margin-bottom: 2.5rem; }
.page-footer-heading h2 { max-width: 18ch; }
.page-footer-heading a { display: inline-flex; align-items: center; min-height: var(--target); font-size: var(--small); }
.page-directory { display: grid; grid-template-columns: 1.15fr 1fr .9fr 1fr; gap: 2.5rem; }
.page-directory h3 { color: var(--brass-ink); margin-bottom: 1rem; font-size: 1.2rem; }
.page-directory ul { list-style: none; padding: 0; }
.page-directory li + li { margin-top: .2rem; }
.page-directory a { display: flex; align-items: center; min-height: var(--target); padding: .5rem 0; line-height: 1.3; font-size: 1.0625rem; }
.page-directory a[aria-current='page'] { font-weight: 600; text-decoration-thickness: .15em; }
.page-footer-note { max-width: 65ch; margin-top: 3rem; padding-top: 1.5rem; border-top: 2px solid var(--line); font-size: 1.0625rem; }
.page-end { display: flex; gap: .5rem 2rem; flex-wrap: wrap; margin-top: 1rem; font-size: 1rem; }
.page-end a { display: inline-flex; align-items: center; min-height: var(--target); }

@media (max-width: 70rem) {
  .page-article-grid { gap: 3rem; grid-template-columns: minmax(0, 1fr) 14rem; }
  .page-home .page-intro { gap: 2rem; }
  .page-directory { gap: 1.75rem; }
}
@media (max-width: 54rem) {
  .page-article-grid { grid-template-columns: minmax(0, 1fr); }
  .page-reading-note { display: none; }
  .page-story { max-width: var(--measure); }
  .page-home .page-intro { grid-template-columns: minmax(0, 1.15fr) minmax(12rem, .85fr); gap: 1.25rem; }
  .page-home h1 { font-size: clamp(2.8rem, 6vw, 4rem); }
  .page-directory { grid-template-columns: 1fr 1fr; gap: 2.5rem; }
  .page-home .page-summary, .page-home .page-section { column-gap: 1.5rem; }
  .page-source-groups { gap: 3rem 2.5rem; }
}
@media (max-width: 38rem) {
  :root { --text: 1.1875rem; --space: 2.75rem; }
  h1 { max-width: 17ch; }
  .page-masthead { align-items: flex-start; padding-block: 1rem; gap: 1rem; }
  .page-brand { font-size: 1.1rem; max-width: 12rem; gap: .6rem; }
  .page-brand-mark { flex-basis: 1.7rem; width: 1.7rem; height: 2.25rem; border-width: .27rem; border-bottom-width: .55rem; }
  .page-directory-jump { font-size: 1rem; padding: .25rem 0; gap: .3rem; }
  .page-intro { padding-bottom: 2rem; }
  .page-home .page-intro { grid-template-columns: 1fr; gap: 2rem; padding-top: 2.5rem; }
  .page-home h1 { font-size: clamp(2.8rem, 11.5vw, 4rem); max-width: 14ch; }
  .page-cover-plate { width: 100%; max-width: 27rem; margin-inline: auto; }
  .page-cover-plate img { max-height: 22rem; object-fit: cover; border-radius: 10rem 10rem 1rem 1rem; }
  .page-home .page-summary { display: block; padding: 1.5rem; }
  .page-home .page-summary-title { font-size: 1.6rem; }
  .page-home .page-section { display: block; padding-block: 1.5rem; margin-bottom: 1.5rem; }
  .page-home .page-section-title { max-width: 20ch; }
  .page-summary { border-top-right-radius: 3rem; margin-bottom: 2.5rem; }
  .page-note, .page-urgent { padding: 1.5rem; }
  .page-table, .page-table tbody, .page-table tr, .page-table th, .page-table td { display: block; width: 100%; }
  .page-table tr { border-bottom: 2px solid var(--line); padding-block: 1rem; }
  .page-table th, .page-table td { border: 0; padding: 0; width: 100%; }
  .page-home .page-table th { width: 100%; }
  .page-table th { margin-bottom: .4rem; }
  .page-table td a { margin-top: .25rem; }
  .page-table { margin-top: .5rem; }
  .page-source-groups { grid-template-columns: 1fr; gap: 2.5rem; }
  .page-directory { gap: 2rem 1.5rem; }
  .page-directory h3 { font-size: 1.1rem; line-height: 1.25; min-height: 2.75rem; }
  .page-directory a { font-size: 1rem; }
  .page-footer-heading { margin-bottom: 2rem; }
  .page-footer-note { margin-top: 2rem; }
  .page-plate figcaption { padding-inline: 1rem; }
}
@media print {
  :root { --paper: white; --sheet: white; --ink: black; --text: 12pt; }
  .page-masthead, .page-footer, .page-reading-note, .page-source-link, .page-next, .page-skip { display: none; }
  .page-wrap { width: 100%; }
  .page-article-grid { display: block; }
  .page-story { max-width: none; }
  .page-section, .page-summary { break-inside: avoid; }
  .page-intro { padding-top: 0; }
  .page-cover-plate { max-width: 15rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

.page-brand-note { display: block; font-size: 1rem; font-weight: 400; margin-top: .35rem; line-height: 1.2; }
.page-table-caption { text-align: left; font-size: var(--small); color: var(--brass-ink); padding-bottom: .5rem; }
