.page-home {
  --ph-radius: 14px;
  --ph-cell-pad: clamp(1rem, 2vw, 1.5rem);
  background: var(--deep-night);
  color: var(--warm-white);
  overflow-x: hidden;
}

/* ============ 首屏框景 ============ */
.page-home .ph-hero {
  position: relative;
  isolation: isolate;
  padding: clamp(4.5rem, 12vw, 7.5rem) 0 clamp(2rem, 6vw, 4.5rem);
}

.page-home .ph-hero__bg {
  position: absolute;
  inset: 0;
  z-index: -1;
  overflow: hidden;
}

.page-home .ph-hero__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.24;
  filter: saturate(0.68);
}

.page-home .ph-hero__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(120% 88% at 78% 8%, rgba(35, 230, 208, 0.16), transparent 60%),
    radial-gradient(90% 70% at 8% 92%, rgba(255, 106, 77, 0.1), transparent 62%),
    linear-gradient(180deg, rgba(6, 26, 46, 0.4), var(--deep-night) 94%);
}

.page-home .ph-frame {
  position: relative;
  border: 1px solid var(--deep-line);
  border-radius: 6px;
  padding: clamp(1.25rem, 3.2vw, 2.75rem);
  background: rgba(13, 42, 70, 0.42);
  backdrop-filter: blur(6px);
}

.page-home .ph-frame::before,
.page-home .ph-frame::after {
  content: "";
  position: absolute;
  left: 2%;
  right: 2%;
  height: 8px;
  pointer-events: none;
  background-image: repeating-linear-gradient(90deg, var(--deep-line) 0 1px, transparent 1px 22px);
  opacity: 0.85;
}

.page-home .ph-frame::before { top: -1px; }
.page-home .ph-frame::after { bottom: -1px; }

.page-home .ph-tick {
  position: absolute;
  width: 16px;
  height: 16px;
  border: 2px solid var(--neon-cyan);
  pointer-events: none;
}

.page-home .ph-tick--tl { top: -1px; left: -1px; border-right: 0; border-bottom: 0; }
.page-home .ph-tick--tr { top: -1px; right: -1px; border-left: 0; border-bottom: 0; }
.page-home .ph-tick--bl { bottom: -1px; left: -1px; border-right: 0; border-top: 0; }
.page-home .ph-tick--br { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }

.page-home .ph-hero__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(1.5rem, 3.5vw, 2.75rem);
}

.page-home .ph-context {
  margin: 0 0 0.75rem;
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--neon-soft);
}

.page-home .ph-hero h1 {
  margin: 0 0 1rem;
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(2.1rem, 6.4vw, 4.25rem);
  line-height: 1.04;
  letter-spacing: -0.01em;
  color: var(--white);
}

.page-home .ph-hero__lede {
  margin: 0 0 1.5rem;
  max-width: 54ch;
  font-size: var(--fs-md);
  line-height: 1.8;
  color: var(--mist);
}

.page-home .ph-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-bottom: 2rem;
}

.page-home .ph-hero__facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem;
  margin: 0;
  padding-top: 1.25rem;
  border-top: 1px dashed rgba(27, 74, 115, 0.85);
}

.page-home .ph-fact dt {
  font-size: var(--fs-xs);
  color: var(--mist);
  margin-bottom: 0.35rem;
}

.page-home .ph-fact dd {
  margin: 0;
  font-family: var(--font-mono);
  font-size: clamp(1.35rem, 3.5vw, 1.9rem);
  font-weight: 700;
  color: var(--neon-cyan);
  line-height: 1;
}

.page-home .ph-fact dd span {
  font-size: var(--fs-xs);
  margin-left: 0.15rem;
  color: var(--mist);
}

/* 首屏右侧竖向时间轴 */
.page-home .ph-rail {
  align-self: start;
}

.page-home .ph-rail__title {
  margin: 0 0 0.75rem;
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--coral);
}

.page-home .ph-rail__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.page-home .ph-rail__item {
  position: relative;
  display: grid;
  grid-template-columns: 3.6rem minmax(0, 1fr);
  gap: 0.15rem 0.7rem;
  padding: 0.8rem 0 0.8rem 1rem;
  border-left: 2px solid var(--deep-line);
  border-bottom: 1px dashed rgba(27, 74, 115, 0.5);
}

.page-home .ph-rail__item::before {
  content: "";
  position: absolute;
  left: -5px;
  top: 1.15rem;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--neon-cyan);
  box-shadow: 0 0 0 3px rgba(35, 230, 208, 0.16);
}

