/* Horizontal category filter pills (Explore feed and Map panel). Uses the page theme variables. */
.feed-pills {
  display: flex; gap: 8px; margin: 0 0 18px; padding: 2px 2px 6px; overflow-x: auto; scrollbar-width: none;
  -webkit-overflow-scrolling: touch; scroll-snap-type: x proximity;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 12px, #000 calc(100% - 24px), transparent 100%);
          mask-image: linear-gradient(90deg, transparent 0, #000 12px, #000 calc(100% - 24px), transparent 100%);
}
.feed-pills::-webkit-scrollbar { display: none; }
.feed-pill {
  flex: none; display: inline-flex; align-items: center; gap: 7px; scroll-snap-align: start;
  padding: 9px 16px; border-radius: 999px; cursor: pointer;
  font: inherit; font-size: .88rem; font-weight: 600; white-space: nowrap;
  color: var(--text); background: var(--card); border: 1.5px solid var(--border);
  transition: background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.feed-pill:hover { border-color: var(--teal); color: var(--teal); transform: translateY(-1px); }
.feed-pill:focus-visible { outline: 3px solid var(--gold); outline-offset: 2px; }
.feed-pill[aria-pressed="true"] {
  background: linear-gradient(135deg, #1A9B8E, #0c3d38); color: #fff; border-color: transparent;
  box-shadow: 0 6px 16px rgba(26, 155, 142, .3);
}
.feed-pill .pill-ico { font-size: 1rem; line-height: 1; }
.pill-count {
  min-width: 1.6em; padding: 1px 6px; border-radius: 999px; font-size: .72rem; font-weight: 700; text-align: center;
  font-variant-numeric: tabular-nums; background: color-mix(in srgb, var(--teal) 12%, transparent); color: var(--teal);
}
.pill-count:empty { display: none; }
.feed-pill[aria-pressed="true"] .pill-count { background: rgba(255, 255, 255, .2); color: #FFE066; }
@media (prefers-reduced-motion: reduce) { .feed-pill { transition: none; } }
