.page-privacy {
  background: var(--ink);
  color: var(--ice);
  padding-bottom: clamp(48px, 8vw, 96px);
}

.page-privacy .breadcrumb {
  padding-top: clamp(16px, 3vw, 28px);
  color: var(--silver);
  font-size: 13px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.page-privacy .breadcrumb a {
  color: var(--silver);
  text-decoration: none;
  border-bottom: 1px solid rgba(168, 179, 189, 0.4);
}

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

.page-privacy .breadcrumb .breadcrumb__sep {
  color: var(--graphite);
}

/* ---------- 首屏 ---------- */
.page-privacy .pv-hero {
  position: relative;
  padding: clamp(22px, 4vw, 44px) 0 clamp(24px, 4vw, 44px);
  background:
    radial-gradient(circle at 84% 8%, rgba(46, 230, 166, 0.14), transparent 58%),
    radial-gradient(circle at 6% 92%, rgba(255, 122, 26, 0.12), transparent 52%),
    repeating-linear-gradient(90deg, rgba(168, 179, 189, 0.055) 0 1px, transparent 1px 72px);
  border-bottom: var(--bw) solid var(--graphite);
}

.page-privacy .pv-hero__grid {
  display: grid;
  gap: clamp(20px, 4vw, 36px);
  align-items: start;
}

.page-privacy .pv-hero__text .eyebrow {
  color: var(--mint);
  font-family: var(--font-cond);
  letter-spacing: 0.18em;
  font-size: 13px;
  margin: 0 0 10px;
}

.page-privacy .pv-hero h1 {
  font-family: var(--font-serif);
  font-weight: 900;
  font-size: clamp(28px, 6.4vw, 58px);
  line-height: 1.18;
  letter-spacing: -0.01em;
  margin: 0 0 16px;
  color: var(--ice);
}

.page-privacy .pv-hero__lead {
  font-size: clamp(15px, 1.7vw, 17px);
  line-height: 1.8;
  color: #cfdce4;
  max-width: 62ch;
  margin: 0 0 18px;
}

.page-privacy .pv-hero__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.page-privacy .pv-hero__tags .tag {
  font-family: var(--font-mono);
  font-size: 12px;
  padding: 4px 10px;
  color: var(--silver);
  border: 1px solid var(--graphite);
  background: rgba(16, 42, 67, 0.7);
}

/* 文档标识卡 */
.page-privacy .pv-doc {
  border: var(--bw) solid var(--graphite);
  background: var(--ink-2);
  box-shadow: var(--shadow-hard);
  padding: clamp(16px, 3vw, 22px);
  clip-path: polygon(0 0, 100% 0, 100% 88%, 92% 100%, 0 100%);
}

.page-privacy .pv-doc__label {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  color: var(--silver);
  margin: 0 0 6px;
}

.page-privacy .pv-doc__version {
  font-family: var(--font-mono);
  font-weight: 700;
  font-size: clamp(34px, 7vw, 48px);
  line-height: 1;
  color: var(--orange);
  margin: 0 0 16px;
}

.page-privacy .pv-doc__list {
  margin: 0 0 18px;
  display: grid;
  gap: 10px;
}

.page-privacy .pv-doc__row {
  border-top: 1px solid rgba(168, 179, 189, 0.22);
  padding-top: 8px;
}

.page-privacy .pv-doc__row dt {
  font-family: var(--font-cond);
  font-size: 12px;
  letter-spacing: 0.1em;
  color: var(--green);
  margin-bottom: 3px;
}

.page-privacy .pv-doc__row dd {
  margin: 0;
  font-size: 13px;
  line-height: 1.6;
  color: #cbd8e1;
}

.page-privacy .pv-doc__copy {
  width: 100%;
  font-size: 13px;
}

/* 横幅 */
.page-privacy .pv-hero__banner {
  margin: clamp(22px, 4vw, 36px) 0 0;
  border: var(--bw) solid var(--graphite);
  box-shadow: var(--shadow-hard);
  background: var(--ink-deep);
  overflow: hidden;
}

.page-privacy .pv-hero__banner img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  object-fit: cover;
  aspect-ratio: 12 / 5;
  filter: saturate(0.85) contrast(1.05);
}

.page-privacy .pv-hero__cap {
  font-family: var(--font-mono);
  font-size: 12px;
  line-height: 1.6;
  color: var(--silver);
  background: var(--ink-2);
  border-top: 1px solid var(--graphite);
  padding: 10px clamp(12px, 2vw, 18px);
}

/* ---------- 正文双栏 ---------- */
.page-privacy .pv-body {
  display: grid;
  gap: clamp(20px, 3.5vw, 40px);
  margin-top: clamp(28px, 5vw, 56px);
  align-items: start;
}

