.page-home{
  --home-cut:24px;
  --home-line:rgba(255,255,255,.16);
  --home-shell-pad:clamp(20px,3vw,44px);
  background:var(--white);
  color:var(--ink);
}

.page-home .container{
  width:var(--shell);
  margin-inline:auto;
}

.page-home .mono,
.page-home b.mono{
  font-family:var(--font-mono);
  font-variant-numeric:tabular-nums;
  font-weight:700;
}

/* ============ 首屏 ============ */
.page-home .hero{
  position:relative;
  overflow:hidden;
  color:var(--white);
  background:
    radial-gradient(120% 90% at 86% 6%, rgba(20,84,127,.85), rgba(4,24,43,0) 62%),
    var(--blue-900);
  padding-block:clamp(20px,3vw,34px) 0;
}

.page-home .breadcrumb{
  font-size:.8125rem;
  letter-spacing:.08em;
}
.page-home .breadcrumb__list{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
  color:rgba(255,255,255,.6);
}
.page-home .breadcrumb__item + .breadcrumb__item::before{
  content:"/";
  margin-right:8px;
  color:rgba(255,255,255,.32);
}
.page-home .breadcrumb__item a{
  color:rgba(255,255,255,.8);
  text-decoration:none;
  border-bottom:1px solid transparent;
  transition:border-color .2s var(--ease),color .2s var(--ease);
}
.page-home .breadcrumb__item a:hover,
.page-home .breadcrumb__item a:focus-visible{
  color:var(--white);
  border-bottom-color:var(--orange-500);
}

.page-home .hero__grid{
  display:grid;
  gap:clamp(24px,4vw,46px);
  padding-block:clamp(18px,3vw,30px) clamp(30px,5vw,64px);
}

.page-home .hero__kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin:0;
  font-size:.8125rem;
  letter-spacing:.08em;
  color:rgba(255,255,255,.78);
  border:1px solid var(--home-line);
  border-radius:999px;
  padding:7px 14px;
}

.page-home .hero__title{
  margin:.45em 0 .5em;
  font-size:clamp(2.5rem,10.2vw,7rem);
  font-weight:900;
  line-height:1.02;
  letter-spacing:-.03em;
}

.page-home .hero__lead{
  margin:0;
  max-width:620px;
  font-size:1.0625rem;
  line-height:1.75;
  color:rgba(255,255,255,.82);
}

.page-home .hero__actions{
  margin-top:clamp(22px,3vw,32px);
  gap:12px;
}

.page-home .hero .btn--ghost{
  border-color:rgba(255,255,255,.38);
  color:var(--white);
}
.page-home .hero .btn--ghost:hover,
.page-home .hero .btn--ghost:focus-visible{
  border-color:var(--orange-500);
  color:var(--orange-300);
}

.page-home .hero__media{
  margin:0;
  position:relative;
  clip-path:polygon(0 0,100% 0,100% 88%,0 100%);
  overflow:hidden;
}
.page-home .hero__media img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:16 / 10;
  object-fit:cover;
  filter:saturate(.9) contrast(1.06);
}
.page-home .hero__media .media-frame__caption{
  position:absolute;
  left:14px;
  bottom:18px;
  margin:0;
  font-size:.75rem;
  letter-spacing:.08em;
  color:rgba(255,255,255,.85);
  background:rgba(4,24,43,.55);
  padding:6px 10px;
}

.page-home .hero__stats{
  margin:clamp(26px,4vw,40px) 0 0;
  padding-top:18px;
  border-top:1px solid var(--home-line);
  display:grid;
  gap:14px;
}
.page-home .hero__stats .stat__value{
  display:block;
  font-family:var(--font-mono);
  font-variant-numeric:tabular-nums;
  font-weight:700;
  font-size:clamp(1.5rem,3vw,2.1rem);
  line-height:1.1;
  color:var(--white);
}
.page-home .hero__stats .stat__label{
  display:block;
  margin-top:4px;
  font-size:.8125rem;
  letter-spacing:.06em;
  color:rgba(255,255,255,.6);
}

