.page-home {
  --home-h2: clamp(26px, 3.6vw, 38px);
  --home-lead-size: 17px;
  --home-tick-label: 68px;
  --home-entry-line: rgba(154, 167, 199, 0.20);
  --home-ring-arc: rgba(108, 74, 182, 0.45);
  --home-card-fill: rgba(42, 51, 80, 0.52);
}

/* ---------- 首屏 ---------- */
.page-home .home-hero {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(120% 90% at 88% 8%, rgba(108, 74, 182, 0.22), transparent 58%),
    radial-gradient(90% 70% at 6% 96%, rgba(63, 224, 208, 0.10), transparent 62%),
    var(--ink);
}

.page-home .home-hero-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 34px;
  padding: 34px 0 52px;
  align-items: start;
}

.page-home .home-hero-copy {
  min-width: 0;
}

.page-home .home-hero-title {
  margin: 10px 0 0;
  font-family: var(--font-display);
  font-weight: 600;
  font-size: clamp(33px, 8.4vw, 74px);
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: var(--paper);
  padding-bottom: 20px;
  border-bottom: 1px solid var(--line-nebula);
}

.page-home .home-hero-lede {
  margin: 22px 0 0;
  max-width: 34em;
  font-size: var(--home-lead-size);
  line-height: 1.85;
  color: var(--paper);
}

.page-home .home-hero-hint {
  position: relative;
  margin: 20px 0 0;
  padding: 14px 16px 14px 22px;
  font-size: 15px;
  line-height: 1.8;
  color: var(--sand);
  background: var(--home-card-fill);
  border: 1px solid var(--line);
  border-left: 2px solid var(--nebula);
  border-radius: var(--radius);
}

.page-home .home-hint-mark {
  position: absolute;
  left: 8px;
  top: 22px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--pulse);
}

.page-home .home-hero-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px 22px;
  margin: 30px 0 0;
  padding-top: 22px;
  border-top: 1px solid var(--line);
}

.page-home .home-stat dt {
  font-size: 13px;
  color: var(--sand);
  letter-spacing: 0.02em;
  margin-bottom: 6px;
}

.page-home .home-stat dd {
  margin: 0;
  font-size: 26px;
  line-height: 1.2;
  font-weight: 500;
  color: var(--gold);
}

.page-home .home-stat-unit {
  margin-left: 4px;
  font-size: 13px;
  color: var(--sand);
  font-family: var(--font-body);
}

.page-home .home-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 30px;
}

.page-home .home-hero-visual {
  position: relative;
  min-width: 0;
}

.page-home .home-hero-img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: var(--radius);
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
}

.page-home .home-hero-orbit {
  position: absolute;
  inset: 0;
  width: 74%;
  height: 74%;
  margin: auto;
  overflow: visible;
}

.page-home .home-hero-orbit circle {
  fill: none;
  stroke: rgba(108, 74, 182, 0.55);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

.page-home .home-hero-orbit .home-orbit-dot {
  fill: var(--pulse);
  stroke: none;
  opacity: 0.9;
}

.page-home .home-orbit-dot-a { animation: home-drift-a 34s ease-in-out infinite; }
.page-home .home-orbit-dot-b { animation: home-drift-b 40s ease-in-out infinite; }
.page-home .home-orbit-dot-c { animation: home-drift-c 28s ease-in-out infinite; }
.page-home .home-orbit-dot-d { animation: home-drift-b 36s ease-in-out infinite reverse; }

@keyframes home-drift-a {
  0%, 100% { transform: translate(0, 0); opacity: 0.9; }
  50% { transform: translate(4px, 3px); opacity: 0.45; }
}
@keyframes home-drift-b {
  0%, 100% { transform: translate(0, 0); opacity: 0.8; }
  50% { transform: translate(-5px, 2px); opacity: 0.4; }
}
@keyframes home-drift-c {
  0%, 100% { transform: translate(0, 0); opacity: 0.85; }
  50% { transform: translate(3px, -4px); opacity: 0.45; }
}

/* ---------- 校准刻度带 ---------- */
.page-home .home-calibration {
  background: var(--ink-deep);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.page-home .home-calibration-inner {
  position: relative;
  padding: 0;
}

.page-home .home-calibration-img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 5;
  object-fit: cover;
  opacity: 0.55;
  max-height: 180px;
}

.page-home .home-calibration-note {
  margin: 0;
  padding: 12px 0;
  font-size: 12px;
  letter-spacing: 0.08em;
  color: var(--pulse);
  text-transform: uppercase;
}

/* ---------- 通用章节 ---------- */
.page-home .home-h2 {
  margin: 8px 0 0;
  font-family: var(--font-display);
  font-weight: 500;
  font-size: var(--home-h2);
  line-height: 1.28;
  letter-spacing: -0.01em;
  color: var(--paper);
}

.page-home .home-lead {
  margin: 16px 0 0;
  max-width: 44em;
  font-size: var(--home-lead-size);
  line-height: 1.85;
  color: var(--sand);
}

.page-home .home-note {
  margin: 22px 0 0;
  font-size: 15px;
  line-height: 1.8;
  color: var(--sand);
}

.page-home .home-note-sm {
  margin: 16px 0 0;
  font-size: 14px;
  line-height: 1.8;
  color: var(--sand);
}

.page-home .home-section-head {
  max-width: 62em;
  margin-bottom: 34px;
}

/* ---------- 检索节 ---------- */
.page-home .home-search-grid.editorial-grid {
  grid-template-columns: minmax(0, 1fr);
  gap: 34px;
}

.page-home .home-search-demo {
  margin-top: 26px;
  border-top: 1px solid var(--line);
}

.page-home .home-demo-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 6px;
  padding: 16px 0;
  border-bottom: 1px solid var(--line);
  font-size: 15px;
  line-height: 1.75;
  color: var(--sand);
}

.page-home .home-demo-input {
  display: inline-block;
  align-self: start;
  justify-self: start;
  padding: 3px 10px;
  font-size: 13px;
  color: var(--gold);
  border: 1px solid rgba(245, 193, 108, 0.5);
  border-radius: var(--radius);
  background: rgba(245, 193, 108, 0.07);
}

.page-home .home-demo-arrow {
  display: none;
  color: var(--nebula);
}

.page-home .home-demo-out {
  color: var(--paper);
}

.page-home .home-search-note {
  margin-top: 6px;
}

.page-home .home-dim-list {
  list-style: none;
  margin: 14px 0 0;
  padding: 0;
  counter-reset: none;
}

.page-home .home-dim-list li {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 10px 0;
  font-size: 15px;
  color: var(--paper);
  border-bottom: 1px solid var(--line);
}

.page-home .home-dim-list .mono {
  font-size: 12px;
  color: var(--pulse);
  letter-spacing: 0.08em;
}

/* ---------- 轨道环 ---------- */
.page-home .home-orbits {
  background:
    radial-gradient(80% 60% at 10% 0%, rgba(108, 74, 182, 0.16), transparent 60%),
    var(--ink);
  border-top: 1px solid var(--line);
}

.page-home .home-ring {
  position: relative;
  padding-left: 16px;
  margin-bottom: 46px;
  border-left: 1px solid var(--home-ring-arc);
}

.page-home .home-ring:last-of-type {
  margin-bottom: 0;
}

.page-home .home-ring-label {
  margin: 0 0 18px;
  font-size: 12px;
  letter-spacing: 0.14em;
  color: var(--nebula);
  text-transform: uppercase;
}

.page-home .home-ring-cards {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 18px;
}

.page-home .home-orbit-card {
  display: flex;
  flex-direction: column;
  padding: 20px 18px 16px;
  background: var(--home-card-fill);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  transition: border-color 0.18s ease, transform 0.18s ease;
}

.page-home .home-orbit-card:hover,
.page-home .home-orbit-card:focus-within {
  border-color: rgba(108, 74, 182, 0.65);
  transform: translateY(-2px);
}

.page-home .home-orbit-card .card-title {
  margin: 6px 0 0;
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 21px;
  line-height: 1.35;
  color: var(--paper);
}

.page-home .home-orbit-card .card-body {
  flex: 1 1 auto;
  padding: 0;
}

.page-home .home-orbit-meta {
  margin: 12px 0 0;
  font-size: 13px;
  line-height: 1.7;
  color: var(--sand);
}

