/* ══════════════════════════════════════════════════════════════════
   Sticky table of contents — long reference pages only.
   Loaded by the-blessed-mother, metaphysics, the-mass, heresies.

   Two presentations of one nav element, switched by toc-sidebar.js:
     .ll-toc--rail    fixed sidebar parked in the left gutter
     .ll-toc--inline  "Contents" button in the flow, collapsed by default

   The script picks the rail only when it measures enough empty gutter
   to hold it, so the rail can never sit on top of the text column.
   ══════════════════════════════════════════════════════════════════ */

.ll-toc{
  --ll-toc-w:236px;
  --ll-toc-gap:28px;
  font-family:var(--body);
}

/* Hidden until the script has measured and chosen a mode, so the rail
   never flashes across the text column during load. */
.ll-toc:not(.ll-toc--rail):not(.ll-toc--inline){display:none;}

.ll-toc-title{
  margin:0 0 12px;
  font-family:var(--display);
  font-size:.68rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--gold-deep);
}

.ll-toc-items{
  list-style:none;
  margin:0;
  padding:0;
}

.ll-toc-items a{
  display:block;
  padding:4px 10px 4px 12px;
  border-left:2px solid transparent;
  font-size:.82rem;
  line-height:1.35;
  color:var(--muted);
  text-decoration:none;
  transition:color .15s ease,border-color .15s ease,background-color .15s ease;
}
.ll-toc-h3 a{
  padding-left:26px;
  font-size:.78rem;
  color:#7d705c;
}
.ll-toc-items a:hover,
.ll-toc-items a:focus-visible{
  color:var(--ink);
  background:rgba(154,122,46,.07);
}
.ll-toc-items a[aria-current]{
  color:var(--gold-deep);
  border-left-color:var(--gold);
  background:rgba(154,122,46,.09);
}

/* ── Toggle button ───────────────────────────────────────────────── */
.ll-toc-tog{
  display:none;
  align-items:center;
  gap:9px;
  width:100%;
  padding:11px 16px;
  background:#fbf8ef;
  border:1px solid var(--rule);
  border-radius:3px;
  font-family:var(--display);
  font-size:.72rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--gold-deep);
  cursor:pointer;
}
.ll-toc-tog::after{
  content:"";
  width:7px;height:7px;
  margin-left:auto;
  border-right:1.5px solid currentColor;
  border-bottom:1.5px solid currentColor;
  transform:translateY(-2px) rotate(45deg);
  transition:transform .2s ease;
}
.ll-toc-tog[aria-expanded="true"]::after{transform:translateY(1px) rotate(-135deg);}

/* ── Rail: fixed sidebar in the left gutter ──────────────────────── */
.ll-toc--rail{
  position:fixed;
  top:calc(var(--nav-h) + 24px);
  left:var(--ll-toc-left,20px);
  z-index:20;
  width:var(--ll-toc-w);
  max-height:calc(100vh - var(--nav-h) - 56px);
  display:flex;
  flex-direction:column;
  padding:18px 8px 18px 14px;
  background:#fbf8efe6;
  border:1px solid var(--rule);
  border-radius:3px;
  box-shadow:0 1px 10px rgba(36,26,16,.05);
  backdrop-filter:blur(2px);
}
.ll-toc--rail .ll-toc-title{padding-left:12px;}
.ll-toc--rail .ll-toc-panel{
  min-height:0;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  scrollbar-color:var(--rule) transparent;
}
.ll-toc--rail .ll-toc-panel::-webkit-scrollbar{width:6px;}
.ll-toc--rail .ll-toc-panel::-webkit-scrollbar-thumb{background:var(--rule);border-radius:3px;}

/* ── Inline: collapsed "Contents" button in the flow ─────────────── */
.ll-toc--inline{
  max-width:var(--measure);
  margin:26px auto 6px;
  padding:0 26px;
}
.ll-toc--inline .ll-toc-tog{display:flex;}
.ll-toc--inline .ll-toc-title{display:none;}
.ll-toc--inline .ll-toc-panel{
  display:none;
  margin-top:-1px;
  padding:12px 8px;
  background:#fbf8ef;
  border:1px solid var(--rule);
  border-top:0;
  border-radius:0 0 3px 3px;
  max-height:min(58vh,520px);
  overflow-y:auto;
  overscroll-behavior:contain;
}
.ll-toc--inline .ll-toc-panel.is-open{display:block;}

@media(max-width:620px){
  .ll-toc--inline{padding:0 18px;}
}

@media(prefers-reduced-motion:reduce){
  .ll-toc-items a,.ll-toc-tog::after{transition:none;}
}

@media print{
  .ll-toc{display:none !important;}
}
