.page-disclaimer {
  --doc-body: rgba(244, 247, 251, 0.82);
  --doc-accent: var(--orange);
  color: var(--ice);
}

.page-disclaimer .container {
  padding-left: 20px;
  padding-right: 20px;
}

.page-disclaimer .breadcrumb ol {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin: 0 0 22px;
  padding: 0;
  list-style: none;
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.06em;
  color: var(--steel);
}

.page-disclaimer .breadcrumb li + li::before {
  content: "/";
  margin-right: 6px;
  color: rgba(124, 139, 161, 0.6);
}

.page-disclaimer .breadcrumb a {
  color: var(--steel);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: color 180ms var(--ease), border-color 180ms var(--ease);
}

.page-disclaimer .breadcrumb a:hover,
.page-disclaimer .breadcrumb a:focus-visible {
  color: var(--cyan);
  border-bottom-color: var(--cyan);
}

/* ---------- 首屏 ---------- */

.page-disclaimer .doc-hero {
  position: relative;
  padding: 26px 0 38px;
}

.page-disclaimer .doc-hero::before {
  content: "";
  position: absolute;
  inset: 60px 0 0;
  background:
    linear-gradient(138deg, rgba(255, 106, 26, 0.2) 0%, rgba(22, 48, 90, 0.55) 42%, rgba(11, 27, 51, 0) 72%);
  clip-path: polygon(0 0, 100% 0, 100% 46%, 0 86%);
  border-radius: var(--radius-organic);
  pointer-events: none;
  z-index: 0;
}

.page-disclaimer .doc-hero__grid,
.page-disclaimer .doc-hero .breadcrumb {
  position: relative;
  z-index: 1;
}

.page-disclaimer .doc-hero__grid {
  display: grid;
  gap: 28px;
}

.page-disclaimer .eyebrow {
  margin: 0 0 14px;
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.14em;
  color: var(--peach);
}

.page-disclaimer .doc-hero__title {
  margin: 0 0 16px;
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(30px, 7vw, 52px);
  line-height: 1.12;
  letter-spacing: -0.02em;
  color: var(--ice);
}

.page-disclaimer .doc-hero__lead {
  margin: 0;
  max-width: 42em;
  font-size: 15px;
  line-height: 1.78;
  color: var(--doc-body);
}

.page-disclaimer .doc-hero__meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin: 24px 0 0;
  padding: 0;
  list-style: none;
}

.page-disclaimer .doc-hero__meta li {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding-left: 12px;
  border-left: 2px solid rgba(255, 106, 26, 0.55);
}

.page-disclaimer .doc-hero__num {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-size: 20px;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--orange);
}

.page-disclaimer .doc-hero__label {
  font-size: 12px;
  line-height: 1.5;
  color: var(--steel);
}

.page-disclaimer .doc-hero__media {
  margin: 0;
}

/* ---------- 章节骨架 ---------- */

.page-disclaimer .doc-section {
  padding: 34px 0;
  border-top: 1px solid var(--line);
}

.page-disclaimer .doc-section__head {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 20px;
  padding-left: 14px;
  border-left: 2px solid var(--orange);
}

.page-disclaimer .doc-section__head--data {
  border-left-color: var(--cyan);
}

.page-disclaimer .doc-section__idx {
  flex: 0 0 auto;
  margin: 3px 0 0;
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.14em;
  color: var(--orange);
}

.page-disclaimer .doc-section__head--data .doc-section__idx {
  color: var(--cyan);
}

.page-disclaimer .doc-section__title {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 21px;
  line-height: 1.34;
  letter-spacing: -0.01em;
  color: var(--ice);
}

/* ---------- 条目列表 ---------- */