/* 条款索引 */
.page-privacy .pv-index {
  border: var(--bw) solid var(--graphite);
  background: rgba(16, 42, 67, 0.72);
  padding: 16px;
}

.page-privacy .pv-index__title {
  font-family: var(--font-cond);
  font-size: 13px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--silver);
  margin: 0 0 12px;
  padding-bottom: 8px;
  border-bottom: 2px solid var(--orange);
}

.page-privacy .pv-index__list {
  list-style: none;
  margin: 0 0 16px;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px 12px;
}

.page-privacy .pv-index__list a {
  display: flex;
  align-items: baseline;
  gap: 8px;
  text-decoration: none;
  color: #c8d5de;
  font-size: 13px;
  line-height: 1.5;
  padding: 6px 0;
  border-bottom: 1px solid rgba(168, 179, 189, 0.18);
  transition: color 160ms ease, border-color 160ms ease;
}

.page-privacy .pv-index__list a:hover,
.page-privacy .pv-index__list a:focus-visible {
  color: var(--green);
  border-bottom-color: var(--green);
}

.page-privacy .pv-index__num {
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--orange);
  flex: 0 0 auto;
}

.page-privacy .pv-index__cta {
  width: 100%;
  font-size: 14px;
  text-align: center;
}

/* 条款卡 */
.page-privacy .pv-clauses {
  min-width: 0;
  display: grid;
  gap: clamp(14px, 2.4vw, 22px);
}

.page-privacy .pv-clause {
  position: relative;
  background: var(--ink-2);
  border: var(--bw) solid var(--graphite);
  box-shadow: 5px 5px 0 rgba(47, 62, 78, 0.7);
  padding: clamp(18px, 3vw, 30px);
  scroll-margin-top: 96px;
  transition: border-color 200ms ease, box-shadow 200ms ease;
}

.page-privacy .pv-clause:hover {
  box-shadow: 7px 7px 0 rgba(47, 62, 78, 0.85);
}

.page-privacy .pv-clause:target {
  border-color: var(--green);
}

.page-privacy .pv-clause__head {
  display: flex;
  align-items: baseline;
  gap: 12px;
  padding-bottom: 10px;
  margin-bottom: 14px;
  border-bottom: 1px solid rgba(168, 179, 189, 0.25);
}

.page-privacy .pv-clause__num {
  font-family: var(--font-mono);
  font-size: 13px;
  letter-spacing: 0.1em;
  color: var(--orange);
  flex: 0 0 auto;
}

.page-privacy .pv-clause h2 {
  font-family: var(--font-serif);
  font-weight: 800;
  font-size: clamp(19px, 3.2vw, 26px);
  line-height: 1.3;
  margin: 0;
  color: var(--ice);
}

.page-privacy .pv-clause__lead {
  font-size: clamp(14px, 1.6vw, 16px);
  line-height: 1.8;
  color: #cfdce4;
  margin: 0 0 14px;
  max-width: 68ch;
}

.page-privacy .pv-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 10px;
}

.page-privacy .pv-list > li {
  position: relative;
  padding-left: 22px;
  font-size: clamp(14px, 1.6vw, 15.5px);
  line-height: 1.78;
  color: #d7e2e9;
}

.page-privacy .pv-list > li::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 0.78em;
  width: 9px;
  height: 2px;
  background: var(--silver);
}

.page-privacy .pv-em {
  color: var(--mint);
  font-weight: 600;
}

.page-privacy .pv-version {
  font-family: var(--font-mono);
  font-weight: 700;
  color: var(--orange);
  padding: 0 2px;
}

/* 权利条款强调 */
.page-privacy .pv-clause--rights {
  border-left: 5px solid var(--green);
  background:
    linear-gradient(90deg, rgba(46, 230, 166, 0.09), rgba(16, 42, 67, 0) 55%),
    var(--ink-2);
}