.page-home .home-ticker{
  background:var(--blue-700);
  border-top:1px solid var(--home-line);
}
.page-home .home-ticker__inner{
  display:flex;
  flex-wrap:wrap;
  gap:10px 28px;
  padding-block:14px;
  font-size:.8125rem;
  letter-spacing:.03em;
  color:rgba(255,255,255,.78);
}
.page-home .home-ticker__num{
  font-family:var(--font-mono);
  font-variant-numeric:tabular-nums;
  font-weight:700;
  color:var(--lime-400);
  margin-right:6px;
}
.page-home .home-ticker__time{
  color:rgba(255,255,255,.6);
}

/* ============ 章节基础 ============ */
.page-home .section{
  padding-block:clamp(46px,6vw,92px);
}
.page-home .section--dark{
  background:var(--blue-900);
  color:var(--white);
  padding-inline:var(--home-shell-pad);
  clip-path:polygon(0 0,calc(100% - 34px) 0,100% 34px,100% 100%,0 100%);
}
.page-home .section--tint{
  background:var(--gray-100);
  padding-inline:var(--home-shell-pad);
}

.page-home .section__head{
  max-width:720px;
  margin-bottom:clamp(24px,4vw,44px);
}
.page-home .section__kicker{
  margin:0 0 10px;
  font-family:var(--font-mono);
  font-size:.8125rem;
  font-weight:700;
  letter-spacing:.12em;
  color:var(--orange-500);
}
.page-home .section__title{
  margin:0 0 14px;
  font-size:clamp(1.9rem,3.4vw,3rem);
  font-weight:800;
  line-height:1.12;
  letter-spacing:-.02em;
}
.page-home .section__lead{
  margin:0;
  font-size:1.0625rem;
  line-height:1.75;
  color:var(--gray-500);
}
.page-home .section--dark .section__lead{
  color:rgba(255,255,255,.74);
}

/* ============ 非对称骨架 ============ */
.page-home .page-shell{
  display:grid;
  gap:clamp(26px,4vw,54px);
  padding-block:clamp(30px,5vw,70px);
}
.page-home .page-shell__rail{
  display:grid;
  gap:18px;
  align-content:start;
}
.page-home .page-shell__main{
  min-width:0;
}

.page-home .rail-card{
  background:var(--gray-100);
  border-left:3px solid var(--orange-500);
  border-radius:0 var(--radius) var(--radius) 0;
  padding:14px 16px;
}
.page-home .rail-card--accent{
  background:var(--blue-700);
  color:var(--white);
}
.page-home .rail-card__label{
  display:block;
  font-size:.75rem;
  letter-spacing:.12em;
  color:var(--gray-500);
}
.page-home .rail-card--accent .rail-card__label{
  color:var(--lime-400);
}
.page-home .rail-card__value{
  font-family:var(--font-mono);
  font-variant-numeric:tabular-nums;
  font-size:2rem;
  font-weight:700;
  line-height:1.15;
}
.page-home .rail-card__unit{
  margin-left:6px;
  font-size:.8125rem;
  color:var(--gray-500);
}
.page-home .rail-card--accent .rail-card__unit{
  color:rgba(255,255,255,.72);
}
.page-home .rail-card__note{
  margin:6px 0 0;
  font-size:.8125rem;
  line-height:1.6;
  color:var(--gray-500);
}
.page-home .rail-card--accent .rail-card__note{
  color:rgba(255,255,255,.72);
}

.page-home .rail-index__title{
  margin:0 0 8px;
  font-size:.75rem;
  letter-spacing:.12em;
  color:var(--gray-500);
}
.page-home .rail-index__list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:2px;
}
.page-home .rail-index__link{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-height:44px;
  padding:8px 10px;
  font-size:.9375rem;
  color:var(--ink);
  text-decoration:none;
  border-left:2px solid transparent;
  transition:border-color .2s var(--ease),background-color .2s var(--ease),color .2s var(--ease);
}
.page-home .rail-index__link::after{
  content:attr(data-idx);
  font-family:var(--font-mono);
  font-size:.8125rem;
  color:var(--blue-300);
}
.page-home .rail-index__link:hover,
.page-home .rail-index__link:focus-visible{
  border-left-color:var(--orange-500);
  background:var(--gray-100);
  color:var(--blue-700);
}
.page-home .rail-index__link[aria-current],
.page-home .rail-index__link.is-active{
  border-left-color:var(--orange-500);
  color:var(--blue-700);
  font-weight:700;
}
.page-home .rail-index__link[aria-current]::after,
.page-home .rail-index__link.is-active::after{
  color:var(--orange-500);
}

