.cartemperature-root *{box-sizing:border-box;text-rendering:geometricPrecision;-webkit-font-smoothing:antialiased;margin:0;padding:0}.cartemperature-root{--window-width:100vw;--temp-color:rgba(255,255,255,.67);--fan-value:.5;--test:calc(var(--window-width)*.002);background:#000}.cartemperature-root h1,.cartemperature-root h3,.cartemperature-root p,.cartemperature-root a{color:#fff}.cartemperature-root h1,.cartemperature-root h3{font-family:Bruno Ace,sans-serif;font-style:normal;font-weight:400}.cartemperature-root h1{font-size:calc(var(--window-width)*.04)}.cartemperature-root h3{font-size:calc(var(--window-width)*.01)}.cartemperature-root a,.cartemperature-root p{color:rgba(255,255,255,.4);font-optical-sizing:auto;font-family:JetBrains Mono,monospace;font-weight:600;font-size:calc(var(--window-width)*.01);letter-spacing:.01em;font-style:normal}.cartemperature-root .container{justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:absolute;overflow:hidden;max-width:none!important}.cartemperature-root .content{position:relative;overflow:hidden}.cartemperature-root .mask{z-index:99;object-fit:cover;pointer-events:none;filter:saturate(0)hue-rotate(130deg);max-width:100%;max-height:100%;position:relative}.cartemperature-root .interface{width:100%;height:100%;padding-bottom:calc(var(--window-width)*.05);flex-flow:horizontal;justify-content:stretch;display:flex;position:absolute;top:0;left:0}.cartemperature-root .border{z-index:2;pointer-events:none;border:0;position:absolute;top:20.5%;bottom:auto;left:8.75%;right:8.65%}.cartemperature-root .border svg{display:block}.cartemperature-root .main-border{opacity:calc(.5 + var(--fan-value)/2);z-index:1;position:relative}.cartemperature-root .temp-border,.cartemperature-root .fan-border{z-index:1;height:257.4%;opacity:calc(.5 + var(--fan-value)/2);transform-origin:100%;aspect-ratio:1/4;position:absolute;top:-78.1%;bottom:auto;left:-6.1%;right:auto;overflow:hidden;transform:rotate(0)}.cartemperature-root .fan-border{transform-origin:0;height:255.4%;top:-77%;bottom:auto;left:auto;right:-6%}.cartemperature-root .temp-border svg,.cartemperature-root .fan-border svg{transform-origin:100%;aspect-ratio:1/2;height:50%;position:relative;top:25%;transform:rotate(0)}.cartemperature-root .fan-border svg{transform-origin:0;transform:translate(-100%)scaleX(-1)}.cartemperature-root .outside-blur{opacity:0;filter:blur(clamp(0px,calc(var(--window-width)*.015),25px));transition:opacity .2s}.cartemperature-root .container.temp-active .outside-blur,.cartemperature-root .container.fan-active .outside-blur{opacity:1}.cartemperature-root .temp-marker,.cartemperature-root .fan-marker{width:calc(var(--window-width)*.001);background:var(--temp-color);height:30%;transition:width .2s;position:absolute;top:50%;right:0}.cartemperature-root .fan-marker{left:0;right:auto}.cartemperature-root .temp-bg,.cartemperature-root .fan-bg{opacity:.2;transition:opacity .2s;-webkit-mask:linear-gradient(65deg,#000 0%,#000 70%,transparent 87%);mask:linear-gradient(65deg,#000 0%,#000 70%,transparent 87%);position:absolute!important}.cartemperature-root .fan-bg{transform:scaleX(-1)}.cartemperature-root .temp-active .temp-bg,.cartemperature-root .fan-active .fan-bg{opacity:.5}.cartemperature-root .temp-bg circle,.cartemperature-root .fan-bg circle{fill:var(--temp-color);transform-origin:50%;transform-box:fill-box}.cartemperature-root .container.temp-active .temp-marker,.cartemperature-root .container.fan-active .fan-marker{width:calc(var(--window-width)*.004)}.cartemperature-root .temp-marker.blur,.cartemperature-root .fan-marker.blur{width:calc(var(--window-width)*.003);filter:blur(clamp(0px,calc(var(--window-width)*.015),25px))}.cartemperature-root .container.temp-active .temp-marker.blur,.cartemperature-root .container.fan-active .fan-marker.blur{width:calc(var(--window-width)*.01)}.cartemperature-root .settings{z-index:2;align-items:center;gap:calc(var(--window-width)*.02);flex-flow:row;flex:1;display:flex;position:relative}.cartemperature-root .settings.left{padding:17.5% 2.5% 15% 19%}.cartemperature-root .settings.right{padding:17.5% 19% 15% 2.5%}.cartemperature-root .slider-wrapper{gap:calc(var(--window-width)*.014);width:70%;padding:calc(var(--window-width)*.01);flex-flow:column;display:flex;overflow:hidden}.cartemperature-root .temp-slider,.cartemperature-root .fan-slider{width:100%;height:4px;margin-bottom:calc(var(--window-width)*.0025);border-radius:1000px;justify-content:center;align-items:center;display:flex;position:relative}.cartemperature-root .temp-slider{background:linear-gradient(90deg,#0052b1 0%,#6b6b6b 50%,#b23418 100%)}.cartemperature-root .slider-mask-wrapper{justify-content:center;align-items:center;width:0;height:100%;display:flex}.cartemperature-root .slider-mask{background:linear-gradient(90deg,#000 0%,#000 40%,transparent 50%,#000 60%,#000 100%);width:200%;height:100%;transition:transform .4s;position:absolute;transform:scaleX(1)}.cartemperature-root .container.temp-active .slider-mask{transform:scaleX(4)}.cartemperature-root input[type=range]{z-index:1;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;background:0 0;width:100%;position:absolute}.cartemperature-root input[type=range]:focus{outline:none}.cartemperature-root input[type=range]::-webkit-slider-runnable-track{background-color:transparent;border:1px solid #282828;border-radius:1000px;height:4px}.cartemperature-root input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:50%}.cartemperature-root .temp::-webkit-slider-thumb{margin-top:calc(var(--window-width)*-.0032);height:calc(var(--window-width)*.008);width:calc(var(--window-width)*.008);background-color:var(--temp-color)}.cartemperature-root .fan::-webkit-slider-thumb{margin-top:calc(var(--window-width)*-.0024);height:calc(var(--window-width)*.006);width:calc(var(--window-width)*.006);outline:calc(var(--window-width)*.002)solid rgba(255,255,255,var(--fan-value));outline-offset:var(--test);background-color:#fff;transition:outline-offset .2s}.cartemperature-root .car{z-index:3;width:10%;height:100%;transform-style:preserve-3d;perspective:800px;justify-content:center;align-items:center;display:flex;position:relative}.cartemperature-root .car-bg{z-index:1;width:100%;height:100%;position:absolute;overflow:hidden}.cartemperature-root .car-gradient{fill:var(--temp-color);filter:blur(calc(var(--window-width)*.02));opacity:var(--fan-value);clip-path:url(#clip);transition:filter .2s}.cartemperature-root .container.temp-active .car-gradient{filter:blur(calc(var(--window-width)*.03))}.cartemperature-root .car-bg>svg{z-index:2;width:100%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.cartemperature-root .car>svg{opacity:.75;z-index:2;width:100%;transition:opacity .4s;position:absolute}.cartemperature-root .container.temp-active .car svg._1{opacity:1}.cartemperature-root .car>svg.blur{filter:blur(8px)saturate();transition:filter .4s}.cartemperature-root .container.temp-active .car>svg.blur{filter:blur(12px)saturate(1.5)}.cartemperature-root .car>svg path{stroke:var(--temp-color);stroke-width:1px}.cartemperature-root .car>svg.blur path{stroke-width:2px;transition:stroke-width .2s}.cartemperature-root .container.temp-active .car>svg.blur path{stroke-width:6px}.cartemperature-root .settings.data>div:first-child,.cartemperature-root .settings.data>div:nth-child(2){place-self:center}.cartemperature-root .settings.data>div:nth-child(3){grid-area:span 1/span 2/span 1/span 2;place-self:center stretch}.cartemperature-root .temp-number,.cartemperature-root .fan-setting{z-index:1;min-width:calc(var(--window-width)*.07);max-width:calc(var(--window-width)*.07);justify-content:start;display:flex;position:relative}.cartemperature-root .fan-setting{justify-content:end}.cartemperature-root .temp-number h3:nth-child(2){margin-bottom:calc(var(--window-width)*.0075)}.cartemperature-root .temp-number h3:nth-child(3){opacity:.4;margin:0 0 calc(var(--window-width)*.028)calc(var(--window-width)*-.0025)}.cartemperature-root .temp-wrapper,.cartemperature-root .fan-wrapper{min-width:calc(var(--window-width)*.1);align-items:end;justify-content:center;-webkit-align-items:flex-end;margin:-2% -10%;padding:2% 10%;transition:box-shadow .2s;display:flex;position:relative}.cartemperature-root .temp-wrapper:before,.cartemperature-root .fan-wrapper:before{content:"";filter:blur(calc(var(--window-width)*.02));background:#000;position:absolute;top:0;bottom:0;left:0;right:0}.cartemperature-root .container.temp-active .temp-wrapper:before,.cartemperature-root .container.fan-active .fan-wrapper:before{background:#111}.cartemperature-root .temp-wrapper *,.cartemperature-root .fan-wrapper *{position:relative}.cartemperature-root .fan-setting svg{height:calc(var(--window-width)*.02);margin-bottom:calc(var(--window-width)*.0075);opacity:0;transition:opacity .2s;position:absolute;top:0}.cartemperature-root .nav{z-index:2;width:auto;height:calc(var(--window-width)*.03);justify-content:center;align-items:center;gap:calc(var(--window-width)*.04);padding:0 calc(var(--window-width)*.03)calc(var(--window-width)*.004)calc(var(--window-width)*.03);border-radius:calc(var(--window-width)*.04)calc(var(--window-width)*.04)0 0;perspective:2000px;display:flex;position:absolute;bottom:25.2%;left:50%;transform:translate(-50%)}