/* ==========================================================================
   战报与观察 — /reports/
   页面作用域：.page-news
   ========================================================================== */

.page-news{
  --fg:var(--ink);
  --muted:var(--slate);
  --accent-line:var(--mist);
  --stat-color:var(--sky);
  --news-hair:rgba(11,58,122,.16);
  --news-flow:clamp(18px,2.4vw,34px);
  padding-top:var(--header-h);
  background:var(--cloud);
  color:var(--fg);
  overflow-x:clip;
}

.page-news .panel--sky,
.page-news .panel--indigo,
.page-news .panel--teal,
.page-news .panel--wine{
  --news-hair:rgba(220,230,247,.2);
}

.page-news .news-light{
  background:var(--cloud);
  --fg:var(--ink);
  --muted:var(--slate);
  --accent-line:var(--mist);
  --stat-color:var(--sky);
  --news-hair:rgba(11,58,122,.16);
  color:var(--fg);
}

.page-news [id]{
  scroll-margin-top:calc(var(--header-h) + 26px);
}

.page-news .news-band{
  padding-block:clamp(38px,5vw,76px);
  position:relative;
}

/* ---------- 区块头 ---------- */

.page-news .news-head{
  margin-bottom:clamp(24px,3.2vw,46px);
}

.page-news .news-head .eyebrow{
  margin:0;
}

.page-news .news-head .section__title{
  margin:.4rem 0 0;
  font-weight:300;
  letter-spacing:-.005em;
}

.page-news .news-head__note{
  margin:.8rem 0 0;
  max-width:60ch;
  font-size:15px;
  line-height:1.75;
  color:var(--muted);
}

/* ==========================================================================
   01 · 首屏
   ========================================================================== */

.page-news .news-hero{
  position:relative;
  overflow:hidden;
  padding-block:clamp(22px,3.2vw,46px) clamp(40px,5.2vw,76px);
}

.page-news .news-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(to right,rgba(220,230,247,.06) 1px,transparent 1px),
    linear-gradient(to bottom,rgba(220,230,247,.06) 1px,transparent 1px);
  background-size:74px 74px;
  pointer-events:none;
}

.page-news .news-hero > .shell{
  position:relative;
  z-index:1;
}

.page-news .news-hero .breadcrumb{
  margin-bottom:clamp(20px,2.6vw,38px);
}

.page-news .news-hero .breadcrumb__link{
  color:inherit;
  opacity:.72;
  text-decoration:none;
}

.page-news .news-hero .breadcrumb__link:hover{
  opacity:1;
  color:var(--cyan);
}

.page-news .news-hero .breadcrumb__sep,
.page-news .news-hero .breadcrumb__item [aria-current]{
  color:var(--muted);
}

.page-news .news-hero__head{
  max-width:min(100%,66rem);
}

.page-news .news-hero__title{
  margin:.5rem 0 0;
  font-size:clamp(36px,5.6vw,84px);
  font-weight:300;
  line-height:1.08;
  letter-spacing:-.012em;
}

.page-news .news-hero__lede{
  margin:clamp(16px,2vw,26px) 0 0;
  max-width:62ch;
  font-size:clamp(15px,1.15vw,18px);
  line-height:1.8;
  color:var(--muted);
}

.page-news .news-hero__stats{
  margin-top:clamp(26px,3.4vw,48px);
  padding-top:clamp(18px,2.2vw,30px);
  border-top:1px solid var(--news-hair);
}

.page-news .news-hero__stats .stat__value{
  font-family:var(--font-mono);
  font-weight:800;
  color:var(--cyan);
}

.page-news .news-hero__stats .stat__label{
  color:var(--muted);
  font-size:12px;
  line-height:1.55;
}

.page-news .news-hero__media{
  margin:clamp(30px,4vw,56px) 0 0;
}

/* ---------- 通用图形框 ---------- */

.page-news .news-frame{
  position:relative;
  overflow:hidden;
  border:1px solid var(--news-hair);
  background:rgba(11,18,32,.22);
}

