:root{--tremolo-theme-color:#4e76e6}.tremolo-no-select{user-select:none}.tremolo-knob{display:inline-block;cursor:pointer;overflow:visible;outline:0;&:focus,&:hover{>.tremolo-knob-active-line{color:#4e76e6}>.tremolo-knob-inactive-line{color:#ddd}>.tremolo-knob-thumb{color:#ccc}}&[aria-readonly=true]{cursor:not-allowed}&[aria-disabled=true]{>.tremolo-knob-active-line{color:#5d6478}}}.tremolo-knob-active-line{overflow:visible;color:#7998ec}.tremolo-knob-inactive-line{color:#eee}.tremolo-knob-thumb{color:#d0d0d0}.tremolo-knob-thumb-line{color:#eee}.tremolo-number-input-wrapper{--border-radius:4px;--stepper-width:20px;--active-color:var(--tremolo-theme-color);display:inline-flex;flex-direction:row;position:relative;width:140px;height:min-content;border:0 solid #c1c1c1;outline:none;transition:all .1s;&:not(:focus-within):has(>.tremolo-number-input[data-error=true]){border-color:#f34343}&[data-variant=outline]{border-width:1px;border-radius:var(--border-radius);&:hover{border-color:#909090}&:focus-within{border-color:var(--active-color);box-shadow:0 0 0 2px color-mix(in srgb,var(--active-color) 10%,transparent)}}&[data-variant=filled]{border-width:1px;border-radius:var(--border-radius);border-color:transparent;background-color:#edf2f7;&:hover{background-color:#e4e9ee}&:focus-within{background-color:inherit;border-color:var(--active-color);box-shadow:0 0 0 2px color-mix(in srgb,var(--active-color) 10%,transparent)}}&[data-variant=flushed]{border-bottom-width:1px;&:hover{border-color:#909090}&:focus-within{border-color:var(--active-color);box-shadow:0 2px 0 0 color-mix(in srgb,var(--active-color) 10%,transparent)}}&[data-stepper=false]{--stepper-width:0px}}.tremolo-number-input{display:block;width:calc(100% - 20px - var(--stepper-width));background-color:inherit;font:inherit;padding:6px 10px;margin:0;border:none;outline:none;appearance:none;&[aria-readonly=true]{cursor:not-allowed}}.tremolo-number-input-stepper{display:flex;flex-direction:column;height:100%;position:absolute;top:0;right:0;width:var(--stepper-width);transition:all .1s linear;&[data-dynamic=true]{opacity:0;transform:translateX(40%)}}:is(.tremolo-number-input-wrapper:hover,.tremolo-number-input-wrapper:focus-within) .tremolo-number-input-stepper{opacity:1;transform:translateX(0)}.tremolo-number-input-increment-stepper{border-inline-start-width:1px;border-inline-start-style:solid;border-inline-start-color:#ccc;font-size:calc(.75rem);display:flex;justify-content:center;align-items:center;flex:1 1 0%;max-height:50%;user-select:none;cursor:pointer;border-top-right-radius:var(--border-radius);&[aria-disabled=false]:active{background-color:#3443560e}&[aria-disabled=true],&[aria-readonly=true]{cursor:not-allowed}}.tremolo-number-input-decrement-stepper{border-inline-start-width:1px;border-inline-start-style:solid;border-inline-start-color:#ccc;border-top:1px solid #ccc;font-size:calc(.75rem);display:flex;justify-content:center;align-items:center;flex:1 1 0%;max-height:50%;user-select:none;cursor:pointer;border-bottom-right-radius:var(--border-radius);&[aria-disabled=false]:active{background-color:#3443560e}&[aria-disabled=true],&[aria-readonly=true]{cursor:not-allowed}}.tremolo-piano{display:inline-block;box-sizing:border-box;user-select:none;touch-action:none;position:relative}.tremolo-piano-white-key{--bg:white;--color:black;--active-bg:#ccc;--active-color:black;box-sizing:border-box;position:absolute;background-color:var(--bg);-webkit-tap-highlight-color:transparent;color:var(--color);border:1px solid #555;border-radius:0 0 8px 8px;cursor:pointer;z-index:1;&[data-active=true]{background-color:var(--active-bg);color:var(--active-color)}&[aria-disabled=true]{cursor:not-allowed}}.tremolo-piano-black-key{--color:white;--bg:#333;--active-color:white;--active-bg:#666;box-sizing:border-box;position:absolute;background-color:var(--bg);-webkit-tap-highlight-color:transparent;color:var(--color);border:1px solid #555;border-radius:0 0 8px 8px;cursor:pointer;z-index:2;&[data-active=true]{background-color:var(--active-bg);color:var(--active-color)}&[aria-disabled=true]{cursor:not-allowed}}.tremolo-piano-key-label-wrapper{display:flex;justify-content:center;align-items:end;height:100%}.tremolo-piano-key-label{box-sizing:content-box;display:flex;justify-content:center;align-items:center;font-size:.6rem;height:10px;margin-bottom:10px;padding:4px;border-radius:4px;border:1px solid #888;aspect-ratio:1;max-width:calc(100% - 16px)}.tremolo-slider{display:inline-block;cursor:pointer;outline:0;-webkit-tap-highlight-color:transparent;&[aria-readonly=true]{cursor:not-allowed}}.tremolo-slider-thumb-wrapper{position:absolute;translate:-50% -50%;z-index:100}.tremolo-slider-thumb{--color:var(--tremolo-theme-color);background:var(--color);border-radius:50%;outline:none;&[aria-disabled=true]{background:#5d6478}&[aria-readonly=false]:focus{box-shadow:0 0 0 3px color-mix(in srgb,var(--color) 20%,transparent)}}.tremolo-slider-track{--active:#7998ec;--inactive:#eee;position:relative;&[data-vertical=false]{min-width:50px}&[data-vertical=true]{min-height:50px}&:hover{--active:#6387e9;--inactive:#e0e0e0}&[aria-disabled=true]{--active:#858890;--inactive:#ddd}}.tremolo-slider-scale{display:block;position:relative}.tremolo-slider-scale-option{display:flex;color:#222;flex-direction:column;justify-content:center;align-items:center;position:absolute;translate:-50% 0;z-index:10;&[data-vertical=true]{flex-direction:row;translate:0 -50%}}.tremolo-slider-scale-option-mark{background-color:currentColor}.tremolo-slider-scale-option-label{text-align:right}.tremolo-xy-pad{display:inline-block;cursor:pointer}.tremolo-xy-pad-area{--color:#eee;position:relative;background-color:var(--color)}.tremolo-xy-pad-thumb-wrapper{position:absolute;translate:-50% -50%;z-index:100}.tremolo-xy-pad-thumb{--color:var(--tremolo-theme-color);border-radius:50%;outline:none;background-color:var(--color);&[aria-disabled=true]{background-color:#5d6478}&:focus{box-shadow:0 0 0 3px color-mix(in srgb,var(--color) 20%,transparent)}}@font-face{font-family:Geist;font-style:normal;font-weight:100 900;font-display:swap;src:url(/_next/static/media/8d697b304b401681-s.woff2) format("woff2");unicode-range:u+0301,u+0400-045f,u+0490-0491,u+04b0-04b1,u+2116}@font-face{font-family:Geist;font-style:normal;font-weight:100 900;font-display:swap;src:url(/_next/static/media/ba015fad6dcf6784-s.woff2) format("woff2");unicode-range:u+0100-02ba,u+02bd-02c5,u+02c7-02cc,u+02ce-02d7,u+02dd-02ff,u+0304,u+0308,u+0329,u+1d00-1dbf,u+1e00-1e9f,u+1ef2-1eff,u+2020,u+20a0-20ab,u+20ad-20c0,u+2113,u+2c60-2c7f,u+a720-a7ff}@font-face{font-family:Geist;font-style:normal;font-weight:100 900;font-display:swap;src:url(/_next/static/media/4cf2300e9c8272f7-s.p.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+0304,u+0308,u+0329,u+2000-206f,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}@font-face{font-family:Geist Fallback;src:local("Arial");ascent-override:95.94%;descent-override:28.16%;line-gap-override:0.00%;size-adjust:104.76%}.__className_188709{font-family:Geist,Geist Fallback;font-style:normal}.__variable_188709{--font-geist-sans:"Geist","Geist Fallback"}@font-face{font-family:Geist Mono;font-style:normal;font-weight:100 900;font-display:swap;src:url(/_next/static/media/9610d9e46709d722-s.woff2) format("woff2");unicode-range:u+0301,u+0400-045f,u+0490-0491,u+04b0-04b1,u+2116}@font-face{font-family:Geist Mono;font-style:normal;font-weight:100 900;font-display:swap;src:url(/_next/static/media/747892c23ea88013-s.woff2) format("woff2");unicode-range:u+0100-02ba,u+02bd-02c5,u+02c7-02cc,u+02ce-02d7,u+02dd-02ff,u+0304,u+0308,u+0329,u+1d00-1dbf,u+1e00-1e9f,u+1ef2-1eff,u+2020,u+20a0-20ab,u+20ad-20c0,u+2113,u+2c60-2c7f,u+a720-a7ff}@font-face{font-family:Geist Mono;font-style:normal;font-weight:100 900;font-display:swap;src:url(/_next/static/media/93f479601ee12b01-s.p.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+0304,u+0308,u+0329,u+2000-206f,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}@font-face{font-family:Geist Mono Fallback;src:local("Arial");ascent-override:74.67%;descent-override:21.92%;line-gap-override:0.00%;size-adjust:134.59%}.__className_9a8899{font-family:Geist Mono,Geist Mono Fallback;font-style:normal}.__variable_9a8899{--font-geist-mono:"Geist Mono","Geist Mono Fallback"}