.page-privacy {
  --pr-toc-width: 238px;
  --pr-ink-soft: #141A20;
}

.page-privacy .privacy-hero {
  position: relative;
  padding: clamp(20px, 4vw, 32px) 0 clamp(28px, 5vw, 52px);
  border-bottom: 1px solid var(--im-graphite);
  background-image:
    linear-gradient(155deg, rgba(53, 240, 180, 0.09), rgba(7, 9, 11, 0) 46%),
    repeating-linear-gradient(90deg, rgba(138, 151, 163, 0.07) 0 1px, rgba(7, 9, 11, 0) 1px 92px);
}

.page-privacy .privacy-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(22px, 4vw, 36px);
  margin-top: clamp(16px, 3vw, 26px);
}

.page-privacy .privacy-hero__intro h1 {
  margin: 10px 0 0;
  font-family: var(--im-font-display);
  font-size: clamp(34px, 6.4vw, 62px);
  line-height: 1.03;
  letter-spacing: -0.02em;
  color: var(--im-white);
}

.page-privacy .privacy-lead {
  margin: 16px 0 0;
  max-width: 46ch;
  font-size: 16px;
  line-height: 1.85;
  color: var(--im-text-dim);
}

.page-privacy .privacy-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 20px 0 0;
  padding: 0;
  list-style: none;
}

.page-privacy .privacy-hero__media {
  margin: 0;
  border: 1px solid var(--im-graphite);
  background: var(--im-night);
  padding: 8px 8px 0;
}

.page-privacy .privacy-hero__media img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  object-fit: cover;
  aspect-ratio: 16 / 9;
  background: var(--im-graphite);
}

.page-privacy .privacy-hero__media figcaption {
  padding: 10px 4px 12px;
  font-family: var(--im-font-mono);
  font-size: 12px;
  line-height: 1.6;
  letter-spacing: 0.02em;
  color: var(--im-cool);
}

.page-privacy .doc-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(22px, 4vw, 40px);
  padding: clamp(28px, 5vw, 60px) 0 clamp(40px, 7vw, 84px);
}

.page-privacy .doc-toc {
  border: 1px solid var(--im-graphite);
  background: var(--im-night);
  padding: 16px 18px 18px;
}

.page-privacy .doc-toc__title {
  margin: 0 0 12px;
  font-family: var(--im-font-mono);
  font-size: 12px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--im-mint);
}

.page-privacy .doc-toc ol {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 2px 12px;
}

.page-privacy .doc-toc a {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 8px 6px;
  border-left: 2px solid rgba(27, 34, 41, 1);
  font-size: 14px;
  line-height: 1.5;
  color: var(--im-text-dim);
  text-decoration: none;
  transition: color 0.18s ease, border-color 0.18s ease, background-color 0.18s ease;
}

.page-privacy .doc-toc a b {
  font-family: var(--im-font-mono);
  font-weight: 500;
  font-size: 12px;
  color: var(--im-cool);
  transition: color 0.18s ease;
}

.page-privacy .doc-toc a:hover,
.page-privacy .doc-toc a:focus-visible {
  color: var(--im-white);
  border-left-color: var(--im-mint);
  background: rgba(53, 240, 180, 0.06);
}

.page-privacy .doc-toc a:hover b,
.page-privacy .doc-toc a:focus-visible b {
  color: var(--im-mint);
}

.page-privacy .doc-toc a:focus-visible {
  outline: 2px solid var(--im-mint);
  outline-offset: 2px;
}

.page-privacy .doc-body {
  min-width: 0;
}

.page-privacy .clause {
  padding: clamp(22px, 3.4vw, 34px) 0;
  border-top: 1px solid var(--im-graphite);
}

.page-privacy .clause:first-child {
  border-top: 0;
  padding-top: 0;
}

.page-privacy .clause__head {
  display: flex;
  align-items: baseline;
  gap: 14px;
  margin-bottom: 14px;
}

.page-privacy .clause__num {
  flex: none;
  font-family: var(--im-font-mono);
  font-size: 12px;
  letter-spacing: 0.08em;
  color: var(--im-mint);
  border: 1px solid rgba(53, 240, 180, 0.38);
  padding: 2px 7px;
}

.page-privacy .clause h2 {
  margin: 0;
  font-family: var(--im-font-display);
  font-size: clamp(21px, 3.1vw, 29px);
  line-height: 1.28;
  letter-spacing: -0.01em;
  color: var(--im-white);
}

