.page-products{
  --pp-line:rgba(46,92,78,.72);
  --pp-line-soft:rgba(46,92,78,.42);
  --pp-soft:rgba(243,239,228,.76);
  display:block;
  color:var(--eb-paper);
  font-family:var(--font-sans);
}

/* 首屏 */
.page-products .page-products__mast{
  position:relative;
  padding:clamp(24px,5vw,64px) 0 clamp(24px,4vw,52px);
  background:
    radial-gradient(90% 70% at 88% 0%, rgba(56,242,207,.12), transparent 62%),
    linear-gradient(180deg, var(--eb-deck) 0%, var(--eb-deep) 78%);
  border-bottom:1px solid var(--pp-line);
  overflow:hidden;
}
.page-products .page-products__mast::before{
  content:"";
  position:absolute;left:0;top:0;width:3px;height:100%;
  background:linear-gradient(180deg, var(--eb-neon), rgba(56,242,207,0));
  opacity:.85;
}
.page-products .stand-crumbs{margin-bottom:clamp(16px,3vw,26px);}
.page-products .page-products__h1{
  margin:0 0 16px;
  font-family:var(--font-sans);
  font-weight:900;
  font-size:clamp(26px,5.2vw,50px);
  line-height:1.18;
  letter-spacing:-.01em;
  color:var(--eb-paper);
  max-width:22ch;
}
.page-products .page-products__lede{
  margin:0 0 clamp(20px,3vw,30px);
  max-width:64ch;
  font-size:clamp(14px,1.7vw,16px);
  line-height:1.8;
  color:var(--pp-soft);
}
.page-products .page-products__facts{
  list-style:none;
  margin:0;padding:0;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1px;
  background:var(--pp-line);
  border:1px solid var(--pp-line);
  border-radius:var(--radius);
  overflow:hidden;
}
.page-products .page-products__facts li{
  display:flex;
  flex-direction:column;
  gap:5px;
  padding:14px;
  background:var(--eb-deck);
}
.page-products .page-products__factnum{
  font-family:var(--font-mono);
  font-size:clamp(22px,3.6vw,32px);
  line-height:1;
  color:var(--eb-neon);
}
.page-products .page-products__factlabel{
  font-size:12.5px;
  line-height:1.45;
  color:var(--eb-rock);
}
@media (min-width:720px){
  .page-products .page-products__facts{grid-template-columns:repeat(4,minmax(0,1fr));}
}

/* 布局骨架 */
.page-products .page-products__layout{
  padding-top:clamp(24px,4vw,48px);
  padding-bottom:clamp(40px,7vw,88px);
}
.page-products .page-products__rail{margin-bottom:clamp(20px,4vw,32px);}
.page-products .page-products__railtitle{
  margin:0 0 10px;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--eb-rock);
}
.page-products .page-products__railist{
  list-style:none;
  margin:0;
  padding:0 0 6px;
  display:flex;
  gap:6px;
  overflow-x:auto;
  scrollbar-width:thin;
}
.page-products .page-products__railist li{flex:0 0 auto;}
.page-products .page-products__railist a{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border:1px solid var(--pp-line);
  border-radius:var(--radius);
  background:rgba(12,42,34,.6);
  color:var(--pp-soft);
  font-size:13px;
  text-decoration:none;
  white-space:nowrap;
  transition:color .18s ease,border-color .18s ease,background .18s ease;
}
.page-products .page-products__railist a:hover,
.page-products .page-products__railist a:focus-visible{
  color:var(--eb-neon);
  border-color:var(--eb-line-strong);
  background:rgba(28,68,56,.78);
}
.page-products .page-products__railnum{
  font-family:var(--font-mono);
  font-size:11px;
  color:var(--eb-neon);
}
.page-products .page-products__railcta{
  margin-top:14px;
  width:100%;
  justify-content:center;
}
@media (min-width:1024px){
  .page-products .page-products__layout{
    display:grid;
    grid-template-columns:minmax(0,236px) minmax(0,1fr);
    gap:clamp(28px,4vw,58px);
    align-items:start;
  }
  .page-products .page-products__rail{
    position:sticky;
    top:calc(var(--head-h) + 24px);
    margin-bottom:0;
  }
  .page-products .page-products__railist{
    flex-direction:column;
    overflow:visible;
    gap:2px;
    padding-bottom:0;
  }
  .page-products .page-products__railist li{flex:none;}
  .page-products .page-products__railist a{
    justify-content:flex-start;
    white-space:normal;
    border:0;
    border-left:1px solid var(--pp-line);
    border-radius:0;
    padding:9px 12px;
    background:none;
  }
  .page-products .page-products__railist a:hover,
  .page-products .page-products__railist a:focus-visible{
    border-left-color:var(--eb-neon);
    background:rgba(28,68,56,.6);
  }
}

