/* ===== calibration-only fixes ===== */

*,
*::before,
*::after {
    box-sizing: border-box;
}

img {
    display: block;
    max-width: 100%;
}

.popup-window {
    width: 288px;
    max-width: calc(100vw - 20px);
    max-height: calc(100vh - 20px);
}

#main-window,
.main-window {
    width: min(100%, var(--app-w));
    height: min(100%, var(--app-h));
    max-width: var(--app-w);
    max-height: var(--app-h);
    margin: 0 auto;
}

#desktop-icons,
#start-links,
#meme-feed,
#popups-container {
    box-sizing: border-box;
}

#meme-feed img,
#modal-img {
    display: block;
}

#meme-modal {
    align-items: center;
    justify-content: center;
}

@media (max-width: 1100px) {
    :root {
        --os-top: 11%;
        --os-right: 5.5%;
        --os-bottom: 11%;
        --os-left: 5.5%;
    }

    #main-window,
    .main-window {
        width: min(100%, var(--app-w));
        height: min(calc(100vh - 80px), var(--app-h));
        max-height: calc(100vh - 80px);
    }

    .popup-window {
        width: min(288px, calc(100vw - 20px));
    }
}

@media (max-width: 700px) {
    #main-window,
    .main-window {
        height: calc(100vh - 70px);
        max-height: calc(100vh - 70px);
    }
}