.slider{--slider-thumb-radius:0.5625rem}.slider-input{--slider-primary-color:var(--color-blue-medium);--slider-hover-color:var(--color-blue-dark);--slider-empty-track-color:var(--color-blue-lighter);--slider-track-height:8px;display:block;height:1.25rem;width:100%;max-width:100%;box-sizing:border-box;min-width:0;cursor:pointer;appearance:none;background-color:transparent;touch-action:pan-y;&:focus{outline:none}&:disabled{cursor:not-allowed;--slider-primary-color:var(--color-steel-light);--slider-hover-color:var(--color-steel-light);--slider-empty-track-color:var(--color-steel-lighter)}&::-webkit-slider-runnable-track{width:100%;height:var(--slider-track-height);border-radius:9999px;background:linear-gradient(to right,var(--slider-primary-color) calc(var(--slider-fill-percentage, 0) * 1%),var(--slider-empty-track-color) calc(var(--slider-fill-percentage, 0) * 1%))}&::-moz-range-track{height:.5rem;border-radius:9999px;background-color:var(--slider-empty-track-color)}&::-moz-range-progress{height:.5rem;border-radius:9999px;background-color:var(--slider-primary-color)}&::-webkit-slider-thumb{appearance:none;width:calc(var(--slider-thumb-radius) * 2);height:calc(var(--slider-thumb-radius) * 2);border-radius:9999px;border:2px solid white;background-color:var(--slider-primary-color);box-shadow:0 0 0 1px var(--slider-primary-color);margin-top:calc((var(--slider-track-height) - var(--slider-thumb-radius) * 2) / 2);transition:transform .15s,background-color .15s,box-shadow .15s}&::-moz-range-thumb{width:1.25rem;height:1.25rem;border-radius:9999px;border:2px solid white;background-color:var(--slider-primary-color);box-shadow:0 0 0 1px var(--slider-primary-color);transition:transform .15s,background-color .15s,box-shadow .15s}&:not(:disabled):active::-webkit-slider-thumb,&:not(:disabled):hover::-webkit-slider-thumb{scale:1.2}&:not(:disabled):active::-moz-range-thumb,&:not(:disabled):hover::-moz-range-thumb{scale:1.2}&:active::-webkit-slider-thumb,&:hover::-webkit-slider-thumb{background-color:var(--slider-hover-color);box-shadow:0 0 0 1px var(--slider-hover-color)}&:active::-moz-range-thumb,&:hover::-moz-range-thumb{background-color:var(--slider-hover-color);box-shadow:0 0 0 1px var(--slider-hover-color)}&:focus-visible::-webkit-slider-thumb{scale:1.2;background-color:var(--slider-hover-color);box-shadow:0 0 0 1px var(--slider-hover-color),0 0 0 2px var(--slider-primary-color)}&:focus-visible::-moz-range-thumb{scale:1.2;background-color:var(--slider-hover-color);box-shadow:0 0 0 1px var(--slider-hover-color),0 0 0 2px var(--slider-primary-color)}}