.page-about {
  --ab-line: #DDE3E8;
  --ab-line-dark: rgba(246, 242, 234, .18);
  --ab-surface: #FFFFFF;
  --ab-text-soft: #3B4856;
  --ab-caption: #5A6875;
  background: var(--ice);
  color: var(--char);
  font-family: var(--font-body);
  line-height: 1.85;
  padding-bottom: 96px;
}

.page-about *,
.page-about *::before,
.page-about *::after { box-sizing: border-box; }

.page-about h1,
.page-about h2,
.page-about h3 {
  font-family: var(--font-display);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: .01em;
  color: var(--ink);
  margin: 0;
}

.page-about p { margin: 0; }
.page-about ol,
.page-about ul { margin: 0; padding: 0; list-style: none; }

.page-about .num {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  letter-spacing: -.01em;
}

.page-about .ab-label {
  display: inline-flex;
  align-items: center;
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--maple);
  border: 1px solid rgba(200, 16, 46, .3);
  border-radius: var(--pill);
  padding: 5px 14px;
  margin: 0 0 20px;
}

.page-about .ab-label--dark {
  color: var(--amber);
  border-color: rgba(224, 164, 59, .42);
}

/* ---------- 首屏 ---------- */
.page-about .ab-hero { padding-top: 44px; }

.page-about .ab-hero h1 {
  font-size: clamp(29px, 6vw, 58px);
  letter-spacing: .004em;
  max-width: 21ch;
  margin-bottom: 24px;
}

.page-about .ab-hero__lead {
  font-size: 16.5px;
  line-height: 1.92;
  color: var(--ab-text-soft);
  max-width: 60ch;
  margin-bottom: 34px;
}

.page-about .ab-hero__stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  background: var(--ab-line);
  border: 1px solid var(--ab-line);
  border-radius: var(--r-lg);
  overflow: hidden;
  margin: 0 0 32px;
}

.page-about .ab-hero__stats > div {
  background: var(--ice);
  padding: 20px 18px;
}

.page-about .ab-hero__stats dt {
  font-family: var(--font-display);
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--steel);
  margin-bottom: 6px;
}

.page-about .ab-hero__stats dd {
  margin: 0;
  font-size: 14px;
  color: var(--ab-text-soft);
}

.page-about .ab-hero__stats dd .num {
  font-size: clamp(22px, 4.6vw, 30px);
  font-weight: 600;
  color: var(--ink);
  margin-right: 5px;
}

.page-about .ab-hero__links {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

/* ---------- 通用图版 ---------- */
.page-about .ab-figure {
  margin: 0 0 40px;
  border-radius: var(--r-xl);
  overflow: hidden;
  border: 1px solid var(--ab-line);
  background: var(--ink-2);
}

.page-about .ab-figure img,
.page-about .ab-map img,
.page-about .ab-verify__fig img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  object-fit: cover;
}

.page-about .ab-figure figcaption,
.page-about .ab-map figcaption {
  font-size: 13px;
  line-height: 1.7;
  color: var(--ab-caption);
  background: var(--ice);
  border-top: 1px solid var(--ab-line);
  padding: 13px 18px 15px;
}

/* ---------- 时间轴 ---------- */
.page-about .ab-timeline { padding-top: 88px; }

.page-about .ab-timeline h2 {
  font-size: clamp(23px, 3.6vw, 40px);
  max-width: 24ch;
  margin-bottom: 36px;
}

.page-about .ab-tl {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}

.page-about .ab-tl__rail { display: none; }

.page-about .ab-tl__list {
  display: grid;
  gap: 18px;
}

.page-about .ab-tl__item {
  position: relative;
  display: grid;
  gap: 6px;
  padding: 24px 22px 26px;
  background: var(--ab-surface);
  border: 1px solid var(--ab-line);
  border-radius: var(--r-lg);
  scroll-margin-top: 120px;
}

.page-about .ab-tl__year {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-size: 30px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: -.02em;
  color: var(--maple);
}

.page-about .ab-tl__kicker {
  font-family: var(--font-display);
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--steel);
}

.page-about .ab-tl__item h3 {
  font-size: 19px;
  margin: 4px 0 4px;
}

.page-about .ab-tl__item p {
  font-size: 15.5px;
  color: var(--ab-text-soft);
  max-width: 58ch;
}

/* ---------- 使用者 ---------- */
.page-about .ab-audience { padding-top: 96px; }

.page-about .ab-audience h2 {
  font-size: clamp(22px, 3.4vw, 38px);
  max-width: 26ch;
  margin-bottom: 38px;
}

.page-about .ab-aud__list {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}

.page-about .ab-aud__list > li {
  display: grid;
  gap: 8px;
  padding: 28px 0;
  border-top: 1px solid var(--ab-line);
}

.page-about .ab-aud__list > li:last-child {
  border-bottom: 1px solid var(--ab-line);
}

.page-about .ab-aud__idx {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-size: 12.5px;
  letter-spacing: .12em;
  color: var(--amber);
}

.page-about .ab-aud__list h3 { font-size: 20px; }

.page-about .ab-aud__list p {
  font-size: 15.5px;
  color: var(--ab-text-soft);
  max-width: 56ch;
}

/* ---------- 来源与复核（深色带） ---------- */
.page-about .ab-verify {
  margin-top: 96px;
  background: var(--ink);
  color: var(--ice);
  padding: 72px 0 76px;
}

.page-about .ab-verify__inner {
  display: grid;
  gap: 40px;
}

.page-about .ab-verify h2 {
  color: var(--ice);
  font-size: clamp(22px, 3.4vw, 38px);
  max-width: 21ch;
  margin-bottom: 20px;
}

