.page-news {
  --news-hair: rgba(110, 90, 30, .38);
  --news-slate: #1C2942;
  --news-card: rgba(17, 26, 46, .72);
  --news-lead: rgba(233, 229, 218, .76);
  --news-soft: #8E9AB0;
  background: var(--ink);
  color: var(--paper);
  overflow-x: hidden;
}

/* ---------- 首屏 ---------- */
.page-news .news-hero {
  position: relative;
  isolation: isolate;
  padding-top: calc(var(--header-h) + 44px);
  padding-bottom: 0;
  border-bottom: var(--edge);
  overflow: hidden;
}

.page-news .news-hero__media {
  position: absolute;
  inset: 0;
  z-index: -1;
}

.page-news .news-hero__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .34;
  filter: saturate(.5) contrast(1.04);
}

.page-news .news-hero__media::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(115% 78% at 10% 0%, rgba(10, 16, 32, .3), rgba(10, 16, 32, .93) 70%),
    linear-gradient(180deg, rgba(10, 16, 32, .55), var(--ink) 94%);
}

.page-news .news-hero__inner {
  display: block;
}

.page-news .news-hero .breadcrumbs {
  margin-bottom: 42px;
}

.page-news .news-hero__kicker {
  margin: 0;
  font-family: var(--font-mono);
  font-size: .75rem;
  letter-spacing: .34em;
  text-transform: uppercase;
  color: var(--gold);
}

.page-news .news-hero__title {
  margin: 18px 0 0;
  font-size: clamp(2.7rem, 10vw, 6.2rem);
  line-height: .96;
  font-weight: 900;
  letter-spacing: -.035em;
  color: #FFFFFF;
  max-width: 14ch;
}

.page-news .news-hero__lead {
  margin: 26px 0 0;
  max-width: 60ch;
  font-size: 1.0625rem;
  line-height: 1.95;
  color: var(--news-lead);
}

.page-news .news-band {
  display: flex;
  flex-wrap: nowrap;
  gap: 0;
  margin: 52px 0 0;
  padding: 0;
  list-style: none;
  border-top: var(--edge);
  border-bottom: var(--edge);
  overflow-x: auto;
  scroll-snap-type: x proximity;
  -webkit-overflow-scrolling: touch;
}

.page-news .news-band__item {
  flex: 0 0 auto;
  min-width: 158px;
  padding: 22px 26px;
  border-right: var(--edge);
  scroll-snap-align: start;
}

.page-news .news-band__item:last-child {
  border-right: 0;
}

.page-news .news-band__num {
  display: block;
  font-family: var(--font-mono);
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1;
  color: var(--gold-lt);
  letter-spacing: -.02em;
}

.page-news .news-band__label {
  display: block;
  margin-top: 8px;
  font-size: .75rem;
  letter-spacing: .14em;
  color: var(--news-soft);
}

/* ---------- 页面索引 ---------- */
.page-news .news-toc {
  padding: 4px 0 0;
}

.page-news .news-toc__list {
  display: flex;
  gap: 10px;
  margin: 0;
  padding: 20px 0;
  list-style: none;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.page-news .news-toc__link {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 8px 15px;
  border: 1px solid var(--news-slate);
  border-radius: var(--radius);
  font-size: .8125rem;
  white-space: nowrap;
  color: var(--news-lead);
  text-decoration: none;
  transition: border-color .22s ease, color .22s ease;
}

.page-news .news-toc__link:hover,
.page-news .news-toc__link:focus-visible {
  border-color: var(--gold-soft);
  color: var(--gold-lt);
}

.page-news .news-toc__n {
  font-family: var(--font-mono);
  font-size: .6875rem;
  letter-spacing: .06em;
  color: var(--gold);
}

/* ---------- 区块与标题 ---------- */
.page-news .news-section {
  padding: 68px 0;
}

.page-news .news-section--alt {
  background: var(--ink-2);
  border-top: var(--edge);
  border-bottom: var(--edge);
}

.page-news .news-head {
  max-width: 760px;
  margin-bottom: 42px;
}

.page-news .news-head__no {
  display: block;
  font-family: var(--font-mono);
  font-size: clamp(2.6rem, 7vw, 4.2rem);
  font-weight: 700;
  line-height: 1;
  color: transparent;
  -webkit-text-stroke: 1px var(--gold-soft);
  letter-spacing: -.02em;
}

.page-news .news-head__kicker {
  margin: 14px 0 0;
  font-family: var(--font-mono);
  font-size: .75rem;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--gold);
}

.page-news .news-head__title {
  margin: 14px 0 0;
  font-size: clamp(1.6rem, 4.6vw, 2.5rem);
  line-height: 1.22;
  font-weight: 900;
  letter-spacing: -.02em;
  color: var(--paper);
}

.page-news .news-head__note {
  margin: 18px 0 0;
  font-size: .9375rem;
  line-height: 1.9;
  color: var(--news-soft);
}

/* ---------- 归档条目列表 ---------- */
.page-news .news-list {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--news-slate);
}

.page-news .news-item {
  position: relative;
  display: grid;
  gap: 12px;
  padding: 26px 0;
  border-bottom: 1px solid var(--news-slate);
  transition: padding-left .28s ease;
}

.page-news .news-item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 26px;
  bottom: 26px;
  width: 2px;
  background: var(--gold);
  transform: scaleY(0);
  transform-origin: top center;
  transition: transform .3s ease;
}

.page-news .news-item__side {
  display: flex;
  align-items: center;
  gap: 12px;
}

.page-news .news-item__time {
  font-family: var(--font-mono);
  font-size: .75rem;
  letter-spacing: .08em;
  color: var(--news-soft);
  white-space: nowrap;
}

.page-news .news-item__title {
  margin: 0;
  font-size: 1.125rem;
  line-height: 1.5;
  font-weight: 700;
  color: var(--paper);
}

.page-news .news-item__desc {
  margin: 12px 0 0;
  max-width: 70ch;
  font-size: .9375rem;
  line-height: 1.9;
  color: var(--news-lead);
}

