/* Spacious reading pages use the same paper and ink as the guide. */
.chapter-reader {
  --reader-gutter: clamp(1.2rem, 5vw, 4.8rem);
  --reader-width: 48rem;
  padding: 0 0 clamp(3.5rem, 6vw, 6.5rem);
  color: var(--ink);
  background: var(--paper);
}
.chapter-crumbs {
  padding: .9rem var(--reader-gutter);
  color: var(--soft);
  background: var(--cream);
}
.chapter-crumbs ol {
  display: flex;
  gap: .35rem .65rem;
  flex-wrap: wrap;
  width: min(100%, 72rem);
  margin: 0 auto;
  padding: 0;
  list-style: none;
  font: 500 .79rem/1.45 DM, Arial, sans-serif;
}
.chapter-crumbs li + li::before {content: "/"; margin-right: .65rem; color: #9c907b;}
.chapter-crumbs a {text-decoration: underline; text-underline-offset: .15em;}
.chapter-reader .chapter-heading {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin: 0;
  padding: clamp(3rem, 6.5vw, 6rem) max(var(--reader-gutter), calc((100% - var(--reader-width)) / 2));
  background: #e5e8d9;
  color: #344331;
}
.chapter-reader.chapter-join .chapter-heading {background: #f1e9d7; color: #534632;}
.chapter-reader.chapter-stadium .chapter-heading {background: #3c4d38; color: #fcf4df;}
.chapter-reader .chapter-heading h1 {
  max-width: 17ch;
  margin: .8rem 0 .75rem;
  font: 400 clamp(2.8rem, 6.5vw, 6.3rem)/.99 var(--serif);
  letter-spacing: -.05em;
  overflow-wrap: anywhere;
  text-wrap: balance;
}
.chapter-reader .chapter-heading > p:not(.chapter-meta) {
  max-width: 51ch;
  margin: 0;
  font-size: clamp(1rem, 1.65vw, 1.25rem);
  line-height: 1.55;
}
.chapter-reader .chapter-heading .chapter-deck {
  font: italic clamp(1.2rem, 2.6vw, 1.85rem)/1.28 var(--serif);
}
.chapter-reader .chapter-meta {
  color: #865336;
  font: 600 .73rem/1.5 DM, Arial, sans-serif;
  text-transform: uppercase;
  letter-spacing: .13em;
}
.chapter-reader.chapter-stadium .chapter-heading .chapter-meta {color: #ead4a1;}
.chapter-reader .chapter-section {
  width: min(calc(100% - 2 * var(--reader-gutter)), var(--reader-width));
  margin: clamp(2rem, 4.1vw, 3.75rem) auto 0;
  padding-top: clamp(1.35rem, 2.6vw, 2.3rem);
  border-top: 1px solid var(--rule);
  color: var(--ink);
  font-size: clamp(1rem, 1.15vw, 1.08rem);
  line-height: 1.75;
}
.chapter-reader .chapter-heading + .chapter-section {margin-top: clamp(2.25rem, 4.8vw, 4.2rem); border: none; padding-top: 0;}
.chapter-reader .chapter-section h2 {
  max-width: 24ch;
  margin: 0 0 .75rem;
  color: #444b37;
  font: 400 clamp(2rem, 3.5vw, 3.35rem)/1.05 var(--serif);
  letter-spacing: -.035em;
  text-wrap: balance;
}
.chapter-reader .chapter-meta + h2 {margin-top: .5rem;}
.chapter-reader .chapter-section p + p {margin-top: .8rem;}
.chapter-reader .chapter-section .primary {margin-top: 1rem;}
.chapter-reader .chapter-fields,
.chapter-reader .chapter-actions {max-width: 42rem;}
.chapter-reader fieldset {min-width: 0; border: 0; margin: 0; padding: 0;}
.chapter-screen-reader {position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap;}
.chapter-reader .recap-facts {max-width: 43rem; gap: 1rem 2rem; margin-top: 1.6rem;}
.chapter-reader .recap-facts dd {font-size: .95rem;}
.chapter-reader .recap-moments {column-gap: 2.35rem;}
.chapter-reader .recap-sidebar summary {padding: .55rem 0; cursor: pointer;}
.chapter-reader .recap-plate {margin-top: 1.4rem;}
.chapter-reader .recap-plate figcaption {padding-top: .8rem;}
@media (max-width: 34rem) {
  .chapter-reader .chapter-heading {padding-block: 2.6rem;}
  .chapter-reader .chapter-heading h1 {font-size: clamp(2.35rem, 11.8vw, 3.6rem);}
}