.page-home .ph-rail__time {
  grid-row: span 2;
  font-size: var(--fs-sm);
  font-weight: 700;
  color: var(--white);
  padding-top: 0.1rem;
}

.page-home .ph-rail__name {
  font-size: var(--fs-sm);
  color: var(--warm-white);
}

.page-home .ph-rail__meta {
  font-size: var(--fs-xs);
  color: var(--mist);
}

.page-home .ph-rail__more {
  display: inline-block;
  margin-top: 0.9rem;
  font-size: var(--fs-sm);
  color: var(--neon-cyan);
  text-decoration: none;
  border-bottom: 1px solid rgba(35, 230, 208, 0.4);
}

.page-home .ph-rail__more:hover {
  color: var(--coral);
  border-bottom-color: var(--coral);
}

/* ============ 通用区块 ============ */
.page-home .ph-section {
  padding: clamp(2.5rem, 7vw, 5rem) 0;
}

.page-home .ph-head {
  max-width: 64ch;
  margin-bottom: clamp(1.5rem, 4vw, 2.5rem);
}

.page-home .ph-head h2 {
  margin: 0.35rem 0 0.85rem;
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(1.7rem, 4.4vw, 2.75rem);
  line-height: 1.12;
  color: var(--white);
}

.page-home .ph-head__lede {
  margin: 0;
  font-size: var(--fs-md);
  line-height: 1.8;
  color: var(--mist);
}

/* ============ 赛季索引台 Bento ============ */
.page-home .ph-bento {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.875rem;
}

.page-home .ph-cell {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: var(--ph-cell-pad);
  border: 1px solid var(--deep-line);
  border-radius: var(--ph-radius);
  background: var(--deep-step);
  transition: border-color var(--t-mid) var(--ease), transform var(--t-mid) var(--ease);
}

.page-home .ph-cell:hover {
  border-color: var(--coral);
  transform: translateY(-3px);
}

.page-home .ph-cell__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
  flex-wrap: wrap;
}

.page-home .ph-cell__meta {
  font-size: var(--fs-xs);
  color: var(--mist);
}

.page-home .ph-cell__title {
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(1.15rem, 2.6vw, 1.5rem);
  line-height: 1.2;
  color: var(--white);
}

.page-home .ph-cell__body {
  margin: 0;
  font-size: var(--fs-sm);
  line-height: 1.75;
  color: var(--mist);
}

.page-home .ph-cell__media {
  border-radius: 10px;
  overflow: hidden;
  aspect-ratio: 5 / 2;
  background: var(--deep-night);
}

.page-home .ph-cell__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.page-home .ph-cell__link {
  display: inline-block;
  margin-top: auto;
  padding-top: 0.5rem;
  font-size: var(--fs-sm);
  font-weight: 600;
  color: var(--neon-cyan);
  text-decoration: none;
  border-bottom: 1px solid rgba(35, 230, 208, 0.35);
  align-self: flex-start;
  transition: color var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease);
}

.page-home .ph-cell__link:hover { color: var(--coral); border-bottom-color: var(--coral); }
.page-home .ph-cell__link--amber { color: var(--amber); border-bottom-color: rgba(255, 177, 60, 0.4); }
.page-home .ph-cell__link--amber:hover { color: var(--coral); border-bottom-color: var(--coral); }
.page-home .ph-cell__link--coral { color: var(--coral); border-bottom-color: rgba(255, 106, 77, 0.4); }

.page-home .ph-league__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.page-home .ph-league__list li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.45rem 0;
  border-bottom: 1px dashed rgba(27, 74, 115, 0.7);
  font-size: var(--fs-sm);
}

.page-home .ph-league__list li:last-child { border-bottom: 0; }
.page-home .ph-league__list li > span:first-child { color: var(--warm-white); }
.page-home .ph-league__list li > .num { color: var(--pitch); font-size: var(--fs-xs); }
.page-home .ph-league__list--amber li > .num { color: var(--amber); }

.page-home .ph-chiprow {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin: 0;
  padding: 0;
}

.page-home .ph-chiprow li {
  padding: 0.2rem 0.6rem;
  border: 1px solid var(--deep-line);
  border-radius: 999px;
  font-size: var(--fs-xs);
  color: var(--mist);
}

/* 控球率环形 */
.page-home .ph-ring {
  position: relative;
  width: 92px;
  height: 92px;
  border-radius: 50%;
  background: conic-gradient(var(--neon-cyan) 0 58%, var(--deep-line) 58% 100%);
  display: grid;
  place-items: center;
  margin: 0.25rem 0;
}

.page-home .ph-ring::after {
  content: "";
  position: absolute;
  inset: 9px;
  border-radius: 50%;
  background: var(--deep-step);
}

