.page-disclaimer {
  --legal-notch: 14px;
  --legal-rule: rgba(216, 180, 90, 0.22);
  --legal-fill: rgba(216, 180, 90, 0.08);
}

.page-disclaimer .legal-hero {
  padding-bottom: clamp(28px, 5vw, 48px);
}

.page-disclaimer .legal-hero__frame {
  position: relative;
  display: grid;
  gap: 20px;
  margin-top: 18px;
  padding: clamp(18px, 3.4vw, 36px);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background-color: var(--ink-night);
  background-image:
    linear-gradient(165deg, rgba(18, 53, 43, 0.72), rgba(5, 19, 15, 0.35) 72%),
    repeating-linear-gradient(90deg, var(--line-soft) 0 1px, transparent 1px 72px),
    repeating-linear-gradient(0deg, var(--line-soft) 0 1px, transparent 1px 72px);
  overflow: hidden;
}

.page-disclaimer .legal-hero__frame::after {
  content: "";
  position: absolute;
  top: 0;
  left: clamp(18px, 3.4vw, 36px);
  width: 104px;
  height: 3px;
  border-radius: 0 0 3px 3px;
  background-image: linear-gradient(90deg, var(--gold), rgba(216, 180, 90, 0));
}

.page-disclaimer .legal-hero__copy .lead {
  margin-bottom: 0;
}

.page-disclaimer .legal-hero__media {
  margin: 0;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  overflow: hidden;
  background-color: var(--panel-green);
}

.page-disclaimer .legal-hero__media img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  object-fit: cover;
}

.page-disclaimer .sheet-head {
  max-width: 46rem;
}

.page-disclaimer .sheet-head h2 {
  margin-bottom: 10px;
}

.page-disclaimer .sheet-head__note {
  margin: 0;
  color: var(--text-dim);
  font-size: 15px;
  line-height: 1.8;
}

.page-disclaimer .sheet-split {
  display: grid;
  gap: 18px;
  margin-top: 26px;
}

.page-disclaimer .sheet-axis {
  display: none;
  position: relative;
}

.page-disclaimer .sheet-axis::before {
  content: "";
  position: absolute;
  top: 8px;
  bottom: 8px;
  left: 50%;
  width: 2px;
  margin-left: -1px;
  background-image: repeating-linear-gradient(
    to bottom,
    var(--gold-line) 0 8px,
    transparent 8px 16px
  );
}

.page-disclaimer .sheet-axis span {
  position: absolute;
  left: 50%;
  width: 10px;
  height: 10px;
  margin-left: -5px;
  border-radius: 50%;
  background-color: var(--gold);
  box-shadow: 0 0 0 4px rgba(216, 180, 90, 0.14);
}

.page-disclaimer .sheet-axis span:nth-child(1) { top: 12%; }
.page-disclaimer .sheet-axis span:nth-child(2) { top: 50%; }
.page-disclaimer .sheet-axis span:nth-child(3) { top: 86%; }

.page-disclaimer .sheet-col {
  padding: clamp(20px, 3.2vw, 30px);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background-image: linear-gradient(178deg, var(--panel-green), rgba(10, 33, 26, 0.55));
}

.page-disclaimer .sheet-col__title {
  margin: 0 0 18px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line-soft);
  color: var(--gold-bright);
  font-size: 19px;
  line-height: 1.5;
  letter-spacing: -0.01em;
}

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

.page-disclaimer .prep-item {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
}

.page-disclaimer .prep-item::before {
  content: "";
  width: 18px;
  height: 18px;
  margin-top: 5px;
  border: 1px solid var(--gold-line);
  border-radius: 6px;
  background-color: var(--legal-fill);
}

.page-disclaimer .prep-item p {
  margin: 0;
  color: var(--text-dim);
  font-size: 15px;
  line-height: 1.78;
}

.page-disclaimer .prep-item strong {
  color: var(--text-bright);
  font-weight: 700;
}

.page-disclaimer .order-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.page-disclaimer .order-step {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  gap: 14px;
  padding: 14px 0;
  border-bottom: 1px dashed var(--line-soft);
}

.page-disclaimer .order-step:first-child {
  padding-top: 0;
}