.page-about .ab-verify__lead {
  font-size: 15.5px;
  line-height: 1.9;
  color: rgba(246, 242, 234, .78);
  max-width: 52ch;
  margin-bottom: 28px;
}

.page-about .ab-steps { margin: 0 0 26px; }

.page-about .ab-steps li {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
  padding: 15px 0;
  border-top: 1px solid var(--ab-line-dark);
}

.page-about .ab-steps li:last-child {
  border-bottom: 1px solid var(--ab-line-dark);
}

.page-about .ab-steps__n {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-size: 12.5px;
  letter-spacing: .08em;
  color: var(--amber);
  padding-top: 3px;
}

.page-about .ab-steps p {
  font-size: 15.5px;
  line-height: 1.75;
  color: rgba(246, 242, 234, .86);
}

.page-about .ab-verify__foot {
  font-size: 15px;
  color: rgba(246, 242, 234, .72);
}

.page-about .ab-verify__foot a {
  color: var(--amber);
  text-decoration: underline;
  text-underline-offset: 4px;
}

.page-about .ab-verify__fig {
  margin: 0;
  border-radius: var(--r-xl);
  overflow: hidden;
  border: 1px solid var(--ab-line-dark);
  background: var(--ink-2);
}

.page-about .ab-verify__fig figcaption {
  font-size: 13px;
  line-height: 1.7;
  color: rgba(246, 242, 234, .66);
  background: var(--ink-2);
  padding: 13px 18px 15px;
}

/* ---------- 辖区图 + 团队 ---------- */
.page-about .ab-team { padding-top: 96px; }

.page-about .ab-map {
  margin: 0 0 56px;
  border-radius: var(--r-xl);
  overflow: hidden;
  border: 1px solid var(--ab-line);
  background: var(--ink-2);
}

.page-about .ab-team h2 {
  font-size: clamp(22px, 3.4vw, 38px);
  max-width: 22ch;
  margin-bottom: 16px;
}

.page-about .ab-team__lead {
  font-size: 16px;
  color: var(--ab-text-soft);
  max-width: 56ch;
  margin-bottom: 36px;
}

.page-about .ab-team__list > li {
  display: grid;
  gap: 10px;
  padding: 24px 0;
  border-top: 1px solid var(--ab-line);
}

.page-about .ab-team__list > li:last-child {
  border-bottom: 1px solid var(--ab-line);
}

.page-about .ab-team__name {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 10px;
}

.page-about .ab-team__name h3 { font-size: 18px; }

.page-about .ab-team__num {
  font-size: 12.5px;
  letter-spacing: .06em;
  color: var(--maple);
}

.page-about .ab-team__bar {
  position: relative;
  height: 8px;
  border-radius: var(--pill);
  background: var(--cool);
  overflow: hidden;
}

.page-about .ab-team__bar::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: var(--w, 40%);
  border-radius: var(--pill);
  background: linear-gradient(90deg, var(--maple), var(--maple-soft));
}

.page-about .ab-team__list > li:nth-child(1) { --w: 100%; }
.page-about .ab-team__list > li:nth-child(2) { --w: 43%; }
.page-about .ab-team__list > li:nth-child(3) { --w: 64%; }
.page-about .ab-team__list > li:nth-child(4) { --w: 36%; }
.page-about .ab-team__list > li:nth-child(5) { --w: 29%; }

.page-about .ab-team__list p {
  font-size: 15.5px;
  color: var(--ab-text-soft);
  max-width: 62ch;
}

/* ---------- 合作与认可 ---------- */
.page-about .ab-coop { padding-top: 96px; }

.page-about .ab-coop h2 {
  font-size: clamp(22px, 3.4vw, 38px);
  max-width: 22ch;
  margin-bottom: 34px;
}

.page-about .ab-coop__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
}

.page-about .ab-coop__item {
  padding: 28px 0 30px;
  border-top: 1px solid var(--ab-line);
}

.page-about .ab-coop__item h3 {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0 10px;
  font-size: 17px;
  margin-bottom: 10px;
}

.page-about .ab-coop__num {
  font-size: clamp(34px, 8vw, 42px);
  font-weight: 600;
  line-height: 1;
  letter-spacing: -.03em;
  color: var(--maple);
}

.page-about .ab-coop__item p {
  font-size: 15.5px;
  color: var(--ab-text-soft);
  max-width: 46ch;
}

.page-about .ab-coop__foot {
  margin-top: 30px;
  padding-top: 26px;
  border-top: 1px solid var(--ab-line);
  font-size: 16px;
  line-height: 1.85;
  color: var(--ab-text-soft);
  max-width: 68ch;
}

.page-about .ab-coop__foot .num {
  color: var(--ink);
  font-weight: 600;
}

/* ---------- 更新节奏 ---------- */
.page-about .ab-cadence { padding-top: 96px; }

.page-about .ab-cadence h2 {
  font-size: clamp(22px, 3.4vw, 38px);
  max-width: 22ch;
  margin-bottom: 34px;
}

.page-about .ab-cadence__list > li {
  display: grid;
  gap: 6px;
  padding: 22px 0;
  border-top: 1px solid var(--ab-line);
}

.page-about .ab-cadence__list > li:last-child {
  border-bottom: 1px solid var(--ab-line);
}

.page-about .ab-cadence__when {
  position: relative;
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: .06em;
  color: var(--ink);
  padding-left: 15px;
}

.page-about .ab-cadence__when::before {
  content: "";
  position: absolute;
  left: 0;
  top: .62em;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--maple);
}

.page-about .ab-cadence__list p {
  font-size: 15.5px;
  color: var(--ab-text-soft);
  max-width: 62ch;
}

