.page-news{
  --pn-num-w:36px;
  --pn-gap:14px;
  background:var(--paper);
  color:var(--graphite);
  overflow-x:clip;
}

.page-news .num{
  font-family:var(--font-mono);
  font-variant-numeric:tabular-nums;
  letter-spacing:.01em;
}

/* ---------- 页头 ---------- */
.page-news .pn-mast{
  padding:18px 0 0;
  background:linear-gradient(180deg,var(--pale) 0%,var(--paper) 100%);
}
.page-news .pn-mast__band{
  display:block;
  height:8px;
  margin-top:30px;
  background:linear-gradient(90deg,
    var(--ice) 0 32%,
    var(--deep) 32% 52%,
    var(--teal) 52% 70%,
    var(--indigo) 70% 86%,
    var(--wine) 86% 100%);
}
.page-news .pn-mast__grid{
  display:grid;
  gap:22px;
  margin-top:20px;
}
@media (min-width:900px){
  .page-news .pn-mast__grid{
    grid-template-columns:minmax(0,7fr) minmax(0,5fr);
    gap:44px;
    align-items:end;
  }
}
.page-news .pn-mast__kicker{
  margin:0;
  font-size:12px;
  font-weight:600;
  color:var(--ice);
  letter-spacing:.04em;
}
.page-news .pn-mast__kicker::before{
  content:"";
  display:inline-block;
  width:6px;
  height:6px;
  margin-right:8px;
  border-radius:50%;
  background:var(--signal);
  vertical-align:middle;
}
.page-news .pn-mast__title{
  margin:10px 0 14px;
  max-width:16em;
  font-size:clamp(28px,7.4vw,56px);
  font-weight:900;
  line-height:1.1;
  letter-spacing:-0.02em;
  color:var(--deep);
}
.page-news .pn-mast__sub{
  margin:0;
  max-width:36em;
  font-size:15px;
  line-height:1.8;
  color:var(--graphite);
}
@media (min-width:760px){
  .page-news .pn-mast__sub{font-size:16px;}
}

.page-news .pn-mast__facts{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(118px,1fr));
  gap:1px;
  margin:0;
  background:var(--line-mid);
  border:1px solid var(--line-mid);
}
.page-news .pn-fact{
  background:var(--paper);
  padding:14px 12px;
}
.page-news .pn-fact dt{
  margin:0;
  font-size:11px;
  font-weight:600;
  letter-spacing:.04em;
  color:var(--graphite);
  opacity:.82;
}
.page-news .pn-fact dd{
  margin:6px 0 0;
  font-size:15px;
  font-weight:700;
  color:var(--deep);
}

/* ---------- 头图 ---------- */
.page-news .pn-hero{
  position:relative;
  margin:30px 0 0;
  overflow:hidden;
  background:linear-gradient(135deg,var(--deep),var(--ice));
  clip-path:polygon(0 0,100% 0,100% calc(100% - 20px),calc(100% - 20px) 100%,0 100%);
}
.page-news .pn-hero img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:16/9;
  object-fit:cover;
}
@media (min-width:900px){
  .page-news .pn-hero img{aspect-ratio:1400/600;}
}

/* ---------- 主体非对称长卷 ---------- */
.page-news .pn-stream{
  display:grid;
  gap:0;
  margin:38px 0 0;
}
@media (min-width:1000px){
  .page-news .pn-stream{
    grid-template-columns:200px minmax(0,1fr);
    gap:46px;
    align-items:start;
  }
}

