.page-home{
  --home-pad: 20px;
  --home-rule: 1px solid var(--line-mist);
  background: var(--ink);
  color: var(--paper);
  padding-top: calc(var(--bar-h) + 8px);
  overflow-x: clip;
}

@media (min-width: 768px){
  .page-home{ --home-pad: 40px; }
}

@media (min-width: 1200px){
  .page-home{ --home-pad: 72px; }
}

/* ---------- 通用章节骨架 ---------- */
.page-home .section{
  position: relative;
  padding-block: clamp(3rem, 7vw, 5.5rem);
}

.page-home .section-head{
  max-width: 46rem;
  margin-bottom: 1.75rem;
}

.page-home .eyebrow{
  margin: 0;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .22em;
  color: var(--signal);
}

.page-home .section-title{
  margin: .55rem 0 .75rem;
  font-size: clamp(1.5rem, 4.2vw, 2.4rem);
  font-weight: 800;
  line-height: 1.18;
  letter-spacing: -.01em;
  color: var(--paper);
}

.page-home .section-note{
  margin: 0;
  font-size: .9375rem;
  line-height: 1.75;
  color: rgba(244,239,230,.68);
}

/* ---------- 面包屑 ---------- */
.page-home .crumbs{
  padding-block: 1rem .5rem;
  font-size: .75rem;
  letter-spacing: .08em;
}

