/**
 * /news family — Dark appearance.
 * Remaps existing --zn-* / listing chrome. Light Mode unchanged.
 * Presentation only.
 */

html:not(.light) .news-page.zn-page {
  --zn-bg: var(--zs-bg-void, #030504);
  --zn-soft: var(--zs-surface-1, #0b1110);
  --zn-soft-2: var(--zs-surface-2, #101412);
  --zn-border: var(--zs-border-soft, rgba(255, 255, 255, 0.08));
  --zn-text: var(--zs-text-primary, #f5f7fa);
  --zn-secondary: var(--zs-text-secondary, rgba(255, 255, 255, 0.82));
  --zn-muted: var(--zs-text-muted, rgba(255, 255, 255, 0.66));
  background: var(--zn-bg) !important;
  color: var(--zn-text) !important;
}

html:not(.light) .news-page.zn-page :is(
  .zn-strip,
  .zn-cat,
  .zn-support-row,
  .zn-support-chevron-wrap,
  .zn-side-card,
  .zn-mover-tile,
  .zn-latest-panel,
  .zn-latest-row
) {
  background: var(--zn-soft) !important;
  border-color: var(--zn-border) !important;
  color: var(--zn-text);
}

html:not(.light) .news-page.zn-page .zn-cat {
  color: var(--zn-secondary) !important;
}

html:not(.light) .news-page.zn-page .zn-cat.is-active {
  background: var(--zs-surface-3, #141916) !important;
  color: var(--zn-text) !important;
  border-color: var(--zs-border-mid, rgba(255, 255, 255, 0.12)) !important;
}

html:not(.light) .news-page.zn-page .zn-latest-row:hover,
html:not(.light) .news-page.zn-page .zn-cat:hover {
  background: var(--zn-soft-2) !important;
}

html:not(.light) .news-page.zn-page :is(h1, h2, h3, .zn-title, .zn-side-title, .zn-mover-tile-sym, .zn-mover-tile-price) {
  color: var(--zn-text) !important;
}

html:not(.light) .news-page.zn-page :is(.zn-muted, .zn-secondary, .zn-strip-chevron) {
  color: var(--zn-muted) !important;
}

html:not(.light) .news-page.zn-page :is(input, select, textarea) {
  background: var(--zn-soft-2) !important;
  color: var(--zn-text) !important;
  border-color: var(--zn-border) !important;
}

html:not(.light) .news-page.zn-page :is(.zn-skel, .zn-skel-featured, .zn-skel-row, .zn-skel-side, .zn-skel-side-sm) {
  background: rgba(255, 255, 255, 0.07) !important;
}

html:not(.light) .zs-na-page {
  --na-bg: var(--zs-bg-void, #030504);
  --na-text: var(--zs-text-primary, #f5f7fa);
  --na-muted: var(--zs-text-muted, rgba(255, 255, 255, 0.66));
  --na-line: var(--zs-border-soft, rgba(255, 255, 255, 0.08));
  --na-panel: var(--zs-surface-1, #0b1110);
  --na-accent: var(--zs-text-primary, #f5f7fa);
  background: var(--na-bg) !important;
  color: var(--na-text) !important;
}

html:not(.light) .zs-na-page :is(h1, h2, .zs-na-headline) {
  color: var(--na-text) !important;
}

/* Desktop V2 — hero inks that were literals in news-theme.css (#1f2937 support
   line, #4b5565 description) rendered dark-on-dark in Dark at every width.
   Bound to this family's own dark tokens. (Mobile V2 carried the same fix for
   < 1024px in its route contract; this makes it the family default.) */
html:not(.light) .news-page.zn-page .zn-hero-support {
  color: var(--zn-secondary) !important;
}

html:not(.light) .news-page.zn-page .zn-hero-desc {
  color: var(--zn-muted) !important;
}