.page-home{
  --home-radius:16px;
  --home-gap:clamp(16px,3vw,28px);
  background:var(--paper);
  color:var(--ink);
  font-family:var(--font-body);
  overflow-x:hidden;
}
.page-home h1,
.page-home h2,
.page-home h3{
  margin:0;
  font-family:var(--font-display);
  font-weight:800;
  letter-spacing:-.01em;
  line-height:1.2;
}
.page-home p{margin:0;}
.page-home a{color:inherit;}
.page-home .num{
  font-family:var(--font-num);
  font-variant-numeric:tabular-nums;
  font-weight:800;
}
.page-home .label{
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
  font-weight:600;
}
.page-home .live-dot{
  display:inline-block;
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--coral);
  box-shadow:0 0 0 3px rgba(255,106,77,.22);
}

/* 上下文条 */
.page-home .home-context-bar{
  background:var(--night);
  color:var(--standby);
  border-bottom:1px solid var(--rule-light);
}
.page-home .home-context-inner{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px 10px;
  padding:10px 0;
  font-size:12px;
  letter-spacing:.08em;
}
.page-home .ctx-strong{color:var(--paper);font-weight:700;}
.page-home .ctx-sep{color:var(--steel);}
.page-home .ctx-live{display:inline-flex;align-items:center;gap:6px;color:var(--lime);}

/* 首屏 */
.page-home .hero{
  position:relative;
  padding:clamp(20px,4vw,40px) 0 clamp(26px,4vw,46px);
  color:var(--paper);
  background:
    radial-gradient(760px 380px at 82% -10%, rgba(31,163,74,.42), transparent 70%),
    linear-gradient(180deg,var(--night) 0%,var(--ink) 78%,var(--ink) 100%);
  overflow:hidden;
}
.page-home .hero::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  height:1px;
  background:linear-gradient(90deg,transparent,var(--lime),var(--coral),transparent);
  opacity:.55;
}
.page-home .hero-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:var(--home-gap);
}
.page-home .hero-kicker{color:var(--lime);}
.page-home .hero h1{
  margin-top:10px;
  font-size:clamp(26px,5.4vw,46px);
  color:var(--paper);
}
.page-home .hero-lead{
  margin-top:12px;
  font-size:clamp(15px,2.4vw,17px);
  line-height:1.75;
  color:var(--line);
  max-width:38ch;
}

/* 筛选浮层 */
.page-home .filter-panel{
  margin-top:18px;
  padding:14px;
  border:1px solid var(--rule-light);
  border-radius:var(--home-radius);
  background:var(--glass);
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
}
.page-home .filter-head{
  display:flex;
  flex-wrap:wrap;
  gap:6px 12px;
  align-items:baseline;
  justify-content:space-between;
  padding-bottom:10px;
  border-bottom:1px solid var(--rule-light);
  color:var(--standby);
}
.page-home .filter-note{font-size:12px;color:var(--standby);}
.page-home .filter-row{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  margin-top:12px;
}
.page-home .filter-label{
  flex:0 0 auto;
  font-size:12px;
  letter-spacing:.1em;
  color:var(--standby);
}
.page-home .chip-row{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.page-home .chip{
  appearance:none;
  padding:7px 12px;
  border:1px solid var(--rule-light);
  border-radius:999px;
  background:rgba(247,249,244,.06);
  color:var(--paper);
  font:600 13px/1.2 var(--font-body);
  cursor:pointer;
  transition:background .15s var(--ease),color .15s var(--ease),border-color .15s var(--ease);
}
.page-home .chip:hover{border-color:var(--lime);}
.page-home .chip.is-active{
  background:var(--paper);
  color:var(--ink);
  border-color:var(--paper);
  box-shadow:inset 4px 0 0 var(--coral);
}
.page-home .chip:focus-visible{
  outline:2px solid var(--lime);
  outline-offset:2px;
}

/* 按钮 */
.page-home .hbtn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:11px 18px;
  border:1px solid transparent;
  border-radius:10px;
  font:700 15px/1.2 var(--font-body);
  text-decoration:none;
  transition:transform .15s var(--ease),background .15s var(--ease),border-color .15s var(--ease);
}
.page-home .hbtn:hover{transform:translateY(-2px);}
.page-home .hbtn:focus-visible{
  outline:2px solid var(--lime);
  outline-offset:2px;
}
.page-home .hbtn--lime{background:var(--lime);color:var(--ink);}
.page-home .hbtn--coral{background:var(--coral);color:var(--night);}
.page-home .hbtn--ghost{
  border-color:var(--rule-light);
  background:rgba(247,249,244,.06);
  color:var(--paper);
}
.page-home .hbtn--ghost:hover{border-color:var(--lime);}
.page-home .hbtn--line{
  border-color:var(--rule);
  color:var(--ink);
  background:transparent;
}
.page-home .hbtn--line:hover{border-color:var(--grass);color:var(--grass-deep);}
.page-home .hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:16px;
}