.page-home .crumb-list{
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.page-home .crumb-list a{
  color: var(--cyan);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: border-color var(--dur) var(--ease), color var(--dur) var(--ease);
}

.page-home .crumb-list a:hover,
.page-home .crumb-list a:focus-visible{
  color: var(--paper);
  border-bottom-color: var(--signal);
}

.page-home .crumb-sep{ color: var(--mist); }
.page-home .crumbs li[aria-current]{ color: rgba(244,239,230,.55); }

/* ---------- 首屏 ---------- */
.page-home .hero{
  position: relative;
  padding-block: 1rem clamp(2.5rem, 6vw, 5rem);
}

.page-home .hero-shell{
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1.75rem;
  align-items: end;
}

.page-home .hero-note{ display: none; }

.page-home .hero-title{
  margin: 0 0 1.1rem;
  font-size: clamp(2.6rem, 11vw, 6.2rem);
  font-weight: 900;
  line-height: .94;
  letter-spacing: -.02em;
  color: var(--paper);
}

.page-home .hero-title em{
  font-style: normal;
  color: var(--signal);
}

.page-home .hero-lead{
  max-width: 34rem;
  margin: 0 0 1.5rem;
  font-size: clamp(1rem, 1.6vw, 1.0625rem);
  line-height: 1.78;
  color: rgba(244,239,230,.8);
}

.page-home .hero-actions{
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
}

.page-home .hero-figure{ margin: 0; }

.page-home .hero-media{
  position: relative;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  clip-path: polygon(0 16%, 100% 0, 100% 100%, 0 100%);
}

.page-home .hero-media img{
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  height: auto;
  object-fit: cover;
  filter: saturate(.82) brightness(.76);
}

.page-home .hero-media::after{
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(var(--line-cyan) 1px, transparent 1px),
    linear-gradient(90deg, var(--line-cyan) 1px, transparent 1px);
  background-size: 48px 48px;
  opacity: .55;
}

.page-home .hero-figure .media-caption{
  margin-top: .8rem;
  font-size: .75rem;
  letter-spacing: .06em;
  color: var(--cyan);
}

@media (min-width: 900px){
  .page-home .hero-shell{
    grid-template-columns: auto minmax(0, 1.4fr) minmax(0, 1fr);
    gap: 2.25rem 3rem;
    align-items: end;
  }

  .page-home .hero-note{
    display: block;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    margin: 0 0 .5rem;
    padding: .25rem .6rem .25rem 0;
    border-right: 1px solid var(--line-mist);
    font-size: .72rem;
    letter-spacing: .4em;
    color: var(--cyan);
  }
}

/* ---------- 球队速览 ---------- */
.page-home .team-band{
  background: var(--studio);
  border-block: var(--home-rule);
}

.page-home .team-track{
  display: flex;
  align-items: stretch;
  gap: 1rem;
  max-width: var(--maxw);
  margin-inline: auto;
  padding: .25rem var(--home-pad) 1.5rem;
  overflow-x: auto;
  scroll-snap-type: x proximity;
  scrollbar-width: thin;
}

.page-home .team-card{
  flex: 0 0 min(282px, 78vw);
  scroll-snap-align: start;
  padding: 1rem 1.15rem 1.15rem;
  background: var(--ink);
  border: var(--home-rule);
}

.page-home .team-sum{
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: .45rem .7rem;
  list-style: none;
  cursor: pointer;
}

.page-home .team-sum::-webkit-details-marker{ display: none; }

.page-home .team-rank{
  font-family: var(--font-mono);
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1;
  color: var(--paper);
}

.page-home .team-name{
  font-size: 1rem;
  font-weight: 800;
  letter-spacing: .02em;
  color: var(--paper);
}

.page-home .team-move{
  justify-self: end;
  font-size: .72rem;
  letter-spacing: .04em;
  padding: .18rem .5rem;
  border: 1px solid var(--line-mist);
  color: var(--cyan);
  white-space: nowrap;
}

.page-home .team-move.tag--score{
  color: var(--score);
  border-color: rgba(184,255,60,.45);
  background: rgba(184,255,60,.08);
}

.page-home .form-pills{
  grid-column: 1 / -1;
  display: flex;
  gap: .3rem;
  margin-top: .35rem;
}

.page-home .pill{
  display: grid;
  place-items: center;
  width: 1.6rem;
  height: 1.6rem;
  font-family: var(--font-mono);
  font-size: .68rem;
  font-weight: 700;
  border: 1px solid var(--line-mist);
}

.page-home .pill--w{
  color: var(--score);
  border-color: rgba(184,255,60,.45);
  background: rgba(184,255,60,.12);
}

.page-home .pill--d{
  color: var(--cyan);
  border-color: rgba(126,208,224,.4);
  background: rgba(126,208,224,.1);
}

.page-home .pill--l{
  color: var(--paper);
  border-color: rgba(196,64,28,.6);
  background: rgba(196,64,28,.22);
}

.page-home .team-body{
  margin-top: .9rem;
  padding-top: .9rem;
  border-top: var(--home-rule);
  font-size: .8125rem;
  line-height: 1.7;
  color: rgba(244,239,230,.7);
}

.page-home .team-body p{ margin: 0; }

.page-home .rank-spark{
  display: block;
  width: 100%;
  height: 28px;
  margin-bottom: .6rem;
}

.page-home .team-anchor{
  flex: 0 0 min(200px, 52vw);
  align-self: stretch;
  margin: 0;
  scroll-snap-align: start;
  border: var(--home-rule);
  overflow: hidden;
}

.page-home .team-anchor img{
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  object-fit: cover;
  filter: saturate(.8) brightness(.72);
}

/* ---------- 常用栏赛道 ---------- */
.page-home .lane{
  position: relative;
  padding-block: clamp(3rem, 7vw, 5.5rem);
  overflow: hidden;
}

.page-home .lane-wrap{
  position: relative;
  padding-block: .5rem 1rem;
}

.page-home .lane-bg{
  position: absolute;
  inset: -8% -3%;
  width: 106%;
  height: 116%;
  max-width: none;
  object-fit: cover;
  opacity: .16;
  transform: rotate(-3deg) scale(1.05);
  filter: saturate(.7) brightness(.65);
  pointer-events: none;
}

.page-home .lane-track{
  position: relative;
  display: flex;
  gap: 0;
  max-width: var(--maxw);
  margin-inline: auto;
  padding: 0 var(--home-pad) .5rem;
  overflow-x: auto;
  scroll-snap-type: x proximity;
  scrollbar-width: thin;
  outline: none;
}

.page-home .lane-track:focus-visible{
  box-shadow: inset 0 0 0 1px var(--signal);
}

.page-home .lane-item{
  flex: 0 0 auto;
  width: min(248px, 68vw);
  min-height: 104px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: .35rem;
  padding: 1rem 1.15rem;
  scroll-snap-align: start;
  text-decoration: none;
  color: var(--paper);
  background: rgba(10,21,32,.62);
  border: var(--home-rule);
  border-right: 0;
  transition: background var(--dur) var(--ease), color var(--dur) var(--ease), border-color var(--dur) var(--ease);
}

.page-home .lane-item:last-child{ border-right: var(--home-rule); }

.page-home .lane-item:hover,
.page-home .lane-item:focus-visible{
  background: var(--signal);
  border-color: var(--signal);
  color: var(--sepia);
}

.page-home .lane-num{
  font-family: var(--font-mono);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .16em;
  color: var(--signal);
}

.page-home .lane-label{
  font-size: 1.0625rem;
  font-weight: 800;
  letter-spacing: .01em;
}

.page-home .lane-desc{
  font-size: .75rem;
  line-height: 1.5;
  color: var(--cyan);
}

.page-home .lane-item:hover .lane-num,
.page-home .lane-item:hover .lane-desc,
.page-home .lane-item:focus-visible .lane-num,
.page-home .lane-item:focus-visible .lane-desc{
  color: var(--sepia);
}

.page-home .lane-hint{
  max-width: var(--maxw);
  margin: 1rem auto 0;
  padding-inline: var(--home-pad);
  font-size: .75rem;
  line-height: 1.6;
  letter-spacing: .04em;
  color: rgba(126,208,224,.85);
}

/* ---------- 复盘迁移 ---------- */
.page-home .recap-grid{
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1.75rem;
}

.page-home .recap-figure{ margin: 0; }

.page-home .recap-figure img{
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  filter: saturate(.78) brightness(.7);
  clip-path: polygon(0 0, 100% 6%, 100% 100%, 0 94%);
}

.page-home .recap-text{
  margin: 0;
  font-size: 1rem;
  line-height: 1.8;
  color: rgba(244,239,230,.78);
}

.page-home .recap-zones{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .5rem;
  margin: 1.25rem 0;
  padding: 0;
  list-style: none;
}

.page-home .recap-zones li{
  display: flex;
  align-items: baseline;
  gap: .5rem;
  padding: .6rem .75rem;
  background: var(--studio);
  border: var(--home-rule);
  font-size: .875rem;
  font-weight: 600;
}

.page-home .recap-zones .num{
  font-family: var(--font-mono);
  font-size: .72rem;
  font-weight: 700;
  color: var(--signal);
}

.page-home .recap-time{
  margin: 0 0 1.5rem;
  padding-left: .85rem;
  border-left: 2px solid var(--signal);
  font-size: .875rem;
  line-height: 1.7;
  color: rgba(244,239,230,.7);
}

@media (min-width: 900px){
  .page-home .recap-grid{
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    gap: 3rem;
    align-items: center;
  }
}

/* ---------- 数据块 ---------- */
.page-home .stats{
  border-top: var(--home-rule);
}

.page-home .stat-grid{
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin: 0;
  background: var(--line-mist);
  border: var(--home-rule);
  overflow: hidden;
}

.page-home .stat-grid::after{
  content: "";
  position: absolute;
  top: 0;
  left: -30%;
  width: 28%;
  height: 100%;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(184,255,60,.13), transparent);
  animation: home-sweep 7.5s ease-in-out infinite;
}

