@cachly-dev/mcp-server 0.10.49 → 0.10.56

package/apps/travel-chaos-organizer/frontend/components/ErrorBoundary.tsx

@@ -1,45 +0,0 @@
-import React from "react";
-import { StyleSheet, Text, TouchableOpacity, View } from "react-native";
-import { captureException } from "../lib/sentry";
-
-type State = { hasError: boolean; error: string | null };
-
-export class ErrorBoundary extends React.Component<
-  { children: React.ReactNode },
-  State
-> {
-  state: State = { hasError: false, error: null };
-
-  static getDerivedStateFromError(err: Error): State {
-    return { hasError: true, error: err.message };
-  }
-
-  componentDidCatch(err: Error) {
-    captureException(err);
-  }
-
-  reset = () => this.setState({ hasError: false, error: null });
-
-  render() {
-    if (!this.state.hasError) return this.props.children;
-    return (
-      <View style={s.container}>
-        <Text style={s.icon}>⚠️</Text>
-        <Text style={s.title}>Etwas ist schiefgelaufen</Text>
-        <Text style={s.msg}>{this.state.error ?? "Unbekannter Fehler"}</Text>
-        <TouchableOpacity style={s.btn} onPress={this.reset} activeOpacity={0.8}>
-          <Text style={s.btnText}>Neu laden</Text>
-        </TouchableOpacity>
-      </View>
-    );
-  }
-}
-
-const s = StyleSheet.create({
-  container: { flex: 1, backgroundColor: "#0f0f1a", justifyContent: "center", alignItems: "center", padding: 32 },
-  icon: { fontSize: 48, marginBottom: 16 },
-  title: { fontSize: 20, fontWeight: "800", color: "#fff", marginBottom: 8, textAlign: "center" },
-  msg: { fontSize: 13, color: "#6666aa", textAlign: "center", marginBottom: 32, lineHeight: 20 },
-  btn: { backgroundColor: "#4f46e5", paddingVertical: 14, paddingHorizontal: 32, borderRadius: 12 },
-  btnText: { color: "#fff", fontWeight: "700", fontSize: 15 },
-});

package/apps/travel-chaos-organizer/frontend/components/FileUploadButton.tsx

@@ -1,19 +0,0 @@
-import { StyleSheet, Text, TouchableOpacity } from "react-native";
-
-type Props = { icon: string; label: string; onPress: () => void; disabled?: boolean };
-
-export default function FileUploadButton({ icon, label, onPress, disabled }: Props) {
-  return (
-    <TouchableOpacity style={[s.btn, disabled && s.btnDisabled]} onPress={onPress} disabled={disabled} activeOpacity={0.8}>
-      <Text style={s.icon}>{icon}</Text>
-      <Text style={s.label}>{label}</Text>
-    </TouchableOpacity>
-  );
-}
-
-const s = StyleSheet.create({
-  btn: { flex: 1, flexDirection: "row", alignItems: "center", justifyContent: "center", gap: 6, backgroundColor: "#0f0f1a", borderRadius: 12, paddingVertical: 12, borderWidth: 1, borderColor: "#2a2a4e" },
-  btnDisabled: { opacity: 0.4 },
-  icon: { fontSize: 18 },
-  label: { color: "#a5b4fc", fontSize: 14, fontWeight: "500" },
-});

package/apps/travel-chaos-organizer/frontend/components/ImportSheet.tsx

