feat(app): Kompakt ↔ Cockpit — Ansichts-Umschalter im Header (0.2.1.9)

Nach dem 0.2.1.8-Deploy sah die App "unveraendert" aus — korrekt, weil der
Hauptchat nur eine Kachel hat (= Vollbild-Chat). Jetzt explizit umschaltbar:
- services/viewMode.ts: 'compact' | 'cockpit', persistiert (aria_view_mode),
  Default 'compact' (nichts aendert sich fuer normale Nutzung).
- ViewModeToggle im Navigations-Header (rechts, kollisionsfrei): "⧉ Kompakt" /
  "⧉ Cockpit".
- WorkspaceScreen: compact → klassische ChatScreen direkt; cockpit → Canvas.
- Canvas: Uebersicht/Gesten/Back jetzt auch bei einer Kachel erreichbar (der
  single-Force-Fokus entfaellt), damit sich Cockpit auch im Hauptchat wie ein
  Desktop anfuehlt. "⤢ Uebersicht"-Button nach unten rechts verschoben (weg von
  ChatScreens Kopf-Icons).

Changelog: Workspace-Release als 0.2.1.8 gefuehrt, Umschalter als 0.2.1.9.
tsc clean.

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

android/src/components/ViewModeToggle.tsx

@@ -0,0 +1,47 @@
+/**
+ * ViewModeToggle — kleiner Header-Button zum Umschalten zwischen Kompakt-
+ * Ansicht (klassischer Chat) und Cockpit (Kachel-Desktop).
+ *
+ * Sitzt rechts im Navigations-Header ("ARIA Cockpit"), kollidiert also mit
+ * nichts in der Chat-Ansicht. Zeigt das Ziel des naechsten Taps.
+ */
+
+import React, { useEffect, useState } from 'react';
+import { StyleSheet, Text, TouchableOpacity } from 'react-native';
+import viewMode, { ViewModeValue } from '../services/viewMode';
+
+const ViewModeToggle: React.FC = () => {
+  const [mode, setMode] = useState<ViewModeValue>(viewMode.get());
+  useEffect(() => viewMode.subscribe(setMode), []);
+
+  const isCockpit = mode === 'cockpit';
+  return (
+    <TouchableOpacity
+      onPress={() => viewMode.toggle()}
+      style={[styles.pill, isCockpit && styles.pillActive]}
+      hitSlop={{ top: 10, bottom: 10, left: 10, right: 10 }}
+      activeOpacity={0.75}
+    >
+      <Text style={[styles.text, isCockpit && styles.textActive]}>
+        {isCockpit ? '⧉ Cockpit' : '⧉ Kompakt'}
+      </Text>
+    </TouchableOpacity>
+  );
+};
+
+const styles = StyleSheet.create({
+  pill: {
+    marginRight: 12,
+    paddingHorizontal: 12,
+    paddingVertical: 6,
+    borderRadius: 16,
+    borderWidth: 1,
+    borderColor: '#1E1E2E',
+    backgroundColor: '#12122A',
+  },
+  pillActive: { borderColor: '#0096FF', backgroundColor: '#0A1F33' },
+  text: { color: '#9090B0', fontSize: 13, fontWeight: '700' },
+  textActive: { color: '#0096FF' },
+});
+
+export default ViewModeToggle;