.page-privacy .pv-actions {
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px dashed rgba(168, 179, 189, 0.32);
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.page-privacy .pv-actions__note {
  flex: 1 1 100%;
  margin: 4px 0 0;
  font-size: 13px;
  line-height: 1.7;
  color: var(--silver);
}

/* 附录折叠 */
.page-privacy .pv-appendix {
  border: var(--bw) solid var(--graphite);
  background: rgba(16, 42, 67, 0.55);
  scroll-margin-top: 96px;
}

.page-privacy .pv-appendix__summary {
  display: flex;
  align-items: center;
  gap: 12px;
  cursor: pointer;
  padding: clamp(14px, 2.4vw, 20px) clamp(16px, 3vw, 28px);
  list-style: none;
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: clamp(16px, 2.4vw, 20px);
  color: var(--ice);
}

.page-privacy .pv-appendix__summary::-webkit-details-marker {
  display: none;
}

.page-privacy .pv-appendix__summary::after {
  content: "+";
  margin-left: auto;
  font-family: var(--font-mono);
  font-size: 20px;
  color: var(--green);
  line-height: 1;
}

.page-privacy .pv-appendix[open] .pv-appendix__summary {
  border-bottom: 2px solid var(--graphite);
}

.page-privacy .pv-appendix[open] .pv-appendix__summary::after {
  content: "−";
}

.page-privacy .pv-appendix__num {
  font-family: var(--font-mono);
  font-size: 13px;
  color: var(--orange);
}

.page-privacy .pv-appendix__body {
  padding: clamp(16px, 3vw, 26px);
}

.page-privacy .pv-appendix__body p {
  margin: 0 0 12px;
  font-size: clamp(14px, 1.6vw, 15.5px);
  line-height: 1.8;
  color: #cfdce4;
}

/* 相关入口 */
.page-privacy .pv-related {
  margin-top: clamp(12px, 2vw, 18px);
}

.page-privacy .pv-related__title {
  font-family: var(--font-cond);
  font-size: 14px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--silver);
  margin: 0 0 12px;
}

.page-privacy .pv-related__grid {
  display: grid;
  gap: 10px;
}

.page-privacy .pv-related__card {
  display: grid;
  gap: 4px;
  padding: 14px 16px;
  text-decoration: none;
  background: rgba(16, 42, 67, 0.6);
  border: var(--bw) solid var(--graphite);
  box-shadow: 4px 4px 0 rgba(47, 62, 78, 0.6);
  transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.page-privacy .pv-related__card:hover,
.page-privacy .pv-related__card:focus-visible {
  border-color: var(--green);
  transform: translate(-2px, -2px);
  box-shadow: 6px 6px 0 rgba(46, 230, 166, 0.28);
}

.page-privacy .pv-related__num {
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--orange);
}

.page-privacy .pv-related__name {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: 17px;
  color: var(--ice);
}

.page-privacy .pv-related__desc {
  font-size: 13px;
  line-height: 1.65;
  color: var(--silver);
}

/* ---------- 桌面 ---------- */
@media (min-width: 760px) {
  .page-privacy .pv-hero__grid {
    grid-template-columns: minmax(0, 1fr) 288px;
  }

  .page-privacy .pv-related__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1000px) {
  .page-privacy .pv-body {
    grid-template-columns: 244px minmax(0, 1fr);
  }

  .page-privacy .pv-index {
    position: sticky;
    top: 96px;
  }

  .page-privacy .pv-index__list {
    grid-template-columns: minmax(0, 1fr);
  }

  .page-privacy .pv-related__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .page-privacy .pv-clause {
    box-shadow: var(--shadow-hard);
  }
}

@media (prefers-reduced-motion: reduce) {
  .page-privacy .pv-index__list a,
  .page-privacy .pv-clause,
  .page-privacy .pv-related__card {
    transition: none;
  }

  .page-privacy .pv-related__card:hover,
  .page-privacy .pv-related__card:focus-visible {
    transform: none;
  }
}
<<<PAGE_CSS_END>>>
<<<END>>>

