.page-home {
  --home-line: rgba(42, 53, 80, .9);
  --home-panel: rgba(14, 23, 48, .92);
  --home-glow: 0 0 0 1px rgba(46, 123, 255, .4), 0 26px 70px -34px rgba(46, 123, 255, .7);
  color: var(--paper);
  background: var(--ink-950);
  overflow-x: hidden;
  padding-bottom: 72px;
}

/* ---------- 面包屑 ---------- */
.page-home .home-crumbs {
  max-width: var(--shell);
  margin: 0 auto;
  padding: 18px var(--gutter) 0;
}
.page-home .crumbs-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
  font-family: var(--font-mono);
  font-size: .75rem;
  letter-spacing: .08em;
  color: var(--mute);
}
.page-home .crumbs-item[aria-current="page"] { color: var(--mint); }
.page-home .crumbs-link {
  color: var(--mute);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: color .2s var(--ease), border-color .2s var(--ease);
}
.page-home .crumbs-link:hover,
.page-home .crumbs-link:focus-visible {
  color: var(--blue);
  border-color: var(--blue);
}

/* ---------- 首屏框景 ---------- */
.page-home .hero {
  padding: 0 var(--gutter);
  margin-top: 14px;
}
.page-home .hero-frame {
  position: relative;
  max-width: var(--shell);
  margin: 0 auto;
  border: 1px solid var(--edge);
  border-radius: var(--radius-lg);
  overflow: hidden;
  isolation: isolate;
  background: linear-gradient(150deg, #0E1730 0%, #070A12 55%, #1B1E4A 100%);
  transition: border-color .35s var(--ease), box-shadow .35s var(--ease);
}
.page-home .hero-frame::before,
.page-home .hero-frame::after {
  content: "";
  position: absolute;
  left: 20px;
  right: 20px;
  height: 7px;
  z-index: 4;
  pointer-events: none;
  background-image: repeating-linear-gradient(90deg, var(--edge) 0 1px, transparent 1px 18px);
  opacity: .85;
}
.page-home .hero-frame::before { top: 11px; }
.page-home .hero-frame::after { bottom: 11px; }
.page-home .hero-frame:hover { border-color: var(--blue); box-shadow: var(--home-glow); }

.page-home .hero-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .42;
}
.page-home .hero-veil {
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    radial-gradient(circle at 80% 16%, rgba(46, 123, 255, .38), transparent 56%),
    radial-gradient(circle at 8% 92%, rgba(164, 76, 255, .28), transparent 52%),
    linear-gradient(158deg, rgba(7, 10, 18, .94) 34%, rgba(27, 30, 74, .62) 100%);
}

.page-home .hero-grid {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr;
  gap: 30px;
  padding: 46px 20px 34px;
}
.page-home .hero-grid::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: linear-gradient(118deg, transparent 49.6%, rgba(46, 123, 255, .16) 50%, rgba(164, 76, 255, .1) 63%, transparent 63.4%);
}
.page-home .hero-copy,
.page-home .hero-scores { position: relative; z-index: 1; }

.page-home .hero-title {
  margin: 16px 0 0;
  font-family: var(--font-head);
  font-weight: 800;
  font-size: clamp(2rem, 6.4vw, 4.2rem);
  line-height: 1.08;
  letter-spacing: -.02em;
  color: var(--paper);
  text-wrap: balance;
}
.page-home .hero-lede {
  margin: 18px 0 0;
  max-width: 34em;
  font-size: 1rem;
  line-height: 1.75;
  color: var(--mute);
}
.page-home .hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 26px;
}
.page-home .hero-cta {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.page-home .hero-cta::after {
  content: "";
  position: absolute;
  top: 0;
  left: -70%;
  width: 42%;
  height: 100%;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .62), transparent);
  transform: skewX(-18deg);
  transition: left .55s var(--ease);
  z-index: -1;
}
.page-home .hero-cta:hover::after,
.page-home .hero-cta:focus-visible::after { left: 130%; }
.page-home .hero-hint {
  margin: 16px 0 0;
  font-size: .8125rem;
  color: var(--mute);
}