/* 左侧分类索引 */
.page-news .pn-rail{
  position:relative;
  padding:0 0 6px;
}
@media (min-width:1000px){
  .page-news .pn-rail{
    position:sticky;
    top:88px;
    align-self:start;
    padding:2px 0 2px 14px;
    border-left:2px solid var(--ice);
  }
}
.page-news .pn-rail__title{
  margin:0;
  font-size:11px;
  font-weight:700;
  letter-spacing:.08em;
  color:var(--graphite);
  opacity:.72;
}
.page-news .pn-rail__list{
  list-style:none;
  margin:12px 0 0;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
@media (min-width:1000px){
  .page-news .pn-rail__list{
    flex-direction:column;
    flex-wrap:nowrap;
    gap:2px;
  }
}
.page-news .pn-rail__link{
  display:block;
  padding:6px 12px;
  font-size:13px;
  font-weight:600;
  color:var(--deep);
  text-decoration:none;
  border:1px solid var(--line);
  border-radius:999px;
  transition:background var(--dur) var(--ease),border-color var(--dur) var(--ease),color var(--dur) var(--ease);
}
.page-news .pn-rail__link:hover{
  background:var(--pale);
  border-color:var(--ice);
}
.page-news .pn-rail__link:focus-visible{
  outline:2px solid var(--signal);
  outline-offset:1px;
}
.page-news .pn-rail__link.is-active{
  background:var(--deep);
  border-color:var(--deep);
  color:var(--pale);
}
@media (min-width:1000px){
  .page-news .pn-rail__link{
    padding:6px 10px;
    border-color:transparent;
    border-left:3px solid transparent;
    border-radius:0;
  }
  .page-news .pn-rail__link:hover{
    background:transparent;
    border-left-color:var(--ice);
  }
  .page-news .pn-rail__link.is-active{
    background:transparent;
    border-left-color:var(--signal);
    color:var(--deep);
  }
}

/* ---------- 分组 ---------- */
.page-news .pn-group{
  padding:34px 0 0;
}
.page-news .pn-group__head{
  display:flex;
  align-items:center;
  gap:10px;
  padding-bottom:12px;
  border-bottom:1px solid var(--line-mid);
}
.page-news .pn-group__mark{
  display:block;
  width:6px;
  height:20px;
  flex:none;
  background:var(--ice);
  transform:skewX(-8deg);
}
.page-news .pn-group--version .pn-group__mark{background:var(--indigo);}
.page-news .pn-group--venue .pn-group__mark{background:var(--teal);}
.page-news .pn-group--device .pn-group__mark{background:var(--signal);}
.page-news .pn-group--feature .pn-group__mark{background:var(--wine);}
.page-news .pn-group__title{
  margin:0;
  flex:1;
  font-size:19px;
  font-weight:800;
  letter-spacing:-0.01em;
  color:var(--deep);
}
.page-news .pn-group__count{
  font-size:12px;
  color:var(--graphite);
  opacity:.7;
}

/* ---------- 条目流 ---------- */
.page-news .pn-list{
  list-style:none;
  margin:0;
  padding:0;
  position:relative;
}
.page-news .pn-list::before{
  content:"";
  position:absolute;
  left:calc(var(--pn-num-w) / 2 - 0.5px);
  top:0;
  bottom:0;
  width:1px;
  background:var(--line-mid);
}
.page-news .pn-list__item{
  position:relative;
}

.page-news .pn-item__sum{
  list-style:none;
  display:grid;
  grid-template-columns:var(--pn-num-w) minmax(0,1fr) 24px;
  grid-template-areas:
    "no meta toggle"
    "no title toggle"
    "no brief toggle";
  column-gap:var(--pn-gap);
  align-items:start;
  cursor:pointer;
  padding:0;
  border-bottom:1px solid var(--line);
  transition:border-color var(--dur) var(--ease);
}
.page-news .pn-item__sum::-webkit-details-marker{display:none;}
.page-news .pn-item__sum::marker{content:"";}
.page-news .pn-item[open] .pn-item__sum{border-bottom-color:transparent;}
.page-news .pn-item__sum:focus-visible{
  outline:2px solid var(--signal);
  outline-offset:-2px;
}

.page-news .pn-item__no{
  grid-area:no;
  display:flex;
  align-items:center;
  justify-content:center;
  width:26px;
  height:26px;
  margin:16px auto 0;
  position:relative;
  z-index:1;
  background:var(--paper);
  border:1px solid var(--line-mid);
  color:var(--ice);
  font-family:var(--font-mono);
  font-size:11px;
  font-weight:700;
  font-variant-numeric:tabular-nums;
  transition:border-color var(--dur) var(--ease);
}
.page-news .pn-item__sum:hover .pn-item__no{border-color:var(--ice);}

.page-news .pn-item__meta{
  grid-area:meta;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  padding-top:18px;
}
.page-news .pn-item__tag{
  display:inline-block;
  padding:2px 8px;
  font-size:11px;
  font-weight:600;
  line-height:1.6;
  white-space:nowrap;
  border-left:3px solid var(--ice);
  background:var(--pale);
  color:var(--deep);
}
.page-news .pn-item__tag--schedule{border-left-color:var(--ice);background:var(--pale);color:var(--deep);}
.page-news .pn-item__tag--version{border-left-color:var(--indigo);background:rgba(59,58,107,.09);color:var(--indigo);}
.page-news .pn-item__tag--venue{border-left-color:var(--teal);background:rgba(15,90,85,.09);color:var(--teal);}
.page-news .pn-item__tag--device{border-left-color:var(--signal);background:rgba(255,106,43,.1);color:#A8451A;}
.page-news .pn-item__tag--feature{border-left-color:var(--wine);background:rgba(122,46,63,.09);color:var(--wine);}

.page-news .pn-item__time{
  font-size:12px;
  color:var(--graphite);
  opacity:.78;
  font-variant-numeric:tabular-nums;
}

.page-news .pn-item__title{
  grid-area:title;
  margin:8px 0 0;
  font-size:17px;
  font-weight:700;
  line-height:1.5;
  letter-spacing:-0.005em;
  color:var(--ink);
  transition:color var(--dur) var(--ease);
}
.page-news .pn-item__sum:hover .pn-item__title{color:var(--ice);}
@media (min-width:760px){
  .page-news .pn-item__title{font-size:18px;}
}

.page-news .pn-item__brief{
  grid-area:brief;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  margin-top:6px;
  font-size:14px;
  line-height:1.7;
  color:var(--graphite);
}
.page-news .pn-item[open] .pn-item__brief{
  -webkit-line-clamp:unset;
  overflow:visible;
}

.page-news .pn-item__toggle{
  grid-area:toggle;
  display:flex;
  align-items:center;
  justify-content:center;
  width:24px;
  height:24px;
  margin-top:15px;
  border:1px solid var(--line-mid);
  color:var(--deep);
  font-size:15px;
  line-height:1;
  transition:transform var(--dur) var(--ease),background var(--dur) var(--ease),border-color var(--dur) var(--ease),color var(--dur) var(--ease);
}
.page-news .pn-item__sum:hover .pn-item__toggle{border-color:var(--ice);}
.page-news .pn-item[open] .pn-item__toggle{
  transform:rotate(45deg);
  background:var(--deep);
  border-color:var(--deep);
  color:var(--pale);
}

.page-news .pn-item__more{
  padding:2px 0 22px calc(var(--pn-num-w) + var(--pn-gap));
  border-bottom:1px solid var(--line);
}
.page-news .pn-item__more ul{
  list-style:none;
  margin:0;
  padding:0;
}
.page-news .pn-item__more li{
  position:relative;
  padding-left:16px;
  margin-top:8px;
  font-size:14px;
  line-height:1.75;
  color:var(--graphite);
}
.page-news .pn-item__more li::before{
  content:"";
  position:absolute;
  left:0;
  top:.72em;
  width:7px;
  height:1px;
  background:var(--ice);
}

.page-news .pn-item__figure{
  margin:16px 0 0;
  max-width:400px;
}
.page-news .pn-item__figure img{
  display:block;
  width:100%;
  height:auto;
  border-left:3px solid var(--ice);
  background:linear-gradient(135deg,var(--pale),var(--ice));
}
.page-news .pn-item__figure figcaption{
  margin-top:8px;
  font-size:12px;
  line-height:1.6;
  color:var(--graphite);
  opacity:.8;
}

/* ---------- 中段版本迭代说明 ---------- */
.page-news .pn-feature{
  margin:40px 0 0;
  padding:24px 20px;
  background:var(--paper);
  border:1px solid var(--line);
  border-top:6px solid var(--indigo);
}
.page-news .pn-feature__kicker{
  margin:0;
  font-size:11px;
  font-weight:700;
  letter-spacing:.08em;
  color:var(--indigo);
}
.page-news .pn-feature__title{
  margin:8px 0 12px;
  font-size:22px;
  font-weight:800;
  line-height:1.36;
  letter-spacing:-0.012em;
  color:var(--deep);
}
@media (min-width:860px){
  .page-news .pn-feature__title{font-size:26px;}
}
.page-news .pn-feature__grid{
  display:grid;
  gap:24px;
  margin-top:4px;
}
@media (min-width:860px){
  .page-news .pn-feature__grid{
    grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);
    gap:32px;
    align-items:start;
  }
}
.page-news .pn-feature__text p{
  margin:0 0 14px;
  font-size:15px;
  line-height:1.8;
  color:var(--graphite);
}
.page-news .pn-feature__list{
  list-style:none;
  margin:0 0 20px;
  padding:0;
}
.page-news .pn-feature__list li{
  position:relative;
  padding-left:18px;
  margin-top:9px;
  font-size:14px;
  line-height:1.72;
  color:var(--graphite);
}
.page-news .pn-feature__list li::before{
  content:"";
  position:absolute;
  left:0;
  top:.22em;
  width:4px;
  height:12px;
  background:var(--indigo);
  transform:skewX(-8deg);
}
.page-news .pn-feature__fig{
  margin:0;
  overflow:hidden;
  background:linear-gradient(135deg,var(--pale),var(--ice));
}
.page-news .pn-feature__fig img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:4/3;
  object-fit:cover;
  border-bottom:3px solid var(--indigo);
}

