feat(backup): admin and account UI for server backups, import by section

Admin settings: switch, time, retention, list with download and a
"Jetzt sichern" button. Account settings: own server backups with
download and restore (replace or add, for chosen sections, replace needs
a second tap). The MindSift import gets the same section picker.

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

frontend/src/features/settings/SectionPicker.tsx

@@ -0,0 +1,37 @@
+import React from 'react';
+import { Check } from 'lucide-react';
+import { DATA_SECTIONS, DataSection } from '../../lib/types';
+
+interface SectionPickerProps {
+  value: DataSection[];
+  onChange: (sections: DataSection[]) => void;
+  label?: string;
+}
+
+// Which parts of the own data a restore or import covers; at least one stays selected
+export const SectionPicker: React.FC<SectionPickerProps> = ({ value, onChange, label = 'Bereiche' }) => (
+  <div className="flex flex-wrap items-center gap-1.5" role="group" aria-label={label}>
+    <span className="text-[11px] text-muted mr-1">{label}:</span>
+    {DATA_SECTIONS.map((sec) => {
+      const on = value.includes(sec.id);
+      return (
+        <button
+          key={sec.id}
+          type="button"
+          role="checkbox"
+          aria-checked={on}
+          onClick={() => {
+            const next = on ? value.filter((v) => v !== sec.id) : [...value, sec.id];
+            if (next.length > 0) onChange(next);
+          }}
+          className={`h-11 sm:h-7 px-2.5 rounded-btn border text-[11px] inline-flex items-center gap-1 transition-colors ${
+            on ? 'border-accent bg-accent/10 text-main' : 'border-border text-muted hover:text-main'
+          }`}
+        >
+          {on && <Check className="w-3 h-3 text-accent" />}
+          {sec.label}
+        </button>
+      );
+    })}
+  </div>
+);