.page-home .home-orbit-meta .mono {
  color: var(--pulse);
}

.page-home .home-points {
  list-style: none;
  margin: 10px 0 0;
  padding: 0;
}

.page-home .home-points li {
  position: relative;
  padding: 7px 0 7px 14px;
  font-size: 14px;
  line-height: 1.72;
  color: var(--sand);
  border-top: 1px solid var(--line);
}

.page-home .home-points li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 15px;
  width: 4px;
  height: 1px;
  background: var(--nebula);
}

.page-home .home-orbit-card .card-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 16px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

/* ---------- 时间轴 ---------- */
.page-home .home-changes {
  background: var(--ink-deep);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.page-home .home-timeline {
  border-top: 1px solid var(--line-2);
}

.page-home .home-timeline-head,
.page-home .home-tick {
  position: relative;
  display: grid;
  grid-template-columns: var(--home-tick-label) minmax(0, 1fr);
  gap: 8px 14px;
  align-items: start;
  padding: 14px 0;
  border-bottom: 1px solid var(--line);
}

.page-home .home-timeline-head {
  align-items: center;
  padding-bottom: 10px;
}

.page-home .home-tl-label {
  font-size: 12px;
  letter-spacing: 0.08em;
  color: var(--sand);
}

.page-home .home-tl-cell {
  font-size: 12px;
  letter-spacing: 0.1em;
  color: var(--gold);
}

.page-home .home-timeline-head .home-tl-cell:nth-of-type(2) {
  color: var(--sand);
}

.page-home .home-timeline-head .home-tl-cell:first-of-type {
  display: none;
}

.page-home .home-tick-label {
  font-size: 13px;
  letter-spacing: 0.04em;
  color: var(--paper);
  padding-top: 3px;
}

.page-home .home-tick-cell {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  font-size: 13px;
  line-height: 1.6;
  color: var(--sand);
}

.page-home .home-cell b {
  font-weight: 500;
  font-size: 14px;
}

.page-home .home-cell-add b { color: var(--pulse); }
.page-home .home-cell-move b { color: var(--paper); }
.page-home .home-cell-off b { color: var(--clay); }

.page-home .home-tick-tip {
  grid-column: 1 / -1;
  margin-top: 2px;
  font-size: 12px;
  letter-spacing: 0.04em;
  color: var(--sand);
  opacity: 0.55;
  transition: opacity 0.18s ease, color 0.18s ease;
}

.page-home .home-tick:hover .home-tick-tip {
  opacity: 1;
  color: var(--gold);
}

.page-home .home-change-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  align-items: center;
  justify-content: space-between;
  margin-top: 28px;
  padding: 20px 20px 20px 22px;
  border: 1px solid var(--line-nebula);
  border-left: 2px solid var(--gold);
  border-radius: var(--radius);
  background: var(--home-card-fill);
}

.page-home .home-summary-main {
  margin: 0;
  flex: 1 1 22em;
  font-size: 15px;
  line-height: 1.85;
  color: var(--paper);
}

.page-home .home-summary-main .mono {
  color: var(--gold);
  font-size: 15px;
}

/* ---------- 入口状态面板 ---------- */
.page-home .home-panel {
  padding-left: 0;
  padding-right: 0;
  background: var(--ink);
}

.page-home .home-panel-visual {
  margin-bottom: 44px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.page-home .home-panel-img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 1;
  object-fit: cover;
  max-height: 300px;
  opacity: 0.7;
}

.page-home .home-panel-body {
  min-width: 0;
}

.page-home .home-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-bottom: 20px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--rock);
}

.page-home .home-filter .search-input {
  flex: 1 1 14em;
  min-width: 0;
}

.page-home .home-filter .search-count {
  font-size: 13px;
  color: var(--sand);
  margin-left: auto;
}

.page-home .home-entry-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
}

.page-home .home-entry {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 16px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--home-card-fill);
  transition: border-color 0.16s ease, background-color 0.16s ease;
}

.page-home .home-entry:hover {
  border-color: rgba(63, 224, 208, 0.5);
}

.page-home .home-entry:has(input:checked) {
  border-color: var(--gold);
  background: rgba(245, 193, 108, 0.07);
}

.page-home .home-entry-check {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  cursor: pointer;
}

.page-home .home-entry-check input {
  width: 16px;
  height: 16px;
  accent-color: var(--gold);
  cursor: pointer;
}

.page-home .home-entry-name {
  flex: 1 1 12em;
  min-width: 0;
  font-size: 16px;
  font-weight: 500;
  color: var(--paper);
}

.page-home .home-entry-cat {
  flex: 0 1 auto;
  font-size: 13px;
  color: var(--sand);
}

.page-home .home-entry-status {
  flex: 0 0 auto;
}

.page-home .home-tag-off {
  border-color: rgba(193, 118, 90, 0.7);
  color: var(--clay);
  background: transparent;
}

.page-home .home-entry-count {
  flex: 0 0 auto;
  font-size: 13px;
  color: var(--sand);
}

.page-home .home-entry-date {
  flex: 0 0 auto;
  margin-left: auto;
  font-size: 13px;
  letter-spacing: 0.04em;
  color: var(--gold);
}

.page-home .home-compare-bar {
  position: sticky;
  bottom: 0;
  z-index: 6;
  display: flex;
  flex-wrap: wrap;
  gap: 12px 20px;
  align-items: center;
  justify-content: space-between;
  margin-top: 22px;
  padding: 14px 18px;
  background: var(--ink-deep);
  border: 1px solid var(--line-nebula);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

.page-home .home-compare-bar p {
  margin: 0;
  flex: 1 1 16em;
  font-size: 14px;
  line-height: 1.7;
  color: var(--sand);
}

/* ---------- 首次到访路径 ---------- */
.page-home .home-paths {
  background: var(--ink);
  border-top: 1px solid var(--line);
}

.page-home .home-path-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 18px;
}

.page-home .home-path {
  position: relative;
  padding: 26px 20px 20px;
  border-top: 1px solid var(--line-2);
  border-radius: var(--radius);
  background: linear-gradient(180deg, rgba(42, 51, 80, 0.55), rgba(11, 27, 58, 0));
}

.page-home .home-path-num {
  display: block;
  font-size: 30px;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--nebula);
}

.page-home .home-path-title {
  margin: 14px 0 0;
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 20px;
  line-height: 1.4;
  color: var(--paper);
}

.page-home .home-path p {
  margin: 10px 0 14px;
  font-size: 15px;
  line-height: 1.8;
  color: var(--sand);
}

/* ---------- 收束 ---------- */
.page-home .home-closing {
  padding: 0 0 72px;
  background: var(--ink-deep);
}

.page-home .home-closing-img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 1;
  object-fit: cover;
  max-height: 260px;
  opacity: 0.62;
}

.page-home .home-closing-copy {
  max-width: 62em;
  margin: 0 auto;
  padding-top: 38px;
}

.page-home .home-closing-copy p {
  margin: 16px 0 0;
  font-size: var(--home-lead-size);
  line-height: 1.85;
  color: var(--sand);
}

.page-home .home-closing-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 26px;
}

/* ---------- 响应式 ---------- */
@media (min-width: 620px) {
  .page-home .home-hero-stats {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .page-home .home-hero-img {
    aspect-ratio: 6 / 7;
  }
  .page-home .home-demo-row {
    grid-template-columns: auto auto minmax(0, 1fr);
    align-items: center;
    gap: 14px;
  }
  .page-home .home-demo-arrow {
    display: inline;
  }
}

@media (min-width: 768px) {
  .page-home .home-ring-cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .page-home .home-ring-cards > .home-orbit-card:nth-child(2) {
    margin-top: 26px;
  }
  .page-home .home-ring-cards > .home-orbit-card:nth-child(3) {
    margin-top: 52px;
  }
  .page-home .home-timeline-head,
  .page-home .home-tick {
    grid-template-columns: var(--home-tick-label) minmax(0, 1fr) minmax(0, 1fr);
    align-items: center;
  }
  .page-home .home-timeline-head .home-tl-cell:first-of-type {
    display: block;
    color: var(--sand);
  }
  .page-home .home-tick-tip {
    grid-column: 2 / -1;
  }
  .page-home .home-path-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
  }
}