.page-about .ab-cadence__foot {
  margin-top: 32px;
  font-size: 15.5px;
  line-height: 1.9;
  color: var(--ab-text-soft);
  max-width: 66ch;
}

.page-about .ab-cadence__foot a {
  color: var(--maple);
  text-decoration: underline;
  text-underline-offset: 4px;
}

.page-about .ab-cta {
  display: grid;
  gap: 16px;
  margin-top: 44px;
  padding: 26px 24px;
  border: 1px solid var(--ab-line);
  border-radius: var(--r-lg);
  background: var(--ab-surface);
}

.page-about .ab-cta p {
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: 700;
  color: var(--ink);
  line-height: 1.4;
}

.page-about .ab-cta__links {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.page-about .ab-signoff {
  margin-top: 36px;
  padding: 22px 24px;
  border-radius: var(--r-lg);
  background: var(--ink-2);
  color: rgba(246, 242, 234, .9);
  font-size: 15px;
  line-height: 1.85;
}

/* ---------- 响应式 ---------- */
@media (min-width: 700px) {
  .page-about .ab-hero__stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .page-about .ab-hero__stats > div { padding: 24px 22px; }

  .page-about .ab-cta {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 24px;
    padding: 28px 30px;
  }
}

@media (min-width: 900px) {
  .page-about { padding-bottom: 128px; }

  .page-about .ab-hero { padding-top: 60px; }
  .page-about .ab-hero__lead { font-size: 17.5px; }

  .page-about .ab-timeline { padding-top: 120px; }
  .page-about .ab-audience,
  .page-about .ab-team,
  .page-about .ab-coop,
  .page-about .ab-cadence { padding-top: 128px; }

  .page-about .ab-figure { margin-bottom: 52px; }

  .page-about .ab-tl {
    grid-template-columns: 84px minmax(0, 1fr);
    column-gap: 52px;
  }

  .page-about .ab-tl__rail {
    display: flex;
    flex-direction: column;
    gap: 30px;
    align-self: start;
    position: sticky;
    top: 140px;
    padding-left: 14px;
    border-left: 1px solid var(--ab-line);
  }

  .page-about .ab-tl__rail a {
    font-family: var(--font-mono);
    font-variant-numeric: tabular-nums;
    font-size: 13px;
    letter-spacing: .06em;
    color: var(--steel);
    text-decoration: none;
    transition: color .2s var(--ease);
  }

  .page-about .ab-tl__rail a:hover {
    color: var(--maple);
  }

  .page-about .ab-tl__list { gap: 22px; }

  .page-about .ab-tl__item { padding: 30px 32px 32px; }

  .page-about .ab-tl__item:nth-child(odd) { margin-right: 12%; }
  .page-about .ab-tl__item:nth-child(even) { margin-left: 12%; }

  .page-about .ab-aud__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 56px;
  }

  .page-about .ab-aud__list > li { padding: 32px 0; }
  .page-about .ab-aud__list h3 { font-size: 21px; }

  .page-about .ab-verify { padding: 88px 0 92px; margin-top: 128px; }

  .page-about .ab-verify__inner {
    grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
    gap: 60px;
    align-items: start;
  }

  .page-about .ab-steps li { padding: 17px 0; }

  .page-about .ab-map { margin-bottom: 72px; }

  .page-about .ab-team__list > li {
    grid-template-columns: 170px 190px minmax(0, 1fr);
    align-items: center;
    gap: 30px;
    padding: 26px 0;
  }

  .page-about .ab-team__name {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }

  .page-about .ab-team__bar { height: 10px; }

  .page-about .ab-coop__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    column-gap: 48px;
  }

  .page-about .ab-coop__item { padding: 30px 0 34px; }

  .page-about .ab-cadence__list > li {
    grid-template-columns: 230px minmax(0, 1fr);
    align-items: baseline;
    gap: 28px;
    padding: 24px 0;
  }
}
</style>
<<<END>>>

等等，我不该输出 `</style>`，标记是 `` 和末尾。让我去掉那个。

另外我需要再检查一下：我写了 ``，然后 CSS 正常，最后是 `<<<END>>>`？不对。说明里说每个标记只能出现一次，三个尖括号包裹。格式是：


...

...

