/* biblia7-zhrnutie.css - page-specific rules (auto-generated) */

[data-theme="dark"] .toolsbar .tools-dd > summary { color: var(--ink); border-color: rgba(255,255,255,0.18); }

[data-theme="dark"] .toolsbar .tools-dd > summary .label-strong { color: var(--gold-bright); }

[data-theme="dark"] .toolsbar .tools-dd > summary:hover { background: var(--cream-card); border-color: var(--gold); }

[data-theme="dark"] .reading-title,
  [data-theme="dark"] .sidebar-tab.active,
  [data-theme="dark"] .ref-anchor { color: var(--gold-bright); }

[data-theme="dark"] .ref-link:hover,
  [data-theme="dark"] .ref-anchor:hover { color: var(--gold); }

button { font-family: inherit; }

.topbar, .subbar, .toolsbar, .reading-page, .page-footer {
    max-width: 1100px;
    margin-inline: auto;
  }

@media (max-width: 640px) {
    /* Mobile: roomier hamburger menu — bigger labels, more padding, wider min-width */
    .menu { min-width: 260px; padding: 12px 0; border-radius: 10px; }
    .menu a { padding: 14px 22px; font-size: 17px; }
    .menu hr { margin: 8px 0; }
    .menu-theme-toggle { padding: 14px 22px; font-size: 17px; gap: 14px; }
    .menu-theme-toggle svg { width: 20px; height: 20px; }
    .menu-fontsize { padding: 12px 22px; gap: 10px; }
    .menu-fontsize .font-icon { width: 20px; height: 20px; }
    .menu-fontsize .fz-btn { width: 38px; height: 34px; font-size: 20px; border-radius: 8px; }
    .menu-fontsize .fz-btn svg { width: 16px; height: 16px; }

    /* Mobile: roomier MENU dropdown (subbar-more-list) — bigger labels, more padding */
    .subbar-more-list { min-width: 240px; padding: 10px 0; border-radius: 12px; }
    .subbar-more-list a { padding: 13px 22px; font-size: 14px; letter-spacing: 0.8px; }
  }

/* ============ TOOLS BAR ============ */
  .toolsbar {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    background: var(--cream-bar);
    border-bottom: 1px solid var(--rule);
    min-height: 44px;
    padding: 6px 14px;
    gap: 6px 4px;
  }

.tools-dd > summary {
    list-style: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px 6px 12px;
    background: transparent;
    border: 1px solid var(--rule);
    border-radius: 6px;
    color: var(--navy);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.2px;
    white-space: nowrap;
    user-select: none;
    transition: background 0.15s, border-color 0.15s;
  }

.tools-dd > summary:hover { background: var(--paper); border-color: var(--gold); }

.tools-dd > summary .label-strong { color: var(--navy); font-weight: 700; }

.tools-dd > summary .caret { width: 12px; height: 12px; color: var(--ink-soft); transition: transform 0.2s; }

.tools-dd[open] > summary { background: var(--paper); border-color: var(--gold); }

.tools-dd[open] > summary .caret { transform: rotate(180deg); }

.tools-pop {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    z-index: 60;
    background: var(--paper);
    border: 1px solid var(--rule);
    border-radius: 8px;
    box-shadow: 0 12px 32px rgba(15, 27, 54, 0.15);
    padding: 12px 14px;
    min-width: 240px;
    max-height: 70vh;
    overflow-y: auto;
  }

.tools-pop h4 {
    margin: 10px 0 6px;
    font-family: "Cormorant Garamond", serif;
    font-size: calc(13.5px * var(--fz, 1.1));
    font-weight: 700;
    color: var(--gold-soft);
    letter-spacing: 0.4px;
    text-transform: uppercase;
  }

.tools-pop h4:first-child { margin-top: 0; }

.tools-pop ul li a,
  .tools-pop ul li label {
    display: flex;
    align-items: baseline;
    gap: 8px;
    padding: 9px 10px;
    color: var(--ink-muted);
    font-size: calc(14.5px * var(--fz, 1.1));
    line-height: 1.45;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.1s, color 0.1s;
  }

