/* The design is a 375 x 812 mobile artboard and every measurement in the views is an
   absolute value inside that frame. --u is one artboard unit, so the whole page scales as
   one piece instead of drifting away from the background art.

   Width term: 1px once the frame reaches its 375 unit cap, a proportional fraction of a
   pixel on a narrower handset.
   Height term: 812 units = 100vh, so on a window taller than the artboard the unit grows
   and the frame spans top to bottom instead of leaving a gap. It never wins over the width
   term, so the artboard is never wider than the viewport. */
:root {
    --u: min(0.26666667vw, max(1px, 0.12315271vh));

    /* The artwork's dominant green. It is the page ground so the strip sits on the
       design's own colour rather than white - including iOS overscroll and any width
       wider than the 375 unit artboard. */
    --ground: #9CC999;

    --slate: #4D5965;
    --body-grey: #484848;
    --muted-grey: #535353;
}

html {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 16px;
    background-color: var(--ground);
    -webkit-text-size-adjust: 100%;
}

body {
    margin: 0;
    background-color: var(--ground);
    overflow-x: hidden;
}

#app {
    /* Latin first so the Latin runs inside Thai copy ("AI", "10.70") match the English
       page exactly; Thai codepoints fall through to Anuphan. */
    font-family: 'Poppins', 'Anuphan', sans-serif;
    color: var(--slate);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

button {
    font-family: inherit;
}