/* ============ 今日赛况 ============ */
.page-home .today__list{
  list-style:none;
  margin:0;
  padding:0;
  border-top:1px solid var(--line);
}
.page-home .today__item{
  border-bottom:1px solid var(--line);
}
.page-home .today__row{
  display:grid;
  grid-template-columns:1fr auto;
  gap:6px 16px;
  align-items:baseline;
  padding:14px 2px;
}
.page-home .today__league{
  grid-column:1 / -1;
  font-size:.8125rem;
  letter-spacing:.06em;
  color:var(--gray-500);
}
.page-home .today__teams{
  font-size:1.0625rem;
  font-weight:600;
}
.page-home .today__teams b{
  color:var(--orange-500);
  margin-inline:6px;
}
.page-home .today__time{
  font-size:.875rem;
  color:var(--blue-500);
  white-space:nowrap;
}
.page-home .today__panel p{
  margin:0 0 14px;
  max-width:640px;
  font-size:.9375rem;
  line-height:1.7;
  color:var(--gray-500);
}

/* ============ 赛后战报 ============ */
.page-home .report__board{
  display:grid;
  gap:clamp(20px,3vw,40px);
}
.page-home .report__chartwrap{
  background:rgba(255,255,255,.04);
  border:1px solid var(--home-line);
  border-radius:var(--radius);
  padding:clamp(14px,2vw,24px);
}
.page-home .report__chart{
  display:block;
  width:100%;
  height:auto;
}
.page-home .report__caption{
  margin:12px 0 0;
  font-size:.8125rem;
  letter-spacing:.04em;
  color:rgba(255,255,255,.62);
}
.page-home .report__timeline{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:0;
}
.page-home .report__timeline li{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:14px;
  align-items:baseline;
  padding:12px 0;
  border-top:1px solid var(--home-line);
  font-size:.9375rem;
  color:rgba(255,255,255,.86);
}
.page-home .report__timeline .mono{
  color:var(--lime-400);
  font-size:.875rem;
}
.page-home .report__media{
  margin:clamp(24px,4vw,40px) 0 0;
}
.page-home .report__media img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:16 / 7;
  object-fit:cover;
  border-radius:var(--radius);
}
.page-home .report__media .media-frame__caption{
  margin-top:10px;
  font-size:.75rem;
  letter-spacing:.08em;
  color:rgba(255,255,255,.55);
}
.page-home .report__actions{
  margin-top:clamp(22px,3vw,32px);
  gap:12px;
}
.page-home .report .btn--ghost{
  border-color:rgba(255,255,255,.38);
  color:var(--white);
}
.page-home .report .btn--ghost:hover,
.page-home .report .btn--ghost:focus-visible{
  border-color:var(--orange-500);
  color:var(--orange-300);
}

/* ============ 场馆 ============ */
.page-home .venue__grid{
  display:grid;
  gap:clamp(22px,4vw,44px);
}
.page-home .venue__media{
  margin:0;
  clip-path:polygon(0 0,100% 0,100% 92%,0 100%);
  overflow:hidden;
}
.page-home .venue__media img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:4 / 3;
  object-fit:cover;
}
.page-home .venue__body .section__lead b{
  font-family:var(--font-mono);
  color:var(--blue-700);
}
.page-home .venue__cards{
  display:grid;
  gap:10px;
  margin-top:clamp(22px,3vw,32px);
}
.page-home .venue-card{
  display:grid;
  gap:6px;
  min-height:44px;
  padding:14px 16px;
  background:var(--white);
  border:1px solid var(--line);
  border-left:3px solid transparent;
  text-decoration:none;
  color:inherit;
  transition:transform .2s var(--ease),border-color .2s var(--ease),background-color .2s var(--ease);
}
.page-home .venue-card__name{
  font-size:1.0625rem;
  font-weight:700;
}
.page-home .venue-card__meta{
  font-size:.8125rem;
  color:var(--gray-500);
}
.page-home .venue-card:hover,
.page-home .venue-card:focus-visible{
  transform:translateY(-2px);
  border-left-color:var(--orange-500);
  background:var(--white);
}
.page-home .venue-card:hover .venue-card__meta,
.page-home .venue-card:focus-visible .venue-card__meta{
  color:var(--blue-500);
}
.page-home .venue__actions{
  margin-top:clamp(20px,3vw,28px);
  gap:12px;
}