@media (min-width: 900px) {
  .page-home .home-hero-grid {
    grid-template-columns: 58fr 42fr;
    gap: clamp(32px, 5vw, 76px);
    padding: 60px 0 78px;
  }
  .page-home .home-search-grid.editorial-grid {
    grid-template-columns: minmax(0, 7fr) minmax(0, 4fr);
    gap: 46px;
  }
  .page-home .home-orbits .wrap {
    padding-left: 8px;
  }
  .page-home .home-ring {
    padding-left: 24px;
    margin-bottom: 58px;
  }
  .page-home .home-entry {
    display: grid;
    grid-template-columns: 24px minmax(0, 1.8fr) minmax(0, 1.1fr) 84px 92px 116px;
    align-items: center;
    gap: 0 18px;
  }
  .page-home .home-entry-date {
    margin-left: 0;
    text-align: right;
  }
  .page-home .home-entry-count,
  .page-home .home-entry-cat {
    text-align: left;
  }
}

@media (min-width: 1120px) {
  .page-home .home-hero-grid {
    padding: 78px 0 96px;
  }
  .page-home .home-hero-hint {
    max-width: 32em;
  }
}

@media (prefers-reduced-motion: reduce) {
  .page-home .home-orbit-dot,
  .page-home .home-hero-orbit .home-orbit-dot {
    animation: none !important;
  }
  .page-home .home-orbit-card,
  .page-home .home-entry,
  .page-home .home-tick-tip {
    transition: none;
  }
  .page-home .home-orbit-card:hover,
  .page-home .home-orbit-card:focus-within {
    transform: none;
  }
}
</style>
<<<END>>>

等一下，我输出了 `</style>` 但标记协议要求只输出 MAIN_HTML 和 PAGE_CSS 两个标记。让我重新检查输出格式——PAGE_CSS 标记后应该是纯 CSS，不应包含 `</style>` 标签。让我修正。

实际上重新看要求：「 当前页面专属 CSS，页面专属选择器全部限定在 .page-home 作用域内」。所以 PAGE_CSS 后面直接是 CSS，到结尾结束。我不该输出 `</style>` 和 `<<<END>>>`。

