New Aero background (Gemini-made), old credit removed

The scene is the user's own Frutiger Aero image now: green hills, a river,
an eco-city, bubbles and daisies. Re-encoded to public/aero/background.webp
(152 kB) with a fresh 3 kB pre-blurred variant for the glass, and the
WallpaperSafari credit line, its i18n keys and the README credit are gone
(the image is made by the user with Gemini).

Contrast: 0 below-minimum findings and 0 axe violations, all three themes.
Version 0.2.8, SW -> freezmo-v60.

components/ApiKeyGate.tsx

@@ -3,7 +3,7 @@
 import { AnimatePresence, motion, useReducedMotion } from "framer-motion";
 import { useCallback, useEffect, useRef, useState, useSyncExternalStore } from "react";
 
-import { useTheme } from "@/components/ThemeToggle";
+import { useTheme } from "@/lib/theme";
 import {
   CheckCircleIcon,
   ExternalLinkIcon,

components/Sidebar.tsx

@@ -20,7 +20,7 @@ import {
   SparklesIcon,
   SunIcon,
 } from "@/components/icons";
-import { useTheme } from "@/components/ThemeToggle";
+import { useTheme } from "@/lib/theme";
 import { createFolder, folderStore } from "@/lib/folders";
 import { haptic } from "@/lib/haptics";
 import { IS_DEV_INSTANCE } from "@/lib/dev-mode";

components/ThemeSection.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { useTheme, type Theme } from "@/components/ThemeToggle";
+import { useTheme, type Theme } from "@/lib/theme";
 import { haptic } from "@/lib/haptics";
 import { useI18n } from "@/lib/i18n";
 
@@ -40,17 +40,7 @@ export function ThemeSection() {
       {theme === "aero" ? (
         <>
           <p className="text-[11px] leading-snug text-[var(--text-subtle)]">{t("theme.aeroNote")}</p>
-          <p className="text-[11px] leading-snug text-[var(--text-subtle)]">
-            {t("theme.aeroCredit")}{" "}
-            <a
-              href="https://wallpapersafari.com/w/IlWuz7"
-              target="_blank"
-              rel="noreferrer"
-              className="underline decoration-dotted"
-            >
-              wallpapersafari.com/w/IlWuz7
-            </a>
-          </p>
+
         </>
       ) : null}
     </section>

components/ThemeToggle.tsx

@@ -1,87 +1,22 @@
 "use client";
 
-import { useEffect, useState } from "react";
-
-import { useI18n } from "@/lib/i18n";
-import { haptic } from "@/lib/haptics";
-import { cn } from "@/lib/utils";
 import { MoonIcon, SunIcon } from "@/components/icons";
-
-const STORAGE_KEY = "freezmo.theme";
-
-const THEME_COLORS = { light: "#f4f7fd", dark: "#0e1424", aero: "#2fa7e6" } as const;
-
-/** The three themes. Aero is not a dark/light variant: it replaces the palette
- *  and the scene, and the light/dark toggles hide while it is on. */
-export type Theme = "light" | "dark" | "aero";
+import { haptic } from "@/lib/haptics";
+import { useI18n } from "@/lib/i18n";
+import { useTheme } from "@/lib/theme";
+import { cn } from "@/lib/utils";
 
 /**
- * Keeps the first `theme-color` meta (the one the app owns) in step with the
- * in-app theme. The SSR metas follow the OS preference; this one always wins
- * because it is media-less and first in the head.
+ * The light/dark flip. Frutiger Aero has no such switch (the theme picker in
+ * Settings owns it), so this renders nothing while aero is on — the state
+ * comes from the shared store in lib/theme, so a change in Settings hides
+ * this immediately.
  */
-export function syncThemeColor(theme: Theme) {
-  try {
-    let meta = document.querySelector<HTMLMetaElement>('meta[name="theme-color"][data-app]');
-    if (!meta) {
-      meta = document.createElement("meta");
-      meta.setAttribute("name", "theme-color");
-      meta.setAttribute("data-app", "1");
-      document.head.insertBefore(meta, document.head.firstChild);
-    }
-    meta.setAttribute("content", THEME_COLORS[theme]);
-  } catch {
-    /* private mode / odd embedded browsers */
-  }
-}
-
-export function applyTheme(next: Theme) {
-  document.documentElement.classList.toggle("dark", next === "dark");
-  document.documentElement.classList.toggle("aero", next === "aero");
-  syncThemeColor(next);
-  try {
-    window.localStorage.setItem(STORAGE_KEY, next);
-  } catch {
-    /* private mode */
-  }
-}
-
-export function useTheme() {
-  const [theme, setTheme] = useState<Theme>("light");
-
-  useEffect(() => {
-    const stored = window.localStorage.getItem(STORAGE_KEY);
-    const next: Theme =
-      stored === "dark" || stored === "aero"
-        ? stored
-        : stored === "light"
-          ? "light"
-          : window.matchMedia("(prefers-color-scheme: dark)").matches
-            ? "dark"
-            : "light";
-    setTheme(next);
-    syncThemeColor(next);
-  }, []);
-
-  const apply = (next: Theme) => {
-    setTheme(next);
-    applyTheme(next);
-  };
-
-  return {
-    theme,
-    setTheme: apply,
-    /** The light/dark flip; aero is chosen in Settings. */
-    toggle: () => apply(theme === "dark" ? "light" : "dark"),
-  };
-}
-
 export function ThemeToggle({ className, plain = false }: { className?: string; plain?: boolean }) {
   const { theme, toggle } = useTheme();
   const { t } = useI18n();
   const dark = theme === "dark";
 
-  // Frutiger Aero has no light/dark switch (see the theme picker in Settings).
   if (theme === "aero") return null;
 
   return (