feat(webapp): new Dark theme is the default with a slight contrast bump

Missing or legacy preferences resolve to the pinned Dark theme (not
system-resolved, so nobody is surprised by light mode) and the default
contrast is 50. Classic remains the flag-off look.

Author: kathiekiwi

.server-changes/light-theme.md

@@ -3,4 +3,4 @@ area: webapp
 type: feature
 ---
 
-Adds an opt-in Interface theme setting on the account page behind a feature flag. Choose Classic (the default), System preference (follows your OS), Dark, or Light, and fine-tune the new themes with a contrast slider. System preference switches automatically when your OS appearance changes.
+Adds an opt-in Interface theme setting on the account page behind a feature flag. Choose Dark (the new default), System preference (follows your OS), Light, or the original Classic look, and fine-tune the new themes with a contrast slider. System preference switches automatically when your OS appearance changes.

apps/webapp/app/utils/themePreference.ts

@@ -6,15 +6,20 @@ export const ThemePreference = z.enum(["classic", "system", "dark", "light"]);
 export type ThemePreference = z.infer<typeof ThemePreference>;
 
 /** Coerce any stored/legacy value into a valid preference. Missing or unknown
- * values fall back to `classic` (the default dark theme). */
+ * values fall back to `dark` - the new dark theme is the default (pinned, not
+ * system-resolved, so nobody gets surprised by light mode). */
 export function normalizeThemePreference(value: unknown): ThemePreference {
   const result = ThemePreference.safeParse(value);
-  return result.success ? result.data : "classic";
+  return result.success ? result.data : "dark";
 }
 
-/** Interface contrast for the System themes, 0 (default) to 100 (max). */
+/** The default dark theme ships with a slight contrast bump. */
+export const DEFAULT_THEME_CONTRAST = 50;
+
+/** Interface contrast for the System themes, 0 to 100. Missing or invalid
+ * values fall back to the default bump. */
 export function normalizeThemeContrast(value: unknown): number {
   const num = typeof value === "string" ? Number(value) : value;
-  if (typeof num !== "number" || !Number.isFinite(num)) return 0;
+  if (typeof num !== "number" || !Number.isFinite(num)) return DEFAULT_THEME_CONTRAST;
   return Math.min(100, Math.max(0, Math.round(num)));
 }

apps/webapp/test/themePreference.test.ts

@@ -11,15 +11,15 @@ describe("normalizeThemePreference", () => {
     }
   });
 
-  it("falls back to classic for legacy/unknown values", () => {
-    expect(normalizeThemePreference("solarized")).toBe("classic");
-    expect(normalizeThemePreference("")).toBe("classic");
-    expect(normalizeThemePreference(42)).toBe("classic");
-    expect(normalizeThemePreference(null)).toBe("classic");
+  it("falls back to dark for legacy/unknown values", () => {
+    expect(normalizeThemePreference("solarized")).toBe("dark");
+    expect(normalizeThemePreference("")).toBe("dark");
+    expect(normalizeThemePreference(42)).toBe("dark");
+    expect(normalizeThemePreference(null)).toBe("dark");
   });
 
-  it("falls back to classic for undefined", () => {
-    expect(normalizeThemePreference(undefined)).toBe("classic");
+  it("falls back to dark for undefined", () => {
+    expect(normalizeThemePreference(undefined)).toBe("dark");
   });
 });