我重新输出正确版本。
<main id="main-content" class="page-home">

  <section class="home-hero" aria-labelledby="home-hero-title">
    <div class="wrap home-hero-grid">
      <div class="home-hero-copy">
        <p class="breadcrumb">入口索引总入口 · 首页</p>
        <p class="index-label">INDEX 00 / 品牌站入口索引</p>
        <h1 id="home-hero-title" class="home-hero-title">每一条入口，<br>都标着它最近<br>同步的日期</h1>
        <p class="home-hero-lede">银河信誉中心自 2013 年起把散在各处的品牌站入口收进一份可检索的目录，按 9 个一级分类、36 个子栏目排开。您可以直接搜名字，也可以沿着栏目一圈圈往里找。</p>
        <p class="home-hero-hint"><span class="home-hint-mark" aria-hidden="true"></span>在页头第二栏输入「本月变更」，就能翻到刚发布的逐条说明；输入一个分类名，该分类下全部入口连同同步日期会一起列出。</p>
        <dl class="home-hero-stats">
          <div class="home-stat"><dt>收录入口</dt><dd class="mono">1,286</dd></div>
          <div class="home-stat"><dt>一级分类</dt><dd class="mono">9</dd></div>
          <div class="home-stat"><dt>子栏目</dt><dd class="mono">36</dd></div>
          <div class="home-stat"><dt>持续维护</dt><dd class="mono">12<span class="home-stat-unit">年</span></dd></div>
        </dl>
        <div class="home-hero-actions">
          <a class="btn btn-solid" href="/platform/">看看提供哪些服务</a>
          <a class="btn btn-ghost" href="/reports/">打开本月变更说明</a>
        </div>
      </div>
      <div class="home-hero-visual">
        <img class="home-hero-img" src="{zhanqunpic:h:1400w:1200}" width="1200" height="1400" alt="俯视视角的深蓝紫银河带与同心轨道环，中心留出大片负空间的抽象星图">
        <svg class="home-hero-orbit" viewBox="0 0 400 400" aria-hidden="true" focusable="false">
          <circle cx="200" cy="200" r="58"></circle>
          <circle cx="200" cy="200" r="104"></circle>
          <circle cx="200" cy="200" r="152"></circle>
          <circle cx="200" cy="200" r="188"></circle>
          <circle class="home-orbit-dot home-orbit-dot-a" cx="200" cy="12" r="3"></circle>
          <circle class="home-orbit-dot home-orbit-dot-b" cx="348" cy="234" r="3"></circle>
          <circle class="home-orbit-dot home-orbit-dot-c" cx="86" cy="306" r="3"></circle>
          <circle class="home-orbit-dot home-orbit-dot-d" cx="118" cy="86" r="2.4"></circle>
        </svg>
      </div>
    </div>
  </section>

  <div class="home-calibration">
    <div class="wrap home-calibration-inner">
      <img class="home-calibration-img" src="{zhanqunpic:h:320w:1600}" width="1600" height="320" alt="长焦压缩下的天文台校准刻度盘局部，青色刻度线与暖金指针清晰可见" loading="lazy" decoding="async">
      <p class="home-calibration-note mono">09:30 / 17:30 例行同步 · 入口调整 2 小时内补录</p>
    </div>
  </div>

  <section class="section home-search" aria-labelledby="home-search-title">
    <div class="wrap editorial-grid home-search-grid">
      <div class="home-search-main">
        <p class="index-label">INDEX 01 / 检索</p>
        <h2 id="home-search-title" class="home-h2">先搜，再顺着栏目往里看</h2>
        <p class="home-lead">检索框常驻在页头第二栏，页面往下滚它也不会走开。入口名称、常用别名、所属分类、同步日期，四种维度挑一个开始就行，输入即出候选，回车进入结果列表。</p>
        <div class="home-search-demo">
          <div class="home-demo-row">
            <span class="mono home-demo-input">本月变更</span>
            <span class="home-demo-arrow" aria-hidden="true">→</span>
            <span class="home-demo-out">直接翻到本月的逐条说明，新增、迁移、停用分列清楚</span>
          </div>
          <div class="home-demo-row">
            <span class="mono home-demo-input">电商与零售</span>
            <span class="home-demo-arrow" aria-hidden="true">→</span>
            <span class="home-demo-out">列出该分类下全部入口卡片，每张卡片带最近一次同步日期</span>
          </div>
          <div class="home-demo-row">
            <span class="mono home-demo-input">本月第 2 周</span>
            <span class="home-demo-arrow" aria-hidden="true">→</span>
            <span class="home-demo-out">按同步时间收窄范围，最近同步过的排在前面</span>
          </div>
        </div>
        <p class="home-note">结果页一次展示 20 条，还能再按分类和同步时间筛一遍。找到目标后可以直接整块点开卡片，也可以把几条入口勾出来做并列比较。</p>
      </div>
      <aside class="note-col home-search-note">
        <p class="index-label">检索维度</p>
        <ol class="home-dim-list">
          <li><span class="mono">01</span>入口名称</li>
          <li><span class="mono">02</span>常用别名</li>
          <li><span class="mono">03</span>所属分类</li>
          <li><span class="mono">04</span>同步日期</li>
        </ol>
        <p class="home-note-sm">需要把整批数据接到自己系统里的企业客户，可以走分类目录接口，按分类取回入口条目与同步日期，具体开通方式写在<a class="link-gold" href="/platform/">平台服务</a>里。</p>
      </aside>
    </div>
  </section>

  <section class="section home-orbits" aria-labelledby="home-orbits-title">
    <div class="wrap">
      <div class="home-section-head">
        <p class="index-label">INDEX 02 / 栏目</p>
        <h2 id="home-orbits-title" class="home-h2">九个一级分类，绕成三圈</h2>
        <p class="home-lead">从最常打交道的一圈开始，越往外分得越细。每张卡片只留三条要点，想看全就展开；卡片右下角是该分类最近一次同步的日期，横向扫一眼就知道谁刚更新过。</p>
      </div>

      <div class="home-ring">
        <p class="home-ring-label mono">内环 · 高频直达</p>
        <div class="home-ring-cards">

          <article class="card home-orbit-card">
            <header class="card-head">
              <span class="index-label">01 / EC</span>
              <h3 class="card-title">电商与零售</h3>
            </header>
            <div class="card-body">
              <p class="home-orbit-meta"><span class="mono">4</span> 个子栏目 · 本月更新 <span class="mono">11</span> 条</p>
              <div class="expand">
                <button class="expand-toggle" type="button" data-expand-toggle aria-controls="orbit-ec" aria-expanded="false">三条要点</button>
                <div class="expand-panel" id="orbit-ec">
                  <ul class="home-points">
                    <li>综合商城、垂直品类与跨境站点的归属划分</li>
                    <li>大促期临时域名与跳转入口的收录方式</li>
                    <li>子栏目：综合商城 / 垂直品类 / 跨境站点 / 品牌旗舰</li>
                  </ul>
                </div>
              </div>
            </div>
            <footer class="card-foot">
              <span class="tag tag-synced"><span class="dot dot-live" aria-hidden="true"></span>已同步</span>
              <span class="sync-date">今天 17:30</span>
            </footer>
          </article>

          <article class="card home-orbit-card">
            <header class="card-head">
              <span class="index-label">02 / FI</span>
              <h3 class="card-title">金融与支付</h3>
            </header>
            <div class="card-body">
              <p class="home-orbit-meta"><span class="mono">5</span> 个子栏目 · 本月更新 <span class="mono">6</span> 条</p>
              <div class="expand">
                <button class="expand-toggle" type="button" data-expand-toggle aria-controls="orbit-fi" aria-expanded="false">三条要点</button>
                <div class="expand-panel" id="orbit-fi">
                  <ul class="home-points">
                    <li>银行、支付机构与保险服务入口的别名绑定</li>
                    <li>同一机构多个业务入口的区分与合并处理</li>
                    <li>子栏目：银行服务 / 支付机构 / 保险服务 / 证券基金 / 金融信息</li>
                  </ul>
                </div>
              </div>
            </div>
            <footer class="card-foot">
              <span class="tag tag-synced"><span class="dot dot-live" aria-hidden="true"></span>已同步</span>
              <span class="sync-date">今天 09:30</span>
            </footer>
          </article>

          <article class="card home-orbit-card">
            <header class="card-head">
              <span class="index-label">03 / GV</span>
              <h3 class="card-title">政务与公共服务</h3>
            </header>
            <div class="card-body">
              <p class="home-orbit-meta"><span class="mono">4</span> 个子栏目 · 本月更新 <span class="mono">4</span> 条</p>
              <div class="expand">
                <button class="expand-toggle" type="button" data-expand-toggle aria-controls="orbit-gv" aria-expanded="false">三条要点</button>
                <div class="expand-panel" id="orbit-gv">
                  <ul class="home-points">
                    <li>省市两级服务平台的入口命名与层级关系</li>
                    <li>事项办理入口迁移后的补录节奏</li>
                    <li>子栏目：省级服务 / 市级服务 / 事项办理 / 公共查询</li>
                  </ul>
                </div>
              </div>
            </div>
            <footer class="card-foot">
              <span class="tag tag-synced"><span class="dot dot-live" aria-hidden="true"></span>已同步</span>
              <span class="sync-date">昨天 09:30</span>
            </footer>
          </article>

        </div>
      </div>

      <div class="home-ring">
        <p class="home-ring-label mono">中环 · 常用细分</p>
        <div class="home-ring-cards">

          <article class="card home-orbit-card">
            <header class="card-head">
              <span class="index-label">04 / ED</span>
              <h3 class="card-title">教育与培训</h3>
            </header>
            <div class="card-body">
              <p class="home-orbit-meta"><span class="mono">4</span> 个子栏目 · 本月更新 <span class="mono">8</span> 条</p>
              <div class="expand">
                <button class="expand-toggle" type="button" data-expand-toggle aria-controls="orbit-ed" aria-expanded="false">三条要点</button>
                <div class="expand-panel" id="orbit-ed">
                  <ul class="home-points">
                    <li>学历教育、职业培训与考试服务的分类依据</li>
                    <li>报名期临时入口的收录与停用标记</li>
                    <li>子栏目：学历教育 / 职业培训 / 考试服务 / 教育资源</li>
                  </ul>
                </div>
              </div>
            </div>
            <footer class="card-foot">
              <span class="tag tag-synced"><span class="dot dot-live" aria-hidden="true"></span>已同步</span>
              <span class="sync-date">昨天 17:30</span>
            </footer>
          </article>

          <article class="card home-orbit-card">
            <header class="card-head">
              <span class="index-label">05 / MD</span>
              <h3 class="card-title">医疗与健康</h3>
            </header>
            <div class="card-body">
              <p class="home-orbit-meta"><span class="mono">3</span> 个子栏目 · 本月更新 <span class="mono">3</span> 条</p>
              <div class="expand">
                <button class="expand-toggle" type="button" data-expand-toggle aria-controls="orbit-md" aria-expanded="false">三条要点</button>
                <div class="expand-panel" id="orbit-md">
                  <ul class="home-points">
                    <li>挂号、报告查询与健康科普入口的归类</li>
                    <li>同一机构多院区入口的区分方式</li>
                    <li>子栏目：预约挂号 / 报告查询 / 健康科普</li>
                  </ul>
                </div>
              </div>
            </div>
            <footer class="card-foot">
              <span class="tag tag-synced"><span class="dot dot-live" aria-hidden="true"></span>已同步</span>
              <span class="sync-date">本月第 2 周</span>
            </footer>
          </article>

          <article class="card home-orbit-card">
            <header class="card-head">
              <span class="index-label">06 / TR</span>
              <h3 class="card-title">出行与物流</h3>
            </header>
            <div class="card-body">
              <p class="home-orbit-meta"><span class="mono">4</span> 个子栏目 · 本月更新 <span class="mono">7</span> 条</p>
              <div class="expand">
                <button class="expand-toggle" type="button" data-expand-toggle aria-controls="orbit-tr" aria-expanded="false">三条要点</button>
                <div class="expand-panel" id="orbit-tr">
                  <ul class="home-points">
                    <li>票务、导航与物流查询入口的归并规则</li>
                    <li>同一平台多端入口的别名统一</li>
                    <li>子栏目：交通票务 / 出行导航 / 物流查询 / 用车服务</li>
                  </ul>
                </div>
              </div>
            </div>
            <footer class="card-foot">
              <span class="tag tag-synced"><span class="dot dot-live" aria-hidden="true"></span>已同步</span>
              <span class="sync-date">本月第 2 周</span>
            </footer>
          </article>

        </div>
      </div>

      <div class="home-ring">
        <p class="home-ring-label mono">外环 · 目录与长尾</p>
        <div class="home-ring-cards">

          <article class="card home-orbit-card">
            <header class="card-head">
              <span class="index-label">07 / ME</span>
              <h3 class="card-title">媒体与内容</h3>
            </header>
            <div class="card-body">
              <p class="home-orbit-meta"><span class="mono">4</span> 个子栏目 · 本月更新 <span class="mono">5</span> 条</p>
              <div class="expand">
                <button class="expand-toggle" type="button" data-expand-toggle aria-controls="orbit-me" aria-expanded="false">三条要点</button>
                <div class="expand-panel" id="orbit-me">
                  <ul class="home-points">
                    <li>资讯、视频与出版机构的入口分类</li>
                    <li>内容平台更名后保留旧别名的处理</li>
                    <li>子栏目：资讯门户 / 视频平台 / 出版机构 / 内容社区</li>
                  </ul>
                </div>
              </div>
            </div>
            <footer class="card-foot">
              <span class="tag tag-review">待复核</span>
              <span class="sync-date">本月第 1 周</span>
            </footer>
          </article>

          <article class="card home-orbit-card">
            <header class="card-head">
              <span class="index-label">08 / BZ</span>
              <h3 class="card-title">企业与办公</h3>
            </header>
            <div class="card-body">
              <p class="home-orbit-meta"><span class="mono">4</span> 个子栏目 · 本月更新 <span class="mono">9</span> 条</p>
              <div class="expand">
                <button class="expand-toggle" type="button" data-expand-toggle aria-controls="orbit-bz" aria-expanded="false">三条要点</button>
                <div class="expand-panel" id="orbit-bz">
                  <ul class="home-points">
                    <li>协同办公、人力与财税服务入口的归置</li>
                    <li>企业服务平台的试用入口与正式入口区分</li>
                    <li>子栏目：协同办公 / 人力资源 / 财税服务 / 企业采购</li>
                  </ul>
                </div>
              </div>
            </div>
            <footer class="card-foot">
              <span class="tag tag-synced"><span class="dot dot-live" aria-hidden="true"></span>已同步</span>
              <span class="sync-date">本月第 1 周</span>
            </footer>
          </article>

          <article class="card home-orbit-card">
            <header class="card-head">
              <span class="index-label">09 / LF</span>
              <h3 class="card-title">生活与服务</h3>
            </header>
            <div class="card-body">
              <p class="home-orbit-meta"><span class="mono">4</span> 个子栏目 · 本月更新 <span class="mono">2</span> 条</p>
              <div class="expand">
                <button class="expand-toggle" type="button" data-expand-toggle aria-controls="orbit-lf" aria-expanded="false">三条要点</button>
                <div class="expand-panel" id="orbit-lf">
                  <ul class="home-points">
                    <li>缴费、社区与本地生活入口的归类</li>
                    <li>城市级服务入口的地域标注方式</li>
                    <li>子栏目：生活缴费 / 社区服务 / 本地生活 / 便民查询</li>
                  </ul>
                </div>
              </div>
            </div>
            <footer class="card-foot">
              <span class="tag tag-synced"><span class="dot dot-live" aria-hidden="true"></span>已同步</span>
              <span class="sync-date">本月第 1 周</span>
            </footer>
          </article>

        </div>
      </div>
    </div>
  </section>

  <section class="section home-changes" aria-labelledby="home-changes-title">
    <div class="wrap">
      <div class="home-section-head">
        <p class="index-label">INDEX 03 / 变更</p>
        <h2 id="home-changes-title" class="home-h2">本月与上一自然月，并排看</h2>
        <p class="home-lead">左边一列是本月，右边一列是上一自然月。每周一格，格子里是当周新增、迁移与停用的条目数，同步时刻对应每日两次的例行校准。鼠标停在刻度上，还能看到那一周更细的增减。</p>
      </div>

      <div class="home-timeline">
        <div class="home-timeline-head">
          <span class="mono home-tl-label">周次</span>
          <span class="mono home-tl-cell">本月</span>
          <span class="mono home-tl-cell">上一自然月</span>
        </div>

        <div class="home-tick">
          <span class="home-tick-label mono">第 1 周</span>
          <span class="home-tick-cell">
            <span class="home-cell home-cell-add">新增 <b class="mono">9</b></span>
            <span class="home-cell home-cell-move">迁移 <b class="mono">3</b></span>
            <span class="home-cell home-cell-off">停用 <b class="mono">1</b></span>
          </span>
          <span class="home-tick-cell">
            <span class="home-cell home-cell-add">新增 <b class="mono">8</b></span>
            <span class="home-cell home-cell-move">迁移 <b class="mono">5</b></span>
            <span class="home-cell home-cell-off">停用 <b class="mono">1</b></span>
          </span>
          <span class="home-tick-tip">第 1 周：新增 9 · 停用 1 · 09:30 起同步</span>
        </div>

        <div class="home-tick">
          <span class="home-tick-label mono">第 2 周</span>
          <span class="home-tick-cell">
            <span class="home-cell home-cell-add">新增 <b class="mono">12</b></span>
            <span class="home-cell home-cell-move">迁移 <b class="mono">4</b></span>
            <span class="home-cell home-cell-off">停用 <b class="mono">2</b></span>
          </span>
          <span class="home-tick-cell">
            <span class="home-cell home-cell-add">新增 <b class="mono">10</b></span>
            <span class="home-cell home-cell-move">迁移 <b class="mono">6</b></span>
            <span class="home-cell home-cell-off">停用 <b class="mono">1</b></span>
          </span>
          <span class="home-tick-tip">第 2 周：新增 12 · 停用 2 · 17:30 起同步</span>
        </div>

        <div class="home-tick">
          <span class="home-tick-label mono">第 3 周</span>
          <span class="home-tick-cell">
            <span class="home-cell home-cell-add">新增 <b class="mono">11</b></span>
            <span class="home-cell home-cell-move">迁移 <b class="mono">4</b></span>
            <span class="home-cell home-cell-off">停用 <b class="mono">2</b></span>
          </span>
          <span class="home-tick-cell">
            <span class="home-cell home-cell-add">新增 <b class="mono">9</b></span>
            <span class="home-cell home-cell-move">迁移 <b class="mono">5</b></span>
            <span class="home-cell home-cell-off">停用 <b class="mono">1</b></span>
          </span>
          <span class="home-tick-tip">第 3 周：新增 11 · 停用 2 · 09:30 起同步</span>
        </div>

        <div class="home-tick">
          <span class="home-tick-label mono">第 4 周</span>
          <span class="home-tick-cell">
            <span class="home-cell home-cell-add">新增 <b class="mono">9</b></span>
            <span class="home-cell home-cell-move">迁移 <b class="mono">2</b></span>
            <span class="home-cell home-cell-off">停用 <b class="mono">1</b></span>
          </span>
          <span class="home-tick-cell">
            <span class="home-cell home-cell-add">新增 <b class="mono">9</b></span>
            <span class="home-cell home-cell-move">迁移 <b class="mono">5</b></span>
            <span class="home-cell home-cell-off">停用 <b class="mono">1</b></span>
          </span>
          <span class="home-tick-tip">第 4 周：新增 9 · 停用 1 · 17:30 起同步</span>
        </div>
      </div>

      <div class="home-change-summary">
        <p class="home-summary-main">本月合计新增 <b class="mono">41</b> 条、迁移 <b class="mono">13</b> 条、停用 <b class="mono">6</b> 条。迁移量比上一自然月的 <b class="mono">21</b> 条低了一截，多数换址在上一自然月就已完成，本月主要做收尾。</p>
        <a class="btn btn-ghost" href="/reports/">看逐条变更说明</a>
      </div>
    </div>
  </section>

  <section class="section home-panel" aria-labelledby="home-panel-title">
    <div class="home-panel-visual">
      <img class="home-panel-img" src="{zhanqunpic:h:480w:1440}" width="1440" height="480" alt="夜间天文台穹顶与星轨长曝光，深蓝底色中带一道微弱青色光弧" loading="lazy" decoding="async">
    </div>
    <div class="wrap home-panel-body">
      <div class="home-section-head">
        <p class="index-label">INDEX 04 / 入口状态</p>
        <h2 id="home-panel-title" class="home-h2">最近同步过的入口，逐条排开</h2>
        <p class="home-lead">下面这批是近期动作比较多的入口。左侧勾选框可以同时选最多 8 条，选好之后在底部并列看各家的最近同步日期和变更次数。</p>
      </div>

      <div class="home-filter">
        <label class="sr-only" for="entry-filter">按名称或分类筛选入口</label>
        <input class="search-input" id="entry-filter" name="entry-filter" type="search" placeholder="输入名称或分类，例如「支付」" data-search-input>
        <button class="search-btn" type="button" data-search-go>筛选</button>
        <span class="search-count mono" data-search-count>共 10 条</span>
      </div>

      <ul class="home-entry-list" id="entry-list">
        <li class="home-entry" data-search-item data-search-text="综合电商主站入口 电商与零售">
          <label class="home-entry-check">
            <input type="checkbox" name="compare-entry">
            <span class="sr-only">把综合电商主站入口加入并列比较</span>
          </label>
          <span class="home-entry-name">综合电商主站入口</span>
          <span class="home-entry-cat">电商与零售</span>
          <span class="home-entry-status"><span class="tag tag-synced">已同步</span></span>
          <span class="home-entry-count mono">变更 11 次</span>
          <span class="home-entry-date sync-date">今天 09:30</span>
        </li>
        <li class="home-entry" data-search-item data-search-text="支付服务商官网入口 金融与支付">
          <label class="home-entry-check">
            <input type="checkbox" name="compare-entry">
            <span class="sr-only">把支付服务商官网入口加入并列比较</span>
          </label>
          <span class="home-entry-name">支付服务商官网入口</span>
          <span class="home-entry-cat">金融与支付</span>
          <span class="home-entry-status"><span class="tag tag-synced">已同步</span></span>
          <span class="home-entry-count mono">变更 6 次</span>
          <span class="home-entry-date sync-date">今天 17:30</span>
        </li>
        <li class="home-entry" data-search-item data-search-text="省级政务服务平台入口 政务与公共服务">
          <label class="home-entry-check">
            <input type="checkbox" name="compare-entry">
            <span class="sr-only">把省级政务服务平台入口加入并列比较</span>
          </label>
          <span class="home-entry-name">省级政务服务平台入口</span>
          <span class="home-entry-cat">政务与公共服务</span>
          <span class="home-entry-status"><span class="tag tag-synced">已同步</span></span>
          <span class="home-entry-count mono">变更 4 次</span>
          <span class="home-entry-date sync-date">昨天 09:30</span>
        </li>
        <li class="home-entry" data-search-item data-search-text="在线教育平台入口 教育与培训">
          <label class="home-entry-check">
            <input type="checkbox" name="compare-entry">
            <span class="sr-only">把在线教育平台入口加入并列比较</span>
          </label>
          <span class="home-entry-name">在线教育平台入口</span>
          <span class="home-entry-cat">教育与培训</span>
          <span class="home-entry-status"><span class="tag tag-synced">已同步</span></span>
          <span class="home-entry-count mono">变更 8 次</span>
          <span class="home-entry-date sync-date">昨天 17:30</span>
        </li>
        <li class="home-entry" data-search-item data-search-text="预约挂号服务入口 医疗与健康">
          <label class="home-entry-check">
            <input type="checkbox" name="compare-entry">
            <span class="sr-only">把预约挂号服务入口加入并列比较</span>
          </label>
          <span class="home-entry-name">预约挂号服务入口</span>
          <span class="home-entry-cat">医疗与健康</span>
          <span class="home-entry-status"><span class="tag tag-synced">已同步</span></span>
          <span class="home-entry-count mono">变更 3 次</span>
          <span class="home-entry-date sync-date">本月第 2 周</span>
        </li>
        <li class="home-entry" data-search-item data-search-text="全国交通票务入口 出行与物流">
          <label class="home-entry-check">
            <input type="checkbox" name="compare-entry">
            <span class="sr-only">把全国交通票务入口加入并列比较</span>
          </label>
          <span class="home-entry-name">全国交通票务入口</span>
          <span class="home-entry-cat">出行与物流</span>
          <span class="home-entry-status"><span class="tag tag-synced">已同步</span></span>
          <span class="home-entry-count mono">变更 7 次</span>
          <span class="home-entry-date sync-date">本月第 2 周</span>
        </li>
        <li class="home-entry" data-search-item data-search-text="资讯门户主站入口 媒体与内容">
          <label class="home-entry-check">
            <input type="checkbox" name="compare-entry">
            <span class="sr-only">把资讯门户主站入口加入并列比较</span>
          </label>
          <span class="home-entry-name">资讯门户主站入口</span>
          <span class="home-entry-cat">媒体与内容</span>
          <span class="home-entry-status"><span class="tag tag-review">待复核</span></span>
          <span class="home-entry-count mono">变更 5 次</span>
          <span class="home-entry-date sync-date">本月第 1 周</span>
        </li>
        <li class="home-entry" data-search-item data-search-text="企业协同办公入口 企业与办公">
          <label class="home-entry-check">
            <input type="checkbox" name="compare-entry">
            <span class="sr-only">把企业协同办公入口加入并列比较</span>
          </label>
          <span class="home-entry-name">企业协同办公入口</span>
          <span class="home-entry-cat">企业与办公</span>
          <span class="home-entry-status"><span class="tag tag-synced">已同步</span></span>
          <span class="home-entry-count mono">变更 9 次</span>
          <span class="home-entry-date sync-date">本月第 1 周</span>
        </li>
        <li class="home-entry" data-search-item data-search-text="生活缴费服务入口 生活与服务">
          <label class="home-entry-check">
            <input type="checkbox" name="compare-entry">
            <span class="sr-only">把生活缴费服务入口加入并列比较</span>
          </label>
          <span class="home-entry-name">生活缴费服务入口</span>
          <span class="home-entry-cat">生活与服务</span>
          <span class="home-entry-status"><span class="tag tag-synced">已同步</span></span>
          <span class="home-entry-count mono">变更 2 次</span>
          <span class="home-entry-date sync-date">本月第 1 周</span>
        </li>
        <li class="home-entry" data-search-item data-search-text="招聘服务平台入口 企业与办公">
          <label class="home-entry-check">
            <input type="checkbox" name="compare-entry">
            <span class="sr-only">把招聘服务平台入口加入并列比较</span>
          </label>
          <span class="home-entry-name">招聘服务平台入口</span>
          <span class="home-entry-cat">企业与办公</span>
          <span class="home-entry-status"><span class="tag home-tag-off">已停用</span></span>
          <span class="home-entry-count mono">变更 12 次</span>
          <span class="home-entry-date sync-date">上一自然月</span>
        </li>
      </ul>

      <div class="home-compare-bar">
        <p>最多同时选 8 条，底部会并列显示各自的最近同步日期与变更次数。</p>
        <a class="btn btn-ghost" href="/platform/">并列比较怎么用</a>
      </div>
    </div>
  </section>

  <section class="section home-paths" aria-labelledby="home-paths-title">
    <div class="wrap">
      <div class="home-section-head">
        <p class="index-label">INDEX 05 / 从哪进</p>
        <h2 id="home-paths-title" class="home-h2">第一次来，三条路都走得通</h2>
        <p class="home-lead">不清楚该从哪儿下手时，挑一条最顺手的就行。三条路通向同一份目录，只是入口位置不一样。</p>
      </div>

      <ol class="home-path-list">
        <li class="home-path">
          <span class="home-path-num mono">01</span>
          <h3 class="home-path-title">已经知道要找什么</h3>
          <p>页头第二栏的检索框一直在。输入名称、别名、分类或同步日期，回车进结果页，最近同步过的排在最前。</p>
          <a class="link-gold" href="/guide/">检索的详细用法</a>
        </li>
        <li class="home-path">
          <span class="home-path-num mono">02</span>
          <h3 class="home-path-title">只记得大概做什么</h3>
          <p>从上面三圈栏目里挑一个最接近的，展开卡片看三条要点，确认对口再逐层往下找。</p>
          <a class="link-gold" href="/guide/">按栏目找的走法</a>
        </li>
        <li class="home-path">
          <span class="home-path-num mono">03</span>
          <h3 class="home-path-title">想先摸清整体</h3>
          <p>刊头导航把六个栏目横排在最上面，从头到尾扫一遍，再决定深挖哪一块。</p>
          <a class="link-gold" href="/overview/">平台是怎么维护的</a>
        </li>
      </ol>

      <p class="home-note">从刊头导航进入通用品牌站入口，平均 2 次点击内就能抵达目标栏目。路径不熟也没关系，走错一步退回来，成本很低。</p>
    </div>
  </section>

  <section class="home-closing" aria-labelledby="home-closing-title">
    <div class="wrap">
      <img class="home-closing-img" src="{zhanqunpic:h:400w:1600}" width="1600" height="400" alt="数据流般的光点沿轨道向中心汇聚，暖金细线在深空中延展" loading="lazy" decoding="async">
      <div class="home-closing-copy">
        <h2 id="home-closing-title" class="home-h2">按日期看得明白，再决定走哪一条</h2>
        <p>每条记录都标着最近一次同步的时间，每次调整都留在可以回看的归档里。需要长期跟进的企业客户，可以开通栏目订阅，入口新增或迁移时收到站内提醒与邮件提醒。目前已有 6,400 余家企业客户在使用，服务覆盖 26 个省份。</p>
        <div class="home-closing-actions">
          <a class="btn btn-solid" href="/cooperation/">聊聊合作</a>
          <a class="btn btn-ghost" href="/platform/">订阅与接口说明</a>
        </div>
      </div>
    </div>
  </section>

