.wr-wrap { max-width: 980px; }
.wr-sprong { margin-bottom: 8px; }
.wr-sectie { scroll-margin-top: 90px; }
.wr-sectie + .wr-sectie { margin-top: 8px; }
.wr-lead { font-size: 1.06rem; }
.wr-lead p:last-child { margin-bottom: 0; }

.wr-klanken { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.wr-klank { background: var(--wit); border: 1px solid var(--rand); border-radius: var(--radius); padding: 14px 16px; }
.wr-klank h3 { margin: 0 0 6px; font-size: 1.12rem; }
.wr-klank p { margin: 0; }
.wr-vb { margin-top: 8px; }
.wr-vb a { font-weight: 700; }

.wr-eerst { list-style: none; margin: 0 0 16px; padding: 0; display: grid; gap: 8px; }
.wr-eerst a { display: flex; flex-direction: column; gap: 2px; min-height: 44px; padding: 10px 14px; background: var(--wit); border: 1px solid var(--rand); border-radius: var(--radius-s); text-decoration: none; color: var(--tekst); }
.wr-eerst a:hover { border-color: var(--zee); }
.wr-eerst strong { font-family: var(--font-kop); font-size: 1.25rem; font-weight: 600; color: var(--zee-donker); }
.wr-eerst[hidden] { display: none; }

.wr-abc { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 14px; }
.wr-abc a { min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; padding: 0 8px; border-radius: var(--radius-s); background: var(--wit); border: 1.5px solid var(--rand); text-decoration: none; font-weight: 700; color: var(--zee); }
.wr-abc a:hover { border-color: var(--zee); background: var(--zee-licht); }

.wr-letter { scroll-margin-top: 90px; }
.wr-letterkop { margin: 16px 0 8px; color: var(--zee); font-family: var(--font-kop); font-weight: 600; font-size: 1.15rem; }
.wr-letter[hidden], .wr-blok[hidden], .wr-kaart[hidden], .wr-rij[hidden] { display: none; }
.wr-abc[hidden], .wr-abc a[hidden], .wr-kaarten[hidden], [data-wr-treffers][hidden], [data-wr-hoor][hidden], [data-wr-reeks][hidden], [data-wr-leeg][hidden], [data-wr-volgorde][hidden], [data-wr-bij][hidden] { display: none !important; }
.wr-bij { margin: 0 0 8px; color: var(--tekst-zacht); }
.wr-kaart-bij { border-style: dashed; }

.wr-kaarten { display: grid; gap: 10px; }
.wr-kaart { background: var(--wit); border: 1px solid var(--rand); border-radius: var(--radius); padding: 14px 16px; box-shadow: var(--schaduw); min-width: 0; }
.wr-woord { font-family: var(--font-kop); font-weight: 600; font-size: 1.45rem; line-height: 1.25; margin: 0; overflow-wrap: anywhere; color: var(--zee-donker); }
.wr-nl { margin: 4px 0 8px; font-weight: 600; }
.wr-ook, .wr-toe { margin: 0 0 8px; color: var(--tekst-zacht); }
.wr-zeg { margin: 0 0 10px; padding: 8px 12px; background: var(--zand); border-radius: var(--radius-s); }
.wr-zeg-label { font-weight: 700; color: var(--zee); }
.wr-meta { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 0; }
.wr-vers { display: block; font-size: .8rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--tekst-zacht); margin-bottom: 4px; }

.wr-lees { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.wr-bronnen { padding-left: 20px; }
.wr-bronnen li { margin-bottom: 8px; }

@media (min-width: 800px) {
  .wr-eerst { grid-template-columns: 1fr 1fr; }
  .wr-woorden { grid-template-columns: 1fr 1fr; }
  .wr-klanken { grid-template-columns: 1fr 1fr; }
}