那就是全部了。最后不该再加标记。让我修正一下。
<main id="main-content" class="page-about">

  <div class="wrap">
    <nav class="breadcrumbs" aria-label="当前位置">
      <ol>
        <li><a href="/">首页</a></li>
        <li aria-current="page">平台介绍</li>
      </ol>
    </nav>
  </div>

  <header class="ab-hero wrap">
    <p class="ab-label">平台介绍 · Profile</p>
    <h1>十一年只做一件事：把加拿大的每一次开奖和每一次规则调整都留成底档</h1>
    <p class="ab-hero__lead">
      加拿大平台讯从 2014 年开始逐期收录加拿大各省的开奖记录，并把玩法、奖级、投注方式的变化单独存档。
      到 2024 年走完第十一个归档年度，13 个省级与地区级辖区、4 大类共 18 个彩种的结果与规则版本都在库里。
      做课题的研究者、赶稿的编辑、顺手查一注的普通用户，取到的是同一批数据。
    </p>
    <dl class="ab-hero__stats">
      <div>
        <dt>归档年度</dt>
        <dd><span class="num">11</span> 个</dd>
      </div>
      <div>
        <dt>覆盖辖区</dt>
        <dd><span class="num">13</span> 个</dd>
      </div>
      <div>
        <dt>归档条目</dt>
        <dd><span class="num">20,000</span> 条以上</dd>
      </div>
      <div>
        <dt>维护团队</dt>
        <dd><span class="num">38</span> 人</dd>
      </div>
    </dl>
    <div class="ab-hero__links">
      <a class="btn btn--primary" href="/projects/">查看数据档案服务</a>
      <a class="btn btn--ghost" href="#ab-team">认识维护团队</a>
    </div>
  </header>

  <section class="ab-timeline" aria-labelledby="ab-tl-h">
    <div class="wrap">
      <p class="ab-label">2014 — 2024 · 十一年</p>
      <h2 id="ab-tl-h">从一份省级开奖表，到覆盖 13 个辖区的档案库</h2>

      <figure class="ab-figure ab-figure--wide">
        <img src="{zhanqunpic:h:600w:1200}" width="1200" height="600" alt="2014 至 2024 年平台发展时间轴，标注覆盖辖区扩展与规范年度归档节点" decoding="async">
        <figcaption>十一年间的关键节点：辖区从 1 个扩到 13 个，规则档案在 2022 年独立成库。</figcaption>
      </figure>

      <div class="ab-tl">
        <nav class="ab-tl__rail" aria-label="年份索引">
          <a href="#y2014">2014</a>
          <a href="#y2016">2016</a>
          <a href="#y2019">2019</a>
          <a href="#y2022">2022</a>
          <a href="#y2024">2024</a>
        </nav>

        <ol class="ab-tl__list">
          <li class="ab-tl__item" id="y2014" data-reveal>
            <span class="ab-tl__year">2014</span>
            <p class="ab-tl__kicker">起点</p>
            <h3>一份省级开奖表，一期一期手工登记</h3>
            <p>最初只盯一个省份，把每期的开奖号码、期号、开奖日誊进同一张表。字段只有三个，但版式从那时定下来，后来的辖区与彩种都按这套结构往里加。</p>
          </li>
          <li class="ab-tl__item" id="y2016" data-reveal>
            <span class="ab-tl__year">2016</span>
            <p class="ab-tl__kicker">规则入库</p>
            <h3>玩法改动不再只写在备注里</h3>
            <p>开奖号码之外，玩法、奖级、投注方式的变化开始单独成表，按年份归拢。规则年度这个结构在这一年定型，用到今天。</p>
          </li>
          <li class="ab-tl__item" id="y2019" data-reveal>
            <span class="ab-tl__year">2019</span>
            <p class="ab-tl__kicker">辖区补齐</p>
            <h3>13 个省级与地区级辖区全部纳入</h3>
            <p>最后一处缺口补上之后，跨省份的横向对照第一次成为可能。同一年，平台获评行业数据公开示范单位，此后连续六年保持。</p>
          </li>
          <li class="ab-tl__item" id="y2022" data-reveal>
            <span class="ab-tl__year">2022</span>
            <p class="ab-tl__kicker">结构升级</p>
            <h3>规则档案从开奖库里拆出来独立维护</h3>
            <p>拆库之后，规则条目不再依附于某一期开奖记录，可以按年份、按彩种单独调取，写稿和做研究的人不必顺着开奖流水往回翻。</p>
          </li>
          <li class="ab-tl__item" id="y2024" data-reveal>
            <span class="ab-tl__year">2024</span>
            <p class="ab-tl__kicker">第十一年</p>
            <h3>条目逾两万条，年度报告出到第 11 期</h3>
            <p>结构稳定之后，剩下的是把每年新增的辖区公告按时处理完。开奖记录约 18,000 条，规则与版本记录约 2,600 条，两部分合起来就是今天能查到的全部内容。</p>
          </li>
        </ol>
      </div>
    </div>
  </section>

  <section class="ab-audience" aria-labelledby="ab-aud-h">
    <div class="wrap">
      <p class="ab-label">使用者 · Users</p>
      <h2 id="ab-aud-h">四类人，用同一份彩票资讯研究历史数据做不同的事</h2>
      <ol class="ab-aud__list">
        <li data-reveal>
          <span class="ab-aud__idx">01</span>
          <h3>高校统计院系的师生</h3>
          <p>做时序课题最怕序列断档。他们通常整段取走 2014 到 2024 的号码序列，用连号频次与遗漏指标验证自己的分布假设，一次取用常横跨多个辖区。</p>
        </li>
        <li data-reveal>
          <span class="ab-aud__idx">02</span>
          <h3>独立研究者与数据爱好者</h3>
          <p>自己写脚本复算，对字段完整度和取数方式最敏感。148 个字段按开奖、号码分布、奖池、规则分成四组，导出成 CSV 或 JSON 后直接进分析流程。</p>
        </li>
        <li data-reveal>
          <span class="ab-aud__idx">03</span>
          <h3>媒体编辑与内容作者</h3>
          <p>写稿时最常问的是“这条规则哪一年改的”。11 个规则年度里累积了 268 条变更条目，每条都带年份和生效范围，引用时能直接落到出处。</p>
        </li>
        <li data-reveal>
          <span class="ab-aud__idx">04</span>
          <h3>研究机构与数据服务商</h3>
          <p>按项目批量取数，在意字段能不能对齐、一次能拿多少、后续怎么更新。单次导出上限 50 万行，机构版还包含授权范围与更新通知。</p>
        </li>
      </ol>
    </div>
  </section>

  <section class="ab-verify" aria-labelledby="ab-vf-h">
    <div class="wrap ab-verify__inner">
      <div class="ab-verify__body">
        <p class="ab-label ab-label--dark">来源与复核 · Sourcing</p>
        <h2 id="ab-vf-h">每条记录都能追回公告原文，改过哪一版也留着痕迹</h2>
        <p class="ab-verify__lead">
          开奖结果逐期取自各地公开公告。两名编辑分别登记同一期数据后交叉比对，出现分歧就回到公告原文确认，
          确认无误的条目才入库，并写下版本号与修订说明。库里的数据允许带着修订痕迹存在，而不是悄悄改掉。
        </p>
        <ol class="ab-steps">
          <li><span class="ab-steps__n">01</span><p>逐期采集各地公开公告里的开奖结果与期号信息。</p></li>
          <li><span class="ab-steps__n">02</span><p>两名编辑各自独立登记同一期，再交叉比对两边的结果。</p></li>
          <li><span class="ab-steps__n">03</span><p>分歧条目回到公告原文确认，更正后写明修订原因。</p></li>
          <li><span class="ab-steps__n">04</span><p>入库保留版本号，历史版本可回看；累计完成 46 次回溯补录。</p></li>
        </ol>
        <p class="ab-verify__foot">导出格式、字段清单与授权范围在<a href="/projects/">数据档案服务</a>里逐项列出。</p>
      </div>
      <figure class="ab-verify__fig">
        <img src="{zhanqunpic:h:700w:1000}" width="1000" height="700" alt="开奖记录采集与双人交叉比对流程图，从采集到入库共四个环节" loading="lazy" decoding="async">
        <figcaption>从公开公告到入库：采集、双人登记、交叉比对、留痕入库，四个环节各有人签字。</figcaption>
      </figure>
    </div>
  </section>

  <section class="ab-team" id="ab-team" aria-labelledby="ab-team-h">
    <div class="wrap">
      <figure class="ab-map">
        <img src="{zhanqunpic:h:650w:900}" width="900" height="650" alt="加拿大辖区覆盖示意图，用线稿轮廓与数据点表示各辖区归档彩种数量" loading="lazy" decoding="async">
        <figcaption>13 个省级与地区级辖区全部纳入归档，4 大类共 18 个彩种按辖区分别记录。</figcaption>
      </figure>

      <p class="ab-label">团队 · Team</p>
      <h2 id="ab-team-h">38 个人守五条线，每条都有人接手</h2>
      <p class="ab-team__lead">档案能做长，靠的是分工不断层：从公告采集、规则梳理，到入库前的比对与对外答疑，每个环节都有明确的人负责，交接不必靠口头交代。</p>

      <ul class="ab-team__list">
        <li data-reveal>
          <div class="ab-team__name">
            <h3>数据工程</h3>
            <span class="ab-team__num num">14 人</span>
          </div>
          <div class="ab-team__bar" aria-hidden="true"></div>
          <p>负责逐期采集、字段映射与入库。每周两次批量同步省级开奖记录，遇到公告页面改版，当天调整解析方式，保证同步不断线。</p>
        </li>
        <li data-reveal>
          <div class="ab-team__name">
            <h3>规则研究</h3>
            <span class="ab-team__num num">6 人</span>
          </div>
          <div class="ab-team__bar" aria-hidden="true"></div>
          <p>盯各辖区公告，把玩法、奖级、投注方式的调整整理成可检索的条目，公告发布后 48 小时内完成入库。</p>
        </li>
        <li data-reveal>
          <div class="ab-team__name">
            <h3>编辑校对</h3>
            <span class="ab-team__num num">9 人</span>
          </div>
          <div class="ab-team__bar" aria-hidden="true"></div>
          <p>两人一组交叉比对每一批新入库的数据，撰写修订说明，并维护 148 个字段的含义与注释。</p>
        </li>
        <li data-reveal>
          <div class="ab-team__name">
            <h3>客服与授权</h3>
            <span class="ab-team__num num">5 人</span>
          </div>
          <div class="ab-team__bar" aria-hidden="true"></div>
          <p>处理勘误提交、规则咨询与归档授权，平均 2 个工作日内给出回复，机构合作从这一条线对接。</p>
        </li>
        <li data-reveal>
          <div class="ab-team__name">
            <h3>技术与设计</h3>
            <span class="ab-team__num num">4 人</span>
          </div>
          <div class="ab-team__bar" aria-hidden="true"></div>
          <p>维护检索与导出通道。手机端输入号码、期号或彩种名称，平均响应时间低于 1 秒。</p>
        </li>
      </ul>
    </div>
  </section>

  <section class="ab-coop" aria-labelledby="ab-coop-h">
    <div class="wrap">
      <p class="ab-label">合作与认可 · Partners</p>
      <h2 id="ab-coop-h">档案被别人用起来，才算真正立得住</h2>
      <div class="ab-coop__grid">
        <div class="ab-coop__item" data-reveal>
          <h3><span class="ab-coop__num num">6</span>家数据研究机构</h3>
          <p>与我们长期交换资料，各自补齐缺失的年份与辖区，也会就字段含义互相对照。</p>
        </div>
        <div class="ab-coop__item" data-reveal>
          <h3><span class="ab-coop__num num">4</span>所高校统计院系</h3>
          <p>把归档数据用进课堂与课题，学生在真实序列上练习分布检验与抽样方法。</p>
        </div>
        <div class="ab-coop__item" data-reveal>
          <h3><span class="ab-coop__num num">6</span>年行业数据公开示范单位</h3>
          <p>自 2019 年起连续获评，评审关注的正是归档的完整程度与版本留痕的细致程度。</p>
        </div>
      </div>
      <p class="ab-coop__foot">目前注册研究者约 <span class="num">32,000</span> 名，月均查询约 <span class="num">860,000</span> 次，其中移动端访问占全站约 <span class="num">71%</span>。这些数字背后是同一件事：数据随时取得到。</p>
    </div>
  </section>

  <section class="ab-cadence" aria-labelledby="ab-cd-h">
    <div class="wrap">
      <p class="ab-label">更新节奏 · Cadence</p>
      <h2 id="ab-cd-h">数据什么时候变，提前讲清楚</h2>
      <ol class="ab-cadence__list">
        <li data-reveal>
          <span class="ab-cadence__when">每周三 · 周六</span>
          <p>批量同步省级开奖记录，新增期号当天即可检索。</p>
        </li>
        <li data-reveal>
          <span class="ab-cadence__when">公告发布后 48 小时内</span>
          <p>规则修订入库，连带更新受影响的奖级与玩法字段，旧版本一并保留。</p>
        </li>
        <li data-reveal>
          <span class="ab-cadence__when">每年一期</span>
          <p>《年度归档报告》梳理当年的收录规模、新增条目与主要规则调整，目前已发布 11 期。</p>
        </li>
      </ol>
      <p class="ab-cadence__foot">
        近期的入库内容与规则变动可以在<a href="/stories/">档案动态</a>看到；号码怎么查、字段怎么读、发现错漏怎么提，
        <a href="/answers/">答疑中心</a>里有对应的说明。
      </p>

      <div class="ab-cta">
        <p>想先看看数据再决定合作方式？</p>
        <div class="ab-cta__links">
          <a class="btn btn--primary" href="/projects/">浏览数据档案服务</a>
          <a class="btn btn--ghost" href="/find-us/">联系我们</a>
        </div>
      </div>

      <p class="ab-signoff">加拿大平台讯的运营主体位于湖南，这份档案由长沙与各地远程协作的团队持续维护，最近一次回溯补录完成于本归档年度内。</p>
    </div>
  </section>

