:root{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;color-scheme:light;font-synthesis:none;--ink: #202a27;--muted: #65716b;--subtle: #65716b;--line: #e1e6df;--accent: #28634d;--accent-strong: #1c4b3a;--accent-soft: #eaf2e9;--surface: #fff;--surface-soft: #f6f7f4;--canvas: #f4f5f2;--danger: #ac3e38;--sidebar: 208px}:root[data-theme=dark]{color-scheme:dark;--ink: #e8eee7;--muted: #a3b1a5;--subtle: #a3b1a5;--line: #354137;--accent: #a7d3ae;--accent-strong: #c3e4c6;--accent-soft: #293e2f;--surface: #1b231e;--surface-soft: #222c25;--canvas: #131916;--danger: #f1a29a}*{box-sizing:border-box}html{min-width:320px;scroll-padding-top:24px}body{margin:0;background:var(--canvas);color:var(--ink);font-size:14px;line-height:1.6}button,input,textarea,select{font:inherit}a{color:inherit;text-decoration:none}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button,.button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:38px;padding:8px 12px;border:1px solid var(--line);border-radius:10px;color:var(--ink);background:var(--surface);cursor:pointer;transition:background .16s,border-color .16s,color .16s;font-size:13px}button:hover:not(:disabled),.button:hover{background:var(--surface-soft);border-color:var(--muted)}button:disabled{cursor:not-allowed;opacity:.48}button svg,.button svg{flex-shrink:0}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:3px}input,select,textarea{max-width:100%;min-width:0;padding:11px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface-soft);color:var(--ink)}input::placeholder,textarea::placeholder{color:var(--muted);opacity:.85}input[type=checkbox]{accent-color:var(--accent);width:17px;height:17px;flex-shrink:0;cursor:pointer;padding:0}input[type=range]{accent-color:var(--accent);height:24px;padding:0;border:0;background:transparent;cursor:pointer}[hidden],input[hidden]{display:none!important}h1,h2,h3,p{margin:0}h1{font-size:clamp(24px,2.3vw,32px);font-weight:650;letter-spacing:-.8px;line-height:1.35}h2{font-size:16px;font-weight:650;display:flex;align-items:center;gap:8px}h3{font-size:14px;font-weight:650}.primary{background:var(--accent);color:var(--surface);border-color:var(--accent);font-weight:650}.primary:hover:not(:disabled){background:var(--accent-strong);border-color:var(--accent-strong)}.app{min-height:100dvh}.sidebar{position:fixed;inset:0 auto 0 0;z-index:20;width:var(--sidebar);background:var(--surface);border-right:1px solid var(--line);padding:32px 16px 22px;display:flex;flex-direction:column}.brand{display:flex;align-items:center;gap:10px;padding:0 10px;font-size:19px;font-weight:700;letter-spacing:-.5px;margin-bottom:36px}.brand-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:var(--accent);color:var(--surface);flex-shrink:0}.brand small{display:block;margin-top:4px;color:var(--muted);font-size:10px;font-weight:400;letter-spacing:.2px}.nav-label{color:var(--muted);font-size:11px;margin:0 14px 12px}.sidebar nav{display:flex;flex-direction:column;gap:6px}.sidebar nav button,.nav-settings,.theme-button{width:100%;justify-content:flex-start;gap:11px;padding:12px 14px;border:0;background:transparent;color:var(--muted)}.sidebar nav button.active{background:var(--accent-soft);color:var(--accent);font-weight:650}.sidebar nav button.active:after{content:"";width:5px;height:5px;border-radius:50%;margin-left:auto;background:currentColor}.sidebar-bottom{margin-top:auto}.privacy{padding:16px 12px;margin-bottom:8px;font-size:11px;color:var(--muted);border-bottom:1px solid var(--line)}.privacy p{margin-top:6px;font-size:11px;line-height:1.8}.online-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--accent);margin-right:6px}.online-dot.offline{background:#aa7c38}main{margin-left:var(--sidebar);min-height:100dvh}.topbar{min-height:65px;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px clamp(22px,3vw,48px);color:var(--muted);border-bottom:1px solid var(--line);background:var(--surface);font-size:12px}.slash{padding:0 10px;opacity:.6}.login-state{font-size:12px;border-radius:20px;min-height:34px;padding:6px 12px}.workspace{max-width:1680px;margin:auto;padding:30px clamp(22px,3vw,48px) 40px}.page-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:26px}.eyebrow{color:var(--accent);font-size:10px;font-weight:700;line-height:1.4;letter-spacing:2px;margin-bottom:10px}.page-heading p{color:var(--muted);font-size:13px;line-height:1.8;margin-top:10px;max-width:700px}.composer{display:grid;grid-template-columns:minmax(0,1fr) 280px;border:1px solid var(--line);border-radius:18px;background:var(--surface);box-shadow:0 8px 28px #25392b06;overflow:hidden;min-width:0}.composer-main{padding:24px;min-width:0}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:20px}.section-heading h2 svg{color:var(--accent)}.text-action{display:inline-flex;gap:6px;align-items:center;border:0;padding:0;min-height:32px;font-size:12px;background:transparent;color:var(--muted);cursor:pointer}.text-action:hover{background:transparent;color:var(--accent)}.field-label{display:block;margin:20px 0 9px;font-size:12px;font-weight:600}.field-label span{margin-left:6px;font-weight:400;color:var(--muted)}textarea{width:100%;min-height:164px;line-height:1.85;resize:vertical;font-size:14px;padding:14px}.prompt-hint{display:flex;justify-content:space-between;gap:8px;color:var(--muted);font-size:11px;margin-top:8px;line-height:1.8}.prompt-hint span{white-space:nowrap}.examples{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:18px;color:var(--muted);font-size:11px}.examples>span{flex-basis:100%;margin-bottom:2px}.examples button{background:var(--surface-soft);border-color:transparent;border-radius:7px;padding:6px 9px;font-size:11px;min-height:32px}.examples button:hover{color:var(--accent);background:var(--accent-soft)}.name-input{width:100%;font-size:13px}.small-hint{color:var(--muted);font-size:11px;line-height:1.8;margin-top:8px}.parameters{min-width:0;padding:24px;border-left:1px solid var(--line)}.parameters>h2{margin-bottom:18px}.music-model-field .field-label{margin-top:0}.music-model-field select{width:100%;font-size:13px}.parameter-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:18px 0 9px;font-size:12px}.parameter-title strong{color:var(--accent)}.check-label{display:inline-flex;align-items:center;gap:7px;font-size:12px;cursor:pointer}.number-unit{display:flex;align-items:center;border:1px solid var(--line);background:var(--surface-soft);border-radius:10px;padding-right:12px;color:var(--muted);font-size:12px}.number-unit input{width:100%;border:0;background:transparent}.parameters>input[type=range]{width:100%}.option{display:flex;margin-top:16px}.two-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:20px}.two-fields label{font-size:12px}.two-fields select{display:block;width:100%;margin-top:8px;font-size:12px;padding:10px 8px}.generate-footer{border-top:1px solid var(--line);margin-top:22px;padding-top:16px}.generate-footer p{display:flex;justify-content:space-between;gap:8px;font-size:11px;color:var(--muted)}.generate-footer strong{font-weight:600;color:var(--ink)}.generate{width:100%;min-height:48px;border-radius:12px;margin:14px 0 4px;font-size:14px}.generate-footer>.small-hint{display:block;text-align:center}.results{min-width:0;margin-top:24px;padding:24px;border:1px solid var(--line);border-radius:20px;background:var(--surface)}.count{display:inline-flex;align-items:center;justify-content:center;min-width:24px;padding:2px 7px;border-radius:7px;font-size:11px;color:var(--accent);background:var(--accent-soft);font-weight:500}.result-actions{display:flex;align-items:center;flex-wrap:wrap;gap:10px}.result-actions button{font-size:12px;padding:6px 9px}.empty{min-height:310px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;text-align:center;border:1px solid var(--line);border-radius:14px;padding:28px;color:var(--muted);background-color:var(--surface-soft);background-image:radial-gradient(var(--line) 1px,transparent 1px);background-size:20px 20px}.empty-icon{display:grid;place-items:center;width:68px;height:68px;border:1px solid var(--line);border-radius:20px;background:var(--surface);color:var(--accent);margin-bottom:10px;box-shadow:0 12px 30px #26392e0a}.empty h3{font-size:16px;color:var(--ink);font-weight:600}.empty p{font-size:12px}.record-list{display:grid;gap:10px}.record{display:flex;align-items:center;gap:12px;padding:16px;background:var(--surface);border:1px solid var(--line);border-radius:12px;min-width:0}.record.playing-record{background:var(--accent-soft);border-color:var(--accent)}.record>input{margin:0}.play-button{width:40px;height:40px;padding:0;border:0;border-radius:50%;background:var(--accent-soft);color:var(--accent);flex-shrink:0}.play-button:hover:not(:disabled){background:var(--accent);color:var(--surface)}.record-content{flex:1;min-width:0}.record-name{display:block;max-width:100%;padding:0;min-height:24px;background:transparent;border:0;font-size:13px;font-weight:600;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.record-name:hover:not(:disabled){background:transparent;color:var(--accent)}.record-name:disabled{opacity:1;color:var(--ink)}.record-meta{display:flex;flex-wrap:wrap;gap:4px 10px;font-size:11px;color:var(--muted);margin-top:5px}.status.completed,.status.running{color:var(--accent)}.status.failed,.status.interrupted,.danger{color:var(--danger)}.record-actions{display:flex;align-items:center;flex-wrap:wrap;gap:4px}.record-actions>button{font-size:11px;padding:6px;min-height:34px}.icon-button{border:0;background:transparent;padding:7px;min-height:34px;color:var(--muted)}.icon-button.danger{color:var(--danger)}.record-error{font-size:12px;color:var(--danger);line-height:1.8;margin-top:7px;overflow-wrap:anywhere}.record details{color:var(--muted);font-size:11px;margin-top:7px}.record summary{cursor:pointer;padding:3px 0}.record details p{margin-top:8px;font-size:12px;line-height:1.8;white-space:pre-wrap;overflow-wrap:anywhere}.workspace-footnote{color:var(--muted);text-align:center;font-size:11px;line-height:1.8;margin-top:24px}.notice,.warning{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px;padding:12px 16px;border:1px solid var(--line);border-radius:12px;background:var(--accent-soft);font-size:12px;line-height:1.8;overflow-wrap:anywhere}.warning{color:var(--danger);background:var(--surface)}.notice .button,.warning button{flex-shrink:0}.queue-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:var(--accent-soft);font-size:12px}.queue-bar>span{display:flex;align-items:center;gap:7px;color:var(--accent)}.queue-bar button{font-size:12px}.with-player{padding-bottom:106px}.local-player{position:fixed;bottom:16px;left:calc(var(--sidebar) + 24px);right:24px;z-index:25;display:flex;align-items:center;gap:12px;min-height:78px;padding:16px 20px;background:var(--surface);border:1px solid var(--line);border-radius:16px;box-shadow:0 8px 35px #10281d18}.player-title{width:190px;min-width:80px;display:flex;align-items:center;gap:10px}.player-title>svg{flex-shrink:0;color:var(--accent)}.player-title>div{min-width:0}.player-title strong{display:block;font-size:12px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-title span{display:block;color:var(--muted);font-size:10px;margin-top:3px}.time{color:var(--muted);font-size:11px;font-variant-numeric:tabular-nums}.seek{flex:1;min-width:30px}.volume{width:64px}.volume-icon{color:var(--muted);flex-shrink:0}.local-player select{padding:7px 4px;width:60px;font-size:12px}.enabled{color:var(--accent);background:var(--accent-soft)}.library-layout{display:grid;grid-template-columns:190px minmax(0,1fr);gap:18px}.directory-tree{min-width:0;padding:12px 8px;align-self:start;border:1px solid var(--line);border-radius:12px;background:var(--surface-soft)}.directory-tree h3{font-size:12px;padding:4px 8px 12px;color:var(--muted)}.directory-tree button{width:100%;justify-content:flex-start;padding:7px 8px;border:0;background:transparent;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:12px}.directory-tree button.active{color:var(--accent);background:var(--accent-soft)}.directory-tree details{margin-left:8px}.directory-tree summary{padding:5px;color:var(--muted);font-size:11px;cursor:pointer;overflow-wrap:anywhere}.library-files{min-width:0}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:grid;place-items:center;padding:24px;background:#0c1711a3;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}.modal{width:min(100%,520px);max-height:calc(100dvh - 48px);overflow:auto;padding:28px;border:1px solid var(--line);border-radius:22px;background:var(--surface);box-shadow:0 24px 90px #0003}.modal>.section-heading{margin-bottom:16px}.account-state{padding:18px;border-radius:12px;background:var(--surface-soft)}.account-login{font-size:18px;color:var(--accent);margin-top:8px}.modal-actions{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:8px;margin-top:20px}.settings-section{border-top:1px solid var(--line);padding-top:22px;margin-top:22px}.usage-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;color:var(--muted);font-size:12px;margin-top:18px}.usage-grid strong{display:block;color:var(--ink);font-size:24px;margin-top:6px;font-weight:600;overflow-wrap:anywhere}.batch-modal{width:min(100%,680px)}.batch-summary{display:flex;gap:28px;padding:20px;margin:20px 0;border-radius:12px;background:var(--accent-soft);color:var(--accent)}.batch-summary strong{font-size:26px;font-weight:600}.batch-summary span{font-size:12px;font-weight:400}.batch-preview{max-height:320px;overflow:auto}.batch-preview>div{padding:14px 0;border-bottom:1px solid var(--line)}.batch-preview strong{display:block;font-size:13px}.batch-preview span{display:block;font-size:11px;color:var(--muted);margin-top:5px}.batch-preview p{font-size:12px;color:var(--muted);margin-top:6px;line-height:1.8;overflow-wrap:anywhere}.spin{animation:spin 1.1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(min-width:1240px){.workspace:has(>.composer){display:grid;grid-template-columns:minmax(340px,400px) minmax(0,1fr);grid-template-areas:"auth auth" "error error" "notice notice" "storage storage" "heading heading" "composer results" "queue ." "footnote footnote";gap:0 28px;align-items:start}.workspace>.notice{grid-area:notice}.workspace>.auth-banner{grid-area:auth}.workspace>.warning{grid-area:storage}.workspace>.warning:has(>button){grid-area:error}.page-heading{grid-area:heading}.composer{grid-area:composer;grid-template-columns:1fr}.composer-main,.parameters{padding:20px}.composer .section-heading{margin-bottom:14px}.composer .field-label{margin-top:14px}.composer textarea{min-height:140px}.composer .examples{margin-top:12px}.parameters{border-left:0;border-top:1px solid var(--line)}.results{grid-area:results;margin-top:0;min-height:620px}.results .empty{min-height:510px}.queue-bar{grid-area:queue;flex-wrap:wrap}.workspace-footnote{grid-area:footnote}.record{flex-wrap:wrap}.record-actions{margin-left:69px;flex-basis:calc(100% - 69px);justify-content:flex-end}}@media(max-width:1180px){:root{--sidebar: 180px}.sidebar{padding:26px 10px 18px}.brand{padding:0 6px;font-size:17px}.brand small{font-size:9px}.workspace{padding:24px}.topbar{padding:12px 24px}.composer{grid-template-columns:minmax(0,1fr) 250px}.composer-main,.parameters,.results{padding:20px}.local-player{gap:8px;padding:14px}.player-title{width:130px}.volume{width:50px}}@media(max-width:960px){.composer{grid-template-columns:1fr}.parameters{border-left:0;border-top:1px solid var(--line)}.page-heading{align-items:flex-start;flex-direction:column}.library-layout{grid-template-columns:150px minmax(0,1fr)}.record{flex-wrap:wrap;gap:10px}.record-actions{margin-left:auto;flex-basis:100%;justify-content:flex-end}.record-content{flex-basis:calc(100% - 84px)}.local-player{flex-wrap:wrap;min-height:106px}.player-title{flex:1}.local-player .seek{order:10;flex-basis:65%}.local-player .time{order:10}.with-player{padding-bottom:144px}}@media(max-width:640px){:root{--sidebar: 0px}.sidebar{position:static;width:100%;border-right:0;border-bottom:1px solid var(--line);padding:16px 16px 10px}.brand{margin:0 0 16px;padding:0}.brand small,.nav-label,.sidebar-bottom{display:none}.sidebar nav{flex-direction:row;gap:4px}.sidebar nav button{flex:1;flex-direction:column;gap:5px;padding:9px 4px;font-size:11px}.sidebar nav button.active:after{display:none}main{margin-left:0}.topbar{padding:12px 16px;min-height:60px;gap:8px}.topbar>span{font-size:11px}.slash{padding:0 4px}.login-state{font-size:11px;max-width:58%;overflow-wrap:anywhere}.workspace{padding:24px 16px 32px}.page-heading p{font-size:12px}.composer-main,.parameters,.results{padding:18px}.section-heading{gap:10px}.results{border-radius:16px}.library-layout{grid-template-columns:1fr}.directory-tree{max-height:200px;overflow:auto}.notice,.warning,.queue-bar{flex-wrap:wrap;padding:12px}.local-player{left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));padding:12px;gap:7px;border-radius:14px}.player-title{min-width:90px}.volume-icon{display:none}.local-player .volume{width:58px}.local-player .play-button{width:36px;height:36px}.local-player .seek{flex-basis:55%}.with-player{padding-bottom:calc(160px + env(safe-area-inset-bottom))}.modal-backdrop{padding:12px}.modal{padding:20px;max-height:calc(100dvh - 24px);border-radius:16px}.batch-summary{gap:16px;padding:16px}.batch-summary strong{font-size:22px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}.player-close{flex-shrink:0}.topbar-actions{display:flex;align-items:center;justify-content:flex-end;gap:14px;flex-wrap:wrap}.ai-entry-link{color:var(--accent);font-weight:650;white-space:nowrap;padding:8px 0}.ai-entry-link:hover{text-decoration:underline;text-underline-offset:4px}@media(max-width:600px){.topbar{flex-wrap:wrap;padding-top:12px;padding-bottom:12px}.topbar-actions{gap:12px}}
