.page-home{
  --glass-line: rgba(174,184,198,.26);
  --home-pad: clamp(18px, 3.2vw, 40px);
  --home-gap: clamp(16px, 2vw, 24px);
}

/* ---------- 顶部上下文 ---------- */
.page-home .home-context{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px 10px;
  font-family: var(--font-mono);
  font-size:.8125rem;
  letter-spacing:.06em;
  color: var(--silver);
  margin-bottom: clamp(18px,3vw,30px);
}
.page-home .home-context .breadcrumbs__current{ color: var(--green); }
.page-home .home-context .breadcrumbs__note,
.page-home .home-context__note{ color: var(--silver); }

/* ---------- 首屏 ---------- */
.page-home .home-hero{
  position:relative;
  overflow:hidden;
  padding: clamp(18px,2.6vw,28px) var(--home-pad) clamp(56px,7vw,96px);
  background:
    radial-gradient(900px 460px at 84% -10%, rgba(200,255,62,.13), transparent 62%),
    radial-gradient(760px 420px at 2% 108%, rgba(52,227,211,.12), transparent 66%),
    linear-gradient(180deg, var(--ink) 0%, var(--ink-deep) 100%);
  color: var(--text-on-dark);
}
.page-home .home-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    repeating-linear-gradient(90deg, rgba(174,184,198,.07) 0 1px, transparent 1px 104px),
    repeating-linear-gradient(0deg, rgba(174,184,198,.05) 0 1px, transparent 1px 104px);
  pointer-events:none;
}
.page-home .home-hero > .container{ position:relative; z-index:1; }

.page-home .hero-collage{
  display:grid;
  grid-template-columns:1fr;
  gap: var(--home-gap);
}
.page-home .hero-collage__lead{ min-width:0; }
.page-home .hero-kicker{
  margin:0 0 16px;
  display:inline-block;
  font-family: var(--font-mono);
  font-size:.8125rem;
  letter-spacing:.18em;
  color: var(--green);
  border-bottom:1px solid rgba(200,255,62,.5);
  padding-bottom:6px;
}
.page-home .home-hero .display-title{
  margin:0;
  color:#fff;
  line-height:1.08;
  letter-spacing:-.01em;
  max-width:14em;
}
.page-home .hero-lead{
  margin:20px 0 0;
  max-width:36em;
  font-size:1.0625rem;
  line-height:1.8;
  color: var(--text-muted-dark);
}
.page-home .hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:26px;
}

.page-home .hero-collage__visual{
  position:relative;
  margin:0;
  border-radius: var(--radius-lg);
  overflow:hidden;
  border:1px solid var(--glass-line);
}
.page-home .hero-collage__visual img{
  display:block;
  width:100%;
  height:auto;
  object-fit:cover;
}

.page-home .collage-block{
  position:relative;
  border-radius: var(--radius-lg);
  border:1px solid var(--glass-line);
  background: var(--glass);
  padding: clamp(18px,2.2vw,28px);
}

/* 实时比分块 */
.page-home .live-board{
  display:flex;
  flex-direction:column;
  gap:14px;
}
.page-home .live-board__head{
  display:flex;
  align-items:center;
  gap:10px;
}
.page-home .live-board__pulse{
  width:9px;
  height:9px;
  border-radius:50%;
  background: var(--green);
  animation: home-pulse 2.4s var(--ease) infinite;
}
@keyframes home-pulse{
  0%{ box-shadow:0 0 0 0 rgba(200,255,62,.65); }
  70%{ box-shadow:0 0 0 12px rgba(200,255,62,0); }
  100%{ box-shadow:0 0 0 0 rgba(200,255,62,0); }
}
.page-home .live-board__meta{
  margin-left:auto;
  font-size:.75rem;
  color: var(--silver);
}
.page-home .live-board__list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:10px;
}
.page-home .live-board__row{
  display:grid;
  grid-template-columns: 1fr auto 1fr auto;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius: var(--radius-sm);
  background: rgba(5,11,22,.5);
  border:1px solid rgba(174,184,198,.16);
}
.page-home .live-board__team{ font-size:.9375rem; font-weight:500; }
.page-home .live-board__team--away{ text-align:right; }
.page-home .live-board__score{
  font-size:1.375rem;
  font-weight:700;
  color: var(--green);
  font-variant-numeric: tabular-nums;
}
.page-home .live-board__min{ font-size:.8125rem; color: var(--silver); }
.page-home .live-board__ticks{ display:block; width:100%; height:18px; }
.page-home .live-board__foot{
  margin:0;
  font-size:.8125rem;
  line-height:1.7;
  color: var(--text-muted-dark);
}