.page-disclaimer .doc-list {
  display: grid;
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.page-disclaimer .doc-list li {
  position: relative;
  padding-left: 18px;
  font-size: 15px;
  line-height: 1.78;
  color: var(--doc-body);
}

.page-disclaimer .doc-list li::before {
  content: "";
  position: absolute;
  left: 1px;
  top: 0.74em;
  width: 6px;
  height: 6px;
  background: var(--orange);
  border-radius: 1px;
  transform: rotate(45deg);
}

.page-disclaimer .doc-list--data li::before {
  background: var(--cyan);
}

.page-disclaimer .doc-list strong {
  display: block;
  margin-bottom: 2px;
  font-weight: 700;
  color: var(--ice);
}

.page-disclaimer .doc-list--after {
  margin-top: 20px;
}

.page-disclaimer .doc-link {
  color: var(--cyan);
  text-decoration: none;
  border-bottom: 1px solid rgba(43, 232, 176, 0.45);
  transition: color 180ms var(--ease), border-color 180ms var(--ease);
}

.page-disclaimer .doc-link:hover,
.page-disclaimer .doc-link:focus-visible {
  color: var(--ice);
  border-bottom-color: var(--ice);
}

.page-disclaimer .doc-end {
  width: 64px;
  height: 2px;
  margin-top: 24px;
  border-radius: 2px;
  background: linear-gradient(90deg, var(--orange), rgba(255, 106, 26, 0));
}

/* ---------- 时间刻度 ---------- */

.page-disclaimer .refresh-scale {
  margin-top: 26px;
  padding: 20px 18px 22px;
  background: linear-gradient(155deg, var(--panel) 0%, rgba(22, 48, 90, 0.45) 100%);
  border-radius: var(--radius-organic);
  border: 1px solid var(--line);
}

.page-disclaimer .refresh-scale__title {
  margin: 0 0 14px;
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.14em;
  color: var(--steel);
}

.page-disclaimer .refresh-scale__track {
  height: 6px;
  border-radius: var(--radius-pill);
  background: linear-gradient(90deg, var(--teal) 0%, var(--cyan) 52%, var(--orange) 100%);
}

.page-disclaimer .refresh-scale__ticks {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
}

.page-disclaimer .refresh-scale__ticks li {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.page-disclaimer .refresh-scale__num {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-size: 16px;
  font-weight: 600;
  color: var(--cyan);
}

.page-disclaimer .refresh-scale__ticks li:nth-child(3) .refresh-scale__num,
.page-disclaimer .refresh-scale__ticks li:nth-child(4) .refresh-scale__num {
  color: var(--orange);
}

.page-disclaimer .refresh-scale__desc {
  font-size: 12px;
  line-height: 1.5;
  color: var(--steel);
}

/* ---------- 规格条目 ---------- */

.page-disclaimer .doc-specs {
  margin: 0;
  padding: 0;
}

.page-disclaimer .doc-specs > div {
  display: grid;
  gap: 4px;
  padding: 14px 0;
  border-bottom: 1px dashed var(--line);
}

.page-disclaimer .doc-specs > div:first-child {
  padding-top: 0;
}

.page-disclaimer .doc-specs > div:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.page-disclaimer .doc-specs dt {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.12em;
  color: var(--peach);
}

.page-disclaimer .doc-specs dd {
  margin: 0;
  font-size: 15px;
  line-height: 1.76;
  color: var(--doc-body);
}

/* ---------- 折叠清单 ---------- */

.page-disclaimer .doc-details {
  margin-top: 22px;
  background: rgba(22, 48, 90, 0.5);
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-organic-alt);
  transition: background-color 200ms var(--ease), border-color 200ms var(--ease);
}

.page-disclaimer .doc-details:hover {
  background: rgba(22, 48, 90, 0.72);
  border-color: rgba(43, 232, 176, 0.4);
}

.page-disclaimer .doc-details > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 15px 18px;
  font-size: 15px;
  font-weight: 600;
  color: var(--ice);
  cursor: pointer;
  list-style: none;
}

.page-disclaimer .doc-details > summary::-webkit-details-marker {
  display: none;
}

.page-disclaimer .doc-details > summary::after {
  content: "+";
  flex: 0 0 auto;
  font-family: var(--font-mono);
  font-size: 18px;
  line-height: 1;
  color: var(--orange);
}

.page-disclaimer .doc-details[open] > summary::after {
  content: "\2212";
  color: var(--cyan);
}

.page-disclaimer .doc-details__body {
  padding: 0 18px 18px;
}

.page-disclaimer .doc-details__list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 10px;
}

.page-disclaimer .doc-details__list li {
  position: relative;
  padding-left: 16px;
  font-size: 14px;
  line-height: 1.72;
  color: var(--doc-body);
}

.page-disclaimer .doc-details__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.72em;
  width: 8px;
  height: 1px;
  background: var(--cyan);
}

.page-disclaimer .doc-details__note {
  margin: 14px 0 0;
  padding-top: 12px;
  border-top: 1px solid var(--line);
  font-size: 13px;
  line-height: 1.7;
  color: var(--steel);
}

/* ---------- 收束带 ---------- */

.page-disclaimer .doc-closing {
  position: relative;
  margin: 10px 0 52px;
  padding: 28px 20px;
  overflow: hidden;
  background: linear-gradient(142deg, var(--ink) 0%, var(--field) 52%, var(--panel) 100%);
  border: 1px solid var(--line);
  border-radius: var(--radius-organic);
}

.page-disclaimer .doc-closing::after {
  content: "";
  position: absolute;
  top: -40%;
  right: -18%;
  width: 62%;
  height: 180%;
  background: linear-gradient(120deg, rgba(255, 106, 26, 0.32), rgba(43, 232, 176, 0.14) 60%, transparent 82%);
  transform: rotate(6deg);
  pointer-events: none;
}

.page-disclaimer .doc-closing__grid {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 22px;
}

.page-disclaimer .doc-closing__eyebrow {
  margin: 0 0 10px;
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.14em;
  color: var(--cyan);
}

.page-disclaimer .doc-closing__title {
  margin: 0 0 10px;
  font-family: var(--font-display);
  font-weight: 900;
  font-size: 24px;
  line-height: 1.24;
  letter-spacing: -0.01em;
  color: var(--ice);
}

