.page-news {
  --pn-line: rgba(201, 165, 92, 0.26);
  --pn-hair: rgba(147, 162, 184, 0.18);
  --pn-row-alt: rgba(242, 236, 224, 0.045);
  background: var(--indigo-900);
  color: var(--paper-100);
  font-family: var(--font-body);
  padding-bottom: 8px;
}

.page-news .mono {
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.04em;
}

.page-news .pn-visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* 面包屑 */
.page-news .breadcrumb {
  padding: 20px 0 0;
}

.page-news .breadcrumb__list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 13px;
  color: var(--mist-400);
}

.page-news .breadcrumb__item + .breadcrumb__item::before {
  content: "/";
  margin-right: 8px;
  color: rgba(147, 162, 184, 0.55);
}

.page-news .breadcrumb__link {
  color: var(--mist-400);
  text-decoration: none;
  border-bottom: 1px solid transparent;
}

.page-news .breadcrumb__link:hover,
.page-news .breadcrumb__link:focus-visible {
  color: var(--gold-200);
  border-bottom-color: var(--gold-500);
}

/* 首屏 */
.page-news .pn-hero {
  display: grid;
  gap: 28px;
  padding-top: 20px;
  padding-bottom: 44px;
}

.page-news .pn-hero__title {
  margin: 10px 0 0;
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(30px, 7.4vw, 58px);
  line-height: 1.06;
  letter-spacing: -0.015em;
  color: var(--paper-100);
}

.page-news .pn-hero__title span {
  display: block;
  color: var(--gold-500);
}

.page-news .pn-hero__lede {
  max-width: 32em;
  margin: 18px 0 0;
  font-size: 16px;
  line-height: 1.8;
  color: rgba(242, 236, 224, 0.82);
}

.page-news .pn-hero__jump {
  display: inline-block;
  margin-top: 16px;
  color: var(--gold-200);
  text-decoration: none;
  border-bottom: 1px solid var(--gold-500);
  padding-bottom: 2px;
}

.page-news .pn-hero__jump:hover,
.page-news .pn-hero__jump:focus-visible {
  color: var(--gold-500);
}

.page-news .pn-hero__media {
  margin: 0;
}

/* 摘要带 */
.page-news .pn-ticker {
  display: grid;
  gap: 0;
  margin: 28px 0 0;
  padding: 0;
  border-top: 1px solid var(--pn-line);
}

.page-news .pn-ticker__item {
  display: grid;
  gap: 4px;
  padding: 13px 0;
  border-bottom: 1px solid var(--pn-line);
}

.page-news .pn-ticker dt {
  color: var(--gold-500);
}

.page-news .pn-ticker dd {
  margin: 0;
  font-size: 14px;
  line-height: 1.65;
  color: rgba(242, 236, 224, 0.78);
}

/* 区块通用 */
.page-news .pn-section {
  padding-top: 40px;
  padding-bottom: 40px;
}

.page-news .pn-section__head {
  display: grid;
  gap: 12px;
  margin-bottom: 26px;
}

.page-news .pn-section__title {
  margin: 8px 0 0;
  font-family: var(--font-display);
  font-weight: 800;
  font-size: clamp(23px, 4.4vw, 36px);
  line-height: 1.14;
  letter-spacing: -0.01em;
  color: var(--paper-100);
}

.page-news .pn-section__note {
  margin: 0;
  max-width: 34em;
  font-size: 14px;
  line-height: 1.75;
  color: var(--mist-400);
}

/* 置顶卡片 */
.page-news .pn-pinned {
  display: grid;
  gap: 20px;
}

.page-news .pn-pin {
  position: relative;
  padding: 20px;
  background: var(--indigo-700);
  border: 2px solid var(--indigo-500);
  border-radius: var(--radius);
  box-shadow: var(--shadow-hard);
}

.page-news .pn-pin__index {
  margin: 0 0 10px;
  color: var(--mist-400);
}