.tools-pop ul li a:hover,
  .tools-pop ul li label:hover { background: var(--cream-row); color: var(--navy); }

.tools-pop ul li a.active { color: var(--navy); font-weight: 600; }

.tools-pop ul li a.active::before { content: "✓"; color: var(--gold-soft); margin-right: 4px; }

.books-pop { width: 640px; max-width: 90vw; padding: 0; max-height: 80vh; display: flex; flex-direction: column; }

.books-pop .book-search-wrap {
    background: var(--paper);
    padding: 10px 12px;
    border-bottom: 1px solid var(--rule-soft);
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 10px;
  }

.books-pop .book-search {
    flex: 1 1 auto;
    min-width: 0;
    max-width: 320px;
    padding: 9px 16px;
    border: 1px solid var(--rule);
    border-radius: 999px;
    font: inherit;
    font-size: calc(14px * var(--fz, 1.1));
    color: var(--ink);
    background: var(--paper);
    outline: none;
    transition: border-color 0.15s, box-shadow 0.15s;
  }

.books-pop .book-close {
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    margin-left: auto;
    background: transparent;
    border: 1px solid var(--rule);
    border-radius: 8px;
    color: var(--ink-muted);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s, border-color 0.15s, color 0.15s;
  }

.books-pop .book-close:hover {
    background: var(--cream-row);
    border-color: var(--gold);
    color: var(--navy);
  }

.books-pop .book-close svg { width: 16px; height: 16px; display: block; }

.books-pop .book-search::placeholder { color: var(--ink-soft); }

.books-pop .book-search:focus {
    border-color: var(--gold);
    box-shadow: 0 0 0 3px rgba(200, 162, 78, 0.18);
  }

.books-pop .book-cols {
    display: grid;
    grid-template-columns: 1fr 1fr;
    overflow-y: auto;
    flex: 1 1 auto;
  }

.books-pop .book-col + .book-col { border-left: 1px solid var(--rule-soft); }

.books-pop .book-col-head {
    margin: 0;
    padding: 11px 14px 9px;
    font-family: "Cormorant Garamond", serif;
    font-size: calc(13.5px * var(--fz, 1.1));
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    color: var(--gold-soft);
    text-align: center;
    border-bottom: 1px solid var(--rule-soft);
    background: var(--cream-card);
    position: sticky;
    top: 0;
    z-index: 1;
  }

.books-pop .book-col ul { padding: 4px 0; }

.books-pop .book-row {
    display: grid !important;
    grid-template-columns: 60px 1fr;
    align-items: baseline;
    gap: 10px;
    padding: 9px 14px !important;
    color: var(--ink-muted);
    border-radius: 0 !important;
  }

.books-pop .book-row .abbr {
    font-weight: 700;
    color: var(--navy);
    font-size: calc(13.5px * var(--fz, 1.1));
    text-align: right;
    font-variant-numeric: tabular-nums;
  }

.books-pop .book-row .name {
    font-size: calc(14.5px * var(--fz, 1.1));
    color: var(--ink);
  }

.books-pop .book-row:hover { background: var(--cream-row); }

.books-pop .book-row.active { background: var(--cream-card); }

.books-pop .book-row.active::before,
  .books-pop .book-row::before { content: none !important; display: none !important; }

.books-pop .book-row.active .abbr,
  .books-pop .book-row.active .name { color: var(--navy); font-weight: 600; }

[data-theme="dark"] .books-pop .book-row .abbr { color: var(--gold-bright); }

[data-theme="dark"] .books-pop .book-row.active { background: rgba(240, 210, 140, 0.12); }

[data-theme="dark"] .books-pop .book-row.active .name,
  [data-theme="dark"] .books-pop .book-row.active .abbr { color: var(--gold-bright); }

.books-pop .book-empty {
    display: none;
    margin: 0;
    padding: 18px 14px;
    text-align: center;
    color: var(--ink-soft);
    font-size: 13px;
    font-style: italic;
  }

.books-pop.is-empty .book-empty { display: block; }

.books-pop.is-empty .book-cols { display: none; }

