@layer components{.gauge{pointer-events:none;flex-direction:column-reverse;flex:0 0 18%;justify-content:center;align-items:center;gap:.1vmin;display:flex}.gauge__toggle{display:none}.gauge__slider-container{flex:0 0 4vmin;justify-content:center;align-items:center;width:100%;display:flex;position:relative}.gauge__slider{cursor:pointer;background-color:var(--grey-2);border:.1vmin solid var(--grey-4);border-radius:.2vmin;width:2vmin;height:3.2vmin;position:absolute;box-shadow:inset 0 .1vmin .2vmin #000000e6,.1vmin .2vmin 0 .1vmin #0000004d}.gauge__slider:before{content:"";background-color:var(--red);width:calc(100% - .2vmin);height:.6vmin;filter:drop-shadow(0 .1vw .3vw var(--red-o-90));transition:.32s var(--transition-easing);pointer-events:auto;border-radius:.2vmin;transition-property:background-color,transform;position:absolute;bottom:.3vmin;left:.1vmin;box-shadow:0 .2vmin 0 .1vmin #000000b3}.gauge__toggle:checked+.gauge__slider-container .gauge__slider:before{background-color:var(--green);filter:drop-shadow(0 .1vw .3vw var(--green-o-90));transform:translateY(calc(100% - 2.9vmin))}.gauge__meter{aspect-ratio:1.7;border:.2vmin solid var(--grey-4);background:radial-gradient(circle at 30% 40%,#fff,#fff 20%,#ccc 50%);border-radius:100vmin 100vmin 10vmin 10vmin;width:100%;position:relative;overflow:hidden;box-shadow:inset .2vmin .2vmin .5vmin #000c,.1vmin .1vmin 0 .1vmin #0000004d}.gauge__meter:before{content:"";border:.1vmin solid var(--grey-1);border-radius:50%;width:70%;height:140%;position:absolute;bottom:-80%;left:15%}.gauge__meter:after{content:"";background:var(--red);transform-origin:bottom;width:3%;height:90%;transition:transform 3.2s var(--transition-easing);position:absolute;bottom:-2%;left:50%;transform:rotate(-80deg);box-shadow:.1vmin .1vmin .1vmin #00000080}.gauge__toggle:checked~.gauge__meter:after{transform:rotate(80deg)}.gauge__meter-tick{background-color:var(--grey-1);border-radius:50%;width:.2vmin;height:.2vmin;position:absolute}.gauge__meter-tick:first-child{bottom:10%;left:7%}.gauge__meter-tick:nth-child(2){bottom:34%;left:11%}.gauge__meter-tick:nth-child(3){bottom:54%;left:18%}.gauge__meter-tick:nth-child(4){bottom:69%;left:30%}.gauge__meter-tick:nth-child(5){top:12%;left:48%}.gauge__meter-tick:nth-child(6){bottom:69%;right:30%}.gauge__meter-tick:nth-child(7){bottom:54%;right:19%}.gauge__meter-tick:nth-child(8){bottom:34%;right:11%}.gauge__meter-tick:nth-child(9){bottom:10%;right:7%}}
