[bri-b-dev]

Summary

• Sticky search + filter sheet: the search field and a "Filter" button (with an active-count badge) stay on top while scrolling. The sheet (dialog, Esc, Tab trap, focus returns to the button) offers category, place, duration (≤10/20/30 min), difficulty (leicht/mittel/schwer), tags (12 most used, all on demand), favorites, never played, below target (disabled with a hint until a handicap is known). Changes apply live; the footer button shows the result count
• Active filters as removable chips + "Alle zurücksetzen" + "N von 69 Drills" (live region)
• Filter state in the URL (?q=&cat=&tag=&dur=&diff=&place=&fav=1&new=1&low=1): shareable, replace instead of push (Back leaves the list), other query params are kept, quick successive changes build on each other. Back from a drill restores filter and scroll position (the router waits for the 250 ms page transition before restoring)
• Search: title, tags, summary and category; every word must match; umlaut tolerant ("fuer", "für", "fur" and "ueben"/"üben" find the same)
• Cards: inline diagram thumbnail (lazy via IntersectionObserver; inline because the diagrams use the theme variables; ids are made unique per thumbnail since e.g. arrow exists in 40 files), duration, difficulty dots, level stars, tags. Groups by category with sticky headings
• Empty state: "Keine Drills gefunden" with Filter zurücksetzen
• The shuffle overlay still starts from the list's category and tag

Bug fix found on the way

<main> had overflow: auto although the window is what scrolls. That made <main> the sticky container, so no sticky bar inside it ever stuck to the window - including the drill head from UX-06 and the session bar. Now overflow: visible (guarded by a test).

Numbers

Start chunk 145.2 KB; the list chunk is 18.4 KB (lazy). Tests 338 -> 372, lint 0 errors. Removed the unused filters/drills.ts.

Test plan

• npm test, npm run lint, npm run typecheck, npm run build (local)
• CI
• Manual (phone): search bar and group headings stick below the app header without overlapping; filter sheet by touch; open a drill and go Back (scroll position + filter); shared URL opens with the filter; thumbnails in light/dark; drill head and session bar now stay visible while scrolling

🤖 Generated with Claude Code