.page-disclaimer .doc-closing__text {
  margin: 0;
  max-width: 44em;
  font-size: 14px;
  line-height: 1.78;
  color: rgba(244, 247, 251, 0.78);
}

.page-disclaimer .doc-closing__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
}

.page-disclaimer .doc-closing__actions .btn {
  flex: 0 1 auto;
}

.page-disclaimer .doc-top-link {
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.08em;
  color: var(--steel);
  text-decoration: none;
  border-bottom: 1px solid var(--line-strong);
  padding-bottom: 2px;
  transition: color 180ms var(--ease), border-color 180ms var(--ease);
}

.page-disclaimer .doc-top-link:hover,
.page-disclaimer .doc-top-link:focus-visible {
  color: var(--cyan);
  border-bottom-color: var(--cyan);
}

/* ---------- 响应式 ---------- */

@media (min-width: 640px) {
  .page-disclaimer .container {
    padding-left: 32px;
    padding-right: 32px;
  }

  .page-disclaimer .doc-section__title {
    font-size: 23px;
  }

  .page-disclaimer .doc-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px 30px;
  }

  .page-disclaimer .doc-list--single {
    grid-template-columns: minmax(0, 1fr);
  }

  .page-disclaimer .refresh-scale {
    padding: 24px 22px 26px;
  }

  .page-disclaimer .refresh-scale__ticks {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .page-disclaimer .doc-closing {
    padding: 34px 30px;
  }

  .page-disclaimer .doc-closing__title {
    font-size: 28px;
  }
}

@media (min-width: 900px) {
  .page-disclaimer .doc-hero {
    padding: 34px 0 50px;
  }

  .page-disclaimer .doc-hero__grid {
    grid-template-columns: 7fr 5fr;
    align-items: start;
    gap: 44px;
  }

  .page-disclaimer .doc-hero__lead {
    font-size: 16px;
  }

  .page-disclaimer .doc-hero__meta {
    max-width: 460px;
    gap: 20px;
  }

  .page-disclaimer .doc-hero__num {
    font-size: 24px;
  }

  .page-disclaimer .doc-section {
    padding: 46px 0;
  }

  .page-disclaimer .doc-section__head {
    gap: 16px;
    margin-bottom: 24px;
    padding-left: 18px;
  }

  .page-disclaimer .doc-section__title {
    font-size: 26px;
  }

  .page-disclaimer .doc-list {
    gap: 20px 40px;
  }

  .page-disclaimer .doc-specs > div {
    grid-template-columns: 170px minmax(0, 1fr);
    gap: 20px;
    align-items: baseline;
    padding: 16px 0;
  }

  .page-disclaimer .refresh-scale {
    display: grid;
    grid-template-columns: 160px minmax(0, 1fr);
    grid-template-areas:
      "title track"
      "title ticks";
    column-gap: 28px;
    align-items: center;
    padding: 26px 28px;
  }

  .page-disclaimer .refresh-scale__title {
    grid-area: title;
    margin: 0;
    line-height: 1.6;
  }

  .page-disclaimer .refresh-scale__track {
    grid-area: track;
  }

  .page-disclaimer .refresh-scale__ticks {
    grid-area: ticks;
    margin-top: 18px;
  }

  .page-disclaimer .doc-details > summary {
    padding: 17px 22px;
    font-size: 16px;
  }

  .page-disclaimer .doc-details__body {
    padding: 0 22px 20px;
  }

  .page-disclaimer .doc-closing {
    margin-bottom: 64px;
    padding: 42px 40px;
  }

  .page-disclaimer .doc-closing__grid {
    grid-template-columns: 8fr 4fr;
    align-items: center;
    gap: 36px;
  }

  .page-disclaimer .doc-closing__actions {
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
  }

  .page-disclaimer .doc-closing__actions .btn {
    width: 100%;
    justify-content: center;
    text-align: center;
  }
}
<<<END>>>

Sorry, I need to remove the trailing <<<END>>> marker — only the two required markers are allowed. Corrected output below.