@@ -1,155 +0,0 @@
-/**
- * In-app text/email import — paste booking text or email body directly.
- * Calls /parse/text → saves to inbox or a specific trip.
- * Sits above the upload bar in the trip detail and as a standalone entry point.
- */
-import { useState } from "react";
-import {
-  ActivityIndicator,
-  StyleSheet, Text, TextInput, TouchableOpacity, View,
-} from "react-native";
-import BottomSheet from "./BottomSheet";
-import { ApiError, mailApi } from "../lib/api";
-import { haptics } from "../lib/haptics";
-import { useToast } from "./ToastContext";
-
-type Props = {
-  visible: boolean;
-  onClose: () => void;
-  /** If provided, parse result goes directly to this trip. Otherwise → inbox. */
-  tripId?: string;
-  onSuccess: () => void;
-};
-
-export default function ImportSheet({ visible, onClose, tripId, onSuccess }: Props) {
-  const { showToast } = useToast();
-  const [text, setText] = useState("");
-  const [loading, setLoading] = useState(false);
-  const [error, setError] = useState<string | null>(null);
-
-  async function submit() {
-    if (!text.trim()) return;
-    setLoading(true);
-    setError(null);
-    await haptics.confirm();
-
-    try {
-      await mailApi.import(text.trim(), tripId);
-      await haptics.success();
-      setText("");
-      onClose();
-      onSuccess();
-      showToast("Dokument erfolgreich importiert", "success");
-    } catch (err) {
-      await haptics.error();
-      if (err instanceof ApiError && err.status === 429) {
-        showToast("Tageslimit erreicht (50 Parses/Tag). Upgrade auf Pro.", "warning");
-      } else if (err instanceof ApiError && err.status === 408) {
-        showToast("Timeout — Ollama antwortet nicht. Bitte warte und versuche es erneut.", "error");
-      } else {
-        setError(err instanceof Error ? err.message : "Unbekannter Fehler");
-      }
-    } finally {
-      setLoading(false);
-    }
-  }
-
-  function handleClose() {
-    setText("");
-    setError(null);
-    onClose();
-  }
-
-  return (
-    <BottomSheet visible={visible} onClose={handleClose} heightFraction={0.75} hasInputs>
-      <View style={{ flex: 1 }}>
-        <Text style={s.title}>Text / E-Mail importieren</Text>
-        <Text style={s.subtitle}>
-          {tripId
-            ? "Buchungsbestätigung, E-Mail-Text oder Ticketinhalt einfügen."
-            : "Inhalt wird in den Chaos Inbox importiert. E-Mail-Header werden automatisch entfernt."}
-        </Text>
-
-        <TextInput
-          style={s.input}
-          placeholder={"Buchungsbestätigung, weitergeleitete E-Mail oder Tickettext hier einfügen…"}
-          placeholderTextColor="#4a4a7a"
-          value={text}
-          onChangeText={setText}
-          multiline
-          numberOfLines={8}
-          autoFocus
-          textAlignVertical="top"
-          accessibilityLabel="Buchungstext eingeben"
-        />
-
-        {error && (
-          <View style={s.errorBox}>
-            <Text style={s.errorText}>⚠️  {error}</Text>
-          </View>
-        )}
-
-        <View style={s.buttons}>
-          <TouchableOpacity
-            style={s.cancelBtn}
-            onPress={handleClose}
-            accessibilityRole="button"
-            accessibilityLabel="Abbrechen"
-          >
-            <Text style={s.cancelText}>Abbrechen</Text>
-          </TouchableOpacity>
-          <TouchableOpacity
-            style={[s.submitBtn, (!text.trim() || loading) && s.submitDisabled]}
-            onPress={submit}
-            disabled={loading || !text.trim()}
-            accessibilityRole="button"
-            accessibilityLabel="Text mit Ollama analysieren"
-          >
-            {loading
-              ? <ActivityIndicator color="#fff" size="small" />
-              : <Text style={s.submitText}>Analysieren ✨</Text>}
-          </TouchableOpacity>
-        </View>
-      </View>
-    </BottomSheet>
-  );
-}
-
-const s = StyleSheet.create({
-  title: { fontSize: 18, fontWeight: "700", color: "#fff", marginBottom: 4 },
-  subtitle: { fontSize: 13, color: "#6666aa", marginBottom: 12, lineHeight: 18 },
-  input: {
-    flex: 1,
-    backgroundColor: "#0f0f1a",
-    borderRadius: 12,
-    padding: 14,
-    color: "#fff",
-    fontSize: 14,
-    lineHeight: 20,
-    borderWidth: 1,
-    borderColor: "#2a2a4e",
-    marginBottom: 12,
-    minHeight: 120,
-  },
-  errorBox: {
-    backgroundColor: "#ff6b6b18",
-    borderRadius: 10,
-    padding: 10,
-    marginBottom: 10,
-    borderWidth: 1,
-    borderColor: "#ff6b6b33",
-  },
-  errorText: { color: "#ff8888", fontSize: 13 },
-  buttons: { flexDirection: "row", gap: 12, justifyContent: "flex-end" },
-  cancelBtn: {
-    paddingVertical: 12, paddingHorizontal: 20,
-    borderRadius: 10, borderWidth: 1, borderColor: "#2a2a4e",
-  },
-  cancelText: { color: "#8888aa", fontSize: 15 },
-  submitBtn: {
-    flex: 1, paddingVertical: 14, borderRadius: 12,
-    backgroundColor: "#4f46e5", alignItems: "center",
-  },
-  submitDisabled: { opacity: 0.45 },
-  submitText: { color: "#fff", fontWeight: "700", fontSize: 15 },
-});

