fix(p10-reframe-w1): clip visualizer to minimized FAB height; replace LavaLamp icon with SVG Repo glyph

DeepDrftPublic.Client/Controls/AudioPlayerBar/AudioPlayerBar.razor

@@ -1,6 +1,6 @@
 @if (_isMinimized)
 {
-    <div class="minimized-dock">
+    <div class="minimized-dock" @ref="_miniDock">
         <LevelMeterFab OnClick="@ToggleMinimized" />
     </div>
 }

DeepDrftPublic.Client/Controls/AudioPlayerBar/AudioPlayerBar.razor.cs

@@ -27,7 +27,15 @@ public partial class AudioPlayerBar : ComponentBase, IAsyncDisposable
     // var via a ResizeObserver (see Interop/layout/spacer.ts) rather than a static
     // value, because the player reflows across breakpoints and grows with the
     // error banner.
+    //
+    // _miniDock is the minimized FAB container. We observe it in minimized state so
+    // --player-height stays non-zero (the FAB's actual height) and the MixWaveformVisualizer
+    // clips to the top of the FAB rather than extending to the viewport bottom (fix §1).
+    // The player-spacer's .minimized class uses a hardcoded 60px and ignores the var,
+    // so publishing the FAB height here does not regress the spacer.
     private ElementReference _playerRoot;
+    private ElementReference _miniDock;
+    private ElementReference _lastObservedElement;
     private IJSObjectReference? _spacerModule;
     private bool _spacerObserved;
 
@@ -114,22 +122,27 @@ public partial class AudioPlayerBar : ComponentBase, IAsyncDisposable
 
     protected override async Task OnAfterRenderAsync(bool firstRender)
     {
-        // Only the docked, expanded shape needs a spacer: the Fixed embed is
-        // already in normal flow, and the minimized FAB floats clear of content.
-        // Toggle the observer on the minimized/expanded transition only — the
-        // ResizeObserver itself handles every size change in between.
-        var shouldObserve = !_isMinimized && !Fixed;
-        if (shouldObserve == _spacerObserved) return;
+        // The Fixed embed is already in normal flow — no spacer/clip needed.
+        // For the docked player: we observe in BOTH expanded and minimized states
+        // so --player-height always reflects the live height of whichever element
+        // is visible. This keeps the MixWaveformVisualizer clipped to the top of
+        // the footer in both states (fix §1).
+        //   expanded  → observe _playerRoot (full player bar, reflows across breakpoints)
+        //   minimized → observe _miniDock   (floating FAB container, ~56–60px)
+        // The player-spacer's .minimized class uses a hardcoded height and ignores
+        // the var, so publishing the FAB height here does not regress the spacer.
+        if (Fixed) return;
+
+        var elementToObserve = _isMinimized ? _miniDock : _playerRoot;
+        var alreadyOnThisElement = _spacerObserved && elementToObserve.Id == _lastObservedElement.Id;
+        if (alreadyOnThisElement) return;
 
         var module = await GetSpacerModuleAsync();
         if (module is null) return;
 
-        if (shouldObserve)
-            await module.InvokeVoidAsync("observe", _playerRoot);
-        else
-            await module.InvokeVoidAsync("unobserve");
-
-        _spacerObserved = shouldObserve;
+        await module.InvokeVoidAsync("observe", elementToObserve);
+        _spacerObserved = true;
+        _lastObservedElement = elementToObserve;
     }
 
     private async Task<IJSObjectReference?> GetSpacerModuleAsync()