.chapters-pop {
    width: 420px;
    max-width: 92vw;
    padding: 0;
    display: flex;
    flex-direction: column;
    max-height: 80vh;
  }

.chapters-pop ul.chap-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 6px;
    padding: 12px 14px 14px;
    overflow-y: auto;
  }

.chapters-pop ul.chap-grid li a {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 11px 4px;
    border: 1px solid var(--rule-soft);
    border-radius: 6px;
    font-size: calc(15px * var(--fz, 1.1));
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    color: var(--ink-muted);
    transition: background 0.15s, color 0.15s, border-color 0.15s;
  }

.chapters-pop ul.chap-grid li a:hover {
    background: var(--cream-row);
    color: var(--navy);
    border-color: var(--gold);
  }

.chapters-pop ul.chap-grid li a.active {
    background: var(--navy);
    color: var(--gold-bright);
    border-color: var(--navy);
  }

.chapters-pop ul.chap-grid li a.active::before { content: ""; margin: 0; }

[data-theme="dark"] .chapters-pop ul.chap-grid li a.active {
    background: var(--gold-bright);
    color: var(--cream-frame);
    border-color: var(--gold-bright);
  }

.trans-pop, .compare-pop {
    width: 420px;
    max-width: 92vw;
    padding: 0;
    display: flex;
    flex-direction: column;
    max-height: 80vh;
  }

.trans-pop > ul, .compare-pop > ul {
    padding: 8px 14px 12px;
    overflow-y: auto;
  }

.compare-pop > p {
    margin: 12px 14px 4px;
    color: var(--ink-soft);
    font-size: calc(13px * var(--fz, 1.1));
    line-height: 1.5;
  }

.trans-pop ul li, .compare-pop ul li { margin: 3px 0; }

.trans-pop ul li a, .compare-pop ul li label {
    padding: 11px 12px;
    gap: 12px;
  }

.trans-pop .trans-code, .compare-pop .trans-code {
    flex: 0 0 auto;
    width: 60px;
    color: var(--gold-soft);
    font-weight: 700;
    font-size: calc(13px * var(--fz, 1.1));
    letter-spacing: 0.5px;
  }

.trans-pop .trans-name, .compare-pop .trans-name {
    color: var(--ink);
    font-size: calc(14.5px * var(--fz, 1.1));
  }

.trans-pop ul li a.active .trans-code { color: var(--navy); }

.compare-pop ul li label input { margin-right: 8px; accent-color: var(--gold); transform: scale(1.15); }

/* Square icon-only dropdown variant (e.g. Porovnať) */
  .tools-dd.icon-only > summary {
    width: 32px;
    height: 32px;
    padding: 0;
    gap: 0;
    justify-content: center;
  }

.tools-dd.icon-only > summary svg {
    width: 18px;
    height: 18px;
    display: block;
  }

/* Gear */
  .gear-dd { position: relative; flex: 0 0 auto; }

.gear-dd > summary {
    list-style: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: transparent;
    border: 1px solid var(--rule);
    border-radius: 8px;
    color: var(--navy);
    transition: background 0.15s, border-color 0.15s, transform 0.4s;
  }

.gear-dd > summary::-webkit-details-marker { display: none; }

.gear-dd > summary::marker { content: ""; }

.gear-dd > summary:hover { background: var(--paper); border-color: var(--gold); }

.gear-dd[open] > summary { transform: rotate(60deg); background: var(--paper); border-color: var(--gold); }

.gear-pop {
    right: 0; left: auto;
    width: 420px;
    max-width: 92vw;
    padding: 0;
    display: flex;
    flex-direction: column;
    max-height: 80vh;
  }

.seg-control button {
    background: transparent;
    border: 0;
    padding: 6px 12px;
    font-size: 13px;
    color: var(--ink-muted);
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
  }

.icon-buttons { display: flex; gap: 6px; }

/* ============ READING PAGE ============ */
  .reading-page {
    background: var(--paper);
    box-shadow: 0 1px 0 rgba(0,0,0,0.06);
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 0;
  }

.reading-page.sidebar-below { grid-template-columns: 1fr; }

