/* ================= 更新记录页 专属样式 ================= */

.page-news {
  --news-rail-w: 62px;
  --news-rail-gap: 26px;
  background: var(--paper);
  color: var(--ink);
  overflow-x: clip;
}

/* ---------- 首屏主题声明 ---------- */
.page-news .page-head {
  padding-top: clamp(26px, 5vw, 52px);
}
.page-news .eyebrow {
  font-family: var(--font-mono);
  font-size: .75rem;
  letter-spacing: .14em;
  color: var(--flag-red);
  margin: 0;
}
.page-news .page-title {
  margin: 14px 0 0;
  font-size: clamp(1.875rem, 7.2vw, 3.5rem);
  line-height: 1.05;
  letter-spacing: -.02em;
  font-weight: 900;
  max-width: 20ch;
  overflow-wrap: break-word;
}
.page-news .page-lede {
  margin: 20px 0 0;
  max-width: 64ch;
  font-size: clamp(1rem, 2.4vw, 1.0625rem);
  line-height: 1.8;
}

.page-news .news-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  background: var(--weave);
  border: 1px solid var(--weave);
  margin: clamp(24px, 4vw, 36px) 0 0;
}
.page-news .news-meta > div {
  background: var(--paper);
  padding: 14px 16px 16px;
  min-width: 0;
}
.page-news .news-meta dt {
  margin: 0;
  font-size: .75rem;
  letter-spacing: .1em;
  color: var(--mist);
}
.page-news .news-meta dd {
  margin: 8px 0 0;
  font-family: var(--font-mono);
  font-size: clamp(1.0625rem, 4vw, 1.375rem);
  font-weight: 600;
  letter-spacing: -.01em;
  color: var(--navy);
}

/* ---------- 通用小节 ---------- */
.page-news .news-section {
  padding-top: clamp(46px, 7.5vw, 92px);
}

.page-news .news-section-head {
  max-width: 66ch;
  margin-bottom: clamp(22px, 3.5vw, 36px);
}
.page-news .news-section-head h2 {
  margin: 0;
  font-size: clamp(1.4375rem, 5vw, 2.25rem);
  line-height: 1.15;
  font-weight: 800;
  letter-spacing: -.02em;
}
.page-news .news-section-head p {
  margin: 14px 0 0;
  font-size: .9375rem;
  line-height: 1.8;
}

/* ---------- 记录规则面板 ---------- */
.page-news .news-rule-panel {
  position: relative;
  background: var(--navy);
  color: var(--paper);
  border: 1px solid var(--navy-soft);
  padding: clamp(26px, 4.5vw, 46px);
}
.page-news .news-rule-panel::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: repeating-linear-gradient(115deg,
    var(--flag-red) 0 6px,
    var(--gold) 6px 9px,
    var(--jade) 9px 15px,
    var(--navy-soft) 15px 22px);
  opacity: .9;
}
.page-news .news-panel-label {
  margin: 0;
  font-family: var(--font-mono);
  font-size: .75rem;
  letter-spacing: .16em;
  color: var(--gold);
}
.page-news .news-rule-panel h2 {
  margin: 12px 0 0;
  font-size: clamp(1.375rem, 4.4vw, 1.875rem);
  line-height: 1.25;
  font-weight: 800;
  letter-spacing: -.02em;
  max-width: 22ch;
}
.page-news .news-rule-list {
  list-style: none;
  margin: clamp(24px, 4vw, 40px) 0 0;
  padding: 0;
  display: grid;
  gap: 22px;
}
.page-news .news-rule {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  column-gap: 14px;
  border-top: 1px solid rgba(244, 239, 230, .16);
  padding-top: 18px;
}
.page-news .news-rule-num {
  grid-row: span 2;
  font-family: var(--font-mono);
  font-size: .8125rem;
  letter-spacing: .04em;
  color: var(--gold);
}
.page-news .news-rule h3 {
  margin: 0;
  font-size: 1.0625rem;
  font-weight: 700;
  letter-spacing: -.005em;
}
.page-news .news-rule p {
  margin: 8px 0 0;
  font-size: .9375rem;
  line-height: 1.75;
  color: rgba(244, 239, 230, .82);
}