/* 筛选块 */
.page-home .filter-panel{
  display:flex;
  flex-direction:column;
  gap:14px;
}
.page-home .filter-panel__step{
  margin:0;
  font-family: var(--font-mono);
  font-size:.75rem;
  letter-spacing:.16em;
  color: var(--orange);
}
.page-home .filter-panel__title{
  margin:0;
  font-size:1.25rem;
  color:#fff;
}
.page-home .filter-bar{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.page-home .filter-bar .filter-pill{
  padding:7px 15px;
  border-radius: var(--pill);
  border:1px solid rgba(174,184,198,.34);
  background: rgba(255,255,255,.05);
  color: var(--text-on-dark);
  font-family: var(--font-mono);
  font-size:.8125rem;
  cursor:pointer;
  transition: background .2s var(--ease), border-color .2s var(--ease), color .2s var(--ease);
}
.page-home .filter-bar .filter-pill[aria-pressed="true"],
.page-home .filter-bar .filter-pill.is-active{
  background: var(--green);
  border-color: var(--green);
  color: var(--ink-deep);
  font-weight:700;
}
.page-home .fixture-list{
  list-style:none;
  margin:0;
  padding:0;
}
.page-home .fixture-list .data-list__row{
  display:grid;
  grid-template-columns: auto 1fr auto;
  align-items:center;
  gap:12px;
  padding:9px 2px;
  border-bottom:1px solid rgba(174,184,198,.16);
}
.page-home .fixture-list .data-list__row:last-child{ border-bottom:0; }
.page-home .fixture-list .data-list__index{ font-size:.75rem; color: var(--silver); }
.page-home .fixture-list .data-list__title{ font-size:.9375rem; color: var(--text-on-dark); }
.page-home .fixture-list .data-list__meta{ font-size:.8125rem; color: var(--green); }
.page-home .filter-panel__hint{
  margin:0;
  font-size:.8125rem;
  color: var(--text-muted-dark);
}

/* 注册指引条 */
.page-home .reg-strip{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  background: linear-gradient(100deg, rgba(200,255,62,.14), rgba(255,122,42,.10));
  border-color: rgba(200,255,62,.42);
}
.page-home .reg-strip__text{
  margin:0;
  max-width:46em;
  font-size:.9375rem;
  line-height:1.75;
  color: var(--text-on-dark);
}
.page-home .reg-strip__text strong{ color: var(--green); }

/* ---------- 色带 ---------- */
.page-home .home-band{
  background: linear-gradient(90deg, var(--orange), #ffb27a);
  color: var(--ink-deep);
  padding: 14px var(--home-pad);
}
.page-home .home-band .band-line{
  margin:0;
  font-family: var(--font-mono);
  font-size:.8125rem;
  letter-spacing:.08em;
}

/* ---------- 01 两步路径 ---------- */
.page-home .home-step{
  padding: clamp(56px,7vw,104px) var(--home-pad);
  background: var(--ink);
  color: var(--text-on-dark);
}
.page-home .home-step .section__title{ color:#fff; }
.page-home .home-step .section__lead{ color: var(--text-muted-dark); }

.page-home .step-track{
  position:relative;
  margin-top: clamp(28px,4vw,44px);
}
.page-home .step-track__line{
  display:none;
  width:100%;
  height:60px;
  margin-bottom:-28px;
  opacity:.6;
}
.page-home .step-track__flow{
  display:flex;
  flex-direction:column;
  gap:14px;
}
.page-home .step-track__item{
  border-radius: var(--radius-lg);
  border:1px solid var(--glass-line);
  background: rgba(255,255,255,.05);
  padding: clamp(20px,2.4vw,30px);
}
.page-home .step-track__num{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  border-radius:50%;
  font-size:.875rem;
  font-weight:700;
  background: rgba(200,255,62,.14);
  border:1px solid rgba(200,255,62,.42);
  color: var(--green);
}
.page-home .step-track__item:last-child .step-track__num{
  background: rgba(255,122,42,.16);
  border-color: rgba(255,122,42,.45);
  color: var(--orange);
}
.page-home .step-track__item h3{
  margin:18px 0 10px;
  font-size:1.25rem;
  color:#fff;
}
.page-home .step-track__item p{
  margin:0;
  font-size:.9375rem;
  line-height:1.8;
  color: var(--text-muted-dark);
}
.page-home .step-track__link{
  align-self:center;
  width:26px;
  height:54px;
  transform: rotate(90deg);
}
.page-home .step-track__link svg{ display:block; width:100%; height:100%; }
.page-home .step-note{
  margin: clamp(28px,4vw,44px) 0 0;
  padding-left:16px;
  border-left:2px solid var(--orange);
  font-size:.9375rem;
  line-height:1.8;
  color: var(--text-muted-dark);
}

/* ---------- 02 射门统计与战报 ---------- */
.page-home .home-after{
  padding: clamp(56px,7vw,104px) var(--home-pad);
  background: var(--cream);
  color: var(--brown);
}
.page-home .home-after .section__index{ color: var(--orange); }
.page-home .home-after .section__title{
  color: var(--brown);
  margin:10px 0 0;
}
.page-home .after-grid{
  display:grid;
  gap: clamp(28px,4vw,56px);
}
.page-home .after-grid__lead{
  margin:20px 0 0;
  font-size:1rem;
  line-height:1.85;
  color: rgba(30,23,18,.82);
}
.page-home .after-list{
  list-style:none;
  margin:26px 0 0;
  padding:0;
  display:grid;
  gap:0;
}
.page-home .after-list li{
  display:grid;
  grid-template-columns: auto 1fr;
  gap:14px;
  align-items:baseline;
  padding:12px 0;
  border-bottom:1px dashed var(--line-light);
  font-size:.9375rem;
  line-height:1.7;
}
.page-home .after-list .mono{
  color: var(--orange);
  font-size:.8125rem;
  font-weight:700;
}
.page-home .after-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:28px;
}
.page-home .home-after .btn--outline{
  color: var(--brown);
  border-color: rgba(30,23,18,.35);
}
.page-home .after-grid__media{
  margin:0;
  border-radius: var(--radius-lg);
  overflow:hidden;
  box-shadow: var(--shadow-lift);
}
.page-home .after-grid__media img{
  display:block;
  width:100%;
  height:auto;
  object-fit:cover;
}

/* ---------- 03 平板与手机 ---------- */
.page-home .home-device{
  padding: clamp(56px,7vw,104px) var(--home-pad);
  background: linear-gradient(180deg, var(--ink) 0%, #0d1e3c 100%);
  color: var(--text-on-dark);
}
.page-home .home-device .section__title{ color:#fff; }
.page-home .home-device .section__lead{ color: var(--text-muted-dark); }
.page-home .home-device .section__index{ color: var(--cyan); }

.page-home .device-grid{
  display:grid;
  gap: clamp(16px,2.2vw,24px);
  margin-top: clamp(28px,4vw,44px);
}
.page-home .device-grid__media{
  margin:0;
  border-radius: var(--radius-lg);
  overflow:hidden;
  border:1px solid var(--glass-line);
}
.page-home .device-grid__media img{
  display:block;
  width:100%;
  height:auto;
  object-fit:cover;
}
.page-home .device-card{
  border-radius: var(--radius-lg);
  border:1px solid var(--glass-line);
  background: var(--glass);
  padding: clamp(20px,2.4vw,28px);
}
.page-home .device-card h3{
  margin:0 0 10px;
  font-size:1.125rem;
  color: var(--green);
}
.page-home .device-card p{
  margin:0;
  font-size:.9375rem;
  line-height:1.8;
  color: var(--text-muted-dark);
}
.page-home .device-facts{
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
  margin-top: clamp(24px,3.4vw,36px);
}
.page-home .device-facts__item{
  display:flex;
  flex-direction:column;
  gap:6px;
  padding:16px 18px;
  border-radius: var(--radius-md);
  border-left:2px solid var(--cyan);
  background: rgba(5,11,22,.46);
}
.page-home .device-facts__value{
  font-size:1.375rem;
  font-weight:700;
  color:#fff;
  font-variant-numeric: tabular-nums;
}
.page-home .device-facts__label{
  font-size:.8125rem;
  color: var(--silver);
}
.page-home .device-note{
  margin: clamp(24px,3.4vw,36px) 0 0;
  font-size:.9375rem;
  color: var(--text-muted-dark);
}
.page-home .device-note a{
  color: var(--green);
  text-decoration:underline;
  text-underline-offset:4px;
}

/* ---------- 04 账号与注册 ---------- */
.page-home .home-account{
  padding: clamp(56px,7vw,104px) var(--home-pad);
  background: var(--cream);
  color: var(--brown);
}
.page-home .home-account .section__index{ color: var(--orange); }
.page-home .home-account .section__title{
  color: var(--brown);
  margin:10px 0 0;
}
.page-home .account-grid{
  display:grid;
  gap: clamp(26px,3.6vw,48px);
}
.page-home .account-grid__lead{
  margin:20px 0 0;
  font-size:1rem;
  line-height:1.85;
  color: rgba(30,23,18,.82);
}
.page-home .account-steps{
  list-style:none;
  margin:24px 0 0;
  padding:0;
  display:grid;
  gap:12px;
  counter-reset:none;
}
.page-home .account-steps li{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:14px;
  align-items:baseline;
  font-size:.9375rem;
  line-height:1.75;
}
.page-home .account-steps .mono{
  font-size:.8125rem;
  font-weight:700;
  color: var(--orange);
  border-bottom:2px solid rgba(255,122,42,.5);
  padding-bottom:2px;
}
.page-home .home-account .btn--orange{ margin-top:28px; }
.page-home .account-grid__aside{
  border-radius: var(--radius-lg);
  border:1px solid rgba(30,23,18,.16);
  background: rgba(255,255,255,.5);
  padding: clamp(20px,2.4vw,28px);
}
.page-home .account-side__title{
  margin:0 0 14px;
  font-size:.75rem;
  letter-spacing:.14em;
  color: rgba(30,23,18,.6);
}
.page-home .account-side__list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:10px;
}
.page-home .account-side__list a{
  display:block;
  padding:11px 14px;
  border-radius: var(--radius-sm);
  background: rgba(30,23,18,.05);
  color: var(--brown);
  font-size:.9375rem;
  text-decoration:none;
  transition: background .2s var(--ease), transform .2s var(--ease);
}
.page-home .account-side__list a:hover{
  background: rgba(200,255,62,.4);
  transform: translateX(3px);
}
.page-home .account-side__note{
  margin:16px 0 0;
  font-size:.8125rem;
  line-height:1.7;
  color: rgba(30,23,18,.68);
  word-break:break-all;
}

/* ---------- 05 规模收束 ---------- */
.page-home .home-scale{
  position:relative;
  overflow:hidden;
  padding: clamp(60px,7.5vw,110px) var(--home-pad);
  background: var(--ink-deep);
  color: var(--text-on-dark);
}
.page-home .home-scale__bg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:.3;
}
.page-home .home-scale__inner{
  position:relative;
  z-index:1;
}
.page-home .home-scale .section__index{ color: var(--green); }
.page-home .home-scale .section__title{
  color:#fff;
  margin:10px 0 0;
  max-width:20em;
}
.page-home .scale-stats{
  display:grid;
  grid-template-columns:1fr;
  gap:16px;
  margin-top: clamp(28px,4vw,44px);
}
.page-home .scale-stat{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:18px 20px;
  border-radius: var(--radius-md);
  border:1px solid var(--glass-line);
  background: rgba(10,23,48,.55);
}
.page-home .scale-stat__value{
  font-size:clamp(1.6rem,3.4vw,2.2rem);
  font-weight:700;
  color: var(--green);
  font-variant-numeric: tabular-nums;
  line-height:1.1;
}
.page-home .scale-stat__label{
  font-size:.8125rem;
  color: var(--silver);
}
.page-home .scale-note{
  margin: clamp(26px,3.6vw,40px) 0 0;
  max-width:52em;
  font-size:.9375rem;
  line-height:1.85;
  color: var(--text-muted-dark);
}
.page-home .scale-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:26px;
}

/* ---------- 桌面栅格 ---------- */
@media (min-width: 880px){
  .page-home .device-grid{
    grid-template-columns: 1.4fr 1fr;
    align-items:start;
  }
  .page-home .device-grid__media{ grid-row: span 2; }
  .page-home .device-facts{ grid-template-columns: repeat(3, 1fr); }
  .page-home .account-grid{
    grid-template-columns: 1.35fr .65fr;
    align-items:start;
  }
  .page-home .scale-stats{ grid-template-columns: repeat(2, 1fr); }
  .page-home .after-grid{
    grid-template-columns: 1.15fr .85fr;
    align-items:center;
  }
  .page-home .step-track__line{ display:block; }
  .page-home .step-track__flow{
    flex-direction:row;
    align-items:flex-start;
    gap: clamp(16px,2.6vw,36px);
    margin-top: 18px;
  }
  .page-home .step-track__item{ flex:1 1 0; min-width:0; }
  .page-home .step-track__link{
    flex:0 0 clamp(72px,9vw,150px);
    width: clamp(72px,9vw,150px);
    height:44px;
    margin-top:34px;
    transform:none;
  }
}

@media (min-width: 980px){
  .page-home .hero-collage{
    grid-template-columns: repeat(12, 1fr);
    gap:24px;
  }
  .page-home .hero-collage__lead{ grid-column: 1 / span 7; }
  .page-home .hero-collage__visual{
    grid-column: 8 / span 5;
    margin-top:30px;
  }
  .page-home .hero-collage__filter{
    grid-column: 1 / span 6;
    margin-top:8px;
  }
  .page-home .hero-collage__live{
    grid-column: 7 / span 6;
    margin-top:46px;
  }
  .page-home .hero-collage__reg{
    grid-column: 1 / -1;
    margin-top:10px;
  }
}

@media (min-width: 1180px){
  .page-home .scale-stats{ grid-template-columns: repeat(4, 1fr); }
  .page-home .account-grid{ grid-template-columns: 1.4fr .6fr; }
}

@media (prefers-reduced-motion: reduce){
  .page-home .live-board__pulse{ animation:none; }
  .page-home .account-side__list a{ transition:none; }
}

/* ---------- 窄屏收敛 ---------- */
@media (max-width: 479px){
  .page-home .hero-collage__reg{
    flex-direction:column;
    align-items:flex-start;
  }
  .page-home .live-board__row{
    grid-template-columns: 1fr auto;
    row-gap:6px;
  }
  .page-home .live-board__team--away{ text-align:left; }
  .page-home .live-board__min{ justify-self:end; }
}
<<<END>>>