/* ---------- 通用小标题 ---------- */
.page-news .pn-sec-title{
  margin:0;
  font-size:23px;
  font-weight:800;
  letter-spacing:-0.015em;
  color:var(--deep);
}
@media (min-width:760px){
  .page-news .pn-sec-title{font-size:28px;}
}
.page-news .pn-sec-lead{
  margin:10px 0 0;
  max-width:58em;
  font-size:15px;
  line-height:1.8;
  color:var(--graphite);
}

/* ---------- 赛季阶段专题 ---------- */
.page-news .pn-phase{
  margin:52px 0 0;
}
.page-news .pn-phase__list{
  list-style:none;
  margin:22px 0 0;
  padding:0;
  display:grid;
  gap:14px;
}
@media (min-width:760px){
  .page-news .pn-phase__list{grid-template-columns:repeat(2,minmax(0,1fr));}
}
.page-news .pn-phase__item{
  padding:18px;
  background:var(--paper);
  border:1px solid var(--line);
  border-left:4px solid var(--ice);
  transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease);
}
.page-news .pn-phase__item:hover{
  transform:translateY(-2px);
  box-shadow:var(--shadow-1);
}
.page-news .pn-phase__item--3{border-left-color:var(--ice);}
.page-news .pn-phase__item--2{border-left-color:var(--indigo);}
.page-news .pn-phase__item--1{border-left-color:var(--teal);}
.page-news .pn-phase__item--0{border-left-color:var(--wine);}
.page-news .pn-phase__name{
  display:flex;
  align-items:center;
  gap:8px;
  margin:0;
  font-size:16px;
  font-weight:800;
  color:var(--deep);
}
.page-news .pn-phase__flag{
  padding:1px 6px;
  font-size:11px;
  font-weight:600;
  color:var(--signal);
  border:1px solid rgba(255,106,43,.42);
}
.page-news .pn-phase__desc{
  margin:9px 0 0;
  font-size:14px;
  line-height:1.75;
  color:var(--graphite);
}
.page-news .pn-phase__stats{
  display:flex;
  flex-wrap:wrap;
  gap:6px 16px;
  margin:13px 0 0;
  padding-top:11px;
  border-top:1px dashed var(--line-mid);
  font-size:12px;
  color:var(--graphite);
  font-variant-numeric:tabular-nums;
}

