.page-home{
  --home-rail-w:236px;
  --home-cut:26px;
  --home-hair:1px solid var(--grid);
  position:relative;
  padding-block:clamp(16px,2.6vw,30px) clamp(48px,7vw,88px);
  background-image:
    repeating-linear-gradient(0deg,var(--grid-line) 0 1px,transparent 1px 72px),
    repeating-linear-gradient(90deg,var(--grid-line) 0 1px,transparent 1px 72px);
}

.page-home .home-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:clamp(18px,2.4vw,30px);
  align-items:start;
}

@media (min-width:1000px){
  .page-home .home-grid{
    grid-template-columns:var(--home-rail-w) minmax(0,1fr);
    gap:clamp(20px,2.6vw,38px);
  }
  .page-home .home-rail{
    position:sticky;
    top:clamp(12px,2vw,22px);
  }
}

/* ---------- 左栏 ---------- */
.page-home .home-rail{
  display:grid;
  gap:10px;
  align-content:start;
  min-width:0;
}

.page-home .rail-card{
  position:relative;
  padding:14px;
  background:var(--panel);
  border:var(--home-hair);
}

.page-home .rail-card::after{
  content:"";
  position:absolute;
  right:0;
  bottom:0;
  width:38px;
  height:1px;
  background:var(--cyan);
  opacity:.55;
}

.page-home .rail-card__title{
  margin:0 0 6px;
  font-family:var(--font-serif);
  font-weight:500;
  font-size:14px;
  letter-spacing:.04em;
  color:var(--text);
}

.page-home .rail-card__note{
  margin:0 0 12px;
  font-size:12px;
  line-height:1.6;
  color:var(--muted);
}

.page-home .team-strip{
  display:flex;
  gap:6px;
  margin:0;
  padding:0 0 6px;
  list-style:none;
  overflow-x:auto;
  scrollbar-width:thin;
  scrollbar-color:var(--grid) transparent;
}

.page-home .team-chip{
  flex:0 0 auto;
  min-width:66px;
  min-height:44px;
  padding:0 10px;
  display:grid;
  place-items:center;
  font-family:var(--font-sans);
  font-size:12.5px;
  font-weight:700;
  color:var(--text);
  background:var(--panel-2);
  border:1px solid var(--grid);
  cursor:pointer;
  transition:border-color var(--dur) var(--ease),color var(--dur) var(--ease);
}

.page-home .team-chip:hover,
.page-home .team-chip:focus-visible{
  border-color:var(--cyan);
  color:var(--cyan);
  outline:none;
}

.page-home .team-chip.is-active{
  border-color:var(--amber);
  color:var(--amber);
}

.page-home .league-list{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:2px 6px;
  margin:0;
  padding:0;
  list-style:none;
}

.page-home .league-item{
  width:100%;
  min-height:34px;
  padding:6px 8px;
  text-align:left;
  font-family:var(--font-sans);
  font-size:12.5px;
  color:var(--muted);
  background:transparent;
  border:1px solid transparent;
  border-left:2px solid transparent;
  cursor:pointer;
  transition:color var(--dur) var(--ease),border-color var(--dur) var(--ease),background var(--dur) var(--ease);
}

.page-home .league-item:hover,
.page-home .league-item:focus-visible{
  color:var(--text);
  background:var(--panel-2);
  border-left-color:var(--cyan);
  outline:none;
}

.page-home .league-item.is-active{
  color:var(--cyan);
  border-left-color:var(--amber);
  background:var(--panel-2);
}

.page-home .rail-card--hint p{
  margin:0 0 8px;
  font-size:12px;
  line-height:1.7;
  color:var(--muted);
}

.page-home .rail-link{
  display:inline-block;
  font-size:12.5px;
  color:var(--cyan);
  text-decoration:none;
  border-bottom:1px solid var(--cyan-soft);
  padding-bottom:1px;
}

.page-home .rail-link:hover{
  color:var(--amber);
  border-bottom-color:var(--amber-soft);
}

/* ---------- 主区骨架 ---------- */
.page-home .home-main{
  display:grid;
  gap:clamp(22px,3vw,44px);
  min-width:0;
}

.page-home .home-crumb{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.1em;
  color:var(--muted);
}

.page-home .home-crumb span[aria-hidden]{
  color:var(--brick);
}

