body {
    margin: 0;
    background: rgb(255, 229, 229);
}

.main-game {
    height: 100vh;
    width: 100vw;
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 750px;
}

.genius {
    display: grid;
    grid-template-areas: "green red" "yellow blue";
    row-gap: 10px;
    column-gap: 10px;
    border: 1px solid #fff;
    background: #fff;
    border-radius: 100%;
    width: 95%;
    height: 95%;
}

.blue {
    grid-area: blue;
    background: rgb(27, 27, 223);
    border-bottom-right-radius: 100%;
}

.red {
    grid-area: red;
    background: rgb(223, 27, 27);
    border-top-right-radius: 100%;
}

.yellow {
    grid-area: yellow;
    background: rgb(223, 220, 27);
    border-bottom-left-radius: 100%;
}

.green {
    grid-area: green;
    background: rgb(27, 223, 27);
    border-top-left-radius: 100%;
}

.selected {
    opacity: .5;
}