Sync a native color picker with the custom hex field

[MrBeldum]

Goal

Add an <input type=\"color\"> next to the existing custom hex field so users can pick a username color visually, while keeping typed hex as the source of truth for exact values.

Scope

• Add a color input in the Username color fieldset (near #colorHexInput).
• Keep both controls in sync:
  • Changing the picker updates state.color, the hex text field, palette selection, and preview.
  • Typing a valid hex updates the picker value (normalized #rrggbb).
  • Invalid hex while typing should not thrash the picker; only commit when parseHexColor succeeds (see color.js).
• Palette swatch clicks should also update the picker.
• Match existing CSS/spacing; no new dependencies.

Out of scope

• Saving colors across reloads (separate issue).
• Alpha / 8-digit hex.
• Framework rewrites.

Acceptance

• Picker and hex field stay consistent for valid colors.
• Preview + PNG export still use the same state.color.
• node --test still passes.
• Manual check via ./start-local.sh.

Please comment here before starting if you want to claim this.

[Thaitheya]

I'd like to work on this issue. Could you assign it to me