Richie
4de8a916af
- Raise bottom offset from theme.spacing(3) (24px) → theme.spacing(9) (72px) so the pill clears the sticky HelpBar with ~16px breathing. - Centering: swap `left:50%; transform: translateX(-50%)` for `left:0; right:0; mx:auto; width:fit-content`. Slide (the wrapper) animates via transform, which was clobbering our centering transform and leaving the bar's left edge at the viewport centre instead of its centre (measured 171px off-centre pre-fix). Auto-margin centering doesn't fight Slide's animation. - Mobile sizing: responsive step-down on xs — - Badge: large (32px) → medium (26px) - Typography: body1 (16px) → body2 (14px) - Button: medium (40px) → small (32px) - Container: gap 2→1.5, px 3→2, py 1.5→1 md+ keeps the larger sizes from the earlier bump. Rejected alternatives: slide/peek collapsed-state (adds interaction cost and hides state behind a tap — bad for FA's grief-sensitive audience); full-width bottom bar (loses the "floating reminder" pill character). Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>