refactor: Optimize now-playing modal and song detail page for mobile

- Reveal left panel in NP modal on mobile by stacking content vertically
- Hide record & creator info to preserve space; center sleeve image
- Update song detail layout: full-width cover, stacked metadata, centered controls
- Ensure buttons and share row wrap/center properly on narrow screens

public/css/app.css

@@ -1125,8 +1125,39 @@ a.detail-creator-card:hover {
 #np-btn-repeat.active { color: var(--neon-cyan); text-shadow: var(--glow-cyan); }
 
 @media (max-width: 600px) {
-  #np-left { display: none; }
+  #np-modal {
-  #np-modal { width: 96vw; height: 90vh; }
+    flex-direction: column;
+    width: 96vw;
+    height: 90vh;
+  }
+
+  /* Un-hide left panel, stack it above the track list */
+  #np-left {
+    display: flex;
+    width: 100%;
+    flex-shrink: 0;
+    flex-direction: column;
+    align-items: center;
+    padding: 1.25rem 1rem 0.75rem;
+    border-right: none;
+    border-bottom: 1px solid var(--border);
+    background: var(--bg-inset);
+  }
+
+  /* Reset desktop tilt/oversize — plain centered square */
+  #np-sleeve-scene {
+    width: min(55vw, 200px);
+    margin: 0;
+    transform: none;
+  }
+  #np-sleeve-scene:hover { transform: scale(1.03); cursor: pointer; }
+
+  /* Vinyl record and creator strip hidden on mobile to save space */
+  #np-record       { display: none; }
+  #np-creator-info { display: none; }
+
+  /* Right panel takes remaining height */
+  #np-right { flex: 1; min-height: 0; }
 }
 
 /* ---------- Avatar ---------- */
@@ -1869,9 +1900,28 @@ a.detail-creator-card:hover {
   .player-now { width: auto; flex: 1; }
   #player-viz { width: 56px; }
   #player-audio { width: 100%; order: 3; }
-  .song-detail { flex-direction: column; align-items: flex-start; }
+  /* ── Song detail page ── */
-  .song-detail-cover { width: 100%; height: auto; max-width: 300px; aspect-ratio: 1 / 1; object-fit: cover; }
+  .song-detail { flex-direction: column; align-items: center; }
-  .song-detail-info { flex-wrap: wrap; }
+  .song-detail-cover {
+    width: min(72vw, 260px); height: auto; max-width: none;
+    aspect-ratio: 1 / 1; object-fit: cover; margin: 0 auto;
+  }
+  .song-detail-info { flex-direction: column; align-items: stretch; gap: 0; width: 100%; }
+  .song-detail-meta {
+    display: flex; flex-direction: column; align-items: center;
+    gap: 0.5rem; text-align: center; width: 100%;
+  }
+  .song-detail-meta h1 { font-size: 1.35rem; }
+  .song-detail-meta .social-row { justify-content: center; margin: 0; }
+  /* Play and Edit: full-width block buttons */
+  .song-detail-meta .btn-primary,
+  .song-detail-meta .btn-secondary { width: 100%; text-align: center; display: block; }
+  /* Now Playing button (shown while track plays) */
+  .song-detail-meta .btn-nowplaying { width: 100%; text-align: center; margin: 0; }
+  /* Share row: wrap and center on narrow screens */
+  .song-detail-meta .share-row { flex-wrap: wrap; justify-content: center; gap: 0.4rem; }
+  .share-label { width: 100%; text-align: center; }
+  /* Creator card */
   .detail-creator-card { flex-direction: row; align-items: center; gap: 0.6rem; text-align: left; width: 100%; }
   .detail-creator-avatar { width: 48px; height: 48px; }
   .hero h1 { font-size: 1.6rem; }