/* The Syncreticon · lib-reader.css
   ---------------------------------
   Reader chrome for the library: progress rail, part pager, reader controls
   (text size / candle theme / quiet mode), chapter end, teaser fade,
   library search box, and the print sheet. Loaded only by the knowledge
   templates that need it. */

/* ---------------------------------------------------------------- rail */
.lib-rail {
  position: fixed; top: 0; left: 0; right: 0; height: 3px;
  background: transparent; z-index: 60; pointer-events: none;
}
.lib-rail-bar {
  display: block; height: 100%; width: 0;
  background: linear-gradient(90deg, var(--syn-gold-low, var(--syn-gold-low)), var(--syn-gold-hi, var(--syn-gold-hi)));
  transition: width 120ms linear;
}

/* --------------------------------------------------------------- pager */
.lib-pager-mid { display: flex; flex-direction: column; align-items: center; gap: 0.35rem; text-align: center; }
.lib-pager-pos {
  font-size: var(--t-2xs); letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--syn-text-mute, var(--syn-border-hi)); line-height: var(--lh-dense);
}
.lib-part-badge {
  display: inline-block; margin-left: 0.6rem; padding: 0.1rem 0.55rem;
  border: 1px solid var(--syn-border-hi, var(--syn-border-hi)); border-radius: 999px;
  color: var(--syn-gold, var(--syn-gold)); letter-spacing: 0.12em;
}
.lib-signin-hint a { color: var(--syn-gold, var(--syn-gold)); border-bottom: 1px dotted var(--syn-gold-low, var(--syn-gold-low)); }

/* -------------------------------------------------------- voice banner */
.syn-voice-banner {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem 0.9rem;
  margin: 0 0 1.4rem; padding: 0.6rem 0.9rem; border-radius: 10px;
  font-size: var(--t-sm); line-height: var(--lh-dense);
  border: 1px dashed rgba(217, 180, 90, 0.45); background: rgba(217, 180, 90, 0.05);
  color: var(--syn-text-dim, var(--syn-text-dim));
}
.syn-voice-banner b { color: var(--syn-gold, var(--syn-gold)); font-weight: 700; }
.syn-voice-banner a { color: var(--syn-gold, var(--syn-gold)); font-weight: 600; white-space: nowrap; }
.syn-voice-banner-change { opacity: 0.75; margin-left: auto; }
.syn-voice-banner[data-retell-state="preparing"] { border-style: dotted; }

/* ---------------------------------------------------------- return link */
.lib-return {
  position: fixed; left: 50%; bottom: 1.2rem; transform: translateX(-50%);
  display: inline-flex; align-items: center; gap: 0.5rem; z-index: 55;
  padding: 0.55rem 1rem; border-radius: 999px;
  background: var(--syn-surface-2, var(--syn-surface)); border: 1px solid var(--syn-gold-low, var(--syn-gold-low));
  color: var(--syn-gold-hi, var(--syn-gold-hi)); font-size: var(--t-sm); text-decoration: none;
  box-shadow: 0 6px 22px rgba(0, 0, 0, 0.45);
}
.lib-return:hover { border-color: var(--syn-gold-hi, var(--syn-gold-hi)); }
.lib-return-arrow { font-size: var(--t-md); }

