RG-758: Optimize Mobile Header And Navigation

[menvil]

Summary

• Adds data-testid="mobile-header" marker to header
• Adds data-testid="language-switcher" to locale-switcher wrapper
• Locale-switcher shows 2-letter code on mobile (<sm) and full native name on sm+
• Locale dropdown uses max-w-[calc(100vw-2rem)] to prevent edge overflow
• Header inner container: reduced gap on mobile (gap-2 → md:gap-4), added overflow-hidden
• Brand name uses min-w-0 shrink truncate to prevent overflow on long site names
• Auth actions gap reduced on mobile (gap-2 → md:gap-3)

Test plan

• tests/Feature/Mobile/MobileHeaderTest.php — 4 tests pass
• composer test passes (1555 tests)
• npm run build passes

🤖 Generated with Claude Code

---

Summary by cubic

Optimizes the mobile header and navigation to meet RG-758 by improving readability and preventing overflow on small screens. Adds targeted test coverage and test IDs for reliable mobile UI checks.

• New Features
  • Added data-testid="mobile-header" and data-testid="language-switcher".
  • Locale switcher: shows 2-letter code on mobile and native name on larger screens; dropdown width limited to max-w-[calc(100vw-2rem)]; more compact button on mobile.
  • Header layout: reduced gaps on mobile, overflow-hidden, and truncated long site names to avoid overflow.
  • Added mobile header tests covering header render, language switcher, theme switcher, and compact upload button for authenticated users.

^{Written for commit d4b4c6a. Summary will update on new commits.}