/* ===== 新闻中心（服务器渲染页面） ===== */
#site-nav, #site-cta, #site-foot { display: contents; }
.nl-search { position: relative; display: flex; align-items: center; gap: var(--space-2); margin-top: var(--space-8); max-width: 560px; padding: 6px 6px 6px var(--space-4); border: 1px solid var(--line-strong); border-radius: var(--radius-lg); background: var(--surface-100); }
.nl-search:focus-within { border-color: var(--synapse); box-shadow: var(--glow-ai); }
.nl-caret { font-family: var(--font-mono); color: var(--synapse); }
.nl-search input { flex: 1; min-width: 0; font: inherit; font-size: 15px; height: 36px; border: 0; background: transparent; color: var(--ink); }
.nl-search input:focus { outline: none; }
.nl-cats { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-6); }
.nl-cat { font-size: 14px; line-height: 20px; padding: 8px var(--space-4); border-radius: var(--radius-sm); border: 1px solid var(--line); background: var(--surface-100); color: var(--ink-muted); text-decoration: none; }
.nl-cat i { font-style: normal; font-family: var(--font-mono); font-size: 12px; margin-left: 4px; opacity: .8; }
.nl-cat:hover { color: var(--ink); border-color: var(--line-strong); }
.nl-cat.is-on { background: var(--helix); border-color: var(--helix); color: var(--on-helix); }
.nl-cat:focus-visible, .nl-feat:focus-visible, .nl-pager a:focus-visible { outline: 2px solid transparent; box-shadow: var(--focus-ring); }
.nl-result { padding: var(--space-8) var(--space-16) 0; }
.nl-feat { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); margin: var(--space-12) var(--space-16) 0; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface-100); overflow: hidden; color: var(--ink); text-decoration: none; transition: border-color .2s; }
.nl-feat:hover { border-color: color-mix(in srgb, var(--synapse) 60%, var(--line)); }
.nl-feat-cover { aspect-ratio: 16 / 9; background: var(--surface-000); overflow: hidden; }
.nl-feat-cover img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s; }
.nl-feat:hover .nl-feat-cover img { transform: scale(1.03); }
.nl-feat-cover.is-empty { background-image: radial-gradient(circle at 1px 1px, var(--line-strong) 1px, transparent 1.5px); background-size: 16px 16px; display: flex; align-items: flex-end; padding: var(--space-6); box-sizing: border-box; }
.nl-feat-body { padding: var(--space-8); display: flex; flex-direction: column; gap: var(--space-3); justify-content: center; }
.nl-feat-body h2 { margin: var(--space-2) 0 0; font-family: var(--font-display); font-size: 28px; line-height: 38px; font-weight: 600; }
.nl-feat-body p { margin: 0; font-size: 15px; line-height: 26px; color: var(--ink-muted); display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.nl-grid { padding: var(--space-6) var(--space-16) 0; }
.nl-empty { padding: var(--space-16); color: var(--ink-muted); }
.nl-pager { display: flex; justify-content: center; align-items: center; gap: var(--space-2); padding: var(--space-12) var(--space-4) 0; font-family: var(--font-mono); font-size: 13px; }
.nl-pager a, .nl-pager b, .nl-pager span { padding: 6px 10px; border-radius: var(--radius-sm); color: var(--ink-muted); text-decoration: none; }
.nl-pager a:hover { color: var(--ink); background: var(--surface-200); }
.nl-pager b { color: var(--on-helix); background: var(--helix); }
.nl-pager .is-off { opacity: .4; }

/* 正文页 */
.na-progress { position: fixed; top: 0; left: 0; right: 0; height: 2px; z-index: 40; transform-origin: 0 50%; transform: scaleX(0); background: linear-gradient(90deg, var(--helix), var(--synapse), var(--lumen)); }
.na-preview { position: sticky; top: 0; z-index: 41; padding: 8px 16px; background: var(--reagent-soft); color: var(--reagent); font-size: 14px; text-align: center; }
.na-preview a { color: inherit; }
.na-head { position: relative; overflow: hidden; padding: var(--space-16) var(--space-16) var(--space-8); }
.na-head > :not(.sh-hero-bg) { position: relative; }
.na-crumb a { color: inherit; text-decoration: none; } .na-crumb a:hover { color: var(--helix); } .na-crumb span { margin: 0 4px; }
.na-head h1 { margin: var(--space-4) 0 0; font-family: var(--font-display); font-size: 44px; line-height: 56px; font-weight: 700; letter-spacing: -.01em; max-width: 960px; }
.na-meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); margin-top: var(--space-6); }
.na-copy { font: inherit; font-size: 12px; padding: 4px 10px; border-radius: var(--radius-sm); border: 1px solid var(--line-strong); background: transparent; color: var(--ink-muted); cursor: pointer; }
.na-copy:hover { color: var(--helix); border-color: var(--helix); }
.na-copy:focus-visible { outline: 2px solid transparent; box-shadow: var(--focus-ring); }
.na-lead { margin: var(--space-6) 0 0; max-width: 820px; font-size: 18px; line-height: 32px; color: var(--ink-muted); }
.na-cover { margin: 0 var(--space-16); border-radius: var(--radius-md); overflow: hidden; border: 1px solid var(--line); background: var(--surface-100); }
.na-cover img { display: block; width: 100%; max-height: 560px; object-fit: cover; }
.na-grid { display: grid; grid-template-columns: 240px minmax(0, 760px); gap: var(--space-12); padding: var(--space-12) var(--space-16) 0; justify-content: start; }
.na-side { position: relative; }
.na-toc { position: sticky; top: 96px; }
.na-toc ol { list-style: none; margin: var(--space-3) 0 0; padding: 0; border-left: 1px solid var(--line); }
.na-toc li.lv3 a { padding-left: 28px; font-size: 13px; }
.na-toc a { display: flex; gap: var(--space-2); padding: 6px 0 6px var(--space-3); margin-left: -1px; border-left: 2px solid transparent; font-size: 14px; line-height: 20px; color: var(--ink-muted); text-decoration: none; }
.na-toc a i { font-style: normal; font-family: var(--font-mono); font-size: 11px; color: var(--synapse); padding-top: 1px; }
.na-toc a:hover { color: var(--ink); }
.na-toc a.is-on { color: var(--ink); border-left-color: var(--helix); }
.na-prose { font-size: 17px; line-height: 1.95; color: var(--ink); counter-reset: h2; word-break: break-word; }
.na-prose > :first-child { margin-top: 0; }
.na-prose p { margin: 0 0 1.1em; }
.na-prose h2 { counter-increment: h2; position: relative; margin: 2.2em 0 .8em; padding-top: var(--space-4); border-top: 1px solid var(--line); font-family: var(--font-display); font-size: 26px; line-height: 36px; font-weight: 600; scroll-margin-top: 96px; }
.na-prose h2::before { content: counter(h2, decimal-leading-zero); display: block; margin-bottom: var(--space-2); font-family: var(--font-mono); font-size: 12px; line-height: 16px; letter-spacing: .08em; color: var(--synapse); }
.na-prose h3 { margin: 1.8em 0 .6em; font-size: 20px; line-height: 30px; font-weight: 600; scroll-margin-top: 96px; }
.na-prose h4 { margin: 1.4em 0 .5em; font-size: 17px; font-weight: 600; }
.na-prose a { color: var(--helix); text-underline-offset: 3px; }
.na-prose strong, .na-prose b { color: var(--ink); font-weight: 600; }
.na-prose img, .na-prose video { display: block; max-width: 100%; height: auto; margin: 1.6em auto; border-radius: var(--radius-md); border: 1px solid var(--line); background: var(--surface-100); }
.na-prose figure { margin: 1.6em 0; } .na-prose figure img { margin: 0 auto; }
.na-prose figcaption { margin-top: var(--space-2); text-align: center; font-size: 13px; line-height: 20px; color: var(--ink-muted); }
.na-prose ul, .na-prose ol { margin: 0 0 1.1em; padding-left: 1.4em; }
.na-prose ul { list-style: none; padding-left: 0; }
.na-prose ul li { position: relative; padding-left: 1.4em; }
.na-prose ul li::before { content: "+"; position: absolute; left: 0; font-family: var(--font-mono); color: var(--synapse); }
.na-prose li { margin: .3em 0; }
.na-prose blockquote { position: relative; margin: 1.6em 0; padding: var(--space-6) var(--space-6) var(--space-6) var(--space-12); border-radius: var(--radius-md); background: var(--surface-100); color: var(--ink); }
.na-prose blockquote::before { content: "“"; position: absolute; left: var(--space-4); top: var(--space-2); font-family: var(--font-display); font-size: 44px; line-height: 1; color: var(--synapse); }
.na-prose blockquote p:last-child { margin-bottom: 0; }
.na-prose table { width: 100%; margin: 1.6em 0; border-collapse: collapse; font-size: 15px; line-height: 1.6; display: block; overflow-x: auto; }
.na-prose th, .na-prose td { padding: 10px 12px; border: 1px solid var(--line); text-align: left; vertical-align: top; }
.na-prose th { background: var(--surface-200); font-weight: 600; }
.na-prose pre { margin: 1.4em 0; padding: var(--space-4); border-radius: var(--radius-md); background: var(--surface-100); overflow-x: auto; font-size: 14px; line-height: 1.6; }
.na-prose code { font-family: var(--font-mono); font-size: .9em; }
.na-prose hr { border: 0; border-top: 1px solid var(--line); margin: 2em 0; }
.na-pn { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-6); margin: var(--space-16) var(--space-16) 0; padding-top: var(--space-8); border-top: 1px solid var(--line); }
.na-pn a { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-6); border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface-100); color: var(--ink); text-decoration: none; }
.na-pn a:hover { border-color: var(--helix); }
.na-pn a.is-next { text-align: right; grid-column: 2; }
.na-pn b { font-size: 16px; line-height: 26px; font-weight: 500; }
@media (max-width: 1100px) { .na-grid { grid-template-columns: minmax(0, 1fr); } .na-side { display: none; } }
@media (max-width: 900px) {
  .nl-feat { grid-template-columns: 1fr; margin: var(--space-8) var(--space-4) 0; }
  .nl-feat-body { padding: var(--space-6) var(--space-4); } .nl-feat-body h2 { font-size: 22px; line-height: 32px; }
  .nl-grid, .nl-result { padding-left: var(--space-4); padding-right: var(--space-4); }
  .nl-empty { padding: var(--space-8) var(--space-4); }
  .na-head { padding: var(--space-12) var(--space-4) var(--space-6); }
  .na-head h1 { font-size: 28px; line-height: 38px; }
  .na-cover { margin: 0 var(--space-4); }
  .na-grid { padding: var(--space-8) var(--space-4) 0; }
  .na-prose { font-size: 16px; }
  .na-pn { grid-template-columns: 1fr; margin: var(--space-12) var(--space-4) 0; } .na-pn a.is-next { grid-column: auto; }
}