.page-news .news-frame .media__img{
  display:block;
  width:100%;
  height:auto;
  max-width:100%;
  object-fit:cover;
}

.page-news .news-frame .media__scan{
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:
    linear-gradient(to right,rgba(0,231,193,.09) 1px,transparent 1px),
    linear-gradient(to bottom,rgba(0,231,193,.09) 1px,transparent 1px);
  background-size:46px 46px;
  mix-blend-mode:screen;
}

.page-news .news-light .news-frame .media__scan{
  background-image:
    linear-gradient(to right,rgba(11,58,122,.07) 1px,transparent 1px),
    linear-gradient(to bottom,rgba(11,58,122,.07) 1px,transparent 1px);
  mix-blend-mode:normal;
}

.page-news .media__caption{
  margin-top:.75rem;
  font-family:var(--font-mono);
  font-size:11px;
  line-height:1.7;
  letter-spacing:.02em;
  color:var(--muted);
}

/* ==========================================================================
   02 · 四类战报
   ========================================================================== */

.page-news .news-cats__grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1px;
  background:var(--news-hair);
  border-block:1px solid var(--news-hair);
}

.page-news .news-cat{
  position:relative;
  background:var(--cloud);
  padding:clamp(22px,2.4vw,32px) clamp(16px,1.8vw,26px) clamp(26px,2.8vw,38px);
  display:grid;
  align-content:start;
  gap:.62rem;
}

.page-news .news-cat::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:2px;
  background:var(--sky);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .42s var(--ease);
}

.page-news .news-cat:hover::after,
.page-news .news-cat:focus-within::after{
  transform:scaleX(1);
}

.page-news .news-cat .index-tag{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.16em;
  color:var(--slate);
  border-bottom:1px solid var(--mist);
  padding-bottom:.45rem;
}

.page-news .news-cat__title{
  margin:0;
  font-size:clamp(19px,1.7vw,24px);
  font-weight:700;
  letter-spacing:.01em;
}

.page-news .news-cat__who{
  margin:0;
  font-size:12px;
  letter-spacing:.04em;
  color:var(--sky);
}

.page-news .news-cat__text{
  margin:0;
  font-size:14px;
  line-height:1.78;
  color:var(--muted);
}

/* ==========================================================================
   03 · 最新战报 + 双语专稿
   ========================================================================== */

.page-news .news-board{
  display:grid;
  grid-template-columns:minmax(0,3fr) minmax(0,9fr);
  gap:clamp(26px,3.4vw,60px);
  align-items:start;
}

/* 左侧分类索引 */

.page-news .news-rail{
  position:sticky;
  top:calc(var(--header-h) + 26px);
}

.page-news .news-rail__label{
  margin:0 0 1rem;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--muted);
}

.page-news .news-rail__list{
  list-style:none;
  margin:0;
  padding:0;
  border-top:1px solid var(--news-hair);
}

.page-news .news-rail__item{
  border-bottom:1px solid var(--news-hair);
}

.page-news .news-rail__link{
  position:relative;
  display:flex;
  align-items:baseline;
  gap:.7rem;
  padding:.9rem .2rem;
  color:var(--fg);
  text-decoration:none;
  transition:color .25s var(--ease),padding-left .28s var(--ease);
}

.page-news .news-rail__link::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-1px;
  height:2px;
  background:var(--cyan);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .38s var(--ease);
}

.page-news .news-rail__link:hover,
.page-news .news-rail__link:focus-visible{
  color:var(--cyan);
  padding-left:.55rem;
  outline:none;
}

.page-news .news-rail__link.is-active{
  color:var(--cyan);
  padding-left:.55rem;
}

.page-news .news-rail__link.is-active::before{
  transform:scaleX(1);
}

.page-news .news-rail__num{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.08em;
  color:var(--muted);
  transition:color .25s var(--ease);
}

.page-news .news-rail__link:hover .news-rail__num,
.page-news .news-rail__link.is-active .news-rail__num{
  color:inherit;
}

.page-news .news-rail__name{
  font-size:15px;
  line-height:1.5;
}

