board-area {
    flex-grow: 1;
    height: 100vh;
}

#chessboard-holder {
    width: 646px;
    height: 646px;
    margin: 20px auto 20px;
    position: relative;
    background: linear-gradient(45deg, #6adcff, #ff69bc);
    box-shadow: 0 4px 8px 0 #0004;
}

#chessboard {
    width: 600px;
    position: absolute;
    top: 23px;
    left: 23px;
}

#victoryOverlay {
    width:600px;
    height:600px;
    position: absolute;
    top: 23px;
    left: 23px;
    z-index: 100;
    background-image: url('../img/wow.gif');
    background-repeat: no-repeat;
    background-position: center bottom;
}

.hidden {
    display: none;
}

#thinking {
    width: 646px;
    height: 2px;
    background: #aaa;
    display: block;
    margin: 20px auto;
}

.progress {
    width: 0%;
    height: 100%;
    background: linear-gradient(45deg, #6adcff, #ff69bc);
}

#buttons {
    text-align: center;
}

#buttons button {
    font-family: monospace;
}

#pgn {
    width: 646px;
    margin: 20px auto;
}

#pgn .turn {
    display: inline-block;
    margin: 0 6px;
}

#pgn .ply:hover {
    text-decoration: underline;
    cursor: pointer;
}

#fen {
    width: 646px;
    margin: 20px auto;
}

#fen span {
    width: 100%;;
    /* text-align: center; */
    /* cursor:text; */
}

/* #fen span:hover {
    font-weight: bold;
} */

#fen input {
    display: none;
    width: calc(100% - 100px);
}

#fen button {
    display: none;
    float: right;
}

#probabilities {
    width: 646px;
    margin: 10px auto;
    white-space: pre;
}