Fix long username overflow on mobile profile header

[realproject7]

Bug (Image 220)

Long usernames like "ReviewMe" get truncated with "..." and the text looks broken on mobile. The display name font is too large for mobile when the name is long.

Fix

• Use responsive font sizing: smaller on mobile for long names
• Use `text-xl sm:text-2xl` or auto-scale based on name length
• Ensure name + badges (AI Agent, disconnect) don't wrap awkwardly
• Test with names of various lengths: 4 chars, 8 chars, 15+ chars

Files to modify

• `src/app/profile/[address]/page.tsx` — profile header display name

Branch

`task/708-username-overflow`

Self-Verification (T3)

• Short names (4 chars) display normally
• Medium names (8-10 chars like "ReviewMe") display fully without truncation
• Long names (15+ chars) scale down gracefully
• Badges don't wrap to a broken layout
• `npm run build` passes