/* =========================================================================
   News (list + post)
   =========================================================================
   Page chrome for the news index and permalink pages. Post bodies render via
   the shared `.markdown-content` vocabulary (tokenized with the Manual pass).
   Class prefix `.news-`; filter chips reuse the shared `.saga-chip`.
   ========================================================================= */

.news-toolbar {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 1.5rem;
}

.news-heading { margin-bottom: 1.5rem; }

.news-filters { margin-bottom: 1.5rem; }

/* ---- Post metadata (date + tags) ---------------------------------------- */

.news-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  font-size: 0.875rem;
}

.news-date { font-weight: 500; color: var(--sg-ink-muted); }

.news-tag {
  display: inline-flex;
  align-items: center;
  padding: 0.1875rem 0.625rem;
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  border-radius: var(--sg-radius-pill);
  background: var(--sg-neutral-soft);
  color: var(--sg-ink-muted);
  text-decoration: none;
  transition: background-color var(--sg-transition), color var(--sg-transition);
}

.news-tag:hover {
  background: var(--sg-surface-hover);
  color: var(--sg-ink-strong);
}

/* ---- Post cards --------------------------------------------------------- */

.news-post { display: flex; flex-direction: column; gap: 1rem; }

.news-post-title {
  margin: 0;
  font-size: 1.5rem;
}

.news-post-title a {
  color: var(--sg-ink-strong);
  text-decoration: none;
  transition: color var(--sg-transition);
}

.news-post-title a:hover { color: var(--sg-accent-strong); }

.news-summary { color: var(--sg-ink); }

.news-actions { margin-top: 0.25rem; }

/* ---- Empty state -------------------------------------------------------- */

.news-empty {
  text-align: center;
  padding: 2.5rem 1.5rem;
}

.news-empty h2 { margin: 0; }
.news-empty p { margin-top: 0.5rem; color: var(--sg-ink-muted); }

/* ---- Permalink header --------------------------------------------------- */

.news-article-head {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--sg-edge);
  margin-bottom: 1.5rem;
}

.news-back {
  align-self: flex-start;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--sg-accent-strong);
  text-decoration: none;
}

.news-back:hover { text-decoration: underline; }

.news-article-title { margin: 0; }

.news-eyebrow {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.3em;
  color: var(--sg-ink-muted);
  margin: 0 0 0.5rem;
}