/* The archive reader: text settings, the progress line, the contents sheet on phones, notes in place.
   Driven by assets/reader.js; the settings are applied before paint by the boot line in each book's head
   (localStorage['hc-reader-v1'], local only). */

/* the paper tone: the light theme warmed, for reading only */
:root[data-theme="light"][data-rtheme="paper"]{
  --paper:#F2E9D8; --paper2:#E9DDC6; --card:#F7F0E2; --ink:#33291F; --ink2:#554636; --mute:#6E5E4A;
  --line:rgba(51,41,31,.15); --line2:rgba(51,41,31,.28); --gold-ink:#7A5F2E;
}
:root[data-theme="light"][data-rtheme="paper"] body{background:var(--paper)}

/* text settings */
.source-text{font-size:var(--rd-size,inherit);line-height:var(--rd-lh,inherit)}
:root[data-rmargin="wide"] .source-text{padding-inline:6%}
:root[data-ralign="left"] .source-text p,:root[data-ralign="left"] .source-text li,
:root[data-ralign="left"] .source-text dd,:root[data-ralign="left"] .source-text blockquote{text-align:left;-webkit-hyphens:manual;hyphens:manual}
@media (max-width:860px){
  :root:not([data-ralign="justify"]) .source-text p,:root:not([data-ralign="justify"]) .source-text li,
  :root:not([data-ralign="justify"]) .source-text dd,:root:not([data-ralign="justify"]) .source-text blockquote{text-align:left;-webkit-hyphens:manual;hyphens:manual}
}

/* long books: the phone lays out only what is near the screen */
.rd-long .source-text>p,.rd-long .source-text>div,.rd-long .source-text>blockquote,.rd-long .source-text>ul,.rd-long .source-text>ol,.rd-long .source-text>table{content-visibility:auto;contain-intrinsic-size:auto 7em}

/* the reading bar: book and chapter, the buttons, the progress line */
.readbar{align-items:center;transition:top .22s ease}
.readbar .rb-main{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;min-width:0;flex:1}
.readbar .rb-main .rb-book{max-width:45%}
.readbar .rb-main .rb-ch{max-width:55%}
.rb-btn{flex:none;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:34px;height:30px;padding:0 9px;border:1px solid var(--line2);border-radius:999px;background:transparent;color:var(--ink2);font-family:var(--ff-ui);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.rb-btn:hover,.rb-btn[aria-expanded="true"]{border-color:var(--gold);color:var(--ink)}
.rb-btn:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.rb-btn.aa{font-family:var(--ff-body);font-size:15px;letter-spacing:0;text-transform:none}
.rb-toc{display:none}
.rb-prog{position:absolute;left:0;bottom:-1px;height:2px;width:0;background:var(--gold);opacity:.85;pointer-events:none}
.readbar{position:sticky}
/* glued to the masthead: once stuck, a filler behind the masthead closes the strip above the bar */
.readbar.rb-stuck::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:var(--rb-above,0px);background:inherit;pointer-events:none}

/* round line-icon buttons: settings (a cogwheel), search, and the search arrows */
.rb-ico{flex:none;display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;padding:0;border:1px solid var(--line2);border-radius:50%;background:transparent;color:var(--ink2);cursor:pointer;line-height:0}
.rb-ico:hover:not(:disabled),.rb-ico[aria-expanded="true"]{border-color:var(--gold);color:var(--gold-ink)}
.rb-ico:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.rb-ico:disabled{opacity:.35;cursor:default}
.rb-btn.rb-ico{min-width:0;padding:0}
.rb-findbtn{display:none}

/* search this book: the field, the count, the arrows */
.rb-findrow{display:flex;align-items:center;gap:6px;width:100%}
.rb-findrow .rb-search{flex:1;min-width:0}
.rb-findrow .rb-ico{width:28px;height:28px}
.rb-pos{flex:none;min-width:2.6em;text-align:center;font-family:var(--ff-ui);font-size:11px;letter-spacing:.06em;color:var(--mute);font-variant-numeric:tabular-nums}
.rb-pos:empty{display:none}
.rail .rb-close{display:none}
::highlight(hc-find-cur){background:var(--gold);color:#100D0A}
.rd-find{position:fixed;left:0;right:0;z-index:45;padding:8px 16px 10px;background:var(--paper);border-bottom:1px solid var(--line2);box-shadow:0 14px 30px -22px rgba(0,0,0,.9)}
.rd-find[hidden]{display:none}
.rd-find .rb-tools{margin:0}
.rd-find .rb-hits{position:absolute;top:100%;left:0;right:0;max-height:min(50vh,420px);overflow-y:auto;overscroll-behavior:contain;border-radius:0 0 12px 12px;border-top:0}

/* the resume line under the reading bar */
.rd-resume{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:14px 0 0;padding:10px 14px;border:1px solid var(--line2);border-left:2px solid var(--gold);border-radius:var(--radius,10px);background:var(--paper2);font-family:var(--ff-ui);font-size:12.5px;color:var(--ink2)}
.rd-resume[hidden]{display:none}
.rd-resume button{background:none;border:0;padding:4px 0;font:inherit;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-ink);cursor:pointer;white-space:nowrap}
.rd-resume .x{color:var(--mute);letter-spacing:0;font-size:16px;line-height:1;padding:4px 6px}

