diff --git a/DeepDrftPublic.Client/Controls/WaveformVisualizerControlPopover.razor b/DeepDrftPublic.Client/Controls/WaveformVisualizerControlPopover.razor
index f979e0a..f776aa8 100644
--- a/DeepDrftPublic.Client/Controls/WaveformVisualizerControlPopover.razor
+++ b/DeepDrftPublic.Client/Controls/WaveformVisualizerControlPopover.razor
@@ -29,15 +29,17 @@
the shared WaveformVisualizerControlState and raises Changed; the visualizer bridge subscribes. This
host only toggles open/closed and centers the panel — it stays purely presentational. *@
-
-
-
+
+
+
+
+
@* The tinted modal scrim that also HOLDS the panel. DarkBackground = the mild tint; OnClick on the scrim
dismisses (knob-drag-safe, see header). The panel is the overlay's centered child; it stops click
diff --git a/DeepDrftPublic/wwwroot/styles/deepdrft-styles.css b/DeepDrftPublic/wwwroot/styles/deepdrft-styles.css
index e511867..5be20e0 100644
--- a/DeepDrftPublic/wwwroot/styles/deepdrft-styles.css
+++ b/DeepDrftPublic/wwwroot/styles/deepdrft-styles.css
@@ -776,6 +776,45 @@ body:has(.waveform-visualizer-control-overlay) {
color: var(--deepdrft-primary);
}
+/* Dark-theme interactive affordances in the Session/Mix release-detail hero overlay.
+ The co-located ReleaseHeroOverlay.razor.css forces .release-hero-play and
+ .release-hero-share icons to --deepdrft-white unconditionally (correct for the
+ over-image light-theme contract). In dark theme the play and share glyphs adopt
+ green to match the "green = interactive" convention. Both the scoped ::deep rule
+ ([b-xxx] .release-hero-play .mud-icon-button) and this global rule
+ (.deepdrft-theme-dark .release-hero-play .mud-icon-button) compute to specificity
+ (0,3,0) — a tie — so the override wins on source order: deepdrft-styles.css is
+ linked after DeepDrftPublic.styles.css in App.razor, making it the later rule.
+ No !important needed. .mud-progress-circular is included alongside .mud-icon-button
+ in the play slot to colour the loading spinner green as well.
+ Light theme: pixel-identical to before. */
+.deepdrft-theme-dark .release-hero-play .mud-icon-button,
+.deepdrft-theme-dark .release-hero-play .mud-progress-circular,
+.deepdrft-theme-dark .release-hero-share .mud-icon-button {
+ color: var(--deepdrft-primary);
+}
+
+/* Dark-theme lava-lamp visualizer-settings trigger.
+ The MudIconButton uses Color.Secondary, which resolves to off-white in dark mode.
+ The .dd-lava-lamp-trigger marker div (added to WaveformVisualizerControlPopover.razor)
+ scopes this rule to only that trigger, preventing bleed onto other Secondary icon
+ buttons sharing the same host pages. Applied at all host sites (Mix, Cut, Session,
+ NowPlaying) since the wrapper travels with the component. Light theme: unchanged. */
+.deepdrft-theme-dark .dd-lava-lamp-trigger .mud-icon-button {
+ color: var(--deepdrft-primary);
+}
+
+/* Dark-theme gas-lamp dark-mode toggle.
+ The MudIconButton uses Color.Inherit and sits inside .dd-nav-actions (the right-side
+ cluster of the nav bar). In dark theme it inherits the nav text colour (off-white);
+ green makes it consistent with the "green = interactive" convention. The selector is
+ scoped to .dd-nav-actions so no other icon buttons are affected. Covers both the
+ desktop nav and the mobile nav (which also renders its gas-lamp inside .dd-nav-actions).
+ Light theme: unchanged. */
+.deepdrft-theme-dark .dd-nav-actions .mud-icon-button {
+ color: var(--deepdrft-primary);
+}
+
/* =============================================================================
RELEASE DESCRIPTION BLURB
Shared block rendered just below the hero/header on every release detail page