Opens the walkthrough / how-it-works modal.
Responsive by design so it can sit beside a title in a cramped drawer header:
it shows the full labelled pill where there's room (≥sm) and collapses to a
single "i" icon-button on narrow (phone) layouts. Both forms are rendered and
swapped by breakpoint class — no media-query JS, so SSR/hydration stay
deterministic (the same approach as the PageShell action row). Both wear the
header-button chrome (surface fill + shadow + ring) so the trigger reads as a
muted peer of the drawer's close button.
Use it anywhere a drawer/dialog header needs a one-tap "how it works" help action, instead of hand-rolling an info button.
Shared "How it works" help trigger — an info button that opens a walkthrough.