/* 比分牌 */
.page-home .scoreboard{
  position:relative;
  border:1px solid var(--rule-light);
  border-radius:20px;
  background:linear-gradient(150deg,var(--ink),var(--night));
  overflow:hidden;
  isolation:isolate;
}
.page-home .score-bg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:.26;
  filter:saturate(1.15) contrast(1.05);
  z-index:-1;
}
.page-home .score-frame{
  position:relative;
  padding:clamp(16px,3vw,24px);
}
.page-home .score-top{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--standby);
}
.page-home .score-tag{color:var(--line);}
.page-home .score-status{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:4px 10px;
  border-radius:999px;
  background:rgba(255,106,77,.16);
  color:var(--coral);
  letter-spacing:.1em;
}
.page-home .score-main{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:8px;
  margin-top:clamp(14px,3vw,22px);
}
.page-home .score-side{display:flex;flex-direction:column;gap:4px;}
.page-home .score-side--r{align-items:flex-end;text-align:right;}
.page-home .side-name{
  font-family:var(--font-display);
  font-size:clamp(15px,2.4vw,20px);
  font-weight:800;
  color:var(--paper);
}
.page-home .side-note{
  font-size:11px;
  letter-spacing:.14em;
  color:var(--standby);
}
.page-home .score-num{
  font-size:clamp(52px,12vw,104px);
  line-height:.9;
  color:var(--lime);
  letter-spacing:-.02em;
  display:flex;
  align-items:baseline;
  justify-content:center;
  text-shadow:0 0 28px rgba(217,245,49,.28);
}
.page-home .score-colon{
  font-size:.52em;
  color:var(--paper);
  padding:0 4px;
  opacity:.7;
}
.page-home .score-foot{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:8px 14px;
  margin-top:clamp(14px,3vw,20px);
  padding-top:12px;
  border-top:1px solid var(--rule-light);
}
.page-home .score-fact{font-size:13px;color:var(--standby);}
.page-home .score-link{
  font-size:14px;
  font-weight:700;
  color:var(--lime);
  text-decoration:none;
  border-bottom:1px solid rgba(217,245,49,.45);
}
.page-home .score-link:hover{color:var(--paper);border-bottom-color:var(--paper);}
.page-home .score-link:focus-visible{outline:2px solid var(--lime);outline-offset:3px;}
.page-home .score-ticks{
  height:14px;
  background:repeating-linear-gradient(90deg,var(--line) 0 1px,transparent 1px 12px);
  opacity:.22;
}

/* 首屏指标条 */
.page-home .hero-stats{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1px;
  margin-top:clamp(20px,4vw,32px);
  border:1px solid var(--rule-light);
  border-radius:14px;
  overflow:hidden;
  background:var(--rule-light);
}
.page-home .hero-stat{
  display:flex;
  flex-direction:column;
  gap:5px;
  padding:14px 16px;
  background:rgba(7,23,32,.62);
}
.page-home .stat-num{
  font-size:clamp(22px,4vw,30px);
  color:var(--lime);
  line-height:1;
}
.page-home .stat-num .unit{
  font-family:var(--font-body);
  font-size:12px;
  font-weight:600;
  margin-left:3px;
  color:var(--standby);
}
.page-home .stat-cap{
  font-size:12px;
  line-height:1.5;
  color:var(--standby);
}

