.page-home{
  position:relative;
  background-color:var(--sd-deep);
  background-image:
    linear-gradient(to right, rgba(44,74,102,.16) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(44,74,102,.16) 1px, transparent 1px);
  background-size:72px 72px;
  color:var(--sd-white);
  overflow-x:clip;
}

.page-home .sd-section--panel{
  background:linear-gradient(180deg, rgba(14,44,74,.94), rgba(14,44,74,.72));
}
.page-home .sd-section--line{
  border-top:1px solid var(--sd-hair);
}

/* ---------- 区块头 ---------- */
.page-home .ph-head{
  max-width:840px;
}
.page-home .ph-head .sd-h2{
  margin:12px 0 0;
}
.page-home .ph-head__lede{
  margin:14px 0 0;
  max-width:64ch;
  color:var(--sd-mist);
  font-size:16px;
  line-height:1.75;
}

/* ---------- 首屏 ---------- */
.page-home .ph-hero{
  position:relative;
  padding:clamp(36px,6vw,88px) 0 clamp(32px,4.5vw,64px);
  border-bottom:1px solid var(--sd-hair);
}
.page-home .ph-hero__frame{
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(28px,4vw,52px);
}
.page-home .ph-crumb{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  margin:0 0 clamp(18px,2.6vw,32px);
  font-size:12px;
  letter-spacing:.18em;
  color:var(--sd-mist);
}
.page-home .ph-crumb__now{
  color:var(--sd-orange);
}
.page-home .ph-crumb__sep{
  color:var(--sd-grid);
}
.page-home .ph-hero__title{
  margin:0 0 clamp(18px,2.4vw,28px);
  font-size:clamp(46px,10.4vw,124px);
  line-height:.94;
  letter-spacing:-.03em;
  font-weight:900;
}
.page-home .ph-hero__title-accent{
  display:inline-block;
  color:var(--sd-orange);
}
.page-home .ph-hero__title-accent::after{
  content:"";
  display:block;
  height:5px;
  margin-top:8px;
  background:linear-gradient(90deg,var(--sd-orange),rgba(255,107,26,0));
}
.page-home .ph-hero__lede{
  max-width:56ch;
  margin:0;
  color:var(--sd-mist);
  font-size:clamp(16px,1.6vw,18px);
  line-height:1.75;
}
.page-home .ph-hero__actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:clamp(24px,3vw,36px);
}
.page-home .ph-hero__aside{
  display:grid;
  gap:18px;
  align-content:start;
}
.page-home .ph-hero__media{
  position:relative;
  width:100%;
  aspect-ratio:4 / 3;
  border:1px solid var(--sd-hair);
  overflow:hidden;
}
.page-home .ph-hero__media .sd-media__img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}

/* ---------- 实时数据条 ---------- */
.page-home .ph-ticker{
  list-style:none;
  margin:0;
  padding:0;
  border-top:1px solid var(--sd-hair);
}
.page-home .ph-ticker__item{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:10px 14px;
  padding:12px 2px;
  border-bottom:1px solid var(--sd-hair);
}
.page-home .ph-ticker__state{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-width:54px;
  font-size:11px;
  letter-spacing:.14em;
  color:var(--sd-mist);
  white-space:nowrap;
}
.page-home .ph-ticker__state--live{
  color:var(--sd-orange);
}
.page-home .ph-ticker__state--live::before{
  content:"";
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--sd-orange);
  animation:ph-dot-breathe 2.4s ease-in-out infinite;
}
.page-home .ph-ticker__state--lime{
  color:var(--sd-lime);
}
.page-home .ph-ticker__name{
  min-width:0;
  font-size:14px;
  color:var(--sd-white);
}
.page-home .ph-ticker__value{
  font-size:15px;
  color:var(--sd-cyan);
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
}
.page-home .ph-ticker__item--note .ph-ticker__name{
  font-size:13px;
  color:var(--sd-mist);
}
.page-home .ph-ticker__item--note .ph-ticker__value{
  font-size:13px;
  color:var(--sd-lime);
}

