.controllableViewer{--headerHeight: 30px;width:100%;height:100%;position:relative;display:flex;flex-direction:column;color:#fff}.controllableViewerHeader{position:relative;width:100%;height:var(--headerHeight);min-height:var(--headerHeight);background-color:#363636;display:flex;flex-direction:row;align-items:center;text-indent:5px}.controllableViewerContent{position:relative;height:100%;width:100%;max-height:calc(100% - var(--headerHeight));overflow:hidden;display:flex}.draggablePanel{position:absolute;border-radius:10px;background-color:#363636;z-index:5;overflow:hidden}.draggablePanelHeader{display:flex;justify-content:space-between;align-items:center;background-color:#056ffa}.draggablePanelHeader>label{text-indent:10px;font-size:large;z-index:5;-webkit-user-select:none;user-select:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.draggablePanelHeader>div{margin-right:10px;margin-top:2px;position:sticky;float:right;width:0;height:0;border-top:8px solid white;border-left:5px solid transparent;border-right:5px solid transparent;transition:transform .2s ease-in-out}.draggablePanelContent{margin-left:10px;margin-right:10px;transition:max-height .25s ease-in-out,margin-top .25s ease-in-out,margin-bottom .25s ease-in-out}.viewerControls label{display:block}.viewerControls input{width:100%}.rollableControls{border-radius:50%;width:100%;aspect-ratio:1}