/* 使用教程（docs.html）专用：目录与章节动效，v1.1.0 */
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.doc-sec{transition:box-shadow .32s ease}

/* 桌面端：目录左侧渐变指示条随选中项长出来 */
@media (min-width:981px){
  .doc-nav a{position:relative;transition:color .18s ease,background .18s ease}
  .doc-nav a::before{
    content:"";position:absolute;left:0;top:50%;width:3px;height:0;transform:translateY(-50%);
    border-radius:3px;background:linear-gradient(180deg,var(--accent),var(--accent-2));
    transition:height .26s cubic-bezier(.3,.8,.3,1);
  }
  .doc-nav a.on::before{height:60%}
}

/* 滚动进入时章节淡入上移（只有 JS 挂上 .doc-anim 才隐藏，脚本失败也能看） */
.doc-anim .doc-sec{opacity:0;transform:translateY(16px);transition:opacity .5s ease,transform .52s cubic-bezier(.2,.7,.3,1)}
.doc-anim .doc-sec.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .doc-anim .doc-sec{opacity:1;transform:none;transition:none}
}

/* 点目录跳过去时目标章节闪一圈 */
.doc-sec.flash{animation:hkDocFlash 1.15s ease}
@keyframes hkDocFlash{
  0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--accent) 38%,transparent)}
  26%{box-shadow:0 0 0 6px color-mix(in srgb,var(--accent) 16%,transparent)}
  100%{box-shadow:0 0 0 0 transparent}
}
/* 手机端目录换成横向标签条，点击时轻微缩放反馈 */
@media (max-width:980px){
  .doc-nav a{transition:transform .16s ease,background .18s ease,color .18s ease}
  .doc-nav a:active{transform:scale(.96)}
}