/* ---------- 图片容器 ---------- */
.page-news .news-figure {
  margin: 0 0 clamp(24px, 4vw, 40px);
  border: 1px solid var(--weave);
  background: var(--weave);
  overflow: hidden;
}
.page-news .news-figure img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.page-news .news-figure--scroll { aspect-ratio: 4 / 3; }
.page-news .news-figure--weave { aspect-ratio: 16 / 9; }
.page-news .news-figure--coords { aspect-ratio: 20 / 13; margin: 0; }
.page-news .news-figure--night {
  aspect-ratio: 2 / 1;
  margin: clamp(28px, 5vw, 48px) 0 0;
}

/* ---------- 垂直卷轴时间线 ---------- */
.page-news .news-timeline-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.page-news .news-entry {
  display: grid;
  grid-template-columns: var(--news-rail-w) var(--news-rail-gap) minmax(0, 1fr);
  padding-bottom: 28px;
}
.page-news .news-entry-tick {
  font-family: var(--font-mono);
  font-size: .75rem;
  line-height: 1.5;
  letter-spacing: .02em;
  color: var(--mist);
  text-align: right;
  padding: 5px 8px 0 0;
  overflow-wrap: break-word;
}
.page-news .news-entry-rail {
  position: relative;
}
.page-news .news-entry-rail::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 16px;
  bottom: -16px;
  width: 1px;
  background: var(--weave);
  transform: translateX(-50%);
}
.page-news .news-entry-rail::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 7px;
  width: 9px;
  height: 9px;
  transform: translateX(-50%) rotate(45deg);
  background: var(--paper);
  border: 1px solid var(--gold);
  transition: background-color .4s ease, border-color .4s ease;
}
.page-news .news-entry.is-visible .news-entry-rail::after {
  background: var(--gold);
  border-color: var(--gold);
}
.page-news .news-entry:last-child .news-entry-rail::before {
  display: none;
}
.page-news .news-entry-card {
  min-width: 0;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--weave);
}
.page-news .news-entry:last-child .news-entry-card {
  border-bottom: 0;
  padding-bottom: 0;
}
.page-news .news-entry-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  margin-bottom: 10px;
}
.page-news .news-tag {
  font-size: .875rem;
  line-height: 1;
  padding: 5px 9px 6px;
  border: 1px solid currentColor;
  letter-spacing: .04em;
  font-weight: 600;
  white-space: nowrap;
}
.page-news .news-tag--entry { color: var(--flag-red); }
.page-news .news-tag--version { color: var(--navy); }
.page-news .news-tag--adapt { color: var(--jade); }
.page-news .news-tag--check { color: var(--flag-red-deep); }
.page-news .news-tag--index { color: var(--navy-soft); }
.page-news .news-tag--feedback { color: var(--jade); }
.page-news .news-entry-ver {
  font-family: var(--font-mono);
  font-size: .8125rem;
  letter-spacing: -.01em;
  color: var(--navy-soft);
}
.page-news .news-entry-title {
  margin: 0;
  font-size: clamp(1.0625rem, 2.8vw, 1.1875rem);
  line-height: 1.5;
  font-weight: 700;
  letter-spacing: -.01em;
}
.page-news .news-entry-text {
  margin: 8px 0 0;
  font-size: .9375rem;
  line-height: 1.78;
  max-width: 62ch;
}

