Enhance contribution guidelines and improve FloatingGenerateBox component

- Updated CONTRIBUTING.md to include instructions for building with a local Qwen3-TTS development version, facilitating easier testing and development.
- Refactored FloatingGenerateBox component to streamline the rendering of text and instruct fields, improving code readability and maintainability.
- Added functionality to handle auto-resizing of text areas based on content changes, enhancing user experience.
- Improved event handling for keyboard interactions in StoryTrackEditor, allowing for play/pause functionality with the spacebar.
- Introduced a MiniSamplePlayer component in SampleList for better audio playback control, including play, pause, and seek features.
- Implemented sample update functionality in the backend, allowing users to edit reference text for audio samples, with appropriate error handling and user feedback.

app/src/components/StoriesTab/StoryTrackEditor.tsx

@@ -539,7 +539,10 @@ export function StoryTrackEditor({ storyId, items }: StoryTrackEditorProps) {
         return;
       }
 
-      if (e.key === 'Escape') {
+      if (e.key === ' ') {
+        e.preventDefault();
+        handlePlayPause();
+      } else if (e.key === 'Escape') {
         setSelectedClipId(null);
       } else if (e.key === 's' || e.key === 'S') {
         if (selectedClipId) {
@@ -561,7 +564,7 @@ export function StoryTrackEditor({ storyId, items }: StoryTrackEditorProps) {
 
     window.addEventListener('keydown', handleKeyDown);
     return () => window.removeEventListener('keydown', handleKeyDown);
-  }, [selectedClipId, handleSplit, handleDuplicate, handleDelete, setSelectedClipId]);
+  }, [selectedClipId, handleSplit, handleDuplicate, handleDelete, setSelectedClipId, handlePlayPause]);
 
   // Add global mouse listeners for trimming
   useEffect(() => {
@@ -701,7 +704,13 @@ export function StoryTrackEditor({ storyId, items }: StoryTrackEditorProps) {
         <div className="flex items-center justify-between px-3 py-2 border-b bg-muted/30 mt-2">
           {/* Play controls - left side */}
           <div className="flex items-center gap-2">
-            <Button variant="ghost" size="icon" className="h-7 w-7" onClick={handlePlayPause}>
+            <Button
+              variant="ghost"
+              size="icon"
+              className="h-7 w-7"
+              onClick={handlePlayPause}
+              title="Play/Pause (Space)"
+            >
               {isCurrentlyPlaying ? <Pause className="h-4 w-4" /> : <Play className="h-4 w-4" />}
             </Button>
             <Button