/* HE_PILLAR_FIXED_SIDEBAR_V70F
   Robust desktop behavior:
   - the page/article is the normal document scroll
   - the TOC remains beside the article while reading
   - the TOC keeps its own vertical scrollbar
   - JS uses fixed/absolute positioning instead of relying solely on CSS sticky */

/* IMPORTANT: overflow-x:hidden + overflow-y:visible on body can compute to an
   overflow scroll container and break sticky behavior in Firefox. */
html{
  height:auto!important;
  min-height:100%!important;
  max-height:none!important;
  overflow-x:clip!important;
  overflow-y:auto!important;
}
body{
  position:static!important;
  height:auto!important;
  min-height:100vh!important;
  max-height:none!important;
  overflow:visible!important;
}
body>main,main,
.toc-shell,.he-wrap.toc-shell{
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  overflow:visible!important;
  contain:none!important;
  transform:none!important;
  filter:none!important;
  perspective:none!important;
}

@media (min-width:941px){
  .toc-shell,.he-wrap.toc-shell{
    position:relative!important;
    display:grid!important;
    grid-template-columns:330px minmax(0,1fr)!important;
    gap:48px!important;
    align-items:start!important;
  }

  /* Explicit second grid column prevents the article from jumping when the
     sidebar is temporarily removed from grid flow by position:fixed. */
  .toc-shell>.article,
  article.article{
    grid-column:2!important;
    grid-row:1!important;
    position:static!important;
    width:auto!important;
    min-width:0!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:visible!important;
  }

  .toc-shell>.toc,
  aside.toc{
    grid-column:1!important;
    grid-row:1!important;
    position:relative!important;
    top:auto!important;
    left:auto!important;
    right:auto!important;
    bottom:auto!important;
    align-self:start!important;
    box-sizing:border-box!important;
    width:100%!important;
    height:auto!important;
    min-height:260px!important;
    max-height:calc(100dvh - 48px)!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    scrollbar-gutter:stable!important;
    z-index:20!important;
  }

  /* JS activates this once the reader reaches the article. */
  .toc-shell>.toc.he-toc-fixed,
  aside.toc.he-toc-fixed{
    position:fixed!important;
    top:var(--he-toc-top,24px)!important;
    left:var(--he-toc-left,0px)!important;
    bottom:auto!important;
    width:var(--he-toc-width,330px)!important;
    max-height:calc(100dvh - var(--he-toc-top,24px) - 20px)!important;
    margin:0!important;
  }

  /* At the end of the article the rail is parked at the bottom of its shell. */
  .toc-shell>.toc.he-toc-bottom,
  aside.toc.he-toc-bottom{
    position:absolute!important;
    top:auto!important;
    left:0!important;
    right:auto!important;
    bottom:0!important;
    width:var(--he-toc-width,330px)!important;
    max-height:calc(100dvh - var(--he-toc-top,24px) - 20px)!important;
    margin:0!important;
  }

  .article-section{
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:visible!important;
  }
}

@media (max-width:940px){
  html{overflow-x:hidden!important}
  .toc-shell>.article,article.article{grid-column:auto!important;grid-row:auto!important}
  .toc-shell>.toc,aside.toc{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    max-height:370px!important;
    overflow-y:auto!important;
  }
}