fix: support photo client tool in debug preview

frontend/src/components/assistant-editor/debug-preview.tsx

@@ -5,6 +5,7 @@ import { useCallback, useEffect, useLayoutEffect, useRef, useState } from "react
 import {
   AudioLines,
   Braces,
+  Camera,
   Check,
   Copy,
   ImageIcon,
@@ -13,7 +14,6 @@ import {
   Mic,
   Orbit,
   PhoneOff,
-  ScanLine,
   Send,
   Smartphone,
   Sparkles,
@@ -1674,7 +1674,10 @@ function DebugPhotoCaptureButton({
   onCapture: () => Promise<void>;
 }) {
   return (
-    <div className="absolute bottom-4 left-1/2 z-20 flex -translate-x-1/2 flex-col items-center gap-2">
+    <div className="absolute bottom-4 left-1/2 z-20 flex -translate-x-1/2 animate-in flex-col items-center gap-2 fade-in-0 slide-in-from-bottom-2 duration-200">
+      <span className="sr-only" role="status" aria-live="polite">
+        拍照按钮已开启
+      </span>
       {error && (
         <div className="max-w-xs rounded-full border border-destructive/20 bg-background/90 px-3 py-1 text-xs text-destructive shadow-sm backdrop-blur">
           {error}
@@ -1682,18 +1685,19 @@ function DebugPhotoCaptureButton({
       )}
       <Button
         type="button"
-        size="icon"
+        size="sm"
         onClick={() => void onCapture()}
         disabled={capturing || !enabled}
         aria-label={capturing ? "正在提交照片" : "拍照并发送"}
         title={capturing ? "正在提交照片" : "拍照并发送"}
-        className="size-12 rounded-full shadow-lg"
+        className="h-10 shrink-0 gap-2 rounded-full px-5 shadow-lg ring-1 ring-black/10"
       >
         {capturing ? (
           <Loader2 className="size-5 animate-spin" />
         ) : (
-          <ScanLine className="size-5" />
+          <Camera className="size-5" />
         )}
+        <span>{capturing ? "正在拍照" : "拍照"}</span>
       </Button>
     </div>
   );