:root,[data-theme=light]{--bg:#f7f8fb;--surface:#fff;--surface-2:#f1f3f8;--border:#e6e9f0;--border-strong:#d5dae4;--text:#1a2236;--text-2:#4a5578;--text-3:#6c7592;--text-muted:#8a92a8;--accent:#14b8a6;--accent-soft:#ccfbf1;--accent-text:#0f766e;--accent-fill:#0d9488;--accent-2:#3b82f6;--gradient-brand:linear-gradient(135deg, var(--accent), var(--accent-2));--success:#10b981;--success-soft:#d1fae5;--success-text:#065f46;--warning:#f59e0b;--warning-soft:#fef3c7;--warning-text:#92540c;--danger:#ef4444;--danger-soft:#fee2e2;--danger-text:#b91c1c;--danger-fill:#dc2626;--shadow-sm:0 1px 2px #1a22360a;--shadow-md:0 2px 8px #1a22360f, 0 1px 2px #1a22360a;--shadow-lg:0 10px 30px #1a223614, 0 4px 8px #1a22360a;--overlay-bg:#0f172a6b;--radius-sm:6px;--radius:10px;--radius-lg:14px;--radius-xl:20px;--ease:cubic-bezier(.4, .2, .2, 1);--t-fast:.12s ease;--t-base:.22s var(--ease);--bg-primary:var(--bg);--bg-secondary:var(--surface);--bg-card:var(--surface);--bg-card-hover:var(--surface-2);--bg-input:var(--surface);--bg-overlay:var(--overlay-bg);--bg-sidebar:var(--surface);--border-color:var(--border);--border-active:var(--accent);--text-primary:var(--text);--text-secondary:var(--text-2);--primary:var(--accent-fill);--accent-hover:var(--accent-fill);--accent-glow:var(--accent-soft);--accent-subtle:var(--accent-soft);--error:var(--danger);--shadow-glow:var(--shadow-md);--gradient-primary:var(--accent-fill);--gradient-suno:var(--accent-fill);--gradient-bg:var(--bg);--radius-md:var(--radius);--bg-hover:var(--surface-2);--bg-tertiary:var(--surface-2);--topbar-h:64px}[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#0f1114;--surface:#1c2026;--surface-2:#2c313a;--border:#3a404a;--border-strong:#4a515d;--text:#f1f3f6;--text-2:#c2c7d1;--text-3:#959ba8;--text-muted:#8a909e;--accent-fill:#0f766e;--accent-soft:#16211f;--accent-text:#79c4b8;--accent-2:#2563eb;--gradient-brand:linear-gradient(135deg, #0d9488, #1d4ed8);--success:#059669;--success-soft:#0d3528;--success-text:#6ee7b7;--warning:#d97706;--warning-soft:#3a2b10;--warning-text:#fcd34d;--danger:#dc2626;--danger-soft:#421a1f;--danger-text:#fca5a5;--danger-fill:#b91c1c;--shadow-sm:0 1px 2px #0000004d;--shadow-md:0 2px 8px #00000059, 0 1px 2px #0000004d;--shadow-lg:0 10px 30px #00000073, 0 4px 8px #0000004d;--overlay-bg:#020408a6}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;overflow-x:hidden}html{touch-action:pan-y;-ms-touch-action:pan-y;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px}body{background:var(--bg);color:var(--text);font-variant-numeric:tabular-nums;transition:background var(--t-base), color var(--t-base);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:14px;line-height:1.55}svg.lucide{vertical-align:middle;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;fill:none;flex-shrink:0;display:inline-block}@keyframes fadeInUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.app-layout{flex-direction:column;height:100vh;display:flex;overflow:hidden}.app-header{background:var(--surface);border-bottom:1px solid var(--border);z-index:100;flex-shrink:0}[data-theme=dark] .app-header{background:var(--bg)}.header-content{min-height:var(--topbar-h,64px);justify-content:space-between;align-items:center;padding:8px 24px;display:flex}.header-left{align-items:center;gap:8px;display:flex}.header-right{align-items:center;gap:6px;display:flex}.app-title{letter-spacing:-.02em;align-items:center;gap:8px;font-size:16px;font-weight:600;display:flex}.title-icon{color:var(--accent)}.admin-link,.back-link{color:var(--text-secondary);border-radius:var(--radius);align-items:center;gap:5px;padding:6px 10px;font-size:.82rem;font-weight:500;text-decoration:none;transition:all .2s;display:flex}.admin-link:hover,.back-link:hover{color:var(--accent-text);background:var(--accent-soft)}.theme-toggle{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);width:34px;height:34px;color:var(--text-2);cursor:pointer;transition:background var(--t-fast), border-color var(--t-fast), color var(--t-fast);justify-content:center;align-items:center;display:flex}.theme-toggle:hover{color:var(--text);background:var(--surface-2);border-color:var(--border-strong)}.studio-layout{flex:1;min-height:0;display:flex;overflow:hidden}.sidebar{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);width:320px;box-shadow:var(--shadow-sm);flex-direction:column;flex-shrink:0;gap:18px;margin:20px 0 20px 20px;padding:20px;display:flex;overflow-y:auto}.sidebar-section{flex-direction:column;gap:8px;display:flex}.sidebar-label{color:var(--text-3);text-transform:uppercase;letter-spacing:.08em;align-items:center;gap:8px;font-size:11px;font-weight:700;display:flex}.sidebar-label .accent-icon{color:var(--accent)}.sidebar-title{color:var(--text-3);text-transform:uppercase;letter-spacing:.08em;align-items:center;gap:8px;font-size:11px;font-weight:700;display:flex}.sidebar-title svg{color:var(--accent)}.topic-input{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);width:100%;color:var(--text);resize:vertical;transition:border-color var(--t-fast), box-shadow var(--t-fast);outline:none;padding:9px 12px;font-family:inherit;font-size:13.5px;line-height:1.5}.topic-input::placeholder{color:var(--text-muted)}.topic-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.structure-radios{flex-direction:column;gap:2px;display:flex}.structure-radio{border-radius:var(--radius);cursor:pointer;color:var(--text-primary);background:0 0;border:1px solid #0000;align-items:center;gap:8px;padding:7px 10px;font-family:inherit;font-size:.82rem;transition:all .15s;display:flex}.structure-radio:hover{background:var(--surface-2)}.structure-radio.selected{background:var(--accent-soft);color:var(--accent-text);border-color:#0000}.structure-radio input[type=radio]{display:none}.radio-label{font-size:.82rem;font-weight:500}.radio-meta{color:var(--text-muted);margin-left:auto;font-size:.7rem}.structure-preview{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius);flex-wrap:wrap;gap:4px;padding:8px;animation:.2s fadeIn;display:flex}.part-tag{background:var(--accent-soft);color:var(--accent-text);white-space:nowrap;border:1px solid #0000;border-radius:999px;padding:2px 8px;font-size:11px}.genre-picker{position:relative}.genre-trigger{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);width:100%;min-height:38px;color:var(--text);cursor:pointer;transition:background var(--t-fast), border-color var(--t-fast);align-items:center;gap:8px;padding:8px 12px;font-family:inherit;font-size:13.5px;display:flex}.genre-trigger:hover{border-color:var(--border-strong);background:var(--surface-2)}.genre-trigger-text{text-align:left;text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.genre-chevron{color:var(--text-muted);transition:transform .2s}.genre-chevron.open{transform:rotate(90deg)}.genre-clear{color:var(--text-muted);border-radius:50%;align-items:center;padding:2px;transition:all .12s;display:flex}.genre-clear:hover{background:var(--danger-soft);color:var(--danger-text)}.genre-dropdown-overlay{display:none}.genre-dropdown{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-lg);z-index:100;flex-direction:column;max-height:320px;animation:.12s fadeIn;display:flex;position:absolute;top:calc(100% + 4px);left:0;right:0}.genre-search{border-bottom:1px solid var(--border);flex-shrink:0;align-items:center;gap:8px;padding:8px 10px;display:flex}.genre-search svg{color:var(--text-muted);flex-shrink:0}.genre-search input{color:var(--text-primary);background:0 0;border:none;outline:none;flex:1;font-family:inherit;font-size:.8rem}.genre-search input::placeholder{color:var(--text-muted)}.genre-list{flex:1;padding:4px;overflow-y:auto}.genre-empty{text-align:center;color:var(--text-muted);padding:20px;font-size:.8rem}.genre-category-header{border-radius:var(--radius);width:100%;color:var(--text-primary);cursor:pointer;background:0 0;border:none;align-items:center;gap:6px;padding:6px 8px;font-family:inherit;font-size:.8rem;font-weight:600;transition:background .12s;display:flex}.genre-category-header:hover{background:var(--bg-hover)}.genre-category-emoji{flex-shrink:0;font-size:.9rem}.genre-category-name{text-align:left;flex:1}.genre-category-count{color:var(--text-3);background:var(--surface-2);border-radius:999px;padding:1px 6px;font-size:.65rem;font-weight:400}.genre-expand{color:var(--text-muted);transition:transform .15s}.genre-expand.open{transform:rotate(90deg)}.genre-sublist{padding:0 0 4px 24px;animation:.12s fadeIn}.genre-sub-item{border-radius:var(--radius);width:100%;color:var(--text-secondary);text-align:left;cursor:pointer;background:0 0;border:none;padding:5px 10px;font-family:inherit;font-size:.78rem;transition:all .1s;display:block}.genre-sub-item:hover{background:var(--bg-hover);color:var(--text-primary)}.genre-sub-item.selected{background:var(--accent-soft);color:var(--accent-text);font-weight:500}.structure-name{color:var(--text-primary);font-weight:500;display:block}.structure-desc{color:var(--text-muted);margin-top:1px;font-size:.7rem;display:block}.structure-parts{color:var(--text-muted);opacity:.7;margin-top:2px;font-size:.65rem;line-height:1.3;display:block}.genre-sub-item.selected .structure-name{color:var(--accent-text)}.genre-sub-item:hover .structure-name{color:var(--text-primary)}.optional-badge{color:var(--text-muted);text-transform:none;letter-spacing:0;margin-left:4px;font-size:.6rem;font-weight:400}.btn{border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:var(--radius);cursor:pointer;transition:background var(--t-fast), border-color var(--t-fast), color var(--t-fast), transform var(--t-fast);white-space:nowrap;justify-content:center;align-items:center;gap:8px;padding:9px 16px;font-family:inherit;font-size:13.5px;font-weight:500;display:inline-flex}.btn:hover:not(:disabled){background:var(--surface-2);border-color:var(--border-strong)}.btn:active:not(:disabled){transform:translateY(1px)}.btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-full{width:100%}.btn-generate{background:var(--accent-fill);color:#fff;border-radius:var(--radius);box-shadow:var(--shadow-sm);border-color:#0000;padding:11px 20px;font-size:14.5px;font-weight:500}.btn-generate:hover:not(:disabled){background:var(--accent-fill);filter:brightness(1.1);border-color:#0000}.btn-generate:active:not(:disabled){transform:translateY(1px)}.btn-generate:disabled{background:var(--text-muted);box-shadow:none;opacity:1}.btn-stop{background:var(--danger-soft);color:var(--danger-text);border:1px solid var(--danger);border-radius:var(--radius);padding:11px 20px}.btn-stop:hover:not(:disabled){background:var(--danger-soft);border-color:var(--danger);filter:brightness(.97)}.btn-primary{background:var(--accent-fill);color:#fff;box-shadow:var(--shadow-sm);border-color:#0000}.btn-primary:hover:not(:disabled){background:var(--accent-fill);filter:brightness(1.1);border-color:#0000}.btn-suno{background:var(--accent-fill);color:#fff;border-radius:var(--radius);box-shadow:var(--shadow-sm);border-color:#0000;padding:11px 20px;font-size:14.5px}.btn-suno:hover:not(:disabled){background:var(--accent-fill);filter:brightness(1.1);border-color:#0000}.btn-outline{background:var(--surface);color:var(--text-2);border:1px solid var(--border)}.btn-outline:hover:not(:disabled){border-color:var(--border-strong);color:var(--text);background:var(--surface-2)}.btn-sm{border-radius:var(--radius-sm);gap:6px;padding:6px 11px;font-size:12.5px}.model-row{align-items:center;gap:8px;display:inline-flex}.model-selector{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius);gap:2px;padding:3px;display:flex}.model-btn{border-radius:var(--radius-sm);color:var(--text-3);white-space:nowrap;cursor:pointer;transition:background var(--t-fast), color var(--t-fast);background:0 0;border:none;flex:1;padding:6px 8px;font-family:inherit;font-size:12.5px;font-weight:500}.model-btn:hover{color:var(--text)}.model-btn.selected{background:var(--surface);color:var(--accent-text);box-shadow:var(--shadow-sm);font-weight:600}.reasoning-toggle{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);width:36px;height:36px;color:var(--text-muted);cursor:pointer;flex-shrink:0;justify-content:center;align-items:center;transition:all .2s;display:flex}.reasoning-toggle:hover{color:var(--text-primary);border-color:var(--accent)}.reasoning-toggle.active{background:var(--accent-soft);border-color:var(--accent);color:var(--accent-text)}.main-area{scrollbar-gutter:stable;flex-direction:column;flex:1;gap:20px;min-width:0;margin-right:6px;padding:20px 6px 20px 20px;display:flex;overflow-y:auto}.empty-state{color:var(--text-muted);text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:16px;font-size:.9rem;animation:.5s fadeIn;display:flex}.empty-state svg{opacity:.3}.empty-state p{max-width:300px;line-height:1.6}.song-panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);animation:.3s fadeInUp}.song-panel-header{border-bottom:1px solid var(--border-color);justify-content:space-between;align-items:center;gap:10px;padding:14px 18px;display:flex}.song-panel-header h2{align-items:center;gap:8px;font-size:.9rem;font-weight:600;display:flex}.song-panel-header h2 svg:first-child{color:var(--accent)}.song-body{min-height:200px;padding:18px}.song-output{white-space:pre-wrap;word-wrap:break-word;color:var(--text-primary);font-family:inherit;font-size:.85rem;line-height:1.8}.blocks-area{flex-direction:column;gap:12px;animation:.3s fadeIn;display:flex}.song-block{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:border-color var(--t-fast), box-shadow var(--t-fast);overflow:hidden}.song-block:hover{border-color:var(--border-strong);box-shadow:var(--shadow-md)}.song-block-header{border-bottom:1px solid var(--border);background:var(--surface-2);justify-content:space-between;align-items:center;padding:10px 16px;display:flex}.song-block-type{text-transform:uppercase;letter-spacing:.09em;color:var(--accent-text);font-size:11px;font-weight:700}.song-block-actions{align-items:center;gap:4px;display:flex}.block-action-btn{border-radius:var(--radius);width:28px;height:28px;color:var(--text-muted);cursor:pointer;background:0 0;border:1px solid #0000;justify-content:center;align-items:center;transition:all .12s;display:flex}.block-action-btn:hover{background:var(--bg-hover);color:var(--text-primary);border-color:var(--border-color)}.variant-counter{color:var(--text-3);background:var(--surface);border:1px solid var(--border);border-radius:999px;padding:2px 8px;font-size:11px;font-weight:500}.linked-icon{color:var(--accent);opacity:.7;margin-right:4px}.song-block-content{align-items:stretch;display:flex;position:relative}.song-block-body{flex:1;min-width:0}.block-arrow{width:36px;color:var(--text-muted);cursor:pointer;opacity:.5;background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;transition:all .15s;display:flex}.block-arrow:hover:not(:disabled){opacity:1;background:var(--surface-2);color:var(--accent-text)}.block-arrow:disabled{opacity:.15;cursor:default}.block-arrow-left{border-right:1px solid var(--border-color)}.block-arrow-right{border-left:1px solid var(--border-color)}.block-variants-nav{display:none}.song-block-text{white-space:pre-wrap;word-wrap:break-word;color:var(--text);margin:0;padding:16px 20px;font-family:inherit;font-size:14.5px;line-height:1.7}.song-block-edit{padding:10px 14px}.block-textarea{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);width:100%;color:var(--text);resize:vertical;transition:border-color var(--t-fast), box-shadow var(--t-fast);outline:none;padding:10px 12px;font-family:inherit;font-size:14.5px;line-height:1.7}.block-textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.block-edit-actions{gap:8px;margin-top:8px;display:flex}.block-prompt-bar{border-top:1px solid var(--border-color);gap:6px;padding:8px 14px 12px;animation:.15s fadeIn;display:flex}.block-prompt-bar input{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);transition:border-color var(--t-fast), box-shadow var(--t-fast);outline:none;flex:1;padding:9px 12px;font-family:inherit;font-size:13.5px}.block-prompt-bar input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.prompt-send-btn{background:var(--accent-fill);border-radius:var(--radius);color:#fff;cursor:pointer;border:none;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;transition:opacity .12s;display:flex}.prompt-send-btn:disabled{opacity:.4;cursor:default}.prompt-send-btn:hover:not(:disabled){opacity:.85}.suno-panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);width:340px;box-shadow:var(--shadow-sm);flex-direction:column;flex-shrink:0;margin:20px 20px 20px 0;display:flex;overflow-y:auto}.suno-panel-header{border-bottom:1px solid var(--border);padding:16px 20px}.suno-panel-header h3{color:var(--text-primary);align-items:center;gap:8px;margin:0;font-size:.88rem;font-weight:600;display:flex}.suno-panel-body{flex:1;padding:16px}.suno-empty{text-align:center;color:var(--text-muted);flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:40px 20px;display:flex}.suno-empty svg{opacity:.2}.suno-empty p{max-width:220px;font-size:.82rem;line-height:1.5}.suno-ready{padding:20px 0}.suno-panel .suno-grid{grid-template-columns:1fr}.suno-panel .suno-inline{background:0 0;border:none;border-radius:0}.suno-panel .suno-inline-header{border-bottom:1px solid var(--border-color);margin-bottom:0;padding:0 0 12px}@media (width>=768px) and (width<=1200px){.suno-panel{border-left:none;border-top:1px solid var(--border-color);width:100%;max-height:400px}.studio-layout{flex-direction:column}.sidebar{width:260px;max-height:none}}.suno-section{animation:.3s fadeInUp}.suno-inline{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);overflow:hidden}.suno-inline-header{border-bottom:1px solid var(--border-color);justify-content:space-between;align-items:center;padding:14px 18px;display:flex}.suno-inline-header h3{align-items:center;gap:8px;font-size:.9rem;font-weight:600;display:flex}.suno-inline-header h3 svg{color:var(--accent)}.suno-loading-badge{color:var(--text-muted);align-items:center;gap:6px;font-size:.75rem;display:flex}.suno-grid{background:var(--border);grid-template-columns:1fr 1fr;gap:1px;display:grid}.suno-card{background:var(--surface);padding:14px 18px}.suno-card-header{justify-content:space-between;align-items:center;margin-bottom:6px;display:flex}.suno-card-label{color:var(--text-3);text-transform:uppercase;letter-spacing:.08em;align-items:center;gap:6px;font-size:11px;font-weight:700;display:flex}.suno-card-label svg{color:var(--accent)}.suno-card-value{color:var(--text-primary);font-size:.85rem;line-height:1.5}.title-value{font-size:1rem;font-weight:600}.suno-lyrics-card{border-top:1px solid var(--border-color)}.suno-lyrics-text{white-space:pre-wrap;word-wrap:break-word;color:var(--text-primary);max-height:400px;margin-top:6px;font-family:inherit;font-size:.82rem;line-height:1.7;overflow-y:auto}.copy-btn{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);color:var(--text-2);cursor:pointer;transition:background var(--t-fast), border-color var(--t-fast), color var(--t-fast);align-items:center;gap:6px;padding:5px 10px;font-family:inherit;font-size:12px;font-weight:500;display:inline-flex}.copy-btn:hover:not(:disabled){border-color:var(--border-strong);background:var(--surface-2);color:var(--text)}.copy-btn.copied{border-color:var(--success);background:var(--success-soft);color:var(--success-text)}.copy-btn:disabled{opacity:.3;cursor:not-allowed}.admin-panel{flex-direction:column;height:100vh;display:flex}.admin-content{flex:1;width:100%;max-width:720px;margin:0 auto;padding:24px;overflow-y:auto}.prompt-editor{flex-direction:column;gap:24px;display:flex}.prompt-group{flex-direction:column;gap:6px;display:flex}.prompt-label{color:var(--text-primary);align-items:center;gap:8px;font-size:.9rem;font-weight:600;display:flex}.prompt-label svg{color:var(--accent)}.prompt-hint{color:var(--text-muted);font-size:.75rem;line-height:1.4}.prompt-textarea{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);width:100%;color:var(--text-primary);resize:vertical;outline:none;padding:12px 14px;font-family:SF Mono,Fira Code,Cascadia Code,Consolas,monospace;font-size:.78rem;line-height:1.6;transition:all .2s}.prompt-textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.admin-actions{gap:10px;display:flex}.admin-tabs{border-bottom:1px solid var(--border);background:var(--surface);gap:4px;padding:0 24px;display:flex}[data-theme=dark] .admin-tabs{background:var(--bg)}.admin-tab{color:var(--text-2);cursor:pointer;transition:color var(--t-fast), border-color var(--t-fast);background:0 0;border:none;border-bottom:2px solid #0000;align-items:center;gap:6px;margin-bottom:-1px;padding:9px 14px;font-family:inherit;font-size:13.5px;display:flex}.admin-tab:hover{color:var(--text)}.admin-tab.active{color:var(--accent-text);border-bottom-color:var(--accent);font-weight:500}.users-section{max-width:720px;margin:0 auto}.users-list{flex-direction:column;gap:6px;display:flex}.user-row{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;transition:opacity .2s;display:flex}.user-row.banned{opacity:.55}.user-row-left{align-items:center;gap:10px;min-width:0;display:flex}.user-row-avatar{object-fit:cover;border-radius:50%;flex-shrink:0;width:36px;height:36px}.user-row-info{flex-direction:column;gap:2px;min-width:0;display:flex}.user-row-name{color:var(--text-primary);align-items:center;gap:6px;font-size:.85rem;font-weight:600;display:flex}.user-row-email{color:var(--text-muted);text-overflow:ellipsis;white-space:nowrap;font-size:.75rem;overflow:hidden}.user-row-date{color:var(--text-muted);opacity:.55;font-size:.7rem}.user-row-actions{flex-shrink:0;gap:6px;display:flex}.badge{background:var(--surface-2);color:var(--text-2);text-transform:uppercase;letter-spacing:.04em;border-radius:999px;align-items:center;gap:4px;padding:2px 8px;font-size:11px;font-weight:600;display:inline-flex}.badge-admin{background:var(--accent-soft);color:var(--accent-text)}.badge-banned{background:var(--danger-soft);color:var(--danger-text)}.badge-shared{background:var(--success-soft);color:var(--success-text)}.btn-danger{background:var(--danger-fill);color:#fff;border:1px solid #0000}.btn-danger:hover:not(:disabled){background:var(--danger-fill);filter:brightness(.92);border-color:#0000}.close-btn{color:var(--text-muted);cursor:pointer;border-radius:var(--radius);background:0 0;border:none;padding:4px}.close-btn:hover{color:var(--text);background:var(--surface-2)}.auth-screen{background:var(--bg);min-height:100vh;color:var(--text-3);justify-content:center;align-items:center;display:flex}.login-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);text-align:center;flex-direction:column;align-items:center;gap:12px;padding:40px 48px;animation:.4s fadeInUp;display:flex}.login-icon{color:var(--accent)}.login-card h1{color:var(--text-primary);font-size:1.5rem;font-weight:700}.login-card p{color:var(--text-muted);margin-bottom:8px;font-size:.85rem}.login-card .auth-error{border:1px solid var(--danger);border-radius:var(--radius);background:var(--danger-soft);max-width:320px;color:var(--danger-text);padding:8px 10px}.user-menu-dropdown{align-items:center;display:flex}.user-avatar{border:2px solid var(--border);object-fit:cover;width:30px;height:30px;transition:border-color var(--t-fast);border-radius:50%}.user-avatar:hover{border-color:var(--accent)}.user-dropdown-panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);min-width:180px;box-shadow:var(--shadow-lg);z-index:200;animation:.15s fadeInUp;position:absolute;top:calc(100% + 6px);right:0;overflow:hidden}.user-dropdown-item{width:100%;color:var(--text-primary);cursor:pointer;background:0 0;border:none;align-items:center;gap:8px;padding:10px 16px;font-family:inherit;font-size:.82rem;text-decoration:none;transition:background .12s;display:flex}.user-dropdown-item:hover{background:var(--bg-hover)}.user-dropdown-item.logout{border-top:1px solid var(--border-color);color:var(--error)}.modal-overlay{background:var(--bg-overlay);z-index:300;justify-content:center;align-items:center;padding:24px;animation:.2s fadeIn;display:flex;position:fixed;inset:0}.modal-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);width:100%;max-width:420px;animation:.3s fadeInUp}.modal-header{border-bottom:1px solid var(--border-color);justify-content:space-between;align-items:center;padding:18px 22px;display:flex}.modal-header h2{align-items:center;gap:8px;font-size:1rem;font-weight:600;display:flex}.modal-header h2 svg{color:var(--accent)}.modal-body{flex-direction:column;gap:12px;padding:18px 22px;display:flex}.modal-notice{color:var(--accent-text);background:var(--accent-soft);border-radius:var(--radius);border:1px solid #0000;padding:10px 14px;font-size:13px;line-height:1.5}.modal-error{color:var(--danger-text);font-size:.78rem}.modal-link{color:var(--accent-text);align-items:center;gap:5px;font-size:.78rem;text-decoration:none;display:inline-flex}.modal-link:hover{text-decoration:underline}.modal-footer{border-top:1px solid var(--border-color);justify-content:flex-end;padding:14px 22px;display:flex}input[type=checkbox],input[type=radio]{accent-color:var(--accent-fill)}::-webkit-scrollbar{width:14px;height:14px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border-strong);background-clip:padding-box;border:4px solid #0000;border-radius:999px}::-webkit-scrollbar-thumb:hover{background:var(--text-3);background-clip:padding-box}@media (width<=767px){.app-layout.is-mobile{padding-bottom:calc(56px + env(safe-area-inset-bottom,0px))}.studio-layout{flex-direction:column}.sidebar{width:100%;height:100%;max-height:none;box-shadow:none;-webkit-overflow-scrolling:touch;border:none;border-radius:0;margin:0;padding:16px 16px 24px;overflow-y:auto}.main-area{flex:1;min-height:0;padding:12px}.suno-panel{width:100%;height:100%;box-shadow:none;border:none;border-radius:0;max-height:none;margin:0}.app-header{z-index:120;position:fixed;top:0;left:0;right:0}.app-layout.is-mobile{padding-top:48px}.header-content{padding:8px 12px}.app-title{font-size:.95rem}.header-right{gap:4px}.hide-mobile{display:none}.admin-link{padding:6px 8px}.block-action-btn{width:36px;height:36px}.btn-sm{min-height:40px;padding:8px 14px}.copy-btn{padding:8px 12px;font-size:.75rem}.block-arrow{display:none}.block-variants-nav{border-top:1px solid var(--border);background:var(--surface-2);justify-content:center;align-items:center;gap:16px;padding:8px 14px;display:flex}.block-nav-btn{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);width:36px;height:36px;color:var(--text-2);cursor:pointer;-webkit-tap-highlight-color:transparent;justify-content:center;align-items:center;transition:all .15s;display:flex}.block-nav-btn:hover:not(:disabled){border-color:var(--border-strong);color:var(--text)}.block-nav-btn:disabled{opacity:.25;cursor:default}.block-nav-counter{color:var(--text-muted);text-align:center;min-width:40px;font-size:.78rem;font-weight:600}.song-block-text{padding:12px 14px;font-size:.9rem}.song-block-header{padding:8px 12px}.song-block-edit{padding:10px 12px}.block-prompt-bar{flex-direction:column;gap:8px;padding:10px 12px 14px}.block-prompt-bar input{padding:10px 14px;font-size:.85rem}.prompt-send-btn{border-radius:var(--radius);width:100%;height:40px}.suno-grid{grid-template-columns:1fr}.suno-card{padding:12px 14px}.history-drawer{width:100vw;max-width:100vw}.history-item{padding:12px 14px}.history-delete{opacity:1}.admin-actions{flex-direction:column}.admin-panel{padding-top:48px}.admin-panel .admin-tabs{z-index:110;position:sticky;top:48px}.admin-content{padding:16px}.admin-tabs{-webkit-overflow-scrolling:touch;scrollbar-width:none;flex-wrap:nowrap;gap:0;padding:0 12px;overflow-x:auto}.admin-tabs::-webkit-scrollbar{display:none}.admin-tab{white-space:nowrap;flex-shrink:0;padding:10px 14px;font-size:.78rem}.login-card{width:calc(100% - 32px);margin:16px;padding:28px 20px}.modal-overlay{padding:16px}.modal-card{border-radius:var(--radius-lg);max-width:100%}.modal-header,.modal-body{padding:14px 16px}.modal-footer{padding:12px 16px}.genre-dropdown-overlay{background:var(--bg-overlay);z-index:199;animation:.15s fadeIn;display:block;position:fixed;inset:0}.genre-dropdown{border-radius:var(--radius-lg) var(--radius-lg) 0 0;max-height:60vh;box-shadow:var(--shadow-lg);z-index:200;position:fixed;inset:auto 0 56px}::-webkit-scrollbar{width:0;height:0}.model-btn{padding:8px 12px;font-size:.82rem}.reasoning-toggle{width:40px;height:40px}}.mobile-tab-bar{height:calc(56px + env(safe-area-inset-bottom,0px));padding-bottom:env(safe-area-inset-bottom,0px);background:var(--surface);border-top:1px solid var(--border);z-index:150;align-items:stretch;display:flex;position:fixed;bottom:0;left:0;right:0}.mobile-tab{color:var(--text-muted);cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:none;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:3px;font-family:inherit;font-size:.65rem;font-weight:500;transition:color .15s;display:flex;position:relative}.mobile-tab.active{color:var(--accent-text)}.mobile-tab svg{transition:transform .15s}.mobile-tab.active svg{transform:scale(1.1)}.tab-badge{background:var(--accent-fill);border-radius:50%;width:7px;height:7px;animation:2s ease-in-out infinite pulse;position:absolute;top:6px;right:calc(50% - 16px)}.history-overlay{background:var(--bg-overlay);z-index:200;justify-content:flex-end;animation:.15s fadeIn;display:flex;position:fixed;inset:0}.history-drawer{background:var(--surface);border-left:1px solid var(--border);width:380px;max-width:90vw;box-shadow:var(--shadow-lg);flex-direction:column;animation:.2s slideInRight;display:flex}@keyframes slideInRight{0%{transform:translate(100%)}to{transform:translate(0)}}.history-header{border-bottom:1px solid var(--border-color);flex-shrink:0;justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.history-header h2{align-items:center;gap:8px;font-size:.95rem;font-weight:600;display:flex}.history-header h2 svg{color:var(--accent)}.history-list{flex:1;padding:8px;overflow-y:auto}.history-item{border-radius:var(--radius);cursor:pointer;align-items:center;gap:8px;padding:10px 12px;transition:background .12s;display:flex}.history-item:hover{background:var(--surface-2)}.history-item-info{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.history-item-topic{color:var(--text-primary);text-overflow:ellipsis;white-space:nowrap;font-size:.82rem;font-weight:500;overflow:hidden}.history-item-meta{color:var(--text-muted);align-items:center;gap:4px;font-size:.7rem;display:flex}.history-delete{color:var(--text-muted);cursor:pointer;border-radius:var(--radius);opacity:0;background:0 0;border:none;flex-shrink:0;padding:4px;transition:all .12s}.history-item:hover .history-delete{opacity:1}.history-delete:hover{color:var(--danger-text);background:var(--danger-soft)}.exclude-input{min-height:unset!important;padding:8px 10px!important;font-size:.82rem!important}.catalog-editor{max-width:800px;margin:0 auto;padding:20px 0}.catalog-subtabs{border-bottom:1px solid var(--border);align-items:center;gap:2px;margin-bottom:16px;padding-bottom:0;display:flex}.catalog-saved-badge{color:var(--success-text);margin-left:auto;padding:4px 10px;font-size:.78rem;font-weight:500;animation:.2s fadeIn}.catalog-list{flex-direction:column;gap:4px;display:flex}.catalog-category{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden}.catalog-cat-header{cursor:pointer;align-items:center;gap:8px;padding:10px 14px;font-size:.85rem;font-weight:500;transition:background .12s;display:flex}.catalog-cat-header:hover{background:var(--bg-hover)}.catalog-cat-emoji{font-size:1rem}.catalog-cat-name{color:var(--text-primary);flex:1}.catalog-cat-count{color:var(--text-3);background:var(--surface-2);border-radius:999px;padding:2px 8px;font-size:.72rem}.catalog-delete-btn{color:var(--text-muted);cursor:pointer;border-radius:var(--radius);opacity:.4;background:0 0;border:none;align-items:center;padding:4px;transition:all .12s;display:flex}.catalog-delete-btn:hover{opacity:1;color:var(--danger-text);background:var(--danger-soft)}.catalog-items{border-top:1px solid var(--border-color);padding:6px 8px 8px 32px}.catalog-item{color:var(--text-secondary);border-radius:var(--radius);justify-content:space-between;align-items:center;padding:6px 10px;font-size:.82rem;display:flex}.catalog-item:hover{background:var(--bg-hover)}.catalog-item:hover .catalog-delete-btn{opacity:1}.catalog-structure-item{flex-direction:column;align-items:flex-start;gap:2px}.catalog-structure-info{flex-direction:column;gap:2px;width:100%;display:flex}.catalog-structure-name{color:var(--text-primary);font-weight:500}.catalog-structure-desc{color:var(--text-muted);font-size:.75rem}.catalog-structure-parts{color:var(--text-muted);opacity:.7;font-size:.72rem}.catalog-structure-item .catalog-delete-btn{position:absolute;top:6px;right:8px}.catalog-structure-item{padding-right:32px;position:relative}.catalog-add-btn{color:var(--accent-text);cursor:pointer;border-radius:var(--radius);background:0 0;border:none;align-items:center;gap:4px;padding:6px 10px;font-family:inherit;font-size:.78rem;transition:background .12s;display:flex}.catalog-add-btn:hover{background:var(--bg-hover)}.catalog-add-cat{width:fit-content;margin-top:8px}.lock-btn{color:var(--text-muted);cursor:pointer;border-radius:var(--radius);background:0 0;border:none;justify-content:center;align-items:center;padding:4px;transition:all .15s;display:flex}.lock-btn:hover{color:var(--text-primary);background:var(--bg-hover)}.lock-btn.locked{color:var(--accent-text)}.lock-btn.locked:hover{background:var(--accent-soft)}.artist-input-row{align-items:center;gap:6px;display:flex}.artist-input-row .topic-input{flex:1}.detect-style-btn{background:var(--surface);border:1px solid var(--border);color:var(--accent-text);cursor:pointer;border-radius:var(--radius);flex-shrink:0;justify-content:center;align-items:center;padding:8px;transition:all .2s;display:flex}.detect-style-btn:hover:not(:disabled){background:var(--accent-fill);color:#fff;border-color:#0000}.detect-style-btn:disabled{opacity:.3;cursor:not-allowed}.detect-style-btn.detecting{opacity:.7}.spin{animation:1s linear infinite spin}.plugin-list{flex-direction:column;gap:10px;display:flex}.plugin-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:border-color var(--t-fast), background var(--t-fast);justify-content:space-between;align-items:center;padding:14px 16px;display:flex}.plugin-card.enabled{border-color:var(--accent);background:var(--accent-soft)}.plugin-card-left{align-items:center;gap:12px;display:flex}.plugin-icon{color:var(--accent);flex-shrink:0}.plugin-desc{opacity:.6;margin-top:2px;font-size:12px}.plugin-toggle{flex-shrink:0;width:40px;height:22px;position:relative}.plugin-toggle input{opacity:0;width:0;height:0}.plugin-toggle-slider{background:var(--border-strong);cursor:pointer;border-radius:999px;transition:all .3s;position:absolute;inset:0}.plugin-toggle-slider:before{content:"";width:16px;height:16px;box-shadow:var(--shadow-sm);background:#fff;border-radius:50%;transition:all .3s;position:absolute;bottom:3px;left:3px}.plugin-toggle input:checked+.plugin-toggle-slider{background:var(--accent-fill)}.plugin-toggle input:checked+.plugin-toggle-slider:before{transform:translate(18px)}.trope-selected{background:var(--bg-secondary);border:1px solid var(--accent);border-radius:var(--radius);cursor:pointer;justify-content:space-between;align-items:center;padding:8px 12px;transition:all .2s;display:flex}.trope-selected-name{font-size:14px;font-weight:500}.trope-clear{color:var(--text);opacity:.4;cursor:pointer;background:0 0;border:none;padding:2px;transition:opacity .2s;display:flex}.trope-clear:hover{opacity:1}.trope-trigger{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius);width:100%;color:var(--text);opacity:.6;cursor:pointer;text-align:left;padding:8px 12px;font-size:14px;transition:all .2s}.trope-trigger:hover{border-color:var(--accent);opacity:1}.trope-dropdown{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius);max-height:250px;margin-top:6px;overflow:hidden auto}.trope-option{border:none;border-bottom:1px solid var(--border);width:100%;color:var(--text);cursor:pointer;text-align:left;background:0 0;flex-direction:column;padding:10px 12px;transition:background .15s;display:flex}.trope-option:last-child{border-bottom:none}.trope-option:hover,.trope-option.active{background:var(--accent-soft)}.trope-option-name{font-size:14px;font-weight:500}.trope-option-desc{opacity:.55;margin-top:2px;font-size:12px}.poet-critic-section{padding-top:0}.poet-critic-label{cursor:pointer;opacity:.65;-webkit-user-select:none;user-select:none;align-items:center;gap:8px;font-size:13px;transition:opacity .2s;display:flex}.poet-critic-label:hover{opacity:1}.poet-critic-indicator{border-radius:var(--radius-sm);background:var(--surface);border:1px solid var(--border);justify-content:center;align-items:center;width:28px;height:28px;transition:all .2s;display:flex}.poet-critic-indicator.active{background:var(--accent-fill);color:#fff;border-color:#0000}.critic-model-selector{align-items:center;gap:8px;margin-top:8px;padding-left:36px;display:flex}.critic-model-label{opacity:.6;white-space:nowrap;min-width:55px;font-size:11px}.critic-model-select{border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg-secondary);color:var(--text);cursor:pointer;outline:none;flex:1;padding:5px 8px;font-size:12px}.critic-model-select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.strategy-settings{margin-top:8px}.strategy-type-selector{gap:4px;padding-left:36px;display:flex}.strategy-btn{border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg-secondary);color:var(--text);cursor:pointer;opacity:.6;flex:1;padding:5px 6px;font-size:11px;transition:all .2s}.strategy-btn:hover{opacity:1}.strategy-btn.selected{background:var(--accent-fill);color:#fff;opacity:1;border-color:#0000}.trope-description{opacity:.6;margin-top:6px;font-size:12px;line-height:1.4}.trope-add-form{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius);padding:14px}.trope-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:8px;padding:12px 14px}.trope-card-header{justify-content:space-between;align-items:center;display:flex}.trope-card-desc{opacity:.7;margin-top:4px;font-size:13px}.trope-card-instr{opacity:.5;margin-top:4px;font-size:12px}.btn-icon.danger{color:var(--text);opacity:.4;cursor:pointer;background:0 0;border:none;padding:4px;transition:all .2s}.btn-icon.danger:hover{opacity:1;color:var(--danger-text)}.gen-log-overlay{background:var(--overlay-bg);z-index:1000;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.gen-log-panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);flex-direction:column;width:100%;max-width:640px;max-height:85vh;display:flex;overflow:hidden}.gen-log-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.gen-log-header h3{margin:0;font-size:16px}.gen-log-close{color:var(--text);opacity:.5;cursor:pointer;background:0 0;border:none;padding:4px}.gen-log-close:hover{opacity:1}.gen-log-nav{align-items:center;gap:12px;padding:12px 20px 4px;display:flex}.gen-log-arrow{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);cursor:pointer;flex-shrink:0;padding:6px;transition:all .2s}.gen-log-arrow:hover:not(:disabled){background:var(--surface-2);border-color:var(--border-strong);color:var(--text)}.gen-log-arrow:disabled{opacity:.25;cursor:default}.gen-log-title{text-align:center;flex:1}.gen-log-phase-title{font-size:14px;font-weight:600;display:block}.gen-log-meta{opacity:.5;margin-top:2px;font-size:11px;display:block}.gen-log-dots{justify-content:center;gap:6px;padding:8px 20px;display:flex}.gen-log-dot{background:var(--border);cursor:pointer;border:none;border-radius:50%;width:8px;height:8px;padding:0;transition:all .2s}.gen-log-dot.active{background:var(--accent-fill);transform:scale(1.3)}.gen-log-dot.critic{border-radius:var(--radius-sm)}.gen-log-content{flex:1;padding:12px 20px 20px;overflow-y:auto}.gen-log-text{white-space:pre-wrap;word-break:break-word;color:var(--text);margin:0;font-family:inherit;font-size:13px;line-height:1.7}.gen-log-text.criticism{opacity:.85;font-size:12px;line-height:1.6}.gen-log-criticism-header{opacity:.6;align-items:center;gap:6px;margin-bottom:8px;font-size:12px;font-weight:600;display:flex}.gen-log-btn{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);cursor:pointer;align-items:center;gap:6px;padding:7px 12px;font-size:12px;transition:all .2s;display:flex}.gen-log-btn:hover{background:var(--surface-2);border-color:var(--border-strong)}@media (width<=600px){.gen-log-overlay{padding:0}.gen-log-panel{border-radius:0;max-width:100%;height:100vh;max-height:100vh}}.reasoning-block{border-radius:var(--radius);background:var(--accent-soft);border:1px solid #0000;margin:0 16px 8px;overflow:hidden}.reasoning-toggle{width:100%;color:var(--text);cursor:pointer;opacity:.7;background:0 0;border:none;align-items:center;gap:6px;padding:8px 12px;font-size:12px;transition:opacity .2s;display:flex}.reasoning-toggle:hover{opacity:1}.reasoning-arrow{margin-left:auto;font-size:14px}.reasoning-text{white-space:pre-wrap;word-break:break-word;color:var(--text);opacity:.6;max-height:200px;margin:0;padding:0 12px 10px;font-family:inherit;font-size:11px;line-height:1.5;overflow-y:auto}.history-improve{color:var(--text);opacity:.3;cursor:pointer;background:0 0;border:none;flex-shrink:0;padding:4px;transition:all .2s}.history-improve:hover{opacity:1;color:var(--accent-text)}.blocks-toolbar{justify-content:flex-end;gap:8px;margin-bottom:8px;display:flex}.improve-btn{background:var(--accent-soft);color:var(--accent-text);border-color:#0000}.improve-btn:hover:not(:disabled){background:var(--accent-fill);color:#fff;border-color:#0000}.improve-btn:disabled{opacity:.4;cursor:default}