/* 区块骨架 */
.page-home .home-section{padding:clamp(32px,5vw,64px) 0;}
.page-home .home-section--tint{background:#EEF3EA;}
.page-home .home-section--dark{
  color:var(--paper);
  background:
    radial-gradient(620px 320px at 12% 0%, rgba(31,163,74,.3), transparent 72%),
    linear-gradient(180deg,var(--ink),var(--night));
}
.page-home .section-head{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding-bottom:14px;
  margin-bottom:clamp(16px,3vw,26px);
  border-bottom:1px solid var(--rule);
}
.page-home .section-title{
  font-size:clamp(21px,3.6vw,32px);
  color:var(--ink);
}
.page-home .section-note{
  max-width:56ch;
  font-size:14px;
  line-height:1.75;
  color:var(--steel);
}
.page-home .section-head--dark{border-bottom-color:var(--rule-light);}
.page-home .section-head--dark .section-title{color:var(--paper);}
.page-home .section-note--dark{color:var(--standby);}

/* 赛程轨道 */
.page-home .rail{
  display:flex;
  gap:12px;
  overflow-x:auto;
  padding:4px 2px 20px;
  scroll-snap-type:x mandatory;
  scrollbar-width:thin;
  -webkit-overflow-scrolling:touch;
}
.page-home .rail:focus-visible{
  outline:2px solid var(--lime);
  outline-offset:2px;
}
.page-home .race-card{
  position:relative;
  flex:0 0 min(74vw,258px);
  scroll-snap-align:start;
  display:flex;
  flex-direction:column;
  gap:10px;
  padding:14px;
  border:1px solid var(--rule);
  border-left:4px solid var(--grass);
  border-radius:14px;
  background:var(--paper);
  transition:transform .15s var(--ease),border-color .15s var(--ease),box-shadow .15s var(--ease);
}
.page-home .race-card:hover{
  transform:translateY(-3px);
  border-left-color:var(--coral);
  box-shadow:0 10px 24px rgba(14,34,51,.14);
}
.page-home .race-head{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:8px;
}
.page-home .race-tag{
  font-size:11px;
  letter-spacing:.12em;
  color:var(--steel);
}
.page-home .race-time{
  font-size:15px;
  color:var(--ink);
}
.page-home .race-match{
  font-family:var(--font-display);
  font-size:17px;
  font-weight:800;
  color:var(--ink);
}
.page-home .race-match span{
  font-family:var(--font-num);
  font-size:12px;
  color:var(--steel);
  padding:0 4px;
}
.page-home .race-state{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:12px;
  color:var(--steel);
}
.page-home .race-state--live{color:var(--coral);font-weight:700;}
.page-home .race-link{
  margin-top:auto;
  font-size:13px;
  font-weight:700;
  color:var(--grass-deep);
  text-decoration:none;
  border-bottom:1px solid rgba(31,163,74,.4);
  align-self:flex-start;
}
.page-home .race-link:hover{color:var(--ink);border-bottom-color:var(--ink);}
.page-home .race-link:focus-visible{outline:2px solid var(--grass);outline-offset:3px;}

/* 比分与集锦 */
.page-home .result-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:var(--home-gap);
}
.page-home .result-list{display:grid;gap:12px;}
.page-home .result-item{
  padding:16px;
  border:1px solid var(--rule);
  border-radius:14px;
  background:var(--paper);
}
.page-home .result-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  font-size:11px;
  letter-spacing:.12em;
  color:var(--steel);
}
.page-home .result-time{
  padding:2px 8px;
  border-radius:4px;
  background:rgba(46,74,92,.1);
  letter-spacing:.08em;
}
.page-home .result-score{
  margin-top:8px;
  font-family:var(--font-display);
  font-size:18px;
  font-weight:800;
  color:var(--ink);
}
.page-home .result-score .num{
  font-size:22px;
  color:var(--grass-deep);
  padding:0 6px;
}
.page-home .result-desc{
  margin-top:6px;
  font-size:14px;
  line-height:1.7;
  color:var(--steel);
}
.page-home .bar-row{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:12px;
}
.page-home .bar-label{
  flex:0 0 auto;
  font-size:12px;
  color:var(--steel);
}
.page-home .bar{
  flex:1 1 auto;
  height:8px;
  border-radius:999px;
  background:rgba(46,74,92,.14);
  overflow:hidden;
}
.page-home .bar i{
  display:block;
  height:100%;
  width:var(--fill,50%);
  border-radius:999px;
  background:linear-gradient(90deg,var(--grass),var(--lime));
}
.page-home .bar-val{
  flex:0 0 auto;
  font-size:13px;
  color:var(--ink);
}
.page-home .aside-card{
  height:100%;
  padding:clamp(16px,3vw,24px);
  border-radius:16px;
  border:1px solid rgba(14,34,51,.1);
  background:linear-gradient(165deg,var(--ink),var(--night));
  color:var(--paper);
}
.page-home .aside-card .label{color:var(--lime);}
.page-home .aside-card h3{
  margin-top:10px;
  font-size:clamp(18px,2.6vw,23px);
  color:var(--paper);
}
.page-home .aside-card p{
  margin-top:10px;
  font-size:14px;
  line-height:1.8;
  color:var(--standby);
}
.page-home .aside-list{
  margin:14px 0 18px;
  padding:0;
  list-style:none;
  display:grid;
  gap:8px;
}
.page-home .aside-list li{
  position:relative;
  padding-left:14px;
  font-size:13px;
  line-height:1.6;
  color:var(--line);
}
.page-home .aside-list li::before{
  content:"";
  position:absolute;
  left:0;
  top:8px;
  width:6px;
  height:2px;
  background:var(--lime);
}

