:root{--bg:#090d16;--panel:#222b3a;--field:#3b4556;--text:#f7f9ff;--muted:#a9b1c0;--border:#3a4353;--accent:#5b4be4;--accent-soft:#7e70ffb8;--sans:system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;font:16px/1.5 var(--sans);letter-spacing:0;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{background:var(--bg);min-width:320px;min-height:100svh;margin:0}button,input{font:inherit}button{letter-spacing:0}#root{min-height:100svh}h1,h2,p{margin:0}h1,h2{color:var(--text);letter-spacing:0;font-weight:850}h1{font-size:26px;line-height:1.18}h2{font-size:15px;line-height:1.2}@media (width<=820px){h1{font-size:24px}}.workshop{width:100%;min-height:100svh;padding:12px clamp(24px,5vw,80px) 34px}.workshop-header{margin-inline:auto;justify-content:space-between;align-items:flex-start;gap:24px;width:min(100%,1440px);margin-bottom:18px;display:flex}.brand-row{align-items:center;gap:10px;margin-top:44px;display:flex}.brand-mark{color:var(--accent);text-shadow:0 0 22px #614fff99;font-size:30px;line-height:1}.subtitle{color:var(--text);margin-top:16px;font-size:14px;font-weight:700}.language-switch{flex:none;gap:8px;display:flex}.language-switch button{min-height:32px;color:var(--text);cursor:pointer;background:#4c5667;border:0;border-radius:5px;align-items:center;gap:8px;padding:7px 12px;font-size:13px;font-weight:800;display:inline-flex}.language-switch button:before{content:"";background:#1f2a3a;border-radius:999px;width:14px;height:14px}.language-switch .active{background:var(--accent)}.language-switch .active:before{box-shadow:inset 0 0 0 5px var(--accent);background:#f4f3ff}.work-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:18px;width:min(100%,1440px);margin-inline:auto;display:grid}.input-column,.output-column{align-content:start;gap:16px;display:grid}.upload-card,.audio-preview,.input-method-card,.url-card,.mode-card,.status-card,.result-card{background:var(--panel);border-radius:4px;width:100%;position:relative}.upload-card{cursor:pointer;grid-template-rows:1fr auto;min-height:280px;display:grid;overflow:hidden}.section-label{color:#fff;background:var(--accent);border-radius:5px;width:fit-content;padding:5px 10px;font-size:14px;font-weight:850;line-height:1.2}.upload-card>.section-label,.input-method-card>.section-label,.mode-card>.section-label,.status-card>.section-label,.result-card>.section-label{position:absolute;top:10px;left:12px}.drop-zone{min-height:238px;color:var(--text);text-align:center;align-content:center;place-items:center;gap:8px;padding:58px 24px 36px;transition:background .2s,box-shadow .2s;display:grid}.upload-card:hover .drop-zone,.upload-card:focus-visible .drop-zone{background:#614fff14;box-shadow:inset 0 0 0 1px #8479ff59}.upload-card:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.upload-arrow{font-size:38px;font-weight:300;line-height:1}.drop-zone p{max-width:340px;font-size:16px;font-weight:800}.drop-zone small{color:var(--muted);font-size:13px;font-weight:800}.file-status{border-top:1px solid var(--border);min-height:42px;color:var(--muted);grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:10px;padding:10px 14px;font-size:13px;display:grid}.file-status strong{color:var(--text);text-overflow:ellipsis;white-space:nowrap;font-size:14px;overflow:hidden}.file-input{display:none}.audio-preview{padding:46px 12px 14px}.audio-preview>.section-label{position:absolute;top:10px;left:12px}.mode-card,.input-method-card,.url-card,.status-card{padding:46px 12px 14px}.input-method-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.input-method-option{min-height:56px;color:var(--muted);background:var(--field);cursor:pointer;border:0;border-radius:4px;font-size:14px;font-weight:850;line-height:1.2;transition:background .2s,color .2s,transform .2s;position:relative}.input-method-option.active{color:#fff;background:var(--accent)}.input-method-option:hover:not(:disabled),.input-method-option:focus-visible{color:#fff;background:#614fffb8;outline:none;transform:translateY(-1px)}.preferred-badge{color:#fff;background:#614fffeb;border-radius:4px;padding:3px 6px;font-size:11px;font-weight:900;line-height:1;position:absolute;top:6px;left:8px}.input-method-option.active .preferred-badge{background:#ffffff2e}.input-method-option:disabled{cursor:not-allowed;opacity:.62}.url-card{gap:10px;display:grid}.url-card>.section-label{position:absolute;top:10px;left:12px}.url-input{width:100%;min-height:42px;color:var(--text);background:var(--field);font:inherit;border:0;border-radius:4px;outline:none;padding:10px 12px;font-size:14px;font-weight:750}.url-input::placeholder{color:#a9b1c09e}.url-input:focus{box-shadow:inset 0 0 0 1px #8479ffb8}.url-input:disabled{cursor:not-allowed;opacity:.62}.url-import-hint,.url-rights-note{color:var(--muted);font-size:12px;font-weight:750;line-height:1.5}.url-import-hint strong{color:#ffb4b4;font-weight:900}.url-rights-note{color:var(--text)}.mode-options{gap:8px;display:grid}.mode-option{min-height:40px;color:var(--muted);background:var(--field);cursor:pointer;border-radius:4px;align-items:flex-start;gap:10px;padding:10px 12px;display:flex}.mode-card.is-locked .mode-option{cursor:not-allowed;opacity:.68}.mode-option:has(input:checked){color:var(--text);background:#614fff38;box-shadow:inset 0 0 0 1px #8479ff99}.mode-option input{width:16px;height:16px;accent-color:var(--accent);margin:2px 0 0}.mode-option-text{gap:3px;display:grid}.mode-option-text span{font-size:14px;font-weight:800;line-height:1.35}.mode-hint{color:var(--muted);font-size:12px;font-weight:750;line-height:1.35}.locked-note{color:var(--muted);margin-top:10px;font-size:13px;font-weight:800}.primary-action{color:#fff;background:var(--accent);cursor:pointer;border:0;border-radius:6px;width:100%;min-height:40px;font-size:15px;font-weight:850;transition:filter .2s,transform .2s}.primary-action:hover:not(:disabled),.primary-action:focus-visible{filter:brightness(1.08);outline:none;transform:translateY(-1px)}.primary-action:disabled{cursor:not-allowed;opacity:.58}.secondary-action{width:100%;min-height:40px;color:var(--text);cursor:pointer;background:#614fff1f;border:1px solid #8479ff8c;border-radius:6px;font-size:15px;font-weight:850;transition:background .2s,transform .2s}.secondary-action:hover,.secondary-action:focus-visible{background:#614fff38;outline:none;transform:translateY(-1px)}.secondary-action:disabled{cursor:not-allowed;opacity:.55;transform:none}.status-steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;min-height:40px;display:grid}.status-step{min-height:40px;color:var(--muted);background:var(--field);text-align:center;border-radius:4px;justify-content:center;align-items:center;font-size:13px;font-weight:850;display:inline-flex}.status-step.active{color:#fff;background:var(--accent)}.progress-area{color:var(--text);grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;margin-top:12px;font-size:13px;font-weight:850;display:grid}.progress-track{background:var(--field);border-radius:999px;height:12px;overflow:hidden}.progress-fill{border-radius:inherit;background:var(--accent);height:100%;transition:width .12s linear}.processing-error{color:#ffb4b4;margin-top:10px;font-size:13px;font-weight:800}.processing-note{color:var(--text);margin-top:10px;font-size:13px;font-weight:800}.results-list{gap:16px;display:grid}.result-card{place-items:center;min-height:88px;padding:50px 20px 18px;display:grid}.result-content{justify-items:center;gap:14px;width:min(100%,560px);display:grid}.result-button{color:#fff;cursor:pointer;background:linear-gradient(#6d5cff 0%,#5747d7 100%);border:1px solid #a095ffb8;border-radius:5px;justify-content:center;align-items:center;gap:8px;min-width:144px;min-height:38px;font-size:14px;font-weight:850;text-decoration:none;transition:border-color .2s,color .2s,background .2s,box-shadow .2s,filter .2s,transform .2s;display:inline-flex;box-shadow:inset 0 1px #ffffff29,0 10px 22px #1f185e4d}.result-button:before{content:"↓";font-size:16px;line-height:1}.result-button:hover,.result-button:focus-visible{filter:brightness(1.08);border-color:#d5d0ffe6;outline:none;transform:translateY(-1px)}.result-button:disabled{cursor:not-allowed;opacity:.72}.result-button:disabled:hover,.result-button.is-disabled,.result-button.is-disabled:hover{color:var(--muted);box-shadow:none;cursor:not-allowed;opacity:.72;filter:none;background:0 0;border-color:#0000;transform:none}.result-button:disabled:before,.result-button.is-disabled:before{content:"";display:none}.stem-preview{width:100%}.waveform-player{gap:10px;width:100%;display:grid}.waveform-player audio{display:none}.waveform-scrubber{cursor:pointer;background:linear-gradient(#10162257,#0b0f171a),#1f2737c7;border:1px solid #8479ff2e;border-radius:4px;width:100%;height:78px;position:relative;overflow:hidden}.waveform-scrubber:after{content:"";background:#dbe0e88a;border-radius:999px;height:4px;position:absolute;bottom:10px;left:10px;right:10px}.waveform-scrubber:hover,.waveform-scrubber:focus-visible{border-color:#a095ff80;outline:none;box-shadow:inset 0 0 0 1px #8479ff33}.waveform-bars{pointer-events:none;grid-template-columns:repeat(96,minmax(1px,1fr));align-items:center;gap:clamp(1px,.28vw,3px);display:grid;position:absolute;inset:10px 10px 20px}.waveform-bar{border-radius:999px;width:100%;min-height:4px}.waveform-bars-muted .waveform-bar{background:#d2d8e3b3}.waveform-bars-active{transition:clip-path 80ms linear}.waveform-bars-active .waveform-bar{background:#7c6dff;box-shadow:0 0 10px #7c6dff73}.waveform-controls{color:var(--muted);justify-content:center;align-items:center;gap:12px;display:flex}.waveform-play{color:#fff;cursor:pointer;background:#614fff38;border:1px solid #8479ff80;border-radius:5px;width:40px;min-width:40px;height:34px;font-size:15px;font-weight:850;transition:background .2s,border-color .2s,transform .2s}.waveform-play:hover,.waveform-play:focus-visible{background:#614fff6b;border-color:#d5d0ffd9;outline:none;transform:translateY(-1px)}.waveform-time{min-width:88px;color:var(--text);font-variant-numeric:tabular-nums;font-size:13px;font-weight:800}.footer-notes{margin-inline:auto;width:min(100%,1440px);color:var(--text);margin-top:18px;font-size:13px;font-weight:800;line-height:1.7}.footer-notes p+p{margin-top:14px}.footer-notes strong{color:#fff}.credit{color:#a9b1c0b8;text-align:center;font-size:14px;font-weight:600}.credit a{color:#8479ffb8;text-decoration:underline}@media (width<=820px){.workshop{padding-inline:12px;padding-top:18px}.workshop-header{flex-direction:column-reverse;gap:18px}.brand-row{margin-top:0}.language-switch{align-self:flex-end}.work-grid{grid-template-columns:1fr}.file-status{grid-template-columns:1fr;gap:4px}.file-status strong{white-space:normal}.status-steps{grid-template-columns:1fr}}@media (width<=440px){.language-switch{width:100%}.language-switch button{flex:1;justify-content:center}.drop-zone{min-height:214px}}