package/apps/travel-chaos-organizer/frontend/components/OfflineBadge.tsx

@@ -1,55 +0,0 @@
-import { useEffect, useRef, useState } from "react";
-import { Animated, AppState, AppStateStatus, StyleSheet, Text } from "react-native";
-import * as Network from "expo-network";
-
-export default function OfflineBadge() {
-  const [offline, setOffline] = useState(false);
-  const opacity = useState(new Animated.Value(0))[0];
-  const appState = useRef<AppStateStatus>(AppState.currentState);
-
-  useEffect(() => {
-    let mounted = true;
-
-    async function check() {
-      const net = await Network.getNetworkStateAsync();
-      if (!mounted) return;
-      const isOffline = !net.isConnected;
-      setOffline(isOffline);
-      Animated.timing(opacity, {
-        toValue: isOffline ? 1 : 0,
-        duration: 300,
-        useNativeDriver: true,
-      }).start();
-    }
-
-    check();
-    // Re-check when app returns to foreground, fall back to 30s interval
-    const appStateSub = AppState.addEventListener("change", (next) => {
-      if (appState.current.match(/inactive|background/) && next === "active") {
-        check();
-      }
-      appState.current = next;
-    });
-    const interval = setInterval(check, 30_000);
-    return () => { mounted = false; appStateSub.remove(); clearInterval(interval); };
-  }, []);
-
-  if (!offline) return null;
-
-  return (
-    <Animated.View style={[s.badge, { opacity }]}>
-      <Text style={s.text}>⚡ Offline — gespeicherte Daten</Text>
-    </Animated.View>
-  );
-}
-
-const s = StyleSheet.create({
-  badge: {
-    backgroundColor: "#7c3aed33",
-    borderBottomWidth: 1,
-    borderBottomColor: "#7c3aed55",
-    paddingVertical: 6,
-    alignItems: "center",
-  },
-  text: { color: "#c4b5fd", fontSize: 12, fontWeight: "500" },
-});

package/apps/travel-chaos-organizer/frontend/components/QRCodeViewer.tsx

@@ -1,80 +0,0 @@
-/**
- * Shows a QR code for a booking reference — works fully offline.
- * Uses the booking_ref string to generate the QR locally (no network call).
- * Install: npm install react-native-qrcode-svg react-native-svg
- */
-import { ActivityIndicator, Modal, StyleSheet, Text, TouchableOpacity, View } from "react-native";
-import { useEffect, useState } from "react";
-// @ts-ignore — added in Phase 3 deps
-import QRCode from "react-native-qrcode-svg";
-
-type Props = { bookingRef: string; title?: string };
-
-export default function QRCodeViewer({ bookingRef, title }: Props) {
-  const [visible, setVisible] = useState(false);
-  const [qrReady, setQrReady] = useState(false);
-
-  useEffect(() => {
-    if (visible) {
-      const id = requestAnimationFrame(() => setQrReady(true));
-      return () => { cancelAnimationFrame(id); setQrReady(false); };
-    } else {
-      setQrReady(false);
-    }
-  }, [visible]);
-
-  return (
-    <>
-      <TouchableOpacity style={s.trigger} onPress={() => setVisible(true)}>
-        <Text style={s.triggerText}>QR · {bookingRef}</Text>
-      </TouchableOpacity>
-
-      <Modal visible={visible} transparent animationType="fade">
-        <TouchableOpacity style={s.backdrop} activeOpacity={1} onPress={() => setVisible(false)}>
-          <View style={s.card}>
-            <Text style={s.cardTitle}>{title ?? bookingRef}</Text>
-            <View style={s.qr}>
-              {qrReady
-                ? <QRCode value={bookingRef} size={220} backgroundColor="#fff" color="#0f0f1a" />
-                : <ActivityIndicator color="#4f46e5" size="large" style={{ width: 220, height: 220 }} />}
-            </View>
-            <Text style={s.ref}>{bookingRef}</Text>
-            <Text style={s.hint}>Antippen zum Schließen</Text>
-          </View>
-        </TouchableOpacity>
-      </Modal>
-    </>
-  );
-}
-
-const s = StyleSheet.create({
-  trigger: {
-    backgroundColor: "#0f0f1a",
-    borderRadius: 6,
-    paddingHorizontal: 10,
-    paddingVertical: 4,
-    borderWidth: 1,
-    borderColor: "#4f46e555",
-    alignSelf: "flex-start",
-  },
-  triggerText: { color: "#a5b4fc", fontSize: 12, fontWeight: "500" },
-  backdrop: {
-    flex: 1,
-    backgroundColor: "#000000cc",
-    alignItems: "center",
-    justifyContent: "center",
-  },
-  card: {
-    backgroundColor: "#1a1a2e",
-    borderRadius: 24,
-    padding: 32,
-    alignItems: "center",
-    gap: 16,
-    borderWidth: 1,
-    borderColor: "#2a2a4e",
-  },
-  cardTitle: { color: "#fff", fontSize: 16, fontWeight: "700" },
-  qr: { backgroundColor: "#fff", padding: 16, borderRadius: 12 },
-  ref: { color: "#6666aa", fontSize: 13, letterSpacing: 1 },
-  hint: { color: "#3a3a5e", fontSize: 12 },
-});

