@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Libertinus+Mono&display=swap");

:root {
    --header-height: 3.3em;
}

body {
    background: linear-gradient(#F095B0, #ED6B85);
    margin: 0;
}

*:not(h1, h2) {
    font-family: Inter, sans-serif;
}
h1, h2 {
    font-family: "Libertinus Mono", monospace;
}

#content {
    min-height: calc(100vh - var(--header-height));
    background: #f3dce8;
}
#content, #content a {
    color: #3d0c16;
}
#content, #header {
    width: min(100vh, 100vw);
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
    padding: 1em;
}
#header {
    height: var(--header-height);
}

#header, input, select, button {
    background: #75313f;
}
#header *, #header, input, select, button {
    color: white;
}
input, select, button {
    border: none;
    margin: .25em;
    padding: .25em;
    border-radius: .5em;
}

.spacer {
    display: inline-block;
    width: 1em;
}

.input-ttl {
    max-width: 4em;
}

button, input[type="submit"] {
    cursor: pointer;
}

.row {
    display: block;
    padding: .5em;
    box-sizing: border-box;
}
.row > form {
    display: inline-block;
}
.row:nth-child(2n) {
    background: #f0a2b9;
}
.row:nth-child(2n + 1) {
    background: #F095B0;
}

code {
    font-family: monospace;
}