/* ---------- 战报时间轴 ---------- */
.page-home .ph-timeline{
  padding:clamp(52px,7vw,104px) 0;
}
.page-home .ph-timeline__frame{
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(28px,4vw,48px);
  margin-top:clamp(28px,4vw,48px);
}
.page-home .ph-tl{
  position:relative;
  list-style:none;
  margin:0;
  padding:0 0 0 30px;
}
.page-home .ph-tl::before{
  content:"";
  position:absolute;
  left:5px;
  top:10px;
  bottom:26px;
  width:1px;
  background:linear-gradient(180deg,var(--sd-orange) 0%, var(--sd-grid) 42%, rgba(44,74,102,.22) 100%);
}
.page-home .ph-tl__item{
  position:relative;
  padding:0 0 clamp(28px,3.4vw,40px);
}
.page-home .ph-tl__item:last-child{
  padding-bottom:0;
}
.page-home .ph-tl__node{
  position:absolute;
  left:-30px;
  top:9px;
  width:11px;
  height:11px;
  background:var(--sd-deep);
  border:1px solid var(--sd-grid);
  transform:rotate(45deg);
  transition:border-color .24s var(--sd-ease), background-color .24s var(--sd-ease);
}
.page-home .ph-tl__item--live .ph-tl__node{
  background:var(--sd-orange);
  border-color:var(--sd-orange);
  animation:ph-node-breathe 2.4s ease-in-out infinite;
}
.page-home .ph-tl__item:hover .ph-tl__node{
  border-color:var(--sd-cyan);
}
.page-home .ph-tl__meta{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px;
  margin-bottom:8px;
}
.page-home .ph-tl__ago{
  font-size:12px;
  letter-spacing:.1em;
  color:var(--sd-orange);
  font-variant-numeric:tabular-nums;
}
.page-home .ph-tl__tag{
  padding-left:10px;
  border-left:1px solid var(--sd-grid);
  font-size:12px;
  letter-spacing:.12em;
  color:var(--sd-mist);
}
.page-home .ph-tl__score{
  margin:0 0 6px;
  font-size:clamp(24px,2.8vw,32px);
  font-weight:700;
  color:var(--sd-white);
  font-variant-numeric:tabular-nums;
  letter-spacing:-.01em;
}
.page-home .ph-tl__sum{
  margin:0 0 10px;
  max-width:60ch;
  color:var(--sd-mist);
  font-size:15px;
  line-height:1.75;
}
.page-home .ph-tl__link{
  font-size:13px;
}
.page-home .ph-timeline__media{
  width:100%;
  margin:0;
  border:1px solid var(--sd-hair);
  overflow:hidden;
}
.page-home .ph-timeline__media .sd-media__img{
  display:block;
  width:100%;
  height:auto;
  object-fit:cover;
}

