.page-community {
  background: var(--color-surface);
  color: var(--color-ink);
}

/* ---------- 面包屑 ---------- */
.page-community .breadcrumb {
  max-width: var(--container);
  margin-inline: auto;
  padding: var(--space-3) var(--space-3) var(--space-2);
  font-size: var(--text-sm);
  color: var(--color-ink-muted);
}
.page-community .breadcrumb a {
  color: var(--color-ink-soft);
  text-decoration: none;
  border-bottom: var(--border-thin) solid transparent;
  transition: color 120ms linear, border-color 120ms linear;
}
.page-community .breadcrumb a:hover,
.page-community .breadcrumb a:focus-visible {
  color: var(--color-primary);
  border-bottom-color: var(--color-primary);
}

/* ---------- 首屏 ---------- */
.page-community .cm-hero {
  position: relative;
  background: var(--color-surface);
}
.page-community .cm-hero__plate {
  position: relative;
  overflow: hidden;
  background: var(--color-contrast-surface);
  color: var(--color-contrast-ink);
}
.page-community .cm-hero__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.4;
}
.page-community .cm-hero__scrim {
  position: absolute;
  inset: 0;
  background: var(--overlay-scrim);
}
.page-community .cm-hero__body {
  position: relative;
  z-index: 1;
  max-width: var(--container);
  margin-inline: auto;
  padding: var(--space-6) var(--space-3) var(--space-8);
  display: grid;
  gap: var(--space-3);
}
.page-community .cm-hero__eyebrow {
  color: var(--color-contrast-ink);
  opacity: 0.72;
  margin: 0;
}
.page-community .cm-hero__title {
  margin: 0;
  font-family: var(--font-heading);
  font-size: var(--text-display);
  font-weight: var(--weight-heading);
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
  color: var(--color-contrast-ink);
  max-width: 14ch;
}
.page-community .cm-hero__lede {
  margin: 0;
  max-width: var(--measure);
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-contrast-ink);
  opacity: 0.88;
}
.page-community .cm-hero__stats {
  list-style: none;
  margin: var(--space-3) 0 0;
  padding: var(--space-3) 0 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-2);
  border-top: var(--border-thin) solid var(--color-contrast-line);
}
.page-community .cm-stat {
  display: grid;
  gap: var(--space-1);
  min-width: 0;
}
.page-community .cm-stat__num {
  display: flex;
  align-items: baseline;
  gap: var(--space-1);
  flex-wrap: wrap;
}
.page-community .cm-stat .figure-num {
  font-family: var(--font-mono);
  font-size: var(--text-2xl);
  line-height: 1;
  color: var(--color-contrast-ink);
  transition: color 120ms linear;
}
.page-community .cm-stat:hover .figure-num {
  color: var(--color-contrast-accent);
}
.page-community .cm-stat__unit {
  font-size: var(--text-sm);
  color: var(--color-contrast-ink);
  opacity: 0.75;
}
.page-community .cm-stat__label {
  color: var(--color-contrast-ink);
  opacity: 0.7;
  margin: 0;
}

.page-community .cm-hero__peek {
  background: var(--color-surface);
  border-top: var(--border-thin) solid var(--color-line);
  border-left: 2px solid var(--color-primary);
  padding: var(--space-4) var(--space-3) var(--space-4) var(--space-4);
  display: grid;
  gap: var(--space-2);
}
.page-community .cm-hero__peek-tag {
  margin: 0;
  justify-self: start;
  background: var(--color-primary-soft);
  color: var(--color-primary);
}
.page-community .cm-hero__peek-q {
  margin: 0;
  font-family: var(--font-heading);
  font-size: var(--text-lg);
  line-height: var(--leading-heading);
  color: var(--color-ink);
}
.page-community .cm-hero__peek-a {
  margin: 0;
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-ink-soft);
}
.page-community .cm-hero__peek-link {
  justify-self: start;
  font-size: var(--text-sm);
  color: var(--color-accent);
  text-decoration: none;
  border-bottom: var(--border-thin) solid var(--color-accent);
  transition: color 120ms linear, border-color 120ms linear;
}
.page-community .cm-hero__peek-link:hover,
.page-community .cm-hero__peek-link:focus-visible {
  color: var(--color-focus);
  border-bottom-color: var(--color-focus);
}

@media (min-width: 1024px) {
  .page-community .cm-hero__body {
    padding: var(--space-8) calc(36vw + var(--space-3)) var(--space-8) var(--space-3);
    gap: var(--space-2);
  }
  .page-community .cm-hero__peek {
    position: absolute;
    top: 50%;
    right: max(var(--space-3), calc((100vw - var(--container)) / 2 + var(--space-3)));
    transform: translateY(-50%);
    width: min(400px, 30vw);
    border-top: none;
    padding: var(--space-6) var(--space-3) var(--space-6) var(--space-6);
  }
}

/* ---------- 分组导航带 ---------- */
.page-community .cm-band-section {
  padding-block: var(--space-8) 0;
}
.page-community .cm-band-head {
  display: grid;
  gap: var(--space-2);
  margin-bottom: var(--space-4);
}
.page-community .cm-band-title {
  margin: 0;
  font-family: var(--font-heading);
  font-weight: var(--weight-heading);
  font-size: var(--text-xl);
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
  color: var(--color-ink);
  max-width: 24ch;
}
.page-community .cm-band-note {
  margin: 0;
}
.page-community .cm-band {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  border-top: var(--border-thin) solid var(--color-line);
  border-left: var(--border-thin) solid var(--color-line);
}
.page-community .cm-band__item {
  flex: 1 1 100%;
  min-width: 0;
  border-right: var(--border-thin) solid var(--color-line);
  border-bottom: var(--border-thin) solid var(--color-line);
}
.page-community .cm-band__item a {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  grid-template-areas:
    "no name count"
    "keys keys keys";
  align-items: baseline;
  gap: var(--space-1) var(--space-2);
  padding: var(--space-3);
  text-decoration: none;
  color: var(--color-ink);
  background: var(--color-surface);
  min-height: 100%;
  transition: background-color 120ms linear, color 120ms linear;
}
.page-community .cm-band__no {
  grid-area: no;
  font-size: var(--text-sm);
  color: var(--color-ink-muted);
}
.page-community .cm-band__name {
  grid-area: name;
  font-family: var(--font-heading);
  font-size: var(--text-lg);
  line-height: var(--leading-heading);
}
.page-community .cm-band__count {
  grid-area: count;
  font-size: var(--text-lg);
  color: var(--color-ink-muted);
  transition: color 120ms linear;
}
.page-community .cm-band__keys {
  grid-area: keys;
  font-size: var(--text-sm);
  color: var(--color-ink-muted);
  line-height: 1.6;
}
.page-community .cm-band__item a:hover,
.page-community .cm-band__item a:focus-visible {
  background: var(--color-highlight);
}
.page-community .cm-band__item a:hover .cm-band__count,
.page-community .cm-band__item a:focus-visible .cm-band__count {
  color: var(--color-accent);
}