package/apps/travel-chaos-organizer/frontend/components/ScoreRing.tsx

@@ -1,39 +0,0 @@
-import { View, Text, StyleSheet } from "react-native";
-// @ts-ignore — react-native-svg is a peer dep of react-native-qrcode-svg
-import Svg, { Circle } from "react-native-svg";
-
-type Props = { score: number; size?: number };
-
-export default function ScoreRing({ score, size = 40 }: Props) {
-  const stroke = 3;
-  const radius = (size - stroke) / 2;
-  const circumference = 2 * Math.PI * radius;
-  const filled = (score / 100) * circumference;
-  const gap = circumference - filled;
-
-  const color = score === 100 ? "#10b981" : score >= 50 ? "#4f46e5" : "#3a3a5e";
-
-  return (
-    <View style={[s.wrap, { width: size, height: size }]}>
-      <Svg width={size} height={size}>
-        <Circle
-          cx={size / 2} cy={size / 2} r={radius}
-          stroke="#2a2a4e" strokeWidth={stroke} fill="none"
-        />
-        <Circle
-          cx={size / 2} cy={size / 2} r={radius}
-          stroke={color} strokeWidth={stroke} fill="none"
-          strokeDasharray={`${filled} ${gap}`}
-          strokeLinecap="round"
-          transform={`rotate(-90 ${size / 2} ${size / 2})`}
-        />
-      </Svg>
-      <Text style={[s.label, { color }]}>{score}</Text>
-    </View>
-  );
-}
-
-const s = StyleSheet.create({
-  wrap: { alignItems: "center", justifyContent: "center", position: "relative" },
-  label: { position: "absolute", fontSize: 10, fontWeight: "700" },
-});

package/apps/travel-chaos-organizer/frontend/components/Screen.tsx

@@ -1,39 +0,0 @@
-/**
- * Mobile-first layout wrapper.
- * - Handles safe areas (notch, Dynamic Island, home indicator)
- * - Sets dark status bar across all screens
- * - Provides consistent screen-level padding
- */
-import { ReactNode } from "react";
-import { Platform, StatusBar, StyleSheet, View } from "react-native";
-import { useSafeAreaInsets } from "react-native-safe-area-context";
-
-type Props = {
-  children: ReactNode;
-  noPadding?: boolean;
-};
-
-export default function Screen({ children, noPadding }: Props) {
-  const insets = useSafeAreaInsets();
-
-  return (
-    <View
-      style={[
-        s.container,
-        !noPadding && {
-          paddingTop: insets.top,
-          paddingBottom: insets.bottom,
-          paddingLeft: insets.left,
-          paddingRight: insets.right,
-        },
-      ]}
-    >
-      <StatusBar barStyle="light-content" backgroundColor="#0f0f1a" />
-      {children}
-    </View>
-  );
-}
-
-const s = StyleSheet.create({
-  container: { flex: 1, backgroundColor: "#0f0f1a" },
-});

package/apps/travel-chaos-organizer/frontend/components/Skeleton.tsx