.page-news .news-item__foot {
  margin: 14px 0 0;
  font-family: var(--font-mono);
  font-size: .75rem;
  letter-spacing: .12em;
  color: var(--gold);
}

/* ---------- 时间线 ---------- */
.page-news .news-timeline {
  position: relative;
  max-width: 780px;
  list-style: none;
  margin: 0;
  padding: 0 0 0 20px;
}

.page-news .news-timeline::before {
  content: "";
  position: absolute;
  left: 5px;
  top: 10px;
  bottom: 10px;
  width: 1px;
  background: linear-gradient(180deg, var(--gold-soft), var(--jade-soft) 58%, rgba(47, 138, 116, 0));
}

.page-news .news-timeline__item {
  position: relative;
  padding: 0 0 34px 20px;
}

.page-news .news-timeline__item:last-child {
  padding-bottom: 0;
}

.page-news .news-timeline__item::before {
  content: "";
  position: absolute;
  left: -19px;
  top: 9px;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--ink);
  border: 1px solid var(--gold);
}

.page-news .news-timeline__year {
  display: block;
  font-family: var(--font-mono);
  font-size: 1.375rem;
  font-weight: 700;
  letter-spacing: .04em;
  color: var(--gold-lt);
  line-height: 1.1;
}

.page-news .news-timeline__body h3 {
  margin: 10px 0 0;
  font-size: 1.0625rem;
  line-height: 1.5;
  font-weight: 700;
  color: var(--paper);
}

.page-news .news-timeline__body p {
  margin: 10px 0 0;
  font-size: .9375rem;
  line-height: 1.9;
  color: var(--news-lead);
}

/* ---------- 图 ---------- */
.page-news .news-figure {
  margin: 44px 0 0;
}

.page-news .news-figure img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  object-fit: cover;
  border: var(--edge);
  border-radius: var(--radius);
  filter: saturate(.55) contrast(1.04);
}

.page-news .news-figure figcaption {
  margin-top: 12px;
  font-family: var(--font-mono);
  font-size: .75rem;
  line-height: 1.75;
  letter-spacing: .04em;
  color: var(--news-soft);
}

.page-news .news-figure--tint img {
  filter: saturate(.4) contrast(1.02) brightness(.9);
}

/* ---------- 专题系列 ---------- */
.page-news .news-series {
  display: grid;
  gap: 16px;
}

.page-news .news-series__card {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 26px 24px 24px;
  background: linear-gradient(158deg, var(--news-card), rgba(10, 16, 32, .55));
  border: 1px solid var(--news-slate);
  border-radius: var(--radius);
  box-shadow: var(--shadow-lift);
  transition: transform .26s ease, border-color .26s ease;
}

.page-news .news-series__card::before {
  content: "";
  display: block;
  width: 36px;
  height: 2px;
  background: var(--gold);
}

.page-news .news-series__idx {
  font-family: var(--font-mono);
  font-size: .6875rem;
  letter-spacing: .2em;
  color: var(--gold);
}

.page-news .news-series__title {
  margin: 0;
  font-size: 1.25rem;
  line-height: 1.35;
  font-weight: 900;
  letter-spacing: -.01em;
  color: var(--paper);
}

.page-news .news-series__desc {
  margin: 0;
  font-size: .9375rem;
  line-height: 1.9;
  color: var(--news-lead);
}

.page-news .news-series__count {
  margin: auto 0 0;
  padding-top: 14px;
  border-top: 1px solid var(--news-slate);
  font-family: var(--font-mono);
  font-size: .75rem;
  letter-spacing: .12em;
  color: var(--jade);
}

/* ---------- 更新节奏 ---------- */
.page-news .news-cadence {
  border-top: 1px solid var(--news-slate);
}

.page-news .news-cadence__row {
  display: grid;
  gap: 12px;
  padding: 26px 0;
  border-bottom: 1px solid var(--news-slate);
}

.page-news .news-cadence__side {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.page-news .news-cadence__cycle {
  font-family: var(--font-mono);
  font-size: 1.125rem;
  font-weight: 700;
  letter-spacing: .06em;
  color: var(--gold-lt);
}

.page-news .news-cadence__text {
  margin: 0;
  max-width: 74ch;
  font-size: .9375rem;
  line-height: 1.9;
  color: var(--news-lead);
}

.page-news .news-team {
  margin-top: 40px;
  padding: 26px 24px;
  background: var(--news-card);
  border: 1px solid var(--news-slate);
  border-left: 2px solid var(--jade);
  border-radius: var(--radius);
}

.page-news .news-team__lead {
  margin: 0;
  font-size: .9375rem;
  line-height: 1.85;
  color: var(--paper);
}

.page-news .news-team__list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin: 20px 0 0;
  padding: 0;
  list-style: none;
}

.page-news .news-team__item {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding-left: 12px;
  border-left: 1px solid var(--news-hair);
}

.page-news .news-team__num {
  font-family: var(--font-mono);
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1;
  color: var(--gold-lt);
}

.page-news .news-team__label {
  font-size: .8125rem;
  letter-spacing: .06em;
  color: var(--news-soft);
}

/* ---------- 查阅与反馈 ---------- */
.page-news .news-access {
  display: grid;
  gap: 34px;
}

.page-news .news-faq__item {
  background: var(--news-card);
  border: 1px solid var(--news-slate);
  border-radius: var(--radius);
  overflow: hidden;
}

.page-news .news-faq__item + .news-faq__item {
  margin-top: 10px;
}

.page-news .news-faq__q {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 17px 20px;
  font-size: .9688rem;
  font-weight: 700;
  line-height: 1.6;
  color: var(--paper);
  cursor: pointer;
  list-style: none;
}

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

.page-news .news-faq__q::after {
  content: "+";
  flex: 0 0 auto;
  font-family: var(--font-mono);
  font-size: 1.125rem;
  color: var(--gold);
  transition: transform .2s ease;
}

.page-news .news-faq__item[open] .news-faq__q {
  border-bottom: 1px solid var(--news-slate);
}

