Clean. Here's what's live now:

- **Tag filter bar** appears above the grid whenever any download has tags assigned. Chips for "All" + each unique tag, centered under the heading.
- **Clicking a tag** filters the grid to only matching downloads. Clicking the active tag again (or "All") clears the filter.
- **Empty state** — if a tag has no results it shows a friendly message instead of a blank grid.
- The filter only shows when tags exist — so it's invisible today (your 3 current downloads have no tags) and appears automatically once you start tagging items in the admin.

To use it: go to Admin → Downloads → edit a download item → add tags like `Colossians`, `Worksheet`, `Devotional`. Those tags will show up as filter chips on the public page instantly after publishing.

src/App.tsx

@@ -782,26 +782,45 @@ function PodcastHighlightsSection({ content }: { content: SiteContent }) {
 function DownloadLibrarySection({ content }: { content: SiteContent }) {
   const resources = (content.customLinks ?? []).filter(link => link.placement === 'resources')
   const archivedWithResources = (content.archivedSeries ?? []).filter(series => (series.resourceLinks ?? []).length > 0)
+  const [activeTag, setActiveTag] = useState<string | null>(null)
 
   if (resources.length === 0 && archivedWithResources.length === 0) return null
 
+  const allTags = Array.from(new Set(resources.flatMap(r => r.tags ?? []))).filter(Boolean)
+  const filteredResources = activeTag ? resources.filter(r => (r.tags ?? []).includes(activeTag)) : resources
+
   return (
     <section className="section-resources section-download-library" aria-label="Download library">
       <div className="section-inner">
         <div className="download-library-head">
           <p className="eyebrow">Download Library</p>
           <h2 className="section-heading">More guides, worksheets, and past study downloads.</h2>
-          <p className="download-library-copy">Keep the main guide featured at the top, and use this library for every other download you want available on the page.</p>
         </div>
 
-        {resources.length > 0 && (
+        {allTags.length > 0 && (
+          <div className="download-tag-filter">
+            <button
+              className={`download-tag-chip${activeTag === null ? ' download-tag-chip--active' : ''}`}
+              onClick={() => setActiveTag(null)}
+            >
+              All
+            </button>
+            {allTags.map(tag => (
+              <button
+                key={tag}
+                className={`download-tag-chip${activeTag === tag ? ' download-tag-chip--active' : ''}`}
+                onClick={() => setActiveTag(prev => prev === tag ? null : tag)}
+              >
+                {tag}
+              </button>
+            ))}
+          </div>
+        )}
+
+        {filteredResources.length > 0 && (
           <div className="download-library-group">
-            <div className="download-library-group-head">
-              <h3>Current Downloads</h3>
-              <p>Extra files you want people to grab right now.</p>
-            </div>
             <div className="resources-list">
-              {resources.map(resource => (
+              {filteredResources.map(resource => (
                 <Link key={resource.id} to={`/downloads/${buildCustomDownloadPageId(resource.id)}`} className="resource-download-card resource-download-card--link">
                   <div className="resource-download-header">
                     {resource.imageUrl && (
@@ -822,6 +841,10 @@ function DownloadLibrarySection({ content }: { content: SiteContent }) {
           </div>
         )}
 
+        {activeTag !== null && filteredResources.length === 0 && (
+          <p className="download-empty-state">No downloads tagged "{activeTag}".</p>
+        )}
+
         {archivedWithResources.length > 0 && (
           <div className="download-library-group">
             <div className="download-library-group-head">