/* 数据面板 */
.page-home .data-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:var(--home-gap);
}
.page-home .data-figure{
  margin:0;
  border:1px solid var(--rule-light);
  border-radius:16px;
  overflow:hidden;
  background:rgba(7,23,32,.4);
}
.page-home .data-figure img{
  display:block;
  width:100%;
  max-width:100%;
  height:auto;
  object-fit:cover;
}
.page-home .data-figure figcaption,
.page-home .dl-figure figcaption,
.page-home .weekend-figure figcaption{
  padding:10px 14px;
  font-size:12px;
  line-height:1.6;
  color:var(--standby);
  border-top:1px solid var(--rule-light);
}
.page-home .metric-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1px;
  border:1px solid var(--rule-light);
  border-radius:16px;
  overflow:hidden;
  background:var(--rule-light);
}
.page-home .metric{
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:14px;
  background:rgba(7,23,32,.55);
}
.page-home .metric-label{
  font-size:12px;
  letter-spacing:.06em;
  color:var(--standby);
}
.page-home .metric-num{
  font-size:clamp(22px,3.6vw,30px);
  color:var(--lime);
  line-height:1.05;
}
.page-home .metric-num em{
  font-family:var(--font-body);
  font-style:normal;
  font-size:12px;
  font-weight:600;
  margin-left:2px;
  color:var(--standby);
}
.page-home .metric-extra{font-size:11px;color:var(--standby);opacity:.85;}
.page-home .metric-foot{
  margin-top:14px;
  font-size:13px;
  line-height:1.75;
  color:var(--standby);
}
.page-home .metric-wrap .hbtn{margin-top:16px;}