.reading-main { padding: 28px 24px 36px; min-width: 0; }

.reading-main > .reading-title,
  .reading-main > .reading-meta,
  .reading-main > .bible-text {
    max-width: 620px;
    margin-inline: auto;
  }

.reading-side {
    background: var(--cream-card);
    border-left: 1px solid var(--rule-soft);
    padding: 22px 22px 32px;
  }

.sidebar-below .reading-side {
    border-left: 0;
    border-top: 1px solid var(--rule);
    background: var(--cream-row);
  }

.reading-title {
    font-family: "Cormorant Garamond", serif;
    font-size: calc(34px * var(--fz, 1.1));
    font-weight: 700;
    color: var(--navy);
    margin: 0 0 4px;
    letter-spacing: 0.3px;
    text-align: center;
  }

.reading-meta {
    color: var(--ink-soft);
    font-size: calc(13px * var(--fz, 1.1));
    margin: 0 0 22px;
    letter-spacing: 0.3px;
    text-align: center;
  }

/* Chapter header: prev | centered title | next */
  .chapter-header {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 12px;
    margin: 0 auto 22px;
    max-width: 620px;
  }

.chapter-header .chapter-prev { justify-self: start; }

.chapter-header .chapter-next { justify-self: end; }

.chapter-header .chapter-prev:hover,
  .chapter-header .chapter-next:hover { transform: translateY(-1px); }

.chapter-title-block { text-align: center; min-width: 0; }

.chapter-title-block .reading-title { margin-bottom: 2px; }

.chapter-title-block .reading-meta { margin-bottom: 0; }

/* Chapter prev/next buttons — round icon-only on every viewport */
  .chapter-nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin: 36px auto 8px;
    max-width: 620px;
  }

.chapter-nav-btn {
    width: 36px; height: 36px;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--navy);
    color: #FFFFFF;
    border: 1px solid var(--navy);
    border-radius: 999px;
    text-decoration: none;
    cursor: pointer;
    transition: background 0.15s, transform 0.15s, border-color 0.15s;
    -webkit-tap-highlight-color: transparent;
  }

.chapter-nav-btn .chapter-nav-label { display: none; }

/* icon only */
  .chapter-nav-btn:hover {
    background: #2F3548;
    transform: translateY(-1px);
  }

.chapter-nav-btn svg {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
  }

.chapter-header .chapter-nav-btn[hidden] {
    display: inline-flex !important;
    visibility: hidden;
  }

.chapter-nav .chapter-nav-btn[hidden] { display: none !important; }

[data-theme="dark"] .chapter-nav-btn {
    background: var(--gold-bright);
    border-color: var(--gold-bright);
    color: var(--cream-frame);
  }

[data-theme="dark"] .chapter-nav-btn:hover {
    background: var(--gold);
    border-color: var(--gold);
  }

/* Bottom chapter navigation — keep oval pill with full text label */
  .chapter-nav .chapter-nav-btn {
    width: auto;
    height: 36px;
    padding: 0 18px;
    gap: 8px;
    font-family: inherit;
    font-size: calc(13px * var(--fz, 1.1));
    font-weight: 600;
    letter-spacing: 0.4px;
    text-transform: none;
    white-space: nowrap;
  }

.chapter-nav .chapter-nav-btn .chapter-nav-label { display: inline; }

/* Mobile — slightly smaller circles in the header / smaller pills at the bottom */
  @media (max-width: 640px) {
    .chapter-header .chapter-nav-btn { width: 32px; height: 32px; }
    .chapter-header .chapter-nav-btn svg { width: 14px; height: 14px; }
    .chapter-nav .chapter-nav-btn {
      height: 32px;
      padding: 0 14px;
      font-size: calc(12px * var(--fz, 1.1));
      gap: 6px;
    }
    .chapter-nav .chapter-nav-btn svg { width: 12px; height: 12px; }
  }

.bible-text {
    font-family: "Merriweather", Georgia, serif;
    color: var(--ink);
    font-size: calc(17px * var(--fz, 1.1));
    line-height: 1.85;
    text-align: left;
    hyphens: auto;
    -webkit-hyphens: auto;
  }

