html{font-family:Lato,sans-serif;font-size:16px;font-weight:500}body{--background-color: #121b7b;background-color:var(--background-color);padding:0;margin:0}.controls{position:absolute;bottom:16px;left:50%;transform:translate(-50%);display:flex;gap:16px}#container{display:flex;flex-direction:column;align-items:center;gap:2rem;position:absolute;bottom:50%;left:50%;transform:translate(-50%,50%)}#container canvas{flex:1;width:500px;height:470px}#container .canvas_container{position:relative}#container .canvas_container:after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 4rem 1rem var(--background-color)}#container .card{display:flex;flex-direction:column;align-items:center;gap:2rem;width:28rem;background-color:#fff;border-radius:1.5rem;padding:1.5rem 2rem 2rem}#container .card .upper_text{margin:0;color:#1b195a}#container .card .slider_container{display:flex;flex-direction:row;align-items:center;gap:2rem;width:100%}#container .card .slider_container .progress_circle{position:relative;width:124px;height:auto;aspect-ratio:1}#container .card .slider_container .progress_circle .handle_wrapper{pointer-events:none;position:absolute;top:0;left:0;width:124px;height:auto;aspect-ratio:1}#container .card .slider_container .progress_circle .handle_wrapper .handle_effect{width:2.5rem;height:auto;aspect-ratio:1;border-radius:999px;background-color:#296aff80;position:absolute;top:.25rem;left:50%;transform:translate(-50%,-50%)}#container .card .slider_container .progress_circle .slider{position:absolute;width:9.25rem;height:auto;aspect-ratio:1;top:50%;left:50%;transform:translate(-50%,-50%);--round-slider-path-color: #E2E1EB;--round-slider-bar-color: #FF4B18;--round-slider-handle-color: #296AFF;--round-slider-path-width: 9px;--round-slider-linecap: bar;--round-slider-disabled-bar-color: #FF4B18}#container .card .slider_container .progress_circle .progression{position:absolute;bottom:50%;left:50%;transform:translate(-50%,50%);margin:0;color:#ff4b18;font-size:1.5rem;font-weight:900}#container .card .slider_container .slider_text{font-size:1.875rem;font-weight:700;margin:0;flex:1;align-self:center;justify-self:center;color:#1b195a;max-width:15ch}#container .card .slider_container .slider_text .slider_span_text{color:#296aff}#container .card .slider_container .slider_text .slider_span_text_orange{color:#ff4b18}#container .needle_text{margin:0;font-size:1rem;font-weight:900;color:#ff4b18}