wait — I must output exactly the markers:  then . No extra markers. Let me redo final output without the erroneous <<<PAGE_CSS_END>>>.
<main id="main-content" class="page-privacy">
  <div class="wrap">
    <nav class="breadcrumb" aria-label="面包屑">
      <a href="/">首页</a>
      <span class="breadcrumb__sep" aria-hidden="true">/</span>
      <span aria-current="page">个人信息说明</span>
    </nav>
  </div>

  <header class="pv-hero">
    <div class="wrap pv-hero__grid">
      <div class="pv-hero__text" data-reveal>
        <p class="eyebrow">LEGAL · PRIVACY</p>
        <h1>订阅、来信与反馈中的个人信息</h1>
        <p class="pv-hero__lead">
          当您在天博开通订阅、就某一场战报或某一版赛程发来邮件、在站内反馈内容问题时，我们会接触到少量与您相关的信息。
          下面按条款逐项写清这些信息包含什么、被用在哪些环节、保留多久，以及您随时可以要求查询、更正或删除的方式。
        </p>
        <div class="pv-hero__tags">
          <span class="tag">订阅通知偏好</span>
          <span class="tag">客服往来记录</span>
          <span class="tag">页面访问统计</span>
        </div>
      </div>

      <aside class="pv-doc" aria-label="文档标识">
        <p class="pv-doc__label">DOC NO. TB-PP-1.3</p>
        <p class="pv-doc__version">v1.3</p>
        <dl class="pv-doc__list">
          <div class="pv-doc__row">
            <dt>适用对象</dt>
            <dd>订阅用户、来信咨询者、内容反馈者</dd>
          </div>
          <div class="pv-doc__row">
            <dt>涉及渠道</dt>
            <dd>订阅入口、客服邮箱、站内反馈、访问统计</dd>
          </div>
          <div class="pv-doc__row">
            <dt>响应节奏</dt>
            <dd>1 个工作日内给出处理状态</dd>
          </div>
        </dl>
        <button class="btn btn--ghost pv-doc__copy" type="button" data-copy="kefu@world-tianbo.com.cn">复制客服邮箱</button>
      </aside>
    </div>

    <div class="wrap">
      <figure class="pv-hero__banner" data-reveal>
        <img src="{zhanqunpic:h:500w:1200}" width="1200" height="500" alt="冷调抽象数据流、线条锁形与档案编号纹理组成的信息保护视觉图" decoding="async">
        <figcaption class="pv-hero__cap">读者来信与订阅记录按岗位权限归档，客服与运营团队中的指定成员处理。</figcaption>
      </figure>
    </div>
  </header>

  <div class="wrap pv-body">
    <aside class="pv-index" aria-label="条款索引">
      <p class="pv-index__title">条款索引</p>
      <ol class="pv-index__list">
        <li><a href="#clause-01"><span class="pv-index__num">01</span>适用场景</a></li>
        <li><a href="#clause-02"><span class="pv-index__num">02</span>我们会接触到的信息</a></li>
        <li><a href="#clause-03"><span class="pv-index__num">03</span>信息用在哪些环节</a></li>
        <li><a href="#clause-04"><span class="pv-index__num">04</span>保留时间与访问权限</a></li>
        <li><a href="#clause-05"><span class="pv-index__num">05</span>您可以提出的要求</a></li>
        <li><a href="#clause-06"><span class="pv-index__num">06</span>版本更新与联系方式</a></li>
        <li><a href="#clause-appendix"><span class="pv-index__num">附</span>统计与 Cookie</a></li>
      </ol>
      <a class="btn btn--primary pv-index__cta" href="/consult/">联系客服</a>
    </aside>

    <div class="pv-clauses">
      <section class="pv-clause" id="clause-01" data-reveal>
        <div class="pv-clause__head">
          <span class="pv-clause__num">01</span>
          <h2>适用场景</h2>
        </div>
        <p class="pv-clause__lead">
          与天博打交道时，您的信息主要出现在四处：开通订阅、写信咨询、提交内容反馈、正常浏览页面。
          这四类场景都在下面的说明范围之内。
        </p>
        <ul class="pv-list">
          <li>通过订阅入口开通赛季订阅或年度订阅，并选择希望收到的通知类型。</li>
          <li>就战报翻查、赛程排布、阵容变动记录等问题，向客服邮箱发来信件。</li>
          <li>对某一场战报的字段、某一版索引的标注提出更正或补充建议。</li>
          <li>在 PC 端或移动端浏览页面时产生的访问记录，以汇总形式统计。</li>
        </ul>
      </section>

      <section class="pv-clause" id="clause-02" data-reveal>
        <div class="pv-clause__head">
          <span class="pv-clause__num">02</span>
          <h2>我们会接触到的信息</h2>
        </div>
        <p class="pv-clause__lead">
          订阅开通与咨询所需的信息集中在下面几项。您在来信里把轮次、版本号和问题描述写清楚，我们的回复会更快、更准。
        </p>
        <ul class="pv-list">
          <li><span class="pv-em">订阅信息：</span>用于接收通知的邮箱、所选订阅方式，以及赛程提醒、版本变更摘要、阵容变动周报三项通知的开关偏好。</li>
          <li><span class="pv-em">来信内容：</span>您在邮件中写下的称呼、邮箱、电话号码或方便接听的时段，以及问题所涉及的球队、轮次与版本号。</li>
          <li><span class="pv-em">往来记录：</span>为解决同一个问题往返的邮件内容与当前处理状态，便于换人接手时不必让您重复描述。</li>
          <li><span class="pv-em">浏览记录：</span>页面访问量、停留时长、设备与浏览器类型，以不指向具体个人的汇总数据记录。</li>
        </ul>
      </section>

      <section class="pv-clause" id="clause-03" data-reveal>
        <div class="pv-clause__head">
          <span class="pv-clause__num">03</span>
          <h2>信息用在哪些环节</h2>
        </div>
        <p class="pv-clause__lead">
          每一条信息都有明确去处，都指向您能感知到的结果。
        </p>
        <ul class="pv-list">
          <li><span class="pv-em">开通与维护订阅：</span>确认订阅方式，按您勾选的通知类型发出赛程提醒与版本变更摘要。</li>
          <li><span class="pv-em">回复咨询：</span>凭球队、轮次和版本号直接定位到具体场次，减少来回确认的次数。</li>
          <li><span class="pv-em">处理反馈：</span>登记问题、同步处理状态，内容修订完成后回信告知结果。</li>
          <li><span class="pv-em">改进内容：</span>把汇总后的检索与阅读情况用于调整赛程排布方式与索引结构，让常用字段更靠前。</li>
        </ul>
      </section>

      <section class="pv-clause" id="clause-04" data-reveal>
        <div class="pv-clause__head">
          <span class="pv-clause__num">04</span>
          <h2>保留时间与访问权限</h2>
        </div>
        <p class="pv-clause__lead">
          信息留存以完成对应事务为限，过期后按流程清理；能接触到的同事按岗位限定。
        </p>
        <ul class="pv-list">
          <li><span class="pv-em">咨询往来：</span>问题处理完毕后保留 24 个月，便于您就同一话题再次来信时我们有上下文可衔接。</li>
          <li><span class="pv-em">订阅偏好：</span>保留至您撤回订阅或要求删除为止。</li>
          <li><span class="pv-em">访问统计：</span>以汇总形式保留 13 个月，用于观察赛季阶段性的阅读变化。</li>
          <li><span class="pv-em">访问权限：</span>客服与运营团队中承担订阅管理与来信回复的成员按岗位开放；账号随人员变动即时回收。</li>
          <li><span class="pv-em">校对流程：</span>编辑初校、数据复核、发布抽检针对的是赛事字段本身，读者来信与订阅记录在另一套权限下流转，抽检环节不调取个人联系方式。</li>
        </ul>
      </section>

      <section class="pv-clause pv-clause--rights" id="clause-05" data-reveal>
        <div class="pv-clause__head">
          <span class="pv-clause__num">05</span>
          <h2>您可以提出的要求</h2>
        </div>
        <p class="pv-clause__lead">
          下面几件事写一封邮件即可办理，收件人是我们唯一的客服邮箱。请写清订阅邮箱或来信时使用的邮箱，便于我们找到对应记录。
        </p>
        <ul class="pv-list">
          <li><span class="pv-em">查询：</span>告知想了解的记录范围，例如订阅开通时间、通知偏好或某次咨询的往来记录。</li>
          <li><span class="pv-em">更正：</span>订阅邮箱写错、电话号码变更，回信说明新的信息即可完成更新。</li>
          <li><span class="pv-em">删除：</span>不再需要相关记录时提出，除依法需要留存的往来凭证外，我们会按流程清理。</li>
          <li><span class="pv-em">调整通知：</span>可以只保留赛程提醒，关掉版本变更摘要与阵容变动周报；也可以整体退订，由您决定。</li>
        </ul>
        <div class="pv-actions">
          <a class="btn btn--primary" href="mailto:kefu@world-tianbo.com.cn">发送邮件</a>
          <button class="btn btn--ghost" type="button" data-copy="kefu@world-tianbo.com.cn">复制客服邮箱</button>
          <p class="pv-actions__note">用户反馈平均在 1 个工作日内给出处理状态，复杂问题在 3 个工作日内给出方案；工作日 9:00-18:00 内回复。</p>
        </div>
      </section>

      <section class="pv-clause" id="clause-06" data-reveal>
        <div class="pv-clause__head">
          <span class="pv-clause__num">06</span>
          <h2>版本更新与联系方式</h2>
        </div>
        <p class="pv-clause__lead">
          本说明当前版本为 <span class="pv-version">v1.3</span>。条款调整后，我们会在此处更新版本号，并在订阅通知中把改动要点告诉订阅用户。
        </p>
        <ul class="pv-list">
          <li><span class="pv-em">客服邮箱：</span>kefu@world-tianbo.com.cn</li>
          <li><span class="pv-em">客服电话：</span>400-9764-4386；如需电话沟通，请在邮件中留下联系方式与方便接听时段，我们会按您给出的时间回拨。</li>
          <li><span class="pv-em">联系地址：</span>辽宁省大连市沙河口区中山路688号天博数字大厦12层；该地址仅作为站点联系地址展示。</li>
          <li><span class="pv-em">备案信息：</span>辽ICP备37902206号</li>
        </ul>
      </section>

      <details class="pv-appendix" id="clause-appendix" data-reveal>
        <summary class="pv-appendix__summary">
          <span class="pv-appendix__num">附</span>
          <span class="pv-appendix__title">附录：页面统计与 Cookie 的使用</span>
        </summary>
        <div class="pv-appendix__body">
          <p>浏览天博时，页面会在您的浏览器中写入少量本地存储，用来记住您上一次选择的筛选条件、表格排序方式和阅读偏好。清空浏览器数据后，这些偏好需要重新选择一次。</p>
          <ul class="pv-list">
            <li>统计用于了解 PC 端与移动端的阅读分布、哪些赛季阶段的内容被反复翻查，从而判断赛程排布与索引的呈现顺序。</li>
            <li>统计数据以汇总形式呈现，用于形成月活跃读者规模、阅读占比等指标，不用于还原单个读者的浏览路径。</li>
            <li>您可以在浏览器设置中关闭本地存储，页面正文、战报翻查与赛程视图仍可正常使用，只是需要每次重新选择筛选条件。</li>
          </ul>
        </div>
      </details>

      <section class="pv-related" aria-label="相关入口">
        <h2 class="pv-related__title">接下来可以看</h2>
        <div class="pv-related__grid">
          <a class="pv-related__card" href="/tutorial/">
            <span class="pv-related__num">01</span>
            <span class="pv-related__name">使用教程</span>
            <span class="pv-related__desc">战报翻查、订阅入口定位与反馈提交的操作步骤。</span>
          </a>
          <a class="pv-related__card" href="/agreement/">
            <span class="pv-related__num">02</span>
            <span class="pv-related__name">用户协议</span>
            <span class="pv-related__desc">内容使用许可、订阅行为规范与转载规则。</span>
          </a>
          <a class="pv-related__card" href="/consult/">
            <span class="pv-related__num">03</span>
            <span class="pv-related__name">咨询服务</span>
            <span class="pv-related__desc">订阅开通、使用问题与合作洽谈的联系入口。</span>
          </a>
          <a class="pv-related__card" href="/">
            <span class="pv-related__num">04</span>
            <span class="pv-related__name">返回首页</span>
            <span class="pv-related__desc">从主场门户进入最新战报与赛程视图。</span>
          </a>
        </div>
      </section>
    </div>
  </div>