<main id="main-content" class="page-disclaimer">
  <div class="container">

    <section class="doc-hero" id="doc-top" data-reveal>
      <nav class="breadcrumb" aria-label="面包屑">
        <ol>
          <li><a href="/">首页</a></li>
          <li aria-current="page">使用说明</li>
        </ol>
      </nav>

      <div class="doc-hero__grid">
        <div class="doc-hero__copy">
          <p class="eyebrow">DOC / 使用须知</p>
          <h1 class="doc-hero__title">先看清怎么读，再用得顺手</h1>
          <p class="doc-hero__lead">
            华体会体育把赛前前瞻、两场对照和联赛排名整理成可读的页面，帮您在开赛前把对阵背景、赛程排布和位次变化一次看明白。下面这份说明讲清这些信息适合用在什么场合、客户端要满足哪些条件、遇到偏差时该找谁。
          </p>
          <ul class="doc-hero__meta">
            <li>
              <span class="doc-hero__num">4.8.2</span>
              <span class="doc-hero__label">当前稳定版</span>
            </li>
            <li>
              <span class="doc-hero__num">30s</span>
              <span class="doc-hero__label">排名刷新间隔</span>
            </li>
            <li>
              <span class="doc-hero__num">6h</span>
              <span class="doc-hero__label">纠错平均处理</span>
            </li>
          </ul>
        </div>

        <figure class="media-frame media-frame--wide media-frame--tilt doc-hero__media">
          <img class="media-frame__img" src="{zhanqunpic:h:600w:1200}" width="1200" height="600" alt="由平行线条与方形框架构成的抽象图形，深蓝底色上叠着橙色刻度">
          <figcaption class="media-frame__caption">刻度、顺序与阅读方式，先在这里对齐</figcaption>
        </figure>
      </div>
    </section>

    <section class="doc-section" id="scope" data-reveal>
      <header class="doc-section__head">
        <p class="doc-section__idx">01</p>
        <h2 class="doc-section__title">前瞻与对照，读的是背景不是结论</h2>
      </header>
      <ul class="doc-list">
        <li>
          <strong>信息整理，供阅读参考。</strong>赛前分栏里的对阵背景、近期走势与关键项对比，都来自公开赛事信息的整理，不构成投注、投资或其他形式的建议与承诺。
        </li>
        <li>
          <strong>26 项对照指标，用来看差异。</strong>两场比赛并排摆在同一屏，逐项拉开差距，方便您判断风格与节奏的差别；对照结果不作为赛果预测。
        </li>
        <li>
          <strong>排名快照停在某个刷新时刻。</strong>面板上的积分与名次顺序对应最近一次刷新，赛后积分调整会带来位次变化，刷新后的数字才是当下的顺序。
        </li>
        <li>
          <strong>赛前 24–48 小时最合用。</strong>周末赛程排布、开赛时间与联赛背景，是这套内容最擅长的部分，赛前集中查阅效率最高。
        </li>
        <li>
          <strong>单个联赛展示前 20 名。</strong>想看更靠后的队伍，需要等赛季推进后位次发生变化，再看新一轮快照。
        </li>
      </ul>
      <div class="doc-end"></div>
    </section>

    <section class="doc-section" id="sources" data-reveal>
      <header class="doc-section__head doc-section__head--data">
        <p class="doc-section__idx">02</p>
        <h2 class="doc-section__title">数据从哪来，多久更新一次</h2>
      </header>
      <ul class="doc-list doc-list--data">
        <li>
          <strong>长期合作加公开信息交叉验证。</strong>赛事数据由 12 家合作机构长期供给，同时与公开赛事记录比对，出现分歧时以可查证的赛事记录为准。
        </li>
        <li>
          <strong>发布前过三遍手。</strong>每条前瞻平均经过 3 次校验才上线；18 名赛事数据编辑按 7×12 小时轮值，覆盖周末的密集赛程。
        </li>
        <li>
          <strong>排名面板 30 秒刷新。</strong>面板上同步标注最近一次更新时间，您看到的数字与时间戳始终成对出现。
        </li>
        <li>
          <strong>快照按周推进。</strong>赛季期间每周更新三次联赛排名快照，每个比赛周固定做两场焦点赛事的对照页。
        </li>
        <li>
          <strong>版本与数据各走各的节奏。</strong>每 6 周一次功能迭代，每 2 周做一次数据复校，功能与数字互不拖累。
        </li>
      </ul>

      <div class="refresh-scale">
        <p class="refresh-scale__title">关键时间刻度</p>
        <div class="refresh-scale__track" aria-hidden="true"></div>
        <ul class="refresh-scale__ticks">
          <li>
            <span class="refresh-scale__num">30s</span>
            <span class="refresh-scale__desc">积分与名次刷新</span>
          </li>
          <li>
            <span class="refresh-scale__num">2周</span>
            <span class="refresh-scale__desc">数据复校一次</span>
          </li>
          <li>
            <span class="refresh-scale__num">6周</span>
            <span class="refresh-scale__desc">客户端功能迭代</span>
          </li>
          <li>
            <span class="refresh-scale__num">3次</span>
            <span class="refresh-scale__desc">单条前瞻校验</span>
          </li>
        </ul>
      </div>
      <div class="doc-end"></div>
    </section>

    <section class="doc-section" id="client" data-reveal>
      <header class="doc-section__head">
        <p class="doc-section__idx">03</p>
        <h2 class="doc-section__title">装客户端之前，先对一下这几项</h2>
      </header>
      <dl class="doc-specs">
        <div>
          <dt>版本与体积</dt>
          <dd>稳定版版本号 4.8.2，安装包约 46 MB；另有极速版与桌面版两个通道，日常使用推荐稳定版。</dd>
        </div>
        <div>
          <dt>系统要求</dt>
          <dd>Android 8.0 及以上、iOS 14 及以上可正常安装运行，低于该版本的系统无法完成安装。</dd>
        </div>
        <div>
          <dt>网络条件</dt>
          <dd>排名面板依赖稳定网络持续刷新；弱网时先显示最近一次更新时间，网络恢复后自动接上最新数字。</dd>
        </div>
        <div>
          <dt>存储与权限</dt>
          <dd>建议预留 200 MB 以上可用空间，升级安装时无需卸载旧版；消息通知权限按需开启，关闭后不影响数据查看。</dd>
        </div>
        <div>
          <dt>账号与设备绑定</dt>
          <dd>一个账号对应一名使用者与一台常用设备。更换设备时，先在新设备完成登录，再结束旧设备的会话，避免两处同时挂线。</dd>
        </div>
        <div>
          <dt>安装细节</dt>
          <dd>五步下载图解与常见报错处理在<a class="doc-link" href="/help/">帮助中心</a>；想先看全部通道，可到<a class="doc-link" href="/app-download/">客户端下载</a>页对照选择。</dd>
        </div>
      </dl>
      <div class="doc-end"></div>
    </section>

    <section class="doc-section" id="account" data-reveal>
      <header class="doc-section__head">
        <p class="doc-section__idx">04</p>
        <h2 class="doc-section__title">账号与设备，出了状况按这个顺序处理</h2>
      </header>
      <ul class="doc-list">
        <li>
          <strong>账号仅限本人使用。</strong>把账号转借他人后产生的阅读记录与设置变更，由账号持有人自行承担。
        </li>
        <li>
          <strong>发现异常登录，三步走。</strong>先修改登录密码，再结束其他设备的会话，随后通过<a class="doc-link" href="/reach-us/">服务联络</a>告知客服具体现象。
        </li>
        <li>
          <strong>设备丢失，先断后登。</strong>在任意可用设备上结束全部会话，再用新设备重新登录，旧设备上的登录状态会立即失效。
        </li>
        <li>
          <strong>公共设备用完就退。</strong>网吧、借用的手机上请不要勾选记住密码，离开前手动退出登录。
        </li>
        <li>
          <strong>密码不要重复使用。</strong>与其他网站相同的密码一旦外泄，风险会叠加到本账号，建议单独设置。
        </li>
      </ul>
      <div class="doc-end"></div>
    </section>

    <section class="doc-section" id="third-party" data-reveal>
      <header class="doc-section__head">
        <p class="doc-section__idx">05</p>
        <h2 class="doc-section__title">页面里的外部链接，由对方负责</h2>
      </header>
      <ul class="doc-list doc-list--single">
        <li>
          <strong>链接指向哪里，点开前先确认。</strong>站内可能出现指向合作机构或其他站点的链接，这些页面的内容、可用性与信息使用规则由对方负责，华体会体育不对其内容作担保。
        </li>
        <li>
          <strong>信息处理各按各的说明。</strong>在对方站点的操作适用其自身的规则；关于我们如何处理您的信息，可查阅<a class="doc-link" href="/privacy-notice/">隐私声明</a>。
        </li>
        <li>
          <strong>索要密码的一律拒绝。</strong>以本站名义索取登录密码或验证码的情形，请直接拒绝，并通过客服渠道核实。
        </li>
      </ul>
      <div class="doc-end"></div>
    </section>

    <section class="doc-section" id="correction" data-reveal>
      <header class="doc-section__head">
        <p class="doc-section__idx">06</p>
        <h2 class="doc-section__title">发现数字或文字有出入，这样告诉我们</h2>
      </header>
      <ul class="doc-list">
        <li>
          <strong>纠错入口 2023 年上线。</strong>读者反馈平均 6 小时内得到处理，赛季日处理更快。
        </li>
        <li>
          <strong>写清四件事，一次就能定位。</strong>哪一页、哪一行、您看到的正确信息及其来源，有截图更方便。
        </li>
        <li>
          <strong>按联赛与场次指路最快。</strong>说明联赛类别与 A 场／B 场，比描述“那条数据”更容易被找到。
        </li>
      </ul>

      <details class="doc-details">
        <summary>展开：提交纠错时建议附上的要素</summary>
        <div class="doc-details__body">
          <ul class="doc-details__list">
            <li>页面名称或所在栏目，例如赛事前瞻的某个联赛分栏。</li>
            <li>具体条目：对照页请注明 A 场／B 场与指标名称，排名页请注明联赛与位次。</li>
            <li>您认为正确的数值、文字，以及能支撑它的赛事记录出处。</li>
            <li>截图或页面地址，便于确认刷新前后的差异。</li>
            <li>您的联系方式，方便处理后回告结果。</li>
          </ul>
          <p class="doc-details__note">提交入口在<a class="doc-link" href="/reach-us/">服务联络</a>，邮件与专线均可；邮件咨询在 1 个工作日内回复。</p>
        </div>
      </details>

      <ul class="doc-list doc-list--single doc-list--after">
        <li>
          <strong>条款更新会先打招呼。</strong>本说明修订后，页面顶部会标注新的版本标记；涉及使用方式的调整，会在站内显著位置提示，更新后继续使用即视为接受调整后的内容。
        </li>
        <li>
          <strong>操作层面的疑问去帮助中心。</strong>68 篇图文教程覆盖安装、登录、排名查看与故障排查，多数问题可以自己走完。
        </li>
      </ul>
      <div class="doc-end"></div>
    </section>

    <section class="doc-closing" data-reveal>
      <div class="doc-closing__grid">
        <div>
          <p class="doc-closing__eyebrow">STILL STUCK / 还没解决</p>
          <h2 class="doc-closing__title">查不到，就直接问</h2>
          <p class="doc-closing__text">
            操作卡在某一步，去帮助中心按步骤排查；涉及账号、数据出入或合作事项，走服务联络，专线工作日 9:00–18:00 有人接，邮件 1 个工作日内回复。
          </p>
        </div>
        <div class="doc-closing__actions">
          <a class="btn btn--primary" href="/help/">查看帮助中心</a>
          <a class="btn btn--ghost" href="/reach-us/">联系服务人员</a>
          <a class="doc-top-link" href="#doc-top">回到顶部</a>
        </div>
      </div>
    </section>

  </div>