/* 实时比分面板 */
.page-home .hero-scores {
  border: 1px solid var(--edge);
  border-radius: var(--radius-md);
  background: linear-gradient(170deg, rgba(14, 23, 48, .95), rgba(7, 10, 18, .86));
  padding: 18px 18px 16px;
  backdrop-filter: blur(2px);
}
.page-home .hero-scores-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--home-line);
}
.page-home .live-dot {
  flex: none;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--mint);
  animation: home-pulse 2.2s var(--ease) infinite;
}
@keyframes home-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(53, 241, 161, .65); }
  70%  { box-shadow: 0 0 0 10px rgba(53, 241, 161, 0); }
  100% { box-shadow: 0 0 0 0 rgba(53, 241, 161, 0); }
}
.page-home .hero-scores-title {
  margin: 0;
  font-family: var(--font-head);
  font-size: .9375rem;
  font-weight: 700;
  color: var(--paper);
}
.page-home .hero-scores-meta {
  margin-left: auto;
  font-family: var(--font-mono);
  font-size: .75rem;
  color: var(--mint);
  letter-spacing: .04em;
}
.page-home .hero-score-list {
  margin: 6px 0 0;
  padding: 0;
  list-style: none;
}
.page-home .hero-score {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 11px 0;
  border-bottom: 1px dashed rgba(42, 53, 80, .85);
}
.page-home .hero-score-cat {
  font-size: .75rem;
  font-weight: 700;
  color: var(--violet);
  letter-spacing: .06em;
}
.page-home .hero-score-state {
  font-size: .8125rem;
  color: var(--mute);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.page-home .hero-score-num {
  font-family: var(--font-mono);
  font-weight: 600;
  font-size: 1.0625rem;
  color: var(--paper);
  font-variant-numeric: tabular-nums;
  letter-spacing: .04em;
}
.page-home .hero-scores-note {
  margin: 12px 0 0;
  font-size: .75rem;
  line-height: 1.6;
  color: var(--mute);
}
.page-home .hero-scores-link {
  display: inline-block;
  margin-top: 12px;
  font-size: .875rem;
  font-weight: 600;
  color: var(--blue);
  text-decoration: none;
  border-bottom: 1px solid rgba(46, 123, 255, .45);
  transition: color .2s var(--ease), border-color .2s var(--ease);
}
.page-home .hero-scores-link:hover,
.page-home .hero-scores-link:focus-visible {
  color: var(--mint);
  border-color: var(--mint);
}

/* ---------- 通用章节 ---------- */
.page-home .section { padding: 58px 0 0; }
.page-home .section-head { max-width: var(--shell); margin: 0 auto; }
.page-home .section-head .title { margin: 10px 0 0; }
.page-home .section-head .lede {
  margin: 14px 0 0;
  max-width: 56ch;
  font-size: 1rem;
  line-height: 1.75;
  color: var(--mute);
}

/* ---------- 进行中赛事带 ---------- */
.page-home .ticker-section {
  margin-top: 58px;
  padding: 46px 0 50px;
  border-top: 1px solid var(--edge);
  border-bottom: 1px solid var(--edge);
  background:
    radial-gradient(circle at 92% 0%, rgba(164, 76, 255, .16), transparent 46%),
    linear-gradient(180deg, rgba(14, 23, 48, .9), rgba(7, 10, 18, .4));
}
.page-home .ticker {
  margin-top: 26px;
  border: 1px solid var(--edge);
  border-radius: var(--radius-md);
  overflow: visible;
  background: rgba(7, 10, 18, .55);
}
.page-home .ticker-row {
  position: relative;
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) auto;
  grid-template-areas:
    "cat  match score"
    "tag  tag   tag"
    "link link  link";
  align-items: center;
  gap: 8px 12px;
  padding: 14px 16px;
  border-bottom: 1px solid rgba(42, 53, 80, .55);
  transition: background .25s var(--ease);
}
.page-home .ticker-row:last-child { border-bottom: 0; }
.page-home .ticker-row:hover,
.page-home .ticker-row:focus-within {
  background: rgba(46, 123, 255, .08);
  outline: none;
}
.page-home .ticker-cat {
  grid-area: cat;
  font-size: .8125rem;
  font-weight: 700;
  color: var(--violet);
}
.page-home .ticker-match {
  grid-area: match;
  font-size: .875rem;
  color: var(--mute);
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.page-home .ticker-score {
  grid-area: score;
  font-family: var(--font-mono);
  font-weight: 600;
  font-size: 1rem;
  color: var(--paper);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.page-home .ticker-row .tag { grid-area: tag; justify-self: start; }
.page-home .ticker-link {
  grid-area: link;
  justify-self: start;
  font-size: .8125rem;
  font-weight: 600;
  color: var(--blue);
  text-decoration: none;
  border-bottom: 1px solid rgba(46, 123, 255, .4);
  transition: color .2s var(--ease), border-color .2s var(--ease);
}
.page-home .ticker-link:hover,
.page-home .ticker-link:focus-visible {
  color: var(--mint);
  border-color: var(--mint);
}
.page-home .ticker-more {
  position: absolute;
  left: 16px;
  right: 16px;
  top: calc(100% - 6px);
  z-index: 6;
  padding: 9px 14px;
  border-radius: 12px;
  border: 1px solid var(--edge);
  background: #0E1730;
  font-size: .75rem;
  line-height: 1.5;
  color: var(--mute);
  opacity: 0;
  transform: translateY(-5px);
  pointer-events: none;
  transition: opacity .24s var(--ease), transform .24s var(--ease);
}
.page-home .ticker-row:hover .ticker-more,
.page-home .ticker-row:focus-within .ticker-more {
  opacity: 1;
  transform: translateY(0);
}

/* ---------- 赛事目录 ---------- */
.page-home .cat-figure {
  margin: 24px 0 0;
  border: 1px solid var(--edge);
  border-radius: var(--radius-md);
  overflow: hidden;
  background: linear-gradient(140deg, rgba(27, 30, 74, .7), rgba(7, 10, 18, .9));
}
.page-home .cat-figure img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  object-fit: cover;
}
.page-home .cat-figure-cap {
  padding: 10px 16px 14px;
  font-size: .75rem;
  letter-spacing: .04em;
  color: var(--mute);
  border-top: 1px solid rgba(42, 53, 80, .6);
}

.page-home .cat-wrap {
  position: relative;
  margin-top: 26px;
}
.page-home .cat-radio {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}
.page-home .cat-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.page-home .cat-tab {
  cursor: pointer;
  padding: 9px 17px;
  border-radius: var(--radius-pill);
  border: 1px solid var(--edge);
  background: rgba(14, 23, 48, .6);
  font-size: .875rem;
  font-weight: 600;
  color: var(--mute);
  user-select: none;
  transition: color .22s var(--ease), border-color .22s var(--ease), background .22s var(--ease), box-shadow .22s var(--ease);
}
.page-home .cat-tab:hover {
  color: var(--paper);
  border-color: var(--violet);
}
.page-home .cat-panels { margin-top: 18px; }
.page-home .cat-panel {
  display: none;
  grid-template-columns: 1fr;
  gap: 20px;
  padding: 24px 20px;
  border: 1px solid var(--edge);
  border-radius: var(--radius-lg);
  background: linear-gradient(160deg, var(--home-panel), rgba(7, 10, 18, .92));
}
.page-home #home-cat-1:checked ~ .cat-tabs label[for="home-cat-1"],
.page-home #home-cat-2:checked ~ .cat-tabs label[for="home-cat-2"],
.page-home #home-cat-3:checked ~ .cat-tabs label[for="home-cat-3"],
.page-home #home-cat-4:checked ~ .cat-tabs label[for="home-cat-4"],
.page-home #home-cat-5:checked ~ .cat-tabs label[for="home-cat-5"],
.page-home #home-cat-6:checked ~ .cat-tabs label[for="home-cat-6"] {
  color: #fff;
  border-color: var(--violet);
  background: linear-gradient(90deg, rgba(164, 76, 255, .9), rgba(164, 76, 255, .42));
  box-shadow: 0 0 24px -8px rgba(164, 76, 255, .95);
}
.page-home #home-cat-1:checked ~ .cat-panels .cat-panel[data-cat="1"],
.page-home #home-cat-2:checked ~ .cat-panels .cat-panel[data-cat="2"],
.page-home #home-cat-3:checked ~ .cat-panels .cat-panel[data-cat="3"],
.page-home #home-cat-4:checked ~ .cat-panels .cat-panel[data-cat="4"],
.page-home #home-cat-5:checked ~ .cat-panels .cat-panel[data-cat="5"],
.page-home #home-cat-6:checked ~ .cat-panels .cat-panel[data-cat="6"] {
  display: grid;
}
.page-home .cat-name {
  margin: 0;
  font-family: var(--font-head);
  font-size: 1.5rem;
  font-weight: 800;
  letter-spacing: -.01em;
  color: var(--paper);
}
.page-home .cat-desc {
  margin: 12px 0 0;
  font-size: .9375rem;
  line-height: 1.78;
  color: var(--mute);
  max-width: 40ch;
}
.page-home .cat-facts {
  margin: 0;
  display: grid;
  gap: 14px;
  align-content: start;
}
.page-home .cat-fact {
  padding-left: 14px;
  border-left: 2px solid rgba(46, 123, 255, .5);
}
.page-home .cat-fact dt {
  font-family: var(--font-mono);
  font-size: .6875rem;
  letter-spacing: .1em;
  color: var(--mint);
  text-transform: uppercase;
}
.page-home .cat-fact dd {
  margin: 5px 0 0;
  font-size: .875rem;
  line-height: 1.65;
  color: var(--paper);
}
.page-home .cat-footnote {
  margin: 18px 0 0;
  font-size: .875rem;
  color: var(--mute);
}
.page-home .cat-footnote a {
  color: var(--blue);
  text-decoration: none;
  border-bottom: 1px solid rgba(46, 123, 255, .45);
  transition: color .2s var(--ease), border-color .2s var(--ease);
}
.page-home .cat-footnote a:hover,
.page-home .cat-footnote a:focus-visible {
  color: var(--mint);
  border-color: var(--mint);
}

