/* Higher Praise Bible reader — chapter/verse/book/version/compare pages.
   Built on hp.css's own tokens (--accent, --ink, --font-read); no new type scale. */

.reader-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin-bottom:20px}
.reader-toolbar .select{height:40px}

.chapter-nav{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:28px 0}
.chapter-nav a{flex:1;display:flex;align-items:center;gap:8px;padding:14px 18px;border:1px solid var(--rule);border-radius:var(--r-lg);color:var(--ink);text-decoration:none;font-weight:650;transition:border-color .15s,background-color .15s}
.chapter-nav a:hover{border-color:var(--ink-3);background:var(--surface-2)}
.chapter-nav a.next{justify-content:flex-end;text-align:right}
.chapter-nav a small{display:block;font-weight:600;color:var(--ink-3);font-size:12px;text-transform:uppercase;letter-spacing:.04em}

.verses{font-family:var(--font-read);font-size:clamp(19px,2vw,22px);line-height:1.85;color:var(--ink);max-width:70ch}
.verses .v{display:inline}
.verses .v .vn{font-family:var(--font-ui);font-weight:800;font-size:.62em;color:var(--accent);vertical-align:super;margin-right:.28em;user-select:none}
.verses .v{position:relative;padding:2px 3px;border-radius:6px}
.verses .v.is-bookmarked{background:color-mix(in srgb,var(--bm-color,var(--accent)) 16%,transparent)}
.verses .v a.v-link{color:inherit;text-decoration:none}
.verses .v a.v-link:hover{text-decoration:underline;text-decoration-color:var(--accent)}

/* Strong's tap-word overlay (KJV only) */
w.ws{cursor:pointer;border-bottom:1px dashed color-mix(in srgb,var(--accent) 55%,var(--ink-3));transition:background-color .12s}
w.ws:hover,w.ws:focus-visible{background:color-mix(in srgb,var(--accent) 14%,transparent);outline:none}

.ws-pop{position:fixed;z-index:60;max-width:320px;padding:14px 16px;border-radius:var(--r-lg);background:var(--ink);color:var(--ink-inverse);box-shadow:var(--shadow-3);font-family:var(--font-ui);font-size:14px;line-height:1.5}
.ws-pop b{display:block;font-size:16px;margin-bottom:2px}
.ws-pop .ws-pop__code{color:var(--accent-2,var(--accent));font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.04em}
.ws-pop[hidden]{display:none}

/* Study rail: commentary + cross-refs, collapsible */
.study-rail{margin-top:40px;border-top:2px solid var(--ink);padding-top:8px}
.study-rail details{border-bottom:1px solid var(--rule)}
.study-rail summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 0;font-weight:700;letter-spacing:-.01em;cursor:pointer}
.study-rail summary::-webkit-details-marker{display:none}
.study-rail summary .lucide{transition:transform .2s var(--ease);color:var(--ink-3)}
.study-rail details[open] summary .lucide{transform:rotate(45deg);color:var(--accent)}
.study-rail .commentary-entry{padding:0 0 22px;font-family:var(--font-read);font-size:17px;line-height:1.65;color:var(--ink-2)}
.study-rail .commentary-entry h4{font-family:var(--font-ui);font-size:14px;font-weight:750;color:var(--ink);margin:0 0 8px}

.xref-list{list-style:none;margin:0 0 22px;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.xref-verse{margin:0 0 14px}
.xref-verse__num{display:block;font-size:12px;font-weight:750;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);margin-bottom:8px}
.xref-verse .xref-list{margin-bottom:0}
.xref-list a{display:inline-flex;height:32px;align-items:center;padding:0 12px;border-radius:999px;border:1px solid var(--rule);font-size:13px;font-weight:650;color:var(--ink-2);text-decoration:none}
.xref-list a:hover{border-color:var(--ink-3);color:var(--ink)}

