html,body{margin:0;padding:0;height:100%;width:100%;font-family:Arial,sans-serif;background-color:#252525;color:#ccc;overflow:hidden}#mainContent{position:relative;width:100vw;height:100vh;overflow:hidden}.canvasControlsTop{position:absolute;top:0;left:0;right:0;z-index:10;display:flex;justify-content:center;align-items:center;gap:10px;padding:10px;background-color:#1e1e1ecc}#canvasWrapper,#canvasContainer{position:absolute;top:0;left:0;right:0;bottom:0}#canvasContainer{width:100%;height:100%;background-color:#000}#canvasContainer canvas{display:block;border:none}#controlBar{position:absolute;top:60px;right:0;z-index:10;width:250px;max-height:calc(100vh - 90px);overflow-y:auto;background-color:#323232e6;padding:10px;border-radius:5px 0 0 5px;display:flex;flex-direction:column;gap:10px}#controlBar button{background-color:#444;border:none;color:#fff;padding:10px;cursor:pointer;width:100%;border-radius:3px;transition:background-color .3s}#controlBar button:hover{background-color:#555}#controlBar .bold{font-weight:700}.textButtonContainer{display:flex;width:100%}.textButtonContainer .labeledInput{flex:1}.splitInputContainer{display:flex;width:100%;gap:10px}.splitInputContainer .splitInputControl{flex:1;border-radius:3px;gap:10px}.splitInputContainer .splitInputControl input,.splitInputContainer .splitInputControl label{flex:1;width:90%;border-radius:3px}.hSeparator{width:100%;height:3px;border-top:1px solid rgba(255,255,255,.2);margin:5px 0}#footer{position:absolute;bottom:0;left:0;width:100%;z-index:10}#statusBar{height:30px;background-color:#1e1e1ee6;color:#fff;display:flex;justify-content:space-between;padding:0 10px;font-size:14px;line-height:30px}.statusBarItem{display:inline-block;padding:0 10px;text-align:center;flex-grow:1;border:solid black;border-width:1px}#statusText1{text-align:right}#statusText2,#statusText3,#statusText4{text-align:center}#statusText5{text-align:left}
