feat(mobile): Wave 4 — RegisterPage responsive + TransferIndicator on settings + MessageInput sheets

- RegisterPage: scroll envelope, iOS-zoom-safe inputs, ≥44px tap targets, mobile-friendly invite chip + swatch row
- TransferIndicator: mounted via MobileScreenHeader.rightActions across every settings/instance screen and inline in MobileChatScreen; touch-close listener; viewport-safe panel width
- MessageInput popovers (emoji/GIF/mention) now route through new InputPopover wrapper — desktop popover, mobile bottom-sheet
- EmojiPicker mobile branch: dynamicWidth + scoped CSS (.emoji-picker-wrapper--mobile) so the <em-emoji-picker> custom element fills the sheet; bigger touch targets (perLine 8, button 40, emoji 28); desktop unchanged
- MessageInput trigger row: mobile-first sizing with md: desktop overrides (40×40 buttons + gap on mobile, 34×34 unchanged on desktop)
- Spec updates: docs/systems/auth.md (RegisterPage responsive contract), docs/systems/uploads.md (TransferIndicator mobile surfaces)

packages/web/src/styles/globals.css

@@ -320,6 +320,19 @@
   max-height: 400px;
 }
 
+/* Mobile bottom-sheet variant: stretch the custom element to fill the
+   sheet's width (so `dynamicWidth: true` can recompute the grid against
+   the real container). Height is left to emoji-mart's own layout — the
+   picker manages its internal scroll region against its measured height
+   and forcing `height: 100%` here would collapse its category nav off-
+   screen because the custom element doesn't propagate flex sizing into
+   its shadow root. The 400px desktop cap is fine for mobile too; the
+   sheet's `max-height: min(60dvh, 60vh)` gives us ~440-500px to play
+   with on common phone viewports. */
+.emoji-picker-wrapper--mobile em-emoji-picker {
+  width: 100%;
+}
+
 /* Animations */
 @keyframes fadeIn {
   from { opacity: 0; }