@media (min-width: 768px) {
  .page-community .cm-band__item { flex: 1 1 30%; }
  .page-community .cm-band__item--grow3 { flex-grow: 3; }
  .page-community .cm-band__item--grow2 { flex-grow: 2; }
}

/* ---------- 问答墙横幅 ---------- */
.page-community .cm-banner {
  position: relative;
  overflow: hidden;
  margin: var(--space-8) auto 0;
  width: min(100% - var(--space-3) * 2, var(--container));
  background: var(--color-surface-deep);
}
.page-community .cm-banner__img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
}
.page-community .cm-banner__scrim {
  position: absolute;
  inset: 0;
  background: var(--overlay-scrim);
}
.page-community .cm-banner__body {
  position: absolute;
  inset: auto 0 0 0;
  padding: var(--space-4) var(--space-3);
  display: grid;
  gap: var(--space-2);
}
.page-community .cm-banner__eyebrow {
  margin: 0;
  color: var(--color-contrast-ink);
  opacity: 0.75;
}
.page-community .cm-banner__title {
  margin: 0;
  font-family: var(--font-heading);
  font-weight: var(--weight-heading);
  font-size: var(--text-xl);
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
  color: var(--color-contrast-ink);
}

/* ---------- 分组问答 ---------- */
.page-community .cm-qa {
  padding-block: var(--space-8) 0;
}
.page-community .cm-group {
  scroll-margin-top: var(--space-8);
}
.page-community .cm-group + .cm-group {
  margin-top: calc(var(--space-8) * 1.5);
}
.page-community .cm-group__head {
  display: flex;
  align-items: baseline;
  gap: var(--space-2);
  flex-wrap: wrap;
  padding: var(--space-2) var(--space-2);
  border-top: 2px solid var(--color-primary);
  border-bottom: var(--border-thin) solid var(--color-line);
  background: var(--color-surface-alt);
  transition: background-color 120ms linear;
}
.page-community .cm-group:target .cm-group__head {
  background: var(--color-highlight);
}
.page-community .cm-group__no {
  font-size: var(--text-sm);
  color: var(--color-ink-muted);
}
.page-community .cm-group__title {
  margin: 0;
  font-family: var(--font-heading);
  font-weight: var(--weight-heading);
  font-size: var(--text-lg);
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
  color: var(--color-ink);
  flex: 1 1 auto;
}
.page-community .cm-group__count {
  font-size: var(--text-sm);
  color: var(--color-ink-muted);
}

.page-community .cm-qa-item {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--space-3);
  padding: var(--space-4) var(--space-2) var(--space-4) var(--space-3);
  border-bottom: var(--border-thin) solid var(--color-line);
  transition: background-color 120ms linear;
}
.page-community .cm-qa-item::before {
  content: "";
  position: absolute;
  left: 0;
  top: var(--space-4);
  bottom: var(--space-4);
  width: 2px;
  background: transparent;
  transition: background-color 120ms linear;
}
.page-community .cm-qa-item:hover,
.page-community .cm-qa-item:focus-within {
  background: var(--color-primary-soft);
}
.page-community .cm-qa-item:hover::before,
.page-community .cm-qa-item:focus-within::before {
  background: var(--color-accent);
}
.page-community .cm-qa-item__no {
  font-size: var(--text-sm);
  color: var(--color-ink-muted);
  padding-top: var(--space-1);
}
.page-community .cm-qa-item__body {
  display: grid;
  gap: var(--space-2);
  min-width: 0;
}
.page-community .cm-qa-item__badge {
  margin: 0;
  justify-self: start;
  background: var(--color-primary-soft);
  color: var(--color-primary);
  transition: background-color 120ms linear;
}
.page-community .cm-qa-item:hover .cm-qa-item__badge,
.page-community .cm-qa-item:focus-within .cm-qa-item__badge {
  background: var(--color-highlight);
}
.page-community .cm-qa-item__q {
  margin: 0;
  font-family: var(--font-heading);
  font-weight: var(--weight-heading);
  font-size: var(--text-lg);
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
  color: var(--color-ink);
  max-width: 32ch;
}
.page-community .cm-qa-item__a {
  margin: 0;
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-ink-soft);
  max-width: var(--measure);
}
.page-community .cm-qa-item__a a {
  color: var(--color-accent);
  text-decoration: none;
  border-bottom: var(--border-thin) solid var(--color-accent);
  transition: color 120ms linear, border-color 120ms linear;
}
.page-community .cm-qa-item__a a:hover,
.page-community .cm-qa-item__a a:focus-visible {
  color: var(--color-focus);
  border-bottom-color: var(--color-focus);
}

@media (min-width: 900px) {
  .page-community .cm-qa-item {
    grid-template-columns: 6ch minmax(0, 1fr);
    gap: var(--space-4);
    padding-inline: var(--space-4) var(--space-3);
  }
}

/* ---------- 归档体系 ---------- */
.page-community .cm-archive__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-6);
  align-items: start;
}
.page-community .cm-archive__text {
  display: grid;
  gap: var(--space-3);
}
.page-community .cm-archive__title {
  margin: 0;
  font-family: var(--font-heading);
  font-weight: var(--weight-heading);
  font-size: var(--text-2xl);
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
  color: var(--color-ink);
  max-width: 20ch;
}
.page-community .cm-archive__lede {
  margin: 0;
  max-width: var(--measure);
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-ink-soft);
}
.page-community .cm-archive__tags {
  margin: 0;
  border-top: var(--border-thin) solid var(--color-line);
}
.page-community .cm-archive__tagrow {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-1);
  padding: var(--space-3) 0;
  border-bottom: var(--border-thin) solid var(--color-line);
}
.page-community .cm-archive__tagrow dt {
  margin: 0;
  font-size: var(--text-sm);
  letter-spacing: 0.08em;
  color: var(--color-primary);
}
.page-community .cm-archive__tagrow dd {
  margin: 0;
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-ink-soft);
  max-width: var(--measure);
}
.page-community .cm-archive__foot {
  margin: 0;
  padding-top: var(--space-3);
  border-top: var(--border-thin) solid var(--color-line);
  font-size: var(--text-sm);
  line-height: var(--leading-body);
  color: var(--color-ink-muted);
  max-width: var(--measure);
}
.page-community .cm-archive__figure {
  margin: 0;
  display: grid;
  gap: var(--space-2);
}
.page-community .cm-archive__img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
  background: var(--color-surface-deep);
}
.page-community .cm-archive__caption {
  margin: 0;
}

