Redesign category + tag filter UI: sidebar, popover, mobile sheets

Replaces the link-based subcategory/facet pill rows with a real
client-side faceted filter, matching the attached design:

- Desktop: a persistent 'Browse category' sidebar (subcategory list
  with static counts) + a 'Filters' button that opens a popover with
  one chip group per facet, an applied-filters chip row, and a live
  'N resources' / 'Show N results' count.
- Mobile: the sidebar and popover become two toolbar buttons that open
  bottom sheets — Browse category, and Filters (collapsible accordion
  groups, sticky Clear all / Show N results footer).
- Filtering is now genuinely combinable (category AND every selected
  facet, OR within a facet's own values) and updates the grid live,
  instead of linking off to a separate taxonomy term page per click.
- Category counts are still server-rendered per section (accurate,
  static); the live result count and card visibility are client-side,
  driven by a small per-section JSON payload embedded in the page
  (static/js/resource-filters.js) — no fetch, works progressively
  (full card grid is still real HTML/SEO-visible with no JS).
- Card tag chips trimmed from up to 4 down to 2 (subcategory + one
  facet value), matching the design's card density.
- Sections with no schema entry (Press & News) or no facets/subcategories
  yet (empty Member Directory) simply don't render the controls that
  wouldn't do anything — no dead buttons.

Fixed two bugs while wiring this up:
- The filters popover was positioned absolute against .resources-content
  (the whole scrollable card column) instead of the toolbar, so it
  rendered far below the fold — moved it inside a small relatively
  positioned wrapper around the Filters button.
- Go's html/template auto-escapes script tag bodies as a JS string
  literal unless told otherwise, so the embedded JSON payload was
  double-encoded (a JSON string containing JSON, not an object) —
  piped through the safeJS template function to fix.

Scope note: the old 'Year' filter row (event_year taxonomy) isn't part
of the attached design and has been dropped from the UI; the taxonomy
and its term pages still exist, just with no link pointing at them
from the section page anymore.

Author: Mazizova

assets/scss/_light-theme.scss

@@ -260,14 +260,83 @@
   .taxonomy-term-name { color: #334155; }
   .taxonomy-term-count { color: #0272a5; background: rgba(0,200,255,0.08); }
 
-  .resource-filter-pill {
-    border-color: transparent;
+  // Category sidebar + faceted filters (redesign)
+  .cat-item {
     color: #64748b;
-    background: #eef2f7;
-    &:hover { color: #334155; background: #e2e8f0; border-color: transparent; }
-    &.active { color: #0272a5; background: rgba(0, 200, 255, 0.1); border-color: transparent; }
+    &:hover { background: #f1f5f9; color: #0f172a; }
+    &.cat-item--active { background: rgba(0, 200, 255, 0.08); color: #0272a5; }
+  }
+  .cat-count { color: #94a3b8; }
+  .cat-item--active .cat-count { color: #0272a5; }
+
+  .filter-toolbar-count,
+  .mobile-count { color: #64748b; }
+
+  .filter-btn,
+  .toolbar-btn {
+    background: #ffffff;
+    border-color: #dde3ed;
+    color: #0f172a;
+    &:hover { border-color: rgba(0, 200, 255, 0.35); }
+    &.filter-btn--active {
+      border-color: rgba(0, 200, 255, 0.5);
+      color: #0272a5;
+      background: rgba(0, 200, 255, 0.08);
+    }
+  }
+
+  .badge { background: #0ea5e9; color: #ffffff; }
+
+  .applied-chip {
+    border-color: rgba(0, 200, 255, 0.35);
+    background: rgba(0, 200, 255, 0.08);
+    color: #0272a5;
+  }
+  .applied-chips-clear {
+    color: #64748b;
+    &:hover { color: #0f172a; }
+  }
+
+  .filters-popover,
+  .bottom-sheet {
+    background: #ffffff;
+    border-color: #dde3ed;
+    box-shadow: 0 24px 60px rgba(15, 23, 42, 0.14);
+  }
+
+  .filters-popover-header,
+  .sheet-header { color: #0f172a; }
+
+  .popover-close {
+    color: #94a3b8;
+    &:hover { color: #0f172a; }
+  }
+
+  .filters-clear-link {
+    color: #64748b;
+    &:hover { color: #0f172a; }
+  }
+
+  .facet-group { border-bottom-color: #dde3ed; }
+  .accordion-row { color: #0f172a; }
+  .accordion-title { color: #94a3b8; }
+  .accordion-chevron { color: #94a3b8; }
+
+  .chip {
+    border-color: #dde3ed;
+    color: #64748b;
+    background: #ffffff;
+    &:hover { color: #0f172a; border-color: rgba(0, 200, 255, 0.3); }
+    &.chip--selected {
+      border-color: rgba(0, 200, 255, 0.5);
+      background: rgba(0, 200, 255, 0.08);
+      color: #0272a5;
+    }
   }
 
+  .sheet-handle { background: #dde3ed; }
+  .sheet-footer { border-top-color: #dde3ed; }
+
   .resource-count {
     background: rgba(0, 200, 255, 0.08);
     border-color: rgba(0, 200, 255, 0.2);