.page-disclaimer .order-step:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.page-disclaimer .num-block {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 10px;
  font-family: var(--font-mono);
  font-size: 14px;
  font-weight: 700;
  color: var(--ink-night);
  background-image: linear-gradient(150deg, var(--neon-cyan), #1fa894);
  box-shadow: 0 6px 18px rgba(57, 224, 200, 0.18);
}

.page-disclaimer .order-step__body p {
  margin: 0;
}

.page-disclaimer .order-step__title {
  margin-bottom: 4px !important;
  color: var(--text-bright);
  font-size: 16px;
  font-weight: 700;
}

.page-disclaimer .order-step__body p + p {
  color: var(--text-dim);
  font-size: 15px;
  line-height: 1.78;
}

.page-disclaimer .legal-slab {
  position: relative;
  padding: clamp(26px, 4.5vw, 48px);
  clip-path: polygon(
    0 var(--legal-notch),
    100% 0,
    100% calc(100% - var(--legal-notch)),
    0 100%
  );
  background-color: var(--panel-green);
  background-image: linear-gradient(152deg, var(--panel-lift), var(--panel-green) 68%, rgba(10, 33, 26, 0.92));
}

.page-disclaimer .legal-slab h2 {
  margin-bottom: 6px;
}

.page-disclaimer .legal-slab__annot {
  position: absolute;
  right: 12px;
  top: 34%;
  writing-mode: vertical-rl;
  font-size: 12px;
  letter-spacing: 0.22em;
  color: rgba(216, 180, 90, 0.5);
  pointer-events: none;
}

.page-disclaimer .quote-list {
  margin: 22px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.page-disclaimer .quote-item {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 16px;
  padding: 18px 0;
  border-top: 1px solid var(--line-soft);
}

.page-disclaimer .quote-item:last-child {
  border-bottom: 1px solid var(--line-soft);
}

.page-disclaimer .quote-item__mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border: 1px solid var(--gold-line);
  border-radius: var(--radius-sm);
  color: var(--gold);
  font-size: 14px;
  letter-spacing: 0;
}

.page-disclaimer .quote-item__title {
  margin: 0 0 4px;
  color: var(--gold-bright);
  font-size: 16px;
  font-weight: 700;
}

.page-disclaimer .quote-item__desc {
  margin: 0;
  color: var(--text-dim);
  font-size: 15px;
  line-height: 1.78;
}

.page-disclaimer .ext-note {
  position: relative;
  margin-top: 22px;
  padding: clamp(22px, 3.4vw, 34px) clamp(22px, 3.4vw, 40px);
  padding-left: clamp(30px, 5vw, 56px);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background-color: var(--panel-green);
  overflow: hidden;
}

.page-disclaimer .ext-note::before {
  content: "";
  position: absolute;
  left: 0;
  top: 16%;
  bottom: 16%;
  width: 4px;
  border-radius: 0 999px 999px 0;
  background-image: linear-gradient(var(--neon-violet), var(--gold));
}

.page-disclaimer .ext-note p {
  margin: 0 0 12px;
  color: var(--text-bright);
  font-size: 16px;
  line-height: 1.82;
}

.page-disclaimer .ext-note p:last-child {
  margin-bottom: 0;
}

.page-disclaimer .route-list {
  margin: 22px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 14px;
}

.page-disclaimer .route-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  padding: 18px 22px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background-color: var(--panel-green);
}

.page-disclaimer .route-item .tag {
  justify-self: start;
}

.page-disclaimer .route-item p {
  margin: 0;
  color: var(--text-bright);
  font-size: 15px;
  line-height: 1.78;
}

.page-disclaimer .hint-strip {
  margin-top: 24px;
  padding: 20px 24px;
  border: 1px dashed var(--gold-line);
  border-radius: var(--radius-md);
  background-color: var(--legal-fill);
}

.page-disclaimer .hint-strip__title {
  margin: 0 0 6px;
  color: var(--gold-bright);
  font-size: 16px;
  font-weight: 700;
}

.page-disclaimer .hint-strip p:last-child {
  margin: 0;
  color: var(--text-dim);
  font-size: 15px;
  line-height: 1.78;
}