.page-privacy .clause p {
  margin: 0 0 14px;
  max-width: 72ch;
  font-size: 16px;
  line-height: 1.85;
  color: var(--im-text);
}

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

.page-privacy .clause a {
  color: var(--im-blue);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.page-privacy .clause a:hover,
.page-privacy .clause a:focus-visible {
  color: var(--im-mint);
}

.page-privacy .rule-list {
  margin: 0 0 16px;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 10px;
  max-width: 74ch;
}

.page-privacy .rule-list li {
  position: relative;
  padding-left: 26px;
  font-size: 15.5px;
  line-height: 1.8;
  color: var(--im-text);
}

.page-privacy .rule-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.72em;
  width: 11px;
  height: 2px;
  background: var(--im-mint);
}

.page-privacy .rule-list b {
  color: var(--im-white);
  font-weight: 600;
}

.page-privacy .side-note {
  max-width: 72ch;
  margin: 0;
  padding: 10px 0 10px 16px;
  border-left: 2px solid var(--im-blue);
  font-size: 14px;
  line-height: 1.8;
  color: var(--im-cool);
}

.page-privacy .callout {
  max-width: 74ch;
  margin: 4px 0 20px;
  padding: 16px 18px;
  background: var(--im-paper);
  color: var(--pr-ink-soft);
  border-left: 4px solid var(--im-orange);
}

.page-privacy .callout p {
  margin: 0;
  max-width: none;
  font-size: 15px;
  line-height: 1.8;
  color: var(--pr-ink-soft);
}

.page-privacy .callout strong {
  color: #07090B;
  font-weight: 700;
}

.page-privacy .im-acc {
  max-width: 74ch;
  margin: 0;
  border-top: 1px solid var(--im-graphite);
}

.page-privacy .im-acc__item {
  border-bottom: 1px solid var(--im-graphite);
}

.page-privacy .im-acc__item h3 {
  margin: 0;
  font-size: inherit;
  font-weight: inherit;
}

.page-privacy .im-acc__trigger {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 14px;
  padding: 15px 2px;
  background: none;
  border: 0;
  text-align: left;
  cursor: pointer;
  font-family: var(--im-font-body);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.6;
  color: var(--im-white);
  transition: color 0.18s ease;
}

.page-privacy .im-acc__trigger::after {
  content: "+";
  font-family: var(--im-font-mono);
  font-weight: 400;
  color: var(--im-mint);
}

.page-privacy .im-acc__trigger[aria-expanded="true"]::after {
  content: "–";
}

.page-privacy .im-acc__trigger:hover,
.page-privacy .im-acc__trigger:focus-visible {
  color: var(--im-mint);
}

.page-privacy .im-acc__trigger:focus-visible {
  outline: 2px solid var(--im-mint);
  outline-offset: 2px;
}

.page-privacy .im-acc__panel {
  padding: 0 0 16px;
}

.page-privacy .im-acc__panel p {
  margin: 0;
  max-width: 68ch;
  font-size: 15px;
  line-height: 1.82;
  color: var(--im-text-dim);
}

.page-privacy .contact-list {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  max-width: 74ch;
  margin: 0 0 18px;
  padding: 16px 18px;
  border: 1px solid var(--im-graphite);
  background: var(--im-night);
}

.page-privacy .contact-list dt {
  font-family: var(--im-font-mono);
  font-size: 12px;
  letter-spacing: 0.14em;
  color: var(--im-cool);
}

.page-privacy .contact-list dd {
  margin: 0;
  font-size: 15.5px;
  line-height: 1.6;
  color: var(--im-text);
  overflow-wrap: anywhere;
}

@media (min-width: 640px) {
  .page-privacy .contact-list {
    grid-template-columns: max-content minmax(0, 1fr);
    column-gap: 24px;
    row-gap: 12px;
  }

  .page-privacy .contact-list dt {
    padding-top: 4px;
  }
}

