/* Keeps the footer at the bottom of the viewport when a page is shorter than
   the screen, without pinning it there when the page is long. 100dvh follows
   the shrinking address bar on mobile; 100vh is the fallback. */
body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    min-height: 100dvh;
}

body > .wrapper {
    flex: 1 0 auto;
}

body > footer {
    margin-top: auto;
    flex-shrink: 0;
}