html,
body {
    /* overflow: hidden;
    scroll-behavior: auto; */
    margin: 0;
    padding: 0;
    transform-origin: top left;
    display: grid;
    place-content: stretch;
}

html {
    width: 100vw;
    height: 100vh;

    font-size: 16px;
    /* defining our REM unit */
    position: fixed;
    inset: 0;
}

body {
    position: fixed;
    inset: 0;
    height: 100%;
    width: 100%;
}

platform-shell {
    /* rotate: 90deg; */
    zoom: 1;
}



@media (orientation: portrait) {
    html {
        rotate: 90deg;
        translate: 100vw 0;
        width: 100vh;
        height: 100vw;
    }
}

@media ((orientation: landscape) and (max-width: 1000px)) or ((orientation: portrait) and (max-height: 1000px)) {

    body {
        scale: 0.5;
        width: 200%;
        height: 200%;
    }
}