/* 面板与通用文字 */
.page-products .page-products__panel{
  border-top:1px solid var(--pp-line);
  padding-top:clamp(24px,3.6vw,40px);
  margin-top:clamp(24px,3.6vw,40px);
}
.page-products .page-products__panel:first-child{
  border-top:0;
  padding-top:0;
  margin-top:0;
}
.page-products .page-products__p{
  max-width:66ch;
  margin:0 0 18px;
  font-size:clamp(14px,1.6vw,15.5px);
  line-height:1.8;
  color:var(--pp-soft);
}
.page-products .page-products__p--tight{margin-bottom:10px;}
.page-products .page-products__inline{
  color:var(--eb-mint);
  text-decoration:none;
  border-bottom:1px solid var(--eb-line-strong);
  transition:color .18s ease,border-color .18s ease;
}
.page-products .page-products__inline:hover,
.page-products .page-products__inline:focus-visible{
  color:var(--eb-neon);
  border-bottom-color:var(--eb-neon);
}
.page-products .page-products__figure{margin:20px 0 0;}
.page-products .page-products__figure--narrow{max-width:420px;}

/* 功能索引表 */
.page-products .page-products__tablewrap{
  margin-bottom:4px;
  overflow-x:auto;
  border:1px solid var(--pp-line);
  border-radius:var(--radius);
  background:linear-gradient(180deg, rgba(12,42,34,.92), rgba(6,28,23,.92));
}
.page-products .page-products__table{
  width:100%;
  min-width:560px;
  border-collapse:collapse;
  font-size:14px;
}
.page-products .page-products__table th{
  padding:12px 16px;
  text-align:left;
  font-family:var(--font-mono);
  font-size:11px;
  font-weight:500;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--eb-rock);
  border-bottom:1px solid var(--pp-line);
  white-space:nowrap;
}
.page-products .page-products__table td{
  padding:16px;
  vertical-align:top;
  line-height:1.65;
  color:var(--pp-soft);
  border-bottom:1px solid var(--pp-line-soft);
}
.page-products .page-products__table tbody tr:last-child td{border-bottom:0;}
.page-products .page-products__table tbody tr{transition:background .18s ease;}
.page-products .page-products__table tbody tr:hover{background:rgba(28,68,56,.45);}
.page-products .page-products__tnum{
  font-family:var(--font-mono);
  font-size:13px;
  color:var(--eb-neon);
  white-space:nowrap;
}
.page-products .page-products__tname{
  color:var(--eb-paper);
  font-weight:600;
}
.page-products .page-products__tlink{
  color:var(--eb-mint);
  text-decoration:none;
  border-bottom:1px solid var(--eb-line-strong);
  padding-bottom:1px;
  white-space:nowrap;
  transition:color .18s ease,border-color .18s ease;
}
.page-products .page-products__tlink:hover,
.page-products .page-products__tlink:focus-visible{
  color:var(--eb-neon);
  border-bottom-color:var(--eb-neon);
}

/* 媒体容器 */
.page-products .stand-media{
  margin:0;
  border:1px solid var(--pp-line);
  border-radius:var(--radius);
  overflow:hidden;
  background:var(--eb-deck);
}
.page-products .stand-media__img{
  display:block;
  width:100%;
  height:auto;
  object-fit:cover;
}
.page-products .stand-media__caption{
  padding:10px 14px;
  font-family:var(--font-mono);
  font-size:12px;
  line-height:1.6;
  letter-spacing:.02em;
  color:var(--eb-rock);
  border-top:1px solid var(--pp-line-soft);
}

/* 球队库：三种定位方式 */
.page-products .page-products__methods{
  list-style:none;
  margin:0 0 20px;
  padding:0;
  display:grid;
  gap:1px;
  background:var(--pp-line);
  border:1px solid var(--pp-line);
  border-radius:var(--radius);
  overflow:hidden;
}
.page-products .page-products__method{
  padding:16px;
  background:var(--eb-deck);
}
.page-products .page-products__methodtag{
  display:inline-block;
  margin-bottom:10px;
  padding:2px 8px;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.12em;
  color:var(--eb-neon);
  border:1px solid var(--eb-line-strong);
  border-radius:2px;
}
.page-products .page-products__methodtitle{
  margin:0 0 6px;
  font-size:15px;
  line-height:1.4;
  font-weight:700;
  color:var(--eb-paper);
}
.page-products .page-products__methodtext{
  margin:0;
  font-size:13.5px;
  line-height:1.7;
  color:var(--pp-soft);
}
@media (min-width:760px){
  .page-products .page-products__methods{grid-template-columns:repeat(3,minmax(0,1fr));}
}