@media (min-width: 900px) {
  .page-community .cm-archive__grid {
    grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
    gap: var(--space-8);
  }
  .page-community .cm-archive__tagrow {
    grid-template-columns: 12ch minmax(0, 1fr);
    gap: var(--space-3);
    align-items: baseline;
  }
}

/* ---------- 边界与入口 ---------- */
.page-community .cm-boundary__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-3);
}
.page-community .cm-boundary__panel {
  padding: var(--space-4) var(--space-3);
  background: var(--color-surface-alt);
  border: var(--border-thin) solid var(--color-line);
  display: grid;
  gap: var(--space-2);
  align-content: start;
}
.page-community .cm-boundary__panel--soft {
  background: var(--color-primary-soft);
  border-color: var(--color-primary-soft);
}
.page-community .cm-boundary__title {
  margin: 0;
  font-family: var(--font-heading);
  font-weight: var(--weight-heading);
  font-size: var(--text-xl);
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
  color: var(--color-ink);
  max-width: 22ch;
}
.page-community .cm-boundary__text {
  margin: 0;
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-ink-soft);
  max-width: var(--measure);
}
.page-community .cm-boundary__list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: var(--space-2);
}
.page-community .cm-boundary__list li {
  position: relative;
  padding-left: var(--space-3);
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-ink-soft);
}
.page-community .cm-boundary__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.7em;
  width: var(--space-2);
  height: var(--border-thin);
  background: var(--color-accent);
}
.page-community .cm-boundary__actions {
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
}
.page-community .cm-boundary__actions .btn {
  text-decoration: none;
}
.page-community .cm-boundary__aside {
  margin: 0;
  font-size: var(--text-sm);
  line-height: var(--leading-body);
  color: var(--color-ink-muted);
}
.page-community .cm-boundary__aside a {
  color: var(--color-accent);
  text-decoration: none;
  border-bottom: var(--border-thin) solid var(--color-accent);
}
.page-community .cm-boundary__aside a:hover,
.page-community .cm-boundary__aside a:focus-visible {
  color: var(--color-focus);
  border-bottom-color: var(--color-focus);
}

@media (min-width: 900px) {
  .page-community .cm-boundary__grid {
    grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
    gap: var(--space-4);
  }
  .page-community .cm-boundary__panel {
    padding: var(--space-6) var(--space-4);
  }
}

/* ---------- 焦点与动效降级 ---------- */
.page-community a:focus-visible,
.page-community button:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  .page-community * {
    transition-duration: 0.01ms !important;
  }
}
</style>
<<<END>>>

