/* TOC component visuals */
.post-toc { box-shadow: 0 6px 16px rgba(0,0,0,.06); position: relative; }
.post-toc::before { content:''; position:absolute; left:0; top:0; bottom:0; width:3px;
  background: linear-gradient(180deg, #6366f1 0%, #22d3ee 100%); border-top-left-radius:12px; border-bottom-left-radius:12px; }
.toc-summary { list-style:none; display:flex; align-items:center; justify-content:space-between; gap:.5rem; cursor:pointer; padding:.7rem .45rem .5rem; font-weight:800; font-size:1.15rem; }
.toc-summary::-webkit-details-marker{ display:none; }
.toc-summary-icon { transition: transform .2s ease; opacity:.85; }
details.post-toc[open] .toc-summary-icon { transform: rotate(0deg); }
details.post-toc:not([open]) .toc-summary-icon { transform: rotate(-90deg); }
.toc-body { padding-top:.25rem; }
.toc-list { list-style:none; margin:0; padding:0; }
.toc-item { margin:.25rem 0; }
.toc-link { display:block; text-decoration:none; font-size:1.1rem; line-height:1.6; overflow-wrap:anywhere; padding:.22rem .3rem; border-radius:8px; }
.toc-link:hover { background:#f8fafc; text-decoration:none; }
.toc-empty{color:#6b7280;font-size:.9rem;padding:.25rem .25rem .5rem;}

/* depth indentation */
.toc-level-2 { margin-left:.75rem; }
.toc-level-3 { margin-left:1.25rem; }
.toc-level-4 { margin-left:1.75rem; }
.toc-level-5 { margin-left:2.25rem; }
.toc-level-6 { margin-left:2.75rem; }

/* Mobile bar visuals */
@media (max-width: 980px){
  /* anchor offset for headings on mobile */
  .gh-content h1, .gh-content h2, .gh-content h3, .gh-content h4, .gh-content h5, .gh-content h6 { scroll-margin-top: 64px; }
  #gh-toc.post-toc {
    box-shadow: 0 8px 18px rgba(0,0,0,.08);
    background: rgba(255,255,255,.98);
    backdrop-filter: saturate(1.2) blur(4px);
    border-radius: 0;
    border-left: 0; border-right: 0; border-top: 0;
  }
  #gh-toc .toc-body { padding-bottom:.4rem; }
}

/* anchor offset for headings on desktop */
@media (min-width: 981px){ .gh-content h1, .gh-content h2, .gh-content h3, .gh-content h4, .gh-content h5, .gh-content h6 { scroll-margin-top: 112px; } }

/* Mobile TOC clarity */
@media (max-width: 980px){
  #gh-toc.post-toc { border-bottom: 1px solid #e5e7eb; }
  #gh-toc .toc-body { 
    max-height: calc(100vh - 64px - 12px);
    overflow:auto;
    padding-bottom: .75rem;
  }
  /* subtle end fade to show there's no more content */
  #gh-toc .toc-body::after {
    content: '';
    display:block;
    height: 8px;
  }
}