@keyframes home-sweep{
  0%{ transform: translateX(0); }
  100%{ transform: translateX(470%); }
}

.page-home .stat{
  display: flex;
  flex-direction: column-reverse;
  justify-content: flex-start;
  gap: .45rem;
  padding: 1.25rem 1rem;
  background: var(--ink);
}

.page-home .stat dt{
  font-size: .75rem;
  letter-spacing: .06em;
  color: var(--cyan);
}

.page-home .stat dd{
  margin: 0;
  display: flex;
  align-items: baseline;
  gap: .3rem;
  font-family: var(--font-mono);
  font-size: clamp(1.6rem, 4.2vw, 2.3rem);
  font-weight: 700;
  line-height: 1;
  color: var(--score);
}

.page-home .stat dd .unit{
  font-family: var(--font-sans);
  font-size: .75rem;
  font-weight: 500;
  color: rgba(244,239,230,.6);
}

.page-home .stats-note{
  margin: 1.25rem 0 0;
  font-size: .8125rem;
  line-height: 1.75;
  color: rgba(244,239,230,.55);
}

@media (min-width: 768px){
  .page-home .stat-grid{ grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .page-home .stat{ padding: 1.5rem 1.25rem; }
}

/* ---------- 收尾 ---------- */
.page-home .closing{
  padding-block: clamp(2.75rem, 6vw, 4.5rem);
  background: var(--studio);
  border-top: var(--home-rule);
}

.page-home .closing-inner{
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1.5rem;
  align-items: end;
}

.page-home .closing-lead{
  margin: 0;
  font-size: clamp(1.4rem, 4vw, 2.1rem);
  font-weight: 900;
  line-height: 1.22;
  letter-spacing: -.01em;
  color: var(--paper);
}

.page-home .closing-links{
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
}

@media (min-width: 900px){
  .page-home .closing-inner{
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 2.5rem;
  }
  .page-home .closing-links{ justify-content: flex-end; }
}

/* ---------- 动效降级 ---------- */
@media (prefers-reduced-motion: reduce){
  .page-home .stat-grid::after{ animation: none; opacity: 0; }
  .page-home .lane-item,
  .page-home .crumb-list a{ transition: none; }
}
<<<END>>>