feat: UI polish, DnD fix, navigation, and installer improvements (v1.0.10)

- Fix queue DnD on macOS/Windows: delay ref cleanup in onDragEnd so onDropQueue
  reads correct source/destination before dragend clears them
- Active track highlighting in album tracklist (pulsing accent bg + play icon)
- Marquee scrolling for long titles in Fullscreen Player
- Clickable artist/album in Player Bar and Queue now-playing strip
- Tracklist: format column moved after duration, auto width, kHz/filesize removed
- Settings dropdowns: visible border (base bg + overlay0 border)
- Sidebar: fixed responsive width via clamp(), removed drag-to-resize
- Favorites icon: HandMetal → Star in Random Mix page
- Linux app menu category set to Multimedia (AudioVideo)
- Windows MSI: stable upgradeCode for in-place upgrades
- Bundle: category/description fields at correct config level
- About: Claude Code credit, fixed German MIT licence wording

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

src/pages/AlbumDetail.tsx

@@ -31,11 +31,10 @@ function formatSize(bytes?: number): string {
   return `${(bytes / 1024 / 1024).toFixed(1)} MB`;
 }
 
-function codecLabel(song: { suffix?: string; bitRate?: number; samplingRate?: number }): string {
+function codecLabel(song: { suffix?: string; bitRate?: number }): string {
   const parts: string[] = [];
   if (song.suffix) parts.push(song.suffix.toUpperCase());
   if (song.bitRate) parts.push(`${song.bitRate} kbps`);
-  if (song.samplingRate) parts.push(`${(song.samplingRate / 1000).toFixed(1)} kHz`);
   return parts.join(' · ');
 }
 
@@ -101,6 +100,7 @@ export default function AlbumDetail() {
   const playTrack = usePlayerStore(s => s.playTrack);
   const enqueue = usePlayerStore(s => s.enqueue);
   const openContextMenu = usePlayerStore(s => s.openContextMenu);
+  const currentTrack = usePlayerStore(s => s.currentTrack);
   const [album, setAlbum] = useState<Awaited<ReturnType<typeof getAlbum>> | null>(null);
   const [relatedAlbums, setRelatedAlbums] = useState<SubsonicAlbum[]>([]);
   const [ratings, setRatings] = useState<Record<string, number>>({});
@@ -378,10 +378,10 @@ export default function AlbumDetail() {
           <div style={{ textAlign: 'center' }}>#</div>
           <div>{t('albumDetail.trackTitle')}</div>
           {hasVariousArtists && <div>{t('albumDetail.trackArtist')}</div>}
-          <div>{t('albumDetail.trackFormat')}</div>
           <div style={{ textAlign: 'center' }}>{t('albumDetail.trackFavorite')}</div>
           <div>{t('albumDetail.trackRating')}</div>
           <div style={{ textAlign: 'right' }}>{t('albumDetail.trackDuration')}</div>
+          <div>{t('albumDetail.trackFormat')}</div>
         </div>
 
         {(() => {
@@ -405,7 +405,7 @@ export default function AlbumDetail() {
               {discs.get(discNum)!.map((song, i) => (
                 <div
                   key={song.id}
-                  className={`track-row${hasVariousArtists ? ' track-row-va' : ''}`}
+                  className={`track-row${hasVariousArtists ? ' track-row-va' : ''}${currentTrack?.id === song.id ? ' active' : ''}`}
                   onMouseEnter={() => setHoveredSongId(song.id)}
                   onMouseLeave={() => setHoveredSongId(null)}
                   onDoubleClick={() => handlePlaySong(song)}
@@ -432,12 +432,14 @@ export default function AlbumDetail() {
                 >
                   <div
                     className="track-num"
-                    style={{ textAlign: 'center', cursor: hoveredSongId === song.id ? 'pointer' : 'default', color: hoveredSongId === song.id ? 'var(--accent)' : undefined }}
+                    style={{ textAlign: 'center', cursor: hoveredSongId === song.id ? 'pointer' : 'default', color: (hoveredSongId === song.id || currentTrack?.id === song.id) ? 'var(--accent)' : undefined }}
                     onClick={() => handlePlaySong(song)}
                   >
                     {hoveredSongId === song.id
                       ? <Play size={13} fill="currentColor" />
-                      : (song.track ?? i + 1)}
+                      : currentTrack?.id === song.id
+                        ? <Play size={13} fill="currentColor" />
+                        : (song.track ?? i + 1)}
                   </div>
                   <div className="track-info">
                     <span className="track-title" data-tooltip={song.title}>{song.title}</span>
@@ -447,14 +449,6 @@ export default function AlbumDetail() {
                       <span className="track-artist">{song.artist}</span>
                     </div>
                   )}
-                  <div className="track-meta" style={{ display: 'flex', alignItems: 'center' }}>
-                    {(song.suffix || song.bitRate) && (
-                      <span className="track-codec" style={{ marginTop: 0 }}>
-                        {codecLabel(song)}
-                        {song.size ? <span className="track-size"> · {formatSize(song.size)}</span> : null}
-                      </span>
-                    )}
-                  </div>
                   <div style={{ display: 'flex', justifyContent: 'center' }}>
                     <button
                       className="btn btn-ghost"
@@ -472,6 +466,13 @@ export default function AlbumDetail() {
                   <div className="track-duration" style={{ textAlign: 'right' }}>
                     {formatDuration(song.duration)}
                   </div>
+                  <div className="track-meta" style={{ display: 'flex', alignItems: 'center' }}>
+                    {(song.suffix || song.bitRate) && (
+                      <span className="track-codec" style={{ marginTop: 0 }}>
+                        {codecLabel(song)}
+                      </span>
+                    )}
+                  </div>
                 </div>
               ))}
             </div>

src/pages/RandomMix.tsx

@@ -1,7 +1,7 @@
 import React, { useEffect, useState } from 'react';
 import { getRandomSongs, SubsonicSong, star, unstar } from '../api/subsonic';
 import { usePlayerStore } from '../store/playerStore';
-import { Play, HandMetal, RefreshCw } from 'lucide-react';
+import { Play, Star, RefreshCw } from 'lucide-react';
 import { useTranslation } from 'react-i18next';
 
 function formatDuration(seconds: number): string {
@@ -133,7 +133,7 @@ export default function RandomMix() {
                   data-tooltip={starredSongs.has(song.id) ? t('randomMix.favoriteRemove') : t('randomMix.favoriteAdd')}
                   style={{ padding: '4px', height: 'auto', minHeight: 'unset', color: starredSongs.has(song.id) ? 'var(--accent)' : 'var(--text-muted)' }}
                 >
-                  <HandMetal size={14} fill={starredSongs.has(song.id) ? "currentColor" : "none"} />
+                  <Star size={14} fill={starredSongs.has(song.id) ? "currentColor" : "none"} />
                 </button>
               </div>
 

src/pages/Settings.tsx

@@ -374,7 +374,7 @@ export default function Settings() {
                 Psysonic
               </div>
               <div style={{ fontSize: 12, color: 'var(--text-muted)', marginTop: 2 }}>
-                {t('settings.aboutVersion')} 1.0.9
+                {t('settings.aboutVersion')} 1.0.10
               </div>
             </div>
           </div>
@@ -397,6 +397,10 @@ export default function Settings() {
               <span style={{ color: 'var(--text-muted)', minWidth: 56 }}>Stack</span>
               <span style={{ color: 'var(--text-secondary)' }}>{t('settings.aboutBuiltWith')}</span>
             </div>
+            <div style={{ display: 'flex', gap: '0.5rem' }}>
+              <span style={{ color: 'var(--text-muted)', minWidth: 56 }}>AI</span>
+              <span style={{ color: 'var(--text-secondary)' }}>{t('settings.aboutAiCredit')}</span>
+            </div>
           </div>
 
           <button