</main>

.page-home {
  --home-h2: clamp(26px, 3.6vw, 38px);
  --home-lead-size: 17px;
  --home-tick-label: 68px;
  --home-ring-arc: rgba(108, 74, 182, 0.45);
  --home-card-fill: rgba(42, 51, 80, 0.52);
}

.page-home .home-hero {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(120% 90% at 88% 8%, rgba(108, 74, 182, 0.22), transparent 58%),
    radial-gradient(90% 70% at 6% 96%, rgba(63, 224, 208, 0.10), transparent 62%),
    var(--ink);
}

.page-home .home-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 34px;
  padding: 34px 0 52px;
  align-items: start;
}

.page-home .home-hero-copy {
  min-width: 0;
}

.page-home .home-hero-title {
  margin: 10px 0 0;
  font-family: var(--font-display);
  font-weight: 600;
  font-size: clamp(33px, 8.4vw, 74px);
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: var(--paper);
  padding-bottom: 20px;
  border-bottom: 1px solid var(--line-nebula);
}

.page-home .home-hero-lede {
  margin: 22px 0 0;
  max-width: 34em;
  font-size: var(--home-lead-size);
  line-height: 1.85;
  color: var(--paper);
}

.page-home .home-hero-hint {
  position: relative;
  margin: 20px 0 0;
  padding: 14px 16px 14px 22px;
  font-size: 15px;
  line-height: 1.8;
  color: var(--sand);
  background: var(--home-card-fill);
  border: 1px solid var(--line);
  border-left: 2px solid var(--nebula);
  border-radius: var(--radius);
}

