:root{--mx-bg:#151719;--mx-panel:#222529;--mx-line:#3c4147;--mx-text:#edf0f2;--mx-muted:#aeb7c0;--mx-accent:#c4ef9e;--mx-shell-height:65px}
.mx-shell nav.mx-tabs{flex-wrap:nowrap}
.mx-workspace[data-lab=dj] button.on,.mx-workspace[data-lab=dj] button.held{background:#28534a!important;color:#bbf9df!important;border-color:#76cdb2!important}
.mx-workspace .track-control{padding:8px 12px;gap:5px}
.mx-workspace .track-control input{padding:6px}
.mx-workspace .track-row,.mx-workspace .lane{min-height:76px}
body.mx-workspace{background:var(--mx-bg);color:var(--mx-text);font-family:system-ui,-apple-system,'Segoe UI',sans-serif;font-size:14px;color-scheme:dark}
.mx-workspace .mx-shell{display:block;position:sticky;top:0;z-index:40;height:auto;padding:0;border:0;border-bottom:1px solid #42474c;background:linear-gradient(#303338,#24272b);box-shadow:0 5px 20px #0003;max-width:none;width:100%}
.mx-shell .mx-shell-row{display:flex;align-items:center;gap:24px;padding:10px 24px;min-height:64px}
.mx-shell .mx-home{display:flex;align-items:center;gap:10px;flex-shrink:0;text-decoration:none;font-weight:850;font-size:20px;letter-spacing:-.8px;color:#f3f5f0}
.mx-home>span>span{color:var(--mx-accent)}.mx-shell .mx-home small{display:block;font:8px system-ui;letter-spacing:1.5px;color:#b4bdc4;margin:2px 0 0;line-height:1.3}.mx-home svg{flex-shrink:0}
.mx-shell nav.mx-tabs{display:flex;gap:4px;align-items:center;overflow:auto;min-width:0;margin:0 auto 0 0;padding:3px;background:#141719;border:1px solid #3c4147;border-radius:9px;font-size:12px}
.mx-tabs a{padding:9px 15px;border-radius:6px;white-space:nowrap;color:#bfc7d0;text-decoration:none;font-weight:600}.mx-tabs a:hover{background:#353a40;color:#fff}.mx-tabs a[aria-current=page]{color:#f4f8ef;background:#495447;box-shadow:inset 0 0 0 1px #7c936c}
.mx-shell-actions{display:flex;gap:15px;align-items:center;flex-shrink:0}.mx-listen{font-size:12px;color:#bfc7d0;text-decoration:none}.mx-workspace .mx-shell button{background:#383d42;border:1px solid #525a61;min-height:32px;padding:6px 11px;color:#dce6db;font-size:11px}
.mx-workspace .mx-transport{position:sticky;top:var(--mx-shell-height);z-index:30;display:flex;flex-wrap:wrap;align-items:center;gap:13px;width:100%;margin:0;padding:12px 24px;background:linear-gradient(#272b2f,#202327);border:0;border-bottom:1px solid #41464d;box-shadow:0 6px 14px #0003;border-radius:0;min-height:60px}
.mx-transport label{margin:0;font-size:11px}.mx-transport input[type=number]{margin:0;width:75px;min-height:35px}.mx-workspace .mx-transport #position{padding:9px 13px;background:#0f1615;border:1px solid #3d5348;border-radius:5px;min-width:100px;color:#a6ddc4;font:12px ui-monospace,monospace}.mx-transport #title{font-size:14px;max-width:220px}.mx-transport #play,.mx-transport #listen{min-width:94px}
.mx-workspace:not([data-lab=dj]) main{max-width:1600px;padding:0 24px;margin:auto}.mx-workspace .intro{padding:22px 0 12px;margin:0;display:block}.mx-workspace .intro h1{font-size:25px;line-height:1.2;letter-spacing:-.8px;margin:8px 0;font-weight:650}.mx-workspace .intro h1 br{display:none}.mx-workspace .intro h1 br:after{content:' '}.mx-workspace .intro h1 em{color:#d0e1c5}.mx-workspace .intro>p,.mx-workspace .intro>div>p{font-size:12px;margin:7px 0;line-height:1.5}.mx-workspace .intro .identity{display:none}.mx-workspace .intro .eyebrow{font-size:9px;color:#91a697;letter-spacing:1.6px}.mx-workspace .private{font-size:10px}.mx-workspace .panel,.mx-workspace .machine,.mx-workspace .workspace{background:var(--mx-panel);border:1px solid var(--mx-line);border-radius:9px;box-shadow:0 8px 20px #0002;margin-top:14px}.mx-workspace .bar,.mx-workspace .pattern-tools,.mx-workspace .topline{padding:15px 18px;gap:12px}.mx-workspace .topline,.mx-workspace .arrangement{background:#272c30}.mx-workspace .export{background:#252c29;padding:18px}
.mx-workspace button:not(.key):not(.step),.mx-workspace .button,.mx-workspace .file-button{border-radius:5px;font-family:inherit;font-size:12px;min-height:34px}.mx-workspace button:not(.key):not(.step):not(.primary):not(.play):not(.recording):not(.recording-active){background:linear-gradient(#353b41,#292f35);border-color:#4b555f;color:#e0e6eb}.mx-workspace button.primary,.mx-workspace .primary{background:linear-gradient(#d0f3ae,#a9cf86);color:#152014;border-color:#c1dfaa}.mx-workspace input:not([type=range]):not([type=checkbox]):not([type=file]),.mx-workspace select{border-radius:5px;background:#171c21;border-color:#46515c;color:#e3e9ee;font-family:inherit;font-size:12px}.mx-workspace input[type=range]{accent-color:#b2d7ba}.mx-workspace :is(button,a,input,select):focus-visible{outline:2px solid #c4ef9e;outline-offset:3px}.mx-workspace [aria-pressed=true]:not(.step){box-shadow:inset 0 0 0 1px #a3c18a}.mx-workspace .hint,.mx-workspace footer,.mx-workspace .micro{color:#a7b2bf}
.mx-workspace .grid .row{gap:6px}.mx-workspace .step{border-radius:4px}.mx-workspace .step[data-level='1']{background:#68bfb3}.mx-workspace .step[data-level='2']{background:#bcdf91}.mx-workspace .track-control{background:#30363d}.mx-workspace .track-row.active .track-control{background:#3a484f}.mx-workspace .track-row{border-color:#434b53}.mx-workspace .lane{background-color:#191d22}.mx-workspace .track-row:nth-of-type(3n) .clip{background:#625c83;border-color:#aba0dc}.mx-workspace .track-row:nth-of-type(3n+1) .clip{background:#446e88;border-color:#8dc1df}.mx-workspace .note-marker{background:#bea1df}.mx-workspace .notes{background:#1d2227}.mx-workspace .keyboard-scroll{background:#181c20}.mx-workspace .wave-area{background:linear-gradient(#192328,#152023)}.mx-workspace .tools section{border-color:#3e4751}.mx-workspace .tools h3{font-size:18px}.mx-workspace .sound-tools{border-color:#3e4751}.mx-workspace .eyebrow{color:#a6beb0}
.mx-workspace.mx-focused .intro,.mx-workspace.mx-focused main>footer,.mx-workspace.mx-focused .hint{display:none}.mx-workspace.mx-focused .panel,.mx-workspace.mx-focused .machine,.mx-workspace.mx-focused .workspace{margin-top:10px}
.mx-workspace #dj-header .mx-dj-actions{padding:8px 24px;background:#202529;border-top:1px solid #41464c;justify-content:flex-end;flex-wrap:wrap}.mx-workspace #dj-header .sound-state{margin-right:auto}.mx-compact-home{display:inline-flex;align-items:center;justify-content:center;min-width:34px;min-height:40px;flex-shrink:0}.mx-compact-home svg{width:25px;height:25px}.mx-workspace[data-lab=dj] #dj-navigation{background:#202529;border-color:#424950}.mx-workspace[data-lab=dj] .deck-panel,.mx-workspace[data-lab=dj] .mixer{background:linear-gradient(#2a3036,#20262b);border-color:#444f57}.mx-workspace[data-lab=dj] .stage{background:radial-gradient(ellipse at 50% 85%,#29363c,#161d23 60%,#151719)}
@media(max-width:1050px){.mx-shell .mx-shell-row{gap:12px;flex-wrap:wrap;padding:10px 16px}.mx-shell .mx-tabs{order:3;width:100%;margin:0}.mx-shell-actions{margin-left:auto}.mx-tabs a{flex:1;text-align:center}.mx-workspace .mx-transport{position:relative;top:auto}.mx-workspace .mx-shell{position:relative}.mx-workspace:not([data-lab=dj]) main{padding:0 14px}}
@media(max-width:600px){.mx-shell .mx-home{font-size:18px}.mx-home svg{width:27px;height:27px}.mx-shell .mx-home small{font-size:7px}.mx-tabs a{padding:9px 10px;font-size:11px}.mx-shell .mx-shell-row{gap:8px;padding:9px 12px}.mx-shell-actions{gap:9px}.mx-listen{font-size:11px}.mx-workspace .mx-transport{padding:10px 12px;gap:10px}.mx-workspace .mx-transport label{flex-wrap:wrap}.mx-workspace .intro h1{font-size:20px}.mx-workspace .intro{padding:14px 0 4px}.mx-workspace .bar,.mx-workspace .pattern-tools,.mx-workspace .topline{padding:12px;gap:10px}.mx-workspace #dj-header .mx-dj-actions{padding:8px 12px}.mx-workspace .mobile-toolbar{flex-wrap:wrap;height:auto;min-height:44px}.mx-workspace .mobile-deck-switch{gap:2px}.mx-workspace .mobile-deck-switch button{min-width:30px;padding:4px 6px}.mx-workspace[data-lab=dj] .mobile-toolbar .record-mix{min-width:60px;padding:4px}.mx-workspace[data-lab=dj] #toggle-chrome{min-width:32px;padding:4px}}