body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:#fff;background-color:#282c34;width:70vw;margin:auto;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}div{box-sizing:border-box;padding:0}button{margin:2px}:root{--interfacesBarWidthPx:100px;--canvasWidthVw:70vw;--canvasHeightVh:70vh}.fixedBoxStyle{text-align:center;background:#fff;border:1px solid #999;border-radius:10px;justify-content:center;align-items:center;width:100%;height:50px;display:flex;position:static}.fixedBoxStyle:hover{background:#e6e6e6}.interfacesBarStyle{height:100%;width:var(--interfacesBarWidthPx);border:1px solid #000;flex-direction:column;justify-content:space-evenly;align-items:center;display:flex}.interfaceTitleStyle{color:#000;margin-top:5px;font-size:15px;position:absolute;top:0%}.boxesContainer{height:100%;width:calc(var(--canvasWidthVw) - var(--interfacesBarWidthPx) * 2);border:1px solid #000;position:relative}.titleStyle{margin:20px 0 0 20px;font-size:40px}.canvasStyle{width:var(--canvasWidthVw);height:var(--canvasHeightVh);color:#000;background:#fff;display:flex;position:relative}.toolboxMenu{text-align:center;background:#c8c8c8;width:100px}.toolboxTitle{height:50px;font-size:20px}.toolboxContainer{flex-direction:column;justify-content:space-evenly;align-items:center;height:calc(100% - 68px);display:flex}.wideBox,.interfaceBox{text-align:center;background:#fff;border:1px solid #999;border-radius:10px;justify-content:center;align-items:center;width:100px;height:30px;display:flex}.tallBox{text-align:center;writing-mode:vertical-rl;text-orientation:mixed;background:#fff;border:1px solid #999;border-radius:10px;width:20px;height:80px}.interfaceBox{height:50px}.triangle{border-bottom:50px solid #555;border-left:25px solid #0000;border-right:25px solid #0000;width:0;height:0}.iconContainer{background:#fff;border:1px solid #999;border-radius:10px;flex-direction:column;align-items:center;display:flex}.absolute{position:absolute}.hoverMarker:hover{background:#e6e6e6}.switchIcon{width:50px;height:50px;top:0}.iconContainer{border:1px solid #999;border-radius:10px;flex-direction:column;align-items:center;display:flex}.topBarStyle{background:#dcf0fa;width:100%;height:90px;padding:0 20px;transition:all .2s ease-out;display:flex;position:absolute;overflow:hidden}.topBarLabel{background:#fff;border-radius:30px;align-items:center;margin:5px;display:flex}.topBarLabel:hover{background:azure}.topBarLabel:active{background:#00bfff}.actionBubbles{justify-content:space-evenly;align-items:center;width:calc(100% - 120px);display:flex}.actionBubble{background:#fff;border-radius:50px;align-items:center;height:80%;margin:5px;padding:10px;display:flex}.actionBubble:hover{background:azure}.actionBubble:active{background:#00bfff}.menuWindowContainer{background:#fff;border:1px solid #999;border-radius:20px;flex-direction:column;align-items:center;width:500px;height:400px;display:flex;position:absolute;left:calc(50% - 250px)}.closeButton{position:absolute;top:10px;right:10px}.closeButton:hover{background-color:#c8c8c8;border-radius:50%}.resizeHandle{position:absolute;bottom:0;right:0}.header{margin-top:10px;font-size:1.2em}