.page-home .home-hint-mark {
  position: absolute;
  left: 8px;
  top: 22px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--pulse);
}

.page-home .home-hero-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px 22px;
  margin: 30px 0 0;
  padding-top: 22px;
  border-top: 1px solid var(--line);
}

.page-home .home-stat dt {
  font-size: 13px;
  color: var(--sand);
  letter-spacing: 0.02em;
  margin-bottom: 6px;
}

.page-home .home-stat dd {
  margin: 0;
  font-size: 26px;
  line-height: 1.2;
  font-weight: 500;
  color: var(--gold);
}

.page-home .home-stat-unit {
  margin-left: 4px;
  font-size: 13px;
  color: var(--sand);
  font-family: var(--font-body);
}

.page-home .home-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 30px;
}

.page-home .home-hero-visual {
  position: relative;
  min-width: 0;
}

.page-home .home-hero-img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: var(--radius);
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
}

.page-home .home-hero-orbit {
  position: absolute;
  inset: 0;
  width: 74%;
  height: 74%;
  margin: auto;
  overflow: visible;
}

.page-home .home-hero-orbit circle {
  fill: none;
  stroke: rgba(108, 74, 182, 0.55);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

.page-home .home-hero-orbit .home-orbit-dot {
  fill: var(--pulse);
  stroke: none;
  opacity: 0.9;
}

.page-home .home-orbit-dot-a { animation: home-drift-a 34s ease-in-out infinite; }
.page-home .home-orbit-dot-b { animation: home-drift-b 40s ease-in-out infinite; }
.page-home .home-orbit-dot-c { animation: home-drift-c 28s ease-in-out infinite; }
.page-home .home-orbit-dot-d { animation: home-drift-b 36s ease-in-out infinite reverse; }

@keyframes home-drift-a {
  0%, 100% { transform: translate(0, 0); opacity: 0.9; }
  50% { transform: translate(4px, 3px); opacity: 0.45; }
}
@keyframes home-drift-b {
  0%, 100% { transform: translate(0, 0); opacity: 0.8; }
  50% { transform: translate(-5px, 2px); opacity: 0.4; }
}
@keyframes home-drift-c {
  0%, 100% { transform: translate(0, 0); opacity: 0.85; }
  50% { transform: translate(3px, -4px); opacity: 0.45; }
}

.page-home .home-calibration {
  background: var(--ink-deep);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.page-home .home-calibration-inner {
  position: relative;
}

.page-home .home-calibration-img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 5;
  object-fit: cover;
  opacity: 0.55;
  max-height: 180px;
}

.page-home .home-calibration-note {
  margin: 0;
  padding: 12px 0;
  font-size: 12px;
  letter-spacing: 0.08em;
  color: var(--pulse);
  text-transform: uppercase;
}

.page-home .home-h2 {
  margin: 8px 0 0;
  font-family: var(--font-display);
  font-weight: 500;
  font-size: var(--home-h2);
  line-height: 1.28;
  letter-spacing: -0.01em;
  color: var(--paper);
}

.page-home .home-lead {
  margin: 16px 0 0;
  max-width: 44em;
  font-size: var(--home-lead-size);
  line-height: 1.85;
  color: var(--sand);
}

.page-home .home-note {
  margin: 22px 0 0;
  font-size: 15px;
  line-height: 1.8;
  color: var(--sand);
}

.page-home .home-note-sm {
  margin: 16px 0 0;
  font-size: 14px;
  line-height: 1.8;
  color: var(--sand);
}

.page-home .home-section-head {
  max-width: 62em;
  margin-bottom: 34px;
}

.page-home .home-search-grid.editorial-grid {
  grid-template-columns: minmax(0, 1fr);
  gap: 34px;
}

.page-home .home-search-demo {
  margin-top: 26px;
  border-top: 1px solid var(--line);
}

.page-home .home-demo-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 6px;
  padding: 16px 0;
  border-bottom: 1px solid var(--line);
  font-size: 15px;
  line-height: 1.75;
  color: var(--sand);
}

