html{min-height:100vh}body{width:100%;margin:0;background-color:#fffaf1}*{box-sizing:border-box}#lobby{width:100%;display:flex;align-items:center;flex-direction:column}.lobby-content{padding:60px 20px;display:flex;flex-direction:column;align-items:center;width:1000px;max-width:100%}.lobby-options{display:flex;flex-wrap:wrap;gap:15px}.lobby-options>button{padding:4px 8px}.form-joinRoom>button{margin-left:5px;padding:4px 8px}.form-joinRoom>input{width:250px;padding:4px}.navbar{padding:0 40px;background-color:#000;color:#fff;width:100%;display:flex;align-items:center;justify-content:space-between;height:45px}.navbar-left{cursor:pointer;font-size:1.5em}.navbar-right{height:100%;display:flex;align-items:center}.navbar-profile{color:#fff;margin-right:16px}.navbar-signout{color:#fff;background-color:orange;height:100%}.navbar-signout:hover{filter:brightness(80%)}#GameRoom{display:flex;flex-wrap:wrap}#leftPanel{padding:10px}#rightPanel{flex:1;padding:10px;display:flex;flex-direction:column;max-width:800px}.game-room-chat{border-radius:4px;border:1px solid;padding:8px;display:flex;flex-direction:column}.chat-form>input{width:350px;max-width:100%;padding:4px 8px;height:40px}.chat-form>button{height:40px}.chat-content{display:flex;flex-direction:column-reverse;list-style:none;overflow-y:scroll;height:200px;background-color:#fff;padding:4px 8px;border-radius:4px;border:1px solid}.leave-room-btn{background-color:red;color:#fff;padding:8px 16px;font-size:16px;border:none;border-radius:4px;cursor:pointer}.leave-room-btn:hover{filter:brightness(70%)}.ready-btn{background-color:green;color:#fff;padding:8px 16px;font-size:16px;border:none;border-radius:4px;cursor:pointer;margin-right:10px}.ready-btn:hover{filter:brightness(70%)}.ready-btn:disabled{filter:brightness(70%);cursor:not-allowed}.right-panel-info{flex:1;background-color:#fff;border-radius:4px;border:1px solid;padding:8px;margin-bottom:5px}.piece,.dot{position:absolute;background-position:center;background-size:contain;width:46px;height:46px;left:39px;top:3px;border-radius:50%}.piece.r:hover{scale:1.15;box-shadow:0 0 16px 2px #ff000080}.piece.b:hover{scale:1.15;box-shadow:0 0 16px 2px #00000080}.p-visible.r{scale:1.15;box-shadow:0 0 16px 2px #ff000080}.p-visible.b{scale:1.15;box-shadow:0 0 16px 2px #00000080}.dot:hover{background-color:#173c8280}.p-br{background-image:url(/chess-pieces/blackRook.png)}.p-bh{background-image:url(/chess-pieces/blackHorse.png)}.p-be{background-image:url(/chess-pieces/blackElephant.png)}.p-bg{background-image:url(/chess-pieces/blackGuard.png)}.p-bk{background-image:url(/chess-pieces/blackKing.png)}.p-bc{background-image:url(/chess-pieces/blackCannon.png)}.p-bp{background-image:url(/chess-pieces/blackPawn.png)}.p-rr{background-image:url(/chess-pieces/redRook.png)}.p-rh{background-image:url(/chess-pieces/redHorse.png)}.p-re{background-image:url(/chess-pieces/redElephant.png)}.p-rg{background-image:url(/chess-pieces/redGuard.png)}.p-rk{background-image:url(/chess-pieces/redKing.png)}.p-rc{background-image:url(/chess-pieces/redCannon.png)}.p-rp{background-image:url(/chess-pieces/redPawn.png)}#board{position:relative;background-image:url(/chineseChessPlate.png);height:600px;width:600px;background-position:center;background-size:contain}.p-br{background-image:url(/chess-pieces/blackRook.png)}.p-bh{background-image:url(/chess-pieces/blackHorse.png)}.p-be{background-image:url(/chess-pieces/blackElephant.png)}.p-bg{background-image:url(/chess-pieces/blackGuard.png)}.p-bk{background-image:url(/chess-pieces/blackKing.png)}.p-bc{background-image:url(/chess-pieces/blackCannon.png)}.p-bp{background-image:url(/chess-pieces/blackPawn.png)}.p-rr{background-image:url(/chess-pieces/redRook.png)}.p-rh{background-image:url(/chess-pieces/redHorse.png)}.p-re{background-image:url(/chess-pieces/redElephant.png)}.p-rg{background-image:url(/chess-pieces/redGuard.png)}.p-rk{background-image:url(/chess-pieces/redKing.png)}.p-rc{background-image:url(/chess-pieces/redCannon.png)}.p-rp{background-image:url(/chess-pieces/redPawn.png)}.p-br,.p-bh,.p-be,.p-bg,.p-bk,.p-bc,.p-bp,.p-rr,.p-rh,.p-re,.p-rg,.p-rk,.p-rc,.p-rp{background-position:center;background-size:contain}.player-card,.opponent-card{width:100%;display:flex;height:60px;border-radius:4px;background-color:#f0e4ce;padding:5px}.opponent-card{flex-direction:row-reverse}.player-card-image,.opponent-card-image{display:block}.player-card-info,.opponent-card-info{display:flex;flex-direction:column;flex:1;padding:8px}.player-card-deadPieces,.opponent-card-deadPieces{display:flex;margin-top:2px;padding:0;gap:4px}.opponent-card-info{align-items:flex-end}#Welcome{padding-top:60px;width:100%;min-height:100vh;display:flex;flex-direction:column;align-items:center}.loginForm{display:flex;flex-direction:column;align-items:center;border-radius:8px;border:1px solid black;width:400px;padding:20px;margin-top:10px}.loginForm>label{margin-top:15px;margin-bottom:5px}.loginForm>input{display:block;padding:10px;width:250px;max-width:100%}.login-connect-btn{margin-top:15px;padding:4px 8px}.login-google-btn{margin-top:5px;display:flex;align-items:center;justify-content:center;padding:4px 16px;font-size:16px}.login-error{font-size:20px;color:red;margin-top:10px}#Register{padding-top:60px;width:100%;min-height:100vh;display:flex;flex-direction:column;align-items:center}.register-error{font-size:20px;color:red;margin-top:10px}.register-form{display:flex;flex-direction:column;align-items:center;border-radius:8px;border:1px solid black;width:400px;padding:20px}.register-form>label{margin-top:15px;margin-bottom:5px}.register-form>input{display:block;padding:10px;width:250px;max-width:100%}.register-btn{margin-top:10px;padding:4px 8px}