.verse {
    /* default: continuous */
  }

.verse + .verse::before { content: " "; }

.vnum {
    color: var(--gold-soft);
    font-weight: 700;
    font-size: 0.72em;
    margin-right: 3px;
    margin-left: 2px;
    vertical-align: super;
    font-family: "Inter", sans-serif;
    user-select: none;
  }

/* Mode: per-line */
  .bible-text.mode-lines .verse { display: block; padding: 4px 0; text-align: left; }

.bible-text.mode-lines .verse + .verse::before { content: ""; }

.bible-text.mode-lines .vnum { font-size: 0.78em; margin-right: 6px; }

/* Mode: no numbers */
  .bible-text.no-numbers .vnum { display: none; }

/* Side panel */
  .sidebar-tabs {
    display: flex;
    gap: 4px;
    border-bottom: 1px solid var(--rule);
    margin-bottom: 14px;
  }

.sidebar-tab {
    background: none;
    border: 0;
    padding: 8px 0;
    margin-right: 18px;
    font-family: inherit;
    font-size: calc(13px * var(--fz, 1.1));
    font-weight: 700;
    letter-spacing: 0.4px;
    color: var(--ink-soft);
    text-transform: uppercase;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    transition: color 0.15s, border-bottom-color 0.15s;
  }

.sidebar-tab:hover { color: var(--navy); }

.sidebar-tab.active {
    color: var(--navy);
    border-bottom-color: var(--gold);
  }

.sidebar-panel { display: none; }

.sidebar-panel.active { display: block; }

.sidebar-list {
    display: flex;
    flex-direction: column;
    gap: 14px;
  }

.ref-item, .note-item { font-size: calc(13.5px * var(--fz, 1.1)); line-height: 1.55; }

.ref-anchor {
    display: inline-block;
    color: var(--gold-soft);
    font-weight: 700;
    font-size: 0.92em;
    margin-right: 6px;
    transition: color 0.15s;
  }

.ref-anchor:hover { color: var(--gold); }

.ref-link {
    color: var(--navy);
    font-family: "Cormorant Garamond", serif;
    font-weight: 700;
    border-bottom: 1px dotted var(--gold);
    transition: color 0.15s;
  }

.ref-link:hover { color: var(--gold-soft); }

.ref-text, .note-text {
    margin: 4px 0 0;
    color: var(--ink-muted);
    font-style: italic;
  }

/* Footer */
  .page-footer {
    background: var(--paper);
    border-top: 1px solid var(--rule);
    padding: 20px 32px 28px;
    color: var(--ink-muted);
    font-size: calc(13px * var(--fz, 1.1));
    line-height: 1.6;
    box-shadow: 0 1px 0 rgba(0,0,0,0.06), 0 12px 32px rgba(15, 27, 54, 0.18);
  }

/* Summary page — full-width content, no sidebar */
  .reading-page { grid-template-columns: 1fr !important; }

.summary-text {
    max-width: 620px;
    margin-inline: auto;
    font-family: "Merriweather", Georgia, serif;
    color: var(--ink);
    font-size: calc(16px * var(--fz, 1.1));
    line-height: 1.75;
  }

.summary-text .summary-lead {
    font-size: calc(17px * var(--fz, 1.1));
    font-style: italic;
    color: var(--ink-muted);
    margin: 0 0 32px;
    padding: 4px 0 4px 18px;
    border-left: 3px solid var(--gold);
    line-height: 1.65;
  }

.summary-text h2 {
    font-family: "Cormorant Garamond", serif;
    font-size: calc(26px * var(--fz, 1.1));
    font-weight: 700;
    color: var(--navy);
    margin: 36px 0 12px;
    padding-bottom: 6px;
    border-bottom: 1px solid var(--rule);
    letter-spacing: 0.3px;
  }

.summary-text h3 {
    font-family: "Cormorant Garamond", serif;
    font-size: calc(20px * var(--fz, 1.1));
    font-weight: 700;
    color: var(--navy);
    margin: 20px 0 6px;
    letter-spacing: 0.2px;
  }

