/* V9 reading navigation: the global header stays in normal document flow.
   Native sticky preserves the menu's space, including when scrolling upward. */
/* Ordinary fragment fallbacks stay smooth when enhancement is unavailable.
   JavaScript requests one smooth scroll for user activation, and explicitly
   instant history restoration / initial deep-link correction. */
html:has(.w-reading){--anchor-offset:24px;scroll-behavior:smooth}
body:has(.w-reading) .w-header{
  position:relative;
  top:auto;
  z-index:auto;
}
body:has(.w-reading) main .article-tools{
  position:relative;
  top:auto;
}
body:has(.w-reading) .w-toc{
  position:sticky;
  top:24px;
  align-self:start;
  max-height:calc(100dvh - 48px);
  overflow:auto;
  overscroll-behavior:contain;
  scrollbar-width:thin;
}
/* Every same-page reading destination clears the actual reading menu.
   The specificity also replaces inherited, fixed header offsets on examples. */
body:has(.w-reading) main :is(.w-reading [id],.w-reading section,.w-reading h2,#editor-profile){
  scroll-margin-top:var(--anchor-offset);
}
/* The profile follows the reading grid, beyond the sticky menu's boundary. */
body:has(.w-reading) main #editor-profile{scroll-margin-top:24px}
body:has(.w-reading) .w-toc nav a{
  font-weight:400;
  min-height:44px;
}
body:has(.w-reading) .w-toc nav a[aria-current="location"]{
  color:var(--ink);
  /* Weight remains stable so active labels never change the menu geometry. */
  text-decoration:underline;
  text-decoration-thickness:1.5px;
  text-underline-offset:5px;
}
body:has(.w-reading) .w-toc nav a:focus-visible{
  outline:2px solid var(--ink);
  outline-offset:-2px;
}
@media(max-width:760px){
  /* CSS fallback works before JS measures the menu, or with JS disabled. */
  html:has(.w-reading){--anchor-offset:calc(77px + env(safe-area-inset-top,0px))}
  body:has(.w-reading) .w-toc{
    top:env(safe-area-inset-top,0px);
    z-index:20;
    max-height:none;
    overflow:visible;
    margin-bottom:24px;
    padding:8px 0;
    background:var(--canvas);
    border-bottom:1px solid var(--line);
  }
  body:has(.w-reading) .w-toc nav{
    display:flex;
    flex-direction:row;
    align-items:center;
    overflow-x:auto;
    overflow-y:hidden;
    gap:24px;
    margin:0;
    padding:0;
    scroll-snap-type:none;
    scrollbar-width:none;
    overscroll-behavior-x:contain;
    touch-action:pan-x pan-y;
  }
  body:has(.w-reading) .w-toc nav::-webkit-scrollbar{display:none}
  body:has(.w-reading) .w-toc nav a{
    flex:0 0 auto;
    white-space:nowrap;
    padding:10px 0;
    background:transparent;
    border-radius:0;
  }
}
@media(prefers-reduced-motion:reduce){
  html:has(.w-reading){scroll-behavior:auto}
}
@media print{
  body:has(.w-reading) .w-toc{
    position:static;
    max-height:none;
    overflow:visible;
  }
  body:has(.w-reading) .w-toc nav{
    flex-direction:column;
    align-items:flex-start;
    overflow:visible;
  }
  body:has(.w-reading) .w-toc nav a{white-space:normal}
}