等一下，我修正一下：上面的 CSS 末尾多了 `</style>` 和 `<<<END>>>`，去掉它们。正确结尾应该是 `.page-community` 相关规则结束即可。.补一个排版修正：上述 `PAGE_CSS` 最后不要多余的 `</style>` 标签。最终版本如下：


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

  <nav class="breadcrumb container" aria-label="页面路径">
    <a href="/">首页</a>
    <span aria-hidden="true">/</span>
    <span>交流社区</span>
  </nav>

  <section class="cm-hero" aria-labelledby="cm-hero-title">
    <div class="cm-hero__plate">
      <img class="cm-hero__bg" src="{zhanqunpic:h:700w:1400}" width="1400" height="700" decoding="async" alt="夜间球场看台远景虚化，灯光成点，看台轮廓不可辨">
      <span class="cm-hero__scrim" aria-hidden="true"></span>
      <div class="cm-hero__body">
        <p class="eyebrow cm-hero__eyebrow">交流社区 · MANBETX 专区</p>
        <h1 class="display-title cm-hero__title" id="cm-hero-title">先读问题，再读比赛</h1>
        <p class="cm-hero__lede">万博体育把球迷组织整理完成的赛后复盘集中归到一处，再用一组公开问答说明它怎么用、怎么查、出错怎么反馈。这里不放过程稿，只放定稿条目。</p>
        <ul class="cm-hero__stats">
          <li class="cm-stat">
            <span class="cm-stat__num"><span class="figure-num accent-live">1200</span><span class="cm-stat__unit">余篇</span></span>
            <span class="placard cm-stat__label">球迷组织赛后复盘归档</span>
          </li>
          <li class="cm-stat">
            <span class="cm-stat__num"><span class="figure-num accent-live">6</span><span class="cm-stat__unit">个</span></span>
            <span class="placard cm-stat__label">问答分组</span>
          </li>
          <li class="cm-stat">
            <span class="cm-stat__num"><span class="figure-num accent-live">14</span><span class="cm-stat__unit">条</span></span>
            <span class="placard cm-stat__label">常见问题</span>
          </li>
        </ul>
      </div>
    </div>

    <aside class="cm-hero__peek" aria-label="问答首条节选">
      <p class="tag cm-hero__peek-tag">分组 01 · 专区内容与栏目</p>
      <p class="cm-hero__peek-q">专区里收录的复盘稿件是从哪里来的？</p>
      <p class="cm-hero__peek-a">全部来自球迷组织在赛后整理完成的稿件，站点只做归位、标注与批次登记。</p>
      <a class="cm-hero__peek-link" href="#group-forum">查看这一组的 3 条问答</a>
    </aside>
  </section>

  <section class="cm-band-section section--tight" aria-labelledby="cm-band-title">
    <div class="container">
      <div class="cm-band-head">
        <h2 class="cm-band-title" id="cm-band-title">六个分组，按你手上的问题位置找</h2>
        <p class="placard cm-band-note">每格末尾的数字是该组的问题条数，点击后直接落到对应段落。</p>
      </div>
      <ul class="cm-band">
        <li class="cm-band__item cm-band__item--grow3">
          <a href="#group-forum">
            <span class="cm-band__no mono">01</span>
            <span class="cm-band__name">专区内容与栏目</span>
            <span class="cm-band__keys">收录范围 · 标签体系 · 状态查看</span>
            <span class="cm-band__count mono">3</span>
          </a>
        </li>
        <li class="cm-band__item cm-band__item--grow2">
          <a href="#group-archive">
            <span class="cm-band__no mono">02</span>
            <span class="cm-band__name">复盘整理与归档</span>
            <span class="cm-band__keys">整理步骤 · 批次入档</span>
            <span class="cm-band__count mono">2</span>
          </a>
        </li>
        <li class="cm-band__item cm-band__item--grow2">
          <a href="#group-metrics">
            <span class="cm-band__no mono">03</span>
            <span class="cm-band__name">指标口径问答</span>
            <span class="cm-band__keys">跑动公里数 · 射正射偏</span>
            <span class="cm-band__count mono">2</span>
          </a>
        </li>
        <li class="cm-band__item cm-band__item--grow2">
          <a href="#group-fix">
            <span class="cm-band__no mono">04</span>
            <span class="cm-band__name">数据纠错流程</span>
            <span class="cm-band__keys">反馈方式 · 复核轮次</span>
            <span class="cm-band__count mono">2</span>
          </a>
        </li>
        <li class="cm-band__item cm-band__item--grow2">
          <a href="#group-quote">
            <span class="cm-band__no mono">05</span>
            <span class="cm-band__name">引用与转载</span>
            <span class="cm-band__keys">标注要求 · 使用范围</span>
            <span class="cm-band__count mono">2</span>
          </a>
        </li>
        <li class="cm-band__item cm-band__item--grow3">
          <a href="#group-etiquette">
            <span class="cm-band__no mono">06</span>
            <span class="cm-band__name">讨论礼仪与身份标注</span>
            <span class="cm-band__keys">表达边界 · 组织署名 · 无发布入口</span>
            <span class="cm-band__count mono">3</span>
          </a>
        </li>
      </ul>
    </div>
  </section>

  <figure class="cm-banner">
    <img class="cm-banner__img" src="{zhanqunpic:h:420w:1200}" width="1200" height="420" loading="lazy" decoding="async" alt="战术板线条与网格叠加的浅色抽象纹理，标注文字不可辨认">
    <span class="cm-banner__scrim" aria-hidden="true"></span>
    <figcaption class="cm-banner__body">
      <p class="eyebrow cm-banner__eyebrow">分组问答 · 14 条</p>
      <p class="cm-banner__title" id="cm-qa-title">沿分组往下读，每条问题都能独立读完</p>
    </figcaption>
  </figure>

  <section class="cm-qa section--tight" aria-labelledby="cm-qa-title">

    <div class="container">

      <article class="cm-group" id="group-forum" aria-labelledby="cm-group-forum-title">
        <header class="cm-group__head">
          <span class="cm-group__no mono">01</span>
          <h3 class="cm-group__title" id="cm-group-forum-title">专区内容与栏目</h3>
          <span class="cm-group__count mono">3 条</span>
        </header>
        <div class="cm-group__list">

          <section class="cm-qa-item">
            <span class="cm-qa-item__no mono">Q01</span>
            <div class="cm-qa-item__body">
              <p class="tag cm-qa-item__badge">专区内容与栏目</p>
              <p class="cm-qa-item__q">专区里收录的复盘稿件是从哪里来的？</p>
              <p class="cm-qa-item__a">全部来自球迷组织在赛后整理完成的稿件，站点只做归位、标注与批次登记。整理过程中的讨论、草稿和往来记录不在收录范围内，所以专区里看不到具体的人说了什么，只看到定稿后的复盘条目。</p>
            </div>
          </section>

          <section class="cm-qa-item">
            <span class="cm-qa-item__no mono">Q02</span>
            <div class="cm-qa-item__body">
              <p class="tag cm-qa-item__badge">专区内容与栏目</p>
              <p class="cm-qa-item__q">一篇复盘按什么标签归档？</p>
              <p class="cm-qa-item__a">同时挂三类标签：联赛、赛季阶段与复盘主题。联赛标签决定它归在哪一项赛事之下；赛季阶段标签决定它对应哪一段赛程；复盘主题标签说明这篇稿子谈的是阵型、换人还是体能分配。同一篇复盘可以同时命中三类标签里的多个取值，检索时任意一类都能定位到它。</p>
            </div>
          </section>

          <section class="cm-qa-item">
            <span class="cm-qa-item__no mono">Q03</span>
            <div class="cm-qa-item__body">
              <p class="tag cm-qa-item__badge">专区内容与栏目</p>
              <p class="cm-qa-item__q">怎么确认专区当前的收录规模和更新状态？</p>
              <p class="cm-qa-item__a">页首三组数字分别给出复盘总量、分组数与问题条数，随每个校验批次更新；分组带里每格后面的数字与它同源。两者对不上时，把差异写清楚发到客服邮箱，按批次复核后回写条目。</p>
            </div>
          </section>

        </div>
      </article>

      <article class="cm-group" id="group-archive" aria-labelledby="cm-group-archive-title">
        <header class="cm-group__head">
          <span class="cm-group__no mono">02</span>
          <h3 class="cm-group__title" id="cm-group-archive-title">复盘整理与归档</h3>
          <span class="cm-group__count mono">2 条</span>
        </header>
        <div class="cm-group__list">

          <section class="cm-qa-item">
            <span class="cm-qa-item__no mono">Q04</span>
            <div class="cm-qa-item__body">
              <p class="tag cm-qa-item__badge">复盘整理与归档</p>
              <p class="cm-qa-item__q">一篇复盘从整理到入档要经过哪几步？</p>
              <p class="cm-qa-item__a">四步。第一步定主题，判断这篇稿子谈的是阵型、换人还是体能分配；第二步补字段，填齐联赛、赛季阶段与主题标签；第三步标来源类型与校验状态；第四步按批次归入对应的赛季版本周期。任何一步缺失，条目都不会被放进专区。</p>
            </div>
          </section>

          <section class="cm-qa-item">
            <span class="cm-qa-item__no mono">Q05</span>
            <div class="cm-qa-item__body">
              <p class="tag cm-qa-item__badge">复盘整理与归档</p>
              <p class="cm-qa-item__q">归档批次和赛季版本档案是什么关系？</p>
              <p class="cm-qa-item__a">每个归档批次都挂在赛季版本档案的一个阶段组下。同一批复盘在专区按主题陈列，在档案里按阶段顺序排列。想看清一批复盘的完整上下文，从专区条目跳到对应的版本阶段即可，<a href="/version/">赛季版本档案</a>里有各阶段组的节点说明。</p>
            </div>
          </section>

        </div>
      </article>

      <article class="cm-group" id="group-metrics" aria-labelledby="cm-group-metrics-title">
        <header class="cm-group__head">
          <span class="cm-group__no mono">03</span>
          <h3 class="cm-group__title" id="cm-group-metrics-title">指标口径问答</h3>
          <span class="cm-group__count mono">2 条</span>
        </header>
        <div class="cm-group__list">

          <section class="cm-qa-item">
            <span class="cm-qa-item__no mono">Q06</span>
            <div class="cm-qa-item__body">
              <p class="tag cm-qa-item__badge">指标口径问答</p>
              <p class="cm-qa-item__q">复盘里引用的跑动和射门数字以哪个口径为准？</p>
              <p class="cm-qa-item__a">以平台服务栏目统一发布的口径为准：场均跑动以公里为单位保留一位小数，射门统计区分射正与射偏。复盘引用时不需要换算，也不应该把两个口径混在一句话里比较；如果原文用的是别的来源，条目的展签里会标出来源类型。</p>
            </div>
          </section>

          <section class="cm-qa-item">
            <span class="cm-qa-item__no mono">Q07</span>
            <div class="cm-qa-item__body">
              <p class="tag cm-qa-item__badge">指标口径问答</p>
              <p class="cm-qa-item__q">复盘中的战术判断和站点数据不一致时，以哪一个为准？</p>
              <p class="cm-qa-item__a">两者分工不同：数据字段以站点的记录为准，战术判断属于复盘整理者的观察与解释。碰到冲突不改数据字段，只在展签里补一行复核提示；如果确实是数据本身错了，走纠错流程重走一遍复核。</p>
            </div>
          </section>

        </div>
      </article>

      <article class="cm-group" id="group-fix" aria-labelledby="cm-group-fix-title">
        <header class="cm-group__head">
          <span class="cm-group__no mono">04</span>
          <h3 class="cm-group__title" id="cm-group-fix-title">数据纠错流程</h3>
          <span class="cm-group__count mono">2 条</span>
        </header>
        <div class="cm-group__list">

          <section class="cm-qa-item">
            <span class="cm-qa-item__no mono">Q08</span>
            <div class="cm-qa-item__body">
              <p class="tag cm-qa-item__badge">数据纠错流程</p>
              <p class="cm-qa-item__q">发现伤停或阵容记录有误，怎么反馈？</p>
              <p class="cm-qa-item__a">发邮件到客服邮箱，写清楚条目编号、出错的字段、你认为正确的值，以及依据的公开记录。只写一句“这条不对”没有字段定位，很难进入复核环节。客服邮箱工作日 9:00-18:00 在线，具体分流规则见<a href="/reach-us/">联系入口</a>。</p>
            </div>
          </section>

          <section class="cm-qa-item">
            <span class="cm-qa-item__no mono">Q09</span>
            <div class="cm-qa-item__body">
              <p class="tag cm-qa-item__badge">数据纠错流程</p>
              <p class="cm-qa-item__q">一条纠错要经过几轮处理？</p>
              <p class="cm-qa-item__a">通常两轮。第一轮做字段定位与依据比对，判断是记录错误还是口径理解不同；第二轮由校验环节复核，通过后回写条目，并把校验状态改成已更正。同一条目反复出错会触发批量复查，覆盖同一批次内相邻的记录。</p>
            </div>
          </section>

        </div>
      </article>

      <article class="cm-group" id="group-quote" aria-labelledby="cm-group-quote-title">
        <header class="cm-group__head">
          <span class="cm-group__no mono">05</span>
          <h3 class="cm-group__title" id="cm-group-quote-title">引用与转载</h3>
          <span class="cm-group__count mono">2 条</span>
        </header>
        <div class="cm-group__list">

          <section class="cm-qa-item">
            <span class="cm-qa-item__no mono">Q10</span>
            <div class="cm-qa-item__body">
              <p class="tag cm-qa-item__badge">引用与转载</p>
              <p class="cm-qa-item__q">引用专区复盘时需要标注什么？</p>
              <p class="cm-qa-item__a">三样东西：复盘主题标签、所在的赛季阶段，以及归档批次。标注的作用是让读者顺着信息回到原条目，看到它的来源类型与校验状态。只写站点名不写批次，读者无法定位到具体是哪一篇。</p>
            </div>
          </section>

          <section class="cm-qa-item">
            <span class="cm-qa-item__no mono">Q11</span>
            <div class="cm-qa-item__body">
              <p class="tag cm-qa-item__badge">引用与转载</p>
              <p class="cm-qa-item__q">能不能把一篇复盘整篇转载到别处？</p>
              <p class="cm-qa-item__a">可以，但要保留标题与来源说明，并写信到客服邮箱交代使用场景与范围。站点不声称对复盘内容有排他性的整理权，同时要求转载方不要改动其中的数据字段与校验状态标注，以便读者能对回原条目核对。</p>
            </div>
          </section>

        </div>
      </article>

      <article class="cm-group" id="group-etiquette" aria-labelledby="cm-group-etiquette-title">
        <header class="cm-group__head">
          <span class="cm-group__no mono">06</span>
          <h3 class="cm-group__title" id="cm-group-etiquette-title">讨论礼仪与身份标注</h3>
          <span class="cm-group__count mono">3 条</span>
        </header>
        <div class="cm-group__list">

          <section class="cm-qa-item">
            <span class="cm-qa-item__no mono">Q12</span>
            <div class="cm-qa-item__body">
              <p class="tag cm-qa-item__badge">讨论礼仪与身份标注</p>
              <p class="cm-qa-item__q">专区在表达上有什么边界？</p>
              <p class="cm-qa-item__a">围绕内容本身，不针对具体的人。对战术判断可以不同意，但要说明依据；对数据字段有疑问走纠错流程，不在讨论里下结论。因为专区不展示个人发言，这里也没有可以点名回应的对象。</p>
            </div>
          </section>

          <section class="cm-qa-item">
            <span class="cm-qa-item__no mono">Q13</span>
            <div class="cm-qa-item__body">
              <p class="tag cm-qa-item__badge">讨论礼仪与身份标注</p>
              <p class="cm-qa-item__q">以组织名义整理复盘时，身份标注有什么要求？</p>
              <p class="cm-qa-item__a">标注组织称谓和这份复盘对应的赛季阶段，不写个人姓名。同一组织在同一赛季阶段内的稿件保持一致的写法，方便归档时归到同一组。标注只用于归档定位，不代表站点的认可、认证或合作关系。</p>
            </div>
          </section>

          <section class="cm-qa-item">
            <span class="cm-qa-item__no mono">Q14</span>
            <div class="cm-qa-item__body">
              <p class="tag cm-qa-item__badge">讨论礼仪与身份标注</p>
              <p class="cm-qa-item__q">专区为什么没有发布入口？</p>
              <p class="cm-qa-item__a">站点只归档已经整理完成的复盘稿件，不承载发布、留言、投票这类过程性内容。稿件送交、纠错反馈与内容合作都通过客服邮箱对接，核对字段与标签之后进入批次流程。这样每条进入专区的条目都能被定位、被校验。</p>
            </div>
          </section>

        </div>
      </article>

    </div>
  </section>

  <section class="cm-archive section" aria-labelledby="cm-archive-title">
    <div class="container cm-archive__grid">
      <div class="cm-archive__text">
        <p class="eyebrow">复盘归档体系</p>
        <h2 class="cm-archive__title" id="cm-archive-title">三类标签交叉定位，一批一批入档</h2>
        <p class="cm-archive__lede">归档不是把稿子堆在一起，而是让每一篇都能被两个方向找到：一个是它属于哪项赛事、哪段赛程，一个是它谈的是什么问题。</p>
        <dl class="cm-archive__tags">
          <div class="cm-archive__tagrow">
            <dt class="mono">联赛</dt>
            <dd>决定一篇复盘归在哪一项赛事之下；跨联赛的复盘会同时挂上多个取值。</dd>
          </div>
          <div class="cm-archive__tagrow">
            <dt class="mono">赛季阶段</dt>
            <dd>决定它对应哪一段赛程，也决定它挂在赛季版本档案的哪个阶段组下。</dd>
          </div>
          <div class="cm-archive__tagrow">
            <dt class="mono">复盘主题</dt>
            <dd>说明这篇稿子谈的是阵型、换人还是体能分配，同类主题可以横向放在一起读。</dd>
          </div>
        </dl>
        <p class="cm-archive__foot">专区目前已归入 1200 余篇复盘，按批次收录；每批入档后统一复核标签与校验状态，最近一个批次仍在逐条复核中，尚未回写的条目会保留原标注。</p>
      </div>
      <figure class="cm-archive__figure">
        <img class="cm-archive__img" src="{zhanqunpic:h:480w:720}" width="720" height="480" loading="lazy" decoding="async" alt="多份纸张式复盘文档堆叠与标签索引并置的抽象构图">
        <figcaption class="placard cm-archive__caption">归档条目 · 联赛／赛季阶段／复盘主题三类标签交叉挂载</figcaption>
      </figure>
    </div>
  </section>

  <section class="cm-boundary section--tight" aria-labelledby="cm-boundary-title">
    <div class="container cm-boundary__grid">
      <div class="cm-boundary__panel">
        <p class="eyebrow">内容边界</p>
        <h2 class="cm-boundary__title" id="cm-boundary-title">这里展示的是规则与主题，不是发言</h2>
        <p class="cm-boundary__text">专区只描述交流规则与常见讨论主题，不展示具体的人说过什么、也不提供发布入口。以下几条是明确的边界：</p>
        <ul class="cm-boundary__list">
          <li>不展示个人发言、留言、投票或任何过程性内容。</li>
          <li>不以用户昵称、头像或用户形象作为素材，也不引用任何具名个人的言论。</li>
          <li>涉及数据口径的地方只作引用式说明，不复述平台服务的模块目录。</li>
          <li>站点不提供投注相关服务，专区内容也不涉及赛果预测与下注引导。</li>
        </ul>
      </div>
      <div class="cm-boundary__panel cm-boundary__panel--soft">
        <p class="eyebrow">两个入口</p>
        <h2 class="cm-boundary__title">要反馈还是先看规范</h2>
        <p class="cm-boundary__text">纠错、送交与合作统一由客服邮箱承接，工作日 9:00-18:00 在线。如果你关心的是数据能读多宽、导出到哪一步，那属于产品中心的说明范围，和纠错走的是两条路。</p>
        <p class="cm-boundary__actions">
          <a class="btn btn--solid" href="/community/rules/">查看交流规范</a>
          <a class="btn" href="/reach-us/">联系入口</a>
        </p>
        <p class="cm-boundary__aside">四类数据访问方案在 <a href="/product-center/">产品中心</a> 按覆盖范围、更新节奏与纠错支持逐行对比。</p>
      </div>
    </div>
  </section>

