:root{
  --ink:#141414; --paper:#ffffff; --line:#e8e6e1; --line-strong:#d8d5cd;
  --muted:#8a867d; --accent:#141414;
  --hl-celestial:#ffe680;      /* sun / moon / stars */
  --hl-custom:#bfe3ff;         /* user-added words   */
  --sidebar:250px;
  --serif:"Spectral","Noto Serif Hebrew","Noto Sans Syriac","Noto Sans Coptic","Noto Sans Gothic","Noto Serif Armenian","Noto Sans Phoenician","Noto Serif","Iowan Old Style",Georgia,serif;
  --sans:"Inter",system-ui,-apple-system,sans-serif;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--sans);font-size:15px;line-height:1.5;
  display:flex;flex-direction:column;overflow:hidden}

/* ---------- top bar ---------- */
.topbar{display:flex;align-items:stretch;border-bottom:1px solid var(--line);
  min-height:60px;flex-shrink:0}
.brand{display:flex;align-items:center;gap:10px;padding:0 22px;
  border-right:1px solid var(--line);width:var(--sidebar);flex-shrink:0}
.mark{width:26px;height:26px;flex-shrink:0}
.wordmark{font-family:var(--serif);font-weight:600;font-size:20px;letter-spacing:.01em}
.wordmark small{font-family:var(--sans);font-weight:500;font-size:10px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--muted);display:block;margin-top:1px}
.tabs{display:flex;align-items:stretch;flex:1}
.tab{border:0;background:none;font:inherit;color:var(--muted);cursor:pointer;
  padding:0 20px;display:flex;flex-direction:column;justify-content:center;gap:1px;
  white-space:nowrap;border-right:1px solid var(--line);position:relative}
