Metronome rewrite: single sound checkbox, clean click architecture

- MetronomeWidget rebuilt cleanly: ONE 'Click sound' checkbox (the earlier
  restructure left duplicated option rows behind — neither worked). Widget
  body always visible (dimmed when disarmed); toggle arms sound+pendulum.
- Click decision unified: 'sync to metronome' derives phrase clickSound
  from the widget's sound checkbox (no separate phrase click option);
  'at your pace' clicks when the metronome is armed.
- Chord selection: abwählbare Liste (arpeggioChordSelection) restricts
  progression chords; first bar draws a random chord FROM THE SELECTION
  (fixed first chord repeated the exercise identically).
- Scales: rhythm setting (quarters/eighths) shared with arpeggios;
  drill id includes rhythm to invalidate cached scores.
- Beam fix: register Beam via note.setBeam so VexFlow suppresses flags
  (eighths/16ths previously drew BOTH beam and flag).

src/components/PhraseSheetMusic.tsx

@@ -338,6 +338,9 @@ export const PhraseSheetMusic: React.FC<PhraseSheetMusicProps> = ({
                 }
 
                 // --- Beams: consecutive eighth/16th pairs within one beat ---
+                // Note: the Beam must be registered on each note via setBeam,
+                // otherwise VexFlow still draws flags (beam === undefined in
+                // shouldDrawFlag) and you get BOTH flag and beam.
                 const beamed = frags.filter(f => (f.isEighth || f.isSixteenth) && f.note instanceof StaveNote);
                 for (let i = 0; i + 1 < beamed.length; i++) {
                     const a = beamed[i], b2 = beamed[i + 1];
@@ -350,6 +353,8 @@ export const PhraseSheetMusic: React.FC<PhraseSheetMusicProps> = ({
                     const beatB = Math.floor((b2.start - measureStart) / 480);
                     if (beatA === beatB) {
                         const beam = new Beam([a.note, b2.note], false);
+                        a.note.setBeam(beam);
+                        b2.note.setBeam(beam);
                         beam.setContext(context).draw();
                     }
                 }