/* 协议与帮助页面（PC + H5 共用正文样式）
   依赖：PC 端 home.css 提供设计变量，H5 端 h5-shell.css 提供外壳与变量。 */

.legal-page {
  background: var(--bg, #f6f7fb);
  color: var(--ink, #0a1730);
  font-family: var(--font-ui, -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif);
  -webkit-font-smoothing: antialiased;
}

.legal-wrap { width: 100%; max-width: 900px; margin: 0 auto; padding: 0 24px; }

/* ---------- 顶部栏 ---------- */
.legal-topbar {
  position: sticky;
  top: 0;
  z-index: 20;
  border-bottom: 1px solid var(--line, #e8ecf5);
  background: rgba(255, 255, 255, .94);
  backdrop-filter: saturate(180%) blur(8px);
}
.legal-topbar-inner { display: flex; align-items: center; gap: 20px; min-height: 64px; }
.legal-brand { display: inline-flex; align-items: center; gap: 9px; color: var(--ink, #0a1730); font-size: 15px; font-weight: 800; text-decoration: none; letter-spacing: .01em; }
.legal-mark { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 8px; background: linear-gradient(140deg, var(--primary, #1e5eff), #4c86ff); color: #fff; font-size: 15px; font-weight: 800; }
.legal-nav { display: flex; flex: 1; flex-wrap: wrap; gap: 6px; }
.legal-nav a { padding: 7px 12px; border-radius: 8px; color: var(--text-mid, #4c586b); font-size: 13px; font-weight: 600; text-decoration: none; transition: .15s; }
.legal-nav a:hover { background: var(--primary-light, #eaf0ff); color: var(--primary, #1e5eff); }
.legal-nav a.active { background: var(--primary-light, #eaf0ff); color: var(--primary, #1e5eff); font-weight: 800; }
.legal-back { color: var(--text-light, #8993a8); font-size: 13px; font-weight: 600; text-decoration: none; white-space: nowrap; }
.legal-back:hover { color: var(--primary, #1e5eff); }

/* ---------- 正文 ---------- */
.legal-main { padding: 34px 24px 12px; }
.legal-eyebrow { margin: 0; color: var(--primary, #1e5eff); font-size: 12px; font-weight: 800; letter-spacing: .14em; }
.legal-page h1 { margin: 10px 0 0; font-size: 30px; line-height: 1.3; letter-spacing: -.01em; }
.legal-meta { margin: 10px 0 0; color: var(--text-light, #8993a8); font-size: 12.5px; }
.legal-summary { margin: 16px 0 0; padding: 14px 16px; border: 1px solid var(--line, #e8ecf5); border-left: 3px solid var(--primary, #1e5eff); border-radius: 10px; background: #fff; color: var(--text-mid, #4c586b); font-size: 13.5px; line-height: 1.8; }
.legal-section { margin-top: 30px; scroll-margin-top: 84px; }
.legal-section h2 { margin: 0 0 12px; font-size: 17px; line-height: 1.5; scroll-margin-top: 90px; }
.legal-section p { margin: 9px 0 0; color: var(--text-mid, #4c586b); font-size: 13.5px; line-height: 1.95; }

/* 首段引导语（原型 .policy > p 的第一段） */
.legal-intro { margin: 16px 0 0; color: var(--text-mid, #4c586b); font-size: 13.5px; line-height: 1.95; }

/* 条目列表（原型 <ul><li>，含 <b> 小标题） */
.legal-list { margin: 10px 0 0; padding-left: 20px; }
.legal-list li { margin-top: 7px; color: var(--text-mid, #4c586b); font-size: 13.5px; line-height: 1.9; }
.legal-list li::marker { color: var(--primary, #1e5eff); }
.legal-list li b { color: var(--ink, #0d1f42); font-weight: 800; }

/* PC：左侧小节导航 + 右侧正文（锚点深链） */
.legal-body { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 28px; align-items: start; margin-top: 26px; }
.legal-toc { position: sticky; top: 82px; padding: 16px 16px 14px; border: 1px solid var(--line, #e8ecf5); border-radius: 12px; background: #fff; }
.legal-toc-title { margin: 0 0 10px; color: var(--text-light, #8993a8); font-size: 11.5px; font-weight: 800; letter-spacing: .12em; }
.legal-toc ol { margin: 0; padding-left: 18px; }
.legal-toc li { margin-top: 7px; font-size: 13px; line-height: 1.5; }
.legal-toc a { color: var(--text-mid, #4c586b); text-decoration: none; }
.legal-toc a:hover { color: var(--primary, #1e5eff); }
.legal-sections .legal-section:first-child { margin-top: 0; }

@media (max-width: 900px) {
  .legal-body { grid-template-columns: 1fr; gap: 18px; }
  .legal-toc { position: static; }
}
.legal-contacts { margin: 0; padding: 0; list-style: none; }
.legal-contacts li { display: flex; flex-wrap: wrap; gap: 4px 14px; padding: 11px 0; border-bottom: 1px dashed var(--line, #e8ecf5); font-size: 13.5px; }
.legal-contacts li:last-child { border-bottom: 0; }
.legal-contacts span { flex: 0 0 92px; color: var(--text-light, #8993a8); }
.legal-contacts b { flex: 1; min-width: 0; font-weight: 700; word-break: break-all; }

.legal-foot-nav { display: flex; flex-wrap: wrap; gap: 10px; margin: 34px 0 0; padding-top: 20px; border-top: 1px solid var(--line, #e8ecf5); }
.legal-foot-nav a { padding: 9px 14px; border: 1px solid var(--line, #e8ecf5); border-radius: 9px; background: #fff; color: var(--primary, #1e5eff); font-size: 13px; font-weight: 700; text-decoration: none; }
.legal-foot-nav a:hover { border-color: var(--primary, #1e5eff); }

/* ---------- 页脚 ---------- */
.legal-footer { margin-top: 30px; padding: 26px 0 34px; border-top: 1px solid var(--line, #e8ecf5); background: #fff; }
.legal-footer p { margin: 0; color: var(--text-light, #8993a8); font-size: 12px; line-height: 1.9; text-align: center; }

/* ---------- H5 ---------- */
.legal-page-h5 { background: var(--canvas, #f5f7fa); }
.legal-page-h5 .legal-h5-back { color: var(--muted, #657187); font-size: 22px; font-weight: 700; text-decoration: none; }
.legal-h5-main { padding-top: 18px; padding-bottom: 34px; }
.legal-page-h5 .legal-eyebrow { font-size: 11px; }
.legal-page-h5 h1.legal-h5-title { margin: 8px 0 0; font-size: 24px; }
.legal-page-h5 .legal-summary { padding: 12px 13px; font-size: 13px; line-height: 1.75; }
.legal-page-h5 .legal-section { margin-top: 22px; padding: 14px; border: 1px solid var(--line, #e3e7ef); border-radius: 10px; background: #fff; }
.legal-page-h5 .legal-section h2 { margin-bottom: 8px; font-size: 15px; }
.legal-page-h5 .legal-section p { font-size: 13px; line-height: 1.85; }
.legal-page-h5 .legal-list { padding-left: 18px; }
.legal-page-h5 .legal-list li { font-size: 13px; line-height: 1.85; }
.legal-page-h5 .legal-contacts li { font-size: 13px; }
.legal-page-h5 .legal-contacts span { flex: 0 0 78px; }
.legal-h5-switch { margin-top: 26px; }
.legal-h5-switch .h5-list-row { color: inherit; text-decoration: none; }
.legal-footer-note { margin: 24px 0 0; color: var(--muted, #657187); font-size: 11.5px; line-height: 1.9; text-align: center; }

@media (max-width: 720px) {
  .legal-topbar-inner { flex-wrap: wrap; gap: 10px; padding: 10px 0; }
  .legal-nav { order: 3; flex-basis: 100%; }
  .legal-back { margin-left: auto; }
  .legal-main { padding: 26px 24px 12px; }
  .legal-page h1 { font-size: 24px; }
}