html,
body {
    width: 100%;
    height: 100%;
    min-height: 100vh;
    overflow-x: hidden;
}

@media (min-width: 1200px) {
    :root {
        --gx-ui-scale: 0.9;
    }

    html {
        overflow-x: hidden;
    }

    body {
        zoom: var(--gx-ui-scale);
        width: calc(100vw / var(--gx-ui-scale));
        max-width: calc(100vw / var(--gx-ui-scale));
        height: calc(100vh / var(--gx-ui-scale));
        min-height: calc(100vh / var(--gx-ui-scale)) !important;
        margin: 0 auto;
        overflow-x: hidden;
        box-sizing: border-box;
    }

    .sidebar {
        height: calc(100vh / var(--gx-ui-scale)) !important;
        min-height: calc(100vh / var(--gx-ui-scale)) !important;
    }

    main.flex-1,
    .page-shell {
        min-height: calc(100vh / var(--gx-ui-scale));
        box-sizing: border-box;
    }

    main.flex-1 {
        min-width: 0;
        max-width: 100%;
    }

    .page-shell,
    body > main,
    body > .main-shell,
    body > .workspace-shell {
        margin-left: auto;
        margin-right: auto;
    }
}