Refactor(nav): shared page header with tools and account menus

The pages outside the homepage (/tools/:slug, /privacy, /r/:id) get one
PageHeader: a back button that steps back in history when the previous
entry is the homepage (restoring the kept-alive page and its scroll) and
pushes / otherwise (utils/back-target.js), the brand, a tools menu
grouped by category (ToolsMenu.vue, over listedTools() in
utils/tool-availability.js) so a tool can be switched without going
home, the current page's title, and the account menu. Below `sm` the
row keeps the back arrow, the title and icon triggers.

The account menu is UserMenu.vue, extracted from Nav.vue, which keeps
its look; the header also hosts User and Preferences so sign-in,
benefits & usage and the preferences sheet work on every page. Each
Preferences instance opens only on the page on screen and closes when
its page is left; My Achievements off the homepage navigates home first.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_013GbLTGMZ45MV78qd2tHoco

index.html

@@ -123,7 +123,7 @@
 
     /* Standalone pages (/tools/:slug, /privacy, /r/:id) have their own in-flow
        sticky header instead of the homepage's fixed Nav, and that header carries
-       the iOS safe-area inset as its own padding (StandalonePageHeader.vue) so
+       the iOS safe-area inset as its own padding (PageHeader.vue) so
        it keeps clearing the Dynamic Island once sticky pins it to the viewport
        top. The body therefore reserves nothing here. App.vue toggles this class
        on the standalone routes. */