/* ============================================================
   Clash官网 · 完整文档页专属样式(deepdoc.css)
   依赖 base.css / components.css 的设计令牌与组件
   ============================================================ */

/* 页头引言区 */
.doc-open { padding-bottom: 24px; }

.doc-kicker {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  color: var(--pine);
  margin: 0 0 14px;
}

.doc-lede {
  max-width: 780px;
  font-size: 1rem;
  color: var(--ink);
  margin-bottom: 28px;
}

/* 章节容器:比通用 .sec 更紧凑,并为锚点跳转预留吸顶导航高度 */
.doc-chap {
  padding: 44px 0;
  scroll-margin-top: 120px;
}

/* h3 小节:等宽编号前缀 */
.doc-chap h3 {
  margin-top: 34px;
  margin-bottom: 12px;
  display: flex;
  align-items: baseline;
  gap: 10px;
}
.h3-idx {
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  color: var(--pine);
  flex-shrink: 0;
}

/* 自定义步骤列表:计数圆标 */
.doc-steps {
  list-style: none;
  padding-left: 0;
  counter-reset: docstep;
  margin-bottom: 1.2em;
}
.doc-steps li {
  position: relative;
  counter-increment: docstep;
  padding-left: 42px;
  margin-bottom: 12px;
}
.doc-steps li::before {
  content: counter(docstep, decimal-leading-zero);
  position: absolute;
  left: 0;
  top: 0.22em;
  width: 28px;
  padding: 1px 0;
  text-align: center;
  font-family: var(--font-mono);
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--pine-deep);
  background: var(--paper-deep);
  border: var(--line-w) solid var(--rule);
  border-radius: var(--rad-s);
}

/* 表格横向滚动容器:窄屏防溢出 */
.tbl-x {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin-bottom: 1.2em;
}
.tbl-x table { min-width: 560px; margin: 0; }

/* 章末返回目录 */
.doc-back {
  margin: 26px 0 0;
  font-size: 0.74rem;
  letter-spacing: 0.06em;
}
.doc-back a {
  color: var(--ink-dim);
  text-decoration: none;
}
.doc-back a:hover { color: var(--pine-deep); }

@media (max-width: 640px) {
  .doc-chap { padding: 34px 0; scroll-margin-top: 96px; }
  .doc-lede { font-size: 0.94rem; }
  .doc-steps li { padding-left: 38px; }
  .tbl-x table { min-width: 480px; }
}