/* Bible reader pages (site/bible/). Uses the tokens in site.css; popover styles are in refs.css. */
@import url("../refs.css");
:root{--size:19px}

.reader{margin-top:28px;background:var(--panel);border:1px solid var(--rule);border-radius:4px}
.rbar{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;justify-content:space-between;padding:12px 16px;
  border-bottom:1px solid var(--rule);background:var(--panel-2);border-radius:4px 4px 0 0}
.pick{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:0}
.reader select,.tbtn,.seg button{font:inherit;font-size:13.5px;color:var(--ink);background:var(--panel);
  border:1px solid var(--rule);border-radius:4px;padding:6px 10px;cursor:pointer}
.tbtn:disabled{opacity:.45;cursor:default}
.opts{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.seg{display:inline-flex}
.seg button{border-radius:0}
.seg button:first-child{border-radius:4px 0 0 4px}
.seg button:last-child{border-radius:0 4px 4px 0;margin-left:-1px}
.seg button[aria-pressed="true"],.tbtn[aria-pressed="true"]{background:var(--ink);color:var(--panel);border-color:var(--ink)}
.rbody{padding-block:26px 30px;padding-inline:clamp(16px,5vw,56px)}
.rtitle{display:flex;flex-direction:column;gap:4px;margin-bottom:6px}
.rtitle .eyebrow a,.bookidx .eyebrow a{color:inherit;text-decoration:none}
.rtitle .eyebrow a:hover,.bookidx .eyebrow a:hover{text-decoration:underline}
.hdnote{font-size:12.5px;color:var(--muted);margin:2px 0 18px;max-width:62ch}
.hdnote .sw{font-weight:600;font-size:11px;letter-spacing:.08em;text-transform:uppercase}

.text{font-family:Spectral,Georgia,serif;font-size:var(--size);line-height:1.75;color:var(--ink);max-width:62ch}
.sechd{font-family:"IBM Plex Sans",system-ui,sans-serif;font-weight:600;font-size:12px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--muted);margin:1.9em 0 .15em}
.sechd.minor{font-size:11px}
.text > .sechd:first-child{margin-top:.4em}
.bookdiv{font-family:Spectral,Georgia,serif;font-weight:600;font-size:1.2em;margin:1.4em 0 .2em}
.xref{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:12px;color:var(--muted);margin:0 0 .9em;line-height:1.5}
.xref a{color:var(--muted)}
.title{font-style:italic;color:var(--ink-soft);margin:0 0 .5em}
.para{margin:0 0 1em}
.para.pmo{margin-left:1.2em}
.para.pc{text-align:center}
.poem{margin:0 0 1em}
.line{display:block;padding-left:2.2em;text-indent:-1.6em}
.line.q2{padding-left:3.4em}
.line.li1{padding-left:2em}
.line.li2{padding-left:3.2em}
.line.qr{text-align:right;font-style:italic}
.line.qa{font-family:"IBM Plex Sans",system-ui,sans-serif;font-weight:600;font-size:.7em;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);text-indent:0;padding-left:0;margin-top:.8em}
.vn{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:.6em;color:var(--muted);margin-right:.25em;vertical-align:.5em;line-height:0;scroll-margin-top:30vh}
.hl{background:var(--hl);box-shadow:0 0 0 2px var(--hl);border-radius:2px}
.fn{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:.58em;line-height:1;vertical-align:.55em;
  color:var(--context);background:none;border:0;padding:0 .15em;cursor:pointer;font-style:italic}
.ybl-fn-text{font-size:15px}

/* reading options */
.text.noverses .vn{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.text.lines .para .vn:not(:first-child)::before{content:"\A";white-space:pre}
.text.lines .para{margin-bottom:.9em}

.notes{margin-top:24px;font-size:14px;color:var(--ink-soft);max-width:62ch}
.notes summary{cursor:pointer;color:var(--muted)}
.notes ol{padding-left:1.4em;display:grid;gap:4px}
.rnav{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;border-top:1px solid var(--rule);margin-top:26px;padding-top:14px;font-size:14px}
.rnav a{color:var(--context);text-decoration:none;font-weight:500}
.rnav a:hover{text-decoration:underline}
.credit{font-size:12px;color:var(--muted);margin:14px 0 0}
.credit a{color:inherit}

/* book and chapter lists */
.bookidx{margin-top:32px;display:flex;flex-direction:column;gap:14px}
.bookidx .sub{color:var(--ink-soft);max-width:62ch;margin:0}
.testaments{display:grid;gap:28px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));margin-top:10px}
.testaments h2{border-bottom:1px solid var(--rule);padding-bottom:8px;margin-bottom:6px}
ol.books{list-style:none;margin:0;padding:0;columns:2;column-gap:20px}
ol.books li{display:flex;justify-content:space-between;gap:8px;padding:4px 0;break-inside:avoid;border-bottom:1px solid var(--rule-soft)}
ol.books a{color:var(--ink);text-decoration:none}
ol.books a:hover{color:var(--context);text-decoration:underline}
ol.books span{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.chapnums{display:flex;flex-wrap:wrap;gap:6px}
.chapnums a{min-width:44px;text-align:center;padding:9px 6px;border:1px solid var(--rule);border-radius:4px;background:var(--panel);
  color:var(--ink);text-decoration:none;font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:13px}
.chapnums a:hover{border-color:var(--context);color:var(--context)}
@media (max-width:420px){ol.books{columns:1}}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto !important}}
