/* Post-page enhancements: progress bar, TOC, takeaways, code copy, author box.
   Loaded only by posts that opt in; builds on the tokens in site.css. */
.read-progress{position:fixed;top:0;left:0;height:3px;width:0;background:var(--blue);z-index:1000;transition:width .1s linear}
.post-hero{margin:22px 0 8px;border-radius:var(--radius);overflow:hidden;border:1px solid var(--border);aspect-ratio:16/9;background:var(--blue-soft)}
.post-hero img{display:block;width:100%;height:100%;object-fit:cover}
.takeaways{margin:24px 0;padding:18px 22px;border:1px solid var(--border);border-left:4px solid var(--blue);border-radius:var(--radius);background:var(--blue-soft)}
.takeaways h2{margin:0 0 10px;font-size:1rem;letter-spacing:.02em;text-transform:uppercase;color:var(--blue-dark)}
.takeaways ul{margin:0;padding-left:20px}
.takeaways li{margin:6px 0}
.toc{margin:24px 0;padding:16px 20px;border:1px solid var(--border);border-radius:var(--radius)}
.toc summary{cursor:pointer;font-weight:700;list-style:none}
.toc summary::-webkit-details-marker{display:none}
.toc summary::after{content:"+";float:right;color:var(--muted)}
.toc[open] summary::after{content:"\2013"}
.toc ol{margin:12px 0 0;padding-left:20px}
.toc li{margin:5px 0}
.toc a{color:var(--ink);text-decoration:none}
.toc a:hover,.toc a.active{color:var(--blue)}
.article-body h2{scroll-margin-top:90px}
.code-wrap{position:relative}
.copy-btn{position:absolute;top:8px;right:8px;font:600 12px var(--sans);padding:4px 10px;border-radius:8px;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.08);color:#e6e9f0;cursor:pointer;opacity:0;transition:opacity .15s}
.code-wrap:hover .copy-btn,.copy-btn:focus{opacity:1}
@media (hover:none){.copy-btn{opacity:1}}
.author-box{display:flex;gap:16px;align-items:flex-start;margin:36px 0 8px;padding:20px;border:1px solid var(--border);border-radius:var(--radius)}
.author-box img{width:56px;height:56px;border-radius:50%;flex:none;background:var(--blue-soft);object-fit:contain;padding:8px}
.author-box p{margin:4px 0 0;color:var(--muted)}
.author-box a{font-weight:600}
@media (min-width:1180px){
  .post-layout{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:40px;align-items:start}
  .post-layout .toc{position:sticky;top:90px;margin-top:0;order:2;font-size:.92rem}
  .post-layout .toc summary{pointer-events:none}
  .post-layout .toc summary::after{content:""}
}
@media (prefers-reduced-motion:reduce){.read-progress,.copy-btn{transition:none}}