@media (min-width: 920px) {
  .page-privacy .privacy-hero__grid {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
    align-items: end;
  }

  .page-privacy .doc-shell {
    grid-template-columns: minmax(0, var(--pr-toc-width)) minmax(0, 1fr);
    gap: clamp(36px, 5vw, 76px);
    align-items: start;
  }

  .page-privacy .doc-toc {
    position: sticky;
    top: 112px;
    max-height: calc(100vh - 148px);
    overflow-y: auto;
  }

  .page-privacy .doc-toc ol {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (prefers-reduced-motion: reduce) {
  .page-privacy .doc-toc a,
  .page-privacy .im-acc__trigger {
    transition: none;
  }
}

@media print {
  .page-privacy .privacy-hero {
    background-image: none;
    border-bottom: 1px solid #999;
    padding: 0 0 12px;
  }

  .page-privacy .privacy-hero__media,
  .page-privacy .doc-toc {
    display: none;
  }

  .page-privacy .doc-shell {
    display: block;
    padding: 12px 0 0;
  }

  .page-privacy .clause h2,
  .page-privacy .clause p,
  .page-privacy .rule-list li,
  .page-privacy .rule-list b,
  .page-privacy .im-acc__panel p,
  .page-privacy .contact-list dd {
    color: #000;
  }

  .page-privacy .clause p,
  .page-privacy .rule-list li,
  .page-privacy .im-acc__panel p {
    max-width: none;
    font-size: 11pt;
    line-height: 1.6;
  }

  .page-privacy .clause {
    border-top: 1px solid #bbb;
    page-break-inside: avoid;
  }

  .page-privacy .callout {
    background: #F2EEE4;
    border-left: 4px solid #FF6B2C;
  }

  .page-privacy .contact-list {
    border: 1px solid #bbb;
    background: none;
  }

  .page-privacy .im-acc__panel {
    display: block !important;
  }

  .page-privacy .im-acc__trigger::after {
    display: none;
  }
}


<main id="main-content" class="page-privacy">
  <section class="privacy-hero">
    <div class="im-wrap">
      <nav class="im-crumbs" aria-label="面包屑">
        <a href="/">首页</a>
        <span aria-hidden="true">/</span>
        <span aria-current="page">数据保护</span>
      </nav>
      <div class="privacy-hero__grid">
        <div class="privacy-hero__intro">
          <p class="im-kicker">DATA PROTECTION · v3.2</p>
          <h1>你的信息，由你决定怎么用</h1>
          <p class="privacy-lead">IM电竞馆在提供赛事检索、版本对照与小屏约看服务时，会接触到你的部分个人信息。这份说明写清楚我们收集什么、为什么收集、保留多久，以及你可以怎样查询、更正或删除。</p>
          <ul class="privacy-chips">
            <li class="im-tag im-tag--mint">适用 v3.2</li>
            <li class="im-tag">账号与检索记录</li>
            <li class="im-tag">约看咨询</li>
            <li class="im-tag">客服沟通</li>
          </ul>
        </div>
        <figure class="privacy-hero__media">
          <img src="{zhanqunpic:h:900w:1600}" width="1600" height="900" alt="深色背景上的数据档案网格与锁定标识抽象图" loading="lazy" decoding="async">
        </figure>
      </div>
    </div>
  </section>

  <div class="im-wrap">
    <div class="doc-shell">
      <aside class="doc-toc" aria-label="条款目录">
        <p class="doc-toc__title">条款目录</p>
        <ol>
          <li><a href="#scope"><b>01</b><span>说明覆盖哪些服务</span></a></li>
          <li><a href="#collect"><b>02</b><span>我们会接触哪些信息</span></a></li>
          <li><a href="#purpose"><b>03</b><span>信息用在哪里</span></a></li>
          <li><a href="#sharing"><b>04</b><span>与谁共享、怎样约束</span></a></li>
          <li><a href="#retention"><b>05</b><span>保存多久、如何保护</span></a></li>
          <li><a href="#rights"><b>06</b><span>查询、更正与删除</span></a></li>
          <li><a href="#minors"><b>07</b><span>未成年用户须知</span></a></li>
          <li><a href="#contact"><b>08</b><span>联系与投诉</span></a></li>
        </ol>
      </aside>

      <div class="doc-body">
        <article class="clause" id="scope">
          <div class="clause__head">
            <span class="clause__num">01</span>
            <h2>说明覆盖哪些服务</h2>
          </div>
          <p>这份说明适用于你在检索工具网页端、桌面客户端、小屏轻应用上的使用行为，也适用于通过客服邮箱与电话进行的约看咨询与内容合作沟通。</p>
          <p>当检索工具更新至新版本，本说明会同步调整。当前适用的版本为 v3.2。</p>
        </article>

        <article class="clause" id="collect">
          <div class="clause__head">
            <span class="clause__num">02</span>
            <h2>我们会接触哪些信息</h2>
          </div>
          <ul class="rule-list">
            <li><b>账号信息：</b>注册时填写的昵称、邮箱，以及你设置的密码。</li>
            <li><b>检索记录：</b>你使用过的分类标签、筛选条件与查看过的版本对照条目。</li>
            <li><b>约看咨询：</b>你提交的场次、点位、设备偏好与联系方式。</li>
            <li><b>客服沟通：</b>你通过邮箱或电话提供的文字、截图与问题描述。</li>
          </ul>
          <p>我们不主动收集与上述场景无关的信息。若你在邮件中主动附上截图，截图中的内容会作为沟通记录的一部分被保存。</p>
        </article>

        <article class="clause" id="purpose">
          <div class="clause__head">
            <span class="clause__num">03</span>
            <h2>信息用在哪里</h2>
          </div>
          <p>我们基于以下目的处理你的信息，每一项都对应你在使用中能感知到的具体功能。</p>
          <ul class="rule-list">
            <li><b>提供检索服务：</b>根据你的标签选择返回赛事分类结果，并在你下次访问时恢复上次的筛选状态。</li>
            <li><b>安排小屏观赛：</b>把你的场次与设备需求传递给对应观赛点，完成约看确认。</li>
            <li><b>处理咨询与售后：</b>回复你关于版本对照、旧版射门统计查询或设备适配的问题。</li>
            <li><b>改进产品体验：</b>统计检索工具的使用情况，优化标签命名和页面布局。</li>
          </ul>
          <p>当需要将信息用于上述目的之外的新场景时，我们会先取得你的同意。<a href="/terms/">使用条款</a>中列明了与数据处理相关的其余约定。</p>
        </article>

        <article class="clause" id="sharing">
          <div class="clause__head">
            <span class="clause__num">04</span>
            <h2>与谁共享、怎样约束</h2>
          </div>
          <p>我们不会出售你的个人信息。在以下必要情况下，信息会被共享给第三方，且限于完成对应事项所需的最小范围。</p>
          <ul class="rule-list">
            <li><b>合作观赛点：</b>为完成约看，我们会把场次、设备需求与你的联系方式提供给对应观赛点的对接人。</li>
            <li><b>技术服务商：</b>邮件发送、数据存储等基础服务由受托方提供，我们通过协议要求其仅按我们的指示处理信息。</li>
            <li><b>法律要求：</b>当法律法规或监管机构要求时，我们会依法提供必要信息。</li>
          </ul>
          <p>我们与14家电竞媒体、6家高校电竞社团和9家场馆运营方的合作以内容为主，不涉及把你的账号信息提供给合作方。</p>
        </article>

        <article class="clause" id="retention">
          <div class="clause__head">
            <span class="clause__num">05</span>
            <h2>保存多久、如何保护</h2>
          </div>
          <p>账号信息在你使用服务期间持续保存，注销账号后按流程删除。检索记录保留最近12个月，约看咨询与客服沟通记录在事项办结后保留24个月。</p>
          <p>我们采用访问控制、传输加密与操作日志记录等措施保护信息安全。只有因工作需要接触相关信息的团队成员才能访问对应数据，团队共20人，其中内容编辑12人、数据校验8人。</p>
          <div class="callout">
            <p><strong>关于 v3.2 适配清单：</strong>清单中涉及的检查点仅用于确认检索工具在小屏设备上的显示与操作是否正常，不涉及收集新的个人信息字段。</p>
          </div>
        </article>

        <article class="clause" id="rights">
          <div class="clause__head">
            <span class="clause__num">06</span>
            <h2>查询、更正与删除</h2>
          </div>
          <p>你可以随时就自己的个人信息行使以下权利。点击展开查看具体操作方式。</p>
          <div data-accordion="single">
            <div class="im-acc">
              <div class="im-acc__item">
                <h3><button class="im-acc__trigger" data-acc-trigger aria-expanded="false" aria-controls="right-query">查询我的个人信息</button></h3>
                <div class="im-acc__panel" id="right-query">
                  <p>发邮件至客服邮箱，注明你的账号邮箱与查询范围，我们会整理后回复。</p>
                </div>
              </div>
              <div class="im-acc__item">
                <h3><button class="im-acc__trigger" data-acc-trigger aria-expanded="false" aria-controls="right-fix">更正不准确的信息</button></h3>
                <div class="im-acc__panel" id="right-fix">
                  <p>若昵称、邮箱等信息有误，邮件说明需要更正的内容即可，核实后我们会更新记录。</p>
                </div>
              </div>
              <div class="im-acc__item">
                <h3><button class="im-acc__trigger" data-acc-trigger aria-expanded="false" aria-controls="right-delete">删除信息与注销账号</button></h3>
                <div class="im-acc__panel" id="right-delete">
                  <p>你可以要求删除检索记录、约看记录或整个账号。注销账号后，账号下的个人信息将按流程清除。</p>
                </div>
              </div>
              <div class="im-acc__item">
                <h3><button class="im-acc__trigger" data-acc-trigger aria-expanded="false" aria-controls="right-withdraw">撤回同意</button></h3>
                <div class="im-acc__panel" id="right-withdraw">
                  <p>对于基于同意处理的信息，你可以随时撤回同意。撤回不影响此前已完成的处理。</p>
                </div>
              </div>
            </div>
          </div>
        </article>

        <article class="clause" id="minors">
          <div class="clause__head">
            <span class="clause__num">07</span>
            <h2>未成年用户须知</h2>
          </div>
          <p>如果你未满18周岁，请在监护人陪同下阅读本说明，并在监护人同意后使用需要提交个人信息的服务，例如小屏观赛约看。</p>
          <p>若我们发现在未取得监护人同意的情况下收集了未成年人信息，会尽快删除相关记录。监护人可通过下方联系方式提出删除请求。</p>
        </article>

        <article class="clause" id="contact">
          <div class="clause__head">
            <span class="clause__num">08</span>
            <h2>联系与投诉</h2>
          </div>
          <p>关于个人信息处理有疑问或投诉，可通过以下渠道联系我们。工作日9:00-18:00内回复，建议在邮件中说明具体问题并附上相关截图或链接。</p>
          <dl class="contact-list">
            <dt>客服邮箱</dt>
            <dd>service@esports-im-hub.com.cn</dd>
            <dt>联系电话</dt>
            <dd>13923944005</dd>
            <dt>联系地址</dt>
            <dd>黑龙江省哈尔滨市南岗区学府路247号</dd>
            <dt>备案号</dt>
            <dd>黑ICP备11714149号</dd>
          </dl>
          <p>如需了解网站内容与工具的使用规则，请参阅<a href="/terms/">使用条款</a>；如需咨询约看或合作事宜，请前往<a href="/contact-us/">联系我们</a>；也可返回<a href="/">首页</a>继续浏览。</p>
        </article>
      </div>
    </div>
  </div>
</main>

.page-privacy {
  --toc-width: 240px;
  --toc-top: 120px;
  --clause-gap: clamp(28px, 4vw, 48px);
}

.page-privacy .privacy-hero {
  position: relative;
  padding: clamp(32px, 5vw, 56px) 0 clamp(24px, 4vw, 40px);
  border-bottom: 1px solid var(--im-graphite);
  background:
    radial-gradient(ellipse 80% 60% at 15% 10%, rgba(53, 240, 180, 0.08), transparent 60%),
    radial-gradient(ellipse 50% 40% at 90% 90%, rgba(127, 182, 255, 0.06), transparent 70%),
    var(--im-ink);
}

.page-privacy .privacy-hero__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(24px, 4vw, 44px);
  margin-top: clamp(20px, 3vw, 32px);
}

.page-privacy .privacy-hero__intro {
  max-width: 640px;
}

.page-privacy .privacy-hero__intro h1 {
  margin: 12px 0 0;
  font-family: var(--im-font-display);
  font-size: clamp(32px, 5vw, 60px);
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: var(--im-white);
}

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

.page-privacy .privacy-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 22px 0 0;
  padding: 0;
  list-style: none;
}

