feat(gallery): pinned filter bar (Phase 1)

Gallery now has in-view filtering, styled like the app's sticky v-tabs
chrome (pinned at top:64px under TopNav).

- GalleryFilterBar: combined tag+artist autocomplete (searches
  /api/tags + /api/artists), closable filter chips (multi-tag AND),
  media toggle (All/Images/Videos), Newest/Oldest sort, Clear. Writes all
  state to the URL via router.push.
- gallery store: filter is now { tag_ids, artist_id, media_type, sort,
  post_id }; applyFilterFromQuery makes the URL the single source of truth
  (deep-linkable, back-button works); chip labels resolved by id or
  pre-noted on pick. Replaces the standalone tag chip + setTag/PostFilter.
- GalleryView: renders the bar (hidden in post-detail), syncs route.query
  → store on mount + every query change.

Also untracks the transient .claude/scheduled_tasks.lock committed in
3f30327 and gitignores it.

Tests: store parses query → composable scroll params, post_id exclusivity,
newest-sort omitted, label pre-seed, single initial fetch.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

frontend/src/components/gallery/GalleryFilterBar.vue

@@ -0,0 +1,202 @@
+<template>
+  <div class="fc-filterbar">
+    <v-autocomplete
+      v-model="selected"
+      :items="searchItems"
+      :loading="searchLoading"
+      item-title="name" item-value="value"
+      no-filter clearable hide-details density="compact" variant="outlined"
+      placeholder="Filter by tag or artist…"
+      prepend-inner-icon="mdi-filter-variant"
+      class="fc-filterbar__search"
+      @update:search="onSearch"
+      @update:model-value="onPick"
+    >
+      <template #item="{ props: itemProps, item }">
+        <v-list-item v-bind="itemProps" :title="item.raw.name">
+          <template #prepend>
+            <v-icon size="small">{{ iconFor(item.raw) }}</v-icon>
+          </template>
+          <template #subtitle>
+            {{ item.raw.kind === 'artist' ? 'artist'
+              : (item.raw.fandom_name ? `character · ${item.raw.fandom_name}` : item.raw.kind) }}
+          </template>
+        </v-list-item>
+      </template>
+    </v-autocomplete>
+
+    <div class="fc-filterbar__chips">
+      <v-chip
+        v-for="id in store.filter.tag_ids" :key="`t${id}`"
+        size="small" closable :color="chipColor(id)" variant="tonal"
+        @click:close="removeTag(id)"
+      >{{ store.tagLabels[id] || `#${id}` }}</v-chip>
+      <v-chip
+        v-if="store.filter.artist_id"
+        size="small" closable color="accent" variant="tonal"
+        prepend-icon="mdi-account"
+        @click:close="clearArtist"
+      >{{ store.artistLabel || `Artist #${store.filter.artist_id}` }}</v-chip>
+    </div>
+
+    <v-spacer />
+
+    <v-btn-toggle
+      :model-value="store.filter.media_type ?? 'all'"
+      density="compact" mandatory variant="outlined" divided
+      @update:model-value="(v) => setMedia(v === 'all' ? null : v)"
+    >
+      <v-btn value="all" size="small">All</v-btn>
+      <v-btn value="image" size="small">Images</v-btn>
+      <v-btn value="video" size="small">Videos</v-btn>
+    </v-btn-toggle>
+
+    <v-select
+      :model-value="store.filter.sort"
+      :items="SORTS"
+      density="compact" hide-details variant="outlined"
+      class="fc-filterbar__sort"
+      @update:model-value="setSort"
+    />
+
+    <v-btn
+      v-if="hasActiveFilters" variant="text" size="small"
+      prepend-icon="mdi-close" @click="clearAll"
+    >Clear</v-btn>
+  </div>
+</template>
+
+<script setup>
+import { computed, ref } from 'vue'
+import { useRouter } from 'vue-router'
+import { useApi } from '../../composables/useApi.js'
+import { useGalleryStore } from '../../stores/gallery.js'
+import { useTagStore } from '../../stores/tags.js'
+
+const store = useGalleryStore()
+const tagStore = useTagStore()
+const api = useApi()
+const router = useRouter()
+
+const SORTS = [
+  { title: 'Newest first', value: 'newest' },
+  { title: 'Oldest first', value: 'oldest' },
+]
+
+const selected = ref(null)
+const searchItems = ref([])
+const searchLoading = ref(false)
+let debounce = null
+
+const hasActiveFilters = computed(() =>
+  store.filter.tag_ids.length > 0 ||
+  store.filter.artist_id != null ||
+  store.filter.media_type != null ||
+  store.filter.sort !== 'newest'
+)
+
+function iconFor(raw) {
+  if (raw.kind === 'artist') return 'mdi-account'
+  return { character: 'mdi-account-circle', fandom: 'mdi-book-open-page-variant',
+           series: 'mdi-bookshelf' }[raw.kind] || 'mdi-tag'
+}
+function chipColor(id) {
+  // Tag chips use the same per-kind palette as the rest of the app; we only
+  // know the kind from the autocomplete pick, so fall back to a neutral tone.
+  return tagStore.colorFor(pickedKind.value[id] || 'general')
+}
+const pickedKind = ref({})
+
+function onSearch(q) {
+  if (debounce) clearTimeout(debounce)
+  if (!q || !q.trim()) { searchItems.value = []; return }
+  debounce = setTimeout(async () => {
+    searchLoading.value = true
+    try {
+      const [tags, artists] = await Promise.all([
+        api.get('/api/tags/autocomplete', { params: { q, limit: 10 } }),
+        api.get('/api/artists/autocomplete', { params: { q, limit: 10 } }),
+      ])
+      searchItems.value = [
+        ...(artists || []).map((a) => ({
+          kind: 'artist', id: a.id, name: a.name, value: `artist:${a.id}`,
+        })),
+        ...(tags || []).map((t) => ({
+          kind: t.kind, id: t.id, name: t.name, value: `tag:${t.id}`,
+          fandom_name: t.fandom_name,
+        })),
+      ]
+    } catch {
+      searchItems.value = []
+    } finally {
+      searchLoading.value = false
+    }
+  }, 250)
+}
+
+function onPick(value) {
+  const item = searchItems.value.find((i) => i.value === value)
+  selected.value = null
+  searchItems.value = []
+  if (!item) return
+  if (item.kind === 'artist') {
+    store.noteArtistLabel(item.name)
+    pushFilter((n) => { n.artist_id = item.id })
+  } else {
+    store.noteTagLabel(item.id, item.name)
+    pickedKind.value = { ...pickedKind.value, [item.id]: item.kind }
+    pushFilter((n) => { if (!n.tag_ids.includes(item.id)) n.tag_ids.push(item.id) })
+  }
+}
+
+function removeTag(id) {
+  pushFilter((n) => { n.tag_ids = n.tag_ids.filter((t) => t !== id) })
+}
+function clearArtist() {
+  store.noteArtistLabel(null)
+  pushFilter((n) => { n.artist_id = null })
+}
+function setMedia(m) { pushFilter((n) => { n.media_type = m }) }
+function setSort(s) { pushFilter((n) => { n.sort = s }) }
+function clearAll() { router.push({ name: 'gallery', query: {} }) }
+
+// Single write path: clone the current filter, mutate, serialize to the URL.
+// The route watcher in GalleryView applies it to the store and reloads.
+function pushFilter(mutate) {
+  const f = store.filter
+  const n = {
+    tag_ids: [...f.tag_ids],
+    artist_id: f.artist_id,
+    media_type: f.media_type,
+    sort: f.sort,
+  }
+  mutate(n)
+  const q = {}
+  if (n.tag_ids.length) q.tag_id = n.tag_ids.join(',')
+  if (n.artist_id) q.artist_id = String(n.artist_id)
+  if (n.media_type) q.media = n.media_type
+  if (n.sort && n.sort !== 'newest') q.sort = n.sort
+  router.push({ name: 'gallery', query: q })
+}
+</script>
+
+<style scoped>
+/* Pinned under the 64px TopNav, matching the app's sticky v-tabs chrome
+   (SettingsView / ArtistHeader / SubscriptionsView). */
+.fc-filterbar {
+  position: sticky;
+  top: 64px;
+  z-index: 4;
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  flex-wrap: wrap;
+  padding: 8px 4px;
+  margin-bottom: 12px;
+  background: rgb(var(--v-theme-surface));
+  border-bottom: 1px solid rgb(var(--v-theme-surface-light));
+}
+.fc-filterbar__search { max-width: 320px; min-width: 200px; }
+.fc-filterbar__chips { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
+.fc-filterbar__sort { max-width: 150px; }
+</style>