.list-hero { margin: 0 0 22px; }
.list-hero h1 { font-size: clamp(1.6rem, 4vw, 2.2rem); margin: 0 0 8px; }
/* The word pages hold their gloss to a single short line under the headword.
   Here it is a paragraph over a full-width table, and inheriting that width left
   it wrapping in a narrow column beside a lot of empty space. */
.list-hero .hero-gloss { max-width: 62ch; font-size: 1rem; }
.list-cta {
  display: inline-block; margin-top: 14px; padding: 12px 22px; border-radius: 999px;
  background: var(--theme-1); color: var(--theme-1-ink); font-weight: 700; text-decoration: none;
}
.list-cta:hover { filter: brightness(1.06); }
.list-cta-note { color: var(--muted); font-size: .85rem; margin: 8px 0 0; }
/* The word cards themselves come from WORD_CARD_CSS via wort/style.css. */
.word-grid { margin: 18px 0; }
.list-more { color: var(--muted); font-size: .9rem; }
.list-next { margin-top: 30px; padding-top: 18px; border-top: 1px solid var(--line); }
.list-next-links { display: flex; flex-wrap: wrap; gap: 14px; }
.list-group { margin-top: 28px; }
.list-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
.list-card {
  display: flex; flex-direction: column; gap: 3px; padding: 13px 15px;
  border: 1px solid var(--line); border-radius: 12px; text-decoration: none;
}
.list-card:hover { border-color: var(--theme-1); }
.list-card span { color: var(--muted); font-size: .82rem; }

@media (max-width: 560px) {
}