/* ---------------------------------------------------------- chapter end */
.lib-chapter-end { margin-top: 2.5rem; padding-top: 1.6rem; border-top: 1px solid var(--syn-border, var(--syn-border)); }
.lib-next-chapter {
  display: flex; flex-direction: column; gap: 0.25rem;
  padding: 1.1rem 1.3rem; border-radius: var(--syn-r-lg, 10px);
  border: 1px solid var(--syn-gold-low, var(--syn-gold-low));
  background: linear-gradient(160deg, rgba(217, 180, 90, 0.08), rgba(217, 180, 90, 0.02));
  color: var(--syn-text, var(--syn-text)); text-decoration: none;
}
.lib-next-chapter:hover { border-color: var(--syn-gold-hi, var(--syn-gold-hi)); }
.lib-next-chapter-label { font-size: var(--t-2xs); letter-spacing: 0.16em; text-transform: uppercase; color: var(--syn-text-mute, var(--syn-border-hi)); }
.lib-next-chapter-title { font-family: var(--syn-serif); font-size: var(--t-lg); line-height: var(--lh-tight); }
.lib-next-chapter-cta { font-size: var(--t-sm); color: var(--syn-gold, var(--syn-gold)); }
.lib-book-done { color: var(--syn-text-dim, var(--syn-text-dim)); }
.lib-related-title {
  margin: 1.8rem 0 0.9rem; font-size: var(--t-xs); letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--syn-gold, var(--syn-gold)); font-weight: 600;
}
.lib-related-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 0.9rem; }
.lib-related-card {
  display: flex; flex-direction: column; align-items: center; text-align: center; gap: 0.3rem;
  padding: 0.85rem 0.7rem; border-radius: 4px;
  background: linear-gradient(160deg, var(--syn-surface) 0%, var(--syn-bg) 100%);
  border: 1px solid rgba(212, 185, 74, 0.15); color: var(--syn-text, var(--syn-text)); text-decoration: none;
  transition: border-color 180ms ease, transform 180ms ease;
}
.lib-related-card:hover { border-color: rgba(212, 185, 74, 0.45); transform: translateY(-2px); }
.lib-related-sigil { font-size: var(--t-xl); color: rgba(212, 185, 74, 0.65); }
.lib-related-name { font-family: var(--syn-serif); font-size: var(--t-sm); line-height: var(--lh-tight); font-weight: 600; }
.lib-related-voice { font-size: var(--t-2xs); color: rgba(212, 185, 74, 0.6); font-style: italic; }

/* ------------------------------------------------------------ controls */
.lib-controls { position: fixed; right: 1rem; bottom: 1rem; z-index: 58; font-family: var(--syn-sans); }
.lib-controls-toggle {
  width: 2.7rem; height: 2.7rem; border-radius: 50%; cursor: pointer;
  border: 1px solid var(--syn-gold-low, var(--syn-gold-low)); background: var(--syn-surface-2, var(--syn-surface));
  color: var(--syn-gold-hi, var(--syn-gold-hi)); font-family: var(--syn-serif); font-size: var(--t-md);
  box-shadow: 0 6px 22px rgba(0, 0, 0, 0.45);
}
.lib-controls-toggle:hover, .lib-controls-toggle[aria-expanded="true"] { border-color: var(--syn-gold-hi, var(--syn-gold-hi)); }
.lib-controls-panel {
  position: absolute; right: 0; bottom: 3.2rem; width: 17rem; max-width: calc(100vw - 2rem);
  padding: 0.9rem 1rem 0.7rem; border-radius: var(--syn-r-lg, 10px);
  background: var(--syn-surface-2, var(--syn-surface)); border: 1px solid var(--syn-border-hi, var(--syn-border-hi));
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5); color: var(--syn-text, var(--syn-text));
}
.lib-controls-row { display: flex; align-items: center; gap: 0.4rem; margin: 0 0 0.6rem; }
.lib-controls-label { flex: 0 0 3.2rem; font-size: var(--t-2xs); letter-spacing: 0.14em; text-transform: uppercase; color: var(--syn-text-mute, var(--syn-border-hi)); }
.lib-controls-panel button {
  flex: 1; padding: 0.35rem 0.5rem; border-radius: var(--syn-r, 6px); cursor: pointer;
  border: 1px solid var(--syn-border-hi, var(--syn-border-hi)); background: transparent;
  color: var(--syn-text-dim, var(--syn-text-dim)); font-size: var(--t-xs); font-family: inherit;
}
.lib-controls-panel button small { font-size: 0.6em; vertical-align: super; }
.lib-controls-panel button.is-on, .lib-controls-panel button[aria-pressed="true"] {
  border-color: var(--syn-gold, var(--syn-gold)); color: var(--syn-gold-hi, var(--syn-gold-hi)); background: rgba(217, 180, 90, 0.08);
}
.lib-controls-foot { margin: 0.2rem 0 0; font-size: var(--t-2xs); color: var(--syn-text-mute, var(--syn-border-hi)); }