/* Bookmark control */
.bookmark-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.bm-swatch{width:26px;height:26px;border-radius:50%;border:2px solid transparent;cursor:pointer;padding:0}
.bm-swatch[data-color="yellow"]{background:#F5C518}
.bm-swatch[data-color="green"]{background:#2E9E5B}
.bm-swatch[data-color="blue"]{background:#3468C0}
.bm-swatch[data-color="orange"]{background:#E8791A}
.bm-swatch[data-color="pink"]{background:var(--accent)}
.bm-swatch.is-active{border-color:var(--ink)}

/* Interlinear */
.interlinear{display:flex;flex-wrap:wrap;gap:16px 20px;font-family:var(--font-ui)}
.interlinear .il{text-align:center;min-width:52px}
.interlinear .il b{display:block;font-family:var(--font-read);font-size:18px}
.interlinear .il small{display:block;color:var(--ink-3);font-size:11px}
.interlinear .il em{display:block;color:var(--ink-2);font-size:12px;font-style:italic}

/* Compare page */
.compare-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 32px}
.compare-col{font-family:var(--font-read);font-size:18px;line-height:1.8}
.compare-col h3{font-family:var(--font-ui);font-size:14px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-3);margin:0 0 14px}
.compare-col .v{display:block;margin-bottom:10px}
.compare-col .v .vn{font-family:var(--font-ui);font-weight:800;color:var(--accent);margin-right:.35em;font-size:13px;vertical-align:super}
@media(max-width:760px){.compare-grid{grid-template-columns:1fr;gap:32px}}

/* Community notes */
.note-card{padding:16px 18px;border:1px solid var(--rule);border-radius:var(--r-lg);background:var(--surface)}
.note-card + .note-card{margin-top:10px}
.note-card__meta{display:flex;justify-content:space-between;color:var(--ink-3);font-size:12px;font-weight:650;margin-bottom:6px}

/* Guest sign-up prompt where a member control would otherwise leave a gap */
.bookmark-row__guest{display:inline-flex;align-items:center;gap:6px;color:var(--ink-2);text-decoration:none;font-weight:650}
.bookmark-row__guest:hover{color:var(--accent)}
.highlight-row{margin-bottom:8px}
.highlight-row__guest-note a{color:var(--accent);font-weight:650}

/* Small select/icon-button variants used in the reader + account library */
.select--sm{height:34px;font-size:13px;padding:0 10px}
/* The folder picker sits on its own line as "Keep it in: [folder]" — bare, a full-width select showing a folder
   name read as a heading, not a control. */
.hl-folder{display:flex;align-items:center;gap:10px;flex-basis:100%;margin-top:6px}
.hl-folder[hidden]{display:none}
.hl-folder .select--sm{width:auto;min-width:200px;max-width:280px}
.icon-btn--sm{width:28px;height:28px;border-radius:8px}
.icon-btn--sm:hover{background:var(--surface-2)}

/* Account library: folders + saved-item rows */
.folder-list{display:flex;flex-wrap:wrap;gap:8px}
.folder-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 8px 6px 10px;border:1px solid var(--rule);border-radius:999px;font-size:13px;font-weight:650}
.folder-chip__dot{width:10px;height:10px;border-radius:50%;display:inline-block}
.folder-chip__dot[data-color="indigo"]{background:#4F5BD5}
.folder-chip__dot[data-color="green"]{background:#2E9E5B}
.folder-chip__dot[data-color="blue"]{background:#3468C0}
.folder-chip__dot[data-color="orange"]{background:#E8791A}
.folder-chip__dot[data-color="pink"]{background:var(--accent)}
.folder-chip__dot[data-color="slate"]{background:#64748B}
.library-row{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--rule)}
.library-row:last-child{border-bottom:none}
.library-row a{flex:1;color:var(--ink);text-decoration:none;font-weight:650}
.library-row a:hover{text-decoration:underline}
.bm-swatch--static{cursor:default;flex:none}