/* Blog post "On this page" list: sticky sidebar + scroll-spy (paired with blog-toc.js). Desktop only (>=1180px);
   below that the list stays the collapsible card above the article. */
/* Sticky needs no scrolling ancestor: Tailwind's overflow-x-hidden on <main>/<body> makes them scroll containers
   (overflow-y becomes auto), which pins position:sticky to a box that never scrolls. clip hides overflow the same way. */
html.sk.sk-post main,html.sk.sk-post body{overflow-x:clip!important;overflow-y:visible!important}
html.sk.sk-post .prose h2[id]{scroll-margin-top:100px}
@media (min-width:1180px){
 html.sk.sk-post .sk-toc{top:100px}
 html.sk.sk-post .sk-toc ol{position:relative;max-height:calc(100vh - 100px - 96px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#c3ccd8 transparent;padding-right:8px;margin-right:-8px}
 html.sk.sk-post .sk-toc a{position:relative;transition:color .18s ease}
 html.sk.sk-post .sk-toc a::before{transition:color .18s ease}
 html.sk.sk-post .sk-toc a::after{content:"";position:absolute;left:-14px;top:7px;bottom:7px;width:3px;border-radius:3px;background:#08e5c0;opacity:0;transform:scaleY(.4);transition:opacity .18s ease,transform .18s ease}
 /* the older observer in the page script also toggles .on; once blog-toc.js runs it owns the highlight */
 html.toc-spy .sk-toc a.on:not(.is-active):not(:hover){color:var(--sk-ink3)}
 html.toc-spy .sk-toc a.on:not(.is-active)::before{color:#a7b3c2}
 html.sk.sk-post .sk-toc a.is-active{color:var(--sk-tink);font-weight:600}
 html.sk.sk-post .sk-toc a.is-active::before{color:var(--sk-tink);font-weight:700}
 html.sk.sk-post .sk-toc a.is-active::after{opacity:1;transform:none}
}
@media (prefers-reduced-motion:reduce){html.sk.sk-post .sk-toc a,html.sk.sk-post .sk-toc a::before,html.sk.sk-post .sk-toc a::after{transition:none}}