fix: MaestroButton layout shift - stable min-width and persistent border

- Added min-w-[140px] to prevent width change between states
- Border now always present (same color in both states), preventing 1px jump
- Text wrapped in truncate spans for overflow safety
- Spinning ♩ note preserved in loading state

frontend/src/components/MaestroButton.tsx

@@ -75,10 +75,10 @@ export default function MaestroButton({
       type="button"
       onClick={handleMaestro}
       disabled={isMaestroing}
-      className={`${className} flex items-center justify-center gap-1.5 px-3 py-1.5 text-xs font-medium rounded-md transition-all duration-200 ${
+      className={`${className} flex items-center justify-center gap-1.5 px-3 py-1.5 text-xs font-medium rounded-md min-w-[140px] border transition-colors duration-200 ${
         isMaestroing
-          ? 'bg-kithara-accent/20 text-kithara-accent animate-pulse'
-          : 'bg-kithara-accent/10 text-kithara-accent hover:bg-kithara-accent/25 border border-kithara-accent/30 hover:border-kithara-accent/50'
+          ? 'bg-kithara-accent/20 border-kithara-accent/30 text-kithara-accent animate-pulse'
+          : 'bg-kithara-accent/10 border-kithara-accent/30 hover:bg-kithara-accent/25 hover:border-kithara-accent/50 text-kithara-accent'
       }`}
       title={mode === 'generate'
         ? "Let Maestro write a creative prompt for you"
@@ -88,10 +88,12 @@ export default function MaestroButton({
         {isMaestroing ? (
           <>
             <span className="inline-block animate-spin">♩</span>
+            <span className="truncate">
               {mode === 'generate' ? 'Dreaming...' : 'Composing...'}
+            </span>
           </>
         ) : (
-        label
+          <span className="truncate">{label}</span>
         )}
     </button>
   )