.page-home .home-demo-input {
  display: inline-block;
  align-self: start;
  justify-self: start;
  padding: 3px 10px;
  font-size: 13px;
  color: var(--gold);
  border: 1px solid rgba(245, 193, 108, 0.5);
  border-radius: var(--radius);
  background: rgba(245, 193, 108, 0.07);
}

.page-home .home-demo-arrow {
  display: none;
  color: var(--nebula);
}

.page-home .home-demo-out {
  color: var(--paper);
}

.page-home .home-search-note {
  margin-top: 6px;
}

.page-home .home-dim-list {
  list-style: none;
  margin: 14px 0 0;
  padding: 0;
}

.page-home .home-dim-list li {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 10px 0;
  font-size: 15px;
  color: var(--paper);
  border-bottom: 1px solid var(--line);
}

.page-home .home-dim-list .mono {
  font-size: 12px;
  color: var(--pulse);
  letter-spacing: 0.08em;
}

.page-home .home-orbits {
  background:
    radial-gradient(80% 60% at 10% 0%, rgba(108, 74, 182, 0.16), transparent 60%),
    var(--ink);
  border-top: 1px solid var(--line);
}

.page-home .home-ring {
  position: relative;
  padding-left: 16px;
  margin-bottom: 46px;
  border-left: 1px solid var(--home-ring-arc);
}

.page-home .home-ring:last-of-type {
  margin-bottom: 0;
}

.page-home .home-ring-label {
  margin: 0 0 18px;
  font-size: 12px;
  letter-spacing: 0.14em;
  color: var(--nebula);
  text-transform: uppercase;
}

.page-home .home-ring-cards {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 18px;
}

.page-home .home-orbit-card {
  display: flex;
  flex-direction: column;
  padding: 20px 18px 16px;
  background: var(--home-card-fill);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  transition: border-color 0.18s ease, transform 0.18s ease;
}

.page-home .home-orbit-card:hover,
.page-home .home-orbit-card:focus-within {
  border-color: rgba(108, 74, 182, 0.65);
  transform: translateY(-2px);
}

.page-home .home-orbit-card .card-title {
  margin: 6px 0 0;
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 21px;
  line-height: 1.35;
  color: var(--paper);
}

.page-home .home-orbit-card .card-body {
  flex: 1 1 auto;
  padding: 0;
}

.page-home .home-orbit-meta {
  margin: 12px 0 0;
  font-size: 13px;
  line-height: 1.7;
  color: var(--sand);
}

.page-home .home-orbit-meta .mono {
  color: var(--pulse);
}

.page-home .home-points {
  list-style: none;
  margin: 10px 0 0;
  padding: 0;
}

.page-home .home-points li {
  position: relative;
  padding: 7px 0 7px 14px;
  font-size: 14px;
  line-height: 1.72;
  color: var(--sand);
  border-top: 1px solid var(--line);
}

.page-home .home-points li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 15px;
  width: 4px;
  height: 1px;
  background: var(--nebula);
}

.page-home .home-orbit-card .card-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 16px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

