/* Shared Contents navigation for Distill posts, regular posts, and projects. */
.post.distill d-article { contain: style; }
.post.distill d-contents nav a,
.post .article-toc a {
  display: inline-block;
  border-left: 2px solid transparent;
  padding-left: .55rem;
  margin-left: -.65rem;
  transition: color .18s ease, border-color .18s ease;
}
.post.distill d-contents nav a.is-active,
.post .article-toc a.is-active {
  color: var(--global-theme-color) !important;
  border-left-color: var(--global-theme-color);
}
.post.distill d-article [id],
.post article [id] { scroll-margin-top: 6rem; }
.post .article-toc {
  margin: 1.5rem 0;
  padding: .75rem 1rem;
  border-left: 1px solid var(--global-divider-color);
}
.post .article-toc h2 {
  margin: 0 0 .6rem;
  font-size: 1rem;
  font-weight: 600;
}
.post .article-toc ol { list-style: none; padding: 0; margin: 0; }
.post .article-toc li { margin: .35rem 0; line-height: 1.4; }
.post .article-toc li.toc-level-3 { padding-left: .75rem; }
.post .article-toc li.toc-level-4 { padding-left: 1.5rem; }
.post .article-toc a { color: var(--global-text-color); text-decoration: none; }
.post .article-toc a:hover { color: var(--global-theme-color); }
@media (min-width: 1025px) {
  .post.distill d-contents nav {
    max-height: calc(100vh - 7rem);
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--global-divider-color) transparent;
  }
  .post.distill d-contents nav.is-pinned {
    position: fixed;
    z-index: 10;
    top: 5.75rem;
    left: var(--article-toc-left);
    width: var(--article-toc-width);
  }
}
@media (min-width: 1200px) {
  .post .article-toc {
    position: fixed;
    z-index: 10;
    top: 5.75rem;
    left: max(1rem, calc((100vw - 780px) / 2 - 230px));
    width: 190px;
    max-height: calc(100vh - 7rem);
    margin: 0;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--global-divider-color) transparent;
  }
}
.post .article-toc.is-past-article,
.post.distill d-contents nav.is-past-article { visibility: hidden; }
@media (prefers-reduced-motion: reduce) {
  .post.distill d-contents nav a,
  .post .article-toc a { transition: none; }
}