.page-news .news-faq__item[open] .news-faq__q::after {
  content: "−";
}

.page-news .news-faq__a {
  padding: 16px 20px 20px;
}

.page-news .news-faq__a p {
  margin: 0;
  font-size: .9375rem;
  line-height: 1.95;
  color: var(--news-lead);
}

.page-news .news-figure--aside {
  margin-top: 0;
}

.page-news .news-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 22px 0 0;
  padding: 0;
  list-style: none;
}

.page-news .news-tags__item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.page-news .news-tags__item b {
  font-family: var(--font-mono);
  font-size: .75rem;
  font-weight: 700;
  color: var(--gold-lt);
}

.page-news .news-access__note {
  margin-top: 24px;
  padding: 22px 20px;
  border: 1px solid var(--news-slate);
  border-top: 2px solid var(--gold);
  border-radius: var(--radius);
  background: linear-gradient(180deg, rgba(201, 162, 39, .07), rgba(10, 16, 32, 0));
}

.page-news .news-access__note-title {
  margin: 0;
  font-size: .9375rem;
  font-weight: 700;
  color: var(--paper);
}

.page-news .news-access__note-text {
  margin: 12px 0 0;
  font-size: .875rem;
  line-height: 1.9;
  color: var(--news-lead);
}

.page-news .news-access__mail,
.page-news .news-access__link {
  color: var(--gold-lt);
  text-decoration: none;
  border-bottom: 1px solid var(--news-hair);
}

.page-news .news-access__mail:hover,
.page-news .news-access__link:hover {
  border-bottom-color: var(--gold-lt);
}

