/* Galok Hook Sidebar — desktop navigation for Dongjing Meng Hua Lu entries */
.dj-hook-sidebar{display:none}

@media (min-width:1180px){
  .dongjing-page.dj-hook-pilot .dj-entry-body.dj-hook-grid{
    grid-template-columns:264px minmax(0,800px) minmax(250px,1fr);
    column-gap:42px;
    row-gap:48px;
  }

  .dongjing-page.dj-hook-pilot .dj-entry-side--legacy{display:none}

  .dongjing-page.dj-hook-pilot .dj-hook-sidebar{
    --hook-color:var(--dj-jade);
    display:block;
    position:sticky;
    top:104px;
    align-self:start;
    grid-column:1;
    grid-row:1 / span var(--hook-row-span,1);
    min-width:0;
    max-height:calc(100svh - 124px);
    padding-right:8px;
    overflow-y:auto;
    overscroll-behavior:contain;
    scrollbar-width:thin;
    scrollbar-color:color-mix(in srgb,var(--dj-rule) 80%,transparent) transparent;
    color:var(--dj-ink);
  }

  .dongjing-page.dj-hook-pilot .dj-entry-body.dj-hook-grid>.dj-hook-grid-prose{
    grid-column:2;
    grid-row:var(--hook-grid-row);
  }

  .dongjing-page.dj-hook-pilot .dj-entry-body.dj-hook-grid>.dj-hook-grid-notes{
    grid-column:3;
    grid-row:var(--hook-grid-row);
  }

  .dongjing-page.dj-hook-pilot .dj-entry-body.dj-hook-grid>.dj-hook-grid-wide{
    grid-column:2/-1;
    grid-row:var(--hook-grid-row);
  }

  .dongjing-page.dj-hook-pilot .dj-entry-body.dj-hook-grid>.dj-hook-grid-skip{display:none!important}

  .dj-hook-sidebar__head{
    padding:0 8px 18px 0;
    border-bottom:1px solid var(--dj-rule);
  }

  .dj-hook-sidebar__head p{
    margin:0;
    color:var(--hook-color);
    font:780 .78rem/1.25 var(--dj-mono);
    letter-spacing:.095em;
  }

  .dj-hook-sidebar__head span{
    display:block;
    margin-top:8px;
    color:var(--dj-muted);
    font:740 .75rem/1.25 var(--dj-mono);
    letter-spacing:.12em;
    text-transform:uppercase;
  }

  .dj-hook-sidebar__list{
    position:relative;
    display:flex;
    flex-direction:column;
    margin-top:18px;
    padding:3px 0 4px;
  }

  .dj-hook-sidebar__item{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:31px minmax(0,1fr);
    gap:8px;
    align-items:center;
    min-height:52px;
    padding:9px 6px 9px 32px;
    color:var(--dj-muted);
    text-decoration:none;
    transition:color .18s ease;
  }

  .dj-hook-sidebar__item:hover,
  .dj-hook-sidebar__item:focus-visible{color:var(--dj-ink)}

  .dj-hook-sidebar__item:focus-visible{
    outline:1px solid var(--dj-rule);
    outline-offset:3px;
  }

  .dj-hook-sidebar__item[data-active="true"]{color:var(--dj-ink)}

  .dj-hook-sidebar__index{
    color:color-mix(in srgb,var(--dj-muted) 82%,transparent);
    font:760 .75rem/1 var(--dj-mono);
    letter-spacing:.07em;
    transition:color .18s ease;
  }

  .dj-hook-sidebar__item[data-active="true"] .dj-hook-sidebar__index{color:var(--hook-color)}

  .dj-hook-sidebar__label{
    font-size:1.06rem;
    font-weight:590;
    line-height:1.18;
    letter-spacing:-.018em;
  }

  .dj-hook-sidebar__rail{
    position:absolute;
    inset:0 auto auto 0;
    z-index:1;
    width:25px;
    height:100%;
    color:var(--hook-color);
    opacity:0;
    pointer-events:none;
    transition:opacity .16s ease;
  }

  .dj-hook-sidebar__rail.is-visible{opacity:1}
  .dj-hook-sidebar__rail--hover{color:var(--dj-ink);opacity:0}
  .dj-hook-sidebar__rail--hover.is-visible{opacity:.28}

  .dj-hook-sidebar__stem{
    position:absolute;
    left:3px;
    top:0;
    width:1.5px;
    height:0;
    background:currentColor;
    transition:top .42s cubic-bezier(.16,1,.3,1),height .42s cubic-bezier(.16,1,.3,1);
  }

  .dj-hook-sidebar__corner{
    position:absolute;
    left:3px;
    top:0;
    width:21px;
    height:12px;
    border-left:1.5px solid currentColor;
    border-bottom:1.5px solid currentColor;
    border-bottom-left-radius:11px;
    transition:top .42s cubic-bezier(.16,1,.3,1);
  }

  .dj-hook-sidebar__back{
    display:inline-block;
    margin-top:24px;
    padding-top:16px;
    border-top:1px solid var(--dj-rule);
    color:var(--dj-muted);
    text-decoration:none;
    font:760 .75rem/1.35 var(--dj-mono);
    letter-spacing:.075em;
    transition:color .18s ease;
  }

  .dj-hook-sidebar__back:hover,
  .dj-hook-sidebar__back:focus-visible{color:var(--hook-color)}

  .dongjing-page.dj-hook-pilot [data-hook-section]{scroll-margin-top:128px}
}

@media (prefers-reduced-motion:reduce){
  .dj-hook-sidebar__item,
  .dj-hook-sidebar__index,
  .dj-hook-sidebar__rail,
  .dj-hook-sidebar__stem,
  .dj-hook-sidebar__corner,
  .dj-hook-sidebar__back{transition:none!important}
}