</main>

.page-about {
  --ab-line: #DDE3E8;
  --ab-line-dark: rgba(246, 242, 234, .18);
  --ab-surface: #FFFFFF;
  --ab-text-soft: #3B4856;
  --ab-caption: #5A6875;
  background: var(--ice);
  color: var(--char);
  font-family: var(--font-body);
  line-height: 1.85;
  padding-bottom: 96px;
}

.page-about *,
.page-about *::before,
.page-about *::after { box-sizing: border-box; }

.page-about h1,
.page-about h2,
.page-about h3 {
  font-family: var(--font-display);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: .01em;
  color: var(--ink);
  margin: 0;
}

.page-about p { margin: 0; }
.page-about ol,
.page-about ul { margin: 0; padding: 0; list-style: none; }

.page-about .num {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  letter-spacing: -.01em;
}

.page-about .ab-label {
  display: inline-flex;
  align-items: center;
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--maple);
  border: 1px solid rgba(200, 16, 46, .3);
  border-radius: var(--pill);
  padding: 5px 14px;
  margin: 0 0 20px;
}

.page-about .ab-label--dark {
  color: var(--amber);
  border-color: rgba(224, 164, 59, .42);
}

/* ---------- 首屏 ---------- */
.page-about .ab-hero { padding-top: 44px; }