/* ---------- 联赛矩阵 ---------- */
.page-home .ph-leagues{
  padding:clamp(52px,7vw,104px) 0;
}
.page-home .ph-leagues__banner{
  display:block;
  width:100%;
  margin:clamp(28px,4vw,44px) 0 0;
  aspect-ratio:16 / 5;
  border:1px solid var(--sd-hair);
  overflow:hidden;
}
.page-home .ph-leagues__banner .sd-media__img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:.82;
}
.page-home .ph-league-grid{
  list-style:none;
  margin:1px 0 0;
  padding:0;
  display:grid;
  grid-template-columns:1fr;
  gap:1px;
  background:var(--sd-hair);
  border:1px solid var(--sd-hair);
  border-top:0;
}
.page-home .ph-league{
  position:relative;
  background:var(--sd-deep);
  padding:22px 20px 24px;
  transition:background-color .24s var(--sd-ease);
}
.page-home .ph-league::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:2px;
  background:var(--sd-orange);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .3s var(--sd-ease);
}
.page-home .ph-league:hover,
.page-home .ph-league:focus-within{
  background:var(--sd-panel);
}
.page-home .ph-league:hover::after,
.page-home .ph-league:focus-within::after{
  transform:scaleX(1);
}
.page-home .ph-league__no{
  display:block;
  margin-bottom:12px;
  font-size:12px;
  letter-spacing:.16em;
  color:var(--sd-cyan);
  font-variant-numeric:tabular-nums;
}
.page-home .ph-league__name{
  margin:0 0 8px;
  font-size:20px;
  font-weight:800;
  letter-spacing:-.01em;
  color:var(--sd-white);
}
.page-home .ph-league__desc{
  margin:0 0 14px;
  font-size:14px;
  line-height:1.7;
  color:var(--sd-mist);
}
.page-home .ph-league__list{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.page-home .ph-league__list li{
  padding:3px 8px;
  border:1px solid var(--sd-hair);
  font-size:12px;
  letter-spacing:.08em;
  color:var(--sd-mist);
}
.page-home .ph-leagues__more{
  margin:22px 0 0;
  font-size:14px;
  line-height:1.75;
  color:var(--sd-mist);
}

/* ---------- 开赛时间索引 ---------- */
.page-home .ph-kickoff{
  padding:clamp(52px,7vw,104px) 0;
}
.page-home .ph-kickoff__list{
  list-style:none;
  margin:clamp(28px,4vw,44px) 0 0;
  padding:0;
  border-bottom:1px solid var(--sd-hair);
}
.page-home .ph-kickoff__row{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
  padding:22px 0;
  border-top:1px solid var(--sd-hair);
  transition:background-color .24s var(--sd-ease);
}
.page-home .ph-kickoff__row:hover{
  background:rgba(14,44,74,.55);
}
.page-home .ph-kickoff__code{
  font-size:13px;
  letter-spacing:.08em;
  color:var(--sd-cyan);
  font-variant-numeric:tabular-nums;
}
.page-home .ph-kickoff__name{
  margin:0;
  font-size:22px;
  font-weight:800;
  color:var(--sd-white);
}
.page-home .ph-kickoff__sub{
  margin:4px 0 0;
  font-size:12px;
  letter-spacing:.14em;
  color:var(--sd-mist);
}
.page-home .ph-kickoff__text{
  margin:0;
  font-size:15px;
  line-height:1.75;
  color:var(--sd-mist);
}

/* ---------- 专区与权益速览 ---------- */
.page-home .ph-access{
  padding:clamp(52px,7vw,104px) 0;
}
.page-home .ph-access__frame{
  display:grid;
  grid-template-columns:1fr;
  gap:1px;
  margin-top:clamp(28px,4vw,44px);
  background:var(--sd-hair);
  border:1px solid var(--sd-hair);
}
.page-home .ph-access__lead{
  display:grid;
  grid-template-columns:1fr;
  background:var(--sd-deep);
}
.page-home .ph-access__media{
  width:100%;
  aspect-ratio:4 / 3;
  overflow:hidden;
}
.page-home .ph-access__media .sd-media__img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
.page-home .ph-access__leadbody{
  padding:24px 22px 26px;
}
.page-home .ph-access__leadbody p{
  margin:10px 0 18px;
  font-size:15px;
  line-height:1.75;
  color:var(--sd-mist);
}
.page-home .ph-access__side{
  display:grid;
  gap:1px;
  background:var(--sd-hair);
}
.page-home .ph-access__card{
  background:var(--sd-deep);
  padding:24px 22px 26px;
}
.page-home .ph-access__card p{
  margin:10px 0 16px;
  font-size:15px;
  line-height:1.75;
  color:var(--sd-mist);
}

/* ---------- 内容中心 ---------- */
.page-home .ph-hub{
  padding:clamp(52px,7vw,104px) 0;
}
.page-home .ph-tabs{
  margin-top:clamp(28px,4vw,44px);
}
.page-home .ph-tabs__list{
  display:flex;
  flex-wrap:wrap;
  border-bottom:1px solid var(--sd-hair);
}
.page-home .ph-tabs__tab{
  appearance:none;
  margin-bottom:-1px;
  padding:14px 18px;
  border:0;
  border-bottom:2px solid transparent;
  background:transparent;
  color:var(--sd-mist);
  font-family:inherit;
  font-size:14px;
  font-weight:600;
  letter-spacing:.1em;
  cursor:pointer;
  transition:color .2s var(--sd-ease), border-color .2s var(--sd-ease);
}
.page-home .ph-tabs__tab:hover{
  color:var(--sd-white);
}
.page-home .ph-tabs__tab[aria-selected="true"]{
  color:var(--sd-orange);
  border-bottom-color:var(--sd-orange);
}
.page-home .ph-tabs__tab:focus-visible{
  outline:2px solid var(--sd-cyan);
  outline-offset:2px;
}
.page-home .ph-tabs__panel{
  padding:clamp(24px,3.4vw,40px) 0 0;
}
.page-home .ph-tabs__no{
  display:block;
  margin-bottom:10px;
  font-size:12px;
  letter-spacing:.2em;
  color:var(--sd-cyan);
  font-variant-numeric:tabular-nums;
}
.page-home .ph-tabs__panel p{
  max-width:66ch;
  margin:10px 0 20px;
  font-size:16px;
  line-height:1.75;
  color:var(--sd-mist);
}

/* ---------- 规模与协作 ---------- */
.page-home .ph-proof{
  padding:clamp(44px,5.5vw,76px) 0;
  border-top:1px solid var(--sd-hair);
}
.page-home .ph-proof__list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  grid-template-columns:1fr;
  gap:1px;
  background:var(--sd-hair);
  border:1px solid var(--sd-hair);
}
.page-home .ph-proof__item{
  background:var(--sd-deep);
  padding:20px 18px 22px;
}
.page-home .ph-proof__val{
  display:flex;
  align-items:baseline;
  gap:6px;
  margin:0;
}
.page-home .ph-proof__num{
  font-size:clamp(28px,3.4vw,40px);
  font-weight:700;
  line-height:1;
  color:var(--sd-lime);
  font-variant-numeric:tabular-nums;
}
.page-home .ph-proof__unit{
  font-size:13px;
  letter-spacing:.12em;
  color:var(--sd-mist);
}
.page-home .ph-proof__desc{
  margin:8px 0 0;
  font-size:14px;
  line-height:1.65;
  color:var(--sd-mist);
}
.page-home .ph-proof__note{
  margin:22px 0 0;
  font-size:14px;
  line-height:1.75;
  color:var(--sd-mist);
}