.page-home .ph-ring__value {
  position: relative;
  z-index: 1;
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--white);
}

/* ============ 横向赛程时间轴 ============ */
.page-home .ph-track {
  overflow-x: auto;
  overflow-y: hidden;
  padding: 0.25rem 0 1.25rem;
  padding-inline: max(var(--gutter), calc((100% - var(--shell)) / 2));
  scroll-snap-type: x proximity;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: var(--deep-line) transparent;
}

.page-home .ph-track__list {
  display: flex;
  gap: 0.75rem;
  list-style: none;
  margin: 0;
  padding: 0;
  min-width: max-content;
}

.page-home .ph-track__item {
  scroll-snap-align: start;
  flex: 0 0 clamp(190px, 58vw, 232px);
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  padding: 1rem;
  border: 1px solid var(--deep-line);
  border-radius: var(--ph-radius);
  background: linear-gradient(180deg, var(--deep-step), rgba(6, 26, 46, 0.9));
  transition: border-color var(--t-mid) var(--ease);
}

.page-home .ph-track__item:hover { border-color: var(--neon-cyan); }

.page-home .ph-track__day {
  font-size: var(--fs-xs);
  letter-spacing: 0.1em;
  color: var(--mist);
}

.page-home .ph-track__time {
  font-size: clamp(1.5rem, 4vw, 1.9rem);
  font-weight: 700;
  color: var(--white);
  line-height: 1;
}

.page-home .ph-track__note {
  font-size: var(--fs-xs);
  color: var(--mist);
  line-height: 1.6;
}

/* ============ 看球数据窗 ============ */
.page-home .ph-data__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.875rem;
}

.page-home .ph-metric {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  padding: var(--ph-cell-pad);
  border: 1px solid var(--deep-line);
  border-radius: var(--ph-radius);
  background: rgba(13, 42, 70, 0.7);
  transition: border-color var(--t-mid) var(--ease);
}

.page-home .ph-metric:hover { border-color: var(--neon-cyan); }

.page-home .ph-metric__value {
  margin: 0;
  font-size: clamp(1.9rem, 6vw, 2.6rem);
  font-weight: 700;
  color: var(--neon-cyan);
  line-height: 1;
}

.page-home .ph-metric__label {
  margin: 0;
  font-size: var(--fs-sm);
  color: var(--warm-white);
}

.page-home .ph-metric__note {
  margin: 0;
  font-size: var(--fs-xs);
  color: var(--mist);
}

.page-home .ph-metric--ring {
  align-items: flex-start;
  grid-column: span 2;
}

.page-home .ph-cross {
  display: grid;
  gap: 1.25rem;
  margin-top: 1.25rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  border: 1px solid rgba(255, 177, 60, 0.35);
  border-radius: var(--ph-radius);
  background: linear-gradient(120deg, rgba(20, 24, 29, 0.95), rgba(255, 177, 60, 0.12));
}

.page-home .ph-cross__title {
  margin: 0.6rem 0 0.5rem;
  font-family: var(--font-display);
  font-size: clamp(1.15rem, 3vw, 1.5rem);
  line-height: 1.3;
  color: var(--white);
}

.page-home .ph-cross__text {
  margin: 0;
  font-size: var(--fs-sm);
  line-height: 1.8;
  color: var(--mist);
}

.page-home .ph-cross .btn {
  justify-self: start;
}

/* ============ 场馆与季票 ============ */
.page-home .ph-vfigure {
  position: relative;
  margin: 0;
  overflow: hidden;
}

.page-home .ph-vfigure img {
  display: block;
  width: 100%;
  height: clamp(240px, 40vw, 480px);
  object-fit: cover;
}

.page-home .ph-vlayer {
  position: absolute;
  inset: auto 0 0 0;
  padding: clamp(1rem, 3vw, 2rem);
  background: linear-gradient(0deg, rgba(6, 26, 46, 0.95), rgba(6, 26, 46, 0.5) 62%, transparent);
}

.page-home .ph-vfacts {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 2.5rem;
  margin: 0;
  padding: 0;
}

.page-home .ph-vfacts li {
  display: flex;
  align-items: baseline;
  gap: 0.4rem;
}

.page-home .ph-vfacts .num {
  font-size: clamp(1.4rem, 3.6vw, 2rem);
  font-weight: 700;
  color: var(--neon-cyan);
  line-height: 1;
}

.page-home .ph-vfacts em {
  font-style: normal;
  font-size: var(--fs-xs);
  color: var(--mist);
}