.page-about .ab-hero h1 {
  font-size: clamp(29px, 6vw, 58px);
  letter-spacing: .004em;
  max-width: 21ch;
  margin-bottom: 24px;
}

.page-about .ab-hero__lead {
  font-size: 16.5px;
  line-height: 1.92;
  color: var(--ab-text-soft);
  max-width: 60ch;
  margin-bottom: 34px;
}

.page-about .ab-hero__stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  background: var(--ab-line);
  border: 1px solid var(--ab-line);
  border-radius: var(--r-lg);
  overflow: hidden;
  margin: 0 0 32px;
}

.page-about .ab-hero__stats > div {
  background: var(--ice);
  padding: 20px 18px;
}

.page-about .ab-hero__stats dt {
  font-family: var(--font-display);
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--steel);
  margin-bottom: 6px;
}

.page-about .ab-hero__stats dd {
  margin: 0;
  font-size: 14px;
  color: var(--ab-text-soft);
}

.page-about .ab-hero__stats dd .num {
  font-size: clamp(22px, 4.6vw, 30px);
  font-weight: 600;
  color: var(--ink);
  margin-right: 5px;
}

.page-about .ab-hero__links {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

/* ---------- 通用图版 ---------- */
.page-about .ab-figure {
  margin: 0 0 40px;
  border-radius: var(--r-xl);
  overflow: hidden;
  border: 1px solid var(--ab-line);
  background: var(--ink-2);
}

.page-about .ab-figure img,
.page-about .ab-map img,
.page-about .ab-verify__fig img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  object-fit: cover;
}

.page-about .ab-figure figcaption,
.page-about .ab-map figcaption {
  font-size: 13px;
  line-height: 1.7;
  color: var(--ab-caption);
  background: var(--ice);
  border-top: 1px solid var(--ab-line);
  padding: 13px 18px 15px;
}

/* ---------- 时间轴 ---------- */
.page-about .ab-timeline { padding-top: 88px; }

.page-about .ab-timeline h2 {
  font-size: clamp(23px, 3.6vw, 40px);
  max-width: 24ch;
  margin-bottom: 36px;
}

.page-about .ab-tl {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}

.page-about .ab-tl__rail { display: none; }

.page-about .ab-tl__list {
  display: grid;
  gap: 18px;
}

.page-about .ab-tl__item {
  position: relative;
  display: grid;
  gap: 6px;
  padding: 24px 22px 26px;
  background: var(--ab-surface);
  border: 1px solid var(--ab-line);
  border-radius: var(--r-lg);
  scroll-margin-top: 120px;
}

.page-about .ab-tl__year {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-size: 30px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: -.02em;
  color: var(--maple);
}

