.body {
    font-family: Arial;
}

header {
    color: #fffef0;
    margin-bottom: 10px;
}

label {
    color: #fffef0;
}

.center-flex {
    display: flex;
    justify-content: center;
    align-items: center;
}

.field-width {
    width: 99vw;
    overflow: hidden;
}
@media (min-width: 300px) {
    .field-width {
        width: 300px;
    }
}

.home-button {
    color: #fffef0;
}

#operator-form {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    margin-top: 10px;
}

#operate-button {
    width: min-content;
}

#answer-field {
    color: #fffef0;
}

#dynamic-content-container {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

#answer-field {
    padding: 0px 5px;
    border: 2px solid #fffef0;
    overflow-x: scroll;
}

.answer-data-layout {
    display: grid;
    grid-gap: 5px;
    grid-template-columns: 1fr 1fr;
    border-bottom: 1px solid #fffef0;
}

.answer-data-col-1 {
    align-self: center;
    justify-self: start;
}

.answer-data-col-2 {
    align-self: center;
    justify-self: start;
}

.matrix {
    display: grid;
    grid-template-columns: 1fr 5fr;
}