iOS: left side drawer (calendars + groups + nav) and opt-in top-bar colour

Replace the top-bar menu popup with an off-canvas left drawer, opened by the
hamburger or a narrow left-edge swipe (kept off the content area so month/week
swipe stay free). The drawer hosts the calendar visibility list, a view
switcher, group switching, and quick access to Settings/Accounts/Profile/
Groups/Server plus sync and logout.

- extract the filter list into reusable CalendarFilterContent (shared by the
  drawer and the still-present CalendarFilterSheet); the sheet is now a thin
  wrapper
- new CalendarDrawer view; CalendarHostView hosts it as a ZStack overlay with a
  scrim and edge-swipe gesture, and presents drawer destinations as sheets
- opt-in surface colour: surfaceColor (device-local) tints the flat top bar;
  empty keeps the translucent .bar material. Settings row with an Auto reset.

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

Calendarr iOS/Views/SettingsView.swift

@@ -11,6 +11,8 @@ struct SettingsView: View {
     @AppStorage("textColor")         private var textHex = "#FFFFFF"
     @AppStorage("backgroundColor")   private var bgHex = "#000000"
     @AppStorage("lineColor")         private var lineHex = "#3A3A52"
+    // Device-local top-bar/surface colour. Empty = translucent .bar material.
+    @AppStorage("surfaceColor")      private var surfaceHex = ""
     @AppStorage("primaryColor")      private var primaryHex = "#4285F4"
     @AppStorage("accentColor")       private var accentHex = "#EA4335"
     // iOS-only opacity controls (drive secondary text / grid-line opacity in the
@@ -107,6 +109,15 @@ struct SettingsView: View {
         Binding(get: { Color(hex: hex.wrappedValue) }, set: { hex.wrappedValue = $0.toHex() })
     }
 
+    // Surface colour: empty string means "auto" (translucent .bar); the picker
+    // shows a neutral dark until the user chooses a concrete colour.
+    private var surfaceBinding: Binding<Color> {
+        Binding(
+            get: { Color(hex: surfaceHex.isEmpty ? "#1C1C1E" : surfaceHex) },
+            set: { surfaceHex = $0.toHex() }
+        )
+    }
+
     @ViewBuilder
     private func colorRow(_ syncKey: String, _ defaultsKey: String, _ label: String, _ hex: Binding<String>) -> some View {
         HStack(spacing: 12) {
@@ -386,6 +397,19 @@ struct SettingsView: View {
                 }
             }
             .tint(Color.accentColor)
+            HStack(spacing: 12) {
+                Text(L10n.t("settings.color.surface", appLang))
+                Spacer()
+                Text(surfaceHex.isEmpty ? L10n.t("settings.surface.auto", appLang) : surfaceHex.uppercased())
+                    .font(.system(.caption, design: .monospaced))
+                    .foregroundStyle(.secondary)
+                ColorPicker("", selection: surfaceBinding, supportsOpacity: false)
+                    .labelsHidden()
+                Button { surfaceHex = "" } label: { Image(systemName: "arrow.uturn.backward") }
+                    .buttonStyle(.plain)
+                    .foregroundStyle(.secondary)
+                    .accessibilityLabel(L10n.t("settings.surface.auto", appLang))
+            }
         } header: {
             Text(L10n.t("settings.device", appLang))
         } footer: {