:root {
    --libo-phone-min-height: calc(100vw * 667 / 375);
}

html.libo-phone-portrait,
html.libo-phone-portrait body {
    min-height: var(--libo-phone-min-height);
    overflow-x: hidden !important;
    overflow-y: auto !important;
}

html.libo-phone-portrait #app,
html.libo-phone-portrait .app-root,
html.libo-phone-portrait .main-container {
    min-height: var(--libo-phone-min-height);
}

html.libo-phone-landscape,
html.libo-phone-landscape body {
    width: 100%;
    height: 100%;
    min-height: 0;
    overflow: hidden !important;
    background: #000 !important;
}

html.libo-phone-landscape body > * {
    visibility: hidden !important;
}

html.libo-phone-landscape body::before {
    position: fixed;
    z-index: 2147483647;
    top: 0;
    left: 50%;
    width: calc(100vh * 16 / 9);
    height: 100vh;
    content: "";
    visibility: visible;
    transform: translateX(-50%);
    background-image:
        linear-gradient(0deg, #3e300f, #807136 30%, #c2b25d 50%, #807136 80%, #3e300f),
        linear-gradient(0deg, #ddb137, #000);
    background-blend-mode: normal, normal;
}