/* ============ 内容中心 ============ */
.page-home .index-list{
  list-style:none;
  margin:0;
  padding:0;
  border-top:1px solid var(--line);
}
.page-home .index-item{
  position:relative;
  display:grid;
  grid-template-columns:auto 1fr;
  gap:12px 18px;
  padding:20px 4px;
  border-bottom:1px solid var(--line);
}
.page-home .index-item::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:3px;
  background:var(--orange-500);
  transform:scaleY(0);
  transform-origin:top;
  transition:transform .25s var(--ease);
}
.page-home .index-item:hover::before{
  transform:scaleY(1);
}
.page-home .index-item__num{
  font-family:var(--font-mono);
  font-variant-numeric:tabular-nums;
  font-size:1rem;
  font-weight:700;
  color:var(--orange-500);
  padding-top:4px;
}
.page-home .index-item__body{
  min-width:0;
}
.page-home .index-item__name{
  margin:0 0 8px;
  font-size:1.35rem;
  font-weight:700;
  letter-spacing:-.01em;
}
.page-home .index-item__desc{
  margin:0;
  max-width:660px;
  font-size:.9375rem;
  line-height:1.75;
  color:var(--gray-500);
}
.page-home .center__actions{
  margin-top:clamp(22px,3vw,32px);
  gap:12px;
}

/* ============ 会员权益 ============ */
.page-home .member__layout{
  display:grid;
  gap:clamp(20px,3vw,32px);
}
.page-home .member__cards{
  display:grid;
  gap:16px;
}
.page-home .member-card{
  background:var(--white);
  border:1px solid var(--line);
  padding:22px 20px 32px;
  clip-path:polygon(0 0,100% 0,100% calc(100% - var(--home-cut)),calc(100% - var(--home-cut)) 100%,0 100%);
  transition:transform .2s var(--ease),border-color .2s var(--ease);
}
.page-home .member-card:hover{
  transform:translateY(-2px);
  border-color:var(--orange-300);
}
.page-home .member-card--accent{
  background:var(--blue-700);
  border-color:var(--blue-700);
  color:var(--white);
}
.page-home .member-card__tier{
  margin:0 0 10px;
  font-family:var(--font-mono);
  font-size:.75rem;
  letter-spacing:.1em;
  color:var(--gray-500);
}
.page-home .member-card--accent .member-card__tier{
  color:var(--lime-400);
}
.page-home .member-card__name{
  margin:0 0 8px;
  font-size:1.5rem;
  font-weight:800;
  letter-spacing:-.01em;
}
.page-home .member-card__desc{
  margin:0 0 14px;
  font-size:.9375rem;
  line-height:1.65;
  color:var(--gray-500);
}
.page-home .member-card--accent .member-card__desc{
  color:rgba(255,255,255,.76);
}
.page-home .member-card__list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:9px;
}
.page-home .member-card__list li{
  position:relative;
  padding-left:18px;
  font-size:.9375rem;
  line-height:1.6;
}
.page-home .member-card__list li::before{
  content:"";
  position:absolute;
  left:0;
  top:.55em;
  width:8px;
  height:2px;
  background:var(--orange-500);
}
.page-home .member-card--accent .member-card__list li::before{
  background:var(--lime-400);
}
.page-home .member__media{
  margin:0;
  clip-path:polygon(0 0,100% 0,100% 90%,0 100%);
  overflow:hidden;
}
.page-home .member__media img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:3 / 4;
  object-fit:cover;
}
.page-home .member__actions{
  margin-top:clamp(24px,3vw,36px);
  gap:12px;
}