</main>

.page-disclaimer {
  --doc-body: rgba(244, 247, 251, 0.82);
  color: var(--ice);
}

.page-disclaimer .container {
  padding-left: 20px;
  padding-right: 20px;
}

.page-disclaimer .breadcrumb ol {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin: 0 0 22px;
  padding: 0;
  list-style: none;
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.06em;
  color: var(--steel);
}

.page-disclaimer .breadcrumb li + li::before {
  content: "/";
  margin-right: 6px;
  color: rgba(124, 139, 161, 0.6);
}

.page-disclaimer .breadcrumb a {
  color: var(--steel);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: color 180ms var(--ease), border-color 180ms var(--ease);
}

.page-disclaimer .breadcrumb a:hover,
.page-disclaimer .breadcrumb a:focus-visible {
  color: var(--cyan);
  border-bottom-color: var(--cyan);
}

.page-disclaimer .doc-hero {
  position: relative;
  padding: 26px 0 38px;
}

.page-disclaimer .doc-hero::before {
  content: "";
  position: absolute;
  inset: 60px 0 0;
  background: linear-gradient(138deg, rgba(255, 106, 26, 0.2) 0%, rgba(22, 48, 90, 0.55) 42%, rgba(11, 27, 51, 0) 72%);
  clip-path: polygon(0 0, 100% 0, 100% 46%, 0 86%);
  border-radius: var(--radius-organic);
  pointer-events: none;
  z-index: 0;
}