@@ -1,70 +0,0 @@
-/**
- * Skeleton loader — animated shimmer placeholder while data loads.
- * Mirrors the shape of TripCard and TimelineItem so there's no layout jump.
- */
-import { useEffect, useRef } from "react";
-import { Animated, StyleSheet, View } from "react-native";
-
-function ShimmerBar({ width, height = 14, style }: { width: number | `${number}%`; height?: number; style?: object }) {
-  const anim = useRef(new Animated.Value(0.3)).current;
-
-  useEffect(() => {
-    Animated.loop(
-      Animated.sequence([
-        Animated.timing(anim, { toValue: 1, duration: 900, useNativeDriver: true }),
-        Animated.timing(anim, { toValue: 0.3, duration: 900, useNativeDriver: true }),
-      ])
-    ).start();
-  }, []);
-
-  return (
-    <Animated.View
-      style={[{ width, height, borderRadius: 6, backgroundColor: "#2a2a4e", opacity: anim }, style]}
-    />
-  );
-}
-
-export function TripCardSkeleton() {
-  return (
-    <View style={s.card}>
-      <View style={s.row}>
-        <View style={{ flex: 1, gap: 8 }}>
-          <ShimmerBar width="70%" height={16} />
-          <ShimmerBar width="45%" height={12} />
-        </View>
-        <ShimmerBar width={52} height={22} style={{ borderRadius: 6 }} />
-      </View>
-    </View>
-  );
-}
-
-export function TimelineItemSkeleton() {
-  return (
-    <View style={s.timelineRow}>
-      <View style={s.line}>
-        <ShimmerBar width={12} height={12} style={{ borderRadius: 6 }} />
-      </View>
-      <View style={s.timelineCard}>
-        <View style={s.row}>
-          <ShimmerBar width={28} height={28} style={{ borderRadius: 6 }} />
-          <View style={{ flex: 1, gap: 6 }}>
-            <ShimmerBar width="65%" height={14} />
-            <ShimmerBar width="40%" height={11} />
-          </View>
-        </View>
-        <View style={{ flexDirection: "row", gap: 8, marginTop: 4 }}>
-          <ShimmerBar width={80} height={22} />
-          <ShimmerBar width={70} height={22} />
-        </View>
-      </View>
-    </View>
-  );
-}
-
-const s = StyleSheet.create({
-  card: { backgroundColor: "#1a1a2e", borderRadius: 16, padding: 18, borderWidth: 1, borderColor: "#2a2a4e", gap: 10 },
-  row: { flexDirection: "row", alignItems: "center", gap: 12 },
-  timelineRow: { flexDirection: "row", gap: 12, paddingBottom: 2 },
-  line: { alignItems: "center", width: 24, paddingTop: 18 },
-  timelineCard: { flex: 1, backgroundColor: "#1a1a2e", borderRadius: 14, padding: 14, marginBottom: 8, borderWidth: 1, borderColor: "#2a2a4e", gap: 10 },
-});

package/apps/travel-chaos-organizer/frontend/components/SwipeableInboxItem.tsx

