/* ============================================================================
   VPNJM · deepdoc layer（故障排查页专属）
   只放本页新增的排版零件：章节等宽小标、判断流程、勾选清单、症状小卡、
   相关阅读格。颜色与圆角一律取自 base.css 的令牌，不新增硬编码值。
   ========================================================================== */

.doc-body{max-width:900px;min-width:0}

/* 目录条在 prose 内：去掉正文链接的下划线，保留胶囊形态 */
.prose .toc-tabs a{text-decoration:none}

/* 章节等宽小标 + 细分隔线 */
.prose .doc-k{
  display:flex;
  align-items:center;
  gap:12px;
  margin-top:52px;
  font-family:var(--font-mono);
  font-size:10.5px;
  letter-spacing:.16em;
  color:var(--text-muted);
  text-transform:uppercase;
}
.prose .doc-k::after{
  content:"";
  flex:1 1 auto;
  min-width:24px;
  height:1px;
  background:var(--border);
}
.prose .doc-k + h2{margin-top:8px}
.prose > section:first-of-type .doc-k{margin-top:36px}

/* 判断流程：等宽编号 + 浅面板 */
.prose .doc-flow{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-top:18px;
  padding-left:0;
  list-style:none;
  counter-reset:df;
}
.prose .doc-flow li{
  position:relative;
  min-width:0;
  padding:14px 16px 14px 48px;
  border-radius:var(--r-md);
  background:var(--bg-panel);
  border:1px solid rgb(var(--text-rgb)/.08);
  box-shadow:var(--shadow-soft);
  font-size:13.5px;
  line-height:1.72;
  color:var(--text-muted);
}
.prose .doc{}
.prose .doc-flow li + li{margin-top:0}
.prose .doc-flow li::before{
  counter-increment:df;
  content:counter(df,decimal-leading-zero);
  position:absolute;
  left:16px;
  top:14px;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.06em;
  color:var(--accent);
}
.prose .doc-flow strong{color:var(--text);font-weight:600}

/* 勾选清单 */
.prose .doc-check{
  display:flex;
  flex-direction:column;
  gap:9px;
  margin-top:18px;
  padding-left:0;
  list-style:none;
}
.prose .doc-check li{
  position:relative;
  min-width:0;
  padding-left:26px;
  font-size:13.5px;
  line-height:1.7;
  color:var(--text-muted);
}
.prose .doc-check li + li{margin-top:0}
.prose .doc-check li::before{
  content:"";
  position:absolute;
  left:0;
  top:5px;
  width:14px;
  height:14px;
  border-radius:4px;
  border:1px solid rgb(var(--accent-rgb)/.38);
  background:rgb(var(--accent-rgb)/.08);
}
.prose .doc-check li::after{
  content:"";
  position:absolute;
  left:4px;
  top:8px;
  width:5px;
  height:8px;
  border-right:1.6px solid var(--accent);
  border-bottom:1.6px solid var(--accent);
  transform:rotate(42deg);
}

/* 症状小卡 */
.prose .doc-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  gap:12px;
  margin-top:18px;
  min-width:0;
}
.prose .doc-card{
  min-width:0;
  padding:15px 17px;
  border-radius:var(--r-md);
  background:linear-gradient(180deg,var(--white),var(--bg-panel-3));
  border:1px solid rgb(var(--text-rgb)/.08);
  box-shadow:var(--shadow-soft);
}
.prose .doc-card h4{
  margin-bottom:5px;
  font-size:13.5px;
  font-weight:700;
  color:var(--text);
}
.prose .doc-card p{
  font-size:12.5px;
  line-height:1.66;
  color:var(--text-muted);
}

/* 相关阅读格 */
.prose .doc-next{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:12px;
  margin-top:18px;
  min-width:0;
}
.prose .doc-next a{
  display:flex;
  flex-direction:column;
  gap:5px;
  min-width:0;
  padding:15px 17px;
  border-radius:var(--r-md);
  background:var(--bg-panel);
  border:1px solid rgb(var(--text-rgb)/.08);
  box-shadow:var(--shadow-soft);
  color:var(--text);
  text-decoration:none;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.prose .doc-next a:hover{
  transform:translateY(-2px);
  border-color:rgb(var(--accent-rgb)/.24);
  box-shadow:0 20px 32px -24px rgb(var(--accent-rgb)/.5);
}
.prose .doc-next .next-k{
  font-family:var(--font-mono);
  font-size:10px;
  letter-spacing:.14em;
  color:var(--text-muted);
}
.prose .doc-next .next-t{
  font-size:13.5px;
  font-weight:700;
  color:var(--text);
}
.prose .doc-next .next-d{
  font-size:12px;
  line-height:1.6;
  color:var(--text-muted);
}

/* 表格标题在 prose 内保持等宽小标风格 */
.prose .data-table caption{
  caption-side:top;
  text-align:left;
  padding:11px 14px;
  font-family:var(--font-mono);
  font-size:10.5px;
  letter-spacing:.14em;
  color:var(--text-muted);
  border-bottom:1px solid var(--border);
}

@media (max-width:768px){
  .doc-body{max-width:100%}
  .prose .doc-k{margin-top:40px}
  .prose .doc-flow li{padding:13px 14px 13px 44px}
  .prose .doc-grid{grid-template-columns:1fr}
  .prose .doc-next{grid-template-columns:1fr}
}