.page-news .pn-pin__title {
  margin: 12px 0 8px;
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 19px;
  line-height: 1.35;
  color: var(--paper-100);
}

.page-news .pn-pin__desc {
  margin: 0;
  font-size: 14px;
  line-height: 1.72;
  color: rgba(242, 236, 224, 0.76);
}

.page-news .pn-pin__more {
  margin-top: 16px;
  border-top: 1px solid var(--pn-line);
  padding-top: 12px;
}

.page-news .pn-pin__more summary {
  cursor: pointer;
  list-style: none;
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.04em;
  color: var(--gold-200);
  display: flex;
  align-items: center;
  gap: 8px;
}

.page-news .pn-pin__more summary::-webkit-details-marker {
  display: none;
}

.page-news .pn-pin__more summary::before {
  content: "+";
  font-size: 14px;
  color: var(--gold-500);
}

.page-news .pn-pin__more[open] summary::before {
  content: "−";
}

.page-news .pn-pin__more p {
  margin: 12px 0 0;
  font-size: 14px;
  line-height: 1.75;
  color: rgba(242, 236, 224, 0.78);
}

.page-news .pn-pin__link {
  display: inline-block;
  margin-top: 12px;
  font-size: 13px;
  color: var(--gold-200);
  text-decoration: none;
  border-bottom: 1px solid var(--gold-500);
}

.page-news .pn-pin__link:hover,
.page-news .pn-pin__link:focus-visible {
  color: var(--gold-500);
}

/* 标签 */
.page-news .pn-tag {
  display: inline-block;
  padding: 3px 9px;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.04em;
  border-radius: 2px;
  border: 1px solid transparent;
  white-space: nowrap;
}

.page-news .pn-tag--clay {
  color: #F3D8CC;
  background: rgba(192, 100, 62, 0.26);
  border-color: rgba(192, 100, 62, 0.7);
}

.page-news .pn-tag--gold {
  color: var(--gold-200);
  background: rgba(201, 165, 92, 0.16);
  border-color: rgba(201, 165, 92, 0.6);
}

.page-news .pn-tag--jade {
  color: var(--jade-200);
  background: rgba(95, 160, 139, 0.2);
  border-color: rgba(95, 160, 139, 0.65);
}

.page-news .pn-tag--mist {
  color: var(--mist-400);
  background: rgba(147, 162, 184, 0.14);
  border-color: rgba(147, 162, 184, 0.45);
}

/* 筛选条 */
.page-news .pn-filter {
  position: sticky;
  top: 0;
  z-index: 12;
  background: var(--indigo-900);
  border-top: 1px solid var(--pn-line);
  border-bottom: 1px solid var(--pn-line);
  box-shadow: 0 6px 0 rgba(5, 10, 18, 0.45);
}

.page-news .pn-filter__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 16px;
  padding-top: 12px;
  padding-bottom: 12px;
}

.page-news .pn-filter__label {
  margin: 0;
  color: var(--mist-400);
}

.page-news .pn-filter__set {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  border: 0;
  min-width: 0;
}

.page-news .pn-filter__input {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  pointer-events: none;
}

.page-news .pn-chip {
  position: relative;
  display: inline-block;
  padding: 6px 12px 6px 14px;
  font-size: 13px;
  line-height: 1.4;
  color: rgba(242, 236, 224, 0.8);
  background: var(--indigo-700);
  border: 1px solid var(--pn-hair);
  border-radius: 2px;
  cursor: pointer;
  transition: background 140ms ease-out, color 140ms ease-out, border-color 140ms ease-out;
}

.page-news .pn-chip::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 50%;
  width: 3px;
  height: 0;
  background: var(--clay-600);
  transform: translateY(-50%);
  transition: height 140ms ease-out;
}

.page-news .pn-filter__input:checked + .pn-chip {
  color: var(--gold-200);
  background: var(--indigo-500);
  border-color: var(--gold-500);
}

.page-news .pn-filter__input:checked + .pn-chip::before {
  height: 16px;
}