/* ---------- 首屏 ---------- */
.page-home .hero{
  display:grid;
  gap:12px;
  padding-bottom:clamp(14px,2vw,22px);
  border-bottom:var(--home-hair);
}

.page-home .hero-kicker{
  margin:0;
  font-family:var(--font-mono);
  font-size:11.5px;
  letter-spacing:.1em;
  color:var(--cyan);
}

.page-home .hero h1{
  margin:0;
  font-family:var(--font-sans);
  font-weight:900;
  font-size:clamp(28px,4.6vw,52px);
  line-height:1.06;
  letter-spacing:-.02em;
  color:var(--text);
}

.page-home .hero-lede{
  max-width:64ch;
  margin:0;
  font-size:clamp(13.5px,1.5vw,16px);
  line-height:1.8;
  color:var(--muted);
}

/* ---------- 首屏 Bento ---------- */
.page-home .hero-board{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--gap);
}

@media (min-width:720px){
  .page-home .hero-board{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
  .page-home .focus-card{grid-column:span 2;grid-row:span 2;}
  .page-home .entry-card--a{grid-column:span 1;}
  .page-home .entry-card--b{grid-column:span 1;}
  .page-home .entry-card--wide{grid-column:span 2;}
  .page-home .board-status{grid-column:span 4;}
}

.page-home .focus-card{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  display:grid;
  align-content:end;
  min-height:clamp(280px,42vw,392px);
  padding:clamp(16px,2.4vw,28px);
  background:var(--panel);
  border:var(--home-hair);
}

.page-home .focus-card__img{
  position:absolute;
  inset:0;
  z-index:0;
  width:100%;
  height:100%;
  max-width:100%;
  object-fit:cover;
  opacity:.38;
}

.page-home .focus-card__draft{
  position:absolute;
  inset:0;
  z-index:1;
  width:100%;
  height:100%;
  color:var(--cyan);
  opacity:.14;
}

.page-home .focus-card::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  background:linear-gradient(180deg,transparent 18%,var(--ink) 94%);
}

.page-home .focus-card__body{
  position:relative;
  z-index:3;
  display:grid;
  gap:10px;
  justify-items:start;
}

.page-home .focus-card__title{
  margin:0;
  font-family:var(--font-sans);
  font-weight:900;
  font-size:clamp(26px,4.4vw,44px);
  line-height:1;
  letter-spacing:-.02em;
  color:var(--text);
}

.page-home .focus-card__title span{
  font-family:var(--font-serif);
  font-style:italic;
  font-weight:500;
  font-size:.5em;
  color:var(--cyan);
  padding:0 .18em;
}

.page-home .focus-card__meta{
  margin:0;
  font-size:13px;
  line-height:1.7;
  color:var(--muted);
}

.page-home .entry-card{
  position:relative;
  display:grid;
  align-content:space-between;
  gap:12px;
  min-height:132px;
  padding:clamp(14px,2vw,20px);
  background:var(--panel);
  border:var(--home-hair);
  color:var(--text);
  text-decoration:none;
  transition:border-color var(--dur) var(--ease),transform var(--dur) var(--ease);
}

.page-home .entry-card:hover,
.page-home .entry-card:focus-visible{
  border-color:var(--cyan);
  transform:translateY(-2px);
  outline:none;
}

.page-home .entry-card__label{
  display:block;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.08em;
  color:var(--cyan);
}

.page-home .entry-card__title{
  display:block;
  font-size:14px;
  font-weight:700;
  line-height:1.6;
  color:var(--text);
}

.page-home .entry-card__arrow{
  font-family:var(--font-mono);
  font-size:18px;
  color:var(--brick);
  transition:color var(--dur) var(--ease);
}

.page-home .entry-card:hover .entry-card__arrow{
  color:var(--amber);
}

.page-home .entry-card--wide{
  align-content:center;
}

@media (min-width:560px){
  .page-home .entry-card--wide{
    grid-template-columns:minmax(0,1fr) 150px;
    align-items:center;
  }
}

.page-home .entry-card__text{
  display:grid;
  gap:8px;
}

.page-home .entry-card__shot{
  width:100%;
  height:110px;
  max-width:100%;
  object-fit:cover;
  opacity:.8;
  clip-path:polygon(0 0,100% 0,100% 100%,18px 100%,0 calc(100% - 18px));
}