/* ---------- 资料纠错 ---------- */
.page-news .pn-fix{
  margin:52px 0 0;
  padding:26px 20px 28px;
  background:var(--pale);
  border-top:6px solid var(--amber);
}
@media (min-width:760px){
  .page-news .pn-fix{padding:30px 28px 32px;}
}
.page-news .pn-fix__grid{
  display:grid;
  gap:22px;
  margin-top:22px;
}
@media (min-width:760px){
  .page-news .pn-fix__grid{
    grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);
    gap:38px;
    align-items:start;
  }
}
.page-news .pn-fix__steps{
  list-style:none;
  margin:0;
  padding:0;
  counter-reset:pnfix;
  display:grid;
  gap:16px;
}
.page-news .pn-fix__step{
  position:relative;
  padding-left:46px;
  font-size:14px;
  line-height:1.75;
  color:var(--graphite);
}
.page-news .pn-fix__step::before{
  counter-increment:pnfix;
  content:counter(pnfix,decimal-leading-zero);
  position:absolute;
  left:0;
  top:1px;
  display:flex;
  align-items:center;
  justify-content:center;
  width:30px;
  height:22px;
  background:var(--paper);
  border:1px solid rgba(201,122,22,.34);
  color:var(--amber);
  font-family:var(--font-mono);
  font-size:12px;
  font-weight:700;
  font-variant-numeric:tabular-nums;
}
.page-news .pn-fix__step strong{
  display:block;
  margin-bottom:2px;
  font-weight:700;
  color:var(--ink);
}
.page-news .pn-fix__note{
  padding:16px 18px;
  background:var(--paper);
  border-left:3px solid var(--amber);
  font-size:14px;
  line-height:1.8;
  color:var(--graphite);
}
.page-news .pn-fix__note h3{
  margin:0 0 8px;
  font-size:15px;
  font-weight:800;
  color:var(--deep);
}
.page-news .pn-fix__note p{margin:0;}

