.page-news{
  --news-line:rgba(243,237,226,.14);
  --news-line-strong:rgba(243,237,226,.3);
  --news-dim:rgba(243,237,226,.62);
  --news-ink-line:rgba(22,17,15,.14);
  background:var(--cinema);
  color:var(--cream);
  overflow-x:clip;
}

.page-news .eyebrow{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--orange);
  margin:0 0 14px;
}

/* ============ 首屏 ============ */
.page-news .news-hero{
  position:relative;
  padding:clamp(20px,5vw,48px) 0 clamp(40px,7vw,80px);
  background:
    radial-gradient(130% 90% at 84% -12%, rgba(200,16,46,.34), transparent 62%),
    radial-gradient(90% 70% at 0% 106%, rgba(46,91,255,.14), transparent 62%),
    var(--cinema);
  border-bottom:1px solid var(--news-line);
}

.page-news .breadcrumb{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.08em;
  margin-bottom:clamp(20px,4vw,36px);
}
.page-news .breadcrumb a,
.page-news .breadcrumb span{
  color:var(--news-dim);
  text-decoration:none;
}
.page-news .breadcrumb a:hover{color:var(--cream)}
.page-news .breadcrumb [aria-current="page"]{color:var(--cream)}

.page-news .news-hero__grid{
  display:grid;
  gap:clamp(20px,3vw,32px);
}

.page-news .news-hero__media{
  margin:0;
  position:relative;
  aspect-ratio:16/9;
  overflow:hidden;
  background:#08090b;
  border:1px solid var(--news-line-strong);
}
.page-news .news-hero__media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.page-news .news-hero__panel{
  position:relative;
  padding:clamp(20px,4vw,34px) clamp(18px,4vw,38px);
  background:rgba(14,16,19,.72);
  border-left:3px solid var(--red);
  border-top:1px solid var(--news-line);
  border-right:1px solid var(--news-line);
  border-bottom:1px solid var(--news-line);
}

.page-news .news-hero__panel h1{
  margin:0 0 18px;
  font-size:clamp(29px,6.2vw,58px);
  line-height:1.16;
  letter-spacing:-.02em;
  font-weight:800;
  color:var(--cream);
}

.page-news .news-hero__lead{
  margin:0 0 22px;
  font-size:clamp(15px,1.6vw,17px);
  line-height:1.8;
  color:rgba(243,237,226,.82);
  max-width:60ch;
}

.page-news .news-hero__meta{
  display:flex;
  flex-wrap:wrap;
  gap:10px 20px;
  margin:0;
  padding-top:16px;
  border-top:1px solid var(--news-line);
}
.page-news .news-hero__meta-item{
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.04em;
  color:var(--news-dim);
}
.page-news .news-hero__meta-item::before{
  content:"";
  display:inline-block;
  width:6px;
  height:6px;
  margin-right:8px;
  background:var(--neon);
  vertical-align:middle;
}

/* ============ 双区版式 ============ */
.page-news .news-desk{
  padding:clamp(44px,8vw,96px) 0;
  background:var(--cinema);
}

.page-news .news-desk__grid{
  display:grid;
  gap:clamp(30px,5vw,56px);
}

.page-news .news-rail{
  border-top:2px solid var(--red);
  padding-top:20px;
}

.page-news .news-rail .annotation{
  display:block;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.2em;
  color:var(--orange);
  margin-bottom:12px;
}

.page-news .news-rail__title{
  margin:0 0 18px;
  font-family:var(--font-mono);
  font-size:13px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--news-dim);
}

.page-news .news-rail__list{
  list-style:none;
  margin:0;
  padding:0;
}

.page-news .news-rail__item{
  display:grid;
  grid-template-columns:30px minmax(0,1fr);
  gap:12px;
  padding:15px 0;
  border-bottom:1px solid var(--news-line);
  transition:border-color .2s var(--ease);
}
.page-news .news-rail__item:hover{border-bottom-color:var(--red)}

.page-news .news-rail__idx{
  font-family:var(--font-mono);
  font-size:13px;
  color:var(--orange);
  padding-top:3px;
}
.page-news .news-rail__body{display:block}
.page-news .news-rail__name{
  display:block;
  font-size:17px;
  font-weight:700;
  color:var(--cream);
  letter-spacing:-.01em;
}
.page-news .news-rail__note{
  display:block;
  margin-top:5px;
  font-size:13px;
  line-height:1.65;
  color:var(--news-dim);
}

.page-news .news-stream__head{
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  justify-content:space-between;
  gap:10px;
  padding-bottom:16px;
  border-bottom:2px solid var(--cream);
}
.page-news .news-stream__head h2{
  margin:0;
  font-size:clamp(23px,4vw,34px);
  letter-spacing:-.02em;
  color:var(--cream);
}
.page-news .news-stream__head span{
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.08em;
  color:var(--news-dim);
}