/* ---------- 响应式 ---------- */
@media (min-width: 760px) {
  .page-news .news-section {
    padding: 86px 0;
  }

  .page-news .news-hero__title {
    max-width: 18ch;
  }

  .page-news .news-item {
    grid-template-columns: 168px minmax(0, 1fr);
    gap: 30px;
    align-items: start;
  }

  .page-news .news-item__side {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    padding-top: 2px;
  }

  .page-news .news-cadence__row {
    grid-template-columns: 180px minmax(0, 1fr);
    gap: 34px;
    align-items: baseline;
  }

  .page-news .news-cadence__side {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .page-news .news-figure {
    margin-top: 52px;
  }
}

@media (min-width: 960px) {
  .page-news .news-series {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 18px;
  }

  .page-news .news-series__card:nth-child(1) {
    grid-column: span 7;
  }

  .page-news .news-series__card:nth-child(2) {
    grid-column: span 5;
  }

  .page-news .news-series__card:nth-child(3) {
    grid-column: span 5;
  }

  .page-news .news-series__card:nth-child(4) {
    grid-column: span 7;
  }

  .page-news .news-access {
    grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
    gap: 44px;
    align-items: start;
  }
}

@media (hover: hover) {
  .page-news .news-item:hover {
    padding-left: 18px;
  }

  .page-news .news-item:hover::before {
    transform: scaleY(1);
  }

  .page-news .news-series__card:hover {
    transform: translateY(-4px);
    border-color: var(--gold-soft);
  }
}

@media (max-width: 420px) {
  .page-news .news-band__item {
    min-width: 136px;
    padding: 18px 20px;
  }

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

@media (prefers-reduced-motion: reduce) {
  .page-news .news-item,
  .page-news .news-item::before,
  .page-news .news-series__card {
    transition: none;
  }

  .page-news .news-item:hover {
    padding-left: 0;
  }
}
<<<END>>>

等等——我最后多写了一个……

<<<END>>> 是多余的。我得把它去掉，按协议只能输出 MAIN_HTML 和 PAGE_CSS 这两个标记，其他什么都不加。

直接给干净的版本就行。
<main id="main-content" class="page-news">

  <section class="news-hero">
    <div class="news-hero__media">
      <img src="{zhanqunpic:h:900w:1600}" width="1600" height="900" alt="夜间数据室中延伸的抽象数据流与牌路轨迹光带">
    </div>
    <div class="container news-hero__inner">
      <nav class="breadcrumbs" aria-label="面包屑">
        <ol class="breadcrumbs__list">
          <li class="breadcrumbs__item"><a class="breadcrumbs__link" href="/">首页</a><span class="breadcrumbs__sep" aria-hidden="true">/</span></li>
          <li class="breadcrumbs__item"><span aria-current="page">数据趋势观察</span></li>
        </ol>
      </nav>

      <p class="news-hero__kicker">Trends &amp; Archive</p>
      <h1 class="news-hero__title">数据趋势观察</h1>
      <p class="news-hero__lead">自 2021 年起，博赢BY 把每个月的教程与观察记录归并进同一条时间线：12 类玩法的开局频次、荷官班次与结算周期线索，都可以沿着年份往回查。</p>

      <ul class="news-band">
        <li class="news-band__item"><span class="news-band__num">2021</span><span class="news-band__label">归档起点</span></li>
        <li class="news-band__item"><span class="news-band__num">58</span><span class="news-band__label">期月度教程</span></li>
        <li class="news-band__item"><span class="news-band__num">12</span><span class="news-band__label">类玩法口径</span></li>
        <li class="news-band__item"><span class="news-band__num">36</span><span class="news-band__label">个厂商条目</span></li>
        <li class="news-band__item"><span class="news-band__num">140+</span><span class="news-band__label">份作品档案</span></li>
      </ul>
    </div>
  </section>

  <div class="container">
    <nav class="news-toc" aria-label="页面索引">
      <ul class="news-toc__list">
        <li><a class="news-toc__link" href="#latest"><span class="news-toc__n">01</span>最近收录</a></li>
        <li><a class="news-toc__link" href="#timeline"><span class="news-toc__n">02</span>归档时间线</a></li>
        <li><a class="news-toc__link" href="#series"><span class="news-toc__n">03</span>专题系列</a></li>
        <li><a class="news-toc__link" href="#cadence"><span class="news-toc__n">04</span>更新节奏</a></li>
        <li><a class="news-toc__link" href="#access"><span class="news-toc__n">05</span>查阅与反馈</a></li>
      </ul>
    </nav>
  </div>

  <section class="news-section" id="latest">
    <div class="container">
      <header class="news-head" data-reveal>
        <span class="news-head__no">01</span>
        <p class="news-head__kicker">最近收录</p>
        <h2 class="news-head__title">这一段时间归档了什么</h2>
        <p class="news-head__note">条目按收录先后排列，时间只标相对位置；确切的起止时段以年度索引中的编号为准。</p>
      </header>

      <ol class="news-list">
        <li class="news-item" data-reveal>
          <div class="news-item__side">
            <span class="news-item__time">本月归档</span>
            <span class="tag tag--jade">教程</span>
          </div>
          <div class="news-item__main">
            <h3 class="news-item__title">开局频次记录表：从单局记录到分段汇总</h3>
            <p class="news-item__desc">把一局一行的原始记录压缩成可对比的段落表，正文说明分段汇总时最容易出现的三处偏差，并给出核对顺序。</p>
            <p class="news-item__foot">T-058 · 月度教程</p>
          </div>
        </li>

        <li class="news-item" data-reveal data-reveal-delay="80">
          <div class="news-item__side">
            <span class="news-item__time">上月归档</span>
            <span class="tag tag--cinnabar">口径</span>
          </div>
          <div class="news-item__main">
            <h3 class="news-item__title">荷官班次与结算周期并排对照</h3>
            <p class="news-item__desc">早班、中班、晚班三段节奏分别对应按局、按场、按日三类结算口径，正文用两列对照逐条标注，边界处单独加注。</p>
            <p class="news-item__foot">G-041 · 口径说明</p>
          </div>
        </li>

        <li class="news-item" data-reveal>
          <div class="news-item__side">
            <span class="news-item__time">本季度专题</span>
            <span class="tag">厂商</span>
          </div>
          <div class="news-item__main">
            <h3 class="news-item__title">厂商条目编号规则的第三次调整</h3>
            <p class="news-item__desc">专区内部的编号重新分段，旧编号保留映射关系；从编号回到栏目的检索路径同步更新，历史条目不受影响。</p>
            <p class="news-item__foot">V-019 · 厂商档案</p>
          </div>
        </li>

        <li class="news-item" data-reveal data-reveal-delay="80">
          <div class="news-item__side">
            <span class="news-item__time">近三期连载</span>
            <span class="tag">趋势</span>
          </div>
          <div class="news-item__main">
            <h3 class="news-item__title">季度开局频次观察应该怎么读</h3>
            <p class="news-item__desc">连续三期只记录分布变化与口径调整，不推断走势，也不构成任何形式的建议；正文把易误读的三类图表逐一摊开。</p>
            <p class="news-item__foot">R-014 · 趋势观察</p>
          </div>
        </li>

        <li class="news-item" data-reveal>
          <div class="news-item__side">
            <span class="news-item__time">上月归档</span>
            <span class="tag tag--jade">教程</span>
          </div>
          <div class="news-item__main">
            <h3 class="news-item__title">统计口径的三次修订与对应章节</h3>
            <p class="news-item__desc">每一次修订都保留旧版说明并标注差异，便于按年份回看同一指标在不同阶段的表述方式。</p>
            <p class="news-item__foot">T-057 · 月度教程</p>
          </div>
        </li>

        <li class="news-item" data-reveal data-reveal-delay="80">
          <div class="news-item__side">
            <span class="news-item__time">年度索引阶段</span>
            <span class="tag tag--cinnabar">专题</span>
          </div>
          <div class="news-item__main">
            <h3 class="news-item__title">跨年度月度归档的索引整理</h3>
            <p class="news-item__desc">把已归档的月度教程按玩法分类重新挂接，形成一张可以逐级展开的索引表，并附上每一条的收录顺序。</p>
            <p class="news-item__foot">Y-005 · 年度索引</p>
          </div>
        </li>
      </ol>
    </div>
  </section>

  <section class="news-section news-section--alt" id="timeline">
    <div class="container">
      <header class="news-head" data-reveal>
        <span class="news-head__no">02</span>
        <p class="news-head__kicker">归档时间线</p>
        <h2 class="news-head__title">从 2021 到现在，归档是怎么长出来的</h2>
        <p class="news-head__note">每一年只做一件事的推进：先把归档机制立住，再统一口径，接着补上厂商维度，最后调整阅读方式。</p>
      </header>

      <ol class="news-timeline">
        <li class="news-timeline__item" data-reveal>
          <span class="news-timeline__year">2021</span>
          <div class="news-timeline__body">
            <h3>归档机制成型</h3>
            <p>教程发布从单篇转为按月归并，编号体系与索引方式在同一年确定，此后每一期都可回指到固定的收录位置。</p>
          </div>
        </li>
        <li class="news-timeline__item" data-reveal>
          <span class="news-timeline__year">2022</span>
          <div class="news-timeline__body">
            <h3>12 类玩法口径统一</h3>
            <p>开局频次与荷官班次的标注方式固定下来，结算周期按局、按场、按日三类分别说明，跨分类对比从此有共同基准。</p>
          </div>
        </li>
        <li class="news-timeline__item" data-reveal>
          <span class="news-timeline__year">2023</span>
          <div class="news-timeline__body">
            <h3>厂商维度加入</h3>
            <p>厂商专区按品牌归档上线，内部编号与抽象卡片同步启用，作品之间的横向比对有了统一的入口。</p>
          </div>
        </li>
        <li class="news-timeline__item" data-reveal>
          <span class="news-timeline__year">2024</span>
          <div class="news-timeline__body">
            <h3>观察层扩展</h3>
            <p>季度趋势专题与开局频次观察开始与月度教程并行，一条线记录方法，一条线记录变化，互不干扰。</p>
          </div>
        </li>
        <li class="news-timeline__item" data-reveal>
          <span class="news-timeline__year">2025</span>
          <div class="news-timeline__body">
            <h3>阅读体验调整</h3>
            <p>横向分类标签、折叠面板与锚点导航陆续上线，长条目的翻阅成本下降，旧内容也重新挂回了索引。</p>
          </div>
        </li>
      </ol>

      <figure class="news-figure">
        <img src="{zhanqunpic:h:700w:1200}" width="1200" height="700" alt="抽象月历网格上以光点标出的归档节点" loading="lazy" decoding="async">
        <figcaption>月度归档在年度网格中的分布示意，光点密度对应收录期的疏密。</figcaption>
      </figure>
    </div>
  </section>

  <section class="news-section" id="series">
    <div class="container">
      <header class="news-head" data-reveal>
        <span class="news-head__no">03</span>
        <p class="news-head__kicker">专题系列</p>
        <h2 class="news-head__title">四条并行的专题线</h2>
        <p class="news-head__note">教程、口径、厂商、趋势各自成线，彼此之间用编号和标签串联，条目不会混进不属于自己的栏目。</p>
      </header>

      <div class="news-series">
        <article class="news-series__card" data-reveal>
          <span class="news-series__idx">S-01</span>
          <h3 class="news-series__title">新手入门</h3>
          <p class="news-series__desc">从一条原始记录出发，解释字段含义、书写顺序与常见笔误，适合第一次接触统计表的人逐节跟读。</p>
          <p class="news-series__count">收录 18 篇</p>
        </article>

        <article class="news-series__card" data-reveal data-reveal-delay="70">
          <span class="news-series__idx">S-02</span>
          <h3 class="news-series__title">口径说明</h3>
          <p class="news-series__desc">把牌路统计、开局频次、荷官班次、结算周期四个常用词各自讲清楚，并标注容易混淆的边界情形。</p>
          <p class="news-series__count">收录 12 篇</p>
        </article>

        <article class="news-series__card" data-reveal data-reveal-delay="140">
          <span class="news-series__idx">S-03</span>
          <h3 class="news-series__title">厂商档案</h3>
          <p class="news-series__desc">厂商条目与作品档案的统一编号方式，以及从编号反查栏目的检索路径，全部以站内抽象卡片呈现。</p>
          <p class="news-series__count">收录 9 篇</p>
        </article>

        <article class="news-series__card" data-reveal data-reveal-delay="210">
          <span class="news-series__idx">S-04</span>
          <h3 class="news-series__title">趋势观察</h3>
          <p class="news-series__desc">按季度汇总分布变化与修订记录，只写观察到的现象和口径调整原因，不做结果推断。</p>
          <p class="news-series__count">收录 7 篇</p>
        </article>
      </div>

      <figure class="news-figure news-figure--tint">
        <img src="{zhanqunpic:h:600w:1000}" width="1000" height="600" alt="低饱和纸张叠层上排列的专题标签与编号" loading="lazy" decoding="async">
        <figcaption>专题条目沿用统一的标签与编号规则，跨栏目的条目也能被快速定位。</figcaption>
      </figure>
    </div>
  </section>

  <section class="news-section news-section--alt" id="cadence">
    <div class="container">
      <header class="news-head" data-reveal>
        <span class="news-head__no">04</span>
        <p class="news-head__kicker">更新节奏</p>
        <h2 class="news-head__title">归档的周期与分工</h2>
        <p class="news-head__note">三个周期各自负责不同的颗粒度：月度管方法，季度管变化，年度管索引。</p>
      </header>

      <div class="news-cadence">
        <article class="news-cadence__row" data-reveal>
          <div class="news-cadence__side">
            <span class="news-cadence__cycle">每月</span>
            <span class="tag tag--jade">教程归档</span>
          </div>
          <p class="news-cadence__text">新增一期月度教程，同步更新对应分类下的开局频次记录；若当月出现口径调整，会在正文首段单独标明。</p>
        </article>

        <article class="news-cadence__row" data-reveal data-reveal-delay="80">
          <div class="news-cadence__side">
            <span class="news-cadence__cycle">每季度</span>
            <span class="tag">趋势专题</span>
          </div>
          <p class="news-cadence__text">汇总一期开局频次观察，说明本季度出现的分布变化与修订原因，并回链到涉及改动的历史条目。</p>
        </article>

        <article class="news-cadence__row" data-reveal data-reveal-delay="160">
          <div class="news-cadence__side">
            <span class="news-cadence__cycle">每年</span>
            <span class="tag tag--cinnabar">年度索引</span>
          </div>
          <p class="news-cadence__text">把全年条目按玩法与栏目重新挂接，生成可逐级展开的索引表，同时清理重复与失效的交叉引用。</p>
        </article>
      </div>

      <div class="news-team" data-reveal>
        <p class="news-team__lead">上述三个周期由 14 人协作完成</p>
        <ul class="news-team__list">
          <li class="news-team__item"><span class="news-team__num">6</span><span class="news-team__label">内容编辑</span></li>
          <li class="news-team__item"><span class="news-team__num">5</span><span class="news-team__label">数据整理</span></li>
          <li class="news-team__item"><span class="news-team__num">3</span><span class="news-team__label">口径审校</span></li>
        </ul>
      </div>
    </div>
  </section>

  <section class="news-section" id="access">
    <div class="container">
      <header class="news-head" data-reveal>
        <span class="news-head__no">05</span>
        <p class="news-head__kicker">查阅与反馈</p>
        <h2 class="news-head__title">怎么找，怎么反馈</h2>
        <p class="news-head__note">先按栏目缩小范围，再用编号定位具体条目；找不到或对不上时，把编号一并写进反馈里会更快。</p>
      </header>

      <div class="news-access">
        <div class="news-access__main">
          <div class="news-faq">
            <details class="news-faq__item" open>
              <summary class="news-faq__q">条目编号是怎么组成的？</summary>
              <div class="news-faq__a"><p>编号由一位栏目字母加三位收录序号组成。T 代表月度教程，G 代表口径说明，V 代表厂商档案，R 代表趋势观察，Y 代表年度索引。序号在本栏目内连续递增，不会因为编号规则调整而重排。</p></div>
            </details>
            <details class="news-faq__item">
              <summary class="news-faq__q">早期条目为什么找不到直接的分类标签？</summary>
              <div class="news-faq__a"><p>分类标签体系是在 2022 年随 12 类玩法口径一起建立的，更早的条目在整理时只挂了栏目编号。目前这些条目已经通过年度索引补挂了标签，可以通过索引表进入。</p></div>
            </details>
            <details class="news-faq__item">
              <summary class="news-faq__q">同一指标在不同年份的说法不一致怎么办？</summary>
              <div class="news-faq__a"><p>每次修订都会保留旧版说明并标注差异，正文首段会写明本次适用的是哪一版口径。如果发现两处表述互相矛盾，请把两处条目编号一起反馈，审校会核对后统一。</p></div>
            </details>
            <details class="news-faq__item">
              <summary class="news-faq__q">标签和栏目有什么区别？</summary>
              <div class="news-faq__a"><p>栏目决定条目归在哪一条专题线上，不随内容变化；标签描述的是条目涉及的具体玩法或口径，同一条目可以带多个标签。检索时通常先看栏目，再按标签细分。</p></div>
            </details>
          </div>
        </div>

        <aside class="news-access__side">
          <figure class="news-figure news-figure--aside">
            <img src="{zhanqunpic:h:600w:900}" width="900" height="600" alt="抽象步骤编号与色块分级并列排布的示意" loading="lazy" decoding="async">
            <figcaption>条目正文中的步骤编号与色块分级示意。</figcaption>
          </figure>

          <ul class="news-tags" aria-label="按栏目统计的已收录条目数">
            <li class="news-tags__item"><span class="tag tag--jade">教程</span><b>24</b></li>
            <li class="news-tags__item"><span class="tag tag--cinnabar">口径</span><b>12</b></li>
            <li class="news-tags__item"><span class="tag">厂商</span><b>9</b></li>
            <li class="news-tags__item"><span class="tag">趋势</span><b>7</b></li>
            <li class="news-tags__item"><span class="tag">索引</span><b>6</b></li>
          </ul>

          <div class="news-access__note">
            <p class="news-access__note-title">内容纠错与口径反馈</p>
            <p class="news-access__note-text">把涉及的条目编号、栏目和具体位置写清楚，可发送至 <a class="news-access__mail" href="mailto:info@boying-win.com.cn">info@boying-win.com.cn</a>。工作日内回复，节假日顺延。</p>
            <p class="news-access__note-text">如需查看完整的分类口径与厂商专区入口，可前往<a class="news-access__link" href="/features/">玩法分类与统计功能</a>；基础术语解释在<a class="news-access__link" href="/faqs/">新手教程与问答</a>。</p>
          </div>
        </aside>
      </div>
    </div>
  </section>

</main>

.page-news {
  --news-hair: rgba(110, 90, 30, .38);
  --news-slate: #1C2942;
  --news-card: rgba(17, 26, 46, .72);
  --news-lead: rgba(233, 229, 218, .76);
  --news-soft: #8E9AB0;
  background: var(--ink);
  color: var(--paper);
  overflow-x: hidden;
}

/* ---------- 首屏 ---------- */
.page-news .news-hero {
  position: relative;
  isolation: isolate;
  padding-top: calc(var(--header-h) + 44px);
  padding-bottom: 0;
  border-bottom: var(--edge);
  overflow: hidden;
}

.page-news .news-hero__media {
  position: absolute;
  inset: 0;
  z-index: -1;
}

.page-news .news-hero__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .34;
  filter: saturate(.5) contrast(1.04);
}

.page-news .news-hero__media::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(115% 78% at 10% 0%, rgba(10, 16, 32, .3), rgba(10, 16, 32, .93) 70%),
    linear-gradient(180deg, rgba(10, 16, 32, .55), var(--ink) 94%);
}