/* ---------- 翻回看与跟进 ---------- */
.page-news .pn-archive{
  margin:52px 0 0;
  padding:0 0 12px;
}
.page-news .pn-archive__band{
  display:block;
  height:6px;
  margin-bottom:26px;
  background:linear-gradient(90deg,var(--teal),var(--indigo),var(--wine));
}
.page-news .pn-archive__grid{
  display:grid;
  gap:32px;
}
@media (min-width:900px){
  .page-news .pn-archive__grid{
    grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);
    gap:48px;
    align-items:start;
  }
}
.page-news .pn-archive__strip{
  list-style:none;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1px;
  margin:20px 0 0;
  padding:0;
  background:var(--line-mid);
  border:1px solid var(--line-mid);
}
.page-news .pn-archive__cell{background:var(--paper);}
.page-news .pn-archive__cell a{
  display:block;
  padding:14px 10px;
  text-decoration:none;
  color:var(--graphite);
  transition:background var(--dur) var(--ease),color var(--dur) var(--ease);
}
.page-news .pn-archive__cell a:hover{background:var(--pale);}
.page-news .pn-archive__cell a:focus-visible{
  outline:2px solid var(--signal);
  outline-offset:-2px;
}
.page-news .pn-archive__k{
  display:block;
  font-size:11px;
  letter-spacing:.05em;
  opacity:.75;
}
.page-news .pn-archive__v{
  display:block;
  margin-top:4px;
  font-size:14px;
  font-weight:700;
  color:var(--deep);
}
.page-news .pn-archive__cell.is-current a{background:var(--deep);}
.page-news .pn-archive__cell.is-current .pn-archive__k,
.page-news .pn-archive__cell.is-current .pn-archive__v{
  color:var(--pale);
  opacity:1;
}
.page-news .pn-follow__list{
  list-style:none;
  margin:18px 0 22px;
  padding:0;
}
.page-news .pn-follow__list li{
  position:relative;
  padding-left:18px;
  margin-top:10px;
  font-size:14px;
  line-height:1.75;
  color:var(--graphite);
}
.page-news .pn-follow__list li::before{
  content:"";
  position:absolute;
  left:0;
  top:.72em;
  width:8px;
  height:1px;
  background:var(--signal);
}

/* ---------- 窄屏收敛 ---------- */
@media (max-width:559px){
  .page-news{--pn-num-w:28px;--pn-gap:10px;}
  .page-news .pn-item__sum{
    grid-template-columns:var(--pn-num-w) minmax(0,1fr);
    grid-template-areas:
      "no meta"
      "no title"
      "no brief";
  }
  .page-news .pn-item__no{
    width:22px;
    height:22px;
    font-size:10px;
  }
  .page-news .pn-item__toggle{display:none;}
  .page-news .pn-item__title{font-size:16px;}
  .page-news .pn-fix{padding:22px 16px 24px;}
  .page-news .pn-feature{padding:20px 16px;}
  .page-news .pn-archive__strip{grid-template-columns:repeat(2,minmax(0,1fr));}
}

@media (prefers-reduced-motion:reduce){
  .page-news .pn-phase__item,
  .page-news .pn-rail__link,
  .page-news .pn-item__toggle,
  .page-news .pn-item__sum,
  .page-news .pn-item__title{
    transition:none;
  }
  .page-news .pn-phase__item:hover{transform:none;}
}
<<<END>>>