feat(settings): player bar layout — per-control visibility toggles (#627) (#721)

Adds a new sub-section under Settings → Personalisation (Advanced) that
hides individual controls in the player bar: Star rating, Favorite
(heart), Last.fm love, Equalizer, Mini player. Last.fm love still only
renders when a Last.fm session exists; the overflow row in the player
collapses when both Equalizer and Mini player are hidden.

- New `playerBarLayoutStore` (Zustand + persist, items[{id, visible}] +
  rehydrate sanitize) following the queueToolbar / playlistLayout
  pattern; defaults to all visible.
- New `PlayerBarLayoutCustomizer` reuses the same row + toggle pattern
  as the other personalisation customisers.
- Gates threaded through `PlayerTrackInfo` (3 controls), `PlayerBar`
  (EQ + Mini buttons), and `PlayerOverflowMenu` (EQ + Mini in the
  overflow row, with row-level conditional).
- `PersonalisationTab`: added as the last advanced sub-section so it
  only appears when the global Advanced Mode toggle is on.
- Settings search index gets entries for both Playlist page layout and
  Player bar (playlist row was missing).
- New i18n keys `settings.playerBar*` in all 9 locales.

Reuses kveld9's design from PR #627; not merged because the locale
split and the Advanced Mode refactor landed afterwards. Credited via
Co-Authored-By trailer + a new line in settingsCredits.ts under the
existing kveld9 entry.

Co-authored-by: Kveld. <kveld912@proton.me>

src/components/PlayerBar.tsx

@@ -38,10 +38,17 @@ import { PlayerVolume } from './playerBar/PlayerVolume';
 import { PlayerOverflowMenu } from './playerBar/PlayerOverflowMenu';
 import { useFloatingPlayerBar } from '../hooks/useFloatingPlayerBar';
 import { useUtilityOverflowMenu } from '../hooks/useUtilityOverflowMenu';
+import {
+  usePlayerBarLayoutStore,
+  type PlayerBarLayoutItemId,
+} from '../store/playerBarLayoutStore';
 
 export default function PlayerBar() {
   const { t } = useTranslation();
   const navigatePlaybackLibrary = usePlaybackLibraryNavigate();
+  const layoutItems = usePlayerBarLayoutStore(s => s.items);
+  const isLayoutVisible = (id: PlayerBarLayoutItemId) =>
+    layoutItems.find(i => i.id === id)?.visible !== false;
   const [eqOpen, setEqOpen] = useState(false);
   const [showVolPct, setShowVolPct] = useState(false);
   const [localShowRemaining, setLocalShowRemaining] = useState(() => useThemeStore.getState().showRemainingTime);
@@ -282,23 +289,27 @@ export default function PlayerBar() {
         </div>
       ) : (
         <>
-          <button
-            className={`player-btn player-btn-sm player-eq-btn ${eqOpen ? 'active' : ''}`}
-            onClick={() => setEqOpen(v => !v)}
-            aria-label={t('player.equalizer')}
-            data-tooltip={t('player.equalizer')}
-          >
-            <SlidersVertical size={15} />
-          </button>
+          {isLayoutVisible('equalizer') && (
+            <button
+              className={`player-btn player-btn-sm player-eq-btn ${eqOpen ? 'active' : ''}`}
+              onClick={() => setEqOpen(v => !v)}
+              aria-label={t('player.equalizer')}
+              data-tooltip={t('player.equalizer')}
+            >
+              <SlidersVertical size={15} />
+            </button>
+          )}
 
-          <button
-            className="player-btn player-btn-sm"
-            onClick={() => invoke('open_mini_player').catch(() => {})}
-            aria-label={t('player.miniPlayer')}
-            data-tooltip={t('player.miniPlayer')}
-          >
-            <PictureInPicture2 size={15} />
-          </button>
+          {isLayoutVisible('miniPlayer') && (
+            <button
+              className="player-btn player-btn-sm"
+              onClick={() => invoke('open_mini_player').catch(() => {})}
+              aria-label={t('player.miniPlayer')}
+              data-tooltip={t('player.miniPlayer')}
+            >
+              <PictureInPicture2 size={15} />
+            </button>
+          )}
 
           <PlayerVolume
             volume={volume}