/* =========================================================================
   附件文档页样式（配合 main.css 使用）
   深色、长文可读、表格友好、带返回主页
   ========================================================================= */

.doc-nav {
  position: sticky; top: 0; z-index: 50;
  backdrop-filter: blur(14px); background: rgba(10,12,17,.78);
  border-bottom: 1px solid var(--border);
}
.doc-nav .nav-inner { height: 58px; }
.back-home {
  display:inline-flex; align-items:center; gap: 8px; font-weight:700; font-size: 14px;
  color: var(--text); padding: 8px 15px; border-radius: 999px; border:1px solid var(--border-2);
  background: var(--surface); transition:.2s;
}
.back-home:hover { background: var(--surface-2); text-decoration:none; transform: translateX(-2px); }
.doc-tag { font-family: var(--mono); font-size: 13px; color: var(--text-faint); font-weight:700; }

.doc {
  max-width: 860px; margin: 0 auto; padding: 56px 22px 120px;
}
.doc-hero { margin-bottom: 44px; padding-bottom: 28px; border-bottom: 1px solid var(--border); }
.doc-hero .eyebrow { margin-bottom: 12px; }
.doc-hero h1 { font-size: clamp(26px, 4.5vw, 42px); margin-bottom: 14px; line-height:1.15; }
.doc-hero .doc-lead { font-size: 17px; color: var(--text-dim); }

.doc-note {
  background: rgba(56,189,248,.07); border:1px solid rgba(56,189,248,.25);
  border-radius: 12px; padding: 14px 16px; font-size: 13.5px; color: var(--text-dim); margin-bottom: 34px;
}
.doc-note b { color: var(--cyan); }

/* TOC（可吸顶 + 展开/收起，用原生 details/summary，无需 JS） */
.toc {
  background: rgba(20,26,36,.96); backdrop-filter: blur(12px);
  border:1px solid var(--border); border-radius: 14px; padding: 0 22px;
  margin-bottom: 40px; position: sticky; top: 70px; z-index: 30;
  box-shadow: var(--shadow);
}
.toc[open] { padding-bottom: 18px; }
.toc-title {
  font-size: 13px; text-transform: uppercase; letter-spacing:.12em; color: var(--text-dim);
  font-weight:700; cursor: pointer; list-style: none;
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 0; user-select: none;
}
.toc-title::-webkit-details-marker { display: none; }
.toc-title::after {
  content: "展开 ▾"; font-size: 12px; color: var(--accent-2); letter-spacing: .04em;
  text-transform: none; font-weight: 700;
}
.toc[open] .toc-title::after { content: "收起 ▴"; }
.toc-title:hover { color: var(--text); }
.toc ol { list-style: none; counter-reset: toc; display:grid; gap: 7px; margin: 4px 0 0; padding: 0; }
.toc li { counter-increment: toc; }
.toc li::before { content: counter(toc,decimal-leading-zero) " · "; font-family: var(--mono); color: var(--accent-2); font-weight:800; }
.toc a { color: var(--text); } .toc a:hover { color: var(--accent); }

