Fix the Settings chrome and make the picker tiles readable in light mode

Three fixes to the Settings and splash surfaces:

- Settings never set titlebarAppearsTransparent, so its header gradient
  stopped below an opaque titlebar rather than running up behind it the
  way About, Help and Splash all do.
- Its root frame pinned width to exactly 580, the same width as the window
  content area, leaving the scroller no room to sit in — it overflowed and
  was clipped by the right edge. Let the content flex and keep the window's
  own min/max as the thing that fixes the width, mirroring Help.
- The Basic/Pro picker tiles drew their line-art in hardcoded white, but
  AppearanceButtonStyle fades the tile to near-white in light mode, leaving
  the art invisible. Draw it in .primary so it inverts with the appearance.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

Author: superhighfives

Pika/Services/WindowCoordinator.swift

@@ -430,8 +430,12 @@ class WindowCoordinator: NSObject {
 
     func openPreferencesWindow() {
         if preferencesWindow == nil, let eyedroppers {
+            // Width is pinned by the window's own min/max below, not by the SwiftUI frame:
+            // pinning both would demand the full 580 for content *and* leave the scroller
+            // with nowhere to go, pushing it past the right edge where the window clips it.
+            // Letting the content flex mirrors the Help window, whose scroller sits inboard.
             let rootView = PreferencesView()
-                .frame(minWidth: 580, maxWidth: 580, minHeight: 400, maxHeight: .infinity)
+                .frame(maxWidth: .infinity, minHeight: 400, maxHeight: .infinity)
                 .ignoresSafeArea()
                 .environmentObject(eyedroppers)
             let view = NSHostingView(rootView: rootView)
@@ -440,6 +444,9 @@ class WindowCoordinator: NSObject {
                 size: NSRect(x: 0, y: 0, width: 580, height: 600),
                 styleMask: [.titled, .closable, .miniaturizable, .resizable, .fullSizeContentView]
             )
+            // Matches About/Help/Splash — lets the header gradient run up behind the titlebar
+            // instead of leaving an opaque bar above it.
+            preferencesWindow?.titlebarAppearsTransparent = true
             preferencesWindow?.minSize = NSSize(width: 580, height: 400)
             preferencesWindow?.maxSize = NSSize(width: 580, height: CGFloat.greatestFiniteMagnitude)
             preferencesWindow?.contentMinSize = NSSize(width: 580, height: 400)

Pika/Views/SplashView.swift

@@ -532,13 +532,15 @@ private struct PickerComparisonTile: View {
         }
     }
 
-    // Monochrome white-on-dark, matching the app-mode preview art: translucent white
-    // fills, white line-art, no colour, no container borders.
+    // Monochrome line-art, matching the app-mode preview art: translucent fills, no colour,
+    // no container borders. Drawn in `.primary` rather than white so it inverts with the
+    // appearance — `AppearanceButtonStyle` fades the tile to near-white in light mode, where
+    // white-on-white left the art invisible.
 
     // Basic picker: a plain, dull loupe — a single flat disc with a faint crosshair.
     private var basicMock: some View {
         ZStack {
-            Circle().fill(Color.white.opacity(0.08))
+            Circle().fill(Color.primary.opacity(0.08))
             crosshair(opacity: 0.35)
         }
         .frame(width: 40.0, height: 40.0)
@@ -550,15 +552,15 @@ private struct PickerComparisonTile: View {
         VStack(spacing: 3.0) {
             ZStack {
                 RoundedRectangle(cornerRadius: 3.0, style: .continuous)
-                    .fill(Color.white.opacity(0.12))
+                    .fill(Color.primary.opacity(0.12))
                 crosshair(opacity: 0.35)
             }
             .frame(height: 18.0)
 
             HStack(spacing: 4.0) {
                 skeletonBar(width: 24.0, opacity: 0.3)
                 Spacer(minLength: 0.0)
-                Circle().fill(Color.white.opacity(0.35)).frame(width: 5.0, height: 5.0)
+                Circle().fill(Color.primary.opacity(0.35)).frame(width: 5.0, height: 5.0)
             }
         }
         .padding(.horizontal, 5.0)
@@ -567,18 +569,18 @@ private struct PickerComparisonTile: View {
         .frame(width: 52.0)
         .background(
             RoundedRectangle(cornerRadius: 6.0, style: .continuous)
-                .fill(Color.white.opacity(0.06))
+                .fill(Color.primary.opacity(0.06))
         )
     }
 
     private func crosshair(opacity: Double) -> some View {
         Rectangle()
-            .strokeBorder(Color.white.opacity(opacity), lineWidth: 2.0)
+            .strokeBorder(Color.primary.opacity(opacity), lineWidth: 2.0)
             .frame(width: 9.0, height: 9.0)
     }
 
     private func skeletonBar(width: CGFloat, opacity: Double) -> some View {
-        Capsule().fill(Color.white.opacity(opacity)).frame(width: width, height: 3.0)
+        Capsule().fill(Color.primary.opacity(opacity)).frame(width: width, height: 3.0)
     }
 }