[data-theme="dark"] .summary-text h2,
  [data-theme="dark"] .summary-text h3 { color: var(--gold-bright); }

.summary-text p { margin: 0 0 16px; }

.summary-text strong { color: var(--navy); font-weight: 700; }

[data-theme="dark"] .summary-text strong { color: var(--gold-bright); }

.summary-text em { color: var(--gold-soft); font-style: italic; font-weight: 600; }

.summary-text ul.summary-list {
    list-style: none;
    padding: 0;
    margin: 16px 0;
  }

.summary-text ul.summary-list li {
    position: relative;
    padding-left: 26px;
    margin-bottom: 14px;
    line-height: 1.7;
  }

.summary-text ul.summary-list li::before {
    content: "✦";
    position: absolute;
    left: 4px;
    top: 0;
    color: var(--gold-soft);
    font-size: 1em;
  }

@media (max-width: 640px) {
    .summary-text { font-size: calc(15px * var(--fz, 1.1)); }
    .summary-text h2 { font-size: calc(22px * var(--fz, 1.1)); margin-top: 28px; }
    .summary-text h3 { font-size: calc(18px * var(--fz, 1.1)); }
    .summary-text .summary-lead { font-size: calc(15px * var(--fz, 1.1)); margin-bottom: 24px; padding-left: 14px; }
  }

@media (max-width: 900px) {
    .reading-page { grid-template-columns: 1fr; }
    .reading-side { border-left: 0; border-top: 1px solid var(--rule); }
  }

/* Every toolbar popover (book / chapter / translation / parallel / gear) opens
     horizontally centered in the viewport but vertically anchored just below the
     yellow line at the bottom of the toolsbar. The "bottom" rule reserves space for
     the verse-toolbar at the bottom of the screen so the last items aren't hidden.
     overscroll-behavior: contain prevents scroll chaining to the page underneath.
     Mobile (≤640px) fullscreen-sheet rules still take precedence on phones because
     they appear later in the source order. */
  .tools-dd > .tools-pop {
    position: fixed;
    left: 50%;
    right: auto;
    top: 158px;            /* sedí pod naším mierne vyšším chrome (zhodne s citanie.css) */
    bottom: 28px;          /* small breathing room when verse-toolbar is hidden */
    transform: translateX(-50%);
    max-width: calc(100vw - 16px);
    max-height: none;
    overscroll-behavior: contain;
  }

/* Gear / chapters popovers — content-driven height (rovnako ako v citanie.css). */
.tools-dd > .gear-pop,
.tools-dd > .chapters-pop {
    bottom: auto;
    max-height: calc(100vh - 186px);
}

/* Reserve more bottom space when the verse-toolbar is visible at the bottom of the
     screen (it's roughly 92 px tall on desktop, taller on iPad) so the last book / chapter
     row stays above it. */
  body.has-verse-toolbar .tools-dd > .tools-pop {
    bottom: 110px;
  }

@media (min-width: 768px) and (max-width: 1366px) {
    body.has-verse-toolbar .tools-dd > .tools-pop {
      bottom: 130px;
    }
  }

/* Lock the page scroll while any toolbar popover is open so an accidental swipe
     outside the popover can't scroll the page underneath (which broke focus and
     made the popover impossible to scroll again). */
  body:has(.tools-dd[open]) { overflow: hidden; }