.page-about .ab-tl__kicker {
  font-family: var(--font-display);
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--steel);
}

.page-about .ab-tl__item h3 {
  font-size: 19px;
  margin: 4px 0;
}

.page-about .ab-tl__item p {
  font-size: 15.5px;
  color: var(--ab-text-soft);
  max-width: 58ch;
}

/* ---------- 使用者 ---------- */
.page-about .ab-audience { padding-top: 96px; }

.page-about .ab-audience h2 {
  font-size: clamp(22px, 3.4vw, 38px);
  max-width: 26ch;
  margin-bottom: 38px;
}

.page-about .ab-aud__list {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}

.page-about .ab-aud__list > li {
  display: grid;
  gap: 8px;
  padding: 28px 0;
  border-top: 1px solid var(--ab-line);
}

.page-about .ab-aud__list > li:last-child {
  border-bottom: 1px solid var(--ab-line);
}

.page-about .ab-aud__idx {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-size: 12.5px;
  letter-spacing: .12em;
  color: var(--amber);
}

.page-about .ab-aud__list h3 { font-size: 20px; }

.page-about .ab-aud__list p {
  font-size: 15.5px;
  color: var(--ab-text-soft);
  max-width: 56ch;
}

/* ---------- 来源与复核 ---------- */
.page-about .ab-verify {
  margin-top: 96px;
  background: var(--ink);
  color: var(--ice);
  padding: 72px 0 76px;
}

.page-about .ab-verify__inner {
  display: grid;
  gap: 40px;
}

.page-about .ab-verify h2 {
  color: var(--ice);
  font-size: clamp(22px, 3.4vw, 38px);
  max-width: 21ch;
  margin-bottom: 20px;
}

.page-about .ab-verify__lead {
  font-size: 15.5px;
  line-height: 1.9;
  color: rgba(246, 242, 234, .78);
  max-width: 52ch;
  margin-bottom: 28px;
}

.page-about .ab-steps { margin: 0 0 26px; }

.page-about .ab-steps li {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
  padding: 15px 0;
  border-top: 1px solid var(--ab-line-dark);
}

.page-about .ab-steps li:last-child {
  border-bottom: 1px solid var(--ab-line-dark);
}

.page-about .ab-steps__n {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-size: 12.5px;
  letter-spacing: .08em;
  color: var(--amber);
  padding-top: 3px;
}

.page-about .ab-steps p {
  font-size: 15.5px;
  line-height: 1.75;
  color: rgba(246, 242, 234, .86);
}

.page-about .ab-verify__foot {
  font-size: 15px;
  color: rgba(246, 242, 234, .72);
}

.page-about .ab-verify__foot a {
  color: var(--amber);
  text-decoration: underline;
  text-underline-offset: 4px;
}

.page-about .ab-verify__fig {
  margin: 0;
  border-radius: var(--r-xl);
  overflow: hidden;
  border: 1px solid var(--ab-line-dark);
  background: var(--ink-2);
}

.page-about .ab-verify__fig figcaption {
  font-size: 13px;
  line-height: 1.7;
  color: rgba(246, 242, 234, .66);
  background: var(--ink-2);
  padding: 13px 18px 15px;
}

/* ---------- 辖区图与团队 ---------- */
.page-about .ab-team { padding-top: 96px; }

.page-about .ab-map {
  margin: 0 0 56px;
  border-radius: var(--r-xl);
  overflow: hidden;
  border: 1px solid var(--ab-line);
  background: var(--ink-2);
}

.page-about .ab-team h2 {
  font-size: clamp(22px, 3.4vw, 38px);
  max-width: 22ch;
  margin-bottom: 16px;
}

.page-about .ab-team__lead {
  font-size: 16px;
  color: var(--ab-text-soft);
  max-width: 56ch;
  margin-bottom: 36px;
}

.page-about .ab-team__list > li {
  display: grid;
  gap: 10px;
  padding: 24px 0;
  border-top: 1px solid var(--ab-line);
}

.page-about .ab-team__list > li:last-child {
  border-bottom: 1px solid var(--ab-line);
}

.page-about .ab-team__name {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 10px;
}

.page-about .ab-team__name h3 { font-size: 18px; }

.page-about .ab-team__num {
  font-size: 12.5px;
  letter-spacing: .06em;
  color: var(--maple);
}

.page-about .ab-team__bar {
  position: relative;
  height: 8px;
  border-radius: var(--pill);
  background: var(--cool);
  overflow: hidden;
}

.page-about .ab-team__bar::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: var(--w, 40%);
  border-radius: var(--pill);
  background: linear-gradient(90deg, var(--maple), var(--maple-soft));
}

.page-about .ab-team__list > li:nth-child(1) { --w: 100%; }
.page-about .ab-team__list > li:nth-child(2) { --w: 43%; }
.page-about .ab-team__list > li:nth-child(3) { --w: 64%; }
.page-about .ab-team__list > li:nth-child(4) { --w: 36%; }
.page-about .ab-team__list > li:nth-child(5) { --w: 29%; }

.page-about .ab-team__list p {
  font-size: 15.5px;
  color: var(--ab-text-soft);
  max-width: 62ch;
}

/* ---------- 合作与认可 ---------- */
.page-about .ab-coop { padding-top: 96px; }

.page-about .ab-coop h2 {
  font-size: clamp(22px, 3.4vw, 38px);
  max-width: 22ch;
  margin-bottom: 34px;
}

.page-about .ab-coop__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
}

.page-about .ab-coop__item {
  padding: 28px 0 30px;
  border-top: 1px solid var(--ab-line);
}

