Add Metronome Feature to Piano Interface

[brylie]

We need to implement a metronome feature that helps users maintain steady timing during their piano practice. The metronome should be integrated into the main piano interface as a non-intrusive but easily accessible tool.

The metronome should include basic tempo controls (40-208 BPM) with a clear visual indicator that pulses in time with the beat. Users should be able to choose between different sound options (click, bell, wood block, or digital beep) and adjust the volume independently from the main app volume. The metronome should continue running in the background while users interact with the piano interface.

Technical Scope

• Add metronome controls to the main UI (play/pause, tempo adjustment, sound selection)
• Implement a visual beat indicator that synchronizes with the audio
• Create four distinct metronome sounds
• Ensure metronome timing remains accurate during extended practice sessions
• Allow the metronome to run while the user plays piano

UI Mockup Needed

Getting a quick mockup showing the placement of metronome controls relative to the piano interface would be helpful.