/* ---------- 路径对照 ---------- */
.page-home .path-grid {
  margin-top: 26px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}
.page-home .path-card {
  position: relative;
  padding: 22px 20px;
  border-radius: var(--radius-md);
  border: 1px solid var(--edge);
  background: rgba(14, 23, 48, .55);
}
.page-home .path-card--before {
  background: linear-gradient(158deg, rgba(14, 23, 48, .5), rgba(7, 10, 18, .7));
}
.page-home .path-card--after {
  border-color: rgba(53, 241, 161, .55);
  background: linear-gradient(158deg, rgba(53, 241, 161, .1), rgba(7, 10, 18, .8));
  box-shadow: 0 24px 60px -42px rgba(53, 241, 161, .8);
}
.page-home .path-tag {
  margin: 0;
  font-family: var(--font-mono);
  font-size: .6875rem;
  letter-spacing: .12em;
  color: var(--mute);
}
.page-home .path-tag--mint { color: var(--mint); }
.page-home .path-heading {
  margin: 10px 0 0;
  font-family: var(--font-head);
  font-size: 1.25rem;
  font-weight: 800;
  color: var(--paper);
}
.page-home .path-steps {
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 9px;
  counter-reset: pathstep;
}
.page-home .path-steps li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: .875rem;
  line-height: 1.5;
  color: var(--mute);
}
.page-home .path-card--after .path-steps li { color: var(--paper); }
.page-home .path-dot {
  flex: none;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  border: 1px solid var(--edge);
  background: transparent;
}
.page-home .path-card--after .path-dot {
  border-color: var(--mint);
  background: var(--mint);
  box-shadow: 0 0 10px -1px rgba(53, 241, 161, .9);
}
.page-home .path-note {
  margin: 16px 0 0;
  font-size: .8125rem;
  line-height: 1.7;
  color: var(--mute);
  border-top: 1px dashed rgba(42, 53, 80, .8);
  padding-top: 12px;
}
.page-home .path-figure {
  margin: 22px 0 0;
  border: 1px solid var(--edge);
  border-radius: var(--radius-md);
  overflow: hidden;
  background: #0E1730;
}
.page-home .path-figure img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  object-fit: cover;
}