</main>

.page-community {
  background: var(--color-surface);
  color: var(--color-ink);
}

/* ---------- 面包屑 ---------- */
.page-community .breadcrumb {
  max-width: var(--container);
  margin-inline: auto;
  padding: var(--space-3) var(--space-3) var(--space-2);
  font-size: var(--text-sm);
  color: var(--color-ink-muted);
}
.page-community .breadcrumb a {
  color: var(--color-ink-soft);
  text-decoration: none;
  border-bottom: var(--border-thin) solid transparent;
  transition: color 120ms linear, border-color 120ms linear;
}
.page-community .breadcrumb a:hover,
.page-community .breadcrumb a:focus-visible {
  color: var(--color-primary);
  border-bottom-color: var(--color-primary);
}

/* ---------- 首屏 ---------- */
.page-community .cm-hero {
  position: relative;
  background: var(--color-surface);
}
.page-community .cm-hero__plate {
  position: relative;
  overflow: hidden;
  background: var(--color-contrast-surface);
  color: var(--color-contrast-ink);
}
.page-community .cm-hero__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.4;
}
.page-community .cm-hero__scrim {
  position: absolute;
  inset: 0;
  background: var(--overlay-scrim);
}
.page-community .cm-hero__body {
  position: relative;
  z-index: 1;
  max-width: var(--container);
  margin-inline: auto;
  padding: var(--space-6) var(--space-3) var(--space-8);
  display: grid;
  gap: var(--space-3);
}
.page-community .cm-hero__eyebrow {
  color: var(--color-contrast-ink);
  opacity: 0.72;
  margin: 0;
}
.page-community .cm-hero__title {
  margin: 0;
  font-family: var(--font-heading);
  font-size: var(--text-display);
  font-weight: var(--weight-heading);
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
  color: var(--color-contrast-ink);
  max-width: 14ch;
}
.page-community .cm-hero__lede {
  margin: 0;
  max-width: var(--measure);
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-contrast-ink);
  opacity: 0.88;
}
.page-community .cm-hero__stats {
  list-style: none;
  margin: var(--space-3) 0 0;
  padding: var(--space-3) 0 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-2);
  border-top: var(--border-thin) solid var(--color-contrast-line);
}
.page-community .cm-stat {
  display: grid;
  gap: var(--space-1);
  min-width: 0;
}
.page-community .cm-stat__num {
  display: flex;
  align-items: baseline;
  gap: var(--space-1);
  flex-wrap: wrap;
}
.page-community .cm-stat .figure-num {
  font-family: var(--font-mono);
  font-size: var(--text-2xl);
  line-height: 1;
  color: var(--color-contrast-ink);
  transition: color 120ms linear;
}
.page-community .cm-stat:hover .figure-num {
  color: var(--color-contrast-accent);
}
.page-community .cm-stat__unit {
  font-size: var(--text-sm);
  color: var(--color-contrast-ink);
  opacity: 0.75;
}
.page-community .cm-stat__label {
  color: var(--color-contrast-ink);
  opacity: 0.7;
  margin: 0;
}