.page-privacy .privacy-hero__media {
  margin: 0;
  border: 1px solid var(--im-graphite);
  background: var(--im-night);
  padding: 10px;
  border-radius: 2px;
}

.page-privacy .privacy-hero__media img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  object-fit: cover;
  aspect-ratio: 16 / 9;
  background: var(--im-graphite);
  border-radius: 1px;
}

.page-privacy .doc-shell {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(20px, 3vw, 40px);
  padding: clamp(32px, 5vw, 56px) 0 clamp(48px, 8vw, 96px);
}

.page-privacy .doc-toc {
  border: 1px solid var(--im-graphite);
  background: var(--im-night);
  padding: 18px 16px;
  border-radius: 2px;
}

.page-privacy .doc-toc__title {
  margin: 0 0 12px;
  font-family: var(--im-font-mono);
  font-size: 12px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--im-mint);
}

.page-privacy .doc-toc ol {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 2px;
}

.page-privacy .doc-toc a {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 7px 8px;
  font-size: 14px;
  line-height: 1.5;
  color: var(--im-text-dim);
  text-decoration: none;
  border-left: 2px solid transparent;
  transition: color 0.18s ease, border-color 0.18s ease, background-color 0.18s ease;
}

.page-privacy .doc-toc a b {
  font-family: var(--im-font-mono);
  font-size: 12px;
  font-weight: 500;
  color: var(--im-cool);
  transition: color 0.18s ease;
}

