.dial-control{display:flex!important;flex-direction:column;align-items:center;justify-content:start;gap:10px!important;padding:16px 10px!important;border:1px solid #42433f!important;border-radius:12px;background:#252623;min-width:0;text-align:center;font-size:13px!important;color:#ebe8df}.dial-control>span:first-child{width:100%;display:block}.dial-control output{float:none!important;display:block!important;color:#a9c6ff!important;margin:5px 0 0;font-variant-numeric:tabular-nums}.dial-shell{--turn:0deg;--fill:135deg;display:block!important;width:86px!important;height:86px;position:relative;flex:none;border-radius:50%;background:conic-gradient(from 225deg,#739ff2 0deg var(--fill),#50534d var(--fill) 270deg,transparent 270deg);box-shadow:0 6px 14px #0005;margin:8px auto!important}.dial-face{position:absolute;inset:7px;border:2px solid #5d6059;border-radius:50%;background:radial-gradient(circle at 35% 25%,#62655e,#292b27 65%);transform:rotate(var(--turn));pointer-events:none}.dial-pointer{position:absolute;width:4px;height:20px;top:6px;left:calc(50% - 2px);background:#ebe8df;border-radius:2px}.dial-input{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;margin:0!important;opacity:0;cursor:ns-resize;touch-action:none}.dial-shell:focus-within{outline:3px solid #b7d0ff;outline-offset:4px}.dial-shell:hover,.dial-shell.turning{filter:brightness(1.2)}.dial-value{min-height:18px}.gesture-hint{font-size:12px;color:#bdbfb6}.amp-controls .studio-fields{grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.amp-controls .studio-fields>label:not(.dial-control){grid-column:span 2}.amp-controls .studio-fields>label:nth-child(2){grid-column:span 3}.instrument .control-grid{gap:12px}.console-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:28px}.console-heading h2{font-size:32px!important;margin:10px 0}.dj-instrument{background:#171916!important;border:1px solid #50534a!important;border-radius:18px!important;padding:28px!important}.dj-instrument .decks{display:grid;grid-template-columns:minmax(0,1fr) 210px minmax(0,1fr);gap:18px;align-items:stretch}.dj-instrument .deck{background:#252723;border:1px solid #51564b;border-radius:12px;padding:20px;display:flex;flex-direction:column;gap:14px;min-width:0}.dj-instrument .deck h2{font-size:20px;overflow-wrap:anywhere;min-height:50px;margin:0}.dj-instrument .deck-wave{width:100%;height:70px;border-radius:4px}.dj-instrument .deck .file-label{padding:14px;border:1px dashed #929b82;border-radius:7px;background:#30352c;cursor:pointer;font-size:13px}.dj-instrument .track-file{display:block;width:100%;font-size:11px;margin-top:10px}.dj-instrument .mixer{margin:0!important;padding:22px 12px!important;border:1px solid #666b5e;border-radius:10px;background:#e8e5db;color:#171916;display:flex;flex-direction:column;justify-content:center;gap:25px;min-width:0}.mixer h3{font-size:23px}.mixer input{accent-color:#0047ab;width:100%;height:36px;cursor:ew-resize}.mixer>label{font-size:11px;gap:6px}.mixer .button{font-size:12px;padding:14px 8px}.mix-visual{display:flex;gap:8px;align-items:center;font-size:12px}.mix-balance{height:10px;flex:1;background:linear-gradient(to right,#0047ab var(--mix),#a6a89b var(--mix));border-radius:5px}.deck-tone{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.deck-tone .dial-shell{width:58px!important;height:58px}.deck-tone .dial-control{padding:10px 3px!important;font-size:11px!important}.deck-tone .dial-pointer{height:12px;top:4px}.deck-tone .dial-face{inset:5px}.jog-shell{width:146px!important;height:146px;background:repeating-radial-gradient(#353831 0px,#353831 3px,#45493f 4px,#353831 5px);border:3px solid #818b72}.jog-shell .dial-face{inset:26px;background:radial-gradient(#0047ab,#182844);border:1px solid #8492a5}.dj-instrument .deck>.dial-control:has(.jog-shell){order:0;background:#1a1c18}.deck.drag-over{outline:3px solid #92b6ff;background:#28364c}.deck-transport{display:flex;gap:8px}.deck-transport .button{flex:1;font-size:12px;padding:14px 8px}.dj-instrument .demo-load{border:1px solid #767e6a;border-radius:5px;padding:10px;background:transparent;color:#ebe8df}.dj-instrument .deck-play[aria-pressed=true]{background:#ebe8df;color:#111;box-shadow:0 0 0 2px #0047ab}.dj-instrument .deck-status{min-height:32px;font-size:11px}.dj-instrument .instrument-status{margin-top:24px;font-size:13px}@media(max-width:1000px){.dj-instrument .decks{grid-template-columns:1fr 1fr}.dj-instrument .mixer{grid-column:1/-1;grid-row:2}.deck-tone .dial-shell{width:64px!important;height:64px}.amp-controls .studio-fields{grid-template-columns:repeat(3,minmax(0,1fr))}.amp-controls .studio-fields>label:not(.dial-control){grid-column:span 3}}@media(max-width:600px){.dj-instrument{padding:14px!important}.dj-instrument .decks{grid-template-columns:1fr}.dj-instrument .mixer{grid-row:auto;grid-column:auto}.console-heading{align-items:stretch;flex-direction:column}.amp-controls .studio-fields{grid-template-columns:repeat(2,minmax(0,1fr))}.amp-controls .studio-fields>label:not(.dial-control){grid-column:span 2}.dial-shell{width:76px!important;height:76px}.deck-tone .dial-shell{width:68px!important;height:68px}}
.dj-instrument .deck>*{margin:0!important}.dj-instrument .deck{gap:12px}.dj-instrument .deck h2{min-height:28px}.dj-instrument .file-label{color:#ebe8df!important}.dj-instrument .mixer .eyebrow,.dj-instrument .mixer b{color:#4a4c43}.dj-instrument .mixer .button{color:#171916;background:transparent;border-color:#74796b}.dj-instrument .mixer{align-self:center;min-height:420px}.dj-instrument .deck-tone{grid-template-columns:repeat(4,minmax(0,1fr))}.dj-instrument .deck-tone .dial-control{margin:0!important}.dj-instrument .deck-tone .dial-shell{width:54px!important;height:54px}.dj-instrument .deck-tone .dial-value{font-size:10px}.jog-shell{width:120px!important;height:120px}.dj-instrument .dial-control{gap:4px!important;padding:10px!important}.dj-instrument .jog-shell{margin:4px auto!important}.dj-instrument .deck-status{min-height:18px}.dj-instrument .deck>.dial-control:has(.jog-shell){padding:8px!important}.dj-instrument .deck>.dial-control:has(.jog-shell) output{margin:0!important}@media(max-width:1000px){.dj-instrument .mixer{min-height:0}.dj-instrument .deck-tone{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.dj-instrument .deck-tone{grid-template-columns:repeat(4,minmax(0,1fr))}.dj-instrument .deck-tone .dial-shell{width:48px!important;height:48px}.dj-instrument .deck-tone .dial-control{padding:8px 2px!important}}

.dial-control{position:relative}.knob-info{position:absolute;right:3px;top:2px;display:grid;place-items:center;width:20px;height:20px;padding:0;border:1px solid #9b9e95;border-radius:50%;background:#20221f;color:#ebe8df;font:italic 12px Georgia,serif;cursor:pointer;z-index:2}.knob-info:hover,.knob-info[aria-expanded=true]{background:#0047ab;color:white}.knob-note{max-width:min(320px,calc(100vw - 32px));padding:20px;background:#ebe8df;color:#151515;border:1px solid #777;border-radius:8px;font:15px/1.5 Arial,sans-serif;box-shadow:0 12px 45px #0006}.knob-note::backdrop{background:#0003}.compact-amp .dial-control{padding-top:24px!important}.compact-amp .knob-info{top:0;right:calc(50% - 42px)}