fix: detach expanded search panel from header width constraints (min-width, viewport-anchored)

[mekarpeles]

Problem

The expanded .panel in ol-search-bar is currently bound to the width of its parent .search-outer via position: absolute; left: 0; right: 0. As the header shrinks at narrower viewports, the panel shrinks with it, causing two visible breakdowns:

• Below ~945px — facets in .pf-bar start to overflow the panel width
• Below ~795px — the barcode scanner icon overflows the search box and the layout visually breaks

This also means there's no guaranteed minimum usable width for the expanded experience on desktop/tablet.

How GitHub and Hardcover.app solve this

Both apps detach the expanded search popup from the header's width. The visual trick:

• The popup is anchored to the right edge of the triggering search input (not the left)
• It has a fixed/minimum width independent of the header's shrinking width
• The search input inside the popup aligns vertically with the header input — so it appears to be the same element expanding in place
• GitHub: ~100% viewport width up to 1024px, then clamps to ~600px; right edge aligned with the search bar

Proposed fix (surgical — no redesign)

Change .panel from parent-width-constrained absolute positioning to a viewport-anchored fixed position computed in JS when the panel opens:

1. On expand, read the bounding rect of the input element
2. Set position: fixed; top: <input bottom>; right: <viewport width - input right> on the panel
3. Set min-width: 600px (or similar) so it never collapses below a usable width on desktop
4. On resize/scroll, recompute (or close the panel)
5. Mobile full-screen overlay (<600px) stays completely intact — no changes there
6. All internals (facets, suggestions, chips, autocomplete) are untouched

This is the same "detached popup" pattern used by GitHub and Hardcover.app.

Acceptance criteria

• Expanded panel never goes below ~600px wide on desktop/tablet
• Facets never overflow at any desktop viewport width
• Right edge of expanded panel aligns with right edge of the search input
• No regression on mobile full-screen overlay (<600px)
• No regression on embedded (search-page) mode
• Panel repositions or closes on window resize

Files likely touched

• frontend/src/components/ol-search-bar.js — panel positioning logic + CSS
• Tests: ol-search-bar.mobile-overlay.test.js, potentially new desktop breakpoint tests

[shreya8040]

@mekarpeles i would like to work on this issue