.page {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  max-width: calc(var(--measure) + 16rem);
  margin: 0 auto;
  padding: 3rem 2rem 6rem;
  gap: 2rem;
}
@media (min-width: 1024px) {
  .page {
    grid-template-columns: 13rem minmax(0, 1fr);
    max-width: calc(var(--measure) + 22rem);
  }
}
.content {
  max-width: var(--measure);
  width: 100%;
  margin: 0 auto;
}
.episode-nav { font-family: var(--font-ui); font-size: 0.85rem; }
.episode-nav ol { display: grid; gap: 0.15rem; }
.episode-nav a {
  display: grid;
  grid-template-columns: 1.6rem 1fr;
  gap: 0.5rem;
  text-decoration: none;
  color: var(--color-ink-soft);
  padding: 0.25rem 0.5rem;
  border-radius: 0.2rem;
}
.episode-nav a:hover { background: var(--color-shade); color: var(--color-ink); }
.episode-nav a[aria-current="page"] {
  color: var(--color-ink);
  background: var(--color-shade);
  font-weight: 500;
}
.episode-nav .ep-num {
  font-variant-numeric: tabular-nums;
  text-align: right;
  color: var(--color-ink-soft);
}

@media (max-width: 1023px) {
  .episode-nav {
    border-bottom: 1px solid var(--color-rule);
    padding-bottom: 1rem;
    margin-bottom: 1rem;
  }
  .episode-nav ol {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 0.5rem;
  }
  .episode-nav .ep-num { display: none; }
}