.page-disclaimer .ext-note a,
.page-disclaimer .route-item a,
.page-disclaimer .hint-strip a {
  color: var(--gold-bright);
  text-decoration: none;
  border-bottom: 1px solid var(--gold-line);
  padding-bottom: 1px;
}

.page-disclaimer .ext-note a:hover,
.page-disclaimer .route-item a:hover,
.page-disclaimer .hint-strip a:hover {
  border-bottom-color: var(--gold);
}

.page-disclaimer .legal-tail {
  display: flex;
  justify-content: center;
  margin-top: 34px;
  padding-top: 28px;
  border-top: 1px solid var(--line-soft);
}

@media (max-width: 899px) {
  .page-disclaimer .legal-slab__annot {
    display: none;
  }
}

@media (min-width: 760px) {
  .page-disclaimer .route-item {
    grid-template-columns: 108px minmax(0, 1fr);
    align-items: center;
    gap: 18px;
  }

  .page-disclaimer .route-item:nth-child(2) {
    margin-left: 4%;
  }

  .page-disclaimer .route-item:nth-child(3) {
    margin-left: 8%;
  }
}

@media (min-width: 900px) {
  .page-disclaimer {
    --legal-notch: 24px;
  }

  .page-disclaimer .legal-hero__frame {
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    align-items: end;
    gap: 36px;
  }

  .page-disclaimer .legal-slab {
    clip-path: polygon(
      0 calc(var(--legal-notch) * 1.5),
      100% 0,
      100% calc(100% - var(--legal-notch) * 1.5),
      0 100%
    );
  }
}

@media (min-width: 980px) {
  .page-disclaimer .sheet-split {
    grid-template-columns: minmax(0, 1fr) 52px minmax(0, 1fr);
    gap: 0;
    align-items: stretch;
  }

  .page-disclaimer .sheet-axis {
    display: block;
  }

  .page-disclaimer .sheet-col:first-child {
    border-top-right-radius: var(--radius-sm);
    border-bottom-right-radius: var(--radius-sm);
  }

  .page-disclaimer .sheet-col:last-child {
    border-top-left-radius: var(--radius-sm);
    border-bottom-left-radius: var(--radius-sm);
  }
}
<<<END>>>