.page-disclaimer .doc-hero__grid,
.page-disclaimer .doc-hero .breadcrumb {
  position: relative;
  z-index: 1;
}

.page-disclaimer .doc-hero__grid {
  display: grid;
  gap: 28px;
}

.page-disclaimer .eyebrow {
  margin: 0 0 14px;
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.14em;
  color: var(--peach);
}

.page-disclaimer .doc-hero__title {
  margin: 0 0 16px;
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(30px, 7vw, 52px);
  line-height: 1.12;
  letter-spacing: -0.02em;
  color: var(--ice);
}

.page-disclaimer .doc-hero__lead {
  margin: 0;
  max-width: 42em;
  font-size: 15px;
  line-height: 1.78;
  color: var(--doc-body);
}

.page-disclaimer .doc-hero__meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin: 24px 0 0;
  padding: 0;
  list-style: none;
}

.page-disclaimer .doc-hero__meta li {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding-left: 12px;
  border-left: 2px solid rgba(255, 106, 26, 0.55);
}

.page-disclaimer .doc-hero__num {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-size: 20px;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--orange);
}

.page-disclaimer .doc-hero__label {
  font-size: 12px;
  line-height: 1.5;
  color: var(--steel);
}

.page-disclaimer .doc-hero__media {
  margin: 0;
}

.page-disclaimer .doc-section {
  padding: 34px 0;
  border-top: 1px solid var(--line);
}

.page-disclaimer .doc-section__head {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 20px;
  padding-left: 14px;
  border-left: 2px solid var(--orange);
}

.page-disclaimer .doc-section__head--data {
  border-left-color: var(--cyan);
}

.page-disclaimer .doc-section__idx {
  flex: 0 0 auto;
  margin: 3px 0 0;
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.14em;
  color: var(--orange);
}

.page-disclaimer .doc-section__head--data .doc-section__idx {
  color: var(--cyan);
}

.page-disclaimer .doc-section__title {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 21px;
  line-height: 1.34;
  letter-spacing: -0.01em;
  color: var(--ice);
}

