/* Global layout styles. Page and feature styles live in sibling stylesheet files. */

html,
body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

* {
    box-sizing: border-box;
}

.app-screen,
.app-container {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

.app-screen {
    min-height: 100vh;
    background:
            radial-gradient(
                    circle at top,
                    #ffffff,
                    #f8fafc 45%
            );
    padding: 16px 14px 120px;
}

.app-container {
    max-width: 1152px;
    width: 100%;
    margin: 0 auto;
}

/* Preserve existing compact layouts below desktop. */
.page-content {
    max-width: 576px;
    margin: 0 auto;
}

.page-content-wide {
    max-width: 768px;
    margin: 0 auto;
}

@media (min-width: 1024px) {
    .page-content,
    .page-content-wide {
        max-width: none;
    }

    .event-page-shell,
    .page-content-inset {
        padding-left: 0;
        padding-right: 0;
    }
}