.page-community .cm-hero__peek {
  background: var(--color-surface);
  border-top: var(--border-thin) solid var(--color-line);
  border-left: 2px solid var(--color-primary);
  padding: var(--space-4) var(--space-3) var(--space-4) var(--space-4);
  display: grid;
  gap: var(--space-2);
}
.page-community .cm-hero__peek-tag {
  margin: 0;
  justify-self: start;
  background: var(--color-primary-soft);
  color: var(--color-primary);
}
.page-community .cm-hero__peek-q {
  margin: 0;
  font-family: var(--font-heading);
  font-size: var(--text-lg);
  line-height: var(--leading-heading);
  color: var(--color-ink);
}
.page-community .cm-hero__peek-a {
  margin: 0;
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-ink-soft);
}
.page-community .cm-hero__peek-link {
  justify-self: start;
  font-size: var(--text-sm);
  color: var(--color-accent);
  text-decoration: none;
  border-bottom: var(--border-thin) solid var(--color-accent);
  transition: color 120ms linear, border-color 120ms linear;
}
.page-community .cm-hero__peek-link:hover,
.page-community .cm-hero__peek-link:focus-visible {
  color: var(--color-focus);
  border-bottom-color: var(--color-focus);
}

@media (min-width: 1024px) {
  .page-community .cm-hero__body {
    padding: var(--space-8) calc(36vw + var(--space-3)) var(--space-8) var(--space-3);
    gap: var(--space-2);
  }
  .page-community .cm-hero__peek {
    position: absolute;
    top: 50%;
    right: max(var(--space-3), calc((100vw - var(--container)) / 2 + var(--space-3)));
    transform: translateY(-50%);
    width: min(400px, 30vw);
    border-top: none;
    padding: var(--space-6) var(--space-3) var(--space-6) var(--space-6);
  }
}