/* ---------- 版本要点 ---------- */
.page-home .version-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 26px;
}
.page-home .version-list {
  margin: 22px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 16px;
}
.page-home .version-item {
  padding: 16px 18px;
  border-radius: var(--radius-md);
  border: 1px solid var(--edge);
  border-left: 3px solid var(--blue);
  background: rgba(14, 23, 48, .55);
  transition: border-color .25s var(--ease), background .25s var(--ease);
}
.page-home .version-item:hover {
  border-left-color: var(--violet);
  background: rgba(27, 30, 74, .6);
}
.page-home .version-item h3 {
  margin: 0;
  font-family: var(--font-head);
  font-size: 1rem;
  font-weight: 700;
  color: var(--paper);
}
.page-home .version-item p {
  margin: 8px 0 0;
  font-size: .875rem;
  line-height: 1.75;
  color: var(--mute);
}
.page-home .version-note {
  margin: 18px 0 0;
  font-size: .8125rem;
  line-height: 1.7;
  color: var(--mute);
}
.page-home .version-card {
  padding: 18px;
  border-radius: var(--radius-lg);
  border: 1px solid var(--edge);
  background:
    radial-gradient(circle at 84% 8%, rgba(164, 76, 255, .26), transparent 55%),
    linear-gradient(168deg, rgba(14, 23, 48, .95), rgba(7, 10, 18, .9));
  align-self: start;
}
.page-home .version-card img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  object-fit: cover;
  border-radius: var(--radius-md);
  border: 1px solid rgba(42, 53, 80, .8);
}
.page-home .version-card h3 {
  margin: 16px 0 0;
  font-family: var(--font-head);
  font-size: 1.125rem;
  font-weight: 800;
  color: var(--paper);
}
.page-home .version-card p {
  margin: 10px 0 0;
  font-size: .875rem;
  line-height: 1.75;
  color: var(--mute);
}
.page-home .version-card-link {
  display: inline-block;
  margin-top: 14px;
  font-size: .875rem;
  font-weight: 600;
  color: var(--violet);
  text-decoration: none;
  border-bottom: 1px solid rgba(164, 76, 255, .5);
  transition: color .2s var(--ease), border-color .2s var(--ease);
}
.page-home .version-card-link:hover,
.page-home .version-card-link:focus-visible {
  color: var(--mint);
  border-color: var(--mint);
}