/* 联赛轨道 */
.page-products .page-products__trackblock{
  padding:16px;
  border:1px solid var(--pp-line);
  border-radius:var(--radius);
  background:
    radial-gradient(120% 120% at 8% 0%, rgba(56,242,207,.09), transparent 58%),
    var(--eb-deck);
}
.page-products .page-products__tracks{
  position:relative;
  height:104px;
  margin-bottom:14px;
  border-radius:2px;
  overflow:hidden;
  background:repeating-linear-gradient(to bottom, rgba(46,92,78,.55) 0 1px, transparent 1px 13px);
}
.page-products .page-products__tracks::before{
  content:"";
  position:absolute;
  left:0;right:0;top:52px;
  height:2px;
  background:linear-gradient(90deg, transparent, var(--eb-neon) 14%, var(--eb-neon) 86%, transparent);
  box-shadow:0 0 14px rgba(56,242,207,.5);
}
.page-products .page-products__tracks::after{
  content:"";
  position:absolute;
  left:10%;top:36px;
  width:36%;height:32px;
  border:1px solid rgba(56,242,207,.45);
  border-radius:2px;
  background:rgba(56,242,207,.1);
}
.page-products .page-products__tracktitle{
  margin:0 0 8px;
  font-size:15px;
  line-height:1.4;
  color:var(--eb-paper);
}
.page-products .page-products__chips{
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:12px 0 0;
  padding:0;
}

/* 战报结构演示 */
.page-products .page-products__board{
  margin-bottom:20px;
  border:1px solid var(--pp-line);
  border-radius:var(--radius);
  overflow:hidden;
  background:var(--eb-deck);
}
.page-products .page-products__boardrow{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:10px;
  padding:14px 16px;
  border-bottom:1px solid var(--pp-line-soft);
}
.page-products .page-products__boardrow:last-child{border-bottom:0;}
.page-products .page-products__boardrow--score{background:rgba(56,242,207,.07);}
.page-products .page-products__boardslot{
  min-width:56px;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--eb-rock);
}
.page-products .page-products__scoreline{
  display:inline-flex;
  align-items:center;
  gap:10px;
}
.page-products .page-products__scorebox{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:64px;
  padding:6px 12px;
  font-family:var(--font-mono);
  font-size:14px;
  color:var(--eb-mint);
  border:1px solid rgba(56,242,207,.42);
  border-radius:2px;
}
.page-products .page-products__scoresep{
  font-family:var(--font-mono);
  font-size:18px;
  color:var(--eb-neon);
}
.page-products .page-products__eventline{
  flex:1 1 140px;
  min-width:120px;
  height:8px;
  border-radius:2px;
  background:linear-gradient(90deg, rgba(135,154,146,.62), rgba(135,154,146,.08));
}
.page-products .page-products__bullets{
  list-style:none;
  margin:0 0 20px;
  padding:0;
  display:grid;
  gap:10px;
}
.page-products .page-products__bullets li{
  position:relative;
  padding-left:18px;
  font-size:14px;
  line-height:1.7;
  color:var(--pp-soft);
}
.page-products .page-products__bullets li::before{
  content:"";
  position:absolute;
  left:0;top:.62em;
  width:8px;height:8px;
  border:1px solid var(--eb-neon);
  border-radius:1px;
  background:rgba(56,242,207,.18);
}

/* 焦点场次 */
.page-products .page-products__focuslist{
  list-style:none;
  margin:0 0 16px;
  padding:0;
  display:grid;
  gap:12px;
}
.page-products .page-products__focusitem{
  padding:16px;
  border:1px solid var(--pp-line);
  border-left:2px solid var(--eb-clay);
  border-radius:var(--radius);
  background:linear-gradient(135deg, rgba(28,68,56,.85), rgba(12,42,34,.92));
  transition:transform .18s ease,border-left-color .18s ease;
}
.page-products .page-products__focusitem:hover{
  transform:translateY(-2px);
  border-left-color:var(--eb-neon);
}
.page-products .page-products__focushead{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px;
}
.page-products .page-products__focusstate{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.1em;
  color:var(--eb-neon);
  border:1px solid var(--eb-line-strong);
  border-radius:999px;
  padding:3px 10px;
  white-space:nowrap;
}
.page-products .page-products__focustitle{
  margin:0 0 6px;
  font-size:16px;
  line-height:1.4;
  color:var(--eb-paper);
}
.page-products .page-products__focusdesc{
  margin:0;
  font-size:13.5px;
  line-height:1.65;
  color:var(--pp-soft);
}
@media (min-width:760px){
  .page-products .page-products__focuslist{grid-template-columns:repeat(3,minmax(0,1fr));}
}