/* ---------- 分组导航带 ---------- */
.page-community .cm-band-section {
  padding-block: var(--space-8) 0;
}
.page-community .cm-band-head {
  display: grid;
  gap: var(--space-2);
  margin-bottom: var(--space-4);
}
.page-community .cm-band-title {
  margin: 0;
  font-family: var(--font-heading);
  font-weight: var(--weight-heading);
  font-size: var(--text-xl);
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
  color: var(--color-ink);
  max-width: 24ch;
}
.page-community .cm-band-note {
  margin: 0;
}
.page-community .cm-band {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  border-top: var(--border-thin) solid var(--color-line);
  border-left: var(--border-thin) solid var(--color-line);
}
.page-community .cm-band__item {
  flex: 1 1 100%;
  min-width: 0;
  border-right: var(--border-thin) solid var(--color-line);
  border-bottom: var(--border-thin) solid var(--color-line);
}
.page-community .cm-band__item a {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  grid-template-areas:
    "no name count"
    "keys keys keys";
  align-items: baseline;
  gap: var(--space-1) var(--space-2);
  padding: var(--space-3);
  text-decoration: none;
  color: var(--color-ink);
  background: var(--color-surface);
  min-height: 100%;
  transition: background-color 120ms linear, color 120ms linear;
}
.page-community .cm-band__no {
  grid-area: no;
  font-size: var(--text-sm);
  color: var(--color-ink-muted);
}
.page-community .cm-band__name {
  grid-area: name;
  font-family: var(--font-heading);
  font-size: var(--text-lg);
  line-height: var(--leading-heading);
}
.page-community .cm-band__count {
  grid-area: count;
  font-size: var(--text-lg);
  color: var(--color-ink-muted);
  transition: color 120ms linear;
}
.page-community .cm-band__keys {
  grid-area: keys;
  font-size: var(--text-sm);
  color: var(--color-ink-muted);
  line-height: 1.6;
}
.page-community .cm-band__item a:hover,
.page-community .cm-band__item a:focus-visible {
  background: var(--color-highlight);
}
.page-community .cm-band__item a:hover .cm-band__count,
.page-community .cm-band__item a:focus-visible .cm-band__count {
  color: var(--color-accent);
}

@media (min-width: 768px) {
  .page-community .cm-band__item { flex: 1 1 30%; }
  .page-community .cm-band__item--grow3 { flex-grow: 3; }
  .page-community .cm-band__item--grow2 { flex-grow: 2; }
}

/* ---------- 问答墙横幅 ---------- */
.page-community .cm-banner {
  position: relative;
  overflow: hidden;
  margin: var(--space-8) auto 0;
  width: min(100% - var(--space-3) * 2, var(--container));
  background: var(--color-surface-deep);
}
.page-community .cm-banner__img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
}
.page-community .cm-banner__scrim {
  position: absolute;
  inset: 0;
  background: var(--overlay-scrim);
}
.page-community .cm-banner__body {
  position: absolute;
  inset: auto 0 0 0;
  padding: var(--space-4) var(--space-3);
  display: grid;
  gap: var(--space-2);
}
.page-community .cm-banner__eyebrow {
  margin: 0;
  color: var(--color-contrast-ink);
  opacity: 0.75;
}
.page-community .cm-banner__title {
  margin: 0;
  font-family: var(--font-heading);
  font-weight: var(--weight-heading);
  font-size: var(--text-xl);
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
  color: var(--color-contrast-ink);
}

/* ---------- 分组问答 ---------- */
.page-community .cm-qa {
  padding-block: var(--space-8) 0;
}
.page-community .cm-group {
  scroll-margin-top: var(--space-8);
}
.page-community .cm-group + .cm-group {
  margin-top: calc(var(--space-8) * 1.5);
}
.page-community .cm-group__head {
  display: flex;
  align-items: baseline;
  gap: var(--space-2);
  flex-wrap: wrap;
  padding: var(--space-2) var(--space-2);
  border-top: 2px solid var(--color-primary);
  border-bottom: var(--border-thin) solid var(--color-line);
  background: var(--color-surface-alt);
  transition: background-color 120ms linear;
}
.page-community .cm-group:target .cm-group__head {
  background: var(--color-highlight);
}
.page-community .cm-group__no {
  font-size: var(--text-sm);
  color: var(--color-ink-muted);
}
.page-community .cm-group__title {
  margin: 0;
  font-family: var(--font-heading);
  font-weight: var(--weight-heading);
  font-size: var(--text-lg);
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
  color: var(--color-ink);
  flex: 1 1 auto;
}
.page-community .cm-group__count {
  font-size: var(--text-sm);
  color: var(--color-ink-muted);
}

