feat: govern accessible appearance overrides

webui/src/App.tsx

@@ -26,6 +26,7 @@ import ViewSurfaceRouteBoundary from "./components/ViewSurfaceRouteBoundary";
 import ModuleLoadBoundary from "./components/ModuleLoadBoundary";
 import { DocumentationHelpProvider } from "./components/help/DocumentationHelpLink";
 import { hasAnyScope } from "./utils/permissions";
+import { applyAppearanceOverrides } from "./components/AppearanceOverridesEditor";
 
 const DashboardPage = lazy(() => import("./features/dashboard/DashboardPage"));
 const SettingsPage = lazy(() => import("./features/settings/SettingsPage"));
@@ -36,7 +37,8 @@ const DEFAULT_UI_PREFERENCES: UserUiPreferences = {
   reduce_motion: false,
   sticky_section_sidebars: true,
   theme: "system",
-  palette: null
+  palette: null,
+  appearance_overrides: null
 };
 
 export default function App() {
@@ -399,6 +401,7 @@ export default function App() {
         preferences.theme;
       root.dataset.theme = resolvedTheme;
       root.dataset.themePreference = preferences.theme;
+      applyAppearanceOverrides(root, auth?.user.appearance?.custom_overrides ?? null, resolvedTheme);
     };
 
     applyTheme();
@@ -417,7 +420,8 @@ export default function App() {
     auth?.user.ui_preferences?.sticky_section_sidebars,
     auth?.user.ui_preferences?.theme,
     auth?.user.ui_preferences?.palette,
-    auth?.user.appearance?.palette
+    auth?.user.appearance?.palette,
+    auth?.user.appearance?.custom_overrides
   ]);
 
   useEffect(() => {
@@ -721,7 +725,8 @@ function normalizeUiPreferences(value: Partial<UserUiPreferences> | null | undef
     reduce_motion: Boolean(value?.reduce_motion ?? DEFAULT_UI_PREFERENCES.reduce_motion),
     sticky_section_sidebars: Boolean(value?.sticky_section_sidebars ?? DEFAULT_UI_PREFERENCES.sticky_section_sidebars),
     theme,
-    palette: normalizeOptionalUiPalette(value?.palette)
+    palette: normalizeOptionalUiPalette(value?.palette),
+    appearance_overrides: value?.appearance_overrides ?? null
   };
 }