.tab .t-label{font-weight:600;color:var(--ink);font-size:14px}
.tab .t-sub{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.tab[aria-selected="true"]{background:#fafaf8}
.tab[aria-selected="true"]::after{content:"";position:absolute;left:0;right:0;bottom:-1px;
  height:2px;background:var(--ink)}
.tab:hover .t-label{color:var(--ink)}
.tab.add{color:var(--muted);font-weight:500}
/* Versions dropdown */
.verdrop{position:relative;display:flex}
.verbtn{border-right:1px solid var(--line)}
.verbtn .caret{font-size:10px;color:var(--muted)}
/* keep the Versions tab compact no matter how long a version's label/sub is */
.verbtn .t-sub{display:block;max-width:300px;overflow:hidden;text-overflow:ellipsis}
.ver-menu{position:absolute;top:100%;left:0;z-index:20;min-width:230px;
  background:#fff;border:1px solid var(--line-strong);border-radius:10px;
  box-shadow:0 10px 30px rgba(20,20,20,.12);padding:6px;margin-top:-1px}
.ver-item{display:flex;flex-direction:column;gap:1px;width:100%;text-align:left;
  border:0;background:none;font:inherit;color:var(--ink);cursor:pointer;padding:8px 12px;border-radius:7px}
.ver-item:hover{background:#f5f4f0}
.ver-item[aria-current="true"]{background:#f2f1ec}
.ver-item[aria-current="true"] .vi-label::after{content:" ✓";color:#2c9c6a}
.vi-label{font-weight:600;font-size:14px}
.vi-sub{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}

.tab.kw{margin-left:auto;border-left:1px solid var(--line);border-right:0}
.tab.kw .t-label{font-size:13px}
.tab.kw[aria-selected="true"]{background:#fffdf3}

/* ---------- keyword verses (concordance) ---------- */
.kw-summary{font-family:var(--sans);font-size:13px;color:var(--muted);
  margin:-4px 0 22px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.kw-summary b{color:var(--ink);font-weight:600}
.kw-book{margin:0 0 22px}
.kw-book-title{font-family:var(--serif);font-weight:600;font-size:18px;margin:0 0 8px;
  position:sticky;top:-20px;background:var(--paper);padding:6px 0;z-index:1}
.kw-verse{display:flex;gap:12px;width:100%;text-align:left;border:0;background:none;
  font:inherit;cursor:pointer;padding:7px 10px;border-radius:6px;align-items:baseline;
  border-bottom:1px solid #f2f0ea}
.kw-verse:hover{background:#f7f6f2}
.kw-ref{font-family:var(--sans);font-size:11px;font-weight:600;color:var(--muted);
  flex:0 0 52px;text-align:right;font-variant-numeric:tabular-nums;padding-top:2px}
.kw-text{font-family:var(--serif);font-size:15px;line-height:1.5;color:#1b1b1b}
/* anthology concordance: the "ref" column holds the source/author, so it needs
   room and wraps (vs. the narrow tabular verse-number column) */
.kw-ref.kw-src{flex:0 0 220px;text-align:left;font-style:italic;color:#6b4f22;
  white-space:normal;line-height:1.35;font-size:12px}
:root[data-theme="dark"] .kw-ref.kw-src{color:#b79b63}

/* ---------- highlight row ---------- */
.hlbar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  padding:9px 22px;border-bottom:1px solid var(--line);background:#fcfcfb;flex-shrink:0}
.hl-legend{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.chips{display:flex;gap:7px;flex-wrap:wrap;align-items:center}
.chip{display:inline-flex;align-items:center;gap:6px;font-size:13px;
  border:1px solid var(--line-strong);border-radius:999px;padding:3px 10px;cursor:pointer;
  background:#fff;user-select:none}
.chip .dot{width:12px;height:12px;border-radius:50%;border:1px solid rgba(0,0,0,.15);
  padding:0;cursor:pointer;flex-shrink:0}
.chip .dot:hover{outline:2px solid var(--line-strong);outline-offset:1px}
.chip .chip-label{cursor:pointer}
.chip .plus{border:0;background:none;color:var(--muted);font-weight:700;font-size:14px;
  line-height:1;cursor:pointer;padding:0 1px}
.chip .plus:hover{color:var(--accent)}
.chip.targeting{outline:2px solid var(--accent);outline-offset:1px}
/* color picker popover */
.color-pop{position:fixed;z-index:60;display:grid;grid-template-columns:repeat(5,1fr);gap:6px;
  background:var(--panel,#fff);border:1px solid var(--line-strong);border-radius:10px;
  padding:8px;box-shadow:0 10px 30px var(--shadow)}
.color-pop .sw{width:22px;height:22px;border-radius:50%;border:1px solid rgba(0,0,0,.15);cursor:pointer}
.color-pop .sw.on{outline:2px solid var(--ink);outline-offset:1px}
:root[data-theme="dark"] .color-pop{background:#1c2027}
.chip[data-on="false"]{opacity:.4;text-decoration:line-through}
.chip .x{color:var(--muted);font-weight:600;padding-left:2px}
.chip .x:hover{color:var(--ink)}
.add-word{display:flex;align-items:center;gap:0}
.add-word input{font:inherit;font-size:13px;border:1px solid var(--line-strong);
  border-radius:999px 0 0 999px;padding:4px 12px;width:270px;max-width:44vw;outline:none;background:#fff}
.add-word input:focus{border-color:var(--ink)}
.add-word button{font:inherit;font-size:13px;border:1px solid var(--line-strong);border-left:0;
  border-radius:0 999px 999px 0;background:#fff;padding:4px 12px;cursor:pointer}
.add-word button:hover{background:#141414;color:#fff;border-color:#141414}

/* ---------- main ---------- */
.main{display:flex;flex:1;min-height:0}
.sidebar{width:var(--sidebar);flex-shrink:0;border-right:1px solid var(--line);
  overflow-y:auto;padding:6px 0}
.grp{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);
  padding:16px 22px 6px}
.book{display:block;width:100%;text-align:left;border:0;background:none;font:inherit;
  cursor:pointer;padding:6px 22px;color:var(--ink);border-left:2px solid transparent}
.book{display:flex;align-items:center;justify-content:space-between;gap:8px}
.book:hover{background:#f6f5f2}
.book .deu{color:#b08900;font-size:12px;flex-shrink:0}
.book.deutero{color:#5a5346}
.book[aria-current="true"]{border-left-color:var(--ink);background:#f2f1ec;font-weight:600}

.resizer{flex:0 0 6px;margin-left:-3px;cursor:col-resize;position:relative;z-index:6;
  background:transparent;transition:background .12s}
.resizer::after{content:"";position:absolute;left:2px;top:0;bottom:0;width:2px;background:transparent}
.resizer:hover::after,.resizer.dragging::after{background:var(--ink)}
body.resizing{cursor:col-resize;user-select:none}
.reader-wrap{position:relative;flex:1;min-width:0;display:flex}
.reader{flex:1;overflow-y:auto;padding:20px 78px 80px 34px}
.reader-wrap.no-map .minimap{display:none}
.reader-wrap.no-map .reader{padding-right:34px}

/* ---------- highlight minimap (VS Code-style overview on the right) ---------- */
.minimap{position:absolute;top:0;right:0;bottom:0;width:56px;
  border-left:1px solid var(--line);background:#fcfcfb;cursor:pointer;overflow:hidden}
.mm-ticks{position:absolute;inset:0}
.mm-tick{position:absolute;height:2px;border-radius:1px}  /* color+lane set inline per highlight */
.mm-viewport{position:absolute;left:0;right:0;background:rgba(20,20,20,.08);
  border:1px solid rgba(20,20,20,.18);border-radius:2px;pointer-events:none;min-height:14px}
.mm-empty{position:absolute;top:10px;left:0;right:0;text-align:center;
  font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:#c9c6bd}
.reader-inner{max-width:none;margin:0}
/* full-width single column: read the whole book by scrolling straight down */
.verses{text-align:justify;hyphens:auto}
/* right-to-left scripts (Hebrew, Syriac): flip direction, larger for pointed text */
.reader-inner[dir="rtl"] .verses,
.reader-inner[dir="rtl"] .kw-text{direction:rtl;text-align:right;line-height:1.9}
.reader-inner[dir="rtl"] .vn{margin:0 0 0 3px}
.reader-inner[dir="rtl"] .book-title,
.reader-inner[dir="rtl"] .book-meta{text-align:right}
.book-title{font-family:var(--serif);font-weight:600;font-size:27px;letter-spacing:.01em;
  margin:0 0 3px;text-wrap:balance}
.book-meta{color:var(--muted);font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  margin-bottom:6px}
.book-source{color:var(--muted);font-size:12px;font-style:italic;margin-bottom:20px;
  font-family:var(--serif)}
.reader-inner[dir="rtl"] .book-source{text-align:right}
.chapter{margin:0 0 20px}
.ch-num{font-family:var(--serif);font-size:12.5px;color:var(--muted);
  border-top:1px solid var(--line);padding-top:10px;margin-bottom:6px;
  letter-spacing:.12em;text-transform:uppercase}
/* anthology entry heading = its source/author (not "Chapter N") */
.ch-num.ch-src{font-size:15px;font-weight:600;color:#5a4320;letter-spacing:0;
  text-transform:none;font-style:italic;line-height:1.3}
:root[data-theme="dark"] .ch-num.ch-src{color:#cdb98a}
/* category divider inside a single anthology book */
.cat-divider{font-family:var(--serif);font-size:20px;font-weight:600;color:#7a1f1f;
  margin:34px 0 4px;padding-bottom:8px;border-bottom:2px solid #c0a062;letter-spacing:.01em}
.cat-divider:first-child{margin-top:4px}
:root[data-theme="dark"] .cat-divider{color:#d98c74;border-bottom-color:#5a4a2a}
.verses{font-family:var(--serif);font-size:15px;line-height:1.5;color:#1b1b1b}
.v{margin-right:.3em}
.vn{font-family:var(--sans);font-size:9.5px;font-weight:600;color:var(--muted);
  vertical-align:super;margin-right:2px;user-select:none;cursor:pointer}
.vn:hover{color:var(--ink);text-decoration:underline}
/* anthology (Hagiographies): no verse numbers — faint hover-only passage handle */
.vn-mark{vertical-align:baseline;font-size:12px;margin-right:1px}
.vn-mark::before{content:"¶";opacity:0;transition:opacity .12s}
.v:hover .vn-mark::before{opacity:.4}
.vn-mark:hover::before{opacity:.8;text-decoration:none}
.verses em{font-style:italic;color:#3a3a3a}
mark{border-radius:2px;padding:0 .5px;background:var(--hl-celestial);color:inherit}
/* a whole verse highlighted in a color (background set inline per verse) */
.v.saved{border-radius:3px;box-shadow:0 0 0 1px rgba(0,0,0,.04)}
:root[data-theme="dark"] .v.saved{color:#15181d}
:root[data-theme="dark"] .v.saved em{color:#333}
/* saved-verses list */
.sv-row{display:flex;gap:10px;align-items:baseline;padding:4px 0}
.sv-dot{width:14px;height:14px;border-radius:50%;border:1px solid rgba(0,0,0,.15);
  cursor:pointer;flex-shrink:0;padding:0;align-self:center}
.sv-dot:hover{outline:2px solid var(--line-strong);outline-offset:1px}
.sv-go{display:flex;gap:12px;align-items:baseline;flex:1;text-align:left;border:0;
  background:none;font:inherit;cursor:pointer;padding:6px 10px;border-radius:6px;
  border-bottom:1px solid var(--line)}
.sv-go:hover{background:#f7f6f2}
:root[data-theme="dark"] .sv-go:hover{background:#20252d}
.color-pop .sw.rm{display:grid;place-items:center;font-size:12px;color:var(--muted);
  background:var(--panel,#fff);border:1px solid var(--line-strong)}
mark.custom{background:var(--hl-custom)}

.empty{display:grid;place-items:center;height:100%;color:var(--muted);text-align:center}
.empty .serif{font-family:var(--serif);font-size:26px;color:#b9b6ad;margin-bottom:6px}

/* scrollbars kept quiet */
.sidebar::-webkit-scrollbar,.reader::-webkit-scrollbar,.tabs::-webkit-scrollbar{height:8px;width:8px}
.sidebar::-webkit-scrollbar-thumb,.reader::-webkit-scrollbar-thumb{background:#e2e0da;border-radius:8px}

@media(max-width:820px){
  :root{--sidebar:190px}
  .reader{padding:24px 20px 100px}
  .book-title{font-size:26px}
  .verses{font-size:17px}
  .minimap{display:none}
}

/* ---------- logo adapts to theme ---------- */
.mark{color:var(--ink)}

/* ---------- theme toggle ---------- */
.acct{margin-left:auto;font-size:11.5px;color:var(--muted);display:inline-flex;
  align-items:center;gap:6px;white-space:nowrap}
.acct a{color:var(--ink);text-decoration:underline;text-underline-offset:2px}
.acct .dot-ok{width:7px;height:7px;border-radius:50%;background:#2c9c6a;flex-shrink:0}
.acct + .theme-toggle{margin-left:12px}
.theme-toggle{margin-left:auto;border:1px solid var(--line-strong);background:#fff;
  color:var(--ink);border-radius:8px;padding:5px 10px;font-size:15px;line-height:1;
  cursor:pointer;flex-shrink:0}
.theme-toggle:hover{border-color:var(--accent)}

/* ---------- dark theme (eye-strain friendly: soft dark ground, off-white ink) ---------- */
:root[data-theme="dark"]{
  --ink:#d7dbe2; --paper:#16191e; --line:#282d35; --line-strong:#3b4149;
  --muted:#8b94a2; --accent:#d7dbe2;
  --hl-celestial:#e7c651; --hl-custom:#6aa9e0;
}
:root[data-theme="dark"] .tab[aria-selected="true"]{background:#1e232b}
:root[data-theme="dark"] .tab.kw[aria-selected="true"]{background:#241f12}
:root[data-theme="dark"] .verbtn,
:root[data-theme="dark"] .ver-menu,
:root[data-theme="dark"] .chip,
:root[data-theme="dark"] .add-word input,
:root[data-theme="dark"] .add-word button,
:root[data-theme="dark"] .theme-toggle{background:#1c2027;color:var(--ink)}
:root[data-theme="dark"] .ver-item:hover,
:root[data-theme="dark"] .book:hover,
:root[data-theme="dark"] .kw-verse:hover{background:#20252d}
:root[data-theme="dark"] .ver-item[aria-current="true"],
:root[data-theme="dark"] .book[aria-current="true"]{background:#272d36}
:root[data-theme="dark"] .hlbar,
:root[data-theme="dark"] .minimap{background:#181c22}
/* the "you are here" box was a near-black overlay → invisible on the dark
   minimap; use a light translucent fill + brighter border so position reads */
:root[data-theme="dark"] .mm-viewport{background:rgba(215,219,226,.14);
  border-color:rgba(215,219,226,.45)}
:root[data-theme="dark"] .mm-empty{color:#565d68}
:root[data-theme="dark"] .verses,
:root[data-theme="dark"] .kw-text{color:#cfd4dc}
:root[data-theme="dark"] .verses em{color:#a9afb9}
:root[data-theme="dark"] .book.deutero{color:#a7adb6}
:root[data-theme="dark"] .kw-verse{border-bottom-color:#20252d}
:root[data-theme="dark"] mark{color:#15181d}
:root[data-theme="dark"] .add-word button:hover{background:#d7dbe2;color:#15181d;border-color:#d7dbe2}
:root[data-theme="dark"] .sidebar::-webkit-scrollbar-thumb,
:root[data-theme="dark"] .reader::-webkit-scrollbar-thumb{background:#3b4149}

/* account status hints in the header (cryptorgv standalone) */
.unverified{color:#e0a53a}
.verified-ok{color:#5fbf7a}

/* Versions list slides (scrolls) inside itself instead of running off the screen */
.ver-menu{max-height:min(72vh,640px);overflow-y:auto;-webkit-overflow-scrolling:touch;
  overscroll-behavior:contain}
/* tab row: swipe sideways on narrow screens instead of clipping the Keyword/Saved tabs */
.tabs{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
@media(max-width:700px){
  /* phones: pin the list to the screen under the tab bar, full width, finger-sized rows */
  .ver-menu{position:fixed;top:58px;left:8px;right:8px;width:auto;min-width:0;
    max-height:calc(100vh - 70px)}
  .ver-item{padding:12px 14px}
  .vi-label{font-size:15px}
  .verbtn .t-sub{max-width:150px}
}
@media(max-width:480px){
  .verbtn .t-sub{display:none}   /* just "Versions ▾" on small phones */
}