.page-home .board-status{
  display:grid;
  gap:12px;
  padding:clamp(14px,2vw,20px);
  background:var(--panel-2);
  border:var(--home-hair);
  border-left:3px solid var(--amber);
}

@media (min-width:640px){
  .page-home .board-status{
    grid-template-columns:minmax(0,1fr) 190px;
    align-items:center;
  }
}

.page-home .board-status__k{
  margin:0 0 6px;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.1em;
  color:var(--amber);
}

.page-home .board-status__v{
  margin:0;
  font-size:13px;
  line-height:1.75;
  color:var(--text);
}

.page-home .board-status__img{
  width:100%;
  height:96px;
  max-width:100%;
  object-fit:cover;
  opacity:.75;
}

/* ---------- 区块通用 ---------- */
.page-home .home-block{
  display:grid;
  gap:clamp(14px,2vw,24px);
  min-width:0;
}

.page-home .block-head{
  display:grid;
  gap:10px;
  max-width:70ch;
}

.page-home .home-no{
  font-family:var(--font-serif);
  font-weight:500;
  font-size:13px;
  letter-spacing:.14em;
  color:var(--brick);
}

.page-home .block-head h2{
  margin:0;
  font-family:var(--font-sans);
  font-weight:900;
  font-size:clamp(21px,3vw,32px);
  line-height:1.22;
  letter-spacing:-.015em;
  color:var(--text);
}

.page-home .block-lede{
  margin:0;
  font-size:13.5px;
  line-height:1.8;
  color:var(--muted);
}

/* ---------- 对位卡 ---------- */
.page-home .duel-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--gap);
}

@media (min-width:780px){
  .page-home .duel-grid{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  }
}

.page-home .duel-card{
  position:relative;
  isolation:isolate;
  padding:clamp(16px,2.4vw,26px);
  padding-bottom:clamp(30px,3.4vw,40px);
  color:var(--text);
}

.page-home .duel-card__bg{
  position:absolute;
  inset:0;
  z-index:0;
  background:var(--panel);
  border:var(--home-hair);
  clip-path:polygon(0 0,100% 0,100% calc(100% - var(--home-cut)),0 100%);
  transition:clip-path var(--dur-lg) var(--ease),background var(--dur-lg) var(--ease);
}

.page-home .duel-card:hover .duel-card__bg,
.page-home .duel-card:focus-within .duel-card__bg{
  background:var(--panel-2);
  clip-path:polygon(0 0,100% 0,100% calc(100% - 13px),0 100%);
}

.page-home .duel-card__inner{
  position:relative;
  z-index:1;
  display:grid;
  gap:6px;
}

.page-home .duel-card__team{
  margin:0;
  font-family:var(--font-sans);
  font-weight:900;
  font-size:clamp(20px,2.6vw,26px);
  letter-spacing:-.01em;
  color:var(--text);
}

.page-home .duel-card__side{
  margin:0 0 6px;
  font-family:var(--font-mono);
  font-size:11.5px;
  letter-spacing:.06em;
  color:var(--muted);
}

.page-home .duel-metrics{
  display:grid;
  gap:0;
  margin:0;
  padding:0;
  list-style:none;
}

.page-home .duel-metric{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:12px;
  padding:8px 0;
  border-bottom:1px dashed var(--grid);
}

.page-home .duel-metric:last-child{
  border-bottom:0;
}

.page-home .duel-metric__k{
  font-size:12.5px;
  color:var(--muted);
}

.page-home .duel-num{
  font-family:var(--font-mono);
  font-weight:700;
  font-size:clamp(34px,5vw,58px);
  line-height:.95;
  letter-spacing:-.04em;
  color:var(--text);
  margin-right:-6px;
}

.page-home .duel-card:first-child .duel-metric:first-child .duel-num{
  color:var(--amber);
}

.page-home .duel-card:last-child .duel-metric:nth-child(2) .duel-num{
  color:var(--cyan);
}

/* ---------- 最近交锋 ---------- */
.page-home .recap__grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--gap);
}

@media (min-width:860px){
  .page-home .recap__grid{
    grid-template-columns:minmax(0,.9fr) minmax(0,1.15fr);
    grid-template-rows:auto auto;
  }
  .page-home .recap__score{grid-row:span 2;}
}

