feat(fullscreen): performance fixes + appearance settings

Adds no_compositing_mode Tauri command; frontend adds html.no-compositing on Linux to replace GPU-only CSS effects (backdrop-filter, filter, mask-image) with software-friendly equivalents.

Settings → Appearance → Fullscreen Player: toggle for artist portrait visibility + 0–80% dimming slider.

Fix: long words in lyric lines now wrap correctly.

src/styles/components.css

@@ -3119,6 +3119,17 @@
   display: block;
 }
 
+/* Subtle darkening overlay — plain div paint, no GPU cost.
+   Alpha driven by --fs-portrait-dim (set via inline style on .fs-player). */
+.fs-portrait-wrap::after {
+  content: '';
+  position: absolute;
+  inset: 0;
+  z-index: 1;
+  pointer-events: none;
+  background: rgba(0, 0, 0, var(--fs-portrait-dim, 0.28));
+}
+
 /* ── Horizontal scrim — dark left edge for text legibility ── */
 .fs-scrim {
   position: absolute;
@@ -3440,6 +3451,8 @@
   align-items: center;
   overflow: hidden;
   white-space: normal;
+  overflow-wrap: break-word;
+  word-break: break-word;
   font-size: 2vh;
   line-height: 1.4;
   color: rgba(255, 255, 255, 0.22);
@@ -3469,6 +3482,59 @@
 }
 
 
+/* ── no-compositing overrides ─────────────────────────────────────────────────
+   Applied only when WEBKIT_DISABLE_COMPOSITING_MODE=1 is set (Arch Linux etc).
+   Replaces GPU-only effects (backdrop-filter, CSS filter, mask-image) with
+   software-friendly equivalents so the fullscreen player stays responsive.     */
+
+/* fs-player: remove will-change — without GPU compositor it only wastes RAM */
+html.no-compositing .fs-player {
+  will-change: auto;
+}
+
+/* Close button: replace frosted-glass blur with flat semi-opaque background */
+html.no-compositing .fs-close {
+  backdrop-filter: none;
+  background: rgba(0, 0, 0, 0.45);
+}
+
+/* Portrait: remove CSS filter (drop-shadow) and will-change */
+html.no-compositing .fs-portrait {
+  filter: none;
+  will-change: auto;
+}
+
+/* Portrait wrap: replace mask-image fade with a pseudo-element overlay gradient.
+   pointer-events: none on wrap means the overlay never blocks clicks. */
+html.no-compositing .fs-portrait-wrap {
+  -webkit-mask-image: none;
+  mask-image: none;
+}
+html.no-compositing .fs-portrait-wrap::before {
+  content: '';
+  position: absolute;
+  inset: 0;
+  z-index: 1;
+  pointer-events: none;
+  background: linear-gradient(
+    to right,
+    #06060e 0%,
+    rgba(6, 6, 14, 0.4) 6%,
+    transparent 16%
+  );
+}
+
+/* Lyrics overlay: just remove the fade — no replacement needed */
+html.no-compositing .fs-lyrics-overlay {
+  -webkit-mask-image: none;
+  mask-image: none;
+}
+
+/* Lyrics rail: remove will-change */
+html.no-compositing .fs-lyrics-rail {
+  will-change: auto;
+}
+
 /* Chat */
 .chat-popup {
   position: absolute;