.page-news .pn-filter__input:focus-visible + .pn-chip {
  outline: 2px solid var(--gold-200);
  outline-offset: 2px;
}

.page-news .pn-chip:hover {
  border-color: var(--gold-500);
}

/* 服务范围横图 */
.page-news .pn-band {
  margin: 0 0 22px;
  background: var(--indigo-700);
  border: 2px solid var(--indigo-500);
  border-radius: var(--radius);
  box-shadow: var(--shadow-soft);
  overflow: hidden;
}

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

.page-news .pn-band__cap {
  padding: 12px 16px;
  font-size: 13px;
  line-height: 1.7;
  color: var(--mist-400);
  border-top: 1px solid var(--pn-line);
}

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

.page-news .pn-item {
  display: grid;
  gap: 8px;
  padding: 16px 12px;
  border-bottom: 1px solid var(--pn-hair);
  transition: background 140ms ease-out;
}

.page-news .pn-item:nth-child(even) {
  background: var(--pn-row-alt);
}

.page-news .pn-item:hover {
  background: rgba(36, 64, 110, 0.42);
}

.page-news .pn-item__time {
  color: var(--mist-400);
}

.page-news .pn-item__title {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 16px;
  line-height: 1.45;
  color: var(--paper-100);
}

.page-news .pn-item__desc {
  margin: 5px 0 0;
  font-size: 14px;
  line-height: 1.72;
  color: rgba(242, 236, 224, 0.72);
}

/* 筛选逻辑：无 :has 支持时全部可见 */
.page-news .pn-list:has(#pn-f-ver:checked) .pn-item:not([data-cat="ver"]) {
  display: none;
}

.page-news .pn-list:has(#pn-f-rule:checked) .pn-item:not([data-cat="rule"]) {
  display: none;
}

.page-news .pn-list:has(#pn-f-range:checked) .pn-item:not([data-cat="range"]) {
  display: none;
}

.page-news .pn-list:has(#pn-f-member:checked) .pn-item:not([data-cat="member"]) {
  display: none;
}

/* 版本节奏 */
.page-news .pn-rhythm {
  display: grid;
  gap: 28px;
  border-top: 1px solid var(--pn-line);
}

.page-news .pn-rhythm__p {
  max-width: 34em;
  margin: 14px 0 0;
  font-family: var(--font-serif);
  font-size: 16px;
  line-height: 1.85;
  color: rgba(242, 236, 224, 0.8);
}

.page-news .pn-stats {
  display: grid;
  gap: 12px;
  margin: 24px 0 22px;
  padding: 0;
}

.page-news .pn-stats__item {
  padding: 12px 14px;
  background: var(--indigo-700);
  border-left: 3px solid var(--gold-500);
}

.page-news .pn-stats dt {
  color: var(--mist-400);
}

.page-news .pn-stats__num {
  margin: 4px 0 0;
  font-family: var(--font-mono);
  font-size: 22px;
  letter-spacing: 0.02em;
  color: var(--gold-200);
}

.page-news .pn-rhythm__media {
  margin: 0;
  align-self: start;
}

/* 回看与订阅 */
.page-news .pn-archive {
  border-top: 1px solid var(--pn-line);
}

.page-news .pn-archive__grid {
  display: grid;
  gap: 24px;
}

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

.page-news .pn-acc summary {
  cursor: pointer;
  list-style: none;
  padding: 14px 0;
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 17px;
  color: var(--paper-100);
  display: flex;
  align-items: center;
  gap: 10px;
}

.page-news .pn-acc summary::-webkit-details-marker {
  display: none;
}

.page-news .pn-acc summary::before {
  content: "";
  width: 10px;
  height: 2px;
  background: var(--gold-500);
  flex: none;
  transition: transform 220ms ease-out;
}

.page-news .pn-acc[open] summary::before {
  transform: rotate(90deg);
}

.page-news .pn-acc[open] summary {
  color: var(--gold-200);
}

.page-news .pn-acc__list {
  margin: 0 0 14px;
  padding: 0 0 0 20px;
  list-style: none;
}

