/* Long-form chapters use the same paper and ink as the directory. */
dialog:has(.chapter) { width: min(45rem, calc(100% - 2rem)); }
.chapter-heading { container-type: inline-size; }
.chapter .chapter-heading h2 {
  font-size: clamp(1.7rem, 15cqi, 3.55rem);
  overflow-wrap: break-word;
  max-width: 16ch;
  text-wrap: balance;
}
.chapter .chapter-heading .modal-meta,
.chapter .modal-meta {
  color: #875237;
  font-size: .75rem;
  line-height: 1.55;
}
.chapter-heading > p:last-child { max-width: 51ch; }
.chapter .chapter-section {
  margin-top: clamp(1.7rem, 4vw, 2.5rem);
  padding-top: clamp(1.35rem, 3vw, 1.9rem);
  border-top: 1px solid #cec8b7;
}
.chapter h3 {
  margin: 0 0 .65rem;
  font-size: clamp(1.7rem,4vw,2.15rem);
  line-height: 1.09;
  letter-spacing: -.025em;
}
.chapter .modal-meta + h3 { margin-top: .55rem; }
.chapter .chapter-footnote {
  margin-top: .55rem;
  color: #696455;
  font-size: .8rem;
}
.chapter .chapter-note {
  padding: 1.05rem 1.2rem;
  border-left: 2px solid #9da88a;
  background: #eaecdf;
  color: #48513e;
  font-size: .875rem;
  line-height: 1.55;
}
.chapter-actions,
.recap-links {
  margin: 1rem 0;
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
}
.chapter-actions button {
  border: 1px solid #c8c4b4;
  border-radius: .18rem;
  padding: .5rem .7rem;
  min-height: 2.75rem;
  background: transparent;
  color: #555640;
  font-size: .825rem;
  line-height: 1.4;
}
.chapter-actions button[aria-pressed="true"] {
  background: #e2e7d6;
  border-color: #839176;
  color: #3d4b33;
}
.chapter-actions button:hover { border-color: #899178; }
.chapter-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .9rem 1.05rem;
  margin: 1.25rem 0;
}
.chapter-fields label,
.chapter-check {
  color: #534b3f;
  font-size: .875rem;
  line-height: 1.5;
}
.chapter-fields label { display: grid; gap: .3rem; }
.chapter-fields .wide-field { grid-column: 1/-1; }
.chapter-fields input,
.chapter-fields select,
.chapter-fields textarea {
  display: block;
  width: 100%;
  min-width: 0;
  min-height: 2.75rem;
  padding: .48rem .65rem;
  border: 1px solid #b9b5a3;
  border-radius: .2rem;
  color: #433b31;
  background: #fffcf4;
  font: inherit;
  font-size: 1rem;
}
.chapter-fields textarea { resize: vertical; }
.chapter-fields textarea:focus-visible {
  outline: 2px solid #955439;
  outline-offset: 3px;
}
.chapter-check {
  display: flex;
  align-items: baseline;
  gap: .65rem;
  padding-block: .4rem;
}
.chapter-check input {
  flex: none;
  align-self: flex-start;
  width: 1.1rem;
  height: 1.1rem;
  margin: .15rem 0 0;
  accent-color: #566344;
}
.chapter button.primary { border: 0; }
.chapter .primary small { font-size: .73rem; opacity: .9; }
.chapter .chapter-feedback:not(:empty) {
  margin-top: .8rem;
  padding: .8rem 1rem;
  background: #e5e9d9;
  color: #3e4d35;
}
.chapter-stadium .chapter-heading {
  margin: -3.85rem calc(-1 * clamp(1.3rem, 5vw, 3.1rem)) 0;
  padding: 3.95rem clamp(1.3rem, 5vw, 3.1rem) 1.75rem;
  color: #efe6c7;
  background: #444f3d;
}
.chapter-stadium .chapter-heading h2 { color: #fcf5e5; }
.chapter-stadium .chapter-heading .modal-meta { color: #e5d5a9; }
.chapter-stadium .chapter-heading .chapter-deck {
  color: #e6e4d6;
  font: italic clamp(1.25rem,3vw,1.55rem)/1.27 var(--serif);
}
.recap-facts {
  display: flex;
  flex-wrap: wrap;
  gap: .8rem 1.3rem;
  margin: 1.25rem 0 0;
  padding-top: .8rem;
  border-top: 1px solid #bfc3a568;
}
.recap-facts dt { font-size: .69rem; text-transform: uppercase; letter-spacing: .09em; color: #dfd0ad; }
.recap-facts dd { margin: .12rem 0 0; font-size: .82rem; color: #f1ecd9; }
.chapter-stadium .chapter-heading + .chapter-section {
  margin-top: 1.4rem;
  padding-top: 0;
  border-top: 0;
}
.recap-moments {
  counter-reset: field-moment;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 1.25rem 0;
  padding: 0;
  column-gap: 1.25rem;
  list-style: none;
}
.recap-moments li {
  counter-increment: field-moment;
  display: flex;
  gap: .7rem;
  padding: .6rem 0;
  border-block-start: 1px solid #d5cfbf;
  font-size: .89rem;
}
.recap-moments li::before {
  content: counter(field-moment, decimal-leading-zero);
  color: #8e583a;
  font-variant-numeric: tabular-nums;
  font-size: .77rem;
}
.recap-sidebar {
  margin-top: 1.3rem;
  border-block: 1px solid #c1c7b1;
  padding: .6rem .95rem;
  background: #edf0e3;
}
.recap-sidebar summary {
  min-height: 2.1rem;
  align-content: center;
  cursor: pointer;
  color: #49553d;
}
.recap-sidebar summary:focus-visible { outline: 2px solid #955439; outline-offset: 2px; }
.recap-sidebar p { font-size: .9rem; }
.recap-sidebar p:last-child { margin-bottom: .7rem; }
.recap-links { gap: .35rem 1.2rem; }
.recap-links a {
  display: inline-flex;
  align-items: center;
  gap: .25rem;
  min-height: 2.65rem;
  border-bottom: 1px solid #9ca68b;
  color: #46553d;
  font-size: .875rem;
}
.recap-links a svg { width: .9rem; }
@media (max-width: 31rem) {
  .chapter-fields,
  .recap-moments { grid-template-columns: minmax(0, 1fr); }
}
.recap-plate {
  margin: 1.1rem 0 0;
  padding: clamp(.75rem, 3vw, 1.35rem);
  border: 1px solid #d9ceb3;
  border-radius: .15rem;
  background: #eee8d7;
  color: #6f6247;
}
.recap-plate svg { width: 100%; height: auto; display: block; }
.recap-plate figcaption {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: .2rem .85rem;
  margin-top: .65rem;
  padding-top: .6rem;
  border-top: 1px solid #c9bfa7;
  color: #685640;
  font-size: .75rem;
}
.recap-plate figcaption span { color: #4f503b; font: italic 1.13rem/1.35 var(--serif); }
.recap-captions { margin: .45rem 0 .6rem; padding-inline-start: 1.2rem; }
.recap-captions li { font-size: .88rem; }