/* ---------- 月度归档 ---------- */
.page-news .news-tabs { margin-top: clamp(20px, 3.5vw, 32px); }
.page-news .news-tablist {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--weave);
}
.page-news .news-tab {
  font-family: inherit;
  font-size: .875rem;
  line-height: 1;
  padding: 10px 15px 11px;
  background: transparent;
  border: 1px solid var(--weave);
  color: var(--ink);
  cursor: pointer;
}
.page-news .news-tab:hover { border-color: var(--navy-soft); }
.page-news .news-tab[aria-selected="true"] {
  background: var(--navy);
  border-color: var(--navy);
  color: var(--paper);
}
.page-news .news-tab:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 2px;
}
.page-news .news-tabpanel { padding-top: 10px; }
.page-news .news-tabpanel[hidden] { display: none; }

.page-news .news-issue {
  border-bottom: 1px solid var(--weave);
}
.page-news .news-issue:first-of-type {
  border-top: 1px solid var(--weave);
}
.page-news .news-issue-summary {
  display: flex;
  align-items: baseline;
  gap: 14px;
  padding: 16px 2px;
  cursor: pointer;
  list-style: none;
}
.page-news .news-issue-summary::-webkit-details-marker { display: none; }
.page-news .news-issue-summary::marker { content: ""; }
.page-news .news-issue-no {
  font-family: var(--font-mono);
  font-size: 1.125rem;
  font-weight: 600;
  letter-spacing: -.01em;
  color: var(--flag-red);
  min-width: 3ch;
}
.page-news .news-issue-meta {
  font-size: .875rem;
  color: var(--mist);
}
.page-news .news-issue-cue {
  margin-left: auto;
  font-family: var(--font-mono);
  font-size: 1.125rem;
  line-height: 1;
  color: var(--navy-soft);
  transition: transform .25s ease;
}
.page-news .news-issue[open] .news-issue-cue { transform: rotate(45deg); }
.page-news .news-issue-body {
  padding: 0 2px 20px;
}
.page-news .news-issue-body ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 12px;
}
.page-news .news-issue-body li {
  display: grid;
  gap: 4px;
}
.page-news .news-issue-tag {
  font-family: var(--font-mono);
  font-size: .75rem;
  letter-spacing: .06em;
  color: var(--orange);
}
.page-news .news-issue-body p {
  margin: 0;
  font-size: .9375rem;
  line-height: 1.75;
  max-width: 62ch;
}

/* ---------- 检索方式 ---------- */
.page-news .news-search-panel {
  display: grid;
  gap: clamp(24px, 4vw, 40px);
  background: var(--navy);
  color: var(--paper);
  border: 1px solid var(--navy-soft);
  padding: clamp(26px, 4.5vw, 46px);
}
.page-news .news-search-copy { min-width: 0; }
.page-news .news-search-copy h2 {
  margin: 0;
  font-size: clamp(1.375rem, 4.4vw, 1.875rem);
  line-height: 1.2;
  font-weight: 800;
  letter-spacing: -.02em;
}
.page-news .news-search-copy > p {
  margin: 14px 0 0;
  font-size: .9375rem;
  line-height: 1.8;
  color: rgba(244, 239, 230, .84);
  max-width: 56ch;
}
.page-news .news-search-axes {
  list-style: none;
  margin: 24px 0 0;
  padding: 0;
}
.page-news .news-search-axes li {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr);
  gap: 14px;
  align-items: baseline;
  padding: 14px 0;
  border-top: 1px solid rgba(244, 239, 230, .16);
}
.page-news .news-search-axes li:last-child {
  border-bottom: 1px solid rgba(244, 239, 230, .16);
}
.page-news .news-axis-name {
  font-family: var(--font-mono);
  font-size: .8125rem;
  letter-spacing: .04em;
  color: var(--gold);
}
.page-news .news-search-axes p {
  margin: 0;
  font-size: .875rem;
  line-height: 1.75;
  color: rgba(244, 239, 230, .84);
}
.page-news .news-inline-link {
  display: inline-block;
  margin-top: 22px;
  font-size: .9375rem;
  color: var(--gold);
  text-decoration: none;
  padding-bottom: 2px;
  border-bottom: 1px solid rgba(232, 179, 60, .5);
}
.page-news .news-inline-link:hover {
  border-bottom-color: var(--gold);
}

