body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{border:0;margin:0;padding:0;vertical-align:initial}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:"";content:none}table{border-collapse:collapse;border-spacing:0}html{box-sizing:border-box}*,:after,:before{box-sizing:inherit}:root{--handle-x:0px;--handle-y:0px;--handle-deg:0deg;--temp-color:red;--cover-deg:0rad;--pause-icon-x:0px;--pause-icon-y:0px}@font-face{font-family:Inter UI Regular;src:url(/smart-home-app/build/static/media/Inter-UI-Regular.b46308b5cde70c5ee650.ttf)}html{color:#3b3460;font-family:Inter UI Regular,sans-serif;font-size:62.5%}body{align-items:center;background-color:#e3dfec;display:flex;height:100vh;justify-content:center}.app{animation:fadeIn 1s cubic-bezier(0,.24,.34,1);background-color:#fff;border-radius:3rem;box-shadow:0 1.5rem 3.5rem #0003;display:grid;grid-template-columns:10rem 1fr 25rem;height:70h;max-width:100rem;overflow:hidden;padding:3rem 0;width:90vw}@keyframes fadeIn{0%{opacity:0;transform:scale(.9)}20%{transform:scale(1)}to{opacity:1}}.menu{border-right:.2rem solid #f6f5fa;flex-direction:column;justify-items:center}.menu,.menu-item{align-items:center;display:flex}.menu-item{color:#b8b4cc;font-size:2rem;height:4.5rem;justify-content:center;margin-top:1rem;width:4.5rem}.menu-item__section{margin-top:5rem}.menu-item--active{background-color:#fff;border-radius:1.5rem;box-shadow:0 .5rem 1.5rem #0003;color:#ff9066}.menu__avatar{border-radius:1.5rem;height:4.5rem;margin-top:auto;overflow:hidden;width:4.5rem}.menu__avatar img{height:auto;object-fit:cover;width:100%}h2{color:#a6a2ba;font-size:1rem;font-weight:700;letter-spacing:1px;text-transform:uppercase}.btn{-webkit-appearance:none;appearance:none;background-color:#fff;border:none;border-radius:1.5rem;box-shadow:0 .4rem .6rem #0000001a;flex-shrink:0;height:4.5rem;width:4.5rem}.btn svg{color:#fff;font-size:1.5rem}.btn--1{background-color:#6f32ff}.btn--2{background-color:#ff9066}.btn--3{background-color:#ffcd41}.btn--plus{background-color:#0000;border:1px dashed #b8b4cc;box-shadow:none}.btn--plus svg{color:#b8b4cc!important}.btn--grey{background-color:#f2f1fa;box-shadow:none;color:#b1abcd;font-size:1.8rem;height:4rem;width:4rem}.main{display:grid;grid-template-columns:1fr;grid-template-rows:auto 1fr auto;padding:0 4rem}.main .header{grid-gap:1rem;align-items:center;display:grid;grid-row:1;grid-template-columns:1.5rem auto 1fr auto auto;grid-template-rows:2rem 2rem;padding:5rem 0}.main .header__back{color:#b4b1c8;font-size:1.5rem;grid-column:1;grid-row:1}.main .header__subtitle{color:#b4b1c8;font-size:2rem;font-weight:700;grid-column:2;grid-row:1}.main .header__title{font-size:2rem;grid-column:2;grid-row:2}.main .header__humidity{grid-column:4;grid-row:2}.main .header__ac{grid-column:5;grid-row:2}.main .header__more{display:flex;grid-column:5;grid-row:1;justify-content:flex-end}.main .header__control{align-items:center;display:flex;font-size:1.8rem;margin-left:1rem}.main .header__control svg{color:#b8b4cc;font-size:1.5rem;margin-right:1rem}.main .header__control svg.fa-toggle-on{font-size:2.3rem}.main .control{align-items:center;display:flex;grid-row:2;justify-content:space-around}.main .control .gauge{align-items:center;display:flex;justify-content:center;margin:0 4rem;position:relative}.main .control .gauge .cover-arc{height:200%;position:relative;transform:rotate(0rad);transform:rotate(calc(var(--cover-deg)));transform-origin:left top;transition:transform .25s ease-in-out;width:100%}.main .control .gauge .cover-arc path,.main .control .gauge .cover-arc rect{display:block;left:0;position:absolute;top:0}.main .control .gauge .cover-arc rect{fill:#0000}.main .control .gauge .cover-arc path{fill:#fff}@keyframes rotate{0%{transform:rotate(0deg)}to{transform:rotate(90deg)}}.main .control .gauge #pause-icon{color:#a6a2ba;position:absolute;transform:translate(0);transform:translate(var(--pause-icon-x),var(--pause-icon-y))}.main .control .gauge__handle{background-color:#fff;border-radius:55% 45% 100% 0/100% 45% 55% 1%;box-shadow:0 .1rem .3rem #0003;height:2rem;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%) rotate(calc(-135deg + var(--handle-angle)));transform:translate(calc(-50% + var(--handle-x)),calc(-50% + var(--handle-y))) rotate(calc(-135deg + var(--handle-angle)));transform-origin:center center;transition:all .25s ease-in-out;width:2rem;z-index:100}.main .control .gauge__handle__circle-wrapper{height:100%;position:relative;width:100%}.main .control .gauge__handle__circle{background-color:red;background-color:var(--temp-color);border-radius:50%;height:.4rem;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:.4rem}.main .control .gauge__tick{stroke:#dcd9e7}.main .control .gauge__tick__text{fill:#a6a2ba}.main .control .gauge__tick__text--1{text-anchor:end;dominant-baseline:middle}.main .control .gauge__tick__text--2{text-anchor:middle}.main .control .gauge__tick__text--3{text-anchor:start;dominant-baseline:middle}.main .control .gauge__tick__text--4{text-anchor:middle}.main .control .gauge svg{overflow:visible}.main .control .gauge__circle{align-items:center;background-color:#fff;border-radius:50%;box-shadow:0 .4rem .6rem #0000001a,0 4rem 5rem #00000012;display:flex;justify-content:center;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);transform-origin:center center}.main .control .gauge__circle__indicator{align-items:center;display:flex;flex-direction:column}.main .control .gauge__circle__label{color:#a29fb0;line-height:2em}.main .control .gauge__circle__temp{font-size:2.5rem}.main .control .gauge__circle__temp span{font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.main .control .gauge__circle__temp sup{display:inline-block;font-size:1.2rem;font-weight:400;transform:translateY(4px);vertical-align:top}.main .history{grid-row:3;height:200px;margin-top:3rem}.main .history h2{margin-bottom:2rem}.main .history .bar-chart{grid-gap:.5rem;align-items:flex-end;display:grid;grid-auto-columns:1fr;grid-auto-flow:column}.main .history .bar-chart__bar{animation-duration:.15s;animation-fill-mode:forwards;animation-name:animatebar;animation-timing-function:ease-out;background-color:#f1f0f5;border-radius:.5rem .5rem 0 0;transform:scaleY(0);transform-origin:bottom}@keyframes animatebar{0%{transform:scaleY(0)}to{transform:scaleY(1)}}.main .history .bar-chart__bar__label{animation-duration:.15s;animation-fill-mode:forwards;animation-name:animate-label;animation-timing-function:ease-out;color:#9c98ae;grid-row:2;opacity:0;text-align:center}@keyframes animate-label{to{opacity:1}}.sidebar{background-color:#f6f5fa;display:flex;flex-direction:column;margin:-3rem 0;padding:8rem 3rem}.sidebar h2{margin-bottom:2rem}.sidebar h2:not(:first-of-type){margin-top:3rem}.sidebar .shortcut{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:auto 1fr;grid-template-rows:auto auto;height:auto}.sidebar .shortcut:not(:first-of-type){margin-top:2rem}.sidebar .shortcut .btn{grid-column:1/1;grid-row:1/span 2}.sidebar .shortcut .title{align-items:flex-end;display:flex}.sidebar .shortcut .text{color:#45c97f}.sidebar .devices{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:1fr 1fr 1fr;grid-template-rows:auto auto}.sidebar .devices svg{color:#6f32ff}
/*# sourceMappingURL=main.060832be.css.map*/