/* ---------- 首次使用流程 ---------- */
.page-home .flow-section {
  margin-top: 58px;
  padding: 48px 0 52px;
  border-top: 1px solid var(--edge);
  border-bottom: 1px solid var(--edge);
  background:
    radial-gradient(circle at 6% 4%, rgba(46, 123, 255, .18), transparent 46%),
    linear-gradient(180deg, rgba(14, 23, 48, .7), rgba(7, 10, 18, .35));
}
.page-home .flow-list {
  margin: 28px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  counter-reset: flow;
}
.page-home .flow-step {
  position: relative;
  padding: 20px 18px 18px;
  border-radius: var(--radius-md);
  border: 1px solid var(--edge);
  background: rgba(7, 10, 18, .62);
  transition: border-color .25s var(--ease), transform .25s var(--ease);
}
.page-home .flow-step:hover {
  border-color: rgba(46, 123, 255, .7);
  transform: translateY(-2px);
}
.page-home .flow-num {
  display: block;
  font-family: var(--font-mono);
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 1;
  color: var(--amber);
  letter-spacing: -.02em;
}
.page-home .flow-step h3 {
  margin: 12px 0 0;
  font-family: var(--font-head);
  font-size: 1rem;
  font-weight: 700;
  color: var(--paper);
}
.page-home .flow-step p {
  margin: 8px 0 0;
  font-size: .875rem;
  line-height: 1.75;
  color: var(--mute);
}
.page-home .flow-note {
  margin: 20px 0 0;
  font-size: .875rem;
  line-height: 1.7;
  color: var(--mute);
}
.page-home .flow-note a {
  color: var(--blue);
  text-decoration: none;
  border-bottom: 1px solid rgba(46, 123, 255, .45);
  transition: color .2s var(--ease), border-color .2s var(--ease);
}
.page-home .flow-note a:hover,
.page-home .flow-note a:focus-visible {
  color: var(--mint);
  border-color: var(--mint);
}

/* ---------- 站内索引 ---------- */
.page-home .index-grid {
  margin-top: 26px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}