/* ---------- 条目示例 ---------- */
.page-news .news-specimen {
  border: 1px solid var(--weave);
  border-left: 4px solid var(--flag-red);
  padding: clamp(22px, 4vw, 38px);
  background: var(--paper);
}
.page-news .news-specimen-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
}
.page-news .news-specimen-no {
  font-family: var(--font-mono);
  font-size: .8125rem;
  color: var(--mist);
}
.page-news .news-specimen-title {
  margin: 16px 0 0;
  font-size: clamp(1.1875rem, 3.4vw, 1.5rem);
  line-height: 1.4;
  font-weight: 800;
  letter-spacing: -.015em;
}
.page-news .news-specimen-text {
  margin: 14px 0 0;
  font-size: 1rem;
  line-height: 1.85;
  max-width: 68ch;
}
.page-news .news-specimen-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  background: var(--weave);
  border: 1px solid var(--weave);
  margin: 24px 0 0;
}
.page-news .news-specimen-fields > div {
  background: var(--paper);
  padding: 12px 14px 14px;
  min-width: 0;
}
.page-news .news-specimen-fields dt {
  margin: 0;
  font-size: .75rem;
  letter-spacing: .08em;
  color: var(--mist);
}
.page-news .news-specimen-fields dd {
  margin: 7px 0 0;
  font-family: var(--font-mono);
  font-size: .875rem;
  color: var(--navy);
  overflow-wrap: break-word;
}

/* ---------- 回看路径 ---------- */
.page-news .news-steps {
  list-style: none;
  counter-reset: pstep;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 24px;
}
.page-news .news-step {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  column-gap: 16px;
  border-top: 1px solid var(--weave);
  padding-top: 18px;
}
.page-news .news-step::before {
  counter-increment: pstep;
  content: counter(pstep, decimal-leading-zero);
  font-family: var(--font-mono);
  font-size: 1rem;
  letter-spacing: -.01em;
  color: var(--orange);
}
.page-news .news-step > div { min-width: 0; }
.page-news .news-step h3 {
  margin: 0;
  font-size: 1.0625rem;
  font-weight: 700;
  letter-spacing: -.005em;
}
.page-news .news-step p {
  margin: 8px 0 0;
  font-size: .9375rem;
  line-height: 1.8;
  max-width: 62ch;
}
.page-news .news-path-note {
  margin: clamp(26px, 4vw, 38px) 0 0;
  font-size: .9375rem;
  line-height: 1.85;
  max-width: 70ch;
  border-left: 3px solid var(--jade);
  padding-left: 16px;
}
.page-news .news-text-link {
  color: var(--flag-red);
  text-decoration: none;
  border-bottom: 1px solid var(--weave);
}
.page-news .news-text-link:hover {
  border-bottom-color: var(--flag-red);
}

/* ================= 响应式 ================= */
@media (min-width: 640px) {
  .page-news .news-meta { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .page-news .news-specimen-fields { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (min-width: 768px) {
  .page-news {
    --news-rail-w: 96px;
    --news-rail-gap: 34px;
  }
  .page-news .news-figure--scroll { aspect-ratio: 2 / 1; }
  .page-news .news-figure--weave { aspect-ratio: 2 / 1; }
  .page-news .news-figure--night { aspect-ratio: 8 / 3; }
  .page-news .news-entry { padding-bottom: 34px; }
  .page-news .news-rule-list { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; }
  .page-news .news-rule { padding-right: 24px; }
  .page-news .news-rule + .news-rule {
    border-left: 1px solid rgba(244, 239, 230, .16);
    padding-left: 24px;
  }
}

@media (min-width: 900px) {
  .page-news .news-search-panel {
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    align-items: start;
  }
  .page-news .news-rule-panel { padding: 48px 52px; }
}

@media (prefers-reduced-motion: reduce) {
  .page-news .news-issue-cue,
  .page-news .news-entry-rail::after { transition: none; }
}