Refactor spacing and layout in forms for improved UI consistency

qwen3-tts-frontend/src/components/PresetSelector.tsx

@@ -1,5 +1,6 @@
 import { memo, useMemo } from 'react'
 import { Button } from '@/components/ui/button'
+import { Shuffle } from 'lucide-react'
 
 interface Preset {
   label: string
@@ -20,16 +21,33 @@ const PresetSelectorInner = <T extends Preset>({ presets, onSelect }: PresetSele
         variant="outline"
         size="sm"
         onClick={() => onSelect(preset)}
-        className="text-xs md:text-sm px-2.5 md:px-3 h-7 md:h-8"
+        className="text-xs md:text-sm px-2 h-6 md:h-7"
       >
         {preset.label}
       </Button>
     ))
   }, [presets, onSelect])
 
+  const handleRandomSelect = () => {
+    const randomIndex = Math.floor(Math.random() * presets.length)
+    onSelect(presets[randomIndex])
+  }
+
   return (
-    <div className="flex flex-wrap gap-1.5 md:gap-2 mt-1.5 md:mt-2">
-      {presetButtons}
+    <div className="flex items-center gap-2 mt-1">
+      <div className="flex flex-wrap gap-1 flex-1">
+        {presetButtons}
+      </div>
+      <Button
+        type="button"
+        variant="ghost"
+        size="sm"
+        onClick={handleRandomSelect}
+        className="h-6 md:h-7 px-2 flex-shrink-0"
+        title="随机选择"
+      >
+        <Shuffle className="h-3.5 w-3.5" />
+      </Button>
     </div>
   )
 }