<main id="main-content" class="page-privacy">

  <section class="section privacy-hero">
    <div class="container">
      <nav class="breadcrumb" aria-label="当前页面位置">
        <ol>
          <li><a href="/">首页</a></li>
          <li aria-current="page">隐私政策</li>
        </ol>
      </nav>

      <div class="privacy-hero__frame" data-reveal-group>
        <div class="privacy-hero__copy" data-reveal>
          <p class="eyebrow">隐私政策 · 坐标 P-07</p>
          <h1 class="title-xl">你的档案编号、咨询记录与邀请码，各自怎么被处理</h1>
          <p class="lead">澳门电玩城牌局只在你主动提供时才收集信息，用来把入口问题说清楚、把老玩法找回来。下面逐类说明收什么、留多久、你随时能怎么处理，读完大概两分钟。</p>
        </div>
        <figure class="privacy-hero__media frame-media frame-media--4x3" data-reveal>
          <img src="{zhanqunpic:h:600w:800}" width="800" height="600" alt="近景拍摄的棋牌桌面与一枚筹码，灯光偏暗金，边缘有反射" decoding="async">
          <figcaption class="frame-media__cap">桌面上的那点记录，只在需要时留下。</figcaption>
        </figure>
      </div>
    </div>
  </section>

  <section class="section section--panel" id="collect">
    <div class="container">
      <header class="privacy-head" data-reveal>
        <p class="eyebrow">01 / 收哪些</p>
        <h2 class="title-lg">四类信息，来源各个不同</h2>
        <p class="privacy-head__note">每类信息都对应一个你能看到的具体用途，没有用途就不会留下。</p>
      </header>

      <ul class="data-list" data-reveal-group>
        <li class="data-item" data-reveal>
          <span class="data-item__idx mono">01</span>
          <div class="data-item__body">
            <p class="data-item__title">档案编号</p>
            <p class="data-item__desc">你在站内找回常用玩法时用到的编号，由系统在你第一次建档时生成，一共 21,400 份老用户档案都靠它索引。编号本身不含你的姓名、证件或支付信息。</p>
          </div>
        </li>
        <li class="data-item" data-reveal>
          <span class="data-item__idx mono">02</span>
          <div class="data-item__body">
            <p class="data-item__title">咨询内容</p>
            <p class="data-item__desc">你通过客服邮箱或电话提出的入口指引、版本对照问题，以及你主动附上的截图说明。客服按问题归档，用于回复本人和后续同类问题的处理参考。</p>
          </div>
        </li>
        <li class="data-item" data-reveal>
          <span class="data-item__idx mono">03</span>
          <div class="data-item__body">
            <p class="data-item__title">邀请码记录</p>
            <p class="data-item__desc">你为约老用户同桌开局生成的 6 位邀请码，记录生成时间与使用状态。邀请码生成后 30 分钟内有效，过期后记录不再被调用。</p>
          </div>
        </li>
        <li class="data-item" data-reveal>
          <span class="data-item__idx mono">04</span>
          <div class="data-item__body">
            <p class="data-item__title">设备与访问偏好</p>
            <p class="data-item__desc">你的访问设备类型、屏幕方向与所选玩法分类，用来决定给你看哪一版步骤卡。移动端用户默认看到 4 步路径，桌面端默认看到 5 步路径。</p>
          </div>
        </li>
      </ul>
    </div>
  </section>

  <section class="section" id="purpose">
    <div class="container">
      <header class="privacy-head" data-reveal>
        <p class="eyebrow">02 / 怎么用</p>
        <h2 class="title-lg">留下信息的三个用途</h2>
      </header>

      <ol class="purpose-track" data-reveal-group>
        <li class="purpose-step" data-reveal>
          <span class="purpose-step__badge mono">A</span>
          <h3 class="purpose-step__title">把入口问题答清楚</h3>
          <p>你带上账号、版本编号和卡住的那一步来问，客服不用来回追问，一次就能给出可照做的回复。这项用途占全部咨询的 41%，移动端相关问题最常见。</p>
        </li>
        <li class="purpose-step" data-reveal>
          <span class="purpose-step__badge mono">B</span>
          <h3 class="purpose-step__title">把你的常用玩法找回来</h3>
          <p>老用户凭档案编号回到固定玩法，不用重新选一遍分类。编号只关联玩法偏好与版本阶段，不关联任何对局结果。</p>
        </li>
        <li class="purpose-step" data-reveal>
          <span class="purpose-step__badge mono">C</span>
          <h3 class="purpose-step__title">让约局这一步接得上</h3>
          <p>生成邀请码后把它发给老朋友，对方在有效期内输入即可进同一房间。邀请码到期自动失效，不需要你手动清理。</p>
        </li>
      </ol>
    </div>
  </section>

  <section class="section section--teal" id="retention">
    <div class="container">
      <header class="privacy-head" data-reveal>
        <p class="eyebrow">03 / 留多久</p>
        <h2 class="title-lg">保存期限与访问统计</h2>
      </header>

      <div class="retention-grid" data-reveal-group>
        <div class="retention-card" data-reveal>
          <h3 class="retention-card__title">保存期限</h3>
          <ul class="retention-list">
            <li><span class="mono">档案编号</span>在你主动申请注销前持续保留。</li>
            <li><span class="mono">咨询记录</span>自最后一次回复起保留 12 个月，到期清理。</li>
            <li><span class="mono">邀请码记录</span>生成后 30 分钟内有效，失效后即刻归档。</li>
            <li><span class="mono">设备偏好</span>按浏览器本地设置保存，清空浏览器数据即清除。</li>
          </ul>
        </div>

        <div class="retention-card" data-reveal>
          <h3 class="retention-card__title">Cookie 与访问统计</h3>
          <p>站内使用必要的本地存储来记住你的设备类型与玩法偏好，让下一次打开直接落在对的那一版步骤卡上。访问统计以汇总形式呈现，用于判断哪些入口说明需要重写，不用于识别到个人。</p>
          <p>你可以在浏览器设置里随时清除这些本地数据，清除后需要重新选择一次设备与玩法，其余功能不受影响。</p>
        </div>
      </div>
    </div>
  </section>

  <section class="section" id="rights">
    <div class="container">
      <header class="privacy-head" data-reveal>
        <p class="eyebrow">04 / 你的权利</p>
        <h2 class="title-lg">查看、更正、删除，三种要求都可以提</h2>
      </header>

      <div class="rights-panel" data-reveal>
        <ul class="rights-list">
          <li class="rights-item">
            <span class="rights-item__mark"></span>
            <p><strong>查看</strong>：想确认站内留了哪些内容，提出来即可，客服会把与你档案编号相关的记录整理后告知。</p>
          </li>
          <li class="rights-item">
            <span class="rights-item__mark"></span>
            <p><strong>更正</strong>：账号、常用玩法或版本阶段填错了，可以申请更正，更正后入口步骤会按新信息重新匹配。</p>
          </li>
          <li class="rights-item">
            <span class="rights-item__mark"></span>
            <p><strong>删除</strong>：申请注销档案编号后，相关编号与偏好信息一并清除，此后需要重新建档。</p>
          </li>
        </ul>
        <p class="rights-panel__foot">三种要求都可以通过 <a href="/consult/">咨询入口</a> 提出。客服邮箱与电话在工作日 10:00–22:00 内回复，只处理入口指引与版本对照相关咨询，其他问题会转告对应渠道。</p>
      </div>

      <div class="privacy-tail">
        <a class="btn btn-primary" href="/help/">查看帮助中心</a>
        <a class="btn btn-ghost" href="/legal/">阅读使用说明</a>
      </div>
    </div>
  </section>

