.page-home{
  --home-hair: rgba(245,241,230,.14);
  --home-soft: rgba(245,241,230,.78);
  --home-foot: rgba(245,241,230,.6);
  background: var(--night);
  color: var(--white);
  overflow-x: clip;
}

.page-home .band{ padding-block: clamp(46px,7.5vw,88px); }
.page-home .band--tight{ padding-block: clamp(26px,4vw,42px); }

/* 面包屑 */
.page-home .crumbs{
  padding-top: clamp(16px,3vw,26px);
  font-family: var(--f-mono);
  font-size: 12px;
  letter-spacing: .08em;
}
.page-home .crumbs ul{
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin: 0;
  padding: 0;
  list-style: none;
  color: var(--home-foot);
}
.page-home .crumbs li + li::before{
  content: "/";
  margin-right: .5rem;
  color: rgba(245,241,230,.32);
}
.page-home .crumbs a{ color: var(--kiwi); text-decoration: none; }
.page-home .crumbs a:hover{ text-decoration: underline; text-underline-offset: 3px; }
.page-home .crumbs [aria-current="page"]{ color: rgba(245,241,230,.75); }

/* 首屏 */
.page-home .hero{ padding-block: clamp(18px,3vw,30px) clamp(52px,8vw,96px); }
.page-home .hero__grid{ display: grid; gap: clamp(34px,6vw,56px); }
.page-home .hero__kicker{
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  margin: 0 0 clamp(12px,2vw,18px);
  font-family: var(--f-mono);
  font-size: 12px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--lime);
}
.page-home .hero__kicker::before{
  content: "";
  display: block;
  width: 26px;
  height: 2px;
  background: var(--lime);
}
.page-home .hero h1{
  margin: 0 0 clamp(14px,2.4vw,22px);
  font-family: var(--f-display);
  font-weight: 900;
  font-size: clamp(2rem,5.6vw,3.5rem);
  line-height: 1.06;
  letter-spacing: -.02em;
}
.page-home .hero__lead{
  margin: 0 0 clamp(20px,3vw,28px);
  max-width: 48ch;
  font-family: var(--f-mono);
  font-size: clamp(15px,1.6vw,17px);
  line-height: 1.8;
  color: var(--home-soft);
}
.page-home .hero__cta{
  display: flex;
  flex-wrap: wrap;
  gap: .7rem;
  margin-bottom: clamp(26px,4vw,38px);
}
.page-home .hero__feed{
  padding-top: clamp(12px,2vw,18px);
  border-top: 1px solid rgba(139,195,74,.35);
}
.page-home .hero__feed-label{
  margin: 0 0 .6rem;
  font-family: var(--f-mono);
  font-weight: 400;
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--home-foot);
}
.page-home .hero__feed-list{
  margin: 0;
  padding: 0;
  max-height: 214px;
  overflow-y: auto;
  overscroll-behavior: contain;
  list-style: none;
  font-family: var(--f-mono);
  font-size: 13px;
  scrollbar-width: thin;
  scrollbar-color: var(--kiwi) transparent;
}
.page-home .hero__feed-list li{
  display: grid;
  grid-template-columns: auto minmax(0,1fr);
  gap: .7rem;
  padding: .58rem 0;
  border-bottom: 1px dashed var(--home-hair);
  color: rgba(245,241,230,.82);
  line-height: 1.6;
}
.page-home .feed-id{ color: var(--lime); font-size: 12px; }

.page-home .hero__stage{ position: relative; }
.page-home .hero__shot{ margin: 0; }
.page-home .hero__figure{
  position: relative;
  z-index: 2;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .15rem .85rem;
  margin: calc(-1 * clamp(26px,5vw,58px)) 0 0 clamp(0px,2vw,26px);
}
.page-home .hero__figure-num{
  font-family: var(--f-display);
  font-size: clamp(3rem,11vw,6.2rem);
  line-height: .86;
  letter-spacing: -.03em;
  color: var(--lime);
  text-shadow: 0 6px 30px rgba(10,18,24,.85);
}
.page-home .hero__figure-cap{
  font-family: var(--f-mono);
  font-size: clamp(12px,1.4vw,14px);
  letter-spacing: .04em;
  color: var(--paper);
  text-shadow: 0 2px 14px rgba(10,18,24,.9);
}