/* the settings panel */
.rd-panel{position:fixed;z-index:60;right:max(16px,calc((100vw - 1480px)/2 + 40px));width:300px;padding:16px 16px 12px;border:1px solid var(--line2);border-radius:14px;background:var(--card);color:var(--ink);box-shadow:0 22px 50px -26px rgba(0,0,0,.9);font-family:var(--ff-ui)}
:root[data-theme="light"] .rd-panel{box-shadow:0 18px 40px -24px rgba(21,18,16,.35)}
.rd-panel[hidden]{display:none}
.rd-row{display:grid;grid-template-columns:78px 1fr;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--line)}
.rd-row:last-of-type{border-bottom:0}
.rd-row>span{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.rd-seg{display:flex;gap:4px}
.rd-seg button{flex:1;min-height:34px;padding:0 6px;border:1px solid var(--line2);border-radius:8px;background:transparent;color:var(--ink2);font-family:var(--ff-ui);font-size:12px;cursor:pointer}
.rd-seg button[aria-pressed="true"]{border-color:var(--gold);color:var(--ink);background:var(--paper2)}
.rd-seg button:focus-visible{outline:2px solid var(--gold);outline-offset:1px}
.rd-seg .t-black{background:#100D0A;color:#EDE7DC}
.rd-seg .t-light{background:#F7F4EF;color:#151210}
.rd-seg .t-paper{background:#F2E9D8;color:#33291F}
.rd-seg .t-black[aria-pressed="true"],.rd-seg .t-light[aria-pressed="true"],.rd-seg .t-paper[aria-pressed="true"]{box-shadow:inset 0 0 0 1px var(--gold)}
.rd-size{font-family:var(--ff-body)!important;font-size:15px!important}
.rd-size.big{font-size:20px!important}
.rd-foot{display:flex;justify-content:flex-end;padding-top:6px}
.rd-foot button{background:none;border:0;font-family:var(--ff-ui);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute);cursor:pointer;padding:6px 0}
.rd-foot button:hover{color:var(--gold-ink)}

/* a note opened in place */
.rd-note{position:fixed;z-index:61;left:50%;transform:translateX(-50%);bottom:18px;width:min(560px,calc(100vw - 32px));max-height:45vh;overflow:auto;padding:16px 18px 12px;border:1px solid var(--line2);border-radius:14px;background:var(--card);color:var(--ink);box-shadow:0 22px 50px -26px rgba(0,0,0,.9);font-size:16px;line-height:1.55}
.rd-note[hidden]{display:none}
.rd-note .rd-note-body p{max-width:none;margin:0 0 8px}
.rd-note .rd-note-foot{display:flex;justify-content:space-between;gap:12px;margin-top:6px;font-family:var(--ff-ui);font-size:11px;letter-spacing:.1em;text-transform:uppercase}
.rd-note .rd-note-foot a,.rd-note .rd-note-foot button{background:none;border:0;padding:4px 0;color:var(--gold-ink);font:inherit;cursor:pointer;text-decoration:none}

.rd-scrim{position:fixed;inset:0;z-index:55;background:rgba(0,0,0,.45)}
.rd-scrim[hidden]{display:none}

/* phones: the masthead steps aside while reading down, the contents live in a sheet */
@media (max-width:860px){
  .hc-navwrap{transition:transform .22s ease}
  :root.rd-navoff .hc-navwrap{transform:translateY(calc(-100% - 12px))}
  .readbar{gap:8px;padding:8px 0}
  :root.rd-navoff .readbar{padding-top:calc(8px + env(safe-area-inset-top,0px))}
  .readbar .rb-main{flex-direction:column;align-items:flex-start;gap:1px}
  .readbar .rb-main .rb-book,.readbar .rb-main .rb-ch{max-width:100%;text-align:left}
  .readbar .rb-main .rb-book{font-size:9.5px}
  .rb-toc{display:inline-flex}
  .rb-findbtn{display:inline-flex}
  .rd-find .rb-search{font-size:16px}   /* 16px or more: phones do not zoom the page when the field is touched */
  .layout>.rail{position:fixed!important;z-index:60;left:0;right:0;bottom:0;top:auto!important;max-height:78vh!important;margin:0;padding:14px 16px calc(18px + env(safe-area-inset-bottom,0px));overflow-y:auto;background:var(--card);border-top:1px solid var(--line2);border-radius:16px 16px 0 0;box-shadow:0 -20px 50px -30px rgba(0,0,0,.9);transform:translateY(105%);transition:transform .25s ease;visibility:hidden}
  :root.rd-toc-open .layout>.rail{transform:none;visibility:visible}
  .layout>.rail::before{content:"";display:block;width:40px;height:4px;margin:0 auto 12px;border-radius:2px;background:var(--line2)}
  .layout>.rail .rb-hits{position:static;max-height:none;box-shadow:none}
  .rd-panel{left:16px;right:16px;width:auto;bottom:calc(16px + env(safe-area-inset-bottom,0px));top:auto!important}
  :root.rd-toc-open,:root.rd-toc-open body{overflow:hidden}
}
@media (prefers-reduced-motion:reduce){.hc-navwrap,.layout>.rail,.readbar{transition:none!important}}
@media print{.rb-btn,.rd-panel,.rd-note,.rd-scrim,.rd-resume,.rb-prog{display:none!important}}