</main>

.page-privacy {
  --pv-notch: 14px;
  --pv-rule: rgba(164, 107, 255, 0.22);
  --pv-fill: rgba(164, 107, 255, 0.08);
}

.page-privacy .privacy-hero {
  padding-bottom: clamp(28px, 5vw, 48px);
}

.page-privacy .privacy-hero__frame {
  position: relative;
  display: grid;
  gap: 20px;
  margin-top: 18px;
  padding: clamp(18px, 3.4vw, 36px);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background-color: var(--ink-night);
  background-image:
    linear-gradient(150deg, rgba(15, 42, 58, 0.78), rgba(5, 19, 15, 0.4) 74%),
    repeating-linear-gradient(90deg, var(--line-soft) 0 1px, transparent 1px 64px);
  overflow: hidden;
}

.page-privacy .privacy-hero__frame::after {
  content: "";
  position: absolute;
  top: 0;
  right: clamp(18px, 3.4vw, 36px);
  width: 128px;
  height: 3px;
  border-radius: 0 0 3px 3px;
  background-image: linear-gradient(270deg, var(--neon-violet), rgba(164, 107, 255, 0));
}

.page-privacy .privacy-hero__copy .lead {
  margin-bottom: 0;
}

.page-privacy .privacy-hero__media {
  margin: 0;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  overflow: hidden;
  background-color: var(--panel-green);
}

.page-privacy .privacy-hero__media img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  object-fit: cover;
}

.page-privacy .privacy-head {
  max-width: 44rem;
}

.page-privacy .privacy-head h2 {
  margin-bottom: 10px;
}

.page-privacy .privacy-head__note {
  margin: 0;
  color: var(--text-dim);
  font-size: 15px;
  line-height: 1.8;
}

.page-privacy .data-list {
  margin: 26px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 12px;
}

.page-privacy .data-item {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 16px;
  padding: 18px 20px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background-image: linear-gradient(120deg, var(--panel-green), rgba(10, 33, 26, 0.5));
}

.page-privacy .data-item__idx {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border: 1px solid var(--pv-rule);
  border-radius: var(--radius-sm);
  color: var(--neon-violet);
  font-size: 14px;
}

.page-privacy .data-item__title {
  margin: 0 0 4px;
  color: var(--text-bright);
  font-size: 16px;
  font-weight: 700;
}

.page-privacy .data-item__desc {
  margin: 0;
  color: var(--text-dim);
  font-size: 15px;
  line-height: 1.78;
}

.page-privacy .purpose-track {
  margin: 26px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 14px;
}

.page-privacy .purpose-step {
  position: relative;
  padding: 20px 22px 22px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background-color: var(--panel-green);
}