.page-home .recap__score{
  padding:clamp(18px,2.6vw,28px);
  background:var(--paper);
  color:var(--ink);
  clip-path:polygon(0 0,100% 0,100% calc(100% - var(--home-cut)),0 100%);
}

.page-home .recap__tag{
  margin:0 0 12px;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.08em;
  color:var(--brick-deep);
}

.page-home .recap__fig{
  display:flex;
  align-items:baseline;
  gap:.14em;
  margin:0 0 10px;
  font-family:var(--font-mono);
  font-weight:700;
  font-size:clamp(56px,10vw,104px);
  line-height:.86;
  letter-spacing:-.05em;
  color:var(--ink);
}

.page-home .recap__fig em{
  font-style:normal;
  font-size:.36em;
  color:var(--brick);
}

.page-home .recap__meta{
  margin:0 0 18px;
  font-size:12.5px;
  line-height:1.7;
  color:var(--grid);
}

.page-home .recap__score .btn--slant{
  color:var(--ink);
}

.page-home .recap__nodes{
  display:grid;
  gap:2px;
  margin:0;
  padding:0;
  list-style:none;
  counter-reset:recapnode;
}

.page-home .recap__nodes li{
  position:relative;
  padding:14px 16px 14px 44px;
  background:var(--panel);
  border:var(--home-hair);
  counter-increment:recapnode;
}

.page-home .recap__nodes li::before{
  content:counter(recapnode,decimal-leading-zero);
  position:absolute;
  left:14px;
  top:15px;
  font-family:var(--font-serif);
  font-size:13px;
  color:var(--brick);
}

.page-home .recap__nodes li p{
  margin:2px 0 0;
  font-size:13px;
  line-height:1.75;
  color:var(--muted);
}

.page-home .recap__node-time{
  font-family:var(--font-mono);
  font-size:11.5px;
  letter-spacing:.08em;
  color:var(--cyan);
}

.page-home .recap__stats{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:2px;
  margin:0;
  background:var(--panel-2);
  border:var(--home-hair);
}

.page-home .recap__stats > div{
  padding:12px 10px;
  border-right:1px solid var(--grid);
}

.page-home .recap__stats > div:last-child{
  border-right:0;
}

.page-home .recap__stats dt{
  font-size:11.5px;
  color:var(--muted);
  margin-bottom:6px;
}

.page-home .recap__stats dd{
  margin:0;
  font-family:var(--font-mono);
  font-size:13px;
  font-weight:700;
  color:var(--text);
  letter-spacing:-.01em;
}

.page-home .recap__stats dd span{
  color:var(--grid);
  font-weight:400;
  padding:0 2px;
}

/* ---------- 我的球队 ---------- */
.page-home .mine__body{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--gap);
  align-items:stretch;
}

@media (min-width:820px){
  .page-home .mine__body{
    grid-template-columns:minmax(0,.95fr) minmax(0,1.1fr);
  }
}

.page-home .mine__figure{
  margin:0;
  position:relative;
  display:grid;
  align-content:end;
  min-height:220px;
  background:var(--panel-2);
  border:var(--home-hair);
  overflow:hidden;
}

.page-home .mine__figure img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  max-width:100%;
  object-fit:cover;
  opacity:.4;
}

.page-home .mine__figure figcaption{
  position:relative;
  padding:14px 16px;
  font-size:12px;
  line-height:1.7;
  color:var(--text);
  background:linear-gradient(180deg,transparent,var(--ink));
}

.page-home .mine__panel{
  display:grid;
  gap:12px;
  align-content:start;
  padding:clamp(16px,2.4vw,24px);
  background:var(--panel);
  border:var(--home-hair);
  justify-items:start;
}

.page-home .mine__kicker{
  margin:0;
  font-family:var(--font-mono);
  font-size:11.5px;
  letter-spacing:.06em;
  color:var(--cyan);
}

.page-home .track-list{
  display:grid;
  gap:8px;
  width:100%;
  margin:0;
  padding:0;
  list-style:none;
}

.page-home .track-list li{
  display:grid;
  grid-template-columns:64px minmax(0,1fr) 44px;
  align-items:center;
  gap:10px;
}

.page-home .track-list__k{
  font-size:12px;
  color:var(--muted);
}

.page-home .track-list__bar{
  display:block;
  height:8px;
  background:var(--panel-2);
  border-left:1px solid var(--cyan);
}

