/*========*/
/* Reset */
/*=======*/
*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

/* Element Styling */
body{
    background-color: #000;
    color: white;
}

/*============*/
/* Utilities */
/*===========*/
.hidden{
    display: none;
}

.disabled{
    pointer-events: none;
}

/*========*/
/* Layout */
/*========*/

/* Player Score */
.score-board{
    text-align: right;
    font-size: 1.3rem;
    font-size: clamp(1.3rem, 1.1600000000000001rem + 0.7vw, 2rem);
}

.score{
    padding: .6em;
}

/* Game Buttons */
.game-btn-container{
    grid-template-columns: auto auto;
    display: grid;
    justify-content: center;
    margin-bottom: 1em;
}

.game-btn{
    height: clamp(6.8rem, 5.96rem + 4.2vw, 11rem);
    width: clamp(6.8rem, 5.96rem + 4.2vw, 11rem);
    cursor:pointer;
    margin: 2em;
    border-radius: 10%;
    border: none;
    transition: box-shadow .4s;  
}

.red-btn{
    background: #d46178;
    box-shadow: 0px 0px 0px #DC143C;
}

.red-btn-glow{
    background: #DC143C;
    box-shadow: 0px 0px 80px #ff4167;
} 

.green-btn{
    background: #70ce70;
    box-shadow: 0px 0px 0px #32CD32;
}

.green-btn-glow{
    background: #32CD32;
    box-shadow: 0px 0px 80px #32CD32;
}

.blue-btn{
    background: #80c0ff;
    box-shadow: 0px 0px 0px #1E90FF;
}

.blue-btn-glow{
    background: #1E90FF;
    box-shadow: 0px 0px 80px #1E90FF;
}

.yellow-btn{
    background: #ffe96e;
    box-shadow: 0px 0px 0px #FFD700;
}

.yellow-btn-glow{
    background: #FFD700;
    box-shadow: 0px 0px 80px #FFD700;
}

/* Game state & rules */
.game-info-container{
    text-align: center;
}

#start-btn{
    background: transparent;
    padding: .5em 1.2em;
    font-size: 1.89rem;
    border: 2px white solid;
    border-radius: 10px;
    cursor: pointer;
    color: white;
    transition: transform .2s;
}

.game-state-message{
    font-size: 2rem;
}

#start-btn:hover{
    transform: scale(1.1);
}

.rules{
    font-size: 1.2rem;
    font-size: clamp(1.2rem, 1.16rem + 0.19999999999999996vw, 1.4rem);
    text-align: center;
    max-width: 65ch;
    margin: 1.3em auto;
    padding: 0 1em;
}