.page-news .news-rail__count{
  margin:1.4rem 0 0;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.06em;
  color:var(--muted);
}

.page-news .news-rail__count strong{
  font-weight:800;
  color:var(--cyan);
}

/* 战报列表 */

.page-news .news-list{
  list-style:none;
  margin:0;
  padding:0;
  border-top:1px solid var(--news-hair);
}

.page-news .news-list__item{
  position:relative;
  border-bottom:1px solid var(--news-hair);
  padding:clamp(16px,1.9vw,26px) 0;
  transition:padding-left .32s var(--ease);
}

.page-news .news-list__item::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:2px;
  background:var(--cyan);
  transform:scaleY(0);
  transform-origin:top;
  transition:transform .32s var(--ease);
}

.page-news .news-list__item:hover,
.page-news .news-list__item:focus-within{
  padding-left:1.1rem;
}

.page-news .news-list__item:hover::before,
.page-news .news-list__item:focus-within::before{
  transform:scaleY(1);
}

.page-news .news-list__meta{
  display:flex;
  align-items:center;
  gap:.8rem;
  flex-wrap:wrap;
  margin-bottom:.55rem;
}

.page-news .news-list__cat{
  font-family:var(--font-mono);
  font-size:11px;
  line-height:1;
  letter-spacing:.08em;
  padding:.32rem .58rem;
  border:1px solid var(--news-hair);
  color:var(--cyan);
}

.page-news .news-list__time{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.06em;
  color:var(--muted);
}

.page-news .news-list__title{
  margin:0;
  font-size:clamp(17px,1.5vw,21px);
  font-weight:500;
  line-height:1.5;
  letter-spacing:.002em;
  color:var(--fg);
}

.page-news .news-list__brief{
  display:grid;
  grid-template-rows:0fr;
  opacity:0;
  margin-top:0;
  font-size:14px;
  line-height:1.78;
  color:var(--muted);
  transition:grid-template-rows .38s var(--ease),opacity .3s var(--ease),margin-top .38s var(--ease);
}

.page-news .news-list__brief > span{
  display:block;
  overflow:hidden;
}

.page-news .news-list__item:hover .news-list__brief,
.page-news .news-list__item:focus-within .news-list__brief{
  grid-template-rows:1fr;
  opacity:1;
  margin-top:.6rem;
}

@media (hover:none){
  .page-news .news-list__brief{
    grid-template-rows:1fr;
    opacity:1;
    margin-top:.6rem;
  }
}

.page-news .news-list__tail{
  margin:clamp(18px,2.4vw,30px) 0 0;
  font-size:13px;
  line-height:1.8;
  color:var(--muted);
}

/* 双语对照专稿 */

.page-news .news-feature{
  margin-block:clamp(30px,4vw,58px);
  padding:clamp(24px,3vw,44px) clamp(20px,2.6vw,42px) clamp(26px,3.2vw,46px);
  background:var(--wine);
  border:1px solid rgba(255,255,255,.14);
  position:relative;
  overflow:hidden;
}

.page-news .news-feature::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:clamp(80px,12vw,160px);
  height:3px;
  background:var(--cyan);
}

.page-news .news-feature__head .eyebrow{
  margin:0;
  color:var(--cyan);
}

.page-news .news-feature__title{
  margin:.7rem 0 0;
  font-size:clamp(20px,2.3vw,32px);
  font-weight:300;
  line-height:1.34;
  color:var(--cloud);
}

.page-news .news-bilingual{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:1px;
  margin-top:clamp(20px,2.6vw,34px);
  background:rgba(255,255,255,.16);
  border-block:1px solid rgba(255,255,255,.16);
}

.page-news .news-bilingual__col{
  background:var(--wine);
  padding:clamp(18px,2.2vw,28px);
}

.page-news .news-bilingual__tag{
  margin:0 0 .8rem;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--cyan);
}

.page-news .news-bilingual__text{
  margin:0;
  font-size:15px;
  line-height:1.85;
}

