diff --git a/packages/mobile-app/components/chat/Composer.tsx b/packages/mobile-app/components/chat/Composer.tsx
index ca136d4c8d..99a924c798 100644
--- a/packages/mobile-app/components/chat/Composer.tsx
+++ b/packages/mobile-app/components/chat/Composer.tsx
@@ -1,19 +1,34 @@
 import {
   IconArrowUp,
   IconAt,
+  IconBolt,
+  IconBulb,
+  IconCamera,
+  IconChevronDown,
+  IconChevronLeft,
+  IconChevronRight,
+  IconClock,
   IconFileText,
   IconMicrophone,
   IconPhoto,
   IconPlayerStopFilled,
+  IconPlugConnected,
+  IconPlus,
   IconRobot,
+  IconTools,
+  IconUpload,
   IconX,
 } from "@tabler/icons-react-native";
+import * as DocumentPicker from "expo-document-picker";
+import * as FileSystem from "expo-file-system";
 import * as ImagePicker from "expo-image-picker";
 import { useNavigation, useRouter } from "expo-router";
-import { useEffect, useMemo, useState } from "react";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import {
   ActivityIndicator,
   Image,
+  Modal,
+  Platform,
   Pressable,
   ScrollView,
   Text,
@@ -35,6 +50,29 @@ import type {
 import type { AgentChatSettings } from "@/lib/agent-chat/use-agent-chat";
 import { getAndClearLastDictatedText } from "@/lib/voice-api";
 
+export type ActionTag = {
+  id: string;
+  label: string;
+  icon: "bolt" | "bulb" | "clock" | "tools" | "upload";
+};
+
+function renderActionTagIcon(iconName: ActionTag["icon"]) {
+  switch (iconName) {
+    case "bolt":
+      return <IconBolt color="#d4d4d8" size={14} strokeWidth={2} />;
+    case "bulb":
+      return <IconBulb color="#d4d4d8" size={14} strokeWidth={2} />;
+    case "clock":
+      return <IconClock color="#d4d4d8" size={14} strokeWidth={2} />;
+    case "tools":
+      return <IconTools color="#d4d4d8" size={14} strokeWidth={2} />;
+    case "upload":
+      return <IconUpload color="#d4d4d8" size={14} strokeWidth={2} />;
+    default:
+      return null;
+  }
+}
+
 function MentionRowIcon({ refType }: { refType: string }) {
   if (refType === "agent" || refType === "custom-agent") {
     return <IconRobot color="#a1a1aa" size={17} strokeWidth={1.8} />;
@@ -46,33 +84,211 @@ function MentionRowIcon({ refType }: { refType: string }) {
 }
 
 function settingsSummary(settings: AgentChatSettings): string {
-  const model = settings.model ? settings.model.replace(/-\d{8}$/, "") : "Auto";
+  if (!settings.model) return "Auto";
+  const raw = settings.model.replace(/-\d{8}$/, "");
+  let model = raw;
+  if (/sonnet/i.test(raw)) model = "Sonnet 5";
+  else if (/opus/i.test(raw)) model = "Opus 3.5";
+  else if (/haiku/i.test(raw)) model = "Haiku 3.5";
+  else if (/gpt-4o/i.test(raw)) model = "GPT-4o";
+  else if (/gemini/i.test(raw)) model = "Gemini 2.0";
+  else {
+    model = raw.charAt(0).toUpperCase() + raw.slice(1);
+  }
   const effort = settings.effort
     ? ` · ${settings.effort[0]!.toUpperCase()}${settings.effort.slice(1, 3)}`
     : "";
   return `${model}${effort}`;
 }
 
-async function pickImageAttachment(): Promise<ChatAttachment | null> {
-  const result = await ImagePicker.launchImageLibraryAsync({
-    mediaTypes: ["images"],
-    quality: 0.7,
-    base64: true,
-    exif: false,
-  });
-  const asset = result.assets?.[0];
-  if (result.canceled || !asset?.base64) return null;
-  const mimeType = asset.mimeType?.startsWith("image/")
-    ? asset.mimeType
-    : "image/jpeg";
+function detectMimeType(fileName: string, providedMime?: string): string {
+  if (
+    providedMime &&
+    providedMime !== "application/octet-stream" &&
+    providedMime !== "binary/octet-stream"
+  ) {
+    return providedMime;
+  }
+  const ext = fileName.split(".").pop()?.toLowerCase();
+  switch (ext) {
+    case "jpg":
+    case "jpeg":
+      return "image/jpeg";
+    case "png":
+      return "image/png";
+    case "gif":
+      return "image/gif";
+    case "webp":
+      return "image/webp";
+    case "heic":
+    case "heif":
+      return "image/heic";
+    case "svg":
+      return "image/svg+xml";
+    case "pdf":
+      return "application/pdf";
+    case "txt":
+      return "text/plain";
+    case "json":
+      return "application/json";
+    case "csv":
+      return "text/csv";
+    case "md":
+      return "text/markdown";
+    default:
+      return providedMime || "application/octet-stream";
+  }
+}
+
+async function getAssetDataUrl(
+  uri: string,
+  mimeType: string,
+  fileObj?: File | Blob,
+): Promise<string | null> {
+  if (fileObj && typeof FileReader !== "undefined") {
+    try {
+      return await new Promise<string>((resolve, reject) => {
+        const reader = new FileReader();
+        reader.onload = () => resolve(reader.result as string);
+        reader.onerror = reject;
+        reader.readAsDataURL(fileObj);
+      });
+    } catch {
+      // fallback
+    }
+  }
+
+  if (Platform.OS !== "web") {
+    try {
+      const base64 = await FileSystem.readAsStringAsync(uri, {
+        encoding: FileSystem.EncodingType.Base64,
+      });
+      return `data:${mimeType};base64,${base64}`;
+    } catch (e) {
+      console.warn(
+        "FileSystem readAsStringAsync failed, trying fetch fallback:",
+        e,
+      );
+    }
+  }
+
+  try {
+    const res = await fetch(uri);
+    const blob = await res.blob();
+    return await new Promise<string>((resolve, reject) => {
+      const reader = new FileReader();
+      reader.onload = () => resolve(reader.result as string);
+      reader.onerror = reject;
+      reader.readAsDataURL(blob);
+    });
+  } catch (e) {
+    console.error("Failed to read asset data URL:", e);
+    return null;
+  }
+}
+
+async function documentAssetToAttachment(
+  asset: DocumentPicker.DocumentPickerAsset,
+): Promise<ChatAttachment | null> {
+  const name = asset.name || "file";
+  const mimeType = detectMimeType(name, asset.mimeType);
+
+  const dataUrl = await getAssetDataUrl(
+    asset.uri,
+    mimeType,
+    (asset as { file?: File }).file,
+  );
+  if (!dataUrl) return null;
+
+  const isImage = mimeType.startsWith("image/");
+  return {
+    type: isImage ? "image" : "file",
+    name,
+    contentType: mimeType,
+    data: dataUrl,
+  };
+}
+
+async function pickAnyFileAttachments(): Promise<ChatAttachment[]> {
+  try {
+    const result = await DocumentPicker.getDocumentAsync({
+      type: "*/*",
+      multiple: true,
+      copyToCacheDirectory: true,
+    });
+    if (result.canceled || !result.assets?.length) return [];
+    const converted = await Promise.all(
+      result.assets.map(documentAssetToAttachment),
+    );
+    return converted.filter((a): a is ChatAttachment => a !== null);
+  } catch (error) {
+    console.error("pickAnyFileAttachments error:", error);
+    return [];
+  }
+}
+
+async function imageAssetToAttachment(
+  asset: ImagePicker.ImagePickerAsset,
+  fallbackName: string,
+): Promise<ChatAttachment | null> {
+  const name = asset.fileName ?? fallbackName;
+  const mimeType = detectMimeType(name, asset.mimeType ?? "image/jpeg");
+
+  let dataUrl: string | null = null;
+  if (asset.base64) {
+    dataUrl = `data:${mimeType};base64,${asset.base64}`;
+  } else if (asset.uri) {
+    dataUrl = await getAssetDataUrl(asset.uri, mimeType);
+  }
+
+  if (!dataUrl) return null;
+
   return {
     type: "image",
-    name: asset.fileName ?? "photo.jpg",
+    name,
     contentType: mimeType,
-    data: `data:${mimeType};base64,${asset.base64}`,
+    data: dataUrl,
   };
 }
 
+async function captureCameraAttachment(): Promise<ChatAttachment | null> {
+  try {
+    const permission = await ImagePicker.requestCameraPermissionsAsync();
+    if (!permission.granted) return null;
+    const result = await ImagePicker.launchCameraAsync({
+      mediaTypes: ["images"],
+      quality: 0.7,
+      base64: true,
+      exif: false,
+    });
+    const asset = result.assets?.[0];
+    if (result.canceled || !asset) return null;
+    return await imageAssetToAttachment(asset, "camera_photo.jpg");
+  } catch (error) {
+    console.error("captureCameraAttachment error:", error);
+    return null;
+  }
+}
+
+async function pickPhotoFromLibrary(): Promise<ChatAttachment | null> {
+  try {
+    const permission = await ImagePicker.requestMediaLibraryPermissionsAsync();
+    if (!permission.granted) return null;
+    const result = await ImagePicker.launchImageLibraryAsync({
+      mediaTypes: ["images"],
+      quality: 0.7,
+      base64: true,
+      exif: false,
+    });
+    const asset = result.assets?.[0];
+    if (result.canceled || !asset) return null;
+    return await imageAssetToAttachment(asset, "photo.jpg");
+  } catch (error) {
+    console.error("pickPhotoFromLibrary error:", error);
+    return null;
+  }
+}
+
 export function Composer({
   isStreaming,
   settings,
@@ -84,7 +300,6 @@ export function Composer({
 }: {
   isStreaming: boolean;
   settings: AgentChatSettings;
-  /** Active thread's app — mentions are fetched from this app. */
   baseUrl?: string;
   onSend: (
     text: string,
@@ -102,8 +317,13 @@ export function Composer({
   const [references, setReferences] = useState<ChatReference[]>([]);
   const [mentionItems, setMentionItems] = useState<MentionItem[]>([]);
   const [mentionLoading, setMentionLoading] = useState(false);
+  const [plusMenuOpen, setPlusMenuOpen] = useState(false);
+  const [menuScreen, setMenuScreen] = useState<"main" | "skill">("main");
+  const [actionTag, setActionTag] = useState<ActionTag | null>(null);
+
   const canSend =
-    (text.trim().length > 0 || attachments.length > 0) && !isStreaming;
+    (text.trim().length > 0 || attachments.length > 0 || actionTag !== null) &&
+    !isStreaming;
 
   // A mention is being typed only when the caret is a collapsed cursor.
   const activeMention = useMemo(
@@ -169,8 +389,6 @@ export function Composer({
       if (dictated) {
         setText((current) => {
           const next = current ? current + "\n" + dictated : dictated;
-          // Move the controlled caret to the end so the next keystrokes land
-          // after the dictated text, not before it.
           setSelection({ start: next.length, end: next.length });
           return next;
         });
@@ -185,57 +403,150 @@ export function Composer({
 
   const submit = () => {
     if (!canSend) return;
-    const value = text.trim();
-    // Only send references still present in the text — a mention the user
-    // deleted should not silently travel with the turn.
+    const raw = text.trim();
+    const value = actionTag
+      ? raw
+        ? `[${actionTag.label}] ${raw}`
+        : `Perform ${actionTag.label}`
+      : raw;
+
     const activeReferences = references.filter((r) =>
       value.includes(`@${r.name}`),
     );
     setText("");
     setAttachments([]);
     setReferences([]);
+    setActionTag(null);
     setSelection({ start: 0, end: 0 });
     onSend(value, attachments, activeReferences);
   };
 
-  const attach = () => {
-    void pickImageAttachment().then((attachment) => {
-      if (attachment) setAttachments((current) => [...current, attachment]);
+  const addAttachment = useCallback((attachment: ChatAttachment | null) => {
+    if (attachment) setAttachments((current) => [...current, attachment]);
+  }, []);
+
+  const addAttachments = useCallback((incoming: ChatAttachment[]) => {
+    if (incoming.length) setAttachments((current) => [...current, ...incoming]);
+  }, []);
+
+  useEffect(() => {
+    const recover = () => {
+      void ImagePicker.getPendingResultAsync()
+        .then(async (result) => {
+          if (!result || "code" in result) return;
+          if (result.canceled) return;
+          const asset = result.assets?.[0];
+          if (!asset) return;
+          addAttachment(await imageAssetToAttachment(asset, "photo.jpg"));
+        })
+        .catch(() => {});
+    };
+    recover();
+    const unsubscribe = navigation.addListener("focus", recover);
+    return unsubscribe;
+  }, [navigation, addAttachment]);
+
+  const pendingActionRef = useRef<(() => void) | null>(null);
+  const runPendingAction = () => {
+    const action = pendingActionRef.current;
+    pendingActionRef.current = null;
+    action?.();
+  };
+  const closeMenuThen = (action: () => void) => {
+    pendingActionRef.current = action;
+    setPlusMenuOpen(false);
+    if (Platform.OS !== "ios") setTimeout(runPendingAction, 300);
+  };
+
+  const handleOpenPlusMenu = () => {
+    setMenuScreen("main");
+    setPlusMenuOpen(true);
+  };
+
+  const handleUploadFile = () => {
+    closeMenuThen(() => {
+      void pickAnyFileAttachments().then(addAttachments);
+    });
+  };
+
+  const handleTakePhoto = () => {
+    closeMenuThen(() => {
+      void captureCameraAttachment().then(addAttachment);
+    });
+  };
+
+  const handlePickPhoto = () => {
+    closeMenuThen(() => {
+      void pickPhotoFromLibrary().then(addAttachment);
+    });
+  };
+
+  const handleSelectActionTag = (tag: ActionTag) => {
+    setActionTag(tag);
+    setPlusMenuOpen(false);
+  };
+
+  const handleUploadSkillFile = () => {
+    setActionTag({
+      id: "upload-skill",
+      label: "Upload Skill File",
+      icon: "upload",
+    });
+    closeMenuThen(() => {
+      void pickAnyFileAttachments().then(addAttachments);
     });
   };
 
+  const handleIntegrations = () => {
+    setPlusMenuOpen(false);
+    onOpenSettings();
+  };
+
   return (
-    <View className="px-3 pt-2">
+    <View className="px-3 pt-2 pb-1">
       {attachments.length > 0 && (
         <ScrollView
           horizontal
           showsHorizontalScrollIndicator={false}
-          contentContainerClassName="gap-2 pb-2 px-1"
+          contentContainerClassName="gap-2 pt-1.5 pb-0.5 px-1.5"
         >
-          {attachments.map((attachment, index) => (
-            <View
-              key={`${attachment.name}-${index}`}
-              className="rounded-xl overflow-hidden border border-border-dark"
-            >
-              <Image
-                source={{ uri: attachment.data }}
-                className="w-14 h-14"
-                accessibilityLabel={attachment.name}
-              />
-              <Pressable
-                className="absolute top-0.5 right-0.5 w-5 h-5 rounded-full bg-background-pure items-center justify-center active:opacity-75"
-                onPress={() =>
-                  setAttachments((current) =>
-                    current.filter((_, i) => i !== index),
-                  )
-                }
-                accessibilityRole="button"
-                accessibilityLabel={`Remove ${attachment.name}`}
+          {attachments.map((attachment, index) => {
+            const isImage =
+              attachment.type === "image" ||
+              attachment.contentType?.startsWith("image/");
+            return (
+              <View
+                key={`${attachment.name}-${index}`}
+                className="rounded-xl border border-border-dark p-0.5 flex-row items-center gap-2 max-w-42.5"
               >
-                <IconX color="#fafafa" size={12} strokeWidth={2.4} />
-              </Pressable>
-            </View>
-          ))}
+                {isImage && attachment.data ? (
+                  <Image
+                    source={{ uri: attachment.data }}
+                    className="w-10 h-10 rounded-lg"
+                    accessibilityLabel={attachment.name}
+                  />
+                ) : (
+                  <View className="w-10 h-10 rounded-lg bg-zinc-700 items-center justify-center">
+                    <IconFileText color="#d4d4d8" size={20} />
+                  </View>
+                )}
+
+                <Pressable
+                  className="absolute -top-1.5 -right-1.5 w-5 h-5 rounded-full bg-zinc-900 border border-border-dark items-center justify-center active:opacity-75"
+                  hitSlop={8}
+                  onPress={() =>
+                    setAttachments((current) =>
+                      current.filter((_, i) => i !== index),
+                    )
+                  }
+                  accessibilityRole="button"
+                  accessibilityLabel={`Remove ${attachment.name}`}
+                >
+                  <IconX color="#fafafa" size={11} strokeWidth={2.4} />
+                </Pressable>
+              </View>
+            );
+          })}
         </ScrollView>
       )}
 
@@ -282,99 +593,406 @@ export function Composer({
         </View>
       )}
 
-      <View className="rounded-3xl bg-card-dark border border-border-dark px-1.5 pt-1.5 pb-1">
-        <View className="flex-row items-end">
-          <Pressable
-            className="w-9 h-9 rounded-full items-center justify-center mb-0.5 active:opacity-75"
-            onPress={attach}
-            disabled={isStreaming}
-            accessibilityRole="button"
-            accessibilityLabel="Attach image"
-          >
-            <IconPhoto color="#71717a" size={20} strokeWidth={1.8} />
-          </Pressable>
+      <View className="rounded-[22px] bg-card-dark border border-border-dark px-3.5 pt-3 pb-2.5">
+        {actionTag && (
+          <View className="flex-row items-center gap-1.5 self-start px-2.5 py-1 rounded-lg bg-zinc-800/90 border border-zinc-700/80 mb-2">
+            {renderActionTagIcon(actionTag.icon)}
+            <Text className="text-white text-[13px] font-medium pl-0.5">
+              {actionTag.label}
+            </Text>
+            <Pressable
+              onPress={() => setActionTag(null)}
+              className="p-0.5 ml-1 active:opacity-75"
+              accessibilityRole="button"
+              accessibilityLabel={`Remove ${actionTag.label} tag`}
+            >
+              <IconX color="#a1a1aa" size={13} strokeWidth={2.2} />
+            </Pressable>
+          </View>
+        )}
+
+        <TextInput
+          className="text-white text-[15px] leading-5 min-h-[44px] max-h-32 py-1 mb-1.5"
+          value={text}
+          onChangeText={setText}
+          selection={selection}
+          onSelectionChange={(event) =>
+            setSelection(event.nativeEvent.selection)
+          }
+          placeholder="Message the agent…  (@ to mention)"
+          placeholderTextColor="#71717a"
+          multiline
+          keyboardAppearance="dark"
+          accessibilityLabel="Message input"
+          nativeID="chat-composer-input"
+        />
+
+        <View className="flex-row items-center justify-between pt-1">
           <Pressable
-            className="w-9 h-9 rounded-full items-center justify-center mb-0.5 active:opacity-75"
-            onPress={startDictation}
+            className="w-8 h-8 rounded-full items-center justify-center -ml-1 active:opacity-75"
+            onPress={handleOpenPlusMenu}
             disabled={isStreaming}
             accessibilityRole="button"
-            accessibilityLabel="Voice dictation"
+            accessibilityLabel="Actions menu"
           >
-            <IconMicrophone color="#71717a" size={20} strokeWidth={1.8} />
+            <IconPlus color="#a1a1aa" size={19} strokeWidth={2} />
           </Pressable>
-          <TextInput
-            className="flex-1 text-white text-[15px] leading-5 max-h-30 py-2"
-            value={text}
-            onChangeText={setText}
-            selection={selection}
-            onSelectionChange={(event) =>
-              setSelection(event.nativeEvent.selection)
-            }
-            placeholder="Message the agent…  (@ to mention)"
-            placeholderTextColor="#71717a"
-            multiline
-            keyboardAppearance="dark"
-            accessibilityLabel="Message input"
-            nativeID="chat-composer-input"
-          />
-          {isStreaming ? (
+
+          <View className="flex-row items-center gap-2.5">
             <Pressable
-              className="w-9 h-9 rounded-full bg-white items-center justify-center mb-0.5 active:opacity-75"
-              onPress={onStop}
+              className="flex-row items-center gap-1 py-1 px-1 rounded-lg active:opacity-75"
+              onPress={onOpenSettings}
               accessibilityRole="button"
-              accessibilityLabel="Stop generating"
+              accessibilityLabel="Model and effort settings"
             >
-              <IconPlayerStopFilled color="#0b0b0c" size={16} />
+              <Text className="text-[13px] font-medium text-zinc-400">
+                {settingsSummary(settings)}
+              </Text>
+              <IconChevronDown color="#71717a" size={13} strokeWidth={2} />
             </Pressable>
-          ) : (
+
             <Pressable
-              className={`w-9 h-9 rounded-full items-center justify-center mb-0.5 active:opacity-75 ${
-                canSend ? "bg-accent-green" : "bg-gray-medium-dark"
-              }`}
-              onPress={submit}
-              disabled={!canSend}
+              className="flex-row items-center gap-1 py-1 px-1 rounded-lg active:opacity-75"
+              onPress={onToggleMode}
               accessibilityRole="button"
-              accessibilityLabel="Send message"
+              accessibilityLabel={`Mode ${settings.mode === "plan" ? "Plan" : "Act"} — tap to toggle`}
             >
-              <IconArrowUp
-                color={canSend ? "#0b0b0c" : "#71717a"}
-                size={18}
-                strokeWidth={2.4}
-              />
+              <Text
+                className={`text-[13px] font-medium ${
+                  settings.mode === "plan"
+                    ? "text-accent-blue"
+                    : "text-zinc-400"
+                }`}
+              >
+                {settings.mode === "plan" ? "Plan" : "Act"}
+              </Text>
+              <IconChevronDown color="#71717a" size={13} strokeWidth={2} />
             </Pressable>
-          )}
-        </View>
 
-        <View className="flex-row items-center gap-2 px-2 pb-1">
-          <Pressable
-            className="active:opacity-75"
-            onPress={onOpenSettings}
-            accessibilityRole="button"
-            accessibilityLabel="Model and effort settings"
-          >
-            <Text className="text-status-gray text-xs font-medium">
-              {settingsSummary(settings)}
-            </Text>
-          </Pressable>
-          <Text className="text-gray-border-light text-xs">·</Text>
-          <Pressable
-            className="active:opacity-75"
-            onPress={onToggleMode}
-            accessibilityRole="button"
-            accessibilityLabel={`Mode ${settings.mode === "plan" ? "Plan" : "Act"} — tap to toggle`}
-          >
-            <Text
-              className={`text-xs font-semibold ${
-                settings.mode === "plan"
-                  ? "text-accent-blue"
-                  : "text-status-gray"
-              }`}
+            {isStreaming && (
+              <ActivityIndicator
+                size="small"
+                color="#38bdf8"
+                className="px-0.5"
+              />
+            )}
+
+            <Pressable
+              className="w-8 h-8 rounded-full items-center justify-center active:opacity-75"
+              onPress={startDictation}
+              disabled={isStreaming}
+              accessibilityRole="button"
+              accessibilityLabel="Voice dictation"
             >
-              {settings.mode === "plan" ? "Plan" : "Act"}
-            </Text>
-          </Pressable>
+              <IconMicrophone color="#a1a1aa" size={19} strokeWidth={1.8} />
+            </Pressable>
+
+            {isStreaming ? (
+              <Pressable
+                className="w-8 h-8 rounded-xl bg-white items-center justify-center active:opacity-75"
+                onPress={onStop}
+                accessibilityRole="button"
+                accessibilityLabel="Stop generating"
+              >
+                <IconPlayerStopFilled color="#0b0b0c" size={14} />
+              </Pressable>
+            ) : (
+              <Pressable
+                className={`w-8 h-8 rounded-xl items-center justify-center active:opacity-75 ${
+                  canSend ? "bg-white" : "bg-zinc-800/80"
+                }`}
+                onPress={submit}
+                disabled={!canSend}
+                accessibilityRole="button"
+                accessibilityLabel="Send message"
+              >
+                <IconArrowUp
+                  color={canSend ? "#0b0b0c" : "#52525b"}
+                  size={17}
+                  strokeWidth={2.2}
+                />
+              </Pressable>
+            )}
+          </View>
         </View>
       </View>
+
+      <Modal
+        visible={plusMenuOpen}
+        transparent
+        animationType="fade"
+        onRequestClose={() => setPlusMenuOpen(false)}
+        onDismiss={runPendingAction}
+      >
+        <Pressable
+          className="flex-1 bg-black/60 justify-end"
+          onPress={() => setPlusMenuOpen(false)}
+          accessibilityLabel="Dismiss actions menu"
+        >
+          <Pressable className="mx-3 mb-8 rounded-2xl bg-card-dark border border-border-dark overflow-hidden p-2 shadow-2xl">
+            {menuScreen === "main" ? (
+              <>
+                <View className="flex-row items-center justify-between px-3 py-2 border-b border-border-dark mb-1">
+                  <Text className="text-white text-[15px] font-semibold">
+                    Actions & Tools
+                  </Text>
+                  <Pressable
+                    onPress={() => setPlusMenuOpen(false)}
+                    className="p-1 active:opacity-75"
+                    accessibilityRole="button"
+                    accessibilityLabel="Close menu"
+                  >
+                    <IconX color="#a1a1aa" size={18} />
+                  </Pressable>
+                </View>
+
+                <Pressable
+                  className="flex-row items-center gap-3 px-3 py-2.5 rounded-xl active:bg-white/10"
+                  onPress={handlePickPhoto}
+                  accessibilityRole="button"
+                  accessibilityLabel="Choose Photo"
+                >
+                  <View className="w-8 h-8 rounded-lg bg-white/5 items-center justify-center">
+                    <IconPhoto color="#d4d4d8" size={19} strokeWidth={1.8} />
+                  </View>
+                  <View className="flex-1">
+                    <Text className="text-white text-[14px] font-medium">
+                      Choose Photo
+                    </Text>
+                    <Text className="text-zinc-400 text-[12px]">
+                      Select an image from photo library
+                    </Text>
+                  </View>
+                </Pressable>
+
+                <Pressable
+                  className="flex-row items-center gap-3 px-3 py-2.5 rounded-xl active:bg-white/10"
+                  onPress={handleUploadFile}
+                  accessibilityRole="button"
+                  accessibilityLabel="Upload File"
+                >
+                  <View className="w-8 h-8 rounded-lg bg-white/5 items-center justify-center">
+                    <IconUpload color="#d4d4d8" size={19} strokeWidth={1.8} />
+                  </View>
+                  <View className="flex-1">
+                    <Text className="text-white text-[14px] font-medium">
+                      Upload File
+                    </Text>
+                    <Text className="text-zinc-400 text-[12px]">
+                      Images, PDFs, text/code, JSON, CSV
+                    </Text>
+                  </View>
+                </Pressable>
+
+                <Pressable
+                  className="flex-row items-center gap-3 px-3 py-2.5 rounded-xl active:bg-white/10"
+                  onPress={handleTakePhoto}
+                  accessibilityRole="button"
+                  accessibilityLabel="Take Photo"
+                >
+                  <View className="w-8 h-8 rounded-lg bg-white/5 items-center justify-center">
+                    <IconCamera color="#d4d4d8" size={19} strokeWidth={1.8} />
+                  </View>
+                  <View className="flex-1">
+                    <Text className="text-white text-[14px] font-medium">
+                      Take Photo
+                    </Text>
+                    <Text className="text-zinc-400 text-[12px]">
+                      Capture a photo with your camera
+                    </Text>
+                  </View>
+                </Pressable>
+
+                <Pressable
+                  className="flex-row items-center gap-3 px-3 py-2.5 rounded-xl active:bg-white/10"
+                  onPress={() =>
+                    handleSelectActionTag({
+                      id: "schedule-task",
+                      label: "Schedule Task",
+                      icon: "clock",
+                    })
+                  }
+                  accessibilityRole="button"
+                  accessibilityLabel="Schedule Task"
+                >
+                  <View className="w-8 h-8 rounded-lg bg-white/5 items-center justify-center">
+                    <IconClock color="#d4d4d8" size={19} strokeWidth={1.8} />
+                  </View>
+                  <View className="flex-1">
+                    <Text className="text-white text-[14px] font-medium">
+                      Schedule Task
+                    </Text>
+                    <Text className="text-zinc-400 text-[12px]">
+                      Run something on a schedule
+                    </Text>
+                  </View>
+                </Pressable>
+
+                <Pressable
+                  className="flex-row items-center gap-3 px-3 py-2.5 rounded-xl active:bg-white/10"
+                  onPress={() =>
+                    handleSelectActionTag({
+                      id: "create-automation",
+                      label: "Create Automation",
+                      icon: "bolt",
+                    })
+                  }
+                  accessibilityRole="button"
+                  accessibilityLabel="Create Automation"
+                >
+                  <View className="w-8 h-8 rounded-lg bg-white/5 items-center justify-center">
+                    <IconBolt color="#d4d4d8" size={19} strokeWidth={1.8} />
+                  </View>
+                  <View className="flex-1">
+                    <Text className="text-white text-[14px] font-medium">
+                      Create Automation
+                    </Text>
+                    <Text className="text-zinc-400 text-[12px]">
+                      Set up a when-X-do-Y rule
+                    </Text>
+                  </View>
+                </Pressable>
+
+                <Pressable
+                  className="flex-row items-center gap-3 px-3 py-2.5 rounded-xl active:bg-white/10"
+                  onPress={() =>
+                    handleSelectActionTag({
+                      id: "create-extension",
+                      label: "Create Extension",
+                      icon: "tools",
+                    })
+                  }
+                  accessibilityRole="button"
+                  accessibilityLabel="Create Extension"
+                >
+                  <View className="w-8 h-8 rounded-lg bg-white/5 items-center justify-center">
+                    <IconTools color="#d4d4d8" size={19} strokeWidth={1.8} />
+                  </View>
+                  <View className="flex-1">
+                    <Text className="text-white text-[14px] font-medium">
+                      Create Extension
+                    </Text>
+                    <Text className="text-zinc-400 text-[12px]">
+                      Build a mini app extension
+                    </Text>
+                  </View>
+                </Pressable>
+
+                <Pressable
+                  className="flex-row items-center gap-3 px-3 py-2.5 rounded-xl active:bg-white/10"
+                  onPress={handleIntegrations}
+                  accessibilityRole="button"
+                  accessibilityLabel="Integrations"
+                >
+                  <View className="w-8 h-8 rounded-lg bg-white/5 items-center justify-center">
+                    <IconPlugConnected
+                      color="#d4d4d8"
+                      size={19}
+                      strokeWidth={1.8}
+                    />
+                  </View>
+                  <View className="flex-1">
+                    <Text className="text-white text-[14px] font-medium">
+                      Integrations
+                    </Text>
+                    <Text className="text-zinc-400 text-[12px]">
+                      Connect MCP tools to the agent
+                    </Text>
+                  </View>
+                </Pressable>
+
+                <Pressable
+                  className="flex-row items-center gap-3 px-3 py-2.5 rounded-xl active:bg-white/10"
+                  onPress={() => setMenuScreen("skill")}
+                  accessibilityRole="button"
+                  accessibilityLabel="Create Skill"
+                >
+                  <View className="w-8 h-8 rounded-lg bg-white/5 items-center justify-center">
+                    <IconBulb color="#d4d4d8" size={19} strokeWidth={1.8} />
+                  </View>
+                  <View className="flex-1">
+                    <Text className="text-white text-[14px] font-medium">
+                      Create Skill
+                    </Text>
+                    <Text className="text-zinc-400 text-[12px]">
+                      Teach the agent a new ability
+                    </Text>
+                  </View>
+                  <IconChevronRight color="#71717a" size={18} />
+                </Pressable>
+              </>
+            ) : (
+              <>
+                <View className="flex-row items-center justify-between px-2 py-2 border-b border-border-dark mb-1">
+                  <Pressable
+                    onPress={() => setMenuScreen("main")}
+                    className="flex-row items-center gap-1 p-1 active:opacity-75"
+                    accessibilityRole="button"
+                    accessibilityLabel="Back to main menu"
+                  >
+                    <IconChevronLeft color="#a1a1aa" size={18} />
+                    <Text className="text-white text-[15px] font-semibold">
+                      Create Skill
+                    </Text>
+                  </Pressable>
+                  <Pressable
+                    onPress={() => setPlusMenuOpen(false)}
+                    className="p-1 active:opacity-75"
+                    accessibilityRole="button"
+                    accessibilityLabel="Close menu"
+                  >
+                    <IconX color="#a1a1aa" size={18} />
+                  </Pressable>
+                </View>
+
+                <Pressable
+                  className="flex-row items-center gap-3 px-3 py-3 rounded-xl active:bg-white/10"
+                  onPress={() =>
+                    handleSelectActionTag({
+                      id: "create-skill",
+                      label: "Create Skill",
+                      icon: "bulb",
+                    })
+                  }
+                  accessibilityRole="button"
+                  accessibilityLabel="Create new skill"
+                >
+                  <View className="w-8 h-8 rounded-lg bg-white/5 items-center justify-center">
+                    <IconBulb color="#d4d4d8" size={19} strokeWidth={1.8} />
+                  </View>
+                  <View className="flex-1">
+                    <Text className="text-white text-[14px] font-medium">
+                      Create new skill
+                    </Text>
+                    <Text className="text-zinc-400 text-[12px]">
+                      Describe a skill and let the agent draft it
+                    </Text>
+                  </View>
+                </Pressable>
+
+                <Pressable
+                  className="flex-row items-center gap-3 px-3 py-3 rounded-xl active:bg-white/10"
+                  onPress={handleUploadSkillFile}
+                  accessibilityRole="button"
+                  accessibilityLabel="Upload skill file"
+                >
+                  <View className="w-8 h-8 rounded-lg bg-white/5 items-center justify-center">
+                    <IconUpload color="#d4d4d8" size={19} strokeWidth={1.8} />
+                  </View>
+                  <View className="flex-1">
+                    <Text className="text-white text-[14px] font-medium">
+                      Upload skill file
+                    </Text>
+                    <Text className="text-zinc-400 text-[12px]">
+                      Import an existing SKILL.md file
+                    </Text>
+                  </View>
+                </Pressable>
+              </>
+            )}
+          </Pressable>
+        </Pressable>
+      </Modal>
     </View>
   );
 }
diff --git a/packages/mobile-app/package.json b/packages/mobile-app/package.json
index b1a08b9791..bd4ca37b99 100644
--- a/packages/mobile-app/package.json
+++ b/packages/mobile-app/package.json
@@ -36,6 +36,7 @@
     "expo-clipboard": "~57.0.1",
     "expo-constants": "~57.0.5",
     "expo-dev-client": "~57.0.6",
+    "expo-document-picker": "~57.0.1",
     "expo-file-system": "~57.0.1",
     "expo-font": "~57.0.1",
     "expo-haptics": "~57.0.1",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index b4e6adacbe..ad1bdd727b 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -1652,6 +1652,9 @@ importers:
       expo-dev-client:
         specifier: ~57.0.6
         version: 57.0.6(expo@57.0.6)(react-native@0.86.0(@babel/core@7.29.7)(@react-native/metro-config@0.86.0(@babel/core@7.29.7))(@types/react@19.2.17)(react@19.2.7))
+      expo-document-picker:
+        specifier: ~57.0.1
+        version: 57.0.1(expo@57.0.6)
       expo-file-system:
         specifier: ~57.0.1
         version: 57.0.1(expo@57.0.6)(react-native@0.86.0(@babel/core@7.29.7)(@react-native/metro-config@0.86.0(@babel/core@7.29.7))(@types/react@19.2.17)(react@19.2.7))
@@ -15856,6 +15859,11 @@ packages:
       expo: '*'
       react-native: '*'
 
+  expo-document-picker@57.0.1:
+    resolution: {integrity: sha512-qBwM5oxDZ3I9kwFD3pUE1oK/WNv9artoEKO6UpqhQgNRr0XA1ALRVWYjkF4+ge9lUNDRehjTm/jenINkzqg84g==}
+    peerDependencies:
+      expo: '*'
+
   expo-file-system@57.0.1:
     resolution: {integrity: sha512-w7/ERvQFrGP2apTO9lDtZ+O6JQIhfakL7+Xqzh+rfMO9B4LB4qwrz+YvLgir8KFRVX64JHBnRuYBVLY1oQZcqw==}
     peerDependencies:
@@ -31838,6 +31846,10 @@ snapshots:
       expo-dev-menu-interface: 57.0.0(expo@57.0.6)
       react-native: 0.86.0(@babel/core@7.29.7)(@react-native/metro-config@0.86.0(@babel/core@7.29.7))(@types/react@19.2.17)(react@19.2.7)
 
+  expo-document-picker@57.0.1(expo@57.0.6):
+    dependencies:
+      expo: 57.0.6(@babel/core@7.29.7)(@expo/dom-webview@57.0.1)(@expo/metro-runtime@57.0.5)(@typescript/typescript6@6.0.2)(expo-router@57.0.6)(react-dom@19.2.7(react@19.2.7))(react-native-webview@13.16.1(react-native@0.86.0(@babel/core@7.29.7)(@react-native/metro-config@0.86.0(@babel/core@7.29.7))(@types/react@19.2.17)(react@19.2.7))(react@19.2.7))(react-native-worklets@0.11.1(@babel/core@7.29.7)(@react-native/metro-config@0.86.0(@babel/core@7.29.7))(react-native@0.86.0(@babel/core@7.29.7)(@react-native/metro-config@0.86.0(@babel/core@7.29.7))(@types/react@19.2.17)(react@19.2.7))(react@19.2.7))(react-native@0.86.0(@babel/core@7.29.7)(@react-native/metro-config@0.86.0(@babel/core@7.29.7))(@types/react@19.2.17)(react@19.2.7))(react@19.2.7)
+
   expo-file-system@57.0.1(expo@57.0.6)(react-native@0.86.0(@babel/core@7.29.7)(@react-native/metro-config@0.86.0(@babel/core@7.29.7))(@types/react@19.2.17)(react@19.2.7)):
     dependencies:
       expo: 57.0.6(@babel/core@7.29.7)(@expo/dom-webview@57.0.1)(@expo/metro-runtime@57.0.5)(@typescript/typescript6@6.0.2)(expo-router@57.0.6)(react-dom@19.2.7(react@19.2.7))(react-native-webview@13.16.1(react-native@0.86.0(@babel/core@7.29.7)(@react-native/metro-config@0.86.0(@babel/core@7.29.7))(@types/react@19.2.17)(react@19.2.7))(react@19.2.7))(react-native-worklets@0.11.1(@babel/core@7.29.7)(@react-native/metro-config@0.86.0(@babel/core@7.29.7))(react-native@0.86.0(@babel/core@7.29.7)(@react-native/metro-config@0.86.0(@babel/core@7.29.7))(@types/react@19.2.17)(react@19.2.7))(react@19.2.7))(react-native@0.86.0(@babel/core@7.29.7)(@react-native/metro-config@0.86.0(@babel/core@7.29.7))(@types/react@19.2.17)(react@19.2.7))(react@19.2.7)