html {
    overflow-x: hidden;

    padding-top: env(safe-area-inset-top);
    padding-right: env(safe-area-inset-right);
    padding-bottom: env(safe-area-inset-bottom);
    padding-left: env(safe-area-inset-left);
}

body {
    overflow-x: clip;
    background-color: var(--bg);
}

main {
    background-color: var(--bg-light);

    margin-top: var(--site-margin-vertical);
    margin-right: var(--site-margin-horizontal);
    margin-left: var(--site-margin-horizontal);
    margin-bottom: 0;

    padding: 3vw;
    padding-left: 5vw;
    padding-right: 5vw;

    border-radius: 0.5rem;
    border: var(--border-card);
    box-shadow: var(--shadow);
}

/* Scrollbar */

::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-track {
    border-radius: 10px;
    background-color: var(--scrollbar-track-col);
}

::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: var(--scrollbar-bar-col);
    box-shadow: inset 0 0 6px hsl(0, 0%, 90%);
    -webkit-box-shadow: inset 0 0 6px hsl(0, 0%, 50%);
}