/* A quiet chapter index. The list scrolls; its heading, close control and
   sponsorship action remain visible even on a short phone. */
#chapters-dialog {
  --chapter-menu-inset: 20px;
  --chapter-menu-height: calc(100svh - var(--chapter-menu-inset) * 2 - env(safe-area-inset-top) - env(safe-area-inset-bottom));
  position: fixed;
  inset: calc(var(--chapter-menu-inset) + env(safe-area-inset-top)) calc(var(--chapter-menu-inset) + env(safe-area-inset-right)) calc(var(--chapter-menu-inset) + env(safe-area-inset-bottom)) calc(var(--chapter-menu-inset) + env(safe-area-inset-left));
  width: min(680px, calc(100vw - var(--chapter-menu-inset) * 2 - env(safe-area-inset-left) - env(safe-area-inset-right)));
  max-width: none;
  max-height: var(--chapter-menu-height);
  margin: auto;
  padding: 0;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 18px;
  color: #fff;
  background: #171717;
  box-shadow: 0 24px 80px rgba(0,0,0,.35);
  opacity: 0;
  transform: translateY(8px);
  transition: opacity .16s ease, transform .16s ease;
}
#chapters-dialog[data-state="open"] { opacity: 1; transform: none; }
#chapters-dialog::backdrop {
  background: rgba(0,0,0,.7);
  backdrop-filter: none;
  opacity: 0;
  transition: opacity .16s ease;
}
#chapters-dialog[data-state="open"]::backdrop { opacity: 1; }
.chapter-navigation-shell {
  display: flex;
  flex-direction: column;
  max-height: calc(var(--chapter-menu-height) - 2px);
  overflow: hidden;
}
.chapter-navigation-heading {
  position: relative;
  flex: 0 0 auto;
  padding: 30px 36px 20px;
}
#chapters-dialog .eyebrow {
  padding-right: 44px;
  color: #FED545;
  font: 500 12px/1.5 var(--font-primary);
  letter-spacing: .045em;
}
#chapters-dialog h2 {
  margin: 12px 44px 0 0;
  color: #fff;
  font: 600 clamp(44px,4.5vw,64px)/1 var(--font-display);
  letter-spacing: -.015em;
}
#chapters-dialog .dialog-close {
  top: 18px;
  right: 18px;
  width: 44px;
  height: 44px;
  min-width: 44px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid rgba(255,255,255,.3);
  border-radius: 50%;
  background: transparent;
  color: #fff;
  font: 400 28px/1 var(--font-primary);
}
#chapters-dialog .dialog-close:hover { background: rgba(255,255,255,.08); }
#chapters-dialog .chapter-navigation-list {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: #707070 #171717;
  padding: 0 36px 8px;
}
#chapters-dialog .chapter-navigation-list > a {
  display: flex;
  align-items: center;
  gap: 18px;
  min-height: 54px;
  padding: 13px 4px;
  border-top: 1px solid rgba(255,255,255,.13);
  color: #fff;
  font: 500 18px/1.4 var(--font-primary);
  letter-spacing: -.01em;
  text-decoration: none;
  transition: color .15s ease, background-color .15s ease;
}
#chapters-dialog .chapter-navigation-list > a > span {
  flex: 0 0 24px;
  color: #BDBDBD;
  font: 500 12px/1.4 var(--font-primary);
  letter-spacing: 0;
}
#chapters-dialog .chapter-navigation-list > a:hover { background: rgba(255,255,255,.035); }
#chapters-dialog .chapter-navigation-list > a[aria-current="step"] {
  color: #FED545;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 5px;
}
#chapters-dialog .chapter-navigation-list > a[aria-current="step"] > span { color: #FED545; }
.chapter-navigation-giving {
  flex: 0 0 auto;
  padding: 20px 36px 28px;
  border-top: 1px solid rgba(255,255,255,.13);
}
#chapters-dialog :is(a,button):focus-visible {
  outline: 2px solid #FED545;
  outline-offset: -3px;
}
html.chapter-menu-open { overflow: hidden; }
html.chapter-menu-open body {
  position: fixed;
  top: var(--chapter-scroll-top, 0px);
  left: 0;
  width: 100%;
  padding-right: var(--chapter-scrollbar-gap, 0px);
  overflow: hidden;
}
@media (max-width:700px) {
  #chapters-dialog { --chapter-menu-inset: 12px; border-radius: 14px; }
  .chapter-navigation-heading { padding: 24px 20px 17px; }
  #chapters-dialog h2 { margin-top: 12px; font-size: 42px; }
  #chapters-dialog .dialog-close { top: 14px; right: 14px; }
  #chapters-dialog .chapter-navigation-list { padding: 0 20px 8px; }
  #chapters-dialog .chapter-navigation-list > a { min-height: 50px; font-size: 16px; padding-block: 12px; gap: 14px; }
  .chapter-navigation-giving { padding: 16px 20px 20px; }
  #chapters-dialog .giving-cta--compact { padding-inline: 14px; gap: 8px; }
  #chapters-dialog .giving-cta--compact .giving-cta__title { white-space: normal; font-size: 14px; }
}
@media (max-height:560px) and (orientation:landscape) {
  #chapters-dialog { --chapter-menu-inset: 10px; }
  .chapter-navigation-heading { padding: 16px 28px 12px; }
  #chapters-dialog h2 { margin-top: 5px; font-size: 36px; }
  #chapters-dialog .chapter-navigation-list { padding-inline: 28px; }
  #chapters-dialog .chapter-navigation-list > a { min-height: 44px; padding-block: 9px; font-size: 16px; }
  .chapter-navigation-giving { padding: 12px 28px 16px; }
}
@media (prefers-reduced-motion:reduce) {
  #chapters-dialog,#chapters-dialog::backdrop,#chapters-dialog .chapter-navigation-list > a { transition: none; }
  #chapters-dialog { transform: none; }
}