@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800&family=DM+Sans:wght@400;500;600;700&display=swap');
:root{--bg:#111111;--panel:#1b1b1b;--line:#323232;--muted:#9b9b9b;--text:#eeeeee;--pink:#818181;--mint:#cbcbcb;font-family:'DM Sans',system-ui,sans-serif;color:var(--text);background:var(--bg);color-scheme:dark}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,.button{border:1px solid #3e3e3e;background:#2a2a2a;color:var(--text);border-radius:5px;min-height:36px;padding:8px 12px;cursor:pointer;text-decoration:none;font-size:12px;font-weight:600;transition:background .15s,border-color .15s}button:hover,.button:hover{background:#393939;border-color:#808080}button:disabled{opacity:.38;cursor:not-allowed}button:focus-visible,a:focus-visible{outline:2px solid var(--mint);outline-offset:3px}input:focus-visible,select:focus-visible{outline:2px solid var(--mint)}button.active,button[aria-pressed=true]{color:var(--accent,var(--pink));border-color:var(--accent,var(--pink));background:color-mix(in srgb,var(--accent,var(--pink)) 12%,#1d1d1d)}.primary{background:var(--text);color:#151515;border-color:var(--text)}.primary:hover{background:#cfcfcf}.primary.active{background:var(--pink);color:#111111}.muted{color:var(--muted)}header{height:80px;display:flex;align-items:center;justify-content:space-between;padding:0 32px;border-bottom:1px solid var(--line);gap:14px}.brand{font-family:'Barlow Condensed',Impact,sans-serif;font-size:28px;font-weight:800;letter-spacing:1px;display:flex;align-items:center;gap:5px;text-decoration:none;color:var(--text)}.brand>span:not(.brand-icon){color:var(--pink)}.brand-icon{font-size:39px;margin-right:7px}.brand small{font-family:'DM Sans',sans-serif;font-size:8px;letter-spacing:2px;border-left:1px solid #4c4c4c;padding-left:16px;margin-left:15px;max-width:95px;line-height:1.8;color:var(--muted)}.header-actions,.mini-actions{display:flex;align-items:center;gap:9px}.status{font-size:9px;letter-spacing:1.6px;color:var(--muted);margin-right:12px}main{max-width:1600px;margin:auto;padding:0 28px}.workspace-bar{height:65px;display:flex;align-items:center;justify-content:space-between;font-size:10px;font-weight:700;letter-spacing:1.8px}.live-dot,.record-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--mint);margin-right:9px}.record-dot{background:#858585}.deck-grid{display:grid;grid-template-columns:minmax(0,1fr) 252px minmax(0,1fr);gap:12px}.deck,.mixer,.panel{background:var(--panel);border:1px solid var(--line);border-radius:7px;overflow:hidden}.deck{padding:17px}.deck-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.deck-letter{display:flex;align-items:center;gap:10px;font-size:10px;font-weight:600;letter-spacing:1.6px}.deck-letter strong{display:grid;place-items:center;width:30px;height:30px;background:color-mix(in srgb,var(--accent) 15%,transparent);color:var(--accent);border-radius:5px;font-size:18px}.track-title{font-size:17px;font-weight:600;margin:20px 0 5px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.track-subtitle{color:var(--muted);font-size:10px;margin-bottom:16px}.wave{width:100%;height:76px;background:#121212;border-radius:4px;display:block;cursor:crosshair;touch-action:pan-y}.overview{height:26px;margin-top:4px;opacity:.8}.time-row{display:flex;justify-content:space-between;margin:8px 0;font:12px ui-monospace,monospace;color:var(--muted)}.time-row .time{color:var(--text)}.platter-area{display:grid;grid-template-columns:1fr auto;gap:18px;align-items:center;padding:10px 4px}.jog{--rotation:0deg;width:142px;height:142px;display:grid;place-items:center;border-radius:50%;border:5px solid #343434;background:repeating-radial-gradient(circle at center,#222222 0,#222222 2px,#262626 3px,#222222 4px);position:relative;cursor:ew-resize;touch-action:none;box-shadow:0 0 0 2px #111111;margin:auto}.jog:before{content:'';position:absolute;inset:5px;border:2px solid var(--accent);border-radius:50%;opacity:.65}.jog:after{content:'';position:absolute;width:3px;height:12px;background:var(--accent);left:calc(50% - 1px);top:8px;transform-origin:1px 57px;transform:rotate(var(--rotation))}.jog-inner{width:76px;height:76px;border-radius:50%;background:#161616;border:1px solid #3d3d3d;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}.jog-inner b{font-family:'Barlow Condensed',sans-serif;font-size:29px;line-height:1.1;color:var(--accent)}.jog-inner span{font-size:8px;letter-spacing:2px;color:var(--muted)}.tempo{display:flex;flex-direction:column;gap:7px;width:92px}.tempo label{font-size:9px;letter-spacing:1px;color:var(--muted)}.tempo input[type=number]{font:20px 'Barlow Condensed',sans-serif;width:100%;background:transparent;border:0;border-bottom:1px solid var(--line);padding:4px;color:var(--text)}.tempo output{font:11px ui-monospace,monospace;text-align:center}.tempo small{font-size:9px;color:var(--muted)}input[type=range]{accent-color:var(--accent,var(--pink));width:100%;height:24px;cursor:pointer;margin:0}.transport{display:grid;grid-template-columns:1fr 1fr 1fr;gap:7px;margin:12px 0}.transport button{min-height:43px}.play{background:color-mix(in srgb,var(--accent) 15%,#191919);color:var(--accent);border-color:color-mix(in srgb,var(--accent) 60%,#191919);font-size:14px}.section-label{display:flex;justify-content:space-between;align-items:center;font-size:9px;color:var(--muted);letter-spacing:1.5px;margin:13px 0 7px}.cue-pads{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.cue-pads button{height:39px;border-bottom:2px solid color-mix(in srgb,var(--accent) 40%,#262626)}.loop-row{display:grid;grid-template-columns:repeat(5,1fr);gap:5px}.loop-row button{padding:6px;font:11px ui-monospace,monospace;min-height:30px}.stem-row{display:grid;grid-template-columns:repeat(4,1fr);gap:5px}.stem-row button{font-size:10px;padding:8px 2px;min-height:37px}.stem-tools{display:flex;justify-content:space-between;gap:4px;margin-top:8px}.stem-tools button{font-size:10px;min-height:29px;background:transparent;padding:5px 7px}.stem-note{font-size:9px;line-height:1.5;color:var(--muted);margin:6px 0 0;min-height:14px}.mixer{padding:16px 12px;display:flex;flex-direction:column}.mixer-heading{text-align:center;letter-spacing:2px;font-size:10px;font-weight:700;margin:7px 0 18px}.channels{display:grid;grid-template-columns:1fr 1fr;gap:14px}.channel{--accent:var(--pink);text-align:center}.channel:nth-child(2){--accent:var(--mint)}.channel-name{font-size:10px;color:var(--accent);font-weight:700;margin-bottom:9px}.knob-control{margin-bottom:8px}.knob-control label{display:block;color:var(--muted);font-size:8px;letter-spacing:1.4px}.knob-control output{display:block;font:9px ui-monospace,monospace;color:var(--muted);height:12px}.knob-control input{height:20px}.channel-meter{height:58px;width:13px;margin:6px auto;background:#121212;border-radius:2px;position:relative;overflow:hidden}.channel-meter span{position:absolute;bottom:0;left:0;width:100%;height:0;background:linear-gradient(to top,var(--mint),#d6d6d6 75%,var(--pink) 95%)}.fader label{display:block;color:var(--muted);font-size:8px;letter-spacing:1.5px}.channel .cue-monitor{min-height:28px;margin-top:5px;width:100%;font-size:9px}.cross-section{padding-top:12px;margin-top:auto}.cross-label{display:flex;justify-content:space-between;color:var(--muted);font-size:9px;letter-spacing:1px}.master{border-top:1px solid var(--line);padding-top:10px;margin-top:10px}.master label{display:flex;align-items:center;justify-content:space-between;font-size:9px;letter-spacing:1px;color:var(--muted)}.master button{width:100%;font-size:9px;min-height:29px;padding:4px}.master p{font-size:8px;color:var(--muted);margin:6px 0 0;text-align:center}.panel{margin-top:14px;padding:22px}.section-title{display:flex;align-items:center;justify-content:space-between;gap:16px}.eyebrow{color:var(--muted);font-size:9px;font-weight:700;letter-spacing:2px}h2{font-family:'Barlow Condensed',Impact,sans-serif;font-size:26px;font-weight:600;letter-spacing:.3px;margin:5px 0 0}.sample-tools{display:flex;gap:8px;align-items:flex-end}.sample-tools label{font-size:9px;color:var(--muted);display:grid;gap:5px}.sample-tools select{font-size:11px;border:1px solid var(--line);border-radius:4px;padding:8px;background:#131313;min-height:35px}.pads{display:grid;grid-template-columns:repeat(8,1fr);gap:8px;margin-top:20px}.pad{border:1px solid #3e3e3e;border-radius:5px;background:linear-gradient(150deg,#2a2a2a,#222222);overflow:hidden;position:relative}.pad.selected{border-color:var(--pink)}.pad.playing{box-shadow:inset 0 0 20px #81818140}.pad-trigger{height:77px;background:transparent;width:100%;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;padding:12px;border:0;font-size:9px;overflow:hidden}.pad-trigger b{font-size:17px;color:#7a7a7a}.pad.loaded .pad-trigger b{color:var(--pink)}.pad-name{max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--muted)}.pad-opts{border-top:1px solid #3a3a3a;display:grid;grid-template-columns:repeat(4,1fr)}.pad-opts button{border:0;border-radius:0;background:transparent;min-height:27px;padding:3px;font-size:8px}.sampler-footer{display:flex;justify-content:space-between;align-items:center;gap:15px;font-size:10px;color:var(--muted);margin-top:12px}.sampler-footer label{display:flex;gap:8px;align-items:center;white-space:nowrap}.sampler-footer input{width:90px}.library-actions{display:flex;gap:10px}.library-actions input{background:#131313;border:1px solid var(--line);border-radius:5px;padding:9px 12px;font-size:11px;max-width:230px}.library-meta{display:flex;justify-content:space-between;font-size:9px;color:var(--muted);letter-spacing:1px;margin:21px 0 12px}.table-wrap{overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:12px;text-align:left;min-width:540px}th{font-size:8px;letter-spacing:1.8px;color:var(--muted);font-weight:500;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:12px 9px}td{border-bottom:1px solid #2f2f2f;padding:11px 9px;font-size:11px}td:first-child{color:var(--muted);width:35px}td:nth-child(2){width:53%}td small{display:block;color:var(--muted);font-size:9px;margin-top:4px}td button{font-size:10px;min-height:27px;padding:5px 10px;margin-right:5px}td button:first-child{color:var(--pink)}td button:last-child{color:var(--mint)}.empty{text-align:center;padding:35px 10px;color:var(--muted)}.empty>span{font-size:28px;color:var(--pink)}.empty h3{color:var(--text);font-weight:500;margin-bottom:5px}.empty p{font-size:12px}footer{display:flex;justify-content:space-between;gap:15px;font-size:9px;line-height:1.6;padding:23px 0 28px;color:var(--muted)}footer a{color:var(--muted)}dialog{border:1px solid #454545;border-radius:9px;background:#1d1d1d;color:var(--text);padding:28px;max-width:570px;width:calc(100% - 30px);max-height:90svh}dialog::backdrop{background:#000000bb;backdrop-filter:blur(7px)}dialog h2{font-size:38px;margin:14px 0 20px}dialog p,dialog li{font-size:12px;line-height:1.8;color:#c3c3c3}dialog li{margin-bottom:12px}dialog ol{padding-left:18px}.dialog-head{display:flex;justify-content:space-between;align-items:center}.dialog-head button{background:transparent;border:0}.stack{display:grid;gap:7px;font-size:11px;margin:18px 0}.stack input{width:100%;background:#131313;color:var(--text);border:1px solid #464646;border-radius:5px;padding:10px}.button-row{display:flex;gap:10px}#toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,20px);background:#eeeeee;color:#131313;font-size:12px;border-radius:6px;padding:13px 20px;box-shadow:0 6px 30px #00000066;opacity:0;pointer-events:none;transition:.2s;max-width:calc(100% - 24px);z-index:50}#toast.visible{opacity:1;transform:translate(-50%,0)}.recording{color:var(--pink)!important;border-color:var(--pink)!important}.recording .record-dot{animation:blink 1s infinite}@keyframes blink{50%{opacity:.2}}@media(min-width:1400px){.deck{padding:22px}.jog{width:164px;height:164px}.jog:after{transform-origin:1px 68px}.platter-area{padding:14px 15px}.deck-grid{grid-template-columns:minmax(0,1fr) 270px minmax(0,1fr)}}@media(max-width:1050px){main{padding:0 16px}header{padding:0 18px}.deck-grid{grid-template-columns:minmax(0,1fr) 205px minmax(0,1fr);gap:8px}.deck{padding:12px}.jog{width:116px;height:116px}.jog:after{transform-origin:1px 44px}.jog-inner{width:64px;height:64px}.jog-inner b{font-size:25px}.tempo{width:70px}.platter-area{gap:6px}.mixer{padding:12px 9px}.channels{gap:8px}.pads{gap:5px}.pad-opts{grid-template-columns:repeat(2,1fr)}.sample-tools{gap:5px}.panel{padding:18px}.section-title h2{font-size:23px}.brand small{display:none}}@media(max-width:760px){header{height:68px;padding:0 12px}.brand{font-size:23px}.brand-icon{font-size:30px}.status{display:none}.header-actions{gap:5px}.header-actions button{padding:7px 9px;font-size:10px}.workspace-bar{height:66px;font-size:8px;letter-spacing:1px;gap:10px}.workspace-bar .muted{display:none}.mini-actions{gap:4px}.mini-actions button{font-size:9px;padding:7px;min-height:33px}.deck-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.mixer{grid-row:2;grid-column:1/-1;display:grid;grid-template-columns:1fr 180px;gap:6px 24px}.mixer-heading{grid-column:1/-1;margin:5px}.channels{gap:25px}.channel{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px 8px}.channel-name{grid-column:1/-1}.knob-control{margin:0}.fader{grid-column:1/3}.channel-meter{grid-column:3;grid-row:4/6;height:38px;margin:5px auto}.channel .cue-monitor{grid-column:1/3}.cross-section{align-self:center}.master{grid-column:2;margin-top:0}.mixer>.master{grid-row:3}.cross-section{grid-column:2;grid-row:2}.deck{padding:10px}.deck-top button{font-size:9px;padding:5px;min-height:29px}.deck-letter{font-size:8px;gap:5px;letter-spacing:1px}.deck-letter strong{height:24px;width:24px;font-size:15px}.track-title{font-size:13px;margin-top:14px}.track-subtitle{font-size:8px}.platter-area{grid-template-columns:1fr}.jog{width:112px;height:112px}.jog:after{transform-origin:1px 42px}.tempo{display:grid;grid-template-columns:1fr 1fr;gap:3px 8px;width:100%;align-items:center}.tempo label,.tempo small{font-size:8px}.tempo input[type=number]{font-size:19px}.tempo input[type=range]{grid-column:1}.tempo output{font-size:9px}.transport{gap:4px}.transport button{font-size:9px;padding:5px;min-height:40px}.section-label{font-size:8px;letter-spacing:.8px}.cue-pads{gap:4px}.cue-pads button{min-height:38px;padding:4px;font-size:10px}.stem-row{grid-template-columns:repeat(2,1fr)}.stem-tools{flex-direction:column}.section-title{align-items:flex-start;flex-direction:column;gap:12px}.sample-tools{width:100%;flex-wrap:wrap}.sample-tools button{flex:1;font-size:10px}.pads{grid-template-columns:repeat(4,1fr);gap:7px;margin-top:14px}.pad-opts{grid-template-columns:repeat(2,1fr)}.pad-opts button{min-height:30px}.sampler-footer{flex-direction:column;align-items:flex-start;font-size:9px;line-height:1.6}.library-actions{width:100%}.library-actions input{min-width:0;flex:1}.library-meta{font-size:8px;gap:12px;line-height:1.5}.library-meta .muted{display:none}.panel{padding:14px}.time-row{font-size:9px}.wave{height:62px}.overview{height:23px}footer{flex-direction:column}.section-title h2{font-size:25px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* Performance editing controls: large touch targets, with independent stem levels. */
.beat-jump{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-top:7px}.beat-jump button{font-size:10px;min-height:30px;padding:4px}.stem-levels{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin-top:5px}.stem-levels input{height:26px}.stem-levels button{width:100%;font-size:8px;padding:3px;min-height:27px}.pad-opts{grid-template-columns:repeat(5,1fr)}.pad-opts button{font-size:8px}.editor-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 24px}.editor-grid label{gap:3px;margin:14px 0}.editor-grid output{color:var(--pink);font:11px ui-monospace,monospace}.editor-grid input{padding:0;border:0;background:transparent}.button-row{flex-wrap:wrap}.sample-tools{flex-wrap:wrap}.sample-tools #quantSamples{font-size:9px;min-height:35px}@media(max-width:1050px){.pad-opts{grid-template-columns:repeat(3,1fr)}}@media(max-width:760px){.stem-levels{grid-template-columns:repeat(2,minmax(0,1fr))}.stem-levels>div{display:flex;gap:5px;align-items:center}.stem-levels button{width:32px;font-size:7px}.beat-jump button{min-height:34px}.sample-tools #quantSamples{flex:0 0 auto}.pad-opts{grid-template-columns:repeat(3,1fr)}.sample-tools{align-items:flex-end}}
/* Hardware console layout: rotating vinyl decks, real rotary EQ and vertical faders. */
:root{--bg:#0c0c0c;--panel:#191919;--line:#373737}
header{height:64px;background:#121212}.brand{font-size:25px}.brand-icon{font-size:33px}.brand small{font-size:7px}.workspace-bar{height:49px}main{max-width:1660px;padding:0 20px}.deck-grid{grid-template-columns:minmax(0,1fr) 230px minmax(0,1fr);gap:0;border:1px solid #444444;border-radius:10px;background:#171717;box-shadow:0 12px 35px #00000088;overflow:hidden}.deck,.mixer{border:0;border-radius:0;background:linear-gradient(150deg,#232323,#171717 72%)}.deck{padding:15px 20px}.mixer{border-left:1px solid #3e3e3e;border-right:1px solid #3e3e3e;padding:12px;background:linear-gradient(90deg,#141414,#202020 50%,#141414)}.deck-top{height:32px}.deck-top button{background:#0a0a0a;border-color:var(--accent);color:var(--accent);min-height:33px;font-size:11px;box-shadow:inset 0 0 10px color-mix(in srgb,var(--accent) 10%,transparent)}.track-title{font-family:'Barlow Condensed',sans-serif;font-size:24px;letter-spacing:.3px;margin-top:12px}.track-subtitle{margin-bottom:11px;font-size:9px}.wave{height:68px;background:#0b0b0b;border:1px solid #333333;box-shadow:inset 0 1px 10px #00000099}.overview{height:22px}.platter-area{padding:13px 0 7px;grid-template-columns:minmax(0,1fr) 73px;gap:12px}.jog{width:clamp(150px,19vw,245px);height:clamp(150px,19vw,245px);border:7px solid #5a5a5a;background:repeating-radial-gradient(circle,#161616 0px,#161616 1px,#272727 2px,#161616 3px);box-shadow:0 0 0 2px #0b0b0b,0 0 0 4px #2e2e2e,0 12px 20px #00000099;isolation:isolate}.jog:before{inset:3px;border:1px solid #959595;opacity:.7}.jog:after{height:4px;width:14px;top:50%;left:8px;transform-origin:calc(clamp(150px,19vw,245px)/2 - 15px) 0;transform:rotate(var(--rotation));background:#ffffff;box-shadow:0 0 9px var(--accent)}.jog-inner{width:44%;height:44%;background:radial-gradient(circle,#2b2b2b,#121212 80%);border:2px solid var(--accent);box-shadow:0 0 16px #000000,inset 0 0 20px color-mix(in srgb,var(--accent) 8%,transparent)}.jog-inner b{font-size:clamp(28px,3vw,43px);color:#f3f3f3}.jog-inner span{color:var(--accent);font-size:9px}.tempo{width:73px;gap:5px}.tempo input[type=number]{font-size:22px}.tempo input[type=range]{writing-mode:vertical-lr;direction:rtl;height:106px;width:30px;align-self:center}.tempo label{text-align:center;font-size:8px}.tempo small{text-align:center;font-size:8px}.tempo button{font-size:8px;padding:3px;min-height:24px}.tempo output{font-size:9px}.transport{margin-top:13px;grid-template-columns:.8fr 1.4fr .8fr;gap:9px}.transport button{height:44px;background:linear-gradient(#393939,#222222);font-size:12px;border:1px solid #5b5b5b;box-shadow:0 3px 5px #00000066}.transport .play{border-color:var(--accent);color:var(--accent);font-size:16px}.transport .play.active{background:var(--accent);color:#111111;box-shadow:0 0 15px color-mix(in srgb,var(--accent) 25%,transparent)}.deck-modes{display:flex;border-bottom:1px solid #464646;margin-top:15px;gap:7px}.deck-modes button{background:transparent;border:0;border-radius:0;font-size:9px;letter-spacing:1px;flex:1;min-height:33px}.deck-modes button.active{border-bottom:2px solid var(--accent);color:var(--accent)}.cue-pads button{height:42px;background:linear-gradient(#353535,#252525);border:1px solid #525252;border-bottom:3px solid var(--accent);font-size:12px}.cue-pads button.active{background:color-mix(in srgb,var(--accent) 32%,#282828)}.section-label{margin:10px 0 6px;font-size:8px}.loop-row button,.beat-jump button{background:#0d0d0d;border-color:#424242;min-height:29px}.stem-row{margin-top:14px}.stem-row button{min-height:45px}.stem-levels{margin:10px 0 14px}.stem-levels input{writing-mode:vertical-lr;direction:rtl;height:75px;width:28px;display:block;margin:0 auto 7px}.stem-levels button{font-size:9px}.stem-tools{margin-top:15px}.stem-tools button{min-height:36px}.stem-note{font-size:10px;line-height:1.7}.mixer-heading{font-size:9px;margin:3px 0 10px}.channels{gap:10px;flex:1}.channel{display:flex;flex-direction:column;align-items:center;gap:0}.channel-name{font-size:9px;margin:0 0 8px}.knob-control{display:flex;flex-direction:column;align-items:center;margin-bottom:8px;width:100%}.knob-control label{font-size:8px;color:#bdbdbd;margin-bottom:3px}.knob-dial{--angle:0deg;position:relative;width:39px;height:39px;border-radius:50%;background:linear-gradient(130deg,#696969,#2d2d2d 45%,#131313 80%);border:1px solid #7b7b7b;box-shadow:0 3px 5px #000000bb,0 0 0 3px #0b0b0b}.knob-indicator{position:absolute;inset:3px;transform:rotate(var(--angle));border-radius:50%}.knob-indicator:after{content:'';position:absolute;width:2px;height:11px;top:1px;left:calc(50% - 1px);border-radius:2px;background:var(--accent);box-shadow:0 0 5px var(--accent)}.knob-dial input{position:absolute;inset:0;opacity:0;width:100%;height:100%;margin:0;touch-action:none;cursor:ns-resize;writing-mode:horizontal-tb}.knob-dial:focus-within{outline:2px solid #ffffff;outline-offset:3px}.knob-control output{height:12px;font-size:8px;margin-top:4px}.channel-output{height:108px;display:flex;justify-content:center;gap:11px;width:100%;padding-top:4px}.channel-meter{height:86px;width:8px;margin:14px 0 0;background:repeating-linear-gradient(to top,#2a2a2a 0px,#2a2a2a 3px,#0f0f0f 3px,#0f0f0f 5px)}.channel-meter span{opacity:.85}.fader{display:flex;flex-direction:column;align-items:center;gap:4px;background:repeating-linear-gradient(to top,transparent 0,transparent 14px,#4a4a4a 15px,transparent 16px)}.fader label{font-size:7px;color:#ababab;background:#1c1c1c;padding:0 3px}.fader input{writing-mode:vertical-lr;direction:rtl;width:28px;height:86px}.channel .cue-monitor{font-size:7px;min-height:26px;padding:4px;margin-top:7px;background:#2d2d2d}.cross-section{margin-top:12px;padding-top:7px;flex:none}.cross-section input{height:31px}.cross-label{font-size:8px}.master{margin-top:8px;padding-top:8px}.master input{height:23px}.master button{font-size:8px;min-height:26px}.master p{font-size:7px}.panel{margin-top:12px;padding:16px 20px;background:#161616}.section-title h2{font-family:'DM Sans',sans-serif;font-size:17px;font-weight:600}.section-title .eyebrow{font-size:8px;letter-spacing:1.5px}.pads{margin-top:13px}.pad-trigger{height:67px}.sampler-footer{font-size:9px}.library{margin-top:12px}.library-meta{margin-top:15px}.library .section-title{align-items:center}footer{font-size:8px;padding-top:16px}
@media(min-width:1400px){.deck-grid{grid-template-columns:minmax(0,1fr) 256px minmax(0,1fr)}.jog{width:250px;height:250px}.jog:after{transform-origin:110px 0}.platter-area{padding:15px 10px}.knob-dial{height:42px;width:42px}}
@media(max-width:1050px) and (min-width:761px){.deck-grid{grid-template-columns:minmax(0,1fr) 210px minmax(0,1fr)}.deck{padding:13px}.platter-area{grid-template-columns:minmax(0,1fr) 60px;gap:9px}.jog{width:clamp(130px,20vw,190px);height:clamp(130px,20vw,190px)}.jog:after{transform-origin:calc(clamp(130px,20vw,190px)/2 - 15px) 0}.tempo{width:60px}.knob-dial{height:36px;width:36px}.knob-control{margin-bottom:6px}.track-title{font-size:21px}.transport{gap:5px}}
@media(max-width:760px){header{height:60px}.brand{font-size:21px}.workspace-bar{height:52px}main{padding:0 8px}.deck-grid{grid-template-columns:repeat(2,minmax(0,1fr));border-radius:7px}.deck{padding:10px 8px}.mixer{display:grid;grid-template-columns:1fr 145px;gap:7px 18px;padding:10px 12px;border:0;border-top:1px solid #4a4a4a;background:linear-gradient(#202020,#141414)}.mixer-heading{grid-column:1/-1;margin:2px}.channels{gap:16px}.channel{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px 9px;align-items:center}.channel-name{grid-column:1/-1}.knob-control{margin:0}.knob-control label{font-size:6px;letter-spacing:.6px}.knob-dial{width:29px;height:29px}.knob-indicator:after{height:8px}.knob-control output{font-size:6px;height:9px}.channel-output{grid-column:1/-1;height:85px;gap:15px;margin-top:3px}.channel-meter{grid-column:auto;grid-row:auto;height:66px;margin:14px 0 0}.fader{grid-column:auto}.fader input{height:67px;width:26px}.channel .cue-monitor{grid-column:1/-1;font-size:7px;min-height:24px;margin-top:0}.cross-section{grid-column:2;grid-row:2;align-self:start;margin-top:30px}.mixer>.master{grid-column:2;grid-row:2;align-self:end;margin-top:95px}.platter-area{grid-template-columns:1fr;gap:9px;padding:9px 0 0}.jog{width:clamp(112px,32vw,190px);height:clamp(112px,32vw,190px);border-width:5px}.jog:after{transform-origin:calc(clamp(112px,32vw,190px)/2 - 13px) 0;width:10px;height:3px}.jog-inner b{font-size:24px}.jog-inner span{font-size:7px;letter-spacing:1px}.track-title{font-size:17px;margin-top:10px}.track-subtitle{font-size:7px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;margin-bottom:8px}.deck-top button{font-size:8px;min-height:30px;padding:5px}.deck-letter{font-size:6px;letter-spacing:0}.deck-letter strong{font-size:13px;width:20px;height:20px}.tempo{display:grid;width:100%;grid-template-columns:1fr 1fr;gap:2px 5px}.tempo input[type=range]{writing-mode:horizontal-tb;direction:ltr;height:21px;width:100%}.tempo input[type=number]{font-size:19px}.tempo label,.tempo small{font-size:7px}.tempo output{font-size:8px}.tempo button{font-size:7px;min-height:23px}.transport{gap:4px;margin-top:10px}.transport button{height:38px;min-height:38px;font-size:8px}.transport .play{font-size:11px}.deck-modes{gap:3px;margin-top:10px}.deck-modes button{font-size:7px;padding:4px 1px;min-height:34px;letter-spacing:.4px}.section-label{font-size:6px;letter-spacing:.4px;margin-top:8px}.cue-pads{gap:4px}.cue-pads button{min-height:36px;height:36px;font-size:9px}.loop-row{gap:3px}.loop-row button,.beat-jump button{font-size:9px;padding:3px;min-height:30px}.stem-row{gap:4px;margin-top:10px}.stem-row button{font-size:9px;min-height:37px}.stem-levels{grid-template-columns:repeat(4,minmax(0,1fr));gap:3px}.stem-levels>div{display:block}.stem-levels input{width:25px;height:70px;writing-mode:vertical-lr;direction:rtl}.stem-levels button{width:100%;min-height:25px;font-size:6px}.stem-tools{margin-top:6px;gap:5px}.stem-tools button{min-height:30px;font-size:8px}.stem-note{font-size:8px}.panel{padding:13px}.section-title h2{font-size:17px}.library .section-title{align-items:flex-start}.wave{height:52px}.overview{height:19px}.time-row{font-size:8px}.sample-tools #quantSamples{font-size:8px}.pads{gap:6px}.pad-trigger{height:61px;padding:9px}.pad-trigger b{font-size:14px}.pad-opts button{font-size:7px}.sampler-footer{font-size:8px}}
/* Decks first, visible crossfader second, then channel mixer and sampler. */
header{height:43px;padding:0 16px}.brand{font-size:20px}.brand-icon{font-size:26px}.brand small{display:none}.header-actions button{min-height:28px;padding:5px 9px;font-size:10px}.workspace-bar{height:34px;font-size:8px}.workspace-bar button{min-height:26px;padding:4px 9px;font-size:9px}main{padding:0 12px}.deck-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:0;margin-top:0;border-radius:6px}.deck{padding:8px 15px 10px;display:flex;flex-direction:column}.deck+.deck{border-left:1px solid #444444}.track-title{font-size:19px;margin:0 0 2px;order:3;line-height:1.1}.track-subtitle{font-size:8px;margin:0 0 6px;order:4}.deck>.wave{order:0;height:59px}.deck>.overview{order:1;height:18px;margin-top:3px}.time-row{order:2;margin:4px 0;font-size:10px}.platter-area{order:5;grid-template-columns:minmax(0,1fr) 84px;padding:4px 6px 0;gap:8px}.jog{width:clamp(130px,16vw,205px);height:clamp(130px,16vw,205px)}.jog:after{transform-origin:calc(clamp(130px,16vw,205px)/2 - 15px) 0}.tempo{width:84px;display:grid;grid-template-columns:1fr 1fr;gap:3px 5px}.tempo label{font-size:7px}.tempo input[type=number]{font-size:20px}.tempo input[type=range]{writing-mode:horizontal-tb;direction:ltr;width:100%;height:22px}.tempo output{font-size:8px}.tempo button{font-size:8px;min-height:23px}.deck-top{order:6;height:30px;margin-top:5px}.deck-top button{min-height:28px;padding:5px 12px}.transport{order:7;margin:6px 0 0;gap:8px}.transport button{height:35px;min-height:35px;font-size:11px}.transport .play{font-size:13px}
.crossfader-dock{position:sticky;top:0;z-index:20;margin-top:7px;background:#202020;border:1px solid #6b6b6b;border-radius:6px;box-shadow:0 5px 18px #00000088;isolation:isolate;padding:9px 18px 6px}.crossfader-dock .cross-section{display:grid;grid-template-columns:1fr 58px;gap:0 15px;margin:0;padding:0;grid-area:auto}.crossfader-dock .cross-label{grid-column:1;font-size:11px;letter-spacing:2px;color:#f0f0f0;padding:0 5px}.crossfader-dock .cross-label span:first-child{color:var(--pink)}.crossfader-dock .cross-label span:last-child{color:var(--mint)}.crossfader-dock #crossfader{grid-column:1;width:100%;height:44px;margin:0;appearance:none;-webkit-appearance:none;writing-mode:horizontal-tb;direction:ltr;background:transparent;cursor:ew-resize;touch-action:pan-y}.crossfader-dock #crossfader::-webkit-slider-runnable-track{height:10px;border:1px solid #686868;border-radius:5px;background:linear-gradient(90deg,#81818144,#0d0d0d 45%,#0d0d0d 55%,#cbcbcb44)}.crossfader-dock #crossfader::-webkit-slider-thumb{-webkit-appearance:none;width:39px;height:35px;margin-top:-14px;border:1px solid #c9c9c9;border-radius:4px;background:linear-gradient(90deg,#3e3e3e,#b6b6b6 42%,#252525 45%,#252525 55%,#b6b6b6 58%,#3e3e3e);box-shadow:0 2px 5px #000000}.crossfader-dock #crossfader::-moz-range-track{height:10px;border:1px solid #686868;border-radius:5px;background:#0d0d0d}.crossfader-dock #crossfader::-moz-range-thumb{width:39px;height:35px;border:1px solid #c9c9c9;border-radius:4px;background:linear-gradient(90deg,#484848,#b6b6b6,#252525,#b6b6b6,#484848)}.crossfader-dock #centerCross{grid-column:2;grid-row:1/3;width:58px!important;height:38px;align-self:center;background:#151515;font-size:9px!important;min-height:38px!important}
main>.mixer{display:grid;grid-template-columns:minmax(0,1fr) 155px;gap:8px 18px;border:1px solid #444444;border-radius:6px;margin-top:7px;padding:10px 15px}.mixer-heading{grid-column:1/-1;text-align:left;margin:0;font-size:8px;letter-spacing:2px}.mixer .channels{grid-column:1;display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}.mixer .channel{display:grid;grid-template-columns:repeat(6,minmax(0,1fr)) 33px;gap:1px 7px;align-items:center}.mixer .channel-name{grid-column:1/-1;text-align:left;margin:0 0 6px}.mixer .knob-control{margin:0}.mixer .knob-dial{height:33px;width:33px}.mixer .knob-control label{font-size:7px;letter-spacing:.6px}.mixer .knob-control output{font-size:7px;margin-top:3px}.mixer .channel-output{height:72px;grid-column:7;grid-row:2/4;padding:0;gap:5px}.mixer .fader label{font-size:6px}.mixer .fader input{height:60px;width:20px}.mixer .channel-meter{height:54px;width:5px;margin-top:13px}.mixer .cue-monitor{grid-column:1/7;margin-top:3px;min-height:22px;letter-spacing:.5px}.mixer>.master{grid-column:2;grid-row:2;align-self:center;padding:0 0 0 14px;margin:0;border-top:0;border-left:1px solid #494949}.mixer>.master label{font-size:8px}.mixer>.master button{font-size:8px;min-height:26px}.mixer>.master p{font-size:7px}
.sampler{margin-top:7px}.sampler .section-title h2{font-size:15px;margin-top:3px}.sampler .pads{margin-top:10px}.sampler .pad-trigger{height:74px;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;cursor:crosshair}.pad-trigger.holding{color:#ffffff;background:#4e4e4e;box-shadow:inset 0 0 20px #81818166}.pad-trigger.holding b,.pad-trigger.holding .pad-name{color:#ffffff}.pad-opts{grid-template-columns:repeat(3,1fr)}.pad-opts button:first-child{color:var(--pink);font-size:10px;grid-column:1/-1;background:#2b2b2b;min-height:30px}.pad-name{font-size:8px}.sample-history{font-size:9px;position:relative;align-self:flex-end;color:var(--muted);padding:10px 8px;border:1px solid #414141;border-radius:4px;background:#131313}.sample-history summary{cursor:pointer}.sample-history[open]{display:flex;gap:7px;align-items:center}.sample-history[open] summary{margin-bottom:8px}.sample-history label{margin:7px 0}.sample-history #capture{font-size:9px;padding:6px 8px;min-height:30px}.sample-tools select{min-height:31px}.sampler .section-title{align-items:center}.performance-bank{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}.performance-panel{padding:12px 16px;background:#191919;border:1px solid #414141;border-radius:6px}.performance-panel .deck-modes{margin:0}.performance-panel .mode-stems .stem-levels{grid-template-columns:repeat(4,minmax(0,1fr))}.performance-panel .stem-levels>div{display:block}.performance-panel .stem-levels input{writing-mode:vertical-lr;direction:rtl;height:70px;width:26px;margin:auto}.performance-panel .stem-tools{flex-direction:row}.performance-panel .stem-tools button{min-height:31px}.performance-panel .stem-note{font-size:9px}.performance-panel .stem-row{grid-template-columns:repeat(4,minmax(0,1fr))}.performance-panel .stem-row button{min-height:36px}.performance-panel .stem-levels button{margin-top:6px;width:100%}
@media(max-width:1050px){.mixer .channel{grid-template-columns:repeat(3,minmax(0,1fr)) 32px;gap:3px 8px}.mixer .channel-output{grid-column:4;grid-row:2/4;height:118px;gap:6px}.mixer .fader input{height:100px;width:23px}.mixer .channel-meter{height:94px;margin-top:15px}.mixer .cue-monitor{grid-column:1/4}.mixer .knob-dial{height:34px;width:34px}}
@media(max-width:760px){header{height:39px;padding:0 9px}.brand{font-size:17px}.brand-icon{font-size:23px}.header-actions button{font-size:8px;min-height:26px;padding:4px 6px}.workspace-bar{height:31px;font-size:7px}.workspace-bar button{font-size:7px;min-height:24px;padding:3px 6px}main{padding:0 6px}.deck-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.deck{padding:6px 7px 7px}.deck>.wave{height:40px}.deck>.overview{height:15px}.time-row{font-size:8px;margin:3px 0}.track-title{font-size:15px;margin:0 0 2px}.track-subtitle{font-size:7px;margin-bottom:1px}.platter-area{display:grid;grid-template-columns:1fr;gap:4px;padding:4px 0 0}.jog{width:clamp(104px,28vw,150px);height:clamp(104px,28vw,150px);border-width:5px}.jog:after{transform-origin:calc(clamp(104px,28vw,150px)/2 - 13px) 0}.jog-inner b{font-size:23px}.jog-inner span{font-size:6px}.tempo{width:100%;grid-template-columns:28px 1fr 1fr;gap:2px 4px;margin-top:4px;align-items:center}.tempo label{font-size:6px}.tempo input[type=number]{font-size:16px;padding:2px}.tempo input[type=range]{grid-column:2;height:20px}.tempo .pitch-label{grid-column:3}.tempo button{font-size:7px;padding:2px;min-height:22px}.tempo small{font-size:6px}.deck-top{height:25px;margin-top:4px}.deck-top button{font-size:7px;min-height:25px;padding:3px 6px}.deck-letter{font-size:6px}.deck-letter strong{font-size:11px;height:18px;width:18px}.transport{gap:4px;margin-top:5px}.transport button{height:30px;min-height:30px;font-size:8px}.transport .play{font-size:10px}.crossfader-dock{padding:7px 10px 2px;margin-top:5px;top:0}.crossfader-dock .cross-section{gap:0 9px;grid-template-columns:1fr 46px}.crossfader-dock .cross-label{font-size:9px;letter-spacing:1.2px}.crossfader-dock #crossfader{height:42px}.crossfader-dock #centerCross{width:46px!important;font-size:7px!important;height:32px;min-height:32px!important}.crossfader-dock #crossfader::-webkit-slider-thumb{width:32px;height:34px;margin-top:-13px}
main>.mixer{display:grid;grid-template-columns:1fr;gap:7px;margin-top:5px;padding:8px 9px}.mixer-heading{grid-column:1;font-size:7px}.mixer .channels{grid-column:1;grid-template-columns:1fr 1fr;gap:14px}.mixer .channel{grid-template-columns:repeat(3,minmax(0,1fr)) 24px;gap:3px 5px}.mixer .channel-name{font-size:7px;margin-bottom:2px}.mixer .knob-dial{width:29px;height:29px}.mixer .knob-control label{font-size:6px}.mixer .knob-control output{font-size:6px;margin-top:2px}.mixer .channel-output{grid-column:4;grid-row:2/4;gap:4px;height:104px}.mixer .fader input{height:87px;width:18px}.mixer .channel-meter{height:82px;width:4px;margin-top:14px}.mixer .cue-monitor{font-size:6px;min-height:22px;margin-top:2px}.mixer>.master{grid-column:1;grid-row:auto;display:grid;grid-template-columns:1fr 1fr;gap:1px 12px;border-left:0;border-top:1px solid #3b3b3b;margin:3px 0 0;padding:5px 0 0}.mixer>.master label{grid-column:1;font-size:7px}.mixer>.master input{grid-column:1;height:22px}.mixer>.master button{grid-column:2;grid-row:1/3;align-self:center;font-size:7px;min-height:27px}.mixer>.master p{grid-column:2;font-size:6px;margin:0}.sampler{padding:10px;margin-top:5px}.sampler .section-title{flex-direction:row;align-items:flex-start;gap:7px}.sampler .section-title h2{font-size:12px}.sampler .eyebrow{font-size:7px}.sample-tools{justify-content:flex-end;gap:5px}.sample-tools label{font-size:7px}.sample-tools select{font-size:8px;min-height:27px;padding:4px;max-width:150px}.sample-tools #quantSamples{font-size:7px;min-height:27px;padding:4px 6px}.sample-history{font-size:7px;padding:7px 5px;min-height:27px}.sample-history #capture{font-size:7px;min-height:26px;padding:4px}.sampler .pads{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;margin-top:9px}.sampler .pad-trigger{height:68px;padding:8px}.sampler .pad-trigger b{font-size:14px}.pad-name{font-size:7px}.pad-opts button{font-size:6px;min-height:25px}.pad-opts button:first-child{font-size:9px;min-height:28px}.sampler-footer{line-height:1.5;font-size:8px;margin-top:8px}.performance-bank{gap:6px;margin-top:7px}.performance-panel{padding:8px}.performance-panel .deck-modes button{font-size:6px;min-height:29px}.performance-panel .cue-pads button{height:33px;min-height:33px;font-size:8px}.performance-panel .stem-row{grid-template-columns:repeat(2,minmax(0,1fr))}.performance-panel .stem-row button{font-size:8px;min-height:30px}.performance-panel .stem-tools{flex-direction:column}.performance-panel .stem-note{font-size:7px}.library{margin-top:7px}}
/* Track-reactive platters and an iPad-friendly expanded performance workspace. */
.jog{position:relative;overflow:hidden;background:radial-gradient(circle at 35% 25%,#363636,#0f0f0f 65%);border-color:#707070}
.jog-art{position:absolute;inset:5%;width:90%;height:90%;pointer-events:none;z-index:1;filter:drop-shadow(0 0 3px color-mix(in srgb,var(--accent) 45%,transparent))}
.jog-inner{position:relative;z-index:2;background:radial-gradient(circle at 32% 22%,#414141,#191919 67%,#0a0a0a);border:2px solid var(--accent);box-shadow:0 0 0 5px #0d0d0d,0 0 0 6px #72727280,0 0 16px var(--accent),inset 0 3px 8px #ffffff18}
.jog:after{z-index:3;pointer-events:none}.jog:before{z-index:1;pointer-events:none}
.transport [data-act="sync"]{letter-spacing:.5px;white-space:nowrap}.transport [data-act="sync"].active{background:var(--accent);color:#0d0d0d;border-color:var(--accent);box-shadow:0 0 15px color-mix(in srgb,var(--accent) 40%,transparent)}
#fullscreen{white-space:nowrap;border-color:#6d6d6d}
body.performance-mode{overflow:hidden}body.performance-mode header{height:38px}body.performance-mode main{max-width:none;width:100%;height:calc(100dvh - 38px);overflow-y:auto;overscroll-behavior:contain;padding:0 12px 30px}body.performance-mode .workspace-bar{height:27px}body.performance-mode .deck>.wave{height:clamp(55px,10vh,100px)}body.performance-mode .deck>.overview{height:23px}body.performance-mode .jog{width:clamp(150px,20vh,250px);height:clamp(150px,20vh,250px)}body.performance-mode .jog:after{display:none}
@media(max-width:760px){.jog-art{inset:3%;width:94%;height:94%}body.performance-mode main{padding:0 6px 24px}body.performance-mode .deck>.wave{height:clamp(42px,9vh,78px)}body.performance-mode .jog{width:clamp(108px,21vh,170px);height:clamp(108px,21vh,170px)}#fullscreen{font-size:8px;padding:4px 6px}}
@media(max-width:440px){.header-actions{gap:3px}.status{display:none}#fullscreen{font-size:7px;padding:4px}}
/* Put the three channel EQ controls first and give them physical-mixer prominence. */
.mixer-heading span{color:#d0d0d0}.mixer .eq-knob label{color:var(--accent);font-weight:800;letter-spacing:1px}.mixer .eq-knob .knob-dial{width:46px;height:46px;border:2px solid var(--accent);box-shadow:0 3px 7px #000000bb,0 0 0 3px #0c0c0c,0 0 12px color-mix(in srgb,var(--accent) 20%,transparent)}.mixer .eq-knob .knob-indicator:after{height:13px;width:3px}.mixer .eq-knob output{color:#ebebeb;font-size:9px}
@media(max-width:1050px){.mixer .eq-knob .knob-dial{width:40px;height:40px}}
@media(max-width:760px){.mixer .eq-knob .knob-dial{width:34px;height:34px}.mixer .eq-knob label{font-size:7px}.mixer .eq-knob output{font-size:7px}}
/* Supplied vinyl artwork spins underneath a fixed, legible BPM instrument. */
.jog .vinyl-art{position:absolute;width:103%;height:103%;max-width:none;inset:-1.5%;border-radius:50%;clip-path:circle(48.7%);object-fit:cover;transform:rotate(var(--rotation));pointer-events:none;z-index:1}.jog .jog-art{display:none}.jog .jog-inner{z-index:3;background:#141414e8;width:39%;height:39%;box-shadow:0 0 0 3px #070707b8,0 2px 12px #000000cc}.jog .jog-inner b{font-size:clamp(24px,2.8vw,40px)}.sync-status{order:7;min-height:18px;padding-top:5px;font-size:9px;font-weight:700;letter-spacing:1px;color:var(--accent);text-align:right}.transport{order:8}
@media(max-width:760px){.jog .jog-inner b{font-size:22px}.sync-status{font-size:7px;letter-spacing:.4px}}
/* Four larger pads across on iPad, with real waveforms and full-size actions. */
.sampler .pads{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.sampler .pad-trigger{position:relative;min-height:135px;height:135px;padding:12px 14px;cursor:pointer;touch-action:manipulation;gap:8px}.sampler .pad-trigger b{font-size:22px;color:#d5d5d5}.sampler .pad-name{font-size:11px;line-height:1.4;min-height:16px;color:#c8c8c8}.pad-wave{width:100%;height:46px;display:block;pointer-events:none;flex:1;min-height:32px}.sampler .pad-opts{grid-template-columns:repeat(3,minmax(0,1fr))}.sampler .pad-opts button{min-height:44px;font-size:12px;padding:8px 6px}.sampler .pad-opts button:first-child{min-height:48px;font-size:15px}.sampler .pad.playing{border-color:#818181;box-shadow:0 0 0 1px #818181,inset 0 0 28px #81818122}.sampler .pad.playing .sample-play{background:#818181;color:#111111}.sampler .pad-trigger.holding{background:#3d3d3d;animation:record-pulse 1.2s ease-in-out infinite}.sampler .pad-trigger.holding b:after{content:' ● REC';font-size:14px;color:#ffffff}.sampler .pad-trigger.holding .pad-name{color:#ffffff;font-weight:700}.sampler .pad.selected:not(.playing){border-color:#818181}.sampler .sampler-footer{font-size:11px;line-height:1.6}.sampler .section-title h2{font-size:20px}.sampler .sample-tools button,.sampler .sample-tools select{min-height:42px;font-size:11px}
@keyframes record-pulse{0%,100%{box-shadow:inset 0 0 0 2px #818181,0 0 8px #81818140}50%{box-shadow:inset 0 0 0 2px #c4c4c4,0 0 22px #81818170;background:#494949}}
@media(max-width:600px){.sampler .pads{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.sampler .pad-trigger{height:132px;min-height:132px;padding:10px}.sampler .pad-name{font-size:10px}.sampler .pad-opts button{font-size:11px;min-height:44px}.sampler .section-title{flex-direction:column}.sampler .sample-tools{justify-content:flex-start}.sampler .sampler-footer{font-size:10px}}
@media(prefers-reduced-motion:reduce){.sampler .pad-trigger.holding{animation:none;outline:2px solid #c4c4c4}}
/* Pan gestures can scroll the app; two-finger pinch must not resize the controls. */
html,body{touch-action:pan-x pan-y}button,a{touch-action:manipulation}
@media(pointer:coarse){input:not([type=range]),select,textarea{font-size:16px!important}}
/* SL-1210 inspired plinth: platter left, long pitch control right, transport below. */
.deck-grid{gap:12px;border:0;background:transparent;overflow:visible;box-shadow:none}.deck-grid .deck{position:relative;padding:12px 18px 15px;border:1px solid #4d4d4d;border-radius:7px;background:linear-gradient(145deg,#323232,#232323 45%,#1a1a1a);box-shadow:inset 0 1px 1px #ffffff18,inset 0 -5px 0 #0c0c0c88,0 8px 16px #00000066}.deck-grid .deck+.deck{border-left:1px solid #4d4d4d}.platter-area{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 88px;gap:18px;padding:30px 3px 10px;align-items:center;min-height:310px}.turntable-mark{position:absolute;top:7px;left:5px;display:flex;align-items:baseline;gap:10px;color:#dfdfdf}.turntable-mark strong{font-size:13px;letter-spacing:2px;font-style:italic}.turntable-mark span{font-size:7px;letter-spacing:1.4px;color:#989898}.platter-area .jog,body.performance-mode .platter-area .jog{width:min(100%,340px);height:auto;aspect-ratio:1;border:8px solid #707070;box-shadow:0 0 0 2px #0a0a0a,0 0 0 5px #3d3d3d,0 10px 14px #000000aa;background:#090909}.jog:after{display:none}.platter-area .jog:before{inset:1px;border:2px dotted #d7d7d7;opacity:.7;z-index:4}.platter-area .jog-inner b{font-size:clamp(26px,3.3vw,46px)}.platter-area .tempo{position:relative;z-index:5;display:flex;flex-direction:column;align-items:center;gap:6px;width:88px;padding:0 0 0 7px;border-left:1px solid #494949}.tempo label{font-size:8px;letter-spacing:1px;color:#bababa}.tempo input[type=number]{width:78px;font-size:22px;text-align:center;background:#131313;border:1px solid #5b5b5b;border-radius:3px;color:#ffffff}.pitch-track{position:relative;height:clamp(145px,17vw,230px);width:76px;background:linear-gradient(90deg,#1d1d1d,#363636,#1d1d1d);border:1px solid #464646;border-radius:3px;padding:6px}.tempo .pitch-track input[type=range]{position:absolute;inset:7px 8px 7px auto;writing-mode:vertical-lr;direction:ltr;width:38px;height:calc(100% - 14px);margin:0;appearance:none;-webkit-appearance:none;background:transparent;cursor:ns-resize;touch-action:none}.pitch-track input::-webkit-slider-runnable-track{width:5px;border:1px solid #070707;border-radius:3px;background:#080808}.pitch-track input::-webkit-slider-thumb{-webkit-appearance:none;width:31px;height:18px;border:1px solid #d8d8d8;border-radius:2px;background:linear-gradient(#c8c8c8,#707070 43%,#121212 46%,#121212 55%,#b1b1b1 59%,#7a7a7a);box-shadow:0 3px 5px #000000bb}.pitch-track input::-moz-range-track{width:5px;background:#080808}.pitch-track input::-moz-range-thumb{width:31px;height:18px;border:1px solid #d8d8d8;border-radius:2px;background:#b4b4b4}.pitch-scale{position:absolute;left:5px;top:12px;bottom:12px;width:25px;font-size:8px;color:#bbbbbb;background:repeating-linear-gradient(to bottom,transparent 0,transparent 10px,#707070 11px,transparent 12px)}.pitch-scale span{position:absolute;left:0;background:#2a2a2a;padding:1px}.pitch-scale span:nth-child(2){top:33.333%;color:var(--accent)}.pitch-scale span:last-child{bottom:0}.tempo .pitch-label{font-size:11px;font-weight:700;color:var(--accent)}.tempo button{min-height:30px;width:100%;font-size:9px;padding:5px;background:#171717}.tonearm-art{position:absolute;right:106px;top:40px;width:40px;height:120px;pointer-events:none;opacity:.65;z-index:0}.tonearm-art:before{content:'';position:absolute;right:2px;top:0;width:31px;height:31px;border:5px solid #7c7c7c;border-radius:50%;background:#171717;box-shadow:0 3px 6px #000000}.tonearm-art i{position:absolute;top:22px;right:16px;width:6px;height:88px;background:linear-gradient(90deg,#464646,#c8c8c8,#5a5a5a);transform:rotate(28deg);transform-origin:top;border-radius:3px}.tonearm-art i:after{content:'';position:absolute;bottom:-5px;left:-5px;width:16px;height:25px;border-radius:2px;background:#191919;border:1px solid #818181}.deck-top{margin-top:7px}.deck .transport{grid-template-columns:1fr 1.5fr 1fr;gap:10px}.deck .transport button{min-height:47px;height:47px;font-size:12px}.deck .transport .play{border-radius:3px;background:linear-gradient(#d8d8d8,#9c9c9c);color:#171717;border-color:#e4e4e4;box-shadow:0 3px 5px #00000099}.deck .transport .play.active{background:linear-gradient(#d8d8d8,#9c9c9c);color:#171717;box-shadow:inset 0 -4px 0 var(--accent),0 0 12px color-mix(in srgb,var(--accent) 25%,transparent)}
@media(max-width:760px){.deck-grid{gap:7px}.deck-grid .deck{padding:7px 8px 10px}.platter-area{grid-template-columns:minmax(0,1fr) 55px;gap:10px;padding:26px 0 7px;min-height:230px}.turntable-mark{left:0;top:5px;gap:5px}.turntable-mark strong{font-size:9px;letter-spacing:1px}.turntable-mark span{font-size:5px;letter-spacing:.6px}.platter-area .jog,body.performance-mode .platter-area .jog{width:100%;height:auto;border-width:5px}.platter-area .jog-inner b{font-size:clamp(15px,3.7vw,28px)}.platter-area .jog-inner span{font-size:5px}.platter-area .tempo{width:55px;gap:4px;padding-left:3px;margin:0}.tempo label{font-size:6px;letter-spacing:0}.tempo input[type=number]{width:50px;font-size:16px}.pitch-track{height:137px;width:50px;padding:3px}.tempo .pitch-track input[type=range]{right:1px;width:29px}.pitch-scale{font-size:6px;width:20px;left:2px}.pitch-track input::-webkit-slider-thumb{width:23px;height:15px}.tempo .pitch-label{font-size:8px}.tempo button{font-size:7px;min-height:27px;padding:3px}.tonearm-art{display:none}.deck .transport{gap:4px}.deck .transport button{min-height:40px;height:40px;font-size:8px}.deck .transport .play{font-size:10px}}
@media(max-width:420px){.deck-grid{grid-template-columns:1fr}.platter-area{grid-template-columns:minmax(0,1fr) 65px;min-height:260px}.platter-area .jog,body.performance-mode .platter-area .jog{max-width:245px}.platter-area .tempo{width:65px}.pitch-track{width:58px;height:170px}.platter-area .jog-inner b{font-size:30px}.turntable-mark strong{font-size:11px}.deck .transport button{font-size:11px}.deck .transport .play{font-size:13px}}
/* Explicit pink actions and touch-friendly rotary controls with precise nudges. */
.sampler .pad-opts{padding:8px;gap:7px;background:#151515;border-top:1px solid #3c3c3c}.sampler .pad-opts button{background:#666666;color:#ffffff;border:1px solid #ababab;border-radius:5px;box-shadow:0 3px 0 #3b3b3b;min-height:44px;font-size:12px;font-weight:700}.sampler .pad-opts button:hover{background:#7c7c7c}.sampler .pad-opts button:first-child{background:#818181;color:#0d0d0d;font-size:15px}.sampler .pad-opts button[aria-pressed=true]{background:#cecece;color:#121212;border-color:#ffffff}.sampler .pad-opts button:disabled{opacity:.4}.deck-loop-dock{order:9;padding-top:7px}.deck-loop-dock .section-label{font-size:9px;margin:5px 0 8px}.deck-loop-dock .loop-row{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}.deck-loop-dock button{background:#242424;color:#cecece;border:1px solid #626262;min-height:42px;font-size:12px;font-weight:700;padding:5px}.deck-loop-dock button.active{background:#818181;color:#0d0d0d;border-color:#d3d3d3}.deck-loop-dock button:disabled{opacity:.35}.mixer .knob-dial,.mixer .eq-knob .knob-dial{width:52px;height:52px}.knob-dial input{touch-action:none;inset:-8px;width:calc(100% + 16px);height:calc(100% + 16px);max-width:none}.dial-adjust{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;margin-top:7px;width:100%;max-width:110px}.dial-adjust button{min-height:32px;padding:3px;font-size:15px;background:#2a2a2a;color:#e0e0e0;border:1px solid #575757}.mixer .channel{row-gap:9px}.mixer .channel-output{height:100%;align-items:center}.mixer .fader input{min-height:100px}
@media(max-width:1050px){.mixer .knob-dial,.mixer .eq-knob .knob-dial{width:44px;height:44px}.dial-adjust button{font-size:13px;min-height:30px}}
@media(max-width:760px){.mixer .channels{grid-template-columns:1fr!important;gap:18px}.mixer .channel{grid-template-columns:repeat(3,minmax(0,1fr)) 30px;gap:8px 14px}.mixer .knob-dial,.mixer .eq-knob .knob-dial{width:50px;height:50px}.dial-adjust button{min-height:36px;font-size:16px}.deck-loop-dock .loop-row{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.deck-loop-dock button{min-height:36px;font-size:10px}.deck-loop-dock .section-label{font-size:6px}}
/* Direct sliders replace rotary gestures and nudge buttons. */
.mixer .slider-control{display:flex;flex-direction:column;gap:5px;align-items:stretch;min-width:0;width:100%;padding:4px 0}.mixer .slider-control label{text-align:center;font-size:10px;color:#c5c5c5;font-weight:700;letter-spacing:.8px}.mixer .slider-control output{text-align:center;height:auto;font-size:10px;color:#e5e5e5;margin:0}.mix-slider{width:100%;height:44px;margin:0;accent-color:#818181;touch-action:pan-y;cursor:ew-resize}.mixer .channel{grid-template-columns:repeat(3,minmax(0,1fr)) 36px;gap:7px 15px}.mixer .channel-output{grid-column:4;grid-row:2/4}.mixer .cue-monitor{grid-column:1/4}.sampler .pad-trigger{cursor:default}.sampler .pad-opts .sample-record{grid-column:1/-1;background:#4e4e4e;color:white;border-color:#a4a4a4;min-height:46px;font-size:14px}.sampler .pad-opts .sample-record[aria-pressed=true]{background:#ababab;color:#131313}.sampler .pad-opts .sample-play{grid-column:1/-1;background:#818181;color:#0d0d0d;min-height:46px;font-size:15px}.sampler .pad-opts button:first-child{background:#4e4e4e;color:white}.sampler .pad-opts button:disabled{cursor:default}
@media(max-width:760px){.mixer .channel{grid-template-columns:repeat(3,minmax(0,1fr)) 30px;gap:7px 10px}.mixer .slider-control label,.mixer .slider-control output{font-size:9px}}
.mix-slider::-webkit-slider-thumb{width:24px;height:24px}.mix-slider::-moz-range-thumb{width:24px;height:24px}
.sampler .pad-trigger{cursor:pointer;border-radius:5px 5px 0 0;transition:background .12s,box-shadow .12s}.sampler .pad-trigger:not(:disabled):hover{background:#2b2b2b}.sampler .pad-trigger:not(:disabled):active{background:#818181;box-shadow:inset 0 0 0 3px #c6c6c6}.sampler .pad.playing .pad-trigger{background:#2d2d2d;box-shadow:inset 0 0 0 2px #818181}.sampler .pad-trigger:disabled{opacity:1;cursor:default}.sampler .pad-trigger:focus-visible{outline:3px solid #cfcfcf;outline-offset:-4px}
.sample-playback-status{margin-top:13px;padding:10px 12px;border:1px solid #4f4f4f;background:#1e1e1e;color:#cbcbcb;border-radius:4px;font-size:12px;font-weight:700;letter-spacing:.4px}
.beat-lab .section-title h2{font-size:24px}.beat-controls{display:flex;align-items:center;flex-wrap:wrap;gap:9px}.beat-controls button{min-height:44px;border-color:#6b6b6b;background:#2e2e2e;color:#dbdbdb}.beat-controls button.primary{background:#818181;color:#0f0f0f}.beat-controls button[aria-pressed=true]{background:#cbcbcb;color:#121212}.beat-controls label{display:flex;align-items:center;gap:6px;font-size:11px}.beat-controls input{width:75px;min-height:42px;background:#101010;border:1px solid #696969;border-radius:4px;text-align:center;color:#ffffff}.beat-status{font-size:12px;color:#c6c6c6;line-height:1.5}.beat-scroll{overflow-x:auto;padding:4px 3px 12px}.beat-matrix{display:grid;grid-template-columns:142px repeat(16,minmax(36px,1fr));gap:7px;min-width:850px;align-items:center}.beat-matrix>span{text-align:center;color:#bcbcbc;font-size:10px}.beat-row-label{display:flex;gap:5px;align-items:center}.beat-row-label select{min-width:0;width:94px;min-height:42px;background:#1b1b1b;border:1px solid #6d6d6d;color:#ffffff;border-radius:4px;font-size:11px}.beat-row-label button{font-size:9px;padding:4px;min-height:40px}.beat-step{height:45px;min-height:45px;background:#303030;border:1px solid #5f5f5f;border-radius:5px;padding:0;font-size:17px;color:#111111}.beat-step.downbeat{background:#414141;border-color:#6a6a6a}.beat-step[aria-pressed=true]{background:#818181;color:#0d0d0d;border-color:#cdcdcd;box-shadow:0 3px 0 #434343}.beat-step.current{outline:3px solid #ffffff;outline-offset:0;filter:brightness(1.25)}
@media(max-width:760px){.beat-lab .section-title{flex-direction:column;align-items:flex-start;gap:10px}.beat-controls{gap:6px}.beat-controls button{font-size:11px}.beat-status{font-size:11px}.beat-row-label select{font-size:12px!important}}
/* Compact deck workspace leaves room for the mixer and creative sections on iPad. */
.deck-grid .deck{padding:8px 12px 10px}.deck>.wave,body.performance-mode .deck>.wave{height:42px}.deck>.overview,body.performance-mode .deck>.overview{height:13px;margin-top:2px}.deck .time-row{font-size:9px;margin:3px 0}.deck .track-title{font-size:17px;margin:0 0 2px}.deck .track-subtitle{font-size:7px;margin:0 0 3px}.deck .platter-area{min-height:0;padding:23px 4px 4px;grid-template-columns:minmax(0,1fr) 96px;gap:12px}.platter-area .jog,body.performance-mode .platter-area .jog{width:clamp(140px,18vh,195px);max-width:95%;height:auto;border-width:6px}.platter-area .jog-inner b{font-size:clamp(24px,3vw,34px)}.platter-area .jog-inner span{font-size:7px}.platter-area .tempo{display:grid;grid-template-columns:1fr 1fr;width:96px;padding-left:7px;gap:3px 4px;align-items:center}.tempo>label,.tempo>input[type=number],.tempo>.pitch-track,.tempo>.pitch-label{grid-column:1/-1}.tempo label{font-size:7px}.tempo input[type=number]{width:100%;font-size:18px;padding:2px;height:25px}.tempo .pitch-track{height:104px;width:100%}.tempo .pitch-track input[type=range]{right:14px;width:36px}.tempo .pitch-label{font-size:9px}.tempo button{font-size:7px;padding:3px;min-height:27px;width:auto}.deck .tonearm-art{top:30px;right:110px;height:85px;transform:scale(.7);transform-origin:top right}.turntable-mark{top:5px}.turntable-mark strong{font-size:10px}.turntable-mark span{font-size:6px}.deck .deck-top{height:28px;margin-top:3px}.deck-top button{min-height:28px;padding:4px 9px}.deck .sync-status{font-size:8px;min-height:16px;padding-top:3px}.deck .transport{margin-top:3px;gap:7px}.deck .transport button{min-height:40px;height:40px;font-size:11px}.deck .transport .play{font-size:12px}.deck-loop-dock{padding-top:3px}.deck-loop-dock .section-label{font-size:7px;margin:4px 0 6px}.deck-loop-dock button{min-height:36px;font-size:11px}.deck-loop-dock .loop-row{gap:5px}
@media(max-width:760px){.deck-grid .deck{padding:6px 7px 8px}.deck>.wave,body.performance-mode .deck>.wave{height:34px}.deck .track-title{font-size:14px}.deck .platter-area{grid-template-columns:minmax(0,1fr) 60px;gap:6px;padding:20px 0 2px}.platter-area .jog,body.performance-mode .platter-area .jog{width:clamp(90px,18vh,165px);max-width:95%;border-width:4px}.platter-area .jog-inner b{font-size:clamp(16px,3vw,25px)}.platter-area .tempo{width:60px;gap:3px;padding-left:4px}.tempo input[type=number]{font-size:16px;height:24px}.tempo label{font-size:6px}.tempo .pitch-track{height:95px}.tempo .pitch-track input[type=range]{right:2px;width:30px}.tempo button{grid-column:1/-1;min-height:23px;font-size:6px}.deck .transport button{font-size:8px;min-height:36px;height:36px}.deck .transport .play{font-size:10px}.deck .sync-status{font-size:6px}.deck-loop-dock .loop-row{grid-template-columns:repeat(4,minmax(0,1fr))}.deck-loop-dock button{min-height:31px;font-size:9px}}
/* A selected next sample stays visibly armed until the current one ends. */
.sampler .pad.queued{border:2px solid #dbdbdb;box-shadow:0 0 16px #81818170}.sampler .pad.queued .pad-trigger{background:#484848;box-shadow:inset 0 0 0 2px #c3c3c3}.sampler .pad.queued .pad-trigger b,.sampler .pad.queued .pad-name{color:#ffffff}.sampler .pad.queued .pad-trigger b:after{content:' · NEXT';font-size:12px;letter-spacing:1px}.sampler .pad.queued .sample-play{background:#dbdbdb;color:#191919}
.mix-points-panel{border-top:1px solid #474747;margin-top:12px;padding-top:12px}.mix-points-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:11px;letter-spacing:1px}.mix-points-panel p{font-size:11px;color:#b8b8b8;line-height:1.5}.mix-points-panel button{min-height:40px;background:#2c2c2c;border-color:#5b5b5b;color:#dddddd;font-size:11px}.mix-point{display:grid;grid-template-columns:minmax(0,1fr) 80px 115px;gap:7px;margin-top:7px}.mix-point button:first-child{text-align:left}@media(max-width:760px){.mix-point{grid-template-columns:1fr 1fr}.mix-point button:first-child{grid-column:1/-1}.mix-points-panel button{font-size:10px}}
/* iPad touch targets remain usable even in the compact deck layout. */
@media(pointer:coarse){button,.button{min-height:44px!important;min-width:44px}select{min-height:44px}header,body.performance-mode header{height:54px}body.performance-mode main{height:calc(100dvh - 54px)}.beat-matrix{grid-template-columns:142px repeat(16,minmax(44px,1fr));min-width:970px}.mix-point{grid-template-columns:minmax(0,1fr) 82px 118px}}
@media(pointer:coarse) and (max-width:760px){.mix-point{grid-template-columns:1fr 1fr}.mix-point button:first-child{grid-column:1/-1}}
.bar-position{font-size:12px;color:var(--accent);letter-spacing:1px}.time-row{gap:10px}.extract-row{order:10;display:grid;grid-template-columns:85px 1fr 1fr;align-items:center;gap:7px;margin-top:7px;padding-top:7px;border-top:1px solid #474747}.extract-row label{font-size:9px;color:#c5c5c5}.extract-row select{width:100%;background:#181818;border:1px solid #585858;color:#dedede;border-radius:4px;font-size:11px}.extract-row button{min-height:40px;font-size:11px;background:#2d2d2d;border-color:#656565;color:#dddddd}#snapBars{color:#cacaca;border-color:#686868}@media(max-width:760px){.extract-row{grid-template-columns:50px 1fr 1fr;gap:4px}.extract-row button{font-size:8px;padding:3px}.bar-position{font-size:9px}.workspace-bar{height:auto;min-height:45px;gap:7px}.mini-actions{flex-wrap:wrap;justify-content:flex-end}.extract-row select{font-size:11px!important}}
[hidden]{display:none!important}.view-navigation{position:sticky;top:0;z-index:35;background:#121212;padding:4px 0 0;box-shadow:0 3px 10px #00000066}.view-tabs{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}.view-tabs button{min-height:44px;background:#252525;color:#cbcbcb;border:1px solid #545454;font-size:12px;white-space:nowrap}.view-tabs button[aria-selected=true]{background:#818181;color:#101010;border-color:#cfcfcf}.global-deck-status{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:5px 0}.global-deck-status>div{display:flex;align-items:center;gap:9px;min-width:0}.global-deck-status button{flex:none;min-height:36px;min-width:54px;padding:5px 9px;color:#b6b6b6;border-color:#565656}.global-deck-status span{font-size:10px;color:#d1d1d1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.crossfader-dock{top:98px;margin:5px 0 8px}.view-navigation~.deck-grid{margin-top:8px}.view-navigation~.panel,.view-navigation~.performance-bank{margin-top:8px}main>footer{padding:14px 0}.time-row .bar-position{margin-right:auto}@media(max-width:760px){.view-tabs{gap:4px;display:flex;overflow-x:auto}.view-tabs button{flex:0 0 auto;padding:8px 12px;font-size:11px}.global-deck-status{gap:8px}.global-deck-status span{font-size:8px}.global-deck-status button{min-width:44px}.crossfader-dock{top:98px}.workspace-bar{font-size:7px}}


/* Studio 16: neutral instruments, real artwork and clear touch interaction. */
:root{--bg:#090909;--panel:#141414;--line:#353535;--muted:#aaa;--text:#f5f5f2;--pink:#f0f0e8;--mint:#c3c3be;--accent:var(--pink);font-family:Inter,'DM Sans',system-ui,sans-serif}
body{background:#090909;color:var(--text)}header{height:68px;padding:0 24px;background:#0d0d0d}.brand{font-family:Inter,system-ui,sans-serif;font-size:23px;letter-spacing:-1px}.brand>span:not(.brand-icon){color:#fff}.brand small{letter-spacing:1.5px;font-size:8px}.brand-icon{color:#eee}.header-actions{gap:7px}.status{color:#bbb}
main{max-width:1440px;padding:0 22px}button,.button{background:#202020;border-color:#484848;color:#ececea;border-radius:5px;min-height:44px;box-shadow:none;font-size:12px;transition:background .15s,transform .1s,border-color .15s}button:hover,.button:hover{background:#303030;border-color:#aaa}button:active:not(:disabled){transform:translateY(1px)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,.volume-dial:focus-visible{outline:2px solid #fff;outline-offset:3px}.primary{background:#ecece6;color:#101010;border-color:#ecece6}.primary:hover{background:#fff;color:#000}button.active,button[aria-pressed=true]{background:#ecece6;color:#111;border-color:#fff;box-shadow:none}button:disabled{opacity:.42}
.workspace-bar{min-height:50px;height:auto;padding:7px 0;letter-spacing:1.2px}.live-dot{background:#ddd}.record-dot{background:#ddd}.view-navigation{background:#090909;box-shadow:none;padding-top:3px}.view-tabs{gap:2px;padding:4px;background:#171717;border:1px solid #333;border-radius:7px}.view-tabs button{border:0;background:transparent;color:#aaa;display:flex;gap:9px;align-items:center;justify-content:center;min-height:46px}.view-tabs button[aria-selected=true]{background:#ecece6;color:#111;box-shadow:0 2px 6px #0003}.ui-icon{width:20px;height:20px;flex:none;vertical-align:middle}.global-deck-status{padding:7px 0}.global-deck-status button{background:#191919;color:#fff;border-color:#444}.global-deck-status span{color:#c6c6c3;font-size:11px}
.crossfader-dock{position:relative;top:auto!important;background:#131313;border:1px solid #383838;padding:7px 15px;margin:1px 0 10px;box-shadow:none}.crossfader-dock .cross-label{font-size:9px;color:#aaa}.crossfader-dock #crossfader::-webkit-slider-runnable-track{background:#080808;border-color:#555}.crossfader-dock #centerCross{background:#252525;color:#ddd;border-color:#555}
.studio-section{background:#141414;border:1px solid #353535;border-radius:7px;overflow:hidden;margin-bottom:12px}.section-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 13px;background:#191919;border-bottom:1px solid #333;min-width:0}.section-toolbar h2{font:600 12px Inter,system-ui,sans-serif;letter-spacing:.4px;margin:0;display:flex;align-items:center;gap:9px;color:#eee}.section-toolbar>div{display:flex;gap:6px}.section-toolbar button{min-height:36px;padding:5px 9px;display:flex;align-items:center;gap:7px;font-size:10px;color:#bbb;background:#202020;border-color:#3c3c3c}.section-toolbar button[aria-pressed=true]{color:#111;background:#ddd}.collapse-toggle[aria-expanded=false] svg{transform:rotate(-90deg)}.section-content{min-width:0}.is-collapsed .section-toolbar{border-bottom:0}.deck-grid.studio-section{display:block;border:1px solid #353535;background:#141414;box-shadow:none}.deck-grid>.section-content{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:#393939}.deck-grid .deck{border:0!important;border-radius:0;background:#141414;box-shadow:none;padding:12px 16px 14px;min-width:0}.deck .deck-top{height:auto;min-height:30px;margin:0 0 9px}.deck-letter{font-size:9px;color:#aaa}.deck-letter strong{background:#eee;color:#111;width:29px;height:29px}.deck-top button{min-height:36px;background:#252525;font-size:10px}.now-playing-card{display:flex;align-items:center;gap:12px;margin:0 0 13px;min-width:0}.cover-button{position:relative;flex:none;width:70px;height:70px;padding:0;overflow:hidden;min-height:0!important;border-color:#555;border-radius:5px;background:#080808}.cover-button img{width:100%;height:100%;object-fit:cover;display:block;filter:grayscale(1);transition:filter .2s}.cover-button:hover img{filter:grayscale(0)}.cover-edit{position:absolute;bottom:0;right:0;display:grid;place-items:center;background:#000b;width:25px;height:25px;color:#fff}.cover-edit svg{width:15px;height:15px}.track-info{min-width:0;flex:1}.track-eyebrow{display:block;font-size:8px;color:#999;letter-spacing:1.7px;margin-bottom:4px}.deck .track-title{font-size:18px;font-weight:650;margin:0 0 4px;color:#fff;letter-spacing:-.3px}.deck .track-subtitle{font-size:9px;color:#a0a09b;margin:0;line-height:1.4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.beat-indicator{display:flex;gap:4px;margin-top:7px}.beat-indicator i{height:3px;width:23px;background:#3b3b3b;border-radius:1px}.beat-indicator i.on{background:#fff}.is-playing .track-eyebrow{color:#eee}.deck>.wave,body.performance-mode .deck>.wave{height:64px;background:#080808;border:1px solid #2b2b2b}.deck>.overview,body.performance-mode .deck>.overview{height:19px;margin-top:4px;opacity:1}.deck .time-row{font:10px ui-monospace,monospace;margin:6px 0 2px;color:#999}.bar-position{color:#eee;font-size:11px}.deck .platter-area{grid-template-columns:minmax(0,1fr) minmax(140px,.85fr);padding:8px 0;gap:14px;min-height:0}.turntable-mark,.tonearm-art{display:none}.platter-area .jog,body.performance-mode .platter-area .jog{width:clamp(130px,20vh,180px);max-width:100%;aspect-ratio:1;border:4px solid #8a8a85;box-shadow:0 0 0 2px #080808,0 0 0 3px #424242;background:#080808}.jog .vinyl-art{filter:grayscale(1) contrast(1.15);opacity:.85}.jog .jog-inner{position:relative;z-index:3;width:66px;height:66px;background:#090909e8;border:1px solid #6b6b67;box-shadow:none}.platter-area .jog-inner b{font:600 25px ui-monospace,monospace;color:#f5f5ef}.platter-area .jog-inner span{font-size:7px;color:#aaa}.platter-area .jog:before{border-color:#aaa}.deck .sync-status{font-size:9px;color:#999;padding:3px 0;min-height:18px}.deck .transport{margin:8px 0;gap:7px}.deck .transport button{min-height:46px;height:46px;font-size:12px;background:#222;color:#ddd;border-color:#505050;box-shadow:none}.deck .transport .play{background:#ecece6;color:#111;border-color:#ecece6;font-size:13px;font-weight:750}.deck .transport .play.active{background:#fff;box-shadow:inset 0 -3px 0 #999;color:#000}.deck-loop-dock{padding:0;margin-top:5px}.deck-loop-dock button{background:#202020;color:#ccc;border:1px solid #464646;min-height:36px;font-size:10px;box-shadow:none}.deck-loop-dock button.active{background:#eee;color:#111;border-color:#fff}.deck-loop-dock .section-label{color:#aaa;font-size:8px}.extract-row{border-color:#333;grid-template-columns:76px 1fr 1fr;padding-top:8px}.extract-row button{background:#222;color:#ddd;border-color:#555;font-size:10px;min-height:38px}.extract-row select{background:#111;color:#eee;border-color:#555}.extract-row label{color:#aaa}
.deck-instruments{display:flex;gap:15px;align-items:center;padding:7px 0;border-top:1px solid #303030}.volume-instrument{display:grid;grid-template-columns:64px 74px;grid-template-rows:22px 22px;align-items:center;column-gap:10px;flex:none}.volume-dial{grid-row:1/3;width:60px;height:60px;border-radius:50%;padding:4px;background:conic-gradient(from 180deg,#eeeeea 0deg var(--volume-angle),#373737 var(--volume-angle) 360deg);cursor:ns-resize;touch-action:none;user-select:none;-webkit-user-select:none}.volume-dial>div{width:100%;height:100%;border-radius:50%;background:radial-gradient(circle at 35% 25%,#333,#111 75%);border:1px solid #626262;display:flex;flex-direction:column;align-items:center;justify-content:center}.volume-dial strong{font:600 17px ui-monospace,monospace;color:#fff}.volume-dial strong span{font-size:9px;color:#aaa}.volume-dial small{font-size:6px;letter-spacing:1px;color:#aaa;margin-top:3px}.signal-meter{height:6px;width:74px;background:repeating-linear-gradient(90deg,#333 0 5px,#141414 5px 7px);overflow:hidden;align-self:end;position:relative}.signal-meter span{display:block;width:0;height:100%;background:repeating-linear-gradient(90deg,#ddd 0 5px,transparent 5px 7px)}.signal-value{font:8px ui-monospace,monospace;color:#aaa;align-self:start;margin-top:5px}.deck-timeline{flex:1;min-width:0}.deck-timeline label{display:flex;justify-content:space-between;font-size:8px;letter-spacing:1px;color:#aaa}.deck-timeline label output{color:#eee;font:10px ui-monospace,monospace}.deck-timeline input{height:36px;accent-color:#ddd}.timeline-help{font-size:8px;color:#888;margin-top:-4px}
/* Pitch uses a conventional wide horizontal slider, with editable fine adjustment. */
.platter-area .tempo.pitch-console{display:flex;flex-direction:column;gap:6px;width:100%;border:0;padding:0;align-items:stretch}.pitch-readouts{display:grid;grid-template-columns:1fr 1fr;gap:9px}.pitch-readouts label{font-size:8px;letter-spacing:.7px;color:#aaa;display:flex;flex-direction:column;gap:4px}.pitch-readouts input[type=number]{font:17px ui-monospace,monospace!important;width:100%!important;height:36px!important;padding:5px!important;background:#080808!important;border:1px solid #444!important;border-radius:4px!important;color:#fff!important;text-align:center}.pitch-lane{display:flex;flex-direction:column;gap:0}.pitch-lane>label{font-size:7px;color:#aaa;letter-spacing:1px}.pitch-console .pitch-lane input[type=range]{appearance:none;-webkit-appearance:none;writing-mode:horizontal-tb;direction:ltr;width:100%;height:44px;min-height:44px;margin:0;touch-action:pan-y;background:transparent;cursor:ew-resize}.pitch-lane input::-webkit-slider-runnable-track{height:6px;background:#080808;border:1px solid #5b5b5b;border-radius:3px}.pitch-lane input::-webkit-slider-thumb{-webkit-appearance:none;width:28px;height:30px;margin-top:-13px;background:linear-gradient(90deg,#999,#eee 45%,#555 48%,#555 53%,#eee 56%,#999);border:1px solid #fff;border-radius:3px;box-shadow:0 2px 4px #0009}.pitch-lane input::-moz-range-track{height:5px;background:#080808;border:1px solid #555}.pitch-lane input::-moz-range-thumb{width:27px;height:29px;background:#ddd;border:1px solid #fff;border-radius:3px}.pitch-ticks{display:flex;justify-content:space-between;font:8px ui-monospace,monospace;color:#aaa;margin-top:-5px}.pitch-console .pitch-label{text-align:center;color:#ddd;font:10px ui-monospace,monospace}.pitch-actions{display:grid;grid-template-columns:1fr 1fr;gap:5px}.pitch-actions select{grid-column:1/-1;border:1px solid #444;background:#202020;color:#ddd;border-radius:4px;min-height:30px;font-size:10px;padding:5px;width:100%}.pitch-actions button{font-size:9px!important;min-height:34px!important;background:#242424!important;color:#ddd!important;border-color:#4b4b4b!important;padding:5px!important}
/* Keep existing functions, but remove colour clutter and oversized instruction blocks. */
.panel,.performance-panel,.mixer{background:#141414;border-color:#353535;box-shadow:none}.mixer.studio-section,.sampler.studio-section,.library.studio-section,.beat-lab.studio-section{padding:0}.mixer>.section-content,.sampler>.section-content,.library>.section-content,.beat-lab>.section-content{padding:16px}.performance-bank.studio-section{display:block}.performance-bank>.section-content{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:12px}.performance-panel{padding:14px}.mixer .slider-control label,.mixer .slider-control output{color:#ccc}.mix-slider{accent-color:#eee}.mixer .channel{--accent:#eee}.mixer .channel-name{color:#fff}.channel-meter span{background:linear-gradient(to top,#888,#eee)}.mixer-heading{color:#ddd}.master input{accent-color:#eee}.section-title h2{font-family:Inter,system-ui,sans-serif;font-size:21px!important;letter-spacing:-.4px}.eyebrow{color:#aaa}.sampler .pad{background:#151515;border:1px solid #444;box-shadow:none}.sampler .pad-trigger{background:#1e1e1e}.sampler .pad-trigger:hover{background:#303030!important}.sampler .pad-trigger b,.sampler .pad-name{color:#eee}.sampler .pad-opts{background:#111;border-color:#383838}.sampler .pad-opts button,.sampler .pad-opts button:first-child,.sampler .pad-opts .sample-record{background:#262626;color:#ddd;border:1px solid #555;box-shadow:none;min-height:38px;font-size:11px}.sampler .pad-opts .sample-play{background:#e7e7e0;color:#111;border-color:#fff}.sampler .pad.playing .pad-trigger,.sampler .pad.queued .pad-trigger{background:#444;box-shadow:inset 0 0 0 2px #fff}.sampler .pad.queued{border-color:#fff;box-shadow:none}.sample-playback-status{background:#202020;color:#ddd;border-color:#555;font-size:10px}.sampler-instructions summary{cursor:pointer;color:#ddd;font-size:11px;padding:8px 0}.sampler-instructions #sampleHint{display:block;max-width:650px;line-height:1.6}.sampler .sampler-footer{align-items:flex-start}.beat-controls button,.beat-controls button.primary,.beat-step{background:#252525;color:#ddd;border-color:#555;box-shadow:none}.beat-step[aria-pressed=true]{background:#ddd;color:#111;border-color:#fff;box-shadow:none}.beat-step.current{outline:2px solid #fff;filter:none}.beat-step.downbeat{background:#383838;border-color:#777}.beat-controls button[aria-pressed=true]{background:#eee;color:#111}.mix-points-panel button{background:#282828;border-color:#555;color:#ddd}.deck-modes button.active,.deck-modes button[aria-selected=true]{background:#ddd;color:#111}.stem-row button{border-color:#555;background:#222;color:#ddd}.stem-row button[aria-pressed=true]{background:#ddd;color:#111}.library-artwork{width:42px;height:42px;object-fit:cover;filter:grayscale(1);border-radius:4px;float:left;margin-right:12px;border:1px solid #555}.library tbody td{vertical-align:middle}.library tbody tr:hover{background:#202020}.library tbody td:nth-child(2){min-width:210px}.library tbody td small{color:#999}.library tbody button{background:#292929;color:#eee;border-color:#555}.empty>span{display:inline-block;width:80px;height:80px;background:center/cover url('./platter-vinyl.jpeg');filter:grayscale(1);border-radius:50%;font-size:0}.empty h3{font-weight:500}.section-title{gap:12px}.library-actions{flex-wrap:wrap}#search{background:#0c0c0c;border-color:#555;color:#eee}#snapBars{background:#202020;border-color:#666;color:#ddd}#snapBars[aria-pressed=true]{background:#e7e7e1;color:#111}footer{font-size:9px}footer a{color:#aaa}#toast{background:#eee;color:#111;border-color:#aaa}dialog{background:#161616;color:#eee;border-color:#555}
/* Density changes are local to each section and never modify its playback. */
.deck-grid.is-compact .now-playing-card{margin-bottom:7px}.deck-grid.is-compact .cover-button{width:48px;height:48px}.deck-grid.is-compact .deck>.wave{height:40px}.deck-grid.is-compact .deck>.overview{height:12px}.deck-grid.is-compact .jog{width:116px!important}.deck-grid.is-compact .pitch-actions{grid-template-columns:1fr 1fr 1fr}.deck-grid.is-compact .pitch-actions select{grid-column:auto;min-width:0}.deck-grid.is-compact .pitch-readouts input{height:30px!important}.deck-grid.is-compact .pitch-console{gap:3px}.deck-grid.is-compact .deck .platter-area{padding:3px 0}.deck-grid.is-compact .timeline-help{display:none}.deck-grid.is-compact .deck .track-title{font-size:15px}.deck-grid.is-compact .deck{padding:9px 12px}.sampler.is-compact .pads{grid-template-columns:repeat(4,minmax(0,1fr))}.sampler.is-compact .pad-trigger{height:76px;min-height:76px}.sampler.is-compact .pad-wave{height:25px}.sampler.is-compact .sampler-footer{display:none}.library.is-compact tbody td{padding:6px 9px}.library.is-compact .library-artwork{width:32px;height:32px}.library.is-compact tbody td small{display:none}.mixer.is-compact .section-content{padding:8px 12px}.mixer.is-compact .slider-control{gap:1px;padding:0}.mixer.is-compact .mix-slider{height:32px}.beat-lab.is-compact .section-content{padding:8px}.beat-lab.is-compact .section-title{margin-bottom:4px}.beat-lab.is-compact .beat-status{display:none}.performance-bank.is-compact .performance-panel{padding:8px}.performance-bank.is-compact .mix-points-panel p{display:none}
@media(max-width:900px){header{padding:0 14px}.brand small,.status{display:none}main{padding:0 12px}.mini-actions button{font-size:10px;padding:7px 9px}.workspace-bar>div:first-child{display:none}.workspace-bar{justify-content:flex-end}.deck-grid .deck{padding:10px}.deck .platter-area{grid-template-columns:minmax(110px,.8fr) minmax(130px,1fr);gap:8px}.platter-area .jog,body.performance-mode .platter-area .jog{width:145px}.deck .track-title{font-size:16px}.cover-button{width:56px;height:56px}.volume-instrument{grid-template-columns:54px 55px;gap:7px}.volume-dial{width:52px;height:52px}.signal-meter{width:55px}.deck-instruments{gap:9px}.view-tabs button{font-size:11px;gap:5px}.section-toolbar{padding:7px 10px}.deck-loop-dock .loop-row{grid-template-columns:repeat(7,minmax(0,1fr))}.deck-loop-dock button{font-size:8px;padding:4px}.timeline-help{font-size:7px}}
@media(max-width:600px){header{height:auto;min-height:60px;padding:9px 12px;gap:8px;flex-wrap:wrap}.brand{font-size:21px}.brand-icon{font-size:27px}.header-actions{margin-left:auto;gap:4px}.header-actions button{font-size:10px;padding:6px 9px}#fullscreen{display:none}.view-tabs{overflow-x:auto;display:flex}.view-tabs button{flex:0 0 auto;padding:8px 13px}.global-deck-status span{font-size:9px}.deck-grid>.section-content{grid-template-columns:1fr;gap:1px}.deck-grid .deck{padding:12px 14px}.deck .platter-area{grid-template-columns:minmax(115px,1fr) minmax(150px,1fr)}.platter-area .jog,body.performance-mode .platter-area .jog{width:155px}.deck>.wave,body.performance-mode .deck>.wave{height:58px}.deck-loop-dock button{font-size:10px}.section-toolbar h2{font-size:11px}.section-toolbar button{font-size:9px;gap:4px;padding:5px 7px}.section-toolbar button .ui-icon{width:15px;height:15px}.performance-bank>.section-content{grid-template-columns:1fr}.library-actions{width:100%}.library-actions input{width:100%}.section-title{flex-wrap:wrap}.sampler .pads,.sampler.is-compact .pads{grid-template-columns:repeat(2,minmax(0,1fr))}.deck .transport button{font-size:12px}.sampler .sample-tools{flex-wrap:wrap}.signal-value{font-size:7px}.volume-instrument{grid-template-columns:58px 66px}.signal-meter{width:66px}.deck-grid.is-compact .pitch-actions{grid-template-columns:1fr 1fr}.deck-grid.is-compact .pitch-actions select{grid-column:1/-1}.global-deck-status button{min-width:44px}}
@media(pointer:coarse){.pitch-readouts input[type=number]{min-height:40px!important}.pitch-actions select,.pitch-actions button{min-height:44px!important}.volume-dial{min-width:52px;min-height:52px}.section-toolbar button{min-height:44px}.pitch-console .pitch-lane input[type=range]{height:48px;min-height:48px}.deck .transport button{min-height:48px;height:48px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.jog .vinyl-art{transform:none}}
/* A physical three-inch size varies by device: target a 288px centre EQ. */
.deck-grid>.section-content{grid-template-columns:minmax(0,1fr) 184px minmax(0,1fr);align-items:start;gap:1px}.centre-mixer.studio-section{border:0;border-radius:0;margin:0;align-self:start;max-height:300px;overflow:auto;scrollbar-width:thin;background:#101010}.centre-mixer>.section-toolbar{padding:6px 8px;gap:4px;min-height:42px;position:sticky;top:0;z-index:2;background:#1c1c1c}.centre-mixer .section-toolbar h2{font-size:10px;gap:5px}.centre-mixer .section-toolbar h2 svg{width:15px;height:15px}.centre-mixer .section-toolbar>div{gap:3px}.centre-mixer .section-toolbar button{padding:3px;min-width:30px;min-height:30px}.centre-mixer .section-toolbar button span{display:none}.centre-mixer .section-toolbar button svg{width:15px;height:15px}.centre-mixer>.section-content,.centre-mixer.is-compact>.section-content{padding:7px 9px}.centre-mixer .channels{display:grid!important;grid-template-columns:1fr 1fr!important;gap:12px!important}.centre-mixer .channel,.centre-mixer.is-compact .channel{display:flex!important;flex-direction:column;align-items:stretch;gap:4px!important;min-width:0}.centre-mixer .channel-name{font-size:10px;margin:0 0 3px}.centre-mixer .knob-control,.centre-mixer.is-compact .knob-control{gap:0;padding:0;margin:0}.centre-mixer .knob-control label{display:flex;justify-content:space-between;gap:2px;align-items:center;font-size:8px;letter-spacing:0;color:#aaa;text-align:left}.centre-mixer .knob-control output{font-size:7px;height:auto;display:inline;color:#ddd}.centre-mixer .mix-slider,.centre-mixer.is-compact .mix-slider{height:30px;min-height:30px}.centre-mixer .channel-output{display:flex;flex-direction:row;gap:4px;align-items:center;height:auto!important}.centre-mixer .channel-meter{width:6px;height:30px;margin:0;flex:none}.centre-mixer .fader{min-width:0;flex:1}.centre-mixer .fader label{font-size:7px}.centre-mixer .fader input{writing-mode:horizontal-tb!important;appearance:auto!important;-webkit-appearance:auto!important;min-height:28px!important;height:28px!important;width:100%!important;accent-color:#ddd}.centre-mixer .cue-monitor{font-size:7px;padding:3px;min-height:28px;margin:0;width:100%}.mixer-extras{margin-top:7px;border-top:1px solid #363636;padding-top:4px}.mixer-extras>summary{cursor:pointer;padding:8px 0;font-size:9px;color:#bbb}.extra-channels{display:grid;grid-template-columns:1fr 1fr;gap:10px}.extra-channel b{font-size:8px;color:#aaa}.mixer-extras .master{margin-top:8px}.mixer-extras .master p{font-size:8px}.centre-mixer:not(.is-compact){max-height:480px}.centre-mixer:not(.is-compact) .mix-slider{height:42px;min-height:42px}.centre-mixer:not(.is-compact) .section-content{padding:10px}.centre-mixer .section-toolbar .collapse-toggle{display:none}
@media(min-width:1100px){.deck .platter-area{grid-template-columns:minmax(130px,1fr) minmax(150px,.85fr)}.deck-grid>.section-content{grid-template-columns:minmax(0,1fr) 202px minmax(0,1fr)}}
@media(min-width:761px) and (max-width:1100px){.deck .platter-area{grid-template-columns:1fr}.deck .tempo.pitch-console{max-width:none}.deck .jog{width:110px!important}.deck .pitch-readouts input[type=number]{font-size:15px!important}.deck .platter-area .jog-inner b{font-size:23px}.deck-instruments{gap:7px}.volume-instrument{grid-template-columns:50px 38px;gap:5px}.signal-meter{width:38px}.signal-value{font-size:6px}.deck-timeline label{font-size:6px}.deck .track-title{font-size:14px}.cover-button{width:46px;height:46px}.now-playing-card{gap:7px}.deck .transport{gap:4px}.deck .transport button{font-size:9px;padding:5px}.deck-loop-dock .loop-row{grid-template-columns:repeat(4,minmax(0,1fr))}.extract-row{grid-template-columns:1fr 1fr}.extract-row label{grid-column:1/-1;display:flex;align-items:center;gap:8px}.extract-row select{width:auto;flex:1}.extract-row button{font-size:9px}}
@media(max-width:760px){.deck-grid>.section-content{grid-template-columns:repeat(2,minmax(0,1fr))}.centre-mixer.studio-section{grid-column:1/-1;grid-row:2;width:100%;max-height:300px;border-top:1px solid #333;border-bottom:1px solid #333}.centre-mixer .channels{gap:24px!important}.centre-mixer .channel{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:4px 12px!important}.centre-mixer .channel-name{grid-column:1/-1}.centre-mixer .channel-output{grid-column:1/3!important;grid-row:auto!important}.centre-mixer .cue-monitor{grid-column:3!important;grid-row:auto!important}.centre-mixer .channel-meter{height:24px}.centre-mixer .section-toolbar button span{display:inline;font-size:8px}.centre-mixer .section-toolbar .collapse-toggle{display:flex}.centre-mixer .mixer-extras{margin-top:4px}.deck .platter-area{grid-template-columns:1fr}.deck .jog,body.performance-mode .deck .jog{width:110px!important}.deck .transport button{font-size:9px!important;padding:4px!important}.deck .transport .play{font-size:10px!important}.deck .track-title{font-size:13px}.cover-button{width:40px;height:40px}.now-playing-card{gap:7px}.deck .track-eyebrow{font-size:6px;letter-spacing:.7px}.deck .track-subtitle{font-size:7px}.deck .deck-top button{font-size:8px}.deck-letter{font-size:7px;gap:5px}.deck-instruments{flex-direction:column;align-items:stretch}.volume-instrument{grid-template-columns:52px 1fr;column-gap:8px}.signal-meter{width:100%}.deck-timeline .timeline-help{display:none}.deck-loop-dock .loop-row{grid-template-columns:repeat(4,minmax(0,1fr))}.extract-row{grid-template-columns:1fr 1fr}.extract-row label{grid-column:1/-1;display:flex;align-items:center;gap:6px}.extract-row select{width:auto;flex:1}.extract-row button{font-size:8px;padding:4px}.deck .pitch-actions select{font-size:8px}.deck .pitch-readouts{gap:4px}.deck .pitch-readouts label{font-size:6px}.deck .pitch-readouts input[type=number]{font-size:14px!important}.deck-grid.is-compact .jog{width:92px!important}}
@media(pointer:coarse){.centre-mixer .mix-slider,.centre-mixer.is-compact .mix-slider{height:36px;min-height:36px}.centre-mixer .section-toolbar button{min-width:36px!important;min-height:36px!important}.centre-mixer .cue-monitor{min-height:36px!important}.centre-mixer.studio-section{max-height:320px}}
.phrase-planner{grid-column:1/-1;display:grid;grid-template-columns:160px minmax(0,1fr);background:#101010;border:1px solid #464646;border-radius:6px;overflow:hidden}.planner-cover{position:relative;min-height:190px;background:#000;overflow:hidden}.planner-cover img{position:absolute;width:145%;height:120%;object-fit:cover;filter:grayscale(1) contrast(1.4);opacity:.35;left:-25%;top:0}.planner-cover>span{position:relative;display:block;font:900 28px/1 Inter,system-ui,sans-serif;letter-spacing:-1px;padding:21px 13px;color:white}.planner-cover small{display:block;font:9px ui-monospace,monospace;letter-spacing:2px;margin-top:14px}.planner-body{padding:16px}.planner-body h3{font-size:20px;letter-spacing:-.5px;margin:5px 0 9px}.planner-body p{color:#aaa;font-size:11px;line-height:1.6;margin:0 0 12px}.planner-controls{display:flex;gap:7px;align-items:center;flex-wrap:wrap}.planner-controls label{font-size:10px;color:#aaa;display:flex;align-items:center;gap:7px}.planner-controls select{background:#222;color:#eee;border:1px solid #555;border-radius:4px;min-height:40px;padding:5px;font-size:11px}.planner-controls button{font-size:10px}.planner-status{display:block;padding:12px 0 7px;color:#eee;font:11px/1.5 ui-monospace,monospace}.planner-note{display:block;font-size:9px;color:#aaa;line-height:1.5}.performance-bank.is-compact .planner-cover{min-height:145px}.performance-bank.is-compact .planner-body p{display:none}
@media(max-width:600px){.phrase-planner{grid-template-columns:80px minmax(0,1fr)}.planner-cover>span{font-size:17px;padding:15px 8px}.planner-cover small{font-size:7px;letter-spacing:1px}.planner-body{padding:12px}.planner-body h3{font-size:17px}.planner-controls{gap:5px}.planner-controls button{font-size:9px;padding:5px 7px}.planner-status{font-size:10px}}
.centre-strip{min-width:0;background:#101010;align-self:start}.touch-fx{margin:9px;padding:9px;border:1px solid #414141;border-radius:5px;background:#171717}.touch-fx-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:7px;gap:6px}.touch-fx-heading b{font-size:9px;letter-spacing:1.4px}.touch-fx-heading select{font-size:10px;min-height:28px!important;background:#242424;color:#eee;border:1px solid #555;border-radius:3px;padding:3px 7px;max-width:74px}.touch-fx-surface{display:block;position:relative;width:100%;height:86px;min-height:86px!important;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none;border:1px solid #777;border-radius:4px;background:repeating-linear-gradient(0deg,transparent 0 20px,#ffffff09 20px 21px),repeating-linear-gradient(90deg,#101010 0 20px,#ffffff09 20px 21px)!important;box-shadow:inset 0 0 30px #0008;transform:none!important;cursor:crosshair}.touch-fx-surface:before,.touch-fx-surface:after{content:'';position:absolute;pointer-events:none;background:#8884}.touch-fx-surface:before{height:1px;left:0;right:0;top:50%}.touch-fx-surface:after{width:1px;top:0;bottom:0;left:50%}.touch-fx-surface i{position:absolute;width:19px;height:19px;margin:-9px 0 0 -9px;border:1px solid #fff;border-radius:50%;background:#ffffff45;left:50%;top:75%;opacity:0;box-shadow:0 0 0 6px #ffffff09;pointer-events:none}.touch-fx.performing .touch-fx-surface{border-color:#fff}.touch-fx.performing .touch-fx-surface i{opacity:1}.fx-axis-x{position:absolute;bottom:5px;left:5px;color:#999;font:6px ui-monospace,monospace;letter-spacing:1px}.fx-axis-y{position:absolute;right:5px;top:5px;color:#999;font:6px ui-monospace,monospace;letter-spacing:1px}.fx-idle{position:absolute;left:0;right:0;top:38px;font:7px ui-monospace,monospace;letter-spacing:1px;color:#ccc}.performing .fx-idle{display:none}.touch-fx output{display:block;font:7px ui-monospace,monospace;color:#aaa;margin-top:7px;text-align:center;min-height:9px}
@media(max-width:760px){.centre-strip{grid-column:1/-1;grid-row:2;display:grid;grid-template-columns:minmax(0,1fr) 145px;align-items:start;border-top:1px solid #333}.centre-strip .centre-mixer{grid-column:auto;grid-row:auto;border:0}.centre-strip .centre-mixer .channel{display:flex!important;gap:2px!important}.centre-strip .centre-mixer .channels{gap:12px!important}.centre-strip .touch-fx{margin:9px 9px 9px 0}.touch-fx-surface{height:110px;min-height:110px!important}.fx-idle{font-size:6px;top:48px}.centre-strip .centre-mixer .cue-monitor{font-size:6px}.centre-strip .centre-mixer .knob-control label{font-size:7px}.centre-strip .centre-mixer .knob-control output{font-size:6px}}
.extract-row .remix-open{grid-column:1/-1;background:#e5e5df;color:#111;border-color:#fff}.remix-dialog{max-width:560px;width:calc(100% - 28px);padding:24px;border-radius:8px}.remix-dialog h2{font-size:25px;letter-spacing:-.6px}.remix-dialog p{font-size:12px;line-height:1.65;color:#bbb}.remix-dialog .remix-track{color:#fff;overflow-wrap:anywhere}.remix-dialog select{min-height:44px;background:#252525;color:#eee;border:1px solid #666;border-radius:5px;padding:8px;font:12px system-ui,sans-serif}.remix-dialog .remix-note{font-size:10px}.remix-dialog audio{width:100%;margin:8px 0 15px;display:block}.remix-dialog audio[hidden]{display:none}.remix-save{width:100%}


/* All-in-one console: recessed display above two decks, EQ in the middle, fader below. */
.hardware-console.studio-section{background:#302831;border:1px solid #766875;border-radius:12px;box-shadow:0 15px 30px #100b164d,inset 0 1px 0 #e2b9d227}.hardware-console>.section-toolbar{background:linear-gradient(180deg,#413543,#2a222d);border-color:#665263}.hardware-console>.section-content{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 192px minmax(0,1fr);gap:0;background:linear-gradient(135deg,#39313c,#29212d 45%,#383039);padding:14px 12px 13px;align-items:start}.console-screen{grid-column:1/-1;grid-row:1;width:min(640px,76%);justify-self:center;background:#170e20;border:8px solid #39313d;border-bottom-width:12px;border-radius:9px;box-shadow:0 0 0 1px #877180,0 0 0 3px #211725,0 7px 14px #140b1e66,inset 0 0 0 1px #966692;overflow:hidden;margin:0 0 20px}.screen-top,.screen-bottom{display:flex;align-items:center;justify-content:space-between;gap:9px;padding:7px 12px;background:#35213b;color:#d4afdf;font:8px ui-monospace,monospace;letter-spacing:1px}.screen-top>span{color:#ff9ac4;font-weight:800}.screen-top b{color:#bd99c7;font-weight:400;font-size:7px;margin-left:8px}.screen-top .screen-browse{font-size:9px;min-height:32px;padding:5px 10px;background:#68396f;border-color:#bd82b1;color:#ffe4fc;box-shadow:none}.screen-decks{display:grid;grid-template-columns:1fr 1fr}.screen-deck{--screen-accent:#ff5799;min-width:0;padding:10px 12px;background:linear-gradient(#25152d,#1c1023)}.screen-deck-B{--screen-accent:#ffb34c;border-left:1px solid #5d3b62}.screen-track{display:flex;gap:7px;align-items:center;margin-bottom:8px;min-width:0}.screen-deck-letter{font-size:17px;color:var(--screen-accent);flex:none}.screen-track>div{min-width:0;flex:1}.screen-track-name{display:block;font:600 11px system-ui,sans-serif;color:#fff0f9;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.screen-track-state{display:block;font:7px ui-monospace,monospace;color:var(--screen-accent);letter-spacing:1px;margin-top:3px}.screen-bpm{font:600 22px ui-monospace,monospace;color:var(--screen-accent);flex:none}.screen-bpm small{font-size:7px;color:#cdaecf}.screen-wave{display:block;width:100%;height:50px;background:#130a1b;border:1px solid #59385e;border-radius:3px;touch-action:pan-y;cursor:crosshair}.screen-position{display:flex;align-items:center;justify-content:space-between;gap:8px;font:9px ui-monospace,monospace;margin-top:6px;color:#e0bbdf}.screen-bar{color:var(--screen-accent)}.screen-position .screen-play{min-height:30px;padding:4px 12px;background:var(--screen-accent);color:#2a0e1d;border-color:#ffe2ed;font-size:11px;box-shadow:none}.screen-bottom{padding:6px 12px;font-size:7px;background:#311e37}.hardware-console #deckA{grid-column:1;grid-row:2}.hardware-console #deckB{grid-column:3;grid-row:2}.hardware-console .centre-strip{grid-column:2;grid-row:2;background:linear-gradient(90deg,#281e2b,#352639,#281e2b);border-left:1px solid #715467;border-right:1px solid #715467;padding:4px 0;align-self:stretch;display:block}.hardware-console .deck-grid{background:transparent}.hardware-console .deck,.hardware-console #deckB{background:transparent!important;border:0!important;padding:0 14px 8px;box-shadow:none}.hardware-console .deck .now-playing-card,.hardware-console .deck>.wave,.hardware-console .deck>.time-row{display:none}.hardware-console .deck .platter-area{grid-template-columns:minmax(130px,1fr) minmax(130px,.8fr);min-height:210px;padding:12px 0;gap:12px}.hardware-console .deck .jog,body.performance-mode .hardware-console .deck .jog{width:clamp(150px,19vw,225px)!important;max-width:100%;border:7px solid #9c8995;box-shadow:0 0 0 3px #221824,0 0 0 5px #6d5366,0 10px 15px #140b1c88}.hardware-console .deck .jog:before{border-color:var(--accent)}.hardware-console .deck .jog-inner{width:74px;height:74px;background:#291125ed;border:2px solid var(--accent);box-shadow:0 0 0 3px #372232}.hardware-console .deck .jog-inner b{font-size:28px}.hardware-console .deck .pitch-console{gap:8px}.hardware-console .deck-instruments{padding:8px 0 10px}.hardware-console .deck .transport{display:grid;grid-template-columns:1fr 1.35fr 1fr;margin:7px 0 14px;gap:10px}.hardware-console .deck .transport button{min-height:51px!important;height:51px;border-radius:7px;font-size:12px!important;letter-spacing:.7px}.hardware-console .deck .transport .play{font-size:15px!important}.hardware-pads{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:10px}.hardware-pad{--pad:#ff5799;min-height:55px!important;background:color-mix(in srgb,var(--pad) 30%,#37203c);border:2px solid var(--pad);border-radius:5px;color:#ffe5f4;font-size:14px;font-weight:800;box-shadow:0 4px 0 color-mix(in srgb,var(--pad) 35%,#211226),inset 0 0 15px #ff95c510}.hardware-pad:nth-child(2){--pad:#bc83e7}.hardware-pad:nth-child(3){--pad:#ffb34c}.hardware-pad:nth-child(4){--pad:#fa816e}.hardware-pad.set{background:var(--pad);color:#2b0c1a;border-color:#ffe0f0}.hardware-pad:disabled{opacity:.8}.deck-advanced{border-top:1px solid #775369;margin-top:7px}.deck-advanced>summary{padding:12px 0;cursor:pointer;color:#f2c9e8;font-size:10px;letter-spacing:.5px}.hardware-console .centre-mixer.studio-section{max-height:308px;background:transparent}.hardware-console .centre-mixer>.section-toolbar{background:#412d48}.hardware-console .centre-mixer .section-toolbar h2{font-size:9px}.hardware-console .touch-fx{margin-top:8px;background:#402246}.hardware-console .crossfader-dock{grid-column:2;grid-row:3;width:calc(100% - 12px);max-width:none;align-self:end;margin:7px 6px 0;padding:10px 9px;background:#4a2d4a;border:1px solid #b67d9f;box-shadow:inset 0 1px 0 #ffe1f244}.hardware-console .crossfader-dock .cross-section{grid-template-columns:1fr;gap:0}.hardware-console .crossfader-dock .cross-label{font-size:8px;letter-spacing:1px}.hardware-console .crossfader-dock #centerCross{grid-column:1;grid-row:auto;justify-self:center;min-height:32px!important;height:32px;font-size:8px!important;width:80px!important}.hardware-console .crossfader-dock #crossfader{height:48px}.hardware-console .deck .deck-top [data-act=load]{min-height:52px!important}.hardware-console .deck .deck-top{margin-bottom:2px}
@media(min-width:1100px){.hardware-console>.section-content{grid-template-columns:minmax(0,1fr) 216px minmax(0,1fr)}.hardware-console .console-screen{width:min(680px,70%)}}
@media(min-width:761px) and (max-width:1100px){.hardware-console .deck .platter-area{grid-template-columns:1fr;min-height:0;padding:8px 0}.hardware-console .deck .jog,body.performance-mode .hardware-console .deck .jog{width:155px!important}.hardware-console .deck .pitch-console{gap:4px}.hardware-console .pitch-actions{grid-template-columns:1fr 1fr}.hardware-console .deck{padding:0 10px 8px}.hardware-console .hardware-pads{gap:5px}.hardware-console .hardware-pad{font-size:11px;min-height:48px!important}.hardware-console .deck .transport{gap:5px}.hardware-console .deck .transport button{font-size:10px!important}.hardware-console .deck .transport .play{font-size:12px!important}.hardware-console .deck .deck-top [data-act=load]{font-size:12px!important}.hardware-console .deck .deck-top{gap:6px}.hardware-console .deck-letter{font-size:0}}
@media(max-width:760px){.hardware-console>.section-content{grid-template-columns:repeat(2,minmax(0,1fr));padding:10px 6px;gap:0}.hardware-console .console-screen{width:calc(100% - 12px);grid-row:1;margin-bottom:16px;border-width:5px;border-bottom-width:8px}.screen-top b,.screen-bottom span:last-child{display:none}.screen-top{padding:6px 8px}.screen-track-name{font-size:9px}.screen-deck{padding:8px}.screen-bpm{font-size:17px}.screen-bpm small{font-size:6px}.screen-deck-letter{font-size:14px}.screen-position{font-size:8px}.screen-wave{height:43px}.screen-position .screen-play{min-height:34px!important;font-size:10px}.hardware-console #deckA{grid-column:1;grid-row:2}.hardware-console #deckB{grid-column:2;grid-row:2}.hardware-console .centre-strip{grid-column:1/-1;grid-row:3;display:grid;grid-template-columns:minmax(0,1fr) 140px;align-items:start;border:1px solid #77536e;border-radius:5px;padding:2px 0;margin:8px}.hardware-console .centre-mixer{grid-column:1;grid-row:1}.hardware-console .touch-fx{grid-column:2;grid-row:1}.hardware-console .crossfader-dock{grid-column:1/-1;grid-row:4;justify-self:center;width:min(390px,calc(100% - 16px));padding:10px 14px;margin-top:8px}.hardware-console .crossfader-dock .cross-section{grid-template-columns:1fr 62px;gap:0 12px}.hardware-console .crossfader-dock #centerCross{grid-column:2;grid-row:1/3;min-height:44px!important;width:62px!important;height:44px}.hardware-console .deck,.hardware-console #deckB{padding:0 7px 8px}.hardware-console .deck .platter-area{grid-template-columns:1fr;min-height:0;gap:7px;padding:8px 0}.hardware-console .deck .jog,body.performance-mode .hardware-console .deck .jog{width:135px!important;border-width:5px}.hardware-console .deck .jog-inner{width:60px;height:60px}.hardware-console .deck .jog-inner b{font-size:23px}.hardware-console .deck .transport{gap:5px}.hardware-console .deck .transport button{min-height:46px!important;height:46px;font-size:9px!important;letter-spacing:0}.hardware-console .deck .transport .play{font-size:11px!important}.hardware-console .hardware-pads{gap:5px}.hardware-console .hardware-pad{font-size:10px;min-height:46px!important;padding:5px 2px}.hardware-console .deck .deck-top [data-act=load]{font-size:11px!important}.hardware-console .deck .deck-top{grid-template-columns:25px minmax(0,1fr)}.hardware-console .deck-letter strong{width:24px;height:26px;font-size:14px}.hardware-console .deck-instruments{padding:7px 0}.deck-advanced>summary{font-size:9px}}
@media(pointer:coarse){.screen-top .screen-browse{min-height:40px!important}.screen-position .screen-play{min-height:36px!important}.hardware-console .centre-mixer .section-toolbar{position:static}}
.track-chooser{width:min(620px,calc(100% - 24px));max-height:90dvh;padding:22px;border:1px solid #ba7db9;border-radius:9px;background:#2c1c34}.track-chooser h2{font-size:25px;margin:8px 0}.track-chooser h2 span{color:#ff83b7}.track-chooser>p{font-size:12px;color:#dec2e4;line-height:1.5}.chooser-search{display:block;width:100%;height:48px;min-height:48px;border-radius:5px;border:1px solid #a572ad;background:#1d1026;color:#ffe8f6;padding:10px 13px;font-size:16px;margin:12px 0}.chooser-list{max-height:48dvh;overflow-y:auto;display:flex;flex-direction:column;gap:7px;margin-bottom:14px}.chooser-track{display:flex;align-items:center;gap:12px;padding:9px;min-height:66px!important;text-align:left;background:#4c2d55;border-color:#906298;box-shadow:none}.chooser-track img{width:44px;height:44px;object-fit:cover;border:1px solid #d58eb9;border-radius:4px;flex:none}.chooser-track>span{flex:1;min-width:0}.chooser-track b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;color:#ffe9f6}.chooser-track small{display:block;font-size:10px;color:#d8b3df;margin-top:5px}.chooser-track>strong{flex:none;font-size:10px;border-radius:4px;background:#ff5799;color:#2b0d1c;padding:9px}.chooser-import{width:100%;min-height:48px;font-size:13px}.track-chooser>small{display:block;font-size:10px;line-height:1.5;color:#d4b3db;margin-top:12px}
.hardware-console.is-compact .deck .jog,body.performance-mode .hardware-console.is-compact .deck .jog{width:122px!important}.hardware-console.is-compact .deck .platter-area{min-height:0;padding:5px 0}.hardware-console.is-compact .screen-wave{height:33px}.hardware-console.is-compact .console-screen{margin-bottom:13px}.hardware-console.is-compact .hardware-pad{min-height:44px!important}.hardware-console.is-compact .deck .transport{margin-bottom:8px}


/* Professional console revision. Neutral surfaces, amber A and ice-blue B. */
:root{--bg:#17191e;--panel:#22262c;--line:#3e444e;--text:#edf0f4;--muted:#a6aeba;--pink:#ffab48;--mint:#7cb7ff;--accent:var(--pink);font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;background:#17191e;color:#edf0f4}
html{overflow-x:hidden}body{background:#17191e;color:#edf0f4;font-size:14px}*{min-width:0}button,input,select{font-family:inherit}button,.button{background:#333942;border:1px solid #535c68;color:#e9edf3;box-shadow:none;border-radius:5px;min-height:44px;font-size:12px;font-weight:600;letter-spacing:0}button:hover,.button:hover{background:#444c57;border-color:#8994a3;color:#fff}button.active,button[aria-pressed=true]{background:#4b4337;color:#ffd19b;border-color:#d7954b;box-shadow:none}.primary,button.primary{background:#ffab48;color:#211a10;border-color:#ffca87;box-shadow:none}.primary:hover,button.primary:hover{background:#ffc57f;color:#211a10}button:disabled{opacity:.45}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,.volume-dial:focus-visible{outline:2px solid #e3e9f2;outline-offset:3px}
header{height:auto;min-height:62px;max-width:1440px;margin:auto;padding:10px 20px;background:#17191e;border-bottom:1px solid #343943;gap:12px}.brand{font:750 20px -apple-system,BlinkMacSystemFont,sans-serif;letter-spacing:-.7px;color:#f1f2f5}.brand>span:not(.brand-icon){color:#ffab48}.brand-icon{font-size:28px;color:#a8b1bf}.brand small{font-size:8px;letter-spacing:1.2px;color:#98a2b2;border-color:#47505d}.header-actions{gap:6px}.header-actions button{background:#2d333c;color:#dce2eb;border-color:#505966;font-size:11px;min-height:40px;padding:7px 11px}.header-actions #enable{background:#ffab48;color:#241b10;border-color:#f8c282}.status{color:#a6b2c2;font-size:8px}.header-actions .recording{background:#793e42!important;color:#fff!important;border-color:#c9777e!important}
main{padding:0 18px calc(100px + env(safe-area-inset-bottom));max-width:1440px}.workspace-bar{min-height:48px;padding:7px 0;gap:8px;color:#99a3b1;font-size:9px;letter-spacing:.7px}.mini-actions{gap:6px;flex-wrap:wrap}.mini-actions button{font-size:10px;min-height:38px;padding:7px 10px;background:#2d333c;border-color:#4d5663;color:#d4dce7}.mini-actions #record{border-color:#98606c;color:#f4b9c5}.record-dot{background:#ed7b87}.live-dot{background:#ffab48}#snapBars,#snapBars[aria-pressed=true]{background:#4c3a22;color:#ffd099;border-color:#986c36;box-shadow:none}
.view-navigation{position:static;top:auto;background:#17191e;box-shadow:none;padding:0}.view-tabs{display:flex;overflow-x:auto;gap:0;border:0;border-bottom:1px solid #4b525e;border-radius:0;background:transparent;padding:0;scrollbar-width:thin}.view-tabs button{flex:1 0 auto;min-height:46px;background:transparent;color:#aab3c0;border:0;border-bottom:3px solid transparent;border-radius:0;box-shadow:none;padding:10px 14px;gap:7px;font-size:12px}.view-tabs button .ui-icon{width:17px;height:17px}.view-tabs button[aria-selected=true],.view-tabs button.active{background:#22262c;color:#fff;border-color:#ffab48;box-shadow:none}.global-deck-status{gap:12px;padding:10px 0 12px}.global-deck-status>div{gap:7px}.global-deck-status button{min-height:42px!important;background:#2b3038;color:#e2e8f0;border-color:#4c5664;box-shadow:none}.global-deck-status button[data-global-play=A]{color:#ffc37a;border-color:#7f613c}.global-deck-status button[data-global-play=B]{color:#a9d0ff;border-color:#4b6687}.global-deck-status span{font-size:10px;color:#aab5c4;flex:1;min-width:0}.global-deck-status .quick-load{min-height:44px!important;min-width:92px;font-size:12px;padding:8px 12px;letter-spacing:0;box-shadow:none}.global-deck-status .quick-load[data-global-load=A]{background:#ffab48;color:#241b10;border-color:#ffcd90}.global-deck-status .quick-load[data-global-load=B]{background:#7cb7ff;color:#142334;border-color:#a6cfff}
.studio-section,.panel,.performance-panel,.mixer,.hardware-console.studio-section{background:#22262c;border:1px solid #464d58;box-shadow:none;border-radius:7px}.section-toolbar,.hardware-console>.section-toolbar{background:#2b3037;border-bottom:1px solid #414955;padding:8px 12px;min-height:48px}.section-toolbar h2{font-size:12px;color:#dce2ea;letter-spacing:.2px}.section-toolbar h2 .ui-icon{color:#9ca8b8;width:17px;height:17px}.section-toolbar button{background:#333a44;border:1px solid #545e6c;color:#c9d1dc;box-shadow:none;min-height:36px;font-size:10px;padding:6px 9px;border-radius:4px}.section-toolbar button[aria-pressed=true]{background:#464c56;color:#f2f4f8;border-color:#8b96a6}.section-toolbar .ui-icon{width:16px;height:16px}.section-toolbar .density-toggle span{display:none}.hardware-console>.section-content{display:grid;grid-template-columns:minmax(0,1fr) 200px minmax(0,1fr);padding:16px 10px 14px;gap:0;background:#24282e;align-items:start}.hardware-console .deck,.hardware-console #deckB{display:block!important;position:relative;float:none;width:auto;min-width:0;max-width:100%;padding:0 14px 12px;background:#24282e!important;border:0!important;border-radius:0;box-shadow:none;overflow:visible}.hardware-console .deck>*{order:initial!important;min-width:0;max-width:100%}.hardware-console #deckA{grid-column:1;grid-row:2}.hardware-console #deckB{grid-column:3;grid-row:2}.hardware-console .deck .deck-top{display:grid!important;grid-template-columns:35px minmax(0,1fr);height:auto!important;min-height:52px;margin:0 0 10px;padding:0;gap:8px}.deck-letter{font-size:0}.deck-letter strong{background:transparent;color:var(--accent);border:1px solid var(--accent);width:30px;height:30px;font-size:17px;border-radius:4px}.hardware-console .deck .deck-top [data-act=load]{display:block;width:100%;height:48px;min-height:48px!important;background:var(--accent);color:#171d26;border:1px solid color-mix(in srgb,var(--accent) 65%,white);box-shadow:none;font-size:12px!important;font-weight:750;letter-spacing:.3px;border-radius:5px;padding:9px}.hardware-console .deck .deck-top [data-act=load]:hover{background:color-mix(in srgb,var(--accent) 75%,white)}
/* A recessed display with an actual reading order and room for the complete title. */
.console-screen,.hardware-console .console-screen{width:min(660px,78%);grid-column:1/-1;grid-row:1;margin:0 0 22px;justify-self:center;border:6px solid #363d47;border-bottom-width:9px;border-radius:7px;background:#11161d;box-shadow:0 0 0 1px #66707e,0 5px 10px #10131b55}.screen-top,.screen-bottom{background:#202832;color:#9eacbd;padding:8px 11px;border:0;letter-spacing:.7px;font:9px -apple-system,BlinkMacSystemFont,sans-serif}.screen-top>span{font-size:10px;font-weight:750;color:#d7e0eb}.screen-top b{font-size:8px;color:#7f8fa4}.screen-top .screen-browse{background:#313b49;border:1px solid #5c6b80;min-height:36px!important;color:#d6dfeb;box-shadow:none;font-size:11px;padding:7px 10px;letter-spacing:0}.screen-decks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));background:#121923}.screen-deck,.screen-deck-B{--screen-accent:var(--pink);padding:11px;background:#121923;border:0}.screen-deck-B{--screen-accent:var(--mint);border-left:1px solid #3a4657}.screen-track{display:grid;grid-template-columns:22px minmax(0,1fr) 80px;gap:7px;align-items:center;margin-bottom:9px}.screen-track>div{min-width:0}.screen-deck-letter{color:var(--screen-accent);font-size:18px}.screen-track-name{color:#e6edf7;font:600 12px/1.3 -apple-system,BlinkMacSystemFont,sans-serif;white-space:normal;overflow-wrap:anywhere;overflow:hidden;text-overflow:clip;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;min-height:31px}.screen-track-state{font:9px/1.4 -apple-system,BlinkMacSystemFont,sans-serif;letter-spacing:1px;color:#8798ae}.screen-bpm{color:var(--screen-accent);font:650 22px ui-monospace,monospace;text-align:right;white-space:nowrap}.screen-bpm small{display:block;font-size:8px;font-weight:400;letter-spacing:1px;color:#91a0b4}.screen-wave{background:#0d131c;border:1px solid #354153;border-radius:3px;height:55px}.screen-position{font:10px ui-monospace,monospace;gap:7px;margin-top:7px;color:#a9b6c8}.screen-bar{color:var(--screen-accent)}.screen-position .screen-play{background:#2b3645;border-color:#55677f;color:#c6d3e5;box-shadow:none;min-height:32px!important;padding:5px 10px;font-size:10px}.screen-bottom{font-size:8px;padding:7px 11px}
.hardware-console .deck .now-playing-card{display:none}.cover-button{border:1px solid #697587;border-radius:5px;background:#1d242e;box-shadow:none}.cover-edit{background:#17202bc9;color:#d9e3ef}.cover-button img,.library-artwork{filter:none}.deck .track-title{font-size:17px!important;line-height:1.25;color:#eef2f8;margin:0 0 4px}.deck .track-subtitle{font-size:10px;color:#8e9bac}.track-eyebrow,.is-playing .track-eyebrow{color:var(--accent);letter-spacing:1px;font-size:9px}.beat-indicator i{background:#414955}.beat-indicator i.on{background:var(--accent);box-shadow:none}.hardware-console .deck>.wave,.hardware-console .deck>.time-row{display:none}.hardware-console .deck .platter-area{display:grid!important;grid-template-columns:minmax(130px,1fr) minmax(130px,.85fr);gap:14px;align-items:center;min-height:205px;padding:10px 0}.hardware-console .deck .jog,body.performance-mode .hardware-console .deck .jog{display:grid;width:clamp(155px,17vw,218px)!important;max-width:100%;aspect-ratio:1;height:auto;border:6px solid #8d929b;border-radius:50%;background:#14171c;box-shadow:0 0 0 2px #11151c,0 0 0 4px #4a505b,0 8px 12px #10131b55}.jog .vinyl-art{filter:saturate(.65);opacity:1}.jog:before{border-color:var(--accent)!important;box-shadow:none}.hardware-console .deck .jog-inner{background:#1a202bea;border:1px solid #778294;width:72px;height:72px;box-shadow:none}.hardware-console .deck .jog-inner b{font-size:26px;color:var(--accent)}.jog-inner span{color:#aab4c4!important;font-size:8px!important}.hardware-console .deck .pitch-console{display:flex!important;gap:7px;padding:0}.pitch-readouts label{font-size:9px!important;letter-spacing:.5px!important;color:#9faabb!important}.pitch-readouts input[type=number]{background:#191f29!important;border:1px solid #596576!important;color:#e0e9f5!important;border-radius:4px!important;height:37px!important;min-height:37px!important;font-size:16px!important}.pitch-lane>label{font-size:9px!important;letter-spacing:.5px!important;color:#9faabb!important}.pitch-console .pitch-label{font-size:11px;color:var(--accent)}.pitch-ticks{font-size:9px;color:#a9b3c2}.pitch-actions select{background:#303945;border:1px solid #586578;color:#c9d4e3;font-size:10px;min-height:35px!important}.pitch-actions button{background:#333d4a!important;color:#d5deeb!important;border:1px solid #5c6b80!important;box-shadow:none;min-height:36px!important;font-size:10px!important}.pitch-lane input::-webkit-slider-runnable-track{height:5px;background:#111823;border-color:#6b7789}.pitch-lane input::-webkit-slider-thumb{background:linear-gradient(90deg,#8f9aac,#d9e2ef 43%,#545e70 47%,#545e70 54%,#d9e2ef 58%,#8f9aac);border:1px solid #d2ddeb;box-shadow:none}.pitch-lane input::-moz-range-track{background:#111823;border-color:#6b7789}.pitch-lane input::-moz-range-thumb{background:#c4cfdf;border-color:#e5eaf2}
.hardware-console .deck-instruments{display:flex;align-items:center;gap:14px;border-top:1px solid #414955;padding:10px 0;min-height:74px}.volume-instrument{display:grid;grid-template-columns:58px 64px;grid-template-rows:23px 23px;column-gap:8px;flex:none}.volume-dial{width:56px;height:56px;padding:3px;background:conic-gradient(from 180deg,var(--accent) 0deg var(--volume-angle),#48515e var(--volume-angle) 360deg);box-shadow:none}.volume-dial>div{background:radial-gradient(circle at 30% 20%,#3b4351,#222936 80%);border:1px solid #596679}.volume-dial strong{color:#eef2f8;font-size:17px}.volume-dial strong span{color:#b2bdcd;font-size:9px}.volume-dial small{color:#9eabbd;font-size:7px;letter-spacing:.6px}.signal-meter{width:64px;height:6px;background:repeating-linear-gradient(90deg,#414c5e 0 5px,#202733 5px 7px)}.signal-meter span{background:repeating-linear-gradient(90deg,var(--accent) 0 5px,transparent 5px 7px)}.signal-value{color:#a2b0c3;font-size:8px}.deck-timeline label{font-size:9px;color:#a8b3c4;letter-spacing:.5px}.deck-timeline output{color:#dae3f0}.deck-timeline input{accent-color:var(--accent);height:36px}.timeline-help{font-size:9px;color:#8492a8}
.hardware-console .deck .transport{display:grid!important;grid-template-columns:1fr 1.3fr 1fr;gap:8px;margin:8px 0 16px;position:static;float:none;clear:both}.hardware-console .deck .transport button{width:100%;height:48px;min-height:48px!important;border-radius:5px;background:#343e4b;color:#dce5f2;border:1px solid #68768a;font-size:12px!important;box-shadow:none;letter-spacing:.3px;position:static}.hardware-console .deck .transport .play,.hardware-console .deck .transport .play.active{background:var(--accent);border-color:color-mix(in srgb,var(--accent) 60%,white);color:#16202e;font-size:14px!important;font-weight:750;box-shadow:none}.hardware-console .deck .transport [data-act=cue]{background:#3b3730;border-color:#8f764f;color:#edc594}.hardware-console .deck .transport [data-act=sync]{background:#303a49;border-color:#65758e;color:#bdcce2}.hardware-console .deck .transport [data-act=sync][aria-pressed=true]{background:#415d7d;border-color:#9bbfe7;color:#e2efff}.hardware-pads{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;width:100%;margin:0 0 10px;position:static;float:none}.hardware-pad,.hardware-pad:nth-child(n){--pad:var(--accent);display:block;min-width:0;width:100%;height:48px;min-height:48px!important;padding:6px 3px;border-radius:5px;background:#303946;border:1px solid #748195;border-bottom:3px solid var(--accent);color:#dce5f1;box-shadow:none;font-size:12px!important;letter-spacing:0;position:static;transform:none}.hardware-pad.set{background:color-mix(in srgb,var(--accent) 70%,#364151);color:#162130;border-color:var(--accent)}.hardware-pad:disabled{opacity:.55}.deck-advanced{border-color:#414955;padding-top:0}.deck-advanced>summary{font-size:11px;letter-spacing:0;color:#b9c4d5;padding:13px 0;cursor:pointer}.extract-row{border-color:#424e60}.extract-row button{background:#354151;color:#d8e3f1;border-color:#687b94;font-size:11px}.extract-row .remix-open{background:#485765;color:#ecf1f7;border-color:#8794a7}.extract-row select{background:#263141;color:#dce7f8;border-color:#596b82}.extract-row label{color:#b4c1d4}.deck-loop-dock button{background:#303a48;color:#c4d0e2;border-color:#63738a;box-shadow:none}.deck-loop-dock button.active{background:var(--accent);color:#16202c;border-color:#c5d3e8}
.hardware-console .centre-strip{background:#1f242c;border-left:1px solid #414955;border-right:1px solid #414955;grid-column:2;grid-row:2;padding:0 4px;display:block;align-self:stretch}.centre-mixer.studio-section,.hardware-console .centre-mixer.studio-section{background:#1f242c;border:0;max-height:320px;border-radius:0;box-shadow:none}.centre-mixer>.section-toolbar,.hardware-console .centre-mixer>.section-toolbar{background:#282e37;position:static;padding:6px 7px;border-color:#424b59}.centre-mixer .section-toolbar h2{font-size:10px;color:#d5dfed}.centre-mixer .channel:first-child{--accent:var(--pink)}.centre-mixer .channel:last-child{--accent:var(--mint)}.centre-mixer .channel-name{color:var(--accent);font-size:10px}.centre-mixer .knob-control label{color:#abb9cc;font-size:9px;letter-spacing:0}.centre-mixer .knob-control output{color:#c7d3e5;font-size:8px}.centre-mixer .mix-slider,.centre-mixer .fader input{accent-color:var(--accent)!important}.centre-mixer .cue-monitor{background:#343e4c;color:#c3d1e4;border-color:#667890;box-shadow:none;min-height:36px!important;font-size:8px}.centre-mixer .cue-monitor[aria-pressed=true]{background:#52657d;color:#eef4fc;border-color:#a0b4cd}.channel-meter span{background:linear-gradient(to top,#bf9e58,#ffac48 80%,#e9866e)}.mixer-extras{border-color:#414955}.mixer-extras>summary{color:#b0bed1;font-size:10px}.touch-fx,.hardware-console .touch-fx{background:#28303c;border:1px solid #57677f;box-shadow:none;padding:8px;margin:8px 5px}.touch-fx-heading b{color:#bccce2;font-size:10px;letter-spacing:1px}.touch-fx-heading select{background:#374459;color:#d3e0f2;border-color:#7388a4;font-size:10px}.touch-fx-surface{background:repeating-linear-gradient(0deg,transparent 0 20px,#8ba4c017 20px 21px),repeating-linear-gradient(90deg,#202a38 0 20px,#8ba4c017 20px 21px)!important;border-color:#647c9a;border-radius:4px;box-shadow:none}.touch-fx-surface i{background:#eeb46a;border-color:#f5d6ae;box-shadow:none}.touch-fx.performing .touch-fx-surface{border-color:#d9b47e}.fx-axis-x,.fx-axis-y{color:#a7b6cc;font-size:7px}.fx-idle{font-size:8px;color:#a1b2cb;letter-spacing:.3px}.touch-fx output{font-size:8px;color:#b0bfd3}
.crossfader-dock,.hardware-console .crossfader-dock{position:static!important;top:auto!important;background:#2c333e;border:1px solid #63718a;border-radius:5px;box-shadow:none;padding:10px;grid-column:2;grid-row:3;width:calc(100% - 10px);margin:8px 5px 0;align-self:end}.crossfader-dock .cross-label{font-size:9px;color:#bcc9dd;letter-spacing:1px}.crossfader-dock .cross-label span:first-child{color:#ffbc71}.crossfader-dock .cross-label span:last-child{color:#9bc9ff}.crossfader-dock #crossfader::-webkit-slider-runnable-track{height:7px;background:linear-gradient(90deg,#d39449,#394556 45%,#394556 55%,#6597d1);border:1px solid #74859f}.crossfader-dock #crossfader::-webkit-slider-thumb{height:34px;width:38px;margin-top:-14px;background:linear-gradient(90deg,#8e9bb0,#e0e6f0 42%,#626f86 46%,#626f86 54%,#e0e6f0 58%,#8e9bb0);border-color:#f0f3f8;box-shadow:none}.crossfader-dock #centerCross{background:#3b4658;border-color:#7689a5;color:#dae4f3;font-size:9px!important;box-shadow:none}
/* Secondary workspaces use the same control system. */
.performance-panel{background:#252d39;border-color:#4d5b70}.section-title h2{color:#e3ebf6;font-family:inherit!important;letter-spacing:-.4px;font-size:21px!important}.eyebrow{color:#a7b7cf;letter-spacing:.8px}.sampler .pad,.sampler .pad:nth-child(n){--pad-colour:#ffab48;background:#242e3b;border:1px solid #667a94;box-shadow:none;border-radius:5px}.sampler .pad-trigger{background:#2d394a;border-bottom:2px solid #bd925d;box-shadow:none}.sampler .pad-trigger:hover{background:#3d4e65!important}.sampler .pad-trigger b{color:#e9c593}.sampler .pad-name{color:#c6d5eb}.sampler .pad-opts{background:#222c3a;border-color:#52657d}.sampler .pad-opts button,.sampler .pad-opts button:first-child,.sampler .pad-opts .sample-record{background:#35455b;border:1px solid #6b82a1;color:#d8e7fc;box-shadow:none;font-size:11px;min-height:40px}.sampler .pad-opts .sample-record{background:#62434d;color:#f8cdd7;border-color:#ad7385}.sampler .pad-opts .sample-play{background:#be955e;color:#17202c;border-color:#e0be8c}.sampler .pad.playing .pad-trigger{background:#5b4a34;box-shadow:inset 0 0 0 1px #f0bf81}.sampler .pad.queued .pad-trigger{background:#3e526e;box-shadow:inset 0 0 0 1px #b4cbe8}.sample-playback-status{background:#2c3748;border-color:#637b9c;color:#c3d5ef;font-size:11px}.sample-tools select,.sample-history{background:#2d394d;color:#d2e2fb;border-color:#748aab}.sampler-instructions summary{color:#b7c9e3}.beat-controls button,.beat-controls button.primary{background:#344760;color:#d0e0f6;border-color:#6b85a9;box-shadow:none}.beat-controls button[aria-pressed=true]{background:#b99461;color:#16202d;border-color:#dfc39d}.beat-step{background:#32445e;border-color:#647e9e;box-shadow:none}.beat-step.downbeat{background:#46516a;border-color:#939eb8}.beat-step[aria-pressed=true]{background:#c99e5e;color:#19222e;border-color:#f2d3aa;box-shadow:none}.beat-step.current{outline-color:#d4e5fe}.mix-points-panel button{background:#35485f;border-color:#7f97b6;color:#d8e8ff}.deck-modes button.active,.deck-modes button[aria-selected=true]{background:#465d7c;color:#dceaff;border-color:#96accb}.stem-row button{background:#35465e;color:#cadbf4;border-color:#7189aa}.stem-row button[aria-pressed=true]{background:#b39262;color:#182332;border-color:#dfc9a4}.library tbody tr:hover{background:#313e52}.library tbody button{background:#405873;color:#e2efff;border-color:#889db8}.library-artwork{border-color:#8a9ab1;box-shadow:none}#search,.beat-controls input,.beat-row-label select{background:#233044;color:#d6e7ff;border-color:#748caa}.phrase-planner{background:#273449;border-color:#7187a6;box-shadow:none}.planner-cover img{filter:saturate(.5);opacity:.75}.planner-body h3{color:#e1eaf7}.planner-body p,.planner-note{color:#aebfda}.planner-controls button{background:#3c516d;border-color:#8299b9;color:#e0edff}.planner-controls select{background:#3b4d67;border-color:#89a0c0;color:#e4edfb}.planner-status{color:#e1bd88}
dialog,.remix-dialog,.track-chooser{background:#273243;border:1px solid #8193ad;color:#e0e9f7;box-shadow:0 20px 60px #080e1b88;border-radius:8px}dialog::backdrop{background:#080d17bb;backdrop-filter:blur(4px)}dialog p,.remix-dialog p,.track-chooser>p{color:#b9c9e1}.dialog-head button{color:#d5e4fa}.remix-dialog select,.stack input{background:#34435a;color:#e0edff;border-color:#8298b8}.remix-dialog .remix-build,.chooser-import{background:#e3ae63;color:#202734;border-color:#f4d5ad}.remix-save{background:#445f81;color:#dceaff;border-color:#8fa8ca}.track-chooser h2 span{color:#edbe7b}.chooser-search{background:#202c40;border-color:#8096b7;color:#dfeaff}.chooser-track{background:#34455e;border-color:#7289aa;box-shadow:none}.chooser-track b{color:#dceaff}.chooser-track small,.track-chooser>small{color:#aebfd9}.chooser-track>strong{background:#d1a265;color:#1e293a}.chooser-track img{border-color:#98abc5}.track-chooser small{line-height:1.5}footer,footer a{color:#8597b3}#toast{background:#dae4f3;color:#223149;border-color:#9cb0cc;box-shadow:0 5px 25px #101a2b55}
.mobile-deck-switch{display:none}
@media(min-width:1100px){.hardware-console>.section-content{grid-template-columns:minmax(0,1fr) 212px minmax(0,1fr)}.hardware-console .console-screen{width:min(680px,74%)}}
@media(min-width:601px) and (max-width:1100px){.hardware-console>.section-content{grid-template-columns:minmax(0,1fr) 180px minmax(0,1fr);padding:14px 6px}.hardware-console .deck{padding:0 9px 10px}.hardware-console .deck .platter-area{grid-template-columns:1fr;gap:8px;min-height:0}.hardware-console .deck .jog,body.performance-mode .hardware-console .deck .jog{width:154px!important}.hardware-console .console-screen{width:min(640px,90%)}.hardware-console .deck .deck-top{grid-template-columns:27px minmax(0,1fr);gap:6px}.hardware-console .deck .deck-top [data-act=load]{font-size:11px!important}.hardware-console .deck .transport{gap:5px}.hardware-console .deck .transport button{font-size:10px!important}.hardware-console .deck .transport .play{font-size:12px!important}.volume-instrument{grid-template-columns:52px 38px;gap:6px}.volume-dial{width:50px;height:50px}.signal-meter{width:38px}.signal-value{font-size:7px}.deck-instruments{gap:8px}.deck-timeline label{font-size:8px}.timeline-help{display:none}.hardware-pads{gap:6px}.hardware-pad{font-size:10px!important}.hardware-console .centre-strip{display:block;grid-column:2;grid-row:2;border:0;border-left:1px solid #414955;border-right:1px solid #414955}.hardware-console .centre-mixer .channel{display:flex!important;flex-direction:column;gap:4px!important}.hardware-console .centre-mixer .channels{gap:10px!important}.hardware-console .centre-mixer .knob-control label{font-size:8px}.hardware-console .touch-fx{margin:8px 3px}.hardware-console .touch-fx-surface{height:88px;min-height:88px!important}.hardware-console .crossfader-dock{grid-column:2;grid-row:3}.hardware-console .crossfader-dock .cross-section{grid-template-columns:1fr}.hardware-console .crossfader-dock #centerCross{grid-column:1;grid-row:auto;min-height:32px!important;height:32px;width:78px!important}}
@media(max-width:600px){header{padding:10px 12px;min-height:56px;flex-wrap:nowrap;gap:8px}.brand{font-size:18px}.brand small,.status,#fullscreen{display:none}.brand-icon{font-size:25px}.header-actions{gap:5px}.header-actions button{font-size:10px;padding:7px 10px;min-height:38px}.header-actions #help{font-size:0;width:38px;min-width:38px;padding:0}.header-actions #help:after{content:'?';font-size:16px}.workspace-bar{padding:6px 0;min-height:42px;justify-content:flex-end}.workspace-bar>div:first-child{display:none}.mini-actions button{font-size:10px;padding:6px 8px;min-height:36px}.mini-actions #demo,.mini-actions #snapBars{display:none}main{padding:0 10px calc(105px + env(safe-area-inset-bottom))}.view-tabs button{font-size:11px;padding:9px 12px;min-height:44px}.view-tabs button .ui-icon{width:16px;height:16px}.global-deck-status{padding:9px 0;gap:8px}.global-deck-status span{display:none}.global-deck-status button[data-global-play]{flex:none;min-width:42px;width:42px;min-height:44px!important}.global-deck-status .quick-load{flex:1;min-width:0;font-size:12px;padding:8px 5px;min-height:44px!important}.global-deck-status>div{gap:5px}.hardware-console>.section-toolbar{padding:7px 10px;min-height:46px}.section-toolbar h2{font-size:11px;gap:6px}.section-toolbar button{min-height:34px;padding:5px 8px;font-size:10px}.section-toolbar .density-toggle{display:none}.section-toolbar .collapse-toggle .ui-icon{width:15px;height:15px}.hardware-console>.section-content{display:block!important;padding:12px 10px;background:#24282e}.hardware-console .console-screen{display:block;width:100%;margin:0 0 12px;border-width:4px;border-bottom-width:6px;box-shadow:0 0 0 1px #66707e}.screen-top{padding:7px 9px}.screen-top b{display:none}.screen-top>span{font-size:10px}.screen-top .screen-browse{min-height:36px!important;font-size:11px;padding:6px 10px}.screen-decks{display:block}.screen-deck,.screen-deck-B{padding:10px 11px;border:0}.screen-deck-B{border-top:1px solid #3d4a5e}.screen-track{grid-template-columns:24px minmax(0,1fr) 86px;gap:8px;margin-bottom:6px}.screen-track-name{font-size:12px;min-height:0;line-height:1.35;-webkit-line-clamp:2}.screen-track-state{font-size:8px}.screen-bpm{font-size:23px}.screen-bpm small{font-size:8px}.screen-wave{height:38px}.screen-position{font-size:10px;margin-top:5px}.screen-position .screen-play{display:none}.screen-bottom{padding:6px 10px;font-size:8px}.screen-bottom span:last-child{display:none}.mobile-deck-switch{display:grid;grid-template-columns:1fr 1fr 1fr;gap:5px;border:1px solid #515e72;border-radius:5px;background:#1e2633;padding:4px;margin:12px 0 14px}.mobile-deck-switch button{background:transparent;border:0;color:#a9b9d1;min-height:42px;box-shadow:none;border-radius:3px;font-size:12px}.mobile-deck-switch [data-phone-deck=A][aria-pressed=true]{background:#f1ae55;color:#242c39}.mobile-deck-switch [data-phone-deck=B][aria-pressed=true]{background:#8dbbf3;color:#1e2c41}.mobile-deck-switch [data-phone-deck=mixer][aria-pressed=true]{background:#536d8e;color:#edf4ff}.hardware-console #deckA,.hardware-console #deckB{display:none!important;width:100%;padding:0 0 12px;background:#24282e!important}.hardware-console[data-phone-deck=A] #deckA,.hardware-console[data-phone-deck=B] #deckB{display:block!important}.hardware-console .deck .now-playing-card{display:flex!important;gap:11px;margin:0 0 12px}.cover-button{width:58px;height:58px;min-height:58px!important}.cover-edit{width:22px;height:22px}.track-info{flex:1;min-width:0}.deck .track-title{font-size:16px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.deck .track-subtitle{font-size:10px}.track-eyebrow{font-size:8px}.hardware-console .deck .deck-top{grid-template-columns:34px minmax(0,1fr);gap:9px;margin-bottom:13px;min-height:50px}.hardware-console .deck .deck-top [data-act=load]{font-size:13px!important;height:50px;min-height:50px!important}.deck-letter strong{font-size:19px;width:30px;height:30px}.hardware-console .deck .platter-area{display:grid!important;grid-template-columns:minmax(0,1fr) 143px;gap:16px;align-items:center;min-height:190px;padding:7px 2px 12px}.hardware-console .deck .jog,body.performance-mode .hardware-console .deck .jog{width:170px!important;border-width:5px;max-width:100%}.hardware-console .deck .jog-inner{width:64px;height:64px}.hardware-console .deck .jog-inner b{font-size:24px}.hardware-console .deck .pitch-console{gap:5px;width:100%;max-width:100%}.pitch-readouts{gap:7px}.pitch-readouts label{font-size:8px!important}.pitch-readouts input[type=number]{font-size:15px!important;min-height:37px!important}.pitch-actions{gap:5px;grid-template-columns:1fr 1fr}.pitch-actions select{grid-column:1/-1;font-size:10px;min-height:36px!important}.pitch-actions button{font-size:10px!important;min-height:36px!important}.pitch-console .pitch-lane input[type=range]{height:40px;min-height:40px}.hardware-console .deck-instruments{display:flex!important;flex-direction:row;align-items:center;gap:13px;margin:0;padding:10px 0;min-height:75px}.volume-instrument{grid-template-columns:58px 60px;column-gap:8px;grid-template-rows:23px 23px}.volume-dial{width:55px;height:55px;min-width:55px;min-height:55px}.signal-meter{width:60px}.signal-value{font-size:8px}.deck-timeline{flex:1;min-width:0}.deck-timeline label{font-size:9px}.timeline-help{display:none}.hardware-console .deck .transport{display:grid!important;grid-template-columns:1fr 1.35fr 1fr;gap:8px;margin:8px 0 14px;position:static;float:none}.hardware-console .deck .transport button{min-height:48px!important;height:48px;font-size:12px!important;padding:8px}.hardware-console .deck .transport .play{font-size:14px!important}.hardware-pads{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;position:static;width:100%;margin:0 0 8px}.hardware-pad,.hardware-pad:nth-child(n){height:48px;min-height:48px!important;font-size:12px!important;margin:0;position:static;width:100%;padding:8px 3px}.hardware-console .centre-strip{display:block;position:static;margin:0;padding:9px 0;background:#1f2631;border:1px solid #546379;border-radius:5px}.hardware-console[data-phone-deck=A] .centre-strip,.hardware-console[data-phone-deck=B] .centre-strip{display:none}.hardware-console .centre-mixer.studio-section{max-height:none;overflow:visible}.hardware-console .centre-mixer>.section-content{padding:10px 14px}.hardware-console .centre-mixer .channels{gap:22px!important}.hardware-console .centre-mixer .channel{display:flex!important;flex-direction:column;gap:7px!important}.hardware-console .centre-mixer .channel-name{font-size:12px}.hardware-console .centre-mixer .knob-control label{font-size:11px}.hardware-console .centre-mixer .knob-control output{font-size:10px}.hardware-console .centre-mixer .mix-slider{height:44px;min-height:44px}.hardware-console .centre-mixer .cue-monitor{font-size:10px;min-height:42px!important}.hardware-console .touch-fx{max-width:260px;margin:10px auto 4px}.touch-fx-surface{height:110px;min-height:110px!important}.touch-fx-heading b{font-size:11px}.touch-fx output{font-size:9px}.fx-idle{top:47px}.hardware-console .crossfader-dock{display:block;position:static!important;width:100%;max-width:none;margin:12px 0 0;padding:11px 13px;background:#2c3646}.hardware-console .crossfader-dock .cross-section{display:grid;grid-template-columns:1fr 64px;gap:0 12px}.hardware-console .crossfader-dock .cross-label{grid-column:1;font-size:10px;letter-spacing:.5px}.hardware-console .crossfader-dock #crossfader{grid-column:1;height:46px}.hardware-console .crossfader-dock #centerCross{grid-column:2;grid-row:1/3;min-height:44px!important;width:64px!important;height:44px;font-size:10px!important}.performance-bank>.section-content{grid-template-columns:1fr}.section-title{flex-wrap:wrap;gap:12px}.sampler .pads,.sampler.is-compact .pads{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.library-actions{width:100%;display:flex;gap:8px}.library-actions input{max-width:none;min-width:0;flex:1}.library-actions button{min-width:110px}.chooser-list{max-height:48dvh}.chooser-track{gap:9px}.chooser-track b{font-size:12px}.chooser-track small{font-size:9px}.chooser-track>strong{font-size:9px;padding:8px}.phrase-planner{grid-template-columns:76px minmax(0,1fr)}.planner-controls{gap:6px}.planner-controls button{font-size:10px}body.performance-mode main{padding-bottom:100px;height:calc(100dvh - 62px)}body.performance-mode header{min-height:62px}}
@media(max-width:350px){.hardware-console .deck .platter-area{grid-template-columns:1fr 132px;gap:10px}.hardware-console .deck .jog{width:145px!important}.global-deck-status .quick-load{font-size:11px}.volume-instrument{grid-template-columns:52px 48px}.signal-meter{width:48px}.volume-dial{width:50px;height:50px}.screen-track{grid-template-columns:20px minmax(0,1fr) 76px}.screen-bpm{font-size:20px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
.local-parts-open{display:block;width:100%;margin-top:12px;background:#40546e;border-color:#8ca1c0;color:#e0ecff;min-height:44px}.extract-row .local-parts-open{grid-column:1/-1;margin-top:0;font-size:11px}.local-parts-dialog{width:min(580px,calc(100% - 24px));padding:22px}.local-parts-dialog h2{font-size:24px;letter-spacing:-.5px}.local-parts-dialog p{font-size:12px;line-height:1.6}.local-parts-dialog .parts-source{font-weight:650;color:#e2ebf9}.local-parts-dialog select{background:#34455c;color:#dceaff;border:1px solid #859bbe;border-radius:4px;padding:9px;min-height:44px;font-size:13px}.local-parts-dialog .button-row{margin:14px 0;display:flex;gap:8px;flex-wrap:wrap}.local-parts-dialog progress{display:block;width:100%;height:9px;accent-color:#e3ad62;margin:15px 0}.local-parts-dialog audio{width:100%;display:block;margin-top:14px}.parts-quality{margin-top:16px;border-top:1px solid #6d7f9b;padding-top:12px}.parts-quality summary{font-size:12px;color:#ccd9ec;cursor:pointer}.parts-results{padding-top:5px}.parts-results .button-row button{flex:1}.parts-status{min-height:40px;color:#d8bb93!important}
.simple-mix-controls{padding:12px;border-top:1px solid #43516a;background:#233043}.simple-mix-title{display:flex;gap:12px;align-items:center;justify-content:space-between;margin-bottom:10px}.simple-mix-title b{font-size:12px;color:#e4edf9}.simple-mix-title span{font-size:10px;color:#a8bbd7}.simple-mix-buttons{display:grid;grid-template-columns:1fr 1.25fr 1fr;gap:8px}.simple-mix-buttons button{min-height:44px;font-size:12px;background:#3e526f;border-color:#8ba3c5;color:#e5efff;box-shadow:none}.simple-mix-buttons .pair-play{background:#e9ad60;border-color:#f9d5a8;color:#253044;font-weight:750}.pair-message{font-size:10px;line-height:1.5;color:#abc0de;margin:9px 0 0}.simple-mix .deck-advanced,.simple-mix .hardware-pads,.simple-mix .touch-fx,.simple-mix .mixer-extras,.simple-mix [data-view=grid],.simple-mix [data-view=samples],.simple-mix [data-view=cues],.simple-mix #settings,.simple-mix #demo,.simple-mix #snapBars{display:none!important}.simple-mix .hardware-console .centre-mixer{max-height:none}.simple-mix .deck .sync-status{font-size:10px}.simple-mix .hardware-console .deck .transport{margin-bottom:8px}#simpleModeToggle{background:#3c4b61;color:#e2ebfa;border-color:#8399b7}
@media(max-width:600px){.simple-mix-title{display:block}.simple-mix-title b{display:block;font-size:13px;margin-bottom:4px}.simple-mix-title span{display:block;font-size:10px}.simple-mix-buttons{gap:6px}.simple-mix-buttons button{font-size:11px;padding:7px 5px}.pair-message{font-size:10px}.simple-mix-controls{padding:11px}.simple-mix .view-tabs button{flex:1}.simple-mix .view-tabs .ui-icon{width:17px;height:17px}}
.super-mix{display:flex;align-items:center;gap:13px;padding-bottom:13px;margin-bottom:11px;border-bottom:1px solid #4a5d77}.super-mix-start{background:#e9ad60;color:#202b3c;border:1px solid #f7d7ad;border-radius:5px;min-height:50px;min-width:148px;padding:10px 16px;font-size:15px;font-weight:750;letter-spacing:.1px;box-shadow:none;flex:none}.super-mix-start:hover{background:#f2c58e;color:#202b3c}.super-mix-start.running{background:#744c51;border-color:#d79d9d;color:#ffe3e3}.super-mix>div{flex:1;min-width:0}.super-state{font-size:11px;line-height:1.5;display:block;color:#c0d1e9}.super-mix progress{display:block;accent-color:#e6ac62;width:100%;height:5px;margin-top:8px}.simple-mix-title{margin-bottom:9px}.simple-mix-buttons button{font-size:11px;min-height:40px}.simple-mix .pair-message{font-size:10px}
@media(max-width:600px){.super-mix{display:block;padding-bottom:11px}.super-mix-start{width:100%;min-height:50px;font-size:16px}.super-mix>div{margin-top:9px}.super-state{font-size:10px}.super-mix progress{height:5px}.simple-mix-title span{font-size:10px}}
/* Reset legacy mixer grid rules: toolbar above its two complete channels. */
.centre-mixer.studio-section,.hardware-console .centre-mixer.studio-section{display:block!important;width:100%;min-width:0;grid-template-columns:none;gap:0;padding:0}.centre-mixer>.section-toolbar{display:flex}.centre-mixer>.section-content{display:block}.centre-mixer .channels{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important}.centre-mixer .channel{min-width:0}.stack #stemQuality{min-height:44px;background:#34435a;color:#e0edff;border:1px solid #8298b8;border-radius:4px;padding:8px;font-size:13px}