.page-disclaimer .doc-list {
  display: grid;
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.page-disclaimer .doc-list li {
  position: relative;
  padding-left: 18px;
  font-size: 15px;
  line-height: 1.78;
  color: var(--doc-body);
}

.page-disclaimer .doc-list li::before {
  content: "";
  position: absolute;
  left: 1px;
  top: 0.74em;
  width: 6px;
  height: 6px;
  background: var(--orange);
  border-radius: 1px;
  transform: rotate(45deg);
}

.page-disclaimer .doc-list--data li::before {
  background: var(--cyan);
}

.page-disclaimer .doc-list strong {
  display: block;
  margin-bottom: 2px;
  font-weight: 700;
  color: var(--ice);
}

.page-disclaimer .doc-list--after {
  margin-top: 20px;
}

.page-disclaimer .doc-link {
  color: var(--cyan);
  text-decoration: none;
  border-bottom: 1px solid rgba(43, 232, 176, 0.45);
  transition: color 180ms var(--ease), border-color 180ms var(--ease);
}

.page-disclaimer .doc-link:hover,
.page-disclaimer .doc-link:focus-visible {
  color: var(--ice);
  border-bottom-color: var(--ice);
}

.page-disclaimer .doc-end {
  width: 64px;
  height: 2px;
  margin-top: 24px;
  border-radius: 2px;
  background: linear-gradient(90deg, var(--orange), rgba(255, 106, 26, 0));
}

.page-disclaimer .refresh-scale {
  margin-top: 26px;
  padding: 20px 18px 22px;
  background: linear-gradient(155deg, var(--panel) 0%, rgba(22, 48, 90, 0.45) 100%);
  border-radius: var(--radius-organic);
  border: 1px solid var(--line);
}

.page-disclaimer .refresh-scale__title {
  margin: 0 0 14px;
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.14em;
  color: var(--steel);
}

.page-disclaimer .refresh-scale__track {
  height: 6px;
  border-radius: var(--radius-pill);
  background: linear-gradient(90deg, var(--teal) 0%, var(--cyan) 52%, var(--orange) 100%);
}

.page-disclaimer .refresh-scale__ticks {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
}

.page-disclaimer .refresh-scale__ticks li {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.page-disclaimer .refresh-scale__num {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-size: 16px;
  font-weight: 600;
  color: var(--cyan);
}

.page-disclaimer .refresh-scale__ticks li:nth-child(3) .refresh-scale__num,
.page-disclaimer .refresh-scale__ticks li:nth-child(4) .refresh-scale__num {
  color: var(--orange);
}

.page-disclaimer .refresh-scale__desc {
  font-size: 12px;
  line-height: 1.5;
  color: var(--steel);
}

.page-disclaimer .doc-specs {
  margin: 0;
  padding: 0;
}

.page-disclaimer .doc-specs > div {
  display: grid;
  gap: 4px;
  padding: 14px 0;
  border-bottom: 1px dashed var(--line);
}

.page-disclaimer .doc-specs > div:first-child {
  padding-top: 0;
}

.page-disclaimer .doc-specs > div:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.page-disclaimer .doc-specs dt {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.12em;
  color: var(--peach);
}

.page-disclaimer .doc-specs dd {
  margin: 0;
  font-size: 15px;
  line-height: 1.76;
  color: var(--doc-body);
}

.page-disclaimer .doc-details {
  margin-top: 22px;
  background: rgba(22, 48, 90, 0.5);
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-organic-alt);
  transition: background-color 200ms var(--ease), border-color 200ms var(--ease);
}

.page-disclaimer .doc-details:hover {
  background: rgba(22, 48, 90, 0.72);
  border-color: rgba(43, 232, 176, 0.4);
}

.page-disclaimer .doc-details > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 15px 18px;
  font-size: 15px;
  font-weight: 600;
  color: var(--ice);
  cursor: pointer;
  list-style: none;
}

.page-disclaimer .doc-details > summary::-webkit-details-marker {
  display: none;
}

.page-disclaimer .doc-details > summary::after {
  content: "+";
  flex: 0 0 auto;
  font-family: var(--font-mono);
  font-size: 18px;
  line-height: 1;
  color: var(--orange);
}

.page-disclaimer .doc-details[open] > summary::after {
  content: "\2212";
  color: var(--cyan);
}

.page-disclaimer .doc-details__body {
  padding: 0 18px 18px;
}

.page-disclaimer .doc-details__list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 10px;
}

.page-disclaimer .doc-details__list li {
  position: relative;
  padding-left: 16px;
  font-size: 14px;
  line-height: 1.72;
  color: var(--doc-body);
}

.page-disclaimer .doc-details__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.72em;
  width: 8px;
  height: 1px;
  background: var(--cyan);
}

.page-disclaimer .doc-details__note {
  margin: 14px 0 0;
  padding-top: 12px;
  border-top: 1px solid var(--line);
  font-size: 13px;
  line-height: 1.7;
  color: var(--steel);
}

