Polish app theming and toolbar badge behavior

Sources/App/AppComponents.swift

@@ -1,12 +1,93 @@
 import SwiftUI
+#if os(macOS)
+import AppKit
+#elseif canImport(UIKit)
+import UIKit
+#endif
+
+private extension Color {
+    static func adaptive(
+        light: (red: Double, green: Double, blue: Double, opacity: Double),
+        dark: (red: Double, green: Double, blue: Double, opacity: Double)
+    ) -> Color {
+        #if os(macOS)
+        Color(
+            nsColor: NSColor(name: nil) { appearance in
+                let matchedAppearance = appearance.bestMatch(from: [.darkAqua, .vibrantDark, .aqua, .vibrantLight])
+                let components = matchedAppearance == .darkAqua || matchedAppearance == .vibrantDark ? dark : light
+                return NSColor(
+                    red: components.red,
+                    green: components.green,
+                    blue: components.blue,
+                    alpha: components.opacity
+                )
+            }
+        )
+        #elseif canImport(UIKit) && !os(watchOS)
+        Color(
+            uiColor: UIColor { traits in
+                let components = traits.userInterfaceStyle == .dark ? dark : light
+                return UIColor(
+                    red: components.red,
+                    green: components.green,
+                    blue: components.blue,
+                    alpha: components.opacity
+                )
+            }
+        )
+        #elseif os(watchOS)
+        Color(
+            red: dark.red,
+            green: dark.green,
+            blue: dark.blue,
+            opacity: dark.opacity
+        )
+        #else
+        Color(
+            red: light.red,
+            green: light.green,
+            blue: light.blue,
+            opacity: light.opacity
+        )
+        #endif
+    }
+}
 
 enum AppTheme {
     static let accent = Color(red: 0.12, green: 0.40, blue: 0.31)
     static let warmAccent = Color(red: 0.84, green: 0.71, blue: 0.48)
-    static let border = Color.black.opacity(0.08)
-    static let shadow = Color.black.opacity(0.05)
-    static let cardFill = Color.white.opacity(0.96)
-    static let mutedFill = Color(red: 0.972, green: 0.976, blue: 0.970)
+    static let border = Color.adaptive(
+        light: (0.00, 0.00, 0.00, 0.08),
+        dark: (1.00, 1.00, 1.00, 0.12)
+    )
+    static let shadow = Color.adaptive(
+        light: (0.00, 0.00, 0.00, 0.05),
+        dark: (0.00, 0.00, 0.00, 0.32)
+    )
+    static let cardFill = Color.adaptive(
+        light: (1.00, 1.00, 1.00, 0.96),
+        dark: (0.11, 0.12, 0.14, 0.96)
+    )
+    static let mutedFill = Color.adaptive(
+        light: (0.972, 0.976, 0.970, 1.00),
+        dark: (0.16, 0.17, 0.19, 1.00)
+    )
+    static let backgroundTop = Color.adaptive(
+        light: (0.975, 0.978, 0.972, 1.00),
+        dark: (0.08, 0.09, 0.10, 1.00)
+    )
+    static let backgroundBottom = Color.adaptive(
+        light: (1.00, 1.00, 1.00, 1.00),
+        dark: (0.05, 0.06, 0.07, 1.00)
+    )
+    static let backgroundGlow = Color.adaptive(
+        light: (0.00, 0.00, 0.00, 0.02),
+        dark: (1.00, 1.00, 1.00, 0.06)
+    )
+    static let chromeFill = Color.adaptive(
+        light: (1.00, 1.00, 1.00, 0.98),
+        dark: (0.10, 0.11, 0.13, 0.98)
+    )
 }
 
 enum AppLayout {
@@ -64,15 +145,15 @@ struct AppBackground: View {
     var body: some View {
         LinearGradient(
             colors: [
-                Color(red: 0.975, green: 0.978, blue: 0.972),
-                Color.white
+                AppTheme.backgroundTop,
+                AppTheme.backgroundBottom
             ],
             startPoint: .top,
             endPoint: .bottom
         )
         .overlay(alignment: .top) {
             Rectangle()
-                .fill(Color.black.opacity(0.02))
+                .fill(AppTheme.backgroundGlow)
                 .frame(height: 160)
                 .blur(radius: 60)
                 .offset(y: -90)