.page-home .home-changes {
  background: var(--ink-deep);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.page-home .home-timeline {
  border-top: 1px solid var(--line-2);
}

.page-home .home-timeline-head,
.page-home .home-tick {
  position: relative;
  display: grid;
  grid-template-columns: var(--home-tick-label) minmax(0, 1fr);
  gap: 8px 14px;
  align-items: start;
  padding: 14px 0;
  border-bottom: 1px solid var(--line);
}

.page-home .home-timeline-head {
  align-items: center;
  padding-bottom: 10px;
}

.page-home .home-tl-label {
  font-size: 12px;
  letter-spacing: 0.08em;
  color: var(--sand);
}

.page-home .home-tl-cell {
  font-size: 12px;
  letter-spacing: 0.1em;
  color: var(--gold);
}

.page-home .home-timeline-head .home-tl-cell:first-of-type {
  display: none;
}

.page-home .home-tick-label {
  font-size: 13px;
  letter-spacing: 0.04em;
  color: var(--paper);
  padding-top: 3px;
}

.page-home .home-tick-cell {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  font-size: 13px;
  line-height: 1.6;
  color: var(--sand);
}

.page-home .home-cell b {
  font-weight: 500;
  font-size: 14px;
}

.page-home .home-cell-add b { color: var(--pulse); }
.page-home .home-cell-move b { color: var(--paper); }
.page-home .home-cell-off b { color: var(--clay); }

.page-home .home-tick-tip {
  grid-column: 1 / -1;
  margin-top: 2px;
  font-size: 12px;
  letter-spacing: 0.04em;
  color: var(--sand);
  opacity: 0.55;
  transition: opacity 0.18s ease, color 0.18s ease;
}

.page-home .home-tick:hover .home-tick-tip {
  opacity: 1;
  color: var(--gold);
}

.page-home .home-change-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  align-items: center;
  justify-content: space-between;
  margin-top: 28px;
  padding: 20px 20px 20px 22px;
  border: 1px solid var(--line-nebula);
  border-left: 2px solid var(--gold);
  border-radius: var(--radius);
  background: var(--home-card-fill);
}

.page-home .home-summary-main {
  margin: 0;
  flex: 1 1 22em;
  font-size: 15px;
  line-height: 1.85;
  color: var(--paper);
}

.page-home .home-summary-main .mono {
  color: var(--gold);
  font-size: 15px;
}

.page-home .home-panel {
  background: var(--ink);
}

.page-home .home-panel-visual {
  margin-bottom: 44px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.page-home .home-panel-img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 1;
  object-fit: cover;
  max-height: 300px;
  opacity: 0.7;
}

.page-home .home-panel-body {
  min-width: 0;
}

.page-home .home-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-bottom: 20px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--rock);
}

.page-home .home-filter .search-input {
  flex: 1 1 14em;
  min-width: 0;
}

.page-home .home-filter .search-count {
  font-size: 13px;
  color: var(--sand);
  margin-left: auto;
}

.page-home .home-entry-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
}

.page-home .home-entry {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 16px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--home-card-fill);
  transition: border-color 0.16s ease, background-color 0.16s ease;
}

.page-home .home-entry:hover {
  border-color: rgba(63, 224, 208, 0.5);
}

.page-home .home-entry:has(input:checked) {
  border-color: var(--gold);
  background: rgba(245, 193, 108, 0.07);
}

.page-home .home-entry-check {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  cursor: pointer;
}

.page-home .home-entry-check input {
  width: 16px;
  height: 16px;
  accent-color: var(--gold);
  cursor: pointer;
}

.page-home .home-entry-name {
  flex: 1 1 12em;
  min-width: 0;
  font-size: 16px;
  font-weight: 500;
  color: var(--paper);
}

.page-home .home-entry-cat {
  flex: 0 1 auto;
  font-size: 13px;
  color: var(--sand);
}

.page-home .home-entry-status {
  flex: 0 0 auto;
}

.page-home .home-tag-off {
  border-color: rgba(193, 118, 90, 0.7);
  color: var(--clay);
  background: transparent;
}

.page-home .home-entry-count {
  flex: 0 0 auto;
  font-size: 13px;
  color: var(--sand);
}

.page-home .home-entry-date {
  flex: 0 0 auto;
  margin-left: auto;
  font-size: 13px;
  letter-spacing: 0.04em;
  color: var(--gold);
}

.page-home .home-compare-bar {
  position: sticky;
  bottom: 0;
  z-index: 6;
  display: flex;
  flex-wrap: wrap;
  gap: 12px 20px;
  align-items: center;
  justify-content: space-between;
  margin-top: 22px;
  padding: 14px 18px;
  background: var(--ink-deep);
  border: 1px solid var(--line-nebula);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

.page-home .home-compare-bar p {
  margin: 0;
  flex: 1 1 16em;
  font-size: 14px;
  line-height: 1.7;
  color: var(--sand);
}

.page-home .home-paths {
  background: var(--ink);
  border-top: 1px solid var(--line);
}

.page-home .home-path-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 18px;
}

.page-home .home-path {
  position: relative;
  padding: 26px 20px 20px;
  border-top: 1px solid var(--line-2);
  border-radius: var(--radius);
  background: linear-gradient(180deg, rgba(42, 51, 80, 0.55), rgba(11, 27, 58, 0));
}

.page-home .home-path-num {
  display: block;
  font-size: 30px;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--nebula);
}

.page-home .home-path-title {
  margin: 14px 0 0;
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 20px;
  line-height: 1.4;
  color: var(--paper);
}

.page-home .home-path p {
  margin: 10px 0 14px;
  font-size: 15px;
  line-height: 1.8;
  color: var(--sand);
}

.page-home .home-closing {
  padding: 0 0 72px;
  background: var(--ink-deep);
}

.page-home .home-closing-img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 1;
  object-fit: cover;
  max-height: 260px;
  opacity: 0.62;
}

.page-home .home-closing-copy {
  max-width: 62em;
  margin: 0 auto;
  padding-top: 38px;
}

.page-home .home-closing-copy p {
  margin: 16px 0 0;
  font-size: var(--home-lead-size);
  line-height: 1.85;
  color: var(--sand);
}

.page-home .home-closing-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 26px;
}

@media (min-width: 620px) {
  .page-home .home-hero-stats {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .page-home .home-hero-img {
    aspect-ratio: 6 / 7;
  }
  .page-home .home-demo-row {
    grid-template-columns: auto auto minmax(0, 1fr);
    align-items: center;
    gap: 14px;
  }
  .page-home .home-demo-arrow {
    display: inline;
  }
}

@media (min-width: 768px) {
  .page-home .home-ring-cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .page-home .home-ring-cards > .home-orbit-card:nth-child(2) {
    margin-top: 26px;
  }
  .page-home .home-ring-cards > .home-orbit-card:nth-child(3) {
    margin-top: 52px;
  }
  .page-home .home-timeline-head,
  .page-home .home-tick {
    grid-template-columns: var(--home-tick-label) minmax(0, 1fr) minmax(0, 1fr);
    align-items: center;
  }
  .page-home .home-timeline-head .home-tl-cell:first-of-type {
    display: block;
    color: var(--sand);
  }
  .page-home .home-tick-tip {
    grid-column: 2 / -1;
  }
  .page-home .home-path-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
  }
}

@media (min-width: 900px) {
  .page-home .home-hero-grid {
    grid-template-columns: 58fr 42fr;
    gap: clamp(32px, 5vw, 76px);
    padding: 60px 0 78px;
  }
  .page-home .home-search-grid.editorial-grid {
    grid-template-columns: minmax(0, 7fr) minmax(0, 4fr);
    gap: 46px;
  }
  .page-home .home-ring {
    padding-left: 24px;
    margin-bottom: 58px;
  }
  .page-home .home-entry {
    display: grid;
    grid-template-columns: 24px minmax(0, 1.8fr) minmax(0, 1.1fr) 84px 92px 116px;
    align-items: center;
    gap: 0 18px;
  }
  .page-home .home-entry-date {
    margin-left: 0;
    text-align: right;
  }
  .page-home .home-entry-cat,
  .page-home .home-entry-count {
    text-align: left;
  }
}

@media (min-width: 1120px) {
  .page-home .home-hero-grid {
    padding: 78px 0 96px;
  }
  .page-home .home-hero-hint {
    max-width: 32em;
  }
}

@media (prefers-reduced-motion: reduce) {
  .page-home .home-orbit-dot,
  .page-home .home-hero-orbit .home-orbit-dot {
    animation: none !important;
  }
  .page-home .home-orbit-card,
  .page-home .home-entry,
  .page-home .home-tick-tip {
    transition: none;
  }
  .page-home .home-orbit-card:hover,
  .page-home .home-orbit-card:focus-within {
    transform: none;
  }
}