/* Score check assignment layout */
#score-checker form {
    display: grid;
    grid-template-columns: max-content minmax(8rem, 1fr);
    gap: 0.75rem 1rem;
    align-items: center;
    max-width: 520px;
    margin-top: 1rem;
}

#score-checker input {
    width: 100%;
    padding: 0.35rem;
    font: inherit;
}

#score-checker button {
    grid-column: 1 / -1;
    justify-self: start;
    cursor: pointer;
    padding: 0.45rem 1rem;
    font: inherit;
}

#scoreOutput {
    margin-top: 1rem;
    padding: 1rem;
    border-left: 4px solid #6dff8f;
}

#scoreOutput.error-output {
    border-left-color: #ff6d6d;
    color: #ffd6d6;
}

@media (max-width: 700px) {
    #score-checker form {
        grid-template-columns: 1fr;
    }
}