</main>

.page-privacy {
  background: var(--ink);
  color: var(--ice);
  padding-bottom: clamp(48px, 8vw, 96px);
}

.page-privacy .breadcrumb {
  padding-top: clamp(16px, 3vw, 28px);
  color: var(--silver);
  font-size: 13px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.page-privacy .breadcrumb a {
  color: var(--silver);
  text-decoration: none;
  border-bottom: 1px solid rgba(168, 179, 189, 0.4);
}

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

.page-privacy .breadcrumb .breadcrumb__sep {
  color: var(--graphite);
}

/* ---------- 首屏 ---------- */
.page-privacy .pv-hero {
  position: relative;
  padding: clamp(22px, 4vw, 44px) 0 clamp(24px, 4vw, 44px);
  background:
    radial-gradient(circle at 84% 8%, rgba(46, 230, 166, 0.14), transparent 58%),
    radial-gradient(circle at 6% 92%, rgba(255, 122, 26, 0.12), transparent 52%),
    repeating-linear-gradient(90deg, rgba(168, 179, 189, 0.055) 0 1px, transparent 1px 72px);
  border-bottom: var(--bw) solid var(--graphite);
}

.page-privacy .pv-hero__grid {
  display: grid;
  gap: clamp(20px, 4vw, 36px);
  align-items: start;
}

.page-privacy .pv-hero__text .eyebrow {
  color: var(--mint);
  font-family: var(--font-cond);
  letter-spacing: 0.18em;
  font-size: 13px;
  margin: 0 0 10px;
}

.page-privacy .pv-hero h1 {
  font-family: var(--font-serif);
  font-weight: 900;
  font-size: clamp(28px, 6.4vw, 58px);
  line-height: 1.18;
  letter-spacing: -0.01em;
  margin: 0 0 16px;
  color: var(--ice);
}

.page-privacy .pv-hero__lead {
  font-size: clamp(15px, 1.7vw, 17px);
  line-height: 1.8;
  color: #cfdce4;
  max-width: 62ch;
  margin: 0 0 18px;
}

.page-privacy .pv-hero__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.page-privacy .pv-hero__tags .tag {
  font-family: var(--font-mono);
  font-size: 12px;
  padding: 4px 10px;
  color: var(--silver);
  border: 1px solid var(--graphite);
  background: rgba(16, 42, 67, 0.7);
}

/* 文档标识卡 */
.page-privacy .pv-doc {
  border: var(--bw) solid var(--graphite);
  background: var(--ink-2);
  box-shadow: var(--shadow-hard);
  padding: clamp(16px, 3vw, 22px);
  clip-path: polygon(0 0, 100% 0, 100% 88%, 92% 100%, 0 100%);
}

.page-privacy .pv-doc__label {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  color: var(--silver);
  margin: 0 0 6px;
}

.page-privacy .pv-doc__version {
  font-family: var(--font-mono);
  font-weight: 700;
  font-size: clamp(34px, 7vw, 48px);
  line-height: 1;
  color: var(--orange);
  margin: 0 0 16px;
}

.page-privacy .pv-doc__list {
  margin: 0 0 18px;
  display: grid;
  gap: 10px;
}

.page-privacy .pv-doc__row {
  border-top: 1px solid rgba(168, 179, 189, 0.22);
  padding-top: 8px;
}

.page-privacy .pv-doc__row dt {
  font-family: var(--font-cond);
  font-size: 12px;
  letter-spacing: 0.1em;
  color: var(--green);
  margin-bottom: 3px;
}

.page-privacy .pv-doc__row dd {
  margin: 0;
  font-size: 13px;
  line-height: 1.6;
  color: #cbd8e1;
}

.page-privacy .pv-doc__copy {
  width: 100%;
  font-size: 13px;
}

/* 横幅 */
.page-privacy .pv-hero__banner {
  margin: clamp(22px, 4vw, 36px) 0 0;
  border: var(--bw) solid var(--graphite);
  box-shadow: var(--shadow-hard);
  background: var(--ink-deep);
  overflow: hidden;
}

.page-privacy .pv-hero__banner img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  object-fit: cover;
  aspect-ratio: 12 / 5;
  filter: saturate(0.85) contrast(1.05);
}