.page-privacy .doc-toc a:hover,
.page-privacy .doc-toc a:focus-visible {
  color: var(--im-white);
  border-left-color: var(--im-mint);
  background: rgba(53, 240, 180, 0.07);
}

.page-privacy .doc-toc a:hover b,
.page-privacy .doc-toc a:focus-visible b {
  color: var(--im-mint);
}

.page-privacy .doc-toc a:focus-visible {
  outline: 2px solid var(--im-mint);
  outline-offset: 2px;
}

.page-privacy .doc-body {
  min-width: 0;
}

.page-privacy .clause {
  padding: clamp(24px, 3.5vw, 40px) 0;
  border-top: 1px solid var(--im-graphite);
}

.page-privacy .clause:first-child {
  border-top: 0;
  padding-top: 0;
}

.page-privacy .clause__head {
  display: flex;
  align-items: baseline;
  gap: 14px;
  margin-bottom: 16px;
}

.page-privacy .clause__num {
  font-family: var(--im-font-mono);
  font-size: 13px;
  font-weight: 500;
  color: var(--im-mint);
  flex-shrink: 0;
  letter-spacing: 0.04em;
}

.page-privacy .clause h2 {
  margin: 0;
  font-family: var(--im-font-display);
  font-size: clamp(20px, 2.6vw, 28px);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.01em;
  color: var(--im-white);
}