@@ -1,121 +0,0 @@
-/**
- * Swipeable inbox row — swipe left to reject, swipe right to assign.
- * Uses Animated + PanResponder (no extra library needed).
- * Minimum touch target: 48pt (Apple HIG / Material spec).
- */
-import { useRef } from "react";
-import {
-  Animated, PanResponder, StyleSheet, Text, TouchableOpacity, View,
-} from "react-native";
-import { InboxItem } from "../lib/api";
-import { haptics } from "../lib/haptics";
-
-const SWIPE_THRESHOLD = 80;
-const ACTION_WIDTH = 72;
-
-type Props = {
-  item: InboxItem;
-  onAssign: () => void;
-  onReject: () => void;
-};
-
-export default function SwipeableInboxItem({ item, onAssign, onReject }: Props) {
-  const translateX = useRef(new Animated.Value(0)).current;
-  const parsed = item.parsed_data as Record<string, unknown> | null;
-
-  const panResponder = useRef(
-    PanResponder.create({
-      onMoveShouldSetPanResponder: (_, g) => Math.abs(g.dx) > 8 && Math.abs(g.dy) < 20,
-      onPanResponderMove: (_, g) => {
-        translateX.setValue(Math.max(-ACTION_WIDTH * 1.5, Math.min(ACTION_WIDTH * 1.5, g.dx)));
-      },
-      onPanResponderRelease: async (_, g) => {
-        if (g.dx > SWIPE_THRESHOLD) {
-          await haptics.confirm();
-          snapBack();
-          onAssign();
-        } else if (g.dx < -SWIPE_THRESHOLD) {
-          await haptics.warning();
-          snapBack();
-          onReject();
-        } else {
-          snapBack();
-        }
-      },
-    })
-  ).current;
-
-  function snapBack() {
-    Animated.spring(translateX, { toValue: 0, useNativeDriver: true, damping: 15 }).start();
-  }
-
-  return (
-    <View style={s.wrapper}>
-      {/* Left action — assign (revealed by swipe right) */}
-      <View style={[s.action, s.actionAssign]}>
-        <Text style={s.actionIcon}>✅</Text>
-        <Text style={s.actionLabel}>Zuweisen</Text>
-      </View>
-
-      {/* Right action — reject (revealed by swipe left) */}
-      <View style={[s.action, s.actionReject]}>
-        <Text style={s.actionIcon}>🗑️</Text>
-        <Text style={s.actionLabel}>Ablehnen</Text>
-      </View>
-
-      {/* Card row */}
-      <Animated.View style={[s.card, { transform: [{ translateX }] }]} {...panResponder.panHandlers}>
-        <View style={s.typeCol}>
-          <Text style={s.typeIcon}>{typeIcon(parsed?.type as string)}</Text>
-        </View>
-
-        <View style={s.content}>
-          <Text style={s.title} numberOfLines={1}>
-            {(parsed?.title as string) ?? "Unbekanntes Dokument"}
-          </Text>
-          <Text style={s.sub} numberOfLines={1}>
-            {(parsed?.provider as string) ?? (item.source ?? "Unbekannte Quelle")}
-            {parsed?.booking_ref ? `  ·  #${parsed.booking_ref}` : ""}
-          </Text>
-          {!!parsed?.raw_summary && (
-            <Text style={s.summary} numberOfLines={2}>{parsed.raw_summary as string}</Text>
-          )}
-        </View>
-
-        {/* Explicit buttons as fallback for non-swipe users */}
-        <View style={s.actions}>
-          <TouchableOpacity style={s.btn} onPress={onAssign} hitSlop={{ top: 12, bottom: 12, left: 8, right: 8 }} accessibilityLabel="Zuweisen" accessibilityRole="button">
-            <Text style={s.btnText}>→</Text>
-          </TouchableOpacity>
-          <TouchableOpacity style={[s.btn, s.btnDanger]} onPress={onReject} hitSlop={{ top: 12, bottom: 12, left: 8, right: 8 }} accessibilityLabel="Ablehnen" accessibilityRole="button">
-            <Text style={s.btnText}>✕</Text>
-          </TouchableOpacity>
-        </View>
-      </Animated.View>
-    </View>
-  );
-}
-
-function typeIcon(type?: string): string {
-  return ({ flight: "✈️", train: "🚂", bus: "🚌", hotel: "🏨", rental_car: "🚗", activity: "🎡", transfer: "🚕", document: "📄" } as Record<string, string>)[type ?? ""] ?? "📋";
-}
-
-const s = StyleSheet.create({
-  wrapper: { position: "relative", marginBottom: 10 },
-  action: { position: "absolute", top: 0, bottom: 0, width: ACTION_WIDTH, alignItems: "center", justifyContent: "center", borderRadius: 16, gap: 4 },
-  actionAssign: { left: 0, backgroundColor: "#16a34a33" },
-  actionReject: { right: 0, backgroundColor: "#dc262633" },
-  actionIcon: { fontSize: 22 },
-  actionLabel: { color: "#fff", fontSize: 11, fontWeight: "600" },
-  card: { backgroundColor: "#1a1a2e", borderRadius: 16, padding: 14, flexDirection: "row", alignItems: "center", gap: 12, borderWidth: 1, borderColor: "#2a2a4e", minHeight: 72 },
-  typeCol: { width: 36, alignItems: "center" },
-  typeIcon: { fontSize: 26 },
-  content: { flex: 1, gap: 3 },
-  title: { color: "#fff", fontSize: 15, fontWeight: "600" },
-  sub: { color: "#6666aa", fontSize: 12 },
-  summary: { color: "#8888aa", fontSize: 12, lineHeight: 17, marginTop: 2 },
-  actions: { gap: 6 },
-  btn: { width: 36, height: 36, borderRadius: 10, backgroundColor: "#2a2a4e", alignItems: "center", justifyContent: "center" },
-  btnDanger: { backgroundColor: "#3a1a1a" },
-  btnText: { color: "#fff", fontSize: 16 },
-});