/* ============ 条目列表 ============ */
.page-news .news-list{display:grid}

.page-news .news-item{
  display:grid;
  gap:8px;
  padding:22px 0 20px;
  border-bottom:1px solid var(--news-line);
  transition:transform .22s var(--ease), border-color .22s var(--ease);
}
.page-news .news-item:hover{
  transform:translateX(6px);
  border-bottom-color:var(--news-line-strong);
}

.page-news .news-item__meta{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px 14px;
}
.page-news .news-item__when{
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.04em;
  color:var(--news-dim);
}

.page-news .news-item__title{
  margin:0;
  font-size:clamp(17px,2.3vw,22px);
  line-height:1.5;
  font-weight:700;
  color:var(--cream);
  letter-spacing:-.01em;
}

.page-news .news-item__desc{
  margin:0;
  font-size:15px;
  line-height:1.75;
  color:var(--news-dim);
  max-width:62ch;
}

.page-news .news-item__time{
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.04em;
  color:var(--neon);
  opacity:.42;
  transition:opacity .22s var(--ease);
}
.page-news .news-item:hover .news-item__time{opacity:1}

/* ============ 列表中的插图 ============ */
.page-news .news-figure{
  margin:28px 0;
  position:relative;
  overflow:hidden;
  background:#08090b;
  border:1px solid var(--news-line);
}
.page-news .news-figure--wide{aspect-ratio:3/2}
.page-news .news-figure--square{aspect-ratio:1/1;max-width:520px}
.page-news .news-figure img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.page-news .news-figure .media-frame__cap{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  margin:0;
  padding:14px 16px;
  font-family:var(--font-mono);
  font-size:11px;
  line-height:1.6;
  letter-spacing:.04em;
  color:rgba(243,237,226,.78);
  background:linear-gradient(to top, rgba(8,9,11,.92), rgba(8,9,11,0));
}

/* ============ 俱乐部档案 ============ */
.page-news .news-archive{
  background:var(--cream);
  color:var(--ink);
  padding:clamp(48px,8vw,104px) 0;
}
.page-news .news-archive .eyebrow{color:var(--red)}

.page-news .news-archive__grid{
  display:grid;
  gap:clamp(28px,4vw,56px);
}

.page-news .news-archive__body h2{
  margin:0 0 16px;
  font-size:clamp(23px,3.6vw,38px);
  line-height:1.28;
  letter-spacing:-.02em;
  color:var(--ink);
}
.page-news .news-archive__body > p{
  margin:0 0 22px;
  font-size:16px;
  line-height:1.8;
  color:var(--gray);
  max-width:58ch;
}

.page-news .news-archive__points{
  list-style:none;
  margin:0 0 28px;
  padding:0;
  display:grid;
  gap:12px;
}
.page-news .news-archive__points li{
  display:grid;
  grid-template-columns:22px minmax(0,1fr);
  gap:12px;
  font-size:15px;
  line-height:1.72;
  color:var(--ink);
}
.page-news .news-archive__points li::before{
  content:"";
  width:18px;
  height:1px;
  background:var(--red);
  margin-top:12px;
}

.page-news .news-archive__media{
  margin:0;
  position:relative;
  aspect-ratio:3/2;
  overflow:hidden;
  background:#0b0c0e;
  border:1px solid var(--news-ink-line);
}
.page-news .news-archive__media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.page-news .news-archive__media .media-frame__cap{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  margin:0;
  padding:13px 16px;
  font-family:var(--font-mono);
  font-size:11px;
  line-height:1.6;
  letter-spacing:.04em;
  color:rgba(243,237,226,.8);
  background:linear-gradient(to top, rgba(8,9,11,.94), rgba(8,9,11,0));
}

/* ============ 赛前前瞻 ============ */
.page-news .news-preview{
  background:var(--cinema);
  border-top:1px solid var(--news-line);
  padding:clamp(48px,8vw,104px) 0;
}

.page-news .news-preview__head h2{
  margin:0 0 14px;
  font-size:clamp(24px,4vw,38px);
  line-height:1.24;
  letter-spacing:-.02em;
  color:var(--cream);
}
.page-news .news-preview__lead{
  margin:0;
  font-size:16px;
  line-height:1.78;
  color:var(--news-dim);
  max-width:58ch;
}