/* ============ 开赛前十分钟 ============ */
.page-home .pregame__steps{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:0;
  border-left:2px solid var(--gray-100);
}
.page-home .pregame__step{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:10px 18px;
  padding:18px 0 18px 18px;
  position:relative;
}
.page-home .pregame__step::before{
  content:"";
  position:absolute;
  left:-6px;
  top:26px;
  width:10px;
  height:10px;
  border-radius:50%;
  background:var(--orange-500);
}
.page-home .pregame__time{
  font-size:.875rem;
  color:var(--blue-500);
  letter-spacing:.04em;
  padding-top:2px;
}
.page-home .pregame__body h3{
  margin:0 0 6px;
  font-size:1.125rem;
  font-weight:700;
}
.page-home .pregame__body p{
  margin:0;
  max-width:620px;
  font-size:.9375rem;
  line-height:1.72;
  color:var(--gray-500);
}
.page-home .pregame__actions{
  margin-top:clamp(22px,3vw,32px);
  gap:12px;
}

/* ============ 收尾 ============ */
.page-home .close{
  background:var(--blue-700);
  color:var(--white);
}
.page-home .close__grid{
  display:grid;
  gap:clamp(24px,4vw,40px);
}
.page-home .close__intro .section__kicker{
  color:var(--lime-400);
}
.page-home .close__intro .section__title{
  margin-bottom:14px;
}
.page-home .close__lead{
  margin:0;
  max-width:520px;
  font-size:1.0625rem;
  line-height:1.75;
  color:rgba(255,255,255,.78);
}
.page-home .close__paths{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:0;
}
.page-home .close__link{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:8px 18px;
  min-height:44px;
  padding:16px 4px;
  border-top:1px solid var(--home-line);
  color:var(--white);
  text-decoration:none;
  font-size:1.0625rem;
  transition:color .2s var(--ease),padding-left .2s var(--ease);
}
.page-home .close__link em{
  font-family:var(--font-mono);
  font-style:normal;
  font-size:.8125rem;
  color:rgba(255,255,255,.6);
}
.page-home .close__link:hover,
.page-home .close__link:focus-visible{
  color:var(--orange-300);
  padding-left:10px;
}
.page-home .close__fine{
  margin:0;
  font-size:.8125rem;
  line-height:1.8;
  color:rgba(255,255,255,.62);
}
.page-home .close__fine a{
  color:var(--white);
  text-decoration:none;
  border-bottom:1px solid var(--orange-500);
}
.page-home .close__fine a:hover,
.page-home .close__fine a:focus-visible{
  color:var(--orange-300);
}

/* ============ 响应式 ============ */
@media (min-width:560px){
  .page-home .hero__stats{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .page-home .venue__cards{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (min-width:760px){
  .page-home .today__row{
    grid-template-columns:190px minmax(0,1fr) auto;
    align-items:center;
  }
  .page-home .today__league{
    grid-column:auto;
  }
  .page-home .pregame__step{
    grid-template-columns:120px minmax(0,1fr);
  }
}

@media (min-width:900px){
  .page-home .hero__grid{
    grid-template-columns:minmax(0,1.32fr) minmax(0,1fr);
    align-items:center;
  }
  .page-home .report__board{
    grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);
    align-items:start;
  }
  .page-home .venue__grid{
    grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
    align-items:start;
  }
  .page-home .close__grid{
    grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
    align-items:start;
  }
  .page-home .close__fine{
    grid-column:1 / -1;
  }
}

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

@media (min-width:1080px){
  .page-home .page-shell{
    grid-template-columns:280px minmax(0,1fr);
    align-items:start;
  }
  .page-home .page-shell__rail{
    position:sticky;
    top:112px;
  }
  .page-home .venue__cards{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}

@media (min-width:1140px){
  .page-home .member__layout{
    grid-template-columns:minmax(0,1fr) 240px;
    align-items:start;
  }
}

@media (hover:hover) and (min-width:1000px){
  .page-home .today__panel{
    max-height:0;
    overflow:hidden;
    opacity:0;
    transition:max-height .28s var(--ease),opacity .22s var(--ease);
  }
  .page-home .today__item:hover .today__panel,
  .page-home .today__item:focus-within .today__panel{
    max-height:180px;
    opacity:1;
  }
  .page-home .today__panel p{
    padding-top:2px;
  }
}

@media (prefers-reduced-motion:reduce){
  .page-home *,
  .page-home *::before,
  .page-home *::after{
    transition-duration:.01ms !important;
    animation-duration:.01ms !important;
  }
}