input[type=range] {height: 2.2em;-webkit-appearance: none;}input[type=range] {--range: calc(var(--max) - var(--min));--ratio: calc((var(--value) - var(--min)) / var(--range));--sx: calc(0.5 * 20px + var(--ratio) * (100% - 20px));}input[type=range]:focus {outline: none;}input[type=range]::-webkit-slider-thumb {-webkit-appearance: none;width: 20px;height: 20px;border-radius: 1em;background: #000000;border: none;box-shadow: none;margin-top: calc(10px * 0.5 - 20px * 0.5);}input[type=range]::-webkit-slider-runnable-track {height: 10px;border: none;border-radius: 100px;background: #8E8E8E33;box-shadow: none;}input[type=range]::-webkit-slider-runnable-track {background: linear-gradient(#3D7755,#3D7755) 0/var(--sx) 100% no-repeat, #8E8E8E33;}input[type=range]::-moz-range-thumb {width: 20px;height: 20px;border-radius: 1em;background: #000000;border: none;box-shadow: none;}input[type=range]::-moz-range-track {height: 10px;border: none;border-radius: 100px;background: #8E8E8E33;box-shadow: none;}input[type=range]::-moz-range-track {background: linear-gradient(#3D7755,#3D7755) 0/var(--sx) 100% no-repeat, #8E8E8E33;}input[type=range]::-ms-fill-upper {background: transparent;border-color: transparent;}input[type=range]::-ms-fill-lower {background: transparent;border-color: transparent;}input[type=range]::-ms-thumb {width: 20px;height: 20px;border-radius: 1em;background: #000000;border: none;box-shadow: none;margin-top: 0;box-sizing: border-box;}input[type=range]::-ms-track {height: 10px;border-radius: 100px;background: #8E8E8E33;border: none;box-shadow: none;box-sizing: border-box;}input[type=range]::-ms-fill-lower {height: 10px;border-radius: 100px 0 0 100px;margin: -undefined 0 -undefined -undefined;background: #3D7755;border: none;border-right-width: 0;}