*{box-sizing:border-box}* :focus{outline:none}body{margin:0;background-color:#2f4f4f;color:#deb887;font-family:georgia,serif;font-size:.9em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.app{position:relative;display:flex;flex-direction:column;justify-content:center;width:60vh;height:100vh;margin:auto}header{position:absolute;top:15px;width:100%;font-size:x-large;font-weight:700;text-align:center;line-height:2.2rem}header .winner{-webkit-animation:pulse 1s infinite;animation:pulse 1s infinite}header .status{margin-right:6px;text-transform:capitalize}header .black{color:#000}header .white{color:#fff}footer{text-align:center}button{position:absolute;right:0;padding:0 1rem;margin:0 auto;border:0;background-color:#867358;color:#deb887;font:inherit;font-size:medium;box-shadow:10px 10px 20px rgba(0,0,0,.5);transition:all .1s;cursor:pointer}button:hover{background-color:#deb887;color:#867358}@-webkit-keyframes pulse{0%{opacity:1}50%{opacity:1}to{opacity:0}}@keyframes pulse{0%{opacity:1}50%{opacity:1}to{opacity:0}}.board{position:relative;padding-bottom:calc(100% - 60px);border:30px outset #deb887;box-shadow:10px 10px 20px rgba(0,0,0,.5)}.grid{grid-template-columns:repeat(8,1fr);width:100%;height:100%}.grid,.position{position:absolute;display:grid}.position{align-items:center;justify-items:center;font-weight:700}.position.files{top:100%;left:0;grid-template-columns:repeat(8,1fr);width:100%;height:30px}.position.ranks{top:0;left:100%;grid-template-rows:repeat(8,1fr);width:30px;height:100%}.square{background-color:#add8e6;transition:transform .1s}.square:nth-child(8)~div:nth-child(-2n+15),.square:nth-child(16)~div:nth-child(-2n+24),.square:nth-child(24)~div:nth-child(-2n+31),.square:nth-child(32)~div:nth-child(-2n+40),.square:nth-child(40)~div:nth-child(-2n+47),.square:nth-child(48)~div:nth-child(-2n+56),.square:nth-child(56)~div:nth-child(-2n+63),.square:nth-child(-2n+8){background-color:#708090}.square:hover{box-shadow:0 0 0 4px #2f4f4f;transform:scale(1.05);cursor:pointer;z-index:2}.square.active{box-shadow:0 0 0 4px #adff2f;z-index:1}.piece{width:12.5%;background-position:50%;background-repeat:no-repeat;background-size:90%;transition:all .3s}.board .piece{position:absolute;height:12.5%;pointer-events:none;z-index:2}.piece.black.rook{background-image:url(/assets/pieces/bR.svg)}.piece.black.knight{background-image:url(/assets/pieces/bN.svg)}.piece.black.bishop{background-image:url(/assets/pieces/bB.svg)}.piece.black.queen{background-image:url(/assets/pieces/bQ.svg)}.piece.black.king{background-image:url(/assets/pieces/bK.svg)}.piece.black.pawn{background-image:url(/assets/pieces/bP.svg)}.piece.white.rook{background-image:url(/assets/pieces/wR.svg)}.piece.white.knight{background-image:url(/assets/pieces/wN.svg)}.piece.white.bishop{background-image:url(/assets/pieces/wB.svg)}.piece.white.queen{background-image:url(/assets/pieces/wQ.svg)}.piece.white.king{background-image:url(/assets/pieces/wK.svg)}.piece.white.pawn{background-image:url(/assets/pieces/wP.svg)}.piece.active{z-index:3}.captured .piece{height:100%;padding:0 30px;-webkit-animation-name:bounce;animation-name:bounce;-webkit-animation-duration:.3s;animation-duration:.3s}@-webkit-keyframes bounce{0%{transform:scale(0)}60%{transform:scale(1.2)}to{transform:scale(1)}}@keyframes bounce{0%{transform:scale(0)}60%{transform:scale(1.2)}to{transform:scale(1)}}.captured{position:relative;display:flex;flex-wrap:wrap;height:7.5vh;padding:10px 30px}.captured.black{flex-wrap:wrap-reverse}
/*# sourceMappingURL=main.80192a9e.chunk.css.map */