*,body,html{padding:0;margin:0}body,html{font-size:16px;background-color:#000;color:#fff;font-family:-apple-system,BlinkMacSystemFont,PingFang SC,Helvetica Neue,STHeiti,Microsoft Yahei,Tahoma,Simsun,sans-serif;scrollbar-width:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-user-select:none;-moz-user-select:none;user-select:none;overflow:hidden;overscroll-behavior:none}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}#root{position:fixed;left:0;right:0;top:0;bottom:0;overflow:hidden}.app{display:flex;height:100%}.app .main{position:relative;width:100%}.app .side{position:relative}.chat-container{display:flex;flex-direction:column;width:100%;height:100%;background-color:#1c2024;color:#fff;position:relative;border-left:solid 1px #4f4f4f}.chat-header{height:40px;display:flex;justify-content:center;align-items:center;background-color:#000;font-size:1rem}.chat-header svg{scale:.6}.chat-messages{display:flex;justify-content:flex-start;align-items:center;flex-direction:column;gap:.5rem;flex:1;overflow-y:auto;padding:1rem 0rem;margin-bottom:1rem}.chat-messages .tip{font-size:.8rem;color:#878787}.chat-messages .note{align-self:flex-start;margin-left:10%;font-size:.9rem;background-color:#000;padding:.3rem .6rem}.chat-messages .message{font-size:.9rem;padding:.3rem .6rem;max-width:80%}.chat-messages .message.user{align-self:flex-end;margin-right:10%;background-color:#000}.chat-messages .message.assistant{align-self:flex-start;margin-left:10%}.chat-footer{display:flex;justify-content:center;align-items:center;flex-direction:column;width:100%;gap:1rem;padding-bottom:2rem;background-color:#1c2024}.chat-footer .quick-buttons{display:flex;justify-content:space-between;width:80%;gap:4px}.chat-footer .quick-buttons .quick-button{display:flex;justify-content:center;align-items:center;font-size:.9rem;background-color:#2b2e31;border:1px solid rgba(97,97,97,.59);width:23%;padding:4px 0}.chat-footer .quick-buttons .quick-button svg{scale:.6}.chat-footer .input-container{display:flex;background-color:#2b2e31;padding:5px 10px;width:80%}.chat-footer .input-container input{flex:1;background:none;border:none;color:#fff;padding:.3rem;outline:none;font-size:.9rem}.chat-footer .input-container input::placeholder{color:#888}.chat-footer .input-container .input-buttons{display:flex;align-items:center}.chat-footer .input-container .input-buttons svg{scale:.9}.main{display:flex;align-items:center;flex-direction:column;position:absolute;top:0;width:100%;height:100%;text-align:center}.main .home-panel-group{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;height:100%;width:22%;position:absolute;right:80px}.main .home-panel-group .home-panel{display:flex;width:100%;flex-direction:column;gap:20px}.main .contrl-panel-group{display:flex;flex-direction:column;justify-content:center;align-items:center;height:100%;position:absolute;right:80px}.main .camera-panel-group{display:flex;flex-direction:column;justify-content:center;align-items:center;width:460px;height:100%;position:absolute;right:0}.main .floor-panel-group{display:flex;justify-content:center;align-items:center;height:100%;position:absolute;left:80px}.main .tab-panel-group{display:flex;width:460px;position:absolute;bottom:3rem;left:80px}.main .info-panel-group{pointer-events:none;position:absolute;top:0}.main.mobile .floor-panel-group{width:100%;height:unset;position:absolute;top:1rem;left:0}.main.mobile .home-panel-group{width:80%;height:unset;right:unset;gap:10px;bottom:2rem}.main.mobile .home-panel-group .home-panel{height:150px;flex-direction:row;gap:10px}.main.mobile .home-panel-group .home-panel .outline{border:1px solid rgba(97,97,97,.59);border-radius:2px;display:flex;justify-content:center}.main.mobile .home-panel-group .home-panel>.item{flex:1;min-width:0}.main.mobile .contrl-panel-group{height:unset;right:unset;width:80%;bottom:2rem}.main.mobile .tab-panel-group{width:80%;left:unset;margin-left:unset;bottom:2rem}.main.mobile .camera-panel-group{width:100%;height:200px;bottom:7.5rem}.webgl-wrapper{overflow-clip-margin:content-box;overflow:clip;contain:strict;width:100%;height:100%}.webgl-wrapper canvas{display:block;outline:none;pointer-events:auto}.floor-selector{z-index:2;display:flex;flex-direction:column;justify-content:center}.floor-selector .floor-button{width:60px;height:100px;display:flex;justify-content:center;align-items:center;cursor:pointer;position:relative;color:#bdbdbd;background-size:100px 100px;background-position:center}.floor-selector .floor-button .text{transition:all .3s ease;font-size:1.2rem;font-weight:500}.floor-selector .floor-button .text:hover{scale:1.2}.floor-selector .floor-button.active .text{scale:1.3;color:#ffe74a}.floor-selector .floor-button.active:before{content:"";position:absolute;left:-3px;width:2px;height:35px;background-color:#ffe74a}.mobile .floor-selector{flex-direction:row-reverse;gap:.5rem}.mobile .floor-selector .floor-button{width:50px;height:50px}.mobile .floor-selector .floor-button .text{font-size:1rem}.mobile .floor-selector .floor-button.active:before{bottom:3px;left:12.5px;width:25px;height:2px}.weather-info{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:clamp(.5rem,1vw,2rem)}.weather-info .weather-icon,.weather-info .weather-content{min-width:0;display:flex;justify-content:center;align-items:center}.weather-info .weather-icon{position:relative;width:clamp(5rem,6vw,10rem);height:clamp(5rem,6vw,10rem)}.weather-info .weather-content{display:flex;flex-direction:row;align-items:flex-start;justify-content:center}.weather-info .weather-content .temperature{display:flex;flex-direction:column;align-items:flex-end}.weather-info .weather-content .temperature .value{font-size:clamp(2rem,5vw,5rem);color:#ffe74a}.weather-info .weather-content .unit{font-size:clamp(1rem,2vw,1.5rem);color:#ffe74a;position:relative;top:clamp(.5rem,1vw,1rem)}.weather-info .weather-content .location{font-size:clamp(.7rem,1vw,1rem);color:#fff}.mobile .weather-info{flex-direction:column;align-items:center;gap:0}.mobile .weather-info .weather-icon{width:5rem;height:4rem}.mobile .weather-info .weather-content{flex-direction:column;align-items:center;justify-content:center}.mobile .weather-info .weather-content .temperature{flex-direction:row;align-items:center;justify-content:center}.mobile .weather-info .weather-content .unit{top:0}.live-video{position:relative;width:100%;aspect-ratio:1.8}.live-video.home{aspect-ratio:1.65}.live-video .live-header{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:5px 12px;background-color:#7b7b7b9b;border-radius:4px 4px 0 0}.live-video .live-header .label{font-size:.8rem;font-weight:500}.live-video .live-tag{color:#fff;font-size:.8rem;font-weight:500;display:flex;align-items:center}.live-video .live-tag:before{content:"";display:inline-block;width:6px;height:6px;background-color:#ffe74a;border-radius:50%;margin-right:4px}.live-video .signal-icon{display:flex;align-items:flex-end;height:12px}.live-video .signal-icon span{display:inline-block;width:3px;background-color:#ffe74a;margin-left:2px}.live-video .signal-icon span:nth-child(1){height:3px}.live-video .signal-icon span:nth-child(2){height:6px}.live-video .signal-icon span:nth-child(3){height:9px}.live-video .signal-icon span:nth-child(4){height:12px}.live-video .live-image{width:100%;height:100%;background-size:cover;background-position:center;border-radius:4px}.live-video .live-mask{position:absolute;top:0;left:0;right:0;bottom:0;border-radius:4px;transition:all .3s ease}.live-video .fullscreen-icon{position:absolute;bottom:10px;right:10px;width:12px;height:12px;display:flex;align-items:center;justify-content:center;z-index:2}.live-video.active .live-mask{box-shadow:inset 0 0 0 2px #ff3,inset 0 0 20px #ff09,0 0 20px #ff09}.mobile .live-video{height:100%}.mobile .live-video .live-header{border-radius:2px 2px 0 0}.mobile .live-video .live-mask,.mobile .live-video .live-image{border-radius:2px}.mobile .live-video.home{aspect-ratio:auto}.scene-selector{width:100%;display:flex;flex-direction:column;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.scene-selector .scene-item{background-color:#ffffff0d;padding:1rem;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;height:75px}.scene-selector .scene-item .scene-icon{width:2rem;height:2rem;margin-right:1rem;color:#c9c9c9}.scene-selector .scene-item .scene-name{font-size:1rem;color:#c9c9c9}.scene-selector .scene-item:hover{background-color:#ffffff1a}.scene-selector .scene-item.active{background-color:#ffe74a}.scene-selector .scene-item.active .scene-icon{color:#000}.scene-selector .scene-item.active .scene-name{color:#2b3b3b;font-weight:500}.mobile .scene-selector{flex-direction:row;justify-content:center;border:1px solid rgba(97,97,97,.59)}.mobile .scene-selector .scene-item{flex:1;height:70px;flex-direction:column;padding:.5rem;gap:.5rem}.mobile .scene-selector .scene-item .scene-icon{margin-right:0;width:1.5rem;height:1.5rem}.mobile .scene-selector .scene-item .scene-name{font-size:.7rem}.tab-selector{display:flex;flex-wrap:wrap;justify-content:center;width:100%;gap:.8rem}.tab-item{flex:1;height:4.5rem;background:#61616133;border:1px solid rgba(97,97,97,.6);display:flex;flex-direction:column;justify-content:center;align-items:center;cursor:pointer;position:relative;border-radius:4px}.tab-item .tab-icon{width:2rem;height:2rem;color:#fff;margin-bottom:2px;transition:all .3s ease}.tab-item .tab-name{font-size:1rem;color:#fff}.tab-item:hover,.tab-item.active{background:#2b2b2b94}.tab-item.active .tab-icon,.tab-item.active .tab-name{color:#ffe74a}.mobile .tab-selector{gap:0;border:1px solid rgba(97,97,97,.6)}.mobile .tab-item{border:unset;border-radius:unset;height:70px;gap:.5rem}.mobile .tab-item .tab-icon{width:1.5rem;height:1.5rem}.mobile .tab-item .tab-name{font-size:.8rem}.base-panel{position:relative;display:flex;align-items:center;margin-bottom:1rem;width:clamp(56px,6.35vw,75px);height:clamp(45px,5vw,60px);overflow:hidden;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);pointer-events:auto;background-color:#434242cc}.base-panel .base-indicator{width:2px;height:100%;background-color:#fff}.base-panel .base-info{width:100%}.base-panel .base-info .base-label{color:#fff;font-size:clamp(.7rem,1vw,.9rem)}.base-panel .base-info .base-value{font-size:clamp(.7rem,1vw,.9rem);color:gray}.base-panel.active{background-color:#ffffff1a}.base-panel.active .base-indicator{background-color:#ffe44d}.base-panel.active .base-info .base-value{color:#ffe44d}.controler-container{display:flex;flex-direction:column;justify-content:center;align-items:center;color:#fff;width:100px;gap:20px}.controler-container .controler-group{display:flex;flex-direction:column;justify-content:center;align-items:center;width:100px;gap:20px}.mobile .controler-container{width:100%;gap:10px}.mobile .controler-container .controler-group{width:100%;height:70px;flex-direction:row;justify-content:space-between;gap:10px}.number-stepper{display:flex;flex-direction:column;align-items:center;justify-content:space-evenly;background-color:#61616199;width:100px}.number-stepper__operate{display:flex;justify-content:center;align-items:center;cursor:pointer;width:100%;height:65px}.number-stepper__operate svg{transition:transform .3s ease;transform:scale(.5);will-change:transform}.number-stepper__operate:hover svg{transform:scale(.6)}.number-stepper__value{display:flex;justify-content:center;align-items:center;padding:10px;font-size:25px;color:#ffeb3b}.number-stepper__value .small{font-size:15px}.mobile .number-stepper{flex-direction:row-reverse;width:50%;height:70px}.mobile .number-stepper__operate{height:100%}.mobile .number-stepper__value{width:20%}.level-selector{display:flex;flex-direction:column;align-items:center;justify-content:center;background-color:#4449;cursor:pointer;position:relative;width:100px;height:65px;color:#ffe74a;font-size:.9rem}.level-selector .label{display:flex;justify-content:center;align-items:center}.level-selector .icon{scale:.7;padding:5px;display:flex;align-items:center;justify-content:center}.level-selector .icon.rotating-0{animation:rotate 5s linear infinite}.level-selector .icon.rotating-1{animation:rotate 2s linear infinite}.level-selector .icon.rotating-2{animation:rotate 1s linear infinite}.level-selector .level-group{width:100%;display:flex;justify-content:space-between;position:absolute;bottom:0}.level-selector .level-group .level{width:33%;display:flex;align-items:center;justify-content:center;cursor:pointer}.level-selector .level-group .level .line{width:90%;height:3px;background-color:#fff}.level-selector .level-group .level:hover .line,.level-selector .level-group .level.active .line{background-color:#ffe74a}.mobile .level-selector{width:25%;height:70px}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.button{display:flex;align-items:center;justify-content:center;width:100%;height:65px;background-color:#61616199;color:#fff;font-size:1rem}.button .icon{display:flex;align-items:center;justify-content:center;transition:transform .3s ease;transform:scale(.6);will-change:transform}.button:hover .icon{transform:scale(.6)}.button.back{color:#000;background-color:#ffe74a}.button.back .icon{transform:scale(.7)}.button.back:hover .icon{transform:scale(.84)}.button.active{color:#ffe74a;background-color:#4449}.button.active.cancel{color:#000;background-color:#ffe74a}.mobile .button{width:25%;height:70px;flex-shrink:0}.mode-selector{width:100%;background-color:#61616199}.mode-selector .mode-item{display:flex;align-items:center;justify-content:center;height:65px}.mode-selector .mode-item svg{transition:transform .3s ease;transform:scale(.7);will-change:transform}.mode-selector .mode-item:hover svg{transform:scale(.72)}.mode-selector .mode-item.active{color:#ffe74a;background-color:#4449}.mobile .mode-selector{display:flex;width:100%;background-color:#4449;border:1px solid rgba(97,97,97,.6)}.mobile .mode-selector .mode-item{width:100%;height:70px}.mobile .mode-selector .mode-item.active{background-color:unset}.mobile .mode-selector .mode-item.active:before{content:"";position:absolute;bottom:0;width:25%;height:3px;background-color:#ffe74a}.mark-scale{display:flex;justify-content:center;padding:10px;gap:15px;width:100%;height:380px;background-color:#61616199}.mark-scale:hover{cursor:pointer}.mark-scale .mark-group{display:flex;flex-direction:column;justify-content:space-between}.mark-scale .mark-group .mark{font-size:1rem}.mark-scale .scale-group{display:flex;flex-direction:column;justify-content:space-between}.mark-scale .scale-group .scale{width:28px;height:4px;background-color:#fff;border-radius:2px}.mark-scale .scale-group .scale.active{background-color:#ffe74a}.mobile .mark-scale{flex-direction:column;height:unset;height:70px}.mobile .mark-scale .mark-group{flex-direction:row-reverse;height:unset}.mobile .mark-scale .scale-group{flex-direction:row-reverse}.mobile .mark-scale .scale-group .scale{width:3px;height:20px}.camera-container{z-index:10;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;width:100%;height:100%;padding:50px 40px;background-color:#242424f0;border-left:solid 1px #4f4f4f}.camera-container .camera-group{display:flex;justify-content:flex-start;align-items:center;flex-direction:column;gap:20px;width:100%;flex:1;overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none}.camera-container .camera-group::-webkit-scrollbar{display:none}.camera-container .camera-item{width:100%;overflow:visible;cursor:pointer}.mobile .camera-container{width:100%;padding:15px 20px;gap:10px}.mobile .camera-container .camera-group{width:100%;height:100%;gap:10px;flex:initial;flex-direction:row;overflow-x:auto}.mobile .camera-container .camera-group .camera-item{min-width:200px;height:100%}#preloader{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:40px;background-color:#000}#version{position:fixed;top:0;left:10px;font-size:10px}.header{z-index:1;display:flex;justify-content:space-between;align-items:center;position:absolute;top:1rem;width:100%;height:50px;padding:0 5rem}.header .back{display:flex;align-items:center}.header .back svg{transition:scale .3s ease;scale:.6}.header .back svg:hover{scale:.72}.header .user-info{display:flex;align-items:center;gap:40px}.header .user-info .icon{scale:.8}.header .user-info .time{font-size:1.6rem;color:#fff}.header .settings-icon{width:1.2rem;height:1.2rem}.header.mobile{padding:0 2rem}.header.mobile .user-info .icon{scale:.6}
