#drawCanvas{width:1500px;overflow-x:visible;position:relative;top:75px}.v-progress-linear{margin:0}.live-data{-webkit-transform-origin:center;transform-origin:center;-webkit-animation:flipAni 16s ease-in-out infinite;animation:flipAni 16s ease-in-out infinite}.canvas-scroll{overflow-x:auto;overflow-y:hidden}.sld-mqtt-status-card{gap:10px;width:min(390px,calc(100vw - 116px));min-height:52px;padding:9px 12px 9px 10px;border:1px solid transparent;border-radius:9px;line-height:1.4;position:fixed;bottom:48px;right:24px;z-index:5;-webkit-box-shadow:0 8px 24px rgba(4,17,47,.18);box-shadow:0 8px 24px rgba(4,17,47,.18);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.sld-mqtt-status-card,.sld-mqtt-status-card__icon-wrap{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.sld-mqtt-status-card__icon-wrap{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-flex:0;-ms-flex:0 0 30px;flex:0 0 30px;width:30px;height:30px;border-radius:50%}.sld-mqtt-status-card .sld-mqtt-status-card__icon{color:inherit!important}.sld-mqtt-status-card__copy{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;min-width:0}.sld-mqtt-status-card__title{font-size:12px;font-weight:700}.sld-mqtt-status-card__detail{margin-top:1px;font-size:11px;font-weight:500;opacity:.76}.sld-mqtt-status-card--light{color:#172b4d;background:hsla(0,0%,100%,.96);border-color:rgba(9,30,66,.16)}.sld-mqtt-status-card--dark{color:#f4f7ff;background:rgba(20,28,52,.96);border-color:rgba(184,198,229,.24)}.sld-mqtt-status-card--offline .sld-mqtt-status-card__icon-wrap{color:#ff6b61;background:rgba(255,82,82,.14)}.sld-mqtt-status-card--reconnecting .sld-mqtt-status-card__icon-wrap{color:#ffb74d;background:rgba(255,183,77,.14)}.sld-mqtt-status-card__icon--spin{-webkit-animation:sld-mqtt-status-spin 1.2s linear infinite;animation:sld-mqtt-status-spin 1.2s linear infinite}.sld-mqtt-status-fade-enter-active,.sld-mqtt-status-fade-leave-active{-webkit-transition:opacity .16s ease,-webkit-transform .16s ease;transition:opacity .16s ease,-webkit-transform .16s ease;transition:opacity .16s ease,transform .16s ease;transition:opacity .16s ease,transform .16s ease,-webkit-transform .16s ease}.sld-mqtt-status-fade-enter,.sld-mqtt-status-fade-leave-to{opacity:0;-webkit-transform:translateY(-5px);transform:translateY(-5px)}@-webkit-keyframes sld-mqtt-status-spin{to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes sld-mqtt-status-spin{to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@media (max-width:700px){.sld-mqtt-status-card{right:12px;width:calc(100vw - 96px)}}.live-container{width:50px;text-align:center}.rightside{float:right}div #ioTable,div #tdHover{right:8px;top:110px}div #tdHover{display:none;position:fixed;z-index:3}#hoverTable{font-family:Trebuchet MS,Arial,Helvetica,sans-serif;border-collapse:collapse;width:100%}#hoverTable #tableData{border:1px solid #34495e;padding:2px}#hoverTable #tableRow{text-align:center;background-color:var(--v-primary-base);color:var(--v-primaryText-base)}.rightData{right:8px}.leftData,.rightData{display:none;width:600px;position:fixed;top:110px;z-index:3}.leftData{left:8px}.col{max-width:120px;width:100px;min-width:100px;text-align:center;text-wrap:wrap;word-wrap:break-word;padding:6px;border:1px solid #34495e}.col-value{color:#668cf6}.col-no-data{color:#ff5252}.col-stale{color:#ffa726}.value-width-col{max-width:160px;width:100px;min-width:100px;text-align:center;text-wrap:wrap;word-wrap:break-word;padding:6px;border:1px solid #34495e}.legend{position:absolute;top:15px;right:35px;width:140px;color:var(--v-primaryText-base);border:1px solid var(--v-primaryText-base);padding:10px}.circle-green{background:#3cb371}.circle-green,.circle-red{display:inline-block;width:10px;height:10px;border-radius:50%}.circle-red{background:#ff5252}.circle-amber{background:#ffa726}.circle-amber,.circle-grey{display:inline-block;width:10px;height:10px;border-radius:50%}.circle-grey{background:#9e9e9e}@-webkit-keyframes flipAni{0%{-webkit-transform:rotateY(0deg);transform:rotateY(0deg)}50%{-webkit-transform:rotateY(180deg);transform:rotateY(180deg)}to{-webkit-transform:rotateY(1turn);transform:rotateY(1turn)}}@keyframes flipAni{0%{-webkit-transform:rotateY(0deg);transform:rotateY(0deg)}50%{-webkit-transform:rotateY(180deg);transform:rotateY(180deg)}to{-webkit-transform:rotateY(1turn);transform:rotateY(1turn)}}