.desktop .root {
    padding: 20rem;
    flex-direction: row;
    justify-content: center;
    gap: 10rem;

    --viewer: 900rem;
    --editor: 400rem;
}

.desktop #main {
    max-width: var(--viewer);
}

.desktop #main:has(~ #editorui:not(.hide)) {
    width: calc(100% - var(--editor) - 10rem);
    max-width: var(--viewer);
}

.desktop #viewercontainer {
    height: calc(100% - 280rem);
}

.desktop #switcher {
    height: 280rem;
}

.desktop #editorui {
    /* Remove from flex */
    position: absolute;
    flex: 0 0 var(--editor);
}

.desktop #editorui:not(.hide) {
    /* Include in flex */
    position: relative;
}

.desktop #cancel {
    top: 20rem;
    right: 20rem;
}

.desktop .editortools {
    padding: 10rem 0rem;
}

.desktop .save {
    flex: 0 0 66rem;
    padding-top: 10rem;
}