.page-privacy .pv-hero__cap {
  font-family: var(--font-mono);
  font-size: 12px;
  line-height: 1.6;
  color: var(--silver);
  background: var(--ink-2);
  border-top: 1px solid var(--graphite);
  padding: 10px clamp(12px, 2vw, 18px);
}

/* ---------- 正文双栏 ---------- */
.page-privacy .pv-body {
  display: grid;
  gap: clamp(20px, 3.5vw, 40px);
  margin-top: clamp(28px, 5vw, 56px);
  align-items: start;
}

/* 条款索引 */
.page-privacy .pv-index {
  border: var(--bw) solid var(--graphite);
  background: rgba(16, 42, 67, 0.72);
  padding: 16px;
}

.page-privacy .pv-index__title {
  font-family: var(--font-cond);
  font-size: 13px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--silver);
  margin: 0 0 12px;
  padding-bottom: 8px;
  border-bottom: 2px solid var(--orange);
}

.page-privacy .pv-index__list {
  list-style: none;
  margin: 0 0 16px;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px 12px;
}

.page-privacy .pv-index__list a {
  display: flex;
  align-items: baseline;
  gap: 8px;
  text-decoration: none;
  color: #c8d5de;
  font-size: 13px;
  line-height: 1.5;
  padding: 6px 0;
  border-bottom: 1px solid rgba(168, 179, 189, 0.18);
  transition: color 160ms ease, border-color 160ms ease;
}