/* 下载与重登 */
.page-home .dl-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:var(--home-gap);
}
.page-home .dev-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
  gap:10px;
}
.page-home .dev-card{
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:14px;
  border:1px solid var(--rule);
  border-radius:12px;
  background:var(--paper);
  text-decoration:none;
  transition:transform .15s var(--ease),border-color .15s var(--ease);
}
.page-home .dev-card:hover{
  transform:translateY(-2px);
  border-color:var(--grass);
}
.page-home .dev-card:focus-visible{outline:2px solid var(--grass);outline-offset:2px;}
.page-home .dev-name{
  font-family:var(--font-display);
  font-size:16px;
  font-weight:800;
  color:var(--ink);
}
.page-home .dev-meta{font-size:12px;color:var(--steel);}
.page-home .step-list{
  margin:18px 0 0;
  padding:0;
  list-style:none;
  display:grid;
  gap:2px;
  border-radius:14px;
  overflow:hidden;
  border:1px solid var(--rule);
  background:var(--rule);
}
.page-home .step-item{
  display:flex;
  gap:12px;
  align-items:flex-start;
  padding:14px;
  background:var(--paper);
}
.page-home .step-num{
  flex:0 0 auto;
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border-radius:8px;
  background:var(--ink);
  color:var(--lime);
  font-size:13px;
}
.page-home .step-title{
  font-size:15px;
  font-weight:700;
  color:var(--ink);
}
.page-home .step-desc{
  margin-top:4px;
  font-size:13px;
  line-height:1.65;
  color:var(--steel);
}
.page-home .dl-main .hbtn{margin-top:16px;}
.page-home .dl-figure{
  margin:0;
  border:1px solid var(--rule);
  border-radius:16px;
  overflow:hidden;
  background:var(--ink);
}
.page-home .dl-figure img{
  display:block;
  width:100%;
  max-width:100%;
  height:auto;
  object-fit:cover;
}
.page-home .dl-figure figcaption{color:var(--standby);}

/* 周末场景 */
.page-home .weekend-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:var(--home-gap);
  align-items:center;
}
.page-home .weekend-figure{
  margin:0;
  border:1px solid var(--rule);
  border-radius:16px;
  overflow:hidden;
  background:var(--ink);
}
.page-home .weekend-figure img{
  display:block;
  width:100%;
  max-width:100%;
  height:auto;
  object-fit:cover;
}
.page-home .weekend-copy{display:flex;flex-direction:column;gap:12px;}
.page-home .weekend-text{
  font-size:15px;
  line-height:1.8;
  color:var(--steel);
  max-width:40ch;
}
.page-home .weekend-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:4px;
}
.page-home .cred-band{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1px;
  margin-top:clamp(24px,4vw,40px);
  border:1px solid var(--rule);
  border-radius:14px;
  overflow:hidden;
  background:var(--rule);
}
.page-home .cred-item{
  display:flex;
  flex-direction:column;
  gap:5px;
  padding:16px;
  background:var(--paper);
}
.page-home .cred-num{
  font-size:clamp(20px,3.4vw,26px);
  color:var(--grass-deep);
  line-height:1;
}
.page-home .cred-cap{
  font-size:12px;
  line-height:1.55;
  color:var(--steel);
}

/* 响应式 */
@media (min-width:640px){
  .page-home .hero-stats{grid-template-columns:repeat(4,minmax(0,1fr));}
  .page-home .metric-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
  .page-home .cred-band{grid-template-columns:repeat(4,minmax(0,1fr));}
}

@media (min-width:900px){
  .page-home .hero-grid{grid-template-columns:5fr 7fr;align-items:start;}
  .page-home .result-grid{grid-template-columns:7fr 5fr;}
  .page-home .data-grid{grid-template-columns:6fr 6fr;align-items:start;}
  .page-home .dl-grid{grid-template-columns:7fr 5fr;align-items:start;}
  .page-home .weekend-grid{grid-template-columns:6fr 6fr;}
  .page-home .race-card{flex:0 0 262px;}
  .page-home .race-card:nth-child(even){transform:translateY(14px);}
  .page-home .race-card:nth-child(even):hover{transform:translateY(11px);}
  .page-home .rail{padding-bottom:26px;}
}

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

@media (prefers-reduced-motion:reduce){
  .page-home .hbtn,
  .page-home .race-card,
  .page-home .dev-card,
  .page-home .chip{transition:none;}
  .page-home .hbtn:hover,
  .page-home .race-card:hover,
  .page-home .dev-card:hover{transform:none;}
  .page-home .race-card:nth-child(even),
  .page-home .race-card:nth-child(even):hover{transform:none;}
}

.page-home {
  --fill: currentColor;
}