.page-disclaimer .doc-closing {
  position: relative;
  margin: 10px 0 52px;
  padding: 28px 20px;
  overflow: hidden;
  background: linear-gradient(142deg, var(--ink) 0%, var(--field) 52%, var(--panel) 100%);
  border: 1px solid var(--line);
  border-radius: var(--radius-organic);
}

.page-disclaimer .doc-closing::after {
  content: "";
  position: absolute;
  top: -40%;
  right: -18%;
  width: 62%;
  height: 180%;
  background: linear-gradient(120deg, rgba(255, 106, 26, 0.32), rgba(43, 232, 176, 0.14) 60%, transparent 82%);
  transform: rotate(6deg);
  pointer-events: none;
}

.page-disclaimer .doc-closing__grid {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 22px;
}

.page-disclaimer .doc-closing__eyebrow {
  margin: 0 0 10px;
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.14em;
  color: var(--cyan);
}

.page-disclaimer .doc-closing__title {
  margin: 0 0 10px;
  font-family: var(--font-display);
  font-weight: 900;
  font-size: 24px;
  line-height: 1.24;
  letter-spacing: -0.01em;
  color: var(--ice);
}

.page-disclaimer .doc-closing__text {
  margin: 0;
  max-width: 44em;
  font-size: 14px;
  line-height: 1.78;
  color: rgba(244, 247, 251, 0.78);
}

.page-disclaimer .doc-closing__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
}

.page-disclaimer .doc-closing__actions .btn {
  flex: 0 1 auto;
}

.page-disclaimer .doc-top-link {
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.08em;
  color: var(--steel);
  text-decoration: none;
  border-bottom: 1px solid var(--line-strong);
  padding-bottom: 2px;
  transition: color 180ms var(--ease), border-color 180ms var(--ease);
}

.page-disclaimer .doc-top-link:hover,
.page-disclaimer .doc-top-link:focus-visible {
  color: var(--cyan);
  border-bottom-color: var(--cyan);
}

@media (min-width: 640px) {
  .page-disclaimer .container {
    padding-left: 32px;
    padding-right: 32px;
  }

  .page-disclaimer .doc-section__title {
    font-size: 23px;
  }

  .page-disclaimer .doc-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px 30px;
  }

  .page-disclaimer .doc-list--single {
    grid-template-columns: minmax(0, 1fr);
  }

  .page-disclaimer .refresh-scale {
    padding: 24px 22px 26px;
  }

  .page-disclaimer .refresh-scale__ticks {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .page-disclaimer .doc-closing {
    padding: 34px 30px;
  }

  .page-disclaimer .doc-closing__title {
    font-size: 28px;
  }
}

@media (min-width: 900px) {
  .page-disclaimer .doc-hero {
    padding: 34px 0 50px;
  }

  .page-disclaimer .doc-hero__grid {
    grid-template-columns: 7fr 5fr;
    align-items: start;
    gap: 44px;
  }

  .page-disclaimer .doc-hero__lead {
    font-size: 16px;
  }

  .page-disclaimer .doc-hero__meta {
    max-width: 460px;
    gap: 20px;
  }

  .page-disclaimer .doc-hero__num {
    font-size: 24px;
  }

  .page-disclaimer .doc-section {
    padding: 46px 0;
  }

  .page-disclaimer .doc-section__head {
    gap: 16px;
    margin-bottom: 24px;
    padding-left: 18px;
  }

  .page-disclaimer .doc-section__title {
    font-size: 26px;
  }

  .page-disclaimer .doc-list {
    gap: 20px 40px;
  }

  .page-disclaimer .doc-specs > div {
    grid-template-columns: 170px minmax(0, 1fr);
    gap: 20px;
    align-items: baseline;
    padding: 16px 0;
  }

  .page-disclaimer .refresh-scale {
    display: grid;
    grid-template-columns: 160px minmax(0, 1fr);
    grid-template-areas:
      "title track"
      "title ticks";
    column-gap: 28px;
    align-items: center;
    padding: 26px 28px;
  }

  .page-disclaimer .refresh-scale__title {
    grid-area: title;
    margin: 0;
    line-height: 1.6;
  }

  .page-disclaimer .refresh-scale__track {
    grid-area: track;
  }

  .page-disclaimer .refresh-scale__ticks {
    grid-area: ticks;
    margin-top: 18px;
  }

  .page-disclaimer .doc-details > summary {
    padding: 17px 22px;
    font-size: 16px;
  }

  .page-disclaimer .doc-details__body {
    padding: 0 22px 20px;
  }

  .page-disclaimer .doc-closing {
    margin-bottom: 64px;
    padding: 42px 40px;
  }

  .page-disclaimer .doc-closing__grid {
    grid-template-columns: 8fr 4fr;
    align-items: center;
    gap: 36px;
  }

  .page-disclaimer .doc-closing__actions {
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
  }

  .page-disclaimer .doc-closing__actions .btn {
    width: 100%;
    justify-content: center;
    text-align: center;
  }
}