Remove duplicate "grey" theme, keep "dark" (ticket 004)

"grey" and "dark" rendered identically apart from accent colour, so
drop "grey" as a selectable colour scheme everywhere in the frontend
(index.css, api.ts's ColorScheme type, the NavMenu picker, the
downloadable BUILTIN_THEMES table) and keep "dark" as the single
equivalent theme.

Existing settings.json files saved with color_scheme: "grey" keep
loading correctly: the backend ColorScheme enum aliases the legacy
"grey" serde value onto Dark, so old configs transparently migrate to
"dark" without any manual intervention.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01XFUNZwCvz3kcod3352ZR2o

webapp/src/components/NavMenu.tsx

@@ -21,7 +21,6 @@ const COLOR_SCHEMES: ColorScheme[] = [
   'system',
   'light',
   'dark',
-  'grey',
   'red',
   'green',
   'blue',

webapp/src/index.css

@@ -16,8 +16,13 @@
  * so re-declaring the `--c-*` variables under a `html.<theme>` selector
  * re-skins the whole app with no per-component changes.
  *
- * Derivation: `dark`/`grey` share one true black-based neutral (S=0) scale,
- * `light` is its exact lightness mirror — these three stay grey throughout.
+ * Derivation: `dark` uses one true black-based neutral (S=0) scale, `light`
+ * is its exact lightness mirror — these two stay grey throughout. (There
+ * used to be a separate `grey` theme sharing `dark`'s neutral scale with
+ * only its accent trio differing; it was a near-duplicate of `dark` and was
+ * removed in favour of a single `dark` theme — ticket 004. Settings saved
+ * with `color_scheme: "grey"` still load fine: the backend aliases it to
+ * `dark`, see `ColorScheme` in `src/settings.rs`.)
  * Each named theme (red/green/blue/yellow/pink/orange) instead tints its
  * whole surface/border/text scale in its own hue at low saturation (so the
  * chrome itself reads as "a shade of red", not grey-with-a-red-light), and
@@ -88,30 +93,6 @@ html.light {
   --c-accent-text: #0369a1;
 }
 
-/* Canonical greyscale theme: identical neutral scale to :root (dark), so
-   every other theme's derivation above is measured against this one. */
-html.grey {
-  --c-surface-0: #0a0a0a;
-  --c-surface-1: #171717;
-  --c-surface-2: #262626;
-
-  --c-border: #262626;
-  --c-border-soft: #404040;
-  --c-border-faint: #171717;
-  --c-border-strong: #a3a3a3;
-
-  --c-text: #f5f5f5;
-  --c-text-secondary: #d4d4d4;
-  --c-text-muted: #a3a3a3;
-  --c-text-subtle: #737373;
-  --c-text-faint: #525252;
-  --c-text-faintest: #404040;
-
-  --c-accent: #38bdf8;
-  --c-accent-soft: #0369a1;
-  --c-accent-text: #7dd3fc;
-}
-
 /* base hue 0 (red): surfaces/borders/text tinted red; accent complement 180
    (cyan), accent-soft composite 150 (spring green) */
 html.red {

webapp/src/lib/api.ts

@@ -85,7 +85,6 @@ export type ColorScheme =
   | 'light'
   | 'dark'
   | 'system'
-  | 'grey'
   | 'red'
   | 'green'
   | 'blue'

webapp/src/lib/themes.ts

@@ -72,28 +72,6 @@ export const BUILTIN_THEMES: Record<string, ThemeVars> = {
     '--c-accent-soft': '#7dd3fc',
     '--c-accent-text': '#0369a1',
   },
-  grey: {
-    '--c-surface-0': '#0a0a0a',
-    '--c-surface-1': '#171717',
-    '--c-surface-2': '#262626',
-    '--c-border': '#262626',
-    '--c-border-soft': '#404040',
-    '--c-border-faint': '#171717',
-    '--c-border-strong': '#a3a3a3',
-    '--c-text': '#f5f5f5',
-    '--c-text-secondary': '#d4d4d4',
-    '--c-text-muted': '#a3a3a3',
-    '--c-text-subtle': '#737373',
-    '--c-text-faint': '#525252',
-    '--c-text-faintest': '#404040',
-    '--c-danger-bg': '#450a0a',
-    '--c-danger-border': '#7f1d1d',
-    '--c-danger-text': '#f87171',
-    '--c-danger-text-strong': '#fca5a5',
-    '--c-accent': '#38bdf8',
-    '--c-accent-soft': '#0369a1',
-    '--c-accent-text': '#7dd3fc',
-  },
   red: {
     '--c-surface-0': 'hsl(0 32% 10%)',
     '--c-surface-1': 'hsl(0 28% 16%)',

webapp/src/lib/useSettingsPanel.ts

@@ -24,7 +24,7 @@ const INJECTED_CSS_ATTR = 'data-ottyl-css-id'
 const INJECTED_THEME_ATTR = 'data-ottyl-theme-css-id'
 
 // Themes selectable independently of `system`, each backed by a `html.<name>` block in `index.css`.
-const THEME_CLASSES = ['light', 'dark', 'grey', 'red', 'green', 'blue', 'yellow', 'pink', 'orange'] as const
+const THEME_CLASSES = ['light', 'dark', 'red', 'green', 'blue', 'yellow', 'pink', 'orange'] as const
 
 // Reflects `colorScheme` onto `<html>` as a class + `data-color-scheme`; when a custom theme is active, no built-in class is added at all, since a class selector would out-specificity its injected `:root` override (see `applyCustomThemeCss`) and mask it.
 function applyColorScheme(colorScheme: ColorScheme, customThemeActive: boolean) {