.page-news .news-bilingual__col--src .news-bilingual__text{
  font-weight:400;
  color:var(--cloud);
}

.page-news .news-bilingual__col--zh .news-bilingual__text{
  font-weight:300;
  font-style:italic;
  color:rgba(245,248,255,.74);
}

.page-news .news-feature__media{
  margin:clamp(22px,2.8vw,36px) 0 0;
}

.page-news .news-feature__media .media__caption{
  color:rgba(245,248,255,.6);
}

.page-news .news-feature__note{
  margin:clamp(18px,2.2vw,26px) 0 0;
  max-width:62ch;
  font-size:14px;
  line-height:1.82;
  color:rgba(245,248,255,.74);
}

.page-news .news-feature .btn{
  margin-top:clamp(18px,2.2vw,28px);
}

/* ==========================================================================
   04 · 观察报告系列
   ========================================================================== */

.page-news .news-observe__body{
  display:grid;
  grid-template-columns:minmax(0,5fr) minmax(0,7fr);
  gap:clamp(26px,3.6vw,60px);
  align-items:start;
}

.page-news .news-observe__cover{
  margin:0;
  position:sticky;
  top:calc(var(--header-h) + 26px);
}

.page-news .news-observe__list{
  display:grid;
  gap:1px;
  background:var(--news-hair);
  border-block:1px solid var(--news-hair);
}

.page-news .news-report{
  background:var(--cloud);
  padding:clamp(20px,2.4vw,32px) clamp(16px,1.8vw,28px);
  display:grid;
  gap:.55rem;
  transition:background .3s var(--ease);
}

.page-news .news-report:hover{
  background:#EEF3FD;
}

.page-news .news-report__stage{
  margin:0;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.16em;
  color:var(--wine);
}

.page-news .news-report__title{
  margin:0;
  font-size:clamp(18px,1.7vw,23px);
  font-weight:700;
  line-height:1.4;
}

.page-news .news-report__desc{
  margin:0 0 .4rem;
  font-size:14px;
  line-height:1.78;
  color:var(--muted);
}

.page-news .news-report .meta-row{
  display:flex;
  align-items:baseline;
  gap:.75rem;
  padding-top:.45rem;
  border-top:1px solid var(--mist);
}

.page-news .news-report .meta-row__key{
  flex:0 0 3.4em;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.08em;
  color:var(--slate);
}

.page-news .news-report .meta-row__value{
  font-size:13px;
  color:var(--ink);
}

/* ==========================================================================
   05 · 关注列表动态
   ========================================================================== */

.page-news .news-follow__body{
  display:grid;
  grid-template-columns:minmax(0,4fr) minmax(0,8fr);
  gap:clamp(26px,3.2vw,56px);
  align-items:start;
}

.page-news .news-follow__facts{
  border-top:1px solid var(--news-hair);
  padding-top:clamp(18px,2.2vw,28px);
}

.page-news .news-follow__facts .stat__value{
  font-family:var(--font-mono);
  font-weight:800;
  color:var(--cyan);
}

.page-news .news-follow__facts .stat__label{
  color:var(--muted);
  font-size:12px;
  line-height:1.6;
}

.page-news .news-follow__lead{
  margin:clamp(18px,2.2vw,28px) 0 0;
  font-size:14px;
  line-height:1.82;
  color:var(--muted);
}

.page-news .news-follow__rounds{
  display:grid;
  gap:1px;
  background:var(--news-hair);
  border-block:1px solid var(--news-hair);
}

.page-news .news-round{
  background:var(--teal);
}

.page-news .news-round__summary{
  display:flex;
  align-items:baseline;
  gap:1rem;
  flex-wrap:wrap;
  padding:clamp(16px,1.9vw,24px) clamp(14px,1.8vw,26px);
  cursor:pointer;
  list-style:none;
  transition:background .28s var(--ease);
}

.page-news .news-round__summary::-webkit-details-marker{
  display:none;
}

.page-news .news-round__summary:hover{
  background:rgba(0,231,193,.06);
}