.page-privacy .pv-index__list a:hover,
.page-privacy .pv-index__list a:focus-visible {
  color: var(--green);
  border-bottom-color: var(--green);
}

.page-privacy .pv-index__num {
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--orange);
  flex: 0 0 auto;
}

.page-privacy .pv-index__cta {
  width: 100%;
  font-size: 14px;
  text-align: center;
}

/* 条款卡 */
.page-privacy .pv-clauses {
  min-width: 0;
  display: grid;
  gap: clamp(14px, 2.4vw, 22px);
}

.page-privacy .pv-clause {
  position: relative;
  background: var(--ink-2);
  border: var(--bw) solid var(--graphite);
  box-shadow: 5px 5px 0 rgba(47, 62, 78, 0.7);
  padding: clamp(18px, 3vw, 30px);
  scroll-margin-top: 96px;
  transition: border-color 200ms ease, box-shadow 200ms ease;
}

.page-privacy .pv-clause:hover {
  box-shadow: 7px 7px 0 rgba(47, 62, 78, 0.85);
}

.page-privacy .pv-clause:target {
  border-color: var(--green);
}

.page-privacy .pv-clause__head {
  display: flex;
  align-items: baseline;
  gap: 12px;
  padding-bottom: 10px;
  margin-bottom: 14px;
  border-bottom: 1px solid rgba(168, 179, 189, 0.25);
}

.page-privacy .pv-clause__num {
  font-family: var(--font-mono);
  font-size: 13px;
  letter-spacing: 0.1em;
  color: var(--orange);
  flex: 0 0 auto;
}

.page-privacy .pv-clause h2 {
  font-family: var(--font-serif);
  font-weight: 800;
  font-size: clamp(19px, 3.2vw, 26px);
  line-height: 1.3;
  margin: 0;
  color: var(--ice);
}

.page-privacy .pv-clause__lead {
  font-size: clamp(14px, 1.6vw, 16px);
  line-height: 1.8;
  color: #cfdce4;
  margin: 0 0 14px;
  max-width: 68ch;
}

.page-privacy .pv-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 10px;
}

