:root{
    --yellow:rgb(255, 248, 108);
    --yellow-0-5-opacity:rgb(255, 255, 0);
    --gray:rgb(236,233,231);
    --gray-0-5-opacity:rgb(255,241,216);
    --menu-gray:rgb(236,233,231);
    --menu-button-height: 3rem;
    --font-color:rgb(44, 46, 36);
    --hover-font-color:rgb(88, 92, 72);
    --yellow-font-color:rgb(255, 248, 108);
    --faint-menu-font-color:rgb(100, 100, 100);
    --full-height:calc(100dvh - var(--menu-button-height));
}

/* html{
    font-size: calc(0.45vw + 0.2vh + 8px);
} */

body{
    background-color: var(--yellow);
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    user-select: none;
    -webkit-user-select: none;
    font-family: 'N27';
    color:var(--font-color);
    scrollbar-width: none;
    text-rendering: geometricPrecision;

    overscroll-behavior: contain;
}

text {
    fill:var(--font-color);
}

::-webkit-scrollbar {
    display: none;
}

.yellow{
    background-color: var(--yellow);
}
.gray{
    background-color: var(--gray);
}

.full-page {
    padding: 10vw;
    width: 100%;
    height: calc(100dvh - var(--menu-button-height));
}

.title {
    text-transform: uppercase;
    font-size: 6rem;
}