.page-news .news-hero .breadcrumbs {
  margin-bottom: 42px;
}

.page-news .news-hero__kicker {
  margin: 0;
  font-family: var(--font-mono);
  font-size: .75rem;
  letter-spacing: .34em;
  text-transform: uppercase;
  color: var(--gold);
}

.page-news .news-hero__title {
  margin: 18px 0 0;
  font-size: clamp(2.7rem, 10vw, 6.2rem);
  line-height: .96;
  font-weight: 900;
  letter-spacing: -.035em;
  color: #FFFFFF;
  max-width: 14ch;
}

.page-news .news-hero__lead {
  margin: 26px 0 0;
  max-width: 60ch;
  font-size: 1.0625rem;
  line-height: 1.95;
  color: var(--news-lead);
}

.page-news .news-band {
  display: flex;
  flex-wrap: nowrap;
  gap: 0;
  margin: 52px 0 0;
  padding: 0;
  list-style: none;
  border-top: var(--edge);
  border-bottom: var(--edge);
  overflow-x: auto;
  scroll-snap-type: x proximity;
  -webkit-overflow-scrolling: touch;
}

.page-news .news-band__item {
  flex: 0 0 auto;
  min-width: 158px;
  padding: 22px 26px;
  border-right: var(--edge);
  scroll-snap-align: start;
}