.page-home .chain-svg{
  display: block;
  width: 100%;
  height: auto;
  margin-top: clamp(22px,4vw,40px);
}
.page-home .chain-svg text{
  text-anchor: middle;
  font-family: var(--f-mono);
}
.page-home .chain-svg .rail{
  stroke: rgba(139,195,74,.42);
  stroke-width: 2;
  stroke-dasharray: 6 8;
}
.page-home .chain-svg .node-box{
  fill: rgba(109,76,65,.28);
  stroke: var(--kiwi);
  stroke-width: 1.5;
}
.page-home .chain-svg .node-box--live{
  fill: rgba(198,255,0,.12);
  stroke: var(--lime);
}
.page-home .chain-svg .node-box--wait{
  fill: rgba(109,76,65,.45);
  stroke: rgba(109,76,65,1);
}
.page-home .chain-svg .node-glow{
  fill: var(--lime);
  opacity: .12;
  animation: home-breathe 3.6s ease-in-out infinite;
}
.page-home .chain-svg .node-city{
  fill: var(--white);
  font-size: 16px;
  letter-spacing: .05em;
}
.page-home .chain-svg .node-meta{
  fill: rgba(245,241,230,.66);
  font-size: 10.5px;
  letter-spacing: .04em;
}
.page-home .chain-svg .node-meta--live{ fill: var(--lime); }

@keyframes home-breathe{
  0%,100%{ opacity: .08; }
  50%{ opacity: .3; }
}

