/* wgf-news.css - patch-news feed (/news/ index + /news/<slug>/ per-build changelog).
   THE KIT RE-CUT (2026-07-03): the feed wears the in-game chrome kit (wgf-chrome.css,
   loaded first) - near-black tooltip-plate build cards and changelog rows, squared plate
   count chips (no pills), gold small-caps headers. Vanilla CSS, tokens only; coin markup +
   the item tooltip card come from the shared kit, this sheet only styles the feed layout. */

/* ── index: build cards on the near-black tooltip plate ── */
.wgf-news-grid {
  display: grid; gap: 12px;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
}
.wgf-news-card {
  display: flex; flex-direction: column; gap: var(--space-1); padding: var(--space-3) var(--space-3);
  border-radius: 5px; border: 1px solid var(--wgf-metal);
  background: linear-gradient(180deg, rgba(12, 12, 30, 0.97), rgba(5, 5, 16, 0.97));
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.55);
  text-decoration: none; color: var(--wgf-text);
  transition: border-color .12s ease;
}
.wgf-news-card:hover { border-color: var(--wgf-gold, var(--wgf-gold-primary)); }
.wgf-news-card__eyebrow {
  font-family: var(--font-game); font-size: 12px; letter-spacing: .04em; font-variant: small-caps;
  color: var(--wgf-gold-muted);
}
.wgf-news-card__title {
  font-family: var(--font-game); font-variant: small-caps; letter-spacing: .02em;
  font-size: 16px; font-weight: 650; color: var(--wgf-gold-bright);
  text-shadow: var(--text-ink-outline);
}
.wgf-news-card__chips { display: flex; flex-wrap: wrap; gap: var(--space-1); margin-top: 2px; }
.wgf-news-card__date { font-size: 12px; color: var(--wgf-muted); margin-top: 2px; }
.wgf-news-empty { color: var(--wgf-muted); }

/* ── count chips = squared plate chips (container standard: pills are dead) ── */
.wgf-news-chiprow { display: flex; flex-wrap: wrap; gap: var(--space-1); margin-top: var(--space-2); }
.wgf-news-chip {
  display: inline-block; padding: 2px var(--space-2); border-radius: 3px; font-size: 12px;
  background: var(--wgf-well); border: 1px solid var(--wgf-metal-soft);
  color: var(--wgf-text); font-variant-numeric: tabular-nums;
}
.wgf-news-chip--muted { color: var(--wgf-muted); }

/* ── per-build: family sections ── */
.wgf-news-family { scroll-margin-top: 80px; }
.wgf-news-sub { margin: 0 0 var(--space-3); }
.wgf-news-sub__h {
  font-family: var(--font-game); font-variant: small-caps; letter-spacing: .03em;
  font-size: 14px; font-weight: 600; margin: 0 0 var(--space-1); color: var(--wgf-gold-muted);
}
.wgf-news-sub__n { color: var(--wgf-muted); font-weight: 500; }
.wgf-news-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-1); }
/* changelog rows = the near-black tooltip-surface plate, lighting on hover */
.wgf-news-item {
  display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-2);
  padding: var(--space-2) var(--space-3); border-radius: 5px;
  border: 1px solid transparent;
  background: linear-gradient(180deg, rgba(12, 12, 30, 0.92), rgba(5, 5, 16, 0.92));
  transition: border-color .12s ease;
}
.wgf-news-item:hover { border-color: var(--wgf-metal-soft); }
.wgf-news-icon { border-radius: 3px; flex: 0 0 auto; border: 1px solid rgba(0,0,0,.6); background: #000; }
.wgf-news-item__name { flex: 0 0 auto; font-weight: 550; }
.wgf-news-item__name a { color: var(--wgf-gold); text-decoration: none; }
.wgf-news-item__name a:hover { text-decoration: underline; }
.wgf-news-name { color: var(--wgf-muted); }

/* ── per-build: field deltas (old → new) ── */
.wgf-news-deltas { display: flex; flex-wrap: wrap; gap: var(--space-1) var(--space-3); font-size: 13px; }
.wgf-news-delta {
  display: inline-flex; align-items: baseline; gap: var(--space-1);
  font-variant-numeric: tabular-nums;
}
.wgf-news-delta__f { color: var(--wgf-muted); }
.wgf-news-delta__o { color: var(--wgf-muted); text-decoration: line-through; opacity: .75; }
.wgf-news-delta__arrow { color: var(--wgf-muted); }
.wgf-news-delta__n { color: var(--wgf-text); font-weight: 550; }
.wgf-news-none { color: var(--wgf-muted); }

/* ── show-all disclosure ── */
.wgf-news-more { margin-top: var(--space-1); }
.wgf-news-more > summary {
  cursor: pointer; color: var(--wgf-gold); font-size: 13px; padding: var(--space-1) 0;
  list-style: none;
}
.wgf-news-more > summary::-webkit-details-marker { display: none; }
.wgf-news-more > summary:hover { text-decoration: underline; }
.wgf-news-more[open] > summary { margin-bottom: var(--space-1); }