.page-news .news-band__item:last-child {
  border-right: 0;
}

.page-news .news-band__num {
  display: block;
  font-family: var(--font-mono);
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1;
  color: var(--gold-lt);
  letter-spacing: -.02em;
}

.page-news .news-band__label {
  display: block;
  margin-top: 8px;
  font-size: .75rem;
  letter-spacing: .14em;
  color: var(--news-soft);
}

/* ---------- 页面索引 ---------- */
.page-news .news-toc {
  padding: 4px 0 0;
}

.page-news .news-toc__list {
  display: flex;
  gap: 10px;
  margin: 0;
  padding: 20px 0;
  list-style: none;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.page-news .news-toc__link {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 8px 15px;
  border: 1px solid var(--news-slate);
  border-radius: var(--radius);
  font-size: .8125rem;
  white-space: nowrap;
  color: var(--news-lead);
  text-decoration: none;
  transition: border-color .22s ease, color .22s ease;
}

.page-news .news-toc__link:hover,
.page-news .news-toc__link:focus-visible {
  border-color: var(--gold-soft);
  color: var(--gold-lt);
}

.page-news .news-toc__n {
  font-family: var(--font-mono);
  font-size: .6875rem;
  letter-spacing: .06em;
  color: var(--gold);
}

/* ---------- 区块与标题 ---------- */
.page-news .news-section {
  padding: 68px 0;
}

.page-news .news-section--alt {
  background: var(--ink-2);
  border-top: var(--edge);
  border-bottom: var(--edge);
}

.page-news .news-head {
  max-width: 760px;
  margin-bottom: 42px;
}

.page-news .news-head__no {
  display: block;
  font-family: var(--font-mono);
  font-size: clamp(2.6rem, 7vw, 4.2rem);
  font-weight: 700;
  line-height: 1;
  color: transparent;
  -webkit-text-stroke: 1px var(--gold-soft);
  letter-spacing: -.02em;
}

.page-news .news-head__kicker {
  margin: 14px 0 0;
  font-family: var(--font-mono);
  font-size: .75rem;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--gold);
}