/* 章节标题 */
.page-home .section-head__num{
  margin: 0;
  font-family: var(--f-mono);
  font-size: 12px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--kiwi);
}
.page-home .section-head h2{
  margin: .4rem 0 .65rem;
  font-family: var(--f-serif);
  font-weight: 700;
  font-size: clamp(1.5rem,3.4vw,2.3rem);
  line-height: 1.22;
  letter-spacing: -.01em;
}
.page-home .section-head p{
  margin: 0;
  max-width: 62ch;
  font-family: var(--f-mono);
  font-size: 15px;
  line-height: 1.82;
  color: var(--home-soft);
}
.page-home .band--paper .section-head__num{ color: var(--leaf); }
.page-home .band--paper .section-head h2{ color: var(--night); }
.page-home .band--paper .section-head p{ color: #3d4d58; }
.page-home .band--peel .section-head__num{ color: var(--lime); }

/* 四地编辑组 */
.page-home .page-home__desk{
  margin: clamp(26px,4vw,44px) 0 0;
}
.page-home .editor-grid{
  display: grid;
  gap: clamp(12px,2vw,18px);
  margin-top: clamp(24px,4vw,40px);
}
.page-home .editor{
  padding: clamp(14px,2.2vw,22px);
  background: rgba(20,32,42,.72);
  border: 1px solid rgba(139,195,74,.28);
  border-radius: var(--r-md);
}
.page-home .editor__title{ margin: 0; font-size: 1rem; }
.page-home .editor__head{
  display: grid;
  grid-template-columns: auto auto minmax(0,1fr) auto;
  align-items: center;
  gap: .65rem;
  width: 100%;
  padding: 0;
  background: none;
  border: 0;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.page-home .editor__city{
  font-family: var(--f-display);
  font-size: 1.05rem;
  letter-spacing: -.01em;
}
.page-home .editor__task{
  font-family: var(--f-mono);
  font-size: 12px;
  color: var(--home-foot);
}
.page-home .editor .fold__sign{
  font-family: var(--f-mono);
  font-size: 18px;
  color: var(--lime);
  transition: transform var(--t);
}
.page-home .editor__head[aria-expanded="true"] .fold__sign{ transform: rotate(45deg); }
.page-home .editor .fold__body{
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  transition: max-height 280ms cubic-bezier(.4,.1,.2,1), opacity 240ms;
}
.page-home .editor__head[aria-expanded="true"] + .fold__body,
.page-home .editor[data-open] .fold__body{
  max-height: 560px;
  opacity: 1;
}
.page-home .editor .fold__body-inner{ padding-top: .95rem; }
.page-home .editor__note{
  margin: 0 0 .8rem;
  font-family: var(--f-mono);
  font-size: 13.5px;
  line-height: 1.78;
  color: var(--home-soft);
}
.page-home .tag-list{
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  margin: 0 0 .85rem;
  padding: 0;
  list-style: none;
}

/* 球员数据卡片 */
.page-home .cards__grid{
  display: grid;
  gap: clamp(26px,4vw,48px);
  margin-top: clamp(24px,4vw,42px);
}
.page-home .fieldgroup{
  padding-top: .9rem;
  margin-bottom: 1.4rem;
  border-top: 2px solid var(--leaf);
}
.page-home .fieldgroup h3{
  margin: 0 0 .5rem;
  font-family: var(--f-serif);
  font-size: 1.08rem;
  color: var(--night);
}
.page-home .fieldgroup ul{
  margin: 0;
  padding-left: 1.1rem;
  font-family: var(--f-mono);
  font-size: 14px;
  line-height: 1.78;
  color: #2b3d49;
}
.page-home .fieldgroup li + li{ margin-top: .3rem; }
.page-home .cards__hint{
  margin: 0;
  font-family: var(--f-mono);
  font-size: 13.5px;
  line-height: 1.8;
  color: #3d4d58;
}
.page-home .cards__hint a{
  color: var(--leaf);
  text-underline-offset: 3px;
}
.page-home .player-card{
  padding: clamp(18px,3vw,28px);
  background: var(--night);
  border-radius: var(--r-lg);
  color: var(--white);
  box-shadow: 0 30px 64px -34px rgba(28,43,54,.9);
}
.page-home .player-card__top{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: .8rem;
  margin-bottom: 1rem;
}
.page-home .player-card__label{
  margin: 0 0 .7rem;
  font-family: var(--f-mono);
  font-size: 12px;
  letter-spacing: .1em;
  color: var(--home-foot);
}
.page-home .player-card__fields{
  margin: 0;
  padding: 0;
  list-style: none;
}
.page-home .player-card__fields li{
  display: grid;
  grid-template-columns: minmax(0,auto) minmax(0,1fr);
  gap: .4rem 1rem;
  padding: .58rem 0;
  border-bottom: 1px dashed rgba(245,241,230,.16);
  font-family: var(--f-mono);
  font-size: 13px;
}
.page-home .pf-name{ color: var(--white); }
.page-home .pf-note{ color: rgba(245,241,230,.66); text-align: right; }
.page-home .player-card__foot{
  margin: .9rem 0 0;
  font-family: var(--f-mono);
  font-size: 12.5px;
  line-height: 1.75;
  color: rgba(139,195,74,.9);
}

/* 阵容比较 */
.page-home .page-home__board{ margin: clamp(26px,4vw,44px) 0 0; }
.page-home .compare{ margin-top: clamp(26px,4vw,44px); }
.page-home .compare__radio{
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}
.page-home .compare__tabs{
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin-bottom: clamp(16px,2.4vw,24px);
}
.page-home .compare__tab{
  display: inline-flex;
  align-items: center;
  padding: .5rem 1.15rem;
  border: 1px solid rgba(139,195,74,.5);
  border-radius: var(--pill);
  font-family: var(--f-mono);
  font-size: 13px;
  color: var(--paper);
  cursor: pointer;
  transition: background var(--t), color var(--t), border-color var(--t);
}
.page-home #cmp-football:checked ~ .compare__tabs .compare__tab--a,
.page-home #cmp-basket:checked ~ .compare__tabs .compare__tab--b{
  background: var(--lime);
  border-color: var(--lime);
  color: var(--night);
}
.page-home .compare__panes{ overflow-x: auto; }
.page-home .compare__pane{ display: none; }
.page-home #cmp-football:checked ~ .compare__panes .compare__pane--a{ display: block; }
.page-home #cmp-basket:checked ~ .compare__panes .compare__pane--b{ display: block; }
.page-home .compare__table{
  width: 100%;
  min-width: 420px;
  border-collapse: collapse;
  font-family: var(--f-mono);
  font-size: 13.5px;
}
.page-home .compare__table caption{
  padding-bottom: .8rem;
  text-align: left;
  font-size: 12px;
  letter-spacing: .1em;
  color: rgba(139,195,74,.9);
}
.page-home .compare__table th,
.page-home .compare__table td{
  padding: .8rem .7rem;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--home-hair);
  line-height: 1.7;
}
.page-home .compare__table thead th{
  font-size: 12px;
  letter-spacing: .1em;
  color: var(--kiwi);
  border-bottom-color: rgba(139,195,74,.5);
}
.page-home .compare__table tbody th{
  color: var(--white);
  font-weight: 400;
  white-space: nowrap;
}
.page-home .compare__table td{ color: var(--home-soft); }
.page-home .compare__hint{
  margin: 1rem 0 0;
  font-family: var(--f-mono);
  font-size: 13px;
  color: rgba(139,195,74,.88);
}