/* 四步通道 */
.page-products .page-products__steps{
  list-style:none;
  position:relative;
  margin:0 0 20px;
  padding:0;
  display:grid;
  gap:12px;
}
.page-products .page-products__step{
  padding:16px;
  border:1px solid var(--pp-line);
  border-radius:var(--radius);
  background:var(--eb-deck);
}
.page-products .page-products__stepnum{
  display:block;
  margin-bottom:8px;
  font-family:var(--font-mono);
  font-size:clamp(28px,6vw,42px);
  line-height:1;
  color:transparent;
  -webkit-text-stroke:1px rgba(56,242,207,.65);
}
.page-products .page-products__steptitle{
  margin:0 0 6px;
  font-size:15px;
  line-height:1.4;
  color:var(--eb-paper);
}
.page-products .page-products__steptext{
  margin:0;
  font-size:13.5px;
  line-height:1.7;
  color:var(--pp-soft);
}
@media (min-width:900px){
  .page-products .page-products__steps{
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:0;
  }
  .page-products .page-products__steps::before{
    content:"";
    position:absolute;
    left:0;right:0;top:0;
    height:2px;
    background:linear-gradient(90deg, var(--eb-neon), rgba(56,242,207,.06));
  }
  .page-products .page-products__step{
    border-right:0;
    border-radius:0;
  }
  .page-products .page-products__step:first-child{
    border-radius:var(--radius) 0 0 var(--radius);
  }
  .page-products .page-products__step:last-child{
    border-right:1px solid var(--pp-line);
    border-radius:0 var(--radius) var(--radius) 0;
  }
}

/* 复制入口 */
.page-products .page-products__copybar{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:18px;
  padding:14px 16px;
  border:1px solid var(--eb-line-strong);
  border-radius:var(--radius);
  background:rgba(56,242,207,.07);
}
.page-products .page-products__copylabel{
  margin:0;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--eb-rock);
}
.page-products .page-products__domain{
  margin:4px 0 0;
  font-family:var(--font-mono);
  font-size:15px;
  color:var(--eb-mint);
  word-break:break-all;
}
.page-products .page-products__copybtn{flex:0 0 auto;}

/* 场景对照 */
.page-products .page-products__matrix{
  list-style:none;
  margin:0 0 24px;
  padding:0;
  border-top:1px solid var(--pp-line);
}
.page-products .page-products__matrixrow{
  display:grid;
  gap:5px;
  padding:14px 0;
  border-bottom:1px solid var(--pp-line-soft);
}
.page-products .page-products__matrixrow--head{display:none;}
.page-products .page-products__matrixwho{
  font-size:14px;
  line-height:1.5;
  font-weight:600;
  color:var(--eb-paper);
}
.page-products .page-products__matrixhow{
  font-size:13.5px;
  line-height:1.7;
  color:var(--pp-soft);
}
.page-products .page-products__matrixwhat{
  font-family:var(--font-mono);
  font-size:12px;
  line-height:1.7;
  color:var(--eb-neon);
}
@media (min-width:760px){
  .page-products .page-products__matrixrow{
    grid-template-columns:minmax(0,.9fr) minmax(0,1.5fr) minmax(0,1fr);
    gap:18px;
    align-items:start;
  }
  .page-products .page-products__matrixrow--head{
    display:grid;
    padding:10px 0;
  }
  .page-products .page-products__matrixrow--head span{
    font-family:var(--font-mono);
    font-size:11px;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:var(--eb-rock);
  }
}

/* 支持区 */
.page-products .page-products__support{
  display:grid;
  gap:18px;
  padding:18px;
  border:1px solid var(--pp-line);
  border-left:2px solid var(--eb-neon);
  border-radius:var(--radius);
  background:linear-gradient(140deg, rgba(28,68,56,.72), rgba(12,42,34,.9));
}
.page-products .page-products__supporth{
  margin:0 0 8px;
  font-size:16px;
  line-height:1.4;
  color:var(--eb-paper);
}
.page-products .page-products__supportlinks{
  display:flex;
  flex-wrap:wrap;
  gap:8px 16px;
  margin:12px 0 0;
  font-size:13.5px;
}
.page-products .page-products__supportfig{margin:0;}
@media (min-width:760px){
  .page-products .page-products__support{
    grid-template-columns:minmax(0,1fr) 250px;
    align-items:start;
    padding:22px;
  }
}
<<<END>>>