Music: AI 작사(Lyrics) 전용 탭 추가

- Create ↔ Library 사이에 Lyrics 탭 신설
- 프롬프트 입력 (200자) → Suno AI 가사 생성
- 결과 카드: 제목, 가사 텍스트, 프롬프트 표시
- 클립보드 복사 / "Create에서 사용" 버튼 (가사 자동 세팅 후 Create 탭 전환)
- 로딩 shimmer, 에러 배너, 빈 상태 UI

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

src/pages/music/MusicStudio.jsx

@@ -607,6 +607,133 @@ const Library = ({ tracks, onDelete, onRefresh, onExtend, onVocalRemoval, isGene
     );
 };
 
+/* ─────────────────────────────────────────────
+   Lyrics Tab
+───────────────────────────────────────────── */
+const LyricsTab = ({ onUseInCreate }) => {
+    const [lyrPrompt, setLyrPrompt]     = useState('');
+    const [lyrLoading, setLyrLoading]   = useState(false);
+    const [lyrResults, setLyrResults]   = useState([]);   // [{text, title}]
+    const [lyrError, setLyrError]       = useState(null);
+    const [copied, setCopied]           = useState(null);  // index
+
+    const handleGenerate = async () => {
+        if (!lyrPrompt.trim() || lyrLoading) return;
+        setLyrLoading(true);
+        setLyrError(null);
+        try {
+            const res = await generateMusicLyrics(lyrPrompt.trim());
+            if (res?.text) {
+                setLyrResults((prev) => [{ text: res.text, title: res.title || '', prompt: lyrPrompt.trim() }, ...prev]);
+            } else {
+                setLyrError('가사 생성 결과가 없습니다');
+            }
+        } catch (e) {
+            setLyrError(e.message || '가사 생성에 실패했습니다');
+        } finally {
+            setLyrLoading(false);
+        }
+    };
+
+    const handleCopy = (text, idx) => {
+        navigator.clipboard.writeText(text).then(() => {
+            setCopied(idx);
+            setTimeout(() => setCopied(null), 2000);
+        });
+    };
+
+    return (
+        <div className="ms-lyrics-tab">
+            <div className="ms-lyrics-tab__form">
+                <div className="ms-lyrics-tab__head">
+                    <h2 className="ms-lyrics-tab__title">AI Lyrics Generator</h2>
+                    <p className="ms-lyrics-tab__desc">
+                        원하는 분위기, 주제, 스타일을 설명하면 AI가 가사를 작성합니다.
+                    </p>
+                </div>
+
+                <div className="ms-lyrics-tab__input-wrap">
+                    <textarea
+                        className="ms-lyrics-tab__input"
+                        placeholder="예: 비 오는 밤, 혼자 걷는 도시의 거리를 배경으로 한 감성적인 발라드 가사"
+                        value={lyrPrompt}
+                        onChange={(e) => setLyrPrompt(e.target.value)}
+                        rows={3}
+                        maxLength={200}
+                        onKeyDown={(e) => { if (e.key === 'Enter' && !e.shiftKey) { e.preventDefault(); handleGenerate(); } }}
+                    />
+                    <div className="ms-lyrics-tab__input-footer">
+                        <span className="ms-lyrics-tab__count">{lyrPrompt.length}/200</span>
+                        <button
+                            type="button"
+                            className={`ms-btn ms-btn--accent ${lyrLoading ? 'is-loading' : ''}`}
+                            onClick={handleGenerate}
+                            disabled={!lyrPrompt.trim() || lyrLoading}
+                        >
+                            {lyrLoading ? (
+                                <><span className="ms-btn__spinner" /> 생성 중...</>
+                            ) : (
+                                '✨ 가사 생성'
+                            )}
+                        </button>
+                    </div>
+                </div>
+
+                {lyrError && (
+                    <div className="ms-error-banner">
+                        <span>⚠ {lyrError}</span>
+                    </div>
+                )}
+            </div>
+
+            {lyrResults.length === 0 && !lyrLoading && (
+                <div className="ms-lyrics-tab__empty">
+                    <span className="ms-lyrics-tab__empty-icon">🎤</span>
+                    <p>프롬프트를 입력하고 가사를 생성해보세요</p>
+                    <p className="ms-lyrics-tab__empty-hint">
+                        생성된 가사는 [Verse], [Chorus] 등 섹션 태그가 포함됩니다
+                    </p>
+                </div>
+            )}
+
+            {lyrLoading && (
+                <div className="ms-lyrics-tab__loading">
+                    <div className="ms-lyrics-tab__loading-bar" />
+                    <p>AI가 가사를 작성하고 있습니다...</p>
+                </div>
+            )}
+
+            <div className="ms-lyrics-tab__results">
+                {lyrResults.map((item, idx) => (
+                    <div key={idx} className="ms-lyrics-card">
+                        <div className="ms-lyrics-card__header">
+                            {item.title && <h3 className="ms-lyrics-card__title">{item.title}</h3>}
+                            <span className="ms-lyrics-card__prompt">{item.prompt}</span>
+                        </div>
+                        <pre className="ms-lyrics-card__text">{item.text}</pre>
+                        <div className="ms-lyrics-card__actions">
+                            <button
+                                type="button"
+                                className="ms-btn ms-btn--ghost ms-btn--sm"
+                                onClick={() => handleCopy(item.text, idx)}
+                            >
+                                {copied === idx ? '✓ 복사됨' : '📋 복사'}
+                            </button>
+                            <button
+                                type="button"
+                                className="ms-btn ms-btn--ghost ms-btn--sm"
+                                onClick={() => onUseInCreate(item.text)}
+                            >
+                                🎵 Create에서 사용
+                            </button>
+                        </div>
+                    </div>
+                ))}
+            </div>
+        </div>
+    );
+};
+
 /* ─────────────────────────────────────────────
    Main Page
 ───────────────────────────────────────────── */
@@ -970,6 +1097,13 @@ export default function MusicStudio() {
                 >
                     <span className="ms-tab__icon">⚗</span> Create
                 </button>
+                <button
+                    type="button"
+                    className={`ms-tab ${tab === 'lyrics' ? 'is-active' : ''}`}
+                    onClick={() => setTab('lyrics')}
+                >
+                    <span className="ms-tab__icon">🎤</span> Lyrics
+                </button>
                 <button
                     type="button"
                     className={`ms-tab ${tab === 'library' ? 'is-active' : ''}`}
@@ -995,6 +1129,11 @@ export default function MusicStudio() {
                 />
             )}
 
+            {/* ═══ LYRICS TAB ═══ */}
+            {tab === 'lyrics' && (
+                <LyricsTab onUseInCreate={(text) => { setLyrics(text); setInstrumental(false); setProvider('suno'); setTab('create'); }} />
+            )}
+
             {/* ═══ CREATE TAB ═══ */}
             {tab === 'create' && (
                 <div className="ms-layout">