/* 校对日志 */
.page-home .logline{
  position: relative;
  margin: clamp(24px,4vw,42px) 0 0;
  padding: 0;
  list-style: none;
}
.page-home .logline::before{
  content: "";
  position: absolute;
  left: 7px;
  top: 8px;
  bottom: 8px;
  width: 2px;
  background: var(--rule);
}
.page-home .logline__item{
  position: relative;
  padding: 0 0 clamp(20px,3vw,30px) clamp(28px,4vw,42px);
}
.page-home .logline__item::before{
  content: "";
  position: absolute;
  left: 0;
  top: 5px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--paper);
  border: 3px solid var(--kiwi);
  box-sizing: border-box;
}
.page-home .logline__time{
  margin: 0;
  font-family: var(--f-mono);
  font-size: 12px;
  letter-spacing: .06em;
  color: var(--clay);
}
.page-home .logline__title{
  margin: .3rem 0 .35rem;
  font-family: var(--f-serif);
  font-size: 1.1rem;
  color: var(--night);
}
.page-home .logline__meta{
  margin: 0;
  font-family: var(--f-mono);
  font-size: 12.5px;
  color: #4a5a64;
}
.page-home .logline__bubble{
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  transition: max-height 260ms cubic-bezier(.4,.1,.2,1), opacity 220ms, margin-top 220ms;
}
.page-home .logline__item:hover .logline__bubble,
.page-home .logline__item:focus-within .logline__bubble{
  max-height: 220px;
  opacity: 1;
  margin-top: .6rem;
}
.page-home .logline__bubble p{
  margin: 0;
  padding: .7rem .95rem;
  background: var(--paper-2);
  border-left: 3px solid var(--kiwi);
  font-family: var(--f-mono);
  font-size: 13px;
  line-height: 1.75;
  color: #2b3d49;
}
.page-home .logline__more{ margin: clamp(6px,1.5vw,14px) 0 0; }
.page-home .btn--ink{
  background: var(--night);
  border-color: var(--night);
  color: var(--paper);
}
.page-home .btn--ink:hover{ background: var(--peel); border-color: var(--peel); }

/* 订阅 */
.page-home .sub__grid{
  display: grid;
  gap: clamp(26px,4vw,48px);
  align-items: center;
}
.page-home .page-home__subscribe{ color: var(--paper); }
.page-home .page-home__subscribe h2{
  margin: .4rem 0 .8rem;
  font-family: var(--f-display);
  font-weight: 900;
  font-size: clamp(1.55rem,3.4vw,2.35rem);
  line-height: 1.12;
  letter-spacing: -.015em;
  color: var(--white);
}
.page-home .page-home__subscribe p{
  margin: 0 0 1rem;
  max-width: 52ch;
  font-family: var(--f-mono);
  font-size: 14.5px;
  line-height: 1.82;
  color: rgba(245,241,230,.9);
}
.page-home .sub__list{
  margin: 0 0 1.4rem;
  padding: 0;
  list-style: none;
}
.page-home .sub__list li{
  position: relative;
  padding: .55rem 0 .55rem 1.4rem;
  border-bottom: 1px dashed rgba(245,241,230,.32);
  font-family: var(--f-mono);
  font-size: 14px;
  color: rgba(245,241,230,.94);
}
.page-home .sub__list li::before{
  content: "›";
  position: absolute;
  left: 0;
  color: var(--lime);
}
.page-home .sub__cta{
  display: flex;
  flex-wrap: wrap;
  gap: .7rem;
  margin: 0;
}
.page-home .sub__shot{ margin: 0; }

/* 收尾 */
.page-home .tail-line{
  margin: 0;
  max-width: 70ch;
  font-family: var(--f-mono);
  font-size: 14px;
  line-height: 1.85;
  color: var(--home-soft);
}
.page-home .tail-line a{
  color: var(--kiwi);
  text-underline-offset: 3px;
}

/* 断点 */
@media (min-width: 760px){
  .page-home .editor-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (min-width: 900px){
  .page-home .cards__grid{ grid-template-columns: minmax(0,1.05fr) minmax(0,.95fr); align-items: start; }
  .page-home .sub__grid{ grid-template-columns: minmax(0,1.1fr) minmax(0,.9fr); }
}
@media (min-width: 980px){
  .page-home .hero__grid{ grid-template-columns: minmax(0,41fr) minmax(0,59fr); align-items: start; }
}
@media (max-width: 760px){
  .page-home .logline__bubble{
    max-height: 320px;
    opacity: 1;
    margin-top: .6rem;
  }
  .page-home .editor__head{ grid-template-columns: auto auto minmax(0,1fr); row-gap: .4rem; }
  .page-home .editor .fold__sign{ grid-column: 3; justify-self: end; }
  .page-home .pf-note{ text-align: left; }
}

@media (prefers-reduced-motion: reduce){
  .page-home .chain-svg .node-glow{ animation: none; opacity: .18; }
  .page-home .editor .fold__body,
  .page-home .logline__bubble,
  .page-home .compare__tab,
  .page-home .editor .fold__sign{ transition: none; }
  .page-home .logline__bubble{ max-height: 320px; opacity: 1; margin-top: .6rem; }
}
