/* Browsing programs must not move the playing video. */
@media (min-width:1001px) {
 body.library-layout .library-sidebar {
  position:sticky;top:20px;display:flex;flex-direction:column;align-self:start;
  box-sizing:border-box;height:var(--program-menu-height,calc(100dvh - 160px));
  max-height:calc(100dvh - 40px);min-height:0;
 }
 body.library-layout .library-sidebar > .program-overview { flex:none; }
 body.library-layout .library-sidebar #library-program-menu {
  display:flex;flex-direction:column;flex:1 1 auto;min-height:0;
 }
 body.library-layout .library-sidebar #library-program-menu > ul {
  flex:1 1 auto;min-height:0;height:auto;max-height:none;
  overflow-y:auto;overflow-x:hidden;overscroll-behavior-y:contain;
  scrollbar-width:auto;scrollbar-gutter:stable;scroll-snap-type:none;
  margin-bottom:0;padding-block:4px;scroll-padding-block:4px;
  /* Override legacy learning-progress padding-right:0!important. Reserve a
     real gap even with overlay scrollbars, where gutter alone adds no space. */
  padding-inline:0 12px!important;
 }
 body.library-layout .library-sidebar #library-program-menu > ul > li > a > span:not(.brand-mark) {
  min-width:0;overflow-wrap:anywhere;
 }
}

/* Let native sticky navigation span the cards/lesson and the library's about
   section. The footer remains outside the boundary, with no fixed overlay. */
@media (min-width:1001px) {
 body.library-layout .library-frame.library-navigation-frame {
  row-gap:58px;margin-bottom:var(--library-end-gap,48px);
 }
 body.library-layout .library-navigation-frame > .library-sidebar {
  grid-column:1;grid-row:1 / span 2;
 }
 body.library-layout .library-navigation-frame > #main {
  grid-column:2;grid-row:1;
 }
 html body.library-layout .library-frame.library-navigation-frame > .library-frame.library-about-frame {
  grid-column:2;grid-row:2;display:block;width:100%;margin:0!important;
 }
}