.page-home .ph-vnotes {
  display: grid;
  gap: 0.875rem;
  margin-top: 1.5rem;
}

.page-home .ph-vnote {
  padding: 1.25rem;
  border-left: 3px solid var(--deep-line);
  background: rgba(13, 42, 70, 0.5);
  border-radius: 0 var(--ph-radius) var(--ph-radius) 0;
}

.page-home .ph-vnote h3 {
  margin: 0 0 0.5rem;
  font-family: var(--font-display);
  font-size: var(--fs-md);
  color: var(--white);
}

.page-home .ph-vnote p {
  margin: 0;
  font-size: var(--fs-sm);
  line-height: 1.75;
  color: var(--mist);
}

/* ============ 为什么留在这里 ============ */
.page-home .ph-why__list {
  counter-reset: why;
  list-style: none;
  display: grid;
  gap: 0.875rem;
  margin: 0;
  padding: 0;
}

.page-home .ph-why__item {
  counter-increment: why;
  position: relative;
  padding: 1.25rem 1.25rem 1.25rem 3.5rem;
  border: 1px solid var(--deep-line);
  border-radius: var(--ph-radius);
  background: var(--deep-step);
  transition: border-color var(--t-mid) var(--ease);
}

.page-home .ph-why__item:hover { border-color: var(--neon-cyan); }

.page-home .ph-why__item::before {
  content: counter(why, decimal-leading-zero);
  position: absolute;
  left: 1.25rem;
  top: 1.35rem;
  font-family: var(--font-mono);
  font-size: var(--fs-sm);
  color: var(--neon-cyan);
}

.page-home .ph-why__item h3 {
  margin: 0 0 0.5rem;
  font-family: var(--font-display);
  font-size: var(--fs-md);
  color: var(--white);
}

.page-home .ph-why__item p {
  margin: 0;
  font-size: var(--fs-sm);
  line-height: 1.75;
  color: var(--mist);
}

.page-home .ph-partner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem 1.5rem;
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px dashed rgba(27, 74, 115, 0.85);
}

.page-home .ph-partner__text {
  margin: 0;
  font-size: var(--fs-sm);
  color: var(--mist);
}

/* ============ 收尾入口 ============ */
.page-home .ph-cta {
  padding: 0 0 clamp(3rem, 8vw, 5.5rem);
}

.page-home .ph-cta__box {
  display: grid;
  gap: 1.5rem;
  padding: clamp(1.5rem, 4vw, 2.75rem);
  border: 1px solid var(--deep-line);
  border-radius: 18px;
  background:
    radial-gradient(90% 140% at 88% 0%, rgba(35, 230, 208, 0.14), transparent 62%),
    var(--deep-step);
}

.page-home .ph-cta__copy h2 {
  margin: 0 0 0.6rem;
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(1.6rem, 4.2vw, 2.5rem);
  line-height: 1.12;
  color: var(--white);
}

.page-home .ph-cta__copy p {
  margin: 0;
  font-size: var(--fs-sm);
  line-height: 1.8;
  color: var(--mist);
  max-width: 52ch;
}

.page-home .ph-cta__links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

