#news-feed {
  --nf-ink: #132e41;
  --nf-secondary: #526169;
  --nf-line: #c9ccc3;
  color: var(--nf-ink);
}
#news-feed a { color: inherit; text-decoration: none; }
#news-feed .nf-toolbar, #news-feed .nf-footer {
  display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: .8rem 1.5rem;
}
#news-feed .nf-toolbar { margin-bottom: 1.15rem; }
#news-feed .nf-filters { display: flex; flex-wrap: wrap; gap: .5rem; }
#news-feed .nf-filter {
  font: inherit; font-size: .83rem; font-weight: 650; cursor: pointer;
  border: 1px solid var(--nf-line); padding: .62rem 1rem; border-radius: 2rem;
  background: transparent; color: var(--nf-ink); line-height: 1.2;
}
#news-feed .nf-filter[aria-pressed="true"] { background: var(--nf-ink); border-color: var(--nf-ink); color: #fffaf0; }
#news-feed .nf-filter:hover { border-color: var(--nf-ink); }
#news-feed .nf-rss, #news-feed .nf-source { font-size: .82rem; font-weight: 650; }
#news-feed .nf-rss { display: inline-flex; gap: .4rem; align-items: center; padding: .45rem 0; }
#news-feed .nf-rss svg { display: block; width: 1rem; height: 1rem; }
#news-feed .nf-list { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--nf-line); }
#news-feed .nf-item { padding: 0; margin: 0; border-bottom: 1px solid var(--nf-line); }
#news-feed .nf-story { display: flex; align-items: center; justify-content: space-between; gap: 1.2rem; padding: 1rem .15rem; }
#news-feed .nf-body { display: grid; gap: .35rem; min-width: 0; }
#news-feed .nf-meta { font-size: .68rem; font-weight: 650; color: var(--nf-secondary); letter-spacing: .055em; text-transform: uppercase; }
#news-feed .nf-title { font-weight: 550; line-height: 1.35; font-size: clamp(1rem, .94rem + .25vw, 1.2rem); overflow-wrap: anywhere; }
#news-feed .nf-arrow { flex: 0 0 auto; font-size: 1.1rem; transition: transform .18s ease; }
#news-feed .nf-story:hover .nf-title, #news-feed .nf-rss:hover, #news-feed .nf-source:hover { text-decoration: underline; text-underline-offset: .18em; }
#news-feed .nf-story:hover .nf-arrow { transform: translate(2px,-2px); }
#news-feed .nf-footer { padding-top: .85rem; align-items: baseline; }
#news-feed .nf-state { font-size: .78rem; color: var(--nf-secondary); line-height: 1.4; }
#news-feed :focus-visible { outline: 2px solid #8c5d1b; outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { #news-feed .nf-arrow { transition: none; } }
