/* Rose Library (same file in olytis.com/library/ and library.olytis.com): book-style reading layout and the reading toolbar (reading.js).
   Loaded after style.css; only adds rules. --rd-size is set by reading.js (16-28px; default 20px, 18px on phones). */
:root{--rd-size:20px;--rd-lh:1.65;--rd-page:var(--bg);--rd-ink:var(--fg)}
@media (max-width:640px){:root{--rd-size:18px}}
body.rd-relaxed{--rd-lh:1.85}
/* White page tone (Rose theme only; Dark is the site's Dark theme) */
body.rd-white{--bg:#FFFFFF;--card:#FFFFFF;--target:#F6EEDF;--speak:#F7E6DC;--line:#E4D9C6}
body.rd-white{background:#FFFFFF}

/* text size applies to every Library view (results, book list, reading) */
main{font-size:var(--rd-size)}
main .r,main .bk{line-height:1.55}
main .bk small{font-size:max(15px,.8em)}

/* ---------- the reading view: a well-set book page ---------- */
body.rd-reading main{max-width:calc(30em + 40px);padding:26px 20px 64px;line-height:var(--rd-lh);color:var(--rd-ink)}
body.rd-reading.ra-on main{padding-bottom:190px}
body.rd-reading main>h2{font:600 clamp(1.25em,4vw,1.6em)/1.2 var(--head-font);letter-spacing:.08em;text-align:center;color:var(--acc);margin:.6em 0 .35em;text-wrap:balance}
body.rd-reading main>.note{text-align:center;font-size:max(15px,.78em);line-height:1.5;color:var(--mut);margin:0 auto .4em;max-width:30em;font-style:italic}
body.rd-reading main>#listen-top{display:flex;margin:.5em auto .6em;font-size:15px}
body.rd-reading .rd-chap{font:600 max(16px,.92em)/1.3 var(--head-font);letter-spacing:.14em;text-transform:uppercase;color:var(--acc);text-align:center;
  margin:1.4em 0 1.1em;padding:0 0 .7em;position:relative}
body.rd-reading .rd-chap::after{content:"";position:absolute;left:50%;bottom:0;width:72px;margin-left:-36px;border-bottom:1px solid var(--gold);opacity:.8}
/* paragraphs: no boxes or rules, book spacing; the number becomes a quiet marginal note */
body.rd-reading .p{border-bottom:0;padding:0;margin:0 0 .85em;border-radius:6px;scroll-margin-top:260px}
body.rd-reading .p .n{font:600 max(12px,.6em)/1 var(--ui-font);letter-spacing:.02em;color:var(--acc);opacity:.85;margin-right:.35em;vertical-align:.15em}
body.rd-reading .p .rfh{vertical-align:0;opacity:.4;width:28px;height:24px;margin-right:.2em}
body.rd-reading .p .rfh svg{width:13px;height:13px}
body.rd-reading .p:hover .rfh,body.rd-reading .p .rfh:focus-visible{opacity:1}
body.rd-reading .p.target{background:var(--target);padding:.35em .55em;margin-left:-.55em;margin-right:-.55em}
body.rd-reading .p.speaking{padding:.35em .55em .35em .9em;margin-left:-.9em;margin-right:-.55em}
body.rd-reading mark{padding:0 2px}
/* section navigation: calm, roomy buttons */
body.rd-reading main>.nav{margin:1.2em 0;align-items:center}
body.rd-reading main>.nav:last-child{margin-top:2em;padding-top:1.2em;border-top:1px solid var(--line)}
body.rd-reading main>.nav button{min-height:44px;padding:8px 18px;border-radius:999px;font:600 15px var(--ui-font);border-color:var(--line);background:var(--card)}
body.rd-reading main>.nav button:hover{border-color:var(--acc);color:var(--acc)}
@media (min-width:900px){
  /* wide screens: paragraph numbers sit in the left margin, like a study edition */
  body.rd-reading main{max-width:min(calc(30em + 40px),calc(100vw - 7.6em))}
  body.rd-reading .p{padding-left:0}
  body.rd-reading .p .n{position:absolute;left:-3.4em;width:2.9em;text-align:right;top:.42em;margin:0}
  body.rd-reading .p .rfh{position:absolute;right:-2.4em;top:.1em;margin:0}
  body.rd-reading .p.target .n,body.rd-reading .p.speaking .n{left:-2.85em}
}
@media (max-width:640px){
  body.rd-reading main{padding:18px 18px 56px}
  body.rd-reading .p{margin-bottom:.8em}
}

/* ---------- toolbar (inside the sticky Library header) ---------- */
#jump{flex-wrap:wrap;row-gap:6px}
.rd-tools{display:inline-flex;align-items:center;gap:4px;margin-left:8px}
#status:empty{display:none}
#gbtn{margin-left:auto}
.rd-tools .rd-btn{display:inline-flex;align-items:center;justify-content:center;gap:1px;min-width:40px;min-height:36px;padding:4px 9px;border-radius:8px;
  font:600 15px/1 var(--body-font);color:var(--fg);background:var(--btn);border:1px solid var(--line)}
.rd-tools .rd-minus{font-size:14px}.rd-tools .rd-plus{font-size:18px}
.rd-tools .rd-btn span{font-family:var(--ui-font);font-weight:600}
.rd-tools .rd-btn:disabled{opacity:.4}
.rd-tools .rd-size{min-width:3.6em;text-align:center;font:13px var(--ui-font);color:var(--mut)}
.rd-tools .rd-more{gap:6px;padding:4px 11px;font:600 13px var(--ui-font)}
.rd-tools .rd-more svg{width:16px;height:16px}
.rd-tools .rd-more[aria-expanded=true]{border-color:var(--acc);color:var(--acc)}
.rd-panel{max-width:980px;margin:8px auto 2px;padding:10px 12px;display:flex;flex-wrap:wrap;gap:10px 22px;align-items:center;justify-content:flex-start;
  background:var(--card);border:1px solid var(--line);border-radius:12px;font:14px var(--ui-font);color:var(--fg)}
.rl-head>.rd-panel{margin-left:auto;margin-right:auto}
@media (max-width:1004px){.rl-head>.rd-panel{margin-left:12px;margin-right:12px}}
.rd-panel[hidden]{display:none}
.rd-row{display:flex;align-items:center;gap:10px}
.rd-row-end{margin-left:auto;gap:8px}
.rd-lab{color:var(--mut);font-size:13px}
.rd-seg{display:inline-flex;border:1px solid var(--line);border-radius:999px;overflow:hidden}
.rd-seg .rd-opt{border:0;border-radius:0;min-height:38px;padding:6px 14px;background:var(--btn);font:600 14px var(--ui-font);color:var(--fg)}
.rd-seg .rd-opt+.rd-opt{border-left:1px solid var(--line)}
.rd-seg .rd-opt[aria-pressed=true]{background:var(--btn-on);color:var(--btn-on-fg)}
.rd-reset,.rd-done{min-height:38px;font:600 14px var(--ui-font)}
.rd-done{background:var(--btn-on);color:var(--btn-on-fg);border-color:var(--btn-on)}
@media (max-width:640px){
  .rd-tools{margin-left:0;flex:1 1 100%;justify-content:flex-end}
  #gbtn{margin-left:auto}
  .rd-tools .rd-btn{min-width:44px;min-height:44px}
  .rd-seg .rd-opt,.rd-reset,.rd-done{min-height:44px}
  .rd-panel{flex-direction:column;align-items:stretch}
  .rd-row{justify-content:space-between}
  .rd-row-end{margin-left:0;justify-content:flex-end}
}
@media print{.rd-tools,.rd-panel{display:none}}