/* ---------- 动效 ---------- */
@keyframes ph-dot-breathe{
  0%, 100%{ opacity:1; transform:scale(1); }
  50%{ opacity:.35; transform:scale(.72); }
}
@keyframes ph-node-breathe{
  0%, 100%{ box-shadow:0 0 0 0 rgba(255,107,26,.55); }
  50%{ box-shadow:0 0 0 7px rgba(255,107,26,0); }
}

/* ---------- 响应式 ---------- */
@media (min-width:640px){
  .page-home .ph-league-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .page-home .ph-access__lead{
    grid-template-columns:minmax(0,5fr) minmax(0,7fr);
  }
  .page-home .ph-access__media{
    height:100%;
  }
}

@media (min-width:700px){
  .page-home .ph-proof__list{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}

@media (min-width:880px){
  .page-home .ph-kickoff__row{
    grid-template-columns:170px minmax(140px,220px) minmax(0,1fr);
    align-items:baseline;
    gap:28px;
    padding:24px 4px;
  }
}

@media (min-width:900px){
  .page-home .ph-hero__frame{
    grid-template-columns:minmax(0,7fr) minmax(0,5fr);
    align-items:start;
    column-gap:clamp(32px,5vw,72px);
  }
}

@media (min-width:940px){
  .page-home .ph-timeline__frame{
    grid-template-columns:minmax(0,7fr) minmax(0,5fr);
    align-items:start;
    gap:clamp(36px,5vw,64px);
  }
  .page-home .ph-timeline__media{
    position:sticky;
    top:110px;
  }
}

@media (min-width:960px){
  .page-home .ph-access__frame{
    grid-template-columns:minmax(0,7fr) minmax(0,5fr);
  }
}

@media (min-width:1060px){
  .page-home .ph-league-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}

@media (prefers-reduced-motion:reduce){
  .page-home .ph-tl__item--live .ph-tl__node,
  .page-home .ph-ticker__state--live::before{
    animation:none;
  }
  .page-home .ph-league::after,
  .page-home .ph-league,
  .page-home .ph-tl__node,
  .page-home .ph-kickoff__row{
    transition:none;
  }
}
