*{box-sizing:border-box}html,body{background:var(--stage);min-height:100%;color:var(--ink);margin:0;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}button,a{font:inherit}a{color:inherit;text-decoration:none}.stage{background:linear-gradient(#ffffffc2,#e2e6ede6),radial-gradient(circle at 50% 12%,#ffffffe6,#0000 34rem),#eef0f4;place-items:start center;min-height:100svh;padding:0 18px 66px;display:grid;position:relative;overflow:hidden}.stage:before{pointer-events:none;content:"";filter:blur(.2px);opacity:.22;border:10px solid #1b1f26b8;border-bottom:0;border-radius:50% 50% 0 0;width:min(48vw,520px);height:24svh;position:fixed;top:-18svh;left:50%;transform:translate(-50%)rotate(-7deg)}.instrument{width:min(920px,100vw - 28px);box-shadow:0 34px 70px var(--shadow), 0 10px 24px #262d3a1a, inset 0 1px 0 #ffffffe6, inset 0 -1px 0 #2a303a14;background:linear-gradient(145deg,#ffffff6b,#0000 38%),linear-gradient(#edf0f5,#d3d8e1);border:1px solid #ffffffd1;border-radius:12px;grid-template-rows:auto 1fr;gap:clamp(14px,2.5vw,22px);padding:clamp(16px,2.2vw,24px);display:grid;position:relative}.instrument:before,.instrument:after{z-index:-1;content:"";filter:blur(13px);background:#3136405c;border-radius:999px;position:absolute}.instrument:before{height:38px;bottom:-19px;left:34px;right:34px}.instrument:after{opacity:.18;height:12px;top:-7px;left:20px;right:20px}.deviceTop{grid-template-columns:46px 1fr 46px;align-items:center;gap:18px;min-width:0;display:grid}.knob{aspect-ratio:1;background:radial-gradient(circle at 36% 28%,#ffffffeb,#0000 20%),linear-gradient(145deg,#eef1f5,#bac1ce);border:1px solid #4a52602e;border-radius:50%;width:46px;box-shadow:0 8px 15px #29303b29,inset 0 1px #fffc,inset 0 -6px 10px #50596829}.statusStrip{color:#f6458be0;text-transform:uppercase;white-space:nowrap;background:linear-gradient(90deg,#ffffff85,#0000 18%),linear-gradient(#f9fafc,#d9dee7);border:1px solid #50586621;border-radius:5px;justify-content:space-between;align-items:center;min-width:0;height:46px;padding:0 18px;font-size:11px;line-height:1;display:flex;overflow:hidden;box-shadow:inset 0 1px #ffffffe6,inset 0 -1px #23293214}.deck{grid-template-columns:minmax(62px,.24fr) minmax(0,1fr) minmax(62px,.24fr);align-items:stretch;gap:clamp(13px,1.7vw,18px);min-width:0;display:grid}.sideRail{background:linear-gradient(90deg,#ffffff8f,#0000 42%),linear-gradient(#e9edf3,#cbd2dc);border:1px solid #56607021;border-radius:8px;grid-auto-rows:max-content;justify-items:center;gap:12px;min-width:0;padding:12px 8px;display:grid;box-shadow:inset 0 1px #ffffffd6,inset 0 -1px #2c344014,0 8px 18px #252d3a14}.railKnob{aspect-ratio:1;background:radial-gradient(circle at 36% 28%,#ffffffeb,#0000 18%),linear-gradient(145deg,#f8fafc,#aeb7c5);border:1px solid #404a5a2e;border-radius:50%;width:min(52px,70%);margin-bottom:2px;box-shadow:0 8px 14px #2a313c26,inset 0 1px #ffffffe0,inset 0 -7px 12px #46526333}.railButton,.railTiny{background:linear-gradient(#f7f9fb,#c5ccd7);border:1px solid #4b556524;border-radius:4px;width:min(44px,74%);height:24px;display:block;box-shadow:0 3px #bdc4cf,inset 0 1px #ffffffdb}.railButton.lit{background:radial-gradient(circle at 50% 48%,#f6458b75,#0000 38%),linear-gradient(#f9fbfd,#c6ced8)}.railSlot{background:linear-gradient(90deg,#0000 42%,#22293429 45% 55%,#0000 58%),linear-gradient(#d6dce5,#f7f9fb);border:1px solid #46506021;border-radius:999px;width:min(38px,68%);height:128px;margin:2px 0;display:block;box-shadow:inset 0 2px 9px #28303c1a}.railTiny{height:18px}.railDpad{aspect-ratio:1;background:linear-gradient(145deg,#f9fbfd,#c5ccd6);border:1px solid #4b556524;border-radius:8px;width:min(54px,82%);margin:6px 0;position:relative;box-shadow:0 4px #bdc4cf,inset 0 1px #ffffffdb}.railDpad:before,.railDpad:after{content:"";background:#2127313d;border-radius:999px;width:22px;height:6px;position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%)}.railDpad:after{transform:translate(-50%,-50%)rotate(90deg)}.keypad{grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(11px,2vw,17px);display:grid}.pad{--accent:#f2d35b;aspect-ratio:1;cursor:pointer;min-width:0;color:var(--ink);background:linear-gradient(145deg, #ffffffdb, #e2e6edb3), var(--pad);touch-action:manipulation;-webkit-user-select:none;user-select:none;border:1px solid #60697829;border-radius:7px;padding:0;transition:transform .11s,box-shadow .11s,filter .11s;position:relative;overflow:hidden;transform:translateY(0);box-shadow:0 8px #c4cad4,0 16px 24px #252d3a24,inset 0 1px #fffffff5,inset 0 -16px 20px #8691a429}.pad:before{z-index:4;pointer-events:none;content:"";border:1px solid #ffffff94;border-radius:5px;position:absolute;inset:8px;box-shadow:inset 0 0 0 1px #2227301c,inset 8px 0 14px #ffffff4d,inset -10px 0 16px #1f263124,inset 0 10px 18px #ffffff29,inset 0 -16px 22px #2128341c}.pad:after{z-index:3;pointer-events:none;content:"";background:linear-gradient(90deg, #ffffff42, transparent 20%, transparent 72%, #181e281a), radial-gradient(circle at 50% 48%, color-mix(in srgb, var(--accent), transparent 74%), transparent 38%), linear-gradient(180deg, #ffffff0f, #ffffff4d);opacity:.38;transition:opacity .11s;position:absolute;inset:0}.pad:hover{filter:brightness(1.02)}.pad:focus-visible{outline-offset:4px;outline:2px solid #f6458bd1}.pad.pressed:after{opacity:.56}.padMedia{background:#e9edf3;border:1px solid #282f3a24;border-radius:5px;display:block;position:absolute;inset:8px;overflow:hidden;box-shadow:0 1px #ffffffe0,inset 0 1px 3px #ffffffa8,inset 10px 0 16px #fff3,inset -12px 0 18px #1a212c2e,inset 0 -12px 20px #1f263129}.padMedia img,.clipVideo{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.padMedia img{opacity:.78;filter:grayscale(.22)contrast(1.02)brightness(1.03)saturate(.86);transform:scale(1.035)}.clipVideo{z-index:2;opacity:0;filter:grayscale(.08)contrast(1.03)brightness(1.02)saturate(.92)}.clipVideo.active{opacity:.92}.padLabel{z-index:5;color:#1b1f2694;text-shadow:0 1px 6px #ffffffb8;text-align:left;text-overflow:ellipsis;text-transform:lowercase;white-space:nowrap;font-size:clamp(9px,1.15vw,11px);font-weight:700;line-height:1.15;position:absolute;bottom:12px;left:14px;right:14px;overflow:hidden}.footer{z-index:6;color:#20242b85;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:12px;font-size:11px;line-height:1;display:grid;position:fixed;bottom:12px;left:16px;right:16px}.byline,.sourceLink,.liveCount{align-items:center;min-width:0;display:inline-flex}.byline{justify-self:start;gap:8px}.avatar{background:linear-gradient(145deg,#fffdf8,#d7d0c7);border:1px solid #353c4824;border-radius:50%;flex:none;place-items:center;width:26px;height:26px;display:grid;overflow:hidden;box-shadow:0 1px 3px #4a41371f,inset 0 1px #ffffffdb}.avatar img{object-fit:cover;width:100%;height:100%}.liveCount{white-space:nowrap;justify-self:center;gap:6px}.analyticsLink{color:#433e389e;line-height:1}.visitorText{min-width:0}.footerDivider{color:#433e3857;margin:0 3px}.powerText{align-items:center;gap:5px;min-width:0;line-height:1;display:inline-flex}.dataFastIcon{object-fit:contain;filter:saturate(.82)contrast(.98)opacity(.82);flex:none;width:12px;height:12px}.liveDot{background:#f6458b;border-radius:999px;width:7px;height:7px;box-shadow:0 0 12px #f6458b94}.sourceLink{text-transform:lowercase;justify-self:end}.byline:hover,.analyticsLink:hover,.sourceLink:hover{color:var(--ink)}@media (max-width:560px){.stage:before{opacity:.13;border-width:7px;width:70vw;height:18svh;top:-7svh}.stage{padding:0 10px 54px}.instrument{border-radius:9px;width:min(100%,430px);padding:11px}.deck{grid-template-columns:1fr}.sideRail{display:none}.deviceTop{grid-template-columns:30px 1fr 30px;gap:9px}.knob,.statusStrip{height:30px}.knob{width:30px}.statusStrip{padding:0 10px;font-size:9px}.keypad{gap:9px}.pad{border-radius:6px;box-shadow:0 6px #c4cad4,0 12px 18px #252d3a21,inset 0 1px #fffffff5,inset 0 -14px 18px #8691a426}.pad:active,.pad.pressed{transform:translateY(4px);box-shadow:0 2px #c4cad4,0 6px 14px #252d3a24,inset 0 1px #ffffffb8,inset 0 10px 22px #5059682b}.padLabel{bottom:8px;left:9px;right:9px}.footer{gap:8px;font-size:10px;bottom:9px;left:10px;right:10px}.avatar{width:23px;height:23px}.dataFastIcon{width:11px;height:11px}}.stage:before{display:none}.instrument{aspect-ratio:1;width:min(960px,100vw - 8px);box-shadow:none;filter:drop-shadow(0 38px 58px #262d3a38)drop-shadow(0 12px 18px #262d3a1f);background:0 0;border:0;border-radius:0;padding:0}.instrument:before,.instrument:after{display:none}.frameImage{z-index:4;object-fit:contain;pointer-events:none;-webkit-user-select:none;user-select:none}.statusDisplay{z-index:5;color:#ff84b2ad;pointer-events:none;background:radial-gradient(circle at 92%,#ff5a9a24,#0000 9%),linear-gradient(90deg,#ff84b209,#0000 30%),linear-gradient(#050506f7,#010102fc);border:1px solid #ffebe00b;border-radius:7px;grid-template-columns:45% minmax(0,1fr);align-items:center;gap:10px;width:32.6%;height:5.85%;min-height:20px;padding:0 1.75%;display:grid;position:absolute;top:19.72%;left:33.45%;overflow:hidden;box-shadow:inset 0 1px 1px #ffffff0b,inset 0 -1px 12px #000000db,0 1px 1px #ffffff09}.statusDisplay:after{pointer-events:none;content:"";mix-blend-mode:screen;background:repeating-linear-gradient(90deg,#ffffff04 0 1px,#0000 1px 9px),linear-gradient(#ffffff07,#0000 44%,#0000004d);position:absolute;inset:0}.waveform{z-index:1;grid-template-columns:repeat(24,1fr);align-items:center;gap:3px;width:100%;min-width:0;height:54%;display:grid;position:relative}.waveform span{height:var(--level);opacity:.38;transform-origin:50%;background:linear-gradient(#ffe1ebdb,#ff7baaeb);border-radius:999px;min-height:2px;display:block;transform:scaleY(.22);box-shadow:0 0 6px #ff5f9a80,0 0 13px #ff5f9a38}.statusDisplay.playing .waveform span{animation:wavePulse var(--wave-duration,.76s) cubic-bezier(.42, 0, .28, 1) infinite;animation-delay:var(--delay);opacity:.88}.statusDisplay.playing .waveform span.hot{opacity:1;background:linear-gradient(#fff2f8f5,#ff5f9a);box-shadow:0 0 8px #ff5f9aa8,0 0 20px #ff5f9a52}.statusFilename{z-index:1;color:#ffbad2cc;text-align:right;text-overflow:ellipsis;text-transform:lowercase;text-shadow:0 0 7px #ff5f9a57;white-space:nowrap;min-width:0;font-size:9px;font-weight:700;line-height:1;position:relative;overflow:hidden}@keyframes wavePulse{0%,to{transform:scaleY(.24)}42%{transform:scaleY(1)}66%{transform:scaleY(.52)}}.keypad{z-index:2;background:linear-gradient(#dde3ecd1,#f6f8fb7a);border-radius:3.8%;gap:clamp(6px,.8vw,11px);width:50.7%;height:51.2%;padding:1.2%;position:absolute;top:32.1%;left:24.7%;box-shadow:inset 0 2px 14px #1b222d29,inset 0 -1px #ffffffa3}.pad{border-radius:8px;box-shadow:0 5px #c4cad4,0 10px 16px #252d3a24,inset 0 1px #fffffff5,inset 0 -12px 18px #8691a429}.pad:active,.pad.pressed{transform:translateY(4px);box-shadow:0 1px #c4cad4,0 5px 12px #252d3a29,inset 0 1px #ffffffb8,inset 0 8px 18px #5059682e}@media (max-width:560px){.stage{padding:0 0 70px}.instrument{--mobile-instrument-size:min(132vw, calc(100svh - 92px), 620px);width:var(--mobile-instrument-size);transform:translateX(calc((100vw - var(--mobile-instrument-size)) / 2));justify-self:center;padding:0}.keypad{gap:7px}.footer{grid-template-columns:minmax(0,.72fr) auto minmax(0,.5fr);gap:4px;font-size:clamp(7px,2.05vw,9px);bottom:10px;left:8px;right:8px}.byline{gap:5px}.byline>span:last-child,.sourceLink{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.liveCount{gap:4px}.footerDivider{margin:0 1px}.powerText{gap:3px}.liveDot{width:6px;height:6px}.avatar{width:22px;height:22px}.dataFastIcon{width:9px;height:9px}}@media (max-height:620px) and (min-width:700px){.footer{font-size:9px;bottom:8px}.avatar{width:22px;height:22px}.liveDot{width:6px;height:6px}.dataFastIcon{width:10px;height:10px}}:root{--ink:#3c3935;--muted:#3c39358f;--hairline:#5d544a29;--stage:#ece8e2;--device:#e9e5de;--device-dark:#cfc7bd;--pad:#f3f0ea;--pad-edge:#d6cec4;--shadow:#4a413733}html,body{background:var(--stage);color:var(--ink)}.stage{background:radial-gradient(circle at 50% 4%,#fffffcf5,#0000 36rem),linear-gradient(#f7f4ef 0%,#ede8e1 46%,#ddd6cd 100%)}.instrument{filter:drop-shadow(22px 42px 54px #53493e33)drop-shadow(8px 14px 18px #544a4021)}.keypad{background:linear-gradient(#e7e2dae6,#f8f6f18a);box-shadow:inset 0 2px 13px #4e44392e,inset 0 -1px #ffffffad}.pad{background:linear-gradient(145deg, #fffdf9eb, #e2dbd1bd), var(--pad);border-color:#655b4f2b;box-shadow:0 5px #c9c1b7,7px 12px 18px #4b413726,inset 0 1px #fffffff5,inset 0 -12px 18px #897e6f2b}.pad:before{border-color:#fffdf7ad;box-shadow:inset 0 0 0 1px #4941381f,inset 8px 0 14px #fffdf852,inset -10px 0 16px #483f3526,inset 0 10px 18px #fffffb2b,inset 0 -16px 22px #51463b1f}.pad:after{background:linear-gradient(90deg, #fffdf847, transparent 20%, transparent 72%, #4940361c), radial-gradient(circle at 50% 48%, color-mix(in srgb, var(--accent), transparent 78%), transparent 38%), linear-gradient(180deg, #fffffa0d, #f5f0e852)}.pad:active,.pad.pressed{box-shadow:0 1px #c9c1b7,4px 6px 12px #4b41372b,inset 0 1px #ffffffbd,inset 0 8px 18px #5f54482e}.padMedia{background:#e9e4dc;border-color:#4a423926;box-shadow:0 1px #fffffae6,inset 0 1px 3px #fffdf8ad,inset 10px 0 16px #fffbf43b,inset -12px 0 18px #42393030,inset 0 -12px 20px #4e44392b}.padMedia img{filter:grayscale(.16)contrast(1.03)brightness(1.02)saturate(.9)sepia(.04)}.clipVideo{filter:grayscale(.04)contrast(1.03)brightness(1.01)saturate(.95)sepia(.03)}.padLabel{color:#302c27e6;text-shadow:0 1px #fffcf6e6,0 0 8px #fffcf6d1;background:linear-gradient(90deg,#f6f1e9b8,#f6f1e961 72%,#0000);border-radius:4px;padding:4px 5px 3px;bottom:9px;left:11px;right:11px}.footer{color:#433e3885}.avatar{color:#433e38;background:linear-gradient(145deg,#fffdf8,#d7d0c7);border-color:#59504526}.studio{z-index:1;grid-template-columns:minmax(560px,760px) minmax(430px,540px);justify-content:center;align-items:start;gap:clamp(10px,1.4vw,22px);width:min(1340px,100vw - 24px);padding-top:clamp(0px,.7vw,8px);display:grid;position:relative}.studio .instrument{width:min(760px,54vw,100svh - 92px)}.mixerStation{aspect-ratio:1200/1180;filter:drop-shadow(20px 39px 46px #53493e2e)drop-shadow(7px 13px 15px #544a401f);width:min(540px,42vw,100svh - 96px);position:relative}.mixerFrame{z-index:1;object-fit:contain;pointer-events:none;-webkit-user-select:none;user-select:none}.mixerDisplay,.mixerTransport,.performancePads,.sequencer,.effectBank,.mixerFaders,.loopReadout{z-index:2;position:absolute}.mixerDisplay{color:#ffbad2c7;text-transform:lowercase;pointer-events:none;background:radial-gradient(circle at 86%,#ff539533,#0000 13%),linear-gradient(#08080af5,#000002fc);border:1px solid #ffebe00e;border-radius:10px;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:4%;width:50.8%;height:8.2%;padding:0 3.1%;font-size:clamp(7px,.74vw,10px);font-weight:800;line-height:1;display:grid;top:15.8%;left:24.8%;overflow:hidden;box-shadow:inset 0 1px 1px #ffffff0b,inset 0 -1px 12px #000000d1}.mixerDisplay:after{content:"";pointer-events:none;background:repeating-linear-gradient(90deg,#ffffff05 0 1px,#0000 1px 11px),linear-gradient(#ffffff09,#0000 45%,#00000047);position:absolute;inset:0}.mixerDisplay>span,.mixerMeter{z-index:1;position:relative}.mixerMeter{grid-template-columns:repeat(32,1fr);align-items:center;gap:2px;height:48%;display:grid}.mixerMeter span{height:var(--level);transform-origin:50%;background:#ff7baa70;border-radius:999px;min-height:2px;display:block;transform:scaleY(.3);box-shadow:0 0 8px #ff5f9a38}.mixerDisplay.running .mixerMeter span{animation:.64s cubic-bezier(.42,0,.28,1) infinite wavePulse;animation-delay:var(--delay)}.mixerDisplay.running .mixerMeter span.hot{background:#ffb0cde6;box-shadow:0 0 8px #ff5f9a6b,0 0 18px #ff5f9a2e}.mixerTransport{grid-template-columns:repeat(4,1fr);gap:3.4%;width:41.6%;height:4.8%;display:grid;top:26%;left:29.2%}.transportButton,.effectButton{cursor:pointer;color:#413b33ad;text-transform:lowercase;background:linear-gradient(#fffdf9f2,#d6cfc4e0);border:1px solid #5c524638;border-radius:7px;min-width:0;padding:0;font-size:clamp(6px,.64vw,9px);font-weight:800;line-height:1;transition:box-shadow .11s,transform .11s,color .11s;box-shadow:0 3px #bfb5aa,0 5px 8px #463c3221,inset 0 1px #fffffce0}.transportButton:active,.transportButton.active,.effectButton:active,.effectButton.active{color:#3a2d2ae0;background:radial-gradient(circle at 50% 45%,#ff69a061,#0000 48%),linear-gradient(#fffaf6e6,#cdc4b9f0);transform:translateY(2px);box-shadow:0 1px #bfb5aa,0 3px 7px #463c3224,inset 0 1px #fffffcb8,inset 0 6px 12px #5c4e4224}.performancePads{grid-template-columns:repeat(2,1fr);gap:4.3%;width:25%;height:28.6%;display:grid;top:41.4%;left:18%}.mixerPad{--accent:#f65f95;cursor:pointer;color:#302c27c7;background:radial-gradient(circle at 50% 46%, color-mix(in srgb, var(--accent), transparent 72%), transparent 48%), linear-gradient(145deg, #fffdf9eb, #e2dbd1c7);text-transform:lowercase;touch-action:manipulation;border:1px solid #655b4f2b;border-radius:14%;min-width:0;padding:0;transition:box-shadow .11s,transform .11s,filter .11s;position:relative;overflow:hidden;box-shadow:0 5px #c9c1b7,7px 12px 18px #4b413724,inset 0 1px #fffffff5,inset 0 -12px 18px #897e6f2b}.mixerPad:before{content:"";pointer-events:none;border:1px solid #fffdf7a8;border-radius:12%;position:absolute;inset:9%;box-shadow:inset 0 0 0 1px #4941381f,inset 9px 0 14px #fffdf847,inset -10px 0 16px #483f351f,inset 0 -15px 22px #51463b1f}.mixerPad span,.mixerPad kbd{z-index:1;display:block;position:relative}.mixerPad span{padding:10% 11% 0;font-size:clamp(7px,.82vw,10px);font-weight:900}.mixerPad kbd{color:#3e37307a;font-size:clamp(7px,.72vw,9px);font-weight:900;position:absolute;bottom:10%;right:12%}.mixerPad:active,.mixerPad.hit{filter:brightness(1.04)saturate(1.12);transform:translateY(4px);box-shadow:0 1px #c9c1b7,4px 5px 10px #4b413729,inset 0 1px #ffffffb8,inset 0 8px 18px #5f54482e}.sequencer{gap:3.1%;width:39.3%;height:25%;display:grid;top:40.9%;left:44.2%}.sequenceRow{grid-template-columns:32px minmax(0,1fr);align-items:center;gap:6px;min-width:0;display:grid}.sequenceLabel{color:#3f393285;text-overflow:ellipsis;text-transform:lowercase;white-space:nowrap;font-size:clamp(6px,.62vw,8px);font-weight:900;line-height:1;overflow:hidden}.sequenceSteps{grid-template-columns:repeat(16,minmax(0,1fr));gap:3px;display:grid}.stepButton{aspect-ratio:1;cursor:pointer;background:linear-gradient(#f4f0e9e0,#cbc2b7d6);border:1px solid #5e534833;border-radius:5px;min-width:0;padding:0;transition:background .1s,box-shadow .1s,transform .1s;box-shadow:0 2px #bfb5aa,inset 0 1px #fffffcb8}.stepButton.enabled{background:radial-gradient(circle,#ff629d8f,#0000 64%),linear-gradient(#fff2f7eb,#dbc8cce0)}.stepButton.current{outline-offset:1px;filter:brightness(1.08);outline:2px solid #ff69a09e}.stepButton:active{transform:translateY(1px);box-shadow:0 1px #bfb5aa,inset 0 1px #fffffc9e}.effectBank{grid-template-columns:repeat(5,1fr);gap:3.6%;width:57.8%;height:4.8%;display:grid;top:78.2%;left:21.4%}.mixerFaders{grid-template-columns:repeat(4,1fr);gap:7%;width:35.5%;height:18.6%;display:grid;top:57.9%;left:48.2%}.mixerFaders label{color:#3f39328a;text-transform:lowercase;grid-template-rows:1fr auto;justify-items:center;min-width:0;font-size:clamp(6px,.62vw,8px);font-weight:900;line-height:1;display:grid}.mixerFaders input{accent-color:#f65f95;transform-origin:50%;width:116px;height:18px;transform:rotate(-90deg)}.loopReadout{color:#3f39328a;text-transform:lowercase;justify-content:center;align-items:center;gap:8px;min-width:0;font-size:clamp(7px,.72vw,9px);font-weight:800;line-height:1;display:flex;bottom:10.5%;left:19.2%;right:19.2%}.loopReadout strong{color:#3a332cb8;text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}@media (max-width:1060px){.studio{grid-template-columns:minmax(0,1fr);justify-items:center;width:min(860px,100vw - 16px);padding-bottom:74px}.studio .instrument{width:min(860px,100vw - 8px,100svh - 92px)}.mixerStation{width:min(720px,100vw - 18px)}}@media (max-width:760px){.stage{min-height:100svh;padding-bottom:12px;overflow:hidden auto}.studio{gap:12px;width:100vw;padding-bottom:0}.mixerStation{aspect-ratio:auto;filter:drop-shadow(12px 24px 34px #53493e24);background:linear-gradient(145deg,#fffdf99e,#e0d9cf80),#eee9e1d6;border:1px solid #74685b24;border-radius:12px;gap:11px;width:min(430px,100vw - 18px);padding:12px;display:grid}.footer{width:min(430px,100vw - 16px);margin:2px auto 0;padding:0 0 4px;display:grid;position:static}.mixerFrame{display:none}.mixerDisplay,.mixerTransport,.performancePads,.sequencer,.effectBank,.mixerFaders,.loopReadout{width:auto;height:auto;position:relative;inset:auto}.mixerDisplay{border-radius:8px;min-height:42px;padding:0 12px;font-size:10px}.mixerTransport{gap:8px;height:34px}.transportButton,.effectButton{min-height:32px;font-size:10px}.performancePads{grid-template-columns:repeat(4,1fr);gap:8px}.mixerPad{aspect-ratio:1.08;border-radius:10px}.mixerPad span{font-size:10px}.sequencer{gap:8px}.sequenceRow{grid-template-columns:42px minmax(0,1fr);gap:8px}.sequenceLabel{font-size:9px}.sequenceSteps{gap:3px}.effectBank{gap:7px}.mixerFaders{grid-template-columns:repeat(2,1fr);gap:10px}.mixerFaders label{grid-template-rows:auto auto;align-items:center;gap:6px;font-size:9px}.mixerFaders input{width:100%;max-width:150px;transform:none}}@media (max-width:560px){.studio .instrument{--mobile-instrument-size:min(132vw, calc(100svh - 92px), 620px);width:var(--mobile-instrument-size);transform:translateX(calc((100vw - var(--mobile-instrument-size)) / 2));justify-self:center;padding:0}}@media (min-width:761px){.studio{grid-template-columns:minmax(540px,700px) minmax(540px,700px);gap:clamp(0px,.9vw,14px);width:min(1400px,100vw - 20px)}.studio .instrument,.mixerStation{width:min(700px,48.5vw,100svh - 86px)}.mixerFrame{object-fit:contain}.mixerDisplay{opacity:1;color:#ffbcd4eb;width:38.4%;height:7.4%;box-shadow:none;text-shadow:0 0 8px #ff5f9a38;background:0 0;border:0;padding:0 3.2%;font-size:clamp(9px,.78vw,12px);top:36.4%;left:30.8%}.mixerDisplay:after{display:none}.mixerMeter{gap:2px;height:48%}.mixerMeter span{background:#ff72a66b;box-shadow:0 0 6px #ff5f9a2e}.mixerTransport{gap:4.5%;width:40.1%;height:4.5%;top:46.7%;left:30.2%}.transportButton,.effectButton{color:#3a322ce6;box-shadow:none;text-shadow:0 1px #fffdf8d9;background:0 0;border-color:#0000;border-radius:12px;font-size:clamp(9px,.84vw,12px);font-weight:900}.transportButton.active,.effectButton.active,.transportButton:active,.effectButton:active{color:#2c2520f2;background:#ff5f9a24;transform:translateY(1px);box-shadow:0 0 18px #ff5f9a24}.performancePads{grid-template-columns:repeat(2,1fr);gap:12% 27%;width:31.3%;height:24.5%;top:54.4%;left:30.4%}.mixerPad{color:#fffffff0;box-shadow:none;text-shadow:0 1px #0000004d,0 2px 12px #352b2361;background:0 0;border:0;border-radius:18px;overflow:visible}.mixerPad:before{box-shadow:none;opacity:0;border:0;border-radius:18px;inset:-4px}.mixerPad span{color:inherit;text-align:center;text-overflow:ellipsis;white-space:nowrap;padding:0;font-size:clamp(13px,1.28vw,18px);font-weight:950;position:absolute;bottom:14px;left:10px;right:10px;overflow:hidden}.mixerPad kbd{display:none}.mixerPad.hit,.mixerPad:active{background:radial-gradient(circle at 50% 45%, color-mix(in srgb, var(--accent), transparent 58%), transparent 54%);box-shadow:0 0 22px color-mix(in srgb, var(--accent), transparent 52%), inset 0 0 0 1px color-mix(in srgb, var(--accent), transparent 42%);transform:translateY(2px)}.sequencer{display:none}.sequenceRow{grid-template-columns:26px minmax(0,1fr);gap:4px}.sequenceLabel{color:#0000;font-size:clamp(5px,.48vw,7px)}.sequenceSteps{gap:2px}.stepButton{min-height:8px;box-shadow:none;background:0 0;border:0;border-radius:3px}.stepButton.enabled{box-shadow:none;background:0 0}.stepButton.current{outline-offset:1px;filter:brightness(1.12);background:#ff5f9a38;outline:1px solid #ff5f9a38}.mixerFaders{display:none}.effectBank{gap:4.2%;width:42.1%;height:3.9%;top:76.6%;left:28.9%}.loopReadout{color:#423a33ad;opacity:1;width:38%;font-size:clamp(8px,.74vw,10px);inset:81.5% auto auto 31%}}.instrument.unifiedDeck{aspect-ratio:1;width:min(1120px,100vw - 16px,100svh - 18px)}.unifiedDeck .frameImage{z-index:1}.unifiedSurface{z-index:2;background:linear-gradient(145deg,#fffefab3,#eae4db94),#f2eee7db;border:1px solid #776a5b1f;border-radius:22px;grid-template-rows:46px minmax(0,1fr);gap:14px;width:70.6%;height:53.4%;padding:16px;display:grid;position:absolute;top:30.4%;left:14.7%;overflow:hidden;box-shadow:inset 0 1px #fffffce0,inset 0 -16px 34px #6254461a}.deckHeader{min-width:0;display:block}.unifiedDeck .mixerDisplay{opacity:1;color:#ffbad2db;pointer-events:none;background:radial-gradient(circle at 92%,#ff5a9a29,#0000 12%),linear-gradient(#070709fa,#000002fc);border:1px solid #ffebe00f;border-radius:10px;grid-template-columns:minmax(0,1fr) auto;align-items:center;width:auto;height:auto;min-height:0;padding:0 15px;display:grid;position:relative;inset:auto;box-shadow:inset 0 1px 1px #ffffff0d,inset 0 -1px 12px #000c}.unifiedDeck .mixerDisplay:after{display:block}.unifiedDeck .waveform,.unifiedDeck .mixerMeter{gap:3px;height:46%}.unifiedDeck .mixerTransport{grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;width:auto;height:auto;display:grid;position:static}.unifiedDeck .transportButton,.unifiedDeck .effectButton{color:#3d352edb;text-transform:lowercase;text-shadow:0 1px #fffdf8db;background:linear-gradient(#fffdf8f5,#dad1c5e6);border:1px solid #665b4e2e;border-radius:9px;min-width:0;min-height:44px;padding:0 8px;font-size:clamp(10px,1vw,13px);font-weight:900;line-height:1;box-shadow:0 4px #c7bdb0,0 7px 11px #443a301f,inset 0 1px #fffffce0}.unifiedDeck .transportButton.active,.unifiedDeck .effectButton.active,.unifiedDeck .transportButton:active,.unifiedDeck .effectButton:active{color:#2e2622f2;background:radial-gradient(circle at 50% 48%,#ff5f9a42,#0000 58%),linear-gradient(#fff9f7f2,#cec3b7f0);transform:translateY(3px);box-shadow:0 1px #c7bdb0,0 4px 8px #443a301f,inset 0 7px 14px #5f544821}.mixCanvas{grid-template-columns:minmax(0,1.42fr) minmax(220px,.78fr);gap:16px;min-height:0;display:grid}.samplerPanel,.groovePanel{min-width:0;min-height:0}.unifiedDeck .keypad{width:auto;height:100%;box-shadow:none;background:0 0;border-radius:0;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px;padding:0;display:grid;position:static}.unifiedDeck .pad{border-radius:9px}.unifiedDeck .padMedia{inset:8px}.unifiedDeck .padLabel{font-size:clamp(8px,.86vw,11px);bottom:9px;left:11px;right:11px}.groovePanel{grid-template-rows:minmax(0,1fr) 18px 38px 74px 18px;gap:9px;display:grid}.unifiedDeck .mixerDisplay{grid-template-columns:minmax(0,1fr) auto;padding:0 12px;font-size:10px}.unifiedDeck .performancePads{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;width:auto;height:auto;display:grid;position:static}.beatDots{grid-template-columns:repeat(16,minmax(0,1fr));align-items:center;gap:3px;padding:0 3px;display:grid}.beatDot{aspect-ratio:1;background:#a4998b42;border:1px solid #61564a1f;border-radius:999px;display:block;box-shadow:inset 0 1px #fffffa9e}.beatDot.filled{background:#ff5f9a6b;box-shadow:inset 0 1px #fffffa80,0 0 8px #ff5f9a29}.beatDot.current{background:#ff5f9af2;transform:scale(1.22);box-shadow:0 0 8px #ff5f9a94,0 0 18px #ff5f9a42}.unifiedDeck .mixerPad{--accent:#f65f95;aspect-ratio:1.08;color:#fffffff2;background:radial-gradient(circle at 50% 42%, color-mix(in srgb, var(--accent), transparent 58%), transparent 40%), linear-gradient(145deg, #fffdf9f0, #e1d8ccd1);text-shadow:0 1px #0000003d,0 2px 12px #322a225c;touch-action:manipulation;border:1px solid #63584c2b;border-radius:10px;min-width:0;padding:0;position:relative;overflow:hidden;box-shadow:0 6px #c9c1b7,8px 12px 17px #4b413724,inset 0 1px #fffffff5,inset 0 -14px 18px #897e6f2b}.unifiedDeck .mixerPad:before{content:"";opacity:1;pointer-events:none;border:1px solid #fffdf7a3;border-radius:7px;position:absolute;inset:9px;box-shadow:inset 0 0 0 1px #4941381a,inset 8px 0 14px #fffdf83d,inset -10px 0 16px #483f351f,inset 0 -15px 22px #51463b1f}.unifiedDeck .mixerPad span{z-index:1;color:inherit;text-align:center;text-transform:lowercase;padding:0;font-size:clamp(12px,1.1vw,16px);font-weight:950;line-height:1;display:block;position:absolute;bottom:12px;left:8px;right:8px}.unifiedDeck .mixerPad kbd{display:none}.unifiedDeck .mixerPad.hit,.unifiedDeck .mixerPad:active{filter:brightness(1.04)saturate(1.12);transform:translateY(4px);box-shadow:0 2px #c9c1b7,4px 6px 12px #4b413729,inset 0 1px #ffffffb8,inset 0 9px 18px #5f544829}.unifiedDeck .effectBank{grid-template-columns:repeat(5,minmax(0,1fr));gap:7px;width:auto;height:auto;display:grid;position:static}.unifiedDeck .effectButton{min-height:36px;padding:0 4px;font-size:clamp(8px,.78vw,10px)}.unifiedDeck .mixerFaders{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px 12px;width:auto;height:auto;display:grid;position:static}.unifiedDeck .mixerFaders label{color:#4039329e;text-transform:lowercase;grid-template-columns:44px minmax(0,1fr);align-items:center;gap:8px;min-width:0;font-size:8px;font-weight:900;display:grid}.unifiedDeck .mixerFaders input{accent-color:#f65f95;width:100%;height:16px;transform:none}.unifiedDeck .loopReadout{color:#403932a3;opacity:1;text-transform:lowercase;justify-content:center;align-items:center;gap:6px;width:auto;font-size:9px;font-weight:900;line-height:1;display:flex;position:static}.unifiedDeck .loopReadout strong{color:#342d27c2;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.unifiedDeck .sequencer{display:none}@media (max-width:760px){.instrument.unifiedDeck{--mobile-instrument-size:min(132vw, calc(100svh - 92px), 620px);width:var(--mobile-instrument-size);transform:translateX(calc((100vw - var(--mobile-instrument-size)) / 2));justify-self:center}.unifiedSurface{border-radius:14px;grid-template-rows:minmax(0,1fr);gap:8px;width:70.6%;height:53.4%;padding:9px;top:30.4%;left:14.7%}.deckHeader{display:none}.mixCanvas{grid-template-columns:minmax(0,1fr)}.groovePanel{display:none}.unifiedDeck .keypad{gap:7px}.unifiedDeck .padLabel{font-size:clamp(7px,1.9vw,9px);bottom:8px;left:8px;right:8px}}