.page-privacy .clause p {
  margin: 0 0 14px;
  font-size: 15.5px;
  line-height: 1.85;
  color: var(--im-text);
  max-width: 72ch;
}

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

.page-privacy .clause a {
  color: var(--im-blue);
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color 0.18s ease;
}

.page-privacy .clause a:hover {
  color: var(--im-mint);
}

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

.page-privacy .rule-list li {
  position: relative;
  padding-left: 22px;
  font-size: 15px;
  line-height: 1.8;
  color: var(--im-text);
}

.page-privacy .rule-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.62em;
  width: 8px;
  height: 8px;
  border-radius: 1px;
  background: rgba(53, 240, 180, 0.32);
  border: 1px solid var(--im-mint);
}

.page-privacy .rule-list b {
  font-weight: 500;
  color: var(--im-white);
}

.page-privacy .callout {
  margin: 18px 0;
  padding: 20px 22px;
  background: var(--im-paper);
  border-left: 3px solid var(--im-orange);
  border-radius: 2px;
  max-width: 72ch;
}

.page-privacy .callout p {
  margin: 0;
  font-size: 15px;
  line-height: 1.8;
  color: #1B2229;
}

.page-privacy .callout strong {
  color: #07090B;
  font-weight: 600;
}

.page-privacy .im-acc {
  margin-top: 8px;
  border: 1px solid var(--im-graphite);
  border-radius: 2px;
  overflow: hidden;
}

.page-privacy .im-acc__item + .im-acc__item {
  border-top: 1px solid var(--im-graphite);
}

.page-privacy .im-acc__item h3 {
  margin: 0;
  font-size: inherit;
  font-weight: inherit;
}

.page-privacy .im-acc__trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 15px 18px;
  background: var(--im-night);
  border: none;
  color: var(--im-text);
  font-family: var(--im-font-body);
  font-size: 15px;
  line-height: 1.5;
  text-align: left;
  cursor: pointer;
  transition: background-color 0.18s ease, color 0.18s ease;
}

