.studio-modes{display:flex;gap:8px;margin:0 0 20px;padding:6px;border:1px solid #334b66;border-radius:14px;background:#091a2b;width:fit-content;max-width:100%}.studio-modes button{min-height:44px;border-radius:9px;padding:10px 18px;background:transparent;color:#b4c6e1;border:1px solid transparent;font-size:13px;cursor:pointer}.studio-modes button[aria-pressed=true]{background:#294971;border-color:#739bd7;color:#edf5ff}.single-edits{margin-top:24px;padding-top:20px;border-top:1px solid #2b405d}.edit-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;align-items:end;margin-top:16px}.edit-actions{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-top:16px}.preset-toolbar{display:flex;gap:20px;align-items:end;justify-content:space-between;margin:14px 0}.preset-toolbar label{min-width:180px}.preset-toolbar p{margin:0}.preset-amount{margin-top:20px;grid-template-columns:auto minmax(100px,1fr) auto;align-items:center;gap:16px!important}.remix-studio-page .preset-amount input{width:100%;min-width:0}.mashup-panel{margin-bottom:24px}.mix-toolbar{display:flex;align-items:end;gap:14px;flex-wrap:wrap;margin:20px 0}.mix-toolbar label{flex:1 1 130px;min-width:0}.mix-toolbar button{flex:0 0 auto}.mix-axis{display:flex;justify-content:space-between;color:#a9bfdf;font:12px ui-monospace,monospace;margin:20px 0 8px;padding:0 8px}.mix-lane{border:1px solid #2e4666;border-radius:18px;background:#091a2c;margin-bottom:16px;padding:20px;min-width:0}.mix-lane header{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}.mix-lane header b{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#254873;color:#d5e7ff;font-weight:500}.mix-lane header strong{font-size:15px;font-weight:500;flex:1;min-width:0;overflow-wrap:anywhere}.mix-lane header small{font-size:12px;color:#b3c7e3}.mix-lane-source{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}.mix-library-pick{display:flex;flex-direction:column;gap:8px}.mix-library-pick>div{display:flex;gap:8px}.mix-library-pick select{min-width:0;flex:1}.mix-library-pick button{flex-shrink:0}.mix-lane-upload input{padding:8px!important;font-size:12px!important}.mix-lane-config{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:16px}.mix-lane-config label{font-size:12px}.mix-lane-config .lab-check{margin:0;align-self:end;height:44px;align-items:center}.mix-lane-config input[type=range]{width:100%;min-width:0}.mix-lane-config output{font:12px ui-monospace,monospace;color:#d0e2ff}.mix-timeline{position:relative;overflow:hidden;border:1px solid #304764;border-radius:10px;background:repeating-linear-gradient(90deg,#071422 0 calc(12.5% - 1px),#263e5d 12.5%);height:68px}.mix-clip{position:absolute;top:5px;bottom:5px;display:flex;align-items:center;gap:1px;min-width:3px;background:#244b774d;border:1px solid #6c9ad7;border-radius:6px;padding:7px;overflow:hidden}.mix-clip span{flex:1;min-width:1px;background:#97bbec;border-radius:1px}.mix-lane[data-muted=true] .mix-clip{opacity:.35}.mix-empty{position:absolute;inset:0;display:grid;place-items:center;color:#b0c3df;font-size:12px}.mix-export{display:grid;grid-template-columns:1fr 1fr;gap:28px;border-top:1px solid #304764;padding-top:24px;margin-top:24px}.mix-export p{font-size:12px!important}.mix-export audio{color-scheme:dark}.mix-progress-busy{opacity:.8}.mix-lane-actions{display:flex;align-items:center;gap:8px;margin-top:12px;flex-wrap:wrap}.mix-lane-actions button{font-size:12px!important}.remix-studio-page [data-studio-mode]:disabled{opacity:.5}.studio-single-only[hidden]{display:none!important}
@media(max-width:900px){.mix-lane-config{grid-template-columns:repeat(3,minmax(0,1fr))}.mix-export{grid-template-columns:1fr}.edit-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.mix-overview{display:grid;gap:10px;margin-bottom:24px}.mix-overview-row{display:grid;grid-template-columns:190px minmax(0,1fr);gap:14px;align-items:center}.mix-overview-label{display:grid;grid-template-columns:26px 1fr 32px 32px;gap:6px;align-items:center;min-width:0}.mix-overview-label b{color:#afccff;font-weight:500}.mix-overview-label small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#d5e3f8;font-size:12px}.mix-overview-label button{border:1px solid #355375;border-radius:8px;background:#0d2037;color:#bfd4f3;min-width:32px;min-height:44px;font-size:12px;cursor:pointer}.mix-overview-label button[aria-pressed=true]{background:#93b9f4;color:#0c1d34}.mix-overview .mix-clip{cursor:grab;touch-action:none}.mix-overview-row[data-muted=true] .mix-clip{opacity:.35}
.mix-axis{padding-left:204px}.mix-lane-details{margin-top:12px}.mix-lane-details summary{min-height:44px;display:flex;align-items:center;color:#b9d2f5;font-size:13px;cursor:pointer}.mix-lane-details summary::after{content:'+';margin-left:auto;font-size:18px}.mix-lane-details[open] summary::after{content:'−'}.mix-lane-details[open] summary{margin-bottom:12px}.mix-lane-details summary:focus-visible{outline:2px solid #9bbffc;outline-offset:3px}
.mix-overview-label{grid-template-columns:26px 1fr 44px 44px}.mix-overview-label button{min-width:44px}.remix-studio-page input[type=range]{min-height:44px}
@media(max-width:600px){.mix-overview-row{grid-template-columns:1fr;gap:4px}.mix-overview-label{grid-template-columns:26px 1fr 44px 44px}.mix-overview .mix-timeline{height:58px}.mix-overview .mix-empty{font-size:11px}.mix-axis{padding-left:0}}
@media(max-width:600px){.studio-modes{width:100%}.studio-modes button{flex:1;padding:10px}.mix-lane{padding:16px}.mix-lane-source{grid-template-columns:1fr}.mix-lane-config{grid-template-columns:repeat(2,minmax(0,1fr))}.mix-toolbar{gap:10px}.mix-toolbar button{width:100%}.edit-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.preset-toolbar{align-items:start;flex-direction:column;gap:12px}.preset-toolbar label{width:100%}.mix-export{gap:20px}.mix-lane header small{flex:1 1 100%}.single-edits .remix-panel-head{align-items:start}.mix-lane-actions button{flex:1}.mix-axis{font-size:10px}.preset-amount{font-size:12px!important}.mix-library-pick>div{flex-wrap:wrap}.mix-library-pick>div select{flex:1 1 100%}}