/* 排版 */
.doc h2 {
  font-size: 24px; margin: 48px 0 16px; padding-top: 14px; scroll-margin-top: 70px;
  display:flex; align-items:center; gap: 12px;
}
.doc h2::before { content:""; width: 6px; height: 24px; border-radius: 3px; background: var(--grad-warm); }
.doc h3 { font-size: 18px; margin: 28px 0 10px; color: var(--accent-2); }
.doc h4 { font-size: 15px; margin: 18px 0 8px; color: var(--cyan); }
.doc p  { margin: 12px 0; color: var(--text); }
.doc ul, .doc ol { margin: 12px 0 12px 4px; padding-left: 22px; }
.doc li { margin: 6px 0; }
.doc strong { color: #fff; }
.doc blockquote {
  border-left: 3px solid var(--accent); background: rgba(255,138,61,.06);
  padding: 12px 18px; border-radius: 0 10px 10px 0; margin: 16px 0; color: var(--text-dim);
}
.doc code {
  font-family: var(--mono); font-size: 13px; background: var(--surface-2);
  padding: 2px 7px; border-radius: 6px; color: var(--accent-2);
}
.doc pre {
  background: var(--bg-2); border:1px solid var(--border); border-radius: 12px;
  padding: 16px 18px; overflow:auto; margin: 16px 0;
}
.doc pre code { background: none; padding: 0; color: var(--text); }
.doc hr { border:none; border-top:1px solid var(--border); margin: 32px 0; }

/* 表格 */
.doc table { width: 100%; border-collapse: collapse; margin: 18px 0; font-size: 14px; }
.doc th, .doc td { padding: 11px 13px; border: 1px solid var(--border); text-align: left; vertical-align: top; }
.doc th { background: var(--surface-2); font-weight: 700; color: var(--text); }
.doc tr:nth-child(even) td { background: rgba(255,255,255,.015); }
.doc td .ok { color: var(--green); font-weight:700; }
.doc td .bad { color: var(--red); font-weight:700; }
.doc td .mid { color: var(--amber); font-weight:700; }

/* 关键结论框 */
.callout {
  border-radius: 14px; padding: 18px 20px; margin: 20px 0; border:1px solid var(--border-2);
  background: var(--surface);
}
.callout.tldr-box { border-color: rgba(255,138,61,.4); background: rgba(255,138,61,.07); }
.callout .c-k { font-size: 12px; text-transform: uppercase; letter-spacing:.12em; font-weight:800; color: var(--accent-2); margin-bottom: 8px; }

/* 数据卡组 */
.statline { display:flex; flex-wrap:wrap; gap: 14px; margin: 18px 0; }
.stat {
  flex:1 1 150px; background: var(--surface); border:1px solid var(--border); border-radius: 12px; padding: 16px 18px;
}
.stat .s-v { font-family: var(--mono); font-size: 26px; font-weight: 800; color: var(--accent); }
.stat .s-k { font-size: 13px; color: var(--text-dim); margin-top: 4px; }

/* 风险条（复用主页类，附件内再定义一份保证独立可读） */
.rk { display:inline-block; padding: 2px 9px; border-radius: 6px; font-size:12px; font-weight:700; }
.rk.hi  { background: rgba(248,113,113,.16); color:#fca5a5; }
.rk.mid { background: rgba(251,191,36,.16);  color:#fcd34d; }
.rk.lo  { background: rgba(52,211,153,.16);  color:#6ee7b7; }

/* SOP 勾选清单 */
.sop-week { background: var(--surface); border:1px solid var(--border); border-radius: 14px; padding: 20px 22px; margin: 16px 0; }
.sop-week .sw-h { display:flex; align-items:center; gap:10px; font-weight:800; font-size: 17px; margin-bottom: 14px; }
.sop-week .sw-h .wk-badge { font-family:var(--mono); background: var(--grad-cool); color:#04121e; padding: 3px 10px; border-radius: 7px; font-size:13px; }
.checklist { list-style:none; padding:0; margin:0; }
.checklist li { display:flex; gap: 11px; align-items:flex-start; padding: 7px 0; border-bottom:1px dashed var(--border); }
.checklist li:last-child { border-bottom:none; }
.checklist input[type=checkbox]{ width: 19px; height:19px; accent-color: var(--green); margin-top:2px; flex:0 0 auto; cursor:pointer; }
.checklist label { font-size: 14.5px; cursor:pointer; }
.checklist input:checked + label { color: var(--text-faint); text-decoration: line-through; }

@media (max-width: 640px){
  .doc { padding: 40px 16px 90px; }
  .doc h2 { font-size: 21px; margin: 36px 0 14px; }
  .doc h3 { font-size: 16px; }
  /* 宽表格在窄屏横向滚动，保持表格语义 */
  .doc table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; font-size: 12.5px; }
  .doc th, .doc td { padding: 8px 10px; }
  .toc { top: 64px; padding: 0 16px; }
  .riskbar { font-size: 10.5px; }
  .statline { gap: 10px; }
  .stat { flex: 1 1 130px; padding: 13px 14px; }
}