.page-news .news-head__title {
  margin: 14px 0 0;
  font-size: clamp(1.6rem, 4.6vw, 2.5rem);
  line-height: 1.22;
  font-weight: 900;
  letter-spacing: -.02em;
  color: var(--paper);
}

.page-news .news-head__note {
  margin: 18px 0 0;
  font-size: .9375rem;
  line-height: 1.9;
  color: var(--news-soft);
}

/* ---------- 归档条目列表 ---------- */
.page-news .news-list {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--news-slate);
}

.page-news .news-item {
  position: relative;
  display: grid;
  gap: 12px;
  padding: 26px 0;
  border-bottom: 1px solid var(--news-slate);
  transition: padding-left .28s ease;
}

.page-news .news-item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 26px;
  bottom: 26px;
  width: 2px;
  background: var(--gold);
  transform: scaleY(0);
  transform-origin: top center;
  transition: transform .3s ease;
}

.page-news .news-item__side {
  display: flex;
  align-items: center;
  gap: 12px;
}

.page-news .news-item__time {
  font-family: var(--font-mono);
  font-size: .75rem;
  letter-spacing: .08em;
  color: var(--news-soft);
  white-space: nowrap;
}

.page-news .news-item__title {
  margin: 0;
  font-size: 1.125rem;
  line-height: 1.5;
  font-weight: 700;
  color: var(--paper);
}

.page-news .news-item__desc {
  margin: 12px 0 0;
  max-width: 70ch;
  font-size: .9375rem;
  line-height: 1.9;
  color: var(--news-lead);
}

.page-news .news-item__foot {
  margin: 14px 0 0;
  font-family: var(--font-mono);
  font-size: .75rem;
  letter-spacing: .12em;
  color: var(--gold);
}

/* ---------- 时间线 ---------- */
.page-news .news-timeline {
  position: relative;
  max-width: 780px;
  list-style: none;
  margin: 0;
  padding: 0 0 0 20px;
}

.page-news .news-timeline::before {
  content: "";
  position: absolute;
  left: 5px;
  top: 10px;
  bottom: 10px;
  width: 1px;
  background: linear-gradient(180deg, var(--gold-soft), var(--jade-soft) 58%, rgba(47, 138, 116, 0));
}

.page-news .news-timeline__item {
  position: relative;
  padding: 0 0 34px 20px;
}

.page-news .news-timeline__item:last-child {
  padding-bottom: 0;
}

.page-news .news-timeline__item::before {
  content: "";
  position: absolute;
  left: -19px;
  top: 9px;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--ink);
  border: 1px solid var(--gold);
}

.page-news .news-timeline__year {
  display: block;
  font-family: var(--font-mono);
  font-size: 1.375rem;
  font-weight: 700;
  letter-spacing: .04em;
  color: var(--gold-lt);
  line-height: 1.1;
}

.page-news .news-timeline__body h3 {
  margin: 10px 0 0;
  font-size: 1.0625rem;
  line-height: 1.5;
  font-weight: 700;
  color: var(--paper);
}

.page-news .news-timeline__body p {
  margin: 10px 0 0;
  font-size: .9375rem;
  line-height: 1.9;
  color: var(--news-lead);
}

/* ---------- 图 ---------- */
.page-news .news-figure {
  margin: 44px 0 0;
}

.page-news .news-figure img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  object-fit: cover;
  border: var(--edge);
  border-radius: var(--radius);
  filter: saturate(.55) contrast(1.04);
}

.page-news .news-figure figcaption {
  margin-top: 12px;
  font-family: var(--font-mono);
  font-size: .75rem;
  line-height: 1.75;
  letter-spacing: .04em;
  color: var(--news-soft);
}

.page-news .news-figure--tint img {
  filter: saturate(.4) contrast(1.02) brightness(.9);
}

/* ---------- 专题系列 ---------- */
.page-news .news-series {
  display: grid;
  gap: 16px;
}

.page-news .news-series__card {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 26px 24px 24px;
  background: linear-gradient(158deg, var(--news-card), rgba(10, 16, 32, .55));
  border: 1px solid var(--news-slate);
  border-radius: var(--radius);
  box-shadow: var(--shadow-lift);
  transition: transform .26s ease, border-color .26s ease;
}

.page-news .news-series__card::before {
  content: "";
  display: block;
  width: 36px;
  height: 2px;
  background: var(--gold);
}

.page-news .news-series__idx {
  font-family: var(--font-mono);
  font-size: .6875rem;
  letter-spacing: .2em;
  color: var(--gold);
}

.page-news .news-series__title {
  margin: 0;
  font-size: 1.25rem;
  line-height: 1.35;
  font-weight: 900;
  letter-spacing: -.01em;
  color: var(--paper);
}

.page-news .news-series__desc {
  margin: 0;
  font-size: .9375rem;
  line-height: 1.9;
  color: var(--news-lead);
}

