.sp-slider{--thumb-size:20px;--fill-x:calc(var(--thumb-size) / 2 + var(--fill-frac,0) * (100% - var(--thumb-size)));height:44px}.sp-slider::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--slider-color,var(--accent)) 0%, var(--slider-color,var(--accent)) var(--fill-x), #00000080 var(--fill-x), #00000080 100%);border-radius:9999px;height:6px;box-shadow:inset 0 1px 2px #0009,inset 0 0 0 1px #ffffff1a}.sp-slider::-moz-range-track{background:linear-gradient(to right, var(--slider-color,var(--accent)) 0%, var(--slider-color,var(--accent)) var(--fill-x), #00000080 var(--fill-x), #00000080 100%);border-radius:9999px;height:6px;box-shadow:inset 0 1px 2px #0009,inset 0 0 0 1px #ffffff1a}.sp-slider::-webkit-slider-thumb{-webkit-appearance:none;width:var(--thumb-size);height:var(--thumb-size);border:3px solid var(--slider-color,var(--accent));cursor:pointer;background:#fff;border-radius:50%;margin-top:-7px;transition:transform 80ms,box-shadow 80ms;box-shadow:0 0 0 1px #0009,0 2px 6px #0000008c}.sp-slider::-moz-range-thumb{width:var(--thumb-size);height:var(--thumb-size);border:3px solid var(--slider-color,var(--accent));cursor:pointer;background:#fff;border-radius:50%;transition:transform 80ms,box-shadow 80ms;box-shadow:0 0 0 1px #0009,0 2px 6px #0000008c}.sp-slider:hover::-webkit-slider-thumb{transform:scale(1.08)}.sp-slider:hover::-moz-range-thumb{transform:scale(1.08)}.sp-slider:focus{outline:none}.sp-slider:focus::-webkit-slider-thumb{box-shadow:0 0 0 1px #0009,0 0 0 4px #fff3,0 2px 6px #0000008c}.sp-slider:focus::-moz-range-thumb{box-shadow:0 0 0 1px #0009,0 0 0 4px #fff3,0 2px 6px #0000008c}
