feat(music): 모바일 반응형 — FAB + 풀다운 리프레시 + 1컬럼 라이브러리

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

src/pages/music/MusicStudio.css

@@ -1696,6 +1696,18 @@
 /* ═══════════════════════════════════════════════════
    MOBILE
 ═══════════════════════════════════════════════════ */
+@media (max-width: 768px) {
+    .ms-tabs {
+        overflow-x: auto;
+        -webkit-overflow-scrolling: touch;
+    }
+
+    .ms-tabs > * {
+        flex-shrink: 0;
+        white-space: nowrap;
+    }
+}
+
 @media (max-width: 480px) {
     .ms-header__title {
         font-size: clamp(44px, 14vw, 70px);

src/pages/music/MusicStudio.jsx

@@ -16,6 +16,9 @@ import {
     generateStyleBoost,
     generateVideo,
 } from '../../api';
+import { useIsMobile } from '../../hooks/useIsMobile';
+import PullToRefresh from '../../components/PullToRefresh';
+import FAB from '../../components/FAB';
 import './MusicStudio.css';
 import AudioPlayer from './components/AudioPlayer';
 import { fmtTime } from './components/AudioPlayer';
@@ -512,6 +515,7 @@ const Library = ({ tracks, onDelete, onRefresh, onExtend, onVocalRemoval, onCove
 ───────────────────────────────────────────── */
 export default function MusicStudio() {
     /* ── 탭 ── */
+    const isMobile = useIsMobile();
     const [tab, setTab] = useState('create');
 
     /* ── Provider 상태 ── */
@@ -1123,6 +1127,7 @@ export default function MusicStudio() {
 
             {/* ═══ LIBRARY TAB ═══ */}
             {tab === 'library' && (
+                <PullToRefresh onRefresh={loadLibrary}>
                 <Library
                     tracks={library}
                     loading={libLoading}
@@ -1137,6 +1142,7 @@ export default function MusicStudio() {
                     onVideoGenerate={handleVideoGenerate}
                     isGenerating={isGenerating}
                 />
+                </PullToRefresh>
             )}
 
             {/* ═══ LYRICS TAB ═══ */}
@@ -1760,6 +1766,10 @@ export default function MusicStudio() {
                     accentColor={accentColor}
                 />
             )}
+
+            {tab === 'library' && (
+                <FAB onClick={() => setTab('create')} label="음악 생성" />
+            )}
         </div>
     );
 }