.range-presets{z-index:2;flex-direction:column;gap:4px;display:flex;position:absolute;top:8px;right:8px}.range-presets-menu{background:#fff;border-radius:8px;flex-direction:column;gap:4px;padding:4px;display:flex;position:absolute;top:32px;right:-4px;box-shadow:0 4px 12px #0003}.range-preset{color:#444;cursor:pointer;background:#0000000d;border:1px solid #0000;border-radius:6px;justify-content:center;align-items:center;width:28px;height:28px;padding:0;transition:background .1s,border-color .1s;display:flex}.range-preset:hover,.range-preset.open{background:#0000001a}.range-preset.active{color:#aa3bff;cursor:default;background:#aa3bff1f;border-color:#aa3bff}.range-preset svg{fill:none;stroke:currentColor;stroke-width:1.5px;stroke-linecap:round;stroke-linejoin:round}.range-preset svg .range-preset-fill{fill:currentColor;stroke:none}.range-preset svg .range-preset-hole{fill:#fff;stroke:none}.range-preset svg{overflow:visible}.range-preset svg .range-preset-glyph{fill:currentColor;stroke:none;font-family:serif}.range-preset svg .range-preset-glyph.treble{font-size:27px}.range-preset svg .range-preset-glyph.bass{font-size:19px}.range-preset svg .range-preset-glyph.c-clef{font-size:24px}.range-preset svg .range-preset-letter{fill:currentColor;stroke:none;font:700 8px system-ui,sans-serif}.range-preset-group,.range-preset.group{position:relative}.range-preset.group.active{cursor:pointer}.range-preset.group:after{content:"";opacity:.6;border-top:4px solid #0000;border-left:4px solid;position:absolute;bottom:2px;left:2px}.range-preset-flyout{z-index:3;background:#fff;border-radius:8px;gap:4px;padding:4px;display:flex;position:absolute;top:-4px;right:calc(100% + 4px);box-shadow:0 4px 12px #0003}.range-drag-handle{cursor:ns-resize;touch-action:none}.range-drag-area{fill:#0000;stroke:#0000}.range-drag-handle:hover .range-drag-area,.range-drag-handle:active .range-drag-area{fill:#aa3bff14;stroke:#aa3bff80;stroke-width:1px}.range-drag-knob rect{fill:#fff;stroke:#000;stroke-width:1.6px}.range-drag-knob line{stroke:#000;stroke-width:1.2px;stroke-linecap:round}.range-drag-handle:hover .range-drag-knob rect,.range-drag-handle:active .range-drag-knob rect{fill:#f3e8ff;stroke:#aa3bff}.range-drag-handle:hover .range-drag-knob line,.range-drag-handle:active .range-drag-knob line{stroke:#aa3bff}
