body {
    text-align: center;
}

#listen {
    width: 250px;
    display: flex;
    margin: auto;

    .box {
        width: 50%;
        aspect-ratio: 1;
        border: 1px solid #000;
        box-sizing: border-box;
        display: flex;
        align-items: center;
        justify-content: center;
        font: bold 2em "Courier New";
        white-space: pre-wrap;

        &.correct {
            background-color: lightgreen;
        }

        &.incorrect {
            background-color: lightsalmon;
        }
    }
}