Make the Vault Health section navigation work better on narrow screens

[cmsjade5000]

Goal

Improve the Vault Health section navigation on phone-width screens so the section links remain discoverable, readable, and keyboard/touch friendly.

In a local 390px-wide browser audit, the Health page itself avoided document-level horizontal overflow, but the health-section-nav links extended beyond the visible viewport. That may be acceptable if intentionally scrollable, but the current UI gives little indication that more section links are off-screen.

Suggested Scope

• Review the health-section-nav layout in templates/movies_health.html and static/css/movies.css.
• Choose a small responsive treatment: wrapping chips, visible horizontal scroll affordance, or a compact stacked layout.
• Preserve the current section anchors and labels.
• Keep the change limited to Vault Health navigation unless a shared utility already exists.

Files or Areas

• templates/movies_health.html
• static/css/movies.css
• tests/test_movies_ui.py
• Optional: tests/test_ipad_pwa.py if the responsive CSS rule should be pinned there

Acceptance Criteria

• At about 390px viewport width, all Vault Health section links are reachable and the off-screen/overflow behavior is obvious.
• Focus states remain visible for keyboard users.
• The desktop layout remains visually close to the current design.
• Template tests still assert the expected section links exist.
• Add a lightweight CSS/template regression test if practical.

Verification

• pytest tests/test_movies_ui.py -k "health_page_uses_vault_health_title"
• Optional manual check: open /ui/movies/health at a phone-size viewport and confirm the section nav can be read and operated without guessing.

Contributor Notes

This is a small, visual-first issue suitable for a forked PR. First-time contributors do not need assignment; please link this issue from the pull request and avoid changing health workflow behavior or admin actions.