Add configurable surface/sidebar colour + clearer sync-icon state

- new user_settings.surface_color (nullable, device-local default, not synced):
  drives the web sidebar / top bar / surfaces; NULL derives from bg_color as
  before. Added to schema, migration, GET/PUT, NULLABLE_OVERRIDES, DEFAULT_SYNC.
- web: surface colour row in the settings table; applyTheme derives the whole
  surface family from it
- web: per-row sync icon now has real styling — ON shows the primary-tinted
  glyph on a pill, OFF shows a slashed, muted glyph (was previously unstyled,
  so synced/not-synced looked identical)

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

frontend/js/i18n.js

@@ -77,6 +77,7 @@ const translations = {
     settings_text_color: 'Schriftfarbe',
     settings_line_color: 'Linienfarbe',
     settings_bg_color: 'Hintergrundfarbe',
+    settings_surface_color: 'Seitenleisten-/Oberflächenfarbe',
     reset: 'Reset',
     settings_text_contrast: 'Schriftkontrast',
     settings_text_contrast_desc: 'Helligkeit der Beschriftungen und Texte',
@@ -430,6 +431,7 @@ const translations = {
     settings_text_color: 'Text color',
     settings_line_color: 'Line color',
     settings_bg_color: 'Background color',
+    settings_surface_color: 'Sidebar / surface color',
     reset: 'Reset',
     settings_text_contrast: 'Text contrast',
     settings_text_contrast_desc: 'Brightness of labels and text',