.page-news .pn-acc__list li {
  position: relative;
  padding: 6px 0;
  font-size: 14px;
  line-height: 1.7;
  color: rgba(242, 236, 224, 0.76);
}

.page-news .pn-acc__list li::before {
  content: "";
  position: absolute;
  left: -16px;
  top: 14px;
  width: 6px;
  height: 6px;
  border: 1px solid var(--gold-500);
  border-radius: 50%;
}

.page-news .pn-archive__tip {
  margin: 18px 0 12px;
  font-size: 14px;
  line-height: 1.75;
  color: var(--mist-400);
}

.page-news .pn-archive__link {
  display: inline-block;
  font-size: 14px;
  color: var(--gold-200);
  text-decoration: none;
  border-bottom: 1px solid var(--gold-500);
}

.page-news .pn-archive__link:hover,
.page-news .pn-archive__link:focus-visible {
  color: var(--gold-500);
}

.page-news .pn-sub {
  padding: 20px;
  background: var(--indigo-700);
  border: 2px solid var(--ink-950);
  border-radius: var(--radius);
  box-shadow: var(--shadow-hard);
}

.page-news .pn-sub__title {
  margin: 8px 0 10px;
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 20px;
  line-height: 1.32;
  color: var(--paper-100);
}

.page-news .pn-sub__p {
  margin: 0;
  font-size: 14px;
  line-height: 1.75;
  color: rgba(242, 236, 224, 0.76);
}

.page-news .pn-sub__types {
  margin: 18px 0;
  padding: 0;
  list-style: none;
}

.page-news .pn-sub__types li {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  padding: 8px 0;
  font-size: 14px;
  line-height: 1.65;
  color: rgba(242, 236, 224, 0.8);
  border-bottom: 1px dashed var(--pn-hair);
}

.page-news .pn-sub__dot {
  flex: none;
  width: 8px;
  height: 8px;
  margin-top: 7px;
  border-radius: 50%;
}

.page-news .pn-sub__dot--clay {
  background: var(--clay-600);
}

.page-news .pn-sub__dot--gold {
  background: var(--gold-500);
}

.page-news .pn-sub__dot--jade {
  background: var(--jade-500);
}

.page-news .pn-sub__dot--mist {
  background: var(--mist-400);
}

.page-news .pn-sub__media {
  margin: 18px 0 0;
}

.page-news .pn-sub__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
}

/* 中等屏幕 */
@media (min-width: 720px) {
  .page-news .pn-ticker {
    grid-template-columns: 1fr 1fr;
    column-gap: 32px;
  }

  .page-news .pn-pinned {
    gap: 22px;
  }

  .page-news .pn-section__head {
    grid-template-columns: minmax(0, 1fr) minmax(0, 22em);
    align-items: end;
    gap: 20px 32px;
  }

  .page-news .pn-section__note {
    text-align: right;
  }

  .page-news .pn-item {
    grid-template-columns: 132px 104px minmax(0, 1fr);
    align-items: baseline;
    column-gap: 18px;
    row-gap: 0;
    padding: 18px 16px;
  }

  .page-news .pn-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* 桌面 */
@media (min-width: 960px) {
  .page-news .pn-hero {
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr);
    align-items: start;
    gap: 52px;
    padding-top: 28px;
    padding-bottom: 60px;
  }

  .page-news .pn-section {
    padding-top: 56px;
    padding-bottom: 56px;
  }

  .page-news .pn-pinned {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: start;
    gap: 24px;
  }

  .page-news .pn-pin:nth-child(2) {
    transform: translateY(24px);
  }

  .page-news .pn-pin:nth-child(3) {
    transform: translateY(12px);
  }

  .page-news .pn-item {
    grid-template-columns: 168px 116px minmax(0, 1fr);
    column-gap: 24px;
    padding: 20px 14px;
  }

  .page-news .pn-rhythm {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
    gap: 48px;
    align-items: start;
  }

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

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