.fader{display:flex;align-items:center}.fader-label{margin-right:.5rem;white-space:nowrap}.fader-container{position:relative;width:100%;display:flex;align-items:center}.fader-track{position:relative;width:100%;height:1px;background-color:var(--color-light);margin-right:1rem;font-size:small}.fader-progress{position:absolute;height:100%;top:0;left:0;pointer-events:none}.fader-input{position:relative;-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;background-color:transparent;z-index:2;transform:translateY(-.5rem)}.fader-input:focus{outline:none}.fader-input::-moz-range-thumb{-moz-appearance:none;appearance:none;width:.5rem;height:1.25rem;border-radius:0;background:var(--color-dark);border:1px solid var(--color-light);-moz-transition:all .2s ease;transition:all .2s ease;z-index:100}.fader:not(.disabled) .fader-input:hover{cursor:pointer}.fader:not(.disabled) .fader-input:hover::-moz-range-thumb{border:1px solid var(--color-highlight)}.fader-value{min-width:1rem;max-width:3.5rem;text-align:right}@media(max-width:768px){.fader-value{max-width:4rem}}.fader-input::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:.5rem;height:1.25rem;border-radius:0;background:var(--color-dark);border:1px solid var(--color-light);-webkit-transition:all .2s ease;transition:all .2s ease;z-index:100;transform:translateY(-1px)}.fader:not(.disabled) .fader-input:hover::-webkit-slider-thumb{border:1px solid var(--color-highlight)}