.page-home .track-list__bar i{
  display:block;
  height:100%;
  background:linear-gradient(90deg,var(--cyan-soft),var(--cyan));
  transition:width var(--dur-lg) var(--ease);
}

.page-home .track-list li:nth-child(1) i{width:92%;}
.page-home .track-list li:nth-child(2) i{width:64%;}
.page-home .track-list li:nth-child(3) i{width:48%;}
.page-home .track-list li:nth-child(4) i{width:78%;}
.page-home .track-list li:nth-child(5) i{width:62%;}

.page-home .track-list__v{
  font-family:var(--font-mono);
  font-size:12px;
  text-align:right;
  color:var(--amber);
}

.page-home .mine__note{
  margin:0;
  font-size:12.5px;
  line-height:1.75;
  color:var(--muted);
}

/* ---------- 分流 ---------- */
.page-home .split__grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--gap);
}

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

.page-home .split__card{
  display:grid;
  gap:10px;
  padding:clamp(16px,2.4vw,24px);
  background:var(--panel);
  border:var(--home-hair);
  border-top:2px solid var(--cyan);
}

.page-home .split__kicker{
  margin:0;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.08em;
  color:var(--cyan);
}

.page-home .split__card h3{
  margin:0;
  font-size:clamp(17px,2.2vw,21px);
  font-weight:800;
  line-height:1.35;
  color:var(--text);
}

.page-home .split__card p{
  margin:0;
  font-size:13px;
  line-height:1.78;
  color:var(--muted);
}

.page-home .split__link{
  justify-self:start;
  margin-top:2px;
  font-size:13px;
  color:var(--cyan);
  text-decoration:none;
  border-bottom:1px solid var(--cyan-soft);
  padding-bottom:1px;
}

.page-home .split__link:hover,
.page-home .split__link:focus-visible{
  color:var(--amber);
  border-bottom-color:var(--amber-soft);
  outline:none;
}

.page-home .split__device{
  background:var(--panel-2);
  border:var(--home-hair);
  border-left:2px solid var(--amber);
}

.page-home .split__summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-height:56px;
  padding:14px 16px;
  font-size:14px;
  font-weight:700;
  color:var(--text);
  cursor:pointer;
  list-style:none;
}

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

.page-home .split__summary:focus-visible{
  outline:2px solid var(--cyan);
  outline-offset:-2px;
}

.page-home .split__chev{
  flex:0 0 auto;
  width:10px;
  height:10px;
  border-right:2px solid var(--amber);
  border-bottom:2px solid var(--amber);
  transform:rotate(45deg);
  transition:transform var(--dur) var(--ease);
}

.page-home .split__device[open] .split__chev{
  transform:rotate(-135deg);
}

.page-home .split__device-body{
  display:grid;
  gap:10px;
  padding:0 16px 16px;
}

.page-home .split__device-body p{
  margin:0;
  font-size:13px;
  line-height:1.78;
  color:var(--muted);
}

.page-home .split__hint{
  padding-left:10px;
  border-left:1px solid var(--grid);
  font-size:12.5px;
  color:var(--muted);
}

/* ---------- 来源 ---------- */
.page-home .source__inner{
  display:grid;
  gap:12px;
  padding:clamp(18px,2.8vw,30px);
  background:var(--panel);
  border:var(--home-hair);
  border-left:4px solid var(--brick);
}

.page-home .source__inner h2{
  margin:0;
  font-family:var(--font-sans);
  font-weight:900;
  font-size:clamp(20px,2.6vw,26px);
  letter-spacing:-.01em;
  color:var(--text);
}

.page-home .source__inner p{
  max-width:74ch;
  margin:0;
  font-size:13.5px;
  line-height:1.85;
  color:var(--muted);
}

.page-home .source__inner .btn-row{
  margin-top:6px;
}

@media (max-width:560px){
  .page-home .recap__stats{
    grid-template-columns:minmax(0,1fr);
  }
  .page-home .recap__stats > div{
    border-right:0;
    border-bottom:1px solid var(--grid);
  }
  .page-home .recap__stats > div:last-child{
    border-bottom:0;
  }
  .page-home .track-list li{
    grid-template-columns:58px minmax(0,1fr) 40px;
    gap:8px;
  }
  .page-home .board-status__img{
    height:78px;
  }
}
<<<END>>>