/* text size steps (class on <html>) */
html.lib-size-1 .syn-book-reader-body { font-size: var(--t-md); }
html.lib-size-2 .syn-book-reader-body { font-size: var(--t-md); }
html.lib-size-3 .syn-book-reader-body { font-size: var(--t-lg); line-height: var(--lh-prose); }

/* quiet mode: the site falls away, the page stays */
html.lib-quiet .syn-header, html.lib-quiet .syn-footer { display: none; }
html.lib-quiet .syn-main { padding-top: 1.5rem; }

/* candle theme: parchment ground, scoped to the reading column and the
   main area on chapter pages; the site header and footer keep their own
   colours because the variables are set on .syn-main, not on :root. */
html.lib-theme-candle .lib-chapter-page .syn-main {
  --lib-bg: #f4ead6; --lib-text: #2a2419; --lib-dim: #6b5f4a; --lib-mute: #8f8168;
  --lib-gold: #7a5a14; --lib-border: #d9cbb0; --lib-surface: #ebdfc6;
  background: var(--lib-bg); color: var(--lib-text);
}
html.lib-theme-candle .lib-chapter-page .syn-book-reader,
html.lib-theme-candle .lib-chapter-page .syn-book-reader-body,
html.lib-theme-candle .lib-chapter-page .syn-book-reader-body p,
html.lib-theme-candle .lib-chapter-page .syn-book-reader-body li,
html.lib-theme-candle .lib-chapter-page .syn-book-reader-body em,
html.lib-theme-candle .lib-chapter-page .syn-book-reader-head h1,
html.lib-theme-candle .lib-chapter-page .syn-book-reader-body h2,
html.lib-theme-candle .lib-chapter-page .syn-book-reader-body h3,
html.lib-theme-candle .lib-chapter-page .syn-book-reader-body blockquote { color: var(--lib-text); }
html.lib-theme-candle .lib-chapter-page .syn-book-reader-body strong,
html.lib-theme-candle .lib-chapter-page .syn-book-reader-body a,
html.lib-theme-candle .lib-chapter-page .syn-book-crumbs a,
html.lib-theme-candle .lib-chapter-page .syn-book-pager-toc,
html.lib-theme-candle .lib-chapter-page .syn-voice-banner a,
html.lib-theme-candle .lib-chapter-page .syn-voice-banner b,
html.lib-theme-candle .lib-chapter-page .lib-next-chapter-cta,
html.lib-theme-candle .lib-chapter-page .lib-related-title { color: var(--lib-gold); }
html.lib-theme-candle .lib-chapter-page .syn-book-reader-pos,
html.lib-theme-candle .lib-chapter-page .lib-pager-pos,
html.lib-theme-candle .lib-chapter-page .syn-book-pager-label,
html.lib-theme-candle .lib-chapter-page .syn-book-crumbs,
html.lib-theme-candle .lib-chapter-page .syn-reader-hint,
html.lib-theme-candle .lib-chapter-page .syn-voice-banner,
html.lib-theme-candle .lib-chapter-page .syn-reference-note,
html.lib-theme-candle .lib-chapter-page .lib-book-done { color: var(--lib-dim); }
html.lib-theme-candle .lib-chapter-page .syn-book-pager-prev,
html.lib-theme-candle .lib-chapter-page .syn-book-pager-next,
html.lib-theme-candle .lib-chapter-page .lib-next-chapter {
  border-color: var(--lib-border); color: var(--lib-text); background: var(--lib-surface);
}
html.lib-theme-candle .lib-chapter-page .syn-book-pager,
html.lib-theme-candle .lib-chapter-page .syn-book-pager--top,
html.lib-theme-candle .lib-chapter-page .syn-book-reader-head,
html.lib-theme-candle .lib-chapter-page .lib-chapter-end,
html.lib-theme-candle .lib-chapter-page .syn-book-reader-body hr { border-color: var(--lib-border); }
html.lib-theme-candle .lib-chapter-page .syn-voice-banner { background: rgba(122, 90, 20, 0.06); border-color: rgba(122, 90, 20, 0.35); }
html.lib-theme-candle .lib-chapter-page .lib-related-card { background: var(--lib-surface); border-color: var(--lib-border); color: var(--lib-text); }
html.lib-theme-candle .lib-chapter-page .lib-related-sigil { color: var(--lib-gold); }
html.lib-theme-candle .lib-chapter-page .syn-para-mark,
html.lib-theme-candle .lib-chapter-page .syn-para-ref { color: var(--lib-gold); }
html.lib-theme-candle .lib-chapter-page .syn-messages { color: var(--lib-text); }