.page-privacy .pv-list > li {
  position: relative;
  padding-left: 22px;
  font-size: clamp(14px, 1.6vw, 15.5px);
  line-height: 1.78;
  color: #d7e2e9;
}

.page-privacy .pv-list > li::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 0.78em;
  width: 9px;
  height: 2px;
  background: var(--silver);
}

.page-privacy .pv-em {
  color: var(--mint);
  font-weight: 600;
}

.page-privacy .pv-version {
  font-family: var(--font-mono);
  font-weight: 700;
  color: var(--orange);
  padding: 0 2px;
}

/* 权利条款强调 */
.page-privacy .pv-clause--rights {
  border-left: 5px solid var(--green);
  background:
    linear-gradient(90deg, rgba(46, 230, 166, 0.09), rgba(16, 42, 67, 0) 55%),
    var(--ink-2);
}

.page-privacy .pv-actions {
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px dashed rgba(168, 179, 189, 0.32);
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.page-privacy .pv-actions__note {
  flex: 1 1 100%;
  margin: 4px 0 0;
  font-size: 13px;
  line-height: 1.7;
  color: var(--silver);
}

/* 附录折叠 */
.page-privacy .pv-appendix {
  border: var(--bw) solid var(--graphite);
  background: rgba(16, 42, 67, 0.55);
  scroll-margin-top: 96px;
}

.page-privacy .pv-appendix__summary {
  display: flex;
  align-items: center;
  gap: 12px;
  cursor: pointer;
  padding: clamp(14px, 2.4vw, 20px) clamp(16px, 3vw, 28px);
  list-style: none;
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: clamp(16px, 2.4vw, 20px);
  color: var(--ice);
}

.page-privacy .pv-appendix__summary::-webkit-details-marker {
  display: none;
}

.page-privacy .pv-appendix__summary::after {
  content: "+";
  margin-left: auto;
  font-family: var(--font-mono);
  font-size: 20px;
  color: var(--green);
  line-height: 1;
}

.page-privacy .pv-appendix[open] .pv-appendix__summary {
  border-bottom: 2px solid var(--graphite);
}

.page-privacy .pv-appendix[open] .pv-appendix__summary::after {
  content: "−";
}

.page-privacy .pv-appendix__num {
  font-family: var(--font-mono);
  font-size: 13px;
  color: var(--orange);
}

.page-privacy .pv-appendix__body {
  padding: clamp(16px, 3vw, 26px);
}

.page-privacy .pv-appendix__body p {
  margin: 0 0 12px;
  font-size: clamp(14px, 1.6vw, 15.5px);
  line-height: 1.8;
  color: #cfdce4;
}

/* 相关入口 */
.page-privacy .pv-related {
  margin-top: clamp(12px, 2vw, 18px);
}

.page-privacy .pv-related__title {
  font-family: var(--font-cond);
  font-size: 14px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--silver);
  margin: 0 0 12px;
}

.page-privacy .pv-related__grid {
  display: grid;
  gap: 10px;
}

.page-privacy .pv-related__card {
  display: grid;
  gap: 4px;
  padding: 14px 16px;
  text-decoration: none;
  background: rgba(16, 42, 67, 0.6);
  border: var(--bw) solid var(--graphite);
  box-shadow: 4px 4px 0 rgba(47, 62, 78, 0.6);
  transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.page-privacy .pv-related__card:hover,
.page-privacy .pv-related__card:focus-visible {
  border-color: var(--green);
  transform: translate(-2px, -2px);
  box-shadow: 6px 6px 0 rgba(46, 230, 166, 0.28);
}

.page-privacy .pv-related__num {
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--orange);
}

.page-privacy .pv-related__name {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: 17px;
  color: var(--ice);
}

.page-privacy .pv-related__desc {
  font-size: 13px;
  line-height: 1.65;
  color: var(--silver);
}

/* ---------- 桌面 ---------- */
@media (min-width: 760px) {
  .page-privacy .pv-hero__grid {
    grid-template-columns: minmax(0, 1fr) 288px;
  }

  .page-privacy .pv-related__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1000px) {
  .page-privacy .pv-body {
    grid-template-columns: 244px minmax(0, 1fr);
  }

  .page-privacy .pv-index {
    position: sticky;
    top: 96px;
  }

  .page-privacy .pv-index__list {
    grid-template-columns: minmax(0, 1fr);
  }

  .page-privacy .pv-related__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .page-privacy .pv-clause {
    box-shadow: var(--shadow-hard);
  }
}

@media (prefers-reduced-motion: reduce) {
  .page-privacy .pv-index__list a,
  .page-privacy .pv-clause,
  .page-privacy .pv-related__card {
    transition: none;
  }

  .page-privacy .pv-related__card:hover,
  .page-privacy .pv-related__card:focus-visible {
    transform: none;
  }
}