/* Shared vocabulary controls, following the mobile book reference. */
.word-browser { max-width: 960px; margin-inline: auto; }
.word-list-heading { padding: 4px 0 16px; }
.word-list-heading h1 { font-size: clamp(27px, 4vw, 38px); line-height: 1.45; letter-spacing: 0; margin: 0 0 12px; overflow-wrap: anywhere; }
.word-list-heading > p:not(.eyebrow) { font-size: 14px; max-width: 62ch; }
.word-list-heading .word-stats { margin-top: 9px; color: var(--muted); }
.word-search, .word-detail-top > .word-search { display: block; width: 100%; min-height: 0; max-width: 750px; border: 0; border-radius: 0; background: transparent; overflow: visible; text-align: left; }
.word-browser > .word-search { max-width: none; }
.word-search:focus-within { outline: none; }
.word-search-label { display: block; font: 500 14px/1.6 var(--sans); color: var(--ink); margin-bottom: 9px; }
.word-search-field { min-height: 54px; display: flex; align-items: center; border: 1px solid #acb7ad; border-radius: 6px; background: #fffefa; overflow: hidden; }
.word-search-field:focus-within { outline: 2px solid #54735b; outline-offset: 3px; }
.word-search-field > .icon { width: 20px; height: 20px; flex: 0 0 20px; margin-left: 15px; color: var(--muted); }
.word-search input, .word-detail-top .word-search input { width: 0; min-width: 0; flex: 1; min-height: 52px; font: 16px/1.5 var(--sans); padding: 12px; outline: none; }
.word-search input::placeholder { color: #738077; opacity: 1; }
.word-search button, .word-detail-top .word-search button { padding: 0 20px; min-width: 72px; min-height: 52px; font-size: 15px; flex-shrink: 0; }
.word-search button span { display: none; }
.word-filter-section { margin-top: 14px; }
.word-filter-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.word-filter-heading h2 { font: 500 15px/1.6 var(--sans); }
.word-filter-heading a { display: inline-flex; align-items: center; min-height: 44px; font-size: 13px; gap: 8px; color: var(--muted); }
.word-alphabet { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 3px; padding: 4px 0 18px; border-bottom: 1px solid var(--line); }
.word-alphabet a { display: flex; align-items: center; justify-content: center; min-width: 0; min-height: 44px; padding: 0; border-radius: 5px; font: 16px/1 var(--sans); }
.word-alphabet a[aria-current] { background: var(--ink); color: var(--paper); }
.word-results-label { padding: 14px 0 10px; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.word-results-label h2 { font: 500 24px/1.5 var(--serif); color: var(--ink); overflow-wrap: anywhere; }
.word-results-label p { margin-top: 4px; color: var(--muted); font-size: 13px; }
.word-results-label > span { color: var(--muted); font-size: 12px; white-space: nowrap; }
.word-list { border-top: 1px solid var(--line); }
.word-list-row { padding: 18px 28px 18px 0; position: relative; grid-template-columns: minmax(0, 1fr); gap: 6px; }
.word-list-identity { flex-direction: row; align-items: baseline; flex-wrap: wrap; gap: 4px 14px; }
.word-list-identity strong { font: 500 26px/1.4 Georgia, var(--serif); }
.word-list-pron { font-size: 14px; overflow-wrap: anywhere; }
.word-list-definition { font-size: 15px; line-height: 1.8; }
.word-row-arrow { position: absolute; right: 2px; top: 24px; font-size: 18px; color: #79867b; }
.word-empty { padding: 38px 0; }
.word-empty h3 { font: 500 23px/1.5 var(--serif); margin-bottom: 10px; }
.word-empty p { font-size: 14px; line-height: 1.8; }
.word-empty-actions { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 4px 24px; margin-top: 12px; }
.word-empty-actions a { display: inline-flex; align-items: center; min-height: 44px; margin-top: 0; font-size: 14px; }
.word-endnote { margin: 28px 0; }
.word-detail-top { padding: 4px 0 28px; }
.word-detail-top > .word-search { max-width: 680px; margin: 0; }
.word-entry-section h2 { line-height: 1.5; }
.word-intro { padding-top: 14px; }
.word-intro .word-search { margin-top: 22px; }
.word-search-label { letter-spacing: 0; }
@media (min-width: 375px) { .word-alphabet { grid-template-columns: repeat(7, minmax(0, 1fr)); } }
@media (min-width: 800px) {
    .word-list-heading { padding: 18px 0 30px; }
    .word-filter-section { margin-top: 26px; }
    .word-alphabet { grid-template-columns: repeat(14, minmax(0, 1fr)); gap: 5px; padding-bottom: 22px; }
    .word-list-row { grid-template-columns: minmax(220px, 1fr) minmax(0, 2fr); gap: 28px; padding: 22px 35px 22px 0; }
    .word-list-identity { flex-direction: column; gap: 4px; }
    .word-list-definition { font-size: 16px; }
    .word-row-arrow { top: 32px; }
    .word-detail-top { justify-content: flex-end; }
    .word-detail-top > .word-search { max-width: 470px; }
}