.page-privacy .im-acc__trigger::after {
  content: "＋";
  font-family: var(--im-font-mono);
  font-size: 16px;
  color: var(--im-cool);
  transition: transform 0.2s ease, color 0.18s ease;
}

.page-privacy .im-acc__trigger:hover {
  background: #131A21;
  color: var(--im-white);
}

.page-privacy .im-acc__trigger:hover::after {
  color: var(--im-mint);
}

.page-privacy .im-acc__trigger[aria-expanded="true"] {
  background: #131A21;
  color: var(--im-mint);
}

.page-privacy .im-acc__trigger[aria-expanded="true"]::after {
  content: "−";
  color: var(--im-mint);
}

.page-privacy .im-acc__trigger:focus-visible {
  outline: 2px solid var(--im-mint);
  outline-offset: -2px;
}

.page-privacy .im-acc__panel {
  padding: 4px 18px 16px;
  background: var(--im-night);
}

.page-privacy .im-acc__panel p {
  margin: 0;
  font-size: 14.5px;
  line-height: 1.8;
  color: var(--im-text-dim);
  max-width: 66ch;
}

.page-privacy .contact-list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px 16px;
  margin: 18px 0;
  padding: 20px 22px;
  background: var(--im-paper);
  border-radius: 2px;
  max-width: 72ch;
}

.page-privacy .contact-list dt {
  font-family: var(--im-font-mono);
  font-size: 12px;
  letter-spacing: 0.08em;
  color: #5A6470;
}

.page-privacy .contact-list dd {
  margin: 0 0 8px;
  font-family: var(--im-font-mono);
  font-size: 14px;
  line-height: 1.6;
  color: #0E1318;
  word-break: break-word;
}

.page-privacy .contact-list dd:last-child {
  margin-bottom: 0;
}

@media (min-width: 920px) {
  .page-privacy .privacy-hero__grid {
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
    align-items: end;
  }

  .page-privacy .doc-shell {
    grid-template-columns: var(--toc-width) minmax(0, 1fr);
    align-items: start;
    gap: clamp(32px, 4vw, 56px);
  }

  .page-privacy .doc-toc {
    position: sticky;
    top: var(--toc-top);
    max-height: calc(100vh - var(--toc-top) - 32px);
    overflow-y: auto;
  }

  .page-privacy .contact-list {
    grid-template-columns: max-content 1fr;
  }

  .page-privacy .contact-list dd {
    margin-bottom: 0;
    align-self: center;
  }
}

@media (prefers-reduced-motion: reduce) {
  .page-privacy .doc-toc a,
  .page-privacy .doc-toc a b,
  .page-privacy .im-acc__trigger,
  .page-privacy .im-acc__trigger::after,
  .page-privacy .clause a {
    transition: none;
  }

  .page-privacy .im-acc__trigger::after {
    transform: none;
  }
}

@media print {
  .page-privacy .privacy-hero {
    background: none;
    border-bottom: 1px solid #999;
    padding: 0 0 12px;
  }

  .page-privacy .privacy-hero__media,
  .page-privacy .privacy-chips,
  .page-privacy .doc-toc {
    display: none;
  }

  .page-privacy .doc-shell {
    display: block;
    padding: 16px 0;
  }

  .page-privacy .clause,
  .page-privacy .clause p,
  .page-privacy .clause h2,
  .page-privacy .rule-list li,
  .page-privacy .rule-list b,
  .page-privacy .im-acc__trigger,
  .page-privacy .im-acc__panel p,
  .page-privacy .contact-list dd {
    color: #000;
    background: none;
  }

  .page-privacy .callout {
    background: #F2EEE4;
    border-left: 2px solid #333;
  }

  .page-privacy .callout p,
  .page-privacy .callout strong {
    color: #000;
  }

  .page-privacy .contact-list {
    background: none;
    border: 1px solid #999;
  }

  .page-privacy .im-acc {
    border: 1px solid #999;
  }

  .page-privacy .im-acc__panel {
    display: block !important;
    padding: 4px 12px 12px;
  }

  .page-privacy .im-acc__trigger {
    padding: 8px 12px;
    border-bottom: 1px solid #ccc;
  }

  .page-privacy .im-acc__trigger::after {
    display: none;
  }

  .page-privacy .clause {
    page-break-inside: avoid;
    border-top: 1px solid #ccc;
  }
}
<<<END>>>
