fix(ui): consolidate Orbit / Server / Live header dropdowns (#725)

* fix(ui): consolidate Orbit / Server / Live header dropdowns

The three header dropdown popovers each had their own container style.
Live used a glass utility class with backdrop-filter that read poorly on
many themes (reported by cucadmuh). Move all three onto the shared
`.nav-library-dropdown-panel` container — same bg, border, shadow and
radius via existing semantic tokens (`--bg-card`, `--border-dropdown`,
`--shadow-dropdown`, `--radius-md`). Item styles per dropdown stay
case-specific.

- NowPlayingDropdown: replace `glass animate-fade-in` with
  `nav-library-dropdown-panel animate-fade-in`; drop now-redundant inline
  borderRadius / boxShadow / zIndex; keep padding + gap for the
  user-list breathing room.
- OrbitStartTrigger: add `nav-library-dropdown-panel` alongside
  `orbit-launch-pop`. The component-local class is now reduced to the
  menu-specific min-width + tighter item gap; bg / border / shadow /
  radius / padding inherit from the shared container.
- Drop the unused `.glass` utility class; no other call sites.

* docs(changelog): header dropdown consistency fix (#725)

CHANGELOG.md

@@ -534,6 +534,12 @@ Foundational work: faster reviews, narrower diffs, and a safety net under the pa
 
 * The global **`selectstart`** handler assumed `event.target` was always an **`Element`**. Starting selection inside text (e.g. Now Playing **`[data-selectable]`** copy) could pass a **Text** node and crash with **`target.closest is not a function`**. The handler now resolves Text nodes to their parent element before applying allow/deny rules.
 
+### UI — consistent Orbit / Server / Live header dropdown styling
+
+**By [@Psychotoxical](https://github.com/Psychotoxical) + [@cucadmuh](https://github.com/cucadmuh), PR [#725](https://github.com/Psychotoxical/psysonic/pull/725)**
+
+* The three header dropdowns (Orbit launch, Server picker, Live listeners) each had their own container styling. Live in particular used a glass / backdrop-filter utility that read poorly on many themes. All three now share the **`.nav-library-dropdown-panel`** container — same background, border, shadow and radius via the existing semantic tokens. Item layouts per dropdown stay case-specific.
+
 ## [1.45.0] - 2026-05-04
 
 ## Added

src/components/NowPlayingDropdown.tsx

@@ -121,7 +121,7 @@ export default function NowPlayingDropdown() {
       {isOpen && createPortal(
         <div
           ref={panelRef}
-          className="glass animate-fade-in"
+          className="nav-library-dropdown-panel animate-fade-in"
           style={{
             position: 'fixed',
             top: panelPos.top,
@@ -129,13 +129,8 @@ export default function NowPlayingDropdown() {
             width: `${PANEL_WIDTH}px`,
             maxHeight: '400px',
             overflowY: 'auto',
-            borderRadius: '12px',
-            boxShadow: 'var(--shadow-lg)',
             padding: '1rem',
-            zIndex: 10050,
-            display: 'flex',
-            flexDirection: 'column',
-            gap: '1rem'
+            gap: '1rem',
           }}
         >
           <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', borderBottom: '1px solid var(--border-subtle)', paddingBottom: '0.5rem' }}>

src/components/OrbitStartTrigger.tsx

@@ -82,7 +82,7 @@ export default function OrbitStartTrigger() {
       </button>
 
       {popoverOpen && createPortal(
-        <div ref={popRef} className="orbit-launch-pop" style={popoverStyle} role="menu">
+        <div ref={popRef} className="nav-library-dropdown-panel orbit-launch-pop" style={popoverStyle} role="menu">
           <button type="button" className="orbit-launch-pop__item" onClick={pickCreate}>
             <Plus size={14} />
             <span>{t('orbit.launchCreate')}</span>

src/styles/components/orbit-session-top-strip.css

@@ -432,16 +432,12 @@
   display: none !important;
 }
 
-/* Launch popover — three-option menu anchored below the topbar trigger. */
+/* Launch popover — three-option menu anchored below the topbar trigger.
+   Container (bg / border / shadow / radius / padding) comes from the shared
+   `.nav-library-dropdown-panel` class; this rule only adds the menu-specific
+   min-width and tighter item gap. */
 .orbit-launch-pop {
   min-width: 220px;
-  padding: 6px;
-  background: var(--ctp-base, #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);
-  display: flex;
-  flex-direction: column;
   gap: 2px;
 }
 .orbit-launch-pop__item {

src/styles/themes/utility-classes.css

@@ -1,11 +1,4 @@
 /* ─── Utility Classes ─── */
-.glass {
-  background: var(--bg-glass, rgba(30, 30, 46, 0.75));
-  backdrop-filter: blur(20px);
-  -webkit-backdrop-filter: blur(20px);
-  border: 1px solid var(--border-subtle);
-}
-
 .gradient-text {
   background: linear-gradient(135deg, var(--ctp-mauve), var(--ctp-blue));
   -webkit-background-clip: text;