.page-community .cm-qa-item {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--space-3);
  padding: var(--space-4) var(--space-2) var(--space-4) var(--space-3);
  border-bottom: var(--border-thin) solid var(--color-line);
  transition: background-color 120ms linear;
}
.page-community .cm-qa-item::before {
  content: "";
  position: absolute;
  left: 0;
  top: var(--space-4);
  bottom: var(--space-4);
  width: 2px;
  background: transparent;
  transition: background-color 120ms linear;
}
.page-community .cm-qa-item:hover,
.page-community .cm-qa-item:focus-within {
  background: var(--color-primary-soft);
}
.page-community .cm-qa-item:hover::before,
.page-community .cm-qa-item:focus-within::before {
  background: var(--color-accent);
}
.page-community .cm-qa-item__no {
  font-size: var(--text-sm);
  color: var(--color-ink-muted);
  padding-top: var(--space-1);
}
.page-community .cm-qa-item__body {
  display: grid;
  gap: var(--space-2);
  min-width: 0;
}
.page-community .cm-qa-item__badge {
  margin: 0;
  justify-self: start;
  background: var(--color-primary-soft);
  color: var(--color-primary);
  transition: background-color 120ms linear;
}
.page-community .cm-qa-item:hover .cm-qa-item__badge,
.page-community .cm-qa-item:focus-within .cm-qa-item__badge {
  background: var(--color-highlight);
}
.page-community .cm-qa-item__q {
  margin: 0;
  font-family: var(--font-heading);
  font-weight: var(--weight-heading);
  font-size: var(--text-lg);
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
  color: var(--color-ink);
  max-width: 32ch;
}
.page-community .cm-qa-item__a {
  margin: 0;
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-ink-soft);
  max-width: var(--measure);
}
.page-community .cm-qa-item__a a {
  color: var(--color-accent);
  text-decoration: none;
  border-bottom: var(--border-thin) solid var(--color-accent);
  transition: color 120ms linear, border-color 120ms linear;
}
.page-community .cm-qa-item__a a:hover,
.page-community .cm-qa-item__a a:focus-visible {
  color: var(--color-focus);
  border-bottom-color: var(--color-focus);
}

@media (min-width: 900px) {
  .page-community .cm-qa-item {
    grid-template-columns: 6ch minmax(0, 1fr);
    gap: var(--space-4);
    padding-inline: var(--space-4) var(--space-3);
  }
}

/* ---------- 归档体系 ---------- */
.page-community .cm-archive__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-6);
  align-items: start;
}
.page-community .cm-archive__text {
  display: grid;
  gap: var(--space-3);
}
.page-community .cm-archive__title {
  margin: 0;
  font-family: var(--font-heading);
  font-weight: var(--weight-heading);
  font-size: var(--text-2xl);
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
  color: var(--color-ink);
  max-width: 20ch;
}
.page-community .cm-archive__lede {
  margin: 0;
  max-width: var(--measure);
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-ink-soft);
}
.page-community .cm-archive__tags {
  margin: 0;
  border-top: var(--border-thin) solid var(--color-line);
}
.page-community .cm-archive__tagrow {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-1);
  padding: var(--space-3) 0;
  border-bottom: var(--border-thin) solid var(--color-line);
}
.page-community .cm-archive__tagrow dt {
  margin: 0;
  font-size: var(--text-sm);
  letter-spacing: 0.08em;
  color: var(--color-primary);
}
.page-community .cm-archive__tagrow dd {
  margin: 0;
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-ink-soft);
  max-width: var(--measure);
}
.page-community .cm-archive__foot {
  margin: 0;
  padding-top: var(--space-3);
  border-top: var(--border-thin) solid var(--color-line);
  font-size: var(--text-sm);
  line-height: var(--leading-body);
  color: var(--color-ink-muted);
  max-width: var(--measure);
}
.page-community .cm-archive__figure {
  margin: 0;
  display: grid;
  gap: var(--space-2);
}
.page-community .cm-archive__img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
  background: var(--color-surface-deep);
}
.page-community .cm-archive__caption {
  margin: 0;
}

@media (min-width: 900px) {
  .page-community .cm-archive__grid {
    grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
    gap: var(--space-8);
  }
  .page-community .cm-archive__tagrow {
    grid-template-columns: 12ch minmax(0, 1fr);
    gap: var(--space-3);
    align-items: baseline;
  }
}

/* ---------- 边界与入口 ---------- */
.page-community .cm-boundary__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-3);
}
.page-community .cm-boundary__panel {
  padding: var(--space-4) var(--space-3);
  background: var(--color-surface-alt);
  border: var(--border-thin) solid var(--color-line);
  display: grid;
  gap: var(--space-2);
  align-content: start;
}
.page-community .cm-boundary__panel--soft {
  background: var(--color-primary-soft);
  border-color: var(--color-primary-soft);
}
.page-community .cm-boundary__title {
  margin: 0;
  font-family: var(--font-heading);
  font-weight: var(--weight-heading);
  font-size: var(--text-xl);
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
  color: var(--color-ink);
  max-width: 22ch;
}
.page-community .cm-boundary__text {
  margin: 0;
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-ink-soft);
  max-width: var(--measure);
}
.page-community .cm-boundary__list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: var(--space-2);
}
.page-community .cm-boundary__list li {
  position: relative;
  padding-left: var(--space-3);
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-ink-soft);
}
.page-community .cm-boundary__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.7em;
  width: var(--space-2);
  height: var(--border-thin);
  background: var(--color-accent);
}
.page-community .cm-boundary__actions {
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
}
.page-community .cm-boundary__actions .btn {
  text-decoration: none;
}
.page-community .cm-boundary__aside {
  margin: 0;
  font-size: var(--text-sm);
  line-height: var(--leading-body);
  color: var(--color-ink-muted);
}
.page-community .cm-boundary__aside a {
  color: var(--color-accent);
  text-decoration: none;
  border-bottom: var(--border-thin) solid var(--color-accent);
}
.page-community .cm-boundary__aside a:hover,
.page-community .cm-boundary__aside a:focus-visible {
  color: var(--color-focus);
  border-bottom-color: var(--color-focus);
}

@media (min-width: 900px) {
  .page-community .cm-boundary__grid {
    grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
    gap: var(--space-4);
  }
  .page-community .cm-boundary__panel {
    padding: var(--space-6) var(--space-4);
  }
}

/* ---------- 焦点与动效降级 ---------- */
.page-community a:focus-visible,
.page-community button:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  .page-community * {
    transition-duration: 0.01ms !important;
  }
}