.page-about .ab-coop__item h3 {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0 10px;
  font-size: 17px;
  margin-bottom: 10px;
}

.page-about .ab-coop__num {
  font-size: clamp(34px, 8vw, 42px);
  font-weight: 600;
  line-height: 1;
  letter-spacing: -.03em;
  color: var(--maple);
}

.page-about .ab-coop__item p {
  font-size: 15.5px;
  color: var(--ab-text-soft);
  max-width: 46ch;
}

.page-about .ab-coop__foot {
  margin-top: 30px;
  padding-top: 26px;
  border-top: 1px solid var(--ab-line);
  font-size: 16px;
  line-height: 1.85;
  color: var(--ab-text-soft);
  max-width: 68ch;
}

.page-about .ab-coop__foot .num {
  color: var(--ink);
  font-weight: 600;
}

/* ---------- 更新节奏 ---------- */
.page-about .ab-cadence { padding-top: 96px; }

.page-about .ab-cadence h2 {
  font-size: clamp(22px, 3.4vw, 38px);
  max-width: 22ch;
  margin-bottom: 34px;
}

.page-about .ab-cadence__list > li {
  display: grid;
  gap: 6px;
  padding: 22px 0;
  border-top: 1px solid var(--ab-line);
}

.page-about .ab-cadence__list > li:last-child {
  border-bottom: 1px solid var(--ab-line);
}

.page-about .ab-cadence__when {
  position: relative;
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: .06em;
  color: var(--ink);
  padding-left: 15px;
}

.page-about .ab-cadence__when::before {
  content: "";
  position: absolute;
  left: 0;
  top: .62em;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--maple);
}

.page-about .ab-cadence__list p {
  font-size: 15.5px;
  color: var(--ab-text-soft);
  max-width: 62ch;
}

.page-about .ab-cadence__foot {
  margin-top: 32px;
  font-size: 15.5px;
  line-height: 1.9;
  color: var(--ab-text-soft);
  max-width: 66ch;
}

.page-about .ab-cadence__foot a {
  color: var(--maple);
  text-decoration: underline;
  text-underline-offset: 4px;
}

.page-about .ab-cta {
  display: grid;
  gap: 16px;
  margin-top: 44px;
  padding: 26px 24px;
  border: 1px solid var(--ab-line);
  border-radius: var(--r-lg);
  background: var(--ab-surface);
}

.page-about .ab-cta p {
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: 700;
  color: var(--ink);
  line-height: 1.4;
}

.page-about .ab-cta__links {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.page-about .ab-signoff {
  margin-top: 36px;
  padding: 22px 24px;
  border-radius: var(--r-lg);
  background: var(--ink-2);
  color: rgba(246, 242, 234, .9);
  font-size: 15px;
  line-height: 1.85;
}

/* ---------- 响应式 ---------- */
@media (min-width: 700px) {
  .page-about .ab-hero__stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .page-about .ab-hero__stats > div { padding: 24px 22px; }

  .page-about .ab-cta {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 24px;
    padding: 28px 30px;
  }
}

@media (min-width: 900px) {
  .page-about { padding-bottom: 128px; }

  .page-about .ab-hero { padding-top: 60px; }
  .page-about .ab-hero__lead { font-size: 17.5px; }

  .page-about .ab-timeline { padding-top: 120px; }
  .page-about .ab-audience,
  .page-about .ab-team,
  .page-about .ab-coop,
  .page-about .ab-cadence { padding-top: 128px; }

  .page-about .ab-figure { margin-bottom: 52px; }

  .page-about .ab-tl {
    grid-template-columns: 84px minmax(0, 1fr);
    column-gap: 52px;
  }

  .page-about .ab-tl__rail {
    display: flex;
    flex-direction: column;
    gap: 30px;
    align-self: start;
    position: sticky;
    top: 140px;
    padding-left: 14px;
    border-left: 1px solid var(--ab-line);
  }

  .page-about .ab-tl__rail a {
    font-family: var(--font-mono);
    font-variant-numeric: tabular-nums;
    font-size: 13px;
    letter-spacing: .06em;
    color: var(--steel);
    text-decoration: none;
    transition: color .2s var(--ease);
  }

  .page-about .ab-tl__rail a:hover { color: var(--maple); }

  .page-about .ab-tl__list { gap: 22px; }
  .page-about .ab-tl__item { padding: 30px 32px 32px; }
  .page-about .ab-tl__item:nth-child(odd) { margin-right: 12%; }
  .page-about .ab-tl__item:nth-child(even) { margin-left: 12%; }

  .page-about .ab-aud__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 56px;
  }

  .page-about .ab-aud__list > li { padding: 32px 0; }
  .page-about .ab-aud__list h3 { font-size: 21px; }

  .page-about .ab-verify { padding: 88px 0 92px; margin-top: 128px; }

  .page-about .ab-verify__inner {
    grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
    gap: 60px;
    align-items: start;
  }

  .page-about .ab-steps li { padding: 17px 0; }

  .page-about .ab-map { margin-bottom: 72px; }

  .page-about .ab-team__list > li {
    grid-template-columns: 170px 190px minmax(0, 1fr);
    align-items: center;
    gap: 30px;
    padding: 26px 0;
  }

  .page-about .ab-team__name {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }

  .page-about .ab-team__bar { height: 10px; }

  .page-about .ab-coop__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    column-gap: 48px;
  }

  .page-about .ab-coop__item { padding: 30px 0 34px; }

  .page-about .ab-cadence__list > li {
    grid-template-columns: 230px minmax(0, 1fr);
    align-items: baseline;
    gap: 28px;
    padding: 24px 0;
  }
}