.page-news .news-series__count {
  margin: auto 0 0;
  padding-top: 14px;
  border-top: 1px solid var(--news-slate);
  font-family: var(--font-mono);
  font-size: .75rem;
  letter-spacing: .12em;
  color: var(--jade);
}

/* ---------- 更新节奏 ---------- */
.page-news .news-cadence {
  border-top: 1px solid var(--news-slate);
}

.page-news .news-cadence__row {
  display: grid;
  gap: 12px;
  padding: 26px 0;
  border-bottom: 1px solid var(--news-slate);
}

.page-news .news-cadence__side {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.page-news .news-cadence__cycle {
  font-family: var(--font-mono);
  font-size: 1.125rem;
  font-weight: 700;
  letter-spacing: .06em;
  color: var(--gold-lt);
}

.page-news .news-cadence__text {
  margin: 0;
  max-width: 74ch;
  font-size: .9375rem;
  line-height: 1.9;
  color: var(--news-lead);
}

.page-news .news-team {
  margin-top: 40px;
  padding: 26px 24px;
  background: var(--news-card);
  border: 1px solid var(--news-slate);
  border-left: 2px solid var(--jade);
  border-radius: var(--radius);
}

.page-news .news-team__lead {
  margin: 0;
  font-size: .9375rem;
  line-height: 1.85;
  color: var(--paper);
}

.page-news .news-team__list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin: 20px 0 0;
  padding: 0;
  list-style: none;
}

.page-news .news-team__item {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding-left: 12px;
  border-left: 1px solid var(--news-hair);
}

.page-news .news-team__num {
  font-family: var(--font-mono);
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1;
  color: var(--gold-lt);
}

.page-news .news-team__label {
  font-size: .8125rem;
  letter-spacing: .06em;
  color: var(--news-soft);
}

/* ---------- 查阅与反馈 ---------- */
.page-news .news-access {
  display: grid;
  gap: 34px;
}

.page-news .news-faq__item {
  background: var(--news-card);
  border: 1px solid var(--news-slate);
  border-radius: var(--radius);
  overflow: hidden;
}

.page-news .news-faq__item + .news-faq__item {
  margin-top: 10px;
}

.page-news .news-faq__q {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 17px 20px;
  font-size: .9688rem;
  font-weight: 700;
  line-height: 1.6;
  color: var(--paper);
  cursor: pointer;
  list-style: none;
}

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

.page-news .news-faq__q::after {
  content: "+";
  flex: 0 0 auto;
  font-family: var(--font-mono);
  font-size: 1.125rem;
  color: var(--gold);
}

.page-news .news-faq__item[open] .news-faq__q {
  border-bottom: 1px solid var(--news-slate);
}

.page-news .news-faq__item[open] .news-faq__q::after {
  content: "−";
}

.page-news .news-faq__a {
  padding: 16px 20px 20px;
}

.page-news .news-faq__a p {
  margin: 0;
  font-size: .9375rem;
  line-height: 1.95;
  color: var(--news-lead);
}

.page-news .news-figure--aside {
  margin-top: 0;
}

.page-news .news-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 22px 0 0;
  padding: 0;
  list-style: none;
}

.page-news .news-tags__item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.page-news .news-tags__item b {
  font-family: var(--font-mono);
  font-size: .75rem;
  font-weight: 700;
  color: var(--gold-lt);
}

.page-news .news-access__note {
  margin-top: 24px;
  padding: 22px 20px;
  border: 1px solid var(--news-slate);
  border-top: 2px solid var(--gold);
  border-radius: var(--radius);
  background: linear-gradient(180deg, rgba(201, 162, 39, .07), rgba(10, 16, 32, 0));
}

.page-news .news-access__note-title {
  margin: 0;
  font-size: .9375rem;
  font-weight: 700;
  color: var(--paper);
}

.page-news .news-access__note-text {
  margin: 12px 0 0;
  font-size: .875rem;
  line-height: 1.9;
  color: var(--news-lead);
}

.page-news .news-access__mail,
.page-news .news-access__link {
  color: var(--gold-lt);
  text-decoration: none;
  border-bottom: 1px solid var(--news-hair);
}

.page-news .news-access__mail:hover,
.page-news .news-access__link:hover {
  border-bottom-color: var(--gold-lt);
}

/* ---------- 响应式 ---------- */
@media (min-width: 760px) {
  .page-news .news-section {
    padding: 86px 0;
  }

  .page-news .news-hero__title {
    max-width: 18ch;
  }

  .page-news .news-item {
    grid-template-columns: 168px minmax(0, 1fr);
    gap: 30px;
    align-items: start;
  }

  .page-news .news-item__side {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    padding-top: 2px;
  }

  .page-news .news-cadence__row {
    grid-template-columns: 180px minmax(0, 1fr);
    gap: 34px;
    align-items: baseline;
  }

  .page-news .news-cadence__side {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .page-news .news-figure {
    margin-top: 52px;
  }
}

@media (min-width: 960px) {
  .page-news .news-series {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 18px;
  }

  .page-news .news-series__card:nth-child(1) {
    grid-column: span 7;
  }

  .page-news .news-series__card:nth-child(2) {
    grid-column: span 5;
  }

  .page-news .news-series__card:nth-child(3) {
    grid-column: span 5;
  }

  .page-news .news-series__card:nth-child(4) {
    grid-column: span 7;
  }

  .page-news .news-access {
    grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
    gap: 44px;
    align-items: start;
  }
}

@media (hover: hover) {
  .page-news .news-item:hover {
    padding-left: 18px;
  }

  .page-news .news-item:hover::before {
    transform: scaleY(1);
  }

  .page-news .news-series__card:hover {
    transform: translateY(-4px);
    border-color: var(--gold-soft);
  }
}

@media (max-width: 420px) {
  .page-news .news-band__item {
    min-width: 136px;
    padding: 18px 20px;
  }

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

@media (prefers-reduced-motion: reduce) {
  .page-news .news-item,
  .page-news .news-item::before,
  .page-news .news-series__card {
    transition: none;
  }

  .page-news .news-item:hover {
    padding-left: 0;
  }
}