.ht-single-quicknav .ht-sec-head{
  margin-bottom:12px;
}

.ht-single-quicknav .ht-quicknav{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.ht-single-quicknav .ht-quicknav__block{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:10px 12px 12px;
  border-radius:var(--radius);
  border:1px solid var(--border);
  background:#ffffff;
}

html[data-theme="dark"] .ht-single-quicknav .ht-quicknav__block{
  background:var(--surface-2);
}

.ht-single-quicknav .ht-quicknav__block-head{
  display:flex;
  flex-direction:row;
  justify-content:flex-start;
  align-items:center;
  gap:6px;
  font-size:13px;
  font-weight:600;
  color:var(--fg);
}

.ht-single-quicknav .ht-quicknav__block-icon{
  order:1;
  inline-size:18px;
  block-size:18px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.ht-single-quicknav .ht-quicknav__block-label{
  order:2;
  white-space:nowrap;
}

.ht-single-quicknav .ht-quicknav__block-icon svg{
  inline-size:18px;
  block-size:18px;
  fill:none;
  stroke:var(--brand-600);
  stroke-width:1.6;
}

html[data-theme="dark"] .ht-single-quicknav .ht-quicknav__block-icon svg{
  stroke:var(--brand-300);
}

.ht-single-quicknav .ht-quicknav__list{
  display:flex;
  align-items:center;
  gap:8px;
  padding:4px 2px 2px;
  overflow-x:auto;
  overscroll-behavior-x:contain;
  -webkit-overflow-scrolling:touch;
}

.ht-single-quicknav .ht-quicknav__list::-webkit-scrollbar{
  inline-size:6px;
  block-size:6px;
}

.ht-single-quicknav .ht-quicknav__list::-webkit-scrollbar-thumb{
  background:rgba(148,163,184,.6);
  border-radius:999px;
}

.ht-single-quicknav .ht-quicknav__item{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:8px 14px;
  border-radius:999px;
  background:var(--surface);
  border:1px solid var(--border);
  font-size:12px;
  color:var(--fg);
  text-decoration:none;
  white-space:nowrap;
  transition:background .16s ease,
             border-color .16s ease,
             color .16s ease,
             transform .16s ease;
}

.ht-single-quicknav .ht-quicknav__item:hover{
  background:color-mix(in oklab,var(--surface),var(--brand-100) 30%);
  border-color:var(--brand-400);
  color:var(--fg);
  transform:translateY(-1px);
  text-decoration:none;
}

.ht-single-quicknav .ht-quicknav__item:active{
  transform:translateY(0);
}

html[data-theme="dark"] .ht-single-quicknav .ht-quicknav__item{
  background:var(--surface);
  border-color:var(--border);
  color:var(--fg);
}

html[data-theme="dark"] .ht-single-quicknav .ht-quicknav__item:hover{
  background:color-mix(in oklab,var(--surface),var(--brand-900) 30%);
  border-color:var(--brand-300);
  color:var(--fg);
}

@media(min-width:1024px){
  .ht-single-quicknav .ht-quicknav__list{
    flex-wrap:wrap;
    overflow-x:visible;
  }
}