input[type=range]{-webkit-appearance:none;width:100%;height:8px;border-radius:5px;background:#e5e7eb;outline:none}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:24px;height:24px;border-radius:50%;background:#fff;border:2px solid hsl(var(--primary));cursor:pointer;box-shadow:0 2px 4px #0000001a;-webkit-transition:all .2s ease;transition:all .2s ease}input[type=range]::-moz-range-thumb{width:24px;height:24px;border-radius:50%;background:#fff;border:2px solid hsl(var(--primary));cursor:pointer;box-shadow:0 2px 4px #0000001a;-moz-transition:all .2s ease;transition:all .2s ease}input[type=range]::-webkit-slider-thumb:hover,input[type=range]:focus::-webkit-slider-thumb{background:hsl(var(--primary) / .1);transform:scale(1.1)}input[type=range]::-moz-range-thumb:hover,input[type=range]:focus::-moz-range-thumb{background:hsl(var(--primary) / .1);transform:scale(1.1)}input[type=range]::-webkit-slider-runnable-track{height:8px;border-radius:5px;background:linear-gradient(to right,hsl(var(--primary)) 0%,hsl(var(--primary)) var(--range-percent, 0%),#e5e7eb var(--range-percent, 0%),#e5e7eb 100%)}input[type=range]::-moz-range-track{height:8px;border-radius:5px;background:#e5e7eb}input[type=range]::-moz-range-progress{height:8px;border-radius:5px 0 0 5px;background:hsl(var(--primary))}.range-bubble{position:absolute;background:hsl(var(--primary));color:#fff;padding:4px 8px;border-radius:16px;font-size:.875rem;top:-30px;left:var(--range-percent, 0%);transform:translate(-50%);white-space:nowrap;pointer-events:none}.range-bubble:after{content:"";position:absolute;bottom:-5px;left:50%;transform:translate(-50%);width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:6px solid hsl(var(--primary))}