/* Reading progress bar \002014 fixed 3px stripe, width driven by --read-through
   (set by the runtime JS). Themed by the site's --accent token. */
.read-progress { position: fixed; top: 0; left: 0; height: 3px; width: var(--read-through, 0%); background: var(--accent, #2563eb); z-index: 9999; transition: width 100ms linear; pointer-events: none; }

/* Active TOC item \002014 the IntersectionObserver toggles is-active on the
   <li> whose heading is in the upper third of the viewport. */
.chapter-nav li.is-active > a { color: var(--accent, #2563eb); font-weight: 600; }
.chapter-nav li.is-active { position: relative; }
.chapter-nav li.is-active::before { content: ""; position: absolute; left: -1.25rem; top: 0.3em; width: 3px; height: calc(1em + 0.2em); background: var(--accent, #2563eb); border-radius: 2px; }

/* Copy-to-clipboard share button affordance. */
[data-copy-link] { cursor: pointer; }
.is-copied { opacity: 0.85; }

/* Fixed/sticky-nav compensation. The deterministic runtime measurer (JS below)
   writes the REAL navbar height into these vars, so blog content clears a
   position:fixed navbar (--bar-pad) and in-page anchor jumps land below
   the bar (--bar-scroll, fixed OR sticky). Defaults 0 \002192 static-nav sites
   get NO spurious gap. This replaces the chrome session's brittle, unenforced
   AI-estimated padding-top literal (the "blog title slides under the fixed
   header" bug): the value is now MEASURED, not guessed, and applied at the same
   selector so it wins source-order over any stale literal in _chrome.css. */
html { scroll-padding-top: var(--bar-scroll, 0px); }
body.journal-page > main { padding-top: var(--bar-pad, 0px); }
.journal-page .content, .journal-page .content p, .journal-page .content li { color: inherit; }
.journal-page .key-takeaways { background: rgba(127,127,127,0.08); color: inherit; border-left: 4px solid var(--accent, currentColor); }
.journal-page .key-takeaways h2, .journal-page .key-takeaways h3 { color: inherit; opacity: 0.7; }
.journal-page .article-meta, .journal-page .share-label { color: inherit; opacity: 0.65; }
.journal-page .tag { background: rgba(127,127,127,0.14); color: inherit; }