@media (max-width: 640px) {
    .brand { padding: 8px 10px; gap: 8px; }
    .brand-back { padding: 0 10px; }
    .brand-back .brand-icon { width: 22px; height: 22px; }
    .brand .logo-mark { max-height: 30px; }
    .topbar-right { padding: 0 10px; }
    .hamburger svg { width: 22px; height: 22px; }
    .subbar form { padding: 7px 12px; gap: 8px; }
    .subbar input { font-size: 14px; }
    .subbar .search-icon { width: 18px; height: 18px; }
    .subbar-more { padding: 6px 12px 6px 0; }
    .subbar-more-list { right: 12px; }
    .toolsbar { padding: 6px 8px; gap: 5px 4px; }
    .tools-dd > summary { font-size: 12px; padding: 5px 8px; }
    /* Popovers become FULLSCREEN sheets on mobile only */
    .tools-dd .tools-pop {
      position: fixed;
      left: 0;
      right: 0;
      top: 0;
      bottom: 0;
      width: 100%;
      max-width: none;
      max-height: 100vh;
      max-height: 100dvh;
      border-radius: 0;
      box-shadow: none;
      z-index: 100;
      overflow-y: auto;
      display: flex;
      flex-direction: column;
      /* Reset the centered transform from the desktop / tablet rule so the fullscreen
         sheet doesn't get shifted half its width off-screen on mobile. */
      transform: none;
    }
    .tools-dd .gear-pop { right: 0; left: 0; }
    /* Books popover on mobile — keep 2 columns side-by-side, just tighten the cells */
    .books-pop .book-row { grid-template-columns: 48px 1fr; padding: 7px 10px !important; gap: 8px; }
    .books-pop .book-row .abbr { font-size: calc(13px * var(--fz, 1.1)); }
    .books-pop .book-row .name { font-size: calc(14px * var(--fz, 1.1)); }
    .books-pop .book-col-head { font-size: calc(13px * var(--fz, 1.1)); padding: 9px 6px 7px; letter-spacing: 0.4px; }
    /* Trans / compare / chapters on mobile — full width inside fullscreen sheet */
    .trans-pop, .compare-pop, .chapters-pop { width: 100%; max-width: none; }
    /* Chapter grid on mobile — keep button look, just 5 cols */
    .chapters-pop ul.chap-grid { grid-template-columns: repeat(5, 1fr); }
    .reading-main { padding: 18px 16px 24px; }
    .reading-side { padding: 16px 16px 24px; }
    .reading-title { font-size: calc(26px * var(--fz, 1.1)); }
    .bible-text { font-size: calc(16px * var(--fz, 1.1)); line-height: 1.75; }
    .page-footer { padding: 16px 16px 20px; font-size: calc(12px * var(--fz, 1.1)); }
  }

/* ─── Summary empty state ──────────────────────────────────
   Zobrazí sa keď pre danú kapitolu ešte nie je pripravené zhrnutie.
   Ikonka zatvorenej knihy bez explicitnej veľkosti by sa rendrovala
   defaultne (300×150 alebo viewport-sized) a vyzerala obrovsky —
   tu ju cap-neme na rozumný rozmer + decentné gold-tint farby. */
.summary-empty {
    text-align: center;
    padding: 40px 20px 30px;
    color: var(--ink-muted);
}
.summary-empty svg {
    width: 64px;
    height: 64px;
    margin: 0 auto 14px;
    color: var(--gold-soft);
    opacity: 0.7;
    display: block;
}
.summary-empty h3 {
    font-family: "Cormorant Garamond", serif;
    font-size: calc(22px * var(--fz, 1.1));
    font-weight: 700;
    color: var(--navy);
    margin: 0 0 8px;
    letter-spacing: 0.3px;
}
[data-theme="dark"] .summary-empty h3 { color: var(--gold-bright); }
.summary-empty p {
    max-width: 460px;
    margin: 0 auto 18px;
    font-size: calc(14px * var(--fz, 1.1));
    line-height: 1.6;
    color: var(--ink-muted);
}
.summary-empty p strong { color: var(--navy); font-weight: 700; }
[data-theme="dark"] .summary-empty p strong { color: var(--gold-bright); }
.summary-empty-cta {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 18px;
    background: var(--gold);
    color: #FFFFFF;
    border-radius: 999px;
    font-family: inherit;
    font-size: calc(13px * var(--fz, 1.1));
    font-weight: 600;
    letter-spacing: 0.4px;
    text-decoration: none;
    transition: background 0.15s, transform 0.15s;
}
.summary-empty-cta:hover {
    background: var(--gold-soft);
    color: #FFFFFF;
    transform: translateY(-1px);
}
[data-theme="dark"] .summary-empty-cta {
    background: var(--gold-bright);
    color: var(--cream-frame);
}
