Feat/performance probe fps overlay (#472)

* feat(perf-probe): add FPS overlay toggle and tidy probe modal

Add optional rAF-based FPS readout controlled by a persisted probe flag.
Remove the separate keyboard shortcut. Collapse all phase sections by default.

* perf(fps-overlay): subscribe only to showFpsOverlay flag

Add usePerfProbeFlag so the overlay does not re-render when other probe
toggles change. Track the animation frame id with a loop-local variable.

src/utils/perfFlags.ts

@@ -1,6 +1,8 @@
 import { useSyncExternalStore } from 'react';
 
 export type PerfProbeFlags = {
+  /** On-screen rAF-based FPS counter (Performance Probe). */
+  showFpsOverlay: boolean;
   disableWaveformCanvas: boolean;
   disablePlayerProgressUi: boolean;
   disableMarqueeScroll: boolean;
@@ -29,6 +31,7 @@ export type PerfProbeFlags = {
 const STORAGE_KEY = 'psysonic_perf_probe_flags_v1';
 
 const DEFAULT_FLAGS: PerfProbeFlags = {
+  showFpsOverlay: false,
   disableWaveformCanvas: false,
   disablePlayerProgressUi: false,
   disableMarqueeScroll: false,
@@ -147,3 +150,12 @@ export function resetPerfProbeFlags(): void {
 export function usePerfProbeFlags(): PerfProbeFlags {
   return useSyncExternalStore(subscribePerfProbeFlags, getPerfProbeFlags, () => DEFAULT_FLAGS);
 }
+
+/** Subscribe to a single probe flag so unrelated toggles do not re-render the consumer. */
+export function usePerfProbeFlag<K extends keyof PerfProbeFlags>(key: K): PerfProbeFlags[K] {
+  return useSyncExternalStore(
+    subscribePerfProbeFlags,
+    () => getPerfProbeFlags()[key],
+    () => DEFAULT_FLAGS[key],
+  );
+}