/* ------------------------------------------------------------- teaser */
.lib-teaser-body { position: relative; max-height: 28rem; overflow: hidden; margin: 1.6rem 0 0; }
.lib-teaser-body .syn-book-reader-body { font-family: var(--syn-serif); font-size: var(--t-md); line-height: var(--lh-prose); }
.lib-teaser-body::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 11rem;
  background: linear-gradient(180deg, rgba(11, 11, 17, 0) 0%, var(--syn-bg, var(--syn-bg)) 92%);
  pointer-events: none;
}
.lib-teaser-gate { margin: 0.6rem 0 2rem; padding: 1rem 1.2rem; border: 1px solid var(--syn-gold-low, var(--syn-gold-low)); border-radius: var(--syn-r-lg, 10px); text-align: center; }
.lib-teaser-gate p { margin: 0 0 0.6rem; color: var(--syn-text-dim, var(--syn-text-dim)); }
.lib-teaser-gate p:last-child { margin: 0; }

/* -------------------------------------------------------------- search */
.lib-search-launch { display: flex; gap: 0.5rem; margin: 0 0 1.6rem; }
.lib-search-launch input[type="search"] {
  flex: 1; min-width: 0; padding: 0.6rem 0.9rem; border-radius: var(--syn-r, 6px);
  background: rgba(200, 168, 94, 0.06); color: var(--syn-text, var(--syn-text));
  border: 1px solid rgba(200, 168, 94, 0.35); font-family: var(--syn-serif); font-size: var(--t-md);
}
.lib-search-launch input[type="search"]:focus { outline: none; border-color: rgba(200, 168, 94, 0.75); box-shadow: 0 0 0 3px rgba(200, 168, 94, 0.15); }
.lib-search-launch button {
  padding: 0.6rem 1rem; border: 0; border-radius: var(--syn-r, 6px); cursor: pointer;
  background: rgba(200, 168, 94, 0.85); color: var(--syn-bg, var(--syn-bg)); font-weight: 600;
}
.lib-search-launch button:hover { background: rgba(228, 196, 110, 1); }
.lib-search-book { margin: 0 0 2rem; }
.lib-search-book-title { display: flex; align-items: baseline; gap: 0.6rem; flex-wrap: wrap; margin: 0 0 0.8rem; font-size: var(--t-md); }
.lib-search-book-title a { color: var(--syn-text, var(--syn-text)); text-decoration: none; border-bottom: none; }
.lib-search-book-title a:hover { color: var(--syn-gold-hi, var(--syn-gold-hi)); }
.lib-search-book-sigil { color: rgba(212, 185, 74, 0.65); }
.lib-search-book-col { font-size: var(--t-2xs); letter-spacing: 0.14em; text-transform: uppercase; color: var(--syn-text-mute, var(--syn-border-hi)); }

