:root {
    --theme-light: #F2FFE4;
    --theme-black: #000000;
    --theme-orange: #F47835;
    --theme-cyan: #9FD9DB;
    --theme-purple: #9A98AE;

    --p-x: 24rem;
    --p-y: 40rem;

    --display: mobile;
}

* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

html {
    width: 100%;
    height: 100%;
    
    font-family: NeueHass, sans-serif;
    font-size: 1px;
    -webkit-font-smoothing: antialiased;
}

body {
    width: 100%;
    height: 100%;
    
    background-color: var(--theme-light);
}

/* Desktop */
@media screen and (min-width: 768px) {
    :root {
        --p-x: 80rem;
        --p-y: 40rem;
        
        --display: desktop;
    }

    html {
        font-size: calc(100vw / 1920);
    }
}