.page-privacy .purpose-step__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  margin-bottom: 10px;
  border-radius: 50%;
  background-image: linear-gradient(150deg, var(--neon-violet), #6f3ec4);
  color: var(--text-bright);
  font-size: 13px;
  font-weight: 700;
}

.page-privacy .purpose-step__title {
  margin: 0 0 6px;
  color: var(--gold-bright);
  font-size: 17px;
  line-height: 1.5;
}

.page-privacy .purpose-step p {
  margin: 0;
  color: var(--text-dim);
  font-size: 15px;
  line-height: 1.78;
}

.page-privacy .retention-grid {
  margin-top: 26px;
  display: grid;
  gap: 16px;
}

.page-privacy .retention-card {
  padding: clamp(20px, 3.2vw, 30px);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background-color: var(--panel-green);
}

.page-privacy .retention-card__title {
  margin: 0 0 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--line-soft);
  color: var(--gold-bright);
  font-size: 18px;
}

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

.page-privacy .retention-list li {
  color: var(--text-dim);
  font-size: 15px;
  line-height: 1.75;
}

.page-privacy .retention-list .mono {
  display: inline-block;
  margin-right: 8px;
  padding: 2px 8px;
  border-radius: 999px;
  background-color: var(--pv-fill);
  color: var(--gold-bright);
  font-size: 13px;
}

.page-privacy .retention-card p {
  margin: 0 0 12px;
  color: var(--text-dim);
  font-size: 15px;
  line-height: 1.78;
}

.page-privacy .retention-card p:last-child {
  margin-bottom: 0;
}

.page-privacy .rights-panel {
  margin-top: 26px;
  padding: clamp(22px, 3.6vw, 36px);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  border-left: 4px solid var(--gold);
  background-color: var(--panel-green);
}

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

.page-privacy .rights-item {
  display: grid;
  grid-template-columns: 16px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}

.page-privacy .rights-item__mark {
  width: 14px;
  height: 14px;
  margin-top: 6px;
  border-radius: 50%;
  background-color: var(--gold);
  box-shadow: 0 0 0 4px rgba(216, 180, 90, 0.12);
}

.page-privacy .rights-item p {
  margin: 0;
  color: var(--text-dim);
  font-size: 15px;
  line-height: 1.78;
}

.page-privacy .rights-item strong {
  color: var(--text-bright);
}

.page-privacy .rights-panel__foot {
  margin: 22px 0 0;
  padding-top: 18px;
  border-top: 1px dashed var(--line-soft);
  color: var(--text-dim);
  font-size: 15px;
  line-height: 1.78;
}

.page-privacy .rights-panel__foot a {
  color: var(--gold-bright);
  text-decoration: none;
  border-bottom: 1px solid var(--gold-line);
}

.page-privacy .rights-panel__foot a:hover {
  border-bottom-color: var(--gold);
}

.page-privacy .privacy-tail {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
  margin-top: 34px;
  padding-top: 28px;
  border-top: 1px solid var(--line-soft);
}

@media (min-width: 760px) {
  .page-privacy .data-item {
    grid-template-columns: 52px minmax(0, 1fr);
    align-items: center;
    gap: 20px;
    padding: 20px 26px;
  }

  .page-privacy .data-item:nth-child(even) {
    margin-left: 4%;
  }

  .page-privacy .retention-grid {
    grid-template-columns: minmax(0, 6fr) minmax(0, 5fr);
    gap: 20px;
  }
}

@media (min-width: 900px) {
  .page-privacy {
    --pv-notch: 22px;
  }

  .page-privacy .privacy-hero__frame {
    grid-template-columns: minmax(0, 7fr) minmax(0, 4fr);
    align-items: end;
    gap: 40px;
  }

  .page-privacy .purpose-track {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
  }

  .page-privacy .purpose-step {
    border-radius: var(--radius-md);
  }

  .page-privacy .purpose-step:nth-child(1) {
    margin-right: 18px;
  }

  .page-privacy .purpose-step:nth-child(2) {
    margin-top: 22px;
    margin-right: 18px;
  }

  .page-privacy .purpose-step:nth-child(3) {
    margin-top: 44px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .page-privacy .rights-item__mark {
    box-shadow: none;
  }
}
<<<END>>>