.page-news .news-preview__grid{
  display:grid;
  gap:1px;
  background:var(--news-line);
  border:1px solid var(--news-line);
  margin-top:clamp(28px,4vw,48px);
}
.page-news .news-preview__col{
  background:var(--cinema);
  padding:clamp(22px,3vw,32px) clamp(18px,2.6vw,28px);
}
.page-news .news-preview__col .index-num{
  display:block;
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.16em;
  color:var(--orange);
  margin-bottom:14px;
}
.page-news .news-preview__col h3{
  margin:0 0 12px;
  font-size:18px;
  line-height:1.45;
  font-weight:700;
  color:var(--cream);
}
.page-news .news-preview__col p{
  margin:0;
  font-size:15px;
  line-height:1.75;
  color:var(--news-dim);
}

.page-news .news-stats{
  display:grid;
  gap:1px;
  background:var(--news-line);
  border:1px solid var(--news-line);
  margin-top:clamp(20px,3vw,32px);
}
.page-news .news-stat{
  background:var(--cinema);
  padding:22px clamp(18px,2.6vw,28px);
}
.page-news .news-stat__num{
  display:block;
  font-family:var(--font-mono);
  font-size:clamp(28px,4vw,42px);
  line-height:1;
  color:var(--blue);
  letter-spacing:-.02em;
}
.page-news .news-stat__label{
  display:block;
  margin-top:12px;
  font-size:14px;
  line-height:1.68;
  color:var(--news-dim);
}

/* ============ 追更与订阅 ============ */
.page-news .news-follow{
  background:
    radial-gradient(90% 120% at 10% 0%, rgba(200,16,46,.4), transparent 62%),
    radial-gradient(70% 100% at 100% 100%, rgba(46,91,255,.18), transparent 60%),
    var(--cinema);
  border-top:1px solid var(--news-line);
  padding:clamp(48px,8vw,104px) 0;
}

.page-news .news-follow__grid{
  display:grid;
  gap:clamp(28px,4vw,48px);
}

.page-news .news-follow__body h2{
  margin:0 0 16px;
  font-size:clamp(24px,4vw,38px);
  line-height:1.24;
  letter-spacing:-.02em;
  color:var(--cream);
}
.page-news .news-follow__body p{
  margin:0;
  font-size:16px;
  line-height:1.8;
  color:rgba(243,237,226,.8);
  max-width:48ch;
}

.page-news .news-follow__steps{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:1px;
  background:var(--news-line);
  border:1px solid var(--news-line);
}
.page-news .news-follow__step{
  display:grid;
  grid-template-columns:44px minmax(0,1fr);
  gap:14px;
  background:rgba(14,16,19,.72);
  padding:20px clamp(18px,2.6vw,26px);
}
.page-news .news-follow__step-idx{
  font-family:var(--font-mono);
  font-size:13px;
  color:var(--orange);
  padding-top:4px;
}
.page-news .news-follow__step h3{
  margin:0 0 8px;
  font-size:17px;
  font-weight:700;
  color:var(--cream);
}
.page-news .news-follow__step p{
  margin:0;
  font-size:14px;
  line-height:1.72;
  color:var(--news-dim);
}

.page-news .news-follow__actions{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:clamp(28px,4vw,44px);
}

/* ============ 断点 ============ */
@media (min-width:760px){
  .page-news .news-preview__grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .page-news .news-stats{grid-template-columns:repeat(3,minmax(0,1fr))}
}

@media (min-width:900px){
  .page-news .news-hero__panel{
    margin:-88px 0 0 clamp(24px,6vw,96px);
    max-width:760px;
    padding:clamp(32px,3vw,48px);
    background:rgba(14,16,19,.86);
    backdrop-filter:blur(6px);
    border-top:1px solid var(--news-line-strong);
    border-bottom:1px solid var(--news-line-strong);
  }
  .page-news .news-hero__panel h1{
    transform:skewX(-2deg);
    transform-origin:left center;
  }

  .page-news .news-archive__grid{
    grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);
    align-items:center;
  }

  .page-news .news-follow__grid{
    grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);
    gap:clamp(32px,5vw,72px);
    align-items:start;
  }
}

@media (min-width:980px){
  .page-news .news-desk__grid{
    grid-template-columns:286px minmax(0,1fr);
    gap:clamp(40px,5vw,76px);
    align-items:start;
  }
  .page-news .news-rail{
    position:sticky;
    top:calc(var(--main-h) + 24px);
  }
}

@media (min-width:1180px){
  .page-news .news-hero__media{aspect-ratio:21/9}
}

@media (prefers-reduced-motion:reduce){
  .page-news .news-item,
  .page-news .news-item__time,
  .page-news .news-rail__item{
    transition:none;
  }
  .page-news .news-item:hover{transform:none}
  .page-news .news-hero__panel h1{transform:none}
}
<<<END>>>