.page-news .news-round__summary:focus-visible{
  outline:2px solid var(--orange);
  outline-offset:-3px;
}

.page-news .news-round__label{
  font-family:var(--font-mono);
  font-size:13px;
  font-weight:700;
  letter-spacing:.06em;
  color:var(--cyan);
}

.page-news .news-round__label::after{
  content:"＋";
  margin-left:.85rem;
  font-family:var(--font-sans);
  font-weight:400;
  color:var(--muted);
}

.page-news .news-round[open] .news-round__label::after{
  content:"−";
  color:var(--cyan);
}

.page-news .news-round__hint{
  font-size:14px;
  line-height:1.7;
  color:var(--muted);
}

.page-news .news-round__body{
  padding:0 clamp(14px,1.8vw,26px) clamp(18px,2.2vw,28px);
  display:grid;
  gap:.8rem;
  border-top:1px solid var(--news-hair);
  padding-top:1rem;
}

.page-news .news-round__body p{
  margin:0;
  font-size:14px;
  line-height:1.82;
  color:var(--muted);
  max-width:62ch;
}

/* ==========================================================================
   06 · 更新节奏
   ========================================================================== */

.page-news .news-cadence__grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1px;
  background:var(--news-hair);
  border-block:1px solid var(--news-hair);
}

.page-news .news-cadence__cell{
  background:var(--cloud);
  padding:clamp(22px,2.4vw,34px) clamp(16px,1.8vw,28px) clamp(26px,2.8vw,38px);
  display:grid;
  align-content:start;
  gap:.7rem;
}

.page-news .news-cadence__cell .index-tag{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.16em;
  color:var(--wine);
  border-bottom:1px solid var(--mist);
  padding-bottom:.45rem;
}

.page-news .news-cadence__title{
  margin:0;
  font-size:clamp(18px,1.7vw,23px);
  font-weight:700;
  line-height:1.4;
}

.page-news .news-cadence__text{
  margin:0;
  font-size:14px;
  line-height:1.82;
  color:var(--muted);
}

.page-news .news-cadence__actions{
  display:flex;
  flex-wrap:wrap;
  gap:.85rem;
  margin-top:clamp(26px,3.2vw,44px);
}

/* ==========================================================================
   响应式
   ========================================================================== */

@media (max-width:1100px){
  .page-news .news-board{
    gap:clamp(22px,3vw,40px);
  }

  .page-news .news-cats__grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width:960px){
  .page-news .news-board{
    grid-template-columns:minmax(0,1fr);
  }

  .page-news .news-rail{
    position:static;
  }

  .page-news .news-rail__list{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .page-news .news-rail__item:nth-child(odd){
    border-right:1px solid var(--news-hair);
  }

  .page-news .news-observe__body,
  .page-news .news-follow__body{
    grid-template-columns:minmax(0,1fr);
  }

  .page-news .news-observe__cover{
    position:static;
  }

  .page-news .news-cadence__grid{
    grid-template-columns:minmax(0,1fr);
  }

  .page-news .news-bilingual{
    grid-template-columns:minmax(0,1fr);
  }
}

@media (max-width:640px){
  .page-news .news-hero__title{
    font-size:clamp(30px,8vw,44px);
    line-height:1.14;
  }

  .page-news .news-cats__grid{
    grid-template-columns:minmax(0,1fr);
  }

  .page-news .news-rail__list{
    grid-template-columns:minmax(0,1fr);
  }

  .page-news .news-rail__item:nth-child(odd){
    border-right:0;
  }

  .page-news .news-feature{
    padding-inline:clamp(16px,4vw,22px);
  }

  .page-news .news-cadence__actions .btn{
    flex:1 1 auto;
    text-align:center;
    justify-content:center;
  }
}

@media (prefers-reduced-motion:reduce){
  .page-news .news-list__item,
  .page-news .news-list__brief,
  .page-news .news-list__item::before,
  .page-news .news-rail__link,
  .page-news .news-rail__link::before,
  .page-news .news-cat::after{
    transition:none;
  }
}
