feat: implement user avatars with DiceBear integration

- Add avatar_url field to MemberSettingsUpdate schema
- Create AvatarService for generating default avatars using DiceBear
- Update auth service to generate avatars on user registration
- Add avatar upload UI to settings page
- Update settings endpoint to handle avatar URL updates
- Display current avatar in settings with upload/generate options

Generated by Mistral Vibe.
Co-Authored-By: Mistral Vibe <vibe@mistral.ai>

verify_comment_changes.md

@@ -0,0 +1,73 @@
+# Verification Steps for Comment Waveform Integration
+
+## Changes Made
+
+### 1. API Schema Changes
+- Added `author_avatar_url: str | None` to `SongCommentRead` schema
+- Updated `from_model` method to include avatar URL from author
+
+### 2. Frontend Interface Changes
+- Added `author_avatar_url: string | null` to `SongComment` interface
+
+### 3. Comment Creation Changes
+- Modified `addCommentMutation` to accept `{ body: string; timestamp: number }`
+- Updated button click handler to pass `currentTime` when creating comments
+
+### 4. Marker Display Changes
+- Changed marker icon from placeholder to `comment.author_avatar_url || placeholder`
+- Improved marker styling (size, border, shadow)
+- Added proper image styling (object-fit, border-radius)
+
+## Verification Steps
+
+### 1. Test Comment Creation with Timestamp
+1. Play a song and let it progress to a specific time (e.g., 30 seconds)
+2. Add a comment while the song is playing
+3. Verify the comment appears with the correct timestamp
+4. Check that a marker appears on the waveform at the correct position
+
+### 2. Test Avatar Display
+1. Create comments with different users (or check existing comments)
+2. Verify that user avatars appear in the waveform markers
+3. Check that placeholder is used when no avatar is available
+
+### 3. Test Marker Interaction
+1. Click on a waveform marker
+2. Verify that the comment section scrolls to the corresponding comment
+3. Check that the comment is highlighted temporarily
+
+### 4. Test Timestamp Display
+1. Look at comments with timestamps
+2. Verify that the timestamp button appears (e.g., "1:30")
+3. Click the timestamp button and verify playback seeks to that position
+
+## Expected Behavior
+
+### Before Fix
+- Comments created without timestamps (no waveform markers)
+- All markers used placeholder icons
+- No visual indication of comment timing
+
+### After Fix
+- Comments created with current playhead timestamp
+- Markers show user avatars when available
+- Markers positioned correctly on waveform
+- Timestamp buttons work for seeking
+- Markers have improved visibility (border, shadow)
+
+## Troubleshooting
+
+### If markers don't appear
+1. Check browser console for API errors
+2. Verify database migration is applied (timestamp column exists)
+3. Ensure `currentTime` is valid when creating comments
+
+### If avatars don't show
+1. Check that `author_avatar_url` is included in API response
+2. Verify user records have valid avatar URLs
+3. Check network tab for image loading errors
+
+### If timestamps are incorrect
+1. Verify `currentTime` from waveform hook is correct
+2. Check that timestamp is properly sent to API
+3. Ensure backend stores and returns timestamp correctly