feat(ui): new equalizer logo, favicon link, fix star vertical alignment

- icon.svg: replaced music-note with 5-bar equalizer waveform (gold
  gradient on dark bg) — works well as favicon and app icon at all sizes
- index.html: add <link rel="icon"> so browsers pick up the favicon;
  move #btn-star-current out of the title row and into player-track so
  player-track's align-items:center centers it with the full info block
- styles.css: add flex:1 to .player-info base rule; remove stale mobile
  overrides that assumed the star was inside player-info (position:absolute,
  padding-right hack)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

public/icon.svg

@@ -1,22 +1,25 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
-  <rect width="512" height="512" rx="90" fill="#07070f"/>
-  <rect width="512" height="512" rx="90" fill="url(#bg)"/>
   <defs>
-    <radialGradient id="bg" cx="30%" cy="40%" r="80%">
-      <stop offset="0%" stop-color="#1a1a2e"/>
+    <radialGradient id="bg" cx="40%" cy="35%" r="72%">
+      <stop offset="0%" stop-color="#1c1c30"/>
       <stop offset="100%" stop-color="#07070f"/>
     </radialGradient>
+    <linearGradient id="bar" x1="0" y1="0" x2="0" y2="1">
+      <stop offset="0%" stop-color="#f5b83a"/>
+      <stop offset="100%" stop-color="#c07515"/>
+    </linearGradient>
+    <radialGradient id="glow" cx="50%" cy="50%" r="50%">
+      <stop offset="0%" stop-color="#e8a020" stop-opacity="0.2"/>
+      <stop offset="100%" stop-color="#e8a020" stop-opacity="0"/>
+    </radialGradient>
   </defs>
-  <!-- Music note -->
-  <g fill="#e8a020">
-    <!-- Note head 1 -->
-    <ellipse cx="180" cy="340" rx="48" ry="36" transform="rotate(-15 180 340)"/>
-    <!-- Note head 2 -->
-    <ellipse cx="332" cy="300" rx="48" ry="36" transform="rotate(-15 332 300)"/>
-    <!-- Stem -->
-    <rect x="218" y="160" width="18" height="185" rx="9"/>
-    <rect x="370" y="120" width="18" height="185" rx="9"/>
-    <!-- Beam -->
-    <rect x="218" y="160" width="170" height="22" rx="11"/>
-  </g>
+  <rect width="512" height="512" rx="90" fill="#07070f"/>
+  <rect width="512" height="512" rx="90" fill="url(#bg)"/>
+  <ellipse cx="256" cy="256" rx="210" ry="160" fill="url(#glow)"/>
+  <!-- Equalizer bars: 5 bars, varying heights, vertically centered -->
+  <rect x="103" y="196" width="50" height="120" rx="25" fill="url(#bar)"/>
+  <rect x="167" y="151" width="50" height="210" rx="25" fill="url(#bar)"/>
+  <rect x="231" y="111" width="50" height="290" rx="25" fill="url(#bar)"/>
+  <rect x="295" y="166" width="50" height="180" rx="25" fill="url(#bar)"/>
+  <rect x="359" y="206" width="50" height="100" rx="25" fill="url(#bar)"/>
 </svg>