:root {
    color-scheme: light dark;
}

@font-face {
    font-family: "Grundschrift";
    src: url("Grundschrift-Bold.otf") format("opentype");
}

body {
    font-family: sans-serif;
    margin: 1em;
}

.grundschrift {
    font-family: "Grundschrift", sans-serif;
}

.no-print {
    background: light-dark(#f5f5f5, #2a2a2a);
    border: 2px dashed light-dark(#ccc, #555);
    border-radius: 0.5em;
    padding: 1em;
    margin-bottom: 1.5em;
    @media print {
        display: none;
    }
}

.controls {
    display: flex;
    flex-wrap: wrap;
    gap: 1em;
    margin: 1em 0;
    align-items: start;
}

.controls label {
    display: flex;
    flex-direction: column;
    gap: 0.3em;
}

.controls fieldset {
    display: flex;
    gap: 1em;
}

.controls fieldset label {
    flex-direction: row;
    align-items: center;
}

.controls input[type="number"] {
    font-size: 1em;
    padding: 0.4em;
    width: 5em;
    border: 2px solid light-dark(rgba(0, 0, 0, 0.3), rgba(255, 255, 255, 0.3));
    border-radius: 0.3em;
}

button {
    font-size: 1em;
    padding: 0.5em 1.5em;
}

.page {
    max-width: 700px;
    margin: 0 auto;
    break-after: page;
}

.page:last-child {
    break-after: auto;
}

.page-header {
    border-bottom: 3px solid currentColor;
    padding-bottom: 0.3em;
    margin-bottom: 0.5em;
}

.page-header h2 {
    margin: 0;
}

.page-fields {
    display: flex;
    gap: 2em;
    margin: 0.5em 0;
}

.page-fields .line {
    display: inline-block;
    border-bottom: 1.5px solid currentColor;
    min-width: 10em;
}

.questions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    font-size: 1.3em;
}

.question {
    padding: 0.4em 1em;
    print-color-adjust: exact;
    -webkit-print-color-adjust: exact;
}

.question:nth-child(4n + 1),
.question:nth-child(4n + 2) {
    background: light-dark(#fffae8, #2a2820);
}

.question:nth-child(odd) {
    border-right: 2px solid #ffd700;
}

.question .blank {
    color: light-dark(#ccc, #555);
}

@media print {
    body {
        margin: 0;
    }
}
