:root{font-family:Inter,DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#dce2e5;background:#151719;color-scheme:dark;font-synthesis:none;--accent:#cce8ed;--muted:#8e989e;--line:#34393d;--pad-gap:clamp(4px,.65vw,9px);--grid-padding:14px}*{box-sizing:border-box}body{margin:0;min-width:320px}button,input{font:inherit}button,a,label{-webkit-tap-highlight-color:transparent}button{cursor:pointer;border:0;background:transparent;color:#aab5bb;font-size:12px;transition:background .15s,color .15s}button:hover{color:#f1f6f8}button:disabled{cursor:default;opacity:.4}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible,.file-picker:focus-within{outline:2px solid var(--accent);outline-offset:4px}button,input{border-radius:10px}[hidden]{display:none!important}.app-header{max-width:1380px;margin:0 auto;padding:25px 30px 22px;display:flex;align-items:center;justify-content:space-between}.brand{display:inline-flex;align-items:center;gap:12px;color:#f0f3f4;text-decoration:none;font-size:25px;font-weight:650;letter-spacing:-1px}.brand-mark{display:grid;grid-template-columns:repeat(4,3px);grid-template-rows:repeat(4,3px);gap:2px}.brand-mark i{width:3px;height:3px;border-radius:1px;background:var(--accent)}.online{display:flex;align-items:center;gap:7px;font-size:11px;color:var(--muted)}.online i{width:6px;height:6px;background:#646e73;border-radius:50%}.online.is-playing i{background:var(--accent);box-shadow:0 0 9px #cce8ed66}main{max-width:1380px;margin:0 auto;padding:0 30px 22px}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:20px;align-items:start}.instrument{border:1px solid #373c40;border-radius:26px;background:linear-gradient(150deg,#282c2f,#222629);padding:20px;box-shadow:0 16px 42px #0003,inset 0 1px #ffffff05;min-width:0}.toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.switch{display:flex;gap:2px;border-radius:20px;background:#181c1e;padding:4px;width:fit-content}.switch button{padding:9px 12px;border-radius:16px;font-size:11px;white-space:nowrap}.switch .chosen{background:#3b4449;color:#f0f4f5;box-shadow:0 1px 3px #0003}.transport{display:flex;gap:6px;align-items:center}.transport button{padding:10px 15px;border-radius:18px;font-size:11px}.play{background:var(--accent);color:#253438;font-weight:600}.play:hover:not(:disabled){background:#e1f6fa;color:#13252a}.stop{background:#333a3e;color:#c3cdd2}.transport-settings{display:flex;gap:20px;align-items:center;margin:12px 2px 16px}.transport-settings label{display:flex;align-items:center;gap:8px;margin:0;font-size:10px;color:#a7b1b7}.transport-settings input{margin:0}.transport-settings .tempo input:not([type=range]){width:61px;padding:7px 6px;text-align:center;font-variant-numeric:tabular-nums}.master-volume input[type=range]{width:80px;margin:0}.master-volume span{min-width:28px;font-size:10px;font-variant-numeric:tabular-nums;color:#819098}.shortcut{margin-left:auto;font-size:10px;color:#7f8a91;white-space:nowrap}kbd{font:10px inherit;border:1px solid #465057;border-radius:5px;padding:3px 7px;margin-right:4px;color:#adb8be}.grid-area{width:100%;margin:auto}.step-ruler{display:grid;grid-template-columns:repeat(16,minmax(0,1fr));gap:var(--pad-gap);padding:0 calc(var(--grid-padding) + 1px) 9px;text-align:center;color:#77858d;font-size:9px;font-variant-numeric:tabular-nums}.step-ruler span{padding:3px 0;border-radius:7px}.step-ruler .current{background:var(--accent);color:#1d3036}.grid{display:grid;grid-template-columns:repeat(16,minmax(0,1fr));gap:var(--pad-gap);padding:var(--grid-padding);background:#101314;border:1px solid #080a0b;border-radius:20px;position:relative;box-shadow:inset 0 2px 8px #0007}.pad{position:relative;aspect-ratio:1;min-width:0;padding:0;border-radius:50%;background:#51585c;box-shadow:inset 0 1px 1px #ffffff0b,0 1px 2px #0005;transition:background .07s,box-shadow .07s}.pad:hover{background:#7b888f}.pad.assigned{background:#bddde4;box-shadow:inset 0 1px 1px #fff4,0 0 8px #a9e5ef0a}.pad.selected{outline:1px solid #d4edf1;outline-offset:3px}.pad.playhead{background:#667a82}.pad.assigned.playhead{background:#d2f2f7}.pad.active{background:#e0fbff;box-shadow:0 0 11px #a0eaff60}.playhead-track{position:absolute;inset:var(--grid-padding);display:grid;grid-template-columns:repeat(16,minmax(0,1fr));gap:var(--pad-gap);pointer-events:none;z-index:2}.playhead-marker{height:100%;border:1px solid #cbf3fb70;border-radius:30px;background:#d4f5ff08;box-shadow:0 0 8px #c5f3ff10}.grid-footer{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:20px 3px 0;font-size:10px;color:#87959d}.separator{color:#4b595f;margin:0 5px}.step-count{font-variant-numeric:tabular-nums;color:#b2bec4}.inspector{min-width:0;border:1px solid var(--line);border-radius:24px;background:#202427;overflow:hidden;display:flex;flex-direction:column;max-height:calc(100svh - 140px)}.source-summary{display:flex;align-items:center;gap:10px;padding:19px 18px}.source-icon{width:32px;height:32px;flex-shrink:0;border-radius:11px;background:#343f44;color:var(--accent);display:grid;place-items:center;font-size:19px}.source-summary>div{min-width:0;flex:1}.source-name{margin:0 0 4px;font-size:12px;color:#d0dade;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.source-meta{font-size:10px;color:#829099}.source-change{font-size:17px;padding:4px}.panel-tabs{display:flex;padding:0 14px;border-bottom:1px solid var(--line);gap:5px}.panel-tabs button{flex:1;padding:12px 5px;font-size:11px;border-radius:0;border-bottom:2px solid transparent;color:#8c9ba3}.panel-tabs .chosen{border-color:var(--accent);color:var(--accent)}.inspector-body{min-height:0;overflow-y:auto;padding:20px 18px;scrollbar-width:thin;scrollbar-color:#4a555c transparent}label{display:block;font-size:11px;color:#aab7be;margin:0 0 12px}input:not([type=range]){display:block;width:100%;margin-top:8px;border:1px solid #3a454b;border-radius:10px;background:#191e21;padding:11px;color:#dce8ed;font-size:12px}input::placeholder{color:#71818a}input[type=range]{display:block;width:100%;height:14px;margin:10px 0 0;padding:0;accent-color:var(--accent);cursor:pointer}.primary,.connect{display:block;width:100%;padding:11px;border-radius:12px;font-size:11px}.primary{background:var(--accent);color:#22363c;font-weight:600}.primary:hover:not(:disabled){color:#122c33;background:#e0f5f9}.connect{border:1px solid #46545c;margin-top:12px;color:#bbd4df;background:#293338}.fine{font-size:10px;line-height:1.6;color:#85949e;margin:10px 0}.divider{display:flex;align-items:center;gap:12px;margin:18px 0;color:#687984;font-size:10px}.divider:before,.divider:after{content:"";height:1px;background:#354047;flex:1}.file-picker{position:relative;display:block;text-align:center;padding:13px 8px;border:1px dashed #51616b;border-radius:12px;cursor:pointer;font-size:11px;color:#bfced6;margin:12px 0 0}.file-picker:hover{background:#2b353b}.file-picker input{position:absolute;width:1px!important;height:1px;opacity:0;padding:0!important;margin:0!important;left:50%;top:50%}.sound-scope{width:100%;margin-bottom:16px}.sound-scope button{flex:1;padding:8px}.sound-heading{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:18px;font-size:11px;color:#c8d5dc}.sound-heading .source-meta{font-size:9px}.sound-control{margin:16px 0}.control-heading{display:flex;align-items:center;justify-content:space-between;gap:8px}.control-heading label{margin:0}.control-heading input:not([type=range]){width:72px;margin:0;padding:6px 8px;text-align:right;font-size:11px}.dim{font-size:10px;color:#72858f;margin-left:3px}.inherit{font-size:9px;padding:4px 0 0;color:#a4c7d3}.inherit:disabled{opacity:.5}.length-presets{display:flex;gap:6px}.length-presets button{flex:1;border:1px solid #3c4b54;padding:7px 5px;border-radius:10px;font-size:10px}.slice-time{font-size:10px;line-height:1.6;color:#a1b8c4;margin:12px 0;font-variant-numeric:tabular-nums}.sound-details{border-top:1px solid #35424a;padding-top:12px;margin-top:14px}.sound-details summary{cursor:pointer;font-size:11px;color:#b5cdd8;padding:3px 0}.clear{display:block;margin:14px auto 0;padding:5px;font-size:10px;color:#8b9ea9}.danger{color:#d3a4a0;margin-top:24px}.section-label{color:#bfcfd8;font-size:12px;margin:0 0 16px}.status-bar{display:flex;align-items:baseline;justify-content:space-between;gap:20px;padding:13px 4px 0;color:#647985;font-size:10px}.status{font-size:11px;line-height:1.6;color:#93a9b6;margin:0;min-width:0}.status-bar>span{white-space:nowrap;font-variant-numeric:tabular-nums}@media(min-width:1500px){main,.app-header{max-width:1320px}}@media(max-width:1000px){.workspace{grid-template-columns:minmax(0,1fr) 260px;gap:14px}.instrument{padding:16px}.toolbar{gap:10px}.switch button{padding:8px 9px}.transport button{padding:9px 12px}.transport-settings{gap:12px}.shortcut{display:none}.inspector-body{padding:16px}.grid-footer{font-size:9px}.grid-footer>span:nth-child(2){display:none}}@media(max-width:760px){main{padding:0 16px 18px}.app-header{padding:20px 18px}.workspace{grid-template-columns:1fr}.grid-area{width:min(100%,560px)}.inspector{max-height:none}.inspector-body{max-height:440px}.source-summary{padding:14px 16px}.panel-tabs{padding:0 12px}.shortcut{display:inline}.instrument{padding:16px}.transport-settings{margin:16px 0}.grid-footer>span:nth-child(2){display:inline}.brand{font-size:23px}.online{font-size:10px}}@media(max-width:420px){:root{--pad-gap:4px;--grid-padding:10px}.app-header{padding:17px 16px}.instrument{padding:12px;border-radius:22px}.toolbar{gap:10px}.switch button{font-size:10px;padding:8px 10px}.transport button{padding:8px 12px}.transport{margin-left:auto}.shortcut{display:none}.transport-settings{gap:18px}.master-volume input[type=range]{width:90px}.grid{border-radius:15px}.pad.selected{outline-offset:2px}.grid-footer{font-size:8px;margin-top:16px}.step-ruler{font-size:8px}.inspector{border-radius:22px}.status-bar>span{display:none}}.instrument{background:#252a2d;box-shadow:none;border-radius:16px}.grid{border-radius:8px;box-shadow:none}.pad{border-radius:4px;box-shadow:none;transition:none;background:#50595e}.pad.assigned{background:#bddde4;box-shadow:none}.pad.active{background:#e0fbff;box-shadow:none}.pad.selected{outline-offset:2px}.playhead-marker{border-radius:4px;box-shadow:none;background:#d4f5ff08}.grid-area{max-width:none}.mod-heading{display:flex;align-items:center;justify-content:space-between;font-size:12px}.mod-enable{display:flex;align-items:center;gap:7px;margin:0}.mod-enable input[type=checkbox]{width:16px;height:16px;margin:0;accent-color:var(--accent)}select{display:block;width:100%;margin-top:8px;padding:9px 8px;border:1px solid #3a454b;border-radius:9px;background:#191e21;color:#dce8ed;font:11px inherit}.mod-pair{display:flex;gap:10px}.mod-pair label{min-width:0;flex:1}.mod-depth span{float:right;color:var(--accent)}select:focus-visible{outline:2px solid var(--accent);outline-offset:3px}@media(max-width:760px){.grid-area{width:100%}}:root{--surface-background: #111719;--surface-panel: #1F242C;--surface-elevated: #252C33;--surface-grid: #0D1214;--pad-inactive: #4E585F;--border: #39444B;--text-primary: #F1F4F5;--text-secondary: #93A0A6;--text-muted: #6F7B81;--accent: #93A0A6;--muted: var(--text-muted);--line: var(--border);--playhead-border: #D6EAF2;--playhead-fill: rgba(214, 234, 242, .1);--selected-border: #EAF7FA;color:var(--text-primary);background:var(--surface-background)}body{background:var(--surface-background);color:var(--text-primary)}button{color:var(--text-secondary)}button:hover,.brand,.source-name,.sound-heading,.section-label{color:var(--text-primary)}.instrument,.inspector{background:var(--surface-panel);border-color:var(--border)}.switch,input:not([type=range]),select{background:var(--surface-background);border-color:var(--border);color:var(--text-primary)}.switch .chosen,.play,.primary{background:var(--surface-elevated);color:var(--text-primary)}.play:hover:not(:disabled),.primary:hover:not(:disabled){background:var(--border);color:var(--text-primary)}.stop,.connect{background:var(--surface-elevated);border-color:var(--border);color:var(--text-secondary)}.transport-settings label,label,.source-meta,.panel-tabs button,.fine,.status,.grid-footer,.online,.step-ruler{color:var(--text-secondary)}.shortcut,.dim,.inherit,.clear,.step-count{color:var(--text-muted)}.step-ruler .current{background:var(--surface-elevated);color:var(--text-primary)}.grid{background:var(--surface-grid);border-color:var(--border)}.pad,.pad:hover{background:var(--pad-inactive)}.pad.assigned,.pad.active{background:var(--row-color)}.pad.selected{outline-color:var(--selected-border)}.playhead-marker{border-color:var(--playhead-border);background:var(--playhead-fill);box-shadow:none}.source-icon{background:var(--surface-elevated);color:var(--text-secondary)}.panel-tabs .chosen{border-color:var(--text-secondary);color:var(--text-primary)}input[type=range]{accent-color:var(--text-secondary)}.file-picker,.length-presets button{border-color:var(--border);color:var(--text-secondary)}.file-picker:hover{background:var(--surface-elevated)}.divider:before,.divider:after,.sound-details{border-color:var(--border)}select:focus-visible,input:focus-visible{outline-color:var(--text-secondary)}.pad.dragging{opacity:.45}.pad.drop-target{outline:1px dashed var(--text-primary);outline-offset:1px}.pad{touch-action:none;-webkit-user-select:none;user-select:none}.storage-manager{margin-top:1rem}.storage-content{margin-top:.6rem;padding:.65rem;border:1px solid var(--border);border-radius:6px;background:var(--surface-background)}.storage-summary,.storage-track{display:flex;align-items:center;justify-content:space-between;gap:.6rem;padding:.45rem 0;border-bottom:1px solid var(--border);color:var(--text-secondary);font-size:.8rem}.storage-track:last-child{border-bottom:0}.storage-title{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-primary)}.storage-track small{display:block;color:var(--text-muted);font-size:.72rem}.storage-summary button,.storage-track button{flex:0 0 auto}.storage-track .danger{color:#c6616c}.source-deck{background:var(--surface-panel);border:1px solid var(--border);border-radius:12px;padding:16px 20px}.source-deck-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:14px}.source-summary{padding:0;min-width:0;flex:1}.source-name{font-size:13px}.source-meta{font-size:11px}.session-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;scroll-margin-top:160px}.session-actions .section-label{margin:0 4px 0 0;color:var(--text-muted);font-size:10px}.session-actions .connect,.session-actions .file-picker{width:auto;margin:0;padding:10px 12px;border:1px solid var(--border);border-radius:6px}.youtube-import{display:flex;align-items:end;gap:10px}.youtube-import label{flex:1;margin:0;min-width:0}.youtube-import input{margin-top:6px;border-radius:6px}.youtube-import .primary{width:auto;min-height:40px;padding:10px 20px;border:1px solid var(--border);border-radius:6px}.source-extras{display:flex;align-items:center;gap:12px;margin-top:10px}.source-extras .file-picker,.source-extras .connect{width:auto;padding:6px 0;margin:0;border:0;background:none;text-align:left;font-size:10px}.storage-manager{margin-top:0}.storage-manager>.connect{width:auto;background:none;margin:0;padding:6px 0;border:0;text-align:left;font-size:10px}.source-deck>.storage-manager{margin-top:0}.status-bar{padding:10px 2px 14px}.performance-bar{position:sticky;top:0;z-index:5;background:var(--surface-background);padding:12px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);margin-bottom:18px}.performance-bar .toolbar{flex-wrap:nowrap}.transport button{min-height:40px;border-radius:6px}.transport .play{border:1px solid #66827a;background:#30453e;color:#d8eee4}.transport .clear-pattern{margin-left:8px;border:1px solid #78565b;color:#dda6ab}.transport-settings{margin:10px 0 0}.control-jumps{display:flex;gap:6px;margin-left:auto}.control-jumps a{padding:8px;color:var(--text-secondary);text-decoration:none;font-size:11px;border-radius:4px}.control-jumps a:hover{color:var(--text-primary);background:var(--surface-elevated)}.workspace{grid-template-columns:minmax(0,1fr) 320px;gap:20px}.instrument{padding:16px;border-radius:12px}.inspector{border:0;background:none;border-radius:0;max-height:none;overflow:visible;gap:16px}.inspector>section{padding:16px;border:1px solid var(--border);border-radius:12px;background:var(--surface-panel);scroll-margin-top:145px}.source-deck{scroll-margin-top:145px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}h2{margin:0;font-size:13px;font-weight:600;letter-spacing:.2px;color:var(--text-primary)}.section-heading>span{font-size:10px;color:var(--text-muted)}.sound-scope{margin-bottom:12px;border-radius:6px}.sound-scope button{border-radius:4px}.sound-heading{margin-bottom:14px}.sound-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 16px}.sound-control{margin:0;min-width:0}.control-heading{gap:4px}.control-heading input:not([type=range]){width:54px;padding:6px 3px;border-radius:4px}.control-heading label,.control-heading .dim{font-size:10px}.sound-control input[type=range]{margin-top:10px}.length-presets{margin-top:18px}.length-presets button{border-radius:5px}.sound-actions{display:flex;gap:10px;align-items:center}.sound-actions .connect{flex:1;width:auto;margin:0;padding:10px 8px;border-radius:6px}.sound-actions .clear{flex:1;margin:0;color:var(--text-secondary);line-height:1.5}.output-test.connect{width:auto;margin:0;padding:8px 0;border:0;background:none;font-size:10px;align-self:flex-start}.session-note{color:var(--text-muted);font-size:10px;margin:20px 0 0}@media(max-width:1050px){.workspace{grid-template-columns:minmax(0,1fr) 290px;gap:14px}.instrument{padding:12px}.inspector>section{padding:12px}}@media(max-width:800px){.workspace{grid-template-columns:1fr}.inspector{display:grid;grid-template-columns:1fr 1fr;align-items:start}.output-test.connect{grid-column:1 / -1}}@media(max-width:560px){main{padding-inline:12px}.app-header{padding:18px 14px}.source-deck{padding:12px}.source-deck-heading{display:block;margin-bottom:14px}.session-actions{margin-top:12px}.session-actions .connect,.session-actions .file-picker{padding:8px 10px}.youtube-import{gap:8px;flex-wrap:wrap}.youtube-import label{flex-basis:100%}.youtube-import .primary{width:100%}.performance-bar .toolbar{flex-wrap:wrap;gap:8px}.performance-bar .switch{width:100%}.performance-bar .switch button{flex:1;min-height:34px}.transport{width:100%;margin:0;gap:8px}.transport button{flex:1;padding:8px 6px;min-height:42px;font-size:11px;white-space:nowrap}.transport .clear-pattern{margin-left:0}.transport-settings{flex-wrap:wrap;gap:10px 16px}.control-jumps{width:100%;margin:0;justify-content:space-between;border-top:1px solid var(--border)}.control-jumps a{padding:9px 8px 2px}.inspector{display:flex}.inspector>section{padding:16px;scroll-margin-top:215px}.source-deck,.session-actions{scroll-margin-top:215px}.sound-controls{gap:18px 22px}.control-heading input:not([type=range]){width:64px}.control-heading label{font-size:11px}.performance-bar{margin-bottom:12px}}.brand{gap:14px;font-size:38px;letter-spacing:-1.4px}.brand-mark{grid-template-columns:repeat(4,8px);grid-template-rows:repeat(4,8px);gap:3px}.brand-mark i{width:8px;height:8px;border-radius:2px}@media(max-width:900px){.workspace{grid-template-columns:1fr;gap:14px}.instrument{padding:16px}.inspector{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}.inspector>section{min-width:0}.output-test.connect{grid-column:1 / -1}}@media(max-width:560px){body{min-width:320px}main{padding-inline:max(12px,env(safe-area-inset-left));padding-bottom:max(18px,env(safe-area-inset-bottom))}.app-header{padding:15px max(14px,env(safe-area-inset-right)) 15px max(14px,env(safe-area-inset-left))}.brand{gap:10px;font-size:32px}.brand-mark{grid-template-columns:repeat(4,7px);grid-template-rows:repeat(4,7px);gap:2px}.brand-mark i{width:7px;height:7px}.online{max-width:42%;font-size:10px}.online:not(.is-playing){text-align:right}.workspace{min-width:0}.instrument{padding:10px}.grid{padding:8px;gap:3px;border-radius:8px}.step-ruler{padding:0 9px 6px;gap:3px;font-size:8px}.playhead-track{inset:8px;gap:3px}.pad{border-radius:3px}.pad.selected{outline-offset:1px}.grid-footer{gap:5px;font-size:8px}.grid-footer>span:first-child{flex:0 0 auto}.grid-footer .step-count{flex:0 0 auto}.inspector{display:flex;gap:12px}.inspector>section{padding:14px}.sound-controls{gap:16px 12px}.source-deck-heading{gap:10px}.session-actions{gap:6px}.session-actions .section-label{width:100%}.session-actions .connect,.session-actions .file-picker{flex:1 1 auto;text-align:center}.youtube-import input,.inspector input:not([type=range]),.inspector select{font-size:16px}input[type=range]{min-height:28px}.control-jumps a{min-height:38px;display:grid;place-items:center}.performance-bar{padding:8px 0}.performance-bar .toolbar{gap:6px}.transport button{min-height:40px}}@media(max-width:380px){.app-header{padding-inline:12px}main{padding-inline:10px}.brand{font-size:30px}.brand-mark{grid-template-columns:repeat(4,6px);grid-template-rows:repeat(4,6px);gap:2px}.brand-mark i{width:6px;height:6px}.online{font-size:9px}.grid{padding:7px;gap:2px}.step-ruler{padding-inline:8px;gap:2px;font-size:7px}.playhead-track{inset:7px;gap:2px}.grid-footer{font-size:7px}.sound-controls{grid-template-columns:minmax(0,1fr);gap:13px}.control-heading input:not([type=range]){width:76px}}@media(max-width:900px)and (orientation:landscape)and (max-height:500px){.app-header{padding-block:8px}.brand{font-size:24px}.brand-mark{grid-template-columns:repeat(4,5px);grid-template-rows:repeat(4,5px);gap:2px}.brand-mark i{width:5px;height:5px}.performance-bar{padding:6px 0}.performance-bar .toolbar{flex-wrap:nowrap}.performance-bar .switch{width:auto}.transport{width:auto;margin-left:auto}.transport-settings{flex-wrap:nowrap;margin-top:5px}.control-jumps{width:auto;border:0}.control-jumps a{padding-block:4px}.workspace{grid-template-columns:minmax(0,1fr) minmax(260px,.8fr)}.inspector{display:flex}.youtube-import input,.inspector input:not([type=range]),.inspector select{font-size:16px}}.session-actions .loop-export{margin-top:0;color:var(--text-primary);background:var(--surface-elevated)}.session-actions .loop-export:disabled{opacity:.45}@media(max-width:560px){.session-actions .loop-export{flex:1 1 40%;padding:9px 6px;font-size:10px}}.grid-action{display:flex;align-items:center;gap:8px;margin:0;font-size:10px}.grid-action select{width:auto;margin:0;padding:8px;min-height:36px}@media(max-width:560px){.grid-action{flex-wrap:wrap;gap:4px}.grid-action select{font-size:16px;max-width:150px}}@media(min-width:1101px){.workspace{grid-template-columns:minmax(0,1fr) minmax(340px,390px);gap:18px;align-items:start}.instrument{display:block;min-width:0;padding:12px}.performance-bar{margin-bottom:12px;padding:8px 0}.performance-bar .toolbar{gap:6px}.transport{gap:3px}.transport button{padding-inline:9px}.transport .clear-pattern{margin-left:2px}.transport-settings{gap:10px;margin-top:6px}.control-jumps{display:none}.grid-area{width:min(100%,clamp(320px,calc(100svh - 390px),900px))}.grid-footer{margin-top:12px}.inspector{display:flex;position:sticky;top:12px;flex-direction:column;gap:10px;max-height:calc(100svh - 24px);overflow-y:auto;overscroll-behavior:contain;padding-right:4px;scrollbar-width:thin;scrollbar-color:var(--border) transparent}.inspector>section,.inspector>.source-deck{padding:12px}.inspector>.source-deck{flex:0 0 auto}.inspector .source-deck-heading{display:block;margin-bottom:8px}.inspector .source-summary{margin-bottom:8px}.inspector .session-actions{gap:5px}.inspector .session-actions .section-label{flex-basis:100%}.inspector .session-actions .connect,.inspector .session-actions .file-picker{flex:1 1 42%;justify-content:center;text-align:center;padding:7px 6px;font-size:10px}.inspector .youtube-import{display:grid;grid-template-columns:1fr;gap:7px}.inspector .youtube-import .primary{width:100%;padding:9px}.inspector .source-extras{gap:8px;flex-wrap:wrap}.inspector source-editor{display:block;padding:12px;border:1px solid var(--border);border-radius:12px;background:var(--surface-panel)}.inspector .source-editor{margin:0}.inspector .source-editor header{display:block}.inspector .source-selectors{margin-top:8px;gap:5px}.inspector .source-selectors label{flex:1;min-width:0;display:block;font-size:9px}.inspector .source-selectors select{width:100%;margin-top:4px;font-size:11px}.inspector .source-editor .waveform-surface{height:104px}.inspector .source-editor .editor-controls{gap:6px}.inspector .source-editor .editor-controls button{padding:5px 6px;font-size:10px}.inspector .source-editor .slice-modes{gap:1px}.inspector .source-editor .slice-modes>span{flex-basis:100%}.inspector .source-editor .hint{font-size:9px}}@media(min-width:801px)and (max-width:1100px){.workspace{grid-template-columns:1fr}.instrument{display:block}.grid-area{width:min(100%,680px)}.inspector{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}.inspector>*{min-width:0}.inspector>.source-deck{grid-column:1 / -1}.inspector>source-editor{grid-column:1 / -1}.inspector .output-test{grid-column:1 / -1}}@media(max-width:900px){.source-editor{margin-bottom:12px;padding-bottom:12px}.source-editor .waveform-surface{height:clamp(88px,14svh,118px)}.source-editor .editor-controls{margin-top:7px}.source-editor .hint{margin-top:6px}}@media(max-width:560px){.source-editor{margin-bottom:10px;padding-bottom:10px}.source-editor header{align-items:flex-start}.source-editor .source-selectors{gap:5px}.source-editor .source-selectors label{gap:4px}.source-editor .source-selectors select{min-height:32px;padding:5px;font-size:11px}.source-editor .button-group{gap:2px}.source-editor .editor-controls{gap:6px}.source-editor .editor-controls button{min-height:30px;padding:5px 6px;font-size:10px}.source-editor .slice-modes{flex-wrap:nowrap}.source-editor .slice-modes>span{margin-right:0}.source-editor .slice-range{font-size:10px}.source-editor .hint{font-size:9px}.source-editor .waveform-surface{height:96px}}main,.app-header{width:100%;max-width:none;margin-inline:0;padding-inline:clamp(16px,2vw,36px)}@media(max-width:560px){main{padding-inline:max(12px,env(safe-area-inset-left))}.app-header{padding-inline:max(14px,env(safe-area-inset-left)) max(14px,env(safe-area-inset-right))}}@media(max-width:380px){main{padding-inline:10px}.app-header{padding-inline:12px}}@media(min-width:801px)and (max-width:1100px){.workspace{grid-template-columns:1fr}.grid-area{width:100%}.inspector{position:static;max-height:none;overflow:visible;padding-right:0}}@media(min-width:1101px)and (max-width:1524px){.workspace{grid-template-columns:minmax(0,1fr)}.grid-area{width:100%}.inspector{position:static;max-height:none;overflow:visible;padding-right:0}}@media(min-width:1525px){.workspace{grid-template-columns:minmax(0,1fr) minmax(460px,1fr)}.grid-area{width:100%}}@media(min-width:801px){.grid-area{width:min(100%,clamp(320px,calc(100svh - 250px),1100px))}.inspector>.performance-bar{position:sticky;top:0;z-index:8;width:100%;margin:0 0 2px;padding:12px;border:1px solid var(--border);border-radius:12px;background:var(--surface-panel)}}@media(min-width:801px)and (max-width:1100px){.inspector>.performance-bar{grid-column:1 / -1}}.performance-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}.performance-heading>span{color:var(--text-muted);font-size:10px}.inspector .performance-bar .toolbar{align-items:flex-end;gap:8px}.inspector .performance-bar .grid-action{display:block;flex:1 1 120px;min-width:0}.inspector .performance-bar .grid-action select{width:100%;margin-top:6px;min-height:38px;padding:8px}.inspector .performance-bar .transport{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:auto;margin:0;gap:6px}.inspector .performance-bar .transport button{min-width:0;min-height:38px;margin:0;padding:8px 7px;border-radius:6px;font-size:10px}.inspector .performance-bar .transport .clear-pattern{grid-column:1 / -1}.inspector .performance-bar .transport-settings{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:12px;margin:12px 0 0}.inspector .performance-bar .tempo{margin:0}.inspector .performance-bar .master-volume{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:7px;margin:0}.inspector .performance-bar .master-volume input[type=range]{width:100%;margin:0}.inspector .performance-bar .control-jumps{display:none}@media(min-width:1101px)and (max-width:1524px){.inspector>.performance-bar{width:100%;align-self:stretch}.inspector .performance-bar .toolbar{align-items:center;flex-wrap:nowrap}.inspector .performance-bar .grid-action{display:flex;flex:0 0 auto;align-items:center;gap:8px;white-space:nowrap}.inspector .performance-bar .grid-action select{width:auto;min-width:150px;margin:0}.inspector .performance-bar .transport{display:flex;margin-left:auto}.inspector .performance-bar .transport .clear-pattern{grid-column:auto}.inspector .performance-bar .transport button{font-size:11px}.inspector .performance-bar .transport-settings{display:flex;gap:20px}.inspector .performance-bar .master-volume{display:flex;gap:8px}}@media(min-width:1525px){.inspector .performance-bar .toolbar{align-items:flex-end;flex-wrap:nowrap}.inspector .performance-bar .grid-action{display:flex;flex:0 0 auto;align-items:center;gap:8px;white-space:nowrap}.inspector .performance-bar .grid-action select{width:auto;min-width:140px;margin:0}.inspector .performance-bar .transport{display:flex;margin-left:auto}.inspector .performance-bar .transport .clear-pattern{grid-column:auto}.inspector .performance-bar .transport button{font-size:11px}.inspector .performance-bar .transport-settings{display:flex;gap:20px}.inspector .performance-bar .master-volume{display:flex;gap:8px}.inspector .youtube-import{grid-template-columns:minmax(0,1fr) auto}.inspector .youtube-import .primary{width:auto}}@media(max-width:560px){.inspector .performance-bar .control-jumps{display:flex;grid-column:1 / -1;width:100%;margin:0;justify-content:space-between;border-top:1px solid var(--border)}}.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;border:0!important;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.status-bar{align-items:center;padding-top:6px;padding-bottom:10px}.load-audio,.load-source .load-file{background:var(--text-primary);color:var(--surface-background);font-weight:600}.load-audio:hover:not(:disabled),.load-source .load-file:hover:not(:disabled){background:#fff;color:var(--surface-background)}.load-audio{flex-shrink:0;padding:8px 16px;border-radius:8px;font-size:12px;white-space:nowrap}.load-audio.subtle{background:transparent;border:1px solid var(--border);color:var(--text-secondary);font-weight:500}.load-audio.subtle:hover:not(:disabled){background:var(--surface-elevated);color:var(--text-primary)}.load-source{margin:2px 0 4px}.load-source .load-file{width:100%;min-height:46px;border-radius:8px;font-size:13px}.load-source .fine{margin:8px 0 0}.source-deck .divider{margin:16px 0 10px}.drop-overlay{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:16px;background:#0d1214d9;pointer-events:none}.drop-overlay span{padding:28px 40px;border:2px dashed var(--text-primary);border-radius:16px;background:var(--surface-panel);color:var(--text-primary);font-size:16px;text-align:center}@media(max-width:420px){.load-audio{padding:7px 12px;font-size:11px}}.source-deck>.session-actions{margin-top:18px;padding-top:14px;border-top:1px solid var(--border)}