/* ------------------------------------------------- book page progress */
.lib-progress { display: block; margin: 1rem 0 1.4rem; padding: 0.8rem 1rem; border: 1px solid var(--syn-border, var(--syn-border)); border-radius: var(--syn-r-lg, 10px); color: var(--syn-text, var(--syn-text)); text-decoration: none; }
.lib-progress:hover { border-color: var(--syn-gold-low, var(--syn-gold-low)); }
.lib-progress-line { display: flex; justify-content: space-between; gap: 1rem; font-size: var(--t-sm); }
.lib-progress-line b { color: var(--syn-gold-hi, var(--syn-gold-hi)); }
.lib-progress-cta { color: var(--syn-gold, var(--syn-gold)); font-size: var(--t-xs); white-space: nowrap; }
.lib-progress-track { height: 4px; margin-top: 0.55rem; background: var(--syn-border, var(--syn-border)); border-radius: 2px; overflow: hidden; }
.lib-progress-fill { display: block; height: 100%; background: linear-gradient(90deg, var(--syn-gold-low, var(--syn-gold-low)), var(--syn-gold-hi, var(--syn-gold-hi))); }
.lib-toc-section { margin: 1.6rem 0 0.5rem; font-size: var(--t-xs); letter-spacing: 0.18em; text-transform: uppercase; color: var(--syn-gold, var(--syn-gold)); font-weight: 600; }
.lib-toc-section:first-child { margin-top: 0; }
.lib-export-link { font-size: var(--t-xs); }

@media (max-width: 640px) {
  .lib-controls { right: 0.6rem; bottom: 0.6rem; }
  .lib-return { bottom: 4.2rem; }
  .lib-progress-line { flex-direction: column; gap: 0.2rem; }
}

/* --------------------------------------------------------------- print */
@media print {
  .syn-header, .syn-footer, .syn-book-pager, .syn-book-crumbs, .syn-reader-ui,
  .lib-controls, .lib-rail, .lib-return, .lib-chapter-end, .syn-reference-note,
  .syn-voice-banner, .syn-reader-hint, .syn-reader-help, .syn-para-actions,
  .syn-toggle-original, .syn-facsimile-panel, .syn-messages, .syn-skip { display: none !important; }
  html, body, .syn-main, .syn-book-reader { background: #fff !important; color: #000 !important; }
  .syn-book-reader { max-width: none; padding: 0; }
  .syn-book-reader-body, .syn-book-reader-body p, .syn-book-reader-body li,
  .syn-book-reader-body blockquote, .syn-book-reader-body strong, .syn-book-reader-body em,
  .syn-book-reader-head h1, .syn-book-reader-body h2, .syn-book-reader-body h3 {
    color: #000 !important; font-family: var(--syn-serif);
  }
  .syn-book-reader-body { font-size: 11pt; line-height: var(--lh-dense); }
  .syn-book-reader-body a { color: #000; text-decoration: none; border-bottom: none; }
  .syn-book-reader-body h1, .syn-book-reader-body h2 { page-break-before: always; break-before: page; }
  .syn-book-reader-head h1 { page-break-before: auto; break-before: auto; }
  .syn-book-reader-body p, .syn-book-reader-body li { orphans: 3; widows: 3; }
  .syn-book-reader-body h2, .syn-book-reader-body h3 { page-break-after: avoid; break-after: avoid; }
  .syn-book-reader::after {
    content: attr(data-url); display: block; margin-top: 2rem; padding-top: 0.5rem;
    border-top: 1px solid #000; font-size: 9pt; color: #000;
  }
  @page { margin: 2cm; }
}

.lib-part-jump{display:inline-flex;align-items:center;gap:.3rem;font-size: var(--t-sm);color:var(--syn-text-dim)}
.lib-part-jump select{background:var(--syn-surface);color:var(--syn-text);border:1px solid var(--syn-border);border-radius:6px;padding:.15rem .3rem;font:inherit}