:root{
  --bg:#1e1e2f; --panel:#24243a; --text:#d3d3d4; --muted:#9ea3b0;
  --accent:#8ab4f8; --link:#89dceb; --border:#2f2f4a; --hover:#2a2a46;
}
html, body {
  font-family: 'Source Serif 4', ui-serif, Georgia, 'Times New Roman', serif;
  line-height: 1.7;
  font-size: 18px;
  font-optical-sizing: auto;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
body{ margin:0; background:var(--bg); color:var(--text); padding:16px; font-weight:300; }
.container{ max-width:960px; margin:0 auto }
/* Celostránkové pozadí s jemným ztmavením */
body {
  /* pokud jste už měla barvy, zůstanou jako fallback */
  /*background:
    linear-gradient( to bottom, rgba(0,0,0,.35), rgba(0,0,0,.35) ),
    var(--bg-image, none) center/cover no-repeat fixed;*/
background:
    linear-gradient(to bottom, rgba(0,0,0,.45), rgba(0,0,0,.55)),
    var(--bg-image, none) center/cover no-repeat fixed;
}

/* „Skleněný“ panel pro obsah */
.container {
  background: rgba(255, 255, 255, 0.08);        /* průhledná vrstva */
  border: 1px solid rgba(255, 255, 255, 0.18);  /* jemný okraj */
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);  /* stín pod sklem */
  border-radius: 16px;
  padding: 16px;                                /* už máte – nevadí, duplicitní se sečte */
  backdrop-filter: blur(12px) saturate(120%);
  -webkit-backdrop-filter: blur(12px) saturate(120%); /* Safari */

  /* pro lepší kontrast textu na skle */
  color: var(--text);
}
/* volitelně: přidejte lehký stín textu */
.container, .cap-head, .verse, .nav a, .btn, .mode-btn, .icon-btn {
  text-shadow: 0 1px 1px rgba(0,0,0,.35);
}
/* horní lišta s tlačítkem do stejného stylu */
.topbar {
  background: rgba(0, 0, 0, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 12px;
  padding: 8px 12px;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

/* zásuvka (drawer) také jako sklo */
.drawer {
  background: rgba(20, 20, 30, 0.45);
  border: 1px solid rgba(255, 255, 255, 0.18);
  backdrop-filter: blur(14px) saturate(130%);
  -webkit-backdrop-filter: blur(14px) saturate(130%);
}



/* Fallback pro prohlížeče bez backdrop-filter (starší Edge/Android webview) */
@supports not ((backdrop-filter: blur(10px)) or (-webkit-backdrop-filter: blur(10px))) {
  .container, .topbar, .drawer { background: rgba(20, 20, 30, 0.75); }
}

/* Přátelské k výkonu: ztlumíme efekty, pokud uživatel nechce moc efektů */
@media (prefers-reduced-transparency: reduce) {
  .container, .topbar, .drawer {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    background: rgba(20,20,30,0.85);
  }
}

h1{ color:var(--accent); margin:0 0 10px }
a{ color:var(--link); text-decoration:none }
a:hover{ text-decoration:underline }
h1 a{ color:inherit; text-decoration:none }
h1 a:hover{ text-decoration:underline }

.topbar{
  display:flex;
  align-items:center;
  justify-content:space-between; /* nadpis vlevo, tlačítko vpravo */
  gap:12px;
  margin-bottom:8px;
}
.topbar h1{ margin:0; }
.topbar .menu-btn{ flex:0 0 auto; }

/* Pokud jste někde měla: r { float:right; } → SMAZAT */
#openDrawer { float: none; } /* jen kdyby někde zůstalo; ideálně ten float úplně vypusťte */

/* Na mobilu schovat text „Knihy“ (volitelné, máte to už podobně) */
@media (max-width:600px){
  .menu-btn span{ display:none; }
}

.search{ display:flex; align-items:center; gap:8px; margin:8px 0 14px }
.search input{ flex:1; min-width:220px; background:#1b1b30; border:1px solid #2f2f4a; color:#d3d3d4; border-radius:10px; padding:10px 12px }
.search .btn{ background:#1b1b30; border:1px solid var(--border); color:#d3d3d4; border-radius:10px; padding:10px 12px; cursor:pointer }

.cap-head{
  font-family:'Source Serif 4', ui-serif, Georgia, 'Times New Roman', serif;
  font-variant-caps: small-caps;
  font-feature-settings:"smcp" 1, "c2sc" 1;
  font-weight:700; letter-spacing:.02em; line-height:1.15;
  margin:10px 0 6px; color:var(--muted);
}
.verse{ margin:.1em 0 }
.vnum{ font-size:80%; vertical-align:super }

.verse-ref{
  font-family:'Source Serif 4', Georgia, 'Times New Roman';
  font-variant-caps: small-caps;
  font-feature-settings:"smcp" 1, "c2sc" 1;
  font-weight:600; letter-spacing:.02em; margin-left:.5em; white-space:nowrap;
  font-variant-numeric: lining-nums tabular-nums;

}

/* ikonová tlačítka (copy/share) */
.icon-btn{
  display:inline-flex; justify-content:center; align-items:center;
  width:1.9em; height:1.9em; padding:0; margin-left:.35em;
  border:1px solid currentColor; border-radius:.45em; 
  opacity:.85; cursor:pointer; vertical-align:middle;
}
.icon-btn:hover{ opacity:1 }
.copy-btn .icon{ width:1.2em; height:1.2em; display:block }
.copy-btn .icon-check{ display:none }
.copy-btn.copied .icon-copy{ display:none }
.copy-btn.copied .icon-check{ display:block }

.nav{ margin:14px 0; text-align:center }
.nav a{ display:inline-block; margin:0 8px; padding:6px 12px; border:1px solid var(--border); background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.25); border-radius:8px }
.nav a:hover {
  background: rgba(255,255,255,0.16);
}
.mode-btn{ display:inline-flex; justify-content:center; align-items:center; width:2em; height:2em; border:1px solid currentColor; border-radius:.45em; opacity:.85; cursor:pointer }
.mode-btn:hover{ opacity:1 }
.emoji{ display:inline-flex; justify-content:center; align-items:center; width:2em; height:2em; opacity:.85; cursor:pointer;background:#1b1b30;  color:#d3d3d4; border-radius:10px; padding:10px 12px;}
.emoji:hover{ opacity:1 }
.nav a:hover {
  background: rgba(255,255,255,0.16);
}
.mode-btn, .icon-btn {
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.25);
}
/* Volitelně: tlačítka na skle trochu výraznější */
.btn, .icon-btn, .mode-btn {
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.25);
}
/* knižní režim */
.verses.book{ text-align:justify; hyphens:auto }
.verses.book .verse{ display:inline }
.verses.book .verse::after{ content:" " }
.verses.book .vnum{ text-decoration:none; font-size:.75em; vertical-align:super; margin-right:.15em }
.verses.book big{ line-height:1 }
.verses.book .copy-btn{ transform:translateY(-.05em) }

/* Drawer a další pomocné styly (zkráceno) */
.btn{ appearance:none; cursor:pointer; background:#1b1b30; color:#d3d3d4; border:1px solid #2f2f4a; border-radius:10px; padding:10px 12px }
.menu-btn{ font-size:18px; font-weight:600; display:flex; align-items:center; gap:6px; padding:10px 16px; background:#2a2a46; border:2px solid var(--accent); color:var(--accent); border-radius:12px }
.menu-btn:hover{ background:#333355; color:#fff }

.drawer-backdrop{ position:fixed; inset:0; background:rgba(0,0,0,.4); opacity:0; pointer-events:none; transition:.2s; z-index:999 }
.drawer{ position:fixed; inset:0 0 0 auto; width:min(360px,80%); transform:translateX(100%); transition:transform .25s ease; background:#24243a; border-left:1px solid #2f2f4a; padding:12px; overflow:auto; z-index:1000 }
.drawer-open .drawer{ transform:none }
.drawer-open .drawer-backdrop{ opacity:1; pointer-events:auto }

.pager-wrap{ margin:14px 0; display:flex; align-items:center; gap:10px; flex-wrap:wrap }
.pager{ display:flex; gap:6px; align-items:center; overflow:auto; white-space:nowrap; padding:6px 8px; background:#1b1b30; border:1px solid var(--border); border-radius:10px; max-width:100% }
.pager a, .pager .curr{ display:inline-block; padding:6px 10px; border-radius:8px; text-decoration:none; border:1px solid transparent }
.pager a{ color:var(--link) }
.pager a:hover{ background:#2a2a46 }
.pager .curr{ background:#2a2a46; border-color:var(--border); color:var(--text); font-weight:600 }
.pager-nav{ display:flex; gap:8px }
.pager-jump{ display:flex; align-items:center; gap:8px; font-size:14px; color:var(--muted) }
.pager-jump input{ width:80px; padding:6px 8px; border-radius:8px; border:1px solid var(--border); background:#1b1b30; color:var(--text) }
.pager-jump button{ appearance:none; cursor:pointer; background:#1b1b30; color:#d3d3d4; border:1px solid var(--border); border-radius:8px; padding:6px 10px }

/* Footer je plná šířka díky tomu, že není v .container */
.site-footer{
  width: 100%;
  background: rgba(0,0,0,0.18);
  border-top: 1px solid var(--glass-bd);
  color: var(--muted);
  font-size: 14px;
  backdrop-filter: blur(10px) saturate(120%);
  -webkit-backdrop-filter: blur(10px) saturate(120%);
  margin-top: 24px;
}

/* Vnitřek patičky centrovaný a omezený na stejnou šířku jako obsah */
.site-footer .footer-inner{
  max-width: 960px;
  margin: 0 auto;
  padding: 14px 16px;
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}

.site-footer a{ color: var(--text); text-decoration:none; opacity:.95; }
.site-footer a:hover{ text-decoration:underline; opacity:1; }
.site-footer .sep{ opacity:.6; margin:0 8px; }

/* =========================
   NEUTRÁLNÍ PALETA (stone)
   ========================= */
:root{
  /* tmavé pozadí beze změny */
  --text: #e7e7ea;
  --muted: #b6b9c2;

  /* neutrální link/akcent – žádná výrazná modrá */
  --link: #d8dbe2;
  --accent: #e2e5eb;

  /* rámečky/sklo */
  --glass-bg: rgba(255,255,255,0.06);
  --glass-bd: rgba(255,255,255,0.25);
  --glass-bg-strong: rgba(255,255,255,0.10);
  --glass-hover: rgba(255,255,255,0.16);
}

/* =========================
   NAV šipky – jen ikonky
   ========================= */
.nav{
  display:flex;
  align-items:center;       /* <<< klíčové */
  justify-content:center;
  gap: 12px;
}
/* stejná „bublina“ pro šipky i ¶ */
.nav a,
.nav .mode-btn{
  width: 42px;
  height: 42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 0;
  border-radius: 50%;
  line-height: 1;           /* žádné baseline posuny */
}
/* „¶“ bez extra vnitřních okrajů */
.nav .mode-btn{
  background: none;         /* chcete-li stejný vzhled jako šipky bez pozadí */
  border: none;
  opacity: .9;
  transition: transform .15s ease, opacity .15s ease, background .15s ease;
}
.nav a:hover{
  text-decoration: none;
  opacity: 1;
  transform: translateX(2px); /* jemný náznak pohybu */
}
.nav a[rel="prev"]:hover{ transform: translateX(-2px); }

/* malý kontrastní rámeček pouze při focusu kvůli přístupnosti */
.nav a:focus-visible{
  outline: 2px solid var(--glass-bd);
  outline-offset: 4px;
  border-radius: 6px;
}

/* =========================
   GLASS tlačítka / vstupy
   ========================= */
.btn, .icon-btn, .mode-btn{
  background: var(--glass-bg);
  border-color: var(--glass-bd);
  color: var(--text);
}
.btn:hover, .icon-btn:hover, .mode-btn:hover{
  background: var(--glass-hover);
}
.nav .mode-btn:hover{
  opacity: 1;
  background: rgba(255,255,255,.08);
}

/* input jako „sklo“ a téměř průhledný */
.search input{
  background: rgba(255,255,255,0.04);     /* skoro průhledné */
  border: 1px solid var(--glass-bd);
  color: var(--text);
  backdrop-filter: blur(6px) saturate(110%);
  -webkit-backdrop-filter: blur(6px) saturate(110%);
}
.search input::placeholder{
  color: rgba(231,231,234,.6);
}

/* „skleněný“ topbar bez barevného rámečku */
.topbar{
  background: var(--glass-bg-strong);
  border: 1px solid var(--glass-bd);
}

/* sjednocení ikonových tlačítek (copy/share) */
.icon-btn, .mode-btn{
  background: var(--glass-bg);
  border-color: var(--glass-bd);
}
.icon-btn:hover, .mode-btn:hover{
  background: var(--glass-hover);
}

/* odkazy – neutrální odstín */
a{ color: var(--link); }
a:hover{ color: #ffffff; }

/* =========================
   DRAWER – NE sklo (neprůhledný)
   ========================= */
.drawer{
  background: #1f2330;               /* plné, neprůhledné pozadí */
  border: 1px solid rgba(255,255,255,0.08);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

/* =========================
   KONTRAST NA SVĚTLEJŠÍCH FOTKÁCH
   (lehké zesílení textu a hran)
   ========================= */
.container, .cap-head, .verse, .nav a, .btn, .mode-btn, .icon-btn{
  text-shadow: 0 1px 1px rgba(0,0,0,.35);
}

/* drobné sjednocení „copy“ badge u prvního verše */
.copy-btn{
  background: var(--glass-bg);
  border-color: var(--glass-bd);
}
.copy-btn.copied{
  background: var(--glass-hover);
}
/* NAV – ikonové šipky */
.nav{
  margin:14px 0; text-align:center; display:flex; justify-content:center; gap:18px;
}
.nav a{
  background:none; border:none; padding:0; margin:0;
  display:inline-flex; align-items:center; justify-content:center;
  width:42px; height:42px; border-radius:50%;
  transition:transform .15s ease, opacity .15s ease, background .15s ease;
  opacity:.9;
}
.nav a .ico{ width:26px; height:26px; display:block; }
.nav a:hover{ opacity:1; background:rgba(255,255,255,.08); }
.nav a.nav-prev:hover{ transform:translateX(-2px); }
.nav a.nav-next:hover{ transform:translateX(2px); }
.nav a:focus-visible{ outline:2px solid var(--glass-bd); outline-offset:3px; }
/* Hledací tlačítko jako sklo */
.search .btn{
  background: var(--glass-bg);
  border: 1px solid var(--glass-bd);
  color: var(--text);
}
.search .btn:hover{
  background: var(--glass-hover);
}

/* NAV: vše do jedné linie, svisle vystředěné */
.nav{
  display:flex;
  align-items:center;       /* <<< klíčové */
  justify-content:center;
  gap: 12px;
}

/* stejná „bublina“ pro šipky i ¶ */
.nav a,
.nav .mode-btn{
  width: 42px;
  height: 42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 0;
  border-radius: 50%;
  line-height: 1;           /* žádné baseline posuny */
}

/* „¶“ bez extra vnitřních okrajů */
.nav .mode-btn{
  background: none;         /* chcete-li stejný vzhled jako šipky bez pozadí */
  border: none;
  opacity: .9;
  transition: transform .15s ease, opacity .15s ease, background .15s ease;
}
.nav .mode-btn:hover{
  opacity: 1;
  background: rgba(255,255,255,.08);
}

/* ---------- TÉMATA ---------- */
body[data-theme="dark"]{
  --bg:#1e1e2f; --panel:#24243a; --text:#e7e7ea; --muted:#b6b9c2;
  --link:#d8dbe2; --accent:#e2e5eb;
  --glass-bg:rgba(255,255,255,0.06);
  --glass-bd:rgba(255,255,255,0.25);
  --glass-bg-strong:rgba(255,255,255,0.10);
  --glass-hover:rgba(255,255,255,0.16);
}
body[data-theme="light"]{
  --bg:#f6f6f7; --panel:#ffffff; --text:#22232a; --muted:#60636f;
  --link:#2b303a; --accent:#2b303a;
  --glass-bg:rgba(0,0,0,0.04);
  --glass-bd:rgba(0,0,0,0.12);
  --glass-bg-strong:rgba(0,0,0,0.06);
  --glass-hover:rgba(0,0,0,0.10);
}

/* ---------- POZADÍ ---------- */
body[data-bg="image"]{
  background:
    linear-gradient(to bottom, rgba(0,0,0,.45), rgba(0,0,0,.55)),
    var(--bg-image, none) center/cover no-repeat fixed;
}
body[data-bg="plain"]{
  background: var(--bg);
}

/* „sklo“ funguje v obou režimech; když chcete méně průhledné ve světle,
   můžete přitvrdit: */
  body[data-theme="light"] .container{
  background: rgba(255,255,255,0.65);
  backdrop-filter: blur(10px) saturate(120%);
}

/* ---------- IKONY TLAČÍTEK ---------- */
.theme-btn .sun { display: none; }
.theme-btn .moon { display: none; }
.bg-btn .pic-on { display: none; }
.bg-btn .pic-off{ display: none; }

/* co se má ukázat v daném stavu */
body[data-theme="light"] .theme-btn .moon { display: block; } /* nabídni přepnutí na tmavý (měsíc) */
body[data-theme="dark"]  .theme-btn .sun  { display: block; } /* nabídni přepnutí na světlý (slunce) */

body[data-bg="image"] .bg-btn .pic-off { display: block; }  /* nabídni vypnout obrázky */
body[data-bg="plain"] .bg-btn .pic-on  { display: block; }  /* nabídni zapnout obrázky */
/* barva a rozměry ikon v nav */
.nav a, .nav .mode-btn { color: var(--text); }
.nav .ico { width: 26px; height: 26px; display: block; }

/* výchozí stav (když by se náhodou nenastavil data-theme/bg):
   ať je vidět sluníčko a "vypnout obrázek" */
.theme-btn .sun  { display: block; }
.theme-btn .moon { display: none;  }
.bg-btn .pic-off { display: block; }
.bg-btn .pic-on  { display: none;  }

/* teprve atributy na <body> přehodí ikonky */
body[data-theme="light"] .theme-btn .sun  { display: none;  }
body[data-theme="light"] .theme-btn .moon { display: block; }
body[data-theme="dark"]  .theme-btn .sun  { display: block; }
body[data-theme="dark"]  .theme-btn .moon { display: none;  }

body[data-bg="image"] .bg-btn .pic-off { display: block; }
body[data-bg="image"] .bg-btn .pic-on  { display: none;  }
body[data-bg="plain"] .bg-btn .pic-off { display: none;  }
body[data-bg="plain"] .bg-btn .pic-on  { display: block; }

/* =========================
   OVERRIDES (vložit na konec souboru)
   ========================= */

/* --- Drawer: barvy podle motivu --- */
body[data-theme="dark"] .drawer{
  background: #1f2330;
  color: var(--text);
  border: 1px solid rgba(255,255,255,0.08);
}
body[data-theme="dark"] .drawer a{ color: var(--link); }

body[data-theme="light"] .drawer{
  background: #ffffff;
  color: #22232a;
  border: 1px solid rgba(0,0,0,0.12);
}
body[data-theme="light"] .drawer a{ color: #2b303a; }

/* ovládací prvky v draweru */
body[data-theme="dark"] .drawer select,
body[data-theme="dark"] .drawer input,
body[data-theme="dark"] .drawer button{
  background: #1b1b30;
  color: var(--text);
  border: 1px solid var(--glass-bd);
}
body[data-theme="light"] .drawer select,
body[data-theme="light"] .drawer input,
body[data-theme="light"] .drawer button{
  background: #f7f7f9;
  color: #22232a;
  border: 1px solid rgba(0,0,0,0.12);
}

/* --- Vyhledávání: input + tlačítko „Hledat“ --- */
body[data-theme] .search input{
  background: var(--glass-bg) !important;
  border: 1px solid var(--glass-bd) !important;
  color: var(--text) !important;
  backdrop-filter: blur(6px) saturate(110%);
  -webkit-backdrop-filter: blur(6px) saturate(110%);
}
body[data-theme="dark"] .search input::placeholder{ color: rgba(231,231,234,.6); }
body[data-theme="light"] .search input::placeholder{ color: rgba(34,35,42,.55); }

body[data-theme] .search .btn{
  background: var(--glass-bg) !important;
  border: 1px solid var(--glass-bd) !important;
  color: var(--text) !important;
}
body[data-theme] .search .btn:hover{
  background: var(--glass-hover) !important;
}

/* --- Topbar menu tlačítko (Knihy) ve „glass“ stylu --- */
body[data-theme] .menu-btn{
  background: var(--glass-bg) !important;
  border: 1px solid var(--glass-bd) !important;
  color: var(--text) !important;
}
body[data-theme] .menu-btn:hover{ background: var(--glass-hover) !important; }
/* =========================
   PAGER = „glass“
   ========================= */
body[data-theme] .pager-wrap{
  margin:14px 0;
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
}

body[data-theme] .pager{
  display:flex; gap:6px; align-items:center;
  overflow:auto; white-space:nowrap; padding:6px 8px;
  background: var(--glass-bg);
  border: 1px solid var(--glass-bd);
  border-radius: 10px;
  max-width:100%;
  color: var(--text);
}

body[data-theme] .pager a,
body[data-theme] .pager .curr{
  display:inline-block; padding:6px 10px; border-radius:8px; text-decoration:none;
  border:1px solid transparent;
  color: var(--text);
}

body[data-theme] .pager a:hover{
  background: var(--glass-hover);
}

body[data-theme] .pager .curr{
  background: var(--glass-hover);
  border-color: var(--glass-bd);
  font-weight: 600;
}

/* malá šipková navigace vedle čísel */
body[data-theme] .pager-nav a{
  display:inline-flex; align-items:center; justify-content:center;
  width: 38px; height: 38px; border-radius: 10px;
  background: var(--glass-bg);
  border: 1px solid var(--glass-bd);
  color: var(--text); text-decoration:none;
  transition: background .15s ease;
}
body[data-theme] .pager-nav a:hover{ background: var(--glass-hover); }

/* „Skok na stránku“ – formulář */
body[data-theme] .pager-jump{
  display:flex; align-items:center; gap:8px;
  font-size:14px; color: var(--muted);
}
body[data-theme] .pager-jump input{
  width:80px; padding:6px 8px; border-radius:8px;
  border:1px solid var(--glass-bd);
  background: var(--glass-bg);
  color: var(--text);
  backdrop-filter: blur(6px) saturate(110%);
  -webkit-backdrop-filter: blur(6px) saturate(110%);
}
body[data-theme] .pager-jump button{
  appearance:none; cursor:pointer;
  background: var(--glass-bg); color: var(--text);
  border:1px solid var(--glass-bd); border-radius:8px; padding:6px 10px;
}
body[data-theme] .pager-jump button:hover{ background: var(--glass-hover); }

/* =========================
   DRAWER → #refForm (selecty, tlačítko)
   ========================= */
body[data-theme="dark"] #refForm select,
body[data-theme="dark"] #refForm input,
body[data-theme="dark"] #refForm button{
  background: #1b1b30;
  color: var(--text);
  border: 1px solid var(--glass-bd);
}

body[data-theme="light"] #refForm select,
body[data-theme="light"] #refForm input,
body[data-theme="light"] #refForm button{
  background: #f7f7f9;
  color: #22232a;
  border: 1px solid rgba(0,0,0,0.12);
}

/* sjednocení hoveru a disabled */
#refForm button:hover:not(:disabled){ filter: brightness(1.02); }
#refForm select:disabled,
#refForm button:disabled{ opacity:.6; cursor:not-allowed; }

/* odkazy v draweru (seznam knih) – sjednocená barva */
body[data-theme="dark"] .drawer a{ color: var(--link); }
body[data-theme="light"] .drawer a{ color: #2b303a; }
/* Firefox */
body[data-theme] .pager{
  scrollbar-width: thin;
  scrollbar-color: rgba(0,0,0,.35) transparent; /* přebarvíme níže pro dark */
}
body[data-theme="dark"] .pager{
  scrollbar-color: rgba(255,255,255,.35) transparent;
}

/* WebKit (Chrome, Edge, Safari) */
body[data-theme] .pager::-webkit-scrollbar{
  height: 8px;           /* jen vodorovný u pageru */
}
body[data-theme] .pager::-webkit-scrollbar-track{
  background: transparent;
}
body[data-theme="dark"] .pager::-webkit-scrollbar-thumb{
  background: rgba(255,255,255,.28);
  border-radius: 999px;
}
body[data-theme="light"] .pager::-webkit-scrollbar-thumb{
  background: rgba(0,0,0,.28);
  border-radius: 999px;
}
body[data-theme] .pager::-webkit-scrollbar-thumb:hover{
  background: rgba(0,0,0,.38);
}
body[data-theme="dark"] .pager::-webkit-scrollbar-thumb:hover{
  background: rgba(255,255,255,.38);
}
/* ===== Výsledky hledání – karta ===== */
.search-result{
  background: var(--glass-bg);
  border: 1px solid var(--glass-bd);
  border-radius: 12px;
  padding: 10px 12px;
  margin: 12px 0;
}

.search-result .result-head{
  display:flex; align-items:center; gap:10px;
  margin-bottom: 6px;
}

/* kulatý badge s pořadím */
.search-result .rnum{
  flex:0 0 auto;
  display:inline-flex; align-items:center; justify-content:center;
  width: 28px; height: 28px; border-radius: 50%;
  background: var(--glass-hover);
  border: 1px solid var(--glass-bd);
  font-weight: 700;
  font-size: 14px;
  line-height: 1;
  color: var(--text);
}

/* drobné ztišení kapitolové hlavičky uvnitř karty */
.search-result .cap-head{
  margin: 0;
  color: var(--muted);
  font-weight: 700;
}

/* kontextové řádky výsledku */
.search-result .result-body .verse{ margin:.15em 0; }
.search-result .result-body .verse.mid big{
  line-height: 1;
}

//* Výsledková karta – glass okraje a pozadí */
.search-result{
  background: var(--glass-bg) !important;
  border: 1px solid var(--glass-bd) !important;
  border-radius: 12px !important;
  padding: 10px 12px !important;
  margin: 12px 0 !important;
}

/* vnitřní tělo pro rozestupy */
.search-result .result-body .verse{
  margin: .15em 0;
}
.search-result .result-body .verse.mid big{
  line-height: 1;
}

/* Pořadové číslo výsledku – nenápadný badge v pravém horním rohu */
.search-result{
  position: relative;
}
.search-result::before{
  content: attr(data-idx);
  position: absolute;
  top: 6px;
  right: 8px;
  font-size: 12px;
  line-height: 1;
  opacity: .65;
  padding: 2px 6px;
  border-radius: 999px;
  background: var(--glass-bg);
  border: 1px solid var(--glass-bd);
  color: var(--text);
}

/* Pokud byste chtěla číslo vlevo nahoře, odkomentujte:
.search-result::before{ left: 8px; right: auto; }
*/