.palette-area{display:grid;gap:11px;min-width:0;justify-items:center}.bank-slots{display:flex;align-items:center;gap:5px;padding:3px;border-radius:15px;background:var(--edit-soft)}.bank-slot{display:flex;align-items:center;gap:5px;min-height:29px;padding:4px 10px;border-radius:11px;background:transparent;color:var(--edit-text);transition:background .16s,box-shadow .16s}.bank-slot .icon{width:16px;height:16px}.bank-slot span{font-size:10px;opacity:.58;font-variant-numeric:tabular-nums}.bank-slot[aria-selected=true]{background:var(--edit-surface);box-shadow:0 2px 5px rgba(var(--shadow),.1)}.bank-slot[aria-selected=true] span{opacity:1}.palette-area .palette{padding:0 4px}.bottom-area{height:172px;flex-shrink:0}.dock{min-height:116px}.dj-panel{width:320px;max-width:calc(100vw - 24px);padding:16px;border-radius:26px;overflow-x:hidden;overflow-y:auto;scrollbar-width:thin;overscroll-behavior:contain}.dj-header{margin-bottom:14px;min-width:0;font-size:12px}.dj-header>.icon{width:19px;height:19px;opacity:.75}.dj-body{grid-template-columns:112px minmax(0,1fr);gap:16px;min-width:0}.fx-controls{min-width:0;gap:12px}.fx-controls label{min-width:0;gap:5px;font-size:10px;letter-spacing:.01em}.fx-controls input{display:block;min-width:0;max-width:100%;width:100%;margin:0;height:15px}.dj-jog{position:relative;width:112px;height:112px;max-width:100%;padding:0;border:1px solid var(--edit-border);background:radial-gradient(circle at 34% 25%,var(--edit-soft),var(--edit-surface) 70%);box-shadow:inset 0 1px 2px #ffffff20,0 8px 18px rgba(var(--shadow),.16);overflow:hidden}.dj-jog:before{content:"";position:absolute;inset:8px;border-radius:50%;background:repeating-radial-gradient(circle,transparent 0 4px,var(--edit-border) 4.5px 5px);opacity:.65;pointer-events:none}.disc-label{inset:28px;display:grid;place-items:center;background:var(--selection-fill);border:1px solid var(--selection-ink);color:var(--selection-ink);box-shadow:inset 0 1px 2px #ffffff30;pointer-events:none}.disc-label>.icon{width:23px;height:23px;opacity:.85}.disc-label:before{top:5px;height:5px;width:3px}.disc-label:after{width:4px;height:4px;background:var(--edit-surface);border:0}.dj-jog[data-dragging=true]{box-shadow:0 0 0 4px var(--selection-fill),0 8px 18px rgba(var(--shadow),.13);border-color:var(--selection-ink)}.dj-pads{gap:9px;margin-top:16px;min-width:0}.dj-pads button{display:grid;place-items:center;min-width:0;min-height:42px;padding:8px;border:1px solid transparent;border-radius:14px;transition:background .1s,box-shadow .1s}.dj-pads button>.icon{width:21px;height:21px}.dj-pads button:hover:not(:disabled){border-color:var(--edit-border)}.dj-pads button[aria-pressed=true]{box-shadow:inset 0 2px 5px rgba(var(--shadow),.16)}.clear-dialog{width:350px;max-width:calc(100vw - 32px);margin:auto;padding:26px;border:1px solid var(--edit-border);border-radius:28px;background:var(--edit-surface);color:var(--edit-text);text-align:center;box-shadow:0 24px 90px rgba(var(--shadow),.25)}.clear-dialog::backdrop{background:#14101b80}.clear-emblem{width:48px;height:48px;margin:0 auto 16px;display:grid;place-items:center;border-radius:17px;background:var(--edit-soft);color:var(--selection-ink)}.clear-emblem .icon{width:24px;height:24px}.clear-dialog h2{margin:0 0 10px;font-size:19px;font-weight:600;letter-spacing:-.03em}.clear-dialog p{margin:0;font-size:13px;line-height:1.6;opacity:.75}.clear-actions{display:flex;gap:9px;margin-top:24px}.clear-actions button{flex:1;min-height:43px;border-radius:14px;background:var(--edit-soft);color:var(--edit-text);font-size:13px;font-weight:500}.clear-actions #clear-confirm{background:var(--selection-ink);color:var(--edit-surface)}@media (max-width:1100px){.palette-area .palette{gap:8px}.palette-area .pebble{width:43px;height:46px}.bank-slot{padding:4px 8px}.dock{gap:7px}}@media (max-width:760px){.bottom-area{height:171px}.palette-area{gap:10px}.palette-area .palette{gap:6px}.palette-area .pebble{width:38px;height:40px}.bank-slot{padding:4px 9px}.dock{gap:5px}}@media (max-width:540px){.bottom-area{height:216px}.dock{max-width:100%;width:100%;padding:12px 14px;min-height:170px;row-gap:14px}.palette-area{width:100%;gap:11px}.palette-area .palette{width:100%;justify-content:space-between;gap:4px;padding:0}.palette-area .pebble{width:clamp(27px,8.1vw,39px);height:38px;flex-shrink:1;border-radius:13px}.palette-area .pebble .icon{width:18px;height:18px}.dock>.divider:first-of-type{display:none}.dj-panel{inset:auto 12px 108px auto;width:308px;padding:14px;max-height:calc(100dvh - 132px)}.dj-body{grid-template-columns:104px minmax(0,1fr);gap:14px}.dj-jog{width:104px;height:104px}.disc-label{inset:26px}.dj-header{margin-bottom:12px}}@media (max-height:540px) and (min-width:1051px){.bottom-area{height:128px}.dock{min-height:104px;padding-top:9px;padding-bottom:9px}.palette-area{gap:8px}.dj-panel{top:62px;bottom:auto;max-height:calc(100dvh - 74px)}.dj-body{grid-template-columns:100px minmax(0,1fr);gap:14px}.dj-jog{width:100px;height:100px}.disc-label{inset:24px}.fx-controls{gap:7px}.dj-header{margin-bottom:9px}.dj-pads{margin-top:12px}}@media (max-height:540px) and (max-width:1050px){.bottom-area{height:auto;min-height:0;gap:5px;padding-bottom:5px}.dock{min-height:0;padding:7px 14px;row-gap:5px}.palette-area{gap:5px}.bank-slots{padding:2px;gap:4px;border-radius:12px}.bank-slot{min-height:24px;padding:2px 8px;border-radius:9px}.bank-slot .icon{width:14px;height:14px}.palette-area .palette{gap:6px}.palette-area .pebble{width:38px;height:34px;border-radius:12px}.palette-area .pebble .icon{width:16px;height:16px}.play-button{width:48px;height:44px;border-radius:17px;margin:0 2px}.play-button>.icon{width:22px;height:22px}.time-button{padding:6px;min-width:60px}.toast{bottom:150px}.dj-body{grid-template-columns:100px minmax(0,1fr);gap:14px}.dj-jog{width:100px;height:100px}.disc-label{inset:24px}.fx-controls{gap:7px}.dj-header{margin-bottom:9px}.dj-pads{margin-top:12px}}.settings-dialog{width:460px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 32px);margin:auto;padding:0;border:1px solid var(--edit-border);border-radius:26px;background:var(--edit-surface);color:var(--edit-text);box-shadow:0 24px 90px rgba(var(--shadow),.25)}.settings-dialog[open]{display:flex;flex-direction:column}.settings-dialog::backdrop{background:#14101b80}.settings-header{display:flex;align-items:center;gap:9px;padding:16px 18px 10px}.settings-header h2{margin:0 auto 0 0;font-size:17px;font-weight:600;letter-spacing:-.02em}.settings-header>.icon{width:19px;height:19px;opacity:.8}.settings-body{overflow-y:auto;overscroll-behavior:contain;padding:0 18px 18px;display:grid;gap:12px;scrollbar-width:thin}.settings-group{display:grid;gap:2px}.settings-group h3{margin:6px 0 4px;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;opacity:.55}.settings-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:42px;font-size:13px}.settings-row>span:first-child{display:grid;gap:1px}.settings-row small{font-size:10.5px;opacity:.6}.seg{display:flex;gap:3px;padding:3px;border-radius:12px;background:var(--edit-soft)}.seg button{min-height:28px;padding:4px 10px;border-radius:9px;background:transparent;color:inherit;font-size:12px;white-space:nowrap}.seg button[aria-pressed=true]{background:var(--edit-surface);box-shadow:0 1px 4px rgba(var(--shadow),.14)}.switch{width:42px;height:24px;flex-shrink:0;border-radius:12px;background:var(--edit-border);position:relative;transition:background .15s}.switch:after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:var(--edit-surface);box-shadow:0 1px 3px rgba(var(--shadow),.3);transition:transform .15s}.switch[aria-pressed=true]{background:var(--selection-ink)}.switch[aria-pressed=true]:after{transform:translate(18px)}.settings-range{display:flex;align-items:center;gap:8px}.settings-range input{width:120px}.settings-range output{font-size:12px;min-width:48px;text-align:right;font-variant-numeric:tabular-nums;opacity:.8}.settings-actions{flex-wrap:wrap;justify-content:flex-start;padding-top:4px}.settings-actions button{display:flex;align-items:center;gap:7px;min-height:38px;padding:8px 13px;border-radius:12px;background:var(--edit-soft);color:inherit;font-size:12.5px}.settings-actions .icon{width:16px;height:16px}#settings-wipe{color:#b4524e}:root[data-theme=dark] #settings-wipe{color:#e8938f}@media (max-width:540px){.settings-dialog{width:100%;max-width:calc(100vw - 16px)}.settings-row{flex-wrap:wrap;row-gap:4px}.seg{flex-wrap:wrap}}:root[data-tooltips=off] [data-tip]:after,:root[data-tooltips=off] .pebble:before{display:none!important}:root[data-motion=reduce] *,:root[data-motion=reduce] *:before,:root[data-motion=reduce] *:after{animation:none!important;transition:none!important}@media (pointer:fine) and (min-width:1051px){:root[data-scale-mode=css][data-scale=compact] .icon-button{width:37px;height:37px}:root[data-scale-mode=css][data-scale=compact] .palette-area .pebble{width:42px;height:43px}:root[data-scale-mode=css][data-scale=compact] .play-button{width:58px;height:58px}:root[data-scale-mode=css][data-scale=compact] .bottom-area{height:158px}:root[data-scale-mode=css][data-scale=compact] .dock{min-height:104px;padding:10px 16px}:root[data-scale-mode=css][data-scale=large] .icon-button{width:48px;height:48px}:root[data-scale-mode=css][data-scale=large] .icon{width:24px;height:24px}:root[data-scale-mode=css][data-scale=large] .palette-area .pebble{width:53px;height:53px}:root[data-scale-mode=css][data-scale=large] .palette-area .pebble .icon{width:24px;height:24px}:root[data-scale-mode=css][data-scale=large] .play-button{width:74px;height:74px}:root[data-scale-mode=css][data-scale=large] .bottom-area{height:190px}:root[data-scale-mode=css][data-scale=large] .bank-slot{min-height:33px;padding:6px 12px}:root[data-scale-mode=css][data-scale=large] .time-button{font-size:15px}}@media (pointer:coarse){body{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;overscroll-behavior:none}input,select,textarea{-webkit-user-select:auto;user-select:auto}img{-webkit-user-drag:none;pointer-events:none}}.dock-end{display:contents}@media (pointer:coarse){:root[data-scale-mode=css][data-scale=compact] .bank-slot{min-height:26px}:root[data-scale-mode=css][data-scale=compact] .palette-area .pebble{height:34px}:root[data-scale-mode=css][data-scale=compact] .play-button{height:46px}:root[data-scale-mode=css][data-scale=compact] .canvas-bar .icon-button{height:34px}:root[data-scale-mode=css][data-scale=large] .bank-slot{min-height:38px}:root[data-scale-mode=css][data-scale=large] .palette-area .pebble{height:48px}:root[data-scale-mode=css][data-scale=large] .palette-area .pebble .icon{width:21px;height:21px}:root[data-scale-mode=css][data-scale=large] .play-button{height:62px}:root[data-scale-mode=css][data-scale=large] .canvas-bar .icon-button{height:46px;min-width:46px}:root[data-scale-mode=css][data-scale=large] .top-actions .icon-button{width:46px;height:46px}}@media (prefers-reduced-motion:reduce){.bank-slot,.dj-pads button,.switch,.switch:after{transition:none}}:root[data-motion=reduce] .disc-label{transform:none}:root[data-motion=reduce] .dj-jog[data-dragging=true] .disc-label{transform:rotate(var(--disc-angle,0deg))}