Hero name input overflows page on long text #35

Bug

On https://blobatar.dev/, typing a long string into the "Let's find your blobatar" input causes the text to overflow the input, overlap the label above it, and push the page into horizontal scroll.

Repro

1. Go to https://blobatar.dev/
2. Click the name field, type a long string (80+ chars), e.g. thisisaveryveryveryverylongusernamethatshouldoverflowtheinputboxforsure123456789

Actual

Text grows past the input and overlaps the "your config" code panel. Page gets a horizontal scrollbar.

Expected

Input should cap its width to the layout (e.g. max-w-md container) and let the native input scroll internally, instead of growing unbounded.

Cause

apps/site/src/components/Hero.tsx around line 558-567: the inline-grid wrapper span sizing the input to its content (via an invisible mirror span) has no max-width, so long text grows the grid track past the page width.

Fix

Add max-w-full overflow-hidden to the wrapper span so it clamps to the parent max-w-md container; the native <input> then scrolls internally as usual.