/* ============ 响应式 ============ */
@media (min-width: 640px) {
  .page-home .ph-vnotes {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .page-home .ph-data__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .page-home .ph-metric--ring {
    grid-column: span 1;
    align-items: center;
    text-align: center;
  }
  .page-home .ph-cross {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
  }
  .page-home .ph-cross .btn { justify-self: end; }
}

@media (min-width: 720px) {
  .page-home .ph-bento {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .page-home .ph-why__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .page-home .ph-cta__box {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
  }
  .page-home .ph-cta__links { justify-content: flex-end; }
}

@media (min-width: 960px) {
  .page-home .ph-hero__grid {
    grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
    align-items: start;
  }
  .page-home .ph-rail {
    padding-left: 1.75rem;
    border-left: 1px solid var(--deep-line);
  }
  .page-home .ph-hero__facts {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    max-width: 34rem;
  }
}

@media (min-width: 1080px) {
  .page-home .ph-bento {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    grid-template-areas:
      "fb fb fb fb fb fb bb bb bb bb bb bb"
      "dt dt dt dt vn vn vn vn se se se se"
      "tk tk tk tk nt nt nt nt ct ct ct ct"
      "sp sp sp sp sp sp sp sp sp sp sp sp";
  }
  .page-home .ph-cell--fb { grid-area: fb; }
  .page-home .ph-cell--bb { grid-area: bb; }
  .page-home .ph-cell--dt { grid-area: dt; }
  .page-home .ph-cell--vn { grid-area: vn; }
  .page-home .ph-cell--se { grid-area: se; }
  .page-home .ph-cell--tk { grid-area: tk; }
  .page-home .ph-cell--nt { grid-area: nt; }
  .page-home .ph-cell--ct { grid-area: ct; }
  .page-home .ph-cell--sp { grid-area: sp; }
  .page-home .ph-cell--sp {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem 2rem;
  }
  .page-home .ph-cell--sp .ph-cell__body { max-width: 62ch; }
  .page-home .ph-cell--sp .ph-cell__link { margin-top: 0; padding-top: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .page-home .ph-cell,
  .page-home .ph-metric,
  .page-home .ph-why__item,
  .page-home .ph-track__item {
    transition: none;
  }
  .page-home .ph-cell:hover { transform: none; }
}
<<<END>>>

等等，我需要检查这些标记。指令说“每个标记只能出现一次”——我写了 、，但最后还加了个 <<<END>>>，这是不允许的。去掉。

更仔细地检查一下：标记是 、，然后结束。没有 END 标记。

另外，我用了一个 Bento 单元格类 ph-cell--sp，但这一类没有对应的 CSS 规则……其实我在 1080px 的媒体查询里加了 .ph-cell--sp 的规则。好，确实是有了。

不过等一下——那个网格区域字符串："sp sp sp sp sp sp sp sp sp sp sp sp" 这行让 sp 占满整行，行。

再检查一下移动端的基础 grid-template-areas——只有在 1080px 才应用，没问题。

检查一下：site_kit 全局类里有 `card`、`tag`、`tag--pitch`、`tag--amber`、`tag--coral`、`btn`、`btn--primary`、`btn--coral`、`btn--ghost`、`eyebrow`、`frame`、`shell`、`num`、`media` 等等。我用的标签/按钮/外层类都没问题。

`num` 是全局类——好，我用了，没重新定义。

我有没有重新定义 .shell？没有。

我在 .page-home 里定义了 --ph-radius 和 --ph-cell-pad——没问题。

检查 var() 引用有没有不存在的变量：--deep-night、--deep-step、--deep-line、--neon-cyan、--neon-soft、--coral、--amber、--pitch、--warm-white、--mist、--white、--font-display、--font-mono、--fs-xs、--fs-sm、--fs-md、--gutter、--shell、--ease、--t-fast、--t-mid。这些全都在 css_variables 列表里。好。

等等——`--amber` 在列表里吗？在。"--amber"。好。`--pitch`？在的。`--neon-soft`？在的。`--coral`？在的。

数据属性：我用了 data-reveal。它在 interaction_data_attributes 里。好。

现在检查锚点：#schedule、#index、#data、#venues、#why 全部存在。好。

链接：/experience/、/notes/、/support/、/contact-us/、/culture/ —— 全是合法路由。好。

图片：4 张。1920x1080 首屏（无懒加载），800x600 x2 懒加载，1600x700 懒加载。好。高度和宽度与协议一致：{zhanqunpic:h:1080w:1920} 配上 width=1920 height=1080 ✓。{zhanqunpic:h:600w:800} 配上 width=800 height=600 ✓。{zhanqunpic:h:700w:1600} 配上 width=1600 height=700 ✓。

数字都是可见文本。好。

一个 h1。好。

面包屑/上下文：我写了 `<p class="ph-context">首页 · 2024–25 赛季 · 第 18 轮归档中</p>`。可以。

一个潜在问题：`.page-home .ph-cell--sp` 的网格区域只放在了 1080px 的 media query 里面。在移动端它只是一列里的一块普通单元格，没问题。

还有一件事：在 720–1079px 之间，bento 是两列，按 DOM 顺序排，也没问题。

再检查一下 `.ph-bento` 里 cell 的顺序——DOM 里就是 fb、bb、dt、vn、se、tk、nt、ct、sp——正好对应网格区域顺序。

再检查：`.page-home .ph-cell--ring`？没有，我把环形图放在了 `.ph-cell--dt` 里面——环形图有对应的 CSS。可以。

嗯，还有 `.ph-cell--dt` 里的 `.ph-ring`——我设了 margin: .25rem 0，可以。

再加一小条：`.ph-league__list li > .num` 的颜色按 pitch 来，好。

觉得可以了。把末尾的 END 标记去掉。

还有，我是不是应该再核对一下 hero 里的 `ph-cell__meta num` 用“30–38 轮 / 赛季”——可以。

好，输出定稿。等等，我给 `` 和 `` 写标记的时候，确保每个只出现一次。

现在把结果写出来，去掉结尾的 `<<<END>>>`。我再把最终答案的结构过一遍——就是两个标记。对。