.page-home .index-card {
  position: relative;
  display: block;
  padding: 20px 18px 46px;
  border-radius: var(--radius-md);
  border: 1px solid var(--edge);
  background: linear-gradient(160deg, rgba(14, 23, 48, .85), rgba(7, 10, 18, .82));
  text-decoration: none;
  overflow: hidden;
  transition: border-color .28s var(--ease), box-shadow .28s var(--ease), transform .28s var(--ease);
}
.page-home .index-card::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, var(--blue), var(--violet));
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform .3s var(--ease);
}
.page-home .index-card:hover,
.page-home .index-card:focus-visible {
  border-color: var(--blue);
  box-shadow: 0 26px 60px -40px rgba(46, 123, 255, .9);
  transform: translateY(-3px);
  outline: none;
}
.page-home .index-card:hover::before,
.page-home .index-card:focus-visible::before { transform: scaleX(1); }
.page-home .index-num {
  font-family: var(--font-mono);
  font-size: .75rem;
  letter-spacing: .12em;
  color: var(--violet);
}
.page-home .index-card h3 {
  margin: 10px 0 0;
  font-family: var(--font-head);
  font-size: 1.0625rem;
  font-weight: 800;
  color: var(--paper);
}
.page-home .index-card p {
  margin: 8px 0 0;
  font-size: .875rem;
  line-height: 1.7;
  color: var(--mute);
}
.page-home .index-arrow {
  position: absolute;
  right: 18px;
  bottom: 16px;
  font-size: 1rem;
  color: var(--blue);
  transition: transform .28s var(--ease), color .28s var(--ease);
}
.page-home .index-card:hover .index-arrow,
.page-home .index-card:focus-visible .index-arrow {
  transform: translateX(5px);
  color: var(--mint);
}

/* ---------- 平板 ---------- */
@media (min-width: 640px) {
  .page-home .hero-grid { padding: 54px 30px 42px; }
  .page-home .ticker-row {
    grid-template-columns: 60px minmax(0, 1fr) 92px 92px 104px;
    grid-template-areas: "cat match score tag link";
    gap: 12px;
    padding: 15px 20px;
  }
  .page-home .ticker-row .tag { justify-self: center; }
  .page-home .ticker-link { justify-self: end; }
  .page-home .ticker-more { left: 20px; right: 20px; }
  .page-home .flow-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .page-home .index-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---------- 桌面 ---------- */
@media (min-width: 960px) {
  .page-home { padding-bottom: 96px; }
  .page-home .hero-grid {
    grid-template-columns: minmax(0, 1.12fr) minmax(320px, .88fr);
    align-items: end;
    gap: 44px;
    padding: 64px 44px 48px;
  }
  .page-home .hero-lede { font-size: 1.0625rem; }
  .page-home .section { padding-top: 76px; }
  .page-home .ticker-section { margin-top: 76px; padding: 56px 0 62px; }
  .page-home .flow-section { margin-top: 76px; padding: 58px 0 64px; }

  .page-home .cat-panel {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
    gap: 32px;
    padding: 34px 34px 30px;
  }
  .page-home .cat-desc { font-size: 1rem; }

  .page-home .path-grid {
    grid-template-columns: 1fr 1fr;
    gap: 0;
    position: relative;
  }
  .page-home .path-grid::before {
    content: "";
    position: absolute;
    top: -10px;
    bottom: -10px;
    left: 50%;
    width: 2px;
    background: linear-gradient(180deg, transparent, var(--edge) 18%, var(--violet) 50%, var(--edge) 82%, transparent);
    transform: translateX(-50%) skewX(-6deg);
    z-index: 2;
  }
  .page-home .path-card {
    border-radius: 0;
    padding: 30px 34px;
  }
  .page-home .path-card--before {
    border-radius: var(--radius-md) 0 0 var(--radius-md);
    border-right: 0;
  }
  .page-home .path-card--after {
    border-radius: 0 var(--radius-md) var(--radius-md) 0;
    border-left: 0;
  }

  .page-home .version-grid {
    grid-template-columns: minmax(0, 1.15fr) minmax(300px, .85fr);
    gap: 40px;
    align-items: start;
  }
  .page-home .flow-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .page-home .index-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* ---------- 触屏与动效降级 ---------- */
@media (hover: none) {
  .page-home .ticker-more { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .page-home .live-dot { animation: none; }
  .page-home .hero-cta::after { transition: none; }
  .page-home .index-card,
  .page-home .flow-step,
  .page-home .ticker-more { transition: none; }
}
<<<END>>>