feat(mix-detail): extract shared ReleaseHeroOverlay; Mix cover becomes overlaid 600px square hero (Direction B)

DeepDrftPublic.Client/Pages/MixDetail.razor.css

@@ -4,12 +4,14 @@
     z-index: 1;
 }
 
-/* Medium square cover — deliberately smaller than the 360px cut cover so the
-   waveform backdrop keeps room. The placeholder/art MudPaper fills this frame. */
-.mix-detail-cover {
+/* Mix's per-page hero variance: a centered medium square, overriding ReleaseHeroOverlay's default
+   wide (16/10) aspect. The cover art is square album art, and a smaller square frees the surrounding
+   canvas for the lava-lamp visualizer. The mix-hero class lands on the overlay component's root
+   .release-hero <div> (a child Razor component's native output), so ::deep is required to reach it. */
+::deep .release-hero.mix-hero {
     aspect-ratio: 1 / 1;
-    max-width: 220px;
-    margin: 0 auto 2rem;
-    overflow: hidden;
-    box-shadow: 0 8px 28px color-mix(in srgb, var(--mud-palette-text-secondary) 18%, transparent);
+    max-width: 600px;
+    min-height: 0;
+    max-height: none;
+    margin-inline: auto;
 }