From f9df918c72000c2fd68737de85e5893449d55c34 Mon Sep 17 00:00:00 2001
From: Psychotoxical <171614930+Psychotoxical@users.noreply.github.com>
Date: Sun, 7 Jun 2026 02:47:33 +0200
Subject: [PATCH] feat(themes): community Theme Store + semantic-token refactor
 (#1009)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* feat(themes): add semantic tokens for the theme-store contract (B0 P1)

Additive: define --highlight, --accent-2, --bg-deep, --bg-elevated and
--text-on-accent on the :root base as --ctp-* mappings. They resolve
per-theme automatically and nothing consumes them yet (zero behaviour
change) — groundwork for replacing direct --ctp-* use in components.

* refactor(themes): components consume semantic tokens, not --ctp-* (B0 P2)

Replace every direct --ctp-* reference in component/layout/track CSS and
TSX inline styles with the readable semantic token (--bg-app, --accent,
--highlight, --text-on-accent, …). --ctp-* now survives only as the
Catppuccin palette layer the base maps from, and as the deliberate
categorical rainbow in Composers/Genres/artistsHelpers (left untouched).

This is the readable contract surface for the community theme store.
Divergences (theme set a semantic var != its --ctp- source) are
corrections — the element now uses the theme's real semantic colour.

* feat(themes): add player-bar title/artist color tokens

New optional --player-title / --player-artist, defaulting to --text-primary / --text-secondary so nothing changes unless a theme overrides them. Lets a theme give the now-playing readout its own colour as a plain token.

* refactor(themes): token-only theme library (flatten, whitelist, one file per theme)

Turn every built-in theme into a single self-contained [data-theme] var block of semantic whitelist tokens (plus the internal --ctp-* palette layer):

- Flatten all themes: drop structural override rules, @keyframes, and global-token overrides (radius / shadow-elevation / transition / spacing / font / focus-ring). Signature player-bar readout colours are preserved via the new --player-title / --player-artist tokens.

- Normalize the var blocks to the semantic whitelist: drop the alternate token vocabulary (nav-active / scrollbar / bg-input / success / border-default / ...); rename --success -> --positive and --border-default -> --border where no whitelist equivalent was set. Migrate the few components that read those tokens to the whitelist equivalents.

- Split multi-theme files so each theme ships as its own file, making the built-in set 1:1 with the per-theme store packaging.

Kept as-is (built-in, not flattened): the two colour-blind-safe accessibility themes, plus the two curated core skins.

* chore(themes): remove seven themes retired after the token refactor

These themes leaned on heavy structural overrides and were dropped rather than flattened. Full removal each: the CSS file(s), the index.css import, the Theme type union, and the ThemePicker entry.

* feat(themes): granular tokens — track lists

Wire track rows to per-region tokens: row hover (--row-hover), the now-playing
row + indicator (--row-playing-bg / --row-playing-text), track title/artist/
number/duration text, column-header text, row dividers, and the resize-handle
active colour. Covers the desktop tracklist, the shared song-row (Tracks hub /
search), and the mobile tracklist. Drop a baked border fallback. Visual no-op.

* feat(themes): granular tokens — cards

Wire album and artist cards to per-region tokens (--card-hover-border,
--card-title, --card-subtitle, --card-placeholder-bg). Visual no-op.

* fix(themes): drop undefined/baked colour aliases

Replace the undefined --bg-surface (resolved to nothing — broken placeholder
backgrounds and filter input) with --card-placeholder-bg / --input-bg, and the
baked-hex aliases --color-error / --color-warning with --danger / --warning so
themes can actually recolour them.

* feat(themes): Spectrum demo theme + trim unused cascade tokens

Add a loud built-in demo theme that gives each region its own hue (sidebar
green, player pink, lists cyan, cards gold, menus red, controls blue) so the
per-region granularity is obvious when you switch to it. Drop two unused
cascade tokens (--sidebar-text-active, --row-active-bg) and the unused
on-media block (those media surfaces stay static by design).

* style(themes): make Spectrum demo brutally loud

Full-saturation neon per region (toxic green sidebar, magenta player, cyan
lists, acid-yellow cards, blood-red menus, electric-blue controls, purple
scrollbar) so the per-region separation is unmistakable. The earlier soft
tints were too subtle to read.

* feat(themes): name the granular demo theme Braindead

* feat(themes): granular per-region tokens — cascade layer + sidebar

Add an optional per-region token layer (semantic-cascade.css) so a theme can
recolour individual regions — sidebar hover, player controls, list rows,
menus, inputs, on-media surfaces — independently of the global tokens. Every
token defaults to its base token (or a media-safe literal), so this is a
visual no-op until a theme overrides one; it only adds control points.

Wire the sidebar region as the first consumer and drop the baked grey
fallbacks (--bg-tertiary, etc.) that no theme could reach.

* feat(themes): granular tokens — controls, menus, scrollbar

Wire inputs, buttons, sliders, the custom-select, context menus, submenus and
modals to per-region tokens, and tokenise the scrollbar. Complete B0 by
dropping the last direct --ctp-* references in the input/button/progress/
scrollbar utility CSS.

Fix three undefined-token bugs that fell back to nothing (so no theme could
reach them): --surface-2 (context-menu hover had no highlight), --bg-surface
(submenu create-input had no background), and the baked grey fallbacks in the
custom-select. Every other new token defaults to today's value — a visual
no-op that only adds override points.

* feat(themes): granular tokens — player bar

Wire the desktop player bar's transport controls, time toggle, and overflow
menu to per-region tokens (--player-control, --player-time-toggle-*, etc.).
Fix the undefined --surface-hover/--surface-active grey fallbacks on the time
toggle. Visual no-op; defaults match today's values.

* chore(themes): remove empty theme stub files

Six theme CSS files were reduced to comment-only stubs by the flatten
sweep but their files and @import lines remained. Five are empty
structural companions of now-flattened themes (morpheus, p-dvd,
aero-glass, luna-teal) and two are orphans of cut themes
(order-of-the-phoenix, pandora). Removed the files and their imports.

* feat(themes): runtime injection foundation for the theme store

Plumbing for installed community themes ahead of the in-app store UI,
nothing user-visible yet:

- installedThemesStore: persisted (localStorage) record of installed
  community themes incl. their CSS text, so an active community theme is
  available synchronously at startup (no flash, fully offline).
- themeInjection: reconcile <head> <style data-installed-theme> elements
  with the store; lightweight defense-in-depth sanitize on top of CI.
- themeRegistry: jsDelivr registry client with a 12h localStorage cache
  and stale-on-error fallback.
- App: inject installed themes before applying data-theme, in both webviews.
- themeStore: widen the Theme type to accept dynamic installed ids.

* feat(themes): dedicated Themes settings tab

Move theme selection and the day/night scheduler out of Appearance into
a new dedicated Themes tab — the future home of the community Theme Store.
Appearance keeps grid columns, visual options, UI scale, font and seekbar.

- ThemesTab: theme picker + scheduler (relocated verbatim).
- AppearanceTab: drop the two relocated sections + now-unused imports.
- Register the tab in settingsTabs (Tab union, resolveTab, search index)
  and Settings (tab bar, render, label map).
- i18n: settings.tabThemes in all 9 locales.

* feat(themes): community Theme Store browse + install

Add the Theme Store section to the Themes tab:

- Fetch the jsDelivr registry (12h cache, stale-on-error fallback).
- Search by name/author/description + filter by light/dark + refresh.
- Per-row CDN thumbnail, name, author, description and actions:
  Install / Apply / Update / Uninstall. Installing fetches the CSS,
  persists it (localStorage) and the runtime injection applies it;
  uninstalling the active theme falls back to the matching core.
- Rating slot left reserved (deferred).
- i18n: themeStore* keys in all 9 locales.

* feat(themes): slim bundle to fixed cores + flat Themes tab

Remove the 86 store palettes (incl. braindead) from the app bundle — the
CSS files, their index.css imports, the Theme union and the picker data —
leaving only the six fixed cores (Catppuccin Mocha/Latte, Kanagawa Wave,
Stark HUD, Vision Dark/Navy). Everything else installs from the store.

Themes tab is rebuilt flat (no collapsible accordions):
- "Your Themes": one card grid of the fixed cores + installed community
  themes; click to apply, uninstall on community ones (active theme falls
  back to the matching core). Catppuccin prefix on Mocha/Latte; a CVD-safe
  pill on the colour-blind-safe Vision themes.
- Scheduler day/night options include installed themes.
- Theme Store: alphabetical order, thumbnail lightbox, and a submit hint
  above the search linking to the themes repository.
- Nav order: Servers, Library, Audio, Themes, Appearance, Lyrics, …
- ThemePicker accordion removed; fixed-theme data moved to fixedThemes.ts.
- i18n for all new strings across 9 locales.

* feat(themes): reset removed-from-bundle themes to a bundled fallback

After slimming the bundle to the six fixed core themes, a profile upgraded
from an older build may have an active or scheduler theme that is now
store-only and not installed — it has no [data-theme] block and would render
as unstyled :root. Reset any theme/themeDay/themeNight that is neither bundled
nor installed to a bundled fallback: Mocha for the main + night slots, Latte
for the day slot. Runs synchronously in runPreReactBootstrap, rewriting the
persisted selection in localStorage before React mounts (no flash; Zustand
rehydrates after first paint). No auto-install and no network — the fallback
is always a bundled theme, so it works offline.

* feat(themes): floating back-to-top button on the Themes tab

The Themes tab can get long (theme grid + scheduler + full store list), so
add a floating back-to-top affordance that appears once the page is scrolled
and smooth-scrolls to the top. It is portalled into the route host and
positioned absolute against it — the main scroll viewport sets contain: paint,
which would otherwise make position: fixed resolve against the scrolling box
and drift with the content. Reusable component (scroll viewport id + threshold
props); i18n common.backToTop added in all nine locales.

* feat(themes): accessibility + state polish for the Theme Store

- Reuse the shared CoverLightbox for the thumbnail preview instead of a
  second inline dialog — gains a visible close button and a focus-managed,
  portalled dialog, and drops duplicated markup.
- Theme cards expose aria-pressed so assistive tech announces the selected
  theme, not just the visual check.
- Transient store messages get live-region roles (loading/empty/install
  failure = status, fetch error = alert).
- Thumbnails degrade gracefully when offline/missing (hide the broken-image
  glyph; the thumbnail button no longer stretches with the row, so its
  background can't show as letterbox bars).

* feat(themes): larger store-row thumbnails (120x75 -> 200x125)

The list previews were too small to make a theme out; bump the display size
(same 1.6 aspect). Thumbnails are now served at 720x450, so the larger
display stays crisp.

* fix(themes): bust thumbnail cache on registry change

jsDelivr serves theme thumbnails with a 7-day max-age, so when a thumbnail
is updated the webview keeps showing its cached old image (the path is
unchanged). Append the registry's generatedAt as a cache-busting query to
the thumbnail URLs (list + lightbox); it changes on every themes push, so a
registry refresh makes the webview re-fetch and reflect the current CDN
image instead of a stale one.

* docs(themes): changelog + credits for the Theme Store

Add the 1.48.0 "Themes — community Theme Store" changelog entry (PR #1009)
and the matching line in the Psychotoxical credits.

* fix(themes): address PR review (uninstall hygiene, validation, polish)

Uninstall/scheduler & validation:
- uninstallTheme() repairs every selection slot (active + day + night), not
  just the manual one, and is shared by both uninstall buttons (dedup).
- Validate theme CSS at install time and skip persisting CSS that won't inject
  (no more "installed/active but renders nothing" with no feedback).
- Harden the runtime validator: exactly one rule, scoped exactly to the
  theme's [data-theme='<id>'] selector (no unscoped/foreign selectors), no
  at-rules, url() only data:, no expression()/javascript:, size-capped.

Tokens & polish:
- Fix three dangling undefined tokens (--surface-2 x2, --bg-surface).
- Finish the warning/success token sweep (--warning / --positive, themeable).
- Apply the active theme synchronously before React mounts (no first-frame
  flash) and inject installed themes up front.
- One-time, dismissible notice when the slim-bundle migration reset a theme.
- Update badge uses semver, not string inequality.
- Offline/stale indicator in the store; cross-window theme sync; drop the now
  dead REMOVED_THEME_REMAP and Card.mode field.

Tests: themeInjection (validator + sync), themeRegistry (cache/force/stale/
malformed), uninstallTheme (slot repair), migration notice. i18n in all nine
locales. Full suite green (1755 tests).

* test(bootstrap): cover startup theme apply + cross-window sync

The review fixes added applyThemeAtStartup / installCrossWindowThemeSync to
bootstrap.ts (a hot-path file) without tests, dropping its coverage to 68.3%
and failing the frontend hot-path coverage gate (>=70%). Add unit tests for
both (and the no-op / malformed-storage paths); bootstrap.ts is back to ~98%.
---
 CHANGELOG.md                                  |   10 +
 src/App.tsx                                   |   13 +
 src/app/AppShell.tsx                          |    2 +
 src/app/bootstrap.test.ts                     |   59 +
 src/app/bootstrap.ts                          |   67 +
 src/components/BackToTopButton.tsx            |   64 +
 src/components/CachedImage.tsx                |    2 +-
 src/components/LosslessFilterButton.tsx       |    2 +-
 src/components/NowPlayingDropdown.tsx         |    4 +-
 src/components/PSmallLogo.tsx                 |    2 +-
 src/components/PlayerBar.tsx                  |    2 +-
 src/components/PsysonicLogo.tsx               |    2 +-
 src/components/StarFilterButton.tsx           |    2 +-
 src/components/ThemeMigrationNotice.tsx       |   40 +
 src/components/ThemePicker.tsx                |  271 -----
 src/components/WaveformSeekPreview.tsx        |    4 +-
 src/components/YearFilterButton.tsx           |    2 +-
 .../internetRadio/RadioDirectoryModal.tsx     |    4 +-
 src/components/nowPlaying/Hero.tsx            |    6 +-
 src/components/playlists/PlaylistsHeader.tsx  |    2 +-
 .../queuePanel/LoadPlaylistModal.tsx          |    4 +-
 .../settings/AnalyticsStrategySection.tsx     |    2 +-
 src/components/settings/AppearanceTab.tsx     |   88 +-
 src/components/settings/InputTab.tsx          |    4 +-
 src/components/settings/InstalledThemes.tsx   |  137 +++
 src/components/settings/ServersTab.tsx        |    4 +-
 src/components/settings/ThemeStoreSection.tsx |  306 +++++
 src/components/settings/ThemesTab.tsx         |  123 ++
 src/components/settings/UserForm.tsx          |    8 +-
 src/components/settings/fixedThemes.ts        |   23 +
 src/components/settings/settingsTabs.ts       |    8 +-
 .../settings/userMgmt/MagicStringModal.tsx    |    4 +-
 .../settings/userMgmt/UserMgmtRow.tsx         |    4 +-
 src/config/settingsCredits.ts                 |    1 +
 src/contexts/DragDropContext.tsx              |    2 +-
 src/locales/de/common.ts                      |    1 +
 src/locales/de/settings.ts                    |   30 +
 src/locales/en/common.ts                      |    1 +
 src/locales/en/settings.ts                    |   30 +
 src/locales/es/common.ts                      |    1 +
 src/locales/es/settings.ts                    |   30 +
 src/locales/fr/common.ts                      |    1 +
 src/locales/fr/settings.ts                    |   30 +
 src/locales/nb/common.ts                      |    1 +
 src/locales/nb/settings.ts                    |   30 +
 src/locales/nl/common.ts                      |    1 +
 src/locales/nl/settings.ts                    |   30 +
 src/locales/ro/common.ts                      |    1 +
 src/locales/ro/settings.ts                    |   30 +
 src/locales/ru/common.ts                      |    1 +
 src/locales/ru/settings.ts                    |   30 +
 src/locales/zh/common.ts                      |    1 +
 src/locales/zh/settings.ts                    |   30 +
 src/pages/Albums.tsx                          |    6 +-
 src/pages/Artists.tsx                         |    8 +-
 src/pages/GenreDetail.tsx                     |    2 +-
 src/pages/LosslessAlbums.tsx                  |    2 +-
 src/pages/NewReleases.tsx                     |    4 +-
 src/pages/RandomAlbums.tsx                    |    4 +-
 src/pages/Settings.tsx                        |   10 +-
 src/pages/Statistics.tsx                      |    2 +-
 src/store/installedThemesStore.ts             |   50 +
 src/store/themeStore.ts                       |   48 +-
 src/styles/components/album-card.css          |    4 +-
 src/styles/components/album-row-container.css |   10 +-
 .../components/album-tracklist-mobile.css     |   12 +-
 src/styles/components/alphabet-filter-bar.css |    2 +-
 .../components/artist-card-grid-view.css      |    8 +-
 .../artist-card-selection-checkbox.css        |    2 +-
 .../components/artists-page-alphabet-bar.css  |    4 +-
 src/styles/components/back-to-top.css         |   45 +
 .../components/context-menu-submenu.css       |   10 +-
 src/styles/components/context-menu.css        |   14 +-
 src/styles/components/cover-lightbox.css      |    6 +-
 src/styles/components/custom-select.css       |   18 +-
 src/styles/components/device-sync.css         |   22 +-
 .../components/download-folder-modal.css      |    2 +-
 src/styles/components/filter-quick-clear.css  |    2 +-
 src/styles/components/genre-filter-bar.css    |    4 +-
 src/styles/components/help-page.css           |    4 +-
 src/styles/components/hero.css                |    4 +-
 src/styles/components/index.css               |    1 +
 src/styles/components/live-search.css         |    6 +-
 src/styles/components/login-page.css          |    4 +-
 src/styles/components/mini-player-window.css  |   16 +-
 src/styles/components/modal.css               |   34 +-
 src/styles/components/most-played-page.css    |    4 +-
 src/styles/components/now-playing-page-2.css  |    6 +-
 src/styles/components/np-dash.css             |    8 +-
 src/styles/components/offline-library.css     |    4 +-
 .../components/orbit-session-top-strip.css    |   94 +-
 ...ayback-delay-sleep-delayed-start-modal.css |   22 +-
 src/styles/components/playlist-edit-modal.css |    6 +-
 .../components/playlist-search-panel.css      |    4 +-
 src/styles/components/playlists-page.css      |    8 +-
 .../components/radio-card-edit-chip.css       |    4 +-
 .../components/radio-nowplaying-section.css   |    2 +-
 src/styles/components/radio-toolbar.css       |    4 +-
 src/styles/components/random-landing.css      |    2 +-
 src/styles/components/settings.css            |    6 +-
 src/styles/components/sidebar-customizer.css  |    6 +-
 src/styles/components/tracklist.css           |   46 +-
 src/styles/layout/player-bar.css              |   26 +-
 src/styles/layout/queue-panel.css             |    6 +-
 src/styles/layout/scrubber.css                |    2 +-
 .../layout/sidebar-device-sync-queue.css      |    6 +-
 .../sidebar-expandable-playlists-section.css  |   20 +-
 src/styles/layout/sidebar.css                 |   64 +-
 src/styles/layout/transport-controls.css      |    4 +-
 ...unk-juanmnl-vs-1984-mint-green-variant.css |   56 -
 ...-1984-default-dark-deep-blue-cyberpunk.css |   56 -
 ...984-light-juanmnl-vs-1984-bluish-white.css |   56 -
 ...uanmnl-vs-1984-sepia-dystopian-variant.css |   56 -
 ...-theme-of-ice-and-fire-game-of-thrones.css |  254 ----
 src/styles/themes/amoled-black-pure.css       |   68 --
 ...ark-th3whit3wolf-one-nvim-dark-variant.css |   56 -
 ...ht-th3whit3wolf-one-nvim-light-variant.css |   56 -
 .../back-to-the-future-hill-valley-85.css     |  954 ---------------
 .../themes/blade-cinematic-industrial.css     |  342 ------
 src/styles/themes/button-variants.css         |   10 +-
 src/styles/themes/carbon-grey.css             |   68 --
 src/styles/themes/carbonfox.css               |   53 -
 .../themes/catppuccin-frapp-variables.css     |   50 -
 .../themes/catppuccin-macchiato-variables.css |   50 -
 .../themes/catppuccin-mocha-variables.css     |   16 +
 .../classic-winamp-winamp-2-x-base-skin.css   |   67 -
 src/styles/themes/community-themes.css        |    2 -
 src/styles/themes/copper-oxide.css            |   68 --
 src/styles/themes/cupertino-beats.css         |   97 --
 src/styles/themes/cyberlink-powerdvd.css      |  259 ----
 src/styles/themes/d-oh-matic.css              |   81 --
 ...k-side-of-the-moon-inspired-pink-floyd.css |  286 -----
 src/styles/themes/data-theme-aqua-quartz.css  |  265 ----
 src/styles/themes/dawnfox.css                 |   53 -
 src/styles/themes/dayfox.css                  |   53 -
 src/styles/themes/deep-forest.css             |   66 -
 .../dracula-component-level-overrides.css     |   24 -
 src/styles/themes/dracula.css                 |   70 --
 src/styles/themes/dune-arrakis.css            | 1079 -----------------
 src/styles/themes/duskfox.css                 |   53 -
 src/styles/themes/dzr0.css                    |  104 --
 ...-theft-audio-gta-v-los-santos-at-night.css |  225 ----
 src/styles/themes/gruvbox-dark-hard.css       |   53 -
 src/styles/themes/gruvbox-dark-medium.css     |   53 -
 src/styles/themes/gruvbox-dark-soft.css       |   53 -
 src/styles/themes/gruvbox-light-hard.css      |   51 -
 src/styles/themes/gruvbox-light-medium.css    |   51 -
 src/styles/themes/gruvbox-light-soft.css      |   66 -
 src/styles/themes/guild-wars-1-tyria.css      |  206 ----
 src/styles/themes/heisenberg-breaking-bad.css |  209 ----
 src/styles/themes/index.css                   |   93 +-
 src/styles/themes/input.css                   |    6 +-
 ...belot-kanagawa-nvim-high-contrast-dark.css |   56 -
 ...gawa-lotus-rebelot-kanagawa-nvim-light.css |   56 -
 .../themes/lambda-17-half-life-city-17.css    |  236 ----
 src/styles/themes/macos-ventura-dark.css      |  122 --
 src/styles/themes/macos-ventura-light.css     |  149 ---
 .../middle-earth-epic-fantasy-cinematic.css   |    4 -
 .../middle-earth-red-book-of-westmarch.css    |  589 ---------
 ...le-earth-the-one-ring-inscription-glow.css |   25 -
 src/styles/themes/midnight-blue.css           |   68 --
 src/styles/themes/morpheus-matrix-style.css   |    4 -
 src/styles/themes/ms-dos.css                  |  284 -----
 ...kebox-y2k-metallic-silver-blue-display.css |  398 ------
 src/styles/themes/neon-drift.css              |   86 --
 .../themes/nightcity-2077-cyberpunk-2077.css  |  299 -----
 src/styles/themes/nightfox.css                |   53 -
 .../themes/nord-aurora-dark-aurora-purple.css |   55 -
 .../themes/nord-frost-deep-ocean-blue.css     |   56 -
 src/styles/themes/nord-polar-night-dark.css   |   56 -
 src/styles/themes/nord-snow-storm-light.css   |   54 -
 src/styles/themes/nordfox.css                 |   53 -
 src/styles/themes/north-park-south-park.css   |  337 -----
 .../nucleo-classic-hifi-winamp-brass.css      |  111 --
 src/styles/themes/obsidian-black.css          |   72 --
 src/styles/themes/obsidian-gold.css           |   72 --
 src/styles/themes/order-of-the-phoenix.css    |    1 -
 .../themes/pandora-bioluminescent-sci-fi.css  |    4 -
 src/styles/themes/poison.css                  |   74 --
 ...ssic-virtual-hifi-receiver-vfd-display.css |    1 -
 .../powerslave-inspired-iron-maiden.css       |  384 ------
 src/styles/themes/progress-range.css          |    6 +-
 .../themes/psychowave-synthwave-retrowave.css |   61 -
 src/styles/themes/sakura-night.css            |   66 -
 src/styles/themes/scrollbars.css              |    8 +-
 src/styles/themes/semantic-cascade.css        |   74 ++
 src/styles/themes/sepia-dark.css              |   68 --
 src/styles/themes/spider-tech-spider-man.css  |  350 ------
 src/styles/themes/spotless.css                |  120 --
 src/styles/themes/terafox.css                 |   53 -
 src/styles/themes/the-matrix-morpheus.css     |  371 ------
 ...ntu-ambiance-component-level-overrides.css |  313 -----
 .../ubuntu-unity-ambiance-classic-light.css   |   77 --
 src/styles/themes/unix-shell.css              |  627 ----------
 src/styles/themes/v-tactical.css              |   84 --
 ...-tube-radio-1950s-bakelite-vacuum-tube.css |  187 ---
 src/styles/themes/violet-haze.css             |   68 --
 src/styles/themes/volcanic-dark.css           |   66 -
 src/styles/themes/w98.css                     |  476 --------
 .../themes/windows-10-fluent-design-light.css |  303 -----
 .../windows-11-dark-component-overrides.css   |  525 --------
 ...indows-7-aero-aero-glass-frutiger-aero.css |    1 -
 src/styles/themes/windows-7-aero-glass.css    |  460 -------
 .../themes/windows-vista-aero-glass.css       |  413 -------
 .../themes/windows-xp-luna-classic-2001.css   |    1 -
 src/styles/themes/windows-xp-luna-teal.css    |  482 --------
 ...classic-windows-media-player-8-xp-luna.css |  170 ---
 .../wnamp-component-level-overrides.css       |   54 -
 ...racks-hub-searchresults-advancedsearch.css |   28 +-
 src/styles/tracks/song-card.css               |    2 +-
 .../componentHelpers/queuePanelHelpers.tsx    |    4 +-
 src/utils/export/exportAlbumCard.ts           |    2 +-
 src/utils/themes/themeInjection.test.ts       |  109 ++
 src/utils/themes/themeInjection.ts            |   92 ++
 src/utils/themes/themeMigration.test.ts       |  179 +++
 src/utils/themes/themeMigration.ts            |  107 ++
 src/utils/themes/themeRegistry.test.ts        |   87 ++
 src/utils/themes/themeRegistry.ts             |  102 ++
 src/utils/themes/uninstallTheme.test.ts       |   69 ++
 src/utils/themes/uninstallTheme.ts            |   26 +
 src/utils/ui/toast.ts                         |    4 +-
 221 files changed, 2470 insertions(+), 15759 deletions(-)
 create mode 100644 src/components/BackToTopButton.tsx
 create mode 100644 src/components/ThemeMigrationNotice.tsx
 delete mode 100644 src/components/ThemePicker.tsx
 create mode 100644 src/components/settings/InstalledThemes.tsx
 create mode 100644 src/components/settings/ThemeStoreSection.tsx
 create mode 100644 src/components/settings/ThemesTab.tsx
 create mode 100644 src/components/settings/fixedThemes.ts
 create mode 100644 src/store/installedThemesStore.ts
 create mode 100644 src/styles/components/back-to-top.css
 delete mode 100644 src/styles/themes/1984-cyberpunk-juanmnl-vs-1984-mint-green-variant.css
 delete mode 100644 src/styles/themes/1984-juanmnl-vs-1984-default-dark-deep-blue-cyberpunk.css
 delete mode 100644 src/styles/themes/1984-light-juanmnl-vs-1984-bluish-white.css
 delete mode 100644 src/styles/themes/1984-orwell-juanmnl-vs-1984-sepia-dystopian-variant.css
 delete mode 100644 src/styles/themes/a-theme-of-ice-and-fire-game-of-thrones.css
 delete mode 100644 src/styles/themes/amoled-black-pure.css
 delete mode 100644 src/styles/themes/atom-one-dark-th3whit3wolf-one-nvim-dark-variant.css
 delete mode 100644 src/styles/themes/atom-one-light-th3whit3wolf-one-nvim-light-variant.css
 delete mode 100644 src/styles/themes/back-to-the-future-hill-valley-85.css
 delete mode 100644 src/styles/themes/blade-cinematic-industrial.css
 delete mode 100644 src/styles/themes/carbon-grey.css
 delete mode 100644 src/styles/themes/carbonfox.css
 delete mode 100644 src/styles/themes/catppuccin-frapp-variables.css
 delete mode 100644 src/styles/themes/catppuccin-macchiato-variables.css
 delete mode 100644 src/styles/themes/classic-winamp-winamp-2-x-base-skin.css
 delete mode 100644 src/styles/themes/community-themes.css
 delete mode 100644 src/styles/themes/copper-oxide.css
 delete mode 100644 src/styles/themes/cupertino-beats.css
 delete mode 100644 src/styles/themes/cyberlink-powerdvd.css
 delete mode 100644 src/styles/themes/d-oh-matic.css
 delete mode 100644 src/styles/themes/dark-side-of-the-moon-inspired-pink-floyd.css
 delete mode 100644 src/styles/themes/data-theme-aqua-quartz.css
 delete mode 100644 src/styles/themes/dawnfox.css
 delete mode 100644 src/styles/themes/dayfox.css
 delete mode 100644 src/styles/themes/deep-forest.css
 delete mode 100644 src/styles/themes/dracula-component-level-overrides.css
 delete mode 100644 src/styles/themes/dracula.css
 delete mode 100644 src/styles/themes/dune-arrakis.css
 delete mode 100644 src/styles/themes/duskfox.css
 delete mode 100644 src/styles/themes/dzr0.css
 delete mode 100644 src/styles/themes/grand-theft-audio-gta-v-los-santos-at-night.css
 delete mode 100644 src/styles/themes/gruvbox-dark-hard.css
 delete mode 100644 src/styles/themes/gruvbox-dark-medium.css
 delete mode 100644 src/styles/themes/gruvbox-dark-soft.css
 delete mode 100644 src/styles/themes/gruvbox-light-hard.css
 delete mode 100644 src/styles/themes/gruvbox-light-medium.css
 delete mode 100644 src/styles/themes/gruvbox-light-soft.css
 delete mode 100644 src/styles/themes/guild-wars-1-tyria.css
 delete mode 100644 src/styles/themes/heisenberg-breaking-bad.css
 delete mode 100644 src/styles/themes/kanagawa-dragon-rebelot-kanagawa-nvim-high-contrast-dark.css
 delete mode 100644 src/styles/themes/kanagawa-lotus-rebelot-kanagawa-nvim-light.css
 delete mode 100644 src/styles/themes/lambda-17-half-life-city-17.css
 delete mode 100644 src/styles/themes/macos-ventura-dark.css
 delete mode 100644 src/styles/themes/macos-ventura-light.css
 delete mode 100644 src/styles/themes/middle-earth-epic-fantasy-cinematic.css
 delete mode 100644 src/styles/themes/middle-earth-red-book-of-westmarch.css
 delete mode 100644 src/styles/themes/middle-earth-the-one-ring-inscription-glow.css
 delete mode 100644 src/styles/themes/midnight-blue.css
 delete mode 100644 src/styles/themes/morpheus-matrix-style.css
 delete mode 100644 src/styles/themes/ms-dos.css
 delete mode 100644 src/styles/themes/musicmatch-jukebox-y2k-metallic-silver-blue-display.css
 delete mode 100644 src/styles/themes/neon-drift.css
 delete mode 100644 src/styles/themes/nightcity-2077-cyberpunk-2077.css
 delete mode 100644 src/styles/themes/nightfox.css
 delete mode 100644 src/styles/themes/nord-aurora-dark-aurora-purple.css
 delete mode 100644 src/styles/themes/nord-frost-deep-ocean-blue.css
 delete mode 100644 src/styles/themes/nord-polar-night-dark.css
 delete mode 100644 src/styles/themes/nord-snow-storm-light.css
 delete mode 100644 src/styles/themes/nordfox.css
 delete mode 100644 src/styles/themes/north-park-south-park.css
 delete mode 100644 src/styles/themes/nucleo-classic-hifi-winamp-brass.css
 delete mode 100644 src/styles/themes/obsidian-black.css
 delete mode 100644 src/styles/themes/obsidian-gold.css
 delete mode 100644 src/styles/themes/order-of-the-phoenix.css
 delete mode 100644 src/styles/themes/pandora-bioluminescent-sci-fi.css
 delete mode 100644 src/styles/themes/poison.css
 delete mode 100644 src/styles/themes/powerdvd-classic-virtual-hifi-receiver-vfd-display.css
 delete mode 100644 src/styles/themes/powerslave-inspired-iron-maiden.css
 delete mode 100644 src/styles/themes/psychowave-synthwave-retrowave.css
 delete mode 100644 src/styles/themes/sakura-night.css
 create mode 100644 src/styles/themes/semantic-cascade.css
 delete mode 100644 src/styles/themes/sepia-dark.css
 delete mode 100644 src/styles/themes/spider-tech-spider-man.css
 delete mode 100644 src/styles/themes/spotless.css
 delete mode 100644 src/styles/themes/terafox.css
 delete mode 100644 src/styles/themes/the-matrix-morpheus.css
 delete mode 100644 src/styles/themes/ubuntu-ambiance-component-level-overrides.css
 delete mode 100644 src/styles/themes/ubuntu-unity-ambiance-classic-light.css
 delete mode 100644 src/styles/themes/unix-shell.css
 delete mode 100644 src/styles/themes/v-tactical.css
 delete mode 100644 src/styles/themes/vintage-tube-radio-1950s-bakelite-vacuum-tube.css
 delete mode 100644 src/styles/themes/violet-haze.css
 delete mode 100644 src/styles/themes/volcanic-dark.css
 delete mode 100644 src/styles/themes/w98.css
 delete mode 100644 src/styles/themes/windows-10-fluent-design-light.css
 delete mode 100644 src/styles/themes/windows-11-dark-component-overrides.css
 delete mode 100644 src/styles/themes/windows-7-aero-aero-glass-frutiger-aero.css
 delete mode 100644 src/styles/themes/windows-7-aero-glass.css
 delete mode 100644 src/styles/themes/windows-vista-aero-glass.css
 delete mode 100644 src/styles/themes/windows-xp-luna-classic-2001.css
 delete mode 100644 src/styles/themes/windows-xp-luna-teal.css
 delete mode 100644 src/styles/themes/wmp8-classic-windows-media-player-8-xp-luna.css
 delete mode 100644 src/styles/themes/wnamp-component-level-overrides.css
 create mode 100644 src/utils/themes/themeInjection.test.ts
 create mode 100644 src/utils/themes/themeInjection.ts
 create mode 100644 src/utils/themes/themeMigration.test.ts
 create mode 100644 src/utils/themes/themeMigration.ts
 create mode 100644 src/utils/themes/themeRegistry.test.ts
 create mode 100644 src/utils/themes/themeRegistry.ts
 create mode 100644 src/utils/themes/uninstallTheme.test.ts
 create mode 100644 src/utils/themes/uninstallTheme.ts

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 564d6238..10b1e492 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -54,6 +54,16 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 
 
+### Themes — community Theme Store
+
+**By [@Psychotoxical](https://github.com/Psychotoxical), PR [#1009](https://github.com/Psychotoxical/psysonic/pull/1009)**
+
+* New **Settings → Themes** tab: pick a theme, set the day/night scheduler, and browse a built-in **Theme Store** to install, update and uninstall community themes — with search, a dark/light filter, and full-size thumbnail previews.
+* The app now bundles six core themes (Catppuccin Mocha & Latte, Kanagawa Wave, Stark HUD, and the colour-blind-safe Vision Dark / Vision Navy); every other palette installs on demand from the [psysonic-themes](https://github.com/Psysonic/psysonic-themes) repo. Installed themes are saved locally and apply instantly at startup, even offline.
+* Upgrading from an older build: an active or scheduled theme that has moved to the store and isn't installed falls back to Mocha (dark) / Latte (light).
+
+
+
 ## Changed
 
 ### Dependencies — npm and Rust refresh
diff --git a/src/App.tsx b/src/App.tsx
index 142d8186..08816e32 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,6 +1,8 @@
 import { useEffect } from 'react';
 import { useAuthStore } from './store/authStore';
 import { useThemeStore } from './store/themeStore';
+import { useInstalledThemesStore } from './store/installedThemesStore';
+import { syncInjectedThemes } from './utils/themes/themeInjection';
 import { useThemeScheduler } from './hooks/useThemeScheduler';
 import { useFontStore } from './store/fontStore';
 import { getWindowKind } from './app/windowKind';
@@ -13,10 +15,21 @@ export default function App() {
   useThemeStore(s => s.theme);
   const effectiveTheme = useThemeScheduler();
   const font = useFontStore(s => s.font);
+  const installedThemes = useInstalledThemesStore(s => s.themes);
 
   // Document-attribute hooks are shared between both window kinds — each
   // webview has its own `document`, and theme / font / track-preview tokens
   // are read by CSS in both trees.
+
+  // Installed community themes have no build-time CSS — inject their
+  // `[data-theme='<id>']` blocks into <head> from the persisted (localStorage)
+  // store. Runs before the data-theme effect below so the matching style exists
+  // when the attribute is applied. The store hydrates synchronously, so an
+  // active community theme is painted without a network round-trip.
+  useEffect(() => {
+    syncInjectedThemes(installedThemes);
+  }, [installedThemes]);
+
   useEffect(() => {
     document.documentElement.setAttribute('data-theme', effectiveTheme);
   }, [effectiveTheme]);
diff --git a/src/app/AppShell.tsx b/src/app/AppShell.tsx
index 446d78ac..89ed4ab8 100644
--- a/src/app/AppShell.tsx
+++ b/src/app/AppShell.tsx
@@ -19,6 +19,7 @@ import ContextMenu from '../components/ContextMenu';
 import SongInfoModal from '../components/SongInfoModal';
 import DownloadFolderModal from '../components/DownloadFolderModal';
 import GlobalConfirmModal from '../components/GlobalConfirmModal';
+import ThemeMigrationNotice from '../components/ThemeMigrationNotice';
 import OrbitAccountPicker from '../components/OrbitAccountPicker';
 import OrbitHelpModal from '../components/OrbitHelpModal';
 import TooltipPortal from '../components/TooltipPortal';
@@ -320,6 +321,7 @@ export function AppShell() {
       <SongInfoModal />
       <DownloadFolderModal />
       <GlobalConfirmModal />
+      <ThemeMigrationNotice />
       <OrbitAccountPicker />
       <OrbitHelpModal />
       {!perfFlags.disableTooltipPortal && <TooltipPortal />}
diff --git a/src/app/bootstrap.test.ts b/src/app/bootstrap.test.ts
index 7b16f5ae..f22e82d9 100644
--- a/src/app/bootstrap.test.ts
+++ b/src/app/bootstrap.test.ts
@@ -24,10 +24,14 @@ vi.mock('./windowKind', () => ({
 import { invoke } from '@tauri-apps/api/core';
 import { getWindowKind } from './windowKind';
 import {
+  applyThemeAtStartup,
+  installCrossWindowThemeSync,
   pushLoggingModeToBackend,
   pushUserAgentToBackend,
   runPreReactBootstrap,
 } from './bootstrap';
+import { useThemeStore } from '../store/themeStore';
+import { useInstalledThemesStore } from '../store/installedThemesStore';
 
 const ORIGINAL_USER_AGENT = window.navigator.userAgent;
 
@@ -48,6 +52,8 @@ beforeEach(() => {
 
 afterEach(() => {
   setUserAgent(ORIGINAL_USER_AGENT);
+  document.documentElement.removeAttribute('data-theme');
+  document.head.querySelectorAll('style[data-installed-theme]').forEach((el) => el.remove());
 });
 
 describe('pushUserAgentToBackend', () => {
@@ -143,3 +149,56 @@ describe('runPreReactBootstrap', () => {
     // the bootstrap doesn't second-guess that decision.
   });
 });
+
+describe('applyThemeAtStartup', () => {
+  const setPersistedTheme = (state: Record<string, unknown>) =>
+    localStorage.setItem('psysonic_theme', JSON.stringify({ state, version: 1 }));
+
+  it('does nothing when there is no persisted theme', () => {
+    applyThemeAtStartup();
+    expect(document.documentElement.getAttribute('data-theme')).toBeNull();
+  });
+
+  it('sets data-theme to the active theme (scheduler off)', () => {
+    setPersistedTheme({ theme: 'kanagawa-wave', enableThemeScheduler: false });
+    applyThemeAtStartup();
+    expect(document.documentElement.getAttribute('data-theme')).toBe('kanagawa-wave');
+  });
+
+  it('injects installed community themes up front', () => {
+    setPersistedTheme({ theme: 'dracula', enableThemeScheduler: false });
+    localStorage.setItem('psysonic_installed_themes', JSON.stringify({
+      state: { themes: [{ id: 'dracula', name: 'Dracula', author: 'a', version: '1.0.0', description: '', mode: 'dark', css: "[data-theme='dracula']{--accent:#bd93f9;}", installedAt: 0 }] },
+      version: 1,
+    }));
+    applyThemeAtStartup();
+    expect(document.head.querySelector('style[data-installed-theme="dracula"]')).not.toBeNull();
+    expect(document.documentElement.getAttribute('data-theme')).toBe('dracula');
+  });
+
+  it('does not throw on malformed storage', () => {
+    localStorage.setItem('psysonic_theme', '{not json');
+    expect(() => applyThemeAtStartup()).not.toThrow();
+    expect(document.documentElement.getAttribute('data-theme')).toBeNull();
+  });
+});
+
+describe('installCrossWindowThemeSync', () => {
+  it('rehydrates the matching store on a cross-window storage event', () => {
+    const themeRehydrate = vi.spyOn(useThemeStore.persist, 'rehydrate').mockResolvedValue(undefined);
+    const installedRehydrate = vi.spyOn(useInstalledThemesStore.persist, 'rehydrate').mockResolvedValue(undefined);
+    installCrossWindowThemeSync();
+
+    window.dispatchEvent(new StorageEvent('storage', { key: 'psysonic_theme' }));
+    expect(themeRehydrate).toHaveBeenCalled();
+
+    window.dispatchEvent(new StorageEvent('storage', { key: 'psysonic_installed_themes' }));
+    expect(installedRehydrate).toHaveBeenCalled();
+
+    themeRehydrate.mockClear();
+    installedRehydrate.mockClear();
+    window.dispatchEvent(new StorageEvent('storage', { key: 'unrelated-key' }));
+    expect(themeRehydrate).not.toHaveBeenCalled();
+    expect(installedRehydrate).not.toHaveBeenCalled();
+  });
+});
diff --git a/src/app/bootstrap.ts b/src/app/bootstrap.ts
index 8351f369..15258183 100644
--- a/src/app/bootstrap.ts
+++ b/src/app/bootstrap.ts
@@ -1,6 +1,10 @@
 import { installQueueUndoHotkey } from '../store/queueUndoHotkey';
 import { invoke } from '@tauri-apps/api/core';
 import { getWindowKind } from './windowKind';
+import { migrateThemeSelection } from '../utils/themes/themeMigration';
+import { getScheduledTheme, useThemeStore } from '../store/themeStore';
+import { syncInjectedThemes } from '../utils/themes/themeInjection';
+import { useInstalledThemesStore, type InstalledTheme } from '../store/installedThemesStore';
 
 /** Sync backend HTTP User-Agent from the main webview once at startup. */
 export function pushUserAgentToBackend(): void {
@@ -35,6 +39,63 @@ export function pushLoggingModeToBackend(): void {
   }
 }
 
+function readInstalledThemes(): InstalledTheme[] {
+  try {
+    const raw = localStorage.getItem('psysonic_installed_themes');
+    if (!raw) return [];
+    const parsed = JSON.parse(raw) as { state?: { themes?: InstalledTheme[] } };
+    return Array.isArray(parsed.state?.themes) ? (parsed.state!.themes as InstalledTheme[]) : [];
+  } catch {
+    return [];
+  }
+}
+
+/**
+ * Apply the active theme synchronously, before React mounts, so the first paint
+ * is already correct. Zustand rehydrate + the `data-theme` effect run after the
+ * first paint, so without this a non-Mocha active theme (every light theme and
+ * every installed community theme) flashes the `:root` Mocha default for a
+ * frame. We set `data-theme` to the effective (scheduler-resolved) theme and
+ * inject installed community themes' CSS up front. Runs after the migration so
+ * the persisted ids are already resolved.
+ */
+export function applyThemeAtStartup(): void {
+  try {
+    const raw = localStorage.getItem('psysonic_theme');
+    if (!raw) return; // fresh profile — the :root default is correct
+    const parsed = JSON.parse(raw) as { state?: Record<string, unknown> };
+    const s = parsed.state;
+    if (!s) return;
+    syncInjectedThemes(readInstalledThemes());
+    const effective = getScheduledTheme({
+      enableThemeScheduler: !!s.enableThemeScheduler,
+      theme: String(s.theme ?? 'mocha'),
+      themeDay: String(s.themeDay ?? 'latte'),
+      themeNight: String(s.themeNight ?? 'mocha'),
+      timeDayStart: String(s.timeDayStart ?? '07:00'),
+      timeNightStart: String(s.timeNightStart ?? '19:00'),
+    });
+    if (effective) document.documentElement.setAttribute('data-theme', effective);
+  } catch {
+    // Non-fatal — App's effects apply the theme after mount.
+  }
+}
+
+/**
+ * Keep theme state in sync across webviews (main ↔ mini player). Zustand
+ * persist does not sync across windows on its own; the `storage` event fires in
+ * *other* windows when localStorage changes, so rehydrate the relevant store
+ * there. Installing/applying/uninstalling in one window then live-updates the
+ * other (App's effects re-run and re-apply `data-theme` / injected styles).
+ */
+export function installCrossWindowThemeSync(): void {
+  if (typeof window === 'undefined') return;
+  window.addEventListener('storage', (e) => {
+    if (e.key === 'psysonic_theme') void useThemeStore.persist?.rehydrate?.();
+    else if (e.key === 'psysonic_installed_themes') void useInstalledThemesStore.persist?.rehydrate?.();
+  });
+}
+
 /** Mark the document in Vite dev so CSS can show dev-only chrome. */
 export function markDevBuildDocument(): void {
   if (import.meta.env.DEV) {
@@ -46,6 +107,12 @@ export function markDevBuildDocument(): void {
 export function runPreReactBootstrap(): void {
   // Pre-warm the window-kind cache so subsequent reads are sync + safe.
   getWindowKind();
+  // Reset any persisted theme that is no longer bundled and not installed, so
+  // the store hydrates onto a paintable theme (no unstyled-:root flash).
+  migrateThemeSelection();
+  // Paint the correct theme on the very first frame (no Mocha flash).
+  applyThemeAtStartup();
+  installCrossWindowThemeSync();
   markDevBuildDocument();
   pushUserAgentToBackend();
   pushLoggingModeToBackend();
diff --git a/src/components/BackToTopButton.tsx b/src/components/BackToTopButton.tsx
new file mode 100644
index 00000000..64221570
--- /dev/null
+++ b/src/components/BackToTopButton.tsx
@@ -0,0 +1,64 @@
+import { useEffect, useState } from 'react';
+import { createPortal } from 'react-dom';
+import { ArrowUp } from 'lucide-react';
+import { useTranslation } from 'react-i18next';
+import { APP_MAIN_SCROLL_VIEWPORT_ID } from '../constants/appScroll';
+
+interface BackToTopButtonProps {
+  /** Id of the scroll viewport to watch/scroll. Defaults to the main route scroller. */
+  viewportId?: string;
+  /** Show the button once the viewport is scrolled past this many pixels. */
+  threshold?: number;
+}
+
+/**
+ * A floating "back to top" affordance for long pages. Watches a scroll viewport
+ * (the overlay-scroll element wrapping the routes by default) and, once it is
+ * scrolled past `threshold`, shows a button that smooth-scrolls it back to the
+ * top — reusing the same `getElementById(...).scrollTo` pattern AppShell uses
+ * for its route-change scroll reset.
+ *
+ * The button is portalled into `.app-shell-route-host` and positioned
+ * `absolute` against it: the scroll viewport itself sets `contain: paint`, which
+ * would otherwise make a `position: fixed` child resolve against the *scrolling*
+ * box (so it would drift with the content). The route host is a non-contained,
+ * `position: relative` ancestor that spans exactly the content area (between the
+ * sidebar and queue, above the player bar), so the button stays pinned to the
+ * visible viewport corner regardless of scroll.
+ */
+export default function BackToTopButton({
+  viewportId = APP_MAIN_SCROLL_VIEWPORT_ID,
+  threshold = 400,
+}: BackToTopButtonProps) {
+  const { t } = useTranslation();
+  const [visible, setVisible] = useState(false);
+  const [host, setHost] = useState<HTMLElement | null>(null);
+
+  useEffect(() => {
+    setHost(document.querySelector<HTMLElement>('.app-shell-route-host'));
+    const el = document.getElementById(viewportId);
+    if (!el) return;
+    const onScroll = () => setVisible(el.scrollTop > threshold);
+    onScroll(); // sync immediately (e.g. switching back to an already-scrolled tab)
+    el.addEventListener('scroll', onScroll, { passive: true });
+    return () => el.removeEventListener('scroll', onScroll);
+  }, [viewportId, threshold]);
+
+  if (!visible || !host) return null;
+
+  return createPortal(
+    <button
+      type="button"
+      className="back-to-top-btn"
+      onClick={() =>
+        document.getElementById(viewportId)?.scrollTo({ top: 0, behavior: 'smooth' })
+      }
+      aria-label={t('common.backToTop')}
+      data-tooltip={t('common.backToTop')}
+      data-tooltip-pos="left"
+    >
+      <ArrowUp size={18} aria-hidden="true" />
+    </button>,
+    host,
+  );
+}
diff --git a/src/components/CachedImage.tsx b/src/components/CachedImage.tsx
index 48d48eed..082dea5b 100644
--- a/src/components/CachedImage.tsx
+++ b/src/components/CachedImage.tsx
@@ -247,7 +247,7 @@ export default function CachedImage({
   };
 
   const fallbackStyle: React.CSSProperties = isFallback
-    ? { objectFit: 'contain', background: 'var(--bg-card, var(--ctp-surface0, #313244))', padding: '15%' }
+    ? { objectFit: 'contain', background: 'var(--bg-card, var(--bg-card, #313244))', padding: '15%' }
     : {};
 
   return (
diff --git a/src/components/LosslessFilterButton.tsx b/src/components/LosslessFilterButton.tsx
index 3d87e87b..c6f6c5e3 100644
--- a/src/components/LosslessFilterButton.tsx
+++ b/src/components/LosslessFilterButton.tsx
@@ -10,7 +10,7 @@ interface Props {
 export default function LosslessFilterButton({ active, onChange }: Props) {
   const { t } = useTranslation();
   const tooltip = active ? t('albums.losslessTooltipOn') : t('albums.losslessTooltipOff');
-  const activeStyle = active ? { background: 'var(--accent)', color: 'var(--ctp-crust)' } : {};
+  const activeStyle = active ? { background: 'var(--accent)', color: 'var(--text-on-accent)' } : {};
 
   return (
     <button
diff --git a/src/components/NowPlayingDropdown.tsx b/src/components/NowPlayingDropdown.tsx
index 0c60d26d..f7ac9d3f 100644
--- a/src/components/NowPlayingDropdown.tsx
+++ b/src/components/NowPlayingDropdown.tsx
@@ -108,7 +108,7 @@ export default function NowPlayingDropdown() {
         {visible.length > 0 && (
           <span style={{
             background: 'var(--accent)',
-            color: 'var(--ctp-crust)',
+            color: 'var(--text-on-accent)',
             fontSize: '10px',
             fontWeight: 'bold',
             padding: '2px 6px',
@@ -161,7 +161,7 @@ export default function NowPlayingDropdown() {
                   onClick={() => { if (stream.albumId) { setIsOpen(false); navigate(`/album/${stream.albumId}`); } }}
                   style={{ display: 'flex', gap: '0.75rem', alignItems: 'center', background: 'var(--bg-hover)', padding: '0.5rem', borderRadius: '8px', cursor: stream.albumId ? 'pointer' : 'default' }}
                 >
-                  <div style={{ width: '48px', height: '48px', flexShrink: 0, borderRadius: '6px', overflow: 'hidden', background: 'var(--bg-surface)' }}>
+                  <div style={{ width: '48px', height: '48px', flexShrink: 0, borderRadius: '6px', overflow: 'hidden', background: 'var(--card-placeholder-bg)' }}>
                     {stream.albumId && stream.coverArt ? (
                       <TrackCoverArtImage
                         song={{
diff --git a/src/components/PSmallLogo.tsx b/src/components/PSmallLogo.tsx
index 71911172..39b15173 100644
--- a/src/components/PSmallLogo.tsx
+++ b/src/components/PSmallLogo.tsx
@@ -10,7 +10,7 @@ export default function PSmallLogo({ className, style }: Props) {
     <svg viewBox="0 0 115.549 130.30972" xmlns="http://www.w3.org/2000/svg" style={style} className={className}><defs id="defs1">
       <linearGradient id="psmallGrad" x1="0%" y1="0%" x2="100%" y2="100%">
         <stop offset="0%" stopColor="var(--accent)" />
-        <stop offset="100%" stopColor="var(--ctp-blue)" />
+        <stop offset="100%" stopColor="var(--accent-2)" />
       </linearGradient>
     </defs><g
      id="layer1"
diff --git a/src/components/PlayerBar.tsx b/src/components/PlayerBar.tsx
index b5a0bd52..ce8d40be 100644
--- a/src/components/PlayerBar.tsx
+++ b/src/components/PlayerBar.tsx
@@ -180,7 +180,7 @@ export default function PlayerBar() {
   }, [volume, setVolume, utilityOverflow]);
 
   const volumeStyle = {
-    background: `linear-gradient(to right, var(--volume-accent, var(--accent)) ${volume * 100}%, var(--ctp-surface2) ${volume * 100}%)`,
+    background: `linear-gradient(to right, var(--volume-accent, var(--accent)) ${volume * 100}%, var(--bg-elevated) ${volume * 100}%)`,
   };
 
   const playerBarContent = (
diff --git a/src/components/PsysonicLogo.tsx b/src/components/PsysonicLogo.tsx
index e9ad666e..3a9b3570 100644
--- a/src/components/PsysonicLogo.tsx
+++ b/src/components/PsysonicLogo.tsx
@@ -19,7 +19,7 @@ export default function PsysonicLogo({ className, style, gradientIdSuffix }: Pro
     <svg viewBox="0 0 594.45007 134.93138" xmlns="http://www.w3.org/2000/svg" style={style} className={className}><defs id="defs1">
       <linearGradient id={gradId} x1="0%" y1="0%" x2="100%" y2="100%">
         <stop offset="0%" stopColor="var(--logo-color-start, var(--accent))" />
-        <stop offset="100%" stopColor="var(--logo-color-end, var(--ctp-blue))" />
+        <stop offset="100%" stopColor="var(--logo-color-end, var(--accent-2))" />
       </linearGradient>
     </defs><g
      id="layer1"
diff --git a/src/components/StarFilterButton.tsx b/src/components/StarFilterButton.tsx
index 21b75434..2ca6a6fb 100644
--- a/src/components/StarFilterButton.tsx
+++ b/src/components/StarFilterButton.tsx
@@ -14,7 +14,7 @@ interface Props {
 export default function StarFilterButton({ active, onChange, size = 'default' }: Props) {
   const { t } = useTranslation();
   const tooltip = active ? t('common.favoritesTooltipOn') : t('common.favoritesTooltipOff');
-  const activeStyle = active ? { background: 'var(--accent)', color: 'var(--ctp-crust)' } : {};
+  const activeStyle = active ? { background: 'var(--accent)', color: 'var(--text-on-accent)' } : {};
 
   if (size === 'compact') {
     return (
diff --git a/src/components/ThemeMigrationNotice.tsx b/src/components/ThemeMigrationNotice.tsx
new file mode 100644
index 00000000..c2be8635
--- /dev/null
+++ b/src/components/ThemeMigrationNotice.tsx
@@ -0,0 +1,40 @@
+import { useState } from 'react';
+import { useNavigate } from 'react-router-dom';
+import { useTranslation } from 'react-i18next';
+import ConfirmModal from './ConfirmModal';
+import { readThemeMigrationNotice, clearThemeMigrationNotice } from '../utils/themes/themeMigration';
+
+/**
+ * One-time, dismissible notice shown after the slim-bundle migration reset a
+ * theme that is now store-only or retired. Reads the flag written by
+ * `migrateThemeSelection` at startup, points the user at the Theme Store, and
+ * clears the flag on dismiss so it never shows again.
+ */
+export default function ThemeMigrationNotice() {
+  const { t } = useTranslation();
+  const navigate = useNavigate();
+  const [themes] = useState(() => readThemeMigrationNotice());
+  const [open, setOpen] = useState(themes.length > 0);
+
+  if (!open) return null;
+
+  const close = () => {
+    clearThemeMigrationNotice();
+    setOpen(false);
+  };
+
+  return (
+    <ConfirmModal
+      open={open}
+      title={t('settings.themeMigrationNoticeTitle')}
+      message={t('settings.themeMigrationNoticeBody', { themes: themes.join(', ') })}
+      confirmLabel={t('settings.themeMigrationNoticeOpen')}
+      cancelLabel={t('common.close')}
+      onConfirm={() => {
+        close();
+        navigate('/settings', { state: { tab: 'themes' } });
+      }}
+      onCancel={close}
+    />
+  );
+}
diff --git a/src/components/ThemePicker.tsx b/src/components/ThemePicker.tsx
deleted file mode 100644
index b724ece0..00000000
--- a/src/components/ThemePicker.tsx
+++ /dev/null
@@ -1,271 +0,0 @@
-import { Fragment, useState } from 'react';
-import { Check, ChevronDown } from 'lucide-react';
-
-interface ThemeDef {
-  id: string;
-  label: string;
-  bg: string;
-  card: string;
-  accent: string;
-  family?: string;
-}
-
-export const THEME_GROUPS: { group: string; themes: ThemeDef[] }[] = [
-  {
-    group: 'Games',
-    themes: [
-      { id: 'gw1',               label: 'GW1',               bg: '#0e0b08', card: '#1a1208', accent: '#c8960c' },
-      { id: 'grand-theft-audio', label: 'Grand Theft Audio', bg: '#141414', card: '#0a0a0a', accent: '#57b05a' },
-      { id: 'lambda-17',         label: 'Lambda 17',         bg: '#14171a', card: '#0a0b0c', accent: '#ff9d00' },
-      { id: 'nightcity-2077',    label: 'NightCity 2077',    bg: '#06060f', card: '#0a0a1a', accent: '#FCEE0A' },
-      { id: 'tetrastack',        label: 'TetraStack',        bg: '#060614', card: '#0c0c20', accent: '#00f0f0' },
-      { id: 'v-tactical',        label: 'V-Tactical',        bg: '#161c22', card: '#090c0e', accent: '#ff8a00' },
-      { id: 'horde',             label: 'Horde',             bg: '#1a0500', card: '#2e0a02', accent: '#cc2200' },
-      { id: 'alliance',          label: 'Alliance',          bg: '#06101e', card: '#0c1e34', accent: '#3388cc' },
-    ],
-  },
-  {
-    group: 'Movies',
-    themes: [
-      { id: 'blade',                label: 'Blade',                bg: '#121212', card: '#050505', accent: '#b30000' },
-      { id: 'dune',                 label: 'Dune',                 bg: '#1c1408', card: '#0e0c1a', accent: '#c8780a' },
-      { id: 'hill-valley-85',       label: 'Hill Valley 85',       bg: '#0d0b18', card: '#141120', accent: '#ff8c00' },
-      { id: 'middle-earth',         label: 'Middle Earth',         bg: '#f0e0b0', card: '#241a0e', accent: '#d4a820' },
-      { id: 'morpheus',             label: 'Morpheus',             bg: '#050905', card: '#0a120a', accent: '#00ff41' },
-      { id: 'spider-tech',          label: 'Spider-Tech',          bg: '#0e0c18', card: '#181428', accent: '#E62429' },
-      { id: 'stark-hud',            label: 'Stark HUD',            bg: '#0b0f15', card: '#05070a', accent: '#00f2ff' },
-      { id: 't-800',                label: 'T-800',                bg: '#140e0e', card: '#1a0a0a', accent: '#ff2000' },
-      { id: 'barb-and-ken',         label: 'Barb & Ken',           bg: '#1a000f', card: '#2e0019', accent: '#FF1B8D' },
-      { id: 'toy-tale',             label: 'Toy Tale',             bg: '#1a1208', card: '#2a1c10', accent: '#FFD600' },
-    ],
-  },
-  {
-    group: 'Open Source Classics',
-    themes: [
-      // ── 1984 (juanmnl/vs-1984 — only variants with a distinct palette)
-      { id: 'vs-1984',              label: 'Default',      bg: '#0d0f31', card: '#161a4a', accent: '#46BDFF', family: '1984' },
-      { id: 'vs-1984-cyberpunk',    label: 'Cyberpunk',    bg: '#1C1E27', card: '#232631', accent: '#85EEA7', family: '1984' },
-      { id: 'vs-1984-light',        label: 'Light',        bg: '#e4e5f5', card: '#d4d6e7', accent: '#4d5eff', family: '1984' },
-      { id: 'vs-1984-orwell',       label: 'Orwell',       bg: '#2e2923', card: '#3a342c', accent: '#fcd395', family: '1984' },
-      // ── Atom One (Th3Whit3Wolf/one-nvim — Atom One Dark / Light derivative)
-      { id: 'one-dark',             label: 'Dark',         bg: '#282c34', card: '#2c323c', accent: '#61afef', family: 'Atom One' },
-      { id: 'one-light',            label: 'Light',        bg: '#fafafa', card: '#ececed', accent: '#4078f2', family: 'Atom One' },
-      // ── Catppuccin (dark → light)
-      { id: 'mocha',                label: 'Mocha',        bg: '#1e1e2e', card: '#313244', accent: '#cba6f7', family: 'Catppuccin' },
-      { id: 'macchiato',            label: 'Macchiato',    bg: '#24273a', card: '#363a4f', accent: '#c6a0f6', family: 'Catppuccin' },
-      { id: 'frappe',               label: 'Frappé',       bg: '#303446', card: '#414559', accent: '#ca9ee6', family: 'Catppuccin' },
-      { id: 'latte',                label: 'Latte',        bg: '#eff1f5', card: '#ccd0da', accent: '#8839ef', family: 'Catppuccin' },
-      // ── Dracula
-      { id: 'dracula',              label: 'Dracula',      bg: '#282a36', card: '#44475a', accent: '#bd93f9', family: 'Dracula' },
-      // ── Gruvbox (dark → light, hard → soft)
-      { id: 'gruvbox-dark-hard',    label: 'Dark Hard',    bg: '#1d2021', card: '#3c3836', accent: '#fabd2f', family: 'Gruvbox' },
-      { id: 'gruvbox-dark-medium',  label: 'Dark Medium',  bg: '#282828', card: '#3c3836', accent: '#fabd2f', family: 'Gruvbox' },
-      { id: 'gruvbox-dark-soft',    label: 'Dark Soft',    bg: '#32302f', card: '#45403d', accent: '#fabd2f', family: 'Gruvbox' },
-      { id: 'gruvbox-light-hard',   label: 'Light Hard',   bg: '#f9f5d7', card: '#f2e5bc', accent: '#b57614', family: 'Gruvbox' },
-      { id: 'gruvbox-light-medium', label: 'Light Medium', bg: '#fbf1c7', card: '#f2e5bc', accent: '#b57614', family: 'Gruvbox' },
-      { id: 'gruvbox-light-soft',   label: 'Light Soft',   bg: '#f2e5bc', card: '#ebdbb2', accent: '#b57614', family: 'Gruvbox' },
-      // ── Kanagawa (default → variants)
-      { id: 'kanagawa-wave',        label: 'Wave',         bg: '#1F1F28', card: '#2A2A37', accent: '#7E9CD8', family: 'Kanagawa' },
-      { id: 'kanagawa-dragon',      label: 'Dragon',       bg: '#181616', card: '#282727', accent: '#8ba4b0', family: 'Kanagawa' },
-      { id: 'kanagawa-lotus',       label: 'Lotus',        bg: '#f2ecbc', card: '#d5cea3', accent: '#4d699b', family: 'Kanagawa' },
-      // ── Nightfox (default → variants, alphabetical)
-      { id: 'nightfox',             label: 'Nightfox',     bg: '#192330', card: '#212e3f', accent: '#719cd6', family: 'Nightfox' },
-      { id: 'carbonfox',            label: 'Carbonfox',    bg: '#161616', card: '#1c1c1c', accent: '#be95ff', family: 'Nightfox' },
-      { id: 'dawnfox',              label: 'Dawnfox',      bg: '#faf4ed', card: '#ebe0df', accent: '#907aa9', family: 'Nightfox' },
-      { id: 'dayfox',               label: 'Dayfox',       bg: '#f6f2ee', card: '#dbd1dd', accent: '#2848a9', family: 'Nightfox' },
-      { id: 'duskfox',              label: 'Duskfox',      bg: '#232136', card: '#2d2a45', accent: '#c4a7e7', family: 'Nightfox' },
-      { id: 'nordfox',              label: 'Nordfox',      bg: '#2e3440', card: '#39404f', accent: '#81a1c1', family: 'Nightfox' },
-      { id: 'terafox',              label: 'Terafox',      bg: '#152528', card: '#1d3337', accent: '#a1cdd8', family: 'Nightfox' },
-      // ── Nord (Polar Night → Snowstorm → Frost → Aurora, official ordering)
-      { id: 'nord',                 label: 'Polar Night',  bg: '#3b4252', card: '#434c5e', accent: '#88c0d0', family: 'Nord' },
-      { id: 'nord-snowstorm',       label: 'Snowstorm',    bg: '#e5e9f0', card: '#eceff4', accent: '#5e81ac', family: 'Nord' },
-      { id: 'nord-frost',           label: 'Frost',        bg: '#1e2d3d', card: '#243447', accent: '#88c0d0', family: 'Nord' },
-      { id: 'nord-aurora',          label: 'Aurora',       bg: '#3b4252', card: '#434c5e', accent: '#b48ead', family: 'Nord' },
-    ],
-  },
-  {
-    group: 'Operating Systems',
-    themes: [
-      { id: 'ubuntu-ambiance', label: 'Ubuntu',          bg: '#f4efea', card: '#3d1f3d', accent: '#e95420' },
-      { id: 'aqua-quartz',     label: 'Aqua Quartz',     bg: '#f6f6f6', card: '#ffffff',  accent: '#3876f7' },
-      { id: 'cupertino-light', label: 'Cupertino Light', bg: '#ffffff', card: '#f2f2f7', accent: '#0071e3' },
-      { id: 'cupertino-dark',  label: 'Cupertino Dark',  bg: '#1e1e1f', card: '#2d2d2f', accent: '#007aff' },
-      { id: 'dos',             label: 'DOS',             bg: '#0000AA', card: '#000080', accent: '#FFFF55' },
-      { id: 'unix',            label: 'Unix',            bg: '#000000', card: '#111111', accent: '#22C55E' },
-      { id: 'w3-1',            label: 'W3.1',            bg: '#c0c0c0', card: '#ffffff',  accent: '#000080' },
-      { id: 'w98',             label: 'W98',             bg: '#008080', card: '#d4d0c8', accent: '#000080' },
-      { id: 'luna-teal',       label: 'WXP',             bg: '#ece9d8', card: '#1248b8', accent: '#3c9d29' },
-      { id: 'wista',           label: 'Wista',           bg: '#eef3fc', card: '#0e1e3e', accent: '#1565c8' },
-      { id: 'aero-glass',      label: 'W7',              bg: '#b8cfe8', card: '#05080f', accent: '#1878e8' },
-      { id: 'w10',             label: 'W10',             bg: '#f3f3f3', card: '#ffffff',  accent: '#0078d4' },
-      { id: 'w11',             label: 'W11',             bg: '#202020', card: '#2c2c2c', accent: '#0078d4' },
-    ],
-  },
-  {
-    group: 'Psysonic Themes',
-    themes: [
-      { id: 'neon-drift',         label: 'Neon Drift',  bg: '#12132c', card: '#080916', accent: '#00f2ff' },
-      { id: 'nucleo',             label: 'Nucleo',      bg: '#f5e4c3', card: '#dfc08f', accent: '#7a5218' },
-      { id: 'poison',             label: 'Poison',      bg: '#1f1f1f', card: '#282828', accent: '#1bd655' },
-      { id: 'psychowave',         label: 'Psychowave',  bg: '#161428', card: '#1f1c38', accent: '#a06ae0' },
-      { id: 'vintage-tube-radio', label: 'Tube Radio',  bg: '#3E2723', card: '#1E110A', accent: '#FF6F00' },
-    ],
-  },
-  {
-    group: 'COMMUNITY',
-    themes: [
-      { id: 'amoled-black-pure', label: 'AMOLED Black Pure', bg: '#000000', card: '#050505', accent: '#ffffff' },
-      { id: 'obsidian-black', label: 'Obsidian Black', bg: '#070706', card: '#11110f', accent: '#dfddd8' },
-      { id: 'carbon-grey', label: 'Carbon Grey', bg: '#0f0f10', card: '#18181b', accent: '#b4bcc8' },
-      { id: 'midnight-blue', label: 'Midnight Blue', bg: '#0d1420', card: '#111a28', accent: '#60a5fa' },
-      { id: 'sepia-dark', label: 'Sepia Dark', bg: '#1e1a14', card: '#252018', accent: '#c8b89a' },
-      { id: 'volcanic-dark', label: 'Volcanic Dark', bg: '#1b1512', card: '#231b17', accent: '#c97a56' },
-      { id: 'deep-forest', label: 'Deep Forest', bg: '#141c17', card: '#19231d', accent: '#6aa37c' },
-      { id: 'violet-haze', label: 'Violet Haze', bg: '#12101d', card: '#171425', accent: '#b4a0ff' },
-      { id: 'copper-oxide', label: 'Copper Oxide', bg: '#101a18', card: '#131f1c', accent: '#45b8b0' },
-      { id: 'sakura-night', label: 'Sakura Night', bg: '#1c1218', card: '#241821', accent: '#d8a6bc' },
-      { id: 'obsidian-gold', label: 'Obsidian Gold', bg: '#0f0d09', card: '#15120d', accent: '#c9a227' }
-    ],
-  },
-  {
-    group: 'Mediaplayer',
-    themes: [
-      { id: 'winmedplayer',    label: 'WinMedPlayer',    bg: '#3a62a5', card: '#000000', accent: '#45ff00' },
-      { id: 'cupertino-beats', label: 'Cupertino Beats', bg: '#1c1c1e', card: '#2c2c2e', accent: '#fa243c' },
-      { id: 'dzr0',            label: 'DZR',             bg: '#FFFFFF', card: '#F5F5F7', accent: '#A238FF' },
-      { id: 'muma-jukebox',    label: 'MuMa Jukebox',    bg: '#d4d8db', card: '#001358', accent: '#0070a0' },
-      { id: 'p-dvd',           label: 'P-DVD',           bg: '#141414', card: '#000000', accent: '#00aaff' },
-      { id: 'spotless',        label: 'Spotless',        bg: '#121212', card: '#181818', accent: '#1ED760' },
-      { id: 'jayfin',          label: 'Jayfin',          bg: '#141414', card: '#1e1e1e', accent: '#AA5CC3' },
-      { id: 'wnamp',           label: 'WnAmp',           bg: '#2b2b3a', card: '#000000', accent: '#d4cc46' },
-    ],
-  },
-  {
-    group: 'Series',
-    themes: [
-      { id: 'ice-and-fire', label: 'A Theme of Ice and Fire', bg: '#100c08', card: '#090c10', accent: '#c41e1e' },
-      { id: 'doh-matic',    label: "D'oh-matic",              bg: '#FFFDF0', card: '#FFD90F', accent: '#1F75FE' },
-      { id: 'heisenberg',   label: 'Heisenberg',              bg: '#0b0e12', card: '#141a22', accent: '#35d4f8' },
-      { id: 'turtle-power', label: 'Turtle Power',            bg: '#1a1a1a', card: '#0a0a0a', accent: '#33cc33' },
-      { id: 'north-park',   label: 'North Park',              bg: '#F5F1E8', card: '#FFFFFF',  accent: '#FF8C00' },
-    ],
-  },
-  {
-    group: 'Famous Albums',
-    themes: [
-      { id: 'dark-side-of-the-moon', label: 'Dark Side of the Moon (inspired)', bg: '#050505', card: '#0D0D0D', accent: '#9B30FF' },
-      { id: 'powerslave',            label: 'Powerslave (inspired)',            bg: '#F0DFB0', card: '#2A1808', accent: '#C8960C' },
-    ],
-  },
-  {
-    group: 'Accessibility',
-    themes: [
-      { id: 'vision-dark',  label: 'Vision Dark',  bg: '#0d0b12', card: '#16131e', accent: '#ffd700' },
-      { id: 'vision-navy',  label: 'Vision Navy',  bg: '#0a1628', card: '#112038', accent: '#ffd700' },
-    ],
-  },
-  {
-    group: 'Social Media',
-    themes: [
-      { id: 'insta',    label: 'Insta',    bg: '#121212', card: '#000000', accent: '#E1306C' },
-      { id: 'readit',   label: 'ReadIt',   bg: '#030303', card: '#1A1A1B', accent: '#FF4500' },
-      { id: 'the-book', label: 'The Book', bg: '#F0F2F5', card: '#FFFFFF',  accent: '#1877F2' },
-    ],
-  },
-];
-
-interface Props {
-  value: string;
-  onChange: (id: string) => void;
-}
-
-export default function ThemePicker({ value, onChange }: Props) {
-  // All groups collapsed on first render. The blue dot in the header surfaces
-  // which group holds the active theme, so auto-expanding it on mount just
-  // adds visual noise to a screen that already has a long sub-section list.
-  const [openGroup, setOpenGroup] = useState<string | null>(null);
-
-  const toggle = (group: string) => setOpenGroup(prev => prev === group ? null : group);
-
-  return (
-    <div className="theme-accordion">
-      {THEME_GROUPS.map(({ group, themes }) => {
-        const isOpen = openGroup === group;
-        const hasActive = themes.some(t => t.id === value);
-        return (
-          <div key={group} className={`theme-accordion-item${isOpen ? ' theme-accordion-open' : ''}`}>
-            <button className="theme-accordion-header" onClick={() => toggle(group)}>
-              <span>
-                {group}
-                {hasActive && !isOpen && (
-                  <span className="theme-accordion-active-dot" />
-                )}
-              </span>
-              <ChevronDown size={15} className="theme-accordion-chevron" />
-            </button>
-            {isOpen && (
-              <div className="theme-accordion-content">
-                <div style={{
-                  display: 'grid',
-                  gridTemplateColumns: 'repeat(auto-fill, minmax(72px, 1fr))',
-                  gap: '10px',
-                }}>
-                  {(() => {
-                    let lastFamily: string | undefined;
-                    return themes.map((t, i) => {
-                      const isActive = value === t.id;
-                      const showFamilyHeader = !!t.family && t.family !== lastFamily;
-                      lastFamily = t.family;
-                      return (
-                        <Fragment key={t.id}>
-                          {showFamilyHeader && (
-                            <div
-                              className="theme-family-header"
-                              style={{ gridColumn: '1 / -1', marginTop: i === 0 ? 0 : 10 }}
-                            >
-                              {t.family}
-                            </div>
-                          )}
-                          <button
-                            className="theme-card-btn"
-                            onClick={() => onChange(t.id)}
-                          >
-                            <div className={`theme-card-preview${isActive ? ' is-active' : ''}`}>
-                              <div style={{ background: t.bg, height: '55%' }} />
-                              <div style={{ background: t.card, height: '20%' }} />
-                              <div style={{ background: t.accent, height: '25%' }} />
-                              {isActive && (
-                                <div style={{
-                                  position: 'absolute',
-                                  top: '4px',
-                                  right: '4px',
-                                  width: '14px',
-                                  height: '14px',
-                                  borderRadius: '50%',
-                                  background: t.accent,
-                                  border: '1.5px solid rgba(255,255,255,0.7)',
-                                  display: 'flex',
-                                  alignItems: 'center',
-                                  justifyContent: 'center',
-                                }}>
-                                  <Check size={8} strokeWidth={3} color="white" />
-                                </div>
-                              )}
-                            </div>
-                            <span className={`theme-card-label${isActive ? ' is-active' : ''}`}>
-                              {t.label}
-                            </span>
-                          </button>
-                        </Fragment>
-                      );
-                    });
-                  })()}
-                </div>
-              </div>
-            )}
-          </div>
-        );
-      })}
-    </div>
-  );
-}
diff --git a/src/components/WaveformSeekPreview.tsx b/src/components/WaveformSeekPreview.tsx
index 495af2f6..58d5680a 100644
--- a/src/components/WaveformSeekPreview.tsx
+++ b/src/components/WaveformSeekPreview.tsx
@@ -59,11 +59,11 @@ export function SeekbarPreview({ style, label, selected, onClick }: Props) {
     <button
       onClick={onClick}
       style={{
-        border: `2px solid ${selected ? 'var(--accent)' : 'var(--ctp-surface1)'}`,
+        border: `2px solid ${selected ? 'var(--accent)' : 'var(--bg-hover)'}`,
         borderRadius: 8,
         background: selected
           ? 'color-mix(in srgb, var(--accent) 12%, transparent)'
-          : 'var(--bg-card, var(--ctp-base))',
+          : 'var(--bg-card, var(--bg-app))',
         padding: '10px 12px 8px',
         cursor: 'pointer',
         width: 130,
diff --git a/src/components/YearFilterButton.tsx b/src/components/YearFilterButton.tsx
index 40c63598..ef1b0abb 100644
--- a/src/components/YearFilterButton.tsx
+++ b/src/components/YearFilterButton.tsx
@@ -140,7 +140,7 @@ export default function YearFilterButton({
         {...tooltipAttrs(t('albums.yearFilterTooltip'), { pos: 'bottom' })}
         style={{
           display: 'flex', alignItems: 'center', gap: '0.4rem',
-          ...(active ? { background: 'var(--accent)', color: 'var(--ctp-crust)' } : {}),
+          ...(active ? { background: 'var(--accent)', color: 'var(--text-on-accent)' } : {}),
         }}
       >
         <CalendarRange size={14} />
diff --git a/src/components/internetRadio/RadioDirectoryModal.tsx b/src/components/internetRadio/RadioDirectoryModal.tsx
index fe89e7cf..d05219e9 100644
--- a/src/components/internetRadio/RadioDirectoryModal.tsx
+++ b/src/components/internetRadio/RadioDirectoryModal.tsx
@@ -133,7 +133,7 @@ export default function RadioDirectoryModal({ onClose, onAdded }: RadioDirectory
           width: '80vw',
           maxWidth: 800,
           height: '80vh',
-          background: 'var(--ctp-surface0)',
+          background: 'var(--bg-card)',
           border: '1px solid var(--border)',
           borderRadius: 12,
           boxShadow: 'var(--shadow-lg)',
@@ -148,7 +148,7 @@ export default function RadioDirectoryModal({ onClose, onAdded }: RadioDirectory
           style={{
             flexShrink: 0,
             padding: 20,
-            background: 'var(--ctp-surface0)',
+            background: 'var(--bg-card)',
             zIndex: 10,
             position: 'relative',
             borderBottom: '1px solid var(--border)',
diff --git a/src/components/nowPlaying/Hero.tsx b/src/components/nowPlaying/Hero.tsx
index a42288dd..ca3446f8 100644
--- a/src/components/nowPlaying/Hero.tsx
+++ b/src/components/nowPlaying/Hero.tsx
@@ -38,8 +38,8 @@ function renderStars(rating?: number) {
     <div className="np-stars-inline">
       {[1, 2, 3, 4, 5].map(i => (
         <Star key={i} size={13}
-          fill={i <= rating ? 'var(--ctp-yellow)' : 'none'}
-          color={i <= rating ? 'var(--ctp-yellow)' : 'var(--ctp-overlay1)'}
+          fill={i <= rating ? 'var(--highlight)' : 'none'}
+          color={i <= rating ? 'var(--highlight)' : 'var(--border-subtle)'}
         />
       ))}
     </div>
@@ -115,7 +115,7 @@ const Hero = memo(function Hero({ track, artistRefs, genre, playCount, userRatin
         <div className="np-dash-hero-actions">
           <button onClick={onToggleStar} className="np-dash-icon-btn"
             data-tooltip={starred ? t('contextMenu.unfavorite') : t('contextMenu.favorite')}>
-            <Heart size={18} fill={starred ? 'var(--ctp-yellow)' : 'none'} color={starred ? 'var(--ctp-yellow)' : 'currentColor'} />
+            <Heart size={18} fill={starred ? 'var(--highlight)' : 'none'} color={starred ? 'var(--highlight)' : 'currentColor'} />
           </button>
           {lfmLoveEnabled && (
             <button onClick={onToggleLfmLove}
diff --git a/src/components/playlists/PlaylistsHeader.tsx b/src/components/playlists/PlaylistsHeader.tsx
index 6727fd03..dce05f15 100644
--- a/src/components/playlists/PlaylistsHeader.tsx
+++ b/src/components/playlists/PlaylistsHeader.tsx
@@ -105,7 +105,7 @@ export default function PlaylistsHeader({
           onClick={toggleSelectionMode}
           data-tooltip={selectionMode ? t('playlists.cancelSelect') : t('playlists.startSelect')}
           data-tooltip-pos="bottom"
-          style={selectionMode ? { background: 'var(--accent)', color: 'var(--ctp-crust)' } : {}}
+          style={selectionMode ? { background: 'var(--accent)', color: 'var(--text-on-accent)' } : {}}
         >
           <CheckSquare2 size={15} />
           {selectionMode ? t('playlists.cancelSelect') : t('playlists.select')}
diff --git a/src/components/queuePanel/LoadPlaylistModal.tsx b/src/components/queuePanel/LoadPlaylistModal.tsx
index 11cb85ca..8d864e55 100644
--- a/src/components/queuePanel/LoadPlaylistModal.tsx
+++ b/src/components/queuePanel/LoadPlaylistModal.tsx
@@ -66,12 +66,12 @@ export function LoadPlaylistModal({ onClose, onLoad }: Props) {
         ) : (
           <div style={{ display: 'flex', flexDirection: 'column', gap: '8px', maxHeight: '300px', overflowY: 'auto' }}>
             {playlists.filter(p => p.name.toLowerCase().includes(filter.toLowerCase())).map(p => (
-              <div key={p.id} style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', padding: '8px 12px', background: 'var(--ctp-surface1)', borderRadius: 'var(--radius-md)' }}>
+              <div key={p.id} style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', padding: '8px 12px', background: 'var(--bg-hover)', borderRadius: 'var(--radius-md)' }}>
                 <span style={{ fontWeight: 500 }} className="truncate" data-tooltip={p.name}>{p.name}</span>
                 <div style={{ display: 'flex', gap: '4px', flexShrink: 0 }}>
                   <button className="nav-btn" onClick={() => onLoad(p.id, p.name, 'replace')} data-tooltip={t('queue.load')} style={{ width: '28px', height: '28px', background: 'transparent' }}><Play size={14} /></button>
                   <button className="nav-btn" onClick={() => onLoad(p.id, p.name, 'append')} data-tooltip={t('queue.appendToQueue')} style={{ width: '28px', height: '28px', background: 'transparent' }}><ListPlus size={14} /></button>
-                  <button className="nav-btn" onClick={() => handleDelete(p.id, p.name)} data-tooltip={t('queue.delete')} style={{ width: '28px', height: '28px', background: 'transparent', color: 'var(--ctp-red)' }}><Trash2 size={14} /></button>
+                  <button className="nav-btn" onClick={() => handleDelete(p.id, p.name)} data-tooltip={t('queue.delete')} style={{ width: '28px', height: '28px', background: 'transparent', color: 'var(--danger)' }}><Trash2 size={14} /></button>
                 </div>
               </div>
             ))}
diff --git a/src/components/settings/AnalyticsStrategySection.tsx b/src/components/settings/AnalyticsStrategySection.tsx
index 5073a93f..ff5de3f7 100644
--- a/src/components/settings/AnalyticsStrategySection.tsx
+++ b/src/components/settings/AnalyticsStrategySection.tsx
@@ -427,7 +427,7 @@ export default function AnalyticsStrategySection() {
           role="note"
           style={{ marginTop: '0.85rem', display: 'flex', alignItems: 'flex-start', gap: '0.5rem' }}
         >
-          <AlertTriangle size={16} aria-hidden style={{ flexShrink: 0, marginTop: 2, color: 'var(--color-warning, #f59e0b)' }} />
+          <AlertTriangle size={16} aria-hidden style={{ flexShrink: 0, marginTop: 2, color: 'var(--warning, #f59e0b)' }} />
           <span style={{ fontSize: 12, lineHeight: 1.5 }}>
             {t('settings.analyticsStrategyAdvancedWarning')}
           </span>
diff --git a/src/components/settings/AppearanceTab.tsx b/src/components/settings/AppearanceTab.tsx
index 530093eb..9e24b817 100644
--- a/src/components/settings/AppearanceTab.tsx
+++ b/src/components/settings/AppearanceTab.tsx
@@ -1,7 +1,7 @@
 import { useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { invoke } from '@tauri-apps/api/core';
-import { Clock, LayoutGrid, Palette, Sliders, Type, ZoomIn } from 'lucide-react';
+import { LayoutGrid, Palette, Sliders, Type, ZoomIn } from 'lucide-react';
 import { useAuthStore } from '../../store/authStore';
 import {
   LIBRARY_GRID_MAX_COLUMNS_MAX,
@@ -11,13 +11,11 @@ import type { SeekbarStyle } from '../../store/authStoreTypes';
 import { useFontStore, FontId } from '../../store/fontStore';
 import { useThemeStore } from '../../store/themeStore';
 import { IS_LINUX, IS_WINDOWS } from '../../utils/platform';
-import CustomSelect from '../CustomSelect';
 import SettingsSubSection from '../SettingsSubSection';
-import ThemePicker, { THEME_GROUPS } from '../ThemePicker';
 import { SeekbarPreview } from '../WaveformSeekPreview';
 
 export function AppearanceTab() {
-  const { t, i18n } = useTranslation();
+  const { t } = useTranslation();
   const auth = useAuthStore();
   const theme = useThemeStore();
   const fontStore = useFontStore();
@@ -30,88 +28,6 @@ export function AppearanceTab() {
 
   return (
     <>
-      <SettingsSubSection
-        title={t('settings.theme')}
-        icon={<Palette size={16} />}
-      >
-        <div className="settings-card">
-          {theme.enableThemeScheduler && (
-            <div className="settings-hint settings-hint-info" style={{ marginBottom: '0.75rem' }}>
-              {t('settings.themeSchedulerActiveHint')}
-            </div>
-          )}
-          <ThemePicker value={theme.theme} onChange={v => theme.setTheme(v as any)} />
-        </div>
-      </SettingsSubSection>
-
-      <SettingsSubSection
-        title={t('settings.themeSchedulerTitle')}
-        icon={<Clock size={16} />}
-      >
-        <div className="settings-card">
-          <div className="settings-toggle-row">
-            <div>
-              <div style={{ fontWeight: 500 }}>{t('settings.themeSchedulerEnable')}</div>
-              <div style={{ fontSize: 12, color: 'var(--text-muted)' }}>{t('settings.themeSchedulerEnableSub')}</div>
-            </div>
-            <label className="toggle-switch" aria-label={t('settings.themeSchedulerEnable')}>
-              <input type="checkbox" checked={theme.enableThemeScheduler} onChange={e => theme.setEnableThemeScheduler(e.target.checked)} />
-              <span className="toggle-track" />
-            </label>
-          </div>
-          {theme.enableThemeScheduler && (() => {
-            const themeOptions = THEME_GROUPS.flatMap(g =>
-              g.themes.map(th => ({
-                value: th.id,
-                label: th.family ? `${th.family} ${th.label}` : th.label,
-                group: g.group,
-              }))
-            );
-            const use12h = i18n.language === 'en';
-            const hourOptions = Array.from({ length: 24 }, (_, i) => {
-              const value = String(i).padStart(2, '0');
-              const label = use12h
-                ? `${i % 12 === 0 ? 12 : i % 12} ${i < 12 ? 'AM' : 'PM'}`
-                : value;
-              return { value, label };
-            });
-            const minuteOptions = ['00', '05', '10', '15', '20', '25', '30', '35', '40', '45', '50', '55'].map(m => ({ value: m, label: m }));
-            const dayH = theme.timeDayStart.split(':')[0];
-            const dayM = theme.timeDayStart.split(':')[1];
-            const nightH = theme.timeNightStart.split(':')[0];
-            const nightM = theme.timeNightStart.split(':')[1];
-            return (
-              <div style={{ display: 'grid', gridTemplateColumns: 'repeat(auto-fit, minmax(160px, 1fr))', gap: '1rem', marginTop: '1rem' }}>
-                <div className="form-group">
-                  <label className="settings-label" style={{ marginBottom: 6 }}>{t('settings.themeSchedulerDayTheme')}</label>
-                  <CustomSelect value={theme.themeDay} onChange={theme.setThemeDay} options={themeOptions} />
-                </div>
-                <div className="form-group">
-                  <label className="settings-label" style={{ marginBottom: 6 }}>{t('settings.themeSchedulerDayStart')}</label>
-                  <div style={{ display: 'flex', gap: '6px', alignItems: 'center' }}>
-                    <CustomSelect value={dayH} onChange={v => theme.setTimeDayStart(`${v}:${dayM}`)} options={hourOptions} />
-                    <span style={{ color: 'var(--text-muted)', fontWeight: 600 }}>:</span>
-                    <CustomSelect value={dayM} onChange={v => theme.setTimeDayStart(`${dayH}:${v}`)} options={minuteOptions} />
-                  </div>
-                </div>
-                <div className="form-group">
-                  <label className="settings-label" style={{ marginBottom: 6 }}>{t('settings.themeSchedulerNightTheme')}</label>
-                  <CustomSelect value={theme.themeNight} onChange={theme.setThemeNight} options={themeOptions} />
-                </div>
-                <div className="form-group">
-                  <label className="settings-label" style={{ marginBottom: 6 }}>{t('settings.themeSchedulerNightStart')}</label>
-                  <div style={{ display: 'flex', gap: '6px', alignItems: 'center' }}>
-                    <CustomSelect value={nightH} onChange={v => theme.setTimeNightStart(`${v}:${nightM}`)} options={hourOptions} />
-                    <span style={{ color: 'var(--text-muted)', fontWeight: 600 }}>:</span>
-                    <CustomSelect value={nightM} onChange={v => theme.setTimeNightStart(`${nightH}:${v}`)} options={minuteOptions} />
-                  </div>
-                </div>
-              </div>
-            );
-          })()}
-        </div>
-      </SettingsSubSection>
-
       <SettingsSubSection
         title={t('settings.libraryGridMaxColumnsTitle')}
         icon={<LayoutGrid size={16} />}
diff --git a/src/components/settings/InputTab.tsx b/src/components/settings/InputTab.tsx
index 21e54cbb..1fb6a43a 100644
--- a/src/components/settings/InputTab.tsx
+++ b/src/components/settings/InputTab.tsx
@@ -74,7 +74,7 @@ export function InputTab() {
                         minWidth: 72, padding: '3px 10px', borderRadius: 'var(--radius-sm)',
                         fontSize: 12, fontWeight: 600, fontFamily: 'monospace',
                         background: isListening ? 'var(--accent)' : bound ? 'var(--bg-hover)' : 'var(--bg-card)',
-                        color: isListening ? 'var(--ctp-base)' : bound ? 'var(--text-primary)' : 'var(--text-muted)',
+                        color: isListening ? 'var(--bg-app)' : bound ? 'var(--text-primary)' : 'var(--text-muted)',
                         border: `1px solid ${isListening ? 'var(--accent)' : 'var(--border-subtle)'}`,
                         cursor: 'pointer',
                       }}
@@ -156,7 +156,7 @@ export function InputTab() {
                         minWidth: 120, padding: '3px 10px', borderRadius: 'var(--radius-sm)',
                         fontSize: 12, fontWeight: 600, fontFamily: 'monospace',
                         background: isListening ? 'var(--accent)' : bound ? 'var(--bg-hover)' : 'var(--bg-card)',
-                        color: isListening ? 'var(--ctp-base)' : bound ? 'var(--text-primary)' : 'var(--text-muted)',
+                        color: isListening ? 'var(--bg-app)' : bound ? 'var(--text-primary)' : 'var(--text-muted)',
                         border: `1px solid ${isListening ? 'var(--accent)' : 'var(--border-subtle)'}`,
                         cursor: 'pointer',
                       }}
diff --git a/src/components/settings/InstalledThemes.tsx b/src/components/settings/InstalledThemes.tsx
new file mode 100644
index 00000000..ca8c564a
--- /dev/null
+++ b/src/components/settings/InstalledThemes.tsx
@@ -0,0 +1,137 @@
+import { Check, X } from 'lucide-react';
+import { useTranslation } from 'react-i18next';
+import { useThemeStore } from '../../store/themeStore';
+import { useInstalledThemesStore } from '../../store/installedThemesStore';
+import { uninstallTheme } from '../../utils/themes/uninstallTheme';
+import { FIXED_THEMES } from './fixedThemes';
+
+/** Pull a 3-band swatch (bg / card / accent) out of an installed theme's CSS. */
+function swatch(css: string): { bg: string; card: string; accent: string } {
+  const read = (name: string, fallback: string) => {
+    const m = css.match(new RegExp(`--${name}\\s*:\\s*([^;]+);`));
+    return m ? m[1].trim() : fallback;
+  };
+  return {
+    bg: read('bg-app', '#1e1e2e'),
+    card: read('bg-card', '#313244'),
+    accent: read('accent', '#cba6f7'),
+  };
+}
+
+interface Card {
+  id: string;
+  label: string;
+  bg: string;
+  card: string;
+  accent: string;
+  fixed: boolean;
+  accessibility: boolean;
+}
+
+/**
+ * Flat card grid of the user's available themes: the fixed cores plus every
+ * installed community theme. Click a card to apply it; community themes carry an
+ * uninstall control (the fixed cores do not). No accordion — this page is only
+ * about themes, so everything is shown at once.
+ */
+export function InstalledThemes() {
+  const { t } = useTranslation();
+  const active = useThemeStore(s => s.theme);
+  const setTheme = useThemeStore(s => s.setTheme);
+  const installed = useInstalledThemesStore(s => s.themes);
+
+  const cards: Card[] = [
+    ...FIXED_THEMES.map(f => ({ id: f.id, label: f.label, bg: f.bg, card: f.card, accent: f.accent, fixed: true, accessibility: !!f.accessibility })),
+    ...installed.map(it => {
+      const s = swatch(it.css);
+      return { id: it.id, label: it.name, bg: s.bg, card: s.card, accent: s.accent, fixed: false, accessibility: (it.tags || []).includes('accessibility') };
+    }),
+  ];
+
+  return (
+    <div className="settings-card">
+      <div style={{ display: 'grid', gridTemplateColumns: 'repeat(auto-fill, minmax(72px, 1fr))', gap: '10px' }}>
+        {cards.map(c => {
+          const isActive = active === c.id;
+          return (
+            <div key={c.id} style={{ position: 'relative' }}>
+              <button className="theme-card-btn" style={{ width: '100%' }} aria-pressed={isActive} onClick={() => setTheme(c.id)}>
+                <div className={`theme-card-preview${isActive ? ' is-active' : ''}`}>
+                  <div style={{ background: c.bg, height: '55%' }} />
+                  <div style={{ background: c.card, height: '20%' }} />
+                  <div style={{ background: c.accent, height: '25%' }} />
+                  {isActive && (
+                    <div style={{
+                      position: 'absolute',
+                      top: '4px',
+                      right: '4px',
+                      width: '14px',
+                      height: '14px',
+                      borderRadius: '50%',
+                      background: c.accent,
+                      border: '1.5px solid rgba(255,255,255,0.7)',
+                      display: 'flex',
+                      alignItems: 'center',
+                      justifyContent: 'center',
+                    }}>
+                      <Check size={8} strokeWidth={3} color="white" />
+                    </div>
+                  )}
+                </div>
+                <span className={`theme-card-label${isActive ? ' is-active' : ''}`}>
+                  {c.label}
+                </span>
+                {c.accessibility && (
+                  <span
+                    aria-label={t('settings.themesCvdTooltip')}
+                    data-tooltip={t('settings.themesCvdTooltip')}
+                    data-tooltip-pos="top"
+                    style={{
+                      fontSize: 9,
+                      fontWeight: 700,
+                      lineHeight: 1,
+                      padding: '2px 6px',
+                      borderRadius: 999,
+                      background: 'var(--accent-dim)',
+                      color: 'var(--accent)',
+                      letterSpacing: 0.3,
+                      whiteSpace: 'nowrap',
+                    }}
+                  >
+                    CVD-safe
+                  </span>
+                )}
+              </button>
+              {!c.fixed && (
+                <button
+                  onClick={() => uninstallTheme(c.id)}
+                  aria-label={t('settings.themeStoreUninstall')}
+                  data-tooltip={t('settings.themeStoreUninstall')}
+                  data-tooltip-pos="top"
+                  style={{
+                    position: 'absolute',
+                    top: 2,
+                    left: 2,
+                    width: 18,
+                    height: 18,
+                    borderRadius: '50%',
+                    border: 'none',
+                    background: 'var(--bg-elevated)',
+                    color: 'var(--text-secondary)',
+                    display: 'flex',
+                    alignItems: 'center',
+                    justifyContent: 'center',
+                    cursor: 'pointer',
+                    padding: 0,
+                  }}
+                >
+                  <X size={11} />
+                </button>
+              )}
+            </div>
+          );
+        })}
+      </div>
+    </div>
+  );
+}
diff --git a/src/components/settings/ServersTab.tsx b/src/components/settings/ServersTab.tsx
index f654320d..af0b0840 100644
--- a/src/components/settings/ServersTab.tsx
+++ b/src/components/settings/ServersTab.tsx
@@ -400,7 +400,7 @@ export function ServersTab({
                       <div style={{ display: 'flex', alignItems: 'center', gap: '0.5rem', marginBottom: '2px' }}>
                         <span style={{ fontWeight: 600 }}>{serverListDisplayLabel(srv, auth.servers)}</span>
                         {isActive && (
-                          <span style={{ fontSize: 11, background: 'var(--accent)', color: 'var(--ctp-crust)', padding: '1px 6px', borderRadius: 'var(--radius-sm)', fontWeight: 600 }}>
+                          <span style={{ fontSize: 11, background: 'var(--accent)', color: 'var(--text-on-accent)', padding: '1px 6px', borderRadius: 'var(--radius-sm)', fontWeight: 600 }}>
                             {t('settings.serverActive')}
                           </span>
                         )}
@@ -500,7 +500,7 @@ export function ServersTab({
                             {!!auth.audiomuseNavidromeByServer[srv.id] && auth.audiomuseNavidromeIssueByServer[srv.id] && (
                               <AlertTriangle
                                 size={16}
-                                style={{ color: 'var(--color-warning, #f59e0b)', flexShrink: 0 }}
+                                style={{ color: 'var(--warning, #f59e0b)', flexShrink: 0 }}
                                 data-tooltip={t('settings.audiomuseIssueHint')}
                                 aria-label={t('settings.audiomuseIssueHint')}
                               />
diff --git a/src/components/settings/ThemeStoreSection.tsx b/src/components/settings/ThemeStoreSection.tsx
new file mode 100644
index 00000000..db35ab32
--- /dev/null
+++ b/src/components/settings/ThemeStoreSection.tsx
@@ -0,0 +1,306 @@
+import { useEffect, useMemo, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { Check, Download, RefreshCw, Trash2 } from 'lucide-react';
+import { open as openUrl } from '@tauri-apps/plugin-shell';
+import CoverLightbox from '../CoverLightbox';
+import { useThemeStore } from '../../store/themeStore';
+import { useInstalledThemesStore, type InstalledTheme } from '../../store/installedThemesStore';
+import {
+  cdnUrl,
+  fetchRegistry,
+  fetchThemeCss,
+  type RegistryTheme,
+} from '../../utils/themes/themeRegistry';
+import { validateThemeCss } from '../../utils/themes/themeInjection';
+import { uninstallTheme } from '../../utils/themes/uninstallTheme';
+import { isNewer } from '../../utils/componentHelpers/appUpdaterHelpers';
+
+type ModeFilter = 'all' | 'dark' | 'light';
+
+const THEMES_REPO_URL = 'https://github.com/Psysonic/psysonic-themes';
+
+/**
+ * The community Theme Store: browse the jsDelivr-hosted registry, filter by name
+ * and light/dark, install (fetch + persist + runtime inject), apply, update and
+ * uninstall. Built-in themes are not in the registry, so they never appear here.
+ */
+export function ThemeStoreSection() {
+  const { t } = useTranslation();
+  const activeTheme = useThemeStore(s => s.theme);
+  const setTheme = useThemeStore(s => s.setTheme);
+  const installed = useInstalledThemesStore(s => s.themes);
+  const install = useInstalledThemesStore(s => s.install);
+
+  const [themes, setThemes] = useState<RegistryTheme[] | null>(null);
+  const [generatedAt, setGeneratedAt] = useState('');
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState(false);
+  const [stale, setStale] = useState(false);
+  const [query, setQuery] = useState('');
+  const [mode, setMode] = useState<ModeFilter>('all');
+  const [busyId, setBusyId] = useState<string | null>(null);
+  const [failedId, setFailedId] = useState<string | null>(null);
+  const [lightbox, setLightbox] = useState<{ src: string; name: string } | null>(null);
+
+  const load = (force = false) => {
+    setLoading(true);
+    setError(false);
+    fetchRegistry({ force })
+      .then(r => { setThemes(r.registry.themes); setGeneratedAt(r.registry.generatedAt); setStale(r.stale); })
+      .catch(() => setError(true))
+      .finally(() => setLoading(false));
+  };
+
+  // Thumbnails live at a stable CDN path, so the webview caches them hard
+  // (jsDelivr sends max-age 7d). Tie a cache-buster to the registry's
+  // generatedAt — it changes on every themes push — so refreshed thumbnails
+  // show up after a registry refresh instead of being stuck on the old image.
+  const thumbUrl = (rel: string) =>
+    generatedAt ? `${cdnUrl(rel)}?v=${encodeURIComponent(generatedAt)}` : cdnUrl(rel);
+
+  useEffect(() => { load(false); }, []);
+
+  const installedMap = useMemo(() => {
+    const m = new Map<string, InstalledTheme>();
+    for (const it of installed) m.set(it.id, it);
+    return m;
+  }, [installed]);
+
+  const filtered = useMemo(() => {
+    if (!themes) return [];
+    const q = query.trim().toLowerCase();
+    return themes.filter(th => {
+      if (mode !== 'all' && th.mode !== mode) return false;
+      if (!q) return true;
+      return (
+        th.name.toLowerCase().includes(q) ||
+        th.author.toLowerCase().includes(q) ||
+        th.description.toLowerCase().includes(q) ||
+        (th.tags || []).some(tag => tag.includes(q))
+      );
+    }).sort((a, b) => a.name.localeCompare(b.name));
+  }, [themes, query, mode]);
+
+  const handleInstall = async (th: RegistryTheme) => {
+    setBusyId(th.id);
+    setFailedId(null);
+    try {
+      const css = await fetchThemeCss(th.css);
+      // Don't persist CSS that won't inject — otherwise the theme would show as
+      // installed/active but render nothing. Validate before storing.
+      if (validateThemeCss(css, th.id) == null) {
+        setFailedId(th.id);
+        return;
+      }
+      install({
+        id: th.id,
+        name: th.name,
+        author: th.author,
+        version: th.version,
+        description: th.description,
+        mode: th.mode,
+        tags: th.tags,
+        css,
+        installedAt: Date.now(),
+      });
+    } catch {
+      setFailedId(th.id);
+    } finally {
+      setBusyId(null);
+    }
+  };
+
+
+  const modeBtns: { key: ModeFilter; label: string }[] = [
+    { key: 'all', label: t('settings.themeStoreModeAll') },
+    { key: 'dark', label: t('settings.themeStoreModeDark') },
+    { key: 'light', label: t('settings.themeStoreModeLight') },
+  ];
+
+  return (
+    <div className="settings-card">
+      {/* Submit-your-own-theme hint */}
+      <div className="settings-hint settings-hint-info" style={{ marginBottom: '1rem' }}>
+        {t('settings.themeStoreSubmitText')}{' '}
+        <button
+          type="button"
+          onClick={() => void openUrl(THEMES_REPO_URL)}
+          style={{ background: 'none', border: 'none', padding: 0, font: 'inherit', color: 'var(--accent)', cursor: 'pointer', textDecoration: 'underline' }}
+        >
+          {t('settings.themeStoreSubmitLink')}
+        </button>
+      </div>
+
+      {/* Toolbar: search + mode filter + refresh */}
+      <div style={{ display: 'flex', flexWrap: 'wrap', gap: 10, alignItems: 'center', marginBottom: '1rem' }}>
+        <input
+          type="search"
+          className="input"
+          value={query}
+          onChange={e => setQuery(e.target.value)}
+          placeholder={t('settings.themeStoreSearchPlaceholder')}
+          aria-label={t('settings.themeStoreSearchPlaceholder')}
+          style={{ flex: '1 1 180px', minWidth: 140 }}
+        />
+        <div style={{ display: 'flex', gap: 4 }} role="group" aria-label={t('settings.themeStoreFilterMode')}>
+          {modeBtns.map(b => (
+            <button
+              key={b.key}
+              className={`btn ${mode === b.key ? 'btn-primary' : 'btn-ghost'}`}
+              style={{ fontSize: 12, padding: '4px 10px' }}
+              aria-pressed={mode === b.key}
+              onClick={() => setMode(b.key)}
+            >
+              {b.label}
+            </button>
+          ))}
+        </div>
+        <button
+          className="btn btn-ghost"
+          style={{ padding: '4px 10px' }}
+          onClick={() => load(true)}
+          disabled={loading}
+          aria-label={t('settings.themeStoreRefresh')}
+          data-tooltip={t('settings.themeStoreRefresh')}
+          data-tooltip-pos="left"
+        >
+          <RefreshCw size={15} />
+        </button>
+      </div>
+
+      {!loading && stale && (
+        <div className="settings-hint settings-hint-info" role="status" style={{ marginBottom: '0.75rem' }}>
+          {t('settings.themeStoreOffline')}
+        </div>
+      )}
+
+      {loading && (
+        <p role="status" style={{ fontSize: 13, color: 'var(--text-muted)' }}>{t('settings.themeStoreLoading')}</p>
+      )}
+
+      {!loading && error && (
+        <div role="alert" style={{ fontSize: 13, color: 'var(--text-muted)' }}>
+          <p style={{ marginBottom: 8 }}>{t('settings.themeStoreError')}</p>
+          <button className="btn btn-ghost" onClick={() => load(true)}>{t('settings.themeStoreRetry')}</button>
+        </div>
+      )}
+
+      {!loading && !error && filtered.length === 0 && (
+        <p role="status" style={{ fontSize: 13, color: 'var(--text-muted)' }}>{t('settings.themeStoreEmpty')}</p>
+      )}
+
+      {!loading && !error && filtered.length > 0 && (
+        <div style={{ display: 'flex', flexDirection: 'column', gap: 10 }}>
+          {filtered.map(th => {
+            const inst = installedMap.get(th.id);
+            const isInstalled = !!inst;
+            const updateAvailable = isInstalled && isNewer(th.version, inst!.version);
+            const isActive = activeTheme === th.id;
+            const busy = busyId === th.id;
+            return (
+              <div
+                key={th.id}
+                className="theme-store-row"
+                style={{
+                  display: 'flex',
+                  gap: 14,
+                  padding: 12,
+                  border: `1px solid ${isActive ? 'var(--accent)' : 'var(--border-subtle)'}`,
+                  borderRadius: 'var(--radius-md, 10px)',
+                  background: 'var(--bg-card)',
+                }}
+              >
+                <button
+                  type="button"
+                  onClick={() => setLightbox({ src: thumbUrl(th.thumbnail), name: th.name })}
+                  aria-label={t('settings.themeStoreEnlarge')}
+                  data-tooltip={t('settings.themeStoreEnlarge')}
+                  data-tooltip-pos="right"
+                  style={{ padding: 0, border: 'none', background: 'none', cursor: 'zoom-in', flexShrink: 0, alignSelf: 'flex-start', lineHeight: 0, borderRadius: 6 }}
+                >
+                  <img
+                    src={thumbUrl(th.thumbnail)}
+                    alt=""
+                    loading="lazy"
+                    width={200}
+                    height={125}
+                    // Offline / missing thumbnail: hide the broken-image glyph; the
+                    // image's own neutral background stands in as a placeholder.
+                    onError={e => { e.currentTarget.style.opacity = '0'; }}
+                    style={{ width: 200, height: 125, objectFit: 'cover', borderRadius: 6, background: 'var(--bg-deep)' }}
+                  />
+                </button>
+                <div style={{ flex: 1, minWidth: 0, display: 'flex', flexDirection: 'column', gap: 2 }}>
+                  <div style={{ display: 'flex', alignItems: 'center', gap: 8 }}>
+                    <span style={{ fontWeight: 600 }}>{th.name}</span>
+                    {isActive && (
+                      <span style={{ fontSize: 11, color: 'var(--accent)', display: 'inline-flex', alignItems: 'center', gap: 3 }}>
+                        <Check size={12} /> {t('settings.themeStoreActive')}
+                      </span>
+                    )}
+                  </div>
+                  <div style={{ fontSize: 12, color: 'var(--text-muted)' }}>
+                    {t('settings.themeStoreByAuthor', { author: th.author })}
+                  </div>
+                  <div style={{ fontSize: 12.5, color: 'var(--text-secondary)', lineHeight: 1.4 }}>
+                    {th.description}
+                  </div>
+                  {/* Rating slot reserved — see Theme Store roadmap (deferred). */}
+                  <div style={{ display: 'flex', flexWrap: 'wrap', gap: 8, marginTop: 8 }}>
+                    {!isInstalled && (
+                      <button
+                        className="btn btn-primary"
+                        style={{ fontSize: 12, padding: '4px 12px', display: 'inline-flex', alignItems: 'center', gap: 5 }}
+                        onClick={() => handleInstall(th)}
+                        disabled={busy}
+                      >
+                        <Download size={14} /> {busy ? t('settings.themeStoreInstalling') : t('settings.themeStoreInstall')}
+                      </button>
+                    )}
+                    {isInstalled && !isActive && (
+                      <button
+                        className="btn btn-ghost"
+                        style={{ fontSize: 12, padding: '4px 12px' }}
+                        onClick={() => setTheme(th.id)}
+                      >
+                        {t('settings.themeStoreApply')}
+                      </button>
+                    )}
+                    {updateAvailable && (
+                      <button
+                        className="btn btn-primary"
+                        style={{ fontSize: 12, padding: '4px 12px' }}
+                        onClick={() => handleInstall(th)}
+                        disabled={busy}
+                      >
+                        {busy ? t('settings.themeStoreUpdating') : t('settings.themeStoreUpdate')}
+                      </button>
+                    )}
+                    {isInstalled && (
+                      <button
+                        className="btn btn-ghost"
+                        style={{ fontSize: 12, padding: '4px 12px', display: 'inline-flex', alignItems: 'center', gap: 5 }}
+                        onClick={() => uninstallTheme(th.id)}
+                      >
+                        <Trash2 size={14} /> {t('settings.themeStoreUninstall')}
+                      </button>
+                    )}
+                    {failedId === th.id && (
+                      <span role="status" style={{ fontSize: 12, color: 'var(--danger)', alignSelf: 'center' }}>
+                        {t('settings.themeStoreInstallFailed')}
+                      </span>
+                    )}
+                  </div>
+                </div>
+              </div>
+            );
+          })}
+        </div>
+      )}
+
+      {lightbox && (
+        <CoverLightbox src={lightbox.src} alt={lightbox.name} onClose={() => setLightbox(null)} />
+      )}
+    </div>
+  );
+}
diff --git a/src/components/settings/ThemesTab.tsx b/src/components/settings/ThemesTab.tsx
new file mode 100644
index 00000000..7971efbc
--- /dev/null
+++ b/src/components/settings/ThemesTab.tsx
@@ -0,0 +1,123 @@
+import type { ReactNode } from 'react';
+import { useTranslation } from 'react-i18next';
+import { Clock, Palette, Store } from 'lucide-react';
+import { useThemeStore } from '../../store/themeStore';
+import { useInstalledThemesStore } from '../../store/installedThemesStore';
+import CustomSelect from '../CustomSelect';
+import BackToTopButton from '../BackToTopButton';
+import { FIXED_THEMES } from './fixedThemes';
+import { InstalledThemes } from './InstalledThemes';
+import { ThemeStoreSection } from './ThemeStoreSection';
+
+/**
+ * A flat, always-visible section. The Themes tab has a single purpose, so its
+ * parts are laid out one below the other with no collapsing — deliberately not
+ * the collapsible <details> SettingsSubSection used elsewhere. `data-settings-
+ * search` keeps each section reachable from the global settings search.
+ */
+function ThemesSection({ icon, title, children }: { icon: ReactNode; title: string; children: ReactNode }) {
+  return (
+    <section className="themes-section" data-settings-search={title} style={{ marginBottom: '1.75rem' }}>
+      <h2 style={{ display: 'flex', alignItems: 'center', gap: 8, fontSize: 15, fontWeight: 600, margin: '0 0 0.75rem' }}>
+        <span style={{ display: 'inline-flex', color: 'var(--accent)' }}>{icon}</span>
+        {title}
+      </h2>
+      {children}
+    </section>
+  );
+}
+
+/**
+ * Dedicated Themes tab: pick a theme (fixed cores + installed community themes),
+ * the day/night scheduler, and the community Theme Store — all flat on one page.
+ */
+export function ThemesTab() {
+  const { t, i18n } = useTranslation();
+  const theme = useThemeStore();
+  const installed = useInstalledThemesStore(s => s.themes);
+
+  return (
+    <>
+      <ThemesSection icon={<Palette size={16} />} title={t('settings.themesYourThemesTitle')}>
+        {theme.enableThemeScheduler && (
+          <div className="settings-hint settings-hint-info" style={{ marginBottom: '0.75rem' }}>
+            {t('settings.themeSchedulerActiveHint')}
+          </div>
+        )}
+        <InstalledThemes />
+      </ThemesSection>
+
+      <ThemesSection icon={<Clock size={16} />} title={t('settings.themeSchedulerTitle')}>
+        <div className="settings-card">
+          <div className="settings-toggle-row">
+            <div>
+              <div style={{ fontWeight: 500 }}>{t('settings.themeSchedulerEnable')}</div>
+              <div style={{ fontSize: 12, color: 'var(--text-muted)' }}>{t('settings.themeSchedulerEnableSub')}</div>
+            </div>
+            <label className="toggle-switch" aria-label={t('settings.themeSchedulerEnable')}>
+              <input type="checkbox" checked={theme.enableThemeScheduler} onChange={e => theme.setEnableThemeScheduler(e.target.checked)} />
+              <span className="toggle-track" />
+            </label>
+          </div>
+          {theme.enableThemeScheduler && (() => {
+            const themeOptions = [
+              ...FIXED_THEMES.map(f => ({ value: f.id, label: f.label })),
+              ...installed.map(it => ({
+                value: it.id,
+                label: it.name,
+                group: t('settings.themesYourThemesTitle'),
+              })),
+            ];
+            const use12h = i18n.language === 'en';
+            const hourOptions = Array.from({ length: 24 }, (_, i) => {
+              const value = String(i).padStart(2, '0');
+              const label = use12h
+                ? `${i % 12 === 0 ? 12 : i % 12} ${i < 12 ? 'AM' : 'PM'}`
+                : value;
+              return { value, label };
+            });
+            const minuteOptions = ['00', '05', '10', '15', '20', '25', '30', '35', '40', '45', '50', '55'].map(m => ({ value: m, label: m }));
+            const dayH = theme.timeDayStart.split(':')[0];
+            const dayM = theme.timeDayStart.split(':')[1];
+            const nightH = theme.timeNightStart.split(':')[0];
+            const nightM = theme.timeNightStart.split(':')[1];
+            return (
+              <div style={{ display: 'grid', gridTemplateColumns: 'repeat(auto-fit, minmax(160px, 1fr))', gap: '1rem', marginTop: '1rem' }}>
+                <div className="form-group">
+                  <label className="settings-label" style={{ marginBottom: 6 }}>{t('settings.themeSchedulerDayTheme')}</label>
+                  <CustomSelect value={theme.themeDay} onChange={theme.setThemeDay} options={themeOptions} />
+                </div>
+                <div className="form-group">
+                  <label className="settings-label" style={{ marginBottom: 6 }}>{t('settings.themeSchedulerDayStart')}</label>
+                  <div style={{ display: 'flex', gap: '6px', alignItems: 'center' }}>
+                    <CustomSelect value={dayH} onChange={v => theme.setTimeDayStart(`${v}:${dayM}`)} options={hourOptions} />
+                    <span style={{ color: 'var(--text-muted)', fontWeight: 600 }}>:</span>
+                    <CustomSelect value={dayM} onChange={v => theme.setTimeDayStart(`${dayH}:${v}`)} options={minuteOptions} />
+                  </div>
+                </div>
+                <div className="form-group">
+                  <label className="settings-label" style={{ marginBottom: 6 }}>{t('settings.themeSchedulerNightTheme')}</label>
+                  <CustomSelect value={theme.themeNight} onChange={theme.setThemeNight} options={themeOptions} />
+                </div>
+                <div className="form-group">
+                  <label className="settings-label" style={{ marginBottom: 6 }}>{t('settings.themeSchedulerNightStart')}</label>
+                  <div style={{ display: 'flex', gap: '6px', alignItems: 'center' }}>
+                    <CustomSelect value={nightH} onChange={v => theme.setTimeNightStart(`${v}:${nightM}`)} options={hourOptions} />
+                    <span style={{ color: 'var(--text-muted)', fontWeight: 600 }}>:</span>
+                    <CustomSelect value={nightM} onChange={v => theme.setTimeNightStart(`${nightH}:${v}`)} options={minuteOptions} />
+                  </div>
+                </div>
+              </div>
+            );
+          })()}
+        </div>
+      </ThemesSection>
+
+      <ThemesSection icon={<Store size={16} />} title={t('settings.themeStoreTitle')}>
+        <ThemeStoreSection />
+      </ThemesSection>
+
+      <BackToTopButton />
+    </>
+  );
+}
diff --git a/src/components/settings/UserForm.tsx b/src/components/settings/UserForm.tsx
index 6253bbab..c9cb93b3 100644
--- a/src/components/settings/UserForm.tsx
+++ b/src/components/settings/UserForm.tsx
@@ -294,8 +294,8 @@ export function UserForm({
               marginBottom: 10,
               padding: '8px 10px',
               borderRadius: 6,
-              border: '1px solid color-mix(in srgb, var(--color-warning, #f59e0b) 35%, transparent)',
-              background: 'color-mix(in srgb, var(--color-warning, #f59e0b) 10%, transparent)',
+              border: '1px solid color-mix(in srgb, var(--warning, #f59e0b) 35%, transparent)',
+              background: 'color-mix(in srgb, var(--warning, #f59e0b) 10%, transparent)',
               color: 'var(--text-primary)',
             }}
           >
@@ -326,8 +326,8 @@ export function UserForm({
               marginBottom: 10,
               padding: '8px 10px',
               borderRadius: 6,
-              border: '1px solid color-mix(in srgb, var(--color-warning, #f59e0b) 35%, transparent)',
-              background: 'color-mix(in srgb, var(--color-warning, #f59e0b) 10%, transparent)',
+              border: '1px solid color-mix(in srgb, var(--warning, #f59e0b) 35%, transparent)',
+              background: 'color-mix(in srgb, var(--warning, #f59e0b) 10%, transparent)',
               color: 'var(--text-primary)',
             }}
           >
diff --git a/src/components/settings/fixedThemes.ts b/src/components/settings/fixedThemes.ts
new file mode 100644
index 00000000..dfdfdf95
--- /dev/null
+++ b/src/components/settings/fixedThemes.ts
@@ -0,0 +1,23 @@
+/**
+ * The fixed, bundled core themes — always present, never uninstallable. Every
+ * other palette lives in the community Theme Store and is applied by id once
+ * installed. `bg`/`card`/`accent` drive the 3-band swatch preview.
+ */
+export interface FixedTheme {
+  id: string;
+  label: string;
+  bg: string;
+  card: string;
+  accent: string;
+  /** Colour-blind-safe accessibility theme — flagged with a badge in the UI. */
+  accessibility?: boolean;
+}
+
+export const FIXED_THEMES: FixedTheme[] = [
+  { id: 'mocha',         label: 'Catppuccin Mocha', bg: '#1e1e2e', card: '#313244', accent: '#cba6f7' },
+  { id: 'latte',         label: 'Catppuccin Latte', bg: '#eff1f5', card: '#ccd0da', accent: '#8839ef' },
+  { id: 'kanagawa-wave', label: 'Kanagawa Wave', bg: '#1F1F28', card: '#2A2A37', accent: '#7E9CD8' },
+  { id: 'stark-hud',     label: 'Stark HUD',     bg: '#0b0f15', card: '#05070a', accent: '#00f2ff' },
+  { id: 'vision-dark',   label: 'Vision Dark',   bg: '#0d0b12', card: '#16131e', accent: '#ffd700', accessibility: true },
+  { id: 'vision-navy',   label: 'Vision Navy',   bg: '#0a1628', card: '#112038', accent: '#ffd700', accessibility: true },
+];
diff --git a/src/components/settings/settingsTabs.ts b/src/components/settings/settingsTabs.ts
index 2cddae80..b70b7efc 100644
--- a/src/components/settings/settingsTabs.ts
+++ b/src/components/settings/settingsTabs.ts
@@ -4,6 +4,7 @@ export type Tab =
   | 'audio'
   | 'lyrics'
   | 'appearance'
+  | 'themes'
   | 'personalisation'
   | 'integrations'
   | 'input'
@@ -23,7 +24,7 @@ export function resolveTab(input: string | undefined | null): Tab {
   if (!input) return 'servers';
   const aliased = LEGACY_TAB_ALIAS[input];
   if (aliased) return aliased;
-  const known: Tab[] = ['library', 'servers', 'audio', 'lyrics', 'appearance', 'personalisation', 'integrations', 'input', 'storage', 'system', 'users'];
+  const known: Tab[] = ['library', 'servers', 'audio', 'lyrics', 'appearance', 'themes', 'personalisation', 'integrations', 'input', 'storage', 'system', 'users'];
   return (known as string[]).includes(input) ? (input as Tab) : 'servers';
 }
 
@@ -59,8 +60,9 @@ export const SETTINGS_INDEX: SearchIndexEntry[] = [
   { tab: 'storage',        titleKey: 'settings.mediaDirTitle',            keywords: 'media folder offline library cache directory local playback' },
   { tab: 'storage',        titleKey: 'settings.nextTrackBufferingTitle',  keywords: 'next track buffering hot cache streaming' },
   { tab: 'storage',        titleKey: 'settings.downloadsTitle',           keywords: 'downloads zip export archive folder' },
-  { tab: 'appearance',     titleKey: 'settings.theme',                    keywords: 'theme color palette dark light' },
-  { tab: 'appearance',     titleKey: 'settings.themeSchedulerTitle',      keywords: 'theme scheduler auto time dark mode sunset' },
+  { tab: 'themes',         titleKey: 'settings.themesYourThemesTitle',    keywords: 'theme color palette dark light install uninstall apply your' },
+  { tab: 'themes',         titleKey: 'settings.themeSchedulerTitle',      keywords: 'theme scheduler auto time dark mode sunset' },
+  { tab: 'themes',         titleKey: 'settings.themeStoreTitle',          keywords: 'theme store community download install browse marketplace' },
   { tab: 'appearance',     titleKey: 'settings.visualOptionsTitle',       keywords: 'visual options animations effects titlebar mini player' },
   { tab: 'appearance',     titleKey: 'settings.uiScaleTitle',             keywords: 'ui scale zoom dpi size' },
   { tab: 'appearance',     titleKey: 'settings.font',                     keywords: 'font typography typeface' },
diff --git a/src/components/settings/userMgmt/MagicStringModal.tsx b/src/components/settings/userMgmt/MagicStringModal.tsx
index 1ed6af6a..c07ab3b2 100644
--- a/src/components/settings/userMgmt/MagicStringModal.tsx
+++ b/src/components/settings/userMgmt/MagicStringModal.tsx
@@ -126,8 +126,8 @@ export function MagicStringModal({
             marginBottom: '1rem',
             padding: '8px 10px',
             borderRadius: 6,
-            border: '1px solid color-mix(in srgb, var(--color-warning, #f59e0b) 35%, transparent)',
-            background: 'color-mix(in srgb, var(--color-warning, #f59e0b) 10%, transparent)',
+            border: '1px solid color-mix(in srgb, var(--warning, #f59e0b) 35%, transparent)',
+            background: 'color-mix(in srgb, var(--warning, #f59e0b) 10%, transparent)',
             color: 'var(--text-primary)',
           }}
         >
diff --git a/src/components/settings/userMgmt/UserMgmtRow.tsx b/src/components/settings/userMgmt/UserMgmtRow.tsx
index b7e0dfa3..82d64502 100644
--- a/src/components/settings/userMgmt/UserMgmtRow.tsx
+++ b/src/components/settings/userMgmt/UserMgmtRow.tsx
@@ -75,13 +75,13 @@ export function UserMgmtRow({
         <span style={{ fontSize: 12, color: 'var(--text-muted)', flexShrink: 0 }}>· {u.name}</span>
       )}
       {isSelf && (
-        <span style={{ fontSize: 10, background: 'var(--accent)', color: 'var(--ctp-crust)', padding: '1px 6px', borderRadius: 10, fontWeight: 600, flexShrink: 0 }}>
+        <span style={{ fontSize: 10, background: 'var(--accent)', color: 'var(--text-on-accent)', padding: '1px 6px', borderRadius: 10, fontWeight: 600, flexShrink: 0 }}>
           {t('settings.userMgmtYouBadge')}
         </span>
       )}
       {u.isAdmin && (
         <span
-          style={{ fontSize: 10, display: 'inline-flex', alignItems: 'center', gap: 3, padding: '1px 6px', borderRadius: 10, fontWeight: 600, background: 'color-mix(in srgb, var(--color-warning, #f59e0b) 22%, transparent)', color: 'var(--text-primary)', flexShrink: 0 }}
+          style={{ fontSize: 10, display: 'inline-flex', alignItems: 'center', gap: 3, padding: '1px 6px', borderRadius: 10, fontWeight: 600, background: 'color-mix(in srgb, var(--warning, #f59e0b) 22%, transparent)', color: 'var(--text-primary)', flexShrink: 0 }}
           data-tooltip={t('settings.userMgmtRoleAdmin')}
         >
           <Shield size={10} />
diff --git a/src/config/settingsCredits.ts b/src/config/settingsCredits.ts
index 924778e8..cd14119f 100644
--- a/src/config/settingsCredits.ts
+++ b/src/config/settingsCredits.ts
@@ -356,6 +356,7 @@ const CONTRIBUTOR_ENTRIES = [
       'Performance Probe: Monitor/Toggles redesign, live CPU/RSS/thread metrics, overlay pins and sparklines, macOS snapshots (PR #890)',
       'Performance Probe: opt-in thread-group CPU poll toggle and includeThreadGroups IPC fix (PR #891)',
       'Queue: switchable display mode — Queue (upcoming only) vs Playlist (full list), with header toggle and settings entry (PR #922)',
+      'Community Theme Store: semantic-token refactor, dedicated Themes tab with day/night scheduler, install/update/uninstall, and 80+ palettes moved to an on-demand CDN repo (PR #1009)',
     ],
   },
   {
diff --git a/src/contexts/DragDropContext.tsx b/src/contexts/DragDropContext.tsx
index e6dd4f89..26ae32c7 100644
--- a/src/contexts/DragDropContext.tsx
+++ b/src/contexts/DragDropContext.tsx
@@ -122,7 +122,7 @@ function DragGhost({ state }: { state: DragState }) {
           size={16}
           strokeWidth={2.25}
           aria-hidden
-          style={{ flexShrink: 0, color: 'var(--danger, var(--ctp-red, #f38ba8))' }}
+          style={{ flexShrink: 0, color: 'var(--danger, var(--danger, #f38ba8))' }}
         />
       )}
       {coverUrl && (
diff --git a/src/locales/de/common.ts b/src/locales/de/common.ts
index 777d4ad8..e79a12e1 100644
--- a/src/locales/de/common.ts
+++ b/src/locales/de/common.ts
@@ -8,6 +8,7 @@ export const common = {
   downloading: 'Lade…',
   downloadZip: 'Download (ZIP)',
   back: 'Zurück',
+  backToTop: 'Nach oben',
   cancel: 'Abbrechen',
   close: 'Schließen',
   save: 'Speichern',
diff --git a/src/locales/de/settings.ts b/src/locales/de/settings.ts
index 9bb76943..d0fb7d22 100644
--- a/src/locales/de/settings.ts
+++ b/src/locales/de/settings.ts
@@ -321,6 +321,36 @@ export const settings = {
   tabAudio: 'Audio',
   tabStorage: 'Offline & Cache',
   tabAppearance: 'Darstellung',
+  tabThemes: 'Themes',
+  themesYourThemesTitle: 'Deine Themes',
+  themesCvdTooltip: 'Farbfehlsichtigkeits-sicher – Deuteranopie, Protanopie, Tritanopie',
+  themeStoreTitle: 'Theme-Store',
+  themeStoreSubmitText: 'Eigenes Theme gebaut? Teil es mit der Community — mehr Infos im Themes-Repository.',
+  themeStoreSubmitLink: 'Themes-Repository öffnen',
+  themeStoreSearchPlaceholder: 'Themes suchen…',
+  themeStoreFilterMode: 'Nach Modus filtern',
+  themeStoreModeAll: 'Alle',
+  themeStoreModeDark: 'Dunkel',
+  themeStoreModeLight: 'Hell',
+  themeStoreRefresh: 'Aktualisieren',
+  themeStoreLoading: 'Themes werden geladen…',
+  themeStoreError: 'Theme-Store konnte nicht geladen werden. Prüfe deine Verbindung.',
+  themeStoreRetry: 'Erneut versuchen',
+  themeStoreEmpty: 'Keine Themes passen zu deinen Filtern.',
+  themeStoreActive: 'Aktiv',
+  themeStoreEnlarge: 'Vorschau vergrößern',
+  themeStoreByAuthor: 'von {{author}}',
+  themeMigrationNoticeTitle: 'Theme in den Store gezogen',
+  themeMigrationNoticeBody: '{{themes}} ist nicht mehr in der App enthalten. Du kannst es im Theme-Store neu installieren (Einstellungen → Themes) oder ein anderes Theme wählen.',
+  themeMigrationNoticeOpen: 'Theme-Store öffnen',
+  themeStoreOffline: 'Zeige den zuletzt gecachten Katalog — du scheinst offline zu sein.',
+  themeStoreInstall: 'Installieren',
+  themeStoreInstalling: 'Installiere…',
+  themeStoreApply: 'Anwenden',
+  themeStoreUpdate: 'Aktualisieren',
+  themeStoreUpdating: 'Aktualisiere…',
+  themeStoreUninstall: 'Deinstallieren',
+  themeStoreInstallFailed: 'Installation fehlgeschlagen',
   tabLibrary: 'Bibliothek',
   tabServers: 'Server',
   tabLyrics: 'Songtexte',
diff --git a/src/locales/en/common.ts b/src/locales/en/common.ts
index f8480d57..62d50258 100644
--- a/src/locales/en/common.ts
+++ b/src/locales/en/common.ts
@@ -8,6 +8,7 @@ export const common = {
   downloading: 'Downloading…',
   downloadZip: 'Download (ZIP)',
   back: 'Back',
+  backToTop: 'Back to top',
   cancel: 'Cancel',
   close: 'Close',
   save: 'Save',
diff --git a/src/locales/en/settings.ts b/src/locales/en/settings.ts
index 39fce797..cd6fe5be 100644
--- a/src/locales/en/settings.ts
+++ b/src/locales/en/settings.ts
@@ -388,6 +388,36 @@ export const settings = {
   tabAudio: 'Audio',
   tabStorage: 'Offline & Cache',
   tabAppearance: 'Appearance',
+  tabThemes: 'Themes',
+  themesYourThemesTitle: 'Your Themes',
+  themesCvdTooltip: 'Colour-blind safe — deuteranopia, protanopia, tritanopia',
+  themeStoreTitle: 'Theme Store',
+  themeStoreSubmitText: 'Made your own theme? Share it with the community — more info in the themes repository.',
+  themeStoreSubmitLink: 'Open the themes repository',
+  themeStoreSearchPlaceholder: 'Search themes…',
+  themeStoreFilterMode: 'Filter by mode',
+  themeStoreModeAll: 'All',
+  themeStoreModeDark: 'Dark',
+  themeStoreModeLight: 'Light',
+  themeStoreRefresh: 'Refresh',
+  themeStoreLoading: 'Loading themes…',
+  themeStoreError: 'Could not load the theme store. Check your connection.',
+  themeStoreRetry: 'Retry',
+  themeStoreEmpty: 'No themes match your filters.',
+  themeStoreActive: 'Active',
+  themeStoreEnlarge: 'Enlarge preview',
+  themeStoreByAuthor: 'by {{author}}',
+  themeMigrationNoticeTitle: 'Theme moved to the Store',
+  themeMigrationNoticeBody: '{{themes}} is no longer bundled with the app. You can reinstall it from the Theme Store (Settings → Themes), or pick another theme.',
+  themeMigrationNoticeOpen: 'Open Theme Store',
+  themeStoreOffline: 'Showing the last cached catalogue — you appear to be offline.',
+  themeStoreInstall: 'Install',
+  themeStoreInstalling: 'Installing…',
+  themeStoreApply: 'Apply',
+  themeStoreUpdate: 'Update',
+  themeStoreUpdating: 'Updating…',
+  themeStoreUninstall: 'Uninstall',
+  themeStoreInstallFailed: 'Install failed',
   tabLibrary: 'Library',
   tabServers: 'Servers',
   tabLyrics: 'Lyrics',
diff --git a/src/locales/es/common.ts b/src/locales/es/common.ts
index df5c55ed..ff753a4b 100644
--- a/src/locales/es/common.ts
+++ b/src/locales/es/common.ts
@@ -8,6 +8,7 @@ export const common = {
   downloading: 'Descargando…',
   downloadZip: 'Descargar (ZIP)',
   back: 'Volver',
+  backToTop: 'Volver arriba',
   cancel: 'Cancelar',
   save: 'Guardar',
   delete: 'Eliminar',
diff --git a/src/locales/es/settings.ts b/src/locales/es/settings.ts
index b9a6c299..0f281b9b 100644
--- a/src/locales/es/settings.ts
+++ b/src/locales/es/settings.ts
@@ -319,6 +319,36 @@ export const settings = {
   tabAudio: 'Audio',
   tabStorage: 'Sin conexión y caché',
   tabAppearance: 'Apariencia',
+  tabThemes: 'Temas',
+  themesYourThemesTitle: 'Tus temas',
+  themesCvdTooltip: 'Apto para daltonismo: deuteranopía, protanopía, tritanopía',
+  themeStoreTitle: 'Tienda de temas',
+  themeStoreSubmitText: '¿Has creado tu propio tema? Compártelo con la comunidad — más información en el repositorio de temas.',
+  themeStoreSubmitLink: 'Abrir el repositorio de temas',
+  themeStoreSearchPlaceholder: 'Buscar temas…',
+  themeStoreFilterMode: 'Filtrar por modo',
+  themeStoreModeAll: 'Todos',
+  themeStoreModeDark: 'Oscuro',
+  themeStoreModeLight: 'Claro',
+  themeStoreRefresh: 'Actualizar',
+  themeStoreLoading: 'Cargando temas…',
+  themeStoreError: 'No se pudo cargar la tienda de temas. Comprueba tu conexión.',
+  themeStoreRetry: 'Reintentar',
+  themeStoreEmpty: 'Ningún tema coincide con tus filtros.',
+  themeStoreActive: 'Activo',
+  themeStoreEnlarge: 'Ampliar vista previa',
+  themeStoreByAuthor: 'por {{author}}',
+  themeMigrationNoticeTitle: 'Tema movido a la tienda',
+  themeMigrationNoticeBody: '{{themes}} ya no viene incluido en la app. Puedes reinstalarlo desde la Tienda de Temas (Ajustes → Temas) o elegir otro tema.',
+  themeMigrationNoticeOpen: 'Abrir Tienda de Temas',
+  themeStoreOffline: 'Mostrando el último catálogo en caché: parece que estás sin conexión.',
+  themeStoreInstall: 'Instalar',
+  themeStoreInstalling: 'Instalando…',
+  themeStoreApply: 'Aplicar',
+  themeStoreUpdate: 'Actualizar',
+  themeStoreUpdating: 'Actualizando…',
+  themeStoreUninstall: 'Desinstalar',
+  themeStoreInstallFailed: 'Error al instalar',
   tabLibrary: 'Biblioteca',
   tabServers: 'Servidores',
   tabLyrics: 'Letras',
diff --git a/src/locales/fr/common.ts b/src/locales/fr/common.ts
index 9da49c6d..f417d8de 100644
--- a/src/locales/fr/common.ts
+++ b/src/locales/fr/common.ts
@@ -8,6 +8,7 @@ export const common = {
   downloading: 'Téléchargement…',
   downloadZip: 'Télécharger (ZIP)',
   back: 'Retour',
+  backToTop: 'Retour en haut',
   cancel: 'Annuler',
   save: 'Enregistrer',
   delete: 'Supprimer',
diff --git a/src/locales/fr/settings.ts b/src/locales/fr/settings.ts
index 434c8f68..5107cf6a 100644
--- a/src/locales/fr/settings.ts
+++ b/src/locales/fr/settings.ts
@@ -317,6 +317,36 @@ export const settings = {
   tabAudio: 'Audio',
   tabStorage: 'Hors ligne & Cache',
   tabAppearance: 'Apparence',
+  tabThemes: 'Thèmes',
+  themesYourThemesTitle: 'Vos thèmes',
+  themesCvdTooltip: 'Adapté au daltonisme — deutéranopie, protanopie, tritanopie',
+  themeStoreTitle: 'Boutique de thèmes',
+  themeStoreSubmitText: "Vous avez créé votre propre thème ? Partagez-le avec la communauté — plus d'infos dans le dépôt de thèmes.",
+  themeStoreSubmitLink: 'Ouvrir le dépôt de thèmes',
+  themeStoreSearchPlaceholder: 'Rechercher des thèmes…',
+  themeStoreFilterMode: 'Filtrer par mode',
+  themeStoreModeAll: 'Tous',
+  themeStoreModeDark: 'Sombre',
+  themeStoreModeLight: 'Clair',
+  themeStoreRefresh: 'Actualiser',
+  themeStoreLoading: 'Chargement des thèmes…',
+  themeStoreError: 'Impossible de charger la boutique de thèmes. Vérifiez votre connexion.',
+  themeStoreRetry: 'Réessayer',
+  themeStoreEmpty: 'Aucun thème ne correspond à vos filtres.',
+  themeStoreActive: 'Actif',
+  themeStoreEnlarge: "Agrandir l'aperçu",
+  themeStoreByAuthor: 'par {{author}}',
+  themeMigrationNoticeTitle: 'Thème déplacé vers la boutique',
+  themeMigrationNoticeBody: "{{themes}} n'est plus inclus dans l'application. Vous pouvez le réinstaller depuis la boutique de thèmes (Paramètres → Thèmes) ou choisir un autre thème.",
+  themeMigrationNoticeOpen: 'Ouvrir la boutique de thèmes',
+  themeStoreOffline: 'Affichage du dernier catalogue en cache — vous semblez hors ligne.',
+  themeStoreInstall: 'Installer',
+  themeStoreInstalling: 'Installation…',
+  themeStoreApply: 'Appliquer',
+  themeStoreUpdate: 'Mettre à jour',
+  themeStoreUpdating: 'Mise à jour…',
+  themeStoreUninstall: 'Désinstaller',
+  themeStoreInstallFailed: "Échec de l'installation",
   tabLibrary: 'Bibliothèque',
   tabServers: 'Serveurs',
   tabLyrics: 'Paroles',
diff --git a/src/locales/nb/common.ts b/src/locales/nb/common.ts
index dadfde40..f99ba76e 100644
--- a/src/locales/nb/common.ts
+++ b/src/locales/nb/common.ts
@@ -8,6 +8,7 @@ export const common = {
   downloading: 'Laster ned…',
   downloadZip: 'Last ned (ZIP)',
   back: 'Tilbake',
+  backToTop: 'Til toppen',
   cancel: 'Avbryt',
   save: 'Lagre',
   delete: 'Slett',
diff --git a/src/locales/nb/settings.ts b/src/locales/nb/settings.ts
index 44bdbb43..268b8157 100644
--- a/src/locales/nb/settings.ts
+++ b/src/locales/nb/settings.ts
@@ -320,6 +320,36 @@ export const settings = {
   tabPersonalisation: 'Personalisering',
   tabIntegrations: 'Integrasjoner',
   tabAppearance: 'Utseende',
+  tabThemes: 'Temaer',
+  themesYourThemesTitle: 'Dine temaer',
+  themesCvdTooltip: 'Fargeblind-sikker – deuteranopi, protanopi, tritanopi',
+  themeStoreTitle: 'Temabutikk',
+  themeStoreSubmitText: 'Laget ditt eget tema? Del det med fellesskapet — mer info i tema-repoet.',
+  themeStoreSubmitLink: 'Åpne tema-repoet',
+  themeStoreSearchPlaceholder: 'Søk i temaer…',
+  themeStoreFilterMode: 'Filtrer etter modus',
+  themeStoreModeAll: 'Alle',
+  themeStoreModeDark: 'Mørk',
+  themeStoreModeLight: 'Lys',
+  themeStoreRefresh: 'Oppdater',
+  themeStoreLoading: 'Laster temaer…',
+  themeStoreError: 'Kunne ikke laste temabutikken. Sjekk tilkoblingen din.',
+  themeStoreRetry: 'Prøv igjen',
+  themeStoreEmpty: 'Ingen temaer samsvarer med filtrene dine.',
+  themeStoreActive: 'Aktiv',
+  themeStoreEnlarge: 'Forstørr forhåndsvisning',
+  themeStoreByAuthor: 'av {{author}}',
+  themeMigrationNoticeTitle: 'Temaet er flyttet til butikken',
+  themeMigrationNoticeBody: '{{themes}} følger ikke lenger med appen. Du kan installere det på nytt fra temabutikken (Innstillinger → Temaer), eller velge et annet tema.',
+  themeMigrationNoticeOpen: 'Åpne temabutikken',
+  themeStoreOffline: 'Viser den sist bufrede katalogen — du ser ut til å være frakoblet.',
+  themeStoreInstall: 'Installer',
+  themeStoreInstalling: 'Installerer…',
+  themeStoreApply: 'Bruk',
+  themeStoreUpdate: 'Oppdater',
+  themeStoreUpdating: 'Oppdaterer…',
+  themeStoreUninstall: 'Avinstaller',
+  themeStoreInstallFailed: 'Installasjonen mislyktes',
   tabStorage: 'Frakoblet & Cache',
   inputKeybindingsTitle: 'Tastatursnarveier',
   aboutContributorsCount_one: '{{count}} bidrag',
diff --git a/src/locales/nl/common.ts b/src/locales/nl/common.ts
index a5f74158..5d26233b 100644
--- a/src/locales/nl/common.ts
+++ b/src/locales/nl/common.ts
@@ -8,6 +8,7 @@ export const common = {
   downloading: 'Downloaden…',
   downloadZip: 'Downloaden (ZIP)',
   back: 'Terug',
+  backToTop: 'Terug naar boven',
   cancel: 'Annuleren',
   save: 'Opslaan',
   delete: 'Verwijderen',
diff --git a/src/locales/nl/settings.ts b/src/locales/nl/settings.ts
index 198a417e..118b02ef 100644
--- a/src/locales/nl/settings.ts
+++ b/src/locales/nl/settings.ts
@@ -317,6 +317,36 @@ export const settings = {
   tabAudio: 'Audio',
   tabStorage: 'Offline & Cache',
   tabAppearance: 'Weergave',
+  tabThemes: "Thema's",
+  themesYourThemesTitle: "Jouw thema's",
+  themesCvdTooltip: 'Kleurenblind-veilig – deuteranopie, protanopie, tritanopie',
+  themeStoreTitle: 'Themawinkel',
+  themeStoreSubmitText: 'Eigen thema gemaakt? Deel het met de community — meer info in de themarepository.',
+  themeStoreSubmitLink: 'Themarepository openen',
+  themeStoreSearchPlaceholder: "Thema's zoeken…",
+  themeStoreFilterMode: 'Filteren op modus',
+  themeStoreModeAll: 'Alle',
+  themeStoreModeDark: 'Donker',
+  themeStoreModeLight: 'Licht',
+  themeStoreRefresh: 'Vernieuwen',
+  themeStoreLoading: "Thema's laden…",
+  themeStoreError: 'Kan de themawinkel niet laden. Controleer je verbinding.',
+  themeStoreRetry: 'Opnieuw proberen',
+  themeStoreEmpty: "Geen thema's komen overeen met je filters.",
+  themeStoreActive: 'Actief',
+  themeStoreEnlarge: 'Voorbeeld vergroten',
+  themeStoreByAuthor: 'door {{author}}',
+  themeMigrationNoticeTitle: 'Thema verplaatst naar de store',
+  themeMigrationNoticeBody: '{{themes}} wordt niet meer met de app meegeleverd. Je kunt het opnieuw installeren via de Theme Store (Instellingen → Thema\'s) of een ander thema kiezen.',
+  themeMigrationNoticeOpen: 'Theme Store openen',
+  themeStoreOffline: 'De laatst gecachte catalogus wordt getoond — je lijkt offline te zijn.',
+  themeStoreInstall: 'Installeren',
+  themeStoreInstalling: 'Installeren…',
+  themeStoreApply: 'Toepassen',
+  themeStoreUpdate: 'Bijwerken',
+  themeStoreUpdating: 'Bijwerken…',
+  themeStoreUninstall: 'Verwijderen',
+  themeStoreInstallFailed: 'Installatie mislukt',
   tabLibrary: 'Bibliotheek',
   tabServers: 'Servers',
   tabLyrics: 'Songteksten',
diff --git a/src/locales/ro/common.ts b/src/locales/ro/common.ts
index 0c0378d2..c15aa259 100644
--- a/src/locales/ro/common.ts
+++ b/src/locales/ro/common.ts
@@ -8,6 +8,7 @@ export const common = {
   downloading: 'Se descarcă…',
   downloadZip: 'Descarcă (ZIP)',
   back: 'Înapoi',
+  backToTop: 'Înapoi sus',
   cancel: 'Anulează',
   close: 'Închide',
   save: 'Salvează',
diff --git a/src/locales/ro/settings.ts b/src/locales/ro/settings.ts
index 3d5f94c1..0896c35d 100644
--- a/src/locales/ro/settings.ts
+++ b/src/locales/ro/settings.ts
@@ -323,6 +323,36 @@ export const settings = {
   tabAudio: 'Audio',
   tabStorage: 'Offline & Cache',
   tabAppearance: 'Aparență',
+  tabThemes: 'Teme',
+  themesYourThemesTitle: 'Temele tale',
+  themesCvdTooltip: 'Sigur pentru daltonism – deuteranopie, protanopie, tritanopie',
+  themeStoreTitle: 'Magazin de teme',
+  themeStoreSubmitText: 'Ți-ai creat propria temă? Împărtășește-o cu comunitatea — mai multe informații în depozitul de teme.',
+  themeStoreSubmitLink: 'Deschide depozitul de teme',
+  themeStoreSearchPlaceholder: 'Caută teme…',
+  themeStoreFilterMode: 'Filtrează după mod',
+  themeStoreModeAll: 'Toate',
+  themeStoreModeDark: 'Întunecat',
+  themeStoreModeLight: 'Luminos',
+  themeStoreRefresh: 'Reîmprospătează',
+  themeStoreLoading: 'Se încarcă temele…',
+  themeStoreError: 'Magazinul de teme nu a putut fi încărcat. Verifică conexiunea.',
+  themeStoreRetry: 'Reîncearcă',
+  themeStoreEmpty: 'Nicio temă nu corespunde filtrelor tale.',
+  themeStoreActive: 'Activă',
+  themeStoreEnlarge: 'Mărește previzualizarea',
+  themeStoreByAuthor: 'de {{author}}',
+  themeMigrationNoticeTitle: 'Tema a fost mutată în magazin',
+  themeMigrationNoticeBody: '{{themes}} nu mai este inclusă în aplicație. O poți reinstala din Magazinul de Teme (Setări → Teme) sau poți alege altă temă.',
+  themeMigrationNoticeOpen: 'Deschide Magazinul de Teme',
+  themeStoreOffline: 'Se afișează ultimul catalog din cache — pari să fii offline.',
+  themeStoreInstall: 'Instalează',
+  themeStoreInstalling: 'Se instalează…',
+  themeStoreApply: 'Aplică',
+  themeStoreUpdate: 'Actualizează',
+  themeStoreUpdating: 'Se actualizează…',
+  themeStoreUninstall: 'Dezinstalează',
+  themeStoreInstallFailed: 'Instalarea a eșuat',
   tabLibrary: 'Librărie',
   tabServers: 'Servere',
   tabLyrics: 'Versuri',
diff --git a/src/locales/ru/common.ts b/src/locales/ru/common.ts
index 7054a2d2..519425f8 100644
--- a/src/locales/ru/common.ts
+++ b/src/locales/ru/common.ts
@@ -8,6 +8,7 @@ export const common = {
   downloading: 'Скачивание…',
   downloadZip: 'Скачать (ZIP)',
   back: 'Назад',
+  backToTop: 'Наверх',
   cancel: 'Отмена',
   save: 'Сохранить',
   delete: 'Удалить',
diff --git a/src/locales/ru/settings.ts b/src/locales/ru/settings.ts
index beb72c26..855459f4 100644
--- a/src/locales/ru/settings.ts
+++ b/src/locales/ru/settings.ts
@@ -399,6 +399,36 @@ export const settings = {
   tabAudio: 'Звук',
   tabStorage: 'Офлайн и кэш',
   tabAppearance: 'Внешний вид',
+  tabThemes: 'Темы',
+  themesYourThemesTitle: 'Ваши темы',
+  themesCvdTooltip: 'Безопасно при дальтонизме — дейтеранопия, протанопия, тританопия',
+  themeStoreTitle: 'Магазин тем',
+  themeStoreSubmitText: 'Создали свою тему? Поделитесь с сообществом — подробности в репозитории тем.',
+  themeStoreSubmitLink: 'Открыть репозиторий тем',
+  themeStoreSearchPlaceholder: 'Поиск тем…',
+  themeStoreFilterMode: 'Фильтр по режиму',
+  themeStoreModeAll: 'Все',
+  themeStoreModeDark: 'Тёмные',
+  themeStoreModeLight: 'Светлые',
+  themeStoreRefresh: 'Обновить',
+  themeStoreLoading: 'Загрузка тем…',
+  themeStoreError: 'Не удалось загрузить магазин тем. Проверьте подключение.',
+  themeStoreRetry: 'Повторить',
+  themeStoreEmpty: 'Нет тем, соответствующих фильтрам.',
+  themeStoreActive: 'Активна',
+  themeStoreEnlarge: 'Увеличить превью',
+  themeStoreByAuthor: 'от {{author}}',
+  themeMigrationNoticeTitle: 'Тема перенесена в магазин',
+  themeMigrationNoticeBody: '{{themes}} больше не входит в приложение. Вы можете переустановить её из магазина тем (Настройки → Темы) или выбрать другую тему.',
+  themeMigrationNoticeOpen: 'Открыть магазин тем',
+  themeStoreOffline: 'Показан последний кэшированный каталог — похоже, вы офлайн.',
+  themeStoreInstall: 'Установить',
+  themeStoreInstalling: 'Установка…',
+  themeStoreApply: 'Применить',
+  themeStoreUpdate: 'Обновить',
+  themeStoreUpdating: 'Обновление…',
+  themeStoreUninstall: 'Удалить',
+  themeStoreInstallFailed: 'Ошибка установки',
   tabLibrary: 'Библиотека',
   tabServers: 'Серверы',
   tabLyrics: 'Тексты песен',
diff --git a/src/locales/zh/common.ts b/src/locales/zh/common.ts
index f5a10ba9..fcf54d8f 100644
--- a/src/locales/zh/common.ts
+++ b/src/locales/zh/common.ts
@@ -8,6 +8,7 @@ export const common = {
   downloading: '正在下载…',
   downloadZip: '下载 (ZIP)',
   back: '返回',
+  backToTop: '回到顶部',
   cancel: '取消',
   save: '保存',
   delete: '删除',
diff --git a/src/locales/zh/settings.ts b/src/locales/zh/settings.ts
index d2fbc403..b09447ef 100644
--- a/src/locales/zh/settings.ts
+++ b/src/locales/zh/settings.ts
@@ -316,6 +316,36 @@ export const settings = {
   tabAudio: '音频',
   tabStorage: '离线与缓存',
   tabAppearance: '外观',
+  tabThemes: '主题',
+  themesYourThemesTitle: '你的主题',
+  themesCvdTooltip: '色觉障碍友好 — 绿色盲、红色盲、蓝色盲',
+  themeStoreTitle: '主题商店',
+  themeStoreSubmitText: '做了自己的主题？与社区分享——更多信息见主题仓库。',
+  themeStoreSubmitLink: '打开主题仓库',
+  themeStoreSearchPlaceholder: '搜索主题…',
+  themeStoreFilterMode: '按模式筛选',
+  themeStoreModeAll: '全部',
+  themeStoreModeDark: '深色',
+  themeStoreModeLight: '浅色',
+  themeStoreRefresh: '刷新',
+  themeStoreLoading: '正在加载主题…',
+  themeStoreError: '无法加载主题商店。请检查网络连接。',
+  themeStoreRetry: '重试',
+  themeStoreEmpty: '没有符合筛选条件的主题。',
+  themeStoreActive: '使用中',
+  themeStoreEnlarge: '放大预览',
+  themeStoreByAuthor: '作者：{{author}}',
+  themeMigrationNoticeTitle: '主题已移至商店',
+  themeMigrationNoticeBody: '{{themes}} 不再内置于应用中。你可以在主题商店（设置 → 主题）重新安装，或选择其他主题。',
+  themeMigrationNoticeOpen: '打开主题商店',
+  themeStoreOffline: '正在显示上次缓存的目录——你似乎处于离线状态。',
+  themeStoreInstall: '安装',
+  themeStoreInstalling: '正在安装…',
+  themeStoreApply: '应用',
+  themeStoreUpdate: '更新',
+  themeStoreUpdating: '正在更新…',
+  themeStoreUninstall: '卸载',
+  themeStoreInstallFailed: '安装失败',
   tabLibrary: '媒体库',
   tabServers: '服务器',
   tabLyrics: '歌词',
diff --git a/src/pages/Albums.tsx b/src/pages/Albums.tsx
index f6b689af..4ccdb5c1 100644
--- a/src/pages/Albums.tsx
+++ b/src/pages/Albums.tsx
@@ -418,7 +418,7 @@ export default function Albums() {
                     data-tooltip-pos="bottom"
                     style={{
                       display: 'flex', alignItems: 'center', gap: '0.4rem',
-                      ...(compFilter !== 'all' ? { background: 'var(--accent)', color: 'var(--ctp-crust)' } : {}),
+                      ...(compFilter !== 'all' ? { background: 'var(--accent)', color: 'var(--text-on-accent)' } : {}),
                     }}
                   >
                     <Disc3 size={14} />
@@ -439,7 +439,7 @@ export default function Albums() {
                 onClick={toggleSelectionMode}
                 data-tooltip={selectionMode ? t('albums.cancelSelect') : t('albums.startSelect')}
                 data-tooltip-pos="bottom"
-                style={selectionMode ? { background: 'var(--accent)', color: 'var(--ctp-crust)' } : {}}
+                style={selectionMode ? { background: 'var(--accent)', color: 'var(--text-on-accent)' } : {}}
               >
                 <CheckSquare2 size={15} />
                 <span className="toolbar-btn-label">{selectionMode ? t('albums.cancelSelect') : t('albums.select')}</span>
@@ -534,7 +534,7 @@ export default function Albums() {
                   display: 'flex',
                   justifyContent: 'center',
                   paddingTop: '3rem',
-                  background: 'var(--ctp-base)',
+                  background: 'var(--bg-app)',
                 }}
               >
                 <div className="spinner" />
diff --git a/src/pages/Artists.tsx b/src/pages/Artists.tsx
index 39e1a26a..995e1285 100644
--- a/src/pages/Artists.tsx
+++ b/src/pages/Artists.tsx
@@ -329,7 +329,7 @@ export default function Artists() {
                   <button
                     className={`btn btn-surface`}
                     onClick={() => setShowArtistImages(!showArtistImages)}
-                    style={showArtistImages ? { background: 'var(--accent)', color: 'var(--ctp-crust)', padding: '0.5rem' } : { padding: '0.5rem' }}
+                    style={showArtistImages ? { background: 'var(--accent)', color: 'var(--text-on-accent)', padding: '0.5rem' } : { padding: '0.5rem' }}
                     data-tooltip={showArtistImages ? t('artists.imagesOn') : t('artists.imagesOff')}
                     data-tooltip-wrap
                     data-tooltip-pos="bottom"
@@ -339,7 +339,7 @@ export default function Artists() {
                   <button
                     className={`btn btn-surface ${viewMode === 'grid' ? 'btn-sort-active' : ''}`}
                     onClick={() => setViewMode('grid')}
-                    style={viewMode === 'grid' ? { background: 'var(--accent)', color: 'var(--ctp-crust)', padding: '0.5rem' } : { padding: '0.5rem' }}
+                    style={viewMode === 'grid' ? { background: 'var(--accent)', color: 'var(--text-on-accent)', padding: '0.5rem' } : { padding: '0.5rem' }}
                     data-tooltip={t('artists.gridView')}
                     data-tooltip-pos="bottom"
                   >
@@ -348,7 +348,7 @@ export default function Artists() {
                   <button
                     className={`btn btn-surface ${viewMode === 'list' ? 'btn-sort-active' : ''}`}
                     onClick={() => setViewMode('list')}
-                    style={viewMode === 'list' ? { background: 'var(--accent)', color: 'var(--ctp-crust)', padding: '0.5rem' } : { padding: '0.5rem' }}
+                    style={viewMode === 'list' ? { background: 'var(--accent)', color: 'var(--text-on-accent)', padding: '0.5rem' } : { padding: '0.5rem' }}
                     data-tooltip={t('artists.listView')}
                     data-tooltip-pos="bottom"
                   >
@@ -361,7 +361,7 @@ export default function Artists() {
                 onClick={toggleSelectionMode}
                 data-tooltip={selectionMode ? t('artists.cancelSelect') : t('artists.startSelect')}
                 data-tooltip-pos="bottom"
-                style={selectionMode ? { background: 'var(--accent)', color: 'var(--ctp-crust)' } : {}}
+                style={selectionMode ? { background: 'var(--accent)', color: 'var(--text-on-accent)' } : {}}
               >
                 <CheckSquare2 size={15} />
                 {selectionMode ? t('artists.cancelSelect') : t('artists.select')}
diff --git a/src/pages/GenreDetail.tsx b/src/pages/GenreDetail.tsx
index 12e3689a..c31a6441 100644
--- a/src/pages/GenreDetail.tsx
+++ b/src/pages/GenreDetail.tsx
@@ -256,7 +256,7 @@ export default function GenreDetail() {
                   display: 'flex',
                   justifyContent: 'center',
                   paddingTop: '3rem',
-                  background: 'var(--ctp-base)',
+                  background: 'var(--bg-app)',
                 }}
               >
                 <div className="spinner" />
diff --git a/src/pages/LosslessAlbums.tsx b/src/pages/LosslessAlbums.tsx
index 3a25eb91..4c0e558d 100644
--- a/src/pages/LosslessAlbums.tsx
+++ b/src/pages/LosslessAlbums.tsx
@@ -328,7 +328,7 @@ export default function LosslessAlbums() {
                 onClick={toggleSelectionMode}
                 data-tooltip={selectionMode ? t('albums.cancelSelect') : t('albums.startSelect')}
                 data-tooltip-pos="bottom"
-                style={selectionMode ? { background: 'var(--accent)', color: 'var(--ctp-crust)' } : {}}
+                style={selectionMode ? { background: 'var(--accent)', color: 'var(--text-on-accent)' } : {}}
               >
                 <CheckSquare2 size={15} />
                 {selectionMode ? t('albums.cancelSelect') : t('albums.select')}
diff --git a/src/pages/NewReleases.tsx b/src/pages/NewReleases.tsx
index 78369b19..12648d4b 100644
--- a/src/pages/NewReleases.tsx
+++ b/src/pages/NewReleases.tsx
@@ -266,7 +266,7 @@ export default function NewReleases() {
               onClick={toggleSelectionMode}
               data-tooltip={selectionMode ? t('albums.cancelSelect') : t('albums.startSelect')}
               data-tooltip-pos="bottom"
-              style={selectionMode ? { background: 'var(--accent)', color: 'var(--ctp-crust)' } : {}}
+              style={selectionMode ? { background: 'var(--accent)', color: 'var(--text-on-accent)' } : {}}
             >
               <CheckSquare2 size={15} />
               {selectionMode ? t('albums.cancelSelect') : t('albums.select')}
@@ -337,7 +337,7 @@ export default function NewReleases() {
                   display: 'flex',
                   justifyContent: 'center',
                   paddingTop: '3rem',
-                  background: 'var(--ctp-base)',
+                  background: 'var(--bg-app)',
                 }}
               >
                 <div className="spinner" />
diff --git a/src/pages/RandomAlbums.tsx b/src/pages/RandomAlbums.tsx
index 237319b9..3d8b31f9 100644
--- a/src/pages/RandomAlbums.tsx
+++ b/src/pages/RandomAlbums.tsx
@@ -330,7 +330,7 @@ export default function RandomAlbums() {
               onClick={toggleSelectionMode}
               data-tooltip={selectionMode ? t('albums.cancelSelect') : t('albums.startSelect')}
               data-tooltip-pos="bottom"
-              style={selectionMode ? { background: 'var(--accent)', color: 'var(--ctp-crust)' } : {}}
+              style={selectionMode ? { background: 'var(--accent)', color: 'var(--text-on-accent)' } : {}}
             >
               <CheckSquare2 size={15} />
               {selectionMode ? t('albums.cancelSelect') : t('albums.select')}
@@ -393,7 +393,7 @@ export default function RandomAlbums() {
                   display: 'flex',
                   justifyContent: 'center',
                   paddingTop: '3rem',
-                  background: 'var(--ctp-base)',
+                  background: 'var(--bg-app)',
                 }}
               >
                 <div className="spinner" />
diff --git a/src/pages/Settings.tsx b/src/pages/Settings.tsx
index ceff30d5..276f8857 100644
--- a/src/pages/Settings.tsx
+++ b/src/pages/Settings.tsx
@@ -2,11 +2,12 @@ import React, { useEffect, useRef, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useLocation, useNavigate } from 'react-router-dom';
 import {
-  AudioLines, HardDrive, Info, Keyboard, LayoutGrid, Music2, Palette, Search, Server, Sparkles, Users, X,
+  AudioLines, HardDrive, Info, Keyboard, LayoutGrid, Music2, Paintbrush, Palette, Search, Server, Sparkles, Users, X,
 } from 'lucide-react';
 import { useAuthStore } from '../store/authStore';
 import { IS_MACOS } from '../utils/platform';
 import { AppearanceTab } from '../components/settings/AppearanceTab';
+import { ThemesTab } from '../components/settings/ThemesTab';
 import { AudioTab } from '../components/settings/AudioTab';
 import { InputTab } from '../components/settings/InputTab';
 import { IntegrationsTab } from '../components/settings/IntegrationsTab';
@@ -141,8 +142,9 @@ export default function Settings() {
     { id: 'servers',         label: t('settings.tabServers'),         icon: <Server size={15} /> },
     { id: 'library',         label: t('settings.tabLibrary'),         icon: <Music2 size={15} /> },
     { id: 'audio',           label: t('settings.tabAudio'),           icon: <AudioLines size={15} /> },
-    { id: 'lyrics',          label: t('settings.tabLyrics'),          icon: <Music2 size={15} /> },
+    { id: 'themes',          label: t('settings.tabThemes'),          icon: <Paintbrush size={15} /> },
     { id: 'appearance',      label: t('settings.tabAppearance'),      icon: <Palette size={15} /> },
+    { id: 'lyrics',          label: t('settings.tabLyrics'),          icon: <Music2 size={15} /> },
     { id: 'personalisation', label: t('settings.tabPersonalisation'), icon: <LayoutGrid size={15} /> },
     { id: 'integrations',    label: t('settings.tabIntegrations'),    icon: <Sparkles size={15} /> },
     { id: 'input',           label: t('settings.tabInput'),           icon: <Keyboard size={15} /> },
@@ -306,6 +308,9 @@ export default function Settings() {
       {/* ── Appearance ───────────────────────────────────────────────────────── */}
       {activeTab === 'appearance' && <AppearanceTab />}
 
+      {/* ── Themes ───────────────────────────────────────────────────────────── */}
+      {activeTab === 'themes' && <ThemesTab />}
+
       {/* ── Input ────────────────────────────────────────────────────────────── */}
       {activeTab === 'input' && <InputTab />}
 
@@ -338,6 +343,7 @@ const TAB_LABEL_KEY: Record<Tab, string> = {
   audio:           'settings.tabAudio',
   lyrics:          'settings.tabLyrics',
   appearance:      'settings.tabAppearance',
+  themes:          'settings.tabThemes',
   personalisation: 'settings.tabPersonalisation',
   integrations:    'settings.tabIntegrations',
   input:           'settings.tabInput',
diff --git a/src/pages/Statistics.tsx b/src/pages/Statistics.tsx
index c964f63c..4e3ac266 100644
--- a/src/pages/Statistics.tsx
+++ b/src/pages/Statistics.tsx
@@ -381,7 +381,7 @@ export default function Statistics() {
                         <div style={{ display: 'flex', alignItems: 'center', gap: '0.5rem' }}>
                           <span style={{ fontSize: '0.875rem', fontWeight: 500, overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>{track.name}</span>
                           {track.nowPlaying && (
-                            <span style={{ fontSize: 10, fontWeight: 600, padding: '1px 6px', borderRadius: 4, background: 'var(--accent)', color: 'var(--ctp-base)', opacity: 0.85, letterSpacing: '0.04em', textTransform: 'uppercase', flexShrink: 0 }}>{t('statistics.lfmNowPlaying')}</span>
+                            <span style={{ fontSize: 10, fontWeight: 600, padding: '1px 6px', borderRadius: 4, background: 'var(--accent)', color: 'var(--bg-app)', opacity: 0.85, letterSpacing: '0.04em', textTransform: 'uppercase', flexShrink: 0 }}>{t('statistics.lfmNowPlaying')}</span>
                           )}
                         </div>
                         <div style={{ fontSize: '0.75rem', color: 'var(--text-muted)', overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>
diff --git a/src/store/installedThemesStore.ts b/src/store/installedThemesStore.ts
new file mode 100644
index 00000000..2640df03
--- /dev/null
+++ b/src/store/installedThemesStore.ts
@@ -0,0 +1,50 @@
+import { create } from 'zustand';
+import { persist } from 'zustand/middleware';
+
+/**
+ * A community theme the user installed from the Theme Store. The full CSS text
+ * lives here (in localStorage via the persist middleware) so it is available
+ * *synchronously* at startup — the runtime <style> injection can run before the
+ * first paint with no network round-trip and no flash of the wrong theme.
+ * Built-in themes are NOT tracked here; they ship bundled and are never
+ * uninstallable.
+ */
+export interface InstalledTheme {
+  id: string;
+  name: string;
+  author: string;
+  version: string;
+  description: string;
+  mode: 'dark' | 'light';
+  tags?: string[];
+  /** The `[data-theme='<id>']` block — the only CSS, already CI-validated. */
+  css: string;
+  installedAt: number;
+}
+
+interface InstalledThemesState {
+  themes: InstalledTheme[];
+  /** Insert or replace by id (used for both install and update). */
+  install: (theme: InstalledTheme) => void;
+  uninstall: (id: string) => void;
+  isInstalled: (id: string) => boolean;
+  getInstalled: (id: string) => InstalledTheme | undefined;
+}
+
+export const useInstalledThemesStore = create<InstalledThemesState>()(
+  persist(
+    (set, get) => ({
+      themes: [],
+      install: (theme) =>
+        set((s) => ({ themes: [...s.themes.filter((t) => t.id !== theme.id), theme] })),
+      uninstall: (id) =>
+        set((s) => ({ themes: s.themes.filter((t) => t.id !== id) })),
+      isInstalled: (id) => get().themes.some((t) => t.id === id),
+      getInstalled: (id) => get().themes.find((t) => t.id === id),
+    }),
+    {
+      name: 'psysonic_installed_themes',
+      version: 1,
+    }
+  )
+);
diff --git a/src/store/themeStore.ts b/src/store/themeStore.ts
index 4a1fa963..836ee276 100644
--- a/src/store/themeStore.ts
+++ b/src/store/themeStore.ts
@@ -1,7 +1,22 @@
 import { create } from 'zustand';
 import { persist } from 'zustand/middleware';
 
-type Theme = 'mocha' | 'macchiato' | 'frappe' | 'latte' | 'nord' | 'nord-snowstorm' | 'nord-frost' | 'nord-aurora' | 'psychowave' | 'wnamp' | 'poison' | 'nucleo' | 'muma-jukebox' | 'winmedplayer' | 'p-dvd' | 'vintage-tube-radio' | 'neon-drift' | 'aero-glass' | 'luna-teal' | 'w98' | 'cupertino-light' | 'cupertino-dark' | 'gruvbox-dark-hard' | 'gruvbox-dark-medium' | 'gruvbox-dark-soft' | 'gruvbox-light-hard' | 'gruvbox-light-medium' | 'gruvbox-light-soft' | 'spotless' | 'dzr0' | 'cupertino-beats' | 'lambda-17' | 'gw1' | 'grand-theft-audio' | 'v-tactical' | 'nightcity-2077' | 'middle-earth' | 'morpheus' | 'stark-hud' | 'blade' | 'heisenberg' | 'ice-and-fire' | 'doh-matic' | 't-800' | 'dune' | 'tetrastack' | 'the-book' | 'readit' | 'insta' | 'hill-valley-85' | 'turtle-power' | 'w3-1' | 'aqua-quartz' | 'spider-tech' | 'dos' | 'unix' | 'jayfin' | 'horde' | 'alliance' | 'w11' | 'w10' | 'north-park' | 'dark-side-of-the-moon' | 'powerslave' | 'nightfox' | 'dayfox' | 'dawnfox' | 'duskfox' | 'nordfox' | 'terafox' | 'carbonfox' | 'dracula' | 'kanagawa-wave' | 'kanagawa-dragon' | 'kanagawa-lotus' | 'one-dark' | 'one-light' | 'vs-1984' | 'vs-1984-cyberpunk' | 'vs-1984-light' | 'vs-1984-orwell' | 'vision-dark' | 'vision-navy';
+/** Themes that ship bundled with the app and can never be uninstalled. */
+export type BuiltinTheme =
+  | 'mocha'
+  | 'latte'
+  | 'kanagawa-wave'
+  | 'stark-hud'
+  | 'vision-dark'
+  | 'vision-navy';
+
+/**
+ * A theme id. Built-in ids get autocomplete; installed community themes apply
+ * any string id (the `& {}` keeps the literal hints without collapsing to a
+ * bare `string`). Non-core palettes now live in the community Theme Store and
+ * are applied by their string id once installed.
+ */
+export type Theme = BuiltinTheme | (string & {});
 
 interface ThemeState {
   theme: Theme;
@@ -44,23 +59,6 @@ export function getScheduledTheme(state: Pick<ThemeState, 'enableThemeScheduler'
   return isDay ? state.themeDay : state.themeNight;
 }
 
-/** Themes removed in PR #490 (community theme redesign). Each key maps to the
- *  closest surviving palette so persisted state from older builds doesn't land
- *  on a non-existent `data-theme` attribute and silently fall back to :root. */
-const REMOVED_THEME_REMAP: Record<string, string> = {
-  'amber-night':    'obsidian-gold',   // warm gold/amber dark family
-  'ice-blue':       'carbon-grey',     // cool neutral dark (no surviving cyan)
-  'monochrome':     'carbon-grey',     // neutral grey dark
-  'phosphor-green': 'deep-forest',     // green dark family
-  'rose-dark':      'sakura-night',    // pink/rose dark family
-};
-
-function remapTheme(value: unknown): unknown {
-  return typeof value === 'string' && value in REMOVED_THEME_REMAP
-    ? REMOVED_THEME_REMAP[value]
-    : value;
-}
-
 export const useThemeStore = create<ThemeState>()(
   persist(
     (set) => ({
@@ -92,16 +90,10 @@ export const useThemeStore = create<ThemeState>()(
     {
       name: 'psysonic_theme',
       version: 1,
-      migrate: (persistedState, _version) => {
-        if (!persistedState || typeof persistedState !== 'object') return persistedState;
-        const s = persistedState as Record<string, unknown>;
-        return {
-          ...s,
-          theme:      remapTheme(s.theme),
-          themeDay:   remapTheme(s.themeDay),
-          themeNight: remapTheme(s.themeNight),
-        };
-      },
+      // Identity migrate: preserve persisted state from older versions as-is.
+      // Theme-id repair for removed / store-only themes now happens in the
+      // pre-React bootstrap migration (see utils/themes/themeMigration).
+      migrate: (persistedState) => persistedState,
     }
   )
 );
diff --git a/src/styles/components/album-card.css b/src/styles/components/album-card.css
index 7c123322..ba32c9dd 100644
--- a/src/styles/components/album-card.css
+++ b/src/styles/components/album-card.css
@@ -11,14 +11,14 @@
 }
 
 .album-card:hover {
-  box-shadow: inset 0 0 0 1px var(--border), var(--shadow-md);
+  box-shadow: inset 0 0 0 1px var(--card-hover-border), var(--shadow-md);
 }
 
 .album-card-cover {
   position: relative;
   aspect-ratio: 1;
   overflow: hidden;
-  background: var(--bg-hover);
+  background: var(--card-placeholder-bg);
   contain: paint;
   isolation: isolate;
   transform: translateZ(0);
diff --git a/src/styles/components/album-row-container.css b/src/styles/components/album-row-container.css
index b04d93f7..a7142072 100644
--- a/src/styles/components/album-row-container.css
+++ b/src/styles/components/album-row-container.css
@@ -177,7 +177,7 @@
 }
 
 .album-card-more:hover {
-  background: var(--ctp-surface0);
+  background: var(--bg-card);
   color: var(--text-primary);
   border-color: var(--accent);
   box-shadow: var(--shadow-sm);
@@ -199,7 +199,7 @@
 .album-card-offline-badge {
   flex-shrink: 0;
   background: color-mix(in srgb, var(--accent) 85%, transparent);
-  color: var(--ctp-crust);
+  color: var(--text-on-accent);
   border-radius: var(--radius-sm);
   padding: 3px 4px;
   display: flex;
@@ -210,7 +210,7 @@
 .album-card-new-badge {
   flex-shrink: 0;
   background: var(--accent);
-  color: var(--ctp-crust);
+  color: var(--text-on-accent);
   border: 1px solid color-mix(in srgb, var(--accent) 42%, transparent);
   border-radius: var(--radius-sm);
   padding: 3px 6px;
@@ -243,7 +243,7 @@
 
 .album-card-details-btn {
   background: var(--accent);
-  color: var(--ctp-crust);
+  color: var(--text-on-accent);
   border: none;
   padding: 8px 20px;
   border-radius: var(--radius-full);
@@ -386,6 +386,6 @@
 .album-card-select-check--on {
   background: var(--accent);
   border-color: var(--accent);
-  color: var(--ctp-crust);
+  color: var(--text-on-accent);
 }
 
diff --git a/src/styles/components/album-tracklist-mobile.css b/src/styles/components/album-tracklist-mobile.css
index 27efbd20..f3f649f8 100644
--- a/src/styles/components/album-tracklist-mobile.css
+++ b/src/styles/components/album-tracklist-mobile.css
@@ -9,7 +9,7 @@
   justify-content: space-between;
   gap: var(--space-3);
   padding: 12px 0;
-  border-bottom: 1px solid var(--border-subtle, rgba(255, 255, 255, 0.06));
+  border-bottom: 1px solid var(--row-divider);
   cursor: pointer;
   transition: background var(--transition-fast);
   border-radius: 6px;
@@ -20,11 +20,11 @@
 }
 
 .tracklist-mobile-row.active .tracklist-mobile-title {
-  color: var(--accent);
+  color: var(--row-playing-text);
 }
 
 .tracklist-mobile-row.context-active {
-  background: var(--bg-hover);
+  background: var(--row-hover);
 }
 
 .tracklist-mobile-main {
@@ -37,7 +37,7 @@
 
 .tracklist-mobile-num {
   font-size: 12px;
-  color: var(--text-muted);
+  color: var(--row-text-muted);
   min-width: 18px;
   text-align: right;
   flex-shrink: 0;
@@ -54,7 +54,7 @@
 .tracklist-mobile-title {
   font-size: 15px;
   font-weight: 500;
-  color: var(--text-primary);
+  color: var(--row-text);
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
@@ -62,7 +62,7 @@
 
 .tracklist-mobile-duration {
   font-size: 13px;
-  color: var(--text-muted);
+  color: var(--row-text-muted);
   font-variant-numeric: tabular-nums;
   flex-shrink: 0;
 }
diff --git a/src/styles/components/alphabet-filter-bar.css b/src/styles/components/alphabet-filter-bar.css
index c3e5cdb6..361c18e6 100644
--- a/src/styles/components/alphabet-filter-bar.css
+++ b/src/styles/components/alphabet-filter-bar.css
@@ -19,5 +19,5 @@
   transition: color 0.12s, background 0.12s;
 }
 .alphabet-filter-btn:hover { background: var(--bg-hover); }
-.alphabet-filter-btn.active { background: var(--accent); color: var(--ctp-crust); }
+.alphabet-filter-btn.active { background: var(--accent); color: var(--text-on-accent); }
 
diff --git a/src/styles/components/artist-card-grid-view.css b/src/styles/components/artist-card-grid-view.css
index 043c631a..052aefc8 100644
--- a/src/styles/components/artist-card-grid-view.css
+++ b/src/styles/components/artist-card-grid-view.css
@@ -13,14 +13,14 @@
 
 .artist-card:hover {
   box-shadow: var(--shadow-md);
-  border-color: var(--border);
+  border-color: var(--card-hover-border);
 }
 
 .artist-card-avatar {
   position: relative;
   aspect-ratio: 1;
   overflow: hidden;
-  background: var(--bg-hover);
+  background: var(--card-placeholder-bg);
   display: flex;
   align-items: center;
   justify-content: center;
@@ -78,7 +78,7 @@
 .artist-card-name {
   font-weight: 600;
   font-size: 13px;
-  color: var(--text-primary);
+  color: var(--card-title);
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
@@ -86,6 +86,6 @@
 
 .artist-card-meta {
   font-size: 12px;
-  color: var(--text-secondary);
+  color: var(--card-subtitle);
 }
 
diff --git a/src/styles/components/artist-card-selection-checkbox.css b/src/styles/components/artist-card-selection-checkbox.css
index 8fe429d2..afee0c62 100644
--- a/src/styles/components/artist-card-selection-checkbox.css
+++ b/src/styles/components/artist-card-selection-checkbox.css
@@ -22,7 +22,7 @@
 .artist-card-select-check--on {
   background: var(--accent);
   border-color: var(--accent);
-  color: var(--ctp-crust);
+  color: var(--text-on-accent);
 }
 
 .artist-card--selectable {
diff --git a/src/styles/components/artists-page-alphabet-bar.css b/src/styles/components/artists-page-alphabet-bar.css
index c028ea94..3c8ccd80 100644
--- a/src/styles/components/artists-page-alphabet-bar.css
+++ b/src/styles/components/artists-page-alphabet-bar.css
@@ -10,13 +10,13 @@
 }
 .artists-alpha-btn:not(.artists-alpha-btn--active):hover {
   background: var(--accent);
-  color: var(--ctp-crust);
+  color: var(--text-on-accent);
   border-color: var(--accent);
   box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 25%, transparent);
 }
 .artists-alpha-btn--active {
   background: var(--accent);
-  color: var(--ctp-crust);
+  color: var(--text-on-accent);
   border-color: var(--accent);
 }
 .alphabet-filter-btn.empty { opacity: 0.28; pointer-events: none; }
diff --git a/src/styles/components/back-to-top.css b/src/styles/components/back-to-top.css
new file mode 100644
index 00000000..d6fe58a5
--- /dev/null
+++ b/src/styles/components/back-to-top.css
@@ -0,0 +1,45 @@
+/* ─── Back to top button ─── */
+@keyframes back-to-top-in {
+  from { opacity: 0; transform: translateY(8px); }
+  to   { opacity: 1; transform: translateY(0); }
+}
+
+/* Pinned to the bottom-right of the content area (its portal host
+   `.app-shell-route-host` spans the region between sidebar/queue and above the
+   player bar). Absolute against that host so it never drifts with the scrolling
+   content — the scroll viewport's `contain: paint` rules out `position: fixed`
+   here. */
+.back-to-top-btn {
+  position: absolute;
+  bottom: 16px;
+  right: 20px;
+  z-index: 50;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 42px;
+  height: 42px;
+  border-radius: 50%;
+  border: 1px solid color-mix(in srgb, var(--accent) 35%, transparent);
+  background: var(--bg-elevated);
+  color: var(--accent);
+  cursor: pointer;
+  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35);
+  animation: back-to-top-in 0.25s ease both;
+  transition: background 0.15s ease, transform 0.15s ease, border-color 0.15s ease;
+}
+
+.back-to-top-btn:hover {
+  background: var(--bg-hover);
+  border-color: var(--accent);
+  transform: translateY(-2px);
+}
+
+.back-to-top-btn:active {
+  transform: translateY(0);
+}
+
+.back-to-top-btn:focus-visible {
+  outline: 2px solid var(--accent);
+  outline-offset: 2px;
+}
diff --git a/src/styles/components/context-menu-submenu.css b/src/styles/components/context-menu-submenu.css
index 7f756ef7..db10bf82 100644
--- a/src/styles/components/context-menu-submenu.css
+++ b/src/styles/components/context-menu-submenu.css
@@ -5,14 +5,14 @@
 
 .context-menu-item--submenu.active,
 .context-menu-item--submenu:hover {
-  background: var(--surface-2);
-  color: var(--accent);
+  background: var(--menu-item-hover);
+  color: var(--menu-item-active-text);
 }
 
 .context-submenu {
   position: absolute;
   top: -4px;
-  background: var(--bg-card);
+  background: var(--menu-bg);
   border: 1px solid var(--border);
   border-radius: var(--radius-md);
   padding: var(--space-1) 0;
@@ -45,7 +45,7 @@
 .context-submenu-input {
   flex: 1;
   min-width: 0;
-  background: var(--bg-surface);
+  background: var(--input-bg);
   border: 1px solid var(--accent);
   border-radius: var(--radius-sm);
   color: var(--text-primary);
@@ -63,7 +63,7 @@
   background: var(--accent);
   border: none;
   border-radius: var(--radius-sm);
-  color: var(--ctp-crust);
+  color: var(--text-on-accent);
   padding: 4px 6px;
   cursor: pointer;
   display: flex;
diff --git a/src/styles/components/context-menu.css b/src/styles/components/context-menu.css
index 93b2e275..5841ba76 100644
--- a/src/styles/components/context-menu.css
+++ b/src/styles/components/context-menu.css
@@ -2,7 +2,7 @@
 .context-menu {
   position: fixed;
   z-index: 10000;
-  background: var(--bg-card);
+  background: var(--menu-bg);
   border: 1px solid var(--border);
   border-radius: var(--radius-md);
   padding: var(--space-1) 0;
@@ -24,14 +24,14 @@
 }
 
 .context-menu-item:hover {
-  background: var(--surface-2);
-  color: var(--accent);
+  background: var(--menu-item-hover);
+  color: var(--menu-item-active-text);
 }
 
 .context-menu-item.context-menu-keyboard-active,
 .context-menu-rating-row.context-menu-keyboard-active {
-  background: var(--surface-2);
-  color: var(--accent);
+  background: var(--menu-item-hover);
+  color: var(--menu-item-active-text);
 }
 
 .context-menu-item.context-menu-keyboard-active {
@@ -39,7 +39,7 @@
 }
 
 .context-menu-rating-row.context-menu-keyboard-active {
-  background: color-mix(in srgb, var(--accent) 18%, var(--surface-2));
+  background: color-mix(in srgb, var(--accent) 18%, var(--menu-item-hover));
   box-shadow: inset 3px 0 0 var(--accent), inset 0 0 0 1px color-mix(in srgb, var(--accent) 55%, transparent);
 }
 
@@ -50,7 +50,7 @@
 
 .context-menu-divider {
   height: 1px;
-  background: var(--border-subtle);
+  background: var(--menu-divider);
   margin: var(--space-1) 0;
 }
 
diff --git a/src/styles/components/cover-lightbox.css b/src/styles/components/cover-lightbox.css
index fd2058ba..d9d91260 100644
--- a/src/styles/components/cover-lightbox.css
+++ b/src/styles/components/cover-lightbox.css
@@ -201,7 +201,7 @@
 .album-detail-badge {
   margin-bottom: 0.5rem;
   background: var(--accent);
-  color: var(--ctp-crust);
+  color: var(--text-on-accent);
   /* Konsistenz mit `.album-card-new-badge`: eckig, nicht pill. */
   border-radius: var(--radius-sm);
 }
@@ -281,14 +281,14 @@
 .download-progress-bar {
   flex: 1;
   height: 4px;
-  background: var(--surface-2);
+  background: var(--bg-elevated, var(--bg-card));
   border-radius: 2px;
   overflow: hidden;
 }
 
 .download-progress-fill {
   height: 100%;
-  background: linear-gradient(90deg, var(--ctp-mauve), var(--ctp-blue));
+  background: linear-gradient(90deg, var(--accent), var(--accent-2));
   border-radius: 2px;
   transition: width 0.2s ease;
 }
diff --git a/src/styles/components/custom-select.css b/src/styles/components/custom-select.css
index 7617028c..e5356b53 100644
--- a/src/styles/components/custom-select.css
+++ b/src/styles/components/custom-select.css
@@ -6,8 +6,8 @@
   gap: 0.5rem;
   width: 100%;
   padding: 0.5rem 0.75rem;
-  background: var(--bg-input);
-  border: 1px solid var(--border-dropdown, var(--border));
+  background: var(--bg-card);
+  border: 1px solid var(--border-dropdown);
   border-radius: var(--radius-sm);
   color: var(--text-primary);
   font-size: 0.875rem;
@@ -17,7 +17,7 @@
 }
 .custom-select-trigger:hover {
   border-color: var(--accent);
-  background: var(--bg-hover);
+  background: var(--button-hover);
 }
 .custom-select-label {
   flex: 1;
@@ -34,10 +34,10 @@
   transform: rotate(180deg);
 }
 .custom-select-dropdown {
-  background: var(--bg-card);
-  border: 1px solid var(--border-dropdown, var(--border));
+  background: var(--menu-bg);
+  border: 1px solid var(--border-dropdown);
   border-radius: var(--radius-md);
-  box-shadow: 0 8px 32px var(--shadow-dropdown, rgba(0, 0, 0, 0.4));
+  box-shadow: 0 8px 32px var(--shadow-dropdown);
   overflow-y: auto;
   overscroll-behavior: contain;
 }
@@ -49,10 +49,10 @@
   transition: background 0.1s;
 }
 .custom-select-option:hover {
-  background: var(--bg-hover);
+  background: var(--menu-item-hover);
 }
 .custom-select-option.selected {
-  color: var(--accent);
+  color: var(--menu-item-active-text);
   font-weight: 600;
   background: color-mix(in srgb, var(--accent) 8%, transparent);
 }
@@ -67,7 +67,7 @@
   text-transform: uppercase;
   letter-spacing: 0.08em;
   color: var(--text-muted);
-  border-top: 1px solid var(--border-subtle);
+  border-top: 1px solid var(--menu-divider);
   margin-top: 0.25rem;
 }
 .custom-select-group-label:first-child {
diff --git a/src/styles/components/device-sync.css b/src/styles/components/device-sync.css
index a30265f2..b93c8fe7 100644
--- a/src/styles/components/device-sync.css
+++ b/src/styles/components/device-sync.css
@@ -177,7 +177,7 @@
   overflow: hidden;
   text-overflow: ellipsis;
   padding: 5px 8px;
-  background: var(--bg-input);
+  background: var(--bg-card);
   border: 1px solid var(--border);
   border-radius: var(--radius-sm);
 }
@@ -262,14 +262,14 @@
   font-size: 0.78rem;
   border-radius: var(--radius-sm);
   border: 1px solid var(--border);
-  background: var(--bg-input);
+  background: var(--bg-card);
   color: var(--text-secondary);
   cursor: pointer;
   transition: background var(--transition-fast), color var(--transition-fast), border-color var(--transition-fast);
 }
 
 .device-sync-template-preset-btn:hover {
-  background: var(--ctp-surface0);
+  background: var(--bg-card);
   color: var(--text-primary);
 }
 
@@ -331,7 +331,7 @@
   font-family: monospace;
   border-radius: var(--radius-sm);
   border: 1px solid var(--border);
-  background: var(--ctp-surface0);
+  background: var(--bg-card);
   color: var(--text-secondary);
   cursor: pointer;
   transition: background var(--transition-fast), color var(--transition-fast), border-color var(--transition-fast);
@@ -339,7 +339,7 @@
 }
 
 .device-sync-template-token:hover {
-  background: color-mix(in srgb, var(--accent) 15%, var(--ctp-surface0));
+  background: color-mix(in srgb, var(--accent) 15%, var(--bg-card));
   border-color: var(--accent);
   color: var(--accent);
 }
@@ -531,8 +531,8 @@
 }
 
 .device-sync-badge.synced {
-  background: color-mix(in srgb, var(--success, #4ade80) 15%, transparent);
-  color: var(--success, #4ade80);
+  background: color-mix(in srgb, var(--positive, #4ade80) 15%, transparent);
+  color: var(--positive, #4ade80);
 }
 
 .device-sync-badge.pending {
@@ -573,7 +573,7 @@
   flex-shrink: 0;
 }
 
-.device-sync-status-icon.synced { color: var(--success, #4ade80); }
+.device-sync-status-icon.synced { color: var(--positive, #4ade80); }
 .device-sync-status-icon.pending { color: var(--warning, #f59e0b); }
 .device-sync-status-icon.deletion { color: var(--danger, #f38ba8); }
 
@@ -659,12 +659,12 @@
   flex-direction: row;
   align-items: center;
   justify-content: space-between;
-  background: color-mix(in srgb, var(--success, #4ade80) 4%, transparent);
+  background: color-mix(in srgb, var(--positive, #4ade80) 4%, transparent);
 }
 
 .device-sync-bg-progress-bar-wrap {
   height: 3px;
-  background: var(--bg-input);
+  background: var(--bg-card);
   border-radius: 2px;
   overflow: hidden;
 }
@@ -685,7 +685,7 @@
 }
 
 .device-sync-stat-error { color: var(--danger); display: flex; align-items: center; gap: 3px; }
-.color-success { color: var(--success, #4ade80); }
+.color-success { color: var(--positive, #4ade80); }
 
 /* ── Browser panel ── */
 
diff --git a/src/styles/components/download-folder-modal.css b/src/styles/components/download-folder-modal.css
index 7f4dc8e0..c963667c 100644
--- a/src/styles/components/download-folder-modal.css
+++ b/src/styles/components/download-folder-modal.css
@@ -6,7 +6,7 @@
   padding: 10px 14px;
   border: 1px solid var(--border);
   border-radius: 8px;
-  background: var(--bg-input, var(--bg-sidebar));
+  background: var(--bg-card, var(--bg-sidebar));
   margin-bottom: 12px;
 }
 
diff --git a/src/styles/components/filter-quick-clear.css b/src/styles/components/filter-quick-clear.css
index 36c8a44b..24b45ef5 100644
--- a/src/styles/components/filter-quick-clear.css
+++ b/src/styles/components/filter-quick-clear.css
@@ -17,5 +17,5 @@
 }
 
 .filter-quick-clear--on-active-chip:hover {
-  background: color-mix(in srgb, var(--ctp-crust) 22%, transparent);
+  background: color-mix(in srgb, var(--bg-deep) 22%, transparent);
 }
diff --git a/src/styles/components/genre-filter-bar.css b/src/styles/components/genre-filter-bar.css
index 7bdb1e80..5cf993a5 100644
--- a/src/styles/components/genre-filter-bar.css
+++ b/src/styles/components/genre-filter-bar.css
@@ -9,7 +9,7 @@
   margin-left: 0.35rem;
   border-radius: 9px;
   background: var(--accent);
-  color: var(--ctp-crust);
+  color: var(--text-on-accent);
   font-size: 0.7rem;
   font-weight: 700;
   line-height: 1;
@@ -99,7 +99,7 @@
   align-items: center;
   justify-content: center;
   flex-shrink: 0;
-  color: var(--ctp-crust);
+  color: var(--text-on-accent);
   background: transparent;
 }
 
diff --git a/src/styles/components/help-page.css b/src/styles/components/help-page.css
index 4dc44d65..f9f4d802 100644
--- a/src/styles/components/help-page.css
+++ b/src/styles/components/help-page.css
@@ -15,8 +15,8 @@
   align-items: center;
   gap: 8px;
   padding: 6px 10px;
-  background: var(--ctp-base);
-  border: 1px solid var(--ctp-overlay0);
+  background: var(--bg-app);
+  border: 1px solid var(--border);
   border-radius: var(--radius-md);
   width: 280px;
   max-width: 100%;
diff --git a/src/styles/components/hero.css b/src/styles/components/hero.css
index 67d4d9f9..99a7ba03 100644
--- a/src/styles/components/hero.css
+++ b/src/styles/components/hero.css
@@ -10,7 +10,7 @@
 .hero-placeholder {
   width: 100%;
   height: 360px;
-  background: linear-gradient(135deg, var(--ctp-surface0), var(--ctp-mantle));
+  background: linear-gradient(135deg, var(--bg-card), var(--bg-sidebar));
   flex-shrink: 0;
 }
 
@@ -164,7 +164,7 @@
   gap: var(--space-2);
   padding: var(--space-3) var(--space-5);
   background: var(--accent);
-  color: var(--ctp-crust);
+  color: var(--text-on-accent);
   border-radius: var(--radius-sm);
   font-size: 14px;
   font-weight: 600;
diff --git a/src/styles/components/index.css b/src/styles/components/index.css
index 21df39b6..73fdead6 100644
--- a/src/styles/components/index.css
+++ b/src/styles/components/index.css
@@ -89,3 +89,4 @@
 @import './_banner.css';
 @import './np-dash.css';
 @import './orbit-session-top-strip.css';
+@import './back-to-top.css';
diff --git a/src/styles/components/live-search.css b/src/styles/components/live-search.css
index 127a9edf..4ad70138 100644
--- a/src/styles/components/live-search.css
+++ b/src/styles/components/live-search.css
@@ -93,8 +93,8 @@
   align-items: center;
   flex: 1;
   min-width: 0;
-  background: var(--ctp-base);
-  border: 1px solid var(--ctp-overlay0);
+  background: var(--bg-app);
+  border: 1px solid var(--border);
   border-radius: var(--radius-md);
   transition: border-color var(--transition-fast), box-shadow var(--transition-fast), background var(--transition-fast);
 }
@@ -190,7 +190,7 @@
   top: calc(100% + 8px);
   left: 0;
   right: 0;
-  background: var(--ctp-surface0);
+  background: var(--bg-card);
   border: 1px solid var(--border);
   border-radius: var(--radius-lg);
   box-shadow: var(--shadow-lg);
diff --git a/src/styles/components/login-page.css b/src/styles/components/login-page.css
index c89e949e..fdf51488 100644
--- a/src/styles/components/login-page.css
+++ b/src/styles/components/login-page.css
@@ -20,7 +20,7 @@
 .login-card {
   width: 100%;
   max-width: 520px;
-  background: var(--ctp-mantle);
+  background: var(--bg-sidebar);
   border: 1px solid var(--border-subtle);
   border-radius: var(--radius-xl);
   padding: var(--space-8);
@@ -67,7 +67,7 @@
   font-family: var(--font-display);
   font-size: 28px;
   font-weight: 800;
-  background: linear-gradient(135deg, var(--ctp-mauve), var(--ctp-blue));
+  background: linear-gradient(135deg, var(--accent), var(--accent-2));
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
   background-clip: text;
diff --git a/src/styles/components/mini-player-window.css b/src/styles/components/mini-player-window.css
index b082d4fc..59f2e402 100644
--- a/src/styles/components/mini-player-window.css
+++ b/src/styles/components/mini-player-window.css
@@ -79,7 +79,7 @@
 }
 .mini-player__titlebar-btn--close:hover {
   background: var(--danger);
-  color: var(--ctp-base);
+  color: var(--bg-app);
 }
 
 .mini-player {
@@ -213,7 +213,7 @@
   position: relative;
   width: 5px;
   height: 110px;
-  background: var(--ctp-surface1);
+  background: var(--bg-hover);
   border-radius: 3px;
   overflow: hidden;
   cursor: pointer;
@@ -271,7 +271,7 @@
   width: 36px;
   height: 36px;
   background: var(--accent);
-  color: var(--ctp-crust);
+  color: var(--text-on-accent);
 }
 .mini-player__btn--primary:hover {
   background: var(--accent);
@@ -293,7 +293,7 @@
   flex: 1;
   height: 3px;
   border-radius: 2px;
-  background: var(--ctp-surface1);
+  background: var(--bg-hover);
   overflow: hidden;
 }
 .mini-player__progress-fill {
@@ -416,11 +416,11 @@
   cursor: default;
 }
 .mini-player__tool--active {
-  color: var(--ctp-base);
+  color: var(--bg-app);
   background: var(--accent);
 }
 .mini-player__tool--active:hover:not(:disabled) {
-  color: var(--ctp-base);
+  color: var(--bg-app);
   background: var(--accent);
 }
 
@@ -553,7 +553,7 @@ html[data-perf-disable-home-artwork-clip="true"] .home-lite-artwork .song-card-c
 .np-info-section {
   display: block;
   padding: 18px 0;
-  border-bottom: 1px solid color-mix(in srgb, var(--border-subtle, var(--ctp-surface0)) 70%, transparent);
+  border-bottom: 1px solid color-mix(in srgb, var(--border-subtle, var(--bg-card)) 70%, transparent);
 }
 .np-info-section > * + * { margin-top: 12px; }
 .np-info-section:last-child {
@@ -819,7 +819,7 @@ html[data-perf-disable-home-artwork-clip="true"] .home-lite-artwork .song-card-c
   background: var(--accent);
   border: none;
   border-radius: 999px;
-  color: var(--ctp-base, #1e1e2e);
+  color: var(--bg-app, #1e1e2e);
   font-size: 12.5px;
   font-weight: 600;
   cursor: pointer;
diff --git a/src/styles/components/modal.css b/src/styles/components/modal.css
index 357e98fd..d6c5ca23 100644
--- a/src/styles/components/modal.css
+++ b/src/styles/components/modal.css
@@ -2,7 +2,7 @@
 .modal-overlay {
   position: fixed;
   inset: 0;
-  background: rgba(17, 17, 27, 0.85);
+  background: var(--modal-scrim);
   backdrop-filter: blur(8px);
   display: flex;
   align-items: flex-start;
@@ -21,7 +21,7 @@
 }
 
 .modal-content {
-  background: var(--ctp-surface0);
+  background: var(--modal-bg);
   border: 1px solid var(--border);
   border-radius: var(--radius-xl);
   padding: var(--space-8);
@@ -99,7 +99,7 @@
   margin: 12px 0 10px;
   padding: 4px;
   border-radius: 12px;
-  background: color-mix(in srgb, var(--bg-card, var(--ctp-base)) 88%, transparent);
+  background: color-mix(in srgb, var(--bg-card, var(--bg-app)) 88%, transparent);
   border: 1px solid color-mix(in srgb, var(--text-muted) 18%, transparent);
 }
 
@@ -122,12 +122,12 @@
 
 .sidebar-perf-modal__tab:hover {
   color: var(--text-primary);
-  background: color-mix(in srgb, var(--bg-hover, var(--ctp-surface1)) 70%, transparent);
+  background: color-mix(in srgb, var(--bg-hover, var(--bg-hover)) 70%, transparent);
 }
 
 .sidebar-perf-modal__tab--active {
   color: var(--text-primary);
-  background: color-mix(in srgb, var(--accent) 16%, var(--bg-card, var(--ctp-base)));
+  background: color-mix(in srgb, var(--accent) 16%, var(--bg-card, var(--bg-app)));
   box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 28%, transparent);
 }
 
@@ -287,7 +287,7 @@
   padding: 10px 12px;
   border-radius: 10px;
   border: 1px solid color-mix(in srgb, var(--text-muted) 18%, transparent);
-  background: color-mix(in srgb, var(--bg-card, var(--ctp-base)) 82%, transparent);
+  background: color-mix(in srgb, var(--bg-card, var(--bg-app)) 82%, transparent);
 }
 
 .perf-live-poll__title {
@@ -365,7 +365,7 @@
   margin-bottom: 10px;
   border: 1px solid color-mix(in srgb, var(--text-muted) 18%, transparent);
   border-radius: 12px;
-  background: color-mix(in srgb, var(--bg-card, var(--ctp-base)) 82%, transparent);
+  background: color-mix(in srgb, var(--bg-card, var(--bg-app)) 82%, transparent);
   overflow: hidden;
 }
 
@@ -417,7 +417,7 @@
   padding: 10px 10px 9px;
   border-radius: 10px;
   border: 1px solid color-mix(in srgb, var(--text-muted) 14%, transparent);
-  background: color-mix(in srgb, var(--ctp-mantle, var(--ctp-base)) 72%, transparent);
+  background: color-mix(in srgb, var(--bg-sidebar, var(--bg-app)) 72%, transparent);
   min-height: 84px;
   display: flex;
   flex-direction: column;
@@ -540,7 +540,7 @@
 .perf-tree-group {
   border: 1px solid color-mix(in srgb, var(--text-muted) 16%, transparent);
   border-radius: 10px;
-  background: color-mix(in srgb, var(--bg-card, var(--ctp-base)) 78%, transparent);
+  background: color-mix(in srgb, var(--bg-card, var(--bg-app)) 78%, transparent);
   overflow: hidden;
 }
 
@@ -634,7 +634,7 @@
   padding: 10px 12px;
   border-radius: 10px;
   border: 1px solid color-mix(in srgb, var(--text-muted) 18%, transparent);
-  background: color-mix(in srgb, var(--bg-card, var(--ctp-base)) 82%, transparent);
+  background: color-mix(in srgb, var(--bg-card, var(--bg-app)) 82%, transparent);
 }
 
 .perf-overlay-mode__title {
@@ -656,7 +656,7 @@
   padding: 6px 8px;
   border-radius: 8px;
   border: 1px solid color-mix(in srgb, var(--text-muted) 22%, transparent);
-  background: color-mix(in srgb, var(--bg-card, var(--ctp-base)) 70%, transparent);
+  background: color-mix(in srgb, var(--bg-card, var(--bg-app)) 70%, transparent);
   color: var(--text-muted);
   font-size: 11px;
   line-height: 1.2;
@@ -670,7 +670,7 @@
 
 .perf-overlay-mode__segment--active {
   border-color: color-mix(in srgb, var(--accent) 55%, transparent);
-  background: color-mix(in srgb, var(--accent) 14%, var(--bg-card, var(--ctp-base)));
+  background: color-mix(in srgb, var(--accent) 14%, var(--bg-card, var(--bg-app)));
   color: var(--text-primary);
   box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 24%, transparent);
 }
@@ -687,7 +687,7 @@
   padding: 10px 12px;
   border-radius: 12px;
   border: 1px solid color-mix(in srgb, var(--text-muted) 18%, transparent);
-  background: color-mix(in srgb, var(--bg-card, var(--ctp-base)) 82%, transparent);
+  background: color-mix(in srgb, var(--bg-card, var(--bg-app)) 82%, transparent);
 }
 
 .perf-overlay-appearance__title {
@@ -734,7 +734,7 @@
   height: 36px;
   border-radius: 8px;
   border: 1px solid color-mix(in srgb, var(--text-muted) 22%, transparent);
-  background: color-mix(in srgb, var(--ctp-mantle, var(--ctp-base)) 70%, transparent);
+  background: color-mix(in srgb, var(--bg-sidebar, var(--bg-app)) 70%, transparent);
   cursor: pointer;
   padding: 0;
 }
@@ -815,14 +815,14 @@
   border: 1px solid color-mix(in srgb, var(--text-muted) 22%, transparent);
   border-radius: 10px;
   padding: 8px 10px 10px;
-  background: color-mix(in srgb, var(--bg-card, var(--ctp-base)) 78%, transparent);
+  background: color-mix(in srgb, var(--bg-card, var(--bg-app)) 78%, transparent);
 }
 
 .sidebar-perf-modal__phase--nested {
   margin-left: 10px;
   margin-right: 2px;
   padding-top: 6px;
-  background: color-mix(in srgb, var(--bg-card, var(--ctp-base)) 68%, transparent);
+  background: color-mix(in srgb, var(--bg-card, var(--bg-app)) 68%, transparent);
 }
 
 .sidebar-perf-modal__phase-title {
@@ -843,7 +843,7 @@
   padding: 10px 12px;
   border: 1px solid color-mix(in srgb, var(--text-muted) 22%, transparent);
   border-radius: 10px;
-  background: color-mix(in srgb, var(--bg-card, var(--ctp-base)) 80%, transparent);
+  background: color-mix(in srgb, var(--bg-card, var(--bg-app)) 80%, transparent);
 }
 
 .sidebar-perf-modal__cpu-title {
diff --git a/src/styles/components/most-played-page.css b/src/styles/components/most-played-page.css
index 20628e38..d7c21c9d 100644
--- a/src/styles/components/most-played-page.css
+++ b/src/styles/components/most-played-page.css
@@ -119,7 +119,7 @@
 }
 
 .mp-artist-avatar--placeholder {
-  background: var(--bg-surface);
+  background: var(--card-placeholder-bg);
 }
 
 .mp-artist-info {
@@ -226,7 +226,7 @@
 }
 
 .mp-album-cover--placeholder {
-  background: var(--bg-surface);
+  background: var(--card-placeholder-bg);
 }
 
 .mp-album-meta {
diff --git a/src/styles/components/now-playing-page-2.css b/src/styles/components/now-playing-page-2.css
index 550afd0d..4f75ad00 100644
--- a/src/styles/components/now-playing-page-2.css
+++ b/src/styles/components/now-playing-page-2.css
@@ -8,7 +8,7 @@
   container-type: inline-size;
   background:
     radial-gradient(ellipse at 20% 0%, color-mix(in srgb, var(--accent) 10%, var(--bg-main)) 0%, transparent 60%),
-    radial-gradient(ellipse at 80% 100%, color-mix(in srgb, var(--ctp-blue) 8%, var(--bg-main)) 0%, transparent 60%),
+    radial-gradient(ellipse at 80% 100%, color-mix(in srgb, var(--accent-2) 8%, var(--bg-main)) 0%, transparent 60%),
     var(--bg-main);
 }
 
@@ -209,7 +209,7 @@
   max-height: 300px;
   overscroll-behavior: contain;
   scrollbar-width: thin;
-  scrollbar-color: var(--ctp-teal) transparent;
+  scrollbar-color: var(--accent-2) transparent;
 }
 
 .np-bio-text.expanded::-webkit-scrollbar {
@@ -221,7 +221,7 @@
 }
 
 .np-bio-text.expanded::-webkit-scrollbar-thumb {
-  background: var(--ctp-teal);
+  background: var(--accent-2);
   border-radius: 2px;
 }
 
diff --git a/src/styles/components/np-dash.css b/src/styles/components/np-dash.css
index dc283779..5e969d55 100644
--- a/src/styles/components/np-dash.css
+++ b/src/styles/components/np-dash.css
@@ -73,8 +73,8 @@
 }
 
 .np-badge-hires {
-  background: color-mix(in srgb, var(--ctp-yellow) 30%, transparent);
-  color: var(--ctp-yellow);
+  background: color-mix(in srgb, var(--highlight) 30%, transparent);
+  color: var(--highlight);
   font-weight: 700;
   letter-spacing: 0.05em;
 }
@@ -200,7 +200,7 @@
 }
 .np-dash-toolbar-badge {
   background: var(--accent);
-  color: var(--ctp-base, #1e1e2e);
+  color: var(--bg-app, #1e1e2e);
   font-size: 10px;
   font-weight: 700;
   padding: 1px 6px;
@@ -214,7 +214,7 @@
   top: calc(100% + 4px);
   right: 0;
   min-width: 220px;
-  background: var(--ctp-base, #1e1e2e);
+  background: var(--bg-app, #1e1e2e);
   border: 1px solid rgba(255, 255, 255, 0.10);
   border-radius: var(--radius-md);
   padding: 6px;
diff --git a/src/styles/components/offline-library.css b/src/styles/components/offline-library.css
index 5e981922..7cc86083 100644
--- a/src/styles/components/offline-library.css
+++ b/src/styles/components/offline-library.css
@@ -190,7 +190,7 @@
 }
 
 .offline-library-delete:hover {
-  color: var(--color-error, #e05050);
+  color: var(--danger);
 }
 
 .offline-library-delete--spacer {
@@ -226,7 +226,7 @@
 
 .offline-filter-tab.active {
   background: var(--accent);
-  color: var(--ctp-base);
+  color: var(--bg-app);
   border-color: var(--accent);
   font-weight: 600;
 }
diff --git a/src/styles/components/orbit-session-top-strip.css b/src/styles/components/orbit-session-top-strip.css
index 3a07f5d5..33fbcfc4 100644
--- a/src/styles/components/orbit-session-top-strip.css
+++ b/src/styles/components/orbit-session-top-strip.css
@@ -187,8 +187,8 @@
   transition: color 150ms ease, background 150ms ease, transform 180ms ease;
 }
 .orbit-bar__exit:hover {
-  color: var(--ctp-red, #f38ba8);
-  background: color-mix(in srgb, var(--ctp-red, #f38ba8) 12%, transparent);
+  color: var(--danger, #f38ba8);
+  background: color-mix(in srgb, var(--danger, #f38ba8) 12%, transparent);
   transform: rotate(90deg);
 }
 
@@ -217,7 +217,7 @@
   min-width: 280px;
   max-width: 380px;
   padding: 6px;
-  background: var(--ctp-base, #1e1e2e);
+  background: var(--bg-app, #1e1e2e);
   border: 1px solid color-mix(in srgb, var(--accent) 22%, rgba(255,255,255,0.1));
   border-radius: var(--radius-md);
   box-shadow: 0 10px 30px rgba(0,0,0,0.5);
@@ -228,7 +228,7 @@
   min-width: 320px;
   max-width: 380px;
   padding: 12px 14px 14px;
-  background: var(--ctp-base, #1e1e2e);
+  background: var(--bg-app, #1e1e2e);
   border: 1px solid color-mix(in srgb, var(--accent) 22%, rgba(255,255,255,0.1));
   border-radius: var(--radius-md);
   box-shadow: 0 10px 30px rgba(0,0,0,0.5);
@@ -356,19 +356,19 @@
   transition: color 140ms ease, background 140ms ease, border-color 140ms ease;
 }
 .orbit-participants-pop__kick:hover {
-  color: var(--ctp-yellow, #f9e2af);
-  background: color-mix(in srgb, var(--ctp-yellow, #f9e2af) 12%, transparent);
-  border-color: color-mix(in srgb, var(--ctp-yellow, #f9e2af) 35%, transparent);
+  color: var(--highlight, #f9e2af);
+  background: color-mix(in srgb, var(--highlight, #f9e2af) 12%, transparent);
+  border-color: color-mix(in srgb, var(--highlight, #f9e2af) 35%, transparent);
 }
 .orbit-participants-pop__kick--ban:hover {
-  color: var(--ctp-red, #f38ba8);
-  background: color-mix(in srgb, var(--ctp-red, #f38ba8) 12%, transparent);
-  border-color: color-mix(in srgb, var(--ctp-red, #f38ba8) 35%, transparent);
+  color: var(--danger, #f38ba8);
+  background: color-mix(in srgb, var(--danger, #f38ba8) 12%, transparent);
+  border-color: color-mix(in srgb, var(--danger, #f38ba8) 35%, transparent);
 }
 .orbit-participants-pop__kick.is-active {
-  color: var(--ctp-peach, #fab387);
-  background: color-mix(in srgb, var(--ctp-peach, #fab387) 16%, transparent);
-  border-color: color-mix(in srgb, var(--ctp-peach, #fab387) 45%, transparent);
+  color: var(--accent-2, #fab387);
+  background: color-mix(in srgb, var(--accent-2, #fab387) 16%, transparent);
+  border-color: color-mix(in srgb, var(--accent-2, #fab387) 45%, transparent);
 }
 
 /* ── Exit modal ────────────────────────────────────────────────────── */
@@ -405,7 +405,7 @@
 /* ── Topbar "start Orbit" trigger — same form as Live, accent-tinted ── */
 .orbit-start-trigger {
   color: var(--accent);
-  border-color: color-mix(in srgb, var(--accent) 45%, var(--ctp-surface1));
+  border-color: color-mix(in srgb, var(--accent) 45%, var(--bg-hover));
   transition: color 150ms ease, border-color 150ms ease, background 150ms ease, box-shadow 200ms ease;
 }
 .orbit-start-trigger__spin { transition: transform 260ms ease; }
@@ -520,15 +520,15 @@
   gap: 4px;
   margin-top: 10px;
   padding: 10px 12px;
-  background: color-mix(in srgb, var(--ctp-yellow, #f9e2af) 14%, transparent);
-  border: 1px solid color-mix(in srgb, var(--ctp-yellow, #f9e2af) 40%, transparent);
+  background: color-mix(in srgb, var(--highlight, #f9e2af) 14%, transparent);
+  border: 1px solid color-mix(in srgb, var(--highlight, #f9e2af) 40%, transparent);
   border-radius: var(--radius-sm);
   font-size: 12px;
   line-height: 1.5;
   color: var(--text-primary);
 }
 .orbit-help-modal__warn strong {
-  color: var(--ctp-yellow, #f9e2af);
+  color: var(--highlight, #f9e2af);
   font-weight: 700;
 }
 
@@ -696,15 +696,15 @@
   font-weight: 600;
 }
 .orbit-start-modal__tip--warn {
-  background: color-mix(in srgb, var(--ctp-yellow, #f9e2af) 14%, transparent);
-  border-color: color-mix(in srgb, var(--ctp-yellow, #f9e2af) 45%, transparent);
+  background: color-mix(in srgb, var(--highlight, #f9e2af) 14%, transparent);
+  border-color: color-mix(in srgb, var(--highlight, #f9e2af) 45%, transparent);
   color: var(--text-primary);
 }
 .orbit-start-modal__tip--warn svg {
-  color: var(--ctp-yellow, #f9e2af);
+  color: var(--highlight, #f9e2af);
 }
 .orbit-start-modal__tip--warn strong {
-  color: var(--ctp-yellow, #f9e2af);
+  color: var(--highlight, #f9e2af);
 }
 
 .orbit-start-modal__field {
@@ -810,7 +810,7 @@
   flex: 1;
   min-width: 0;
   padding: 9px 12px;
-  background: var(--ctp-base);
+  background: var(--bg-app);
   border: 1px solid var(--border);
   border-radius: var(--radius-sm);
   color: var(--text-primary);
@@ -848,7 +848,7 @@
   min-width: 320px;
   max-width: 380px;
   padding: 14px;
-  background: var(--ctp-base, #1e1e2e);
+  background: var(--bg-app, #1e1e2e);
   border: 1px solid color-mix(in srgb, var(--accent) 22%, rgba(255,255,255,0.1));
   border-radius: var(--radius-md);
   box-shadow: 0 10px 30px rgba(0,0,0,0.5);
@@ -919,7 +919,7 @@
   gap: 4px;
   padding: 3px 8px;
   font-size: 11px;
-  background: var(--bg-input);
+  background: var(--bg-card);
   border: 1px solid var(--border-subtle);
   border-radius: var(--radius-sm);
   color: var(--text-primary);
@@ -927,7 +927,7 @@
   transition: background 120ms ease, border-color 120ms ease;
 }
 .orbit-diag-pop__btn:hover {
-  background: var(--bg-hover, var(--bg-input));
+  background: var(--bg-hover, var(--bg-card));
   border-color: var(--accent);
 }
 .orbit-diag-pop__log {
@@ -937,7 +937,7 @@
   font-family: var(--font-mono, ui-monospace, monospace);
   font-size: 10.5px;
   line-height: 1.45;
-  background: var(--bg-input);
+  background: var(--bg-card);
   color: var(--text-secondary);
   border: 1px solid var(--border-subtle);
   border-radius: var(--radius-sm);
@@ -1121,20 +1121,20 @@
   border-style: solid;
 }
 .orbit-queue-head__presence--online {
-  color: var(--ctp-green, #a6e3a1);
-  background: color-mix(in srgb, var(--ctp-green, #a6e3a1) 14%, transparent);
-  border-color: color-mix(in srgb, var(--ctp-green, #a6e3a1) 40%, transparent);
+  color: var(--positive, #a6e3a1);
+  background: color-mix(in srgb, var(--positive, #a6e3a1) 14%, transparent);
+  border-color: color-mix(in srgb, var(--positive, #a6e3a1) 40%, transparent);
 }
 .orbit-queue-head__presence--online svg {
-  color: var(--ctp-green, #a6e3a1);
+  color: var(--positive, #a6e3a1);
 }
 .orbit-queue-head__presence--away {
-  color: var(--ctp-yellow, #f9e2af);
-  background: color-mix(in srgb, var(--ctp-yellow, #f9e2af) 14%, transparent);
-  border-color: color-mix(in srgb, var(--ctp-yellow, #f9e2af) 40%, transparent);
+  color: var(--highlight, #f9e2af);
+  background: color-mix(in srgb, var(--highlight, #f9e2af) 14%, transparent);
+  border-color: color-mix(in srgb, var(--highlight, #f9e2af) 40%, transparent);
 }
 .orbit-queue-head__presence--away svg {
-  color: var(--ctp-yellow, #f9e2af);
+  color: var(--highlight, #f9e2af);
 }
 .orbit-queue-head__meta {
   display: flex;
@@ -1173,7 +1173,7 @@
   font-weight: 700;
   letter-spacing: 0.08em;
   text-transform: uppercase;
-  color: var(--ctp-crust, #11111b);
+  color: var(--text-on-accent, #11111b);
   background: var(--accent);
   border-radius: var(--radius-sm);
 }
@@ -1384,9 +1384,9 @@
   transition: background 120ms ease, border-color 120ms ease, color 120ms ease;
 }
 .host-approval__btn--approve:hover {
-  background: color-mix(in srgb, var(--ctp-green, #a6e3a1) 28%, transparent);
-  border-color: var(--ctp-green, #a6e3a1);
-  color: var(--ctp-green, #a6e3a1);
+  background: color-mix(in srgb, var(--positive, #a6e3a1) 28%, transparent);
+  border-color: var(--positive, #a6e3a1);
+  color: var(--positive, #a6e3a1);
 }
 .host-approval__btn--decline:hover {
   background: color-mix(in srgb, var(--danger, #f38ba8) 28%, transparent);
@@ -1404,10 +1404,10 @@
   padding-bottom: 6px;
 }
 .orbit-guest-queue__section-head--pending {
-  color: var(--ctp-yellow, #f9e2af);
+  color: var(--highlight, #f9e2af);
 }
 .orbit-guest-queue__section-head--pending svg {
-  color: var(--ctp-yellow, #f9e2af);
+  color: var(--highlight, #f9e2af);
 }
 .orbit-guest-queue__item--pending {
   opacity: 0.85;
@@ -1456,9 +1456,9 @@
   padding: 8px 10px;
   font-size: 12px;
   border-radius: var(--radius-sm);
-  background: color-mix(in srgb, var(--ctp-red, #f38ba8) 14%, transparent);
-  border: 1px solid color-mix(in srgb, var(--ctp-red, #f38ba8) 35%, transparent);
-  color: var(--ctp-red, #f38ba8);
+  background: color-mix(in srgb, var(--danger, #f38ba8) 14%, transparent);
+  border: 1px solid color-mix(in srgb, var(--danger, #f38ba8) 35%, transparent);
+  color: var(--danger, #f38ba8);
 }
 
 .orbit-start-modal__actions {
@@ -1474,7 +1474,7 @@
   gap: 8px;
   margin-bottom: 18px;
   padding: 10px 12px;
-  background: var(--ctp-base);
+  background: var(--bg-app);
   border: 1px solid var(--border);
   border-radius: var(--radius-sm);
   font-family: var(--font-mono, ui-monospace, 'Courier New', monospace);
@@ -1522,7 +1522,7 @@
   --fps-overlay-opacity: 0.82;
   background: color-mix(
     in srgb,
-    var(--ctp-crust, #111) calc(var(--fps-overlay-opacity) * 100%),
+    var(--text-on-accent, #111) calc(var(--fps-overlay-opacity) * 100%),
     transparent
   );
   border: 1px solid color-mix(
@@ -1743,7 +1743,7 @@
   height: 160px;
   border-radius: 6px;
   overflow: hidden;
-  background: var(--bg-input, rgba(0, 0, 0, 0.15));
+  background: var(--bg-card, rgba(0, 0, 0, 0.15));
 }
 .because-card-cover {
   width: 100%;
@@ -1768,7 +1768,7 @@
 .because-card--skeleton .because-card-cover-placeholder {
   width: 100%;
   height: 100%;
-  background: color-mix(in srgb, var(--text-primary) 14%, var(--bg-input, rgba(0, 0, 0, 0.15)));
+  background: color-mix(in srgb, var(--text-primary) 14%, var(--bg-card, rgba(0, 0, 0, 0.15)));
   animation: because-cover-pulse 1.1s ease-in-out infinite;
 }
 .because-card-skeleton-line {
diff --git a/src/styles/components/playback-delay-sleep-delayed-start-modal.css b/src/styles/components/playback-delay-sleep-delayed-start-modal.css
index e307f337..3e5b63bb 100644
--- a/src/styles/components/playback-delay-sleep-delayed-start-modal.css
+++ b/src/styles/components/playback-delay-sleep-delayed-start-modal.css
@@ -68,9 +68,9 @@
   transform: rotate(90deg) scale(0.94);
 }
 
-.playback-delay-modal--pause { --pd-accent: var(--ctp-lavender, #b4befe); }
-.playback-delay-modal--start { --pd-accent: var(--ctp-peach, #fab387); }
-.playback-delay-modal--idle  { --pd-accent: var(--ctp-overlay1, #7f849c); }
+.playback-delay-modal--pause { --pd-accent: var(--accent-2, #b4befe); }
+.playback-delay-modal--start { --pd-accent: var(--accent-2, #fab387); }
+.playback-delay-modal--idle  { --pd-accent: var(--border-subtle, #7f849c); }
 
 .playback-delay-modal__head {
   display: flex;
@@ -127,7 +127,7 @@
   font-weight: 700;
   letter-spacing: 0.08em;
   text-transform: uppercase;
-  color: var(--ctp-crust);
+  color: var(--text-on-accent);
   background: var(--accent);
   padding: 1px 6px;
   border-radius: 4px;
@@ -165,7 +165,7 @@
 
 .player-btn-preview-ring-track {
   fill: none;
-  stroke: var(--ctp-overlay0);
+  stroke: var(--border);
   stroke-width: 4;
 }
 
@@ -279,7 +279,7 @@
    button carries the mode distinction, so the ring stays consistent with
    the rest of the app. */
 .playback-schedule-ring__grad-a { stop-color: var(--accent); }
-.playback-schedule-ring__grad-b { stop-color: var(--ctp-lavender, #b4befe); }
+.playback-schedule-ring__grad-b { stop-color: var(--accent-2, #b4befe); }
 
 /* Replaces the Play/Pause icon while a schedule timer is armed. Two-line
    stack: mode icon (Moon for sleep, Sunrise for delayed-start) above the
@@ -358,7 +358,7 @@
   border: 1px solid var(--border);
   border-radius: var(--radius-md);
   padding: var(--space-4);
-  background: color-mix(in srgb, var(--ctp-base) 40%, transparent);
+  background: color-mix(in srgb, var(--bg-app) 40%, transparent);
 }
 
 .playback-delay-section--disabled {
@@ -406,7 +406,7 @@
   padding: 7px 12px;
   font-size: 0.82rem;
   font-weight: 500;
-  background: var(--ctp-surface1);
+  background: var(--bg-hover);
   color: var(--text-primary);
   cursor: pointer;
   transition:
@@ -419,7 +419,7 @@
 
 .playback-delay-chip:hover {
   border-color: color-mix(in srgb, var(--pd-accent, var(--accent)) 55%, var(--border));
-  background: color-mix(in srgb, var(--pd-accent, var(--accent)) 14%, var(--ctp-surface1));
+  background: color-mix(in srgb, var(--pd-accent, var(--accent)) 14%, var(--bg-hover));
   color: var(--pd-accent, var(--accent));
   transform: translateY(-1px);
   box-shadow: 0 3px 10px color-mix(in srgb, var(--pd-accent, var(--accent)) 22%, transparent);
@@ -429,7 +429,7 @@
 
 .playback-delay-chip--on {
   border-color: var(--pd-accent, var(--accent));
-  background: color-mix(in srgb, var(--pd-accent, var(--accent)) 22%, var(--ctp-surface1));
+  background: color-mix(in srgb, var(--pd-accent, var(--accent)) 22%, var(--bg-hover));
   color: var(--pd-accent, var(--accent));
 }
 
@@ -462,7 +462,7 @@
   border-radius: var(--radius-sm);
   padding: 8px 10px;
   font-size: 0.9rem;
-  background: var(--ctp-base);
+  background: var(--bg-app);
   color: var(--text-primary);
 }
 
diff --git a/src/styles/components/playlist-edit-modal.css b/src/styles/components/playlist-edit-modal.css
index b8cb703f..dbfab8ba 100644
--- a/src/styles/components/playlist-edit-modal.css
+++ b/src/styles/components/playlist-edit-modal.css
@@ -90,7 +90,7 @@
 }
 
 .playlist-edit-cover-menu-item--danger {
-  color: var(--ctp-red, #f38ba8);
+  color: var(--danger, #f38ba8);
 }
 
 /* Right side fields */
@@ -216,7 +216,7 @@
   padding: 5px 12px;
   border-radius: var(--radius-sm);
   background: var(--bg-card);
-  border: 1px solid var(--ctp-surface1);
+  border: 1px solid var(--bg-hover);
   color: var(--text-secondary);
   font-size: 12px;
   font-weight: 600;
@@ -227,7 +227,7 @@
 .artist-ext-link:hover {
   background: var(--bg-hover);
   color: var(--text-primary);
-  border-color: var(--ctp-overlay0);
+  border-color: var(--border);
 }
 
 /* Bio section */
diff --git a/src/styles/components/playlist-search-panel.css b/src/styles/components/playlist-search-panel.css
index 93e9aaa9..a2d162e9 100644
--- a/src/styles/components/playlist-search-panel.css
+++ b/src/styles/components/playlist-search-panel.css
@@ -1,6 +1,6 @@
 /* ─ Playlist Search Panel ─ */
 .playlist-search-panel {
-  background: var(--surface-2);
+  background: var(--bg-elevated, var(--bg-card));
   border: 1px solid var(--border);
   border-radius: var(--radius-lg);
   padding: var(--space-3) var(--space-3) var(--space-2);
@@ -123,7 +123,7 @@
 
 .playlist-search-add-btn:hover {
   background: var(--accent);
-  color: var(--ctp-base);
+  color: var(--bg-app);
 }
 
 .playlist-suggestions {
diff --git a/src/styles/components/playlists-page.css b/src/styles/components/playlists-page.css
index caa64136..92f11a26 100644
--- a/src/styles/components/playlists-page.css
+++ b/src/styles/components/playlists-page.css
@@ -12,7 +12,7 @@
 }
 
 .playlist-filter-input {
-  background: var(--bg-surface);
+  background: var(--input-bg);
   border: 1px solid var(--border);
   border-radius: var(--radius-md);
   color: var(--text-primary);
@@ -89,7 +89,7 @@
   height: 28px;
   border-radius: 50%;
   background: var(--accent);
-  color: var(--ctp-base);
+  color: var(--bg-app);
   border: none;
   cursor: pointer;
   opacity: 0;
@@ -119,7 +119,7 @@
 
 .playlist-delete-btn {
   opacity: 0;
-  color: var(--ctp-red) !important;
+  color: var(--danger) !important;
   padding: 4px;
   height: auto;
   min-height: unset;
@@ -146,7 +146,7 @@
 }
 
 .fav-remove-btn:hover {
-  color: var(--ctp-red);
+  color: var(--danger);
 }
 
 .track-row:hover .fav-remove-btn,
diff --git a/src/styles/components/radio-card-edit-chip.css b/src/styles/components/radio-card-edit-chip.css
index 71a74c16..20d40470 100644
--- a/src/styles/components/radio-card-edit-chip.css
+++ b/src/styles/components/radio-card-edit-chip.css
@@ -5,7 +5,7 @@
   padding: 2px 8px;
   border-radius: var(--radius-sm);
   background: var(--text-secondary);
-  color: var(--ctp-surface1);
+  color: var(--bg-hover);
   font-size: 10px;
   font-weight: 600;
   letter-spacing: 0.03em;
@@ -14,7 +14,7 @@
 }
 .radio-card-chip:hover {
   background: var(--accent);
-  color: var(--ctp-crust);
+  color: var(--text-on-accent);
 }
 
 /* Radio card: buttons row always pinned to bottom */
diff --git a/src/styles/components/radio-nowplaying-section.css b/src/styles/components/radio-nowplaying-section.css
index 0e4da491..c15c7ae6 100644
--- a/src/styles/components/radio-nowplaying-section.css
+++ b/src/styles/components/radio-nowplaying-section.css
@@ -258,7 +258,7 @@
 }
 
 .np-queue-remove:hover {
-  color: var(--ctp-red);
+  color: var(--danger);
   background: var(--bg-hover);
 }
 
diff --git a/src/styles/components/radio-toolbar.css b/src/styles/components/radio-toolbar.css
index 7f7a73da..b942b684 100644
--- a/src/styles/components/radio-toolbar.css
+++ b/src/styles/components/radio-toolbar.css
@@ -23,13 +23,13 @@
   font-weight: 500;
   background: var(--bg-card);
   color: var(--text-secondary);
-  border: 1px solid var(--ctp-surface1);
+  border: 1px solid var(--bg-hover);
   white-space: nowrap;
   flex-shrink: 0;
   transition: all 0.15s;
 }
 .radio-filter-chip:hover { background: var(--bg-hover); color: var(--text-primary); }
-.radio-filter-chip.active { background: var(--accent); color: var(--ctp-crust); border-color: var(--accent); }
+.radio-filter-chip.active { background: var(--accent); color: var(--text-on-accent); border-color: var(--accent); }
 
 
 .radio-card-drop-before {
diff --git a/src/styles/components/random-landing.css b/src/styles/components/random-landing.css
index 5266e6bf..dd760fda 100644
--- a/src/styles/components/random-landing.css
+++ b/src/styles/components/random-landing.css
@@ -26,7 +26,7 @@
   min-height: clamp(200px, 22vh, 320px);
   padding: var(--space-6);
   border-radius: 16px;
-  background: var(--ctp-surface0);
+  background: var(--bg-card);
   border: 1px solid rgba(255, 255, 255, 0.06);
   cursor: pointer;
   text-align: left;
diff --git a/src/styles/components/settings.css b/src/styles/components/settings.css
index 3842a347..eea37a4e 100644
--- a/src/styles/components/settings.css
+++ b/src/styles/components/settings.css
@@ -460,13 +460,13 @@
   padding: var(--space-3) var(--space-4);
   margin-bottom: var(--space-4);
   border-radius: var(--radius-lg);
-  background: color-mix(in srgb, var(--color-warning, #f59e0b) 12%, transparent);
-  border: 1px solid color-mix(in srgb, var(--color-warning, #f59e0b) 40%, transparent);
+  background: color-mix(in srgb, var(--warning) 12%, transparent);
+  border: 1px solid color-mix(in srgb, var(--warning) 40%, transparent);
   color: var(--text-primary);
 }
 
 .settings-privacy-notice-icon {
-  color: var(--color-warning, #f59e0b);
+  color: var(--warning);
   flex-shrink: 0;
   margin-top: 2px;
 }
diff --git a/src/styles/components/sidebar-customizer.css b/src/styles/components/sidebar-customizer.css
index 3da3cb39..0fddd363 100644
--- a/src/styles/components/sidebar-customizer.css
+++ b/src/styles/components/sidebar-customizer.css
@@ -10,7 +10,7 @@
 }
 
 .sidebar-customizer-row:hover {
-  background: var(--bg-hover);
+  background: var(--sidebar-item-hover);
 }
 
 .sidebar-customizer-row.drag-over {
@@ -245,7 +245,7 @@
 .toggle-track {
   position: absolute;
   inset: 0;
-  background: var(--ctp-surface2);
+  background: var(--bg-elevated);
   border-radius: var(--radius-full);
   transition: background var(--transition-base);
 }
@@ -264,7 +264,7 @@
 }
 
 .toggle-switch:hover .toggle-track {
-  background: var(--ctp-overlay0);
+  background: var(--border);
 }
 
 .toggle-switch input:checked+.toggle-track {
diff --git a/src/styles/components/tracklist.css b/src/styles/components/tracklist.css
index abc93b53..95d252c5 100644
--- a/src/styles/components/tracklist.css
+++ b/src/styles/components/tracklist.css
@@ -24,8 +24,8 @@
   font-weight: 600;
   letter-spacing: 0.06em;
   text-transform: uppercase;
-  color: var(--text-muted);
-  border-bottom: 1px solid var(--border-subtle);
+  color: var(--col-header-text);
+  border-bottom: 1px solid var(--row-divider);
   margin-bottom: var(--space-2);
 }
 
@@ -45,7 +45,7 @@
 .tracklist-total {
   display: grid;
   align-items: center;
-  border-top: 1px solid var(--border-subtle);
+  border-top: 1px solid var(--row-divider);
   padding: var(--space-2) var(--space-3);
   margin-top: var(--space-1);
 }
@@ -53,7 +53,7 @@
 .tracklist-total-label {
   font-size: 12px;
   font-weight: 600;
-  color: var(--text-muted);
+  color: var(--row-text-muted);
   text-transform: uppercase;
   letter-spacing: 0.06em;
   text-align: right;
@@ -62,7 +62,7 @@
 .tracklist-total-value {
   font-size: 13px;
   font-weight: 600;
-  color: var(--text-secondary);
+  color: var(--row-text-secondary);
   font-variant-numeric: tabular-nums;
   text-align: center;
 }
@@ -89,13 +89,13 @@
   bottom: 20%;
   width: 1px;
   border-radius: 1px;
-  background: var(--ctp-surface1);
+  background: var(--bg-hover);
   transition: background 0.15s;
 }
 
 .col-resize-handle:hover::after,
 .col-resize-handle:active::after {
-  background: var(--accent);
+  background: var(--col-resize-active);
 }
 
 /* ── Column visibility picker ── */
@@ -130,7 +130,7 @@
 
 .tracklist-col-picker-btn:hover {
   opacity: 1;
-  background: var(--ctp-surface0);
+  background: var(--bg-card);
   color: var(--text-primary);
 }
 
@@ -138,7 +138,7 @@
   /* Positioned inline (fixed) and portalled to <body> so no ancestor overflow
      can clip it; see TracklistColumnPicker. */
   background: var(--bg-card);
-  border: 1px solid var(--ctp-surface1);
+  border: 1px solid var(--bg-hover);
   border-radius: var(--radius-md);
   padding: 6px;
   min-width: 160px;
@@ -173,7 +173,7 @@
 }
 
 .tracklist-col-picker-item:hover {
-  background: var(--ctp-surface0);
+  background: var(--bg-card);
   color: var(--text-primary);
 }
 
@@ -192,7 +192,7 @@
 
 .tracklist-col-picker-divider {
   height: 1px;
-  background: var(--ctp-surface1);
+  background: var(--bg-hover);
   margin: 4px 0;
 }
 
@@ -213,7 +213,7 @@
 }
 
 .tracklist-col-picker-reset:hover {
-  background: var(--ctp-surface0);
+  background: var(--bg-card);
   color: var(--text-primary);
 }
 
@@ -271,7 +271,7 @@
   border: none;
   border-radius: 50%;
   background: var(--accent);
-  color: var(--ctp-crust);
+  color: var(--text-on-accent);
   cursor: pointer;
   display: inline-flex;
   align-items: center;
@@ -347,7 +347,7 @@
 
 .playlist-suggestion-preview-ring-track {
   fill: none;
-  stroke: var(--ctp-overlay0);
+  stroke: var(--border);
   stroke-width: 1.5;
 }
 
@@ -424,15 +424,15 @@ html[data-track-previews-randommix="off"]   [data-preview-loc="randomMix"]   .pl
 
 .track-row:hover,
 .track-row.context-active {
-  background: var(--bg-hover);
+  background: var(--row-hover);
 }
 
 .track-row.active {
-  background: var(--accent-dim);
+  background: var(--row-playing-bg);
 }
 
 .track-row.active:hover {
-  background: var(--accent-dim);
+  background: var(--row-playing-bg);
 }
 
 .track-row>* {
@@ -465,7 +465,7 @@ html[data-track-previews-randommix="off"]   [data-preview-loc="randomMix"]   .pl
 /* Default: show track number */
 .track-num-number {
   font-size: 13px;
-  color: var(--text-muted);
+  color: var(--row-text-muted);
   font-variant-numeric: tabular-nums;
   text-align: center;
 }
@@ -490,7 +490,7 @@ html[data-track-previews-randommix="off"]   [data-preview-loc="randomMix"]   .pl
 
 /* ── Active (currently playing): hide number, show eq-bars ── */
 .track-num.track-num-active .track-num-number { display: none; }
-.track-num.track-num-active .track-num-number { color: var(--accent); } /* kept for when visible */
+.track-num.track-num-active .track-num-number { color: var(--row-playing-text); } /* kept for when visible */
 
 /* ── Active + hover: hide eq-bars, show play icon ── */
 .track-row:hover .track-num.track-num-active .track-num-eq  { display: none; }
@@ -525,7 +525,7 @@ html[data-track-previews-randommix="off"]   [data-preview-loc="randomMix"]   .pl
  * compositing (NVIDIA proprietary + WEBKIT_DISABLE_COMPOSITING_MODE=1) and
  * pegged the WebProcess at ~80% CPU on AlbumDetail with a long tracklist. */
 .eq-bars {
-  color: var(--accent);
+  color: var(--row-playing-text);
   display: block;
 }
 
@@ -574,7 +574,7 @@ html[data-track-previews-randommix="off"]   [data-preview-loc="randomMix"]   .pl
 .track-title {
   font-size: 13px;
   font-weight: 500;
-  color: var(--text-primary);
+  color: var(--row-text);
   overflow-wrap: break-word;
   word-break: break-word;
 }
@@ -587,7 +587,7 @@ html[data-track-previews-randommix="off"]   [data-preview-loc="randomMix"]   .pl
 
 .track-artist {
   font-size: 12px;
-  color: var(--text-secondary);
+  color: var(--row-text-secondary);
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
@@ -626,7 +626,7 @@ html[data-track-previews-randommix="off"]   [data-preview-loc="randomMix"]   .pl
   justify-content: center;
   align-items: center;
   font-size: 12px;
-  color: var(--text-muted);
+  color: var(--row-text-muted);
   font-variant-numeric: tabular-nums;
 }
 
diff --git a/src/styles/layout/player-bar.css b/src/styles/layout/player-bar.css
index f4c7b45f..018ea2d9 100644
--- a/src/styles/layout/player-bar.css
+++ b/src/styles/layout/player-bar.css
@@ -6,7 +6,7 @@
   gap: var(--space-6);
   padding: 0 var(--space-5);
   background: var(--bg-player);
-  border-top: 1px solid var(--border-subtle);
+  border-top: 1px solid var(--player-border);
   height: var(--player-height);
   position: relative;
   z-index: 100;
@@ -160,12 +160,12 @@ html[data-platform="windows"] .player-bar.floating {
 .player-track-name {
   font-size: 14px;
   font-weight: 600;
-  color: var(--text-primary);
+  color: var(--player-title);
 }
 
 .player-track-artist {
   font-size: 12px;
-  color: var(--text-secondary);
+  color: var(--player-artist);
   margin-top: 2px;
 }
 
@@ -227,14 +227,14 @@ html[data-platform="windows"] .player-bar.floating {
   width: 36px;
   height: 36px;
   border-radius: 50%;
-  color: var(--text-muted);
+  color: var(--player-control);
   transition: all var(--transition-fast);
   flex-shrink: 0;
 }
 
 .player-btn:hover {
-  background: var(--bg-hover);
-  color: var(--text-primary);
+  background: var(--player-control-hover-bg);
+  color: var(--player-control-hover);
   transform: scale(1.12);
 }
 
@@ -246,7 +246,7 @@ html[data-platform="windows"] .player-bar.floating {
 /* Star + Last.fm heart — visually separated from track title */
 .player-star-btn {
   margin: var(--space-1);
-  color: var(--text-muted);
+  color: var(--player-control);
   transition: color var(--transition-fast);
 }
 
@@ -259,7 +259,7 @@ html[data-platform="windows"] .player-bar.floating {
   width: 46px;
   height: 46px;
   background: var(--accent);
-  color: var(--ctp-crust);
+  color: var(--text-on-accent);
   border-radius: 50%;
   box-shadow: 0 4px 18px rgba(0, 0, 0, 0.4);
   flex-shrink: 0;
@@ -267,7 +267,7 @@ html[data-platform="windows"] .player-bar.floating {
 
 .player-btn-primary:hover {
   background: var(--accent);
-  color: var(--ctp-crust);
+  color: var(--text-on-accent);
   transform: scale(1.06);
   box-shadow: 0 6px 24px rgba(0, 0, 0, 0.4), var(--shadow-glow);
   filter: brightness(1.12);
@@ -337,12 +337,12 @@ html[data-platform="windows"] .player-bar.floating {
 }
 
 .player-time-toggle:hover {
-  background-color: var(--surface-hover, rgba(128, 128, 128, 0.2));
+  background-color: var(--player-time-toggle-hover);
   color: var(--text-primary);
 }
 
 .player-time-toggle:active {
-  background-color: var(--surface-active, rgba(128, 128, 128, 0.3));
+  background-color: var(--player-time-toggle-active);
 }
 
 /* Volume section */
@@ -384,7 +384,7 @@ html[data-platform="windows"] .player-bar.floating {
 }
 
 .player-eq-btn {
-  color: var(--text-muted);
+  color: var(--player-control);
   flex-shrink: 0;
   transition: color 0.15s;
 }
@@ -406,7 +406,7 @@ html[data-platform="windows"] .player-bar.floating {
   padding: 10px;
   border-radius: var(--radius-md);
   border: 1px solid var(--border);
-  background: var(--bg-card);
+  background: var(--menu-bg);
   box-shadow: 0 8px 28px rgba(0, 0, 0, 0.35);
   z-index: 240;
   display: flex;
diff --git a/src/styles/layout/queue-panel.css b/src/styles/layout/queue-panel.css
index 541c0305..3e11b87c 100644
--- a/src/styles/layout/queue-panel.css
+++ b/src/styles/layout/queue-panel.css
@@ -160,7 +160,7 @@
   cursor: default;
 }
 .queue-round-btn.active {
-  color: var(--ctp-base);
+  color: var(--bg-app);
   background: var(--accent);
 }
 
@@ -185,7 +185,7 @@
   flex-shrink: 0;
   border-radius: var(--radius-md);
   overflow: hidden;
-  background: var(--bg-surface);
+  background: var(--card-placeholder-bg);
   display: flex;
   align-items: center;
   justify-content: center;
@@ -248,7 +248,7 @@
   font-size: 9px;
   font-family: monospace;
   letter-spacing: 0.05em;
-  background: var(--ctp-surface1);
+  background: var(--bg-hover);
   color: var(--accent);
   padding: 3px var(--space-4);
   white-space: nowrap;
diff --git a/src/styles/layout/scrubber.css b/src/styles/layout/scrubber.css
index 541a6506..ba06a53c 100644
--- a/src/styles/layout/scrubber.css
+++ b/src/styles/layout/scrubber.css
@@ -19,7 +19,7 @@
   right: 0;
   height: 4px;
   border-radius: 2px;
-  background: var(--ctp-surface2, rgba(255,255,255,0.12));
+  background: var(--bg-elevated, rgba(255,255,255,0.12));
 }
 
 .mp-scrubber-fill {
diff --git a/src/styles/layout/sidebar-device-sync-queue.css b/src/styles/layout/sidebar-device-sync-queue.css
index 71c7fda3..326a0e8b 100644
--- a/src/styles/layout/sidebar-device-sync-queue.css
+++ b/src/styles/layout/sidebar-device-sync-queue.css
@@ -1,8 +1,8 @@
 /* ─── Sidebar device-sync queue ─── */
 .sidebar-sync-queue {
-  background: color-mix(in srgb, var(--success, #4ade80) 10%, var(--bg-sidebar));
-  border-color: color-mix(in srgb, var(--success, #4ade80) 25%, transparent);
-  color: var(--success, #4ade80);
+  background: color-mix(in srgb, var(--positive, #4ade80) 10%, var(--bg-sidebar));
+  border-color: color-mix(in srgb, var(--positive, #4ade80) 25%, transparent);
+  color: var(--positive, #4ade80);
 }
 
 @keyframes spin-slow {
diff --git a/src/styles/layout/sidebar-expandable-playlists-section.css b/src/styles/layout/sidebar-expandable-playlists-section.css
index f67a2aa2..043f3b21 100644
--- a/src/styles/layout/sidebar-expandable-playlists-section.css
+++ b/src/styles/layout/sidebar-expandable-playlists-section.css
@@ -33,13 +33,13 @@
 }
 
 .sidebar-playlists-toggle:hover {
-  background: var(--bg-hover);
+  background: var(--sidebar-item-hover);
   color: var(--text-primary);
 }
 
 .sidebar-playlists-toggle.expanded {
   transform: rotate(90deg);
-  color: var(--accent);
+  color: var(--sidebar-item-active-text);
 }
 
 .sidebar-playlists-section {
@@ -54,7 +54,7 @@
   width: 100%;
   padding: var(--space-2) var(--space-3);
   border-radius: var(--radius-md);
-  color: var(--text-secondary);
+  color: var(--sidebar-text);
   font-size: 14px;
   font-weight: 500;
   transition: background var(--transition-fast), color var(--transition-fast);
@@ -65,13 +65,13 @@
 }
 
 .sidebar-playlists-header:hover {
-  background: var(--bg-hover);
+  background: var(--sidebar-item-hover);
   color: var(--text-primary);
 }
 
 .sidebar-playlists-header.active {
-  background: var(--accent-dim);
-  color: var(--accent);
+  background: var(--sidebar-item-active-bg);
+  color: var(--sidebar-item-active-text);
 }
 
 .sidebar-playlists-chevron {
@@ -99,7 +99,7 @@
   gap: var(--space-2);
   padding: var(--space-1) var(--space-2);
   border-radius: var(--radius-md);
-  color: var(--text-secondary);
+  color: var(--sidebar-text);
   font-size: 13px;
   font-weight: 400;
   transition: background var(--transition-fast), color var(--transition-fast);
@@ -115,13 +115,13 @@
 }
 
 .sidebar-playlist-item:hover {
-  background: var(--bg-hover);
+  background: var(--sidebar-item-hover);
   color: var(--text-primary);
 }
 
 .sidebar-playlist-item.active {
-  background: var(--accent-dim);
-  color: var(--accent);
+  background: var(--sidebar-item-active-bg);
+  color: var(--sidebar-item-active-text);
 }
 
 .sidebar-playlists-loading {
diff --git a/src/styles/layout/sidebar.css b/src/styles/layout/sidebar.css
index eef5e4e6..d37c79e5 100644
--- a/src/styles/layout/sidebar.css
+++ b/src/styles/layout/sidebar.css
@@ -4,7 +4,7 @@
   display: flex;
   flex-direction: column;
   background: var(--bg-sidebar);
-  border-right: 1px solid var(--border-subtle);
+  border-right: 1px solid var(--sidebar-border);
   position: relative;
   z-index: 2;
   min-height: 0; /* allow 1fr row to shrink freely */
@@ -17,7 +17,7 @@
   padding: 0 var(--space-5);
   height: 64px;
   box-sizing: border-box;
-  border-bottom: 1px solid var(--border-subtle);
+  border-bottom: 1px solid var(--sidebar-border);
 }
 
 .sidebar-brand .logo-icon {
@@ -31,7 +31,7 @@
   font-size: 20px;
   font-weight: 700;
   letter-spacing: -0.02em;
-  background: linear-gradient(135deg, var(--accent), var(--ctp-blue));
+  background: linear-gradient(135deg, var(--accent), var(--accent-2));
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
   background-clip: text;
@@ -65,19 +65,19 @@
   width: calc(100% - 2 * var(--space-3));
   margin: var(--space-3) var(--space-3) var(--space-2);
   padding: var(--space-2) var(--space-2);
-  border: 1px solid var(--border-subtle, rgba(255, 255, 255, 0.08));
+  border: 1px solid var(--sidebar-border);
   border-radius: var(--radius-md);
-  background: var(--bg-tertiary, rgba(0, 0, 0, 0.2));
-  color: var(--text-secondary);
+  background: var(--sidebar-trigger-bg);
+  color: var(--sidebar-text);
   cursor: pointer;
   text-align: left;
   transition: background var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast);
 }
 
 .nav-library-scope-trigger:hover {
-  background: var(--bg-hover);
+  background: var(--sidebar-item-hover);
   color: var(--text-primary);
-  border-color: var(--border-default, rgba(255, 255, 255, 0.12));
+  border-color: var(--border);
 }
 
 /* «Все библиотеки»: как секция навигации, без рамки и подложки */
@@ -96,12 +96,12 @@
 }
 
 .nav-library-scope-trigger--open:not(.nav-library-scope-trigger--plain) {
-  border-color: var(--accent, var(--border-default));
+  border-color: var(--accent, var(--border));
 }
 
 .nav-library-scope-trigger--open.nav-library-scope-trigger--plain {
-  border-color: var(--border-subtle, rgba(255, 255, 255, 0.08));
-  background: var(--bg-tertiary, rgba(0, 0, 0, 0.2));
+  border-color: var(--sidebar-border);
+  background: var(--sidebar-trigger-bg);
 }
 
 .nav-library-scope-icon {
@@ -153,9 +153,9 @@
   flex-direction: column;
   padding: var(--space-1);
   border-radius: var(--radius-md);
-  border: 1px solid var(--border-dropdown, rgba(255, 255, 255, 0.12));
-  background: var(--bg-card);
-  box-shadow: 0 8px 24px var(--shadow-dropdown, rgba(0, 0, 0, 0.45));
+  border: 1px solid var(--border-dropdown);
+  background: var(--menu-bg);
+  box-shadow: 0 8px 24px var(--shadow-dropdown);
   box-sizing: border-box;
   overflow-y: visible;
 }
@@ -190,11 +190,11 @@
 }
 
 .nav-library-dropdown-item:hover {
-  background: var(--bg-hover);
+  background: var(--menu-item-hover);
 }
 
 .nav-library-dropdown-item--selected {
-  color: var(--accent);
+  color: var(--menu-item-active-text);
 }
 
 .nav-library-dropdown-item-label {
@@ -266,9 +266,9 @@
   border-radius: 50%;
   pointer-events: none;
   z-index: 100002;
-  color: var(--danger, #e05555);
-  background: color-mix(in srgb, var(--danger, #e05555) 18%, var(--bg-card, #1e1e2e));
-  border: 1px solid color-mix(in srgb, var(--danger, #e05555) 45%, transparent);
+  color: var(--danger);
+  background: color-mix(in srgb, var(--danger) 18%, var(--bg-card));
+  border: 1px solid color-mix(in srgb, var(--danger) 45%, transparent);
   box-shadow: 0 8px 28px rgba(0, 0, 0, 0.45);
 }
 
@@ -278,7 +278,7 @@
   gap: var(--space-3);
   padding: var(--space-3) var(--space-3);
   border-radius: var(--radius-md);
-  color: var(--text-secondary);
+  color: var(--sidebar-text);
   font-size: 14px;
   font-weight: 500;
   transition: background var(--transition-fast), color var(--transition-fast);
@@ -288,13 +288,13 @@
 }
 
 .nav-link:hover {
-  background: var(--bg-hover);
+  background: var(--sidebar-item-hover);
   color: var(--text-primary);
 }
 
 .nav-link.active {
-  background: var(--accent-dim);
-  color: var(--accent);
+  background: var(--sidebar-item-active-bg);
+  color: var(--sidebar-item-active-text);
 }
 
 .nav-link.active::before {
@@ -305,7 +305,7 @@
   transform: translateY(-50%);
   width: 3px;
   height: 60%;
-  background: var(--accent);
+  background: var(--sidebar-item-active-text);
   border-radius: 0 var(--radius-full) var(--radius-full) 0;
 }
 
@@ -323,16 +323,16 @@
 
 /* Now Playing nav link — subtly accented but not permanently "active"-looking */
 .nav-link-nowplaying {
-  color: var(--accent);
+  color: var(--sidebar-item-active-text);
   font-weight: 600;
 }
 .nav-link-nowplaying:hover {
-  background: var(--bg-hover);
-  color: var(--accent);
+  background: var(--sidebar-item-hover);
+  color: var(--sidebar-item-active-text);
 }
 .nav-link-nowplaying.active {
-  background: var(--accent-dim);
-  color: var(--accent);
+  background: var(--sidebar-item-active-bg);
+  color: var(--sidebar-item-active-text);
 }
 .nav-link-nowplaying svg {
   opacity: 1;
@@ -366,7 +366,7 @@
   padding: 0 5px;
   border-radius: 999px;
   background: var(--accent);
-  color: var(--ctp-crust, #11111b);
+  color: var(--text-on-accent);
   font-size: 10px;
   font-weight: 700;
   line-height: 18px;
@@ -406,7 +406,7 @@
   width: 22px;
   height: 22px;
   border-radius: 50%;
-  border: 1px solid var(--border-subtle);
+  border: 1px solid var(--sidebar-border);
   background: var(--bg-card);
   color: var(--text-muted);
   cursor: pointer;
@@ -418,7 +418,7 @@
 }
 
 .collapse-btn:hover {
-  background: var(--bg-hover);
+  background: var(--sidebar-item-hover);
   color: var(--text-primary);
   box-shadow: var(--shadow-md);
 }
diff --git a/src/styles/layout/transport-controls.css b/src/styles/layout/transport-controls.css
index eac11fb7..0d87523b 100644
--- a/src/styles/layout/transport-controls.css
+++ b/src/styles/layout/transport-controls.css
@@ -37,12 +37,12 @@
   width: 64px;
   height: 64px;
   background: var(--accent);
-  color: var(--ctp-crust);
+  color: var(--text-on-accent);
   box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
 }
 
 .mp-ctrl-play:hover {
-  color: var(--ctp-crust);
+  color: var(--text-on-accent);
   filter: brightness(1.1);
   transform: scale(1.06);
   box-shadow: 0 6px 28px rgba(0, 0, 0, 0.4), var(--shadow-glow);
diff --git a/src/styles/themes/1984-cyberpunk-juanmnl-vs-1984-mint-green-variant.css b/src/styles/themes/1984-cyberpunk-juanmnl-vs-1984-mint-green-variant.css
deleted file mode 100644
index 7c80130e..00000000
--- a/src/styles/themes/1984-cyberpunk-juanmnl-vs-1984-mint-green-variant.css
+++ /dev/null
@@ -1,56 +0,0 @@
-/* ─── 1984 Cyberpunk (juanmnl/vs-1984 — mint-green variant) ─── */
-[data-theme='vs-1984-cyberpunk'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23f5f5f5%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust:    #0e0f15;
-  --ctp-mantle:   #15171d;   /* sideBar.background */
-  --ctp-base:     #1C1E27;   /* editor.background */
-  --ctp-surface0: #232631;
-  --ctp-surface1: #2c2f3c;
-  --ctp-surface2: #383b4a;
-  --ctp-overlay0: #525863;
-  --ctp-overlay1: #78A8D6;   /* language variable */
-  --ctp-overlay2: #b8bfd1;
-  --ctp-text:     #f5f5f5;
-  --ctp-subtext1: #d4d8e3;
-  --ctp-subtext0: #78A8D6;
-  --ctp-mauve:    #85EEA7;
-  --ctp-lavender: #78A8D6;
-  --ctp-pink:     #FF16B0;
-  --ctp-flamingo: #7ADAD1;
-  --ctp-rosewater:#7ADAD1;
-  --ctp-blue:     #78A8D6;
-  --ctp-sapphire: #7ADAD1;
-  --ctp-sky:      #7ADAD1;
-  --ctp-teal:     #7ADAD1;
-  --ctp-green:    #85EEA7;
-  --ctp-yellow:   #7ADAD1;
-  --ctp-peach:    #85EEA7;
-  --ctp-maroon:   #FF16B0;
-  --ctp-red:      #FF16B0;
-
-  --bg-app:           #1C1E27;
-  --bg-sidebar:       #15171d;
-  --bg-card:          #232631;
-  --bg-hover:         #2c2f3c;
-  --bg-player:        #15171d;
-  --bg-glass:         rgba(28, 30, 39, 0.82);
-  --accent:           #85EEA7;       /* signature mint-green */
-  --accent-dim:       rgba(133, 238, 167, 0.16);
-  --accent-glow:      rgba(133, 238, 167, 0.32);
-  --text-primary:     #f5f5f5;
-  --text-secondary:   #78A8D6;
-  --text-muted:       #525863;
-  --border:           #2c2f3c;
-  --border-subtle:    #232631;
-  --border-dropdown:  #383b4a;
-  --shadow-dropdown:  rgba(0, 0, 0, 0.7);
-  --positive:         #85EEA7;
-  --warning:          #7ADAD1;
-  --danger:           #FF16B0;
-  --waveform-played:    #85EEA7;
-  --waveform-buffered:  #383b4a;
-  --waveform-unplayed:  #232631;
-}
-
diff --git a/src/styles/themes/1984-juanmnl-vs-1984-default-dark-deep-blue-cyberpunk.css b/src/styles/themes/1984-juanmnl-vs-1984-default-dark-deep-blue-cyberpunk.css
deleted file mode 100644
index e8e638dc..00000000
--- a/src/styles/themes/1984-juanmnl-vs-1984-default-dark-deep-blue-cyberpunk.css
+++ /dev/null
@@ -1,56 +0,0 @@
-/* ─── 1984 (juanmnl/vs-1984 — default dark, deep-blue cyberpunk) ─── */
-[data-theme='vs-1984'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23f1f1f1%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust:    #050620;
-  --ctp-mantle:   #070825;   /* sideBar.background */
-  --ctp-base:     #0d0f31;   /* editor.background */
-  --ctp-surface0: #161a4a;   /* card elevation */
-  --ctp-surface1: #1f2560;
-  --ctp-surface2: #2a3275;
-  --ctp-overlay0: #3B4D66;   /* lineNumber */
-  --ctp-overlay1: #525863;   /* comment */
-  --ctp-overlay2: #96A1FF;   /* variable */
-  --ctp-text:     #f1f1f1;
-  --ctp-subtext1: #d6d8ff;
-  --ctp-subtext0: #96A1FF;
-  --ctp-mauve:    #FF16B0;   /* keyword pink */
-  --ctp-lavender: #96A1FF;   /* variable */
-  --ctp-pink:     #FF16B0;
-  --ctp-flamingo: #DF81FC;   /* string */
-  --ctp-rosewater:#DF81FC;
-  --ctp-blue:     #46BDFF;   /* focusBorder / accent */
-  --ctp-sapphire: #46BDFF;
-  --ctp-sky:      #46BDFF;
-  --ctp-teal:     #46BDFF;
-  --ctp-green:    #B3F361;   /* cursor green */
-  --ctp-yellow:   #DF81FC;
-  --ctp-peach:    #FF16B0;
-  --ctp-maroon:   #FF16B0;
-  --ctp-red:      #FF16B0;
-
-  --bg-app:           #0d0f31;
-  --bg-sidebar:       #070825;
-  --bg-card:          #161a4a;
-  --bg-hover:         #1f2560;
-  --bg-player:        #070825;
-  --bg-glass:         rgba(13, 15, 49, 0.82);
-  --accent:           #46BDFF;       /* signature 1984 cyan-blue */
-  --accent-dim:       rgba(70, 189, 255, 0.16);
-  --accent-glow:      rgba(70, 189, 255, 0.32);
-  --text-primary:     #f1f1f1;
-  --text-secondary:   #96A1FF;
-  --text-muted:       #525863;       /* comment */
-  --border:           #1f2560;
-  --border-subtle:    #161a4a;
-  --border-dropdown:  #2a3275;
-  --shadow-dropdown:  rgba(0, 0, 0, 0.7);
-  --positive:         #B3F361;       /* cursor green */
-  --warning:          #DF81FC;       /* string magenta */
-  --danger:           #FF16B0;       /* keyword pink */
-  --waveform-played:    #46BDFF;
-  --waveform-buffered:  #3B4D66;
-  --waveform-unplayed:  #161a4a;
-}
-
diff --git a/src/styles/themes/1984-light-juanmnl-vs-1984-bluish-white.css b/src/styles/themes/1984-light-juanmnl-vs-1984-bluish-white.css
deleted file mode 100644
index 0a85d209..00000000
--- a/src/styles/themes/1984-light-juanmnl-vs-1984-bluish-white.css
+++ /dev/null
@@ -1,56 +0,0 @@
-/* ─── 1984 Light (juanmnl/vs-1984 — bluish-white) ─── */
-[data-theme='vs-1984-light'] {
-  color-scheme: light;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2319152c%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust:    #d4d6e7;
-  --ctp-mantle:   #dfe0f0;   /* sideBar.background */
-  --ctp-base:     #e4e5f5;   /* editor.background */
-  --ctp-surface0: #d4d6e7;
-  --ctp-surface1: #cccdde;
-  --ctp-surface2: #b9bad0;
-  --ctp-overlay0: #9793b9;   /* comment */
-  --ctp-overlay1: #7f8a99;   /* lineNumber */
-  --ctp-overlay2: #585d74;
-  --ctp-text:     #19152c;
-  --ctp-subtext1: #3f374b;
-  --ctp-subtext0: #585d74;   /* sideBar.foreground */
-  --ctp-mauve:    #a626a4;
-  --ctp-lavender: #4d5eff;
-  --ctp-pink:     #FF16B0;
-  --ctp-flamingo: #c300ff;
-  --ctp-rosewater:#1930fd;
-  --ctp-blue:     #4d5eff;
-  --ctp-sapphire: #46BDFF;
-  --ctp-sky:      #46BDFF;
-  --ctp-teal:     #1930fd;
-  --ctp-green:    #1d7848;
-  --ctp-yellow:   #b88600;
-  --ctp-peach:    #FF16B0;
-  --ctp-maroon:   #FF16B0;
-  --ctp-red:      #FF16B0;
-
-  --bg-app:           #e4e5f5;
-  --bg-sidebar:       #dfe0f0;
-  --bg-card:          #d4d6e7;
-  --bg-hover:         #cccdde;
-  --bg-player:        #dfe0f0;
-  --bg-glass:         rgba(228, 229, 245, 0.92);
-  --accent:           #4d5eff;       /* variable blue — readable on bluish-white */
-  --accent-dim:       rgba(77, 94, 255, 0.12);
-  --accent-glow:      rgba(77, 94, 255, 0.24);
-  --text-primary:     #19152c;
-  --text-secondary:   #585d74;       /* sideBar.foreground */
-  --text-muted:       #9793b9;       /* comment */
-  --border:           #cccdde;
-  --border-subtle:    #d4d6e7;
-  --border-dropdown:  #b9bad0;
-  --shadow-dropdown:  rgba(25, 21, 44, 0.18);
-  --positive:         #1d7848;
-  --warning:          #b88600;
-  --danger:           #FF16B0;       /* signature 1984 hot-pink button */
-  --waveform-played:    #4d5eff;
-  --waveform-buffered:  #9793b9;
-  --waveform-unplayed:  #d4d6e7;
-}
-
diff --git a/src/styles/themes/1984-orwell-juanmnl-vs-1984-sepia-dystopian-variant.css b/src/styles/themes/1984-orwell-juanmnl-vs-1984-sepia-dystopian-variant.css
deleted file mode 100644
index 461a61b5..00000000
--- a/src/styles/themes/1984-orwell-juanmnl-vs-1984-sepia-dystopian-variant.css
+++ /dev/null
@@ -1,56 +0,0 @@
-/* ─── 1984 Orwell (juanmnl/vs-1984 — sepia / dystopian variant) ─── */
-[data-theme='vs-1984-orwell'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23f1f1f1%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust:    #1f1c18;
-  --ctp-mantle:   #292521;   /* sideBar.background */
-  --ctp-base:     #2e2923;   /* editor.background */
-  --ctp-surface0: #3a342c;
-  --ctp-surface1: #463e34;
-  --ctp-surface2: #574d40;
-  --ctp-overlay0: #7a6a52;
-  --ctp-overlay1: #b39773;
-  --ctp-overlay2: #d8c39c;
-  --ctp-text:     #f1f1f1;
-  --ctp-subtext1: #fcd395;
-  --ctp-subtext0: #fcbe95;
-  --ctp-mauve:    #fcd395;
-  --ctp-lavender: #fcbe95;
-  --ctp-pink:     #e74946;
-  --ctp-flamingo: #e74946;
-  --ctp-rosewater:#fcbe95;
-  --ctp-blue:     #fcd395;
-  --ctp-sapphire: #fcbe95;
-  --ctp-sky:      #F7D88B;
-  --ctp-teal:     #fcd395;
-  --ctp-green:    #fcd395;
-  --ctp-yellow:   #F7D88B;
-  --ctp-peach:    #fcbe95;
-  --ctp-maroon:   #e74946;
-  --ctp-red:      #e74946;
-
-  --bg-app:           #2e2923;
-  --bg-sidebar:       #292521;
-  --bg-card:          #3a342c;
-  --bg-hover:         #463e34;
-  --bg-player:        #292521;
-  --bg-glass:         rgba(46, 41, 35, 0.82);
-  --accent:           #fcd395;       /* cream-gold */
-  --accent-dim:       rgba(252, 211, 149, 0.16);
-  --accent-glow:      rgba(252, 211, 149, 0.32);
-  --text-primary:     #f1f1f1;
-  --text-secondary:   #fcd395;
-  --text-muted:       #b39773;
-  --border:           #463e34;
-  --border-subtle:    #3a342c;
-  --border-dropdown:  #574d40;
-  --shadow-dropdown:  rgba(0, 0, 0, 0.7);
-  --positive:         #F7D88B;
-  --warning:          #fcbe95;
-  --danger:           #e74946;
-  --waveform-played:    #fcd395;
-  --waveform-buffered:  #7a6a52;
-  --waveform-unplayed:  #3a342c;
-}
-
diff --git a/src/styles/themes/a-theme-of-ice-and-fire-game-of-thrones.css b/src/styles/themes/a-theme-of-ice-and-fire-game-of-thrones.css
deleted file mode 100644
index 5c8348d2..00000000
--- a/src/styles/themes/a-theme-of-ice-and-fire-game-of-thrones.css
+++ /dev/null
@@ -1,254 +0,0 @@
-/* ─── A Theme of Ice and Fire — Game of Thrones ─── */
-/* Concept: FIRE (volcanic Dragonstone, main area) vs ICE (Castle Black, sidebar) */
-@keyframes fire-flicker {
-  0% {
-    text-shadow: 0 0 8px rgba(200, 30, 20, 0.65), 0 0 20px rgba(200, 60, 10, 0.30);
-  }
-
-  20% {
-    text-shadow: 0 0 12px rgba(220, 55, 15, 0.75), 0 0 28px rgba(210, 40, 10, 0.38);
-  }
-
-  40% {
-    text-shadow: 0 0 6px rgba(180, 20, 10, 0.55), 0 0 14px rgba(190, 30, 10, 0.22);
-  }
-
-  65% {
-    text-shadow: 0 0 14px rgba(215, 50, 12, 0.80), 0 0 32px rgba(200, 70, 15, 0.40);
-  }
-
-  85% {
-    text-shadow: 0 0 9px rgba(195, 25, 15, 0.60), 0 0 22px rgba(200, 40, 10, 0.28);
-  }
-
-  100% {
-    text-shadow: 0 0 8px rgba(200, 30, 20, 0.65), 0 0 20px rgba(200, 60, 10, 0.30);
-  }
-}
-
-[data-theme='ice-and-fire'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23c41e1e%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* Palette — Targaryen blood red, dragon gold, volcanic black, Wall ice */
-  --ctp-crust: #060402;
-  --ctp-mantle: #0a0806;
-  --ctp-base: #100c08;
-  --ctp-surface0: #1c1410;
-  --ctp-surface1: #281c14;
-  --ctp-surface2: #38261c;
-  --ctp-overlay0: #5a3e2e;
-  --ctp-overlay1: #7a5840;
-  --ctp-overlay2: #9a7858;
-  --ctp-text: #ecdcc8;
-  --ctp-subtext1: #d0b898;
-  --ctp-subtext0: #a89070;
-  --ctp-mauve: #c41e1e;
-  --ctp-lavender: #e03030;
-  --ctp-pink: #e03030;
-  --ctp-flamingo: #c83010;
-  --ctp-rosewater: #ecdcc8;
-  --ctp-green: #5a8a3a;
-  --ctp-teal: #5090a0;
-  /* Wall ice teal */
-  --ctp-sky: #80b8d0;
-  /* Northern sky */
-  --ctp-blue: #3a6898;
-  --ctp-sapphire: #3a6898;
-  --ctp-yellow: #c8880a;
-  /* Lannister / dragon gold */
-  --ctp-peach: #c83010;
-  --ctp-maroon: #8b0808;
-  --ctp-red: #c41e1e;
-
-  --bg-app: #100c08;
-  /* volcanic black — warm dark */
-  --bg-sidebar: #090c10;
-  /* Castle Black — cold blue-grey stone */
-  --bg-card: #1c1410;
-  --bg-hover: #281c14;
-  --bg-player: #060402;
-  /* obsidian black */
-  --bg-glass: rgba(10, 8, 6, 0.92);
-  --accent: #c41e1e;
-  /* Targaryen blood red */
-  --accent-dim: rgba(196, 30, 30, 0.14);
-  --accent-glow: rgba(196, 30, 30, 0.38);
-  --text-primary: #ecdcc8;
-  /* warm stone parchment */
-  --text-secondary: #9a7858;
-  --text-muted: #b08860;
-  --border: rgba(196, 30, 30, 0.20);
-  --border-subtle: rgba(196, 30, 30, 0.08);
-  --border-dropdown: rgba(196, 30, 30, 0.32);
-  --shadow-dropdown: rgba(0, 0, 0, 0.92);
-  --positive: #5a8a3a;
-  --warning: #c8880a;
-  --danger: #c41e1e;
-  --radius-sm: 2px;
-  --radius-md: 4px;
-  --radius-lg: 6px;
-}
-
-/* App shell — scattered torch-light: warm pools of fire at corners */
-[data-theme='ice-and-fire'] .app-shell {
-  background-image:
-    radial-gradient(ellipse at 15% 85%, rgba(200, 80, 10, 0.07) 0%, transparent 55%),
-    radial-gradient(ellipse at 85% 15%, rgba(180, 20, 10, 0.06) 0%, transparent 55%),
-    radial-gradient(ellipse at 85% 85%, rgba(200, 100, 15, 0.05) 0%, transparent 45%);
-}
-
-/* Sidebar — THE NORTH: cold Castle Black stone, masonry pattern */
-[data-theme='ice-and-fire'] .sidebar {
-  background: #090c10;
-  border-right: 1px solid rgba(196, 30, 30, 0.20);
-  background-image:
-    repeating-linear-gradient(0deg,
-      rgba(80, 110, 140, 0.04) 0px, transparent 1px, transparent 56px,
-      rgba(80, 110, 140, 0.04) 57px),
-    repeating-linear-gradient(90deg,
-      rgba(80, 110, 140, 0.025) 0px, transparent 1px, transparent 112px,
-      rgba(80, 110, 140, 0.025) 113px);
-}
-
-/* Player bar — Dragonstone forge: fire glow rising from below */
-[data-theme='ice-and-fire'] .player-bar {
-  background: #060402;
-  border-top: 2px solid #c41e1e;
-  background-image:
-    radial-gradient(ellipse at 50% 130%, rgba(200, 80, 15, 0.22) 0%, rgba(180, 20, 10, 0.12) 45%, transparent 70%);
-  box-shadow: 0 -8px 36px rgba(180, 20, 10, 0.22), 0 -1px 0 rgba(0, 0, 0, 0.9);
-}
-
-/* Track name — Targaryen red, fire flicker (irregular like real flame) */
-[data-theme='ice-and-fire'] .player-track-name {
-  color: #d42020;
-  animation: fire-flicker 5s ease-in-out infinite;
-}
-
-/* Artist name — Lannister/dragon gold */
-[data-theme='ice-and-fire'] .player-artist-name {
-  color: #c8880a;
-}
-
-/* Nav active — blood red left bar */
-[data-theme='ice-and-fire'] .nav-link.active {
-  background: linear-gradient(90deg, rgba(196, 30, 30, 0.18) 0%, transparent 100%);
-  border-left: 3px solid #c41e1e;
-  color: #d42020;
-}
-
-[data-theme='ice-and-fire'] .nav-link:hover:not(.active) {
-  background: linear-gradient(90deg, rgba(196, 30, 30, 0.08) 0%, transparent 100%);
-  border-left: 3px solid rgba(196, 30, 30, 0.32);
-}
-
-/* Content header — red-to-gold ornate rule: Fire and Blood / Hear Me Roar */
-[data-theme='ice-and-fire'] .content-header {
-  border-bottom: 1px solid rgba(196, 30, 30, 0.16);
-  position: relative;
-}
-
-[data-theme='ice-and-fire'] .content-header::after {
-  content: '';
-  position: absolute;
-  bottom: -3px;
-  left: 0;
-  right: 0;
-  height: 1px;
-  background: linear-gradient(90deg,
-      transparent 0%,
-      rgba(196, 30, 30, 0.70) 25%,
-      rgba(200, 136, 10, 0.90) 50%,
-      rgba(196, 30, 30, 0.70) 75%,
-      transparent 100%);
-}
-
-/* Cards — volcanic panel, fire-gold border on hover */
-[data-theme='ice-and-fire'] .album-card:hover,
-[data-theme='ice-and-fire'] .artist-card:hover {
-  box-shadow:
-    0 0 0 1px rgba(196, 30, 30, 0.50),
-    0 0 0 2px rgba(200, 136, 10, 0.14),
-    0 4px 24px rgba(180, 20, 10, 0.18);
-}
-
-/* Track / queue rows */
-[data-theme='ice-and-fire'] .track-row:hover,
-[data-theme='ice-and-fire'] .queue-item:hover {
-  box-shadow: inset 2px 0 0 #c41e1e;
-  background: rgba(196, 30, 30, 0.07);
-}
-
-/* Primary play button — Targaryen red gradient */
-[data-theme='ice-and-fire'] .player-btn-primary {
-  background: linear-gradient(180deg, #e03030 0%, #c41e1e 50%, #9c1010 100%);
-  color: #ecdcc8;
-  box-shadow: 0 0 16px rgba(196, 30, 30, 0.48);
-  border: 1px solid #880808;
-}
-
-[data-theme='ice-and-fire'] .player-btn-primary:hover {
-  background: linear-gradient(180deg, #f04040 0%, #d42828 50%, #ac1818 100%);
-  box-shadow: 0 0 26px rgba(196, 30, 30, 0.70);
-}
-
-/* btn-primary */
-[data-theme='ice-and-fire'] .btn-primary {
-  background: linear-gradient(180deg, #e03030 0%, #c41e1e 50%, #9c1010 100%);
-  color: #ecdcc8;
-  border: 1px solid #880808;
-}
-
-[data-theme='ice-and-fire'] .btn-primary:hover {
-  background: linear-gradient(180deg, #f04040 0%, #d42828 50%, #ac1818 100%);
-}
-
-/* Hero play button */
-[data-theme='ice-and-fire'] .hero-play-btn {
-  background: linear-gradient(180deg, #e03030 0%, #c41e1e 50%, #9c1010 100%);
-  color: #ecdcc8;
-  border: 1px solid #880808;
-  box-shadow: 0 2px 16px rgba(196, 30, 30, 0.48);
-  transition: filter var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast);
-}
-
-[data-theme='ice-and-fire'] .hero-play-btn:hover {
-  background: linear-gradient(180deg, #f04040 0%, #d42828 50%, #ac1818 100%);
-  box-shadow: 0 4px 26px rgba(196, 30, 30, 0.70);
-  transform: scale(1.02);
-}
-
-/* Album card overlay button */
-[data-theme='ice-and-fire'] .album-card-details-btn {
-  background: linear-gradient(180deg, #e03030 0%, #c41e1e 50%, #9c1010 100%);
-  color: #ecdcc8;
-  border: 1px solid #880808;
-  box-shadow: 0 2px 12px rgba(196, 30, 30, 0.45);
-}
-
-/* Scrollbar — obsidian dark, blood-red thumb transitioning to gold */
-[data-theme='ice-and-fire'] ::-webkit-scrollbar {
-  width: 5px;
-  height: 5px;
-}
-
-[data-theme='ice-and-fire'] ::-webkit-scrollbar-track {
-  background: #090c10;
-}
-
-[data-theme='ice-and-fire'] ::-webkit-scrollbar-thumb {
-  background: linear-gradient(180deg, #c41e1e, #883010);
-  border-radius: 3px;
-}
-
-[data-theme='ice-and-fire'] ::-webkit-scrollbar-thumb:hover {
-  background: #c8880a;
-}
-
-/* Connection indicators */
-[data-theme='ice-and-fire'] .connection-type,
-[data-theme='ice-and-fire'] .connection-server {
-  color: #9a7858;
-}
-
diff --git a/src/styles/themes/amoled-black-pure.css b/src/styles/themes/amoled-black-pure.css
deleted file mode 100644
index 546a18ad..00000000
--- a/src/styles/themes/amoled-black-pure.css
+++ /dev/null
@@ -1,68 +0,0 @@
-/* ─── Amoled Black Pure ─── */
-[data-theme='amoled-black-pure'] {
-  color-scheme: dark;
-
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
-
-  /* Backgrounds */
-  --ctp-crust:    #000000;
-  --ctp-mantle:   #000000;
-  --ctp-base:     #000000;
-  --ctp-surface0: #050505;
-  --ctp-surface1: #0a0a0a;
-  --ctp-surface2: #121212;
-
-  /* Overlays */
-  --ctp-overlay0: #5a5a5a;
-  --ctp-overlay1: #7a7a7a;
-  --ctp-overlay2: #9a9a9a;
-
-  /* Text */
-  --ctp-text:     #ffffff;
-  --ctp-subtext1: #d6d6d6;
-  --ctp-subtext0: #a8a8a8;
-
-  /* White accent */
-  --ctp-teal:      #ffffff;
-  --ctp-sky:       #e6e6e6;
-  --ctp-sapphire:  #cfcfcf;
-  --ctp-blue:      #a8a8a8;
-  --ctp-lavender:  #ffffff;
-  --ctp-mauve:     #cfcfcf;
-  --ctp-pink:      #a8a8a8;
-  --ctp-flamingo:  #ffffff;
-  --ctp-rosewater: #cfcfcf;
-
-  /* Semantic */
-  --ctp-red:     #f87171;
-  --ctp-maroon:  #fb923c;
-  --ctp-peach:   #fb923c;
-  --ctp-yellow:  #fbbf24;
-  --ctp-green:   #4ade80;
-
-  /* UI tokens */
-  --bg-app:      #000000;
-  --bg-sidebar:  #000000;
-  --bg-card:     #050505;
-  --bg-hover:    #0a0a0a;
-  --bg-player:   #000000;
-  --bg-glass:    rgba(0, 0, 0, 0.92);
-
-  --accent:      #ffffff;
-  --accent-dim:  rgba(255, 255, 255, 0.12);
-  --accent-glow: rgba(255, 255, 255, 0.18);
-
-  --text-primary:   #ffffff;
-  --text-secondary: #bdbdbd;
-  --text-muted:     #7a7a7a;
-
-  --border:          #121212;
-  --border-subtle:   #0a0a0a;
-  --border-dropdown: #1f1f1f;
-  --shadow-dropdown: rgba(0, 0, 0, 0.98);
-
-  --positive: #4ade80;
-  --warning:  #fbbf24;
-  --danger:   #f87171;
-}
-
diff --git a/src/styles/themes/atom-one-dark-th3whit3wolf-one-nvim-dark-variant.css b/src/styles/themes/atom-one-dark-th3whit3wolf-one-nvim-dark-variant.css
deleted file mode 100644
index e6b38a30..00000000
--- a/src/styles/themes/atom-one-dark-th3whit3wolf-one-nvim-dark-variant.css
+++ /dev/null
@@ -1,56 +0,0 @@
-/* ─── Atom One Dark (Th3Whit3Wolf/one-nvim — dark variant) ─── */
-[data-theme='one-dark'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23abb2bf%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust:    #181a1f;   /* vertsplit */
-  --ctp-mantle:   #21252b;   /* sidebar tone (Atom IDE convention) */
-  --ctp-base:     #282c34;   /* syntax_bg */
-  --ctp-surface0: #2c323c;   /* syntax_cursor */
-  --ctp-surface1: #333841;   /* pmenu */
-  --ctp-surface2: #3e4452;   /* visual_grey */
-  --ctp-overlay0: #4b5263;   /* mono_4 */
-  --ctp-overlay1: #5c6370;   /* mono_3 */
-  --ctp-overlay2: #828997;   /* mono_2 */
-  --ctp-text:     #abb2bf;   /* mono_1 */
-  --ctp-subtext1: #828997;
-  --ctp-subtext0: #636d83;   /* syntax_gutter */
-  --ctp-mauve:    #c678dd;   /* hue_3 */
-  --ctp-lavender: #528bff;   /* syntax_accent */
-  --ctp-pink:     #d291e4;
-  --ctp-flamingo: #e06c75;   /* hue_5 */
-  --ctp-rosewater:#d19a66;   /* hue_6 */
-  --ctp-blue:     #61afef;   /* hue_2 */
-  --ctp-sapphire: #56b6c2;   /* hue_1 */
-  --ctp-sky:      #56b6c2;
-  --ctp-teal:     #56b6c2;
-  --ctp-green:    #98c379;   /* hue_4 */
-  --ctp-yellow:   #e5c07b;   /* hue_6_2 */
-  --ctp-peach:    #d19a66;
-  --ctp-maroon:   #be5046;   /* hue_5_2 */
-  --ctp-red:      #e06c75;
-
-  --bg-app:           #282c34;
-  --bg-sidebar:       #21252b;
-  --bg-card:          #2c323c;
-  --bg-hover:         #3e4452;
-  --bg-player:        #21252b;
-  --bg-glass:         rgba(40, 44, 52, 0.78);
-  --accent:           #61afef;       /* hue_2 — signature One Dark blue */
-  --accent-dim:       rgba(97, 175, 239, 0.16);
-  --accent-glow:      rgba(97, 175, 239, 0.32);
-  --text-primary:     #abb2bf;       /* mono_1 */
-  --text-secondary:   #828997;       /* mono_2 */
-  --text-muted:       #5c6370;       /* mono_3 */
-  --border:           #3e4452;
-  --border-subtle:    #2c323c;
-  --border-dropdown:  #4b5263;
-  --shadow-dropdown:  rgba(0, 0, 0, 0.6);
-  --positive:         #98c379;       /* hue_4 */
-  --warning:          #e5c07b;       /* hue_6_2 */
-  --danger:           #e06c75;       /* hue_5 */
-  --waveform-played:    #61afef;
-  --waveform-buffered:  #4b5263;
-  --waveform-unplayed:  #2c323c;
-}
-
diff --git a/src/styles/themes/atom-one-light-th3whit3wolf-one-nvim-light-variant.css b/src/styles/themes/atom-one-light-th3whit3wolf-one-nvim-light-variant.css
deleted file mode 100644
index c84a40d4..00000000
--- a/src/styles/themes/atom-one-light-th3whit3wolf-one-nvim-light-variant.css
+++ /dev/null
@@ -1,56 +0,0 @@
-/* ─── Atom One Light (Th3Whit3Wolf/one-nvim — light variant) ─── */
-[data-theme='one-light'] {
-  color-scheme: light;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23383A42%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust:    #e7e9e1;   /* vertsplit */
-  --ctp-mantle:   #eaeaeb;
-  --ctp-base:     #fafafa;   /* syntax_bg */
-  --ctp-surface0: #ececed;
-  --ctp-surface1: #dfdfdf;   /* pmenu */
-  --ctp-surface2: #d3d3d3;   /* special_grey */
-  --ctp-overlay0: #c2c2c3;   /* mono_4 */
-  --ctp-overlay1: #a0a1a7;   /* mono_3 */
-  --ctp-overlay2: #696c77;   /* mono_2 */
-  --ctp-text:     #383A42;   /* mono_1 */
-  --ctp-subtext1: #4f525e;   /* term_8 */
-  --ctp-subtext0: #696c77;
-  --ctp-mauve:    #a626a4;   /* hue_3 */
-  --ctp-lavender: #526fff;   /* syntax_accent */
-  --ctp-pink:     #d291e4;
-  --ctp-flamingo: #ca1243;   /* hue_5_2 */
-  --ctp-rosewater:#986801;   /* hue_6 */
-  --ctp-blue:     #4078f2;   /* hue_2 */
-  --ctp-sapphire: #0184bc;   /* hue_1 */
-  --ctp-sky:      #0184bc;
-  --ctp-teal:     #0184bc;
-  --ctp-green:    #50a14f;   /* hue_4 */
-  --ctp-yellow:   #c18401;   /* hue_6_2 */
-  --ctp-peach:    #986801;
-  --ctp-maroon:   #ca1243;
-  --ctp-red:      #e45649;   /* hue_5 */
-
-  --bg-app:           #fafafa;
-  --bg-sidebar:       #eaeaeb;
-  --bg-card:          #ececed;
-  --bg-hover:         #dfdfdf;
-  --bg-player:        #eaeaeb;
-  --bg-glass:         rgba(250, 250, 250, 0.92);
-  --accent:           #4078f2;       /* hue_2 — signature One Light blue */
-  --accent-dim:       rgba(64, 120, 242, 0.12);
-  --accent-glow:      rgba(64, 120, 242, 0.24);
-  --text-primary:     #383A42;       /* mono_1 */
-  --text-secondary:   #696c77;       /* mono_2 */
-  --text-muted:       #a0a1a7;       /* mono_3 */
-  --border:           #dfdfdf;
-  --border-subtle:    #ececed;
-  --border-dropdown:  #c2c2c3;
-  --shadow-dropdown:  rgba(0, 0, 0, 0.16);
-  --positive:         #50a14f;       /* hue_4 */
-  --warning:          #c18401;       /* hue_6_2 */
-  --danger:           #e45649;       /* hue_5 */
-  --waveform-played:    #4078f2;
-  --waveform-buffered:  #a0a1a7;
-  --waveform-unplayed:  #dfdfdf;
-}
-
diff --git a/src/styles/themes/back-to-the-future-hill-valley-85.css b/src/styles/themes/back-to-the-future-hill-valley-85.css
deleted file mode 100644
index 4ea13bab..00000000
--- a/src/styles/themes/back-to-the-future-hill-valley-85.css
+++ /dev/null
@@ -1,954 +0,0 @@
-/* ─── Back to the Future — Hill Valley '85 ─── */
-[data-theme='hill-valley-85'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ff8c00%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* ── Palette ── */
-  --ctp-crust: #020106;
-  --ctp-mantle: #07060f;
-  --ctp-base: #0d0b18;
-  --ctp-surface0: #151220;
-  --ctp-surface1: #1e1a2c;
-  --ctp-surface2: #272338;
-  --ctp-overlay0: #3d3455;
-  --ctp-overlay1: #5a4e70;
-  --ctp-overlay2: #7a6e90;
-  --ctp-text: #ede0c8;
-  --ctp-subtext1: #c8b898;
-  --ctp-subtext0: #a09070;
-  /* BTTF palette: flame orange, DeLorean red, lightning blue, flux yellow */
-  --ctp-mauve: #ff8c00;
-  --ctp-lavender: #ffaa33;
-  --ctp-red: #ff2200;
-  --ctp-blue: #3d88ff;
-  --ctp-sapphire: #1a5ccc;
-  --ctp-sky: #66aaff;
-  --ctp-teal: #00ccff;
-  --ctp-green: #44dd00;
-  --ctp-yellow: #ffe033;
-  --ctp-peach: #ff6600;
-  --ctp-pink: #ff44aa;
-  --ctp-flamingo: #ff2266;
-  --ctp-rosewater: #ffd0b0;
-  --ctp-maroon: #cc1100;
-
-  /* ── Semantic tokens ── */
-  --bg-app: #0d0b18;
-  --bg-sidebar: #08060f;
-  --bg-card: #141120;
-  --bg-hover: rgba(255, 140, 0, 0.12);
-  --bg-player: #040209;
-  --bg-glass: rgba(6, 4, 12, 0.96);
-  --accent: #ff8c00;
-  --accent-dim: rgba(255, 140, 0, 0.12);
-  --accent-glow: rgba(255, 140, 0, 0.40);
-  --volume-accent: #ff8c00;
-  --text-primary: #ede0c8;
-  --text-secondary: #c8b898;
-  --text-muted: #b0a0c8;
-  --border: rgba(255, 140, 0, 0.20);
-  --border-subtle: rgba(255, 140, 0, 0.10);
-  --positive: #44dd00;
-  --warning: #ffe033;
-  --danger: #ff2200;
-  --radius-sm: 2px;
-  --radius-md: 4px;
-  --radius-lg: 6px;
-}
-
-/* ── App shell: Hill Valley night sky — orange fire & blue lightning ── */
-[data-theme='hill-valley-85'] .app-shell {
-  background:
-    radial-gradient(ellipse at 15% 80%, rgba(255, 110, 0, 0.07) 0%, transparent 55%),
-    radial-gradient(ellipse at 85% 15%, rgba(60, 130, 255, 0.06) 0%, transparent 50%),
-    #0d0b18;
-}
-
-/* ── Sidebar: DeLorean stainless steel panels ── */
-[data-theme='hill-valley-85'] .sidebar {
-  background-color: #08060f;
-  background-image: repeating-linear-gradient(90deg,
-      rgba(255, 255, 255, 0.025) 0px, rgba(255, 255, 255, 0.025) 1px,
-      transparent 1px, transparent 10px);
-  border-right: 1px solid rgba(255, 140, 0, 0.22);
-  box-shadow: inset -2px 0 8px rgba(255, 100, 0, 0.05), 2px 0 6px rgba(0, 0, 0, 0.40);
-}
-
-/* Nav links */
-[data-theme='hill-valley-85'] .nav-link {
-  color: #c8b898;
-}
-
-[data-theme='hill-valley-85'] .nav-link:hover {
-  background: rgba(255, 140, 0, 0.10);
-  color: #ede0c8;
-}
-
-[data-theme='hill-valley-85'] .nav-link.active {
-  background: linear-gradient(90deg, rgba(255, 140, 0, 0.18) 0%, transparent 100%);
-  color: #ff8c00;
-  border-left: 2px solid #ff8c00;
-  box-shadow: inset 4px 0 12px rgba(255, 140, 0, 0.10);
-}
-
-[data-theme='hill-valley-85'] .nav-link.active::before {
-  background: #ff8c00;
-  box-shadow: 0 0 8px rgba(255, 140, 0, 0.70);
-}
-
-[data-theme='hill-valley-85'] .nav-link.active svg {
-  color: #ff8c00;
-}
-
-/* ── Player bar: DeLorean time circuit console ── */
-[data-theme='hill-valley-85'] .player-bar {
-  background: linear-gradient(180deg, #060410 0%, #030208 100%);
-  border-top: 2px solid rgba(255, 140, 0, 0.45);
-  box-shadow:
-    inset 0 1px 0 rgba(255, 140, 0, 0.18),
-    0 -6px 30px rgba(255, 100, 0, 0.12),
-    0 -2px 60px rgba(60, 130, 255, 0.04);
-}
-
-/* Track name: DeLorean time circuit red LED display */
-[data-theme='hill-valley-85'] .player-track-name {
-  color: #ff2200;
-  font-family: 'Courier New', 'Courier', monospace;
-  text-shadow:
-    0 0 8px rgba(255, 34, 0, 0.90),
-    0 0 18px rgba(255, 34, 0, 0.50),
-    0 0 30px rgba(255, 34, 0, 0.20);
-  letter-spacing: 1.5px;
-  text-transform: uppercase;
-  font-weight: 700;
-}
-
-/* Artist name: amber LED — second row of the time display */
-[data-theme='hill-valley-85'] .player-track-artist {
-  color: #ff8c00;
-  font-family: 'Courier New', monospace;
-  text-shadow: 0 0 8px rgba(255, 140, 0, 0.65);
-  letter-spacing: 0.5px;
-  opacity: 1;
-}
-
-/* Time readout: amber LCD */
-[data-theme='hill-valley-85'] .player-time {
-  color: #cc6a00;
-  font-family: 'Courier New', monospace;
-  text-shadow: 0 0 6px rgba(255, 140, 0, 0.40);
-}
-
-/* ── Transport buttons: illuminated 80s switches ── */
-[data-theme='hill-valley-85'] .player-btn,
-[data-theme='hill-valley-85'] .player-btn-primary {
-  background: linear-gradient(180deg, #100d1c 0%, #0a0815 100%);
-  color: #ff8c00;
-  border: 1px solid rgba(255, 140, 0, 0.35);
-  border-radius: 50%;
-  box-shadow: inset 0 0 6px rgba(255, 100, 0, 0.06), 0 1px 3px rgba(0, 0, 0, 0.50);
-}
-
-[data-theme='hill-valley-85'] .player-btn:hover,
-[data-theme='hill-valley-85'] .player-btn-primary:hover {
-  background: rgba(255, 140, 0, 0.12);
-  border-color: #ff8c00;
-  color: #ffaa33;
-  box-shadow:
-    0 0 14px rgba(255, 140, 0, 0.40),
-    inset 0 0 8px rgba(255, 100, 0, 0.08);
-}
-
-/* ── Regular buttons: DeLorean console switches ── */
-[data-theme='hill-valley-85'] .btn,
-[data-theme='hill-valley-85'] .btn-surface,
-[data-theme='hill-valley-85'] .btn-ghost {
-  background: linear-gradient(180deg, #141120 0%, #0e0c1a 100%);
-  color: #c8b898;
-  border: 1px solid rgba(255, 140, 0, 0.28);
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), 0 1px 3px rgba(0, 0, 0, 0.40);
-  border-radius: 4px;
-}
-
-[data-theme='hill-valley-85'] .btn:hover,
-[data-theme='hill-valley-85'] .btn-surface:hover,
-[data-theme='hill-valley-85'] .btn-ghost:hover {
-  background: rgba(255, 140, 0, 0.10);
-  border-color: rgba(255, 140, 0, 0.60);
-  color: #ede0c8;
-  box-shadow: 0 0 10px rgba(255, 140, 0, 0.22), inset 0 0 6px rgba(255, 100, 0, 0.05);
-}
-
-/* ── Primary button: fire orange ── */
-[data-theme='hill-valley-85'] .btn-primary {
-  background: linear-gradient(180deg, #cc5500 0%, #993d00 100%);
-  color: #ffffff;
-  border: 1px solid #ff6600;
-  box-shadow: 0 0 12px rgba(255, 140, 0, 0.30), inset 0 1px 0 rgba(255, 180, 0, 0.25);
-  border-radius: 4px;
-}
-
-[data-theme='hill-valley-85'] .btn-primary:hover {
-  background: linear-gradient(180deg, #e86000 0%, #b04800 100%);
-  box-shadow: 0 0 18px rgba(255, 140, 0, 0.50), inset 0 1px 0 rgba(255, 200, 0, 0.25);
-}
-
-/* ── Hero / album-card buttons ── */
-[data-theme='hill-valley-85'] .hero-play-btn,
-[data-theme='hill-valley-85'] .album-card-details-btn {
-  background: rgba(255, 140, 0, 0.10);
-  color: #ff8c00;
-  border: 1px solid rgba(255, 140, 0, 0.35);
-  box-shadow: inset 0 1px 0 rgba(255, 180, 0, 0.08);
-}
-
-[data-theme='hill-valley-85'] .hero-play-btn:hover,
-[data-theme='hill-valley-85'] .album-card-details-btn:hover {
-  background: rgba(255, 140, 0, 0.18);
-  border-color: #ff8c00;
-  box-shadow: 0 0 12px rgba(255, 140, 0, 0.35);
-}
-
-/* ── Queue toolbar round buttons ── */
-[data-theme='hill-valley-85'] .queue-round-btn {
-  background: linear-gradient(180deg, #141120 0%, #0e0c1a 100%);
-  color: #a09070;
-  border: 1px solid rgba(255, 140, 0, 0.22);
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
-}
-
-[data-theme='hill-valley-85'] .queue-round-btn:hover:not(:disabled):not(.active) {
-  background: rgba(255, 140, 0, 0.10);
-  border-color: rgba(255, 140, 0, 0.55);
-  color: #ff8c00;
-  box-shadow: 0 0 10px rgba(255, 140, 0, 0.22);
-}
-
-[data-theme='hill-valley-85'] .queue-round-btn.active {
-  background: rgba(255, 140, 0, 0.18);
-  border-color: #ff8c00;
-  color: #ff8c00;
-  box-shadow: 0 0 12px rgba(255, 140, 0, 0.40), inset 0 0 6px rgba(255, 100, 0, 0.08);
-}
-
-/* ── Cards: dark interior panels ── */
-[data-theme='hill-valley-85'] .card {
-  background: #141120;
-  border: 1px solid rgba(255, 140, 0, 0.14);
-  box-shadow: inset 0 0 20px rgba(255, 100, 0, 0.03), 0 2px 8px rgba(0, 0, 0, 0.40);
-}
-
-/* ── Content header: console panel strip ── */
-[data-theme='hill-valley-85'] .content-header {
-  background: linear-gradient(180deg, #100d1c 0%, #0d0b18 100%);
-  border-bottom: 1px solid rgba(255, 140, 0, 0.22);
-  box-shadow: 0 2px 12px rgba(255, 100, 0, 0.05);
-}
-
-/* ── Theme accordion ── */
-[data-theme='hill-valley-85'] .theme-accordion-header:hover {
-  background: rgba(255, 140, 0, 0.10);
-  color: #ff8c00;
-}
-
-[data-theme='hill-valley-85'] .theme-accordion-open .theme-accordion-header {
-  background: rgba(255, 140, 0, 0.12);
-  color: #ff8c00;
-}
-
-[data-theme='hill-valley-85'] .theme-accordion-open .theme-accordion-chevron {
-  color: #ff8c00;
-}
-
-/* ── Progress bar: speedometer reaching 88 mph ── */
-[data-theme='hill-valley-85'] .progress-bar-track {
-  background: #0a0815;
-  border: 1px solid rgba(255, 140, 0, 0.20);
-  border-radius: 2px;
-}
-
-[data-theme='hill-valley-85'] .progress-bar-fill {
-  background: linear-gradient(90deg, #993d00 0%, #cc5500 40%, #ff8c00 80%, #ffaa33 100%);
-  border-radius: 2px;
-  box-shadow: 0 0 10px rgba(255, 140, 0, 0.55), 0 0 3px rgba(255, 200, 0, 0.40);
-}
-
-/* ── Scrollbar: fire trail minimal ── */
-[data-theme='hill-valley-85'] ::-webkit-scrollbar {
-  width: 6px;
-  height: 6px;
-}
-
-[data-theme='hill-valley-85'] ::-webkit-scrollbar-track {
-  background: #07060e;
-}
-
-[data-theme='hill-valley-85'] ::-webkit-scrollbar-thumb {
-  background: rgba(255, 140, 0, 0.28);
-  border: 1px solid rgba(255, 140, 0, 0.18);
-  border-radius: 3px;
-}
-
-[data-theme='hill-valley-85'] ::-webkit-scrollbar-thumb:hover {
-  background: rgba(255, 140, 0, 0.55);
-  box-shadow: 0 0 6px rgba(255, 140, 0, 0.40);
-}
-
-/* ── Glass / dropdowns: dark DeLorean interior ── */
-[data-theme='hill-valley-85'] .glass {
-  background: rgba(6, 4, 12, 0.97) !important;
-  backdrop-filter: none !important;
-  border: 1px solid rgba(255, 140, 0, 0.28) !important;
-  box-shadow:
-    0 0 20px rgba(255, 100, 0, 0.08),
-    inset 0 0 16px rgba(255, 100, 0, 0.02) !important;
-  border-radius: 4px !important;
-}
-
-[data-theme='hill-valley-85'] .glass [style*="var(--bg-hover)"] {
-  background: rgba(255, 140, 0, 0.10) !important;
-  border-radius: 2px !important;
-}
-
-[data-theme='hill-valley-85'] .glass [style*="var(--text-primary)"] {
-  color: #ede0c8 !important;
-}
-
-[data-theme='hill-valley-85'] .glass [style*="var(--text-secondary)"] {
-  color: #c8b898 !important;
-}
-
-[data-theme='hill-valley-85'] .glass [style*="var(--text-muted)"] {
-  color: #5a4e70 !important;
-}
-
-/* ── Hover / selection: fire orange glow ── */
-[data-theme='hill-valley-85'] .queue-tab-btn:hover {
-  background: rgba(255, 140, 0, 0.10);
-  color: #ff8c00;
-}
-
-[data-theme='hill-valley-85'] .settings-tab:hover {
-  background: rgba(255, 140, 0, 0.10);
-  color: #ff8c00;
-}
-
-[data-theme='hill-valley-85'] .settings-tab.active {
-  background: rgba(255, 140, 0, 0.15);
-  color: #ff8c00;
-  box-shadow: inset 2px 0 0 #ff8c00;
-}
-
-[data-theme='hill-valley-85'] .custom-select-trigger:hover {
-  background: rgba(255, 140, 0, 0.10);
-}
-
-[data-theme='hill-valley-85'] .custom-select-option:hover {
-  background: rgba(255, 140, 0, 0.14) !important;
-  color: #ffaa33 !important;
-}
-
-[data-theme='hill-valley-85'] .artist-ext-link:hover {
-  background: rgba(255, 140, 0, 0.10);
-  color: #ff8c00 !important;
-  border-color: rgba(255, 140, 0, 0.50) !important;
-}
-
-[data-theme='hill-valley-85'] .np-action-btn:hover {
-  background: rgba(255, 140, 0, 0.10);
-}
-
-[data-theme='hill-valley-85'] .np-queue-item:hover,
-[data-theme='hill-valley-85'] .np-queue-item.context-active {
-  background: rgba(255, 140, 0, 0.12);
-  box-shadow: inset 2px 0 0 #ff8c00;
-}
-
-[data-theme='hill-valley-85'] .track-row:hover,
-[data-theme='hill-valley-85'] .track-row.context-active {
-  background: rgba(255, 140, 0, 0.08) !important;
-  box-shadow: inset 2px 0 0 #ff8c00;
-}
-
-[data-theme='hill-valley-85'] .artist-row:hover {
-  background: rgba(255, 140, 0, 0.08);
-  box-shadow: inset 2px 0 0 #ff8c00;
-}
-
-[data-theme='hill-valley-85'] .playlist-row:hover {
-  background: rgba(255, 140, 0, 0.08);
-  box-shadow: inset 2px 0 0 #ff8c00;
-}
-
-[data-theme='hill-valley-85'] .queue-item:hover,
-[data-theme='hill-valley-85'] .queue-item.context-active {
-  background: rgba(255, 140, 0, 0.10) !important;
-  box-shadow: inset 2px 0 0 #ff8c00;
-}
-
-[data-theme='hill-valley-85'] .queue-item:hover .queue-item-title,
-[data-theme='hill-valley-85'] .queue-item:hover .queue-item-artist,
-[data-theme='hill-valley-85'] .queue-item:hover .queue-item-duration,
-[data-theme='hill-valley-85'] .queue-item.context-active .queue-item-title,
-[data-theme='hill-valley-85'] .queue-item.context-active .queue-item-artist,
-[data-theme='hill-valley-85'] .queue-item.context-active .queue-item-duration {
-  color: #ff8c00;
-}
-
-/* ── Active queue item: glowing orange ── */
-[data-theme='hill-valley-85'] .queue-item.active {
-  background: rgba(255, 140, 0, 0.08);
-  box-shadow: inset 2px 0 0 #ff8c00;
-}
-
-[data-theme='hill-valley-85'] .np-queue-item-active {
-  color: #ff8c00;
-  text-shadow: 0 0 8px rgba(255, 140, 0, 0.55);
-}
-
-[data-theme='hill-valley-85'] .np-queue-item.active {
-  background: rgba(255, 140, 0, 0.08);
-}
-
-[data-theme='hill-valley-85'] .np-album-track.active .np-album-track-title,
-[data-theme='hill-valley-85'] .np-album-track.active .np-album-track-num {
-  color: #ff8c00;
-  text-shadow: 0 0 8px rgba(255, 140, 0, 0.50);
-}
-
-[data-theme='turtle-power'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2333cc33%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust: #0a0a0a;
-  --ctp-mantle: #121212;
-  --ctp-base: #1a1a1a;
-  --ctp-surface0: #2a2a2a;
-  --ctp-surface1: #353535;
-  --ctp-surface2: #404040;
-  --ctp-overlay0: #556655;
-  --ctp-overlay1: #778877;
-  --ctp-overlay2: #99aa99;
-  --ctp-text: #e0e0e0;
-  --ctp-subtext1: #a0b0a0;
-  --ctp-subtext0: #809080;
-
-  --ctp-mauve: #33cc33;
-  --ctp-lavender: #44ee44;
-  --ctp-red: #ff0000;
-  --ctp-blue: #00aaff;
-  --ctp-peach: #ff8c00;
-  --ctp-yellow: #ffcc00;
-  --ctp-maroon: #a020f0;
-  --ctp-green: #33cc33;
-  --ctp-teal: #44ee44;
-  --ctp-sky: #00aaff;
-  --ctp-sapphire: #0077cc;
-  --ctp-pink: #ff66aa;
-  --ctp-flamingo: #ff4488;
-  --ctp-rosewater: #ffaacc;
-
-  --bg-app: #1a1a1a;
-  --bg-sidebar: #121212;
-  --bg-card: #242424;
-  --bg-hover: rgba(51, 204, 51, 0.1);
-  --bg-player: #0a0a0a;
-  --bg-glass: rgba(10, 10, 10, 0.85);
-
-  --accent: #33cc33;
-  --accent-dim: rgba(51, 204, 51, 0.15);
-  --accent-glow: rgba(51, 204, 51, 0.4);
-  --volume-accent: #33cc33;
-
-  --text-primary: #e0e0e0;
-  --text-secondary: #a0b0a0;
-  --text-muted: #667766;
-  --border: #333333;
-  --border-subtle: #222222;
-
-  --radius-sm: 2px;
-  --radius-md: 4px;
-  --radius-lg: 8px;
-}
-
-[data-theme='turtle-power'] .sidebar {
-  background-image:
-    linear-gradient(335deg, #161616 5px, transparent 5px),
-    linear-gradient(155deg, #161616 5px, transparent 5px),
-    linear-gradient(335deg, #161616 5px, transparent 5px),
-    linear-gradient(155deg, #161616 5px, transparent 5px);
-  background-size: 20px 20px;
-  background-position: 0 0, 10px 10px, 10px 10px, 0 0;
-  border-right: 2px solid #222;
-}
-
-[data-theme='turtle-power'] .player-bar {
-  background: linear-gradient(180deg, #1a1a1a 0%, #0a0a0a 100%);
-  border-top: 2px solid #333;
-  box-shadow: 0 -4px 10px rgba(0, 0, 0, 0.5);
-}
-
-[data-theme='turtle-power'] .player-track-name {
-  color: #44ee44;
-  text-shadow: 0 0 8px rgba(68, 238, 68, 0.6);
-  font-weight: bold;
-}
-
-[data-theme='turtle-power'] .btn-primary,
-[data-theme='turtle-power'] .player-btn-primary {
-  background: linear-gradient(145deg, #33cc33, #28a428);
-  border: 1px solid #1e7a1e;
-  box-shadow: inset 1px 1px 2px rgba(255, 255, 255, 0.3), 2px 2px 5px rgba(0, 0, 0, 0.5);
-  color: #000 !important;
-}
-
-[data-theme='turtle-power'] .nav-link.active {
-  background: var(--accent-dim);
-  border-left: 4px solid var(--accent);
-  color: var(--accent) !important;
-  text-shadow: 0 0 5px rgba(51, 204, 51, 0.3);
-}
-
-[data-theme='turtle-power'] .queue-item.active {
-  border-left: 3px solid var(--accent);
-  background: rgba(51, 204, 51, 0.05);
-}
-
-/* ── W3.1 (Operating Systems) ───────────────────────────────── */
-[data-theme='w3-1'] {
-  color-scheme: light;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* ── Authentische W3.1 Palette ── */
-  --ctp-crust: #808080;
-  --ctp-mantle: #a0a0a0;
-  --ctp-base: #c0c0c0;
-  /* Reines W3.1 Grau */
-  --ctp-surface0: #ffffff;
-  --ctp-surface1: #e0e0e0;
-  --ctp-surface2: #c0c0c0;
-  --ctp-overlay0: #808080;
-  --ctp-overlay1: #404040;
-  --ctp-overlay2: #000000;
-  --ctp-text: #000000;
-  --ctp-subtext1: #000000;
-  --ctp-subtext0: #000000;
-
-  --ctp-mauve: #000080;
-  --ctp-lavender: #0000a0;
-  --ctp-green: #008000;
-  --ctp-teal: #008080;
-  --ctp-sky: #0000ff;
-  --ctp-blue: #000080;
-  --ctp-sapphire: #000080;
-  --ctp-pink: #ff00ff;
-  --ctp-flamingo: #ff00ff;
-  --ctp-rosewater: #ffffff;
-  --ctp-yellow: #ffff00;
-  --ctp-peach: #ff8000;
-  --ctp-maroon: #800000;
-  --ctp-red: #ff0000;
-
-  --bg-app: #008080;
-  /* Teal Desktop */
-  --bg-sidebar: #c0c0c0;
-  --bg-card: #ffffff;
-  --bg-hover: #000080;
-  --bg-player: #c0c0c0;
-  --bg-glass: #c0c0c0;
-
-  --accent: #000080;
-  --accent-dim: rgba(0, 0, 128, 0.12);
-  --accent-glow: transparent;
-  --volume-accent: #000080;
-
-  --text-primary: #000000;
-  --text-secondary: #000000;
-  --text-muted: #000000;
-
-  --border: #000000;
-  --border-subtle: #808080;
-  --border-dropdown: #000000;
-  --shadow-dropdown: rgba(0, 0, 0, 0.4);
-
-  --positive: #008000;
-  --warning: #808000;
-  --danger: #ff0000;
-
-  --radius-sm: 0px;
-  --radius-md: 0px;
-  --radius-lg: 0px;
-  --radius-xl: 0px;
-  --radius-full: 0px;
-}
-
-/* Teal Desktop */
-[data-theme='w3-1'] .app-shell {
-  background: #008080;
-}
-
-/* ── W3.1 Bevel (2-Layer, schlichter als W98) ── */
-[data-theme='w3-1'] .sidebar,
-[data-theme='w3-1'] .player-bar,
-[data-theme='w3-1'] .card {
-  background: #c0c0c0;
-  border: 2px solid #000000;
-  box-shadow:
-    inset 1px 1px #ffffff,
-    inset -1px -1px #808080;
-}
-
-[data-theme='w3-1'] .sidebar {
-  border-right: 2px solid #000000;
-}
-
-/* Titelbalken-Stil: solides Navy — der Kern-Unterschied zu W98 */
-[data-theme='w3-1'] .player-bar {
-  border-top: 2px solid #000000;
-}
-
-[data-theme='w3-1'] .player-track-name {
-  background: #000080;
-  color: #ffffff !important;
-  padding: 2px 6px;
-  font-weight: bold;
-  text-align: center;
-  letter-spacing: 0.03em;
-}
-
-[data-theme='w3-1'] .player-track-artist,
-[data-theme='w3-1'] .player-time {
-  color: #000000 !important;
-}
-
-/* Nav */
-[data-theme='w3-1'] .nav-link.active {
-  background: #000080 !important;
-  color: #ffffff !important;
-}
-
-[data-theme='w3-1'] .nav-link.active svg {
-  color: #ffffff !important;
-}
-
-[data-theme='w3-1'] .nav-link:hover:not(.active) {
-  background: #000080 !important;
-  color: #ffffff !important;
-}
-
-[data-theme='w3-1'] .nav-link:hover:not(.active) svg {
-  color: #ffffff !important;
-}
-
-/* Accordion (Settings Theme Picker) */
-[data-theme='w3-1'] .nav-section-label {
-  color: #000000 !important;
-}
-
-[data-theme='w3-1'] .theme-accordion-header:hover {
-  background: #000080;
-  color: #ffffff;
-}
-
-[data-theme='w3-1'] .theme-accordion-open .theme-accordion-header {
-  background: #000080;
-  color: #ffffff;
-}
-
-[data-theme='w3-1'] .theme-accordion-open .theme-accordion-chevron {
-  color: #ffffff;
-}
-
-/* Alle Buttons: W3.1 Bevel (einfach, ohne doppelte Inset-Schicht) */
-[data-theme='w3-1'] .btn,
-[data-theme='w3-1'] .btn-primary,
-[data-theme='w3-1'] .btn-surface,
-[data-theme='w3-1'] .btn-ghost,
-[data-theme='w3-1'] .hero-play-btn,
-[data-theme='w3-1'] .queue-round-btn,
-[data-theme='w3-1'] .player-btn,
-[data-theme='w3-1'] .album-card-details-btn {
-  background: #c0c0c0 !important;
-  color: #000000 !important;
-  border: 1px solid #000000 !important;
-  border-radius: 0 !important;
-  box-shadow: inset 1px 1px #ffffff, inset -1px -1px #808080 !important;
-  text-shadow: none !important;
-  filter: none !important;
-  transform: none !important;
-}
-
-/* Gedrückt */
-[data-theme='w3-1'] .btn:active,
-[data-theme='w3-1'] .btn-primary:active,
-[data-theme='w3-1'] .btn-surface:active,
-[data-theme='w3-1'] .btn-ghost:active,
-[data-theme='w3-1'] .hero-play-btn:active,
-[data-theme='w3-1'] .queue-round-btn:active,
-[data-theme='w3-1'] .player-btn:active,
-[data-theme='w3-1'] .album-card-details-btn:active {
-  box-shadow: inset -1px -1px #ffffff, inset 1px 1px #808080 !important;
-}
-
-/* Hover */
-[data-theme='w3-1'] .btn:hover,
-[data-theme='w3-1'] .btn-primary:hover,
-[data-theme='w3-1'] .btn-surface:hover,
-[data-theme='w3-1'] .btn-ghost:hover,
-[data-theme='w3-1'] .hero-play-btn:hover,
-[data-theme='w3-1'] .album-card-details-btn:hover {
-  background: #d0d0d0 !important;
-  color: #000000 !important;
-}
-
-/* Aktive Queue-Buttons */
-[data-theme='w3-1'] .queue-round-btn.active {
-  background: #000080 !important;
-  color: #ffffff !important;
-  box-shadow: inset -1px -1px #ffffff, inset 1px 1px #808080 !important;
-}
-
-[data-theme='w3-1'] .queue-round-btn:hover:not(:disabled):not(.active) {
-  background: #d0d0d0 !important;
-  color: #000000 !important;
-}
-
-/* Progress Bar */
-[data-theme='w3-1'] .progress-bar-track {
-  background: #ffffff;
-  box-shadow: inset 1px 1px #808080, inset -1px -1px #ffffff;
-  border-radius: 0;
-}
-
-[data-theme='w3-1'] .progress-bar-fill {
-  background: #000080;
-  border-radius: 0;
-  box-shadow: none;
-}
-
-/* Scrollbar */
-[data-theme='w3-1'] ::-webkit-scrollbar {
-  width: 16px;
-  height: 16px;
-}
-
-[data-theme='w3-1'] ::-webkit-scrollbar-track {
-  background: #c0c0c0;
-}
-
-[data-theme='w3-1'] ::-webkit-scrollbar-thumb {
-  background: #c0c0c0;
-  border: 1px solid #000000;
-  box-shadow: inset 1px 1px #ffffff, inset -1px -1px #808080;
-}
-
-/* Cards */
-[data-theme='w3-1'] .card {
-  background: #ffffff;
-  border: 2px solid #000000;
-  box-shadow: inset 1px 1px #ffffff, inset -1px -1px #808080;
-}
-
-/* Glass (Live Dropdown etc.) */
-[data-theme='w3-1'] .glass {
-  background: #c0c0c0 !important;
-  backdrop-filter: none !important;
-  -webkit-backdrop-filter: none !important;
-  border: 2px solid #000000;
-  box-shadow: inset 1px 1px #ffffff, inset -1px -1px #808080;
-  color: #000000;
-}
-
-[data-theme='w3-1'] .glass [style*="var(--bg-hover)"] {
-  background: #d8d8d8 !important;
-  border: 1px solid #808080;
-  border-radius: 0 !important;
-}
-
-[data-theme='w3-1'] .glass [style*="var(--text-primary)"],
-[data-theme='w3-1'] .glass [style*="var(--text-secondary)"],
-[data-theme='w3-1'] .glass [style*="var(--text-muted)"] {
-  color: #000000 !important;
-}
-
-/* Universelle Hover-Zustände → navy + weiß */
-[data-theme='w3-1'] .queue-tab-btn:hover {
-  background: #d0d0d0;
-  color: #000000;
-}
-
-[data-theme='w3-1'] .settings-tab:hover {
-  background: #000080;
-  color: #ffffff;
-}
-
-[data-theme='w3-1'] .custom-select-trigger:hover {
-  background: #000080;
-  color: #ffffff;
-}
-
-[data-theme='w3-1'] .custom-select-option:hover {
-  background: #000080 !important;
-  color: #ffffff !important;
-}
-
-[data-theme='w3-1'] .artist-ext-link:hover {
-  background: #000080;
-  color: #ffffff !important;
-}
-
-[data-theme='w3-1'] .np-action-btn:hover {
-  background: #000080;
-  color: #ffffff;
-}
-
-[data-theme='w3-1'] .np-queue-item:hover,
-[data-theme='w3-1'] .np-queue-item.context-active {
-  background: #000080;
-  color: #ffffff;
-}
-
-[data-theme='w3-1'] .track-row:hover,
-[data-theme='w3-1'] .track-row.context-active {
-  background: #000080 !important;
-}
-
-[data-theme='w3-1'] .track-row:hover *,
-[data-theme='w3-1'] .track-row.context-active * {
-  color: #ffffff !important;
-}
-
-[data-theme='w3-1'] .artist-row:hover {
-  background: #000080;
-  color: #ffffff;
-}
-
-[data-theme='w3-1'] .playlist-row:hover {
-  background: #000080;
-}
-
-[data-theme='w3-1'] .playlist-row:hover,
-[data-theme='w3-1'] .playlist-row:hover * {
-  color: #ffffff;
-}
-
-[data-theme='w3-1'] .queue-item:hover,
-[data-theme='w3-1'] .queue-item.context-active {
-  background: #000080 !important;
-}
-
-[data-theme='w3-1'] .queue-item:hover .queue-item-title,
-[data-theme='w3-1'] .queue-item:hover .queue-item-artist,
-[data-theme='w3-1'] .queue-item:hover .queue-item-duration,
-[data-theme='w3-1'] .queue-item.context-active .queue-item-title,
-[data-theme='w3-1'] .queue-item.context-active .queue-item-artist,
-[data-theme='w3-1'] .queue-item.context-active .queue-item-duration {
-  color: #ffffff;
-}
-
-[data-theme='w3-1'] .player-btn:hover {
-  background: #000080;
-  color: #ffffff;
-}
-
-[data-theme='w3-1'] .player-btn-primary {
-  background: #c0c0c0 !important;
-  color: #000000 !important;
-}
-
-[data-theme='w3-1'] .player-btn-primary:hover {
-  background: #000080 !important;
-  color: #ffffff !important;
-}
-
-[data-theme='w3-1'] .search-result-item:hover,
-[data-theme='w3-1'] .search-result-item.active {
-  background: #000080;
-}
-
-[data-theme='w3-1'] .search-result-item:hover .search-result-name,
-[data-theme='w3-1'] .search-result-item:hover .search-result-sub,
-[data-theme='w3-1'] .search-result-item.active .search-result-name,
-[data-theme='w3-1'] .search-result-item.active .search-result-sub {
-  color: #ffffff;
-}
-
-[data-theme='w3-1'] .np-title {
-  color: #000080 !important;
-}
-
-[data-theme='w3-1'] .changelog-code {
-  background: #ffffff;
-  color: #000080;
-  border: 1px solid #808080;
-}
-
-[data-theme='w3-1'] .keybind-badge {
-  background: #c0c0c0 !important;
-  color: #000000 !important;
-  border: 1px solid #808080 !important;
-}
-
-[data-theme='w3-1'] .genre-keyword-badge {
-  background: #c0c0c0 !important;
-  color: #000000 !important;
-  border: 1px solid #808080 !important;
-}
-
-[data-theme='w3-1'] .eq-ctrl-btn {
-  background: #c0c0c0;
-  color: #000000;
-  border: 1px solid #808080;
-  box-shadow: inset 1px 1px #ffffff, inset -1px -1px #808080;
-}
-
-[data-theme='w3-1'] .eq-ctrl-btn:hover {
-  background: #000080;
-  color: #ffffff;
-}
-
-[data-theme='w3-1'] .toggle-track::before {
-  background: #c0c0c0;
-  border: 1px solid #808080;
-}
-
-[data-theme='w3-1'] .hero-eyebrow {
-  color: rgba(255, 255, 255, 0.9);
-}
-
-[data-theme='w3-1'] .hero-meta .badge {
-  background: rgba(255, 255, 255, 0.15);
-}
-
-[data-theme='w3-1'] .connection-type,
-[data-theme='w3-1'] .connection-server {
-  color: #000000;
-}
-
-[data-theme='w3-1'] .collapse-btn {
-  border-color: #808080 !important;
-}
-
-[data-theme='w3-1'] .collapse-btn:hover {
-  background: #000080 !important;
-  color: #ffffff !important;
-}
-
-[data-theme='w3-1'] .album-row-nav .nav-btn:hover:not(.disabled) {
-  background: #000080;
-  color: #ffffff;
-}
-
-[data-theme='w3-1'] .help-question:hover {
-  color: #000080;
-}
-
-[data-theme='w3-1'] .help-item-open .help-question {
-  color: #000080;
-  font-weight: bold;
-}
-
-[data-theme='w3-1'] .year-toggle:hover {
-  color: #000080;
-}
-
diff --git a/src/styles/themes/blade-cinematic-industrial.css b/src/styles/themes/blade-cinematic-industrial.css
deleted file mode 100644
index 7b03e3d2..00000000
--- a/src/styles/themes/blade-cinematic-industrial.css
+++ /dev/null
@@ -1,342 +0,0 @@
-/* ─────────────────────────────────────────────────────────────
-   Blade — Cinematic Industrial
-   ───────────────────────────────────────────────────────────── */
-
-[data-theme='blade'] {
-  color-scheme: dark;
-
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23a0a0a0%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust: #050505;
-  --ctp-mantle: #0a0a0a;
-  --ctp-base: #121212;
-  --ctp-surface0: #1a1a1a;
-  --ctp-surface1: #252525;
-  --ctp-surface2: #333333;
-  --ctp-overlay0: #4a4a4a;
-  --ctp-overlay1: #707070;
-  --ctp-overlay2: #909090;
-  --ctp-text: #e0e0e0;
-  --ctp-subtext1: #b0b0b0;
-  --ctp-subtext0: #888888;
-  --ctp-mauve: #b30000;
-  --ctp-lavender: #ff1a1a;
-  --ctp-green: #00ff66;
-  --ctp-teal: #1abc9c;
-  --ctp-sky: #3498db;
-  --ctp-blue: #2980b9;
-  --ctp-sapphire: #1f618d;
-  --ctp-pink: #e91e63;
-  --ctp-flamingo: #f06292;
-  --ctp-rosewater: #f8bbd0;
-  --ctp-yellow: #f1c40f;
-  --ctp-peach: #e67e22;
-  --ctp-maroon: #800000;
-  --ctp-red: #ff0000;
-
-  --bg-app: #121212;
-  --bg-sidebar: #0a0a0a;
-  --bg-card: #1a1a1a;
-  --bg-hover: rgba(179, 0, 0, 0.1);
-  --bg-player: #050505;
-  --bg-glass: rgba(10, 10, 10, 0.85);
-
-  --accent: #b30000;
-  --accent-dim: rgba(179, 0, 0, 0.15);
-  --accent-glow: rgba(179, 0, 0, 0.4);
-
-  --text-primary: #e0e0e0;
-  --text-secondary: #b0b0b0;
-  --text-muted: #888888;
-
-  --border: #2a2a2a;
-  --border-subtle: #1a1a1a;
-
-  --positive: #00ff66;
-  --warning: #f1c40f;
-  --danger: #ff0000;
-
-  --radius-sm: 2px;
-  --radius-md: 4px;
-  --radius-lg: 6px;
-}
-
-[data-theme='blade'] .player-bar {
-  border-top: 1px solid #222;
-  background: linear-gradient(to bottom, #0a0a0a 0%, #050505 100%);
-  box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.8);
-}
-
-[data-theme='blade'] .sidebar {
-  border-right: 1px solid #1a1a1a;
-}
-
-[data-theme='blade'] .nav-link.active {
-  background: linear-gradient(90deg, rgba(179, 0, 0, 0.2) 0%, transparent 100%);
-  color: #fff;
-}
-
-[data-theme='blade'] .nav-link.active::before {
-  box-shadow: 0 0 8px rgba(179, 0, 0, 0.5);
-}
-
-[data-theme='blade'] .player-track-name {
-  text-transform: uppercase;
-  letter-spacing: 1px;
-  font-weight: 700;
-  color: #fff;
-  text-shadow: 0 0 10px rgba(179, 0, 0, 0.3);
-}
-
-[data-theme='blade'] .btn-primary {
-  background: linear-gradient(135deg, #b30000 0%, #800000 100%);
-  border: 1px solid rgba(255, 26, 26, 0.2);
-  color: #fff;
-}
-
-/* ── T-800 — Terminator 2: Judgment Day ─────────────────────── */
-/* Endoskeleton HUD red + machine data green + industrial dark   */
-[data-theme='t-800'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ff2000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* Industrial dark — machine oil, scorched steel, warm black */
-  --ctp-crust: #080606;
-  --ctp-mantle: #0e0a0a;
-  --ctp-base: #140e0e;
-  --ctp-surface0: #1e1414;
-  --ctp-surface1: #281c1c;
-  --ctp-surface2: #342424;
-  --ctp-overlay0: #584040;
-  --ctp-overlay1: #806060;
-  --ctp-overlay2: #a88888;
-  --ctp-text: #e8d8c8;
-  /* CRT terminal warm white */
-  --ctp-subtext1: #c8b8a0;
-  --ctp-subtext0: #a08888;
-
-  /* T2 palette */
-  --ctp-red: #ff2000;
-  /* T-800 eye / HUD targeting red */
-  --ctp-maroon: #cc1800;
-  --ctp-flamingo: #ff4020;
-  --ctp-mauve: #ff2000;
-  --ctp-lavender: #ff5040;
-  --ctp-pink: #ff4020;
-  --ctp-rosewater: #ff8060;
-  --ctp-green: #00e040;
-  /* machine data readout green */
-  --ctp-teal: #00b830;
-  --ctp-sky: #40ff80;
-  --ctp-yellow: #f0a000;
-  /* Judgment Day fire / nuclear orange */
-  --ctp-peach: #ff6000;
-  /* napalm / explosion */
-  --ctp-blue: #2040c0;
-  /* future war laser / Skynet */
-  --ctp-sapphire: #1830a0;
-
-  --bg-app: #140e0e;
-  /* scorched industrial dark */
-  --bg-sidebar: #0e0a0a;
-  /* machine interior */
-  --bg-card: #1e1414;
-  --bg-hover: rgba(255, 32, 0, 0.08);
-  --bg-player: #080606;
-  /* endoskeleton chassis */
-  --bg-glass: rgba(14, 10, 10, 0.96);
-
-  --accent: #ff2000;
-  /* T-800 eye red */
-  --accent-dim: rgba(255, 32, 0, 0.12);
-  --accent-glow: rgba(255, 32, 0, 0.5);
-  --volume-accent: #00e040;
-  /* data-green for volume */
-
-  --text-primary: #e8d8c8;
-  /* warm terminal white */
-  --text-secondary: #00e040;
-  /* machine data green */
-  --text-muted: #584040;
-  --border: #2a1a1a;
-  --border-subtle: #1e1414;
-  --shadow-dropdown: rgba(0, 0, 0, 0.9);
-
-  --positive: #00e040;
-  --warning: #f0a000;
-  --danger: #ff2000;
-
-  --radius-sm: 0px;
-  --radius-md: 1px;
-  --radius-lg: 2px;
-  --radius-xl: 2px;
-}
-
-/* Sidebar = endoskeleton interior: scan-line texture + red glow */
-[data-theme='t-800'] .sidebar {
-  border-right: 2px solid #ff2000;
-  box-shadow: 2px 0 16px rgba(255, 32, 0, 0.1);
-  background-image: repeating-linear-gradient(0deg,
-      transparent,
-      transparent 3px,
-      rgba(255, 32, 0, 0.025) 3px,
-      rgba(255, 32, 0, 0.025) 4px);
-}
-
-/* Player bar = HUD targeting display */
-[data-theme='t-800'] .player-bar {
-  border-top: 2px solid #ff2000;
-  box-shadow:
-    0 -1px 0 rgba(0, 224, 64, 0.2),
-    0 -8px 28px rgba(255, 32, 0, 0.1);
-}
-
-/* Track name = TARGET ACQUIRED — red HUD uppercase */
-[data-theme='t-800'] .player-track-name {
-  color: #ff2000;
-  text-shadow: 0 0 10px rgba(255, 32, 0, 0.75), 0 0 28px rgba(255, 32, 0, 0.3);
-  text-transform: uppercase;
-  font-weight: 700;
-  letter-spacing: 0.08em;
-}
-
-/* Artist = machine data readout green */
-[data-theme='t-800'] .player-track-artist {
-  color: #00e040;
-}
-
-/* Queue album = Judgment Day orange */
-[data-theme='t-800'] .queue-meta-album {
-  color: #f0a000;
-}
-
-/* Active nav: red HUD left bar */
-[data-theme='t-800'] .nav-link.active {
-  background: linear-gradient(90deg, rgba(255, 32, 0, 0.15) 0%, transparent 100%);
-  color: #ff2000;
-}
-
-[data-theme='t-800'] .nav-link.active::before {
-  width: 3px;
-  box-shadow: 2px 0 12px rgba(255, 32, 0, 0.65);
-}
-
-/* Buttons: dark steel with red */
-[data-theme='t-800'] .btn-primary {
-  background: #ff2000;
-  color: #080606;
-  font-weight: 700;
-  text-transform: uppercase;
-  letter-spacing: 0.07em;
-  border: none;
-  border-radius: 1px;
-}
-
-[data-theme='t-800'] .btn-primary:hover {
-  background: #ff4020;
-  box-shadow: 0 0 18px rgba(255, 32, 0, 0.5);
-}
-
-/* Play button = T-800 eye glow */
-[data-theme='t-800'] .player-btn-primary {
-  background: #ff2000;
-  box-shadow: 0 0 16px rgba(255, 32, 0, 0.5);
-  color: #080606;
-}
-
-[data-theme='t-800'] .player-btn-primary:hover {
-  box-shadow: 0 0 26px rgba(255, 32, 0, 0.7);
-}
-
-/* Queue active = targeting lock — red left bar */
-[data-theme='t-800'] .queue-item.active {
-  background: rgba(255, 32, 0, 0.08);
-  box-shadow: inset 3px 0 0 #ff2000;
-}
-
-[data-theme='t-800'] .np-queue-item.active {
-  background: rgba(255, 32, 0, 0.07);
-}
-
-[data-theme='t-800'] .np-queue-item-active {
-  color: #ff2000;
-  text-shadow: 0 0 8px rgba(255, 32, 0, 0.6);
-}
-
-/* Now-playing active track = data green */
-[data-theme='t-800'] .np-album-track.active .np-album-track-title,
-[data-theme='t-800'] .np-album-track.active .np-album-track-num {
-  color: #00e040;
-  text-shadow: 0 0 8px rgba(0, 224, 64, 0.5);
-}
-
-/* Hover rows */
-[data-theme='t-800'] .track-row:hover,
-[data-theme='t-800'] .track-row.context-active {
-  background: rgba(255, 32, 0, 0.07) !important;
-  box-shadow: inset 3px 0 0 #ff2000;
-}
-
-[data-theme='t-800'] .queue-item:hover,
-[data-theme='t-800'] .queue-item.context-active {
-  background: rgba(255, 32, 0, 0.07) !important;
-  box-shadow: inset 3px 0 0 #ff2000;
-}
-
-[data-theme='t-800'] .np-queue-item:hover,
-[data-theme='t-800'] .np-queue-item.context-active {
-  background: rgba(255, 32, 0, 0.07);
-  box-shadow: inset 2px 0 0 #ff2000;
-}
-
-[data-theme='t-800'] .artist-row:hover {
-  background: rgba(255, 32, 0, 0.06);
-  box-shadow: inset 3px 0 0 #ff2000;
-}
-
-[data-theme='t-800'] .playlist-row:hover {
-  background: rgba(255, 32, 0, 0.06);
-  box-shadow: inset 3px 0 0 #ff2000;
-}
-
-/* Settings tabs: data-green active = SYSTEM ONLINE */
-[data-theme='t-800'] .settings-tab:hover {
-  background: rgba(255, 32, 0, 0.07);
-  color: #ff2000;
-}
-
-[data-theme='t-800'] .settings-tab.active {
-  background: rgba(0, 224, 64, 0.07);
-  color: #00e040;
-  box-shadow: inset 3px 0 0 #00e040;
-}
-
-/* Queue tabs */
-[data-theme='t-800'] .queue-tab-btn:hover {
-  background: rgba(255, 32, 0, 0.07);
-  color: #ff2000;
-}
-
-/* Dropdowns */
-[data-theme='t-800'] .custom-select-trigger:hover {
-  background: rgba(255, 32, 0, 0.07);
-}
-
-[data-theme='t-800'] .custom-select-option:hover {
-  background: rgba(255, 32, 0, 0.1) !important;
-  color: #ff2000 !important;
-}
-
-/* Artist pills = Skynet blue */
-[data-theme='t-800'] .artist-ext-link:hover {
-  background: rgba(32, 64, 192, 0.15);
-  color: #4060e0 !important;
-  border-color: rgba(32, 64, 192, 0.4) !important;
-}
-
-/* Connection indicators */
-[data-theme='t-800'] .connection-type,
-[data-theme='t-800'] .connection-server {
-  color: #00e040;
-}
-
diff --git a/src/styles/themes/button-variants.css b/src/styles/themes/button-variants.css
index 2fa9df7f..4bc10ac7 100644
--- a/src/styles/themes/button-variants.css
+++ b/src/styles/themes/button-variants.css
@@ -14,7 +14,7 @@
 
 .btn-primary {
   background: var(--accent);
-  color: var(--ctp-crust);
+  color: var(--text-on-accent);
   font-weight: 600;
   /* Match .btn-surface border box so toggling primary/surface does not shift layout. */
   border: 1px solid transparent;
@@ -38,19 +38,19 @@
 }
 
 .btn-ghost:hover {
-  background: var(--bg-hover);
+  background: var(--button-hover);
   color: var(--text-primary);
 }
 
 .btn-surface {
   background: var(--bg-card);
   color: var(--text-primary);
-  border: 1px solid var(--ctp-surface1);
+  border: 1px solid var(--border);
 }
 
 .btn-surface:hover {
-  background: var(--bg-hover);
-  border-color: var(--ctp-overlay0);
+  background: var(--button-hover);
+  border-color: var(--border);
 }
 
 .btn-danger {
diff --git a/src/styles/themes/carbon-grey.css b/src/styles/themes/carbon-grey.css
deleted file mode 100644
index 58b946cd..00000000
--- a/src/styles/themes/carbon-grey.css
+++ /dev/null
@@ -1,68 +0,0 @@
-/* ─── Carbon Grey ─── */
-[data-theme='carbon-grey'] {
-  color-scheme: dark;
-
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23b4bcc8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
-
-  /* Backgrounds */
-  --ctp-crust:    #0f0f10;
-  --ctp-mantle:   #141416;
-  --ctp-base:     #18181b;
-  --ctp-surface0: #1f1f23;
-  --ctp-surface1: #26262b;
-  --ctp-surface2: #2e2e34;
-
-  /* Overlays */
-  --ctp-overlay0: #3f3f46;
-  --ctp-overlay1: #52525b;
-  --ctp-overlay2: #71717a;
-
-  /* Text */
-  --ctp-text:     #e5e7eb;
-  --ctp-subtext1: #9ca3af;
-  --ctp-subtext0: #6b7280;
-
-  /* Grey accent */
-  --ctp-teal:      #9ca3af;
-  --ctp-sky:       #9ca3af;
-  --ctp-sapphire:  #6b7280;
-  --ctp-blue:      #52525b;
-  --ctp-lavender:  #9ca3af;
-  --ctp-mauve:     #6b7280;
-  --ctp-pink:      #52525b;
-  --ctp-flamingo:  #9ca3af;
-  --ctp-rosewater: #6b7280;
-
-  /* Semantic */
-  --ctp-red:     #ef4444;
-  --ctp-maroon:  #f97316;
-  --ctp-peach:   #f97316;
-  --ctp-yellow:  #eab308;
-  --ctp-green:   #22c55e;
-
-  /* UI tokens */
-  --bg-app:      #0f0f10;
-  --bg-sidebar:  #141416;
-  --bg-card:     #18181b;
-  --bg-hover:    #26262b;
-  --bg-player:   #141416;
-  --bg-glass:    rgba(15,15,16,0.95);
-
-  --accent:      #b4bcc8;
-  --accent-dim:  rgba(156,163,175,0.08);
-  --accent-glow: rgba(156,163,175,0.15);
-
-  --text-primary:   #e5e7eb;
-  --text-secondary: #9ca3af;
-  --text-muted:     #52525b;
-
-  --border:          #26262b;
-  --border-subtle:   #18181b;
-  --border-dropdown: #2e2e34;
-  --shadow-dropdown: rgba(0,0,0,0.9);
-
-  --positive: #22c55e;
-  --warning:  #eab308;
-  --danger:   #ef4444;
-}
-
diff --git a/src/styles/themes/carbonfox.css b/src/styles/themes/carbonfox.css
deleted file mode 100644
index a5b4bb20..00000000
--- a/src/styles/themes/carbonfox.css
+++ /dev/null
@@ -1,53 +0,0 @@
-/* ─── Carbonfox ─── */
-[data-theme='carbonfox'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23f2f4f8%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust: #121212;
-  --ctp-mantle: #121212;
-  --ctp-base: #161616;
-  --ctp-surface0: #1c1c1c;
-  --ctp-surface1: #222222;
-  --ctp-surface2: #2e2e2e;
-  --ctp-overlay0: #525253;
-  --ctp-overlay1: #525253;
-  --ctp-overlay2: #c1c7cd;
-  --ctp-text: #f2f4f8;
-  --ctp-subtext1: #dde1e6;
-  --ctp-subtext0: #c1c7cd;
-  --ctp-mauve: #be95ff;
-  --ctp-lavender: #78a9ff;
-  --ctp-pink: #ff7eb6;
-  --ctp-flamingo: #ee5396;
-  --ctp-rosewater: #ff7eb6;
-  --ctp-blue: #78a9ff;
-  --ctp-sapphire: #33b1ff;
-  --ctp-sky: #33b1ff;
-  --ctp-teal: #3ddbd9;
-  --ctp-green: #25be6a;
-  --ctp-yellow: #08bdba;
-  --ctp-peach: #3ddbd9;
-  --ctp-maroon: #ee5396;
-  --ctp-red: #ee5396;
-
-  --bg-app: #161616;
-  --bg-sidebar: #121212;
-  --bg-card: #1c1c1c;
-  --bg-hover: #222222;
-  --bg-player: #121212;
-  --bg-glass: rgba(22, 22, 22, 0.82);
-  --accent: #be95ff;
-  --accent-dim: rgba(190, 149, 255, 0.15);
-  --accent-glow: rgba(190, 149, 255, 0.3);
-  --text-primary: #f2f4f8;
-  --text-secondary: #dde1e6;
-  --text-muted: #878d96;
-  --border: #222222;
-  --border-subtle: #1c1c1c;
-  --border-dropdown: #2e2e2e;
-  --shadow-dropdown: rgba(0, 0, 0, 0.7);
-  --positive: #25be6a;
-  --warning: #08bdba;
-  --danger: #ee5396;
-}
-
diff --git a/src/styles/themes/catppuccin-frapp-variables.css b/src/styles/themes/catppuccin-frapp-variables.css
deleted file mode 100644
index 0871a94b..00000000
--- a/src/styles/themes/catppuccin-frapp-variables.css
+++ /dev/null
@@ -1,50 +0,0 @@
-/* ─── Catppuccin Frappé Variables ─── */
-[data-theme='frappe'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23b5bfe2%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-  --ctp-rosewater: #f2d5cf;
-  --ctp-flamingo: #eebebe;
-  --ctp-pink: #f4b8e4;
-  --ctp-mauve: #ca9ee6;
-  --ctp-red: #e78284;
-  --ctp-maroon: #ea999c;
-  --ctp-peach: #ef9f76;
-  --ctp-yellow: #e5c890;
-  --ctp-green: #a6d189;
-  --ctp-teal: #81c8be;
-  --ctp-sky: #99d1db;
-  --ctp-sapphire: #85c1dc;
-  --ctp-blue: #8caaee;
-  --ctp-lavender: #babbf1;
-  --ctp-text: #c6d0f5;
-  --ctp-subtext1: #b5bfe2;
-  --ctp-subtext0: #a5adce;
-  --ctp-overlay2: #949cbb;
-  --ctp-overlay1: #838ba7;
-  --ctp-overlay0: #737994;
-  --ctp-surface2: #626880;
-  --ctp-surface1: #51576d;
-  --ctp-surface0: #414559;
-  --ctp-base: #303446;
-  --ctp-mantle: #292c3c;
-  --ctp-crust: #232634;
-
-  --bg-app: var(--ctp-base);
-  --bg-sidebar: var(--ctp-mantle);
-  --bg-card: var(--ctp-surface0);
-  --bg-hover: var(--ctp-surface1);
-  --bg-player: var(--ctp-crust);
-  --bg-glass: rgba(48, 52, 70, 0.75);
-  --accent: var(--ctp-mauve);
-  --accent-dim: rgba(202, 158, 230, 0.15);
-  --accent-glow: rgba(202, 158, 230, 0.3);
-  --text-primary: var(--ctp-text);
-  --text-secondary: var(--ctp-subtext1);
-  --text-muted: var(--ctp-subtext0);
-  --border: var(--ctp-surface1);
-  --border-subtle: var(--ctp-surface0);
-  --positive: var(--ctp-green);
-  --warning: var(--ctp-yellow);
-  --danger: var(--ctp-red);
-}
-
diff --git a/src/styles/themes/catppuccin-macchiato-variables.css b/src/styles/themes/catppuccin-macchiato-variables.css
deleted file mode 100644
index e97724f3..00000000
--- a/src/styles/themes/catppuccin-macchiato-variables.css
+++ /dev/null
@@ -1,50 +0,0 @@
-/* ─── Catppuccin Macchiato Variables ─── */
-[data-theme='macchiato'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23b8c0e0%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-  --ctp-rosewater: #f4dbd6;
-  --ctp-flamingo: #f0c6c6;
-  --ctp-pink: #f5bde6;
-  --ctp-mauve: #c6a0f6;
-  --ctp-red: #ed8796;
-  --ctp-maroon: #ee99a0;
-  --ctp-peach: #f5a97f;
-  --ctp-yellow: #eed49f;
-  --ctp-green: #a6da95;
-  --ctp-teal: #8bd5ca;
-  --ctp-sky: #91d7e3;
-  --ctp-sapphire: #7dc4e4;
-  --ctp-blue: #8aadf4;
-  --ctp-lavender: #b7bdf8;
-  --ctp-text: #cad3f5;
-  --ctp-subtext1: #b8c0e0;
-  --ctp-subtext0: #a5adcb;
-  --ctp-overlay2: #939ab7;
-  --ctp-overlay1: #8087a2;
-  --ctp-overlay0: #6e738d;
-  --ctp-surface2: #5b6078;
-  --ctp-surface1: #494d64;
-  --ctp-surface0: #363a4f;
-  --ctp-base: #24273a;
-  --ctp-mantle: #1e2030;
-  --ctp-crust: #181926;
-
-  --bg-app: var(--ctp-base);
-  --bg-sidebar: var(--ctp-mantle);
-  --bg-card: var(--ctp-surface0);
-  --bg-hover: var(--ctp-surface1);
-  --bg-player: var(--ctp-crust);
-  --bg-glass: rgba(36, 39, 58, 0.75);
-  --accent: var(--ctp-mauve);
-  --accent-dim: rgba(198, 160, 246, 0.15);
-  --accent-glow: rgba(198, 160, 246, 0.3);
-  --text-primary: var(--ctp-text);
-  --text-secondary: var(--ctp-subtext1);
-  --text-muted: var(--ctp-subtext0);
-  --border: var(--ctp-surface1);
-  --border-subtle: var(--ctp-surface0);
-  --positive: var(--ctp-green);
-  --warning: var(--ctp-yellow);
-  --danger: var(--ctp-red);
-}
-
diff --git a/src/styles/themes/catppuccin-mocha-variables.css b/src/styles/themes/catppuccin-mocha-variables.css
index 7b2ffdf4..bb1350d6 100644
--- a/src/styles/themes/catppuccin-mocha-variables.css
+++ b/src/styles/themes/catppuccin-mocha-variables.css
@@ -48,5 +48,21 @@
   --positive: var(--ctp-green);
   --warning: var(--ctp-yellow);
   --danger: var(--ctp-red);
+
+  /* Semantic tokens added for the theme-store contract (B0): readable names that
+     replace direct --ctp-* use in components. Defined here on :root so they
+     resolve per-theme automatically (every theme sets --ctp-*); a theme can
+     override any of them directly. See workdocs theme-store/b0-semantic-refactor. */
+  --highlight: var(--ctp-yellow);
+  --accent-2: var(--ctp-blue);
+  --bg-deep: var(--ctp-crust);
+  --bg-elevated: var(--ctp-surface2);
+  --text-on-accent: var(--ctp-crust);
+
+  /* Player readout colours — optional. Default to the standard text tones so
+     nothing changes unless a theme overrides them (e.g. a coloured LCD-style
+     track name). */
+  --player-title: var(--text-primary);
+  --player-artist: var(--text-secondary);
 }
 
diff --git a/src/styles/themes/classic-winamp-winamp-2-x-base-skin.css b/src/styles/themes/classic-winamp-winamp-2-x-base-skin.css
deleted file mode 100644
index 6bab221d..00000000
--- a/src/styles/themes/classic-winamp-winamp-2-x-base-skin.css
+++ /dev/null
@@ -1,67 +0,0 @@
-/* ─── Classic Winamp — Winamp 2.x Base Skin ─── */
-[data-theme='wnamp'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23d4d4dc%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* ── Palette ──
-     Contrast audit (vs. --bg-app #2b2b3a, L≈0.025):
-       text-primary   9.6:1  AAA ✓ (raised from 8.5:1)
-       text-secondary 5.5:1  AA  ✓
-       text-muted     4.7:1  AA  ✓ (was 5.6:1 but BRIGHTER than secondary — hierarchy fixed)
-       accent (gold)  8.4:1  AAA ✓
-       positive       6.6:1  AA+ ✓
-       danger         4.9:1  AA  ✓ (raised from 2.46:1 — was below AA)
-     Column grip + border-subtle raised from 1.0:1 / 1.19:1 — see overrides.
-  */
-  --ctp-crust: #000000;
-  --ctp-mantle: #1e1e28;
-  --ctp-base: #2b2b3a;
-  --ctp-surface0: #353545;
-  --ctp-surface1: #4a4a60;         /* raised from #404055 for visible borders/grips */
-  --ctp-surface2: #5a5a78;
-  --ctp-overlay0: #7676a0;         /* raised from #5a5a75 */
-  --ctp-overlay1: #8a8a96;
-  --ctp-overlay2: #a4a4b4;
-  --ctp-text: #d4d4dc;             /* raised from #c8c8d0 for 9.6:1 */
-  --ctp-subtext1: #b4b4c0;
-  --ctp-subtext0: #8a8a96;
-  /* Winamp iconic LCD green + gold accent */
-  --ctp-mauve: #d4cc46;
-  --ctp-lavender: #e0d860;
-  --ctp-green: #00ff00;
-  --ctp-teal: #00cc88;
-  --ctp-sky: #5ab8e0;
-  --ctp-blue: #4898d0;
-  --ctp-sapphire: #3878b8;
-  --ctp-pink: #c06888;
-  --ctp-flamingo: #b85858;
-  --ctp-rosewater: #c88080;
-  --ctp-yellow: #e8c050;
-  --ctp-peach: #d08840;
-  --ctp-maroon: #ff6b6b;           /* raised from #a03030 — AA compliant */
-  --ctp-red: #ff6b6b;              /* raised from #c03030 — 4.9:1 AA ✓ */
-
-  /* ── Semantic tokens ── */
-  --bg-app: #2b2b3a;
-  --bg-sidebar: #1e1e28;
-  --bg-card: #353545;
-  --bg-hover: #484860;             /* raised from #404055 — 1.6:1 vs card, spürbarer Hover */
-  --bg-player: #000000;
-  --bg-glass: rgba(43, 43, 58, 0.92);
-  --accent: #d4cc46;
-  --accent-dim: rgba(212, 204, 70, 0.18);
-  --accent-glow: rgba(212, 204, 70, 0.40);
-  --volume-accent: #de9b35;
-  --text-primary: #d4d4dc;
-  --text-secondary: #b4b4c0;       /* raised from #a0a0ac for better AA margin */
-  --text-muted: #949ab0;           /* 4.7:1 AA ✓, now DIMMER than secondary (hierarchy fixed) */
-  --border: #7676a0;               /* 2.7:1 vs bg-card — visible (was 1.79:1) */
-  --border-subtle: #484860;        /* 1.5:1 — was #353545 identical with bg-card (1.0:1!) */
-  --positive: #00cc66;
-  --warning: #d4cc46;
-  --danger: #ff6b6b;               /* 4.9:1 AA ✓, was #c03030 (2.46:1 FAIL) */
-  --waveform-played:   #d4cc46;
-  --waveform-buffered: #8a8a96;
-  --waveform-unplayed: #4a4a60;
-}
-
diff --git a/src/styles/themes/community-themes.css b/src/styles/themes/community-themes.css
deleted file mode 100644
index 260b1ae5..00000000
--- a/src/styles/themes/community-themes.css
+++ /dev/null
@@ -1,2 +0,0 @@
-/* ─── COMMUNITY THEMES ─── */
-
diff --git a/src/styles/themes/copper-oxide.css b/src/styles/themes/copper-oxide.css
deleted file mode 100644
index 57e88b62..00000000
--- a/src/styles/themes/copper-oxide.css
+++ /dev/null
@@ -1,68 +0,0 @@
-/* ─── Copper Oxide ─── */
-[data-theme='copper-oxide'] {
-  color-scheme: dark;
-
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2345b8b0' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
-
-  /* Backgrounds */
-  --ctp-crust:    #080f0e;
-  --ctp-mantle:   #0c1614;
-  --ctp-base:     #101a18;
-  --ctp-surface0: #131f1c;
-  --ctp-surface1: #1a2e2b;
-  --ctp-surface2: #203c38;
-
-  /* Overlays */
-  --ctp-overlay0: #256860;
-  --ctp-overlay1: #358880;
-  --ctp-overlay2: #45a89a;
-
-  /* Text */
-  --ctp-text:     #d8f0ee;
-  --ctp-subtext1: #a0d8d4;
-  --ctp-subtext0: #68b8b0;
-
-  /* Teal accent */
-  --ctp-teal:      #4ecdc4;
-  --ctp-sky:       #4ecdc4;
-  --ctp-sapphire:  #35a09a;
-  --ctp-blue:      #207870;
-  --ctp-lavender:  #4ecdc4;
-  --ctp-mauve:     #35a09a;
-  --ctp-pink:      #207870;
-  --ctp-flamingo:  #4ecdc4;
-  --ctp-rosewater: #35a09a;
-
-  /* Semantic */
-  --ctp-red:     #ff4444;
-  --ctp-maroon:  #ff8844;
-  --ctp-peach:   #ff8844;
-  --ctp-yellow:  #ffcc44;
-  --ctp-green:   #44ff88;
-
-  /* UI tokens */
-  --bg-app:      #101a18;
-  --bg-sidebar:  #0c1614;
-  --bg-card:     #131f1c;
-  --bg-hover:    #1a2e2b;
-  --bg-player:   #0c1614;
-  --bg-glass:    rgba(16, 26, 24, 0.95);
-
-  --accent:      #45b8b0;
-  --accent-dim:  rgba(78, 205, 196, 0.07);
-  --accent-glow: rgba(78, 205, 196, 0.14);
-
-  --text-primary:   #d8f0ee;
-  --text-secondary: #68b8b0;
-  --text-muted:     #256860;
-
-  --border:          #1a2e2b;
-  --border-subtle:   #131f1c;
-  --border-dropdown: #203c38;
-  --shadow-dropdown: rgba(0, 0, 0, 0.90);
-
-  --positive: #44ff88;
-  --warning:  #ffcc44;
-  --danger:   #ff4444;
-}
-
diff --git a/src/styles/themes/cupertino-beats.css b/src/styles/themes/cupertino-beats.css
deleted file mode 100644
index bba45a89..00000000
--- a/src/styles/themes/cupertino-beats.css
+++ /dev/null
@@ -1,97 +0,0 @@
-/* ─── Cupertino Beats ─── */
-[data-theme='cupertino-beats'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23a1a1a1%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust: #000000;
-  --ctp-mantle: #121212;
-  --ctp-base: #1c1c1e;
-  --ctp-surface0: #2c2c2e;
-  --ctp-surface1: #3a3a3c;
-  --ctp-surface2: #48484a;
-  --ctp-overlay0: #636366;
-  --ctp-overlay1: #8e8e93;
-  --ctp-overlay2: #aeaeb2;
-  --ctp-text: #ffffff;
-  --ctp-subtext1: #ebebf599;
-  --ctp-subtext0: #ebebf560;
-
-  --ctp-mauve: #fa243c;
-  --ctp-lavender: #ff5e71;
-  --ctp-green: #34c759;
-  --ctp-teal: #30b0c7;
-  --ctp-sky: #5ac8fa;
-  --ctp-blue: #007aff;
-  --ctp-sapphire: #0051d5;
-  --ctp-pink: #ff2d55;
-  --ctp-flamingo: #ff3b30;
-  --ctp-rosewater: #ff9f0a;
-  --ctp-yellow: #ffcc00;
-  --ctp-peach: #ff9500;
-  --ctp-maroon: #af52de;
-  --ctp-red: #ff3b30;
-
-  --bg-app: #1c1c1e;
-  --bg-sidebar: rgba(18, 18, 18, 0.75);
-  --bg-card: #2c2c2e;
-  --bg-hover: rgba(255, 255, 255, 0.08);
-  --bg-player: rgba(0, 0, 0, 0.85);
-  --bg-glass: rgba(28, 28, 30, 0.6);
-
-  --accent: #fa243c;
-  --accent-dim: rgba(250, 36, 60, 0.15);
-  --accent-glow: rgba(250, 36, 60, 0.3);
-  --volume-accent: #fa243c;
-
-  --text-primary: #ffffff;
-  --text-secondary: rgba(235, 235, 245, 0.6);
-  --text-muted: rgba(235, 235, 245, 0.3);
-
-  --border: rgba(255, 255, 255, 0.1);
-  --border-subtle: rgba(255, 255, 255, 0.05);
-
-  --positive: #34c759;
-  --warning: #ffcc00;
-  --danger: #ff3b30;
-
-  --radius-sm: 8px;
-  --radius-md: 12px;
-  --radius-lg: 20px;
-  --radius-xl: 28px;
-  --radius-full: 9999px;
-
-  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.5);
-  --shadow-md: 0 4px 20px rgba(0, 0, 0, 0.4);
-  --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.6);
-
-  --transition-fast: 150ms ease;
-  --transition-med: 250ms ease;
-  --transition-slow: 350ms ease;
-
-  --sidebar-width: 220px;
-  --player-height: 88px;
-}
-
-[data-theme='cupertino-beats'] .sidebar {
-  backdrop-filter: blur(40px) saturate(180%);
-  -webkit-backdrop-filter: blur(40px) saturate(180%);
-  border-right: 1px solid var(--border);
-}
-
-[data-theme='cupertino-beats'] .player-bar {
-  backdrop-filter: blur(30px) saturate(150%);
-  -webkit-backdrop-filter: blur(30px) saturate(150%);
-  border-top: 1px solid var(--border);
-}
-
-[data-theme='cupertino-beats'] .nav-link.active {
-  background: var(--accent-dim);
-  color: var(--accent);
-  font-weight: 600;
-}
-
-[data-theme='cupertino-beats'] .nav-link.active::before {
-  width: 4px;
-  border-radius: 0 4px 4px 0;
-}
-
diff --git a/src/styles/themes/cyberlink-powerdvd.css b/src/styles/themes/cyberlink-powerdvd.css
deleted file mode 100644
index 00ec5bce..00000000
--- a/src/styles/themes/cyberlink-powerdvd.css
+++ /dev/null
@@ -1,259 +0,0 @@
-/* ─── CyberLink PowerDVD ─── */
-/* Midnight navy-blue darkness — not flat black, but that specific cinema-hall depth */
-[data-theme='p-dvd'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%235a7090%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* ── Palette — midnight navy spectrum ── */
-  --ctp-crust: #020306;
-  /* cinema blackout */
-  --ctp-mantle: #060810;
-  /* control deck depth */
-  --ctp-base: #0a0d18;
-  /* main chassis — navy-black */
-  --ctp-surface0: #10141f;
-  --ctp-surface1: #171c2a;
-  --ctp-surface2: #1f2535;
-  --ctp-overlay0: #2c3548;
-  --ctp-overlay1: #3c4860;
-  --ctp-overlay2: #506078;
-  --ctp-text: #a8b8d0;
-  /* blue-tinted label silver */
-  --ctp-subtext1: #7890b0;
-  --ctp-subtext0: #506080;
-  /* PowerDVD blue spectrum */
-  --ctp-mauve: #0088e8;
-  /* PowerDVD blue — primary */
-  --ctp-lavender: #00a8ff;
-  --ctp-sky: #00ccff;
-  /* glow highlight */
-  --ctp-teal: #00b8cc;
-  --ctp-blue: #0070cc;
-  --ctp-sapphire: #0055aa;
-  --ctp-green: #00cc66;
-  --ctp-yellow: #ccaa00;
-  --ctp-peach: #e07040;
-  --ctp-pink: #cc5588;
-  --ctp-flamingo: #bb4466;
-  --ctp-rosewater: #cc6666;
-  --ctp-maroon: #aa3333;
-  --ctp-red: #cc2222;
-
-  /* ── Semantic tokens ── */
-  --bg-app: #0a0d18;
-  --bg-sidebar: #060810;
-  --bg-card: #10141f;
-  --bg-hover: #171c2a;
-  --bg-player: #020306;
-  --bg-glass: rgba(10, 13, 24, 0.96);
-  --accent: #0088e8;
-  --accent-dim: rgba(0, 136, 232, 0.14);
-  --accent-glow: rgba(0, 136, 232, 0.40);
-  --text-primary: #a8b8d0;
-  --text-secondary: #6880a8;
-  --text-muted: #506080;
-  --border: #1a2030;
-  --border-subtle: #10141e;
-  --positive: #00cc66;
-  --warning: #ccaa00;
-  --danger: #cc2222;
-}
-
-/* ── App shell: very subtle navy depth gradient ── */
-[data-theme='p-dvd'] .app-shell {
-  background: linear-gradient(160deg, #0c1020 0%, #080c18 50%, #060910 100%);
-}
-
-/* ── Sidebar: darkest navy — control panel behind the disc tray ── */
-[data-theme='p-dvd'] .sidebar {
-  background: linear-gradient(180deg, #07091280 0%, #060810 40%, #050710 100%);
-  border-right: 1px solid #141824;
-  box-shadow: inset -1px 0 0 rgba(0, 136, 232, 0.08), 2px 0 12px rgba(0, 0, 0, 0.7);
-}
-
-/* Active nav: PowerDVD blue LED strip */
-[data-theme='p-dvd'] .nav-link.active {
-  color: #00a8ff;
-}
-
-[data-theme='p-dvd'] .nav-link.active::before {
-  background: #0088e8;
-  box-shadow: 0 0 8px rgba(0, 136, 232, 0.7);
-}
-
-/* ── Player bar: cinema control deck — pure black + blue accent top border ── */
-[data-theme='p-dvd'] .player-bar {
-  background: linear-gradient(180deg, #050710 0%, #020306 100%);
-  border-top: 1px solid #0a1828;
-  box-shadow:
-    inset 0 2px 0 rgba(0, 136, 232, 0.18),
-    inset 0 1px 0 rgba(0, 200, 255, 0.08),
-    0 -4px 24px rgba(0, 0, 0, 0.9);
-}
-
-/* Track name: PowerDVD blue LED display glow */
-[data-theme='p-dvd'] .player-track-name {
-  color: #00ccff;
-  text-shadow:
-    0 0 5px rgba(0, 204, 255, 0.95),
-    0 0 12px rgba(0, 136, 232, 0.70),
-    0 0 24px rgba(0, 100, 200, 0.35);
-  letter-spacing: 0.03em;
-}
-
-[data-theme='p-dvd'] .player-track-artist {
-  color: #0088e8;
-  text-shadow: 0 0 6px rgba(0, 136, 232, 0.60);
-  opacity: 1;
-}
-
-[data-theme='p-dvd'] .player-time {
-  color: #0088e8;
-  text-shadow: 0 0 5px rgba(0, 136, 232, 0.65);
-}
-
-/* ── Chrome transport buttons: silver against navy — the iconic contrast ── */
-[data-theme='p-dvd'] .player-btn,
-[data-theme='p-dvd'] .player-btn-primary {
-  background: linear-gradient(170deg, #e8e8e8 0%, #ffffff 30%, #c0c0c0 70%, #989898 100%);
-  color: #1a1a1a;
-  border: 1px solid #707070;
-  box-shadow:
-    0 3px 8px rgba(0, 0, 0, 0.8),
-    0 1px 2px rgba(0, 0, 0, 0.6),
-    inset 0 1px 0 rgba(255, 255, 255, 0.9),
-    inset 0 -1px 0 rgba(0, 0, 0, 0.2);
-}
-
-[data-theme='p-dvd'] .player-btn:hover,
-[data-theme='p-dvd'] .player-btn-primary:hover {
-  background: linear-gradient(170deg, #f5f5f5 0%, #ffffff 30%, #d0d0d0 70%, #aaaaaa 100%);
-  box-shadow:
-    0 4px 10px rgba(0, 0, 0, 0.8),
-    0 1px 3px rgba(0, 0, 0, 0.6),
-    inset 0 1px 0 rgba(255, 255, 255, 1),
-    inset 0 -1px 0 rgba(0, 0, 0, 0.2),
-    0 0 10px rgba(0, 136, 232, 0.20);
-}
-
-/* ── Regular buttons: navy panel style ── */
-[data-theme='p-dvd'] .btn {
-  background: linear-gradient(180deg, #171c2a 0%, #10141f 100%);
-  color: #a8b8d0;
-  border: 1px solid #1f2a3e;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), 0 1px 3px rgba(0, 0, 0, 0.6);
-}
-
-[data-theme='p-dvd'] .btn:hover {
-  background: linear-gradient(180deg, #1f2535 0%, #171c2a 100%);
-  border-color: #2a3850;
-}
-
-[data-theme='p-dvd'] .btn-primary {
-  background: linear-gradient(180deg, #00a8ff 0%, #0070cc 100%);
-  color: #ffffff;
-  border: 1px solid #0055aa;
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.25),
-    0 1px 4px rgba(0, 0, 0, 0.5),
-    0 0 10px rgba(0, 136, 232, 0.35);
-}
-
-/* Active queue round buttons: white on blue */
-[data-theme='p-dvd'] .queue-round-btn.active {
-  color: #ffffff;
-}
-
-/* ── Cards / panels: navy inset ── */
-[data-theme='p-dvd'] .glass,
-[data-theme='p-dvd'] .card {
-  background: rgba(16, 20, 31, 0.90);
-  border: 1px solid #1a2030;
-  box-shadow: inset 0 1px 0 rgba(0, 136, 232, 0.04), 0 2px 8px rgba(0, 0, 0, 0.5);
-}
-
-/* ── Content header: dark navy band ── */
-[data-theme='p-dvd'] .content-header {
-  background: linear-gradient(180deg, rgba(16, 20, 31, 0.80) 0%, rgba(10, 13, 24, 0.30) 100%);
-  border-bottom: 1px solid #1a2030;
-}
-
-/* ── Hover / active states: blue LED glow ── */
-[data-theme='p-dvd'] .track-row:hover,
-[data-theme='p-dvd'] .track-row.context-active {
-  background: rgba(0, 136, 232, 0.07);
-  box-shadow: inset 3px 0 0 #0088e8;
-}
-
-[data-theme='p-dvd'] .queue-item:hover,
-[data-theme='p-dvd'] .queue-item.context-active {
-  background: rgba(0, 136, 232, 0.07);
-}
-
-[data-theme='p-dvd'] .queue-item.active {
-  background: rgba(0, 136, 232, 0.12);
-  border-left: 2px solid #0088e8;
-}
-
-[data-theme='p-dvd'] .np-queue-item.active {
-  background: rgba(0, 136, 232, 0.08);
-}
-
-[data-theme='p-dvd'] .np-queue-item-active {
-  color: #00a8ff;
-}
-
-[data-theme='p-dvd'] .np-queue-item:hover,
-[data-theme='p-dvd'] .np-queue-item.context-active {
-  background: rgba(0, 136, 232, 0.06);
-}
-
-[data-theme='p-dvd'] .np-album-track.active .np-album-track-title,
-[data-theme='p-dvd'] .np-album-track.active .np-album-track-num {
-  color: #00a8ff;
-}
-
-[data-theme='p-dvd'] .artist-row:hover {
-  background: rgba(0, 136, 232, 0.06);
-  box-shadow: inset 3px 0 0 #0088e8;
-}
-
-[data-theme='p-dvd'] .playlist-row:hover {
-  background: rgba(0, 136, 232, 0.06);
-  box-shadow: inset 3px 0 0 #0088e8;
-}
-
-[data-theme='p-dvd'] .settings-tab:hover {
-  background: rgba(0, 136, 232, 0.08);
-  color: #00a8ff;
-}
-
-[data-theme='p-dvd'] .settings-tab.active {
-  background: rgba(0, 136, 232, 0.14);
-  color: #00a8ff;
-  border-color: #0088e8;
-}
-
-[data-theme='p-dvd'] .queue-tab-btn:hover {
-  background: rgba(0, 136, 232, 0.08);
-  color: #00a8ff;
-}
-
-[data-theme='p-dvd'] .custom-select-trigger:hover {
-  background: rgba(0, 136, 232, 0.08);
-}
-
-[data-theme='p-dvd'] .custom-select-option:hover {
-  background: rgba(0, 136, 232, 0.12);
-}
-
-[data-theme='p-dvd'] .artist-ext-link:hover {
-  background: rgba(0, 136, 232, 0.10);
-  border-color: #0088e8;
-}
-
-[data-theme='p-dvd'] .connection-type,
-[data-theme='p-dvd'] .connection-server {
-  color: #4880b8;
-}
-
diff --git a/src/styles/themes/d-oh-matic.css b/src/styles/themes/d-oh-matic.css
deleted file mode 100644
index bfad8c7c..00000000
--- a/src/styles/themes/d-oh-matic.css
+++ /dev/null
@@ -1,81 +0,0 @@
-/* ─── D'oh-matic ─── */
-[data-theme='doh-matic'] {
-  color-scheme: light;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23444444%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust: #FFD90F;
-  --ctp-mantle: #BAE1FF;
-  --ctp-base: #FFFDF0;
-  --ctp-surface0: #F0F8FF;
-  --ctp-surface1: #E0EFFF;
-  --ctp-surface2: #D0E5FF;
-  --ctp-overlay0: #999999;
-  --ctp-overlay1: #777777;
-  --ctp-overlay2: #555555;
-  --ctp-text: #222222;
-  --ctp-subtext1: #444444;
-  --ctp-subtext0: #666666;
-  --ctp-mauve: #1F75FE;
-  --ctp-lavender: #4D91FF;
-  --ctp-pink: #F14E96;
-  --ctp-flamingo: #F14E96;
-  --ctp-rosewater: #FFD90F;
-  --ctp-green: #4AC948;
-  --ctp-teal: #00BFAF;
-  --ctp-sky: #4D91FF;
-  --ctp-blue: #1F75FE;
-  --ctp-sapphire: #1F75FE;
-  --ctp-yellow: #FFD90F;
-  --ctp-peach: #F26522;
-  --ctp-maroon: #CC0000;
-  --ctp-red: #ED1C24;
-
-  --bg-app: #FFFDF0;
-  --bg-sidebar: #BAE1FF;
-  --bg-card: #FFFFFF;
-  --bg-hover: rgba(31, 117, 254, 0.1);
-  --bg-player: #FFD90F;
-  --bg-glass: rgba(255, 253, 240, 0.8);
-  --accent: #1F75FE;
-  --accent-dim: rgba(31, 117, 254, 0.15);
-  --accent-glow: rgba(31, 117, 254, 0.3);
-  --text-primary: #222222;
-  --text-secondary: #444444;
-  --text-muted: #555555;
-  --border: #222222;
-  --border-subtle: rgba(0, 0, 0, 0.1);
-  --border-dropdown: #cccccc;
-  --shadow-dropdown: rgba(0, 0, 0, 0.15);
-  --positive: #4AC948;
-  --warning: #F26522;
-  --danger: #ED1C24;
-  --radius-md: 12px;
-}
-
-[data-theme='doh-matic'] .sidebar {
-  border-right: 2px solid #222222;
-}
-
-[data-theme='doh-matic'] .player-bar {
-  border-top: 3px solid #222222;
-}
-
-[data-theme='doh-matic'] .player-track-name,
-[data-theme='doh-matic'] .player-track-artist,
-[data-theme='doh-matic'] .player-time {
-  color: #222222 !important;
-}
-
-[data-theme='doh-matic'] .player-btn {
-  color: #222222;
-}
-
-[data-theme='doh-matic'] .btn-primary:hover {
-  background-color: var(--ctp-pink);
-  border-color: #222222;
-}
-
-[data-theme='doh-matic'] .btn-surface:hover {
-  background: #D0E5FF;
-}
-
diff --git a/src/styles/themes/dark-side-of-the-moon-inspired-pink-floyd.css b/src/styles/themes/dark-side-of-the-moon-inspired-pink-floyd.css
deleted file mode 100644
index fc14960b..00000000
--- a/src/styles/themes/dark-side-of-the-moon-inspired-pink-floyd.css
+++ /dev/null
@@ -1,286 +0,0 @@
-/* ─── Dark Side of the Moon (inspired) — Pink Floyd ─── */
-/* Pure void-black + prism spectrum. No colour except the rainbow.
-   Accent: spectrum cyan. Spectrum gradient as player-bar top border.
-   Track name: white (the input light beam). Performance: no patterns, no animations. */
-[data-theme='dark-side-of-the-moon'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%239B30FF%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* ── Palette — void black + prism spectrum ── */
-  --ctp-crust: #000000;
-  --ctp-mantle: #010101;
-  --ctp-base: #050505;
-  --ctp-surface0: #0A0A0A;
-  --ctp-surface1: #111111;
-  --ctp-surface2: #1A1A1A;
-  --ctp-overlay0: #333333;
-  --ctp-overlay1: #4A4A4A;
-  --ctp-overlay2: #686868;
-  --ctp-text: #F0F0F0;
-  --ctp-subtext1: #C8C8C8;
-  --ctp-subtext0: #A0A0A0;
-  --ctp-mauve: #9B30FF;
-  /* spectrum violet — primary accent */
-  --ctp-lavender: #7B00FF;
-  /* spectrum violet */
-  --ctp-pink: #FF2400;
-  /* spectrum red */
-  --ctp-flamingo: #FF7700;
-  /* spectrum orange */
-  --ctp-rosewater: #FFFFFF;
-  /* the input light beam */
-  --ctp-green: #72FF00;
-  /* spectrum green */
-  --ctp-teal: #00C8FF;
-  --ctp-sky: #9B30FF;
-  --ctp-blue: #0040FF;
-  /* spectrum blue */
-  --ctp-sapphire: #0060DD;
-  --ctp-yellow: #FFE600;
-  /* spectrum yellow */
-  --ctp-peach: #FF7700;
-  --ctp-maroon: #CC1800;
-  --ctp-red: #FF2400;
-
-  --bg-app: #050505;
-  --bg-sidebar: #020202;
-  --bg-card: #0D0D0D;
-  --bg-hover: #141414;
-  --bg-player: #010101;
-  --bg-glass: rgba(5, 5, 5, 0.96);
-  --accent: #9B30FF;
-  /* spectrum violet */
-  --accent-dim: rgba(155, 48, 255, 0.10);
-  --accent-glow: rgba(155, 48, 255, 0.28);
-  --text-primary: #F0F0F0;
-  --text-secondary: #A0A0A0;
-  --text-muted: #555555;
-  --border: rgba(255, 255, 255, 0.07);
-  --border-subtle: rgba(255, 255, 255, 0.04);
-  --border-dropdown: rgba(155, 48, 255, 0.22);
-  --shadow-dropdown: rgba(0, 0, 0, 0.99);
-  --positive: #72FF00;
-  --warning: #FFE600;
-  --danger: #FF2400;
-  --radius-sm: 2px;
-  --radius-md: 4px;
-  --radius-lg: 6px;
-
-  /* Waveform — cyan played, dark unplayed */
-  --waveform-played: #9B30FF;
-  --waveform-buffered: rgba(255, 255, 255, 0.07);
-  --waveform-unplayed: rgba(255, 255, 255, 0.04);
-
-  /* Logo — orange → cyan (the spectrum itself) */
-  --logo-color-start: #FF7700;
-  --logo-color-end: #9B30FF;
-}
-
-/* Player bar — void black, spectrum rainbow top border via ::before */
-[data-theme='dark-side-of-the-moon'] .player-bar {
-  background: #010101;
-  border-top: none;
-  position: relative;
-  box-shadow: 0 -1px 0 rgba(255, 255, 255, 0.04);
-}
-
-[data-theme='dark-side-of-the-moon'] .player-bar::before {
-  content: '';
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  height: 2px;
-  background: linear-gradient(90deg,
-      #FF2400 0%,
-      #FF7700 17%,
-      #FFE600 33%,
-      #72FF00 50%,
-      #00C8FF 67%,
-      #0040FF 83%,
-      #7B00FF 100%);
-}
-
-/* Track name — the white input light beam */
-[data-theme='dark-side-of-the-moon'] .player-track-name {
-  color: #FFFFFF;
-}
-
-/* Artist name — neutral dim */
-[data-theme='dark-side-of-the-moon'] .player-artist-name {
-  color: #888888;
-}
-
-/* Sidebar — pure void */
-[data-theme='dark-side-of-the-moon'] .sidebar {
-  background: #020202;
-  border-right: 1px solid rgba(255, 255, 255, 0.04);
-}
-
-[data-theme='dark-side-of-the-moon'] .nav-link.active {
-  background: rgba(0, 229, 255, 0.08);
-  border-left: 3px solid #00E5FF;
-  color: #00E5FF;
-}
-
-[data-theme='dark-side-of-the-moon'] .nav-link:hover:not(.active) {
-  background: rgba(255, 255, 255, 0.04);
-  border-left: 3px solid rgba(0, 229, 255, 0.30);
-  color: #F0F0F0;
-}
-
-/* Cards */
-[data-theme='dark-side-of-the-moon'] .album-card,
-[data-theme='dark-side-of-the-moon'] .artist-card {
-  background: #0D0D0D;
-}
-
-[data-theme='dark-side-of-the-moon'] .album-card:hover,
-[data-theme='dark-side-of-the-moon'] .artist-card:hover {
-  box-shadow: 0 0 0 1px rgba(0, 229, 255, 0.40), 0 4px 20px rgba(0, 229, 255, 0.08);
-}
-
-/* Track / queue rows */
-[data-theme='dark-side-of-the-moon'] .track-row:hover,
-[data-theme='dark-side-of-the-moon'] .queue-item:hover {
-  background: #141414;
-  box-shadow: inset 2px 0 0 #00E5FF;
-}
-
-/* Buttons — flat cyan, no gradient */
-[data-theme='dark-side-of-the-moon'] .player-btn-primary {
-  background: #00E5FF;
-  color: #010101;
-  box-shadow: none;
-  border: none;
-}
-
-[data-theme='dark-side-of-the-moon'] .player-btn-primary:hover {
-  background: #33EEFF;
-  box-shadow: 0 0 16px rgba(0, 229, 255, 0.40);
-}
-
-[data-theme='dark-side-of-the-moon'] .btn-primary {
-  background: #00E5FF;
-  color: #010101;
-  border: none;
-}
-
-[data-theme='dark-side-of-the-moon'] .btn-primary:hover {
-  background: #33EEFF;
-}
-
-[data-theme='dark-side-of-the-moon'] .hero-play-btn {
-  background: #00E5FF;
-  color: #010101;
-  border: none;
-  box-shadow: 0 2px 16px rgba(0, 229, 255, 0.30);
-}
-
-[data-theme='dark-side-of-the-moon'] .hero-play-btn:hover {
-  background: #33EEFF;
-  box-shadow: 0 4px 26px rgba(0, 229, 255, 0.50);
-  transform: scale(1.02);
-}
-
-[data-theme='dark-side-of-the-moon'] .album-card-details-btn {
-  background: #00E5FF;
-  color: #010101;
-  border: none;
-  box-shadow: 0 2px 10px rgba(0, 229, 255, 0.25);
-}
-
-/* Badge */
-[data-theme='dark-side-of-the-moon'] .badge,
-[data-theme='dark-side-of-the-moon'] .album-detail-badge {
-  background: #00E5FF;
-  color: #010101;
-}
-
-/* Settings + queue tabs */
-[data-theme='dark-side-of-the-moon'] .settings-tab:hover {
-  background: rgba(155, 48, 255, 0.07);
-  color: #9B30FF;
-}
-
-[data-theme='dark-side-of-the-moon'] .settings-tab.active {
-  background: rgba(155, 48, 255, 0.12);
-  color: #9B30FF;
-  border-color: #9B30FF;
-}
-
-[data-theme='dark-side-of-the-moon'] .queue-tab-btn:hover {
-  background: rgba(255, 255, 255, 0.05);
-}
-
-[data-theme='dark-side-of-the-moon'] .queue-tab-btn.active {
-  color: #9B30FF;
-}
-
-[data-theme='dark-side-of-the-moon'] .queue-round-btn.active {
-  color: #010101;
-}
-
-/* Misc interactive */
-[data-theme='dark-side-of-the-moon'] .custom-select-trigger:hover {
-  background: #141414;
-}
-
-[data-theme='dark-side-of-the-moon'] .custom-select-option:hover {
-  background: rgba(155, 48, 255, 0.08);
-}
-
-[data-theme='dark-side-of-the-moon'] .artist-row:hover {
-  background: rgba(155, 48, 255, 0.05);
-  box-shadow: inset 3px 0 0 #9B30FF;
-}
-
-[data-theme='dark-side-of-the-moon'] .playlist-row:hover {
-  background: rgba(155, 48, 255, 0.05);
-  box-shadow: inset 3px 0 0 #9B30FF;
-}
-
-[data-theme='dark-side-of-the-moon'] .artist-ext-link:hover {
-  background: rgba(155, 48, 255, 0.07);
-  border-color: #9B30FF;
-}
-
-/* Album detail header — year/genre/info too dark on near-black bg, brighten */
-[data-theme='dark-side-of-the-moon'] .album-detail-info {
-  color: #888888;
-}
-
-/* np-album-track */
-[data-theme='dark-side-of-the-moon'] .np-album-track.active .np-album-track-title,
-[data-theme='dark-side-of-the-moon'] .np-album-track.active .np-album-track-num {
-  color: #9B30FF;
-}
-
-/* Scrollbar — minimal, cyan thumb */
-[data-theme='dark-side-of-the-moon'] ::-webkit-scrollbar {
-  width: 4px;
-  height: 4px;
-}
-
-[data-theme='dark-side-of-the-moon'] ::-webkit-scrollbar-track {
-  background: #020202;
-}
-
-[data-theme='dark-side-of-the-moon'] ::-webkit-scrollbar-thumb {
-  background: rgba(155, 48, 255, 0.25);
-  border-radius: 2px;
-}
-
-[data-theme='dark-side-of-the-moon'] ::-webkit-scrollbar-thumb:hover {
-  background: #9B30FF;
-}
-
-/* Connection indicators */
-[data-theme='dark-side-of-the-moon'] .connection-type {
-  color: #999999;
-}
-
-[data-theme='dark-side-of-the-moon'] .connection-server {
-  color: #777777;
-}
-
diff --git a/src/styles/themes/data-theme-aqua-quartz.css b/src/styles/themes/data-theme-aqua-quartz.css
deleted file mode 100644
index a25e1ddd..00000000
--- a/src/styles/themes/data-theme-aqua-quartz.css
+++ /dev/null
@@ -1,265 +0,0 @@
-/* ─────────────────────────────────────────── */
-
-[data-theme='aqua-quartz'] {
-  color-scheme: light;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23666666%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust: #b0b8c8;
-  --ctp-mantle: #c8d0e0;
-  --ctp-base: #e8e8e8;
-  --ctp-surface0: #f4f4f4;
-  --ctp-surface1: #ececec;
-  --ctp-surface2: #e0e0e0;
-  --ctp-overlay0: #888888;
-  --ctp-overlay1: #666666;
-  --ctp-overlay2: #444444;
-  --ctp-text: #111111;
-  --ctp-subtext1: #333333;
-  --ctp-subtext0: #555555;
-
-  --ctp-mauve: #3165c4;
-  --ctp-lavender: #6699dd;
-  --ctp-green: #28c941;
-  --ctp-teal: #17a2b8;
-  --ctp-sky: #5ac8fa;
-  --ctp-blue: #2060c0;
-  --ctp-sapphire: #1a4fa0;
-  --ctp-pink: #ff2d55;
-  --ctp-flamingo: #ff3b30;
-  --ctp-rosewater: #ffcc00;
-  --ctp-yellow: #ffcc00;
-  --ctp-peach: #ff9500;
-  --ctp-maroon: #af52de;
-  --ctp-red: #ff3b30;
-
-  /* Aluminium app bg, blue sidebar token (overridden below) */
-  --bg-app: #e8e8e8;
-  --bg-sidebar: #5a7ab8;
-  --bg-card: #f4f4f4;
-  --bg-hover: rgba(49, 101, 196, 0.12);
-  --bg-player: #c0c0c0;
-  --bg-glass: rgba(232, 232, 232, 0.85);
-
-  --accent: #3165c4;
-  --accent-dim: rgba(49, 101, 196, 0.15);
-  --accent-glow: rgba(49, 101, 196, 0.45);
-  --volume-accent: #3165c4;
-
-  --text-primary: #111111;
-  --text-secondary: #333333;
-  --text-muted: #777777;
-
-  --border: #a0a0a0;
-  --border-subtle: #cccccc;
-
-  --radius-sm: 4px;
-  --radius-md: 10px;
-  --radius-lg: 16px;
-  --radius-xl: 20px;
-  --radius-full: 999px;
-}
-
-/* Aluminium pinstripe background */
-[data-theme='aqua-quartz'] .app-shell {
-  background: #e8e8e8;
-}
-
-/* Iconic Aqua blue Source List sidebar */
-[data-theme='aqua-quartz'] .sidebar {
-  background: linear-gradient(to bottom, #7090c8 0%, #5a78b8 35%, #4a68a8 70%, #4060a0 100%);
-  border-right: 1px solid #3a5590;
-}
-
-/* White text/icons in sidebar */
-[data-theme='aqua-quartz'] .sidebar,
-[data-theme='aqua-quartz'] .nav-link,
-[data-theme='aqua-quartz'] .sidebar-logo-text,
-[data-theme='aqua-quartz'] .sidebar-section-label,
-[data-theme='aqua-quartz'] .nav-section-label {
-  color: rgba(255, 255, 255, 0.9) !important;
-}
-
-[data-theme='aqua-quartz'] .nav-link {
-  color: rgba(255, 255, 255, 0.85) !important;
-}
-
-[data-theme='aqua-quartz'] .nav-link:hover {
-  background: rgba(255, 255, 255, 0.15) !important;
-  color: #ffffff !important;
-}
-
-/* Active nav: white pill with blue-tinted text */
-[data-theme='aqua-quartz'] .nav-link.active {
-  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.95), rgba(240, 245, 255, 0.9)) !important;
-  color: #1a4a9c !important;
-  border-radius: var(--radius-full) !important;
-  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.9);
-}
-
-[data-theme='aqua-quartz'] .nav-link.active svg {
-  color: #1a4a9c !important;
-}
-
-/* Brushed aluminum player bar */
-[data-theme='aqua-quartz'] .player-bar {
-  background: linear-gradient(to bottom,
-      #d8d8d8 0%,
-      #d0d0d0 15%,
-      #c0c0c0 50%,
-      #b4b4b4 85%,
-      #acacac 100%);
-  border-top: 1px solid #909090;
-  box-shadow: 0 -1px 0 rgba(255, 255, 255, 0.6) inset;
-}
-
-[data-theme='aqua-quartz'] .player-track-name,
-[data-theme='aqua-quartz'] .player-track-artist,
-[data-theme='aqua-quartz'] .player-time {
-  color: #111111 !important;
-}
-
-/* All buttons get rounded pill shape */
-[data-theme='aqua-quartz'] .btn {
-  border-radius: var(--radius-full) !important;
-}
-
-/* Aluminium jelly — secondary/surface/ghost buttons */
-[data-theme='aqua-quartz'] .btn-surface,
-[data-theme='aqua-quartz'] .btn-ghost {
-  background: linear-gradient(to bottom,
-      rgba(255, 255, 255, 0.95) 0%,
-      #ececec 20%,
-      #d4d4d4 48%,
-      #c4c4c4 52%,
-      #d0d0d0 80%,
-      #e0e0e0 100%) !important;
-  border: 1px solid #909090 !important;
-  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.85);
-  color: #111111 !important;
-  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6);
-}
-
-[data-theme='aqua-quartz'] .btn-surface:hover,
-[data-theme='aqua-quartz'] .btn-ghost:hover {
-  filter: brightness(1.05);
-  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.85);
-  background: linear-gradient(to bottom,
-      rgba(255, 255, 255, 0.95) 0%,
-      #f0f0f0 20%,
-      #dadada 48%,
-      #cacaca 52%,
-      #d6d6d6 80%,
-      #e4e4e4 100%) !important;
-}
-
-/* Authentic Aqua blue jelly — primary buttons */
-[data-theme='aqua-quartz'] .btn-primary,
-[data-theme='aqua-quartz'] .player-btn-primary {
-  background: linear-gradient(to bottom,
-      rgba(255, 255, 255, 0.95) 0%,
-      rgba(160, 195, 255, 0.9) 20%,
-      #3165c4 48%,
-      #1a4aaa 52%,
-      #2555bb 75%,
-      #4a7ad4 100%) !important;
-  border: 1px solid #1040a0 !important;
-  border-radius: var(--radius-full) !important;
-  box-shadow: 0 2px 8px rgba(49, 101, 196, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.7);
-  color: white !important;
-  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
-}
-
-[data-theme='aqua-quartz'] .btn-primary:hover,
-[data-theme='aqua-quartz'] .player-btn-primary:hover {
-  filter: brightness(1.08);
-  box-shadow: 0 3px 12px rgba(49, 101, 196, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.7);
-}
-
-/* Aqua progress/seek track + fill */
-[data-theme='aqua-quartz'] .progress-bar-track {
-  background: linear-gradient(to bottom, #b0b0b0, #d0d0d0);
-  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.25);
-}
-
-[data-theme='aqua-quartz'] .progress-bar-fill {
-  background: linear-gradient(to bottom,
-      rgba(255, 255, 255, 0.85) 0%,
-      #6699ee 25%,
-      #3165c4 55%,
-      #1a4aaa 56%,
-      #4070cc 100%);
-  box-shadow: 0 0 6px rgba(49, 101, 196, 0.5);
-  border-radius: 999px;
-}
-
-/* Cards with subtle aluminium feel */
-[data-theme='aqua-quartz'] .card {
-  background: #f4f4f4;
-  border: 1px solid #c0c0c0;
-  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.9);
-}
-
-/* Queue / panels on light aluminium bg */
-[data-theme='aqua-quartz'] .queue-panel,
-[data-theme='aqua-quartz'] .queue-header {
-  background: #e8e8e8;
-  color: #111111;
-}
-
-[data-theme='aqua-quartz'] .queue-item {
-  color: #111111;
-}
-
-[data-theme='aqua-quartz'] .queue-item-artist,
-[data-theme='aqua-quartz'] .queue-item-sub {
-  color: #555555;
-}
-
-/* Queue round toolbar buttons — aluminium jelly */
-[data-theme='aqua-quartz'] .queue-round-btn {
-  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.95) 0%, #ececec 20%, #d4d4d4 48%, #c4c4c4 52%, #d0d0d0 100%);
-  border: 1px solid #909090;
-  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.85);
-  color: #333333;
-}
-
-[data-theme='aqua-quartz'] .queue-round-btn:hover:not(:disabled) {
-  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.95) 0%, #f0f0f0 20%, #dadada 48%, #cacaca 52%, #d6d6d6 100%);
-  color: #111111;
-  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.85);
-}
-
-[data-theme='aqua-quartz'] .queue-round-btn.active {
-  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.95) 0%, rgba(160, 195, 255, 0.9) 20%, #3165c4 48%, #1a4aaa 52%, #4a7ad4 100%);
-  border: 1px solid #1040a0;
-  color: #ffffff;
-  box-shadow: 0 2px 8px rgba(49, 101, 196, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.7);
-}
-
-/* Hero play button — blue jelly */
-[data-theme='aqua-quartz'] .hero-play-btn {
-  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.95) 0%, rgba(160, 195, 255, 0.9) 20%, #3165c4 48%, #1a4aaa 52%, #2555bb 75%, #4a7ad4 100%);
-  border: 1px solid #1040a0;
-  border-radius: var(--radius-full);
-  box-shadow: 0 2px 8px rgba(49, 101, 196, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.7);
-  color: white;
-  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
-  transition: filter var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast);
-}
-
-[data-theme='aqua-quartz'] .hero-play-btn:hover {
-  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.98) 0%, rgba(185, 215, 255, 0.95) 20%, #3a72d8 48%, #2058c0 52%, #2d62cc 75%, #5585e0 100%);
-  filter: brightness(1.08);
-  box-shadow: 0 3px 12px rgba(49, 101, 196, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.7);
-  transform: scale(1.02);
-}
-
-/* Album card hover play button — blue jelly */
-[data-theme='aqua-quartz'] .album-card-details-btn {
-  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.95) 0%, rgba(160, 195, 255, 0.9) 20%, #3165c4 48%, #1a4aaa 52%, #4a7ad4 100%);
-  border: 1px solid #1040a0;
-  box-shadow: 0 3px 10px rgba(49, 101, 196, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.7);
-  color: white;
-  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
-}
-
diff --git a/src/styles/themes/dawnfox.css b/src/styles/themes/dawnfox.css
deleted file mode 100644
index 8cf236db..00000000
--- a/src/styles/themes/dawnfox.css
+++ /dev/null
@@ -1,53 +0,0 @@
-/* ─── Dawnfox ─── */
-[data-theme='dawnfox'] {
-  color-scheme: light;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23575279%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust: #ebe5df;
-  --ctp-mantle: #ebe5df;
-  --ctp-base: #faf4ed;
-  --ctp-surface0: #ebe0df;
-  --ctp-surface1: #ebdfe4;
-  --ctp-surface2: #bdbfc9;
-  --ctp-overlay0: #9893a5;
-  --ctp-overlay1: #a8a3b3;
-  --ctp-overlay2: #625c87;
-  --ctp-text: #575279;
-  --ctp-subtext1: #4c4769;
-  --ctp-subtext0: #625c87;
-  --ctp-mauve: #907aa9;
-  --ctp-lavender: #575279;
-  --ctp-pink: #d685af;
-  --ctp-flamingo: #d7827e;
-  --ctp-rosewater: #d7827e;
-  --ctp-blue: #286983;
-  --ctp-sapphire: #286983;
-  --ctp-sky: #56949f;
-  --ctp-teal: #56949f;
-  --ctp-green: #618774;
-  --ctp-yellow: #ea9d34;
-  --ctp-peach: #d7827e;
-  --ctp-maroon: #b4637a;
-  --ctp-red: #b4637a;
-
-  --bg-app: #faf4ed;
-  --bg-sidebar: #ebe5df;
-  --bg-card: #ebe0df;
-  --bg-hover: #ebdfe4;
-  --bg-player: #ebe5df;
-  --bg-glass: rgba(250, 244, 237, 0.92);
-  --accent: #907aa9;
-  --accent-dim: rgba(144, 122, 169, 0.12);
-  --accent-glow: rgba(144, 122, 169, 0.25);
-  --text-primary: #575279;
-  --text-secondary: #625c87;
-  --text-muted: #9893a5;
-  --border: #ebdfe4;
-  --border-subtle: #ebe0df;
-  --border-dropdown: #bdbfc9;
-  --shadow-dropdown: rgba(0, 0, 0, 0.15);
-  --positive: #618774;
-  --warning: #ea9d34;
-  --danger: #b4637a;
-}
-
diff --git a/src/styles/themes/dayfox.css b/src/styles/themes/dayfox.css
deleted file mode 100644
index ffaca27f..00000000
--- a/src/styles/themes/dayfox.css
+++ /dev/null
@@ -1,53 +0,0 @@
-/* ─── Dayfox ─── */
-[data-theme='dayfox'] {
-  color-scheme: light;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%233d2b5a%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust: #e4dcd4;
-  --ctp-mantle: #e4dcd4;
-  --ctp-base: #f6f2ee;
-  --ctp-surface0: #dbd1dd;
-  --ctp-surface1: #d3c7bb;
-  --ctp-surface2: #aab0ad;
-  --ctp-overlay0: #837a72;
-  --ctp-overlay1: #643f61;
-  --ctp-overlay2: #3d2b5a;
-  --ctp-text: #3d2b5a;
-  --ctp-subtext1: #302b5d;
-  --ctp-subtext0: #643f61;
-  --ctp-mauve: #6e33ce;
-  --ctp-lavender: #2848a9;
-  --ctp-pink: #a440b5;
-  --ctp-flamingo: #a5222f;
-  --ctp-rosewater: #955f61;
-  --ctp-blue: #2848a9;
-  --ctp-sapphire: #287980;
-  --ctp-sky: #287980;
-  --ctp-teal: #287980;
-  --ctp-green: #396847;
-  --ctp-yellow: #ac5402;
-  --ctp-peach: #955f61;
-  --ctp-maroon: #a5222f;
-  --ctp-red: #a5222f;
-
-  --bg-app: #f6f2ee;
-  --bg-sidebar: #e4dcd4;
-  --bg-card: #dbd1dd;
-  --bg-hover: #d3c7bb;
-  --bg-player: #e4dcd4;
-  --bg-glass: rgba(246, 242, 238, 0.92);
-  --accent: #2848a9;
-  --accent-dim: rgba(40, 72, 169, 0.12);
-  --accent-glow: rgba(40, 72, 169, 0.25);
-  --text-primary: #3d2b5a;
-  --text-secondary: #643f61;
-  --text-muted: #837a72;
-  --border: #d3c7bb;
-  --border-subtle: #dbd1dd;
-  --border-dropdown: #aab0ad;
-  --shadow-dropdown: rgba(0, 0, 0, 0.18);
-  --positive: #396847;
-  --warning: #ac5402;
-  --danger: #a5222f;
-}
-
diff --git a/src/styles/themes/deep-forest.css b/src/styles/themes/deep-forest.css
deleted file mode 100644
index 396c920a..00000000
--- a/src/styles/themes/deep-forest.css
+++ /dev/null
@@ -1,66 +0,0 @@
-/* ─── Deep Forest ─── */
-[data-theme='deep-forest'] {
-  color-scheme: dark;
-
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%236aa37c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
-
-  /* Backgrounds */
-  --ctp-crust:    #0a0f0b;
-  --ctp-mantle:   #0f1511;
-  --ctp-base:     #141c17;
-  --ctp-surface0: #19231d;
-  --ctp-surface1: #223027;
-  --ctp-surface2: #2c3d31;
-
-  /* Overlays */
-  --ctp-overlay0: #41634f;
-  --ctp-overlay1: #547c64;
-  --ctp-overlay2: #689578;
-
-  /* Text */
-  --ctp-text:     #e0efe5;
-  --ctp-subtext1: #b3d1bd;
-  --ctp-subtext0: #84a791;
-
-  /* Forest green accent */
-  --ctp-teal:      #6aa37c;
-  --ctp-sky:       #6aa37c;
-  --ctp-sapphire:  #56896a;
-  --ctp-blue:      #456f57;
-  --ctp-lavender:  #81ba92;
-  --ctp-mauve:     #56896a;
-  --ctp-pink:      #456f57;
-  --ctp-flamingo:  #81ba92;
-  --ctp-rosewater: #56896a;
-
-  --ctp-red:     #d97777;
-  --ctp-maroon:  #d39a63;
-  --ctp-peach:   #d39a63;
-  --ctp-yellow:  #c9b76a;
-  --ctp-green:   #6aa37c;
-
-  --bg-app:      #141c17;
-  --bg-sidebar:  #0f1511;
-  --bg-card:     #19231d;
-  --bg-hover:    #223027;
-  --bg-player:   #0f1511;
-  --bg-glass:    rgba(20,28,23,0.82);
-
-  --accent:      #6aa37c;
-  --accent-dim:  rgba(106,163,124,0.05);
-  --accent-glow: rgba(106,163,124,0.09);
-
-  --text-primary:   #e0efe5;
-  --text-secondary: #84a791;
-  --text-muted:     #547c64;
-
-  --border:          #2c3d31;
-  --border-subtle:   #223027;
-  --border-dropdown: #36493b;
-  --shadow-dropdown: rgba(0,0,0,0.72);
-
-  --positive: #6aa37c;
-  --warning:  #c9b76a;
-  --danger:   #d97777;
-}
-
diff --git a/src/styles/themes/dracula-component-level-overrides.css b/src/styles/themes/dracula-component-level-overrides.css
deleted file mode 100644
index 85b1dce1..00000000
--- a/src/styles/themes/dracula-component-level-overrides.css
+++ /dev/null
@@ -1,24 +0,0 @@
-/* ─── Dracula — component-level overrides ─────────────────────────────── */
-
-/* Column resize grip — was surface1 on bg-card = 1:1 (identical, invisible).
-   Use the Comment-lifted tone for strong legibility. */
-[data-theme='dracula'] .col-resize-handle::after {
-  background: #c0bfcc;               /* 5.5:1 on bg-card — visible */
-  width: 2px;
-}
-
-/* Focus ring — Dracula only tunes the colour; width/offset/placement come from
-   the shared :focus-visible rule and card focus ring (all var-driven). */
-[data-theme='dracula'] {
-  --focus-ring-color: #bd93f9;
-}
-
-/* Scrollbar thumb — Comment colour (Dracula-authentic) */
-[data-theme='dracula'] ::-webkit-scrollbar-thumb {
-  background: #6272a4;
-}
-[data-theme='dracula'] *:hover::-webkit-scrollbar-thumb,
-[data-theme='dracula'] .is-scrolling::-webkit-scrollbar-thumb {
-  background: #8b95c0;
-}
-
diff --git a/src/styles/themes/dracula.css b/src/styles/themes/dracula.css
deleted file mode 100644
index f05d51e8..00000000
--- a/src/styles/themes/dracula.css
+++ /dev/null
@@ -1,70 +0,0 @@
-/* ─── Dracula ─── */
-[data-theme='dracula'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23f8f8f2%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* ── Palette: official Dracula (draculatheme.com) preserved verbatim.
-     Contrast audit (vs. --bg-app #282a36, L≈0.024):
-       text-primary   13.4:1 AAA ✓ (official Foreground)
-       text-secondary 10.8:1 AAA ✓
-       text-muted      4.9:1 AA  ✓ (lifted from Comment #6272a4 at 2.99:1 — below all thresholds)
-       accent          5.9:1 AA  ✓ (Purple)
-       positive       10.4:1 AAA ✓ (Green)
-       warning         8.4:1 AAA ✓ (Orange)
-       danger          4.5:1 AA  ✓ (Red)
-     Border/hover separation fixed: Dracula's "Current Line" (#44475a)
-     was doing triple duty as card bg + border + hover, producing zero
-     visible structure. Borders now use the official Comment #6272a4
-     (1.9:1 — Dracula-authentic), hover lifts to Selection #565869.
-  */
-  --ctp-crust:    #191a21;
-  --ctp-mantle:   #21222c;
-  --ctp-base:     #282a36;
-  --ctp-surface0: #3a3c4e;
-  --ctp-surface1: #44475a;   /* official "Current Line" */
-  --ctp-surface2: #565869;   /* official "Selection" */
-  --ctp-overlay0: #6272a4;   /* official "Comment" */
-  --ctp-overlay1: #8b95c0;   /* lifted Comment for UI use */
-  --ctp-overlay2: #c0bfcc;
-  --ctp-text:     #f8f8f2;
-  --ctp-subtext1: #e0dfe6;
-  --ctp-subtext0: #c0bfcc;
-  --ctp-mauve:    #bd93f9;
-  --ctp-lavender: #bd93f9;
-  --ctp-pink:     #ff79c6;
-  --ctp-flamingo: #ff79c6;
-  --ctp-rosewater:#ffb86c;
-  --ctp-blue:     #6272a4;
-  --ctp-sapphire: #8be9fd;
-  --ctp-sky:      #8be9fd;
-  --ctp-teal:     #8be9fd;
-  --ctp-green:    #50fa7b;
-  --ctp-yellow:   #f1fa8c;
-  --ctp-peach:    #ffb86c;
-  --ctp-maroon:   #ff5555;
-  --ctp-red:      #ff5555;
-
-  --bg-app:           #282a36;
-  --bg-sidebar:       #21222c;
-  --bg-card:          #44475a;
-  --bg-hover:         #565869;       /* official Selection — 1.4:1 vs card, perceptible (was identical to card) */
-  --bg-player:        #21222c;
-  --bg-glass:         rgba(40, 42, 54, 0.88);
-  --accent:           #bd93f9;
-  --accent-dim:       rgba(189, 147, 249, 0.18);
-  --accent-glow:      rgba(189, 147, 249, 0.35);
-  --text-primary:     #f8f8f2;
-  --text-secondary:   #e0dfe6;
-  --text-muted:       #8b95c0;       /* 4.9:1 AA ✓, lifted Comment — was #6272a4 (2.99:1 below AA) */
-  --border:           #6272a4;       /* official Comment — 1.9:1, visible (was #44475a = invisible on card) */
-  --border-subtle:    #4e5167;       /* 1.2:1 subtle but perceptible */
-  --border-dropdown:  #6272a4;
-  --shadow-dropdown:  rgba(0, 0, 0, 0.6);
-  --positive:         #50fa7b;
-  --warning:          #ffb86c;
-  --danger:           #ff5555;
-  --waveform-played:    #bd93f9;
-  --waveform-buffered:  #6272a4;
-  --waveform-unplayed:  #3a3c4e;
-}
-
diff --git a/src/styles/themes/dune-arrakis.css b/src/styles/themes/dune-arrakis.css
deleted file mode 100644
index c55bd9dc..00000000
--- a/src/styles/themes/dune-arrakis.css
+++ /dev/null
@@ -1,1079 +0,0 @@
-/* ─── Dune — Arrakis ─── */
-[data-theme='dune'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23c8780a%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* ── Palette — two-temperature Arrakis ── */
-  /* Warm: spice / sand / desert sun */
-  --ctp-crust: #0a0804;
-  --ctp-mantle: #120e06;
-  --ctp-base: #1c1408;
-  --ctp-surface0: #2e1e0a;
-  --ctp-surface1: #3e2a0e;
-  --ctp-surface2: #503614;
-  /* Cool: sietch / rock shadow / Fremen darkness */
-  --ctp-overlay0: #2a2440;
-  --ctp-overlay1: #4a4268;
-  --ctp-overlay2: #6a6090;
-  /* Text: aged parchment, scrolls of the Bene Gesserit */
-  --ctp-text: #f0deb0;
-  --ctp-subtext1: #d8c090;
-  --ctp-subtext0: #b09060;
-  /* Accent palette */
-  --ctp-mauve: #c8780a;
-  /* spice melange — cinnamon rust */
-  --ctp-lavender: #e8a020;
-  /* spice shimmer — bright amber */
-  --ctp-yellow: #f5cc50;
-  /* spice flare */
-  --ctp-peach: #aa5a08;
-  /* deep spice shadow */
-  --ctp-green: #7a8c40;
-  /* Caladan seagrass (far memory) */
-  --ctp-teal: #1a80c0;
-  /* Fremen eye blue — spice prescience */
-  --ctp-sky: #2090d0;
-  /* Guild Navigator blue */
-  --ctp-blue: #1468a8;
-  /* sietch pool depth */
-  --ctp-sapphire: #0e4a80;
-  /* deep cave water */
-  --ctp-pink: #c84060;
-  --ctp-flamingo: #e06080;
-  --ctp-rosewater: #f0c0a0;
-  --ctp-red: #cc2800;
-  --ctp-maroon: #8c1c00;
-
-  /* ── Semantic tokens ── */
-  --bg-app: #1c1408;
-  --bg-sidebar: #0e0c1a;
-  /* sietch interior — cool rock */
-  --bg-card: #2e1e0a;
-  --bg-hover: rgba(200, 120, 10, 0.14);
-  --bg-player: #0e0a04;
-  --bg-glass: rgba(10, 8, 4, 0.96);
-  --accent: #c8780a;
-  --accent-dim: rgba(200, 120, 10, 0.12);
-  --accent-glow: rgba(200, 120, 10, 0.40);
-  --volume-accent: #c8780a;
-  --text-primary: #f0deb0;
-  --text-secondary: #d8c090;
-  --text-muted: #a89870;
-  --border: rgba(200, 120, 10, 0.22);
-  --border-subtle: rgba(200, 120, 10, 0.10);
-  --positive: #7a8c40;
-  --warning: #f5cc50;
-  --danger: #cc2800;
-  --radius-sm: 2px;
-  --radius-md: 4px;
-  --radius-lg: 6px;
-}
-
-/* ── App shell: Arrakis desert horizon at dusk ── */
-/* Sky (cool/dark at top) fading into burning sand (warm at bottom) */
-[data-theme='dune'] .app-shell {
-  background: linear-gradient(180deg,
-      #12101c 0%,
-      #1a1408 30%,
-      #201608 60%,
-      #281e0a 100%);
-}
-
-/* ── Sidebar: sietch interior — cold carved rock ── */
-/* The Fremen lived in caves cut from rock — cool, dark, shadows of blue and purple */
-[data-theme='dune'] .sidebar {
-  background: linear-gradient(180deg, #141228 0%, #0e0c1c 40%, #0c0a16 100%);
-  border-right: 1px solid rgba(200, 120, 10, 0.22);
-  box-shadow:
-    inset -3px 0 10px rgba(200, 100, 8, 0.07),
-    2px 0 8px rgba(0, 0, 0, 0.50);
-}
-
-/* Nav text: parchment on cool rock */
-[data-theme='dune'] .nav-link {
-  color: #b09060;
-}
-
-[data-theme='dune'] .nav-link:hover {
-  background: rgba(200, 120, 10, 0.10);
-  color: #d8c090;
-}
-
-[data-theme='dune'] .nav-link.active {
-  background: linear-gradient(90deg, rgba(200, 120, 10, 0.20) 0%, transparent 100%);
-  color: #e8a020;
-  border-left: 2px solid #c8780a;
-  box-shadow: inset 4px 0 14px rgba(200, 120, 10, 0.10);
-}
-
-[data-theme='dune'] .nav-link.active::before {
-  background: #c8780a;
-  box-shadow: 0 0 10px rgba(200, 120, 10, 0.70);
-}
-
-[data-theme='dune'] .nav-link.active svg {
-  color: #c8780a;
-}
-
-[data-theme='dune'] .nav-section-label {
-  color: #4a4268;
-  letter-spacing: 0.08em;
-  text-transform: uppercase;
-  font-size: 0.70em;
-}
-
-/* ── Player bar: spice harvester console — deep amber warmth ── */
-[data-theme='dune'] .player-bar {
-  background: linear-gradient(180deg, #140e04 0%, #0a0802 100%);
-  border-top: 2px solid rgba(200, 120, 10, 0.50);
-  box-shadow:
-    inset 0 1px 0 rgba(240, 180, 40, 0.16),
-    0 -8px 40px rgba(180, 100, 8, 0.16),
-    0 -2px 80px rgba(20, 100, 160, 0.04);
-}
-
-/* Track name: the spice calls — amber prophetic glow */
-[data-theme='dune'] .player-track-name {
-  color: #e8a020;
-  text-shadow:
-    0 0 8px rgba(232, 160, 32, 0.75),
-    0 0 20px rgba(200, 120, 10, 0.40),
-    0 0 40px rgba(200, 120, 10, 0.15);
-  letter-spacing: 0.04em;
-}
-
-/* Artist: deeper spice cinnamon */
-[data-theme='dune'] .player-track-artist {
-  color: #aa7030;
-  opacity: 1;
-  text-shadow: 0 0 8px rgba(170, 112, 48, 0.45);
-}
-
-[data-theme='dune'] .player-time {
-  color: #7a5020;
-}
-
-/* ── Transport buttons: Fremen tech — minimal, earth-worn ── */
-[data-theme='dune'] .player-btn,
-[data-theme='dune'] .player-btn-primary {
-  background: linear-gradient(180deg, #2e1e0a 0%, #1e1406 100%);
-  color: #c8780a;
-  border: 1px solid rgba(200, 120, 10, 0.38);
-  border-radius: 50%;
-  box-shadow: inset 0 1px 0 rgba(240, 180, 40, 0.08), 0 2px 6px rgba(0, 0, 0, 0.50);
-}
-
-[data-theme='dune'] .player-btn:hover,
-[data-theme='dune'] .player-btn-primary:hover {
-  background: rgba(200, 120, 10, 0.14);
-  border-color: #c8780a;
-  color: #e8a020;
-  box-shadow:
-    0 0 14px rgba(200, 120, 10, 0.42),
-    inset 0 0 8px rgba(200, 100, 8, 0.08);
-}
-
-/* ── Regular buttons: desert stone / carved bone ── */
-[data-theme='dune'] .btn,
-[data-theme='dune'] .btn-surface,
-[data-theme='dune'] .btn-ghost {
-  background: linear-gradient(180deg, #2e1e0a 0%, #221608 100%);
-  color: #d8c090;
-  border: 1px solid rgba(200, 120, 10, 0.30);
-  box-shadow: inset 0 1px 0 rgba(240, 200, 80, 0.06), 0 1px 4px rgba(0, 0, 0, 0.40);
-  border-radius: 3px;
-}
-
-[data-theme='dune'] .btn:hover,
-[data-theme='dune'] .btn-surface:hover,
-[data-theme='dune'] .btn-ghost:hover {
-  background: rgba(200, 120, 10, 0.12);
-  border-color: rgba(200, 120, 10, 0.65);
-  color: #f0deb0;
-  box-shadow: 0 0 10px rgba(200, 120, 10, 0.24), inset 0 0 6px rgba(200, 100, 8, 0.05);
-}
-
-/* ── Primary button: spice melange — the most precious thing ── */
-[data-theme='dune'] .btn-primary {
-  background: linear-gradient(180deg, #b86808 0%, #884e04 100%);
-  color: #ffe8a0;
-  border: 1px solid #d08010;
-  box-shadow: 0 0 14px rgba(200, 120, 10, 0.35), inset 0 1px 0 rgba(255, 220, 80, 0.20);
-  border-radius: 3px;
-  font-weight: 600;
-}
-
-[data-theme='dune'] .btn-primary:hover {
-  background: linear-gradient(180deg, #d07a10 0%, #a05e06 100%);
-  box-shadow: 0 0 22px rgba(200, 120, 10, 0.55), inset 0 1px 0 rgba(255, 220, 80, 0.25);
-}
-
-/* ── Hero / album buttons ── */
-[data-theme='dune'] .hero-play-btn,
-[data-theme='dune'] .album-card-details-btn {
-  background: rgba(200, 120, 10, 0.12);
-  color: #c8780a;
-  border: 1px solid rgba(200, 120, 10, 0.36);
-  box-shadow: inset 0 1px 0 rgba(240, 180, 40, 0.06);
-}
-
-[data-theme='dune'] .hero-play-btn:hover,
-[data-theme='dune'] .album-card-details-btn:hover {
-  background: rgba(200, 120, 10, 0.20);
-  border-color: #c8780a;
-  box-shadow: 0 0 12px rgba(200, 120, 10, 0.38);
-}
-
-/* ── Queue round buttons ── */
-[data-theme='dune'] .queue-round-btn {
-  background: linear-gradient(180deg, #2e1e0a 0%, #1e1406 100%);
-  color: #8a6030;
-  border: 1px solid rgba(200, 120, 10, 0.24);
-}
-
-[data-theme='dune'] .queue-round-btn:hover:not(:disabled):not(.active) {
-  background: rgba(200, 120, 10, 0.10);
-  border-color: rgba(200, 120, 10, 0.55);
-  color: #c8780a;
-  box-shadow: 0 0 10px rgba(200, 120, 10, 0.22);
-}
-
-[data-theme='dune'] .queue-round-btn.active {
-  background: rgba(200, 120, 10, 0.20);
-  border-color: #c8780a;
-  color: #e8a020;
-  box-shadow: 0 0 12px rgba(200, 120, 10, 0.42), inset 0 0 6px rgba(200, 100, 8, 0.08);
-}
-
-/* ── Cards: ancient stone / sand-worn rock ── */
-[data-theme='dune'] .card {
-  background: linear-gradient(180deg, #2e1e0a 0%, #281808 100%);
-  border: 1px solid rgba(200, 120, 10, 0.16);
-  border-radius: 4px;
-  box-shadow:
-    inset 0 1px 0 rgba(240, 200, 80, 0.04),
-    inset 0 0 24px rgba(200, 100, 8, 0.03),
-    0 2px 10px rgba(0, 0, 0, 0.50);
-}
-
-/* ── Content header: sietch entrance — cool rock above warm desert ── */
-/* The contrast between the cold header and warm body is intentional — Arrakis duality */
-[data-theme='dune'] .content-header {
-  background: linear-gradient(180deg, #151228 0%, #12101e 100%);
-  border-bottom: 1px solid rgba(200, 120, 10, 0.24);
-  box-shadow: 0 3px 16px rgba(200, 100, 8, 0.06);
-}
-
-/* Text on cool header: light but warm */
-[data-theme='dune'] .content-header .page-title,
-[data-theme='dune'] .content-header h1,
-[data-theme='dune'] .content-header h2 {
-  color: #d8c090;
-}
-
-/* ── Connection indicators: parchment legible ── */
-[data-theme='dune'] .connection-type,
-[data-theme='dune'] .connection-server {
-  color: #b09060;
-}
-
-/* ── Theme accordion ── */
-[data-theme='dune'] .theme-accordion-header:hover {
-  background: rgba(200, 120, 10, 0.10);
-  color: #e8a020;
-}
-
-[data-theme='dune'] .theme-accordion-open .theme-accordion-header {
-  background: rgba(200, 120, 10, 0.14);
-  color: #e8a020;
-}
-
-[data-theme='dune'] .theme-accordion-open .theme-accordion-chevron {
-  color: #c8780a;
-}
-
-/* ── Progress bar: spice flowing — from deep rust to bright amber ── */
-[data-theme='dune'] .progress-bar-track {
-  background: #1a1006;
-  border: 1px solid rgba(200, 120, 10, 0.22);
-  border-radius: 2px;
-}
-
-[data-theme='dune'] .progress-bar-fill {
-  background: linear-gradient(90deg,
-      #6a3604 0%,
-      #a85a08 30%,
-      #c8780a 65%,
-      #e8a020 85%,
-      #f5cc50 100%);
-  border-radius: 2px;
-  box-shadow: 0 0 10px rgba(200, 120, 10, 0.55), 0 0 3px rgba(240, 200, 60, 0.40);
-}
-
-/* ── Scrollbar: sand grain — thin, warm, minimal ── */
-[data-theme='dune'] ::-webkit-scrollbar {
-  width: 5px;
-  height: 5px;
-}
-
-[data-theme='dune'] ::-webkit-scrollbar-track {
-  background: #0a0804;
-}
-
-[data-theme='dune'] ::-webkit-scrollbar-thumb {
-  background: rgba(200, 120, 10, 0.30);
-  border-radius: 2px;
-  border: 1px solid rgba(200, 120, 10, 0.16);
-}
-
-[data-theme='dune'] ::-webkit-scrollbar-thumb:hover {
-  background: rgba(200, 120, 10, 0.55);
-  box-shadow: 0 0 5px rgba(200, 120, 10, 0.40);
-}
-
-/* ── Glass / dropdowns: deep sand shelter ── */
-[data-theme='dune'] .glass {
-  background: rgba(10, 8, 4, 0.97) !important;
-  backdrop-filter: none !important;
-  border: 1px solid rgba(200, 120, 10, 0.30) !important;
-  box-shadow:
-    0 0 20px rgba(180, 100, 8, 0.10),
-    inset 0 0 16px rgba(200, 100, 8, 0.02) !important;
-  border-radius: 4px !important;
-}
-
-[data-theme='dune'] .glass [style*="var(--bg-hover)"] {
-  background: rgba(200, 120, 10, 0.12) !important;
-  border-radius: 2px !important;
-}
-
-[data-theme='dune'] .glass [style*="var(--text-primary)"] {
-  color: #f0deb0 !important;
-}
-
-[data-theme='dune'] .glass [style*="var(--text-secondary)"] {
-  color: #d8c090 !important;
-}
-
-[data-theme='dune'] .glass [style*="var(--text-muted)"] {
-  color: #6a5830 !important;
-}
-
-/* ── Hover / selection: spice glow — warm amber indicator bar ── */
-[data-theme='dune'] .queue-tab-btn:hover {
-  background: rgba(200, 120, 10, 0.10);
-  color: #c8780a;
-}
-
-[data-theme='dune'] .settings-tab:hover {
-  background: rgba(200, 120, 10, 0.10);
-  color: #c8780a;
-}
-
-[data-theme='dune'] .settings-tab.active {
-  background: rgba(200, 120, 10, 0.16);
-  color: #e8a020;
-  box-shadow: inset 2px 0 0 #c8780a;
-}
-
-[data-theme='dune'] .custom-select-trigger:hover {
-  background: rgba(200, 120, 10, 0.10);
-}
-
-[data-theme='dune'] .custom-select-option:hover {
-  background: rgba(200, 120, 10, 0.14) !important;
-  color: #e8a020 !important;
-}
-
-[data-theme='dune'] .artist-ext-link:hover {
-  background: rgba(200, 120, 10, 0.10);
-  color: #c8780a !important;
-  border-color: rgba(200, 120, 10, 0.45) !important;
-}
-
-[data-theme='dune'] .np-action-btn:hover {
-  background: rgba(200, 120, 10, 0.10);
-}
-
-[data-theme='dune'] .np-queue-item:hover,
-[data-theme='dune'] .np-queue-item.context-active {
-  background: rgba(200, 120, 10, 0.12);
-  box-shadow: inset 2px 0 0 #c8780a;
-}
-
-[data-theme='dune'] .track-row:hover,
-[data-theme='dune'] .track-row.context-active {
-  background: rgba(200, 120, 10, 0.09) !important;
-  box-shadow: inset 2px 0 0 #c8780a;
-}
-
-[data-theme='dune'] .artist-row:hover {
-  background: rgba(200, 120, 10, 0.09);
-  box-shadow: inset 2px 0 0 #c8780a;
-}
-
-[data-theme='dune'] .playlist-row:hover {
-  background: rgba(200, 120, 10, 0.09);
-  box-shadow: inset 2px 0 0 #c8780a;
-}
-
-[data-theme='dune'] .queue-item:hover,
-[data-theme='dune'] .queue-item.context-active {
-  background: rgba(200, 120, 10, 0.10) !important;
-  box-shadow: inset 2px 0 0 #c8780a;
-}
-
-[data-theme='dune'] .queue-item:hover .queue-item-title,
-[data-theme='dune'] .queue-item:hover .queue-item-artist,
-[data-theme='dune'] .queue-item:hover .queue-item-duration,
-[data-theme='dune'] .queue-item.context-active .queue-item-title,
-[data-theme='dune'] .queue-item.context-active .queue-item-artist,
-[data-theme='dune'] .queue-item.context-active .queue-item-duration {
-  color: #c8780a;
-}
-
-/* ── Active queue / now-playing: the worm has come ── */
-[data-theme='dune'] .queue-item.active {
-  background: rgba(200, 120, 10, 0.08);
-  box-shadow: inset 2px 0 0 #c8780a;
-}
-
-[data-theme='dune'] .np-queue-item-active {
-  color: #c8780a;
-  text-shadow: 0 0 8px rgba(200, 120, 10, 0.55);
-}
-
-[data-theme='dune'] .np-queue-item.active {
-  background: rgba(200, 120, 10, 0.08);
-}
-
-[data-theme='dune'] .np-album-track.active .np-album-track-title,
-[data-theme='dune'] .np-album-track.active .np-album-track-num {
-  color: #c8780a;
-  text-shadow: 0 0 8px rgba(200, 120, 10, 0.50);
-}
-
-/* ── TetraStack (Games) — 7-tetromino NES Tetris ─────────────── */
-/* I=cyan  O=yellow  T=purple  S=green  Z=red  J=blue  L=orange  */
-[data-theme='tetrastack'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2300f0f0%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* Dark navy — NES Tetris backdrop, not pure black */
-  --ctp-crust: #000008;
-  --ctp-mantle: #00000e;
-  --ctp-base: #060614;
-  --ctp-surface0: #0d0d22;
-  --ctp-surface1: #141432;
-  --ctp-surface2: #1e1e48;
-  --ctp-overlay0: #3a3a6a;
-  --ctp-overlay1: #6060a8;
-  --ctp-overlay2: #9090cc;
-  --ctp-text: #ffffff;
-  --ctp-subtext1: #d0d0ff;
-  --ctp-subtext0: #9090cc;
-
-  /* 7 Tetromino colours mapped to palette slots */
-  --ctp-sky: #00f0f0;
-  /* I-piece  — cyan   */
-  --ctp-teal: #00f0f0;
-  --ctp-yellow: #f0d000;
-  /* O-piece  — yellow */
-  --ctp-mauve: #c070ff;
-  /* T-piece  — purple */
-  --ctp-lavender: #c070ff;
-  --ctp-pink: #c070ff;
-  --ctp-green: #00d000;
-  /* S-piece  — green  */
-  --ctp-red: #f02000;
-  /* Z-piece  — red    */
-  --ctp-flamingo: #f02000;
-  --ctp-maroon: #f02000;
-  --ctp-blue: #4090ff;
-  /* J-piece  — blue   */
-  --ctp-sapphire: #4090ff;
-  --ctp-peach: #f07800;
-  /* L-piece  — orange */
-  --ctp-rosewater: #f07800;
-
-  --bg-app: #060614;
-  --bg-sidebar: #00000e;
-  --bg-card: #0d0d22;
-  --bg-hover: rgba(0, 240, 240, 0.07);
-  --bg-player: #000008;
-  --bg-glass: rgba(6, 6, 20, 0.96);
-
-  --accent: #00f0f0;
-  /* I-piece cyan */
-  --accent-dim: rgba(0, 240, 240, 0.12);
-  --accent-glow: rgba(0, 240, 240, 0.5);
-  --volume-accent: #f0d000;
-  /* O-piece yellow — classic score-panel feel */
-
-  --text-primary: #ffffff;
-  --text-secondary: #f0d000;
-  /* O-piece yellow — like the score readout */
-  --text-muted: #7878b8;
-  --border: #1e1e48;
-  --border-subtle: #0d0d22;
-
-  /* All corners square — every element is a block */
-  --radius-sm: 0px;
-  --radius-md: 0px;
-  --radius-lg: 0px;
-  --radius-xl: 0px;
-}
-
-/* 30 px grid — Tetris block scale */
-[data-theme='tetrastack'] .app-shell {
-  background-image:
-    linear-gradient(rgba(0, 240, 240, 0.04) 1px, transparent 1px),
-    linear-gradient(90deg, rgba(0, 240, 240, 0.04) 1px, transparent 1px);
-  background-size: 30px 30px;
-}
-
-/* Sidebar = the score/next-piece panel */
-[data-theme='tetrastack'] .sidebar {
-  border-right: 3px solid #00f0f0;
-}
-
-/* Player bar = bottom of the well */
-[data-theme='tetrastack'] .player-bar {
-  border-top: 3px solid #00f0f0;
-  box-shadow:
-    0 -2px 0 #c070ff,
-    0 -8px 24px rgba(0, 240, 240, 0.12);
-}
-
-/* NES block shading on cards — lighter top-left, darker bottom-right */
-[data-theme='tetrastack'] .card,
-[data-theme='tetrastack'] .glass,
-[data-theme='tetrastack'] .settings-card {
-  border: 1px solid #1e1e48 !important;
-  border-radius: 0 !important;
-  box-shadow:
-    inset -3px -3px 0 rgba(0, 0, 0, 0.55),
-    inset 3px 3px 0 rgba(255, 255, 255, 0.05) !important;
-}
-
-/* Buttons: block-shaped, NES-style press effect */
-[data-theme='tetrastack'] .btn-primary {
-  background: #00f0f0;
-  color: #000000;
-  border: none;
-  border-radius: 0;
-  box-shadow: inset -3px -3px 0 rgba(0, 0, 0, 0.5), inset 3px 3px 0 rgba(255, 255, 255, 0.35);
-  text-transform: uppercase;
-  font-weight: 800;
-  letter-spacing: 0.08em;
-}
-
-[data-theme='tetrastack'] .btn-primary:hover {
-  background: #30ffff;
-  box-shadow: inset -3px -3px 0 rgba(0, 0, 0, 0.4), inset 3px 3px 0 rgba(255, 255, 255, 0.45);
-}
-
-[data-theme='tetrastack'] .btn-surface {
-  border-radius: 0;
-  box-shadow: inset -2px -2px 0 rgba(0, 0, 0, 0.5), inset 2px 2px 0 rgba(255, 255, 255, 0.06);
-}
-
-/* Track name = I-piece glow */
-[data-theme='tetrastack'] .player-track-name {
-  color: #00f0f0;
-  text-shadow: 0 0 8px rgba(0, 240, 240, 0.7), 0 0 20px rgba(0, 240, 240, 0.3);
-  text-transform: uppercase;
-  letter-spacing: 0.04em;
-}
-
-/* Artist name = L-piece orange */
-[data-theme='tetrastack'] .player-track-artist {
-  color: #f07800;
-}
-
-/* Album title in queue = T-piece purple */
-[data-theme='tetrastack'] .queue-meta-album {
-  color: #c070ff;
-}
-
-/* Active queue item = I-piece left border */
-[data-theme='tetrastack'] .queue-item.active {
-  background: rgba(0, 240, 240, 0.07);
-  box-shadow: inset 3px 0 0 #00f0f0;
-}
-
-[data-theme='tetrastack'] .np-queue-item-active {
-  color: #00f0f0;
-  text-shadow: 0 0 8px rgba(0, 240, 240, 0.6);
-}
-
-[data-theme='tetrastack'] .np-queue-item.active {
-  background: rgba(0, 240, 240, 0.07);
-}
-
-/* Hover rows: subtle block highlight */
-[data-theme='tetrastack'] .track-row:hover,
-[data-theme='tetrastack'] .track-row.context-active {
-  background: rgba(0, 240, 240, 0.06) !important;
-  box-shadow: inset 3px 0 0 #00f0f0;
-}
-
-[data-theme='tetrastack'] .queue-item:hover,
-[data-theme='tetrastack'] .queue-item.context-active {
-  background: rgba(0, 240, 240, 0.07) !important;
-  box-shadow: inset 3px 0 0 #00f0f0;
-}
-
-[data-theme='tetrastack'] .np-queue-item:hover,
-[data-theme='tetrastack'] .np-queue-item.context-active {
-  background: rgba(0, 240, 240, 0.07);
-  box-shadow: inset 2px 0 0 #00f0f0;
-}
-
-[data-theme='tetrastack'] .artist-row:hover {
-  background: rgba(0, 240, 240, 0.06);
-  box-shadow: inset 3px 0 0 #00f0f0;
-}
-
-[data-theme='tetrastack'] .playlist-row:hover {
-  background: rgba(0, 240, 240, 0.06);
-  box-shadow: inset 3px 0 0 #00f0f0;
-}
-
-/* Settings tabs: active = S-piece green left border */
-[data-theme='tetrastack'] .settings-tab:hover {
-  background: rgba(0, 240, 240, 0.06);
-  color: #00f0f0;
-}
-
-[data-theme='tetrastack'] .settings-tab.active {
-  background: rgba(0, 208, 0, 0.08);
-  color: #00d000;
-  box-shadow: inset 3px 0 0 #00d000;
-}
-
-/* Queue tabs */
-[data-theme='tetrastack'] .queue-tab-btn:hover {
-  background: rgba(0, 240, 240, 0.06);
-  color: #00f0f0;
-}
-
-/* Dropdowns / selects */
-[data-theme='tetrastack'] .custom-select-trigger:hover {
-  background: rgba(0, 240, 240, 0.06);
-}
-
-[data-theme='tetrastack'] .custom-select-option:hover {
-  background: rgba(0, 240, 240, 0.1) !important;
-  color: #00f0f0 !important;
-}
-
-/* Artist pill links = J-piece blue */
-[data-theme='tetrastack'] .artist-ext-link:hover {
-  background: rgba(0, 96, 240, 0.1);
-  color: #4090ff !important;
-  border-color: rgba(64, 144, 255, 0.4) !important;
-}
-
-/* Now playing active track = Z-piece red accent */
-[data-theme='tetrastack'] .np-album-track.active .np-album-track-title,
-[data-theme='tetrastack'] .np-album-track.active .np-album-track-num {
-  color: #f02000;
-  text-shadow: 0 0 8px rgba(240, 32, 0, 0.5);
-}
-
-/* Connection indicators */
-[data-theme='tetrastack'] .connection-type,
-[data-theme='tetrastack'] .connection-server {
-  color: #f0d000;
-}
-
-/* Sidebar section labels */
-[data-theme='tetrastack'] .nav-section-label {
-  color: rgba(0, 240, 240, 0.45);
-}
-
-/* Queue tab buttons (Lyrics / Warteschlange) — inactive */
-[data-theme='tetrastack'] .queue-tab-btn {
-  color: #6060a8;
-}
-
-/* Queue: inactive song artist */
-[data-theme='tetrastack'] .queue-item-artist {
-  color: #6060a8;
-}
-
-/* Queue: "Nächste Titel" divider */
-[data-theme='tetrastack'] .queue-divider span {
-  color: #6060a8 !important;
-}
-
-/* ── The Book (Social Media) ────────────────────────────────── */
-[data-theme='the-book'] {
-  color-scheme: light;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2365676B%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust: #FFFFFF;
-  --ctp-mantle: #FFFFFF;
-  --ctp-base: #F0F2F5;
-  --ctp-surface0: #E4E6EB;
-  --ctp-surface1: #D8DADF;
-  --ctp-surface2: #CED0D4;
-  --ctp-overlay0: #B0B3B8;
-  --ctp-overlay1: #4B4C4F;
-  --ctp-overlay2: #3A3B3D;
-  --ctp-text: #050505;
-  --ctp-subtext1: #44464A;
-  --ctp-subtext0: #65676B;
-
-  --ctp-mauve: #1877F2;
-  --ctp-lavender: #2D88FF;
-  --ctp-green: #42B72A;
-  --ctp-yellow: #F7B125;
-  --ctp-red: #FA383E;
-  --ctp-blue: #1877F2;
-  --ctp-teal: #00A400;
-  --ctp-sky: #45BD62;
-  --ctp-sapphire: #0064D1;
-  --ctp-pink: #F33E58;
-  --ctp-flamingo: #F33E58;
-  --ctp-rosewater: #F0F2F5;
-  --ctp-maroon: #B12425;
-  --ctp-peach: #F7B125;
-
-  --bg-app: #F0F2F5;
-  --bg-sidebar: #1877F2;
-  --bg-card: #FFFFFF;
-  --bg-hover: #F2F2F2;
-  --bg-player: #FFFFFF;
-  --bg-glass: rgba(255, 255, 255, 0.9);
-
-  --accent: #1877F2;
-  --accent-dim: rgba(24, 119, 242, 0.1);
-  --accent-glow: rgba(24, 119, 242, 0.2);
-  --volume-accent: #1877F2;
-
-  --text-primary: #050505;
-  --text-secondary: #44464A;
-  --text-muted: #65676B;
-  --border: #CED0D4;
-  --border-subtle: #E4E6EB;
-
-  --positive: #42B72A;
-  --warning: #F7B125;
-  --danger: #FA383E;
-
-  --radius-sm: 4px;
-  --radius-md: 8px;
-  --radius-lg: 12px;
-  --radius-xl: 16px;
-
-  --shadow-dropdown: 0 12px 28px 0 rgba(0, 0, 0, 0.1), 0 2px 4px 0 rgba(0, 0, 0, 0.1);
-}
-
-[data-theme='the-book'] .player-bar {
-  border-top: 1px solid var(--border-subtle);
-  box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.03);
-}
-
-[data-theme='the-book'] .sidebar {
-  border-right: none;
-}
-
-[data-theme='the-book'] .sidebar .nav-link {
-  color: rgba(255, 255, 255, 0.85);
-}
-
-[data-theme='the-book'] .sidebar .nav-link:hover {
-  background: rgba(255, 255, 255, 0.15);
-  color: #ffffff;
-}
-
-[data-theme='the-book'] .sidebar .nav-link.active {
-  background: rgba(255, 255, 255, 0.2);
-  color: #ffffff;
-  font-weight: 600;
-}
-
-[data-theme='the-book'] .sidebar .nav-section-label {
-  color: rgba(255, 255, 255, 0.55);
-}
-
-[data-theme='the-book'] .sidebar-brand .brand-name {
-  -webkit-text-fill-color: #ffffff;
-  color: #ffffff;
-}
-
-[data-theme='the-book'] .sidebar {
-  --accent: #ffffff;
-  --ctp-blue: #ffffff;
-}
-
-/* Queue panel — white text on blue background */
-[data-theme='the-book'] .queue-item-title {
-  color: rgba(255, 255, 255, 0.9);
-}
-
-[data-theme='the-book'] .queue-item-artist,
-[data-theme='the-book'] .queue-item-duration {
-  color: rgba(255, 255, 255, 0.55);
-}
-
-[data-theme='the-book'] .queue-item:hover .queue-item-title,
-[data-theme='the-book'] .queue-item.context-active .queue-item-title {
-  color: #ffffff;
-}
-
-[data-theme='the-book'] .queue-item.active .queue-item-title {
-  color: #ffffff;
-}
-
-[data-theme='the-book'] .queue-item.active .queue-item-artist,
-[data-theme='the-book'] .queue-item.active .queue-item-duration {
-  color: rgba(255, 255, 255, 0.7);
-}
-
-[data-theme='the-book'] .queue-item:hover,
-[data-theme='the-book'] .queue-item.context-active {
-  background: rgba(255, 255, 255, 0.1);
-}
-
-[data-theme='the-book'] .queue-header,
-[data-theme='the-book'] .queue-header h2 {
-  color: var(--text-primary);
-}
-
-[data-theme='the-book'] .queue-current-info h3 {
-  color: rgba(255, 255, 255, 0.9);
-}
-
-[data-theme='the-book'] .queue-current-sub {
-  color: rgba(255, 255, 255, 0.65);
-}
-
-[data-theme='the-book'] .collapse-btn {
-  background: rgba(255, 255, 255, 0.15);
-  border-color: rgba(255, 255, 255, 0.3);
-  color: #ffffff;
-}
-
-[data-theme='the-book'] .player-track-name,
-[data-theme='the-book'] .player-track-artist,
-[data-theme='the-book'] .player-time {
-  color: var(--text-primary) !important;
-}
-
-
-[data-theme='the-book'] .card {
-  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
-  border: 1px solid var(--border-subtle);
-}
-
-/* Album chip — opaque Facebook blue pill */
-[data-theme='the-book'] .badge,
-[data-theme='the-book'] .album-detail-badge {
-  background: #1877F2;
-  color: #ffffff;
-}
-
-/* Back button — opaque Facebook-style pill */
-[data-theme='the-book'] .album-detail-back {
-  background: #E7F3FF;
-  color: #1877F2;
-}
-[data-theme='the-book'] .album-detail-back:hover {
-  background: #D8EAFD;
-  color: #0d6ae0;
-}
-
-/* Queue/Lyrics tab bar — white text on blue sidebar */
-[data-theme='the-book'] .queue-tab-btn {
-  color: rgba(255, 255, 255, 0.65);
-}
-[data-theme='the-book'] .queue-tab-btn:hover {
-  color: #ffffff;
-  background: rgba(255, 255, 255, 0.1);
-}
-[data-theme='the-book'] .queue-tab-btn.active {
-  color: #ffffff;
-}
-
-/* ── ReadIt (Social Media) ──────────────────────────────────── */
-[data-theme='readit'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23FF4500%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust: #030303;
-  --ctp-mantle: #1A1A1B;
-  --ctp-base: #030303;
-  --ctp-surface0: #1A1A1B;
-  --ctp-surface1: #272729;
-  --ctp-surface2: #343536;
-  --ctp-overlay0: #818384;
-  --ctp-overlay1: #D7DADC;
-  --ctp-overlay2: #FFFFFF;
-  --ctp-text: #D7DADC;
-  --ctp-subtext1: #D7DADC;
-  --ctp-subtext0: #818384;
-
-  --ctp-mauve: #FF4500;
-  --ctp-lavender: #FF581A;
-  --ctp-green: #46D160;
-  --ctp-yellow: #FFD635;
-  --ctp-red: #FF4500;
-  --ctp-blue: #0079D3;
-  --ctp-teal: #00AD96;
-  --ctp-sky: #7193FF;
-  --ctp-sapphire: #3E5EB3;
-  --ctp-pink: #FF66AC;
-  --ctp-flamingo: #FF8280;
-  --ctp-rosewater: #FFB3A6;
-  --ctp-maroon: #EA0027;
-  --ctp-peach: #FFB000;
-
-  --bg-app: #030303;
-  --bg-sidebar: #1A1A1B;
-  --bg-card: #1A1A1B;
-  --bg-hover: #272729;
-  --bg-player: #1A1A1B;
-  --bg-glass: rgba(26, 26, 27, 0.9);
-
-  --accent: #FF4500;
-  --accent-dim: rgba(255, 69, 0, 0.1);
-  --accent-glow: rgba(255, 69, 0, 0.3);
-  --volume-accent: #FF4500;
-
-  --text-primary: #D7DADC;
-  --text-secondary: #D7DADC;
-  --text-muted: #818384;
-  --border: #343536;
-  --border-subtle: #272729;
-
-  --radius-sm: 4px;
-  --radius-md: 4px;
-  --radius-lg: 8px;
-  --radius-xl: 12px;
-}
-
-[data-theme='readit'] .player-bar {
-  border-top: 1px solid var(--border);
-  background: var(--bg-sidebar);
-}
-
-[data-theme='readit'] .sidebar {
-  border-right: 1px solid var(--border);
-}
-
-[data-theme='readit'] .nav-link.active {
-  background: transparent;
-  color: var(--accent);
-}
-
-[data-theme='readit'] .nav-link.active::before {
-  background: var(--accent) !important;
-  width: 2px;
-  border-radius: 0 2px 2px 0;
-}
-
-[data-theme='readit'] .btn-primary {
-  background: var(--accent);
-  color: white;
-  font-weight: 700;
-  text-transform: uppercase;
-  letter-spacing: 0.5px;
-  font-size: 11px;
-}
-
-[data-theme='readit'] .btn-primary:hover {
-  background: var(--ctp-lavender);
-}
-
-[data-theme='readit'] .card {
-  border: 1px solid var(--border);
-}
-
-[data-theme='readit'] .queue-item.active {
-  border-left: 2px solid var(--accent);
-  background: var(--accent-dim);
-}
-
-/* ── Insta (Social Media) ───────────────────────────────────── */
-[data-theme='insta'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23FFFFFF%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust: #000000;
-  --ctp-mantle: #000000;
-  --ctp-base: #121212;
-  --ctp-surface0: #1A1A1A;
-  --ctp-surface1: #262626;
-  --ctp-surface2: #363636;
-  --ctp-overlay0: #737373;
-  --ctp-overlay1: #A8A8A8;
-  --ctp-overlay2: #C7C7C7;
-  --ctp-text: #F5F5F5;
-  --ctp-subtext1: #DBDBDB;
-  --ctp-subtext0: #8E8E8E;
-
-  --ctp-mauve: #E1306C;
-  --ctp-lavender: #C13584;
-  --ctp-green: #0095F6;
-  --ctp-yellow: #FFD600;
-  --ctp-red: #ED4956;
-  --ctp-peach: #F56040;
-  --ctp-flamingo: #FD1D1D;
-  --ctp-blue: #0095F6;
-  --ctp-teal: #0095F6;
-  --ctp-sky: #C13584;
-  --ctp-sapphire: #833ab4;
-  --ctp-pink: #E1306C;
-  --ctp-rosewater: #fcb045;
-  --ctp-maroon: #ED4956;
-
-  --bg-app: #121212;
-  --bg-sidebar: #000000;
-  --bg-card: #1A1A1A;
-  --bg-hover: #262626;
-  --bg-player: #000000;
-  --bg-glass: rgba(0, 0, 0, 0.85);
-
-  --accent: #E1306C;
-  --accent-dim: rgba(225, 48, 108, 0.15);
-  --accent-glow: rgba(225, 48, 108, 0.35);
-  --volume-accent: #E1306C;
-
-  --text-primary: #F5F5F5;
-  --text-secondary: #A8A8A8;
-  --text-muted: #737373;
-  --border: #262626;
-  --border-subtle: #1A1A1A;
-
-  --radius-sm: 4px;
-  --radius-md: 8px;
-  --radius-lg: 12px;
-  --radius-xl: 22px;
-}
-
-[data-theme='insta'] .progress-bar-fill {
-  background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%) !important;
-}
-
-[data-theme='insta'] .nav-link.active::before {
-  background: linear-gradient(to bottom, #833ab4, #fd1d1d, #fcb045) !important;
-  width: 3px;
-}
-
-[data-theme='insta'] .player-bar {
-  border-top: 1px solid var(--border);
-}
-
-[data-theme='insta'] .btn-primary:hover {
-  background: linear-gradient(45deg, #f09433, #dc2743, #bc1888) !important;
-  border-color: transparent;
-}
-
-[data-theme='insta'] .sidebar {
-  border-right: 1px solid var(--border);
-}
-
-/* ── Hill Valley 85 (Movies) ────────────────────────────────── */
diff --git a/src/styles/themes/duskfox.css b/src/styles/themes/duskfox.css
deleted file mode 100644
index a78634e2..00000000
--- a/src/styles/themes/duskfox.css
+++ /dev/null
@@ -1,53 +0,0 @@
-/* ─── Duskfox ─── */
-[data-theme='duskfox'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23e0def4%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust: #191726;
-  --ctp-mantle: #191726;
-  --ctp-base: #232136;
-  --ctp-surface0: #2d2a45;
-  --ctp-surface1: #373354;
-  --ctp-surface2: #4b4673;
-  --ctp-overlay0: #817c9c;
-  --ctp-overlay1: #6e6a86;
-  --ctp-overlay2: #cdcbe0;
-  --ctp-text: #e0def4;
-  --ctp-subtext1: #cdcbe0;
-  --ctp-subtext0: #817c9c;
-  --ctp-mauve: #c4a7e7;
-  --ctp-lavender: #c4a7e7;
-  --ctp-pink: #eb98c3;
-  --ctp-flamingo: #eb6f92;
-  --ctp-rosewater: #ea9a97;
-  --ctp-blue: #569fba;
-  --ctp-sapphire: #569fba;
-  --ctp-sky: #9ccfd8;
-  --ctp-teal: #9ccfd8;
-  --ctp-green: #a3be8c;
-  --ctp-yellow: #f6c177;
-  --ctp-peach: #ea9a97;
-  --ctp-maroon: #eb6f92;
-  --ctp-red: #eb6f92;
-
-  --bg-app: #232136;
-  --bg-sidebar: #191726;
-  --bg-card: #2d2a45;
-  --bg-hover: #373354;
-  --bg-player: #191726;
-  --bg-glass: rgba(35, 33, 54, 0.75);
-  --accent: #c4a7e7;
-  --accent-dim: rgba(196, 167, 231, 0.15);
-  --accent-glow: rgba(196, 167, 231, 0.3);
-  --text-primary: #e0def4;
-  --text-secondary: #cdcbe0;
-  --text-muted: #817c9c;
-  --border: #373354;
-  --border-subtle: #2d2a45;
-  --border-dropdown: #4b4673;
-  --shadow-dropdown: rgba(0, 0, 0, 0.6);
-  --positive: #a3be8c;
-  --warning: #f6c177;
-  --danger: #eb6f92;
-}
-
diff --git a/src/styles/themes/dzr0.css b/src/styles/themes/dzr0.css
deleted file mode 100644
index 34251a18..00000000
--- a/src/styles/themes/dzr0.css
+++ /dev/null
@@ -1,104 +0,0 @@
-/* ─── Dzr0 ─── */
-[data-theme='dzr0'] {
-  color-scheme: light;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23A238FF%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust: #E5E5E9;
-  --ctp-mantle: #F5F5F7;
-  --ctp-base: #FFFFFF;
-  --ctp-surface0: #F0F0F3;
-  --ctp-surface1: #E8E8EC;
-  --ctp-surface2: #D8D8DF;
-  --ctp-overlay0: #9E9EAF;
-  --ctp-overlay1: #7C7C8F;
-  --ctp-overlay2: #5D5D70;
-  --ctp-text: #121216;
-  --ctp-subtext1: #4A4A5A;
-  --ctp-subtext0: #6A6A7A;
-
-  --ctp-mauve: #A238FF;
-  --ctp-lavender: #B86BFF;
-  --ctp-green: #00C171;
-  --ctp-teal: #00C171;
-  --ctp-sky: #3D91F4;
-  --ctp-blue: #2E77D0;
-  --ctp-sapphire: #1C5599;
-  --ctp-pink: #EF3B5D;
-  --ctp-flamingo: #EF3B5D;
-  --ctp-rosewater: #FFC8C8;
-  --ctp-yellow: #FFCC00;
-  --ctp-peach: #FF7A00;
-  --ctp-maroon: #B22A2A;
-  --ctp-red: #EF3B5D;
-
-  --bg-app: #FFFFFF;
-  --bg-sidebar: #F5F5F7;
-  --bg-card: #FBFBFC;
-  --bg-hover: #F0F0F3;
-  --bg-player: #FFFFFF;
-  --bg-glass: rgba(255, 255, 255, 0.85);
-
-  --accent: #A238FF;
-  --accent-dim: rgba(162, 56, 255, 0.12);
-  --accent-glow: rgba(162, 56, 255, 0.25);
-  --volume-accent: #A238FF;
-
-  --text-primary: #121216;
-  --text-secondary: #4A4A5A;
-  --text-muted: #6B6B7A;
-
-  --border: #E2E2E9;
-  --border-subtle: #F0F0F5;
-
-  --positive: #00C171;
-  --warning: #FFCC00;
-  --danger: #EF3B5D;
-
-  --radius-sm: 8px;
-  --radius-md: 12px;
-  --radius-lg: 20px;
-  --radius-xl: 28px;
-  --radius-full: 9999px;
-
-  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08);
-  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.10);
-  --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.12);
-
-  --transition-fast: 150ms ease;
-  --transition-med: 250ms ease;
-  --transition-slow: 350ms ease;
-
-  --sidebar-width: 220px;
-  --player-height: 88px;
-}
-
-[data-theme='dzr0'] .player-bar {
-  border-top: 1px solid var(--border-subtle);
-  box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.03);
-}
-
-[data-theme='dzr0'] .player-track-name,
-[data-theme='dzr0'] .player-time,
-[data-theme='dzr0'] .player-track-artist {
-  color: var(--text-primary) !important;
-}
-
-[data-theme='dzr0'] .sidebar {
-  border-right: 1px solid var(--border-subtle);
-}
-
-[data-theme='dzr0'] .nav-link:hover {
-  background-color: var(--bg-hover);
-  color: var(--accent);
-}
-
-[data-theme='dzr0'] .nav-link.active {
-  background-color: var(--accent-dim);
-  color: var(--accent);
-  font-weight: 600;
-}
-
-[data-theme='dzr0'] .btn-primary {
-  color: #FFFFFF !important;
-}
-
diff --git a/src/styles/themes/grand-theft-audio-gta-v-los-santos-at-night.css b/src/styles/themes/grand-theft-audio-gta-v-los-santos-at-night.css
deleted file mode 100644
index aeaa2ae4..00000000
--- a/src/styles/themes/grand-theft-audio-gta-v-los-santos-at-night.css
+++ /dev/null
@@ -1,225 +0,0 @@
-/* ─── Grand Theft Audio — GTA V / Los Santos at Night ─── */
-/* Money green + Wanted-level gold + LS asphalt dark           */
-[data-theme='grand-theft-audio'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2357b05a%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* LS asphalt — almost black with a warm urban undertone */
-  --ctp-crust: #030303;
-  --ctp-mantle: #080808;
-  --ctp-base: #0e0e0e;
-  --ctp-surface0: #161616;
-  --ctp-surface1: #202020;
-  --ctp-surface2: #2c2c2c;
-  --ctp-overlay0: #707070;
-  --ctp-overlay1: #909090;
-  --ctp-overlay2: #b0b0b0;
-  --ctp-text: #d8d8d8;
-  --ctp-subtext1: #b8b8b8;
-  --ctp-subtext0: #888888;
-
-  /* GTA palette */
-  --ctp-green: #57b05a;
-  /* money green — health bar */
-  --ctp-mauve: #57b05a;
-  --ctp-teal: #3d9e40;
-  --ctp-yellow: #ffd700;
-  /* wanted stars — 5-star gold */
-  --ctp-peach: #ffb800;
-  /* Los Santos Customs orange */
-  --ctp-flamingo: #ffb800;
-  --ctp-rosewater: #ffb800;
-  --ctp-red: #e02020;
-  /* wasted / busted red */
-  --ctp-maroon: #c01818;
-  --ctp-blue: #4a9fd4;
-  /* armor bar blue */
-  --ctp-sapphire: #3a8fc4;
-  --ctp-sky: #4a9fd4;
-  --ctp-lavender: #57b05a;
-  --ctp-pink: #e02020;
-
-  --bg-app: #0e0e0e;
-  --bg-sidebar: #080808;
-  /* minimap dark */
-  --bg-card: #161616;
-  --bg-hover: rgba(87, 176, 90, 0.08);
-  --bg-player: #030303;
-  /* HUD strip */
-  --bg-glass: rgba(8, 8, 8, 0.95);
-
-  --accent: #57b05a;
-  /* money green */
-  --accent-dim: rgba(87, 176, 90, 0.14);
-  --accent-glow: rgba(87, 176, 90, 0.45);
-  --volume-accent: #ffd700;
-  /* wanted-gold for volume knob */
-
-  --text-primary: #d8d8d8;
-  --text-secondary: #ffd700;
-  /* wanted-level gold — the key differentiator */
-  --text-muted: #707070;
-  --border: #242424;
-  --border-subtle: #161616;
-  --shadow-dropdown: rgba(0, 0, 0, 0.9);
-
-  --radius-sm: 0px;
-  --radius-md: 2px;
-  --radius-lg: 3px;
-  --radius-xl: 4px;
-}
-
-/* Sidebar = minimap panel: dark border + subtle city-grid stripe */
-[data-theme='grand-theft-audio'] .sidebar {
-  border-right: 2px solid #57b05a;
-  background-image: repeating-linear-gradient(135deg,
-      transparent,
-      transparent 40px,
-      rgba(87, 176, 90, 0.018) 40px,
-      rgba(87, 176, 90, 0.018) 41px);
-}
-
-/* Player bar = GTA HUD strip: green health line + gold secondary */
-[data-theme='grand-theft-audio'] .player-bar {
-  border-top: 2px solid #57b05a;
-  box-shadow:
-    0 -1px 0 rgba(255, 215, 0, 0.25),
-    0 -8px 30px rgba(87, 176, 90, 0.08);
-}
-
-/* Track name = money counter — green + uppercase */
-[data-theme='grand-theft-audio'] .player-track-name {
-  color: #57b05a;
-  text-shadow: 0 0 10px rgba(87, 176, 90, 0.6), 0 0 24px rgba(87, 176, 90, 0.25);
-  text-transform: uppercase;
-  font-weight: 800;
-  letter-spacing: 0.06em;
-}
-
-/* Artist = wanted-gold, like the bounty/level display */
-[data-theme='grand-theft-audio'] .player-track-artist {
-  color: #ffd700;
-}
-
-/* Active nav link: money-green gradient + glow bar */
-[data-theme='grand-theft-audio'] .nav-link.active {
-  background: linear-gradient(90deg, rgba(87, 176, 90, 0.18) 0%, transparent 100%);
-  color: #57b05a;
-}
-
-[data-theme='grand-theft-audio'] .nav-link.active::before {
-  width: 3px;
-  box-shadow: 2px 0 12px rgba(87, 176, 90, 0.6);
-}
-
-/* Buttons: blocky GTA UI style */
-[data-theme='grand-theft-audio'] .btn-primary {
-  background: #57b05a;
-  color: #030303;
-  text-transform: uppercase;
-  font-weight: 800;
-  letter-spacing: 0.06em;
-  border: none;
-}
-
-[data-theme='grand-theft-audio'] .btn-primary:hover {
-  background: #6abf6e;
-}
-
-/* Queue active = health-bar green left strip */
-[data-theme='grand-theft-audio'] .queue-item.active {
-  background: rgba(87, 176, 90, 0.08);
-  box-shadow: inset 3px 0 0 #57b05a;
-}
-
-[data-theme='grand-theft-audio'] .np-queue-item.active {
-  background: rgba(87, 176, 90, 0.07);
-}
-
-[data-theme='grand-theft-audio'] .np-queue-item-active {
-  color: #57b05a;
-  text-shadow: 0 0 8px rgba(87, 176, 90, 0.55);
-}
-
-/* Now-playing active track = gold (5-star wanted) */
-[data-theme='grand-theft-audio'] .np-album-track.active .np-album-track-title,
-[data-theme='grand-theft-audio'] .np-album-track.active .np-album-track-num {
-  color: #ffd700;
-  text-shadow: 0 0 8px rgba(255, 215, 0, 0.5);
-}
-
-/* Hover rows */
-[data-theme='grand-theft-audio'] .track-row:hover,
-[data-theme='grand-theft-audio'] .track-row.context-active {
-  background: rgba(87, 176, 90, 0.07) !important;
-  box-shadow: inset 3px 0 0 #57b05a;
-}
-
-[data-theme='grand-theft-audio'] .queue-item:hover,
-[data-theme='grand-theft-audio'] .queue-item.context-active {
-  background: rgba(87, 176, 90, 0.08) !important;
-  box-shadow: inset 3px 0 0 #57b05a;
-}
-
-[data-theme='grand-theft-audio'] .np-queue-item:hover,
-[data-theme='grand-theft-audio'] .np-queue-item.context-active {
-  background: rgba(87, 176, 90, 0.07);
-  box-shadow: inset 2px 0 0 #57b05a;
-}
-
-[data-theme='grand-theft-audio'] .artist-row:hover {
-  background: rgba(87, 176, 90, 0.07);
-  box-shadow: inset 3px 0 0 #57b05a;
-}
-
-[data-theme='grand-theft-audio'] .playlist-row:hover {
-  background: rgba(87, 176, 90, 0.07);
-  box-shadow: inset 3px 0 0 #57b05a;
-}
-
-/* Settings tabs: gold active = 5-star screen */
-[data-theme='grand-theft-audio'] .settings-tab:hover {
-  background: rgba(87, 176, 90, 0.07);
-  color: #57b05a;
-}
-
-[data-theme='grand-theft-audio'] .settings-tab.active {
-  background: rgba(255, 215, 0, 0.07);
-  color: #ffd700;
-  box-shadow: inset 3px 0 0 #ffd700;
-}
-
-/* Queue tab */
-[data-theme='grand-theft-audio'] .queue-tab-btn:hover {
-  background: rgba(87, 176, 90, 0.07);
-  color: #57b05a;
-}
-
-/* Dropdowns */
-[data-theme='grand-theft-audio'] .custom-select-trigger:hover {
-  background: rgba(87, 176, 90, 0.07);
-}
-
-[data-theme='grand-theft-audio'] .custom-select-option:hover {
-  background: rgba(87, 176, 90, 0.1) !important;
-  color: #57b05a !important;
-}
-
-/* Artist pills = LS Customs orange */
-[data-theme='grand-theft-audio'] .artist-ext-link:hover {
-  background: rgba(255, 184, 0, 0.1);
-  color: #ffb800 !important;
-  border-color: rgba(255, 184, 0, 0.4) !important;
-}
-
-/* Queue album title = gold */
-[data-theme='grand-theft-audio'] .queue-meta-album {
-  color: #ffd700;
-}
-
-/* Connection indicators */
-[data-theme='grand-theft-audio'] .connection-type,
-[data-theme='grand-theft-audio'] .connection-server {
-  color: #ffd700;
-}
-
diff --git a/src/styles/themes/gruvbox-dark-hard.css b/src/styles/themes/gruvbox-dark-hard.css
deleted file mode 100644
index fe5145c6..00000000
--- a/src/styles/themes/gruvbox-dark-hard.css
+++ /dev/null
@@ -1,53 +0,0 @@
-/* ─── Gruvbox Dark Hard ─── */
-[data-theme='gruvbox-dark-hard'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ebdbb2%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust: #1d2021;
-  --ctp-mantle: #1d2021;
-  --ctp-base: #282828;
-  --ctp-surface0: #3c3836;
-  --ctp-surface1: #504945;
-  --ctp-surface2: #665c54;
-  --ctp-overlay0: #7c6f64;
-  --ctp-overlay1: #928374;
-  --ctp-overlay2: #a89984;
-  --ctp-text: #ebdbb2;
-  --ctp-subtext1: #d5c4a1;
-  --ctp-subtext0: #bdae93;
-  --ctp-mauve: #d3869b;
-  --ctp-lavender: #d3869b;
-  --ctp-pink: #d3869b;
-  --ctp-flamingo: #fb4934;
-  --ctp-rosewater: #fb4934;
-  --ctp-blue: #83a598;
-  --ctp-sapphire: #83a598;
-  --ctp-sky: #8ec07c;
-  --ctp-teal: #8ec07c;
-  --ctp-green: #b8bb26;
-  --ctp-yellow: #fabd2f;
-  --ctp-peach: #fe8019;
-  --ctp-maroon: #fb4934;
-  --ctp-red: #cc241d;
-
-  --bg-app: #1d2021;
-  --bg-sidebar: #141617;
-  --bg-card: #3c3836;
-  --bg-hover: #504945;
-  --bg-player: #1d2021;
-  --bg-glass: rgba(29, 32, 33, 0.82);
-  --accent: #fabd2f;
-  --accent-dim: rgba(250, 189, 47, 0.15);
-  --accent-glow: rgba(250, 189, 47, 0.3);
-  --text-primary: #ebdbb2;
-  --text-secondary: #d5c4a1;
-  --text-muted: #928374;
-  --border: #504945;
-  --border-subtle: #3c3836;
-  --border-dropdown: #665c54;
-  --shadow-dropdown: rgba(0, 0, 0, 0.6);
-  --positive: #b8bb26;
-  --warning: #fabd2f;
-  --danger: #fb4934;
-}
-
diff --git a/src/styles/themes/gruvbox-dark-medium.css b/src/styles/themes/gruvbox-dark-medium.css
deleted file mode 100644
index f6b016ae..00000000
--- a/src/styles/themes/gruvbox-dark-medium.css
+++ /dev/null
@@ -1,53 +0,0 @@
-/* ─── Gruvbox Dark Medium ─── */
-[data-theme='gruvbox-dark-medium'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ebdbb2%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust: #1d2021;
-  --ctp-mantle: #1d2021;
-  --ctp-base: #282828;
-  --ctp-surface0: #3c3836;
-  --ctp-surface1: #504945;
-  --ctp-surface2: #665c54;
-  --ctp-overlay0: #7c6f64;
-  --ctp-overlay1: #928374;
-  --ctp-overlay2: #a89984;
-  --ctp-text: #ebdbb2;
-  --ctp-subtext1: #d5c4a1;
-  --ctp-subtext0: #bdae93;
-  --ctp-mauve: #d3869b;
-  --ctp-lavender: #d3869b;
-  --ctp-pink: #d3869b;
-  --ctp-flamingo: #fb4934;
-  --ctp-rosewater: #fb4934;
-  --ctp-blue: #83a598;
-  --ctp-sapphire: #83a598;
-  --ctp-sky: #8ec07c;
-  --ctp-teal: #8ec07c;
-  --ctp-green: #b8bb26;
-  --ctp-yellow: #fabd2f;
-  --ctp-peach: #fe8019;
-  --ctp-maroon: #fb4934;
-  --ctp-red: #cc241d;
-
-  --bg-app: #282828;
-  --bg-sidebar: #1d2021;
-  --bg-card: #3c3836;
-  --bg-hover: #504945;
-  --bg-player: #1d2021;
-  --bg-glass: rgba(40, 40, 40, 0.82);
-  --accent: #fabd2f;
-  --accent-dim: rgba(250, 189, 47, 0.15);
-  --accent-glow: rgba(250, 189, 47, 0.3);
-  --text-primary: #ebdbb2;
-  --text-secondary: #d5c4a1;
-  --text-muted: #928374;
-  --border: #504945;
-  --border-subtle: #3c3836;
-  --border-dropdown: #665c54;
-  --shadow-dropdown: rgba(0, 0, 0, 0.55);
-  --positive: #b8bb26;
-  --warning: #fabd2f;
-  --danger: #fb4934;
-}
-
diff --git a/src/styles/themes/gruvbox-dark-soft.css b/src/styles/themes/gruvbox-dark-soft.css
deleted file mode 100644
index d643a7b2..00000000
--- a/src/styles/themes/gruvbox-dark-soft.css
+++ /dev/null
@@ -1,53 +0,0 @@
-/* ─── Gruvbox Dark Soft ─── */
-[data-theme='gruvbox-dark-soft'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ebdbb2%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust: #1d2021;
-  --ctp-mantle: #282828;
-  --ctp-base: #32302f;
-  --ctp-surface0: #3c3836;
-  --ctp-surface1: #504945;
-  --ctp-surface2: #665c54;
-  --ctp-overlay0: #7c6f64;
-  --ctp-overlay1: #928374;
-  --ctp-overlay2: #a89984;
-  --ctp-text: #ebdbb2;
-  --ctp-subtext1: #d5c4a1;
-  --ctp-subtext0: #bdae93;
-  --ctp-mauve: #d3869b;
-  --ctp-lavender: #d3869b;
-  --ctp-pink: #d3869b;
-  --ctp-flamingo: #fb4934;
-  --ctp-rosewater: #fb4934;
-  --ctp-blue: #83a598;
-  --ctp-sapphire: #83a598;
-  --ctp-sky: #8ec07c;
-  --ctp-teal: #8ec07c;
-  --ctp-green: #b8bb26;
-  --ctp-yellow: #fabd2f;
-  --ctp-peach: #fe8019;
-  --ctp-maroon: #fb4934;
-  --ctp-red: #cc241d;
-
-  --bg-app: #32302f;
-  --bg-sidebar: #282828;
-  --bg-card: #45403d;
-  --bg-hover: #504945;
-  --bg-player: #282828;
-  --bg-glass: rgba(50, 48, 47, 0.82);
-  --accent: #fabd2f;
-  --accent-dim: rgba(250, 189, 47, 0.15);
-  --accent-glow: rgba(250, 189, 47, 0.3);
-  --text-primary: #ebdbb2;
-  --text-secondary: #d5c4a1;
-  --text-muted: #928374;
-  --border: #504945;
-  --border-subtle: #3c3836;
-  --border-dropdown: #665c54;
-  --shadow-dropdown: rgba(0, 0, 0, 0.5);
-  --positive: #b8bb26;
-  --warning: #fabd2f;
-  --danger: #fb4934;
-}
-
diff --git a/src/styles/themes/gruvbox-light-hard.css b/src/styles/themes/gruvbox-light-hard.css
deleted file mode 100644
index 6e5289a8..00000000
--- a/src/styles/themes/gruvbox-light-hard.css
+++ /dev/null
@@ -1,51 +0,0 @@
-/* ─── Gruvbox Light Hard ─── */
-[data-theme='gruvbox-light-hard'] {
-  color-scheme: light;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23504945%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust: #ebdbb2;
-  --ctp-mantle: #f2e5bc;
-  --ctp-base: #f9f5d7;
-  --ctp-surface0: #f2e5bc;
-  --ctp-surface1: #ebdbb2;
-  --ctp-surface2: #d5c4a1;
-  --ctp-overlay0: #bdae93;
-  --ctp-overlay1: #a89984;
-  --ctp-overlay2: #928374;
-  --ctp-text: #3c3836;
-  --ctp-subtext1: #504945;
-  --ctp-subtext0: #665c54;
-  --ctp-mauve: #8f3f71;
-  --ctp-lavender: #8f3f71;
-  --ctp-pink: #8f3f71;
-  --ctp-flamingo: #9d0006;
-  --ctp-rosewater: #cc241d;
-  --ctp-blue: #076678;
-  --ctp-sapphire: #076678;
-  --ctp-sky: #427b58;
-  --ctp-teal: #427b58;
-  --ctp-green: #79740e;
-  --ctp-yellow: #b57614;
-  --ctp-peach: #af3a03;
-  --ctp-maroon: #9d0006;
-  --ctp-red: #cc241d;
-
-  --bg-app: #f9f5d7;
-  --bg-sidebar: #f2e5bc;
-  --bg-card: #f2e5bc;
-  --bg-hover: #ebdbb2;
-  --bg-player: #f2e5bc;
-  --bg-glass: rgba(249, 245, 215, 0.9);
-  --accent: #b57614;
-  --accent-dim: rgba(181, 118, 20, 0.15);
-  --accent-glow: rgba(181, 118, 20, 0.25);
-  --text-primary: #3c3836;
-  --text-secondary: #504945;
-  --text-muted: #7c6f64;
-  --border: #d5c4a1;
-  --border-subtle: #ebdbb2;
-  --positive: #79740e;
-  --warning: #b57614;
-  --danger: #9d0006;
-}
-
diff --git a/src/styles/themes/gruvbox-light-medium.css b/src/styles/themes/gruvbox-light-medium.css
deleted file mode 100644
index d7e39fa5..00000000
--- a/src/styles/themes/gruvbox-light-medium.css
+++ /dev/null
@@ -1,51 +0,0 @@
-/* ─── Gruvbox Light Medium ─── */
-[data-theme='gruvbox-light-medium'] {
-  color-scheme: light;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23504945%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust: #ebdbb2;
-  --ctp-mantle: #f2e5bc;
-  --ctp-base: #fbf1c7;
-  --ctp-surface0: #f2e5bc;
-  --ctp-surface1: #ebdbb2;
-  --ctp-surface2: #d5c4a1;
-  --ctp-overlay0: #bdae93;
-  --ctp-overlay1: #a89984;
-  --ctp-overlay2: #928374;
-  --ctp-text: #3c3836;
-  --ctp-subtext1: #504945;
-  --ctp-subtext0: #665c54;
-  --ctp-mauve: #8f3f71;
-  --ctp-lavender: #8f3f71;
-  --ctp-pink: #8f3f71;
-  --ctp-flamingo: #9d0006;
-  --ctp-rosewater: #cc241d;
-  --ctp-blue: #076678;
-  --ctp-sapphire: #076678;
-  --ctp-sky: #427b58;
-  --ctp-teal: #427b58;
-  --ctp-green: #79740e;
-  --ctp-yellow: #b57614;
-  --ctp-peach: #af3a03;
-  --ctp-maroon: #9d0006;
-  --ctp-red: #cc241d;
-
-  --bg-app: #fbf1c7;
-  --bg-sidebar: #f2e5bc;
-  --bg-card: #f2e5bc;
-  --bg-hover: #ebdbb2;
-  --bg-player: #f2e5bc;
-  --bg-glass: rgba(251, 241, 199, 0.9);
-  --accent: #b57614;
-  --accent-dim: rgba(181, 118, 20, 0.15);
-  --accent-glow: rgba(181, 118, 20, 0.25);
-  --text-primary: #3c3836;
-  --text-secondary: #504945;
-  --text-muted: #7c6f64;
-  --border: #d5c4a1;
-  --border-subtle: #ebdbb2;
-  --positive: #79740e;
-  --warning: #b57614;
-  --danger: #9d0006;
-}
-
diff --git a/src/styles/themes/gruvbox-light-soft.css b/src/styles/themes/gruvbox-light-soft.css
deleted file mode 100644
index ae98c5e8..00000000
--- a/src/styles/themes/gruvbox-light-soft.css
+++ /dev/null
@@ -1,66 +0,0 @@
-/* ─── Gruvbox Light Soft ─── */
-[data-theme='gruvbox-light-soft'] {
-  color-scheme: light;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23504945%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust: #ebdbb2;
-  --ctp-mantle: #f2e5bc;
-  --ctp-base: #f2e5bc;
-  --ctp-surface0: #ebdbb2;
-  --ctp-surface1: #d5c4a1;
-  --ctp-surface2: #bdae93;
-  --ctp-overlay0: #a89984;
-  --ctp-overlay1: #928374;
-  --ctp-overlay2: #7c6f64;
-  --ctp-text: #3c3836;
-  --ctp-subtext1: #504945;
-  --ctp-subtext0: #665c54;
-  --ctp-mauve: #8f3f71;
-  --ctp-lavender: #8f3f71;
-  --ctp-pink: #8f3f71;
-  --ctp-flamingo: #9d0006;
-  --ctp-rosewater: #cc241d;
-  --ctp-blue: #076678;
-  --ctp-sapphire: #076678;
-  --ctp-sky: #427b58;
-  --ctp-teal: #427b58;
-  --ctp-green: #79740e;
-  --ctp-yellow: #b57614;
-  --ctp-peach: #af3a03;
-  --ctp-maroon: #9d0006;
-  --ctp-red: #cc241d;
-
-  --bg-app: #f2e5bc;
-  --bg-sidebar: #ebdbb2;
-  --bg-card: #ebdbb2;
-  --bg-hover: #d5c4a1;
-  --bg-player: #ebdbb2;
-  --bg-glass: rgba(242, 229, 188, 0.9);
-  --accent: #b57614;
-  --accent-dim: rgba(181, 118, 20, 0.15);
-  --accent-glow: rgba(181, 118, 20, 0.25);
-  --text-primary: #3c3836;
-  --text-secondary: #504945;
-  --text-muted: #7c6f64;
-  --border: #d5c4a1;
-  --border-subtle: #ebdbb2;
-  --positive: #79740e;
-  --warning: #b57614;
-  --danger: #9d0006;
-}
-
-/* ── Gruvbox Light Soft overrides ── */
-[data-theme='gruvbox-light-soft'] .album-detail-back {
-  color: #fbf1c7;
-}
-
-[data-theme='gruvbox-light-soft'] .album-detail-back:hover {
-  background: rgba(255, 255, 255, 0.15);
-  color: #ffffff;
-}
-
-[data-theme='gruvbox-light-soft'] .album-detail-badge {
-  background: var(--accent);
-  color: #fbf1c7;
-}
-
diff --git a/src/styles/themes/guild-wars-1-tyria.css b/src/styles/themes/guild-wars-1-tyria.css
deleted file mode 100644
index 6c66abe4..00000000
--- a/src/styles/themes/guild-wars-1-tyria.css
+++ /dev/null
@@ -1,206 +0,0 @@
-/* ─── Guild Wars 1 — Tyria ─── */
-[data-theme='gw1'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23c8960c%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* Palette — aged Tyrian stone, ornate gold, Searing crimson */
-  --ctp-crust: #060402;
-  --ctp-mantle: #0a0806;
-  --ctp-base: #0e0b08;
-  --ctp-surface0: #1a1208;
-  --ctp-surface1: #261b0c;
-  --ctp-surface2: #342510;
-  --ctp-overlay0: #5a4830;
-  --ctp-overlay1: #7a6448;
-  --ctp-overlay2: #9a8060;
-  --ctp-text: #f0e4c4;
-  --ctp-subtext1: #d4c49a;
-  --ctp-subtext0: #b0a07a;
-  --ctp-mauve: #c8960c;
-  --ctp-lavender: #e8b820;
-  --ctp-pink: #c0321a;
-  --ctp-flamingo: #d4780c;
-  --ctp-rosewater: #f0e4c4;
-  --ctp-green: #5a8030;
-  --ctp-teal: #3a6858;
-  --ctp-sky: #7aaccc;
-  --ctp-blue: #3a6898;
-  --ctp-sapphire: #3a6898;
-  --ctp-yellow: #e8c840;
-  --ctp-peach: #d4780c;
-  --ctp-maroon: #8b1515;
-  --ctp-red: #c0321a;
-
-  --bg-app: #0e0b08;
-  --bg-sidebar: #0a0806;
-  --bg-card: #1a1208;
-  --bg-hover: #261b0c;
-  --bg-player: #060402;
-  --bg-glass: rgba(14, 11, 8, 0.88);
-  --accent: #c8960c;
-  --accent-dim: rgba(200, 150, 12, 0.15);
-  --accent-glow: rgba(200, 150, 12, 0.35);
-  --text-primary: #f0e4c4;
-  --text-secondary: #9a8060;
-  --text-muted: #a08858;
-  --border: rgba(200, 150, 12, 0.28);
-  --border-subtle: rgba(200, 150, 12, 0.10);
-  --border-dropdown: rgba(200, 150, 12, 0.35);
-  --shadow-dropdown: rgba(0, 0, 0, 0.85);
-  --positive: #5a8030;
-  --warning: #d4780c;
-  --danger: #c0321a;
-  --radius-sm: 2px;
-  --radius-md: 3px;
-  --radius-lg: 4px;
-}
-
-/* App shell — solid dark stone base (grid moved to sidebar-only for perf) */
-
-/* Sidebar — worn leather with faint horizontal stone lines */
-[data-theme='gw1'] .sidebar {
-  border-right: 1px solid rgba(200, 150, 12, 0.35);
-  background: linear-gradient(180deg, #0c0906 0%, #080604 100%);
-  background-image: repeating-linear-gradient(0deg,
-      rgba(200, 150, 12, 0.04) 0px,
-      transparent 1px,
-      transparent 48px,
-      rgba(200, 150, 12, 0.04) 49px);
-}
-
-/* Player bar — the GW1 skill bar: deepest black, gold top border */
-[data-theme='gw1'] .player-bar {
-  background: #060402;
-  border-top: 2px solid #c8960c;
-  box-shadow: 0 -6px 28px rgba(200, 150, 12, 0.14), 0 -1px 0 rgba(0, 0, 0, 0.9);
-}
-
-/* Track name — Tyrian item-name gold glow, Cinzel serif */
-[data-theme='gw1'] .player-track-name {
-  color: #e8b820;
-  text-shadow: 0 0 10px rgba(232, 184, 32, 0.55), 0 0 22px rgba(200, 150, 12, 0.25);
-  font-family: 'Cinzel', 'Palatino Linotype', Georgia, serif;
-  letter-spacing: 0.03em;
-}
-
-/* Artist name — faded parchment, not competing with gold */
-[data-theme='gw1'] .player-artist-name {
-  color: #9a8060;
-}
-
-/* Nav active — left gold bar like GW1 menu selection */
-[data-theme='gw1'] .nav-link.active {
-  background: linear-gradient(90deg, rgba(200, 150, 12, 0.20) 0%, transparent 100%);
-  border-left: 3px solid #c8960c;
-  color: #e8b820;
-}
-
-[data-theme='gw1'] .nav-link:hover:not(.active) {
-  background: linear-gradient(90deg, rgba(200, 150, 12, 0.09) 0%, transparent 100%);
-  border-left: 3px solid rgba(200, 150, 12, 0.35);
-}
-
-/* Content header — ornate double gold rule */
-[data-theme='gw1'] .content-header {
-  border-bottom: 1px solid rgba(200, 150, 12, 0.22);
-  position: relative;
-}
-
-[data-theme='gw1'] .content-header::after {
-  content: '';
-  position: absolute;
-  bottom: -3px;
-  left: 0;
-  right: 0;
-  height: 1px;
-  background: linear-gradient(90deg, transparent 0%, rgba(200, 150, 12, 0.7) 20%, rgba(232, 184, 32, 0.9) 50%, rgba(200, 150, 12, 0.7) 80%, transparent 100%);
-}
-
-/* Cards — dark leather panels with subtle gold frame */
-[data-theme='gw1'] .album-card,
-[data-theme='gw1'] .artist-card {
-  box-shadow: inset 0 0 0 1px rgba(200, 150, 12, 0.18);
-}
-
-[data-theme='gw1'] .album-card:hover,
-[data-theme='gw1'] .artist-card:hover {
-  box-shadow: inset 0 0 0 1px rgba(200, 150, 12, 0.55), 0 4px 20px rgba(200, 150, 12, 0.18);
-}
-
-/* Queue / track rows — gold left accent bar on hover */
-[data-theme='gw1'] .track-row:hover,
-[data-theme='gw1'] .queue-item:hover {
-  box-shadow: inset 2px 0 0 #c8960c;
-  background: rgba(200, 150, 12, 0.08);
-}
-
-/* Primary play button — hammered gold like GW1 UI buttons */
-[data-theme='gw1'] .player-btn-primary {
-  background: linear-gradient(180deg, #e8b820 0%, #c8960c 50%, #a87808 100%);
-  color: #060402;
-  box-shadow: 0 0 14px rgba(200, 150, 12, 0.45);
-  border: 1px solid #906606;
-}
-
-[data-theme='gw1'] .player-btn-primary:hover {
-  background: linear-gradient(180deg, #f0c830 0%, #d8a818 50%, #b88818 100%);
-  box-shadow: 0 0 22px rgba(200, 150, 12, 0.65);
-}
-
-/* btn-primary (play album, etc.) */
-[data-theme='gw1'] .btn-primary {
-  background: linear-gradient(180deg, #e8b820 0%, #c8960c 50%, #a87808 100%);
-  color: #060402;
-  border: 1px solid #906606;
-}
-
-[data-theme='gw1'] .btn-primary:hover {
-  background: linear-gradient(180deg, #f0c830 0%, #d8a818 50%, #b88818 100%);
-}
-
-/* Hero play button — Cinzel font, gold, no flash on hover */
-[data-theme='gw1'] .hero-play-btn {
-  background: linear-gradient(180deg, #e8b820 0%, #c8960c 50%, #a87808 100%);
-  color: #060402;
-  border: 1px solid #906606;
-  box-shadow: 0 2px 14px rgba(200, 150, 12, 0.45);
-  font-family: 'Cinzel', Georgia, serif;
-  letter-spacing: 0.05em;
-  transition: filter var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast);
-}
-
-[data-theme='gw1'] .hero-play-btn:hover {
-  background: linear-gradient(180deg, #f0c830 0%, #d8a818 50%, #b88818 100%);
-  box-shadow: 0 4px 22px rgba(200, 150, 12, 0.65);
-  transform: scale(1.02);
-}
-
-/* Album card overlay play button */
-[data-theme='gw1'] .album-card-details-btn {
-  background: linear-gradient(180deg, #e8b820 0%, #c8960c 50%, #a87808 100%);
-  color: #060402;
-  border: 1px solid #906606;
-  box-shadow: 0 2px 10px rgba(200, 150, 12, 0.5);
-}
-
-/* Scrollbar — dark stone with gold thumb */
-[data-theme='gw1'] ::-webkit-scrollbar {
-  width: 6px;
-  height: 6px;
-}
-
-[data-theme='gw1'] ::-webkit-scrollbar-track {
-  background: #0a0806;
-  border-left: 1px solid rgba(200, 150, 12, 0.08);
-}
-
-[data-theme='gw1'] ::-webkit-scrollbar-thumb {
-  background: linear-gradient(180deg, #c8960c, #a87808);
-  border-radius: 3px;
-}
-
-[data-theme='gw1'] ::-webkit-scrollbar-thumb:hover {
-  background: #e8b820;
-}
-
-
diff --git a/src/styles/themes/heisenberg-breaking-bad.css b/src/styles/themes/heisenberg-breaking-bad.css
deleted file mode 100644
index 1124c5f3..00000000
--- a/src/styles/themes/heisenberg-breaking-bad.css
+++ /dev/null
@@ -1,209 +0,0 @@
-/* ─── Heisenberg — Breaking Bad ─── */
-@keyframes crystal-pulse {
-
-  0%,
-  100% {
-    text-shadow:
-      0 0 6px rgba(78, 223, 47, 0.60),
-      0 0 18px rgba(78, 223, 47, 0.32),
-      0 0 40px rgba(78, 223, 47, 0.14);
-  }
-
-  50% {
-    text-shadow:
-      0 0 10px rgba(78, 223, 47, 0.80),
-      0 0 28px rgba(78, 223, 47, 0.48),
-      0 0 60px rgba(78, 223, 47, 0.22);
-  }
-}
-
-[data-theme='heisenberg'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2335d4f8%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* Breaking Bad palette — crystal blue, BB logo green, hazmat yellow */
-  --ctp-crust: #050709;
-  --ctp-mantle: #080b0e;
-  --ctp-base: #0b0e12;
-  --ctp-surface0: #141a22;
-  --ctp-surface1: #1e2830;
-  --ctp-surface2: #283440;
-  --ctp-overlay0: #3a4e60;
-  --ctp-overlay1: #5a7288;
-  --ctp-overlay2: #7a96a8;
-  --ctp-text: #e4f0f8;
-  --ctp-subtext1: #c0d8e8;
-  --ctp-subtext0: #8ab0c8;
-  --ctp-mauve: #35d4f8;
-  --ctp-lavender: #70e8ff;
-  --ctp-pink: #f05080;
-  --ctp-flamingo: #e84060;
-  --ctp-rosewater: #e4f0f8;
-  --ctp-green: #4edf2f;
-  --ctp-teal: #20c8b0;
-  --ctp-sky: #55ddff;
-  --ctp-blue: #35d4f8;
-  --ctp-sapphire: #1ab8e0;
-  --ctp-yellow: #f0c020;
-  --ctp-peach: #e88040;
-  --ctp-maroon: #a01820;
-  --ctp-red: #e03030;
-
-  --bg-app: #0b0e12;
-  --bg-sidebar: #060a0e;
-  --bg-card: #141a22;
-  --bg-hover: #1e2830;
-  --bg-player: #060809;
-  --bg-glass: rgba(8, 11, 14, 0.92);
-  --accent: #35d4f8;
-  --accent-dim: rgba(53, 212, 248, 0.12);
-  --accent-glow: rgba(53, 212, 248, 0.35);
-  --text-primary: #e4f0f8;
-  --text-secondary: #7a96a8;
-  --text-muted: #7aaabe;
-  --border: rgba(53, 212, 248, 0.14);
-  --border-subtle: rgba(53, 212, 248, 0.06);
-  --border-dropdown: rgba(53, 212, 248, 0.25);
-  --shadow-dropdown: rgba(0, 0, 0, 0.92);
-  --positive: #4edf2f;
-  --warning: #f0c020;
-  --danger: #e03030;
-  --radius-sm: 2px;
-  --radius-md: 4px;
-  --radius-lg: 6px;
-}
-
-/* App shell — periodic table grid (BB opening credits) */
-[data-theme='heisenberg'] .app-shell {
-  background-image:
-    linear-gradient(rgba(53, 212, 248, 0.04) 1px, transparent 1px),
-    linear-gradient(90deg, rgba(53, 212, 248, 0.04) 1px, transparent 1px);
-  background-size: 60px 60px;
-}
-
-/* Sidebar — darker lab space, hazmat tape diagonal (very subtle) */
-[data-theme='heisenberg'] .sidebar {
-  background: #060a0e;
-  border-right: 1px solid rgba(53, 212, 248, 0.14);
-  background-image:
-    repeating-linear-gradient(45deg,
-      transparent 0px,
-      transparent 20px,
-      rgba(240, 192, 32, 0.028) 20px,
-      rgba(240, 192, 32, 0.028) 22px);
-}
-
-/* Player bar — lab fluorescent: crystal blue top glow */
-[data-theme='heisenberg'] .player-bar {
-  background: #060809;
-  border-top: 2px solid #35d4f8;
-  box-shadow: 0 -8px 32px rgba(53, 212, 248, 0.14), 0 -1px 0 rgba(0, 0, 0, 0.9);
-}
-
-/* Track name — BB logo green glow (the Br/Ba element box color) */
-[data-theme='heisenberg'] .player-track-name {
-  color: #4edf2f;
-  animation: crystal-pulse 3s ease-in-out infinite;
-}
-
-/* Artist name — hazmat suit yellow */
-[data-theme='heisenberg'] .player-artist-name {
-  color: #f0c020;
-}
-
-/* Nav active — BB green left bar */
-[data-theme='heisenberg'] .nav-link.active {
-  background: linear-gradient(90deg, rgba(78, 223, 47, 0.12) 0%, transparent 100%);
-  border-left: 3px solid #4edf2f;
-  color: #4edf2f;
-}
-
-[data-theme='heisenberg'] .nav-link:hover:not(.active) {
-  background: linear-gradient(90deg, rgba(53, 212, 248, 0.06) 0%, transparent 100%);
-  border-left: 3px solid rgba(53, 212, 248, 0.28);
-}
-
-/* Content header */
-[data-theme='heisenberg'] .content-header {
-  border-bottom: 1px solid rgba(53, 212, 248, 0.10);
-}
-
-/* Cards — blue crystal border on hover */
-[data-theme='heisenberg'] .album-card:hover,
-[data-theme='heisenberg'] .artist-card:hover {
-  box-shadow: 0 0 0 1px rgba(53, 212, 248, 0.50), 0 4px 20px rgba(53, 212, 248, 0.14);
-}
-
-/* Track / queue rows */
-[data-theme='heisenberg'] .track-row:hover,
-[data-theme='heisenberg'] .queue-item:hover {
-  box-shadow: inset 2px 0 0 #35d4f8;
-  background: rgba(53, 212, 248, 0.05);
-}
-
-/* Primary play button — crystal blue gradient */
-[data-theme='heisenberg'] .player-btn-primary {
-  background: linear-gradient(180deg, #60e4ff 0%, #35d4f8 50%, #18b8e0 100%);
-  color: #060809;
-  box-shadow: 0 0 16px rgba(53, 212, 248, 0.45);
-  border: 1px solid #14a8d0;
-}
-
-[data-theme='heisenberg'] .player-btn-primary:hover {
-  background: linear-gradient(180deg, #7aecff 0%, #50deff 50%, #28caf0 100%);
-  box-shadow: 0 0 26px rgba(53, 212, 248, 0.70);
-}
-
-/* btn-primary */
-[data-theme='heisenberg'] .btn-primary {
-  background: linear-gradient(180deg, #60e4ff 0%, #35d4f8 50%, #18b8e0 100%);
-  color: #060809;
-  border: 1px solid #14a8d0;
-}
-
-[data-theme='heisenberg'] .btn-primary:hover {
-  background: linear-gradient(180deg, #7aecff 0%, #50deff 50%, #28caf0 100%);
-}
-
-/* Hero play button */
-[data-theme='heisenberg'] .hero-play-btn {
-  background: linear-gradient(180deg, #60e4ff 0%, #35d4f8 50%, #18b8e0 100%);
-  color: #060809;
-  border: 1px solid #14a8d0;
-  box-shadow: 0 2px 16px rgba(53, 212, 248, 0.45);
-  transition: filter var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast);
-}
-
-[data-theme='heisenberg'] .hero-play-btn:hover {
-  background: linear-gradient(180deg, #7aecff 0%, #50deff 50%, #28caf0 100%);
-  box-shadow: 0 4px 26px rgba(53, 212, 248, 0.68);
-  transform: scale(1.02);
-}
-
-/* Album card overlay button */
-[data-theme='heisenberg'] .album-card-details-btn {
-  background: linear-gradient(180deg, #60e4ff 0%, #35d4f8 50%, #18b8e0 100%);
-  color: #060809;
-  border: 1px solid #14a8d0;
-  box-shadow: 0 2px 12px rgba(53, 212, 248, 0.40);
-}
-
-/* Scrollbar — thin blue crystal */
-[data-theme='heisenberg'] ::-webkit-scrollbar {
-  width: 5px;
-  height: 5px;
-}
-
-[data-theme='heisenberg'] ::-webkit-scrollbar-track {
-  background: #080b0e;
-}
-
-[data-theme='heisenberg'] ::-webkit-scrollbar-thumb {
-  background: rgba(53, 212, 248, 0.35);
-  border-radius: 3px;
-}
-
-[data-theme='heisenberg'] ::-webkit-scrollbar-thumb:hover {
-  background: #35d4f8;
-}
-
diff --git a/src/styles/themes/index.css b/src/styles/themes/index.css
index 1147c5a3..93afa44e 100644
--- a/src/styles/themes/index.css
+++ b/src/styles/themes/index.css
@@ -1,38 +1,9 @@
 @import './_intro.css';
 @import './catppuccin-mocha-variables.css';
-@import './catppuccin-macchiato-variables.css';
-@import './catppuccin-frapp-variables.css';
+@import './semantic-cascade.css';
 @import './catppuccin-latte-variables-light-theme.css';
 @import './latte-light-theme-component-overrides.css';
-@import './nord-polar-night-dark.css';
-@import './nord-snow-storm-light.css';
-@import './nord-frost-deep-ocean-blue.css';
-@import './nord-aurora-dark-aurora-purple.css';
-@import './poison.css';
-@import './classic-winamp-winamp-2-x-base-skin.css';
-@import './wnamp-component-level-overrides.css';
-@import './nucleo-classic-hifi-winamp-brass.css';
-@import './psychowave-synthwave-retrowave.css';
-@import './gruvbox-dark-hard.css';
-@import './gruvbox-dark-medium.css';
-@import './gruvbox-dark-soft.css';
-@import './gruvbox-light-hard.css';
-@import './gruvbox-light-medium.css';
-@import './gruvbox-light-soft.css';
-@import './lambda-17-half-life-city-17.css';
-@import './guild-wars-1-tyria.css';
-@import './grand-theft-audio-gta-v-los-santos-at-night.css';
-@import './v-tactical.css';
-@import './nightcity-2077-cyberpunk-2077.css';
-@import './heisenberg-breaking-bad.css';
-@import './a-theme-of-ice-and-fire-game-of-thrones.css';
-@import './d-oh-matic.css';
-@import './order-of-the-phoenix.css';
-@import './w98.css';
 @import './global-base-settings.css';
-@import './spotless.css';
-@import './cupertino-beats.css';
-@import './dzr0.css';
 @import './reset.css';
 @import './scrollbars.css';
 @import './focus.css';
@@ -51,72 +22,10 @@
 @import './animations.css';
 @import './progress-range.css';
 @import './loading-spinner.css';
-@import './musicmatch-jukebox-y2k-metallic-silver-blue-display.css';
-@import './wmp8-classic-windows-media-player-8-xp-luna.css';
-@import './powerdvd-classic-virtual-hifi-receiver-vfd-display.css';
-@import './cyberlink-powerdvd.css';
-@import './vintage-tube-radio-1950s-bakelite-vacuum-tube.css';
-@import './windows-7-aero-aero-glass-frutiger-aero.css';
-@import './windows-7-aero-glass.css';
-@import './windows-xp-luna-classic-2001.css';
-@import './windows-xp-luna-teal.css';
-@import './macos-ventura-light.css';
-@import './macos-ventura-dark.css';
-@import './neon-drift.css';
 @import './font-overrides.css';
-@import './middle-earth-epic-fantasy-cinematic.css';
-@import './middle-earth-the-one-ring-inscription-glow.css';
-@import './middle-earth-red-book-of-westmarch.css';
-@import './morpheus-matrix-style.css';
-@import './the-matrix-morpheus.css';
-@import './pandora-bioluminescent-sci-fi.css';
 @import './stark-hud-iron-man-arc-reactor.css';
-@import './blade-cinematic-industrial.css';
-@import './dune-arrakis.css';
-@import './back-to-the-future-hill-valley-85.css';
-@import './ubuntu-unity-ambiance-classic-light.css';
-@import './ubuntu-ambiance-component-level-overrides.css';
-@import './windows-10-fluent-design-light.css';
-@import './windows-vista-aero-glass.css';
-@import './data-theme-aqua-quartz.css';
-@import './spider-tech-spider-man.css';
-@import './ms-dos.css';
-@import './unix-shell.css';
-@import './windows-11-dark-component-overrides.css';
-@import './north-park-south-park.css';
-@import './dark-side-of-the-moon-inspired-pink-floyd.css';
-@import './powerslave-inspired-iron-maiden.css';
-@import './nightfox.css';
-@import './dayfox.css';
-@import './dawnfox.css';
-@import './duskfox.css';
-@import './nordfox.css';
-@import './terafox.css';
-@import './carbonfox.css';
-@import './dracula.css';
-@import './dracula-component-level-overrides.css';
 @import './kanagawa-wave-rebelot-kanagawa-nvim-default-dark.css';
-@import './kanagawa-dragon-rebelot-kanagawa-nvim-high-contrast-dark.css';
-@import './kanagawa-lotus-rebelot-kanagawa-nvim-light.css';
-@import './atom-one-dark-th3whit3wolf-one-nvim-dark-variant.css';
-@import './atom-one-light-th3whit3wolf-one-nvim-light-variant.css';
-@import './1984-juanmnl-vs-1984-default-dark-deep-blue-cyberpunk.css';
-@import './1984-cyberpunk-juanmnl-vs-1984-mint-green-variant.css';
-@import './1984-light-juanmnl-vs-1984-bluish-white.css';
-@import './1984-orwell-juanmnl-vs-1984-sepia-dystopian-variant.css';
 @import './vision-dark-purple-gold-colorblind-safe-deuteranopia-protanopia-tritanopia.css';
 @import './vision-dark-component-level-overrides.css';
 @import './vision-navy-purple-gold-colorblind-safe-deuteranopia-protanopia-tritanopia.css';
 @import './vision-navy-component-level-overrides.css';
-@import './community-themes.css';
-@import './amoled-black-pure.css';
-@import './midnight-blue.css';
-@import './sepia-dark.css';
-@import './volcanic-dark.css';
-@import './deep-forest.css';
-@import './violet-haze.css';
-@import './copper-oxide.css';
-@import './sakura-night.css';
-@import './obsidian-gold.css';
-@import './obsidian-black.css';
-@import './carbon-grey.css';
diff --git a/src/styles/themes/input.css b/src/styles/themes/input.css
index 49197bc7..2735b518 100644
--- a/src/styles/themes/input.css
+++ b/src/styles/themes/input.css
@@ -2,8 +2,8 @@
 .input {
   width: 100%;
   padding: var(--space-3) var(--space-4);
-  background: var(--ctp-base);
-  border: 1px solid var(--ctp-overlay0);
+  background: var(--input-bg);
+  border: 1px solid var(--input-border);
   border-radius: var(--radius-md);
   color: var(--text-primary);
   font-family: var(--font-sans);
@@ -17,7 +17,7 @@
 }
 
 .input:focus {
-  border-color: var(--accent);
+  border-color: var(--input-focus-border);
   box-shadow: 0 0 0 3px var(--accent-dim);
 }
 
diff --git a/src/styles/themes/kanagawa-dragon-rebelot-kanagawa-nvim-high-contrast-dark.css b/src/styles/themes/kanagawa-dragon-rebelot-kanagawa-nvim-high-contrast-dark.css
deleted file mode 100644
index dfbb11a0..00000000
--- a/src/styles/themes/kanagawa-dragon-rebelot-kanagawa-nvim-high-contrast-dark.css
+++ /dev/null
@@ -1,56 +0,0 @@
-/* ─── Kanagawa Dragon (rebelot/kanagawa.nvim — high-contrast dark) ─── */
-[data-theme='kanagawa-dragon'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23c5c9c5%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust:    #0d0c0c;   /* dragonBlack0 */
-  --ctp-mantle:   #12120f;   /* dragonBlack1 */
-  --ctp-base:     #181616;   /* dragonBlack3 — main bg */
-  --ctp-surface0: #282727;   /* dragonBlack4 */
-  --ctp-surface1: #393836;   /* dragonBlack5 */
-  --ctp-surface2: #625e5a;   /* dragonBlack6 */
-  --ctp-overlay0: #737c73;   /* dragonAsh */
-  --ctp-overlay1: #9e9b93;   /* dragonGray2 */
-  --ctp-overlay2: #a6a69c;   /* dragonGray */
-  --ctp-text:     #c5c9c5;   /* dragonWhite */
-  --ctp-subtext1: #C8C093;   /* oldWhite */
-  --ctp-subtext0: #a6a69c;
-  --ctp-mauve:    #8992a7;   /* dragonViolet */
-  --ctp-lavender: #949fb5;   /* dragonTeal */
-  --ctp-pink:     #a292a3;   /* dragonPink */
-  --ctp-flamingo: #c4746e;   /* dragonRed */
-  --ctp-rosewater:#b6927b;   /* dragonOrange */
-  --ctp-blue:     #8ba4b0;   /* dragonBlue2 */
-  --ctp-sapphire: #8ba4b0;
-  --ctp-sky:      #8ea4a2;   /* dragonAqua */
-  --ctp-teal:     #8ea4a2;
-  --ctp-green:    #8a9a7b;   /* dragonGreen2 */
-  --ctp-yellow:   #c4b28a;   /* dragonYellow */
-  --ctp-peach:    #b98d7b;   /* dragonOrange2 */
-  --ctp-maroon:   #c4746e;
-  --ctp-red:      #c4746e;
-
-  --bg-app:           #181616;
-  --bg-sidebar:       #12120f;
-  --bg-card:          #282727;
-  --bg-hover:         #393836;
-  --bg-player:        #12120f;
-  --bg-glass:         rgba(24, 22, 22, 0.82);
-  --accent:           #8ba4b0;       /* dragonBlue2 */
-  --accent-dim:       rgba(139, 164, 176, 0.16);
-  --accent-glow:      rgba(139, 164, 176, 0.32);
-  --text-primary:     #c5c9c5;       /* dragonWhite */
-  --text-secondary:   #a6a69c;       /* dragonGray */
-  --text-muted:       #737c73;       /* dragonAsh */
-  --border:           #393836;
-  --border-subtle:    #282727;
-  --border-dropdown:  #625e5a;
-  --shadow-dropdown:  rgba(0, 0, 0, 0.7);
-  --positive:         #8a9a7b;       /* dragonGreen2 */
-  --warning:          #c4b28a;       /* dragonYellow */
-  --danger:           #c4746e;       /* dragonRed */
-  --waveform-played:    #8ba4b0;
-  --waveform-buffered:  #625e5a;
-  --waveform-unplayed:  #282727;
-}
-
diff --git a/src/styles/themes/kanagawa-lotus-rebelot-kanagawa-nvim-light.css b/src/styles/themes/kanagawa-lotus-rebelot-kanagawa-nvim-light.css
deleted file mode 100644
index cb1f26c6..00000000
--- a/src/styles/themes/kanagawa-lotus-rebelot-kanagawa-nvim-light.css
+++ /dev/null
@@ -1,56 +0,0 @@
-/* ─── Kanagawa Lotus (rebelot/kanagawa.nvim — light) ─── */
-[data-theme='kanagawa-lotus'] {
-  color-scheme: light;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23545464%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust:    #d5cea3;   /* lotusWhite0 */
-  --ctp-mantle:   #dcd5ac;   /* lotusWhite1 */
-  --ctp-base:     #f2ecbc;   /* lotusWhite3 — main bg */
-  --ctp-surface0: #e5ddb0;   /* lotusWhite2 */
-  --ctp-surface1: #e7dba0;   /* lotusWhite4 */
-  --ctp-surface2: #e4d794;   /* lotusWhite5 */
-  --ctp-overlay0: #8a8980;   /* lotusGray3 */
-  --ctp-overlay1: #716e61;   /* lotusGray2 */
-  --ctp-overlay2: #545464;   /* lotusInk1 */
-  --ctp-text:     #545464;   /* lotusInk1 */
-  --ctp-subtext1: #43436c;   /* lotusInk2 */
-  --ctp-subtext0: #716e61;
-  --ctp-mauve:    #624c83;   /* lotusViolet4 */
-  --ctp-lavender: #766b90;   /* lotusViolet2 */
-  --ctp-pink:     #b35b79;   /* lotusPink */
-  --ctp-flamingo: #c84053;   /* lotusRed */
-  --ctp-rosewater:#cc6d00;   /* lotusOrange */
-  --ctp-blue:     #4d699b;   /* lotusBlue4 */
-  --ctp-sapphire: #4e8ca2;   /* lotusTeal1 */
-  --ctp-sky:      #6693bf;   /* lotusTeal2 */
-  --ctp-teal:     #597b75;   /* lotusAqua */
-  --ctp-green:    #6f894e;   /* lotusGreen */
-  --ctp-yellow:   #836f4a;   /* lotusYellow2 */
-  --ctp-peach:    #cc6d00;
-  --ctp-maroon:   #c84053;
-  --ctp-red:      #c84053;
-
-  --bg-app:           #f2ecbc;
-  --bg-sidebar:       #dcd5ac;
-  --bg-card:          #d5cea3;
-  --bg-hover:         #e7dba0;
-  --bg-player:        #dcd5ac;
-  --bg-glass:         rgba(242, 236, 188, 0.92);
-  --accent:           #4d699b;       /* lotusBlue4 */
-  --accent-dim:       rgba(77, 105, 155, 0.14);
-  --accent-glow:      rgba(77, 105, 155, 0.26);
-  --text-primary:     #545464;       /* lotusInk1 */
-  --text-secondary:   #43436c;       /* lotusInk2 */
-  --text-muted:       #8a8980;       /* lotusGray3 */
-  --border:           #e7dba0;
-  --border-subtle:    #d5cea3;
-  --border-dropdown:  #716e61;
-  --shadow-dropdown:  rgba(0, 0, 0, 0.18);
-  --positive:         #6f894e;       /* lotusGreen */
-  --warning:          #cc6d00;       /* lotusOrange */
-  --danger:           #c84053;       /* lotusRed */
-  --waveform-played:    #4d699b;
-  --waveform-buffered:  #8a8980;
-  --waveform-unplayed:  #d5cea3;
-}
-
diff --git a/src/styles/themes/lambda-17-half-life-city-17.css b/src/styles/themes/lambda-17-half-life-city-17.css
deleted file mode 100644
index 33995b0d..00000000
--- a/src/styles/themes/lambda-17-half-life-city-17.css
+++ /dev/null
@@ -1,236 +0,0 @@
-/* ─── Lambda 17 — Half-Life / City 17 ─── */
-/* HEV orange + Combine Overwatch teal + City 17 concrete       */
-[data-theme='lambda-17'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ff9d00%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* City 17 — warm concrete dark, not pure black */
-  --ctp-crust: #0c0d0e;
-  --ctp-mantle: #111315;
-  --ctp-base: #171a1c;
-  --ctp-surface0: #1f2326;
-  --ctp-surface1: #282d30;
-  --ctp-surface2: #33393d;
-  --ctp-overlay0: #4e5660;
-  --ctp-overlay1: #718090;
-  --ctp-overlay2: #96a8b4;
-  --ctp-text: #e4ddd0;
-  /* concrete dust off-white */
-  --ctp-subtext1: #c8c0b0;
-  --ctp-subtext0: #96a8b4;
-
-  /* Half-Life palette */
-  --ctp-peach: #ff9d00;
-  /* HEV suit orange */
-  --ctp-mauve: #ff9d00;
-  --ctp-lavender: #ffb84d;
-  --ctp-flamingo: #ffb84d;
-  --ctp-rosewater: #ffd080;
-  --ctp-teal: #00c8c0;
-  /* Combine Overwatch scanner teal */
-  --ctp-sky: #00c8c0;
-  --ctp-sapphire: #0090a0;
-  --ctp-blue: #0060a0;
-  /* G-Man suit navy */
-  --ctp-green: #78c800;
-  /* Headcrab / barnacle green */
-  --ctp-yellow: #f0d000;
-  /* radiation warning yellow */
-  --ctp-red: #e03020;
-  /* danger / health critical */
-  --ctp-maroon: #b82010;
-  --ctp-pink: #cc44aa;
-  /* Xen alien purple-pink */
-
-  --bg-app: #171a1c;
-  /* City 17 corridor concrete */
-  --bg-sidebar: #111315;
-  /* Combine facility wall */
-  --bg-card: #1f2326;
-  --bg-hover: rgba(255, 157, 0, 0.08);
-  --bg-player: #0c0d0e;
-  /* HEV suit display dark */
-  --bg-glass: rgba(17, 19, 21, 0.95);
-
-  --accent: #ff9d00;
-  /* HEV orange */
-  --accent-dim: rgba(255, 157, 0, 0.13);
-  --accent-glow: rgba(255, 157, 0, 0.45);
-  --volume-accent: #00c8c0;
-  /* Combine teal for volume */
-
-  --text-primary: #e4ddd0;
-  /* concrete dust off-white */
-  --text-secondary: #00c8c0;
-  /* Combine Overwatch teal */
-  --text-muted: #4e5660;
-  --border: #2a3035;
-  --border-subtle: #1f2326;
-  --shadow-dropdown: rgba(0, 0, 0, 0.85);
-
-  --positive: #78c800;
-  --warning: #ff9d00;
-  --danger: #e03020;
-
-  --radius-sm: 0px;
-  --radius-md: 1px;
-  --radius-lg: 2px;
-  --radius-xl: 3px;
-}
-
-/* Sidebar = Combine control panel: horizontal panel lines */
-[data-theme='lambda-17'] .sidebar {
-  border-right: 2px solid #ff9d00;
-  box-shadow: 2px 0 12px rgba(255, 157, 0, 0.08);
-  background-image: repeating-linear-gradient(0deg,
-      transparent,
-      transparent 28px,
-      rgba(0, 200, 192, 0.04) 28px,
-      rgba(0, 200, 192, 0.04) 29px);
-}
-
-/* Player bar = HEV suit monitor: orange top + teal secondary */
-[data-theme='lambda-17'] .player-bar {
-  border-top: 2px solid #ff9d00;
-  box-shadow:
-    0 -1px 0 rgba(0, 200, 192, 0.3),
-    0 -6px 24px rgba(255, 157, 0, 0.07);
-}
-
-/* Track name = HEV announcement style */
-[data-theme='lambda-17'] .player-track-name {
-  color: #ff9d00;
-  text-shadow: 0 0 10px rgba(255, 157, 0, 0.65), 0 0 24px rgba(255, 157, 0, 0.25);
-  text-transform: uppercase;
-  font-weight: 700;
-  letter-spacing: 0.06em;
-}
-
-/* Artist = Combine Overwatch voice color */
-[data-theme='lambda-17'] .player-track-artist {
-  color: #00c8c0;
-}
-
-/* Queue album = Xen purple */
-[data-theme='lambda-17'] .queue-meta-album {
-  color: #cc44aa;
-}
-
-/* Active nav: HEV orange gradient */
-[data-theme='lambda-17'] .nav-link.active {
-  background: linear-gradient(90deg, rgba(255, 157, 0, 0.16) 0%, transparent 100%);
-  color: #ff9d00;
-}
-
-[data-theme='lambda-17'] .nav-link.active::before {
-  width: 3px;
-  box-shadow: 2px 0 10px rgba(255, 157, 0, 0.6);
-}
-
-/* Buttons */
-[data-theme='lambda-17'] .btn-primary {
-  background: #ff9d00;
-  color: #0c0d0e;
-  font-weight: 700;
-  text-transform: uppercase;
-  letter-spacing: 0.06em;
-  border: none;
-  border-radius: 1px;
-}
-
-[data-theme='lambda-17'] .btn-primary:hover {
-  background: #ffb030;
-}
-
-/* Queue active = HEV orange lambda bar */
-[data-theme='lambda-17'] .queue-item.active {
-  background: rgba(255, 157, 0, 0.08);
-  box-shadow: inset 3px 0 0 #ff9d00;
-}
-
-[data-theme='lambda-17'] .np-queue-item.active {
-  background: rgba(255, 157, 0, 0.07);
-}
-
-[data-theme='lambda-17'] .np-queue-item-active {
-  color: #ff9d00;
-  text-shadow: 0 0 8px rgba(255, 157, 0, 0.55);
-}
-
-/* Now-playing active track = Combine teal */
-[data-theme='lambda-17'] .np-album-track.active .np-album-track-title,
-[data-theme='lambda-17'] .np-album-track.active .np-album-track-num {
-  color: #00c8c0;
-  text-shadow: 0 0 8px rgba(0, 200, 192, 0.5);
-}
-
-/* Hover rows */
-[data-theme='lambda-17'] .track-row:hover,
-[data-theme='lambda-17'] .track-row.context-active {
-  background: rgba(255, 157, 0, 0.07) !important;
-  box-shadow: inset 3px 0 0 #ff9d00;
-}
-
-[data-theme='lambda-17'] .queue-item:hover,
-[data-theme='lambda-17'] .queue-item.context-active {
-  background: rgba(255, 157, 0, 0.07) !important;
-  box-shadow: inset 3px 0 0 #ff9d00;
-}
-
-[data-theme='lambda-17'] .np-queue-item:hover,
-[data-theme='lambda-17'] .np-queue-item.context-active {
-  background: rgba(255, 157, 0, 0.07);
-  box-shadow: inset 2px 0 0 #ff9d00;
-}
-
-[data-theme='lambda-17'] .artist-row:hover {
-  background: rgba(255, 157, 0, 0.06);
-  box-shadow: inset 3px 0 0 #ff9d00;
-}
-
-[data-theme='lambda-17'] .playlist-row:hover {
-  background: rgba(255, 157, 0, 0.06);
-  box-shadow: inset 3px 0 0 #ff9d00;
-}
-
-/* Settings tabs: Combine teal when active */
-[data-theme='lambda-17'] .settings-tab:hover {
-  background: rgba(255, 157, 0, 0.07);
-  color: #ff9d00;
-}
-
-[data-theme='lambda-17'] .settings-tab.active {
-  background: rgba(0, 200, 192, 0.08);
-  color: #00c8c0;
-  box-shadow: inset 3px 0 0 #00c8c0;
-}
-
-/* Queue tabs */
-[data-theme='lambda-17'] .queue-tab-btn:hover {
-  background: rgba(255, 157, 0, 0.07);
-  color: #ff9d00;
-}
-
-/* Dropdowns */
-[data-theme='lambda-17'] .custom-select-trigger:hover {
-  background: rgba(255, 157, 0, 0.07);
-}
-
-[data-theme='lambda-17'] .custom-select-option:hover {
-  background: rgba(255, 157, 0, 0.1) !important;
-  color: #ff9d00 !important;
-}
-
-/* Artist pills = headcrab green */
-[data-theme='lambda-17'] .artist-ext-link:hover {
-  background: rgba(120, 200, 0, 0.1);
-  color: #78c800 !important;
-  border-color: rgba(120, 200, 0, 0.4) !important;
-}
-
-/* Connection indicators */
-[data-theme='lambda-17'] .connection-type,
-[data-theme='lambda-17'] .connection-server {
-  color: #00c8c0;
-}
-
diff --git a/src/styles/themes/macos-ventura-dark.css b/src/styles/themes/macos-ventura-dark.css
deleted file mode 100644
index 7bcac607..00000000
--- a/src/styles/themes/macos-ventura-dark.css
+++ /dev/null
@@ -1,122 +0,0 @@
-/* ─── macOS Ventura Dark ─── */
-[data-theme='cupertino-dark'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2398989d%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* Palette */
-  --ctp-crust: #0d0d0e;
-  --ctp-mantle: #161617;
-  --ctp-base: #1e1e1f;
-  --ctp-surface0: #2d2d2f;
-  --ctp-surface1: #3a3a3c;
-  --ctp-surface2: #48484a;
-  --ctp-overlay0: #636366;
-  --ctp-overlay1: #8e8e93;
-  --ctp-overlay2: #aeaeb2;
-  --ctp-text: #f5f5f7;
-  --ctp-subtext1: #e5e5ea;
-  --ctp-subtext0: #c7c7cc;
-  --ctp-mauve: #007aff;
-  --ctp-lavender: #409cff;
-  --ctp-green: #30d158;
-  --ctp-teal: #5ac8fa;
-  --ctp-sky: #32ade6;
-  --ctp-blue: #007aff;
-  --ctp-sapphire: #0a84ff;
-  --ctp-pink: #ff375f;
-  --ctp-flamingo: #ff6b81;
-  --ctp-rosewater: #ffd6d6;
-  --ctp-yellow: #ffd60a;
-  --ctp-peach: #ff9f0a;
-  --ctp-maroon: #c0392b;
-  --ctp-red: #ff453a;
-
-  /* Semantic tokens */
-  --bg-app: #1e1e1f;
-  --bg-sidebar: #161617;
-  --bg-card: #2d2d2f;
-  --bg-hover: #3a3a3c;
-  --bg-player: rgba(16, 16, 17, 0.90);
-  --bg-glass: rgba(30, 30, 31, 0.80);
-  --accent: #007aff;
-  --accent-dim: rgba(0, 122, 255, 0.15);
-  --accent-glow: rgba(0, 122, 255, 0.35);
-  --text-primary: #f5f5f7;
-  --text-secondary: #c7c7cc;
-  --text-muted: #8e8e93;
-  --border: #3a3a3c;
-  --border-subtle: #2d2d2f;
-  --positive: #30d158;
-  --warning: #ff9f0a;
-  --danger: #ff453a;
-
-  --shadow-dropdown: 0 8px 30px rgba(0, 0, 0, 0.55), 0 2px 8px rgba(0, 0, 0, 0.30);
-}
-
-[data-theme='cupertino-dark'] .app-shell {
-  background: #1e1e1f;
-}
-
-[data-theme='cupertino-dark'] .sidebar {
-  background: rgba(22, 22, 23, 0.90);
-  backdrop-filter: blur(25px);
-  -webkit-backdrop-filter: blur(25px);
-  border-right: 1px solid rgba(255, 255, 255, 0.06);
-}
-
-[data-theme='cupertino-dark'] .player-bar {
-  background: rgba(16, 16, 17, 0.90);
-  backdrop-filter: blur(25px);
-  -webkit-backdrop-filter: blur(25px);
-  border-top: 1px solid rgba(255, 255, 255, 0.06);
-}
-
-[data-theme='cupertino-dark'] .player-btn:hover {
-  color: #007aff;
-  background: rgba(0, 122, 255, 0.12);
-}
-
-[data-theme='cupertino-dark'] .player-btn-primary {
-  color: #ffffff;
-  background: #007aff;
-  box-shadow: 0 2px 8px rgba(0, 122, 255, 0.40);
-}
-
-[data-theme='cupertino-dark'] .player-btn-primary:hover {
-  background: #0a84ff;
-  box-shadow: 0 4px 14px rgba(0, 122, 255, 0.50);
-}
-
-/* Nav links */
-[data-theme='cupertino-dark'] .nav-link.active {
-  background: #007aff;
-  color: #ffffff;
-  border-left-color: transparent;
-  border-radius: 8px;
-}
-
-[data-theme='cupertino-dark'] .nav-link.active::before {
-  display: none;
-}
-
-[data-theme='cupertino-dark'] .nav-link-nowplaying {
-  color: #409cff;
-  font-weight: 600;
-}
-
-/* Queue active */
-[data-theme='cupertino-dark'] .queue-item.active {
-  background: rgba(0, 122, 255, 0.15);
-  color: #007aff;
-}
-
-/* NowPlaying overrides */
-[data-theme='cupertino-dark'] .np-queue-item-active {
-  color: #007aff;
-}
-
-[data-theme='cupertino-dark'] .np-album-track.active .np-album-track-title,
-[data-theme='cupertino-dark'] .np-album-track.active .np-album-track-num {
-  color: #007aff;
-}
-
diff --git a/src/styles/themes/macos-ventura-light.css b/src/styles/themes/macos-ventura-light.css
deleted file mode 100644
index ebfc5985..00000000
--- a/src/styles/themes/macos-ventura-light.css
+++ /dev/null
@@ -1,149 +0,0 @@
-/* ─── macOS Ventura Light ─── */
-[data-theme='cupertino-light'] {
-  color-scheme: light;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23636366%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* Palette */
-  --ctp-crust: #f5f5f7;
-  --ctp-mantle: #e8e8ed;
-  --ctp-base: #ffffff;
-  --ctp-surface0: #f2f2f7;
-  --ctp-surface1: #e5e5ea;
-  --ctp-surface2: #d1d1d6;
-  --ctp-overlay0: #8e8e93;
-  --ctp-overlay1: #6c6c70;
-  --ctp-overlay2: #48484a;
-  --ctp-text: #1c1c1e;
-  --ctp-subtext1: #3a3a3c;
-  --ctp-subtext0: #636366;
-  --ctp-mauve: #0071e3;
-  --ctp-lavender: #2c9af0;
-  --ctp-green: #34c759;
-  --ctp-teal: #5ac8fa;
-  --ctp-sky: #32ade6;
-  --ctp-blue: #0071e3;
-  --ctp-sapphire: #0051a8;
-  --ctp-pink: #ff2d55;
-  --ctp-flamingo: #ff6b81;
-  --ctp-rosewater: #ffd6d6;
-  --ctp-yellow: #ffd60a;
-  --ctp-peach: #ff9f0a;
-  --ctp-maroon: #c0392b;
-  --ctp-red: #ff3b30;
-
-  /* Semantic tokens */
-  --bg-app: #ffffff;
-  --bg-sidebar: #f2f2f7;
-  --bg-card: #ffffff;
-  --bg-hover: #f2f2f7;
-  --bg-player: rgba(255, 255, 255, 0.85);
-  --bg-glass: rgba(255, 255, 255, 0.72);
-  --accent: #0071e3;
-  --accent-dim: rgba(0, 113, 227, 0.12);
-  --accent-glow: rgba(0, 113, 227, 0.30);
-  --text-primary: #1c1c1e;
-  --text-secondary: #3a3a3c;
-  --text-muted: #6d6d72;
-  --border: #d1d1d6;
-  --border-subtle: #e5e5ea;
-  --positive: #34c759;
-  --warning: #ff9f0a;
-  --danger: #ff3b30;
-
-  --shadow-dropdown: 0 8px 30px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.08);
-}
-
-[data-theme='cupertino-light'] .app-shell {
-  background: #f2f2f7;
-}
-
-[data-theme='cupertino-light'] .sidebar {
-  background: rgba(242, 242, 247, 0.85);
-  backdrop-filter: blur(20px);
-  -webkit-backdrop-filter: blur(20px);
-  border-right: 1px solid rgba(0, 0, 0, 0.08);
-}
-
-[data-theme='cupertino-light'] .player-bar {
-  background: rgba(255, 255, 255, 0.85);
-  backdrop-filter: blur(20px);
-  -webkit-backdrop-filter: blur(20px);
-  border-top: 1px solid rgba(0, 0, 0, 0.10);
-  box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.06);
-}
-
-/* Player text: dark on light bar */
-[data-theme='cupertino-light'] .player-track-name {
-  color: #1c1c1e;
-}
-
-[data-theme='cupertino-light'] .player-track-artist {
-  color: #636366;
-}
-
-[data-theme='cupertino-light'] .player-time {
-  color: #636366;
-}
-
-[data-theme='cupertino-light'] .player-btn {
-  color: #1c1c1e;
-}
-
-[data-theme='cupertino-light'] .player-btn:hover {
-  color: #0071e3;
-  background: rgba(0, 113, 227, 0.10);
-}
-
-[data-theme='cupertino-light'] .player-btn-primary {
-  color: #ffffff;
-  background: #0071e3;
-  box-shadow: 0 2px 8px rgba(0, 113, 227, 0.35);
-}
-
-[data-theme='cupertino-light'] .player-btn-primary:hover {
-  background: #0077ed;
-  box-shadow: 0 4px 12px rgba(0, 113, 227, 0.45);
-}
-
-/* Nav links */
-[data-theme='cupertino-light'] .nav-link {
-  color: #3a3a3c;
-}
-
-[data-theme='cupertino-light'] .nav-link:hover {
-  background: rgba(0, 0, 0, 0.06);
-  color: #1c1c1e;
-}
-
-[data-theme='cupertino-light'] .nav-link.active {
-  background: #0071e3;
-  color: #ffffff;
-  border-left-color: transparent;
-  border-radius: 8px;
-}
-
-[data-theme='cupertino-light'] .nav-link.active::before {
-  display: none;
-}
-
-[data-theme='cupertino-light'] .nav-link-nowplaying {
-  color: #0071e3;
-  font-weight: 600;
-}
-
-/* Queue active */
-[data-theme='cupertino-light'] .queue-item.active {
-  background: rgba(0, 113, 227, 0.10);
-  color: #0071e3;
-}
-
-/* NowPlaying overrides */
-[data-theme='cupertino-light'] .np-queue-item-active {
-  color: #0071e3;
-}
-
-[data-theme='cupertino-light'] .np-album-track.active .np-album-track-title,
-[data-theme='cupertino-light'] .np-album-track.active .np-album-track-num {
-  color: #0071e3;
-}
-
diff --git a/src/styles/themes/middle-earth-epic-fantasy-cinematic.css b/src/styles/themes/middle-earth-epic-fantasy-cinematic.css
deleted file mode 100644
index e81c5d27..00000000
--- a/src/styles/themes/middle-earth-epic-fantasy-cinematic.css
+++ /dev/null
@@ -1,4 +0,0 @@
-/* ─────────────────────────────────────────────────────────────
-   Middle Earth — Epic Fantasy / Cinematic
-   ───────────────────────────────────────────────────────────── */
-
diff --git a/src/styles/themes/middle-earth-red-book-of-westmarch.css b/src/styles/themes/middle-earth-red-book-of-westmarch.css
deleted file mode 100644
index 80da7615..00000000
--- a/src/styles/themes/middle-earth-red-book-of-westmarch.css
+++ /dev/null
@@ -1,589 +0,0 @@
-/* ─── Middle-Earth — Red Book of Westmarch ─── */
-[data-theme='middle-earth'] {
-  color-scheme: light;
-  --color-star-active: #8c6800;
-  --color-star-inactive: #b8985a;
-
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%234a3728%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* ── Palette ── */
-  /* Warm — Shire, Rohan, Dwarvish gold */
-  --ctp-crust: #1a1008;
-  --ctp-mantle: #281808;
-  --ctp-base: #f0e0b0;
-  --ctp-surface0: #e8d498;
-  --ctp-surface1: #dcc482;
-  --ctp-surface2: #ccb06e;
-  --ctp-overlay0: #8a7250;
-  --ctp-overlay1: #6a5438;
-  --ctp-overlay2: #4a3828;
-  --ctp-text: #1e1408;
-  --ctp-subtext1: #3e2c1a;
-  --ctp-subtext0: #5e4a30;
-  /* Gold of the One Ring */
-  --ctp-mauve: #d4a820;
-  --ctp-lavender: #f0d060;
-  --ctp-yellow: #f8e880;
-  --ctp-peach: #b88010;
-  /* Shire green, Rivendell silver, Elvish blue */
-  --ctp-green: #4a7038;
-  --ctp-teal: #3a6858;
-  --ctp-sky: #7898b8;
-  --ctp-blue: #486888;
-  --ctp-sapphire: #2a4868;
-  /* Mordor / danger */
-  --ctp-red: #8a2820;
-  --ctp-maroon: #5a1818;
-  --ctp-flamingo: #b05838;
-  --ctp-pink: #904868;
-  --ctp-rosewater: #e8c8a8;
-
-  /* ── Semantic tokens ── */
-  --bg-app: #f0e0b0;
-  --bg-sidebar: #241a0e;
-  /* Bag End — old oak wood, hearthlit */
-  --bg-card: #f4e8c0;
-  --bg-hover: rgba(180, 130, 20, 0.12);
-  --bg-player: #1a1008;
-  /* Orodruin / the forge-dark */
-  --bg-glass: rgba(244, 232, 192, 0.92);
-  --accent: #d4a820;
-  --accent-dim: rgba(212, 168, 32, 0.16);
-  --accent-glow: rgba(212, 168, 32, 0.45);
-  --volume-accent: #d4a820;
-  --text-primary: #1e1408;
-  --text-secondary: #3e2c1a;
-  --text-muted: #5a4428;
-  --border: rgba(122, 92, 24, 0.85);
-  --border-subtle: rgba(180, 140, 50, 0.18);
-  --positive: #4a7038;
-  --warning: #805408;
-  --danger: #8a2820;
-  --radius-sm: 4px;
-  --radius-md: 8px;
-  --radius-lg: 12px;
-}
-
-/* ── App shell: parchment map of Middle-Earth ── */
-/* Three-layer: warm gold illumination top-right (candlelight),
-   ember glow bottom-left (hearth), radial vignette darkening corners */
-[data-theme='middle-earth'] .app-shell {
-  background:
-    radial-gradient(ellipse at center, transparent 50%, rgba(60, 38, 18, 0.12) 100%),
-    radial-gradient(ellipse at 78% 18%, rgba(220, 180, 60, 0.08) 0%, transparent 50%),
-    radial-gradient(ellipse at 15% 88%, rgba(180, 110, 20, 0.07) 0%, transparent 45%),
-    linear-gradient(155deg, #f4e8c0 0%, #eed8a0 50%, #e8d098 100%);
-}
-
-/* Parchment grain overlay — the texture of the Red Book's pages */
-[data-theme='middle-earth'] .app-shell::after {
-  content: '';
-  position: fixed;
-  inset: 0;
-  pointer-events: none;
-  z-index: 9999;
-  opacity: 0.045;
-  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
-  background-size: 200px 200px;
-}
-
-/* ── Sidebar: Bag End oak paneling ── */
-/* Old Shire craftsmanship — vertical wood grain, warm hearthlight from right edge */
-[data-theme='middle-earth'] .sidebar {
-  background-color: #221608;
-  background-image: linear-gradient(180deg, #261a0a 0%, #1e1408 55%, #241c0e 100%);
-  border-right: 2px solid rgba(200, 160, 40, 0.28);
-  box-shadow:
-    inset -3px 0 12px rgba(200, 140, 30, 0.10),
-    2px 0 8px rgba(0, 0, 0, 0.50);
-}
-
-/* Sidebar text: warm candlelight on dark oak */
-[data-theme='middle-earth'] .nav-link {
-  color: #c8a060;
-}
-
-[data-theme='middle-earth'] .nav-link:hover {
-  background: rgba(212, 168, 32, 0.12);
-  color: #f0d880;
-}
-
-[data-theme='middle-earth'] .nav-link.active {
-  background: linear-gradient(90deg, rgba(212, 168, 32, 0.22) 0%, transparent 100%);
-  color: #f0d060;
-  border-left: 2px solid #d4a820;
-  box-shadow: inset 4px 0 18px rgba(212, 168, 32, 0.12);
-}
-
-[data-theme='middle-earth'] .nav-link.active::before {
-  background: #d4a820;
-  box-shadow: 0 0 10px rgba(212, 168, 32, 0.80), 0 0 20px rgba(212, 168, 32, 0.40);
-}
-
-[data-theme='middle-earth'] .nav-link.active svg {
-  color: #d4a820;
-}
-
-[data-theme='middle-earth'] .nav-section-label {
-  color: #b88a50;
-  text-transform: uppercase;
-  letter-spacing: 0.14em;
-  font-size: 0.67em;
-  font-family: Georgia, 'Book Antiqua', serif;
-}
-
-/* ── Player bar: Sammath Naur — the fires of Orodruin ── */
-/* Near-black volcanic dark, sealed with the gold of the Ring */
-[data-theme='middle-earth'] .player-bar {
-  background: linear-gradient(180deg, #1c1208 0%, #100c04 100%);
-  border-top: 2px solid rgba(212, 168, 32, 0.58);
-  box-shadow:
-    inset 0 1px 0 rgba(240, 200, 60, 0.22),
-    0 -8px 40px rgba(180, 120, 20, 0.20),
-    0 -20px 70px rgba(160, 100, 15, 0.09);
-}
-
-/* Track name: THE ONE RING INSCRIPTION — breathing gold fire */
-[data-theme='middle-earth'] .player-track-name {
-  color: #f0d060;
-  font-family: Georgia, 'Book Antiqua', 'Palatino Linotype', Palatino, serif;
-  letter-spacing: 0.06em;
-  font-weight: 600;
-  animation: ring-inscription-glow 5s ease-in-out infinite;
-}
-
-/* Artist: Elvish silver on the dark forge */
-[data-theme='middle-earth'] .player-track-artist {
-  color: #b8985a;
-  font-family: Georgia, 'Book Antiqua', serif;
-  letter-spacing: 0.03em;
-  opacity: 1;
-}
-
-[data-theme='middle-earth'] .player-time {
-  color: #a88048;
-}
-
-/* ── Transport buttons: Mithril-crafted, hearthlit ── */
-[data-theme='middle-earth'] .player-btn,
-[data-theme='middle-earth'] .player-btn-primary {
-  background: linear-gradient(180deg, #2e2010 0%, #1e1408 100%);
-  color: #d4a820;
-  border: 1px solid rgba(212, 168, 32, 0.38);
-  border-radius: 50%;
-  box-shadow: inset 0 1px 0 rgba(240, 200, 60, 0.10), 0 2px 6px rgba(0, 0, 0, 0.60);
-}
-
-[data-theme='middle-earth'] .player-btn:hover,
-[data-theme='middle-earth'] .player-btn-primary:hover {
-  background: rgba(212, 168, 32, 0.14);
-  border-color: #d4a820;
-  color: #f0d060;
-  box-shadow:
-    0 0 16px rgba(212, 168, 32, 0.48),
-    inset 0 0 8px rgba(200, 140, 20, 0.10);
-}
-
-/* ── Regular buttons: parchment scroll / carved Shire wood ── */
-[data-theme='middle-earth'] .btn,
-[data-theme='middle-earth'] .btn-surface,
-[data-theme='middle-earth'] .btn-ghost {
-  background: linear-gradient(180deg, #f8f0d0 0%, #e8d898 50%, #dece88 100%);
-  color: #2a1c0e;
-  border: 1px solid rgba(160, 120, 40, 0.48);
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.65),
-    inset 1px 0 0 rgba(255, 255, 255, 0.45),
-    0 1px 3px rgba(80, 50, 10, 0.22);
-  border-radius: 6px;
-  font-family: Georgia, 'Book Antiqua', serif;
-}
-
-[data-theme='middle-earth'] .btn:hover,
-[data-theme='middle-earth'] .btn-surface:hover,
-[data-theme='middle-earth'] .btn-ghost:hover {
-  background: linear-gradient(180deg, #fffff0 0%, #f0e8a8 50%, #e8d890 100%);
-  border-color: rgba(180, 140, 40, 0.70);
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.80),
-    0 1px 4px rgba(80, 50, 10, 0.20),
-    0 0 8px rgba(212, 168, 32, 0.18);
-}
-
-/* ── Primary button: One Ring gold — the most precious craftsmanship ── */
-[data-theme='middle-earth'] .btn-primary {
-  background: linear-gradient(180deg, #e8bc28 0%, #c8940c 50%, #aa7808 100%);
-  color: #1a1008;
-  border: 1px solid #c89818;
-  box-shadow:
-    inset 0 1px 0 rgba(255, 240, 100, 0.45),
-    0 0 16px rgba(212, 168, 32, 0.42),
-    0 2px 4px rgba(80, 50, 0, 0.30);
-  border-radius: 6px;
-  font-weight: 700;
-  font-family: Georgia, 'Book Antiqua', serif;
-}
-
-[data-theme='middle-earth'] .btn-primary:hover {
-  background: linear-gradient(180deg, #f8cc38 0%, #d8a018 50%, #bc8810 100%);
-  box-shadow:
-    inset 0 1px 0 rgba(255, 240, 100, 0.55),
-    0 0 24px rgba(212, 168, 32, 0.60),
-    0 2px 6px rgba(80, 50, 0, 0.28);
-}
-
-/* ── Hero / album-card play buttons: solid One Ring gold ── */
-/* These appear on dark album-art overlays — must be fully opaque and prominent */
-[data-theme='middle-earth'] .hero-play-btn,
-[data-theme='middle-earth'] .album-card-details-btn {
-  background: linear-gradient(180deg, #e8bc28 0%, #c8940c 50%, #aa7808 100%);
-  color: #1a1008;
-  border: 1px solid #c89818;
-  font-family: Georgia, 'Book Antiqua', serif;
-  font-weight: 700;
-  box-shadow:
-    inset 0 1px 0 rgba(255, 240, 100, 0.45),
-    0 0 14px rgba(212, 168, 32, 0.38),
-    0 2px 6px rgba(0, 0, 0, 0.40);
-}
-
-[data-theme='middle-earth'] .hero-play-btn:hover,
-[data-theme='middle-earth'] .album-card-details-btn:hover {
-  background: linear-gradient(180deg, #f8cc38 0%, #d8a018 50%, #bc8810 100%);
-  box-shadow:
-    inset 0 1px 0 rgba(255, 240, 100, 0.55),
-    0 0 22px rgba(212, 168, 32, 0.58),
-    0 2px 8px rgba(0, 0, 0, 0.35);
-  filter: none;
-}
-
-/* ── Queue round buttons ── */
-[data-theme='middle-earth'] .queue-round-btn {
-  background: linear-gradient(180deg, #f0e4b0 0%, #dece88 100%);
-  color: #4a3828;
-  border: 1px solid rgba(150, 112, 38, 0.40);
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55), 0 1px 2px rgba(80, 50, 10, 0.18);
-}
-
-[data-theme='middle-earth'] .queue-round-btn:hover:not(:disabled):not(.active) {
-  background: linear-gradient(180deg, #fffff0 0%, #f0e4a0 100%);
-  border-color: rgba(180, 140, 40, 0.60);
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.70), 0 0 8px rgba(212, 168, 32, 0.22);
-  color: #2a1c0e;
-}
-
-[data-theme='middle-earth'] .queue-round-btn.active {
-  background: linear-gradient(180deg, #e8bc28 0%, #c8940c 100%);
-  color: #1a1008;
-  border-color: #c89818;
-  box-shadow: 0 0 14px rgba(212, 168, 32, 0.45), inset 0 1px 0 rgba(255, 240, 100, 0.35);
-}
-
-/* ── Cards: leaves of the Red Book — layered parchment ── */
-[data-theme='middle-earth'] .card {
-  background: linear-gradient(180deg, #f8f0d0 0%, #f0e4b8 100%);
-  border: 1px solid rgba(168, 130, 48, 0.32);
-  border-radius: 10px;
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.70),
-    0 2px 8px rgba(80, 50, 10, 0.16),
-    0 4px 16px rgba(60, 38, 10, 0.08);
-}
-
-/* ── Content header: illuminated manuscript chapter heading ── */
-/* The gold ruled border at the bottom is the decorative line
-   that separates the chapter title from the body of the text  */
-[data-theme='middle-earth'] .content-header {
-  position: relative;
-  background: linear-gradient(180deg, #f8f0d0 0%, #f0e4b8 100%);
-  border-bottom: 2px solid rgba(200, 158, 38, 0.45);
-  box-shadow: 0 3px 14px rgba(120, 80, 15, 0.12);
-}
-
-/* The gold rule — fades at edges like gold leaf on vellum */
-[data-theme='middle-earth'] .content-header::after {
-  content: '';
-  position: absolute;
-  bottom: -3px;
-  left: 8%;
-  right: 8%;
-  height: 1px;
-  background: linear-gradient(90deg, transparent 0%, rgba(212, 168, 32, 0.65) 20%,
-      rgba(240, 210, 60, 0.85) 50%, rgba(212, 168, 32, 0.65) 80%, transparent 100%);
-  pointer-events: none;
-}
-
-/* Connection indicators — sidebar is dark, need light text */
-[data-theme='middle-earth'] .connection-type,
-[data-theme='middle-earth'] .connection-server {
-  color: #b88a50;
-}
-
-/* ── Theme accordion: old book binding ── */
-[data-theme='middle-earth'] .theme-accordion-header:hover {
-  background: rgba(212, 168, 32, 0.12);
-  color: #6a4820;
-}
-
-[data-theme='middle-earth'] .theme-accordion-open .theme-accordion-header {
-  background: rgba(212, 168, 32, 0.16);
-  color: #5a3818;
-}
-
-[data-theme='middle-earth'] .theme-accordion-open .theme-accordion-chevron {
-  color: #c89818;
-}
-
-/* ── Progress bar: THE ROAD GOES EVER ON ── */
-/* From darkness into gold light — the long journey from the Shire to Mount Doom */
-[data-theme='middle-earth'] .progress-bar-track {
-  background: #d8c880;
-  border: 1px solid rgba(160, 120, 38, 0.40);
-  border-radius: 4px;
-  box-shadow: inset 0 1px 3px rgba(80, 50, 10, 0.20);
-}
-
-[data-theme='middle-earth'] .progress-bar-fill {
-  background: linear-gradient(90deg,
-      #5a3802 0%,
-      #9a6808 25%,
-      #c89018 55%,
-      #d4a820 75%,
-      #f0d060 90%,
-      #fff0a0 100%);
-  border-radius: 4px;
-  box-shadow: 0 0 10px rgba(212, 168, 32, 0.65), 0 0 3px rgba(255, 230, 100, 0.55);
-}
-
-/* ── Scrollbar: aged oak library shelves ── */
-[data-theme='middle-earth'] ::-webkit-scrollbar {
-  width: 8px;
-  height: 8px;
-}
-
-[data-theme='middle-earth'] ::-webkit-scrollbar-track {
-  background: #dcc880;
-  border-radius: 4px;
-}
-
-[data-theme='middle-earth'] ::-webkit-scrollbar-thumb {
-  background: linear-gradient(to right, #6e4a28 0%, #9a7040 40%, #6a4420 100%);
-  border: 1px solid rgba(180, 130, 40, 0.45);
-  border-radius: 4px;
-  box-shadow: inset 0 1px 0 rgba(255, 220, 100, 0.25);
-}
-
-[data-theme='middle-earth'] ::-webkit-scrollbar-thumb:hover {
-  background: linear-gradient(to right, #8a6038 0%, #b88a50 40%, #8a5a30 100%);
-  box-shadow: inset 0 1px 0 rgba(255, 220, 100, 0.35), 0 0 5px rgba(212, 168, 32, 0.28);
-}
-
-/* ── Glass / dropdowns: a scroll held to the light ── */
-[data-theme='middle-earth'] .glass {
-  background: rgba(248, 238, 198, 0.96) !important;
-  backdrop-filter: none !important;
-  border: 1px solid rgba(180, 140, 48, 0.45) !important;
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.70),
-    0 4px 20px rgba(80, 50, 10, 0.20),
-    0 8px 30px rgba(60, 38, 10, 0.10) !important;
-  border-radius: 10px !important;
-}
-
-[data-theme='middle-earth'] .glass [style*="var(--bg-hover)"] {
-  background: rgba(212, 168, 32, 0.12) !important;
-  border-radius: 6px !important;
-}
-
-[data-theme='middle-earth'] .glass [style*="var(--text-primary)"] {
-  color: #1e1408 !important;
-}
-
-[data-theme='middle-earth'] .glass [style*="var(--text-secondary)"] {
-  color: #3e2c1a !important;
-}
-
-[data-theme='middle-earth'] .glass [style*="var(--text-muted)"] {
-  color: #5e4828 !important;
-}
-
-/* ── Hover / selection: candlelight — warm gold glow ── */
-[data-theme='middle-earth'] .settings-tab:hover {
-  background: rgba(212, 168, 32, 0.12);
-  color: #2a1c0e;
-}
-
-[data-theme='middle-earth'] .settings-tab.active {
-  background: rgba(212, 168, 32, 0.18);
-  color: #2a1c0e;
-  box-shadow: inset 2px 0 0 #d4a820;
-}
-
-[data-theme='middle-earth'] .custom-select-trigger:hover {
-  background: rgba(212, 168, 32, 0.10);
-}
-
-[data-theme='middle-earth'] .custom-select-option:hover {
-  background: rgba(212, 168, 32, 0.15) !important;
-  color: #1e1408 !important;
-}
-
-[data-theme='middle-earth'] .artist-ext-link:hover {
-  background: rgba(212, 168, 32, 0.12);
-  color: #2a1c0e !important;
-  border-color: rgba(180, 140, 40, 0.55) !important;
-}
-
-[data-theme='middle-earth'] .np-action-btn:hover {
-  background: rgba(212, 168, 32, 0.10);
-}
-
-[data-theme='middle-earth'] .np-queue-item:hover,
-[data-theme='middle-earth'] .np-queue-item.context-active {
-  background: rgba(212, 168, 32, 0.13);
-  box-shadow: inset 2px 0 0 #d4a820;
-}
-
-[data-theme='middle-earth'] .track-row:hover,
-[data-theme='middle-earth'] .track-row.context-active {
-  background: rgba(212, 168, 32, 0.10) !important;
-  box-shadow: inset 2px 0 0 #d4a820;
-}
-
-[data-theme='middle-earth'] .artist-row:hover {
-  background: rgba(212, 168, 32, 0.10);
-  box-shadow: inset 2px 0 0 #d4a820;
-}
-
-[data-theme='middle-earth'] .playlist-row:hover {
-  background: rgba(212, 168, 32, 0.10);
-  box-shadow: inset 2px 0 0 #d4a820;
-}
-
-[data-theme='middle-earth'] .queue-item:hover,
-[data-theme='middle-earth'] .queue-item.context-active {
-  background: rgba(212, 168, 32, 0.12) !important;
-  box-shadow: inset 2px 0 0 #d4a820;
-}
-
-/* ── Active queue / now-playing: the bearer of the Ring ── */
-[data-theme='middle-earth'] .queue-item.active {
-  background: rgba(212, 168, 32, 0.14);
-  box-shadow: inset 2px 0 0 #d4a820;
-}
-
-[data-theme='middle-earth'] .queue-item.active .queue-item-title {
-  color: #f8e060;
-}
-
-[data-theme='middle-earth'] .queue-item.active .queue-item-artist,
-[data-theme='middle-earth'] .queue-item.active .queue-item-duration {
-  color: #c8a060;
-}
-
-[data-theme='middle-earth'] .np-queue-item-active {
-  color: #2a1c0e;
-  text-shadow: 0 0 6px rgba(212, 168, 32, 0.40);
-}
-
-[data-theme='middle-earth'] .np-queue-item.active {
-  background: rgba(212, 168, 32, 0.10);
-}
-
-[data-theme='middle-earth'] .np-album-track.active .np-album-track-title,
-[data-theme='middle-earth'] .np-album-track.active .np-album-track-num {
-  color: #2a1c0e;
-  text-shadow: 0 0 6px rgba(212, 168, 32, 0.38);
-}
-
-/* ── Queue tech bar: dark text on light parchment ── */
-[data-theme='middle-earth'] .queue-current-tech {
-  color: #3e2808;
-}
-
-/* ── Queue + Lyrics on dark sidebar ── */
-[data-theme='middle-earth'] .queue-current-info h3 {
-  color: #f0d880;
-}
-
-[data-theme='middle-earth'] .queue-current-sub {
-  color: #d4a820;
-}
-
-[data-theme='middle-earth'] .queue-item-title {
-  color: #f0d880;
-}
-
-[data-theme='middle-earth'] .queue-item-artist {
-  color: #c8a060;
-}
-
-[data-theme='middle-earth'] .queue-item-duration {
-  color: #b08858;
-}
-
-[data-theme='middle-earth'] .queue-tab-btn {
-  color: #c8a060;
-  font-family: Georgia, serif;
-}
-
-[data-theme='middle-earth'] .queue-tab-btn:hover {
-  color: #f0d880;
-  background: rgba(212, 168, 32, 0.10);
-}
-
-[data-theme='middle-earth'] .queue-tab-btn.active {
-  color: #d4a820;
-}
-
-[data-theme='middle-earth'] .lyrics-line {
-  color: #b08858;
-}
-
-[data-theme='middle-earth'] .lyrics-line.active {
-  color: #f0d880;
-  text-shadow: 0 0 6px rgba(212, 168, 32, 0.35);
-}
-
-[data-theme='middle-earth'] .lyrics-plain-line {
-  color: #c8a060;
-}
-
-[data-theme='middle-earth'] .lyrics-status {
-  color: #a88048;
-}
-
-/* Queue: "Nächste Titel" divider label */
-[data-theme='middle-earth'] .queue-divider span {
-  color: #b8905a !important;
-}
-
-/* Queue: artist text visible on hover for inactive items */
-[data-theme='middle-earth'] .queue-item:hover .queue-item-artist,
-[data-theme='middle-earth'] .queue-item.context-active .queue-item-artist {
-  color: #e8c878;
-}
-
-/* AlbumDetail header: artist name readable */
-[data-theme='middle-earth'] .album-detail-artist,
-[data-theme='middle-earth'] .album-detail-artist-link {
-  color: #e8c878;
-}
-
-[data-theme='middle-earth'] .album-detail-artist-link:hover {
-  color: #f8e060;
-}
-
-/* ArtistDetail About: heading, bio text + "Mehr lesen" readable */
-[data-theme='middle-earth'] .np-card-title {
-  color: #6b4e2a;
-}
-
-[data-theme='middle-earth'] .np-bio-text {
-  color: #5a3e20;
-}
-
-[data-theme='middle-earth'] .np-bio-toggle {
-  color: #7a5228;
-}
-
diff --git a/src/styles/themes/middle-earth-the-one-ring-inscription-glow.css b/src/styles/themes/middle-earth-the-one-ring-inscription-glow.css
deleted file mode 100644
index 003469e1..00000000
--- a/src/styles/themes/middle-earth-the-one-ring-inscription-glow.css
+++ /dev/null
@@ -1,25 +0,0 @@
-/* ─────────────────────────────────────────────────────────────
-   Middle-Earth — The One Ring Inscription Glow
-   ───────────────────────────────────────────────────────────── */
-
-/* Breathing glow of the Ring — applied to player-track-name.
-   Like the inscription heating up in Bag End's fireplace.      */
-@keyframes ring-inscription-glow {
-
-  0%,
-  100% {
-    text-shadow:
-      0 0 8px rgba(240, 200, 60, 0.70),
-      0 0 18px rgba(200, 140, 20, 0.38),
-      0 0 36px rgba(160, 100, 10, 0.15);
-  }
-
-  50% {
-    text-shadow:
-      0 0 12px rgba(240, 200, 60, 0.95),
-      0 0 28px rgba(200, 140, 20, 0.65),
-      0 0 52px rgba(160, 100, 10, 0.32),
-      0 0 80px rgba(100, 60, 5, 0.14);
-  }
-}
-
diff --git a/src/styles/themes/midnight-blue.css b/src/styles/themes/midnight-blue.css
deleted file mode 100644
index 80d1bf66..00000000
--- a/src/styles/themes/midnight-blue.css
+++ /dev/null
@@ -1,68 +0,0 @@
-/* ─── Midnight Blue ─── */
-[data-theme='midnight-blue'] {
-  color-scheme: dark;
-
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2360a5fa' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
-
-  /* Backgrounds */
-  --ctp-crust:    #07090f;
-  --ctp-mantle:   #090c14;
-  --ctp-base:     #0d1420;
-  --ctp-surface0: #111a28;
-  --ctp-surface1: #162030;
-  --ctp-surface2: #1c2838;
-
-  /* Overlays */
-  --ctp-overlay0: #2a3d5a;
-  --ctp-overlay1: #3a507a;
-  --ctp-overlay2: #4a659a;
-
-  /* Text */
-  --ctp-text:     #ccd8f0;
-  --ctp-subtext1: #9ab0d8;
-  --ctp-subtext0: #6888b0;
-
-  /* Light blue accent */
-  --ctp-teal:      #60a5fa;
-  --ctp-sky:       #60a5fa;
-  --ctp-sapphire:  #4a90e8;
-  --ctp-blue:      #3878d0;
-  --ctp-lavender:  #60a5fa;
-  --ctp-mauve:     #4a90e8;
-  --ctp-pink:      #3878d0;
-  --ctp-flamingo:  #60a5fa;
-  --ctp-rosewater: #4a90e8;
-
-  /* Semantic */
-  --ctp-red:     #e07070;
-  --ctp-maroon:  #d09050;
-  --ctp-peach:   #d09050;
-  --ctp-yellow:  #c8b850;
-  --ctp-green:   #60c880;
-
-  /* UI tokens */
-  --bg-app:      #0d1420;
-  --bg-sidebar:  #090c14;
-  --bg-card:     #111a28;
-  --bg-hover:    #162030;
-  --bg-player:   #090c14;
-  --bg-glass:    rgba(13, 20, 32, 0.95);
-
-  --accent:      #60a5fa;
-  --accent-dim:  rgba(96, 165, 250, 0.07);
-  --accent-glow: rgba(96, 165, 250, 0.14);
-
-  --text-primary:   #ccd8f0;
-  --text-secondary: #6888b0;
-  --text-muted:     #50627e;
-
-  --border:          #1c2838;
-  --border-subtle:   #111a28;
-  --border-dropdown: #223040;
-  --shadow-dropdown: rgba(0, 0, 0, 0.90);
-
-  --positive: #60c880;
-  --warning:  #c8b850;
-  --danger:   #e07070;
-}
-
diff --git a/src/styles/themes/morpheus-matrix-style.css b/src/styles/themes/morpheus-matrix-style.css
deleted file mode 100644
index d0cecef3..00000000
--- a/src/styles/themes/morpheus-matrix-style.css
+++ /dev/null
@@ -1,4 +0,0 @@
-/* ─────────────────────────────────────────────────────────────
-   Morpheus — Matrix Style
-   ───────────────────────────────────────────────────────────── */
-
diff --git a/src/styles/themes/ms-dos.css b/src/styles/themes/ms-dos.css
deleted file mode 100644
index 4a7d06b4..00000000
--- a/src/styles/themes/ms-dos.css
+++ /dev/null
@@ -1,284 +0,0 @@
-/* ─── MS-DOS ─── */
-@keyframes dos-blink {
-
-  0%,
-  49% {
-    opacity: 1;
-  }
-
-  50%,
-  100% {
-    opacity: 0;
-  }
-}
-
-[data-theme='dos'] {
-  color-scheme: dark;
-  font-family: 'Courier New', Courier, 'Lucida Console', monospace;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23AAAAAA%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* Pure ANSI color palette */
-  --ctp-crust: #000000;
-  --ctp-mantle: #000080;
-  --ctp-base: #0000AA;
-  --ctp-surface0: #000080;
-  --ctp-surface1: #0000AA;
-  --ctp-surface2: #0000CC;
-  --ctp-overlay0: #8888AA;
-  --ctp-overlay1: #BBBBCC;
-  --ctp-overlay2: #E8E8E8;
-  --ctp-text: #E8E8E8;
-  --ctp-subtext1: #BBBBCC;
-  --ctp-subtext0: #8888AA;
-  --ctp-mauve: #FF55FF;
-  --ctp-lavender: #FF55FF;
-  --ctp-pink: #FF55FF;
-  --ctp-flamingo: #FF5555;
-  --ctp-rosewater: #FFFFFF;
-  --ctp-green: #55FF55;
-  --ctp-teal: #55FFFF;
-  --ctp-sky: #55FFFF;
-  --ctp-blue: #5555FF;
-  --ctp-sapphire: #5555FF;
-  --ctp-yellow: #FFFF55;
-  --ctp-peach: #FF5555;
-  --ctp-maroon: #AA0000;
-  --ctp-red: #FF5555;
-
-  --bg-app: #0000AA;
-  --bg-sidebar: #000080;
-  --bg-card: #000080;
-  --bg-hover: rgba(170, 170, 170, 0.15);
-  --bg-player: #000000;
-  --bg-glass: rgba(0, 0, 128, 0.95);
-  --accent: #FFFF55;
-  --accent-dim: rgba(255, 255, 85, 0.15);
-  --accent-glow: rgba(255, 255, 85, 0.3);
-  --text-primary: #E8E8E8;
-  --text-secondary: #BBBBCC;
-  --text-muted: #8888AA;
-  --border: #AAAAAA;
-  --border-subtle: #4444AA;
-  --border-dropdown: #AAAAAA;
-  --shadow-dropdown: rgba(0, 0, 0, 0.95);
-  --positive: #55FF55;
-  --warning: #FFFF55;
-  --danger: #FF5555;
-  /* Square everything — no rounded corners in DOS */
-  --radius-sm: 0px;
-  --radius-md: 0px;
-  --radius-lg: 0px;
-  --radius-full: 0px;
-}
-
-/* Monospace override — html inherits to most elements; form controls need explicit override */
-[data-theme='dos'] button,
-[data-theme='dos'] input,
-[data-theme='dos'] textarea,
-[data-theme='dos'] select {
-  font-family: 'Courier New', Courier, 'Lucida Console', monospace;
-}
-
-/* Sidebar — dark navy with CRT scanlines, thick grey right border like a DOS panel edge */
-[data-theme='dos'] .sidebar {
-  background-color: #000080;
-  background-image: repeating-linear-gradient(0deg,
-      rgba(0, 0, 0, 0.20) 0px,
-      rgba(0, 0, 0, 0.20) 1px,
-      transparent 1px,
-      transparent 3px);
-  border-right: 2px solid #AAAAAA;
-}
-
-/* Active nav — classic DOS inverted selection */
-[data-theme='dos'] .nav-link.active {
-  background: #AAAAAA;
-  color: #000080;
-  border-left: none;
-  font-weight: 700;
-}
-
-[data-theme='dos'] .nav-link:hover:not(.active) {
-  background: rgba(170, 170, 170, 0.18);
-  color: #FFFF55;
-}
-
-/* Player bar — pure black, the C:\> command prompt */
-[data-theme='dos'] .player-bar {
-  background-color: #000000;
-  background-image: repeating-linear-gradient(0deg,
-      rgba(0, 0, 0, 0.20) 0px,
-      rgba(0, 0, 0, 0.20) 1px,
-      transparent 1px,
-      transparent 3px);
-  border-top: 2px solid #AAAAAA;
-  box-shadow: none;
-}
-
-/* Track name — bright yellow with blinking block cursor */
-[data-theme='dos'] .player-track-name {
-  color: #FFFF55;
-  text-shadow: none;
-}
-
-[data-theme='dos'] .player-track-name::after {
-  content: '\258B';
-  animation: dos-blink 1s step-end infinite;
-  margin-left: 3px;
-  font-size: 0.8em;
-  vertical-align: baseline;
-}
-
-/* Artist name — bright cyan (ANSI 11) */
-[data-theme='dos'] .player-artist-name {
-  color: #55FFFF;
-}
-
-/* Content header — simple grey border, no ornate gradient */
-[data-theme='dos'] .content-header {
-  border-bottom: 1px solid #AAAAAA;
-}
-
-/* Album/artist cards — flat navy panels with grey border */
-[data-theme='dos'] .album-card,
-[data-theme='dos'] .artist-card {
-  background: #000080;
-  border: 1px solid #AAAAAA;
-  box-shadow: none;
-}
-
-[data-theme='dos'] .album-card:hover,
-[data-theme='dos'] .artist-card:hover {
-  background: #0000AA;
-  border-color: #FFFFFF;
-  box-shadow: none;
-}
-
-/* Track / queue row hover — inverted DOS selection */
-[data-theme='dos'] .track-row:hover,
-[data-theme='dos'] .queue-item:hover {
-  background: #AAAAAA !important;
-  color: #000080;
-  box-shadow: none;
-}
-
-/* Primary play button — flat grey, sharp, DOS dialog style */
-[data-theme='dos'] .player-btn-primary {
-  background: #AAAAAA;
-  color: #000000;
-  border: 2px solid #FFFFFF;
-  box-shadow: none;
-}
-
-[data-theme='dos'] .player-btn-primary:hover {
-  background: #FFFFFF;
-  color: #000000;
-  box-shadow: none;
-  transform: none;
-}
-
-/* btn-primary — uppercase DOS dialog button */
-[data-theme='dos'] .btn-primary {
-  background: #AAAAAA;
-  color: #000000;
-  border: 1px solid #FFFFFF;
-  text-transform: uppercase;
-  letter-spacing: 0.06em;
-  box-shadow: none;
-}
-
-[data-theme='dos'] .btn-primary:hover {
-  background: #FFFFFF;
-  color: #000000;
-  box-shadow: none;
-}
-
-/* btn-surface */
-[data-theme='dos'] .btn-surface,
-[data-theme='dos'] .btn {
-  border: 1px solid #AAAAAA;
-  box-shadow: none;
-}
-
-/* Hero play button */
-[data-theme='dos'] .hero-play-btn {
-  background: #AAAAAA;
-  color: #000000;
-  border: 2px solid #FFFFFF;
-  text-transform: uppercase;
-  letter-spacing: 0.08em;
-  box-shadow: none;
-  transition: background var(--transition-fast), color var(--transition-fast);
-}
-
-[data-theme='dos'] .hero-play-btn:hover {
-  background: #FFFFFF;
-  color: #000000;
-  transform: none;
-  filter: none;
-  box-shadow: none;
-}
-
-/* Album card overlay play button */
-[data-theme='dos'] .album-card-details-btn {
-  background: #AAAAAA;
-  color: #000000;
-  border: 2px solid #FFFFFF;
-  box-shadow: none;
-}
-
-[data-theme='dos'] .album-card-details-btn:hover {
-  background: #FFFFFF;
-  color: #000000;
-}
-
-/* Queue round buttons — square in DOS */
-[data-theme='dos'] .queue-round-btn {
-  border: 1px solid #AAAAAA;
-  box-shadow: none;
-}
-
-[data-theme='dos'] .queue-round-btn.active {
-  background: #AAAAAA;
-  color: #000000;
-  border-color: #FFFFFF;
-  box-shadow: none;
-}
-
-/* Input fields */
-[data-theme='dos'] input,
-[data-theme='dos'] textarea {
-  background: #000080;
-  border: 1px solid #AAAAAA;
-  border-radius: 0;
-}
-
-[data-theme='dos'] input:focus,
-[data-theme='dos'] textarea:focus {
-  border-color: #FFFF55;
-  outline: none;
-  box-shadow: none;
-}
-
-/* Scrollbar — wide 16px DOS style with sharp thumb */
-[data-theme='dos'] ::-webkit-scrollbar {
-  width: 16px;
-  height: 16px;
-}
-
-[data-theme='dos'] ::-webkit-scrollbar-track {
-  background: #000080;
-  border-left: 1px solid #AAAAAA;
-}
-
-[data-theme='dos'] ::-webkit-scrollbar-thumb {
-  background: #AAAAAA;
-  border-radius: 0;
-  border: 1px solid #FFFFFF;
-}
-
-[data-theme='dos'] ::-webkit-scrollbar-thumb:hover {
-  background: #FFFFFF;
-}
-
-
diff --git a/src/styles/themes/musicmatch-jukebox-y2k-metallic-silver-blue-display.css b/src/styles/themes/musicmatch-jukebox-y2k-metallic-silver-blue-display.css
deleted file mode 100644
index 31e9d8d2..00000000
--- a/src/styles/themes/musicmatch-jukebox-y2k-metallic-silver-blue-display.css
+++ /dev/null
@@ -1,398 +0,0 @@
-/* ─── Musicmatch Jukebox — Y2K Metallic Silver / Blue Display ─── */
-[data-theme='muma-jukebox'] {
-  color-scheme: light;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%234a4a4a%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* ── Palette ── */
-  --ctp-crust: #001358;
-  /* deep blue — LCD display */
-  --ctp-mantle: #b5babc;
-  /* dark silver — panels, sidebar */
-  --ctp-base: #d4d8db;
-  /* metallic silver — main body */
-  --ctp-surface0: #c8ccce;
-  --ctp-surface1: #bec2c4;
-  --ctp-surface2: #8a9094;
-  /* border gray */
-  --ctp-overlay0: #6a7074;
-  --ctp-overlay1: #505458;
-  --ctp-overlay2: #3a3e42;
-  --ctp-text: #1a1a1a;
-  --ctp-subtext1: #3a3a3a;
-  --ctp-subtext0: #4a4a4a;
-  /* Cyan accent + Musicmatch orange */
-  --ctp-mauve: #00d0ff;
-  /* cyan — primary accent */
-  --ctp-lavender: #40e0ff;
-  --ctp-sky: #00c0e8;
-  --ctp-sapphire: #0088c8;
-  --ctp-blue: #0058b8;
-  --ctp-teal: #009898;
-  --ctp-green: #008840;
-  --ctp-yellow: #cc8800;
-  --ctp-peach: #ff6600;
-  /* Musicmatch orange — secondary accent */
-  --ctp-pink: #d04060;
-  --ctp-flamingo: #c05040;
-  --ctp-rosewater: #c87060;
-  --ctp-maroon: #b02828;
-  --ctp-red: #c82020;
-
-  /* ── Semantic tokens ── */
-  --bg-app: #d4d8db;
-  --bg-sidebar: #b5babc;
-  --bg-card: #c8ccce;
-  --bg-hover: #bec2c4;
-  --bg-player: #001358;
-  /* LCD display — deep blue */
-  --bg-glass: rgba(212, 216, 219, 0.92);
-  --accent: #00d0ff;
-  --accent-dim: rgba(0, 208, 255, 0.15);
-  --accent-glow: rgba(0, 208, 255, 0.35);
-  --volume-accent: #ff6600;
-  /* Musicmatch orange for volume */
-  --text-primary: #1a1a1a;
-  --text-secondary: #4a4a4a;
-  --text-muted: #909090;
-  --border: #8a9094;
-  --border-subtle: #c0c4c6;
-  --positive: #008840;
-  --warning: #cc8800;
-  --danger: #c82020;
-}
-
-/* ── Musicmatch: contrast fixes ── */
-[data-theme='muma-jukebox'] .queue-round-btn.active {
-  color: #001358;
-}
-
-/* Accent-coloured text on silver body needs to be darker */
-[data-theme='muma-jukebox'] {
-  --accent: #0070a0;
-  --accent-dim: rgba(0, 112, 160, 0.15);
-  --accent-glow: rgba(0, 112, 160, 0.35);
-}
-
-/* Player bar keeps the bright cyan since it's on dark blue bg */
-[data-theme='muma-jukebox'] .player-bar {
-  --accent: #00d0ff;
-}
-
-/* ── Metallic bevel buttons ── */
-[data-theme='muma-jukebox'] .btn {
-  background: linear-gradient(180deg, #e4e8eb 0%, #c0c4c7 100%);
-  color: #1a1a1a;
-  box-shadow:
-    inset 1px 1px 0 rgba(255, 255, 255, 0.9),
-    inset -1px -1px 0 rgba(0, 0, 0, 0.28),
-    0 1px 3px rgba(0, 0, 0, 0.2);
-  border-radius: 4px;
-}
-
-[data-theme='muma-jukebox'] .btn:hover {
-  background: linear-gradient(180deg, #eceef0 0%, #cacdd0 100%);
-}
-
-[data-theme='muma-jukebox'] .btn-primary {
-  background: linear-gradient(180deg, #40e0ff 0%, #00a8d8 100%);
-  color: #001358;
-  font-weight: 600;
-  box-shadow:
-    inset 1px 1px 0 rgba(255, 255, 255, 0.6),
-    inset -1px -1px 0 rgba(0, 60, 120, 0.4),
-    0 1px 4px rgba(0, 0, 0, 0.25);
-  border-radius: 4px;
-}
-
-[data-theme='muma-jukebox'] .btn-primary:hover {
-  background: linear-gradient(180deg, #60e8ff 0%, #20c0f0 100%);
-}
-
-/* ── Player bar: blue LCD display area ── */
-[data-theme='muma-jukebox'] .player-bar {
-  background: #001358;
-  border-top: 3px solid #8a9094;
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.08),
-    inset 0 2px 12px rgba(0, 0, 0, 0.4);
-}
-
-[data-theme='muma-jukebox'] .player-track-name {
-  color: #ffffff;
-  text-shadow: 0 0 8px rgba(0, 208, 255, 0.75), 0 0 2px rgba(0, 208, 255, 0.4);
-  letter-spacing: 0.02em;
-}
-
-[data-theme='muma-jukebox'] .player-track-artist {
-  color: #00d0ff;
-  opacity: 0.9;
-}
-
-[data-theme='muma-jukebox'] .player-btn,
-[data-theme='muma-jukebox'] .player-btn-primary {
-  background: linear-gradient(180deg, #1a2880 0%, #000e40 100%);
-  color: #00d0ff;
-  box-shadow:
-    inset 1px 1px 0 rgba(0, 208, 255, 0.25),
-    inset -1px -1px 0 rgba(0, 0, 0, 0.5),
-    0 2px 5px rgba(0, 0, 0, 0.4);
-  border-radius: 50%;
-}
-
-[data-theme='muma-jukebox'] .player-btn:hover,
-[data-theme='muma-jukebox'] .player-btn-primary:hover {
-  background: linear-gradient(180deg, #2030a0 0%, #001060 100%);
-  color: #40e8ff;
-}
-
-/* ── Sidebar: brushed-metal panel ── */
-[data-theme='muma-jukebox'] .sidebar {
-  background: linear-gradient(180deg, #c8ccce 0%, #b0b4b7 100%);
-  border-right: 2px solid #7a8084;
-  box-shadow: inset -2px 0 0 rgba(255, 255, 255, 0.5), 2px 0 4px rgba(0, 0, 0, 0.15);
-}
-
-/* Nav links on silver: look like Windows panel items */
-[data-theme='muma-jukebox'] .nav-link {
-  color: #1a1a2a;
-  border-radius: 3px;
-  margin: 1px 4px;
-}
-
-[data-theme='muma-jukebox'] .nav-link:hover {
-  background: linear-gradient(180deg, #dde2e5 0%, #c8ccce 100%);
-  box-shadow: inset 1px 1px 0 rgba(255, 255, 255, 0.8), inset -1px -1px 0 rgba(0, 0, 0, 0.15);
-  color: #0070a0;
-}
-
-[data-theme='muma-jukebox'] .nav-link.active {
-  background: linear-gradient(180deg, #b8c8e0 0%, #9ab0d0 100%);
-  box-shadow:
-    inset 1px 1px 0 rgba(0, 0, 0, 0.15),
-    inset -1px -1px 0 rgba(255, 255, 255, 0.5);
-  color: #001358;
-  font-weight: 600;
-}
-
-[data-theme='muma-jukebox'] .nav-link.active::before {
-  display: none;
-}
-
-/* ── Cards / panels: inset bevel ── */
-[data-theme='muma-jukebox'] .glass,
-[data-theme='muma-jukebox'] .card {
-  background: #d4d8db;
-  box-shadow:
-    inset 1px 1px 0 rgba(255, 255, 255, 0.85),
-    inset -1px -1px 0 rgba(0, 0, 0, 0.15),
-    0 2px 6px rgba(0, 0, 0, 0.1);
-  border: 1px solid #9a9ea0 !important;
-}
-
-/* ── Track rows: Windows XP list selection ── */
-[data-theme='muma-jukebox'] .track-row:hover,
-[data-theme='muma-jukebox'] .track-row.context-active {
-  background: #316AC5 !important;
-  color: #ffffff !important;
-  box-shadow: none;
-}
-
-[data-theme='muma-jukebox'] .track-row:hover .track-title,
-[data-theme='muma-jukebox'] .track-row:hover .track-artist,
-[data-theme='muma-jukebox'] .track-row:hover .track-duration,
-[data-theme='muma-jukebox'] .track-row:hover .track-num,
-[data-theme='muma-jukebox'] .track-row.context-active .track-title,
-[data-theme='muma-jukebox'] .track-row.context-active .track-artist {
-  color: #ffffff !important;
-}
-
-/* ── Queue items ── */
-[data-theme='muma-jukebox'] .queue-item:hover,
-[data-theme='muma-jukebox'] .queue-item.context-active {
-  background: #316AC5 !important;
-}
-
-[data-theme='muma-jukebox'] .queue-item:hover .queue-item-title,
-[data-theme='muma-jukebox'] .queue-item:hover .queue-item-artist,
-[data-theme='muma-jukebox'] .queue-item:hover .queue-item-duration,
-[data-theme='muma-jukebox'] .queue-item.context-active .queue-item-title,
-[data-theme='muma-jukebox'] .queue-item.context-active .queue-item-artist {
-  color: #ffffff !important;
-}
-
-[data-theme='muma-jukebox'] .queue-item.active {
-  background: rgba(0, 112, 160, 0.14);
-  box-shadow: inset 3px 0 0 #0070a0;
-}
-
-[data-theme='muma-jukebox'] .np-queue-item:hover,
-[data-theme='muma-jukebox'] .np-queue-item.context-active {
-  background: #316AC5;
-}
-
-[data-theme='muma-jukebox'] .np-queue-item-active {
-  color: #001358;
-  font-weight: 600;
-}
-
-[data-theme='muma-jukebox'] .np-queue-item.active {
-  background: rgba(49, 106, 197, 0.18);
-}
-
-/* ── Artist / playlist rows ── */
-[data-theme='muma-jukebox'] .artist-row:hover,
-[data-theme='muma-jukebox'] .playlist-row:hover {
-  background: #316AC5;
-  color: #ffffff;
-}
-
-/* ── Settings tabs: XP tab strip ── */
-[data-theme='muma-jukebox'] .settings-tab {
-  background: linear-gradient(180deg, #d4d8db 0%, #c0c4c7 100%);
-  border: 1px solid #9a9ea0;
-  color: #1a1a1a;
-  border-radius: 3px 3px 0 0;
-  margin-right: 2px;
-}
-
-[data-theme='muma-jukebox'] .settings-tab:hover {
-  background: linear-gradient(180deg, #dde2e5 0%, #cacdd0 100%);
-  color: #0070a0;
-}
-
-[data-theme='muma-jukebox'] .settings-tab.active {
-  background: linear-gradient(180deg, #ffffff 0%, #f0f4f8 100%);
-  color: #001358;
-  font-weight: 600;
-  box-shadow: inset 0 2px 0 #0070a0;
-  border-bottom-color: transparent;
-}
-
-/* ── Queue tab buttons ── */
-[data-theme='muma-jukebox'] .queue-tab-btn:hover {
-  color: #0070a0;
-}
-
-/* ── Now-playing active ── */
-[data-theme='muma-jukebox'] .np-album-track.active .np-album-track-title,
-[data-theme='muma-jukebox'] .np-album-track.active .np-album-track-num {
-  color: #0070a0;
-  font-weight: 600;
-}
-
-/* ── Scrollbar: XP silver ── */
-[data-theme='muma-jukebox'] ::-webkit-scrollbar {
-  width: 16px;
-  height: 16px;
-}
-
-[data-theme='muma-jukebox'] ::-webkit-scrollbar-track {
-  background: linear-gradient(90deg, #c0c4c7 0%, #d4d8db 100%);
-  border: 1px solid #9a9ea0;
-}
-
-[data-theme='muma-jukebox'] ::-webkit-scrollbar-thumb {
-  background: linear-gradient(180deg, #dde2e5 0%, #b8bcbf 100%);
-  border: 1px solid #9a9ea0;
-  box-shadow: inset 1px 1px 0 rgba(255, 255, 255, 0.7), inset -1px -1px 0 rgba(0, 0, 0, 0.15);
-}
-
-[data-theme='muma-jukebox'] ::-webkit-scrollbar-thumb:hover {
-  background: linear-gradient(180deg, #e8ecf0 0%, #c8ccce 100%);
-}
-
-[data-theme='muma-jukebox'] ::-webkit-scrollbar-button {
-  background: linear-gradient(180deg, #dde2e5 0%, #b8bcbf 100%);
-  border: 1px solid #9a9ea0;
-  height: 16px;
-}
-
-/* ── Dropdowns ── */
-[data-theme='muma-jukebox'] .custom-select-trigger {
-  background: linear-gradient(180deg, #e4e8eb 0%, #d4d8db 100%);
-  border: 1px solid #9a9ea0;
-  box-shadow: inset 1px 1px 0 rgba(255, 255, 255, 0.7);
-}
-
-[data-theme='muma-jukebox'] .custom-select-option:hover {
-  background: #316AC5 !important;
-  color: #ffffff !important;
-}
-
-/* ── Connection indicators ── */
-[data-theme='muma-jukebox'] .connection-type,
-[data-theme='muma-jukebox'] .connection-server {
-  color: #0070a0;
-}
-
-/* ── Orange: volume knob + active/playing states ── */
-/* Knob is var(--text-primary) by default = near-black on silver → fix to orange */
-[data-theme='muma-jukebox'] input[type="range"]::-webkit-slider-thumb {
-  background: #ff6600;
-  box-shadow: inset 1px 1px 0 rgba(255, 180, 80, 0.7), inset -1px -1px 0 rgba(160, 40, 0, 0.4);
-}
-
-[data-theme='muma-jukebox'] input[type="range"]:hover::-webkit-slider-thumb {
-  background: #ff8020;
-}
-
-/* Active queue item: orange left bar instead of blue */
-[data-theme='muma-jukebox'] .queue-item.active {
-  background: rgba(255, 102, 0, 0.1);
-  box-shadow: inset 3px 0 0 #ff6600;
-}
-
-[data-theme='muma-jukebox'] .np-queue-item-active {
-  color: #cc4400;
-  font-weight: 600;
-}
-
-[data-theme='muma-jukebox'] .np-queue-item.active {
-  background: rgba(255, 102, 0, 0.1);
-}
-
-/* Now-playing active track = orange brand color */
-[data-theme='muma-jukebox'] .np-album-track.active .np-album-track-title,
-[data-theme='muma-jukebox'] .np-album-track.active .np-album-track-num {
-  color: #cc4400;
-  font-weight: 600;
-}
-
-/* Active nav link: orange accent text */
-[data-theme='muma-jukebox'] .nav-link.active {
-  color: #cc4400;
-}
-
-/* Settings tab active: orange top border */
-[data-theme='muma-jukebox'] .settings-tab.active {
-  box-shadow: inset 0 2px 0 #ff6600;
-  color: #cc4400;
-}
-
-/* Track row playing indicator (now-playing track-num shown in orange) */
-[data-theme='muma-jukebox'] .track-row.playing .track-num {
-  color: #ff6600;
-}
-
-/* Player bar artist: keep cyan, but LCD progress/waveform in orange */
-[data-theme='muma-jukebox'] .player-bar input[type="range"]::-webkit-slider-thumb {
-  background: #ff6600;
-}
-
-/* Waveform: orange played, cyan buffered, dim unplayed */
-[data-theme='muma-jukebox'] {
-  --waveform-played: #ff6600;
-  --waveform-buffered: #00d0ff;
-  --waveform-unplayed: #3a5080;
-}
-
-/* ── Hero readability on silver background ── */
-[data-theme='muma-jukebox'] .album-detail-badge {
-  background: #0070a0;
-  color: #ffffff;
-}
-
-[data-theme='muma-jukebox'] .album-detail-info {
-  color: #4a4a4a;
-}
-
diff --git a/src/styles/themes/neon-drift.css b/src/styles/themes/neon-drift.css
deleted file mode 100644
index 58a08580..00000000
--- a/src/styles/themes/neon-drift.css
+++ /dev/null
@@ -1,86 +0,0 @@
-/* ─── Neon Drift ─── */
-[data-theme='neon-drift'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2300f2ff%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust: #080916;
-  --ctp-mantle: #0d0e21;
-  --ctp-base: #12132c;
-  --ctp-surface0: #1a1b3b;
-  --ctp-surface1: #242650;
-  --ctp-surface2: #2f3166;
-  --ctp-overlay0: #51548a;
-  --ctp-overlay1: #7277ad;
-  --ctp-overlay2: #9299cf;
-  --ctp-text: #e0e2ff;
-  --ctp-subtext1: #aeb3e0;
-  --ctp-subtext0: #8b91c4;
-  --ctp-mauve: #00f2ff;
-  --ctp-lavender: #7000ff;
-  --ctp-green: #00ffa3;
-  --ctp-teal: #00d4cc;
-  --ctp-sky: #00c8ff;
-  --ctp-blue: #0077ff;
-  --ctp-sapphire: #0055cc;
-  --ctp-pink: #ff00cc;
-  --ctp-flamingo: #ff44aa;
-  --ctp-rosewater: #ffaadd;
-  --ctp-yellow: #ffe600;
-  --ctp-peach: #ff9900;
-  --ctp-maroon: #cc2244;
-  --ctp-red: #ff2d55;
-
-  --bg-app: #12132c;
-  --bg-sidebar: #0d0e21;
-  --bg-card: #1a1b3b;
-  --bg-hover: #242650;
-  --bg-player: #080916;
-  --bg-glass: rgba(13, 14, 33, 0.85);
-  --accent: #00f2ff;
-  --accent-dim: rgba(0, 242, 255, 0.12);
-  --accent-glow: rgba(0, 242, 255, 0.40);
-  --text-primary: #e0e2ff;
-  --text-secondary: #aeb3e0;
-  --text-muted: #7277ad;
-  --border: #2f3166;
-  --border-subtle: #242650;
-  --positive: #00ffa3;
-  --warning: #ffe600;
-  --danger: #ff2d55;
-
-  --radius-md: 8px;
-  --radius-lg: 12px;
-}
-
-[data-theme='neon-drift'] .player-bar {
-  border-top: 1px solid rgba(0, 242, 255, 0.20);
-  box-shadow: 0 -10px 30px -15px rgba(0, 242, 255, 0.15);
-}
-
-[data-theme='neon-drift'] .player-track-name {
-  color: #00f2ff;
-  text-shadow: 0 0 12px rgba(0, 242, 255, 0.30);
-  font-weight: 600;
-}
-
-[data-theme='neon-drift'] .nav-link.active {
-  color: #00f2ff;
-  text-shadow: 0 0 8px rgba(0, 242, 255, 0.50);
-}
-
-[data-theme='neon-drift'] .nav-link.active::before {
-  box-shadow: 0 0 10px #00f2ff;
-}
-
-[data-theme='neon-drift'] .btn-primary {
-  background: linear-gradient(135deg, #00f2ff, #0077ff);
-  border: none;
-  color: #080916 !important;
-  box-shadow: 0 4px 15px rgba(0, 242, 255, 0.30);
-}
-
-[data-theme='neon-drift'] input[type="range"]::-webkit-slider-thumb {
-  background: white;
-  box-shadow: 0 0 10px #00f2ff;
-}
-
diff --git a/src/styles/themes/nightcity-2077-cyberpunk-2077.css b/src/styles/themes/nightcity-2077-cyberpunk-2077.css
deleted file mode 100644
index 7c31825a..00000000
--- a/src/styles/themes/nightcity-2077-cyberpunk-2077.css
+++ /dev/null
@@ -1,299 +0,0 @@
-/* ─── NightCity 2077 — Cyberpunk 2077 ─── */
-/* V yellow + Netrunner cyan + Gang magenta + Johnny Silverhand glitch */
-@keyframes glitch-2077 {
-
-  0%,
-  85%,
-  100% {
-    text-shadow:
-      0 0 8px rgba(252, 238, 10, 0.75),
-      0 0 22px rgba(252, 238, 10, 0.35),
-      0 0 48px rgba(252, 238, 10, 0.12);
-    transform: none;
-  }
-
-  86% {
-    text-shadow:
-      -3px 0 rgba(0, 245, 255, 0.65),
-      3px 0 rgba(255, 45, 155, 0.65),
-      0 0 8px rgba(252, 238, 10, 0.75);
-    transform: translateX(-2px);
-  }
-
-  87% {
-    text-shadow:
-      3px 0 rgba(0, 245, 255, 0.65),
-      -3px 0 rgba(255, 45, 155, 0.65),
-      0 0 8px rgba(252, 238, 10, 0.75);
-    transform: translateX(2px) skewX(-2deg);
-  }
-
-  88% {
-    text-shadow:
-      0 0 8px rgba(252, 238, 10, 0.75),
-      0 0 22px rgba(252, 238, 10, 0.35);
-    transform: none;
-  }
-
-  89% {
-    text-shadow:
-      -1px 0 rgba(0, 245, 255, 0.4),
-      1px 0 rgba(255, 45, 155, 0.4),
-      0 0 10px rgba(252, 238, 10, 0.8);
-    transform: translateX(1px);
-  }
-
-  90% {
-    text-shadow:
-      0 0 8px rgba(252, 238, 10, 0.75),
-      0 0 22px rgba(252, 238, 10, 0.35),
-      0 0 48px rgba(252, 238, 10, 0.12);
-    transform: none;
-  }
-}
-
-[data-theme='nightcity-2077'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23FCEE0A%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* Night City asphalt — dark with cold blue-black undertone */
-  --ctp-crust: #000003;
-  --ctp-mantle: #020208;
-  --ctp-base: #06060f;
-  --ctp-surface0: #0d0d1a;
-  --ctp-surface1: #141428;
-  --ctp-surface2: #1e1e38;
-  --ctp-overlay0: #50508a;
-  --ctp-overlay1: #7878b8;
-  --ctp-overlay2: #a0a0d8;
-  --ctp-text: #f0f0ff;
-  --ctp-subtext1: #d0d0f8;
-  --ctp-subtext0: #a0a0d8;
-
-  /* Cyberpunk palette */
-  --ctp-yellow: #FCEE0A;
-  /* V / Johnny — primary yellow */
-  --ctp-mauve: #FCEE0A;
-  --ctp-lavender: #ffe84d;
-  --ctp-teal: #00f5ff;
-  /* Netrunner cyan */
-  --ctp-sky: #00f5ff;
-  --ctp-sapphire: #00c8e0;
-  --ctp-blue: #0088ff;
-  /* NCPD/corpo blue */
-  --ctp-pink: #ff2d9b;
-  /* Gang magenta — Maelstrom/Valentinos neon */
-  --ctp-flamingo: #ff2d9b;
-  --ctp-rosewater: #ff80c8;
-  --ctp-green: #00ff9f;
-  /* Netrunner green — Quickhack */
-  --ctp-red: #ff1a1a;
-  /* Combat critical / Arasaka red */
-  --ctp-maroon: #cc0000;
-  --ctp-peach: #ff8800;
-  /* Trauma Team orange */
-
-  --bg-app: #06060f;
-  --bg-sidebar: #020208;
-  /* deeper — like the Night City backdrop */
-  --bg-card: #0d0d1a;
-  --bg-hover: rgba(252, 238, 10, 0.07);
-  --bg-player: #000003;
-  --bg-glass: rgba(6, 6, 15, 0.96);
-
-  --accent: #FCEE0A;
-  /* V yellow */
-  --accent-dim: rgba(252, 238, 10, 0.12);
-  --accent-glow: rgba(252, 238, 10, 0.5);
-  --volume-accent: #00f5ff;
-  /* Netrunner cyan for volume */
-
-  --text-primary: #f0f0ff;
-  --text-secondary: #00f5ff;
-  /* Netrunner cyan — the key differentiator */
-  --text-muted: #6868a8;
-  --border: #1e1e38;
-  --border-subtle: #0d0d1a;
-  --shadow-dropdown: rgba(0, 0, 0, 0.95);
-
-  --positive: #00ff9f;
-  --warning: #FCEE0A;
-  --danger: #ff1a1a;
-
-  --radius-sm: 0px;
-  --radius-md: 0px;
-  --radius-lg: 2px;
-  --radius-xl: 2px;
-}
-
-/* Sidebar = tech/netrunner panel: cyan border + scan-line texture */
-[data-theme='nightcity-2077'] .sidebar {
-  border-right: 2px solid #00f5ff;
-  box-shadow: 2px 0 16px rgba(0, 245, 255, 0.1);
-  background-image: repeating-linear-gradient(0deg,
-      transparent,
-      transparent 3px,
-      rgba(0, 245, 255, 0.012) 3px,
-      rgba(0, 245, 255, 0.012) 4px);
-}
-
-/* Player bar = HUD: V yellow top + cyan secondary strip */
-[data-theme='nightcity-2077'] .player-bar {
-  border-top: 2px solid #FCEE0A;
-  box-shadow:
-    0 -1px 0 rgba(0, 245, 255, 0.35),
-    0 -8px 32px rgba(252, 238, 10, 0.08),
-    0 -2px 16px rgba(0, 245, 255, 0.06);
-}
-
-/* Track name = V's yellow + Johnny Silverhand glitch */
-[data-theme='nightcity-2077'] .player-track-name {
-  color: #FCEE0A;
-  text-transform: uppercase;
-  font-weight: 800;
-  letter-spacing: 0.08em;
-  animation: glitch-2077 9s infinite;
-}
-
-/* Artist = Netrunner cyan */
-[data-theme='nightcity-2077'] .player-track-artist {
-  color: #00f5ff;
-}
-
-/* Queue album = gang magenta */
-[data-theme='nightcity-2077'] .queue-meta-album {
-  color: #ff2d9b;
-}
-
-/* Active nav: yellow gradient + chamfered feel */
-[data-theme='nightcity-2077'] .nav-link.active {
-  background: linear-gradient(90deg, rgba(252, 238, 10, 0.15) 0%, transparent 100%);
-  color: #FCEE0A;
-}
-
-[data-theme='nightcity-2077'] .nav-link.active::before {
-  width: 3px;
-  background: #FCEE0A;
-  box-shadow: 2px 0 14px rgba(252, 238, 10, 0.7);
-}
-
-/* Buttons: angular chamfered corner — iconic CP2077 UI shape */
-[data-theme='nightcity-2077'] .btn-primary {
-  background: #FCEE0A;
-  color: #000000;
-  font-weight: 800;
-  text-transform: uppercase;
-  letter-spacing: 0.08em;
-  border: none;
-  border-radius: 0;
-  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px));
-}
-
-[data-theme='nightcity-2077'] .btn-primary:hover {
-  background: #ffe84d;
-  box-shadow: 0 0 20px rgba(252, 238, 10, 0.5);
-}
-
-[data-theme='nightcity-2077'] .btn-surface {
-  border-radius: 0;
-  clip-path: polygon(0 0, calc(100% - 6px) 0, 100% 6px, 100% 100%, 0 100%);
-}
-
-/* Queue active = cyan netrunner bar */
-[data-theme='nightcity-2077'] .queue-item.active {
-  background: rgba(0, 245, 255, 0.07);
-  box-shadow: inset 3px 0 0 #00f5ff;
-}
-
-[data-theme='nightcity-2077'] .np-queue-item.active {
-  background: rgba(0, 245, 255, 0.06);
-}
-
-[data-theme='nightcity-2077'] .np-queue-item-active {
-  color: #FCEE0A;
-  text-shadow: 0 0 8px rgba(252, 238, 10, 0.6);
-}
-
-/* Now-playing active track = magenta gang glow */
-[data-theme='nightcity-2077'] .np-album-track.active .np-album-track-title,
-[data-theme='nightcity-2077'] .np-album-track.active .np-album-track-num {
-  color: #ff2d9b;
-  text-shadow: 0 0 10px rgba(255, 45, 155, 0.55);
-}
-
-/* Hover rows: yellow left bar */
-[data-theme='nightcity-2077'] .track-row:hover,
-[data-theme='nightcity-2077'] .track-row.context-active {
-  background: rgba(252, 238, 10, 0.06) !important;
-  box-shadow: inset 3px 0 0 #FCEE0A;
-}
-
-[data-theme='nightcity-2077'] .queue-item:hover,
-[data-theme='nightcity-2077'] .queue-item.context-active {
-  background: rgba(0, 245, 255, 0.06) !important;
-  box-shadow: inset 3px 0 0 #00f5ff;
-}
-
-[data-theme='nightcity-2077'] .np-queue-item:hover,
-[data-theme='nightcity-2077'] .np-queue-item.context-active {
-  background: rgba(0, 245, 255, 0.06);
-  box-shadow: inset 2px 0 0 #00f5ff;
-}
-
-[data-theme='nightcity-2077'] .artist-row:hover {
-  background: rgba(252, 238, 10, 0.05);
-  box-shadow: inset 3px 0 0 #FCEE0A;
-}
-
-[data-theme='nightcity-2077'] .playlist-row:hover {
-  background: rgba(252, 238, 10, 0.05);
-  box-shadow: inset 3px 0 0 #FCEE0A;
-}
-
-/* Settings tabs: active = magenta Valentinos style */
-[data-theme='nightcity-2077'] .settings-tab:hover {
-  background: rgba(252, 238, 10, 0.06);
-  color: #FCEE0A;
-}
-
-[data-theme='nightcity-2077'] .settings-tab.active {
-  background: rgba(255, 45, 155, 0.08);
-  color: #ff2d9b;
-  box-shadow: inset 3px 0 0 #ff2d9b;
-}
-
-/* Queue tabs */
-[data-theme='nightcity-2077'] .queue-tab-btn:hover {
-  background: rgba(0, 245, 255, 0.07);
-  color: #00f5ff;
-}
-
-/* Dropdowns */
-[data-theme='nightcity-2077'] .custom-select-trigger:hover {
-  background: rgba(252, 238, 10, 0.07);
-}
-
-[data-theme='nightcity-2077'] .custom-select-option:hover {
-  background: rgba(252, 238, 10, 0.1) !important;
-  color: #FCEE0A !important;
-}
-
-/* Artist pills = Trauma Team orange */
-[data-theme='nightcity-2077'] .artist-ext-link:hover {
-  background: rgba(255, 136, 0, 0.1);
-  color: #ff8800 !important;
-  border-color: rgba(255, 136, 0, 0.4) !important;
-}
-
-/* Cards: dark glass with cyan edge-glow */
-[data-theme='nightcity-2077'] .glass {
-  border: 1px solid rgba(0, 245, 255, 0.12) !important;
-  box-shadow: 0 0 0 1px rgba(252, 238, 10, 0.04), inset 0 0 20px rgba(0, 245, 255, 0.02) !important;
-}
-
-/* Connection indicators */
-[data-theme='nightcity-2077'] .connection-type,
-[data-theme='nightcity-2077'] .connection-server {
-  color: #00f5ff;
-}
-
diff --git a/src/styles/themes/nightfox.css b/src/styles/themes/nightfox.css
deleted file mode 100644
index 1a5654ee..00000000
--- a/src/styles/themes/nightfox.css
+++ /dev/null
@@ -1,53 +0,0 @@
-/* ─── Nightfox ─── */
-[data-theme='nightfox'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23cdcecf%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust: #131a24;
-  --ctp-mantle: #131a24;
-  --ctp-base: #192330;
-  --ctp-surface0: #212e3f;
-  --ctp-surface1: #29394f;
-  --ctp-surface2: #39506d;
-  --ctp-overlay0: #71839b;
-  --ctp-overlay1: #71839b;
-  --ctp-overlay2: #aeafb0;
-  --ctp-text: #cdcecf;
-  --ctp-subtext1: #aeafb0;
-  --ctp-subtext0: #71839b;
-  --ctp-mauve: #9d79d6;
-  --ctp-lavender: #719cd6;
-  --ctp-pink: #d67ad2;
-  --ctp-flamingo: #d67ad2;
-  --ctp-rosewater: #d67ad2;
-  --ctp-blue: #719cd6;
-  --ctp-sapphire: #9d79d6;
-  --ctp-sky: #63cdcf;
-  --ctp-teal: #63cdcf;
-  --ctp-green: #81b29a;
-  --ctp-yellow: #dbc074;
-  --ctp-peach: #f4a261;
-  --ctp-maroon: #c94f6d;
-  --ctp-red: #c94f6d;
-
-  --bg-app: #192330;
-  --bg-sidebar: #131a24;
-  --bg-card: #212e3f;
-  --bg-hover: #29394f;
-  --bg-player: #131a24;
-  --bg-glass: rgba(25, 35, 48, 0.75);
-  --accent: #719cd6;
-  --accent-dim: rgba(113, 156, 214, 0.15);
-  --accent-glow: rgba(113, 156, 214, 0.3);
-  --text-primary: #cdcecf;
-  --text-secondary: #aeafb0;
-  --text-muted: #738091;
-  --border: #29394f;
-  --border-subtle: #212e3f;
-  --border-dropdown: #39506d;
-  --shadow-dropdown: rgba(0, 0, 0, 0.6);
-  --positive: #81b29a;
-  --warning: #dbc074;
-  --danger: #c94f6d;
-}
-
diff --git a/src/styles/themes/nord-aurora-dark-aurora-purple.css b/src/styles/themes/nord-aurora-dark-aurora-purple.css
deleted file mode 100644
index 27a1d5ad..00000000
--- a/src/styles/themes/nord-aurora-dark-aurora-purple.css
+++ /dev/null
@@ -1,55 +0,0 @@
-/* ─── Nord – Aurora (Dark + Aurora Purple) ─── */
-[data-theme='nord-aurora'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23e5e9f0%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-  /* Polar Night base */
-  --ctp-crust: #2e3440;
-  --ctp-mantle: #2e3440;
-  --ctp-base: #3b4252;
-  --ctp-surface0: #434c5e;
-  --ctp-surface1: #4c566a;
-  --ctp-surface2: #576070;
-  --ctp-overlay0: #7a8898;
-  --ctp-overlay1: #8894a4;
-  --ctp-overlay2: #96a2b0;
-  /* Snow Storm as text */
-  --ctp-text: #eceff4;
-  --ctp-subtext1: #e5e9f0;
-  --ctp-subtext0: #d8dee9;
-  /* Aurora accents — purple as mauve/lavender for button gradients */
-  --ctp-mauve: #b48ead;
-  --ctp-lavender: #a3be8c;
-  --ctp-pink: #b48ead;
-  --ctp-teal: #8fbcbb;
-  --ctp-sky: #88c0d0;
-  --ctp-sapphire: #81a1c1;
-  --ctp-blue: #5e81ac;
-  --ctp-red: #bf616a;
-  --ctp-maroon: #d08770;
-  --ctp-peach: #d08770;
-  --ctp-yellow: #ebcb8b;
-  --ctp-green: #a3be8c;
-  --ctp-flamingo: #bf616a;
-  --ctp-rosewater: #d08770;
-
-  --bg-app: #3b4252;
-  --bg-sidebar: #2e3440;
-  --bg-card: #434c5e;
-  --bg-hover: #4c566a;
-  --bg-player: #2e3440;
-  --bg-glass: rgba(59, 66, 82, 0.75);
-  --accent: #b48ead;
-  --accent-dim: rgba(180, 142, 173, 0.15);
-  --accent-glow: rgba(180, 142, 173, 0.3);
-  --text-primary: #eceff4;
-  --text-secondary: #e5e9f0;
-  --text-muted: #a0aab8;
-  --border: #434c5e;
-  --border-subtle: #3b4252;
-  --border-dropdown: #576070;
-  --shadow-dropdown: rgba(0, 0, 0, 0.55);
-  --positive: #a3be8c;
-  --warning: #ebcb8b;
-  --danger: #bf616a;
-}
-
diff --git a/src/styles/themes/nord-frost-deep-ocean-blue.css b/src/styles/themes/nord-frost-deep-ocean-blue.css
deleted file mode 100644
index a6e5a3e0..00000000
--- a/src/styles/themes/nord-frost-deep-ocean-blue.css
+++ /dev/null
@@ -1,56 +0,0 @@
-/* ─── Nord – Frost (Deep Ocean Blue) ─── */
-[data-theme='nord-frost'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23e5e9f0%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-  /* Deep ocean blue – Frost-inspired dark backgrounds */
-  --ctp-crust: #1a2535;
-  --ctp-mantle: #1d2b3a;
-  --ctp-base: #253545;
-  --ctp-surface0: #2d3f52;
-  --ctp-surface1: #354a60;
-  --ctp-surface2: #3d546e;
-  --ctp-overlay0: #6888a4;
-  --ctp-overlay1: #7898b4;
-  --ctp-overlay2: #88a8c4;
-  /* Snow Storm as text */
-  --ctp-text: #eceff4;
-  --ctp-subtext1: #e5e9f0;
-  --ctp-subtext0: #d8dee9;
-  /* Frost accent */
-  --ctp-teal: #8fbcbb;
-  --ctp-sky: #88c0d0;
-  --ctp-sapphire: #81a1c1;
-  --ctp-blue: #5e81ac;
-  --ctp-lavender: #8fbcbb;
-  --ctp-mauve: #88c0d0;
-  /* Aurora */
-  --ctp-red: #bf616a;
-  --ctp-maroon: #d08770;
-  --ctp-peach: #d08770;
-  --ctp-yellow: #ebcb8b;
-  --ctp-green: #a3be8c;
-  --ctp-pink: #b48ead;
-  --ctp-flamingo: #bf616a;
-  --ctp-rosewater: #d08770;
-
-  --bg-app: #253545;
-  --bg-sidebar: #1d2b3a;
-  --bg-card: #2d3f52;
-  --bg-hover: #354a60;
-  --bg-player: #1a2535;
-  --bg-glass: rgba(37, 53, 69, 0.75);
-  --accent: #88c0d0;
-  --accent-dim: rgba(136, 192, 208, 0.15);
-  --accent-glow: rgba(136, 192, 208, 0.35);
-  --text-primary: #eceff4;
-  --text-secondary: #e5e9f0;
-  --text-muted: #7898b4;
-  --border: #2d3f52;
-  --border-subtle: #253545;
-  --border-dropdown: #3d546e;
-  --shadow-dropdown: rgba(0, 0, 0, 0.6);
-  --positive: #a3be8c;
-  --warning: #ebcb8b;
-  --danger: #bf616a;
-}
-
diff --git a/src/styles/themes/nord-polar-night-dark.css b/src/styles/themes/nord-polar-night-dark.css
deleted file mode 100644
index d561697b..00000000
--- a/src/styles/themes/nord-polar-night-dark.css
+++ /dev/null
@@ -1,56 +0,0 @@
-/* ─── Nord – Polar Night (Dark) ─── */
-[data-theme='nord'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23e5e9f0%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-  /* Polar Night */
-  --ctp-crust: #2e3440;
-  --ctp-mantle: #2e3440;
-  --ctp-base: #3b4252;
-  --ctp-surface0: #434c5e;
-  --ctp-surface1: #4c566a;
-  --ctp-surface2: #576070;
-  --ctp-overlay0: #7a8898;
-  --ctp-overlay1: #8894a4;
-  --ctp-overlay2: #96a2b0;
-  /* Snow Storm as text */
-  --ctp-text: #eceff4;
-  --ctp-subtext1: #e5e9f0;
-  --ctp-subtext0: #d8dee9;
-  /* Frost */
-  --ctp-teal: #8fbcbb;
-  --ctp-sky: #88c0d0;
-  --ctp-sapphire: #81a1c1;
-  --ctp-blue: #5e81ac;
-  --ctp-lavender: #81a1c1;
-  --ctp-mauve: #88c0d0;
-  /* Aurora */
-  --ctp-red: #bf616a;
-  --ctp-maroon: #d08770;
-  --ctp-peach: #d08770;
-  --ctp-yellow: #ebcb8b;
-  --ctp-green: #a3be8c;
-  --ctp-pink: #b48ead;
-  --ctp-flamingo: #bf616a;
-  --ctp-rosewater: #d08770;
-
-  --bg-app: #3b4252;
-  --bg-sidebar: #2e3440;
-  --bg-card: #434c5e;
-  --bg-hover: #4c566a;
-  --bg-player: #2e3440;
-  --bg-glass: rgba(59, 66, 82, 0.75);
-  --accent: #88c0d0;
-  --accent-dim: rgba(136, 192, 208, 0.15);
-  --accent-glow: rgba(136, 192, 208, 0.3);
-  --text-primary: #eceff4;
-  --text-secondary: #e5e9f0;
-  --text-muted: #a0aab8;
-  --border: #434c5e;
-  --border-subtle: #3b4252;
-  --border-dropdown: #576070;
-  --shadow-dropdown: rgba(0, 0, 0, 0.55);
-  --positive: #a3be8c;
-  --warning: #ebcb8b;
-  --danger: #bf616a;
-}
-
diff --git a/src/styles/themes/nord-snow-storm-light.css b/src/styles/themes/nord-snow-storm-light.css
deleted file mode 100644
index 00a1eff8..00000000
--- a/src/styles/themes/nord-snow-storm-light.css
+++ /dev/null
@@ -1,54 +0,0 @@
-/* ─── Nord – Snow Storm (Light) ─── */
-[data-theme='nord-snowstorm'] {
-  color-scheme: light;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%233b4252%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-  /* Snow Storm as backgrounds */
-  --ctp-crust: #d8dee9;
-  --ctp-mantle: #e5e9f0;
-  --ctp-base: #eceff4;
-  --ctp-surface0: #d8dee9;
-  --ctp-surface1: #c8d0de;
-  --ctp-surface2: #b8c2d0;
-  --ctp-overlay0: #7a8898;
-  --ctp-overlay1: #636e7e;
-  --ctp-overlay2: #4c566a;
-  /* Polar Night as text */
-  --ctp-text: #2e3440;
-  --ctp-subtext1: #3b4252;
-  --ctp-subtext0: #434c5e;
-  /* Frost */
-  --ctp-teal: #8fbcbb;
-  --ctp-sky: #88c0d0;
-  --ctp-sapphire: #81a1c1;
-  --ctp-blue: #5e81ac;
-  --ctp-lavender: #81a1c1;
-  --ctp-mauve: #5e81ac;
-  /* Aurora */
-  --ctp-red: #bf616a;
-  --ctp-maroon: #d08770;
-  --ctp-peach: #d08770;
-  --ctp-yellow: #9a7200;
-  --ctp-green: #4e7c3f;
-  --ctp-pink: #7e5d8c;
-  --ctp-flamingo: #bf616a;
-  --ctp-rosewater: #d08770;
-
-  --bg-app: #eceff4;
-  --bg-sidebar: #e5e9f0;
-  --bg-card: #d8dee9;
-  --bg-hover: #c8d0de;
-  --bg-player: #e5e9f0;
-  --bg-glass: rgba(236, 239, 244, 0.80);
-  --accent: #5e81ac;
-  --accent-dim: rgba(94, 129, 172, 0.15);
-  --accent-glow: rgba(94, 129, 172, 0.3);
-  --text-primary: #2e3440;
-  --text-secondary: #3b4252;
-  --text-muted: #636e7e;
-  --border: #c8d0de;
-  --border-subtle: #d8dee9;
-  --positive: #4e7c3f;
-  --warning: #9a7200;
-  --danger: #bf616a;
-}
-
diff --git a/src/styles/themes/nordfox.css b/src/styles/themes/nordfox.css
deleted file mode 100644
index d1d1499d..00000000
--- a/src/styles/themes/nordfox.css
+++ /dev/null
@@ -1,53 +0,0 @@
-/* ─── Nordfox ─── */
-[data-theme='nordfox'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23cdcecf%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust: #232831;
-  --ctp-mantle: #232831;
-  --ctp-base: #2e3440;
-  --ctp-surface0: #39404f;
-  --ctp-surface1: #444c5e;
-  --ctp-surface2: #5a657d;
-  --ctp-overlay0: #60728a;
-  --ctp-overlay1: #7e8188;
-  --ctp-overlay2: #abb1bb;
-  --ctp-text: #cdcecf;
-  --ctp-subtext1: #c7cdd9;
-  --ctp-subtext0: #abb1bb;
-  --ctp-mauve: #b48ead;
-  --ctp-lavender: #81a1c1;
-  --ctp-pink: #bf88bc;
-  --ctp-flamingo: #bf616a;
-  --ctp-rosewater: #c9826b;
-  --ctp-blue: #81a1c1;
-  --ctp-sapphire: #81a1c1;
-  --ctp-sky: #88c0d0;
-  --ctp-teal: #88c0d0;
-  --ctp-green: #a3be8c;
-  --ctp-yellow: #ebcb8b;
-  --ctp-peach: #c9826b;
-  --ctp-maroon: #bf616a;
-  --ctp-red: #bf616a;
-
-  --bg-app: #2e3440;
-  --bg-sidebar: #232831;
-  --bg-card: #39404f;
-  --bg-hover: #444c5e;
-  --bg-player: #232831;
-  --bg-glass: rgba(46, 52, 64, 0.75);
-  --accent: #81a1c1;
-  --accent-dim: rgba(129, 161, 193, 0.15);
-  --accent-glow: rgba(129, 161, 193, 0.3);
-  --text-primary: #cdcecf;
-  --text-secondary: #abb1bb;
-  --text-muted: #60728a;
-  --border: #444c5e;
-  --border-subtle: #39404f;
-  --border-dropdown: #5a657d;
-  --shadow-dropdown: rgba(0, 0, 0, 0.6);
-  --positive: #a3be8c;
-  --warning: #ebcb8b;
-  --danger: #bf616a;
-}
-
diff --git a/src/styles/themes/north-park-south-park.css b/src/styles/themes/north-park-south-park.css
deleted file mode 100644
index c8d13700..00000000
--- a/src/styles/themes/north-park-south-park.css
+++ /dev/null
@@ -1,337 +0,0 @@
-/* ─── North Park — South Park ─── */
-/* Construction paper flat aesthetic — paper-cream main, Colorado mountain-blue sidebar,
-   Kenny orange accent, South Park sky blue player accents. Light, no dark mode. */
-[data-theme='north-park'] {
-  color-scheme: light;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23FF8C00%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* ── Palette — Kenny orange, South Park sky, Colorado Rockies ── */
-  --ctp-crust: #0D2040;
-  --ctp-mantle: #142D50;
-  --ctp-base: #F5F1E8;
-  /* construction paper cream */
-  --ctp-surface0: #EDE9DE;
-  --ctp-surface1: #E5E0D2;
-  --ctp-surface2: #D8D2C0;
-  --ctp-overlay0: #8090A8;
-  --ctp-overlay1: #5A6A80;
-  --ctp-overlay2: #4A526A;
-  --ctp-text: #1A1A2E;
-  --ctp-subtext1: #3A3A5A;
-  --ctp-subtext0: #4A526A;
-  --ctp-mauve: #FF8C00;
-  /* Kenny orange */
-  --ctp-lavender: #FFB030;
-  --ctp-pink: #FF6A00;
-  --ctp-flamingo: #FF5500;
-  --ctp-rosewater: #FFD080;
-  --ctp-green: #3D9A2A;
-  /* Kyle's green hat */
-  --ctp-teal: #2080A0;
-  --ctp-sky: #87CEEB;
-  /* South Park sky */
-  --ctp-blue: #1E4080;
-  --ctp-sapphire: #1B3D6E;
-  --ctp-yellow: #FFD700;
-  --ctp-peach: #FF8C00;
-  --ctp-maroon: #CC4400;
-  --ctp-red: #CC2200;
-  /* Cartman red */
-
-  --bg-app: #F5F1E8;
-  /* construction paper cream */
-  --bg-sidebar: #1B3D6E;
-  /* Colorado Rockies night blue */
-  --bg-card: #FFFFFF;
-  --bg-hover: #EDE9DE;
-  --bg-player: #102A50;
-  /* deeper mountain blue */
-  --bg-glass: rgba(245, 241, 232, 0.94);
-  --accent: #FF8C00;
-  /* Kenny orange */
-  --accent-dim: rgba(255, 140, 0, 0.13);
-  --accent-glow: rgba(255, 140, 0, 0.30);
-  --text-primary: #1A1A2E;
-  --text-secondary: #4A526A;
-  --text-muted: #8090A8;
-  --border: rgba(27, 61, 110, 0.14);
-  --border-subtle: rgba(27, 61, 110, 0.08);
-  --border-dropdown: rgba(255, 140, 0, 0.28);
-  --shadow-dropdown: rgba(0, 20, 60, 0.18);
-  --positive: #3D9A2A;
-  --warning: #E8A000;
-  --danger: #CC2200;
-  --radius-sm: 3px;
-  --radius-md: 6px;
-  --radius-lg: 10px;
-
-  /* Logo: Kenny orange → South Park yellow */
-  --logo-color-start: #FF8C00;
-  --logo-color-end: #FFD700;
-}
-
-/* Sidebar — Colorado mountain blue, orange nav accents */
-[data-theme='north-park'] .sidebar {
-  background: #1B3D6E;
-  border-right: none;
-}
-
-/* Nav links: default text light on dark sidebar */
-[data-theme='north-park'] .nav-link {
-  color: rgba(255, 255, 255, 0.72);
-}
-
-[data-theme='north-park'] .nav-link.active {
-  background: rgba(255, 140, 0, 0.18);
-  border-left: 3px solid #FF8C00;
-  color: #FF8C00;
-}
-
-[data-theme='north-park'] .nav-link:hover:not(.active) {
-  background: rgba(255, 255, 255, 0.09);
-  border-left: 3px solid rgba(255, 140, 0, 0.45);
-  color: rgba(255, 255, 255, 0.95);
-}
-
-/* Player bar — deep mountain blue, Kenny orange top stripe */
-[data-theme='north-park'] .player-bar {
-  background: #102A50;
-  border-top: 3px solid #FF8C00;
-  box-shadow: 0 -2px 20px rgba(0, 20, 60, 0.30);
-}
-
-/* Track name — Kenny orange */
-[data-theme='north-park'] .player-track-name {
-  color: #FF8C00;
-}
-
-/* Artist name — South Park sky blue */
-[data-theme='north-park'] .player-artist-name {
-  color: #87CEEB;
-}
-
-/* Content header — warm paper border */
-[data-theme='north-park'] .content-header {
-  border-bottom: 1px solid rgba(27, 61, 110, 0.12);
-}
-
-/* Cards — clean white cutouts with paper shadow */
-[data-theme='north-park'] .album-card,
-[data-theme='north-park'] .artist-card {
-  background: #FFFFFF;
-  box-shadow: 0 1px 4px rgba(0, 20, 60, 0.08);
-}
-
-[data-theme='north-park'] .album-card:hover,
-[data-theme='north-park'] .artist-card:hover {
-  box-shadow: 0 0 0 2px #FF8C00, 0 4px 16px rgba(0, 20, 60, 0.12);
-}
-
-/* Track rows (light main area) */
-[data-theme='north-park'] .track-row:hover {
-  background: #EDE9DE;
-  box-shadow: inset 2px 0 0 #FF8C00;
-}
-
-/* Queue items (dark blue sidebar — keep bg dark, text stays white) */
-[data-theme='north-park'] .queue-item:hover {
-  background: rgba(255, 255, 255, 0.09);
-  box-shadow: inset 2px 0 0 #FF8C00;
-}
-
-/* Flat primary button — orange, no gradient */
-[data-theme='north-park'] .player-btn-primary {
-  background: #FF8C00;
-  color: #FFFFFF;
-  box-shadow: none;
-  border: none;
-}
-
-[data-theme='north-park'] .player-btn-primary:hover {
-  background: #E07800;
-  box-shadow: 0 0 14px rgba(255, 140, 0, 0.40);
-}
-
-[data-theme='north-park'] .btn-primary {
-  background: #FF8C00;
-  color: #FFFFFF;
-  border: none;
-}
-
-[data-theme='north-park'] .btn-primary:hover {
-  background: #E07800;
-}
-
-[data-theme='north-park'] .hero-play-btn {
-  background: #FF8C00;
-  color: #FFFFFF;
-  border: none;
-  box-shadow: 0 2px 14px rgba(255, 140, 0, 0.35);
-}
-
-[data-theme='north-park'] .hero-play-btn:hover {
-  background: #E07800;
-  box-shadow: 0 4px 22px rgba(255, 140, 0, 0.55);
-  transform: scale(1.02);
-}
-
-[data-theme='north-park'] .album-card-details-btn {
-  background: #FF8C00;
-  color: #FFFFFF;
-  border: none;
-  box-shadow: 0 2px 10px rgba(255, 140, 0, 0.30);
-}
-
-/* Badge — orange pill */
-[data-theme='north-park'] .badge,
-[data-theme='north-park'] .album-detail-badge {
-  background: #FF8C00;
-  color: #FFFFFF;
-}
-
-/* Settings tabs */
-[data-theme='north-park'] .settings-tab:hover {
-  background: rgba(255, 140, 0, 0.08);
-  color: #FF8C00;
-}
-
-[data-theme='north-park'] .settings-tab.active {
-  background: rgba(255, 140, 0, 0.13);
-  color: #FF8C00;
-  border-color: #FF8C00;
-}
-
-[data-theme='north-park'] .queue-tab-btn:hover {
-  background: rgba(255, 255, 255, 0.10);
-  color: rgba(255, 255, 255, 0.90);
-}
-
-/* Misc interactive */
-[data-theme='north-park'] .custom-select-trigger:hover {
-  background: #EDE9DE;
-}
-
-[data-theme='north-park'] .custom-select-option:hover {
-  background: rgba(255, 140, 0, 0.10);
-}
-
-[data-theme='north-park'] .artist-row:hover {
-  background: rgba(255, 140, 0, 0.07);
-  box-shadow: inset 3px 0 0 #FF8C00;
-}
-
-[data-theme='north-park'] .playlist-row:hover {
-  background: rgba(255, 140, 0, 0.07);
-  box-shadow: inset 3px 0 0 #FF8C00;
-}
-
-/* Connection indicators — muted on light bg */
-[data-theme='north-park'] .connection-type,
-[data-theme='north-park'] .connection-server {
-  color: #7A8A9A;
-}
-
-/* Queue panel — dark sidebar, light text overrides */
-[data-theme='north-park'] .queue-panel {
-  background: #1B3D6E;
-}
-
-[data-theme='north-park'] .queue-item-title {
-  color: rgba(255, 255, 255, 0.90);
-}
-
-[data-theme='north-park'] .queue-item-artist,
-[data-theme='north-park'] .queue-item-duration {
-  color: rgba(255, 255, 255, 0.52);
-}
-
-[data-theme='north-park'] .queue-item.active .queue-item-artist,
-[data-theme='north-park'] .queue-item.active .queue-item-duration {
-  color: rgba(255, 255, 255, 0.72);
-}
-
-[data-theme='north-park'] .queue-divider span {
-  color: rgba(255, 255, 255, 0.38) !important;
-}
-
-[data-theme='north-park'] .queue-current-info h3 {
-  color: rgba(255, 255, 255, 0.92);
-}
-
-[data-theme='north-park'] .queue-current-sub {
-  color: rgba(255, 255, 255, 0.55);
-}
-
-[data-theme='north-park'] .queue-current-cover .fallback {
-  color: rgba(255, 255, 255, 0.32);
-}
-
-[data-theme='north-park'] .queue-tab-btn {
-  color: rgba(255, 255, 255, 0.58);
-}
-
-[data-theme='north-park'] .queue-tab-btn.active {
-  color: #FF8C00;
-}
-
-[data-theme='north-park'] .queue-round-btn.active {
-  color: #FFFFFF;
-}
-
-[data-theme='north-park'] .queue-action-btn {
-  color: rgba(255, 255, 255, 0.60);
-}
-
-[data-theme='north-park'] .queue-action-btn:hover:not(:disabled) {
-  color: rgba(255, 255, 255, 0.92);
-}
-
-/* Back button + hero text — needs high contrast on dark overlay at top of album header */
-[data-theme='north-park'] .album-detail-back {
-  color: rgba(255, 255, 255, 0.85);
-}
-
-[data-theme='north-park'] .album-detail-back:hover {
-  background: rgba(255, 255, 255, 0.12);
-  color: #ffffff;
-}
-
-[data-theme='north-park'] .album-detail-info {
-  color: rgba(255, 255, 255, 0.80);
-}
-
-/* Artist name in hero — soften the orange to a warm amber, less glaring */
-[data-theme='north-park'] .album-detail-artist,
-[data-theme='north-park'] .album-detail-artist-link {
-  color: #FFAB40;
-}
-
-[data-theme='north-park'] .album-detail-artist-link:hover {
-  color: #FFD080;
-}
-
-/* np-album-track (Now Playing page) */
-[data-theme='north-park'] .np-album-track.active .np-album-track-title,
-[data-theme='north-park'] .np-album-track.active .np-album-track-num {
-  color: #FF8C00;
-}
-
-/* Scrollbar — thin, orange thumb */
-[data-theme='north-park'] ::-webkit-scrollbar {
-  width: 5px;
-  height: 5px;
-}
-
-[data-theme='north-park'] ::-webkit-scrollbar-track {
-  background: #EDE9DE;
-}
-
-[data-theme='north-park'] ::-webkit-scrollbar-thumb {
-  background: rgba(255, 140, 0, 0.35);
-  border-radius: 3px;
-}
-
-[data-theme='north-park'] ::-webkit-scrollbar-thumb:hover {
-  background: #FF8C00;
-}
-
diff --git a/src/styles/themes/nucleo-classic-hifi-winamp-brass.css b/src/styles/themes/nucleo-classic-hifi-winamp-brass.css
deleted file mode 100644
index 0d889d12..00000000
--- a/src/styles/themes/nucleo-classic-hifi-winamp-brass.css
+++ /dev/null
@@ -1,111 +0,0 @@
-/* ─── Nucleo — Classic HiFi / Winamp Brass ─── */
-[data-theme='nucleo'] {
-  color-scheme: light;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%238c7356%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* ── Palette ── */
-  --ctp-crust: #c8a458;
-  --ctp-mantle: #dfc08f;
-  --ctp-base: #e9d3ac;
-  --ctp-surface0: #eedbb8;
-  --ctp-surface1: #f5e4c3;
-  --ctp-surface2: #f9ecd4;
-  --ctp-overlay0: #b09060;
-  --ctp-overlay1: #987848;
-  --ctp-overlay2: #805c30;
-  --ctp-text: #2c1e10;
-  --ctp-subtext1: #5a3e20;
-  --ctp-subtext0: #8c7356;
-  /* Accents — burnished brass + warm tones */
-  --ctp-mauve: #7a5218;
-  /* dark burnished brass — primary accent */
-  --ctp-lavender: #9a6a28;
-  /* mid brass — hover/lighter variant */
-  --ctp-pink: #c06880;
-  --ctp-flamingo: #c06050;
-  --ctp-rosewater: #d08070;
-  --ctp-blue: #5878a8;
-  /* muted steel blue */
-  --ctp-sapphire: #4868a0;
-  --ctp-sky: #6898b8;
-  --ctp-teal: #487878;
-  --ctp-green: #587838;
-  /* muted olive */
-  --ctp-yellow: #a88020;
-  /* dark burnished gold */
-  --ctp-peach: #b87040;
-  --ctp-maroon: #903030;
-  --ctp-red: #a03828;
-
-  /* ── Semantic tokens ── */
-  --bg-app: #f5e4c3;
-  --bg-sidebar: #e9d3ac;
-  --bg-card: #eedbb8;
-  --bg-hover: #e3cc9e;
-  --bg-player: #dfc08f;
-  --bg-glass: rgba(245, 228, 195, 0.90);
-  --accent: #7a5218;
-  --accent-dim: rgba(122, 82, 24, 0.15);
-  --accent-glow: rgba(122, 82, 24, 0.30);
-  --text-primary: #2c1e10;
-  --text-secondary: #5a3e20;
-  --text-muted: #6b5636;
-  --border: #765a38;
-  --border-subtle: #dfc08f;
-  --positive: #3e5820;
-  --warning: #7a5b0e;
-  --danger: #a03828;
-}
-
-/* ── Nucleo: skeuomorphic detail layer ── */
-[data-theme='nucleo'] .sidebar {
-  background-image: repeating-linear-gradient(90deg,
-      rgba(255, 255, 255, 0.06) 0px,
-      rgba(255, 255, 255, 0.06) 1px,
-      transparent 1px,
-      transparent 5px);
-}
-
-[data-theme='nucleo'] .player-bar {
-  background-image: repeating-linear-gradient(90deg,
-      rgba(255, 255, 255, 0.05) 0px,
-      rgba(255, 255, 255, 0.05) 1px,
-      transparent 1px,
-      transparent 5px);
-}
-
-[data-theme='nucleo'] .player-track-name {
-  text-shadow: 0 0 10px rgba(255, 244, 219, 0.75), 0 0 2px rgba(255, 244, 219, 0.4);
-}
-
-[data-theme='nucleo'] .btn {
-  box-shadow: 0 2px 4px rgba(44, 30, 16, 0.20), inset 0 1px 0 rgba(255, 255, 255, 0.35);
-}
-
-[data-theme='nucleo'] .btn-surface {
-  background: #c8a860;
-  color: #2c1e10;
-}
-
-[data-theme='nucleo'] .btn-surface:hover {
-  background: #b89448;
-}
-
-[data-theme='nucleo'] .btn-ghost:hover {
-  background: #c8a860;
-  color: #2c1e10;
-}
-
-[data-theme='nucleo'] .player-btn,
-[data-theme='nucleo'] .player-btn-primary {
-  box-shadow: 0 2px 5px rgba(44, 30, 16, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.4);
-}
-
-/* Column resize grip — default --ctp-surface1 (#f5e4c3) on bg-card (#eedbb8)
-   is 1.08:1 (invisible on this warm cream palette). Use --border (#765a38,
-   4.70:1) to get a perceptible bronze grip that matches the brass accents. */
-[data-theme='nucleo'] .col-resize-handle::after {
-  background: var(--border);
-  width: 2px;
-}
-
diff --git a/src/styles/themes/obsidian-black.css b/src/styles/themes/obsidian-black.css
deleted file mode 100644
index 0e285570..00000000
--- a/src/styles/themes/obsidian-black.css
+++ /dev/null
@@ -1,72 +0,0 @@
-/* ─── Obsidian Black ─── */
-[data-theme='obsidian-black'] {
-  color-scheme: dark;
-
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23dfddd8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
-
-  /* Backgrounds */
-  --ctp-crust:    #000000;
-  --ctp-mantle:   #040404;
-  --ctp-base:     #090908;
-  --ctp-surface0: #11110f;
-  --ctp-surface1: #171714;
-  --ctp-surface2: #20201c;
-
-  /* Overlays */
-  --ctp-overlay0: #30302b;
-  --ctp-overlay1: #474740;
-  --ctp-overlay2: #5e5e54;
-
-  /* Text */
-  --ctp-text:     #f5f3ee;
-  --ctp-subtext1: #d2cec4;
-  --ctp-subtext0: #9f998d;
-
-  /* Obsidian Accent */
-  --ctp-teal:      #d8d6d2;
-  --ctp-sky:       #c6c3bc;
-  --ctp-sapphire:  #a6a297;
-  --ctp-blue:      #7f7a70;
-  --ctp-lavender:  #ebe7de;
-  --ctp-mauve:     #a6a297;
-  --ctp-pink:      #7f7a70;
-  --ctp-flamingo:  #ebe7de;
-  --ctp-rosewater: #b8b3a8;
-
-  /* Semantic */
-  --ctp-red:     #ff5f57;
-  --ctp-maroon:  #ff9f43;
-  --ctp-peach:   #ff9f43;
-  --ctp-yellow:  #ffd166;
-  --ctp-green:   #57d98c;
-
-  /* UI */
-  --bg-app:      #070706;
-  --bg-sidebar:  #0a0a09;
-  --bg-card:     #11110f;
-  --bg-hover:    #191916;
-  --bg-player:   #090908;
-  --bg-glass:    rgba(10,10,9,0.80);
-
-  /* Accent */
-  --accent:      #dfddd8;
-  --accent-dim:  rgba(223,221,216,0.05);
-  --accent-glow: rgba(223,221,216,0.10);
-
-  /* Text UI */
-  --text-primary:   #f5f3ee;
-  --text-secondary: #b6b0a5;
-  --text-muted:     #767066;
-
-  /* Borders */
-  --border:          #272722;
-  --border-subtle:   #1a1a16;
-  --border-dropdown: #32322c;
-  --shadow-dropdown: rgba(0,0,0,0.92);
-
-  /* Status */
-  --positive: #57d98c;
-  --warning:  #ffd166;
-  --danger:   #ff5f57;
-}
-
diff --git a/src/styles/themes/obsidian-gold.css b/src/styles/themes/obsidian-gold.css
deleted file mode 100644
index c524cd5a..00000000
--- a/src/styles/themes/obsidian-gold.css
+++ /dev/null
@@ -1,72 +0,0 @@
-/* ─── Obsidian Gold ─── */
-[data-theme='obsidian-gold'] {
-  color-scheme: dark;
-
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23c9a227' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
-
-  /* Backgrounds */
-  --ctp-crust:    #050505;
-  --ctp-mantle:   #0a0907;
-  --ctp-base:     #0f0d09;
-  --ctp-surface0: #15120d;
-  --ctp-surface1: #1d1811;
-  --ctp-surface2: #262016;
-
-  /* Overlays */
-  --ctp-overlay0: #4f4218;
-  --ctp-overlay1: #635223;
-  --ctp-overlay2: #6f5a1c;
-
-  /* Text */
-  --ctp-text:     #f8f4e8;
-  --ctp-subtext1: #dbc98d;
-  --ctp-subtext0: #b89f56;
-
-  /* Gold Accent */
-  --ctp-teal:      #c9a227;
-  --ctp-sky:       #d4af37;
-  --ctp-sapphire:  #b8922d;
-  --ctp-blue:      #8f6e22;
-  --ctp-lavender:  #e0b84f;
-  --ctp-mauve:     #b8922d;
-  --ctp-pink:      #8f6e22;
-  --ctp-flamingo:  #e0b84f;
-  --ctp-rosewater: #b8922d;
-
-  /* Semantic */
-  --ctp-red:     #ff5c5c;
-  --ctp-maroon:  #ff9b57;
-  --ctp-peach:   #ff9b57;
-  --ctp-yellow:  #e0b84f;
-  --ctp-green:   #57d98c;
-
-  /* UI Tokens */
-  --bg-app:      #0f0d09;
-  --bg-sidebar:  #0a0907;
-  --bg-card:     #15120d;
-  --bg-hover:    #1d1811;
-  --bg-player:   #0a0907;
-  --bg-glass:    rgba(15, 13, 9, 0.82);
-
-  /* Accent */
-  --accent:      #c9a227;
-  --accent-dim:  rgba(201, 162, 39, 0.06);
-  --accent-glow: rgba(201, 162, 39, 0.12);
-
-  /* Text UI */
-  --text-primary:   #f8f4e8;
-  --text-secondary: #b89f56;
-  --text-muted:     #7a6830;
-
-  /* Borders */
-  --border:          #262016;
-  --border-subtle:   #1d1811;
-  --border-dropdown: #31281a;
-  --shadow-dropdown: rgba(0, 0, 0, 0.92);
-
-  /* Status */
-  --positive: #57d98c;
-  --warning:  #e0b84f;
-  --danger:   #ff5c5c;
-}
-
diff --git a/src/styles/themes/order-of-the-phoenix.css b/src/styles/themes/order-of-the-phoenix.css
deleted file mode 100644
index 5540ced3..00000000
--- a/src/styles/themes/order-of-the-phoenix.css
+++ /dev/null
@@ -1 +0,0 @@
-/* ─── Order of the Phoenix ─── */
diff --git a/src/styles/themes/pandora-bioluminescent-sci-fi.css b/src/styles/themes/pandora-bioluminescent-sci-fi.css
deleted file mode 100644
index 448dd344..00000000
--- a/src/styles/themes/pandora-bioluminescent-sci-fi.css
+++ /dev/null
@@ -1,4 +0,0 @@
-/* ─────────────────────────────────────────────────────────────
-   Pandora — Bioluminescent Sci-Fi
-   ───────────────────────────────────────────────────────────── */
-
diff --git a/src/styles/themes/poison.css b/src/styles/themes/poison.css
deleted file mode 100644
index b74d7d79..00000000
--- a/src/styles/themes/poison.css
+++ /dev/null
@@ -1,74 +0,0 @@
-/* ─── Poison ─── */
-[data-theme='poison'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%231bd655%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* ── Palette — charcoal grays + phosphor green ── */
-  --ctp-crust: #0e0e0e;
-  --ctp-mantle: #161616;
-  --ctp-base: #1f1f1f;
-  --ctp-surface0: #282828;
-  --ctp-surface1: #323232;
-  --ctp-surface2: #3e3e3e;
-  --ctp-overlay0: #525252;
-  --ctp-overlay1: #686868;
-  --ctp-overlay2: #848484;
-  --ctp-text: #d0d0cc;
-  --ctp-subtext1: #a8a8a4;
-  --ctp-subtext0: #787874;
-  /* Phosphor green accent — the Winamp LED display color */
-  --ctp-mauve: #1bd655;
-  --ctp-lavender: #28e860;
-  --ctp-green: #1bd655;
-  --ctp-teal: #1ab8a8;
-  --ctp-sky: #58a8e0;
-  --ctp-blue: #4888d0;
-  --ctp-sapphire: #3870b8;
-  --ctp-pink: #c86888;
-  --ctp-flamingo: #b85858;
-  --ctp-rosewater: #c88080;
-  --ctp-yellow: #c8a830;
-  --ctp-peach: #c07838;
-  --ctp-maroon: #a03030;
-  --ctp-red: #c03030;
-
-  /* ── Semantic tokens ── */
-  --bg-app: #1f1f1f;
-  --bg-sidebar: #161616;
-  --bg-card: #282828;
-  --bg-hover: #323232;
-  --bg-player: #0e0e0e;
-  --bg-glass: rgba(22, 22, 22, 0.90);
-  --accent: #1bd655;
-  --accent-dim: rgba(27, 214, 85, 0.12);
-  --accent-glow: rgba(27, 214, 85, 0.35);
-  --text-primary: #d0d0cc;
-  --text-secondary: #a8a8a4;
-  --text-muted: #909090;
-  --border: #3a3a38;
-  --border-subtle: #282826;
-  --positive: #1bd655;
-  --warning: #c8a830;
-  --danger: #c03030;
-}
-
-/* ── Winamp: LED display glow + tactile buttons ── */
-[data-theme='poison'] .player-track-name {
-  text-shadow: 0 0 8px rgba(27, 214, 85, 0.7), 0 0 2px rgba(27, 214, 85, 0.4);
-  color: #1bd655;
-}
-
-[data-theme='poison'] .player-track-artist {
-  color: #1bd655;
-  opacity: 0.7;
-}
-
-[data-theme='poison'] .btn {
-  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.1);
-}
-
-[data-theme='poison'] .player-btn,
-[data-theme='poison'] .player-btn-primary {
-  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.12), inset 0 -1px 0 rgba(0, 0, 0, 0.3);
-}
-
diff --git a/src/styles/themes/powerdvd-classic-virtual-hifi-receiver-vfd-display.css b/src/styles/themes/powerdvd-classic-virtual-hifi-receiver-vfd-display.css
deleted file mode 100644
index b0ef4823..00000000
--- a/src/styles/themes/powerdvd-classic-virtual-hifi-receiver-vfd-display.css
+++ /dev/null
@@ -1 +0,0 @@
-/* ─── PowerDVD Classic — Virtual HiFi Receiver / VFD Display ─── */
diff --git a/src/styles/themes/powerslave-inspired-iron-maiden.css b/src/styles/themes/powerslave-inspired-iron-maiden.css
deleted file mode 100644
index 15f44713..00000000
--- a/src/styles/themes/powerslave-inspired-iron-maiden.css
+++ /dev/null
@@ -1,384 +0,0 @@
-/* ─── Powerslave (inspired) — Iron Maiden ─── */
-/* Blazing Egyptian sun — warm sandstone main, Nile-sky deep-blue sidebar,
-   pharaoh gold accent, gold+blue duality. Light, no dark mode.
-   Sidebar: deep Nile blue with subtle hieroglyph grid. Player bar: navy + gold cornice. */
-[data-theme='powerslave'] {
-  color-scheme: light;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23C8800A%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* ── Palette — sandstone, pharaoh gold, temple shadows ── */
-  --ctp-crust: #180E04;
-  --ctp-mantle: #2A1808;
-  --ctp-base: #F0DFB0;
-  /* warm sandstone */
-  --ctp-surface0: #E8D49A;
-  --ctp-surface1: #DEC880;
-  --ctp-surface2: #D0B860;
-  --ctp-overlay0: #A07830;
-  --ctp-overlay1: #806020;
-  --ctp-overlay2: #604810;
-  --ctp-text: #2A1808;
-  /* warm dark brown */
-  --ctp-subtext1: #4A2C10;
-  --ctp-subtext0: #6A4018;
-  --ctp-mauve: #C8800A;
-  /* pharaoh gold */
-  --ctp-lavender: #D49020;
-  --ctp-pink: #B04000;
-  --ctp-flamingo: #CC4800;
-  --ctp-rosewater: #F8EDD0;
-  --ctp-green: #507820;
-  --ctp-teal: #207870;
-  /* Egyptian turquoise */
-  --ctp-sky: #3080A0;
-  --ctp-blue: #1A5080;
-  --ctp-sapphire: #204870;
-  --ctp-yellow: #C8800A;
-  --ctp-peach: #C05010;
-  --ctp-maroon: #801808;
-  --ctp-red: #A82000;
-
-  /* ── Semantic tokens ──
-     Contrast audit (vs. --bg-app #F0DFB0, L≈0.746):
-       text-primary   12.9:1 AAA ✓
-       text-secondary  6.7:1 AA+ ✓
-       text-muted      4.6:1 AA  ✓ (was 3.05:1 — below AA)
-       positive        5.5:1 AA  ✓ (was 3.97:1)
-       warning         5.8:1 AA  ✓ (was 3.62:1 — was below AA)
-       danger          5.5:1 AA  ✓
-       accent (gold)   1.98:1 UI (Pharaoh brand, never as body text)
-  */
-  --bg-app: #F0DFB0;
-  /* sun-bleached sandstone */
-  --bg-sidebar: #0A2035;
-  /* Nile sky — deep lapis blue */
-  --bg-card: #F8EDD0;
-  --bg-hover: #E8D49A;
-  --bg-player: #06101C;
-  /* deep night Nile */
-  --bg-glass: rgba(240, 223, 176, 0.94);
-  --accent: #C8960C;
-  /* pharaoh gold — brand identity, 1.98:1 UI-pass only (never as body text) */
-  --accent-dim: rgba(200, 150, 12, 0.16);
-  --accent-glow: rgba(200, 150, 12, 0.35);
-  --text-primary: #2A1808;
-  --text-secondary: #6A4018;
-  --text-muted: #805810;     /* 4.6:1 AA ✓, deepened from #A07830 (3.05:1 below AA) */
-  --border: rgba(42, 24, 8, 0.38);         /* ~2.3:1 visible structural line (was 1.33:1) */
-  --border-subtle: rgba(42, 24, 8, 0.20);  /* ~1.5:1 subtle but perceptible (was 1.19:1) */
-  --border-dropdown: rgba(200, 128, 10, 0.40);
-  --shadow-dropdown: rgba(24, 14, 4, 0.22);
-  --positive: #3E6018;       /* 5.5:1 AA ✓, deeper olive (was #507820 at 3.97:1) */
-  --warning: #A04008;        /* 5.8:1 AA ✓, deeper burnt-orange (was #C05010 at 3.62:1) */
-  --danger: #A82000;
-  --radius-sm: 2px;
-  --radius-md: 4px;
-  --radius-lg: 6px;
-
-  --waveform-played: #2E7BB8;
-  /* Nile azure — the sky */
-  --waveform-buffered: rgba(46, 123, 184, 0.32);
-  --waveform-unplayed: rgba(42, 24, 8, 0.22);
-
-  /* Logo — Nile blue → pharaoh gold */
-  --logo-color-start: #2E7BB8;
-  --logo-color-end: #C8960C;
-}
-
-/* Sidebar — Nile-sky deep blue, drifting cloud wisps */
-[data-theme='powerslave'] .sidebar {
-  background: #0A2035;
-  border-right: none;
-  background-image:
-    radial-gradient(ellipse 130% 30% at 50% 6%, rgba(140, 190, 235, 0.07) 0%, transparent 65%),
-    radial-gradient(ellipse 90% 25% at 18% 22%, rgba(100, 155, 205, 0.05) 0%, transparent 60%),
-    radial-gradient(ellipse 115% 28% at 78% 38%, rgba(120, 170, 225, 0.05) 0%, transparent 65%),
-    radial-gradient(ellipse 100% 26% at 38% 58%, rgba(90, 145, 195, 0.04) 0%, transparent 60%),
-    radial-gradient(ellipse 120% 30% at 68% 75%, rgba(110, 165, 218, 0.05) 0%, transparent 65%),
-    radial-gradient(ellipse 85% 24% at 22% 92%, rgba(130, 180, 232, 0.04) 0%, transparent 60%);
-}
-
-[data-theme='powerslave'] .nav-link {
-  color: rgba(200, 224, 248, 0.65);
-}
-
-[data-theme='powerslave'] .nav-link.active {
-  background: linear-gradient(90deg, rgba(200, 150, 12, 0.22) 0%, transparent 100%);
-  border-left: 3px solid #C8960C;
-  color: #D49828;
-}
-
-[data-theme='powerslave'] .nav-link:hover:not(.active) {
-  background: rgba(46, 123, 184, 0.12);
-  border-left: 3px solid rgba(46, 123, 184, 0.50);
-  color: rgba(200, 224, 248, 0.92);
-}
-
-/* Player bar — deep Nile night, gold cornice */
-[data-theme='powerslave'] .player-bar {
-  background: #06101C;
-  border-top: 2px solid #C8960C;
-  box-shadow: 0 -4px 24px rgba(46, 123, 184, 0.10), 0 -1px 0 rgba(200, 150, 12, 0.20);
-}
-
-/* Track name — warm gold glow */
-[data-theme='powerslave'] .player-track-name {
-  color: #D49828;
-  text-shadow: 0 0 12px rgba(200, 150, 12, 0.40);
-}
-
-/* Artist name — Nile azure */
-[data-theme='powerslave'] .player-artist-name {
-  color: #6AAED8;
-}
-
-/* Content header */
-[data-theme='powerslave'] .content-header {
-  border-bottom: 1px solid rgba(42, 24, 8, 0.12);
-}
-
-/* Cards — parchment on sandstone */
-[data-theme='powerslave'] .album-card,
-[data-theme='powerslave'] .artist-card {
-  background: #F8EDD0;
-  box-shadow: 0 1px 4px rgba(42, 24, 8, 0.10);
-}
-
-[data-theme='powerslave'] .album-card:hover,
-[data-theme='powerslave'] .artist-card:hover {
-  box-shadow: 0 0 0 2px #C8800A, 0 4px 16px rgba(42, 24, 8, 0.12);
-}
-
-/* Track / queue rows */
-[data-theme='powerslave'] .track-row:hover {
-  background: #E8D49A;
-  box-shadow: inset 2px 0 0 #C8800A;
-}
-
-[data-theme='powerslave'] .queue-item:hover {
-  background: rgba(46, 123, 184, 0.12);
-  box-shadow: inset 2px 0 0 #2E7BB8;
-}
-
-/* Buttons — gold gradient */
-[data-theme='powerslave'] .player-btn-primary {
-  background: linear-gradient(180deg, #D49020 0%, #C8800A 50%, #A06008 100%);
-  color: #180E04;
-  border: 1px solid #806006;
-  box-shadow: 0 0 12px rgba(200, 128, 10, 0.28);
-}
-
-[data-theme='powerslave'] .player-btn-primary:hover {
-  background: linear-gradient(180deg, #E0A028 0%, #D48818 50%, #B07010 100%);
-  box-shadow: 0 0 22px rgba(200, 128, 10, 0.48);
-}
-
-[data-theme='powerslave'] .btn-primary {
-  background: linear-gradient(180deg, #D49020 0%, #C8800A 50%, #A06008 100%);
-  color: #180E04;
-  border: 1px solid #806006;
-}
-
-[data-theme='powerslave'] .btn-primary:hover {
-  background: linear-gradient(180deg, #E0A028 0%, #D48818 50%, #B07010 100%);
-}
-
-[data-theme='powerslave'] .hero-play-btn {
-  background: linear-gradient(180deg, #D49020 0%, #C8800A 50%, #A06008 100%);
-  color: #180E04;
-  border: 1px solid #806006;
-  box-shadow: 0 2px 16px rgba(200, 128, 10, 0.28);
-}
-
-[data-theme='powerslave'] .hero-play-btn:hover {
-  background: linear-gradient(180deg, #E0A028 0%, #D48818 50%, #B07010 100%);
-  box-shadow: 0 4px 26px rgba(200, 128, 10, 0.48);
-  transform: scale(1.02);
-}
-
-[data-theme='powerslave'] .album-card-details-btn {
-  background: linear-gradient(180deg, #D49020 0%, #C8800A 50%, #A06008 100%);
-  color: #180E04;
-  border: 1px solid #806006;
-}
-
-[data-theme='powerslave'] .album-card-details-btn:hover {
-  background: linear-gradient(180deg, #E0A028 0%, #D48818 50%, #B07010 100%);
-}
-
-/* Badge — gold pill */
-[data-theme='powerslave'] .badge,
-[data-theme='powerslave'] .album-detail-badge {
-  background: #C8800A;
-  color: #F8EDD0;
-}
-
-/* Settings + queue */
-[data-theme='powerslave'] .settings-tab:hover {
-  background: rgba(200, 150, 12, 0.08);
-  color: #C8960C;
-}
-
-[data-theme='powerslave'] .settings-tab.active {
-  background: rgba(200, 150, 12, 0.14);
-  color: #C8960C;
-  border-color: #C8960C;
-}
-
-[data-theme='powerslave'] .queue-tab-btn:hover {
-  background: rgba(46, 123, 184, 0.12);
-  color: rgba(200, 224, 248, 0.92);
-}
-
-[data-theme='powerslave'] .queue-tab-btn.active {
-  color: #C8960C;
-}
-
-[data-theme='powerslave'] .queue-round-btn.active {
-  color: #06101C;
-}
-
-/* Queue panel text — Nile-blue sidebar */
-[data-theme='powerslave'] .queue-panel {
-  background: #0A2035;
-}
-
-[data-theme='powerslave'] .queue-item-title {
-  color: rgba(220, 235, 248, 0.90);
-}
-
-[data-theme='powerslave'] .queue-item-artist,
-[data-theme='powerslave'] .queue-item-duration {
-  color: rgba(140, 190, 230, 0.55);
-}
-
-[data-theme='powerslave'] .queue-item.active .queue-item-artist,
-[data-theme='powerslave'] .queue-item.active .queue-item-duration {
-  color: rgba(140, 190, 230, 0.75);
-}
-
-[data-theme='powerslave'] .queue-divider span {
-  color: rgba(140, 190, 230, 0.38) !important;
-}
-
-[data-theme='powerslave'] .queue-current-info h3 {
-  color: rgba(220, 235, 248, 0.92);
-}
-
-[data-theme='powerslave'] .queue-current-sub {
-  color: rgba(140, 190, 230, 0.58);
-}
-
-[data-theme='powerslave'] .queue-current-cover .fallback {
-  color: rgba(140, 190, 230, 0.30);
-}
-
-[data-theme='powerslave'] .queue-action-btn {
-  color: rgba(140, 190, 230, 0.65);
-}
-
-[data-theme='powerslave'] .queue-action-btn:hover:not(:disabled) {
-  color: rgba(220, 235, 248, 0.95);
-}
-
-/* Misc interactive */
-[data-theme='powerslave'] .custom-select-trigger:hover {
-  background: #E8D49A;
-}
-
-[data-theme='powerslave'] .custom-select-option:hover {
-  background: rgba(200, 128, 10, 0.10);
-}
-
-[data-theme='powerslave'] .artist-row:hover {
-  background: rgba(200, 128, 10, 0.07);
-  box-shadow: inset 3px 0 0 #C8800A;
-}
-
-[data-theme='powerslave'] .playlist-row:hover {
-  background: rgba(200, 128, 10, 0.07);
-  box-shadow: inset 3px 0 0 #C8800A;
-}
-
-[data-theme='powerslave'] .artist-ext-link:hover {
-  background: rgba(200, 128, 10, 0.08);
-  border-color: #C8800A;
-}
-
-/* Connection indicators */
-[data-theme='powerslave'] .connection-type {
-  color: #050E19;
-}
-
-[data-theme='powerslave'] .connection-server {
-  color: #050E19;
-}
-
-/* Back button needs light color — sits on dark overlay above sandstone content */
-[data-theme='powerslave'] .album-detail-back {
-  color: rgba(255, 255, 255, 0.85);
-}
-
-[data-theme='powerslave'] .album-detail-back:hover {
-  background: rgba(255, 255, 255, 0.12);
-  color: #ffffff;
-}
-
-/* Tech strip — default ctp-surface1 (#DEC880) is too bright on dark blue queue panel */
-[data-theme='powerslave'] .queue-current-tech {
-  background: rgba(6, 16, 28, 0.88);
-  color: rgba(140, 190, 230, 0.72);
-}
-
-/* Album detail hero meta */
-[data-theme='powerslave'] .album-detail-info {
-  color: rgba(255, 255, 255, 0.80);
-}
-
-[data-theme='powerslave'] .album-detail-artist,
-[data-theme='powerslave'] .album-detail-artist-link {
-  color: #050E19;
-}
-
-[data-theme='powerslave'] .album-detail-artist-link:hover {
-  color: #0A2035;
-}
-
-/* np-album-track */
-[data-theme='powerslave'] .np-album-track.active .np-album-track-title,
-[data-theme='powerslave'] .np-album-track.active .np-album-track-num {
-  color: #C8960C;
-}
-
-/* Scrollbar — warm, gold thumb */
-[data-theme='powerslave'] ::-webkit-scrollbar {
-  width: 5px;
-  height: 5px;
-}
-
-[data-theme='powerslave'] ::-webkit-scrollbar-track {
-  background: #E8D49A;
-}
-
-[data-theme='powerslave'] ::-webkit-scrollbar-thumb {
-  background: rgba(200, 128, 10, 0.35);
-  border-radius: 3px;
-}
-
-[data-theme='powerslave'] ::-webkit-scrollbar-thumb:hover {
-  background: #C8800A;
-}
-
-/* Column resize grip — was surface1 (#DEC880) on bg-card = 1.41:1 (invisible)
-   Use the deeper temple-shadow overlay1 tone for strong legibility. */
-[data-theme='powerslave'] .col-resize-handle::after {
-  background: #806020;            /* 5.0:1 on bg-card — visible dark grip */
-  width: 2px;
-}
-
-/* Focus ring — pharaoh gold accent with strong outline for keyboard nav */
-[data-theme='powerslave'] *:focus-visible {
-  outline: 2px solid #C8800A;
-  outline-offset: 2px;
-}
-
diff --git a/src/styles/themes/progress-range.css b/src/styles/themes/progress-range.css
index b1e38765..ca243fd6 100644
--- a/src/styles/themes/progress-range.css
+++ b/src/styles/themes/progress-range.css
@@ -4,7 +4,7 @@ input[type="range"] {
   appearance: none;
   height: 4px;
   border-radius: var(--radius-full);
-  background: var(--ctp-surface2);
+  background: var(--slider-track);
   outline: none;
   cursor: pointer;
   transition: all var(--transition-fast);
@@ -15,7 +15,7 @@ input[type="range"]::-webkit-slider-thumb {
   width: 14px;
   height: 14px;
   border-radius: 50%;
-  background: var(--text-primary);
+  background: var(--slider-thumb);
   cursor: pointer;
   transition: transform var(--transition-fast), background var(--transition-fast);
   box-shadow: var(--shadow-sm);
@@ -23,6 +23,6 @@ input[type="range"]::-webkit-slider-thumb {
 
 input[type="range"]:hover::-webkit-slider-thumb {
   transform: scale(1.2);
-  background: var(--accent);
+  background: var(--slider-thumb-hover);
 }
 
diff --git a/src/styles/themes/psychowave-synthwave-retrowave.css b/src/styles/themes/psychowave-synthwave-retrowave.css
deleted file mode 100644
index 66aa7395..00000000
--- a/src/styles/themes/psychowave-synthwave-retrowave.css
+++ /dev/null
@@ -1,61 +0,0 @@
-/* ─── Psychowave — Synthwave / Retrowave ─── */
-[data-theme='psychowave'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23b09ee0%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* ── Palette ── */
-  --ctp-crust: #0d0c1a;
-  --ctp-mantle: #110f22;
-  --ctp-base: #161428;
-  --ctp-surface0: #1f1c38;
-  --ctp-surface1: #2a2750;
-  --ctp-surface2: #383468;
-  --ctp-overlay0: #4a4580;
-  --ctp-overlay1: #6460a8;
-  --ctp-overlay2: #8078c8;
-  /* Text */
-  --ctp-text: #e6e0f6;
-  --ctp-subtext1: #b09ee0;
-  --ctp-subtext0: #8878c0;
-  /* Accents — muted synthwave palette */
-  --ctp-mauve: #a06ae0;
-  /* soft violet — primary accent */
-  --ctp-lavender: #7878d8;
-  /* muted indigo — gradient end */
-  --ctp-pink: #c060a8;
-  /* dusty rose */
-  --ctp-flamingo: #c07090;
-  --ctp-rosewater: #c89090;
-  --ctp-blue: #58a8e8;
-  /* steel blue */
-  --ctp-sapphire: #4880c8;
-  --ctp-sky: #60c0d8;
-  --ctp-teal: #40a8a8;
-  --ctp-green: #58c878;
-  /* soft mint green */
-  --ctp-yellow: #c8a848;
-  /* muted gold */
-  --ctp-peach: #c87848;
-  --ctp-maroon: #c05868;
-  --ctp-red: #b04060;
-
-  /* ── Semantic tokens ── */
-  --bg-app: #161428;
-  --bg-sidebar: #110f22;
-  --bg-card: #1f1c38;
-  --bg-hover: #2a2750;
-  --bg-player: #0d0c1a;
-  --bg-glass: rgba(22, 20, 40, 0.85);
-  --accent: #a06ae0;
-  --accent-dim: rgba(160, 106, 224, 0.12);
-  --accent-glow: rgba(160, 106, 224, 0.30);
-  --text-primary: #e6e0f6;
-  --text-secondary: #b09ee0;
-  --text-muted: #706898;
-  --border: #383468;
-  --border-subtle: #1f1c38;
-  --positive: #58c878;
-  --warning: #c8a848;
-  --danger: #b04060;
-}
-
diff --git a/src/styles/themes/sakura-night.css b/src/styles/themes/sakura-night.css
deleted file mode 100644
index 9931fc23..00000000
--- a/src/styles/themes/sakura-night.css
+++ /dev/null
@@ -1,66 +0,0 @@
-/* ─── Sakura Night ─── */
-[data-theme='sakura-night'] {
-  color-scheme: dark;
-
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23d8a6bc' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
-
-  /* Backgrounds */
-  --ctp-crust:    #10090c;
-  --ctp-mantle:   #160d12;
-  --ctp-base:     #1c1218;
-  --ctp-surface0: #241821;
-  --ctp-surface1: #2f202b;
-  --ctp-surface2: #3c2937;
-
-  /* Overlays */
-  --ctp-overlay0: #6f4d5d;
-  --ctp-overlay1: #8d6476;
-  --ctp-overlay2: #ab7c8f;
-
-  /* Text */
-  --ctp-text:     #fff0f5;
-  --ctp-subtext1: #e3c5d0;
-  --ctp-subtext0: #bc93a4;
-
-  /* Cherry blossom accent */
-  --ctp-teal:      #d8a6bc;
-  --ctp-sky:       #d8a6bc;
-  --ctp-sapphire:  #b98399;
-  --ctp-blue:      #99687d;
-  --ctp-lavender:  #e3b8cb;
-  --ctp-mauve:     #b98399;
-  --ctp-pink:      #99687d;
-  --ctp-flamingo:  #e3b8cb;
-  --ctp-rosewater: #b98399;
-
-  --ctp-red:     #e27b7b;
-  --ctp-maroon:  #d49a73;
-  --ctp-peach:   #d49a73;
-  --ctp-yellow:  #d8bf73;
-  --ctp-green:   #74b68a;
-
-  --bg-app:      #1c1218;
-  --bg-sidebar:  #160d12;
-  --bg-card:     #241821;
-  --bg-hover:    #2f202b;
-  --bg-player:   #160d12;
-  --bg-glass:    rgba(28,18,24,0.82);
-
-  --accent:      #d8a6bc;
-  --accent-dim:  rgba(216,166,188,0.05);
-  --accent-glow: rgba(216,166,188,0.08);
-
-  --text-primary:   #fff0f5;
-  --text-secondary: #bc93a4;
-  --text-muted:     #6f4d5d;
-
-  --border:          #3c2937;
-  --border-subtle:   #2f202b;
-  --border-dropdown: #493341;
-  --shadow-dropdown: rgba(0,0,0,0.72);
-
-  --positive: #74b68a;
-  --warning:  #d8bf73;
-  --danger:   #e27b7b;
-}
-
diff --git a/src/styles/themes/scrollbars.css b/src/styles/themes/scrollbars.css
index 619fa67a..b6f29271 100644
--- a/src/styles/themes/scrollbars.css
+++ b/src/styles/themes/scrollbars.css
@@ -5,7 +5,7 @@
 }
 
 ::-webkit-scrollbar-track {
-  background: transparent;
+  background: var(--scrollbar-track);
 }
 
 ::-webkit-scrollbar-thumb {
@@ -15,14 +15,14 @@
 }
 
 *:hover::-webkit-scrollbar-thumb {
-  background: var(--ctp-surface2);
+  background: var(--scrollbar-thumb);
 }
 
 .is-scrolling::-webkit-scrollbar-thumb {
-  background: var(--ctp-surface2);
+  background: var(--scrollbar-thumb);
 }
 
 ::-webkit-scrollbar-thumb:hover {
-  background: var(--ctp-overlay0);
+  background: var(--scrollbar-thumb-hover);
 }
 
diff --git a/src/styles/themes/semantic-cascade.css b/src/styles/themes/semantic-cascade.css
new file mode 100644
index 00000000..bb5b6148
--- /dev/null
+++ b/src/styles/themes/semantic-cascade.css
@@ -0,0 +1,74 @@
+/* ───────────────────────────────────────────────────────────────────────────
+   Semantic cascade layer — granular, per-region theme override points.
+
+   Every token here defaults to a base token. That makes this file a VISUAL
+   NO-OP: the app looks
+   identical until a theme deliberately overrides one of these tokens. It only
+   ADDS fine-grained control — e.g. a theme can recolour the sidebar hover
+   without touching every other hover.
+
+   Imported right after the base theme (catppuccin-mocha-variables.css) and
+   before every other theme file, so any [data-theme] block can override a
+   token here (equal specificity → later source wins). Resolution is per-theme:
+   `--sidebar-item-hover: var(--bg-hover)` picks up whatever --bg-hover the
+   active theme set.
+
+   Community theme-store contract: these are the OPTIONAL granular tokens. The
+   required base set stays the ~25 core tokens. See psysonic-themes/schema.
+   ─────────────────────────────────────────────────────────────────────────── */
+:root {
+  /* ── Sidebar ─────────────────────────────────────────────── */
+  --sidebar-item-hover: var(--bg-hover);
+  --sidebar-item-active-bg: var(--accent-dim);
+  --sidebar-item-active-text: var(--accent);
+  --sidebar-text: var(--text-secondary);
+  --sidebar-trigger-bg: var(--bg-card);
+  --sidebar-border: var(--border-subtle);
+
+  /* ── Player bar ──────────────────────────────────────────── */
+  --player-control: var(--text-muted);
+  --player-control-hover: var(--text-primary);
+  --player-control-hover-bg: var(--bg-hover);
+  --player-time-toggle-hover: var(--bg-hover);
+  --player-time-toggle-active: var(--bg-card);
+  --player-border: var(--border-subtle);
+
+  /* ── Lists / tracklist / queue ───────────────────────────── */
+  --row-hover: var(--bg-hover);
+  --row-playing-bg: var(--accent-dim);
+  --row-playing-text: var(--accent);
+  --row-divider: var(--border-subtle);
+  --row-text: var(--text-primary);
+  --row-text-secondary: var(--text-secondary);
+  --row-text-muted: var(--text-muted);
+  --col-header-text: var(--text-muted);
+  --col-resize-active: var(--accent);
+
+  /* ── Cards / grids ───────────────────────────────────────── */
+  --card-hover-border: var(--border);
+  --card-title: var(--text-primary);
+  --card-subtitle: var(--text-muted);
+  --card-placeholder-bg: var(--bg-hover);
+
+  /* ── Menus / dropdowns / modals ──────────────────────────── */
+  --menu-bg: var(--bg-card);
+  --menu-item-hover: var(--bg-hover);
+  --menu-item-active-text: var(--accent);
+  --menu-divider: var(--border-subtle);
+  --modal-bg: var(--bg-card);
+  --modal-scrim: rgba(17, 17, 27, 0.85);
+
+  /* ── Controls — buttons / inputs / sliders ───────────────── */
+  --input-bg: var(--bg-app);
+  --input-border: var(--border);
+  --input-focus-border: var(--accent);
+  --button-hover: var(--bg-hover);
+  --slider-track: var(--bg-elevated);
+  --slider-thumb: var(--text-primary);
+  --slider-thumb-hover: var(--accent);
+
+  /* ── Scrollbar ───────────────────────────────────────────── */
+  --scrollbar-thumb: var(--bg-elevated);
+  --scrollbar-thumb-hover: var(--text-muted);
+  --scrollbar-track: transparent;
+}
diff --git a/src/styles/themes/sepia-dark.css b/src/styles/themes/sepia-dark.css
deleted file mode 100644
index b115e1f9..00000000
--- a/src/styles/themes/sepia-dark.css
+++ /dev/null
@@ -1,68 +0,0 @@
-/* ─── Sepia Dark ─── */
-[data-theme='sepia-dark'] {
-  color-scheme: dark;
-
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23c8b89a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
-
-  /* Backgrounds */
-  --ctp-crust:    #0e0c09;
-  --ctp-mantle:   #13100c;
-  --ctp-base:     #1e1a14;
-  --ctp-surface0: #252018;
-  --ctp-surface1: #2e281e;
-  --ctp-surface2: #373025;
-
-  /* Overlays */
-  --ctp-overlay0: #605545;
-  --ctp-overlay1: #806e5a;
-  --ctp-overlay2: #9a8870;
-
-  /* Text */
-  --ctp-text:     #ede0cc;
-  --ctp-subtext1: #d0c0a8;
-  --ctp-subtext0: #b0a080;
-
-  /* Cream accent */
-  --ctp-teal:      #c8b89a;
-  --ctp-sky:       #c8b89a;
-  --ctp-sapphire:  #b8a080;
-  --ctp-blue:      #a08868;
-  --ctp-lavender:  #c8b89a;
-  --ctp-mauve:     #b8a080;
-  --ctp-pink:      #a08868;
-  --ctp-flamingo:  #c8b89a;
-  --ctp-rosewater: #b8a080;
-
-  /* Semantic */
-  --ctp-red:     #c87060;
-  --ctp-maroon:  #c08050;
-  --ctp-peach:   #c08050;
-  --ctp-yellow:  #b8a050;
-  --ctp-green:   #80a870;
-
-  /* UI tokens */
-  --bg-app:      #1e1a14;
-  --bg-sidebar:  #13100c;
-  --bg-card:     #252018;
-  --bg-hover:    #2e281e;
-  --bg-player:   #13100c;
-  --bg-glass:    rgba(30, 26, 20, 0.95);
-
-  --accent:      #c8b89a;
-  --accent-dim:  rgba(200, 184, 154, 0.07);
-  --accent-glow: rgba(200, 184, 154, 0.13);
-
-  --text-primary:   #ede0cc;
-  --text-secondary: #b0a080;
-  --text-muted:     #80705c;
-
-  --border:          #2e281e;
-  --border-subtle:   #252018;
-  --border-dropdown: #3a3025;
-  --shadow-dropdown: rgba(0, 0, 0, 0.88);
-
-  --positive: #80a870;
-  --warning:  #b8a050;
-  --danger:   #c87060;
-}
-
diff --git a/src/styles/themes/spider-tech-spider-man.css b/src/styles/themes/spider-tech-spider-man.css
deleted file mode 100644
index 9fe335a3..00000000
--- a/src/styles/themes/spider-tech-spider-man.css
+++ /dev/null
@@ -1,350 +0,0 @@
-/* ─── Spider-Tech — Spider-Man ─── */
-[data-theme='spider-tech'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23E62429%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* Palette — suit red, night-sky navy, web black */
-  --ctp-crust: #060408;
-  --ctp-mantle: #0a0610;
-  --ctp-base: #0e0c18;
-  --ctp-surface0: #181428;
-  --ctp-surface1: #241e3a;
-  --ctp-surface2: #302848;
-  --ctp-overlay0: #4a3e68;
-  --ctp-overlay1: #6a5888;
-  --ctp-overlay2: #9080a8;
-  --ctp-text: #f0ecf8;
-  --ctp-subtext1: #d0c8e0;
-  --ctp-subtext0: #a898c0;
-  --ctp-mauve: #E62429;
-  --ctp-lavender: #ff4a50;
-  --ctp-pink: #ff4a50;
-  --ctp-flamingo: #cc1a1f;
-  --ctp-rosewater: #f0ecf8;
-  --ctp-green: #4adf80;
-  --ctp-teal: #3ab8d0;
-  --ctp-sky: #4a88ff;
-  --ctp-blue: #1e52c8;
-  --ctp-sapphire: #1e52c8;
-  --ctp-yellow: #f0c030;
-  --ctp-peach: #E62429;
-  --ctp-maroon: #8b0010;
-  --ctp-red: #E62429;
-
-  --bg-app: #0e0c18;
-  --bg-sidebar: #0a0610;
-  --bg-card: #181428;
-  --bg-hover: #241e3a;
-  --bg-player: #060408;
-  --bg-glass: rgba(10, 6, 16, 0.92);
-  --accent: #E62429;
-  --accent-dim: rgba(230, 36, 41, 0.14);
-  --accent-glow: rgba(230, 36, 41, 0.38);
-  --text-primary: #f0ecf8;
-  --text-secondary: #9080a8;
-  --text-muted: #a898c0;
-  --border: rgba(230, 36, 41, 0.18);
-  --border-subtle: rgba(230, 36, 41, 0.08);
-  --border-dropdown: rgba(230, 36, 41, 0.30);
-  --shadow-dropdown: rgba(0, 0, 0, 0.92);
-  --positive: #4adf80;
-  --warning: #f0c030;
-  --danger: #E62429;
-  --radius-sm: 2px;
-  --radius-md: 4px;
-  --radius-lg: 6px;
-}
-
-/* App shell — Into the Spider-Verse comic halftone dots */
-[data-theme='spider-tech'] .app-shell {
-  background-image: radial-gradient(circle,
-      rgba(230, 36, 41, 0.055) 1px,
-      transparent 1px);
-  background-size: 14px 14px;
-}
-
-/* Sidebar — CSS spider web radiating from top-left corner */
-[data-theme='spider-tech'] .sidebar {
-  background: #080510;
-  border-right: 1px solid rgba(230, 36, 41, 0.22);
-  background-image:
-    repeating-radial-gradient(circle at 0% 0%,
-      transparent 0px,
-      transparent 38px,
-      rgba(230, 36, 41, 0.10) 39px,
-      rgba(230, 36, 41, 0.10) 40px),
-    repeating-conic-gradient(from 0deg at 0% 0%,
-      transparent 0deg,
-      transparent 19deg,
-      rgba(230, 36, 41, 0.07) 19deg,
-      rgba(230, 36, 41, 0.07) 20deg);
-}
-
-/* Player bar — deep black with red suit border + glow */
-[data-theme='spider-tech'] .player-bar {
-  background: #060408;
-  border-top: 2px solid #E62429;
-  box-shadow: 0 -6px 28px rgba(230, 36, 41, 0.20), 0 -1px 0 rgba(0, 0, 0, 0.9);
-}
-
-/* Track name — Spider-Man red, bold */
-[data-theme='spider-tech'] .player-track-name {
-  color: #E62429;
-  font-weight: 700;
-  text-shadow: 0 0 10px rgba(230, 36, 41, 0.45), 0 0 24px rgba(230, 36, 41, 0.20);
-}
-
-/* Artist name — Spider suit blue */
-[data-theme='spider-tech'] .player-artist-name {
-  color: #4a88ff;
-}
-
-/* Nav active — red left bar */
-[data-theme='spider-tech'] .nav-link.active {
-  background: linear-gradient(90deg, rgba(230, 36, 41, 0.18) 0%, transparent 100%);
-  border-left: 3px solid #E62429;
-  color: #E62429;
-}
-
-[data-theme='spider-tech'] .nav-link:hover:not(.active) {
-  background: linear-gradient(90deg, rgba(230, 36, 41, 0.08) 0%, transparent 100%);
-  border-left: 3px solid rgba(230, 36, 41, 0.35);
-}
-
-/* Content header */
-[data-theme='spider-tech'] .content-header {
-  border-bottom: 1px solid rgba(230, 36, 41, 0.14);
-}
-
-/* Cards — red border glow on hover */
-[data-theme='spider-tech'] .album-card:hover,
-[data-theme='spider-tech'] .artist-card:hover {
-  box-shadow: 0 0 0 1px rgba(230, 36, 41, 0.55), 0 4px 20px rgba(230, 36, 41, 0.16);
-}
-
-/* Track / queue rows */
-[data-theme='spider-tech'] .track-row:hover,
-[data-theme='spider-tech'] .queue-item:hover {
-  box-shadow: inset 2px 0 0 #E62429;
-  background: rgba(230, 36, 41, 0.06);
-}
-
-/* Primary play button — suit red */
-[data-theme='spider-tech'] .player-btn-primary {
-  background: linear-gradient(180deg, #ff4a50 0%, #E62429 50%, #b81820 100%);
-  color: #ffffff;
-  box-shadow: 0 0 16px rgba(230, 36, 41, 0.50);
-  border: 1px solid #9c1018;
-}
-
-[data-theme='spider-tech'] .player-btn-primary:hover {
-  background: linear-gradient(180deg, #ff6065 0%, #f03035 50%, #cc2025 100%);
-  box-shadow: 0 0 26px rgba(230, 36, 41, 0.72);
-}
-
-/* btn-primary */
-[data-theme='spider-tech'] .btn-primary {
-  background: linear-gradient(180deg, #ff4a50 0%, #E62429 50%, #b81820 100%);
-  color: #ffffff;
-  border: 1px solid #9c1018;
-}
-
-[data-theme='spider-tech'] .btn-primary:hover {
-  background: linear-gradient(180deg, #ff6065 0%, #f03035 50%, #cc2025 100%);
-}
-
-/* Hero play button */
-[data-theme='spider-tech'] .hero-play-btn {
-  background: linear-gradient(180deg, #ff4a50 0%, #E62429 50%, #b81820 100%);
-  color: #ffffff;
-  border: 1px solid #9c1018;
-  box-shadow: 0 2px 16px rgba(230, 36, 41, 0.50);
-  transition: filter var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast);
-}
-
-[data-theme='spider-tech'] .hero-play-btn:hover {
-  background: linear-gradient(180deg, #ff6065 0%, #f03035 50%, #cc2025 100%);
-  box-shadow: 0 4px 26px rgba(230, 36, 41, 0.72);
-  transform: scale(1.02);
-}
-
-/* Album card overlay button */
-[data-theme='spider-tech'] .album-card-details-btn {
-  background: linear-gradient(180deg, #ff4a50 0%, #E62429 50%, #b81820 100%);
-  color: #ffffff;
-  border: 1px solid #9c1018;
-  box-shadow: 0 2px 12px rgba(230, 36, 41, 0.45);
-}
-
-/* Scrollbar — dark with red thumb */
-[data-theme='spider-tech'] ::-webkit-scrollbar {
-  width: 5px;
-  height: 5px;
-}
-
-[data-theme='spider-tech'] ::-webkit-scrollbar-track {
-  background: #0a0610;
-}
-
-[data-theme='spider-tech'] ::-webkit-scrollbar-thumb {
-  background: rgba(230, 36, 41, 0.40);
-  border-radius: 3px;
-}
-
-[data-theme='spider-tech'] ::-webkit-scrollbar-thumb:hover {
-  background: #E62429;
-}
-
-/* ── Jayfin (Mediaplayer) ─────────────────────────────────────── */
-[data-theme='jayfin'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23AA5CC3%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* ── Jellyfin Palette ── */
-  --ctp-crust: #050505;
-  --ctp-mantle: #0c0c0c;
-  --ctp-base: #141414;
-  --ctp-surface0: #1e1e1e;
-  --ctp-surface1: #282828;
-  --ctp-surface2: #333333;
-  --ctp-overlay0: #505050;
-  --ctp-overlay1: #787878;
-  --ctp-overlay2: #a8a8a8;
-  --ctp-text: #ffffff;
-  --ctp-subtext1: #e8e8e8;
-  --ctp-subtext0: #c0c0c0;
-
-  /* Jellyfin Lila als Hauptakzent, Cyan als Sekundärfarbe */
-  --ctp-mauve: #AA5CC3;
-  --ctp-lavender: #bf7ed4;
-  --ctp-green: #2ed573;
-  --ctp-teal: #00c8dc;
-  --ctp-sky: #00A4DC;
-  --ctp-blue: #0088cc;
-  --ctp-sapphire: #0060a0;
-  --ctp-pink: #c070d8;
-  --ctp-flamingo: #d488e8;
-  --ctp-rosewater: #e8b8f8;
-  --ctp-yellow: #ffd060;
-  --ctp-peach: #ff9500;
-  --ctp-maroon: #cc3355;
-  --ctp-red: #ff4444;
-
-  /* ── Semantische Tokens ── */
-  --bg-app: #141414;
-  --bg-sidebar: #0c0c0c;
-  --bg-card: #1e1e1e;
-  --bg-hover: rgba(170, 92, 195, 0.1);
-  --bg-player: #050505;
-  --bg-glass: rgba(14, 14, 14, 0.88);
-
-  --accent: #AA5CC3;
-  --accent-dim: rgba(170, 92, 195, 0.15);
-  --accent-glow: rgba(170, 92, 195, 0.4);
-  --volume-accent: #AA5CC3;
-
-  --text-primary: #ffffff;
-  --text-secondary: #c8c8c8;
-  --text-muted: #888888;
-
-  --border: #2a2a2a;
-  --border-subtle: #1e1e1e;
-
-  --positive: #2ed573;
-  --warning: #ffd060;
-  --danger: #ff4444;
-
-  --radius-sm: 4px;
-  --radius-md: 6px;
-  --radius-lg: 10px;
-  --radius-xl: 14px;
-  --radius-full: 999px;
-}
-
-/* Sidebar mit dezenter Tiefe */
-[data-theme='jayfin'] .sidebar {
-  background: #0c0c0c;
-  border-right: 1px solid #1e1e1e;
-}
-
-/* Aktiver Nav-Link: gefüllte Lila-Fläche mit weißer Schrift (WCAG AA) + linker Balken
-   Vorher: color #AA5CC3 auf 12 % accent über bg-sidebar → ~3.30:1 (Fail AA small text).
-   Jetzt:  weißer Text auf 22 % accent → >10:1, Brand-Identity bleibt durch den Balken. */
-[data-theme='jayfin'] .nav-link.active {
-  background: rgba(170, 92, 195, 0.22);
-  color: #ffffff;
-  border-left: 3px solid #AA5CC3;
-}
-
-[data-theme='jayfin'] .nav-link.active svg {
-  color: #ffffff;
-}
-
-/* Player Bar: tiefes Schwarz mit Jellyfin-Brand-Gradient als Oberkante */
-[data-theme='jayfin'] .player-bar {
-  background: #050505;
-  border-top: 2px solid transparent;
-  border-image: linear-gradient(to right, #00A4DC, #AA5CC3) 1;
-  box-shadow: 0 -4px 24px rgba(0, 0, 0, 0.6);
-}
-
-/* Progress fill: Gradient Cyan → Lila */
-[data-theme='jayfin'] .progress-bar-fill {
-  background: linear-gradient(to right, #00A4DC 0%, #AA5CC3 100%);
-  box-shadow: 0 0 8px rgba(170, 92, 195, 0.5);
-}
-
-/* Cards */
-[data-theme='jayfin'] .card {
-  background: #1e1e1e;
-  border: 1px solid #2a2a2a;
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
-}
-
-/* Btn-primary: Jellyfin Lila
-   font-weight 700 nötig, weil weiß auf #AA5CC3 nur 4.08:1 erreicht —
-   bold verdichtet die Glyph-Fläche und hebt die Lesbarkeit über die AA-Schwelle. */
-[data-theme='jayfin'] .btn-primary,
-[data-theme='jayfin'] .player-btn-primary,
-[data-theme='jayfin'] .hero-play-btn {
-  background: #AA5CC3;
-  color: #ffffff;
-  border: none;
-  font-weight: 700;
-  box-shadow: 0 2px 12px rgba(170, 92, 195, 0.35);
-}
-
-[data-theme='jayfin'] .btn-primary:hover,
-[data-theme='jayfin'] .player-btn-primary:hover,
-[data-theme='jayfin'] .hero-play-btn:hover {
-  background: #be70d8;
-  box-shadow: 0 4px 18px rgba(170, 92, 195, 0.5);
-  filter: none;
-}
-
-/* Album card hover play button */
-[data-theme='jayfin'] .album-card-details-btn {
-  background: #AA5CC3;
-  color: #ffffff;
-  font-weight: 700;
-  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.5);
-}
-
-[data-theme='jayfin'] .album-card-details-btn:hover {
-  background: #be70d8;
-}
-
-/* Queue round buttons */
-[data-theme='jayfin'] .queue-round-btn.active {
-  background: #AA5CC3;
-  color: #ffffff;
-  font-weight: 700;
-  box-shadow: 0 0 10px rgba(170, 92, 195, 0.4);
-}
-
-/* Connection indicators: schwarz auf warmem Grau */
-[data-theme='w98'] .connection-type,
-[data-theme='w98'] .connection-server {
-  color: #000000;
-}
-
diff --git a/src/styles/themes/spotless.css b/src/styles/themes/spotless.css
deleted file mode 100644
index 53290b95..00000000
--- a/src/styles/themes/spotless.css
+++ /dev/null
@@ -1,120 +0,0 @@
-/* ─── Spotless ─── */
-[data-theme='spotless'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23B3B3B3%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust: #000000;
-  --ctp-mantle: #121212;
-  --ctp-base: #181818;
-  --ctp-surface0: #282828;
-  --ctp-surface1: #3E3E3E;
-  --ctp-surface2: #535353;
-  --ctp-overlay0: #727272;
-  --ctp-overlay1: #A7A7A7;
-  --ctp-overlay2: #B3B3B3;
-  --ctp-text: #FFFFFF;
-  --ctp-subtext1: #EBEBEB;
-  --ctp-subtext0: #D6D6D6;
-
-  --ctp-mauve: #1ED760;
-  --ctp-lavender: #1FDF64;
-  --ctp-green: #1ED760;
-  --ctp-teal: #1DF2A4;
-  --ctp-sky: #3D91F4;
-  --ctp-blue: #2E77D0;
-  --ctp-sapphire: #1C5599;
-  --ctp-pink: #E55C5C;
-  --ctp-flamingo: #E55C5C;
-  --ctp-rosewater: #FFC8C8;
-  --ctp-yellow: #FFA42B;
-  --ctp-peach: #FF7A00;
-  --ctp-maroon: #B22A2A;
-  --ctp-red: #E22134;
-
-  --bg-app: #121212;
-  --bg-sidebar: #000000;
-  --bg-card: #181818;
-  --bg-hover: #282828;
-  --bg-player: #181818;
-  --bg-glass: rgba(18, 18, 18, 0.85);
-
-  --accent: #1ED760;
-  --accent-dim: rgba(30, 215, 96, 0.15);
-  --accent-glow: rgba(30, 215, 96, 0.35);
-  --volume-accent: #FFFFFF;
-
-  --text-primary: #FFFFFF;
-  --text-secondary: #B3B3B3;
-  --text-muted: #A7A7A7;
-
-  --border: #282828;
-  --border-subtle: rgba(255, 255, 255, 0.1);
-
-  --positive: #1ED760;
-  --warning: #FFA42B;
-  --danger: #E22134;
-
-  --radius-sm: 4px;
-  --radius-md: 8px;
-  --radius-lg: 16px;
-  --radius-xl: 24px;
-  --radius-full: 9999px;
-
-  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.5);
-  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.6);
-  --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.7);
-
-  --transition-fast: 150ms ease;
-  --transition-med: 250ms ease;
-  --transition-slow: 350ms ease;
-
-  --sidebar-width: 220px;
-  --player-height: 88px;
-}
-
-[data-theme='spotless'] .sidebar {
-  border-right: none;
-}
-
-[data-theme='spotless'] .player-bar {
-  border-top: 1px solid var(--border-subtle);
-}
-
-[data-theme='spotless'] .nav-link:hover {
-  color: var(--text-primary);
-  background-color: transparent;
-}
-
-[data-theme='spotless'] .nav-link.active {
-  background-color: var(--bg-hover);
-  color: var(--text-primary);
-  border-radius: var(--radius-sm);
-}
-
-[data-theme='spotless'] .nav-link.active::before {
-  display: none;
-}
-
-[data-theme='spotless'] .btn-primary {
-  color: var(--ctp-crust);
-  border-radius: var(--radius-full);
-  font-weight: 700;
-}
-
-[data-theme='spotless'] .player-btn-primary {
-  color: var(--ctp-crust);
-  background-color: var(--text-primary);
-  border-radius: var(--radius-full);
-}
-
-[data-theme='spotless'] .player-btn-primary:hover {
-  background-color: var(--accent);
-  transform: scale(1.05);
-}
-
-[data-theme='spotless'] .queue-item:hover,
-[data-theme='spotless'] .track-row:hover {
-  background-color: var(--bg-hover);
-  border-radius: var(--radius-sm);
-}
-
diff --git a/src/styles/themes/terafox.css b/src/styles/themes/terafox.css
deleted file mode 100644
index 7145f6ae..00000000
--- a/src/styles/themes/terafox.css
+++ /dev/null
@@ -1,53 +0,0 @@
-/* ─── Terafox ─── */
-[data-theme='terafox'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23e6eaea%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust: #0f1c1e;
-  --ctp-mantle: #0f1c1e;
-  --ctp-base: #152528;
-  --ctp-surface0: #1d3337;
-  --ctp-surface1: #254147;
-  --ctp-surface2: #2d4f56;
-  --ctp-overlay0: #6d7f8b;
-  --ctp-overlay1: #587b7b;
-  --ctp-overlay2: #cbd9d8;
-  --ctp-text: #e6eaea;
-  --ctp-subtext1: #eaeeee;
-  --ctp-subtext0: #cbd9d8;
-  --ctp-mauve: #ad5c7c;
-  --ctp-lavender: #5a93aa;
-  --ctp-pink: #cb7985;
-  --ctp-flamingo: #e85c51;
-  --ctp-rosewater: #ea9a97;
-  --ctp-blue: #5a93aa;
-  --ctp-sapphire: #5a93aa;
-  --ctp-sky: #a1cdd8;
-  --ctp-teal: #7aa4a1;
-  --ctp-green: #7aa4a1;
-  --ctp-yellow: #fda47f;
-  --ctp-peach: #ff8349;
-  --ctp-maroon: #e85c51;
-  --ctp-red: #e85c51;
-
-  --bg-app: #152528;
-  --bg-sidebar: #0f1c1e;
-  --bg-card: #1d3337;
-  --bg-hover: #254147;
-  --bg-player: #0f1c1e;
-  --bg-glass: rgba(21, 37, 40, 0.75);
-  --accent: #a1cdd8;
-  --accent-dim: rgba(161, 205, 216, 0.15);
-  --accent-glow: rgba(161, 205, 216, 0.3);
-  --text-primary: #e6eaea;
-  --text-secondary: #cbd9d8;
-  --text-muted: #6d7f8b;
-  --border: #254147;
-  --border-subtle: #1d3337;
-  --border-dropdown: #2d4f56;
-  --shadow-dropdown: rgba(0, 0, 0, 0.6);
-  --positive: #7aa4a1;
-  --warning: #fda47f;
-  --danger: #e85c51;
-}
-
diff --git a/src/styles/themes/the-matrix-morpheus.css b/src/styles/themes/the-matrix-morpheus.css
deleted file mode 100644
index 1ee13fc2..00000000
--- a/src/styles/themes/the-matrix-morpheus.css
+++ /dev/null
@@ -1,371 +0,0 @@
-/* ─── The Matrix — Morpheus ─── */
-[data-theme='morpheus'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2300ff41%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* ── Palette ── */
-  --ctp-crust: #000000;
-  --ctp-mantle: #020502;
-  --ctp-base: #050905;
-  --ctp-surface0: #0a120a;
-  --ctp-surface1: #0f1c0f;
-  --ctp-surface2: #162416;
-  --ctp-overlay0: #003b00;
-  --ctp-overlay1: #008f11;
-  --ctp-overlay2: #00cc33;
-  --ctp-text: #00ff41;
-  --ctp-subtext1: #00cc33;
-  --ctp-subtext0: #008f11;
-  --ctp-mauve: #00ff41;
-  --ctp-lavender: #adff2f;
-  --ctp-green: #00ff41;
-  --ctp-teal: #20c20e;
-  --ctp-sky: #00ff41;
-  --ctp-blue: #00ff41;
-  --ctp-sapphire: #008f11;
-  --ctp-pink: #003b00;
-  --ctp-flamingo: #003b00;
-  --ctp-rosewater: #d2ff00;
-  --ctp-yellow: #adff2f;
-  --ctp-peach: #00ff41;
-  --ctp-maroon: #003b00;
-  --ctp-red: #ff0033;
-
-  /* ── Semantic tokens ── */
-  --bg-app: #050905;
-  --bg-sidebar: #000000;
-  --bg-card: #0a120a;
-  --bg-hover: rgba(0, 255, 65, 0.10);
-  --bg-player: #000000;
-  --bg-glass: rgba(0, 8, 0, 0.96);
-  --accent: #00ff41;
-  --accent-dim: rgba(0, 255, 65, 0.12);
-  --accent-glow: rgba(0, 255, 65, 0.45);
-  --volume-accent: #00ff41;
-  --text-primary: #00ff41;
-  --text-secondary: #00cc33;
-  --text-muted: #22cc44;
-  --border: #003b00;
-  --border-subtle: #001a00;
-  --positive: #00ff41;
-  --warning: #adff2f;
-  --danger: #ff0033;
-  --radius-sm: 0px;
-  --radius-md: 0px;
-  --radius-lg: 2px;
-}
-
-/* ── App shell: solid dark base (scanlines moved to sidebar for perf) ── */
-[data-theme='morpheus'] .app-shell {
-  background-color: #050905;
-}
-
-/* ── Sidebar: black with code-column ghost pattern ── */
-[data-theme='morpheus'] .sidebar {
-  background-color: #000000;
-  background-image: repeating-linear-gradient(90deg, transparent 0px, transparent 19px,
-      rgba(0, 255, 65, 0.03) 19px, rgba(0, 255, 65, 0.03) 20px);
-  border-right: 1px solid #003b00;
-}
-
-/* Nav links */
-[data-theme='morpheus'] .nav-link {
-  color: #00cc33;
-}
-
-[data-theme='morpheus'] .nav-link:hover {
-  background: rgba(0, 255, 65, 0.08);
-  color: #00ff41;
-  text-shadow: 0 0 8px rgba(0, 255, 65, 0.50);
-}
-
-[data-theme='morpheus'] .nav-link.active {
-  background: rgba(0, 255, 65, 0.10);
-  color: #00ff41;
-  text-shadow: 0 0 6px rgba(0, 255, 65, 0.45);
-}
-
-[data-theme='morpheus'] .nav-link.active::before {
-  background: #00ff41;
-  box-shadow: 0 0 8px rgba(0, 255, 65, 0.70);
-}
-
-[data-theme='morpheus'] .nav-section-label {
-  color: #003b00;
-}
-
-/* ── Player bar: black glass with phosphor glow ── */
-[data-theme='morpheus'] .player-bar {
-  background: #000000;
-  border-top: 1px solid rgba(0, 255, 65, 0.35);
-  box-shadow:
-    inset 0 1px 0 rgba(0, 255, 65, 0.12),
-    0 -4px 24px rgba(0, 255, 65, 0.06);
-}
-
-/* Track info: phosphor CRT glow */
-[data-theme='morpheus'] .player-track-name {
-  font-family: 'JetBrains Mono', 'Fira Code', 'Courier New', monospace;
-  color: #00ff41;
-  text-shadow: 0 0 10px rgba(0, 255, 65, 0.70), 0 0 20px rgba(0, 255, 65, 0.30);
-  letter-spacing: 0.04em;
-}
-
-[data-theme='morpheus'] .player-track-artist,
-[data-theme='morpheus'] .player-time {
-  font-family: 'JetBrains Mono', 'Courier New', monospace;
-  color: #00cc33;
-  opacity: 0.85;
-}
-
-/* ── Transport buttons: terminal command style ── */
-[data-theme='morpheus'] .player-btn,
-[data-theme='morpheus'] .player-btn-primary {
-  background: #000000;
-  color: #00ff41;
-  border: 1px solid #003b00;
-  border-radius: 2px;
-  box-shadow: inset 0 0 6px rgba(0, 255, 65, 0.05);
-}
-
-[data-theme='morpheus'] .player-btn:hover,
-[data-theme='morpheus'] .player-btn-primary:hover {
-  background: rgba(0, 255, 65, 0.08);
-  border-color: #00ff41;
-  box-shadow:
-    0 0 12px rgba(0, 255, 65, 0.35),
-    inset 0 0 8px rgba(0, 255, 65, 0.08);
-  color: #00ff41;
-}
-
-/* ── All buttons: terminal style ── */
-[data-theme='morpheus'] .btn,
-[data-theme='morpheus'] .btn-surface,
-[data-theme='morpheus'] .btn-ghost,
-[data-theme='morpheus'] .btn-primary,
-[data-theme='morpheus'] .hero-play-btn,
-[data-theme='morpheus'] .album-card-details-btn,
-[data-theme='morpheus'] .queue-round-btn {
-  background: #000000;
-  color: #00ff41;
-  border: 1px solid #003b00;
-  border-radius: 0;
-  font-family: 'JetBrains Mono', 'Courier New', monospace;
-  box-shadow: none;
-}
-
-[data-theme='morpheus'] .btn:hover,
-[data-theme='morpheus'] .btn-surface:hover,
-[data-theme='morpheus'] .btn-ghost:hover,
-[data-theme='morpheus'] .btn-primary:hover,
-[data-theme='morpheus'] .hero-play-btn:hover,
-[data-theme='morpheus'] .album-card-details-btn:hover {
-  background: rgba(0, 255, 65, 0.08);
-  border-color: #00ff41;
-  color: #00ff41;
-  box-shadow: 0 0 10px rgba(0, 255, 65, 0.28), inset 0 0 8px rgba(0, 255, 65, 0.05);
-}
-
-[data-theme='morpheus'] .btn-primary {
-  border-color: #00cc33;
-  box-shadow: 0 0 8px rgba(0, 255, 65, 0.20);
-}
-
-[data-theme='morpheus'] .btn-primary:hover {
-  border-color: #00ff41;
-  box-shadow: 0 0 16px rgba(0, 255, 65, 0.45), inset 0 0 10px rgba(0, 255, 65, 0.08);
-}
-
-/* Queue round button active: bright green */
-[data-theme='morpheus'] .queue-round-btn:hover:not(:disabled):not(.active) {
-  background: rgba(0, 255, 65, 0.08);
-  border-color: #00ff41;
-  color: #00ff41;
-  box-shadow: 0 0 10px rgba(0, 255, 65, 0.28);
-}
-
-[data-theme='morpheus'] .queue-round-btn.active {
-  background: rgba(0, 255, 65, 0.15);
-  border-color: #00ff41;
-  color: #00ff41;
-  box-shadow: 0 0 12px rgba(0, 255, 65, 0.40), inset 0 0 8px rgba(0, 255, 65, 0.08);
-}
-
-/* ── Cards: dark terminal panels ── */
-[data-theme='morpheus'] .card {
-  background: #0a120a;
-  border: 1px solid #003b00;
-  border-radius: 0;
-  box-shadow: inset 0 0 24px rgba(0, 255, 65, 0.02), 0 0 12px rgba(0, 0, 0, 0.60);
-}
-
-/* ── Content header: terminal prompt bar ── */
-[data-theme='morpheus'] .content-header {
-  background: #000000;
-  border-bottom: 1px solid rgba(0, 255, 65, 0.25);
-  box-shadow: 0 2px 16px rgba(0, 255, 65, 0.04);
-}
-
-/* ── Theme accordion: terminal hover ── */
-[data-theme='morpheus'] .theme-accordion-header:hover {
-  background: rgba(0, 255, 65, 0.08);
-  color: #00ff41;
-  text-shadow: 0 0 6px rgba(0, 255, 65, 0.40);
-}
-
-[data-theme='morpheus'] .theme-accordion-open .theme-accordion-header {
-  background: rgba(0, 255, 65, 0.10);
-  color: #00ff41;
-}
-
-[data-theme='morpheus'] .theme-accordion-open .theme-accordion-chevron {
-  color: #00ff41;
-}
-
-/* ── Progress bar: terminal loading bar ── */
-[data-theme='morpheus'] .progress-bar-track {
-  background: #001a00;
-  border: 1px solid #003b00;
-  border-radius: 0;
-}
-
-[data-theme='morpheus'] .progress-bar-fill {
-  background: #00ff41;
-  border-radius: 0;
-  box-shadow: 0 0 8px rgba(0, 255, 65, 0.60), 0 0 2px rgba(0, 255, 65, 1);
-}
-
-/* ── Scrollbar: CRT terminal style ── */
-[data-theme='morpheus'] ::-webkit-scrollbar {
-  width: 6px;
-  height: 6px;
-}
-
-[data-theme='morpheus'] ::-webkit-scrollbar-track {
-  background: #000000;
-}
-
-[data-theme='morpheus'] ::-webkit-scrollbar-thumb {
-  background: #003b00;
-  border: 1px solid rgba(0, 255, 65, 0.30);
-}
-
-[data-theme='morpheus'] ::-webkit-scrollbar-thumb:hover {
-  background: rgba(0, 255, 65, 0.25);
-  box-shadow: 0 0 6px rgba(0, 255, 65, 0.40);
-}
-
-/* ── Glass / dropdowns: black terminal window ── */
-[data-theme='morpheus'] .glass {
-  background: rgba(0, 8, 0, 0.97) !important;
-  backdrop-filter: none !important;
-  border: 1px solid rgba(0, 255, 65, 0.28) !important;
-  box-shadow:
-    0 0 20px rgba(0, 255, 65, 0.08),
-    inset 0 0 16px rgba(0, 255, 65, 0.02) !important;
-  border-radius: 0 !important;
-}
-
-[data-theme='morpheus'] .glass [style*="var(--bg-hover)"] {
-  background: rgba(0, 255, 65, 0.10) !important;
-  border-radius: 0 !important;
-}
-
-[data-theme='morpheus'] .glass [style*="var(--text-primary)"] {
-  color: #00ff41 !important;
-}
-
-[data-theme='morpheus'] .glass [style*="var(--text-secondary)"] {
-  color: #00cc33 !important;
-}
-
-[data-theme='morpheus'] .glass [style*="var(--text-muted)"] {
-  color: #006b10 !important;
-}
-
-/* ── Hover / selection: phosphor glow highlight ── */
-[data-theme='morpheus'] .queue-tab-btn:hover {
-  background: rgba(0, 255, 65, 0.08);
-  color: #00ff41;
-  text-shadow: 0 0 6px rgba(0, 255, 65, 0.40);
-}
-
-[data-theme='morpheus'] .settings-tab:hover {
-  background: rgba(0, 255, 65, 0.08);
-  color: #00ff41;
-}
-
-[data-theme='morpheus'] .settings-tab.active {
-  background: rgba(0, 255, 65, 0.12);
-  color: #00ff41;
-  box-shadow: inset 2px 0 0 #00ff41;
-}
-
-[data-theme='morpheus'] .custom-select-trigger:hover {
-  background: rgba(0, 255, 65, 0.08);
-}
-
-[data-theme='morpheus'] .custom-select-option:hover {
-  background: rgba(0, 255, 65, 0.12) !important;
-  color: #00ff41 !important;
-  text-shadow: 0 0 6px rgba(0, 255, 65, 0.40) !important;
-}
-
-[data-theme='morpheus'] .artist-ext-link:hover {
-  background: rgba(0, 255, 65, 0.10);
-  color: #00ff41 !important;
-  border-color: #00ff41 !important;
-  text-shadow: 0 0 6px rgba(0, 255, 65, 0.40);
-}
-
-[data-theme='morpheus'] .np-action-btn:hover {
-  background: rgba(0, 255, 65, 0.08);
-}
-
-[data-theme='morpheus'] .np-queue-item:hover,
-[data-theme='morpheus'] .np-queue-item.context-active {
-  background: rgba(0, 255, 65, 0.10);
-  box-shadow: inset 2px 0 0 #00ff41;
-}
-
-[data-theme='morpheus'] .track-row:hover,
-[data-theme='morpheus'] .track-row.context-active {
-  background: rgba(0, 255, 65, 0.08) !important;
-  box-shadow: inset 2px 0 0 #00ff41;
-}
-
-[data-theme='morpheus'] .artist-row:hover {
-  background: rgba(0, 255, 65, 0.08);
-  box-shadow: inset 2px 0 0 #00ff41;
-}
-
-[data-theme='morpheus'] .playlist-row:hover {
-  background: rgba(0, 255, 65, 0.08);
-  box-shadow: inset 2px 0 0 #00ff41;
-}
-
-[data-theme='morpheus'] .queue-item:hover,
-[data-theme='morpheus'] .queue-item.context-active {
-  background: rgba(0, 255, 65, 0.10) !important;
-  box-shadow: inset 2px 0 0 #00ff41;
-}
-
-/* ── Active queue item: glowing green ── */
-[data-theme='morpheus'] .queue-item.active {
-  background: rgba(0, 255, 65, 0.08);
-  box-shadow: inset 2px 0 0 #00ff41, 0 0 8px rgba(0, 255, 65, 0.06);
-}
-
-[data-theme='morpheus'] .np-queue-item-active {
-  text-shadow: 0 0 8px rgba(0, 255, 65, 0.60);
-}
-
-[data-theme='morpheus'] .np-queue-item.active {
-  background: rgba(0, 255, 65, 0.08);
-}
-
-[data-theme='morpheus'] .np-album-track.active .np-album-track-title,
-[data-theme='morpheus'] .np-album-track.active .np-album-track-num {
-  text-shadow: 0 0 8px rgba(0, 255, 65, 0.60);
-}
-
diff --git a/src/styles/themes/ubuntu-ambiance-component-level-overrides.css b/src/styles/themes/ubuntu-ambiance-component-level-overrides.css
deleted file mode 100644
index 54d93644..00000000
--- a/src/styles/themes/ubuntu-ambiance-component-level-overrides.css
+++ /dev/null
@@ -1,313 +0,0 @@
-/* ─── Ubuntu Ambiance — component-level overrides ─────────────────────── */
-
-/* Column resize grip — was #e4dfd8 on #ede8e2 = 1.08:1 (invisible)
-   Use the warm grey overlay tone, 2.5:1 — works for a light theme grip. */
-[data-theme='ubuntu-ambiance'] .col-resize-handle::after {
-  background: #a89080;
-  width: 2px;
-}
-
-/* Focus ring — keyboard navigation, Ubuntu Orange at AAA against light bg
-   for the outline itself (not text, so 3:1 UI threshold applies). */
-[data-theme='ubuntu-ambiance'] *:focus-visible {
-  outline: 2px solid #e95420;
-  outline-offset: 2px;
-}
-
-/* Scrollbar thumb — visible against warm off-white */
-[data-theme='ubuntu-ambiance'] ::-webkit-scrollbar-thumb {
-  background: #a89080;
-}
-[data-theme='ubuntu-ambiance'] *:hover::-webkit-scrollbar-thumb,
-[data-theme='ubuntu-ambiance'] .is-scrolling::-webkit-scrollbar-thumb {
-  background: #7d6e68;
-}
-
-/* ── App shell: warm Ambiance off-white ── */
-[data-theme='ubuntu-ambiance'] .app-shell {
-  background: #f4efea;
-}
-
-/* ── Sidebar: Unity Launcher dark aubergine ── */
-[data-theme='ubuntu-ambiance'] .sidebar {
-  background: linear-gradient(180deg, #3d1f3d 0%, #2e162e 100%);
-  border-right: 1px solid #1a0a1a;
-  box-shadow: 2px 0 10px rgba(0, 0, 0, 0.35);
-}
-
-/* Sidebar text: light on dark aubergine */
-[data-theme='ubuntu-ambiance'] .sidebar-logo-text,
-[data-theme='ubuntu-ambiance'] .nav-link,
-[data-theme='ubuntu-ambiance'] .sidebar-bottom a,
-[data-theme='ubuntu-ambiance'] .sidebar-bottom button {
-  color: rgba(255, 255, 255, 0.72);
-}
-
-[data-theme='ubuntu-ambiance'] .nav-link:hover {
-  background: rgba(255, 255, 255, 0.09);
-  color: #ffffff;
-}
-
-[data-theme='ubuntu-ambiance'] .nav-link.active {
-  background: rgba(233, 84, 32, 0.22);
-  color: #ffffff;
-}
-
-[data-theme='ubuntu-ambiance'] .nav-link.active::before {
-  background: #e95420;
-  box-shadow: 0 0 8px rgba(233, 84, 32, 0.60);
-}
-
-[data-theme='ubuntu-ambiance'] {
-  --logo-color-start: #ffffff;
-  --logo-color-end: #ffb090;
-}
-
-[data-theme='ubuntu-ambiance'] .sidebar-logo-icon {
-  color: #e95420;
-}
-
-/* Sidebar version / muted labels */
-[data-theme='ubuntu-ambiance'] .sidebar-version,
-[data-theme='ubuntu-ambiance'] .update-toast {
-  color: rgba(255, 255, 255, 0.40);
-}
-
-/* ── Player bar: Ubuntu panel — darkest aubergine ── */
-[data-theme='ubuntu-ambiance'] .player-bar {
-  background: linear-gradient(180deg, #2c001e 0%, #1a000f 100%);
-  border-top: 1px solid #3d0828;
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.06),
-    0 -3px 16px rgba(0, 0, 0, 0.50);
-}
-
-/* Player text: light on dark panel */
-[data-theme='ubuntu-ambiance'] .player-track-name {
-  color: #ffffff;
-  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
-}
-
-[data-theme='ubuntu-ambiance'] .player-track-artist {
-  color: rgba(255, 255, 255, 0.60);
-  opacity: 1;
-}
-
-[data-theme='ubuntu-ambiance'] .player-time {
-  color: rgba(255, 255, 255, 0.65);
-}
-
-/* Transport buttons: Ubuntu Orange on dark panel */
-[data-theme='ubuntu-ambiance'] .player-btn,
-[data-theme='ubuntu-ambiance'] .player-btn-primary {
-  background: linear-gradient(180deg, #f06030 0%, #e95420 50%, #d44418 100%);
-  color: #ffffff;
-  border: 1px solid #b83010;
-  box-shadow:
-    0 2px 6px rgba(0, 0, 0, 0.50),
-    inset 0 1px 0 rgba(255, 255, 255, 0.25),
-    inset 0 -1px 0 rgba(0, 0, 0, 0.20);
-}
-
-[data-theme='ubuntu-ambiance'] .player-btn:hover,
-[data-theme='ubuntu-ambiance'] .player-btn-primary:hover {
-  background: linear-gradient(180deg, #f87040 0%, #f06030 50%, #e04828 100%);
-  box-shadow:
-    0 3px 8px rgba(0, 0, 0, 0.50),
-    inset 0 1px 0 rgba(255, 255, 255, 0.30),
-    inset 0 -1px 0 rgba(0, 0, 0, 0.15);
-}
-
-/* ── Content area buttons: Ambiance GTK style ── */
-[data-theme='ubuntu-ambiance'] .btn {
-  background: linear-gradient(180deg, #f0ebe5 0%, #e4dfd8 100%);
-  color: #3d2b2b;
-  border: 1px solid #b8a898;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.70), 0 1px 2px rgba(0, 0, 0, 0.15);
-}
-
-[data-theme='ubuntu-ambiance'] .btn:hover {
-  background: linear-gradient(180deg, #f8f3ed 0%, #ede8e2 100%);
-  border-color: #a89888;
-}
-
-[data-theme='ubuntu-ambiance'] .btn-primary {
-  background: linear-gradient(180deg, #f06030 0%, #e95420 100%);
-  color: #ffffff;
-  border: 1px solid #b83010;
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.22),
-    0 1px 3px rgba(0, 0, 0, 0.25),
-    0 0 0 0px rgba(233, 84, 32, 0);
-}
-
-[data-theme='ubuntu-ambiance'] .btn-primary:hover {
-  background: linear-gradient(180deg, #f87040 0%, #f06030 100%);
-}
-
-/* ── Content header: warm Ambiance title band ── */
-[data-theme='ubuntu-ambiance'] .content-header {
-  background: linear-gradient(180deg, rgba(244, 239, 234, 1) 0%, rgba(237, 232, 226, 0.60) 100%);
-  border-bottom: 1px solid #c8b8a8;
-}
-
-/* ── Cards / panels ── */
-[data-theme='ubuntu-ambiance'] .glass,
-[data-theme='ubuntu-ambiance'] .card {
-  background: rgba(237, 232, 226, 0.88);
-  border: 1px solid #c8b8a8;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.60), 0 1px 4px rgba(0, 0, 0, 0.10);
-}
-
-/* ── Hover / active states: orange accent ── */
-[data-theme='ubuntu-ambiance'] .track-row:hover,
-[data-theme='ubuntu-ambiance'] .track-row.context-active {
-  background: rgba(233, 84, 32, 0.07);
-  box-shadow: inset 3px 0 0 #e95420;
-}
-
-[data-theme='ubuntu-ambiance'] .queue-item:hover,
-[data-theme='ubuntu-ambiance'] .queue-item.context-active {
-  background: rgba(233, 84, 32, 0.07);
-}
-
-[data-theme='ubuntu-ambiance'] .queue-item.active {
-  background: rgba(233, 84, 32, 0.12);
-  border-left: 2px solid #e95420;
-}
-
-[data-theme='ubuntu-ambiance'] .np-queue-item.active {
-  background: rgba(233, 84, 32, 0.08);
-}
-
-[data-theme='ubuntu-ambiance'] .np-queue-item-active {
-  color: #e95420;
-}
-
-[data-theme='ubuntu-ambiance'] .np-queue-item:hover,
-[data-theme='ubuntu-ambiance'] .np-queue-item.context-active {
-  background: rgba(233, 84, 32, 0.06);
-}
-
-[data-theme='ubuntu-ambiance'] .np-album-track.active .np-album-track-title,
-[data-theme='ubuntu-ambiance'] .np-album-track.active .np-album-track-num {
-  color: #e95420;
-}
-
-[data-theme='ubuntu-ambiance'] .artist-row:hover {
-  background: rgba(233, 84, 32, 0.06);
-  box-shadow: inset 3px 0 0 #e95420;
-}
-
-[data-theme='ubuntu-ambiance'] .playlist-row:hover {
-  background: rgba(233, 84, 32, 0.06);
-  box-shadow: inset 3px 0 0 #e95420;
-}
-
-[data-theme='ubuntu-ambiance'] .settings-tab:hover {
-  background: rgba(233, 84, 32, 0.08);
-  color: #e95420;
-}
-
-[data-theme='ubuntu-ambiance'] .settings-tab.active {
-  background: rgba(233, 84, 32, 0.14);
-  color: #e95420;
-  border-color: #e95420;
-}
-
-[data-theme='ubuntu-ambiance'] .queue-tab-btn:hover {
-  background: rgba(233, 84, 32, 0.08);
-  color: #e95420;
-}
-
-[data-theme='ubuntu-ambiance'] .custom-select-trigger:hover {
-  background: rgba(233, 84, 32, 0.07);
-}
-
-[data-theme='ubuntu-ambiance'] .custom-select-option:hover {
-  background: rgba(233, 84, 32, 0.10);
-}
-
-[data-theme='ubuntu-ambiance'] .artist-ext-link:hover {
-  background: rgba(233, 84, 32, 0.09);
-  border-color: #e95420;
-}
-
-/* Queue panel on dark player area */
-[data-theme='ubuntu-ambiance'] .queue-round-btn.active {
-  color: #ffffff;
-}
-
-/* Connection indicators: warm muted on light bg */
-[data-theme='ubuntu-ambiance'] .connection-type,
-[data-theme='ubuntu-ambiance'] .connection-server {
-  color: #907860;
-}
-
-/* ── Album chip: opaque orange pill so it reads on both dark hero and light bg ── */
-[data-theme='ubuntu-ambiance'] .badge,
-[data-theme='ubuntu-ambiance'] .album-detail-badge {
-  background: #e95420;
-  color: #ffffff;
-}
-
-/* ── Queue panel: on dark aubergine bg — all text must be light ── */
-/* Header + toolbar sit on --bg-app (light) — fine as-is */
-/* List, meta box, divider sit on --bg-sidebar (dark aubergine) */
-
-[data-theme='ubuntu-ambiance'] .queue-item-title {
-  color: rgba(255, 255, 255, 0.88);
-}
-
-[data-theme='ubuntu-ambiance'] .queue-item-artist,
-[data-theme='ubuntu-ambiance'] .queue-item-duration {
-  color: rgba(255, 255, 255, 0.52);
-}
-
-[data-theme='ubuntu-ambiance'] .queue-item.active .queue-item-artist,
-[data-theme='ubuntu-ambiance'] .queue-item.active .queue-item-duration {
-  color: rgba(255, 255, 255, 0.72);
-}
-
-[data-theme='ubuntu-ambiance'] .queue-divider span {
-  color: rgba(255, 255, 255, 0.40) !important;
-}
-
-/* Meta box (current track info) on dark aubergine */
-[data-theme='ubuntu-ambiance'] .queue-current-info h3 {
-  color: rgba(255, 255, 255, 0.92);
-}
-
-[data-theme='ubuntu-ambiance'] .queue-current-sub {
-  color: rgba(255, 255, 255, 0.55);
-}
-
-[data-theme='ubuntu-ambiance'] .queue-current-cover .fallback {
-  color: rgba(255, 255, 255, 0.35);
-}
-
-/* Tabs sit on dark bg too */
-[data-theme='ubuntu-ambiance'] .queue-tab-btn {
-  color: rgba(255, 255, 255, 0.60);
-}
-
-[data-theme='ubuntu-ambiance'] .queue-tab-btn:hover {
-  background: rgba(255, 255, 255, 0.08);
-  color: rgba(255, 255, 255, 0.90);
-}
-
-[data-theme='ubuntu-ambiance'] .queue-tab-btn.active {
-  color: #e95420;
-}
-
-/* Action buttons in header (on light --bg-app) */
-[data-theme='ubuntu-ambiance'] .queue-action-btn {
-  color: #7d6e68;
-}
-
-[data-theme='ubuntu-ambiance'] .queue-action-btn:hover:not(:disabled) {
-  color: #3d2b2b;
-}
-
-/* ─────────────────────────────────────────── */
-
diff --git a/src/styles/themes/ubuntu-unity-ambiance-classic-light.css b/src/styles/themes/ubuntu-unity-ambiance-classic-light.css
deleted file mode 100644
index 1aaf2ab9..00000000
--- a/src/styles/themes/ubuntu-unity-ambiance-classic-light.css
+++ /dev/null
@@ -1,77 +0,0 @@
-/* ─── Ubuntu — Unity Ambiance (Classic Light) ─── */
-/* Warm human desktop: aubergine launcher + orange accent + warm off-white content */
-[data-theme='ubuntu-ambiance'] {
-  color-scheme: light;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%237d6e68%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* ── Palette — warm human spectrum ── */
-  --ctp-crust: #1a000f;
-  /* panel blackout aubergine */
-  --ctp-mantle: #2c001e;
-  /* Ubuntu top/bottom panel */
-  --ctp-base: #f4efea;
-  /* Ambiance window warm off-white */
-  --ctp-surface0: #ede8e2;
-  --ctp-surface1: #e4dfd8;
-  --ctp-surface2: #d8d0c8;
-  --ctp-overlay0: #c0b0a0;
-  --ctp-overlay1: #a89080;
-  --ctp-overlay2: #907870;
-  --ctp-text: #3d2b2b;
-  /* warm dark brown — human, not pure black */
-  --ctp-subtext1: #5d4e48;
-  --ctp-subtext0: #7d6e68;
-  /* Ubuntu color spectrum */
-  --ctp-mauve: #e95420;
-  /* Ubuntu Orange — the soul of Ubuntu */
-  --ctp-lavender: #f06030;
-  --ctp-sky: #f07050;
-  --ctp-peach: #e95420;
-  --ctp-teal: #06989a;
-  --ctp-blue: #3465a4;
-  --ctp-sapphire: #204a87;
-  --ctp-green: #4e9a06;
-  /* Ubuntu success green */
-  --ctp-yellow: #c4a000;
-  --ctp-pink: #cc1e4a;
-  --ctp-flamingo: #a52828;
-  --ctp-maroon: #800000;
-  --ctp-red: #cc0000;
-  --ctp-rosewater: #cc4444;
-
-  /* ── Semantic tokens ──
-     Contrast audit (vs. --bg-app #f4efea, L≈0.868):
-       text-primary   11.7:1 AAA ✓
-       text-secondary  7.0:1 AAA ✓
-       text-muted      5.4:1 AA  ✓ (raised from 4.4:1 — was below AA)
-       positive        4.7:1 AA  ✓ (raised from 3.1:1)
-       warning         5.4:1 AA  ✓ (raised from 2.2:1 — was below all thresholds)
-       danger          5.2:1 AA  ✓
-       accent (orange) 3.2:1 UI  ✓ (Ubuntu brand, text-on-orange needs dark fg)
-  */
-  --bg-app: #f4efea;
-  /* warm Ambiance window */
-  --bg-sidebar: #3d1f3d;
-  /* Unity Launcher — dark aubergine */
-  --bg-card: #ede8e2;
-  --bg-hover: #e4ddd5;
-  --bg-player: #2c001e;
-  /* Ubuntu panel — blackest aubergine */
-  --bg-glass: rgba(244, 239, 234, 0.94);
-  --accent: #e95420;
-  /* Ubuntu Orange — brand identity, 3.2:1 UI-pass (prefer dark fg on orange) */
-  --accent-dim: rgba(233, 84, 32, 0.12);
-  --accent-glow: rgba(233, 84, 32, 0.30);
-  --text-primary: #3d2b2b;
-  --text-secondary: #5d4e48;
-  --text-muted: #6a5a53;     /* 5.4:1 AA ✓, was #7d6e68 at 4.4:1 (below AA) */
-  --border: #a89080;         /* 2.5:1, consistent with Ubuntu Warm Grey */
-  --border-subtle: #c8bbac;  /* ~1.7:1 structural but perceptible */
-  --positive: #2e7a00;       /* 4.7:1 AA ✓, darkened from #4e9a06 (3.1:1) */
-  --warning: #855900;        /* 5.4:1 AA ✓, warm amber matching palette, was #c4a000 (2.2:1) */
-  --danger: #cc0000;         /* 5.2:1 AA ✓ */
-  --waveform-played:   #e95420;
-  --waveform-buffered: #a89080;
-  --waveform-unplayed: #d8d0c8;
-}
-
diff --git a/src/styles/themes/unix-shell.css b/src/styles/themes/unix-shell.css
deleted file mode 100644
index f6caf036..00000000
--- a/src/styles/themes/unix-shell.css
+++ /dev/null
@@ -1,627 +0,0 @@
-/* ─── Unix Shell ─── */
-@keyframes unix-cursor-blink {
-
-  0%,
-  49% {
-    opacity: 1;
-  }
-
-  50%,
-  100% {
-    opacity: 0;
-  }
-}
-
-[data-theme='unix'] {
-  color-scheme: dark;
-  font-family: 'Courier New', Courier, 'Lucida Console', monospace;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2322C55E%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* ANSI colors mapped to semantic palette */
-  --ctp-crust: #000000;
-  --ctp-mantle: #0a0a0a;
-  --ctp-base: #111111;
-  --ctp-surface0: #1a1a1a;
-  --ctp-surface1: #222222;
-  --ctp-surface2: #2e2e2e;
-  --ctp-overlay0: #666666;
-  --ctp-overlay1: #888888;
-  --ctp-overlay2: #AAAAAA;
-  --ctp-text: #C8C8C8;
-  --ctp-subtext1: #AAAAAA;
-  --ctp-subtext0: #888888;
-  --ctp-mauve: #C678DD;
-  --ctp-lavender: #5588FF;
-  --ctp-pink: #E06C75;
-  --ctp-flamingo: #FF6B6B;
-  --ctp-rosewater: #FFFFFF;
-  --ctp-green: #22C55E;
-  --ctp-teal: #55FFFF;
-  --ctp-sky: #55FFFF;
-  --ctp-blue: #5588FF;
-  --ctp-sapphire: #5588FF;
-  --ctp-yellow: #E5C07B;
-  --ctp-peach: #E06C75;
-  --ctp-maroon: #AA0000;
-  --ctp-red: #E06C75;
-
-  --bg-app: #000000;
-  --bg-sidebar: #0a0a0a;
-  --bg-card: #111111;
-  --bg-hover: #1a1a1a;
-  --bg-player: #000000;
-  --bg-glass: rgba(0, 0, 0, 0.92);
-  --accent: #22C55E;
-  --accent-dim: rgba(34, 197, 94, 0.10);
-  --accent-glow: rgba(34, 197, 94, 0.25);
-  --text-primary: #C8C8C8;
-  --text-secondary: #999999;
-  --text-muted: #666666;
-  --border: #222222;
-  --border-subtle: #1a1a1a;
-  --border-dropdown: #333333;
-  --shadow-dropdown: rgba(0, 0, 0, 0.95);
-  --positive: #22C55E;
-  --warning: #E5C07B;
-  --danger: #E06C75;
-  --radius-sm: 0px;
-  --radius-md: 0px;
-  --radius-lg: 0px;
-  --radius-full: 0px;
-}
-
-/* Monospace override — html inherits to most elements; form controls need explicit override */
-[data-theme='unix'] button,
-[data-theme='unix'] input,
-[data-theme='unix'] textarea,
-[data-theme='unix'] select {
-  font-family: 'Courier New', Courier, 'Lucida Console', monospace;
-}
-
-/* Sidebar — slightly off-black, thin separator */
-[data-theme='unix'] .sidebar {
-  background: #0a0a0a;
-  border-right: 1px solid #222222;
-}
-
-/* Nav active — green left bar */
-[data-theme='unix'] .nav-link.active {
-  background: rgba(34, 197, 94, 0.10);
-  border-left: 2px solid #22C55E;
-  color: #22C55E;
-}
-
-[data-theme='unix'] .nav-link:hover:not(.active) {
-  background: rgba(34, 197, 94, 0.05);
-  color: #C8C8C8;
-}
-
-/* Player bar — pure black, thin grey separator */
-[data-theme='unix'] .player-bar {
-  background-color: #000000;
-  background-image: repeating-linear-gradient(0deg,
-      rgba(0, 0, 0, 0.10) 0px,
-      rgba(0, 0, 0, 0.10) 1px,
-      transparent 1px,
-      transparent 2px);
-  border-top: 1px solid #222222;
-  box-shadow: none;
-}
-
-/* Track name — white text, green $ prompt prefix, blinking _ cursor */
-[data-theme='unix'] .player-track-name {
-  color: #FFFFFF;
-  text-shadow: none;
-}
-
-[data-theme='unix'] .player-track-name::before {
-  content: '$ ';
-  color: #22C55E;
-  font-weight: 700;
-}
-
-[data-theme='unix'] .player-track-name::after {
-  content: '_';
-  animation: unix-cursor-blink 1s step-end infinite;
-  color: #C8C8C8;
-  margin-left: 1px;
-}
-
-/* Artist name — ANSI bright blue (ls directory color) */
-[data-theme='unix'] .player-artist-name {
-  color: #5588FF;
-}
-
-/* Content header — minimal grey rule */
-[data-theme='unix'] .content-header {
-  border-bottom: 1px solid #1e1e1e;
-}
-
-/* Album/artist cards — dark panel, fine border */
-[data-theme='unix'] .album-card,
-[data-theme='unix'] .artist-card {
-  background: #111111;
-  border: 1px solid #1e1e1e;
-  box-shadow: none;
-}
-
-[data-theme='unix'] .album-card:hover,
-[data-theme='unix'] .artist-card:hover {
-  background: #1a1a1a;
-  border-color: #22C55E;
-  box-shadow: none;
-}
-
-/* Track / queue row hover — green left accent */
-[data-theme='unix'] .track-row:hover,
-[data-theme='unix'] .queue-item:hover {
-  background: rgba(34, 197, 94, 0.06);
-  box-shadow: inset 2px 0 0 #22C55E;
-}
-
-/* Primary play button — solid green */
-[data-theme='unix'] .player-btn-primary {
-  background: #22C55E;
-  color: #000000;
-  border: none;
-  box-shadow: none;
-}
-
-[data-theme='unix'] .player-btn-primary:hover {
-  background: #16A34A;
-  box-shadow: none;
-  transform: none;
-}
-
-/* btn-primary */
-[data-theme='unix'] .btn-primary {
-  background: #22C55E;
-  color: #000000;
-  border: none;
-  box-shadow: none;
-}
-
-[data-theme='unix'] .btn-primary:hover {
-  background: #16A34A;
-  box-shadow: none;
-}
-
-/* Hero play button */
-[data-theme='unix'] .hero-play-btn {
-  background: #22C55E;
-  color: #000000;
-  border: none;
-  text-transform: lowercase;
-  letter-spacing: 0.02em;
-  box-shadow: none;
-  transition: background var(--transition-fast), transform var(--transition-fast);
-}
-
-[data-theme='unix'] .hero-play-btn:hover {
-  background: #16A34A;
-  transform: scale(1.02);
-  filter: none;
-  box-shadow: none;
-}
-
-/* Album card overlay button */
-[data-theme='unix'] .album-card-details-btn {
-  background: #22C55E;
-  color: #000000;
-  border: none;
-  box-shadow: none;
-}
-
-[data-theme='unix'] .album-card-details-btn:hover {
-  background: #16A34A;
-}
-
-/* Queue round buttons */
-[data-theme='unix'] .queue-round-btn {
-  border: 1px solid #222222;
-  box-shadow: none;
-}
-
-[data-theme='unix'] .queue-round-btn.active {
-  background: #22C55E;
-  color: #000000;
-  border-color: #22C55E;
-  box-shadow: none;
-}
-
-/* Input fields */
-[data-theme='unix'] input,
-[data-theme='unix'] textarea {
-  background: #0a0a0a;
-  border: 1px solid #222222;
-  border-radius: 0;
-}
-
-[data-theme='unix'] input:focus,
-[data-theme='unix'] textarea:focus {
-  border-color: #22C55E;
-  outline: none;
-  box-shadow: none;
-}
-
-/* Scrollbar — thin 6px, modern terminal style */
-[data-theme='unix'] ::-webkit-scrollbar {
-  width: 6px;
-  height: 6px;
-}
-
-[data-theme='unix'] ::-webkit-scrollbar-track {
-  background: #0a0a0a;
-}
-
-[data-theme='unix'] ::-webkit-scrollbar-thumb {
-  background: #333333;
-  border-radius: 0;
-}
-
-[data-theme='unix'] ::-webkit-scrollbar-thumb:hover {
-  background: #22C55E;
-}
-
-/* Connection indicator — server name and Last.fm username */
-[data-theme='unix'] .connection-type,
-[data-theme='unix'] .connection-server {
-  color: #888888;
-}
-
-/* Connection indicators + Now Playing username */
-[data-theme='spider-tech'] .connection-type,
-[data-theme='spider-tech'] .connection-server {
-  color: #9080a8;
-}
-
-/* Connection indicators */
-[data-theme='dos'] .connection-type,
-[data-theme='dos'] .connection-server {
-  color: #AAAAAA;
-}
-
-/* Track row hover — all child text to navy so nothing drowns on grey */
-[data-theme='dos'] .track-row:hover .track-title,
-[data-theme='dos'] .track-row:hover .track-num,
-[data-theme='dos'] .track-row:hover .track-artist,
-[data-theme='dos'] .track-row:hover .track-duration,
-[data-theme='dos'] .track-row:hover .track-codec,
-[data-theme='dos'] .track-row:hover button,
-[data-theme='dos'] .track-row.context-active .track-title,
-[data-theme='dos'] .track-row.context-active .track-num,
-[data-theme='dos'] .track-row.context-active .track-artist,
-[data-theme='dos'] .track-row.context-active .track-duration,
-[data-theme='dos'] .track-row.context-active .track-codec,
-[data-theme='dos'] .track-row.context-active button {
-  color: #000080 !important;
-  background: transparent !important;
-}
-
-/* ═══════════════════════════════════════════════════════════════════
-   HORDE — World of Warcraft, Durotar blood-red earth, forge-fire
-   ═══════════════════════════════════════════════════════════════════ */
-[data-theme='horde'] {
-  /* Catppuccin-compatible palette — dark blood-iron */
-  --ctp-base: #1a0500;
-  --ctp-mantle: #140300;
-  --ctp-crust: #0e0200;
-  --ctp-surface0: #2e0a02;
-  --ctp-surface1: #3e1104;
-  --ctp-surface2: #521806;
-  --ctp-overlay0: #8a5030;
-  --ctp-overlay1: #a06038;
-  --ctp-overlay2: #b87048;
-  --ctp-subtext0: #c88850;
-  --ctp-subtext1: #d89860;
-  --ctp-text: #e8d4b8;
-  --ctp-lavender: #cc4422;
-  --ctp-blue: #cc2200;
-  --ctp-sapphire: #aa1800;
-  --ctp-sky: #dd3300;
-  --ctp-teal: #cc5500;
-  --ctp-green: #887722;
-  --ctp-yellow: #ffd890;
-  --ctp-peach: #ff8844;
-  --ctp-maroon: #991100;
-  --ctp-red: #cc2200;
-  --ctp-mauve: #cc4422;
-  --ctp-pink: #dd5533;
-  --ctp-flamingo: #ee6644;
-  --ctp-rosewater: #ffaa66;
-
-  /* Semantic tokens */
-  --bg-app: #1a0500;
-  --bg-sidebar: #110300;
-  --bg-player: #120400;
-  --bg-card: #2e0a02;
-  --bg-card-hover: #3e1104;
-  --bg-input: #2e0a02;
-  --bg-overlay: rgba(26, 5, 0, 0.92);
-  --bg-selection: rgba(204, 34, 0, 0.25);
-  --border-subtle: rgba(140, 60, 20, 0.30);
-  --border-default: rgba(180, 80, 30, 0.35);
-  --border-strong: rgba(220, 120, 50, 0.50);
-  --text-primary: #e8d4b8;
-  --text-secondary: #c09070;
-  --text-muted: #a07848;
-  --text-disabled: #5a3820;
-  --accent: #cc2200;
-  --accent-hover: #e02800;
-  --accent-glow: rgba(204, 34, 0, 0.35);
-  --accent-subtle: rgba(204, 34, 0, 0.15);
-  --danger: #ff4422;
-  --success: #887722;
-  --warning: #ff8844;
-  --nav-active-bg: rgba(204, 34, 0, 0.22);
-  --nav-active-text: #ffd890;
-  --scrollbar-thumb: rgba(140, 50, 10, 0.60);
-  --scrollbar-track: transparent;
-  --shadow-card: 0 2px 10px rgba(0, 0, 0, 0.70);
-  --shadow-player: 0 -4px 20px rgba(150, 30, 0, 0.25);
-  --radius-sm: 4px;
-  --radius-md: 8px;
-  --radius-lg: 12px;
-  --space-1: 4px;
-  --space-2: 8px;
-  --space-3: 12px;
-  --space-4: 16px;
-  --space-5: 20px;
-  --space-6: 24px;
-}
-
-/* Track name — blood-gold glow, as if lit by forge-fire */
-[data-theme='horde'] .player-track-name,
-[data-theme='horde'] .queue-track-title {
-  color: #ffd890;
-  text-shadow: 0 0 16px rgba(220, 80, 0, 0.55), 0 0 4px rgba(220, 80, 0, 0.25);
-}
-
-/* Sidebar — iron plate lines + subtle red glow on active */
-[data-theme='horde'] .sidebar {
-  background-color: #110300;
-  border-right: 1px solid rgba(140, 40, 10, 0.35);
-}
-
-/* Nav active — ember glow */
-[data-theme='horde'] .sidebar-nav-item.active {
-  background: rgba(204, 34, 0, 0.20);
-  border-left: 3px solid #cc2200;
-  box-shadow: inset 0 0 12px rgba(204, 34, 0, 0.10);
-}
-
-/* Player bar — forge-fire glow from below */
-[data-theme='horde'] .player-bar {
-  background-color: #120400;
-  background-image: linear-gradient(to bottom, rgba(80, 10, 0, 0.35), transparent);
-  border-top: 1px solid rgba(180, 60, 20, 0.40);
-  box-shadow: 0 -4px 24px rgba(150, 30, 0, 0.30);
-}
-
-/* App-shell — safe single-pass radial, no repeating */
-[data-theme='horde'] .app-shell {
-  background: radial-gradient(ellipse at 65% 110%, rgba(160, 25, 0, 0.18) 0%, transparent 55%);
-}
-
-/* Cards — iron-tinted hover */
-[data-theme='horde'] .album-card:hover,
-[data-theme='horde'] .artist-card:hover {
-  box-shadow: 0 4px 18px rgba(180, 40, 0, 0.30);
-  border-color: rgba(200, 60, 10, 0.50);
-}
-
-/* Connection indicators */
-[data-theme='horde'] .connection-type,
-[data-theme='horde'] .connection-server {
-  color: #a07848;
-}
-
-
-/* ═══════════════════════════════════════════════════════════════════
-   ALLIANCE — World of Warcraft, Stormwind navy, cathedral stone & gold
-   ═══════════════════════════════════════════════════════════════════ */
-[data-theme='alliance'] {
-  /* Catppuccin-compatible palette — deep navy / cathedral stone */
-  --ctp-base: #06101e;
-  --ctp-mantle: #040c18;
-  --ctp-crust: #020810;
-  --ctp-surface0: #0c1e34;
-  --ctp-surface1: #122440;
-  --ctp-surface2: #1a2e50;
-  --ctp-overlay0: #506888;
-  --ctp-overlay1: #607898;
-  --ctp-overlay2: #7088a8;
-  --ctp-subtext0: #8098b8;
-  --ctp-subtext1: #90a8c8;
-  --ctp-text: #d8e8f8;
-  --ctp-lavender: #5588cc;
-  --ctp-blue: #3388cc;
-  --ctp-sapphire: #2266aa;
-  --ctp-sky: #44aadd;
-  --ctp-teal: #3399cc;
-  --ctp-green: #88bb44;
-  --ctp-yellow: #f0c840;
-  --ctp-peach: #dd9944;
-  --ctp-maroon: #aa3322;
-  --ctp-red: #cc4433;
-  --ctp-mauve: #7766cc;
-  --ctp-pink: #997acc;
-  --ctp-flamingo: #aa88cc;
-  --ctp-rosewater: #bbaacc;
-
-  /* Semantic tokens */
-  --bg-app: #06101e;
-  --bg-sidebar: #040c18;
-  --bg-player: #050e1a;
-  --bg-card: #0c1e34;
-  --bg-card-hover: #122440;
-  --bg-input: #0c1e34;
-  --bg-overlay: rgba(6, 16, 30, 0.92);
-  --bg-selection: rgba(51, 136, 204, 0.25);
-  --border-subtle: rgba(60, 100, 160, 0.28);
-  --border-default: rgba(80, 120, 180, 0.35);
-  --border-strong: rgba(120, 160, 210, 0.50);
-  --text-primary: #d8e8f8;
-  --text-secondary: #8098b8;
-  --text-muted: #6880a0;
-  --text-disabled: #2a3e58;
-  --accent: #3388cc;
-  --accent-hover: #4499dd;
-  --accent-glow: rgba(51, 136, 204, 0.35);
-  --accent-subtle: rgba(51, 136, 204, 0.15);
-  --danger: #cc4433;
-  --success: #88bb44;
-  --warning: #dd9944;
-  --nav-active-bg: rgba(51, 136, 204, 0.20);
-  --nav-active-text: #e8f4ff;
-  --scrollbar-thumb: rgba(60, 110, 180, 0.55);
-  --scrollbar-track: transparent;
-  --shadow-card: 0 2px 10px rgba(0, 0, 0, 0.60);
-  --shadow-player: 0 -4px 20px rgba(20, 70, 160, 0.22);
-  --radius-sm: 4px;
-  --radius-md: 8px;
-  --radius-lg: 12px;
-  --space-1: 4px;
-  --space-2: 8px;
-  --space-3: 12px;
-  --space-4: 16px;
-  --space-5: 20px;
-  --space-6: 24px;
-}
-
-/* Track name — paladin holy-light glow */
-[data-theme='alliance'] .player-track-name,
-[data-theme='alliance'] .queue-track-title {
-  color: #e8f4ff;
-  text-shadow: 0 0 14px rgba(80, 160, 220, 0.50), 0 0 4px rgba(80, 160, 220, 0.20);
-}
-
-/* Sidebar — cathedral stone columns with gold right-border */
-[data-theme='alliance'] .sidebar {
-  background-color: #040c18;
-  border-right: 2px solid rgba(200, 170, 50, 0.30);
-}
-
-/* Nav active — royal blue with gold left accent */
-[data-theme='alliance'] .sidebar-nav-item.active {
-  background: rgba(51, 136, 204, 0.20);
-  border-left: 3px solid #f0c840;
-  box-shadow: inset 0 0 12px rgba(51, 136, 204, 0.10);
-}
-
-/* Player bar — paladin aura glow */
-[data-theme='alliance'] .player-bar {
-  background-color: #050e1a;
-  background-image: linear-gradient(to bottom, rgba(20, 60, 130, 0.30), transparent);
-  border-top: 1px solid rgba(100, 140, 200, 0.35);
-  box-shadow: 0 -4px 22px rgba(30, 80, 180, 0.22);
-}
-
-/* App-shell — safe single-pass radial, no repeating */
-[data-theme='alliance'] .app-shell {
-  background: radial-gradient(ellipse at 38% 110%, rgba(25, 70, 170, 0.15) 0%, transparent 55%);
-}
-
-/* Cards — blue-glow hover */
-[data-theme='alliance'] .album-card:hover,
-[data-theme='alliance'] .artist-card:hover {
-  box-shadow: 0 4px 18px rgba(40, 100, 200, 0.28);
-  border-color: rgba(80, 140, 210, 0.50);
-}
-
-/* Connection indicators */
-[data-theme='alliance'] .connection-type,
-[data-theme='alliance'] .connection-server {
-  color: #6880a0;
-}
-
-/* ═══════════════════════════════════════════════════════════════════
-   W11 — Windows 11 Fluent Design, dark mode, Mica material
-   ═══════════════════════════════════════════════════════════════════ */
-[data-theme='w11'] {
-  /* Catppuccin-compatible palette — Fluent v2 dark neutrals
-     Values aligned with Microsoft's actual Windows 11 Dark Mode tokens:
-       text primary    #ffffff (was #f3f3f3 — now matches W11 true white)
-       text secondary  #cfcfcf (was #9a9a9a — W11 Text Secondary Dark, 9.6:1)
-       text tertiary   #a0a0a0 (was #797979 — W11 Text Tertiary Dark, 6.3:1)
-       control strong  rgba(255,255,255,0.40) (was 0.18 — perceptible structural borders)
-       accent fill     #0078d4 kept (for buttons with white text, 4.3:1 AA)
-       accent text     via .w11-link helper → #60cdff (Fluent Accent Text Dark)
-       danger dark     #ff99a4 (Fluent Critical Foreground Dark, 8:1 AAA) */
-  --ctp-base: #202020;
-  --ctp-mantle: #1c1c1c;
-  --ctp-crust: #181818;
-  --ctp-surface0: #2c2c2c;
-  --ctp-surface1: #3b3b3b;    /* raised from #363636 for grip/border perceptibility */
-  --ctp-surface2: #454545;
-  --ctp-overlay0: #868686;    /* raised from #797979 */
-  --ctp-overlay1: #a0a0a0;
-  --ctp-overlay2: #b4b4b4;
-  --ctp-subtext0: #cfcfcf;
-  --ctp-subtext1: #e4e4e4;
-  --ctp-text: #ffffff;
-  --ctp-lavender: #6ccbf8;
-  --ctp-blue: #0078d4;
-  --ctp-sapphire: #0067c0;
-  --ctp-sky: #4cc2ff;
-  --ctp-teal: #00b7c3;
-  --ctp-green: #6ccb5f;
-  --ctp-yellow: #f9f1a5;
-  --ctp-peach: #f7630c;
-  --ctp-maroon: #ff99a4;     /* Fluent Critical Foreground Dark */
-  --ctp-red: #ff99a4;
-  --ctp-mauve: #8764b8;
-  --ctp-pink: #b146c2;
-  --ctp-flamingo: #e3008c;
-  --ctp-rosewater: #f5e1ff;
-
-  /* Semantic tokens */
-  --bg-app: #202020;
-  --bg-sidebar: #2b2b2b;
-  --bg-player: #1c1c1c;
-  --bg-card: #2c2c2c;
-  --bg-card-hover: #3b3b3b;
-  --bg-input: #2c2c2c;
-  --bg-overlay: rgba(32, 32, 32, 0.92);
-  --bg-selection: rgba(0, 120, 212, 0.30);
-  /* Borders — raised to match Fluent v2 Stroke Control tokens */
-  --bg-glass:        rgba(32, 32, 32, 0.92);
-  --border-subtle:   rgba(255, 255, 255, 0.08);  /* Stroke Divider Dark */
-  --border-default:  rgba(255, 255, 255, 0.18);  /* Stroke Control Default Dark */
-  --border-strong:   rgba(255, 255, 255, 0.40);  /* Stroke Control Strong Dark */
-  --border:          rgba(255, 255, 255, 0.18);
-  --text-primary:   #ffffff;     /* 15.9:1 — AAA ✓ (W11 true white) */
-  --text-secondary: #cfcfcf;     /* 9.6:1 — AAA ✓ (raised from 5.8:1) */
-  --text-muted:     #a0a0a0;     /* 6.3:1 — AAA near-miss (raised from 4.0:1 below AA) */
-  --text-disabled:  #5a5a5a;
-  --accent:         #0078d4;     /* W11 brand blue — kept for button fills (white text 4.3:1 AA) */
-  --accent-hover:   #1086e0;
-  --accent-text:    #60cdff;     /* Fluent Accent Text Dark — 7.2:1 AAA ✓ for link/text usage */
-  --accent-glow:    rgba(0, 120, 212, 0.30);
-  --accent-subtle:  rgba(0, 120, 212, 0.15);
-  --accent-dim:     rgba(0, 120, 212, 0.18);
-  --danger:         #ff99a4;     /* Fluent Critical Foreground Dark — 8.0:1 AAA ✓ */
-  --positive:       #6ccb5f;     /* W11 Success — 7.8:1 AAA ✓ */
-  --success:        #6ccb5f;
-  --warning:        #fce100;     /* W11 Caution Dark (brighter yellow) — 13.2:1 AAA ✓ */
-  --volume-accent:  #0078d4;
-  --nav-active-bg:  rgba(0, 120, 212, 0.22);
-  --nav-active-text: #ffffff;
-  --scrollbar-thumb: rgba(255, 255, 255, 0.28);
-  --scrollbar-track: transparent;
-  --shadow-card:   0 2px 8px rgba(0, 0, 0, 0.50);
-  --shadow-player: 0 -1px 0 rgba(255, 255, 255, 0.08);
-  --radius-sm: 6px;
-  --radius-md: 8px;
-  --radius-lg: 12px;
-  --space-1: 4px;
-  --space-2: 8px;
-  --space-3: 12px;
-  --space-4: 16px;
-  --space-5: 20px;
-  --space-6: 24px;
-  --waveform-played:    #60cdff;  /* Accent Text Dark — visible on dark bg */
-  --waveform-buffered:  #868686;
-  --waveform-unplayed:  #3b3b3b;
-}
-
diff --git a/src/styles/themes/v-tactical.css b/src/styles/themes/v-tactical.css
deleted file mode 100644
index 9d5f5c72..00000000
--- a/src/styles/themes/v-tactical.css
+++ /dev/null
@@ -1,84 +0,0 @@
-/* ─── V-Tactical ─── */
-[data-theme='v-tactical'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23708599%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  --ctp-crust: #090c0e;
-  --ctp-mantle: #0d1114;
-  --ctp-base: #161c22;
-  --ctp-surface0: #1f2830;
-  --ctp-surface1: #2a3640;
-  --ctp-surface2: #3a4a58;
-  --ctp-overlay0: #526371;
-  --ctp-overlay1: #708599;
-  --ctp-overlay2: #8da4b8;
-  --ctp-text: #e1e9ef;
-  --ctp-subtext1: #b0c1d1;
-  --ctp-subtext0: #8da4b8;
-  --ctp-mauve: #ff8a00;
-  --ctp-lavender: #ffaa45;
-  --ctp-pink: #bf616a;
-  --ctp-flamingo: #d08770;
-  --ctp-rosewater: #e1e9ef;
-  --ctp-green: #a3be8c;
-  --ctp-teal: #88c0d0;
-  --ctp-sky: #81a1c1;
-  --ctp-blue: #5e81ac;
-  --ctp-sapphire: #5e81ac;
-  --ctp-yellow: #ebcb8b;
-  --ctp-peach: #d08770;
-  --ctp-maroon: #bf616a;
-  --ctp-red: #bf616a;
-
-  --bg-app: #161c22;
-  --bg-sidebar: #0d1114;
-  --bg-card: #1f2830;
-  --bg-hover: rgba(255, 138, 0, 0.1);
-  --bg-player: #090c0e;
-  --bg-glass: rgba(13, 17, 20, 0.85);
-  --accent: #ff8a00;
-  --accent-dim: rgba(255, 138, 0, 0.15);
-  --accent-glow: rgba(255, 138, 0, 0.4);
-  --text-primary: #e1e9ef;
-  --text-secondary: #b0c1d1;
-  --text-muted: #708599;
-  --border: #3a4a58;
-  --border-subtle: #1f2830;
-  --border-dropdown: #3a4a58;
-  --shadow-dropdown: rgba(0, 0, 0, 0.7);
-  --positive: #a3be8c;
-  --warning: #ebcb8b;
-  --danger: #bf616a;
-  --radius-sm: 1px;
-  --radius-md: 2px;
-  --radius-lg: 4px;
-}
-
-[data-theme='v-tactical'] .sidebar {
-  border-right: 1px solid var(--border);
-}
-
-[data-theme='v-tactical'] .player-bar {
-  border-top: 2px solid var(--accent);
-  background: linear-gradient(180deg, #0d1114 0%, #090c0e 100%);
-}
-
-[data-theme='v-tactical'] .player-track-name {
-  text-transform: uppercase;
-  letter-spacing: 1px;
-  font-weight: 700;
-  color: var(--accent);
-  text-shadow: 0 0 10px var(--accent-glow);
-}
-
-[data-theme='v-tactical'] .nav-link.active {
-  background: linear-gradient(90deg, rgba(255, 138, 0, 0.15) 0%, transparent 100%);
-  border-left: 3px solid var(--accent);
-}
-
-[data-theme='v-tactical'] .btn-primary {
-  text-transform: uppercase;
-  font-weight: 800;
-  letter-spacing: 0.5px;
-}
-
diff --git a/src/styles/themes/vintage-tube-radio-1950s-bakelite-vacuum-tube.css b/src/styles/themes/vintage-tube-radio-1950s-bakelite-vacuum-tube.css
deleted file mode 100644
index fd52a032..00000000
--- a/src/styles/themes/vintage-tube-radio-1950s-bakelite-vacuum-tube.css
+++ /dev/null
@@ -1,187 +0,0 @@
-/* ─── Vintage Tube Radio — 1950s Bakelite & Vacuum Tube ─── */
-[data-theme='vintage-tube-radio'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23BCAAA4%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* ── Palette ── */
-  --ctp-crust: #1E110A;
-  /* deep warm black-brown — dial background */
-  --ctp-mantle: #5D4037;
-  /* speaker cloth brown — sidebar */
-  --ctp-base: #3E2723;
-  /* polished bakelite — chassis */
-  --ctp-surface0: #4E342E;
-  --ctp-surface1: #5D4037;
-  --ctp-surface2: #6D4C41;
-  --ctp-overlay0: #795548;
-  --ctp-overlay1: #8D6E63;
-  --ctp-overlay2: #A1887F;
-  --ctp-text: #FFECB3;
-  /* ivory/cream — dial lettering */
-  --ctp-subtext1: #D7CCC8;
-  --ctp-subtext0: #BCAAA4;
-  /* aged ivory — secondary labels */
-  /* Tube glow + tarnished brass accents */
-  --ctp-mauve: #FF6F00;
-  /* vacuum tube orange — primary accent */
-  --ctp-lavender: #FF8F00;
-  --ctp-yellow: #FFC107;
-  /* warm dial backlight */
-  --ctp-peach: #FFB300;
-  --ctp-green: #558B2F;
-  --ctp-teal: #00695C;
-  --ctp-sky: #B08D57;
-  /* tarnished brass */
-  --ctp-blue: #5C6BC0;
-  --ctp-sapphire: #3949AB;
-  --ctp-pink: #C2185B;
-  --ctp-flamingo: #AD1457;
-  --ctp-rosewater: #E91E63;
-  --ctp-maroon: #B71C1C;
-  --ctp-red: #C62828;
-
-  /* ── Semantic tokens ── */
-  --bg-app: #3E2723;
-  --bg-sidebar: #5D4037;
-  --bg-card: #4E342E;
-  --bg-hover: #5D4037;
-  --bg-player: #1E110A;
-  --bg-glass: rgba(62, 39, 35, 0.92);
-  --accent: #FF6F00;
-  --accent-dim: rgba(255, 111, 0, 0.15);
-  --accent-glow: rgba(255, 111, 0, 0.40);
-  --text-primary: #FFECB3;
-  --text-secondary: #BCAAA4;
-  --text-muted: #b09880;
-  --border: #B08D57;
-  /* tarnished brass */
-  --border-subtle: #4E342E;
-  --positive: #558B2F;
-  --warning: #FFC107;
-  --danger: #C62828;
-}
-
-/* ── Tube Radio: polished bakelite chassis texture ── */
-[data-theme='vintage-tube-radio'] .app-shell {
-  background:
-    radial-gradient(ellipse at 30% 20%, rgba(255, 111, 0, 0.04) 0%, transparent 60%),
-    radial-gradient(ellipse at 80% 80%, rgba(255, 193, 7, 0.03) 0%, transparent 50%),
-    #3E2723;
-}
-
-/* Sidebar: speaker cloth — soft radial texture */
-[data-theme='vintage-tube-radio'] .sidebar {
-  background:
-    repeating-linear-gradient(0deg,
-      rgba(0, 0, 0, 0.12) 0px,
-      rgba(0, 0, 0, 0.12) 1px,
-      transparent 1px,
-      transparent 4px),
-    repeating-linear-gradient(90deg,
-      rgba(0, 0, 0, 0.08) 0px,
-      rgba(0, 0, 0, 0.08) 1px,
-      transparent 1px,
-      transparent 4px),
-    #5D4037;
-  border-right: 2px solid #B08D57;
-  box-shadow: inset -2px 0 8px rgba(0, 0, 0, 0.4);
-}
-
-/* ── Frequency dial (Player Bar) ── */
-[data-theme='vintage-tube-radio'] .player-bar {
-  background: #1E110A;
-  border-top: 2px solid #B08D57;
-  box-shadow:
-    inset 0 1px 0 rgba(255, 193, 7, 0.08),
-    0 -3px 20px rgba(0, 0, 0, 0.7);
-}
-
-/* Track name: warm tube-glow */
-[data-theme='vintage-tube-radio'] .player-track-name {
-  color: #FFC107;
-  text-shadow:
-    0 0 6px rgba(255, 193, 7, 0.90),
-    0 0 14px rgba(255, 111, 0, 0.60),
-    0 0 28px rgba(255, 111, 0, 0.30);
-  letter-spacing: 0.04em;
-}
-
-[data-theme='vintage-tube-radio'] .player-track-artist {
-  color: #FF8F00;
-  text-shadow: 0 0 6px rgba(255, 111, 0, 0.50);
-  opacity: 1;
-}
-
-[data-theme='vintage-tube-radio'] .player-time {
-  color: #FF8F00;
-  text-shadow: 0 0 5px rgba(255, 111, 0, 0.55);
-}
-
-/* ── Transport buttons: turned brass knobs ── */
-[data-theme='vintage-tube-radio'] .player-btn,
-[data-theme='vintage-tube-radio'] .player-btn-primary {
-  background: radial-gradient(circle at 38% 32%, #d4a843 0%, #b08d57 45%, #7a5e2a 100%);
-  color: #1E110A;
-  border: 1px solid #7a5e2a;
-  box-shadow:
-    0 3px 7px rgba(0, 0, 0, 0.7),
-    0 1px 2px rgba(0, 0, 0, 0.5),
-    inset 0 1px 0 rgba(255, 220, 120, 0.55),
-    inset 0 -1px 0 rgba(0, 0, 0, 0.3);
-}
-
-[data-theme='vintage-tube-radio'] .player-btn:hover,
-[data-theme='vintage-tube-radio'] .player-btn-primary:hover {
-  background: radial-gradient(circle at 38% 32%, #e8bc55 0%, #c09a65 45%, #8a6e38 100%);
-  box-shadow:
-    0 4px 10px rgba(0, 0, 0, 0.7),
-    0 1px 2px rgba(0, 0, 0, 0.5),
-    inset 0 1px 0 rgba(255, 230, 140, 0.65),
-    inset 0 -1px 0 rgba(0, 0, 0, 0.3);
-}
-
-/* ── Regular buttons: bakelite style ── */
-[data-theme='vintage-tube-radio'] .btn {
-  background: linear-gradient(180deg, #4E342E 0%, #3E2723 100%);
-  color: #FFECB3;
-  border: 1px solid #B08D57;
-  box-shadow:
-    inset 0 1px 0 rgba(255, 220, 150, 0.10),
-    0 1px 4px rgba(0, 0, 0, 0.5);
-}
-
-[data-theme='vintage-tube-radio'] .btn:hover {
-  background: linear-gradient(180deg, #5D4037 0%, #4E342E 100%);
-}
-
-[data-theme='vintage-tube-radio'] .btn-primary {
-  background: linear-gradient(180deg, #FF8F00 0%, #E65100 100%);
-  color: #1E110A;
-  border: 1px solid #BF360C;
-  box-shadow:
-    inset 0 1px 0 rgba(255, 220, 120, 0.35),
-    0 1px 4px rgba(0, 0, 0, 0.4),
-    0 0 10px rgba(255, 111, 0, 0.30);
-}
-
-/* Active queue buttons: dark text on orange */
-[data-theme='vintage-tube-radio'] .queue-round-btn.active {
-  color: #1E110A;
-}
-
-/* Cards / panels: inset bakelite */
-[data-theme='vintage-tube-radio'] .glass,
-[data-theme='vintage-tube-radio'] .card {
-  background: rgba(78, 52, 46, 0.80);
-  border: 1px solid #B08D57;
-  box-shadow:
-    inset 0 1px 0 rgba(255, 220, 150, 0.06),
-    0 2px 8px rgba(0, 0, 0, 0.4);
-}
-
-/* Content header: warm band */
-[data-theme='vintage-tube-radio'] .content-header {
-  background: linear-gradient(180deg, rgba(93, 64, 55, 0.60) 0%, rgba(62, 39, 35, 0.20) 100%);
-  border-bottom: 1px solid #B08D57;
-}
-
diff --git a/src/styles/themes/violet-haze.css b/src/styles/themes/violet-haze.css
deleted file mode 100644
index 11db418e..00000000
--- a/src/styles/themes/violet-haze.css
+++ /dev/null
@@ -1,68 +0,0 @@
-/* ─── Violet Haze ─── */
-[data-theme='violet-haze'] {
-  color-scheme: dark;
-
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23b4a0ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
-
-  /* Backgrounds */
-  --ctp-crust:    #09070f;
-  --ctp-mantle:   #0d0a16;
-  --ctp-base:     #100d1a;
-  --ctp-surface0: #171425;
-  --ctp-surface1: #1d1930;
-  --ctp-surface2: #26203d;
-
-  /* Overlays */
-  --ctp-overlay0: #4c4270;
-  --ctp-overlay1: #65558f;
-  --ctp-overlay2: #7d69aa;
-
-  /* Text */
-  --ctp-text:     #f3efff;
-  --ctp-subtext1: #d2c7f5;
-  --ctp-subtext0: #a696d6;
-
-  /* Softer violet accent */
-  --ctp-teal:      #b8a7ff;
-  --ctp-sky:       #b8a7ff;
-  --ctp-sapphire:  #9c89e8;
-  --ctp-blue:      #7f6ac8;
-  --ctp-lavender:  #c4b5fd;
-  --ctp-mauve:     #9c89e8;
-  --ctp-pink:      #7f6ac8;
-  --ctp-flamingo:  #c4b5fd;
-  --ctp-rosewater: #9c89e8;
-
-  /* Semantic */
-  --ctp-red:     #ff6b6b;
-  --ctp-maroon:  #ff9f68;
-  --ctp-peach:   #ff9f68;
-  --ctp-yellow:  #ffd166;
-  --ctp-green:   #4ade80;
-
-  /* UI */
-  --bg-app:      #12101d;
-  --bg-sidebar:  #0d0a16;
-  --bg-card:     #171425;
-  --bg-hover:    #211c35;
-  --bg-player:   #0d0a16;
-  --bg-glass:    rgba(18,16,29,0.78);
-
-  --accent:      #b4a0ff;
-  --accent-dim:  rgba(184,167,255,0.06);
-  --accent-glow: rgba(184,167,255,0.10);
-
-  --text-primary:   #f3efff;
-  --text-secondary: #a696d6;
-  --text-muted:     #65558f;
-
-  --border:          #26203d;
-  --border-subtle:   #1d1930;
-  --border-dropdown: #31284c;
-  --shadow-dropdown: rgba(0,0,0,0.88);
-
-  --positive: #4ade80;
-  --warning:  #ffd166;
-  --danger:   #ff6b6b;
-}
-
diff --git a/src/styles/themes/volcanic-dark.css b/src/styles/themes/volcanic-dark.css
deleted file mode 100644
index 8ebf19c9..00000000
--- a/src/styles/themes/volcanic-dark.css
+++ /dev/null
@@ -1,66 +0,0 @@
-/* ─── Volcanic Dark ─── */
-[data-theme='volcanic-dark'] {
-  color-scheme: dark;
-
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23c97a56' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
-
-  /* Backgrounds */
-  --ctp-crust:    #100c0a;
-  --ctp-mantle:   #15100d;
-  --ctp-base:     #1b1512;
-  --ctp-surface0: #231b17;
-  --ctp-surface1: #2d231d;
-  --ctp-surface2: #392d26;
-
-  /* Overlays */
-  --ctp-overlay0: #6a4b3e;
-  --ctp-overlay1: #886050;
-  --ctp-overlay2: #a27462;
-
-  /* Text */
-  --ctp-text:     #f2e5de;
-  --ctp-subtext1: #d0b2a5;
-  --ctp-subtext0: #aa8475;
-
-  /* Burnt orange accent */
-  --ctp-teal:      #c97a56;
-  --ctp-sky:       #c97a56;
-  --ctp-sapphire:  #b06242;
-  --ctp-blue:      #8f4d33;
-  --ctp-lavender:  #d49272;
-  --ctp-mauve:     #b06242;
-  --ctp-pink:      #8f4d33;
-  --ctp-flamingo:  #d49272;
-  --ctp-rosewater: #b06242;
-
-  --ctp-red:     #e06a6a;
-  --ctp-maroon:  #d58a58;
-  --ctp-peach:   #d58a58;
-  --ctp-yellow:  #d0b15a;
-  --ctp-green:   #67c587;
-
-  --bg-app:      #1b1512;
-  --bg-sidebar:  #15100d;
-  --bg-card:     #231b17;
-  --bg-hover:    #2d231d;
-  --bg-player:   #15100d;
-  --bg-glass:    rgba(27,21,18,0.82);
-
-  --accent:      #c97a56;
-  --accent-dim:  rgba(201,122,86,0.05);
-  --accent-glow: rgba(201,122,86,0.09);
-
-  --text-primary:   #f2e5de;
-  --text-secondary: #aa8475;
-  --text-muted:     #6a4b3e;
-
-  --border:          #392d26;
-  --border-subtle:   #2d231d;
-  --border-dropdown: #47372f;
-  --shadow-dropdown: rgba(0,0,0,0.72);
-
-  --positive: #67c587;
-  --warning:  #d0b15a;
-  --danger:   #e06a6a;
-}
-
diff --git a/src/styles/themes/w98.css b/src/styles/themes/w98.css
deleted file mode 100644
index d2726fb3..00000000
--- a/src/styles/themes/w98.css
+++ /dev/null
@@ -1,476 +0,0 @@
-/* ─── W98 ─── */
-[data-theme='w98'] {
-  color-scheme: light;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* ── Authentische W98 Palette ──
-     Contrast audit:
-       text-primary  on bg-card   13.84:1 AAA ✓
-       text-primary  on bg-app    4.42:1  AA  ✓ (album-detail page lives here)
-       positive      on bg-card    5.24:1 AA  ✓ (deepened from #008000 at 2.62:1 ❌)
-       warning       on bg-card    5.61:1 AA  ✓ (deep amber, was #808000 at 2.61:1 ❌)
-       danger        on bg-card    4.61:1 AA  ✓ (deepened from #ff0000 at 2.62:1 ❌)
-       accent (navy) on bg-card    9.97:1 AAA ✓
-     Border-subtle was #d4d0c8 (1.0:1, invisible) → #a0a0a0.
-     The brand --ctp-* palette is preserved verbatim as the canonical W98
-     system colour set; only the semantic tokens are lifted.
-     text-secondary/muted are intentionally kept at #000000: pages such as
-     AlbumDetail render text on bg-app teal (#008080) where any lift below
-     pure black drops below AA. W98 historically used bold/italic, not
-     colour value, for text hierarchy.
-  */
-  --ctp-crust: #808080;
-  --ctp-mantle: #a0a0a0;
-  --ctp-base: #d4d0c8;
-  /* Echtes W98 Button Face */
-  --ctp-surface0: #ffffff;
-  --ctp-surface1: #ececec;
-  --ctp-surface2: #d4d0c8;
-  --ctp-overlay0: #808080;
-  --ctp-overlay1: #404040;
-  --ctp-overlay2: #000000;
-  --ctp-text: #000000;
-  --ctp-subtext1: #000000;
-  --ctp-subtext0: #404040;
-
-  --ctp-mauve: #000080;
-  --ctp-lavender: #0000cc;
-  --ctp-green: #008000;
-  --ctp-teal: #008080;
-  --ctp-sky: #0000ff;
-  --ctp-blue: #0000ff;
-  --ctp-sapphire: #000080;
-  --ctp-pink: #ff00ff;
-  --ctp-flamingo: #ff00ff;
-  --ctp-rosewater: #d4d0c8;
-  --ctp-yellow: #808000;
-  --ctp-peach: #ff8000;
-  --ctp-maroon: #800000;
-  --ctp-red: #ff0000;
-
-  --bg-app: #008080;
-  /* Teal Desktop */
-  --bg-sidebar: #d4d0c8;
-  --bg-card: #d4d0c8;
-  --bg-hover: #000080;
-  --bg-player: #d4d0c8;
-  --bg-glass: rgba(212, 208, 200, 0.95);
-
-  --accent: #000080;
-  --accent-dim: rgba(0, 0, 128, 0.12);
-  --accent-glow: transparent;
-  --volume-accent: #000080;
-
-  --text-primary: #000000;
-  --text-secondary: #000000;       /* W98 uses bold/italic for hierarchy, not lighter colour —
-                                      lifting fails on bg-app teal (#008080) where any non-black
-                                      tone drops below AA (e.g. #404040 = 2.09:1). */
-  --text-muted: #000000;
-
-  --border: #808080;
-  --border-subtle: #a0a0a0;        /* 1.73:1 perceptible, was #d4d0c8 (1.0:1 invisible) */
-  --border-dropdown: #000000;
-  --shadow-dropdown: rgba(0, 0, 0, 0.4);
-
-  --positive: #005000;             /* 5.24:1 AA ✓, deepened from #008000 (2.62:1 ❌) */
-  --warning: #5a4500;              /* 5.61:1 AA ✓, deep amber, was #808000 (2.61:1 ❌) */
-  --danger: #b00000;               /* 4.61:1 AA ✓, deepened from #ff0000 (2.62:1 ❌) */
-
-  --radius-sm: 0px;
-  --radius-md: 0px;
-  --radius-lg: 0px;
-  --radius-xl: 0px;
-  --radius-full: 0px;
-}
-
-/* Teal Desktop (nur der äußere Shell-Rahmen) */
-[data-theme='w98'] .app-shell {
-  background-color: #008080;
-}
-
-/* Column resize grip — default --ctp-surface1 (#ececec) on bg-card (#d4d0c8)
-   is 1.23:1 (invisible). Use the W98 dialog border grey for a chunky 2 px
-   grip that matches the rest of the W98 furniture. */
-[data-theme='w98'] .col-resize-handle::after {
-  background: #808080;
-  width: 2px;
-}
-
-
-/* ── 3D Bevel: Raised ── */
-[data-theme='w98'] .sidebar,
-[data-theme='w98'] .player-bar,
-[data-theme='w98'] .card {
-  background: #d4d0c8;
-  border: 1px solid #000000;
-  box-shadow:
-    inset 1px 1px #ffffff,
-    inset -1px -1px #808080,
-    inset 2px 2px #dfdfdf,
-    inset -2px -2px #404040;
-}
-
-[data-theme='w98'] .sidebar {
-  border-right: 2px solid #000000;
-}
-
-/* Player Bar Titelbalken: ikonischer W98 Gradient für den Song-Titel */
-[data-theme='w98'] .player-track-name {
-  background: linear-gradient(to right, #09246d, #a6c4e8);
-  color: #ffffff !important;
-  padding: 1px 6px;
-  font-weight: bold;
-}
-
-[data-theme='w98'] .player-track-artist,
-[data-theme='w98'] .player-time {
-  color: #000000 !important;
-}
-
-/* Nav */
-[data-theme='w98'] .nav-link.active {
-  background: #000080 !important;
-  color: #ffffff !important;
-}
-
-[data-theme='w98'] .nav-link.active svg {
-  color: #ffffff !important;
-}
-
-[data-theme='w98'] .nav-link:hover:not(.active) {
-  background: #000080 !important;
-  color: #ffffff !important;
-}
-
-[data-theme='w98'] .nav-link:hover:not(.active) svg {
-  color: #ffffff !important;
-}
-
-/* Alle Buttons: 3D Raised Bevel */
-[data-theme='w98'] .btn,
-[data-theme='w98'] .btn-primary,
-[data-theme='w98'] .btn-surface,
-[data-theme='w98'] .btn-ghost,
-[data-theme='w98'] .hero-play-btn,
-[data-theme='w98'] .queue-round-btn,
-[data-theme='w98'] .player-btn,
-[data-theme='w98'] .album-card-details-btn {
-  background: #d4d0c8 !important;
-  color: #000000 !important;
-  border: 1px solid #000000 !important;
-  border-radius: 0 !important;
-  box-shadow:
-    inset 1px 1px #ffffff,
-    inset -1px -1px #808080,
-    inset 2px 2px #dfdfdf,
-    inset -2px -2px #404040 !important;
-  text-shadow: none !important;
-  filter: none !important;
-  transform: none !important;
-}
-
-/* Gedrückt: Bevel umkehren */
-[data-theme='w98'] .btn:active,
-[data-theme='w98'] .btn-primary:active,
-[data-theme='w98'] .btn-surface:active,
-[data-theme='w98'] .btn-ghost:active,
-[data-theme='w98'] .hero-play-btn:active,
-[data-theme='w98'] .queue-round-btn:active,
-[data-theme='w98'] .player-btn:active,
-[data-theme='w98'] .album-card-details-btn:active {
-  box-shadow:
-    inset 1px 1px #808080,
-    inset -1px -1px #ffffff,
-    inset 2px 2px #404040,
-    inset -2px -2px #dfdfdf !important;
-}
-
-/* Hover: heller */
-[data-theme='w98'] .btn:hover,
-[data-theme='w98'] .btn-primary:hover,
-[data-theme='w98'] .btn-surface:hover,
-[data-theme='w98'] .btn-ghost:hover,
-[data-theme='w98'] .hero-play-btn:hover,
-[data-theme='w98'] .album-card-details-btn:hover {
-  background: #e4e0d8 !important;
-  color: #000000 !important;
-}
-
-/* Aktive Queue-Buttons: navy, sunken */
-[data-theme='w98'] .queue-round-btn.active {
-  background: #000080 !important;
-  color: #ffffff !important;
-  box-shadow:
-    inset 1px 1px #808080,
-    inset -1px -1px #ffffff,
-    inset 2px 2px #404040,
-    inset -2px -2px #dfdfdf !important;
-}
-
-[data-theme='w98'] .queue-round-btn:hover:not(:disabled):not(.active) {
-  background: #e4e0d8 !important;
-  color: #000000 !important;
-}
-
-/* Progress Bar: eingesunkene Rille, navy Fill */
-[data-theme='w98'] .progress-bar-track {
-  background: #ffffff;
-  box-shadow: inset 1px 1px #808080, inset -1px -1px #ffffff;
-  border-radius: 0;
-}
-
-[data-theme='w98'] .progress-bar-fill {
-  background: #000080;
-  border-radius: 0;
-  box-shadow: none;
-}
-
-/* Scrollbar */
-[data-theme='w98'] ::-webkit-scrollbar {
-  width: 16px;
-  height: 16px;
-}
-
-[data-theme='w98'] ::-webkit-scrollbar-track {
-  background: #d4d0c8;
-}
-
-[data-theme='w98'] ::-webkit-scrollbar-thumb {
-  background: #d4d0c8;
-  border: 1px solid #000000;
-  box-shadow: inset 1px 1px #ffffff, inset -1px -1px #808080;
-}
-
-[data-theme='w98'] ::-webkit-scrollbar-button {
-  background: #d4d0c8;
-  border: 1px solid #000000;
-  box-shadow: inset 1px 1px #ffffff, inset -1px -1px #808080;
-}
-
-/* Queue Tab */
-[data-theme='w98'] .queue-tab-btn:hover {
-  background: #e4e0d8;
-  color: #000000;
-}
-
-/* Hero */
-[data-theme='w98'] .hero-eyebrow {
-  color: rgba(255, 255, 255, 0.9);
-}
-
-[data-theme='w98'] .hero-meta .badge {
-  background: rgba(255, 255, 255, 0.15);
-}
-
-/* Settings */
-[data-theme='w98'] .settings-tab:hover {
-  background: #000080;
-  color: #ffffff;
-}
-
-[data-theme='w98'] .theme-accordion-header:hover {
-  background: #000080;
-  color: #ffffff;
-}
-
-[data-theme='w98'] .theme-accordion-open .theme-accordion-header {
-  background: #000080;
-  color: #ffffff;
-}
-
-[data-theme='w98'] .theme-accordion-open .theme-accordion-chevron {
-  color: #ffffff;
-}
-
-/* Dropdowns */
-[data-theme='w98'] .custom-select-trigger:hover {
-  background: #000080;
-  color: #ffffff;
-}
-
-[data-theme='w98'] .custom-select-option:hover {
-  background: #000080 !important;
-  color: #ffffff !important;
-}
-
-/* Various hovers → navy + white */
-[data-theme='w98'] .artist-ext-link:hover {
-  background: #000080;
-  color: #ffffff !important;
-}
-
-[data-theme='w98'] .changelog-summary:hover {
-  color: #000080;
-}
-
-[data-theme='w98'] .changelog-code {
-  background: #ffffff;
-  color: #000080;
-  border: 1px solid #808080;
-}
-
-[data-theme='w98'] .keybind-badge {
-  background: #d4d0c8 !important;
-  color: #000000 !important;
-  border: 1px solid #808080 !important;
-}
-
-[data-theme='w98'] .eq-ctrl-btn {
-  background: #d4d0c8;
-  color: #000000;
-  border: 1px solid #808080;
-  box-shadow: inset 1px 1px #ffffff, inset -1px -1px #808080;
-}
-
-[data-theme='w98'] .eq-ctrl-btn:hover {
-  background: #000080;
-  color: #ffffff;
-}
-
-[data-theme='w98'] .genre-keyword-badge {
-  background: #d4d0c8 !important;
-  color: #000000 !important;
-  border: 1px solid #808080 !important;
-}
-
-[data-theme='w98'] .toggle-track::before {
-  background: #d4d0c8;
-  border: 1px solid #808080;
-}
-
-[data-theme='w98'] .np-title {
-  color: #000080 !important;
-}
-
-[data-theme='w98'] .np-action-btn:hover {
-  background: #000080;
-  color: #ffffff;
-}
-
-[data-theme='w98'] .np-queue-item:hover,
-[data-theme='w98'] .np-queue-item.context-active {
-  background: #000080;
-  color: #ffffff;
-}
-
-[data-theme='w98'] .track-row:hover,
-[data-theme='w98'] .track-row.context-active {
-  background: #000080 !important;
-}
-
-[data-theme='w98'] .track-row:hover *,
-[data-theme='w98'] .track-row.context-active * {
-  color: #ffffff !important;
-}
-
-[data-theme='w98'] .artist-row:hover {
-  background: #000080;
-  color: #ffffff;
-}
-
-[data-theme='w98'] .year-toggle:hover {
-  color: #000080;
-}
-
-[data-theme='w98'] .playlist-row:hover {
-  background: #000080;
-}
-
-[data-theme='w98'] .playlist-row:hover,
-[data-theme='w98'] .playlist-row:hover * {
-  color: #ffffff;
-}
-
-[data-theme='w98'] .help-question:hover {
-  color: #000080;
-}
-
-[data-theme='w98'] .help-item-open .help-question {
-  color: #000080;
-  font-weight: bold;
-}
-
-[data-theme='w98'] .help-item-open .help-chevron {
-  color: #000080;
-}
-
-[data-theme='w98'] .queue-item:hover,
-[data-theme='w98'] .queue-item.context-active {
-  background: #000080 !important;
-}
-
-[data-theme='w98'] .queue-item:hover .queue-item-title,
-[data-theme='w98'] .queue-item:hover .queue-item-artist,
-[data-theme='w98'] .queue-item:hover .queue-item-duration,
-[data-theme='w98'] .queue-item.context-active .queue-item-title,
-[data-theme='w98'] .queue-item.context-active .queue-item-artist,
-[data-theme='w98'] .queue-item.context-active .queue-item-duration {
-  color: #ffffff;
-}
-
-[data-theme='w98'] .player-btn:hover {
-  background: #000080;
-  color: #ffffff;
-}
-
-[data-theme='w98'] .player-btn-primary {
-  background: #d4d0c8 !important;
-  color: #000000 !important;
-}
-
-[data-theme='w98'] .player-btn-primary:hover {
-  background: #000080 !important;
-  color: #ffffff !important;
-}
-
-[data-theme='w98'] .search-result-item:hover,
-[data-theme='w98'] .search-result-item.active {
-  background: #000080;
-}
-
-[data-theme='w98'] .search-result-item:hover .search-result-name,
-[data-theme='w98'] .search-result-item:hover .search-result-sub,
-[data-theme='w98'] .search-result-item.active .search-result-name,
-[data-theme='w98'] .search-result-item.active .search-result-sub {
-  color: #ffffff;
-}
-
-[data-theme='w98'] .collapse-btn {
-  border-color: #808080 !important;
-}
-
-[data-theme='w98'] .collapse-btn:hover {
-  background: #000080 !important;
-  color: #ffffff !important;
-}
-
-[data-theme='w98'] .album-row-nav .nav-btn:hover:not(.disabled) {
-  background: #000080;
-  color: #ffffff;
-}
-
-/* Live-Dropdown: kein backdrop-blur (saugt teal durch), solider W98-Hintergrund */
-[data-theme='w98'] .glass {
-  background: #d4d0c8 !important;
-  backdrop-filter: none !important;
-  -webkit-backdrop-filter: none !important;
-  border: 1px solid #000000;
-  box-shadow: inset 1px 1px #ffffff, inset -1px -1px #808080, 2px 2px 4px rgba(0, 0, 0, 0.3);
-  color: #000000;
-}
-
-/* Stream-Einträge: --bg-hover ist navy → Override auf W98-Grau mit Bevel */
-[data-theme='w98'] .glass [style*="var(--bg-hover)"] {
-  background: #ece8e0 !important;
-  border: 1px solid #808080;
-  box-shadow: inset 1px 1px #ffffff, inset -1px -1px #808080;
-  border-radius: 0 !important;
-}
-
-/* Inline-color-Overrides für Text in Stream-Einträgen */
-[data-theme='w98'] .glass [style*="var(--text-primary)"],
-[data-theme='w98'] .glass [style*="var(--text-secondary)"],
-[data-theme='w98'] .glass [style*="var(--text-muted)"] {
-  color: #000000 !important;
-}
-
diff --git a/src/styles/themes/windows-10-fluent-design-light.css b/src/styles/themes/windows-10-fluent-design-light.css
deleted file mode 100644
index 136c00d2..00000000
--- a/src/styles/themes/windows-10-fluent-design-light.css
+++ /dev/null
@@ -1,303 +0,0 @@
-/* ─── Windows 10 — Fluent Design Light ─── */
-/* Clean flat white + the iconic near-black taskbar + Windows blue #0078D4 */
-[data-theme='w10'] {
-  color-scheme: light;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23767676%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* ── Palette — Windows 10 neutral + Fluent blue ── */
-  --ctp-crust: #1c1c1c;
-  /* taskbar near-black */
-  --ctp-mantle: #2b2b2b;
-  --ctp-base: #ffffff;
-  /* window white */
-  --ctp-surface0: #f3f3f3;
-  /* nav pane / secondary bg */
-  --ctp-surface1: #ebebeb;
-  --ctp-surface2: #d6d6d6;
-  /* borders, dividers */
-  --ctp-overlay0: #767676;
-  /* muted / disabled */
-  --ctp-overlay1: #4a4a4a;
-  --ctp-overlay2: #2b2b2b;
-  --ctp-text: #000000;
-  /* primary text — true black */
-  --ctp-subtext1: #1b1b1b;
-  --ctp-subtext0: #5d5d5d;
-  /* Windows Fluent blue spectrum */
-  --ctp-mauve: #0078d4;
-  /* Windows blue — THE accent */
-  --ctp-lavender: #2e95d3;
-  --ctp-sky: #cce4f7;
-  /* selection highlight */
-  --ctp-teal: #008272;
-  --ctp-blue: #0063b1;
-  --ctp-sapphire: #003e92;
-  --ctp-green: #107c10;
-  --ctp-yellow: #ffb900;
-  --ctp-peach: #d83b01;
-  --ctp-pink: #e3008c;
-  --ctp-flamingo: #c239b3;
-  --ctp-rosewater: #ef6950;
-  --ctp-maroon: #a80000;
-  --ctp-red: #d13438;
-
-  /* ── Semantic tokens ── */
-  --bg-app: #ffffff;
-  --bg-sidebar: #f3f3f3;
-  --bg-card: #ffffff;
-  --bg-hover: #e8e8e8;
-  --bg-player: #1c1c1c;
-  /* taskbar */
-  --bg-glass: rgba(255, 255, 255, 0.90);
-  --accent: #0078d4;
-  --accent-dim: rgba(0, 120, 212, 0.10);
-  --accent-glow: rgba(0, 120, 212, 0.28);
-  --text-primary: #000000;
-  --text-secondary: #1b1b1b;
-  --text-muted: #767676;
-  --border: #d6d6d6;
-  --border-subtle: #ebebeb;
-  --positive: #107c10;
-  --warning: #ffb900;
-  --danger: #d13438;
-  --radius-sm: 2px;
-  --radius-md: 4px;
-  --radius-lg: 6px;
-  /* Waveform: Windows blue progress */
-  --waveform-played: #0078d4;
-  --waveform-buffered: #80bbea;
-  --waveform-unplayed: #d6d6d6;
-}
-
-/* ── App shell: W10 desktop — clean off-white ── */
-[data-theme='w10'] .app-shell {
-  background: #f3f3f3;
-}
-
-/* ── Sidebar: W10 Navigation Pane — flat light gray ── */
-[data-theme='w10'] .sidebar {
-  background: #f3f3f3;
-  border-right: 1px solid #d6d6d6;
-  box-shadow: none;
-}
-
-/* Nav links: dark on light pane */
-[data-theme='w10'] .nav-link {
-  color: #1b1b1b;
-}
-
-[data-theme='w10'] .nav-link:hover {
-  background: rgba(0, 0, 0, 0.06);
-  color: #000000;
-}
-
-[data-theme='w10'] .nav-link.active {
-  background: rgba(0, 120, 212, 0.10);
-  color: #0078d4;
-}
-
-[data-theme='w10'] .nav-link.active::before {
-  background: #0078d4;
-  box-shadow: none;
-}
-
-/* ── Player bar: W10 Taskbar — near-black flat + accent stripe ── */
-[data-theme='w10'] .player-bar {
-  background: #1c1c1c;
-  border-top: 2px solid #0078d4;
-  box-shadow: 0 -2px 16px rgba(0, 0, 0, 0.50);
-}
-
-/* Player text: white on dark taskbar */
-[data-theme='w10'] .player-track-name {
-  color: #ffffff;
-  font-weight: 500;
-}
-
-[data-theme='w10'] .player-track-artist {
-  color: rgba(255, 255, 255, 0.65);
-  opacity: 1;
-}
-
-[data-theme='w10'] .player-time {
-  color: rgba(255, 255, 255, 0.60);
-}
-
-/* Transport: flat ghosted icons on dark bar */
-[data-theme='w10'] .player-btn {
-  color: rgba(255, 255, 255, 0.82);
-  background: transparent;
-  border: none;
-  box-shadow: none;
-}
-
-[data-theme='w10'] .player-btn:hover {
-  color: #ffffff;
-  background: rgba(255, 255, 255, 0.12);
-  box-shadow: none;
-}
-
-[data-theme='w10'] .player-btn-primary {
-  background: #0078d4;
-  color: #ffffff;
-  border: none;
-  box-shadow: none;
-}
-
-[data-theme='w10'] .player-btn-primary:hover {
-  background: #1684d8;
-  box-shadow: none;
-}
-
-/* ── Content-area buttons: W10 flat button style ── */
-[data-theme='w10'] .btn {
-  background: #ffffff;
-  color: #1b1b1b;
-  border: 1px solid #d6d6d6;
-  border-radius: 4px;
-  box-shadow: none;
-}
-
-[data-theme='w10'] .btn:hover {
-  background: #f3f3f3;
-  border-color: #767676;
-  box-shadow: none;
-}
-
-[data-theme='w10'] .btn-primary {
-  background: #0078d4;
-  color: #ffffff;
-  border: 1px solid transparent;
-  box-shadow: none;
-}
-
-[data-theme='w10'] .btn-primary:hover {
-  background: #006cbd;
-  box-shadow: none;
-}
-
-[data-theme='w10'] .btn-ghost {
-  background: transparent;
-  border-color: transparent;
-  color: #1b1b1b;
-}
-
-[data-theme='w10'] .btn-ghost:hover {
-  background: rgba(0, 0, 0, 0.06);
-  border-color: transparent;
-}
-
-[data-theme='w10'] .btn-surface {
-  background: #ffffff;
-  color: #1b1b1b;
-  border: 1px solid #d6d6d6;
-}
-
-[data-theme='w10'] .btn-surface:hover {
-  background: #f3f3f3;
-  border-color: #767676;
-}
-
-/* Cards: white, flat border, very subtle lift */
-[data-theme='w10'] .glass,
-[data-theme='w10'] .card {
-  background: #ffffff;
-  border: 1px solid #d6d6d6;
-  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
-}
-
-/* Content header */
-[data-theme='w10'] .content-header {
-  background: rgba(255, 255, 255, 0.92);
-  border-bottom: 1px solid #d6d6d6;
-}
-
-/* Album badge: Windows blue */
-[data-theme='w10'] .badge,
-[data-theme='w10'] .album-detail-badge {
-  background: #0078d4;
-  color: #ffffff;
-}
-
-/* ── Hover / active states ── */
-[data-theme='w10'] .track-row:hover,
-[data-theme='w10'] .track-row.context-active {
-  background: rgba(0, 120, 212, 0.06);
-  box-shadow: inset 3px 0 0 #0078d4;
-}
-
-[data-theme='w10'] .queue-item:hover,
-[data-theme='w10'] .queue-item.context-active {
-  background: rgba(0, 120, 212, 0.07);
-}
-
-[data-theme='w10'] .queue-item.active {
-  background: rgba(0, 120, 212, 0.10);
-  border-left: 2px solid #0078d4;
-}
-
-[data-theme='w10'] .np-queue-item.active {
-  background: rgba(0, 120, 212, 0.08);
-}
-
-[data-theme='w10'] .np-queue-item-active {
-  color: #0078d4;
-}
-
-[data-theme='w10'] .np-queue-item:hover,
-[data-theme='w10'] .np-queue-item.context-active {
-  background: rgba(0, 120, 212, 0.05);
-}
-
-[data-theme='w10'] .np-album-track.active .np-album-track-title,
-[data-theme='w10'] .np-album-track.active .np-album-track-num {
-  color: #0078d4;
-}
-
-[data-theme='w10'] .artist-row:hover {
-  background: rgba(0, 120, 212, 0.06);
-  box-shadow: inset 3px 0 0 #0078d4;
-}
-
-[data-theme='w10'] .playlist-row:hover {
-  background: rgba(0, 120, 212, 0.06);
-  box-shadow: inset 3px 0 0 #0078d4;
-}
-
-[data-theme='w10'] .settings-tab:hover {
-  background: rgba(0, 0, 0, 0.05);
-  color: #0078d4;
-}
-
-[data-theme='w10'] .settings-tab.active {
-  background: rgba(0, 120, 212, 0.10);
-  color: #0078d4;
-  border-color: #0078d4;
-}
-
-[data-theme='w10'] .queue-tab-btn:hover {
-  background: rgba(0, 0, 0, 0.05);
-  color: #0078d4;
-}
-
-[data-theme='w10'] .custom-select-trigger:hover {
-  background: rgba(0, 0, 0, 0.05);
-}
-
-[data-theme='w10'] .custom-select-option:hover {
-  background: rgba(0, 120, 212, 0.08);
-}
-
-[data-theme='w10'] .artist-ext-link:hover {
-  background: rgba(0, 120, 212, 0.08);
-  border-color: #0078d4;
-}
-
-/* Connection info: readable on light sidebar */
-[data-theme='w10'] .connection-type,
-[data-theme='w10'] .connection-server {
-  color: #5d5d5d;
-}
-
-/* ─────────────────────────────────────────── */
-
diff --git a/src/styles/themes/windows-11-dark-component-overrides.css b/src/styles/themes/windows-11-dark-component-overrides.css
deleted file mode 100644
index 32a1f705..00000000
--- a/src/styles/themes/windows-11-dark-component-overrides.css
+++ /dev/null
@@ -1,525 +0,0 @@
-/* ─── Windows 11 Dark — component overrides ─────────────────────────────
-   Raise column grip + structural borders to perceptible contrasts that
-   match Fluent v2 Stroke tokens, and hand-tune a handful of elements
-   that hardcode the old accent.                                        */
-
-/* Column resize grip — was #363636 on #2c2c2c = 1.16:1 (invisible) */
-[data-theme='w11'] .col-resize-handle::after {
-  background: var(--ctp-overlay1);  /* #a0a0a0 → 6.3:1 on bg-card */
-  width: 2px;
-}
-
-/* Focus ring — Fluent keyboard focus indicator */
-[data-theme='w11'] *:focus-visible {
-  outline: 2px solid var(--accent-text);  /* #60cdff — high contrast */
-  outline-offset: 2px;
-}
-
-/* Scrollbar thumb — Fluent neutral, perceptible against dark surfaces */
-[data-theme='w11'] ::-webkit-scrollbar-thumb {
-  background: var(--ctp-overlay0);
-}
-[data-theme='w11'] *:hover::-webkit-scrollbar-thumb,
-[data-theme='w11'] .is-scrolling::-webkit-scrollbar-thumb {
-  background: var(--ctp-overlay2);
-}
-
-/* Connection indicators inherit secondary colour (readability improved via
-   raised --text-secondary). No background box (they're inline spans). */
-[data-theme='w11'] .connection-type {
-  color: var(--text-primary);
-}
-[data-theme='w11'] .connection-server {
-  color: var(--text-secondary);
-}
-
-/* Track name — pure white (Fluent is minimal, uses true white not off-white) */
-[data-theme='w11'] .player-track-name,
-[data-theme='w11'] .queue-track-title {
-  color: #ffffff;
-}
-
-/* Sidebar — Mica-like: very slightly lighter than app bg, Fluent Divider Dark */
-[data-theme='w11'] .sidebar {
-  background-color: #2b2b2b;
-  border-right: 1px solid rgba(255, 255, 255, 0.12);
-}
-
-/* Nav active — Fluent accent fill, rounded */
-[data-theme='w11'] .sidebar-nav-item.active {
-  background: rgba(0, 120, 212, 0.22);
-  border-left: 3px solid #0078d4;
-}
-
-/* Player bar — taskbar-inspired: very dark, Fluent Divider Dark */
-[data-theme='w11'] .player-bar {
-  background-color: #1c1c1c;
-  border-top: 1px solid rgba(255, 255, 255, 0.12);
-  box-shadow: none;
-}
-
-/* App-shell — flat, no gradient (Fluent dark is clean/minimal) */
-[data-theme='w11'] .app-shell {
-  background: none;
-}
-
-/* Cards — Fluent hover: slight elevation via border brightening */
-[data-theme='w11'] .album-card:hover,
-[data-theme='w11'] .artist-card:hover {
-  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.45);
-  border-color: rgba(255, 255, 255, 0.28);
-}
-
-
-/* ── Barb & Ken (Games) ─────────────────────────────────────── */
-[data-theme='barb-and-ken'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23FF1B8D%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* Barbieland palette */
-  --ctp-crust: #07000b;
-  --ctp-mantle: #110009;
-  --ctp-base: #1a000f;
-  --ctp-surface0: #2e0019;
-  --ctp-surface1: #450026;
-  --ctp-surface2: #5c0032;
-  --ctp-overlay0: #8c1455;
-  --ctp-overlay1: #b82070;
-  --ctp-overlay2: #d93d8a;
-  --ctp-text: #ffe6f3;
-  --ctp-subtext1: #ffb8da;
-  --ctp-subtext0: #ff80be;
-
-  /* Barbie Pink spectrum */
-  --ctp-mauve: #FF1B8D;
-  --ctp-pink: #FF69B4;
-  --ctp-flamingo: #FF1493;
-  --ctp-rosewater: #FFD6EC;
-  --ctp-lavender: #FFB3D9;
-  --ctp-maroon: #c4005e;
-  --ctp-red: #FF4466;
-
-  /* Ken — powder blue as accent-2 */
-  --ctp-blue: #89CFF0;
-  --ctp-sapphire: #5BC8F5;
-  --ctp-sky: #AAE8FF;
-  --ctp-teal: #70d8f2;
-
-  --ctp-green: #a6e3a1;
-  --ctp-yellow: #FFE4A8;
-  --ctp-peach: #FFB8D0;
-
-  --bg-app: #1a000f;
-  --bg-sidebar: #110009;
-  --bg-card: #2e0019;
-  --bg-hover: rgba(255, 27, 141, 0.12);
-  --bg-player: #07000b;
-  --bg-glass: rgba(26, 0, 15, 0.88);
-
-  --accent: #FF1B8D;
-  --accent-dim: rgba(255, 27, 141, 0.15);
-  --accent-glow: rgba(255, 27, 141, 0.45);
-  --volume-accent: #89CFF0;
-
-  --text-primary: #ffe6f3;
-  --text-secondary: #ffb8da;
-  --text-muted: #7a3055;
-  --border: rgba(255, 27, 141, 0.28);
-  --border-subtle: rgba(255, 27, 141, 0.12);
-  --border-dropdown: rgba(255, 27, 141, 0.3);
-  --shadow-dropdown: rgba(7, 0, 11, 0.9);
-
-  --positive: #a6e3a1;
-  --warning: #FFE4A8;
-  --danger: #FF4466;
-
-  /* Bubbly, soft rounding — very Barbie */
-  --radius-sm: 10px;
-  --radius-md: 14px;
-  --radius-lg: 20px;
-}
-
-/* Polka-dot sidebar — Barbie's dreamhouse wallpaper */
-[data-theme='barb-and-ken'] .sidebar {
-  background:
-    radial-gradient(circle, rgba(255, 27, 141, 0.18) 2px, transparent 2px),
-    radial-gradient(circle, rgba(137, 207, 240, 0.10) 2px, transparent 2px),
-    linear-gradient(180deg, #110009 0%, #1a000f 100%);
-  background-size: 22px 22px, 22px 22px, 100% 100%;
-  background-position: 0 0, 11px 11px, 0 0;
-  border-right: 1px solid rgba(255, 27, 141, 0.35);
-}
-
-/* Player bar — deep magenta gradient, hot pink top border */
-[data-theme='barb-and-ken'] .player-bar {
-  background: linear-gradient(180deg, #1a000f 0%, #07000b 100%);
-  border-top: 2px solid #FF1B8D;
-  box-shadow: 0 -6px 24px rgba(255, 27, 141, 0.18);
-}
-
-/* Track name — glitter shimmer */
-@keyframes barbie-shimmer {
-  0% {
-    background-position: -200% center;
-  }
-
-  100% {
-    background-position: 200% center;
-  }
-}
-
-[data-theme='barb-and-ken'] .player-track-name {
-  background: linear-gradient(90deg,
-      #FF1B8D 0%,
-      #FF69B4 25%,
-      #ffffff 50%,
-      #FF69B4 75%,
-      #FF1B8D 100%);
-  background-size: 200% auto;
-  -webkit-background-clip: text;
-  -webkit-text-fill-color: transparent;
-  background-clip: text;
-  animation: barbie-shimmer 4s linear infinite;
-  font-weight: 700;
-}
-
-/* Artist name — Ken blue */
-[data-theme='barb-and-ken'] .player-artist-name {
-  color: #89CFF0;
-}
-
-/* Active nav — pink left border glow */
-[data-theme='barb-and-ken'] .nav-link.active {
-  background: linear-gradient(90deg, rgba(255, 27, 141, 0.22) 0%, transparent 100%);
-  color: #FF69B4 !important;
-  border-left: 3px solid #FF1B8D;
-  text-shadow: 0 0 8px rgba(255, 27, 141, 0.4);
-}
-
-[data-theme='barb-and-ken'] .nav-link:hover:not(.active) {
-  background: rgba(255, 27, 141, 0.08);
-}
-
-/* Content header — subtle pink rule */
-[data-theme='barb-and-ken'] .content-header {
-  border-bottom: 1px solid rgba(255, 27, 141, 0.2);
-  background: rgba(26, 0, 15, 0.6);
-  backdrop-filter: blur(12px);
-}
-
-/* Primary buttons — hot pink gradient */
-[data-theme='barb-and-ken'] .btn-primary,
-[data-theme='barb-and-ken'] .player-btn-primary,
-[data-theme='barb-and-ken'] .hero-play-btn {
-  background: linear-gradient(135deg, #FF1B8D 0%, #FF69B4 100%);
-  box-shadow: 0 4px 16px rgba(255, 27, 141, 0.45);
-  color: #fff !important;
-  border: none;
-}
-
-[data-theme='barb-and-ken'] .btn-primary:hover,
-[data-theme='barb-and-ken'] .player-btn-primary:hover,
-[data-theme='barb-and-ken'] .hero-play-btn:hover {
-  background: linear-gradient(135deg, #e5007a 0%, #FF1B8D 100%);
-  box-shadow: 0 6px 22px rgba(255, 27, 141, 0.60);
-}
-
-/* Cards — pink border glow on hover */
-[data-theme='barb-and-ken'] .album-card,
-[data-theme='barb-and-ken'] .artist-card,
-[data-theme='barb-and-ken'] .card,
-[data-theme='barb-and-ken'] .settings-card {
-  border: 1px solid rgba(255, 27, 141, 0.18);
-}
-
-[data-theme='barb-and-ken'] .album-card:hover,
-[data-theme='barb-and-ken'] .artist-card:hover {
-  border-color: rgba(255, 27, 141, 0.50);
-  box-shadow: 0 4px 20px rgba(255, 27, 141, 0.20);
-}
-
-/* Queue active item */
-[data-theme='barb-and-ken'] .queue-item.active {
-  background: rgba(255, 27, 141, 0.08);
-  border-left: 3px solid #FF1B8D;
-}
-
-[data-theme='barb-and-ken'] .queue-item.active .queue-item-title {
-  color: #FF69B4;
-}
-
-[data-theme='barb-and-ken'] .queue-item.active .queue-item-artist,
-[data-theme='barb-and-ken'] .queue-item.active .queue-item-duration {
-  color: #89CFF0;
-}
-
-/* Track rows */
-[data-theme='barb-and-ken'] .track-row:hover,
-[data-theme='barb-and-ken'] .queue-item:hover {
-  background: rgba(255, 27, 141, 0.07);
-}
-
-/* Album detail header cover button — Ken blue glow on hover */
-[data-theme='barb-and-ken'] .album-detail-cover-btn:hover {
-  box-shadow: 0 0 24px rgba(137, 207, 240, 0.35);
-}
-
-/* Star (favorite) icon — gold kept, but override to hot pink */
-[data-theme='barb-and-ken'] .color-star-active {
-  --color-star-active: #FF69B4;
-}
-
-/* Scrollbar — thin hot pink */
-[data-theme='barb-and-ken'] ::-webkit-scrollbar {
-  width: 5px;
-}
-
-[data-theme='barb-and-ken'] ::-webkit-scrollbar-track {
-  background: #07000b;
-}
-
-[data-theme='barb-and-ken'] ::-webkit-scrollbar-thumb {
-  background: #FF1B8D;
-  border-radius: 3px;
-}
-
-[data-theme='barb-and-ken'] ::-webkit-scrollbar-thumb:hover {
-  background: #FF69B4;
-}
-
-/* Connection indicators */
-[data-theme='barb-and-ken'] .connection-type,
-[data-theme='barb-and-ken'] .connection-server {
-  color: #7a3055;
-}
-
-/* ── Toy Tale (Movies) ──────────────────────────────────────── */
-[data-theme='toy-tale'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23FFD600%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* Warm toy-box palette */
-  --ctp-crust: #080603;
-  --ctp-mantle: #100d08;
-  --ctp-base: #1a1208;
-  --ctp-surface0: #2a1c10;
-  --ctp-surface1: #3a2818;
-  --ctp-surface2: #4a3422;
-  --ctp-overlay0: #7a5a35;
-  --ctp-overlay1: #9a7848;
-  --ctp-overlay2: #b89060;
-  --ctp-text: #f0e8d8;
-  --ctp-subtext1: #d8c8a8;
-  --ctp-subtext0: #c0a880;
-
-  /* Woody gold */
-  --ctp-mauve: #FFD600;
-  --ctp-yellow: #FFD600;
-  --ctp-peach: #FFA000;
-  --ctp-rosewater: #FFE0A0;
-
-  /* Buzz Lightyear purple + green */
-  --ctp-lavender: #9B72D6;
-  --ctp-blue: #7B4FD6;
-  --ctp-sapphire: #5c35a0;
-  --ctp-sky: #4FC3F7;
-  --ctp-teal: #4CAF50;
-  --ctp-green: #4CAF50;
-
-  --ctp-pink: #FF6B9D;
-  --ctp-flamingo: #FF4488;
-  --ctp-maroon: #b71c1c;
-  --ctp-red: #e53935;
-
-  --bg-app: #1a1208;
-  --bg-sidebar: #1e3a5f;
-  /* Andy's sky-blue wallpaper */
-  --bg-card: #2a1c10;
-  --bg-hover: rgba(255, 214, 0, 0.10);
-  --bg-player: #0d0a06;
-  --bg-glass: rgba(26, 18, 8, 0.90);
-
-  --accent: #FFD600;
-  --accent-dim: rgba(255, 214, 0, 0.15);
-  --accent-glow: rgba(255, 214, 0, 0.40);
-  --volume-accent: #7B4FD6;
-  /* Buzz purple */
-
-  --text-primary: #f0e8d8;
-  --text-secondary: #c8a878;
-  --text-muted: #6a5030;
-  --border: rgba(255, 214, 0, 0.22);
-  --border-subtle: rgba(255, 214, 0, 0.10);
-  --border-dropdown: rgba(255, 214, 0, 0.25);
-  --shadow-dropdown: rgba(8, 6, 3, 0.92);
-
-  --positive: #4CAF50;
-  --warning: #FFA000;
-  --danger: #e53935;
-
-  --radius-sm: 6px;
-  --radius-md: 10px;
-  --radius-lg: 14px;
-}
-
-/* Sidebar — Andy's iconic cloud wallpaper in sky blue */
-[data-theme='toy-tale'] .sidebar {
-  background:
-    radial-gradient(ellipse 70px 42px at 18% 12%, rgba(255, 255, 255, 0.14) 0%, transparent 100%),
-    radial-gradient(ellipse 45px 28px at 38% 18%, rgba(255, 255, 255, 0.09) 0%, transparent 100%),
-    radial-gradient(ellipse 80px 50px at 72% 10%, rgba(255, 255, 255, 0.12) 0%, transparent 100%),
-    radial-gradient(ellipse 55px 32px at 85% 20%, rgba(255, 255, 255, 0.08) 0%, transparent 100%),
-    radial-gradient(ellipse 65px 40px at 12% 55%, rgba(255, 255, 255, 0.10) 0%, transparent 100%),
-    radial-gradient(ellipse 48px 30px at 55% 68%, rgba(255, 255, 255, 0.08) 0%, transparent 100%),
-    radial-gradient(ellipse 72px 44px at 80% 75%, rgba(255, 255, 255, 0.11) 0%, transparent 100%),
-    linear-gradient(180deg, #1e3a5f 0%, #274d78 100%);
-  border-right: 1px solid rgba(255, 214, 0, 0.20);
-}
-
-/* Nav links need lighter text on blue sidebar */
-[data-theme='toy-tale'] .nav-link {
-  color: rgba(255, 255, 255, 0.75);
-}
-
-[data-theme='toy-tale'] .nav-link:hover:not(.active) {
-  background: rgba(255, 255, 255, 0.10);
-  color: #fff;
-}
-
-[data-theme='toy-tale'] .nav-link.active {
-  background: rgba(255, 214, 0, 0.20);
-  border-left: 3px solid #FFD600;
-  color: #FFD600 !important;
-  text-shadow: 0 0 8px rgba(255, 214, 0, 0.4);
-}
-
-[data-theme='toy-tale'] .sidebar-logo,
-[data-theme='toy-tale'] .sidebar-title {
-  color: #fff;
-}
-
-/* Player bar — dark toy-chest wood */
-[data-theme='toy-tale'] .player-bar {
-  background: linear-gradient(180deg, #1a1208 0%, #0d0a06 100%);
-  border-top: 2px solid #FFD600;
-  box-shadow: 0 -6px 20px rgba(255, 214, 0, 0.10);
-}
-
-/* Track name — Woody sheriff star gold */
-[data-theme='toy-tale'] .player-track-name {
-  color: #FFD600;
-  text-shadow: 0 0 10px rgba(255, 214, 0, 0.45);
-  font-weight: 700;
-}
-
-/* Artist name — warm cowboy tan */
-[data-theme='toy-tale'] .player-artist-name {
-  color: #c8a060;
-}
-
-/* Content header */
-[data-theme='toy-tale'] .content-header {
-  border-bottom: 1px solid rgba(255, 214, 0, 0.18);
-}
-
-/* Primary buttons — Woody yellow */
-[data-theme='toy-tale'] .btn-primary,
-[data-theme='toy-tale'] .player-btn-primary,
-[data-theme='toy-tale'] .hero-play-btn {
-  background: linear-gradient(135deg, #FFD600 0%, #FFA000 100%);
-  color: #1a1208 !important;
-  font-weight: 700;
-  box-shadow: 0 4px 14px rgba(255, 214, 0, 0.35);
-  border: none;
-}
-
-[data-theme='toy-tale'] .btn-primary:hover,
-[data-theme='toy-tale'] .player-btn-primary:hover,
-[data-theme='toy-tale'] .hero-play-btn:hover {
-  background: linear-gradient(135deg, #ffe033 0%, #FFD600 100%);
-  box-shadow: 0 6px 20px rgba(255, 214, 0, 0.50);
-}
-
-/* Cards */
-[data-theme='toy-tale'] .album-card,
-[data-theme='toy-tale'] .artist-card,
-[data-theme='toy-tale'] .card,
-[data-theme='toy-tale'] .settings-card {
-  border: 1px solid rgba(255, 214, 0, 0.16);
-}
-
-[data-theme='toy-tale'] .album-card:hover,
-[data-theme='toy-tale'] .artist-card:hover {
-  border-color: rgba(255, 214, 0, 0.42);
-  box-shadow: 0 4px 18px rgba(255, 214, 0, 0.14);
-}
-
-/* Track rows */
-[data-theme='toy-tale'] .track-row:hover,
-[data-theme='toy-tale'] .queue-item:hover {
-  background: rgba(255, 214, 0, 0.06);
-}
-
-/* Queue active item — Buzz purple accent */
-[data-theme='toy-tale'] .queue-item.active {
-  background: rgba(123, 79, 214, 0.12);
-  border-left: 3px solid #7B4FD6;
-}
-
-[data-theme='toy-tale'] .queue-item.active .queue-item-title {
-  color: #FFD600;
-}
-
-[data-theme='toy-tale'] .queue-item.active .queue-item-artist,
-[data-theme='toy-tale'] .queue-item.active .queue-item-duration {
-  color: #9B72D6;
-}
-
-/* Scrollbar — Woody brown */
-[data-theme='toy-tale'] ::-webkit-scrollbar {
-  width: 6px;
-}
-
-[data-theme='toy-tale'] ::-webkit-scrollbar-track {
-  background: #0d0a06;
-}
-
-[data-theme='toy-tale'] ::-webkit-scrollbar-thumb {
-  background: #7a5a35;
-  border-radius: 3px;
-}
-
-[data-theme='toy-tale'] ::-webkit-scrollbar-thumb:hover {
-  background: #FFD600;
-}
-
-/* Connection indicators */
-[data-theme='toy-tale'] .connection-type,
-[data-theme='toy-tale'] .connection-server {
-  color: #6a5030;
-}
-
-/* Sidebar section labels (sky-blue bg needs light text) */
-[data-theme='toy-tale'] .nav-section-label {
-  color: rgba(200, 230, 255, 0.55);
-}
-
-/* Queue tab buttons (Lyrics / Warteschlange) — inactive */
-[data-theme='toy-tale'] .queue-tab-btn {
-  color: #b89060;
-}
-
-[data-theme='toy-tale'] .queue-tab-btn:hover {
-  color: #f0e8d8;
-}
-
-/* Queue: inactive song artist */
-[data-theme='toy-tale'] .queue-item-artist {
-  color: #9a7848;
-}
-
-/* Queue: "Nächste Titel" divider */
-[data-theme='toy-tale'] .queue-divider span {
-  color: #b89060 !important;
-}
-
diff --git a/src/styles/themes/windows-7-aero-aero-glass-frutiger-aero.css b/src/styles/themes/windows-7-aero-aero-glass-frutiger-aero.css
deleted file mode 100644
index ad4f2587..00000000
--- a/src/styles/themes/windows-7-aero-aero-glass-frutiger-aero.css
+++ /dev/null
@@ -1 +0,0 @@
-/* ─── Windows 7 Aero — Aero Glass & Frutiger Aero ─── */
diff --git a/src/styles/themes/windows-7-aero-glass.css b/src/styles/themes/windows-7-aero-glass.css
deleted file mode 100644
index 1c9214cc..00000000
--- a/src/styles/themes/windows-7-aero-glass.css
+++ /dev/null
@@ -1,460 +0,0 @@
-/* ─── Windows 7 Aero Glass ─── */
-[data-theme='aero-glass'] {
-  color-scheme: light;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%234c607a%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* ── Palette ── */
-  --ctp-crust: #05080f;
-  --ctp-mantle: #0d1a2e;
-  --ctp-base: #b8cfe8;
-  --ctp-surface0: #ccdaea;
-  --ctp-surface1: #d8e6f2;
-  --ctp-surface2: #e4f0f8;
-  --ctp-overlay0: #a0bcd8;
-  --ctp-overlay1: #7aa0c0;
-  --ctp-overlay2: #5a84a8;
-  --ctp-text: #0d1a2e;
-  --ctp-subtext1: #1e3250;
-  --ctp-subtext0: #3a5070;
-  --ctp-mauve: #1878e8;
-  --ctp-lavender: #3399ff;
-  --ctp-sky: #5bb3ff;
-  --ctp-blue: #1d4268;
-  --ctp-sapphire: #1366c8;
-  --ctp-teal: #0099aa;
-  --ctp-green: #107c10;
-  --ctp-yellow: #f7c948;
-  --ctp-peach: #e8890c;
-  --ctp-pink: #e3008c;
-  --ctp-flamingo: #c50f1f;
-  --ctp-rosewater: #da3b01;
-  --ctp-maroon: #a4262c;
-  --ctp-red: #c42b1c;
-
-  /* ── Semantic tokens ── */
-  --bg-app: #b8cfe8;
-  --bg-sidebar: rgba(210, 228, 248, 0.55);
-  --bg-card: rgba(225, 238, 252, 0.65);
-  --bg-hover: rgba(24, 120, 232, 0.85);
-  --bg-player: #05080f;
-  --bg-glass: rgba(210, 228, 248, 0.82);
-  --accent: #1878e8;
-  --accent-dim: rgba(24, 120, 232, 0.14);
-  --accent-glow: rgba(24, 120, 232, 0.40);
-  --volume-accent: #1878e8;
-  --text-primary: #0d1a2e;
-  --text-secondary: #1e3250;
-  --text-muted: #7090b8;
-  --border: rgba(130, 175, 220, 0.65);
-  --border-subtle: rgba(160, 200, 240, 0.45);
-  --positive: #107c10;
-  --warning: #c87400;
-  --danger: #c42b1c;
-  --radius-sm: 4px;
-  --radius-md: 6px;
-  --radius-lg: 8px;
-}
-
-/* ── Background: W7 sky with depth ── */
-[data-theme='aero-glass'] .app-shell {
-  background: linear-gradient(160deg, #c8e2f5 0%, #b5cfe4 45%, #9fc0db 100%);
-}
-
-/* ── Sidebar: Aero glass panel — frosted translucent ── */
-[data-theme='aero-glass'] .sidebar {
-  background: rgba(210, 232, 252, 0.52);
-  backdrop-filter: blur(20px);
-  -webkit-backdrop-filter: blur(20px);
-  border-right: 1px solid rgba(150, 190, 230, 0.55);
-  box-shadow:
-    inset -1px 0 0 rgba(255, 255, 255, 0.75),
-    inset 1px 0 0 rgba(255, 255, 255, 0.25),
-    2px 0 8px rgba(0, 0, 0, 0.12);
-}
-
-/* ── Player bar: authentic W7 taskbar — near-black glass ── */
-[data-theme='aero-glass'] .player-bar {
-  background: linear-gradient(180deg,
-      rgba(12, 18, 32, 0.96) 0%,
-      rgba(6, 10, 20, 0.99) 100%);
-  backdrop-filter: blur(22px);
-  -webkit-backdrop-filter: blur(22px);
-  border-top: 1px solid rgba(80, 155, 235, 0.60);
-  box-shadow:
-    inset 0 1px 0 rgba(100, 180, 255, 0.28),
-    inset 0 2px 0 rgba(255, 255, 255, 0.06),
-    0 -2px 16px rgba(0, 0, 0, 0.55);
-}
-
-/* Track info: white on near-black, blue glow */
-[data-theme='aero-glass'] .player-track-name {
-  color: #ffffff;
-  text-shadow: 0 0 12px rgba(80, 160, 255, 0.65), 0 1px 2px rgba(0, 0, 0, 0.60);
-  font-weight: 600;
-}
-
-[data-theme='aero-glass'] .player-track-artist {
-  color: #88b8e0;
-  opacity: 1;
-}
-
-[data-theme='aero-glass'] .player-time {
-  color: #88b8e0;
-}
-
-/* ── Transport buttons: Aero glass gel circles ── */
-[data-theme='aero-glass'] .player-btn,
-[data-theme='aero-glass'] .player-btn-primary {
-  background: linear-gradient(180deg,
-      rgba(255, 255, 255, 0.80) 0%,
-      rgba(195, 228, 255, 0.82) 48%,
-      rgba(80, 160, 235, 0.92) 50%,
-      rgba(30, 110, 205, 0.96) 100%);
-  color: #ffffff;
-  border: 1px solid rgba(20, 75, 180, 0.55);
-  border-radius: 50%;
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.90),
-    0 2px 6px rgba(0, 0, 0, 0.40),
-    0 0 0 1px rgba(80, 150, 230, 0.25);
-}
-
-[data-theme='aero-glass'] .player-btn:hover,
-[data-theme='aero-glass'] .player-btn-primary:hover {
-  background: linear-gradient(180deg,
-      rgba(255, 255, 255, 0.92) 0%,
-      rgba(215, 240, 255, 0.90) 48%,
-      rgba(105, 178, 248, 0.95) 50%,
-      rgba(50, 130, 220, 0.99) 100%);
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.95),
-    0 3px 10px rgba(0, 0, 0, 0.40),
-    0 0 12px rgba(51, 153, 255, 0.45);
-}
-
-/* ── Regular buttons: Aero frosted glass ── */
-[data-theme='aero-glass'] .btn,
-[data-theme='aero-glass'] .btn-surface,
-[data-theme='aero-glass'] .btn-ghost {
-  background: linear-gradient(180deg,
-      rgba(255, 255, 255, 0.85) 0%,
-      rgba(255, 255, 255, 0.85) 48%,
-      rgba(190, 220, 248, 0.90) 50%,
-      rgba(155, 198, 240, 0.94) 100%);
-  color: #0d1a2e;
-  border: 1px solid rgba(120, 170, 220, 0.65);
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.95),
-    inset 0 1px 0 rgba(255, 255, 255, 0.50),
-    0 1px 3px rgba(0, 0, 0, 0.18);
-  border-radius: 5px;
-}
-
-[data-theme='aero-glass'] .btn:hover,
-[data-theme='aero-glass'] .btn-surface:hover,
-[data-theme='aero-glass'] .btn-ghost:hover {
-  background: linear-gradient(180deg,
-      rgba(255, 255, 255, 0.96) 0%,
-      rgba(255, 255, 255, 0.96) 48%,
-      rgba(210, 235, 255, 0.95) 50%,
-      rgba(175, 215, 252, 0.98) 100%);
-  border-color: rgba(24, 120, 232, 0.70);
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 1),
-    0 1px 4px rgba(0, 0, 0, 0.20),
-    0 0 8px rgba(24, 120, 232, 0.22);
-}
-
-/* ── Primary button: Aero blue gel ── */
-[data-theme='aero-glass'] .btn-primary {
-  background: linear-gradient(180deg,
-      rgba(110, 185, 255, 0.92) 0%,
-      rgba(70, 155, 245, 0.92) 48%,
-      rgba(24, 100, 205, 0.96) 50%,
-      rgba(12, 72, 175, 0.99) 100%);
-  color: #ffffff;
-  border: 1px solid rgba(12, 60, 155, 0.70);
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.58),
-    0 1px 4px rgba(0, 0, 0, 0.30),
-    0 0 10px rgba(24, 120, 232, 0.38);
-  border-radius: 5px;
-}
-
-[data-theme='aero-glass'] .btn-primary:hover {
-  background: linear-gradient(180deg,
-      rgba(140, 200, 255, 0.95) 0%,
-      rgba(90, 170, 255, 0.95) 48%,
-      rgba(40, 120, 225, 0.98) 50%,
-      rgba(24, 95, 195, 1) 100%);
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.65),
-    0 1px 5px rgba(0, 0, 0, 0.30),
-    0 0 14px rgba(24, 120, 232, 0.50);
-}
-
-/* ── Hero / album-card buttons: frosted glass ── */
-[data-theme='aero-glass'] .hero-play-btn,
-[data-theme='aero-glass'] .album-card-details-btn {
-  background: linear-gradient(180deg,
-      rgba(255, 255, 255, 0.82) 0%,
-      rgba(190, 220, 248, 0.88) 48%,
-      rgba(140, 190, 235, 0.92) 50%,
-      rgba(100, 160, 220, 0.95) 100%);
-  color: #0d1a2e;
-  border: 1px solid rgba(100, 160, 220, 0.60);
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.90), 0 1px 3px rgba(0, 0, 0, 0.20);
-}
-
-[data-theme='aero-glass'] .hero-play-btn:hover,
-[data-theme='aero-glass'] .album-card-details-btn:hover {
-  background: linear-gradient(180deg,
-      rgba(255, 255, 255, 0.95) 0%,
-      rgba(215, 238, 255, 0.95) 50%,
-      rgba(165, 210, 250, 0.98) 100%);
-  border-color: rgba(24, 120, 232, 0.70);
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 1), 0 0 8px rgba(24, 120, 232, 0.25);
-}
-
-/* ── Queue toolbar round buttons: Aero glass ── */
-[data-theme='aero-glass'] .queue-round-btn {
-  background: linear-gradient(180deg,
-      rgba(255, 255, 255, 0.80) 0%,
-      rgba(185, 218, 248, 0.88) 50%,
-      rgba(140, 190, 235, 0.92) 100%);
-  color: #1e3250;
-  border: 1px solid rgba(110, 165, 220, 0.60);
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.90), 0 1px 2px rgba(0, 0, 0, 0.18);
-}
-
-[data-theme='aero-glass'] .queue-round-btn:hover:not(:disabled):not(.active) {
-  background: linear-gradient(180deg,
-      rgba(255, 255, 255, 0.95) 0%,
-      rgba(210, 235, 255, 0.95) 50%,
-      rgba(165, 208, 250, 0.98) 100%);
-  border-color: rgba(24, 120, 232, 0.65);
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 1), 0 0 8px rgba(24, 120, 232, 0.25);
-  color: #0d1a2e;
-}
-
-[data-theme='aero-glass'] .queue-round-btn.active {
-  background: linear-gradient(180deg,
-      rgba(110, 180, 255, 0.90) 0%,
-      rgba(24, 100, 210, 0.96) 100%);
-  color: #ffffff;
-  border-color: rgba(12, 60, 155, 0.70);
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.45), 0 0 8px rgba(24, 120, 232, 0.50);
-}
-
-/* ── Cards: frosted glass panels ── */
-[data-theme='aero-glass'] .card {
-  background: rgba(225, 240, 255, 0.62);
-  backdrop-filter: blur(10px);
-  -webkit-backdrop-filter: blur(10px);
-  border: 1px solid rgba(160, 200, 240, 0.60);
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.80),
-    0 2px 8px rgba(0, 0, 0, 0.12);
-  border-radius: 6px;
-}
-
-/* ── Content header: Aero chrome strip ── */
-[data-theme='aero-glass'] .content-header {
-  background: rgba(210, 232, 252, 0.58);
-  backdrop-filter: blur(14px);
-  -webkit-backdrop-filter: blur(14px);
-  border-bottom: 1px solid rgba(150, 195, 240, 0.55);
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.70),
-    inset 0 -1px 0 rgba(255, 255, 255, 0.35),
-    0 2px 6px rgba(0, 0, 0, 0.10);
-}
-
-/* Connection indicators: dark navy, readable on glass */
-[data-theme='aero-glass'] .connection-type,
-[data-theme='aero-glass'] .connection-server {
-  color: #0d1a2e;
-}
-
-/* ── Theme accordion: glass hover ── */
-[data-theme='aero-glass'] .theme-accordion-header:hover {
-  background: rgba(24, 120, 232, 0.18);
-  color: #0d1a2e;
-}
-
-[data-theme='aero-glass'] .theme-accordion-open .theme-accordion-header {
-  background: rgba(24, 120, 232, 0.22);
-  color: #0d1a2e;
-}
-
-/* ── Progress bar: Aero blue ── */
-[data-theme='aero-glass'] .progress-bar-track {
-  background: rgba(150, 195, 235, 0.45);
-  border-radius: 3px;
-  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15);
-}
-
-[data-theme='aero-glass'] .progress-bar-fill {
-  background: linear-gradient(180deg,
-      rgba(110, 185, 255, 0.95) 0%,
-      rgba(24, 120, 232, 0.98) 50%,
-      rgba(12, 90, 200, 1) 100%);
-  border-radius: 3px;
-  box-shadow: 0 0 6px rgba(24, 120, 232, 0.50);
-}
-
-/* ── Scrollbar: W7 thin glass style ── */
-[data-theme='aero-glass'] ::-webkit-scrollbar {
-  width: 10px;
-  height: 10px;
-}
-
-[data-theme='aero-glass'] ::-webkit-scrollbar-track {
-  background: rgba(175, 210, 245, 0.25);
-  border-radius: 5px;
-}
-
-[data-theme='aero-glass'] ::-webkit-scrollbar-thumb {
-  background: rgba(110, 168, 225, 0.60);
-  border: 1px solid rgba(80, 140, 200, 0.45);
-  border-radius: 5px;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.45);
-}
-
-[data-theme='aero-glass'] ::-webkit-scrollbar-thumb:hover {
-  background: rgba(24, 120, 232, 0.72);
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.50), 0 0 4px rgba(24, 120, 232, 0.30);
-}
-
-/* ── Glass / dropdowns: frosted glass panel ── */
-[data-theme='aero-glass'] .glass {
-  background: rgba(218, 236, 255, 0.88) !important;
-  backdrop-filter: blur(18px) !important;
-  -webkit-backdrop-filter: blur(18px) !important;
-  border: 1px solid rgba(150, 195, 240, 0.65) !important;
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.75),
-    2px 2px 12px rgba(0, 0, 0, 0.18) !important;
-  border-radius: 8px !important;
-}
-
-[data-theme='aero-glass'] .glass [style*="var(--bg-hover)"] {
-  background: rgba(24, 120, 232, 0.20) !important;
-  border-radius: 4px !important;
-}
-
-[data-theme='aero-glass'] .glass [style*="var(--text-primary)"] {
-  color: #0d1a2e !important;
-}
-
-[data-theme='aero-glass'] .glass [style*="var(--text-secondary)"] {
-  color: #1e3250 !important;
-}
-
-[data-theme='aero-glass'] .glass [style*="var(--text-muted)"] {
-  color: #3a5070 !important;
-}
-
-/* ── Hover / selection: Aero blue glass ── */
-[data-theme='aero-glass'] .queue-tab-btn:hover {
-  background: rgba(24, 120, 232, 0.18);
-  color: #0d1a2e;
-}
-
-[data-theme='aero-glass'] .settings-tab:hover {
-  background: rgba(24, 120, 232, 0.18);
-  color: #0d1a2e;
-}
-
-[data-theme='aero-glass'] .settings-tab.active {
-  background: rgba(24, 120, 232, 0.85);
-  color: #ffffff;
-}
-
-[data-theme='aero-glass'] .custom-select-trigger:hover {
-  background: rgba(24, 120, 232, 0.15);
-}
-
-[data-theme='aero-glass'] .custom-select-option:hover {
-  background: rgba(24, 120, 232, 0.85) !important;
-  color: #ffffff !important;
-}
-
-[data-theme='aero-glass'] .artist-ext-link:hover {
-  background: rgba(24, 120, 232, 0.85);
-  color: #ffffff !important;
-}
-
-[data-theme='aero-glass'] .np-action-btn:hover {
-  background: rgba(24, 120, 232, 0.18);
-}
-
-[data-theme='aero-glass'] .np-queue-item:hover,
-[data-theme='aero-glass'] .np-queue-item.context-active {
-  background: rgba(24, 120, 232, 0.85);
-  color: #ffffff;
-}
-
-[data-theme='aero-glass'] .track-row:hover,
-[data-theme='aero-glass'] .track-row.context-active {
-  background: rgba(24, 120, 232, 0.85) !important;
-}
-
-[data-theme='aero-glass'] .track-row:hover *,
-[data-theme='aero-glass'] .track-row.context-active * {
-  color: #ffffff !important;
-}
-
-[data-theme='aero-glass'] .artist-row:hover {
-  background: rgba(24, 120, 232, 0.85);
-  color: #ffffff;
-}
-
-[data-theme='aero-glass'] .playlist-row:hover {
-  background: rgba(24, 120, 232, 0.85);
-}
-
-[data-theme='aero-glass'] .playlist-row:hover,
-[data-theme='aero-glass'] .playlist-row:hover * {
-  color: #ffffff;
-}
-
-[data-theme='aero-glass'] .queue-item:hover,
-[data-theme='aero-glass'] .queue-item.context-active {
-  background: rgba(24, 120, 232, 0.85) !important;
-}
-
-[data-theme='aero-glass'] .queue-item:hover .queue-item-title,
-[data-theme='aero-glass'] .queue-item:hover .queue-item-artist,
-[data-theme='aero-glass'] .queue-item:hover .queue-item-duration,
-[data-theme='aero-glass'] .queue-item.context-active .queue-item-title,
-[data-theme='aero-glass'] .queue-item.context-active .queue-item-artist,
-[data-theme='aero-glass'] .queue-item.context-active .queue-item-duration {
-  color: #ffffff;
-}
-
-/* ── Active queue / now-playing items ── */
-[data-theme='aero-glass'] .queue-item.active {
-  background: rgba(24, 120, 232, 0.14);
-  color: #1366c8;
-}
-
-[data-theme='aero-glass'] .queue-item.active .queue-item-artist,
-[data-theme='aero-glass'] .queue-item.active .queue-item-duration {
-  color: #1878e8;
-  opacity: 0.85;
-}
-
-[data-theme='aero-glass'] .np-queue-item-active {
-  color: #1366c8;
-}
-
-[data-theme='aero-glass'] .np-queue-item.active {
-  background: rgba(24, 120, 232, 0.10);
-}
-
-[data-theme='aero-glass'] .np-album-track.active .np-album-track-title,
-[data-theme='aero-glass'] .np-album-track.active .np-album-track-num {
-  color: #1366c8;
-}
-
diff --git a/src/styles/themes/windows-vista-aero-glass.css b/src/styles/themes/windows-vista-aero-glass.css
deleted file mode 100644
index 1dfd5fa0..00000000
--- a/src/styles/themes/windows-vista-aero-glass.css
+++ /dev/null
@@ -1,413 +0,0 @@
-/* ─── Windows Vista — Aero Glass ─── */
-/* Pure CSS glass illusion: layered gradients + strategic box-shadows, no backdrop-filter */
-[data-theme='wista'] {
-  color-scheme: light;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%234870a8%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* ── Palette ── */
-  --ctp-crust: #010308;
-  --ctp-mantle: #050b1a;
-  --ctp-base: #eef3fc;
-  /* Vista window interior — ice blue-white */
-  --ctp-surface0: #e2ecf8;
-  --ctp-surface1: #d5e4f5;
-  --ctp-surface2: #c5d8f0;
-  --ctp-overlay0: #a8c4e0;
-  --ctp-overlay1: #88a8cc;
-  --ctp-overlay2: #6888b0;
-  --ctp-text: #0d1d3c;
-  /* deep navy — readable on ice bg */
-  --ctp-subtext1: #2a4878;
-  --ctp-subtext0: #4870a8;
-  /* Vista Aero blue spectrum */
-  --ctp-mauve: #1565c8;
-  /* Vista Aero blue — THE accent */
-  --ctp-lavender: #2880e0;
-  --ctp-sky: #5aaaf8;
-  /* selection/highlight blue */
-  --ctp-teal: #1890b8;
-  --ctp-blue: #0e50a8;
-  --ctp-sapphire: #0848a0;
-  --ctp-green: #1a8020;
-  --ctp-yellow: #c8980c;
-  --ctp-peach: #d06818;
-  --ctp-pink: #c03878;
-  --ctp-flamingo: #a82860;
-  --ctp-rosewater: #c04848;
-  --ctp-maroon: #903030;
-  --ctp-red: #c02020;
-
-  /* ── Semantic tokens ── */
-  --bg-app: #eef3fc;
-  --bg-sidebar: #0e1e3e;
-  /* deep navy glass — Vista nav pane in dark mode */
-  --bg-card: #e2ecf8;
-  --bg-hover: rgba(21, 101, 200, 0.09);
-  --bg-player: #050810;
-  /* Vista taskbar — black glass */
-  --bg-glass: rgba(238, 243, 252, 0.94);
-  --accent: #1565c8;
-  --accent-dim: rgba(21, 101, 200, 0.12);
-  --accent-glow: rgba(21, 101, 200, 0.40);
-  --text-primary: #0d1d3c;
-  --text-secondary: #2a4878;
-  --text-muted: #3f6aa0;
-  /* slight lift from #4870a8 to clear AA on bg-card (4.23 → 4.65) */
-  --border: rgba(100, 160, 220, 0.45);
-  --border-subtle: rgba(140, 190, 240, 0.30);
-  --positive: #1a8020;
-  --warning: #735a00;
-  /* deeper Vista gold — #c8980c was 2.37:1 on bg-app, now 5.91:1 */
-  --danger: #c02020;
-  --radius-sm: 3px;
-  --radius-md: 6px;
-  --radius-lg: 10px;
-  /* Waveform: Vista blue progress bar */
-  --waveform-played: #1565c8;
-  --waveform-buffered: #5aaaf8;
-  --waveform-unplayed: #c5d8f0;
-}
-
-/* ── App shell: Vista desktop — soft blue gradient ── */
-[data-theme='wista'] .app-shell {
-  background: linear-gradient(160deg, #dce8f8 0%, #e5eefa 50%, #eef3fc 100%);
-}
-
-/* ── Sidebar: Aero glass nav pane ──
-   Three layers: 1) top specular reflection, 2) deep navy base, 3) edge highlight via box-shadow */
-[data-theme='wista'] .sidebar {
-  background:
-    linear-gradient(180deg,
-      rgba(255, 255, 255, 0.22) 0%,
-      rgba(255, 255, 255, 0.08) 20%,
-      rgba(255, 255, 255, 0.00) 55%,
-      rgba(0, 20, 60, 0.12) 100%),
-    linear-gradient(180deg, #1a3368 0%, #0e1e3e 45%, #0a1830 100%);
-  border-right: 1px solid rgba(120, 180, 255, 0.55);
-  box-shadow:
-    inset -1px 0 0 rgba(255, 255, 255, 0.28),
-    inset 1px 0 0 rgba(255, 255, 255, 0.10),
-    2px 0 18px rgba(0, 0, 0, 0.40);
-}
-
-/* Sidebar text: light on dark glass */
-[data-theme='wista'] .nav-link {
-  color: rgba(210, 228, 255, 0.72);
-}
-
-[data-theme='wista'] .nav-link:hover {
-  background: rgba(255, 255, 255, 0.11);
-  color: #ffffff;
-}
-
-[data-theme='wista'] .nav-link.active {
-  background: rgba(21, 101, 200, 0.38);
-  color: #ffffff;
-}
-
-[data-theme='wista'] .nav-link.active::before {
-  background: #5aaaf8;
-  box-shadow: 0 0 10px rgba(90, 170, 248, 0.85);
-}
-
-[data-theme='wista'] .sidebar-logo-text,
-[data-theme='wista'] .sidebar-bottom a,
-[data-theme='wista'] .sidebar-bottom button {
-  color: rgba(210, 228, 255, 0.70);
-}
-
-[data-theme='wista'] {
-  --logo-color-start: #ffffff;
-  --logo-color-end: #a8ccff;
-}
-
-[data-theme='wista'] .sidebar-version {
-  color: rgba(210, 228, 255, 0.35);
-}
-
-/* ── Player bar: Vista Aero taskbar ──
-   Black glass + intense blue glow on top border — the most iconic Vista element */
-[data-theme='wista'] .player-bar {
-  background:
-    linear-gradient(180deg,
-      rgba(255, 255, 255, 0.07) 0%,
-      rgba(255, 255, 255, 0.00) 18%,
-      rgba(0, 0, 0, 0.00) 82%,
-      rgba(0, 0, 0, 0.18) 100%),
-    linear-gradient(180deg, #0c1828 0%, #050810 100%);
-  border-top: 1px solid rgba(80, 155, 255, 0.70);
-  box-shadow:
-    inset 0 1px 0 rgba(140, 200, 255, 0.55),
-    inset 0 2px 0 rgba(255, 255, 255, 0.14),
-    0 -4px 24px rgba(0, 0, 0, 0.70);
-}
-
-/* Player text: white on black glass */
-[data-theme='wista'] .player-track-name {
-  color: #ffffff;
-  text-shadow: 0 0 12px rgba(100, 170, 255, 0.65), 0 1px 2px rgba(0, 0, 0, 0.60);
-  font-weight: 600;
-}
-
-[data-theme='wista'] .player-track-artist {
-  color: #88b8e8;
-  opacity: 1;
-}
-
-[data-theme='wista'] .player-time {
-  color: #88b8e8;
-}
-
-/* ── Transport buttons: Vista glass orbs ──
-   Top half: white → ice-blue reflection | Bottom half: royal blue deep — the iconic split */
-[data-theme='wista'] .player-btn,
-[data-theme='wista'] .player-btn-primary {
-  background: linear-gradient(180deg,
-      #daeeff 0%,
-      #b8d8ff 44%,
-      #3a91f8 50%,
-      #0f58d7 100%);
-  color: #ffffff;
-  border: 1px solid rgba(10, 65, 180, 0.70);
-  border-radius: 50%;
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.75),
-    0 2px 8px rgba(0, 0, 0, 0.50),
-    0 0 0 1px rgba(80, 140, 255, 0.20);
-}
-
-[data-theme='wista'] .player-btn:hover,
-[data-theme='wista'] .player-btn-primary:hover {
-  background: linear-gradient(180deg,
-      #e8f4ff 0%,
-      #c8e4ff 44%,
-      #58a8ff 50%,
-      #2070e8 100%);
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.80),
-    0 3px 12px rgba(0, 0, 0, 0.50),
-    0 0 16px rgba(80, 150, 255, 0.35);
-}
-
-/* ── Content-area buttons: Vista dialog glass ── */
-[data-theme='wista'] .btn {
-  background: linear-gradient(180deg,
-      rgba(255, 255, 255, 0.98) 0%,
-      rgba(238, 248, 255, 0.95) 44%,
-      rgba(195, 222, 248, 0.90) 50%,
-      rgba(168, 205, 240, 0.85) 100%);
-  color: #0d1d3c;
-  border: 1px solid rgba(100, 160, 220, 0.68);
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.90),
-    0 1px 3px rgba(0, 0, 0, 0.18);
-}
-
-[data-theme='wista'] .btn:hover {
-  background: linear-gradient(180deg,
-      rgba(255, 255, 255, 1.00) 0%,
-      rgba(245, 252, 255, 0.98) 44%,
-      rgba(210, 233, 255, 0.95) 50%,
-      rgba(180, 220, 252, 0.92) 100%);
-  border-color: rgba(80, 140, 220, 0.80);
-}
-
-[data-theme='wista'] .btn-primary {
-  background: linear-gradient(180deg,
-      rgba(255, 255, 255, 0.95) 0%,
-      rgba(190, 222, 255, 0.92) 44%,
-      rgba(48, 130, 240, 0.96) 50%,
-      rgba(15, 78, 210, 0.99) 100%);
-  color: #ffffff;
-  border: 1px solid rgba(10, 60, 180, 0.72);
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.88),
-    0 1px 4px rgba(0, 0, 0, 0.28),
-    0 0 8px rgba(21, 101, 200, 0.22);
-}
-
-[data-theme='wista'] .btn-primary:hover {
-  background: linear-gradient(180deg,
-      rgba(255, 255, 255, 1.00) 0%,
-      rgba(210, 235, 255, 0.95) 44%,
-      rgba(68, 148, 255, 0.97) 50%,
-      rgba(30, 95, 225, 1.00) 100%);
-}
-
-/* ── Cards/panels: Vista frosted glass panel ── */
-[data-theme='wista'] .glass,
-[data-theme='wista'] .card {
-  background: linear-gradient(180deg,
-      rgba(255, 255, 255, 0.88) 0%,
-      rgba(225, 240, 255, 0.82) 100%);
-  border: 1px solid rgba(130, 182, 232, 0.60);
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.92),
-    0 2px 8px rgba(21, 101, 200, 0.10);
-}
-
-/* ── Content header: Vista titlebar / toolbar band ── */
-[data-theme='wista'] .content-header {
-  background: linear-gradient(180deg,
-      rgba(255, 255, 255, 0.92) 0%,
-      rgba(232, 245, 255, 0.72) 100%);
-  border-bottom: 1px solid rgba(150, 198, 238, 0.65);
-  box-shadow: 0 1px 4px rgba(21, 101, 200, 0.10);
-}
-
-/* ── Album badge: Vista blue pill ── */
-[data-theme='wista'] .badge,
-[data-theme='wista'] .album-detail-badge {
-  background: #1565c8;
-  color: #ffffff;
-}
-
-/* ── Scrollbar: Vista light-blue style ── */
-[data-theme='wista'] ::-webkit-scrollbar-track {
-  background: #d5e4f5;
-}
-
-[data-theme='wista'] ::-webkit-scrollbar-thumb {
-  background: linear-gradient(180deg, #90b8e0 0%, #6898c8 100%);
-  border-radius: 4px;
-}
-
-[data-theme='wista'] ::-webkit-scrollbar-thumb:hover {
-  background: linear-gradient(180deg, #a8ccf0 0%, #80a8e0 100%);
-}
-
-/* ── Hover / active states: Vista selection blue ── */
-[data-theme='wista'] .track-row:hover,
-[data-theme='wista'] .track-row.context-active {
-  background: rgba(21, 101, 200, 0.08);
-  box-shadow: inset 3px 0 0 #1565c8;
-}
-
-[data-theme='wista'] .queue-item:hover,
-[data-theme='wista'] .queue-item.context-active {
-  background: rgba(90, 170, 248, 0.18);
-}
-
-[data-theme='wista'] .queue-item.active {
-  background: rgba(21, 101, 200, 0.28);
-  border-left: 2px solid #5aaaf8;
-}
-
-[data-theme='wista'] .np-queue-item.active {
-  background: rgba(21, 101, 200, 0.10);
-}
-
-[data-theme='wista'] .np-queue-item-active {
-  color: #1565c8;
-}
-
-[data-theme='wista'] .np-queue-item:hover,
-[data-theme='wista'] .np-queue-item.context-active {
-  background: rgba(21, 101, 200, 0.07);
-}
-
-[data-theme='wista'] .np-album-track.active .np-album-track-title,
-[data-theme='wista'] .np-album-track.active .np-album-track-num {
-  color: #1565c8;
-}
-
-[data-theme='wista'] .artist-row:hover {
-  background: rgba(21, 101, 200, 0.07);
-  box-shadow: inset 3px 0 0 #1565c8;
-}
-
-[data-theme='wista'] .playlist-row:hover {
-  background: rgba(21, 101, 200, 0.07);
-  box-shadow: inset 3px 0 0 #1565c8;
-}
-
-[data-theme='wista'] .settings-tab:hover {
-  background: rgba(21, 101, 200, 0.08);
-  color: #1565c8;
-}
-
-[data-theme='wista'] .settings-tab.active {
-  background: rgba(21, 101, 200, 0.14);
-  color: #1565c8;
-  border-color: #1565c8;
-}
-
-[data-theme='wista'] .queue-tab-btn:hover {
-  background: rgba(21, 101, 200, 0.08);
-  color: #1565c8;
-}
-
-[data-theme='wista'] .custom-select-trigger:hover {
-  background: rgba(21, 101, 200, 0.08);
-}
-
-[data-theme='wista'] .custom-select-option:hover {
-  background: rgba(21, 101, 200, 0.12);
-}
-
-[data-theme='wista'] .artist-ext-link:hover {
-  background: rgba(21, 101, 200, 0.10);
-  border-color: #1565c8;
-}
-
-/* ── Queue: dark glass sidebar → light text ── */
-[data-theme='wista'] .queue-item-title {
-  color: rgba(210, 228, 255, 0.90);
-}
-
-[data-theme='wista'] .queue-item-artist,
-[data-theme='wista'] .queue-item-duration {
-  color: rgba(170, 205, 250, 0.55);
-}
-
-[data-theme='wista'] .queue-item.active .queue-item-artist,
-[data-theme='wista'] .queue-item.active .queue-item-duration {
-  color: rgba(190, 218, 255, 0.75);
-}
-
-[data-theme='wista'] .queue-divider span {
-  color: rgba(180, 210, 255, 0.38) !important;
-}
-
-[data-theme='wista'] .queue-current-info h3 {
-  color: rgba(220, 235, 255, 0.92);
-}
-
-[data-theme='wista'] .queue-current-sub {
-  color: rgba(180, 210, 252, 0.58);
-}
-
-[data-theme='wista'] .queue-tab-btn {
-  color: rgba(200, 220, 255, 0.62);
-}
-
-[data-theme='wista'] .queue-tab-btn.active {
-  color: #5aaaf8;
-}
-
-[data-theme='wista'] .queue-round-btn.active {
-  color: #050810;
-}
-
-/* Connection indicators: muted Vista blue on light bg */
-[data-theme='wista'] .connection-type,
-[data-theme='wista'] .connection-server {
-  color: #6090b8;
-}
-
-/* Lyrics pane sits inside the queue panel (bg-sidebar = #0e1e3e deep navy).
-   Default --text-primary / --text-muted are near-navy and invisible there —
-   explicit light tokens get the pane back to AA+. */
-[data-theme='wista'] .lyrics-line,
-[data-theme='wista'] .lyrics-status,
-[data-theme='wista'] .lyrics-word-synced .lyrics-line {
-  color: #aac8f0;
-}
-[data-theme='wista'] .lyrics-line.active,
-[data-theme='wista'] .lyrics-word-synced .lyrics-line.active {
-  color: #ffffff;
-}
-[data-theme='wista'] .lyrics-line.completed {
-  color: #aac8f0;
-}
-
diff --git a/src/styles/themes/windows-xp-luna-classic-2001.css b/src/styles/themes/windows-xp-luna-classic-2001.css
deleted file mode 100644
index 4ad2bb31..00000000
--- a/src/styles/themes/windows-xp-luna-classic-2001.css
+++ /dev/null
@@ -1 +0,0 @@
-/* ─── Windows XP Luna — Classic 2001 ─── */
diff --git a/src/styles/themes/windows-xp-luna-teal.css b/src/styles/themes/windows-xp-luna-teal.css
deleted file mode 100644
index 4df83c68..00000000
--- a/src/styles/themes/windows-xp-luna-teal.css
+++ /dev/null
@@ -1,482 +0,0 @@
-/* ─── Windows XP Luna Teal ─── */
-[data-theme='luna-teal'] {
-  color-scheme: light;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23444444%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* ── Palette ── */
-  --ctp-crust: #0041b8;
-  --ctp-mantle: #0055e5;
-  --ctp-base: #ece9d8;
-  --ctp-surface0: #ffffff;
-  --ctp-surface1: #f5f3ec;
-  --ctp-surface2: #ece9d8;
-  --ctp-overlay0: #c0bba8;
-  --ctp-overlay1: #8a8675;
-  --ctp-overlay2: #5e5a4c;
-  --ctp-text: #000000;
-  --ctp-subtext1: #1a1a1a;
-  --ctp-subtext0: #444444;
-  --ctp-mauve: #3c9d29;
-  --ctp-lavender: #52b83c;
-  --ctp-green: #3c9d29;
-  --ctp-teal: #007c8a;
-  --ctp-sky: #316ac5;
-  --ctp-blue: #0055e5;
-  --ctp-sapphire: #0041b8;
-  --ctp-pink: #cc2288;
-  --ctp-flamingo: #cc2020;
-  --ctp-rosewater: #dd4400;
-  --ctp-yellow: #b87800;
-  --ctp-peach: #cc6600;
-  --ctp-maroon: #aa1111;
-  --ctp-red: #cc1111;
-
-  /* ── Semantic tokens ── */
-  --bg-app: #ece9d8;
-  --bg-sidebar: #c8daf5;
-  --bg-card: #ffffff;
-  --bg-hover: #316ac5;
-  --bg-player: #1248b8;
-  --bg-glass: rgba(255, 255, 255, 0.97);
-  --accent: #3c9d29;
-  --accent-dim: rgba(60, 157, 41, 0.14);
-  --accent-glow: rgba(60, 157, 41, 0.35);
-  --volume-accent: #3c9d29;
-  --text-primary: #000000;
-  --text-secondary: #333333;
-  --text-muted: #555555;
-  --border: #003399;
-  --border-subtle: #aca899;
-  --positive: #3c9d29;
-  --warning: #b87800;
-  --danger: #cc1111;
-  --radius-sm: 3px;
-  --radius-md: 4px;
-  --radius-lg: 6px;
-}
-
-/* ── App shell: XP sandy desktop ── */
-[data-theme='luna-teal'] .app-shell {
-  background: #ece9d8;
-}
-
-/* ── Sidebar: XP Explorer task pane / Folders panel ── */
-[data-theme='luna-teal'] .sidebar {
-  background: linear-gradient(180deg, #d8e8fa 0%, #c0d4f5 40%, #b0c8f0 100%);
-  border-right: 1px solid #7090c0;
-  box-shadow: inset -1px 0 0 rgba(255, 255, 255, 0.60), 2px 0 4px rgba(0, 0, 0, 0.14);
-}
-
-/* Sidebar text: dark navy on ice blue — with white text-shadow for legibility */
-[data-theme='luna-teal'] .sidebar-link,
-[data-theme='luna-teal'] .sidebar-section-title,
-[data-theme='luna-teal'] .sidebar-logo-text,
-[data-theme='luna-teal'] .nav-section-label,
-[data-theme='luna-teal'] .brand-name {
-  color: #002060;
-  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.55);
-  font-weight: 700;
-}
-
-/* Nav links */
-[data-theme='luna-teal'] .nav-link {
-  color: #001850;
-}
-
-[data-theme='luna-teal'] .nav-link:hover {
-  background: rgba(255, 255, 255, 0.45);
-  color: #000000;
-  border-radius: 3px;
-}
-
-[data-theme='luna-teal'] .nav-link.active {
-  background: #316ac5;
-  color: #ffffff;
-  border-radius: 3px;
-  text-shadow: none;
-}
-
-[data-theme='luna-teal'] .nav-link.active::before {
-  background: #ffffff;
-}
-
-[data-theme='luna-teal'] .nav-link.active svg,
-[data-theme='luna-teal'] .nav-link:hover svg {
-  opacity: 1;
-}
-
-/* Now Playing nav link */
-[data-theme='luna-teal'] .nav-link-nowplaying {
-  background: rgba(0, 0, 80, 0.10);
-  color: #001850;
-}
-
-[data-theme='luna-teal'] .nav-link-nowplaying:hover {
-  background: rgba(255, 255, 255, 0.45);
-  color: #000000;
-}
-
-[data-theme='luna-teal'] .nav-link-nowplaying.active {
-  background: #316ac5;
-  color: #ffffff;
-}
-
-/* ── Player bar: authentic XP Luna taskbar blue ── */
-[data-theme='luna-teal'] .player-bar {
-  background: linear-gradient(180deg,
-      #4b8ee8 0%,
-      #2568d4 8%,
-      #1a56c4 30%,
-      #1248b8 70%,
-      #0e3da8 85%,
-      #1248b8 100%);
-  border-top: 1px solid #7aaaff;
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.55),
-    inset 0 2px 0 rgba(255, 255, 255, 0.18),
-    0 -2px 8px rgba(0, 0, 0, 0.30);
-}
-
-/* Track name: white with XP glow */
-[data-theme='luna-teal'] .player-track-name {
-  color: #ffffff;
-  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.60), 0 0 10px rgba(120, 180, 255, 0.40);
-  font-weight: 700;
-}
-
-[data-theme='luna-teal'] .player-track-artist {
-  color: #b8d4ff;
-  opacity: 1;
-}
-
-[data-theme='luna-teal'] .player-time {
-  color: #b8d4ff;
-}
-
-/* ── Transport buttons: XP Luna gel circles ── */
-[data-theme='luna-teal'] .player-btn,
-[data-theme='luna-teal'] .player-btn-primary {
-  background: linear-gradient(180deg,
-      #80aaff 0%,
-      #4477ee 45%,
-      #1a50dd 50%,
-      #0c3bb8 100%);
-  color: #ffffff;
-  border: 1px solid #002288;
-  border-radius: 50%;
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.65),
-    0 2px 5px rgba(0, 0, 0, 0.45);
-}
-
-[data-theme='luna-teal'] .player-btn:hover,
-[data-theme='luna-teal'] .player-btn-primary:hover {
-  background: linear-gradient(180deg,
-      #99bbff 0%,
-      #5588ff 45%,
-      #2264ee 50%,
-      #1a52d0 100%);
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.75),
-    0 3px 8px rgba(0, 0, 0, 0.40),
-    0 0 10px rgba(80, 140, 255, 0.40);
-}
-
-/* ── Regular buttons: XP bevel style ── */
-[data-theme='luna-teal'] .btn,
-[data-theme='luna-teal'] .btn-surface,
-[data-theme='luna-teal'] .btn-ghost {
-  background: linear-gradient(180deg, #f5f3ec 0%, #ece9d8 48%, #ddd9c8 50%, #d0cdb8 100%);
-  color: #000000;
-  border: 1px solid #888480;
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.95),
-    inset 1px 0 0 rgba(255, 255, 255, 0.70),
-    0 1px 2px rgba(0, 0, 0, 0.20);
-  border-radius: 3px;
-}
-
-[data-theme='luna-teal'] .btn:hover,
-[data-theme='luna-teal'] .btn-surface:hover,
-[data-theme='luna-teal'] .btn-ghost:hover {
-  background: linear-gradient(180deg, #ffffff 0%, #f0ede0 48%, #e4e0d0 50%, #d8d4c4 100%);
-  border-color: #0055e5;
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 1),
-    0 1px 3px rgba(0, 0, 0, 0.18);
-}
-
-/* ── Primary button: XP green gel ── */
-[data-theme='luna-teal'] .btn-primary {
-  background: linear-gradient(180deg,
-      #66dd50 0%,
-      #3c9d29 45%,
-      #2e8020 50%,
-      #1e6015 100%);
-  color: #ffffff;
-  border: 1px solid #1a5010;
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.55),
-    0 1px 3px rgba(0, 0, 0, 0.30);
-  border-radius: 4px;
-}
-
-[data-theme='luna-teal'] .btn-primary:hover {
-  background: linear-gradient(180deg,
-      #80ee68 0%,
-      #4db035 45%,
-      #3a9028 50%,
-      #2e8020 100%);
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.60),
-    0 1px 4px rgba(0, 0, 0, 0.30),
-    0 0 8px rgba(60, 157, 41, 0.40);
-}
-
-/* ── Hero / album-card play buttons ── */
-[data-theme='luna-teal'] .hero-play-btn,
-[data-theme='luna-teal'] .album-card-details-btn {
-  background: linear-gradient(180deg, #f5f3ec 0%, #d0cdb8 100%);
-  color: #000000;
-  border: 1px solid #888480;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95), 0 1px 2px rgba(0, 0, 0, 0.20);
-}
-
-[data-theme='luna-teal'] .hero-play-btn:hover,
-[data-theme='luna-teal'] .album-card-details-btn:hover {
-  background: linear-gradient(180deg, #ffffff 0%, #ddd9c8 100%);
-  border-color: #0055e5;
-}
-
-/* ── Queue toolbar round buttons ── */
-[data-theme='luna-teal'] .queue-round-btn {
-  background: linear-gradient(180deg, #f5f3ec 0%, #d0cdb8 100%);
-  color: #333333;
-  border: 1px solid #888480;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.90), 0 1px 2px rgba(0, 0, 0, 0.18);
-}
-
-[data-theme='luna-teal'] .queue-round-btn:hover:not(:disabled):not(.active) {
-  background: linear-gradient(180deg, #ffffff 0%, #e0ddd0 100%);
-  border-color: #0055e5;
-  color: #000000;
-}
-
-[data-theme='luna-teal'] .queue-round-btn.active {
-  background: #316ac5;
-  color: #ffffff;
-  border-color: #0033aa;
-  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.30), 0 1px 0 rgba(255, 255, 255, 0.15);
-}
-
-/* ── Cards: XP white window interior ── */
-[data-theme='luna-teal'] .card {
-  background: #ffffff;
-  border: 1px solid #aca899;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 1), 0 1px 3px rgba(0, 0, 0, 0.15);
-  border-radius: 4px;
-}
-
-/* ── Content header: XP title bar gradient ── */
-[data-theme='luna-teal'] .content-header {
-  background: linear-gradient(180deg,
-      #5a9aee 0%,
-      #2a6ad4 25%,
-      #1a56c4 50%,
-      #0e48b8 75%,
-      #0a3aaa 100%);
-  border-bottom: 1px solid #0033aa;
-  color: #ffffff;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.40), 0 2px 4px rgba(0, 0, 0, 0.18);
-}
-
-/* Connection indicators: white on blue header */
-[data-theme='luna-teal'] .connection-type,
-[data-theme='luna-teal'] .connection-server {
-  color: #ffffff;
-  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.50);
-}
-
-/* ── Theme accordion: XP selection blue ── */
-[data-theme='luna-teal'] .theme-accordion-header:hover {
-  background: #316ac5;
-  color: #ffffff;
-}
-
-[data-theme='luna-teal'] .theme-accordion-open .theme-accordion-header {
-  background: #316ac5;
-  color: #ffffff;
-}
-
-[data-theme='luna-teal'] .theme-accordion-open .theme-accordion-chevron {
-  color: #ffffff;
-}
-
-/* ── Progress bar: XP green ── */
-[data-theme='luna-teal'] .progress-bar-track {
-  background: #aca899;
-  border-radius: 2px;
-  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.25);
-}
-
-[data-theme='luna-teal'] .progress-bar-fill {
-  background: linear-gradient(180deg, #52cc3c 0%, #3c9d29 50%, #2e8020 100%);
-  border-radius: 2px;
-}
-
-/* ── Scrollbar: XP 16px system style ── */
-[data-theme='luna-teal'] ::-webkit-scrollbar {
-  width: 16px;
-  height: 16px;
-}
-
-[data-theme='luna-teal'] ::-webkit-scrollbar-track {
-  background: #ece9d8;
-  border-left: 1px solid #aca899;
-}
-
-[data-theme='luna-teal'] ::-webkit-scrollbar-thumb {
-  background: linear-gradient(to right, #c8c4b8 0%, #e0ddd0 40%, #c0bbb4 100%);
-  border: 1px solid #888480;
-  box-shadow: inset 1px 1px 0 #ffffff, inset -1px -1px 0 #888480;
-  border-radius: 2px;
-}
-
-[data-theme='luna-teal'] ::-webkit-scrollbar-button {
-  background: linear-gradient(180deg, #f0ede0 0%, #d8d4c4 100%);
-  border: 1px solid #888480;
-  box-shadow: inset 1px 1px 0 #ffffff, inset -1px -1px 0 #888480;
-}
-
-/* ── Glass / dropdowns: solid XP dialog style ── */
-[data-theme='luna-teal'] .glass {
-  background: #ffffff !important;
-  backdrop-filter: none !important;
-  border: 1px solid #aca899 !important;
-  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.28) !important;
-  border-radius: 4px !important;
-}
-
-[data-theme='luna-teal'] .glass [style*="var(--bg-hover)"] {
-  background: #316ac5 !important;
-  border-radius: 0 !important;
-  color: #ffffff !important;
-}
-
-[data-theme='luna-teal'] .glass [style*="var(--text-primary)"] {
-  color: #000000 !important;
-}
-
-[data-theme='luna-teal'] .glass [style*="var(--text-secondary)"] {
-  color: #333333 !important;
-}
-
-[data-theme='luna-teal'] .glass [style*="var(--text-muted)"] {
-  color: #555555 !important;
-}
-
-/* ── Hover / selection: XP classic blue ── */
-[data-theme='luna-teal'] .queue-tab-btn:hover {
-  background: #316ac5;
-  color: #ffffff;
-}
-
-[data-theme='luna-teal'] .settings-tab:hover {
-  background: #316ac5;
-  color: #ffffff;
-}
-
-[data-theme='luna-teal'] .settings-tab.active {
-  background: #316ac5;
-  color: #ffffff;
-}
-
-[data-theme='luna-teal'] .custom-select-trigger:hover {
-  background: #316ac5;
-  color: #ffffff;
-}
-
-[data-theme='luna-teal'] .custom-select-option:hover {
-  background: #316ac5 !important;
-  color: #ffffff !important;
-}
-
-[data-theme='luna-teal'] .artist-ext-link:hover {
-  background: #316ac5;
-  color: #ffffff !important;
-}
-
-[data-theme='luna-teal'] .np-action-btn:hover {
-  background: #316ac5;
-  color: #ffffff;
-}
-
-[data-theme='luna-teal'] .np-queue-item:hover,
-[data-theme='luna-teal'] .np-queue-item.context-active {
-  background: #316ac5;
-  color: #ffffff;
-}
-
-[data-theme='luna-teal'] .track-row:hover,
-[data-theme='luna-teal'] .track-row.context-active {
-  background: #316ac5 !important;
-}
-
-[data-theme='luna-teal'] .track-row:hover *,
-[data-theme='luna-teal'] .track-row.context-active * {
-  color: #ffffff !important;
-}
-
-[data-theme='luna-teal'] .artist-row:hover {
-  background: #316ac5;
-  color: #ffffff;
-}
-
-[data-theme='luna-teal'] .playlist-row:hover {
-  background: #316ac5;
-}
-
-[data-theme='luna-teal'] .playlist-row:hover,
-[data-theme='luna-teal'] .playlist-row:hover * {
-  color: #ffffff;
-}
-
-[data-theme='luna-teal'] .queue-item:hover,
-[data-theme='luna-teal'] .queue-item.context-active {
-  background: #316ac5 !important;
-}
-
-[data-theme='luna-teal'] .queue-item:hover .queue-item-title,
-[data-theme='luna-teal'] .queue-item:hover .queue-item-artist,
-[data-theme='luna-teal'] .queue-item:hover .queue-item-duration,
-[data-theme='luna-teal'] .queue-item.context-active .queue-item-title,
-[data-theme='luna-teal'] .queue-item.context-active .queue-item-artist,
-[data-theme='luna-teal'] .queue-item.context-active .queue-item-duration {
-  color: #ffffff;
-}
-
-/* ── Active queue / now-playing items ── */
-[data-theme='luna-teal'] .queue-item.active {
-  background: rgba(49, 106, 197, 0.12);
-  color: #0041b8;
-}
-
-[data-theme='luna-teal'] .queue-item.active .queue-item-artist,
-[data-theme='luna-teal'] .queue-item.active .queue-item-duration {
-  color: #0055e5;
-  opacity: 0.85;
-}
-
-[data-theme='luna-teal'] .np-queue-item-active {
-  color: #0041b8;
-}
-
-[data-theme='luna-teal'] .np-queue-item.active {
-  background: rgba(49, 106, 197, 0.10);
-}
-
-[data-theme='luna-teal'] .np-album-track.active .np-album-track-title,
-[data-theme='luna-teal'] .np-album-track.active .np-album-track-num {
-  color: #0041b8;
-}
-
diff --git a/src/styles/themes/wmp8-classic-windows-media-player-8-xp-luna.css b/src/styles/themes/wmp8-classic-windows-media-player-8-xp-luna.css
deleted file mode 100644
index b46c5656..00000000
--- a/src/styles/themes/wmp8-classic-windows-media-player-8-xp-luna.css
+++ /dev/null
@@ -1,170 +0,0 @@
-/* ─── WMP8 Classic — Windows Media Player 8 / XP Luna ─── */
-[data-theme='winmedplayer'] {
-  color-scheme: dark;
-  --select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23c2d4f2%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
-
-  /* ── Palette ── */
-  --ctp-crust: #000000;
-  /* black — LCD display / playlist */
-  --ctp-mantle: #1a3060;
-  /* darkest blue — sidebar */
-  --ctp-base: #3a62a5;
-  /* Luna blue — main body (dark enough for white text) */
-  --ctp-surface0: #4a72b8;
-  --ctp-surface1: #5480cc;
-  --ctp-surface2: #6090d8;
-  --ctp-overlay0: #7090c0;
-  --ctp-overlay1: #8aaad8;
-  --ctp-overlay2: #a0c0e8;
-  --ctp-text: #ffffff;
-  --ctp-subtext1: #dce8ff;
-  --ctp-subtext0: #b8d0f8;
-  /* WMP green + XP blue-cool palette */
-  --ctp-mauve: #45ff00;
-  /* WMP poison green — primary accent */
-  --ctp-lavender: #70ff40;
-  --ctp-green: #30dd00;
-  --ctp-teal: #00cc88;
-  --ctp-sky: #88ccff;
-  --ctp-blue: #5599ee;
-  --ctp-sapphire: #3378cc;
-  --ctp-pink: #ff88cc;
-  --ctp-flamingo: #ff7788;
-  --ctp-rosewater: #ffaabb;
-  --ctp-yellow: #ffdd44;
-  --ctp-peach: #ff9944;
-  --ctp-maroon: #dd4455;
-  --ctp-red: #ee3344;
-
-  /* ── Semantic tokens ── */
-  --bg-app: #3a62a5;
-  /* ~12% luminance → white contrast 6:1 */
-  --bg-sidebar: #1a3060;
-  --bg-card: #4a72b8;
-  --bg-hover: #5480cc;
-  --bg-player: #000000;
-  --bg-glass: rgba(30, 58, 110, 0.88);
-  --accent: #45ff00;
-  --accent-dim: rgba(69, 255, 0, 0.15);
-  --accent-glow: rgba(69, 255, 0, 0.45);
-  --text-primary: #ffffff;
-  --text-secondary: #dce8ff;
-  --text-muted: #e8f0ff;
-  /* lifted from #b8d0f8 — clears AA on Luna-blue bg-app and dark sidebar */
-  --border: #071027;
-  /* darkened from #2a5090 to meet 3:1 UI threshold on all main surfaces */
-  --border-subtle: #4a72b8;
-  --positive: #30dd00;
-  --warning: #ffdd44;
-  --danger: #ee3344;
-}
-
-/* ── WMP8: Luna-style gradients + skeuomorphic detail ── */
-
-/* Sidebar: deep WMP task-pane blue */
-[data-theme='winmedplayer'] .sidebar {
-  background: linear-gradient(180deg, #244080 0%, #1a3060 60%, #0e2048 100%);
-  border-right: 2px solid #0e2048;
-  box-shadow: inset -1px 0 0 rgba(120, 160, 220, 0.2);
-}
-
-/* Main body: Luna blue */
-[data-theme='winmedplayer'] .app-shell {
-  background: linear-gradient(160deg, #4a72b8 0%, #3a62a5 40%, #2e5498 100%);
-}
-
-/* Player bar: black LCD display with green glow ambience */
-[data-theme='winmedplayer'] .player-bar {
-  background: #000000;
-  border-top: 2px solid #1a3060;
-  box-shadow: inset 0 1px 0 rgba(69, 255, 0, 0.06), 0 -2px 12px rgba(0, 0, 0, 0.6);
-}
-
-/* Track name: WMP green glow */
-[data-theme='winmedplayer'] .player-track-name {
-  color: #45ff00;
-  text-shadow:
-    0 0 8px rgba(69, 255, 0, 0.80),
-    0 0 16px rgba(69, 255, 0, 0.40),
-    0 0 2px rgba(69, 255, 0, 0.60);
-  letter-spacing: 0.03em;
-}
-
-[data-theme='winmedplayer'] .player-track-artist {
-  color: #30dd00;
-  opacity: 0.85;
-  text-shadow: 0 0 4px rgba(69, 255, 0, 0.4);
-}
-
-/* Transport buttons: round, radial metallic gradient, drop shadow */
-[data-theme='winmedplayer'] .player-btn,
-[data-theme='winmedplayer'] .player-btn-primary {
-  background: radial-gradient(circle at 38% 32%, #c8dcf8 0%, #8aacdc 40%, #4870b8 100%);
-  color: #ffffff;
-  border-radius: 50%;
-  box-shadow:
-    0 3px 8px rgba(0, 0, 0, 0.55),
-    0 1px 2px rgba(0, 0, 0, 0.35),
-    inset 0 1px 0 rgba(255, 255, 255, 0.55),
-    inset 0 -1px 0 rgba(0, 0, 50, 0.3);
-  border: 1px solid #2a5090;
-}
-
-[data-theme='winmedplayer'] .player-btn:hover,
-[data-theme='winmedplayer'] .player-btn-primary:hover {
-  background: radial-gradient(circle at 38% 32%, #d8ecff 0%, #a0c0ee 40%, #5888d0 100%);
-  box-shadow:
-    0 4px 10px rgba(0, 0, 0, 0.55),
-    0 1px 2px rgba(0, 0, 0, 0.35),
-    inset 0 1px 0 rgba(255, 255, 255, 0.6),
-    inset 0 -1px 0 rgba(0, 0, 50, 0.3);
-}
-
-/* Regular buttons: Luna soft rounded pill */
-[data-theme='winmedplayer'] .btn {
-  background: linear-gradient(180deg, #b8d0f0 0%, #7898d8 55%, #5878c0 100%);
-  color: #ffffff;
-  border-radius: 12px;
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.5),
-    inset 0 -1px 0 rgba(0, 0, 80, 0.25),
-    0 2px 4px rgba(0, 0, 0, 0.3);
-  border: 1px solid #3a60b0;
-}
-
-[data-theme='winmedplayer'] .btn:hover {
-  background: linear-gradient(180deg, #cce0ff 0%, #90aaee 55%, #6888d0 100%);
-}
-
-[data-theme='winmedplayer'] .btn-primary {
-  background: linear-gradient(180deg, #70ff40 0%, #38cc00 55%, #28aa00 100%);
-  color: #003300;
-  border: 1px solid #208800;
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.5),
-    inset 0 -1px 0 rgba(0, 60, 0, 0.25),
-    0 2px 6px rgba(0, 0, 0, 0.3),
-    0 0 8px rgba(69, 255, 0, 0.25);
-}
-
-/* Active queue round buttons: green bg, dark text */
-[data-theme='winmedplayer'] .queue-round-btn.active {
-  color: #003300;
-}
-
-/* Cards / glass panels: slightly elevated with border */
-[data-theme='winmedplayer'] .glass,
-[data-theme='winmedplayer'] .card {
-  background: rgba(90, 128, 190, 0.55);
-  border: 1px solid rgba(160, 190, 230, 0.5);
-  box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.25),
-    0 2px 6px rgba(0, 0, 0, 0.2);
-}
-
-/* Content header: slightly darker Luna band */
-[data-theme='winmedplayer'] .content-header {
-  background: linear-gradient(180deg, rgba(58, 98, 165, 0.55) 0%, rgba(58, 98, 165, 0.2) 100%);
-  border-bottom: 1px solid #6888c2;
-}
-
diff --git a/src/styles/themes/wnamp-component-level-overrides.css b/src/styles/themes/wnamp-component-level-overrides.css
deleted file mode 100644
index e1ac4b74..00000000
--- a/src/styles/themes/wnamp-component-level-overrides.css
+++ /dev/null
@@ -1,54 +0,0 @@
-/* ─── wnamp — component-level overrides ──────────────────────────────── */
-
-/* Column resize grip — was surface1 on bg-card = 1.19:1 (invisible) */
-[data-theme='wnamp'] .col-resize-handle::after {
-  background: var(--ctp-overlay1); /* #8a8a96 → 3.4:1 on bg-card */
-  width: 2px;
-}
-
-/* Focus ring — keyboard navigation, accent gold for visibility */
-[data-theme='wnamp'] *:focus-visible {
-  outline: 2px solid var(--accent);
-  outline-offset: 2px;
-}
-
-/* Scrollbar thumb — explicit contrast */
-[data-theme='wnamp'] ::-webkit-scrollbar-thumb {
-  background: var(--ctp-overlay0);
-}
-[data-theme='wnamp'] *:hover::-webkit-scrollbar-thumb,
-[data-theme='wnamp'] .is-scrolling::-webkit-scrollbar-thumb {
-  background: var(--ctp-overlay2);
-}
-
-/* ── Classic Winamp: LCD display + bevel buttons ── */
-[data-theme='wnamp'] .connection-type {
-  color: var(--text-primary);
-}
-
-[data-theme='wnamp'] .connection-server {
-  color: var(--text-secondary);
-}
-
-[data-theme='wnamp'] .player-track-name {
-  color: #00ff00;
-  text-shadow: 0 0 6px rgba(0, 255, 0, 0.65), 0 0 2px rgba(0, 255, 0, 0.4);
-  font-family: 'Courier New', 'Lucida Console', monospace;
-  letter-spacing: 0.04em;
-}
-
-[data-theme='wnamp'] .player-track-artist {
-  color: #00cc00;
-  font-family: 'Courier New', 'Lucida Console', monospace;
-  opacity: 0.85;
-}
-
-[data-theme='wnamp'] .btn {
-  box-shadow: inset 1px 1px 0 rgba(255, 255, 255, 0.18), inset -1px -1px 0 rgba(0, 0, 0, 0.55), 0 1px 3px rgba(0, 0, 0, 0.4);
-}
-
-[data-theme='wnamp'] .player-btn,
-[data-theme='wnamp'] .player-btn-primary {
-  box-shadow: inset 1px 1px 0 rgba(255, 255, 255, 0.18), inset -1px -1px 0 rgba(0, 0, 0, 0.55), 0 2px 5px rgba(0, 0, 0, 0.5);
-}
-
diff --git a/src/styles/tracks/shared-songrow-used-by-tracks-hub-searchresults-advancedsearch.css b/src/styles/tracks/shared-songrow-used-by-tracks-hub-searchresults-advancedsearch.css
index 36f8ddc1..d11788f3 100644
--- a/src/styles/tracks/shared-songrow-used-by-tracks-hub-searchresults-advancedsearch.css
+++ b/src/styles/tracks/shared-songrow-used-by-tracks-hub-searchresults-advancedsearch.css
@@ -10,19 +10,19 @@
   font-size: 13px;
   cursor: default;
   transition: background var(--transition-fast);
-  border-bottom: 1px solid var(--border-subtle);
+  border-bottom: 1px solid var(--row-divider);
 }
 
 .song-list-row:hover {
-  background: var(--bg-hover);
+  background: var(--row-hover);
 }
 
 .song-list-row.is-current {
-  background: color-mix(in srgb, var(--accent) 14%, transparent);
+  background: var(--row-playing-bg);
 }
 
 .song-list-row.is-current .song-list-row-title {
-  color: var(--accent);
+  color: var(--row-playing-text);
 }
 
 .song-list-row--header {
@@ -31,7 +31,7 @@
   font-weight: 600;
   text-transform: uppercase;
   letter-spacing: 0.04em;
-  color: var(--text-muted);
+  color: var(--col-header-text);
   cursor: default;
   /* Header lives inside the scroll container so its width matches the rows'
      (scrollbar gutter applies to both). Sticky keeps it pinned while scrolling
@@ -40,7 +40,7 @@
   top: 0;
   z-index: 2;
   background: var(--bg-card);
-  border-bottom: 1px solid var(--border-subtle);
+  border-bottom: 1px solid var(--row-divider);
 }
 
 /* Header is sticky and opaque — keep its card background on hover so the
@@ -62,18 +62,18 @@
 
 .song-list-row-title {
   font-weight: 500;
-  color: var(--text-primary);
+  color: var(--row-text);
 }
 
 .song-list-row-genre {
-  color: var(--text-muted);
+  color: var(--row-text-muted);
   font-size: 12px;
 }
 
 .song-list-row-duration {
   text-align: right;
   font-variant-numeric: tabular-nums;
-  color: var(--text-muted);
+  color: var(--row-text-muted);
   font-size: 12px;
 }
 
@@ -84,14 +84,14 @@
 .song-list-row-bpm {
   text-align: right;
   font-variant-numeric: tabular-nums;
-  color: var(--text-muted);
+  color: var(--row-text-muted);
   font-size: 12px;
 }
 
 .song-list-row-btn {
   background: transparent;
   border: none;
-  color: var(--text-muted);
+  color: var(--row-text-muted);
   width: 28px;
   height: 28px;
   border-radius: 50%;
@@ -104,8 +104,8 @@
 }
 
 .song-list-row-btn:hover {
-  background: var(--bg-hover);
-  color: var(--text-primary);
+  background: var(--row-hover);
+  color: var(--row-text);
 }
 
 .song-list-row-btn--play {
@@ -114,7 +114,7 @@
 
 .song-list-row-btn--play:hover {
   background: var(--accent);
-  color: var(--ctp-crust, #11111b);
+  color: var(--text-on-accent);
 }
 
 .song-list-row.is-current .song-list-row-btn--play {
diff --git a/src/styles/tracks/song-card.css b/src/styles/tracks/song-card.css
index 90827b27..1c1f3e05 100644
--- a/src/styles/tracks/song-card.css
+++ b/src/styles/tracks/song-card.css
@@ -62,7 +62,7 @@
 
 .song-card-action-btn {
   background: var(--accent);
-  color: var(--ctp-crust);
+  color: var(--text-on-accent);
   border: none;
   width: 32px;
   height: 32px;
diff --git a/src/utils/componentHelpers/queuePanelHelpers.tsx b/src/utils/componentHelpers/queuePanelHelpers.tsx
index 960c7215..f2d8f4e6 100644
--- a/src/utils/componentHelpers/queuePanelHelpers.tsx
+++ b/src/utils/componentHelpers/queuePanelHelpers.tsx
@@ -27,8 +27,8 @@ export function renderStars(rating?: number) {
       <Star
         key={i}
         size={12}
-        fill={i <= rating ? 'var(--ctp-yellow)' : 'none'}
-        color={i <= rating ? 'var(--ctp-yellow)' : 'var(--text-muted)'}
+        fill={i <= rating ? 'var(--highlight)' : 'none'}
+        color={i <= rating ? 'var(--highlight)' : 'var(--text-muted)'}
       />
     );
   }
diff --git a/src/utils/export/exportAlbumCard.ts b/src/utils/export/exportAlbumCard.ts
index 0dfaa1b4..51570d54 100644
--- a/src/utils/export/exportAlbumCard.ts
+++ b/src/utils/export/exportAlbumCard.ts
@@ -101,7 +101,7 @@ function getCachedLogoSvg(color: string): string {
   const raw = renderToStaticMarkup(React.createElement(PsysonicLogo, { gradientIdSuffix: 'export' }));
   const swapped = raw
     .replace('var(--logo-color-start, var(--accent))', color)
-    .replace('var(--logo-color-end, var(--ctp-blue))', color);
+    .replace('var(--logo-color-end, var(--accent-2))', color);
   cachedLogoSvg = swapped;
   cachedLogoSvgKey = color;
   return swapped;
diff --git a/src/utils/themes/themeInjection.test.ts b/src/utils/themes/themeInjection.test.ts
new file mode 100644
index 00000000..0b4ae4ca
--- /dev/null
+++ b/src/utils/themes/themeInjection.test.ts
@@ -0,0 +1,109 @@
+/**
+ * Tests for the runtime theme-CSS trust boundary and <head> injection sync.
+ */
+import { afterEach, describe, expect, it } from 'vitest';
+import {
+  validateThemeCss,
+  injectTheme,
+  syncInjectedThemes,
+} from './themeInjection';
+import type { InstalledTheme } from '../../store/installedThemesStore';
+
+const ATTR = 'data-installed-theme';
+
+function mk(id: string, css: string): InstalledTheme {
+  return { id, name: id, author: 'a', version: '1.0.0', description: '', mode: 'dark', css, installedAt: 0 };
+}
+const block = (id: string, body = '--accent:#fff;') => `[data-theme='${id}']{ ${body} }`;
+const injected = () => document.head.querySelectorAll(`style[${ATTR}]`);
+
+afterEach(() => {
+  document.head.querySelectorAll(`style[${ATTR}]`).forEach((el) => el.remove());
+});
+
+describe('validateThemeCss', () => {
+  it('accepts a valid single scoped rule', () => {
+    expect(validateThemeCss(block('dracula'), 'dracula')).not.toBeNull();
+  });
+
+  it('accepts a data: url on the contract (e.g. --select-arrow)', () => {
+    const css = block('x', `--select-arrow: url("data:image/svg+xml,%3Csvg%3E%3C/svg%3E");`);
+    expect(validateThemeCss(css, 'x')).not.toBeNull();
+  });
+
+  it('rejects @import', () => {
+    expect(validateThemeCss(`@import 'evil.css'; ${block('x')}`, 'x')).toBeNull();
+  });
+
+  it('rejects a non-data url()', () => {
+    expect(validateThemeCss(block('x', `--accent: url(https://evil.test/x.png);`), 'x')).toBeNull();
+  });
+
+  it('rejects </style> breakout', () => {
+    expect(validateThemeCss(`${block('x')}</style><script>`, 'x')).toBeNull();
+  });
+
+  it('rejects an unscoped/global selector', () => {
+    expect(validateThemeCss(':root{ --accent:red; }', 'x')).toBeNull();
+    expect(validateThemeCss('*{ color:red; }', 'x')).toBeNull();
+  });
+
+  it('rejects a foreign theme id selector', () => {
+    expect(validateThemeCss(block('other'), 'dracula')).toBeNull();
+  });
+
+  it('rejects more than one rule', () => {
+    expect(validateThemeCss(`${block('x')} ${block('x', '--bg-app:#000;')}`, 'x')).toBeNull();
+  });
+
+  it('rejects expression() / javascript:', () => {
+    expect(validateThemeCss(block('x', '--accent: expression(alert(1));'), 'x')).toBeNull();
+    expect(validateThemeCss(block('x', '--accent: javascript:alert(1);'), 'x')).toBeNull();
+  });
+
+  it('rejects an oversized css blob', () => {
+    const huge = `[data-theme='x']{ ${'--accent:#ffffff;'.repeat(6000)} }`;
+    expect(huge.length).toBeGreaterThan(64 * 1024);
+    expect(validateThemeCss(huge, 'x')).toBeNull();
+  });
+
+  it('ignores comments when validating', () => {
+    expect(validateThemeCss(`/* hi */ ${block('x')}`, 'x')).not.toBeNull();
+    // comment cannot smuggle a second rule past the single-rule shape
+    expect(validateThemeCss(`${block('x')} /* */ ${block('x')}`, 'x')).toBeNull();
+  });
+});
+
+describe('syncInjectedThemes', () => {
+  it('injects one <style> per installed theme', () => {
+    syncInjectedThemes([mk('a', block('a')), mk('b', block('b'))]);
+    expect(injected()).toHaveLength(2);
+    expect(document.head.querySelector(`style[${ATTR}="a"]`)?.textContent).toContain('data-theme');
+  });
+
+  it('removes styles for themes no longer installed', () => {
+    syncInjectedThemes([mk('a', block('a')), mk('b', block('b'))]);
+    syncInjectedThemes([mk('a', block('a'))]);
+    expect(injected()).toHaveLength(1);
+    expect(document.head.querySelector(`style[${ATTR}="b"]`)).toBeNull();
+  });
+
+  it('is idempotent (no duplicate elements)', () => {
+    syncInjectedThemes([mk('a', block('a'))]);
+    syncInjectedThemes([mk('a', block('a'))]);
+    expect(injected()).toHaveLength(1);
+  });
+
+  it('updates textContent when the css changes', () => {
+    injectTheme(mk('a', block('a', '--accent:#111;')));
+    injectTheme(mk('a', block('a', '--accent:#222;')));
+    const el = document.head.querySelector(`style[${ATTR}="a"]`);
+    expect(injected()).toHaveLength(1);
+    expect(el?.textContent).toContain('#222');
+  });
+
+  it('does not inject invalid css', () => {
+    syncInjectedThemes([mk('a', ':root{ --accent:red; }')]);
+    expect(injected()).toHaveLength(0);
+  });
+});
diff --git a/src/utils/themes/themeInjection.ts b/src/utils/themes/themeInjection.ts
new file mode 100644
index 00000000..fdadc0a3
--- /dev/null
+++ b/src/utils/themes/themeInjection.ts
@@ -0,0 +1,92 @@
+import type { InstalledTheme } from '../../store/installedThemesStore';
+
+/**
+ * Runtime CSS injection for installed community themes. Built-in themes are
+ * bundled at build time (`src/styles/themes/index.css`); installed ones have no
+ * build-time presence, so their `[data-theme='<id>']` block must be injected
+ * into <head> at runtime. Each installed theme gets one
+ * `<style data-installed-theme="<id>">` element, kept in sync with the store.
+ */
+
+const ATTR = 'data-installed-theme';
+
+function escapeRegExp(s: string): string {
+  return s.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+}
+
+/**
+ * Validate one installed theme's CSS against the runtime trust boundary. The
+ * repo CI is the authoritative contract check (token whitelist, thumbnail, …);
+ * this is the in-app guard for the structural invariants the app *relies on* to
+ * keep a theme contained — important because every installed theme is injected
+ * into <head> at all times and scoping depends entirely on the selector.
+ *
+ * A valid theme CSS is **exactly one rule**, scoped **exactly** to this theme's
+ * `[data-theme='<id>']` selector, with:
+ *  - no `<style>`/`</style>` (can't break out of the element),
+ *  - no `@import` / at-rules (the single-rule shape rejects these),
+ *  - no unscoped/global (`:root`, `html`, `*`) or *foreign* (another id's)
+ *    selector — so it can never style anything but its own theme,
+ *  - `url()` only as `data:` (the inline `--select-arrow` SVG), and
+ *  - no `expression()` / `javascript:`.
+ *
+ * Returns the original CSS if valid, or `null` if it must not be injected.
+ */
+export function validateThemeCss(css: string, id: string): string | null {
+  if (typeof css !== 'string' || !css) return null;
+  // Bound the per-theme localStorage footprint. A real token-only theme is a
+  // few KB; this generous cap rejects a pathological/huge file before it can
+  // eat the install store's quota.
+  if (css.length > 64 * 1024) return null;
+  // Strip comments first so they can't smuggle content past the checks.
+  const stripped = css.replace(/\/\*[\s\S]*?\*\//g, '').trim();
+  if (/<\/?\s*style/i.test(stripped)) return null;
+  if (/@import/i.test(stripped)) return null;
+  // Exactly one rule, scoped to exactly this theme's selector. The single
+  // braces-pair shape also rejects at-rules (`@media{…}`), extra rules, and
+  // unscoped/foreign selectors.
+  const selector = `\\[data-theme=(['"])${escapeRegExp(id)}\\1\\]`;
+  const match = stripped.match(new RegExp(`^${selector}\\s*\\{([^{}]*)\\}$`));
+  if (!match) return null;
+  const body = match[2]; // group 1 is the selector quote; group 2 is the declarations
+  if (/expression\s*\(/i.test(body) || /javascript:/i.test(body)) return null;
+  const urls = body.match(/url\(\s*['"]?[^'")]*/gi) || [];
+  for (const u of urls) {
+    const inner = u.replace(/^url\(\s*['"]?/i, '');
+    if (!/^data:/i.test(inner)) return null;
+  }
+  return css;
+}
+
+export function injectTheme(theme: InstalledTheme): void {
+  const clean = validateThemeCss(theme.css, theme.id);
+  if (clean == null) return;
+  const selector = `style[${ATTR}="${CSS.escape(theme.id)}"]`;
+  let el = document.head.querySelector<HTMLStyleElement>(selector);
+  if (!el) {
+    el = document.createElement('style');
+    el.setAttribute(ATTR, theme.id);
+    document.head.appendChild(el);
+  }
+  if (el.textContent !== clean) el.textContent = clean;
+}
+
+export function removeInjectedTheme(id: string): void {
+  document.head.querySelector(`style[${ATTR}="${CSS.escape(id)}"]`)?.remove();
+}
+
+/**
+ * Reconcile the injected <style> elements with the given installed set: drop
+ * styles for themes no longer installed, add/update the rest. Idempotent —
+ * safe to call on every change and at startup.
+ */
+export function syncInjectedThemes(themes: InstalledTheme[]): void {
+  const wanted = new Set(themes.map((t) => t.id));
+  document.head
+    .querySelectorAll<HTMLStyleElement>(`style[${ATTR}]`)
+    .forEach((el) => {
+      const id = el.getAttribute(ATTR);
+      if (id && !wanted.has(id)) el.remove();
+    });
+  for (const theme of themes) injectTheme(theme);
+}
diff --git a/src/utils/themes/themeMigration.test.ts b/src/utils/themes/themeMigration.test.ts
new file mode 100644
index 00000000..55fd4cd1
--- /dev/null
+++ b/src/utils/themes/themeMigration.test.ts
@@ -0,0 +1,179 @@
+/**
+ * Tests for the slim-bundle theme migration (C5).
+ *
+ * The migration rewrites the persisted theme selection in localStorage before
+ * React mounts: any theme/themeDay/themeNight that is neither bundled
+ * (FIXED_THEMES) nor installed is reset to a bundled fallback — Mocha for the
+ * main + night slots, Latte for the day slot. It never installs anything and
+ * must never throw on malformed/missing storage.
+ */
+import { afterEach, describe, expect, it } from 'vitest';
+import {
+  migrateThemeSelection,
+  readThemeMigrationNotice,
+  clearThemeMigrationNotice,
+} from './themeMigration';
+import { FIXED_THEMES } from '../../components/settings/fixedThemes';
+
+const THEME_KEY = 'psysonic_theme';
+const INSTALLED_KEY = 'psysonic_installed_themes';
+
+interface ThemeSlots {
+  theme?: unknown;
+  themeDay?: unknown;
+  themeNight?: unknown;
+  [k: string]: unknown;
+}
+
+function setPersistedTheme(state: ThemeSlots, version = 1): void {
+  localStorage.setItem(THEME_KEY, JSON.stringify({ state, version }));
+}
+
+function readPersistedTheme(): { state: ThemeSlots; version: number } {
+  return JSON.parse(localStorage.getItem(THEME_KEY) as string);
+}
+
+function setInstalled(ids: string[]): void {
+  localStorage.setItem(
+    INSTALLED_KEY,
+    JSON.stringify({ state: { themes: ids.map((id) => ({ id })) }, version: 1 }),
+  );
+}
+
+afterEach(() => {
+  localStorage.clear();
+});
+
+describe('migrateThemeSelection', () => {
+  it('does nothing when there is no persisted theme (fresh profile)', () => {
+    migrateThemeSelection();
+    expect(localStorage.getItem(THEME_KEY)).toBeNull();
+  });
+
+  it('leaves bundled (fixed) themes untouched', () => {
+    setPersistedTheme({ theme: 'kanagawa-wave', themeDay: 'latte', themeNight: 'mocha' });
+    migrateThemeSelection();
+    expect(readPersistedTheme().state).toMatchObject({
+      theme: 'kanagawa-wave',
+      themeDay: 'latte',
+      themeNight: 'mocha',
+    });
+  });
+
+  it('every fixed theme id resolves (none is treated as unresolved)', () => {
+    const ids = FIXED_THEMES.map((t) => t.id);
+    setPersistedTheme({ theme: ids[0], themeDay: ids[1], themeNight: ids[2] });
+    migrateThemeSelection();
+    expect(readPersistedTheme().state).toMatchObject({
+      theme: ids[0],
+      themeDay: ids[1],
+      themeNight: ids[2],
+    });
+  });
+
+  it('resets an unresolved main theme to Mocha (dark)', () => {
+    setPersistedTheme({ theme: 'dracula', themeDay: 'latte', themeNight: 'mocha' });
+    migrateThemeSelection();
+    expect(readPersistedTheme().state.theme).toBe('mocha');
+  });
+
+  it('resets an unresolved day theme to Latte (light)', () => {
+    setPersistedTheme({ theme: 'mocha', themeDay: 'nord-snowstorm', themeNight: 'mocha' });
+    migrateThemeSelection();
+    expect(readPersistedTheme().state.themeDay).toBe('latte');
+  });
+
+  it('resets an unresolved night theme to Mocha (dark)', () => {
+    setPersistedTheme({ theme: 'mocha', themeDay: 'latte', themeNight: 'blade' });
+    migrateThemeSelection();
+    expect(readPersistedTheme().state.themeNight).toBe('mocha');
+  });
+
+  it('keeps a store theme that the user has installed', () => {
+    setInstalled(['dracula']);
+    setPersistedTheme({ theme: 'dracula', themeDay: 'latte', themeNight: 'mocha' });
+    migrateThemeSelection();
+    expect(readPersistedTheme().state.theme).toBe('dracula');
+  });
+
+  it('migrates only the unresolved slots and preserves the rest', () => {
+    setInstalled(['gruvbox-dark-hard']);
+    setPersistedTheme({
+      theme: 'nord', // unresolved -> mocha
+      themeDay: 'latte', // fixed -> unchanged
+      themeNight: 'gruvbox-dark-hard', // installed -> unchanged
+      timeDayStart: '07:00',
+      enableThemeScheduler: true,
+    });
+    migrateThemeSelection();
+    const { state, version } = readPersistedTheme();
+    expect(state).toMatchObject({
+      theme: 'mocha',
+      themeDay: 'latte',
+      themeNight: 'gruvbox-dark-hard',
+      timeDayStart: '07:00',
+      enableThemeScheduler: true,
+    });
+    expect(version).toBe(1);
+  });
+
+  it('does not rewrite storage when nothing changes', () => {
+    setPersistedTheme({ theme: 'mocha', themeDay: 'latte', themeNight: 'mocha' });
+    const before = localStorage.getItem(THEME_KEY);
+    migrateThemeSelection();
+    expect(localStorage.getItem(THEME_KEY)).toBe(before);
+  });
+
+  it('still falls back when the installed-themes store is malformed', () => {
+    localStorage.setItem(INSTALLED_KEY, '{not valid json');
+    setPersistedTheme({ theme: 'dracula', themeDay: 'latte', themeNight: 'mocha' });
+    migrateThemeSelection();
+    expect(readPersistedTheme().state.theme).toBe('mocha');
+  });
+
+  it('does not throw on malformed theme storage', () => {
+    localStorage.setItem(THEME_KEY, '{not valid json');
+    expect(() => migrateThemeSelection()).not.toThrow();
+    expect(localStorage.getItem(THEME_KEY)).toBe('{not valid json');
+  });
+
+  it('ignores empty-string slot values', () => {
+    setPersistedTheme({ theme: '', themeDay: 'latte', themeNight: 'mocha' });
+    migrateThemeSelection();
+    // empty string is not a real selection — left as-is, store applies its default
+    expect(readPersistedTheme().state.theme).toBe('');
+  });
+});
+
+describe('theme migration notice', () => {
+  it('records the original id(s) that were reset', () => {
+    setPersistedTheme({ theme: 'dracula', themeDay: 'latte', themeNight: 'nord' });
+    migrateThemeSelection();
+    expect(readThemeMigrationNotice().sort()).toEqual(['dracula', 'nord']);
+  });
+
+  it('deduplicates ids used in multiple slots', () => {
+    setPersistedTheme({ theme: 'dracula', themeDay: 'latte', themeNight: 'dracula' });
+    migrateThemeSelection();
+    expect(readThemeMigrationNotice()).toEqual(['dracula']);
+  });
+
+  it('writes no notice when nothing was reset', () => {
+    setPersistedTheme({ theme: 'mocha', themeDay: 'latte', themeNight: 'mocha' });
+    migrateThemeSelection();
+    expect(readThemeMigrationNotice()).toEqual([]);
+  });
+
+  it('clear removes the notice', () => {
+    setPersistedTheme({ theme: 'dracula', themeDay: 'latte', themeNight: 'mocha' });
+    migrateThemeSelection();
+    expect(readThemeMigrationNotice()).toEqual(['dracula']);
+    clearThemeMigrationNotice();
+    expect(readThemeMigrationNotice()).toEqual([]);
+  });
+
+  it('returns [] on malformed notice storage', () => {
+    localStorage.setItem('psysonic_theme_migration_notice', '{not json');
+    expect(readThemeMigrationNotice()).toEqual([]);
+  });
+});
diff --git a/src/utils/themes/themeMigration.ts b/src/utils/themes/themeMigration.ts
new file mode 100644
index 00000000..e315135c
--- /dev/null
+++ b/src/utils/themes/themeMigration.ts
@@ -0,0 +1,107 @@
+import { FIXED_THEMES } from '../../components/settings/fixedThemes';
+
+/**
+ * Slim-bundle theme migration (C5). Older builds bundled ~80 palettes that now
+ * live only in the community Theme Store. A persisted active / scheduler theme
+ * may therefore reference an id that is neither bundled (`FIXED_THEMES`) nor
+ * installed — it would resolve to no `[data-theme]` block and render as an
+ * unstyled `:root`.
+ *
+ * This runs synchronously in `runPreReactBootstrap` *before* React mounts,
+ * rewriting the persisted selection in localStorage so the store hydrates
+ * already-correct (no flash of the wrong/blank theme — Zustand rehydrate runs
+ * after first paint, so we read/write the persisted JSON directly, matching the
+ * other pre-React bootstrap steps).
+ *
+ * By design we do **not** auto-install anything from the store: an unresolved
+ * id simply falls back to a bundled theme — Mocha (dark) for the main + night
+ * slots, Latte (light) for the day slot. The fallback is always bundled, so the
+ * migration never needs the network and works offline.
+ */
+
+const THEME_KEY = 'psysonic_theme';
+const INSTALLED_KEY = 'psysonic_installed_themes';
+/** Set when the migration reset a theme, so the app can show a one-time notice. */
+const NOTICE_KEY = 'psysonic_theme_migration_notice';
+const FALLBACK_DARK = 'mocha';
+const FALLBACK_LIGHT = 'latte';
+
+const FIXED_IDS = new Set(FIXED_THEMES.map((t) => t.id));
+
+/** Per-slot fallback: main + night are dark (Mocha), the day slot is light (Latte). */
+const SLOT_FALLBACK = {
+  theme: FALLBACK_DARK,
+  themeDay: FALLBACK_LIGHT,
+  themeNight: FALLBACK_DARK,
+} as const;
+
+/** Ids of themes the user has installed from the store (persisted CSS lives here). */
+function installedIds(): Set<string> {
+  try {
+    const raw = localStorage.getItem(INSTALLED_KEY);
+    if (!raw) return new Set();
+    const parsed = JSON.parse(raw) as { state?: { themes?: Array<{ id?: unknown }> } };
+    const ids = (parsed.state?.themes ?? [])
+      .map((t) => t.id)
+      .filter((id): id is string => typeof id === 'string' && id.length > 0);
+    return new Set(ids);
+  } catch {
+    return new Set();
+  }
+}
+
+export function migrateThemeSelection(): void {
+  try {
+    const raw = localStorage.getItem(THEME_KEY);
+    if (!raw) return; // fresh profile — defaults are bundled themes already
+    const parsed = JSON.parse(raw) as { state?: Record<string, unknown> };
+    const state = parsed.state;
+    if (!state || typeof state !== 'object') return;
+
+    const installed = installedIds();
+    const isResolved = (id: unknown): boolean =>
+      typeof id === 'string' && (FIXED_IDS.has(id) || installed.has(id));
+
+    let changed = false;
+    const resetIds: string[] = [];
+    for (const slot of ['theme', 'themeDay', 'themeNight'] as const) {
+      const current = state[slot];
+      if (typeof current === 'string' && current.length > 0 && !isResolved(current)) {
+        resetIds.push(current);
+        state[slot] = SLOT_FALLBACK[slot];
+        changed = true;
+      }
+    }
+
+    if (changed) {
+      localStorage.setItem(THEME_KEY, JSON.stringify(parsed));
+      // Record what was reset so the app can show a one-time, dismissible notice.
+      const unique = [...new Set(resetIds)];
+      if (unique.length) localStorage.setItem(NOTICE_KEY, JSON.stringify(unique));
+    }
+  } catch {
+    // Malformed storage or non-browser runtime — non-fatal; the store falls back
+    // to its own bundled defaults on hydrate.
+  }
+}
+
+/** Ids of themes the migration reset (for the one-time notice); [] if none. */
+export function readThemeMigrationNotice(): string[] {
+  try {
+    const raw = localStorage.getItem(NOTICE_KEY);
+    if (!raw) return [];
+    const arr = JSON.parse(raw);
+    return Array.isArray(arr) ? arr.filter((x): x is string => typeof x === 'string') : [];
+  } catch {
+    return [];
+  }
+}
+
+/** Dismiss the one-time migration notice. */
+export function clearThemeMigrationNotice(): void {
+  try {
+    localStorage.removeItem(NOTICE_KEY);
+  } catch {
+    // ignore
+  }
+}
diff --git a/src/utils/themes/themeRegistry.test.ts b/src/utils/themes/themeRegistry.test.ts
new file mode 100644
index 00000000..dcd11ec6
--- /dev/null
+++ b/src/utils/themes/themeRegistry.test.ts
@@ -0,0 +1,87 @@
+/**
+ * Tests for the Theme Store registry client: TTL cache, force refresh,
+ * stale-on-error fallback, and malformed-cache tolerance.
+ */
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
+import { fetchRegistry, getCachedRegistry } from './themeRegistry';
+
+const CACHE_KEY = 'psysonic_theme_registry_cache';
+const NOW = 1_000_000_000;
+const TTL = 12 * 60 * 60 * 1000;
+
+const reg = (generatedAt = 't') => ({ schemaVersion: 1, generatedAt, themes: [] });
+const okRes = (body: unknown) => ({ ok: true, status: 200, json: async () => body, text: async () => JSON.stringify(body) });
+const failRes = () => ({ ok: false, status: 500, json: async () => ({}), text: async () => '' });
+
+function writeCache(ts: number, generatedAt: string): void {
+  localStorage.setItem(CACHE_KEY, JSON.stringify({ ts, registry: reg(generatedAt) }));
+}
+
+beforeEach(() => {
+  localStorage.clear();
+  vi.spyOn(Date, 'now').mockReturnValue(NOW);
+});
+
+afterEach(() => {
+  vi.unstubAllGlobals();
+  vi.restoreAllMocks();
+  localStorage.clear();
+});
+
+describe('fetchRegistry', () => {
+  it('fetches and caches when there is no cache', async () => {
+    const fetchMock = vi.fn(async () => okRes(reg('fresh')));
+    vi.stubGlobal('fetch', fetchMock);
+
+    const r = await fetchRegistry();
+    expect(r.registry.generatedAt).toBe('fresh');
+    expect(r.stale).toBe(false);
+    expect(fetchMock).toHaveBeenCalledTimes(1);
+    expect(localStorage.getItem(CACHE_KEY)).toContain('fresh');
+  });
+
+  it('returns a fresh cache without fetching', async () => {
+    writeCache(NOW, 'cached');
+    const fetchMock = vi.fn(async () => okRes(reg('network')));
+    vi.stubGlobal('fetch', fetchMock);
+
+    const r = await fetchRegistry();
+    expect(r.registry.generatedAt).toBe('cached');
+    expect(fetchMock).not.toHaveBeenCalled();
+  });
+
+  it('force-refreshes even with a fresh cache', async () => {
+    writeCache(NOW, 'cached');
+    const fetchMock = vi.fn(async () => okRes(reg('forced')));
+    vi.stubGlobal('fetch', fetchMock);
+
+    const r = await fetchRegistry({ force: true });
+    expect(r.registry.generatedAt).toBe('forced');
+    expect(fetchMock).toHaveBeenCalledTimes(1);
+  });
+
+  it('falls back to a stale cache when the fetch fails', async () => {
+    writeCache(NOW - TTL - 1, 'stale'); // older than TTL → not fresh
+    vi.stubGlobal('fetch', vi.fn(async () => failRes()));
+
+    const r = await fetchRegistry();
+    expect(r.registry.generatedAt).toBe('stale');
+    expect(r.stale).toBe(true);
+  });
+
+  it('throws when the fetch fails and there is no cache', async () => {
+    vi.stubGlobal('fetch', vi.fn(async () => failRes()));
+    await expect(fetchRegistry()).rejects.toThrow();
+  });
+
+  it('treats a malformed cache as no cache and fetches', async () => {
+    localStorage.setItem(CACHE_KEY, '{ not valid json');
+    expect(getCachedRegistry()).toBeNull();
+    const fetchMock = vi.fn(async () => okRes(reg('fresh2')));
+    vi.stubGlobal('fetch', fetchMock);
+
+    const r = await fetchRegistry();
+    expect(r.registry.generatedAt).toBe('fresh2');
+    expect(fetchMock).toHaveBeenCalledTimes(1);
+  });
+});
diff --git a/src/utils/themes/themeRegistry.ts b/src/utils/themes/themeRegistry.ts
new file mode 100644
index 00000000..2a49fd26
--- /dev/null
+++ b/src/utils/themes/themeRegistry.ts
@@ -0,0 +1,102 @@
+/**
+ * Theme Store registry client. Reads the auto-generated `registry.json` from the
+ * public `Psysonic/psysonic-themes` repo via the jsDelivr CDN (CORS-enabled,
+ * globally cached). The registry is cached in localStorage with a TTL so the
+ * store opens instantly and works offline against the last-seen catalogue.
+ */
+
+const CDN_BASE = 'https://cdn.jsdelivr.net/gh/Psysonic/psysonic-themes@main';
+const REGISTRY_URL = `${CDN_BASE}/registry.json`;
+const CACHE_KEY = 'psysonic_theme_registry_cache';
+const TTL_MS = 12 * 60 * 60 * 1000; // 12h — matches jsDelivr's @main edge cache
+
+export interface RegistryTheme {
+  id: string;
+  name: string;
+  author: string;
+  version: string;
+  description: string;
+  mode: 'dark' | 'light';
+  tags?: string[];
+  /** Repo-relative path to the theme's CSS. */
+  css: string;
+  /** Repo-relative path to the thumbnail. */
+  thumbnail: string;
+}
+
+export interface Registry {
+  schemaVersion: number;
+  generatedAt: string;
+  themes: RegistryTheme[];
+}
+
+interface CacheEnvelope {
+  ts: number;
+  registry: Registry;
+}
+
+/** Absolute CDN URL for a repo-relative path (css / thumbnail). */
+export function cdnUrl(relPath: string): string {
+  return `${CDN_BASE}/${relPath}`;
+}
+
+function readCache(): CacheEnvelope | null {
+  try {
+    const raw = localStorage.getItem(CACHE_KEY);
+    if (!raw) return null;
+    const env = JSON.parse(raw) as CacheEnvelope;
+    if (!env || typeof env.ts !== 'number' || !env.registry) return null;
+    return env;
+  } catch {
+    return null;
+  }
+}
+
+function writeCache(registry: Registry): void {
+  try {
+    localStorage.setItem(CACHE_KEY, JSON.stringify({ ts: Date.now(), registry }));
+  } catch {
+    // Quota or serialization failure is non-fatal — we just re-fetch next time.
+  }
+}
+
+/** Last-seen registry regardless of age (for offline use). */
+export function getCachedRegistry(): Registry | null {
+  return readCache()?.registry ?? null;
+}
+
+export interface FetchRegistryResult {
+  registry: Registry;
+  /** True when the network fetch failed and we served a cached copy instead. */
+  stale: boolean;
+}
+
+/**
+ * Fetch the registry. Returns the cached copy if it is still fresh, unless
+ * `force` is set (manual refresh). Falls back to a cached copy if the network
+ * fetch fails (flagged `stale: true`) so the store keeps working offline.
+ */
+export async function fetchRegistry(opts?: { force?: boolean }): Promise<FetchRegistryResult> {
+  if (!opts?.force) {
+    const cached = readCache();
+    if (cached && Date.now() - cached.ts < TTL_MS) return { registry: cached.registry, stale: false };
+  }
+  try {
+    const res = await fetch(REGISTRY_URL, { cache: 'no-cache' });
+    if (!res.ok) throw new Error(`registry fetch failed: ${res.status}`);
+    const registry = (await res.json()) as Registry;
+    writeCache(registry);
+    return { registry, stale: false };
+  } catch (err) {
+    const cached = readCache();
+    if (cached) return { registry: cached.registry, stale: true };
+    throw err;
+  }
+}
+
+/** Fetch a single theme's CSS text from the CDN (repo-relative path). */
+export async function fetchThemeCss(relPath: string): Promise<string> {
+  const res = await fetch(cdnUrl(relPath), { cache: 'no-cache' });
+  if (!res.ok) throw new Error(`theme css fetch failed: ${res.status}`);
+  return res.text();
+}
diff --git a/src/utils/themes/uninstallTheme.test.ts b/src/utils/themes/uninstallTheme.test.ts
new file mode 100644
index 00000000..efec3839
--- /dev/null
+++ b/src/utils/themes/uninstallTheme.test.ts
@@ -0,0 +1,69 @@
+/**
+ * Tests for uninstallTheme — removing a community theme must repair every
+ * selection slot that referenced it (active + scheduler day/night).
+ */
+import { beforeEach, describe, expect, it } from 'vitest';
+import { uninstallTheme } from './uninstallTheme';
+import { useInstalledThemesStore, type InstalledTheme } from '../../store/installedThemesStore';
+import { useThemeStore } from '../../store/themeStore';
+
+function mk(id: string, mode: 'dark' | 'light' = 'dark'): InstalledTheme {
+  return { id, name: id, author: 'a', version: '1.0.0', description: '', mode, css: `[data-theme='${id}']{--accent:#fff;}`, installedAt: 0 };
+}
+
+beforeEach(() => {
+  useInstalledThemesStore.setState({ themes: [] });
+  useThemeStore.setState({ theme: 'mocha', themeDay: 'latte', themeNight: 'mocha' });
+});
+
+describe('uninstallTheme', () => {
+  it('removes the theme from the installed store', () => {
+    useInstalledThemesStore.getState().install(mk('dracula'));
+    uninstallTheme('dracula');
+    expect(useInstalledThemesStore.getState().isInstalled('dracula')).toBe(false);
+  });
+
+  it('resets an active dark theme to mocha', () => {
+    useInstalledThemesStore.getState().install(mk('dracula', 'dark'));
+    useThemeStore.setState({ theme: 'dracula' });
+    uninstallTheme('dracula');
+    expect(useThemeStore.getState().theme).toBe('mocha');
+  });
+
+  it('resets an active light theme to latte', () => {
+    useInstalledThemesStore.getState().install(mk('nord-snowstorm', 'light'));
+    useThemeStore.setState({ theme: 'nord-snowstorm' });
+    uninstallTheme('nord-snowstorm');
+    expect(useThemeStore.getState().theme).toBe('latte');
+  });
+
+  it('resets the scheduler day slot to latte', () => {
+    useInstalledThemesStore.getState().install(mk('dracula'));
+    useThemeStore.setState({ themeDay: 'dracula' });
+    uninstallTheme('dracula');
+    expect(useThemeStore.getState().themeDay).toBe('latte');
+  });
+
+  it('resets the scheduler night slot to mocha', () => {
+    useInstalledThemesStore.getState().install(mk('dracula'));
+    useThemeStore.setState({ themeNight: 'dracula' });
+    uninstallTheme('dracula');
+    expect(useThemeStore.getState().themeNight).toBe('mocha');
+  });
+
+  it('repairs every slot at once', () => {
+    useInstalledThemesStore.getState().install(mk('dracula', 'dark'));
+    useThemeStore.setState({ theme: 'dracula', themeDay: 'dracula', themeNight: 'dracula' });
+    uninstallTheme('dracula');
+    const s = useThemeStore.getState();
+    expect([s.theme, s.themeDay, s.themeNight]).toEqual(['mocha', 'latte', 'mocha']);
+  });
+
+  it('leaves unrelated slots untouched', () => {
+    useInstalledThemesStore.getState().install(mk('dracula'));
+    useThemeStore.setState({ theme: 'kanagawa-wave', themeDay: 'latte', themeNight: 'mocha' });
+    uninstallTheme('dracula');
+    const s = useThemeStore.getState();
+    expect([s.theme, s.themeDay, s.themeNight]).toEqual(['kanagawa-wave', 'latte', 'mocha']);
+  });
+});
diff --git a/src/utils/themes/uninstallTheme.ts b/src/utils/themes/uninstallTheme.ts
new file mode 100644
index 00000000..d7acd913
--- /dev/null
+++ b/src/utils/themes/uninstallTheme.ts
@@ -0,0 +1,26 @@
+import { useInstalledThemesStore } from '../../store/installedThemesStore';
+import { useThemeStore } from '../../store/themeStore';
+
+/**
+ * Uninstall a community theme and repair any theme selection that pointed at it.
+ *
+ * A removed theme has no `[data-theme]` block, so every slot referencing its id
+ * must fall back to a bundled core — not just the manual `theme`, but the
+ * scheduler's `themeDay` / `themeNight` too. Without this, uninstalling a theme
+ * that is set as the day/night theme leaves the scheduler pointing at a missing
+ * id; when the clock crosses into that slot the app renders unstyled until the
+ * next launch (where the bootstrap migration would repair it).
+ *
+ * Fallback per slot: the active theme keeps its light/dark mode (Latte / Mocha);
+ * the day slot is light (Latte), the night slot is dark (Mocha).
+ */
+export function uninstallTheme(id: string): void {
+  const installed = useInstalledThemesStore.getState();
+  const wasLight = installed.getInstalled(id)?.mode === 'light';
+  installed.uninstall(id);
+
+  const t = useThemeStore.getState();
+  if (t.theme === id) t.setTheme(wasLight ? 'latte' : 'mocha');
+  if (t.themeDay === id) t.setThemeDay('latte');
+  if (t.themeNight === id) t.setThemeNight('mocha');
+}
diff --git a/src/utils/ui/toast.ts b/src/utils/ui/toast.ts
index c7cf8e7f..95130b1b 100644
--- a/src/utils/ui/toast.ts
+++ b/src/utils/ui/toast.ts
@@ -42,7 +42,7 @@ export function showToast(text: string, durationMs = 4000, variant: ToastVariant
     display: flex;
     align-items: center;
     justify-content: center;
-    background: ${isError ? 'var(--danger)' : isWarning ? 'var(--warning, #f59e0b)' : isSuccess ? 'var(--success, #10b981)' : 'var(--accent)'};
+    background: ${isError ? 'var(--danger)' : isWarning ? 'var(--warning, #f59e0b)' : isSuccess ? 'var(--positive, #10b981)' : 'var(--accent)'};
     color: var(--bg-app);
     line-height: 1;
   `;
@@ -54,7 +54,7 @@ export function showToast(text: string, durationMs = 4000, variant: ToastVariant
   const getBorderColor = () => {
     if (isError) return 'var(--danger)';
     if (isWarning) return 'var(--warning, #f59e0b)';
-    if (isSuccess) return 'var(--success, #10b981)';
+    if (isSuccess) return 'var(--positive, #10b981)';
     return 'var(--accent)';
   };