@import url(https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css);body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;justify-content:center;margin:0;width:100%}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.homeContainer{align-items:center;background:linear-gradient(45deg,#ec407a,#ab47bc);display:flex;flex-direction:column;font-family:Arial,sans-serif;height:100vh;justify-content:center;width:100%}.homeContainer h1{color:#fff;font-size:3em;text-shadow:2px 2px 4px rgba(0,0,0,.7)}.divider{align-items:center;color:#fff;display:flex;justify-content:center;margin:20px 0}.divider span{font-size:1.5em;padding:0 10px}.divider:after,.divider:before{background-color:#fff;content:"";flex-grow:1;height:2px}button{border:none;border-radius:50px;box-shadow:0 8px 15px rgba(0,0,0,.1);color:#fff;cursor:pointer;font-size:1.2em;margin:10px;padding:15px 30px;transition:all .3s ease 0s}button:hover{box-shadow:0 15px 20px rgba(0,0,0,.2);-webkit-transform:translateY(-7px);transform:translateY(-7px)}.createButton{background:linear-gradient(45deg,#4caf50,#8bc34a)}.joinButton{background:linear-gradient(45deg,#ff9800,#ffc107)}.roomInputContainer .roomInput{background:hsla(0,0%,100%,.9);border:none;border-radius:50px;box-shadow:0 8px 15px rgba(0,0,0,.1);font-size:1.2em;padding:10px;text-align:center;width:200px}.createPlayerContainer,.loadingContainer{align-items:center;background:linear-gradient(45deg,#ec407a,#ab47bc);color:#fff;display:flex;flex-direction:column;font-family:Arial,sans-serif;height:100vh;justify-content:center}.createPlayerContainer .lobbyCode,.loadingContainer .lobbyCode{font-size:2.5em;text-shadow:2px 2px 4px rgba(0,0,0,.7)}.nameInput{background:hsla(0,0%,100%,.9);padding:10px;width:200px}.createPlayerButton,.nameInput{border:none;border-radius:50px;box-shadow:0 8px 15px rgba(0,0,0,.1);font-size:1.2em;margin-top:20px}.createPlayerButton{background:linear-gradient(45deg,#4caf50,#8bc34a);color:#fff;cursor:pointer;padding:15px 30px;transition:all .3s ease 0s}.createPlayerButton:hover{box-shadow:0 15px 20px rgba(0,0,0,.2);-webkit-transform:translateY(-7px);transform:translateY(-7px)}.backButton{background:linear-gradient(45deg,#4caf50,#8bc34a);border:none;border-radius:50px;box-shadow:0 8px 15px rgba(0,0,0,.1);color:#fff;cursor:pointer;font-size:1.2em;margin-top:20px;padding:15px 30px;transition:all .3s ease 0s}.backButton:hover{box-shadow:0 15px 20px rgba(0,0,0,.2);-webkit-transform:translateY(-7px);transform:translateY(-7px)}.nameInput{text-align:center}.loadingContainer,.lobbyContainer{align-items:center;background:linear-gradient(45deg,#ec407a,#ab47bc);color:#000;display:flex;flex-direction:column;font-family:Arial,sans-serif;height:100vh;justify-content:center}.loadingContainer .lobbyCode,.lobbyContainer .lobbyCode{color:#fff;font-size:2.5em;position:absolute;text-shadow:2px 2px 4px rgba(0,0,0,.7);z-index:10}.loadingContainer .userCircleContainer,.lobbyContainer .userCircleContainer{align-items:center;display:flex;flex-direction:column;height:300px;justify-content:center;position:relative;width:400px;z-index:1}.loadingContainer .userCircleContainer .userCircle,.lobbyContainer .userCircleContainer .userCircle{position:relative}.loadingContainer .userCircleContainer .userCircle .userIcon,.lobbyContainer .userCircleContainer .userCircle .userIcon{align-items:center;background:hsla(0,0%,100%,.2);border-radius:25px;box-shadow:0 8px 15px rgba(0,0,0,.1);display:flex;height:50px;justify-content:center;position:absolute;text-align:center;width:50px}.loadingContainer{font-size:2.5em}.chatContainer{background:#fff;border:1px solid rgba(0,0,0,.5);height:230px;position:relative;width:500px}.chatContainer .chatMessageContainer{height:calc(100% - 21px);overflow-y:scroll}.chatContainer .chatMessageContainer .chatMessage{font-size:16px;line-height:24px;margin:0}.chatContainer .chatMessageContainer .chatMessage:nth-child(odd){background-color:#f5f5f5}.chatContainer .chatMessageContainer .chatMessage span{color:purple;margin-left:5px}.chatContainer .chatMessageContainer::-webkit-scrollbar{width:5px}.chatContainer .chatMessageContainer::-webkit-scrollbar-track{background:transparent}.chatContainer .chatMessageContainer::-webkit-scrollbar-thumb{background:hsla(0,0%,8%,.5)}.chatContainer .messageInput{border:0;border-top:1px solid rgba(0,0,0,.5);bottom:0;height:20px;margin:0;padding:0;position:absolute;width:100%}.chatContainer .messageInput:focus{outline:none}.chatContainer{background:hsla(0,0%,100%,.8);box-shadow:0 4px 6px rgba(0,0,0,.1);display:flex;flex-direction:column}.chatMessageContainer{overflow-y:scroll}.chatMessage.enterAnimation{-webkit-animation:enterAnimation .5s ease-out forwards;animation:enterAnimation .5s ease-out forwards;opacity:0;-webkit-transform:translateY(50px);transform:translateY(50px)}@-webkit-keyframes enterAnimation{to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes enterAnimation{to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}.messageInput.unoStyle{background:#fff;border:none;box-shadow:0 2px 4px rgba(0,0,0,.1);transition:box-shadow .3s ease}.messageInput.unoStyle:focus{box-shadow:0 4px 8px rgba(0,0,0,.2)}@-webkit-keyframes pulse{0%{-webkit-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(1.1);transform:scale(1.1)}to{-webkit-transform:scale(1);transform:scale(1)}}@keyframes pulse{0%{-webkit-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(1.1);transform:scale(1.1)}to{-webkit-transform:scale(1);transform:scale(1)}}.lobbyAdminPanelContainer{align-items:center;display:flex;justify-content:center;padding:1rem;width:100%}.lobbyAdminPanelContainer button{background:#f44336;border:none;border-radius:20px;box-shadow:0 8px 15px rgba(0,0,0,.1);color:#fff;cursor:pointer;font-size:1.1em;text-align:center;transition:all .3s ease}.lobbyAdminPanelContainer button:hover{background:#d32f2f;-webkit-transform:scale(1.05);transform:scale(1.05)}.lobbyAdminPanelContainer button:active{background:#c62828;box-shadow:0 5px 10px rgba(0,0,0,.1)}.lobbyAdminPanelContainer button.pulse{-webkit-animation:pulse 1.5s infinite;animation:pulse 1.5s infinite}@-webkit-keyframes rotation{0%{-webkit-transform:rotateX(60deg) rotate(0deg);transform:rotateX(60deg) rotate(0deg)}to{-webkit-transform:rotateX(60deg) rotate(1turn);transform:rotateX(60deg) rotate(1turn)}}@keyframes rotation{0%{-webkit-transform:rotateX(60deg) rotate(0deg);transform:rotateX(60deg) rotate(0deg)}to{-webkit-transform:rotateX(60deg) rotate(1turn);transform:rotateX(60deg) rotate(1turn)}}@-webkit-keyframes rotationReverse{0%{-webkit-transform:scaleX(-100%) rotateX(60deg) rotate(0deg);transform:scaleX(-100%) rotateX(60deg) rotate(0deg)}to{-webkit-transform:scaleX(-100%) rotateX(60deg) rotate(1turn);transform:scaleX(-100%) rotateX(60deg) rotate(1turn)}}@keyframes rotationReverse{0%{-webkit-transform:scaleX(-100%) rotateX(60deg) rotate(0deg);transform:scaleX(-100%) rotateX(60deg) rotate(0deg)}to{-webkit-transform:scaleX(-100%) rotateX(60deg) rotate(1turn);transform:scaleX(-100%) rotateX(60deg) rotate(1turn)}}.tableContainer{background:#df1414;background:radial-gradient(circle,#df1414 0,#df1414 59%,#450404 100%)}.tableContainer,.tableContainer .table{display:flex;height:100vh;justify-content:center;width:100vw}.tableContainer .table{align-items:center;overflow:hidden;-webkit-perspective:10000px;perspective:10000px;-webkit-perspective-origin:50% -150%;perspective-origin:50% -150%;position:relative}.tableContainer .table .rotatingArrows{-webkit-animation:rotation 20s linear infinite;animation:rotation 20s linear infinite}.tableContainer .table .rotatingArrows,.tableContainer .table .rotatingArrowsReverse{-webkit-filter:opacity(.2);filter:opacity(.2);height:400px;position:absolute;top:85px;width:400px}.tableContainer .table .rotatingArrowsReverse{-webkit-animation:rotationReverse 20s linear infinite;animation:rotationReverse 20s linear infinite}.tableContainer .table .tableUI{align-items:center;background:#e08815;background:radial-gradient(circle,#e08815 0,rgba(224,136,21,0) 70%);border-radius:50%;display:flex;height:900px;justify-content:center;position:absolute;-webkit-transform:rotateX(60deg);transform:rotateX(60deg);width:900px;z-index:-2}.tableContainer .table .tableUI:after{border:5px solid red;border-radius:50%;content:" ";display:block;-webkit-filter:blur(5px);filter:blur(5px);height:900px;position:absolute;width:900px}.tableContainer .table .drawStack{zoom:.6;left:600px;position:absolute;top:300px;-webkit-transform:rotateX(60deg);transform:rotateX(60deg)}.tableContainer .table .drawStack .card{box-shadow:0 2px .5px 1px rgba(0,0,0,.1);position:absolute;-webkit-transform:rotate(-45deg)!important;transform:rotate(-45deg)!important}.tableContainer .table .drawStack .card:first-child{box-shadow:-5px 5px 12px 2px rgba(0,0,0,.7)}.tableContainer .table .playStack{zoom:.74;position:relative;-webkit-transform:rotateX(60deg);transform:rotateX(60deg);width:125px}.tableContainer .table .playStack .card{box-shadow:0 1px 2px 0 rgba(0,0,0,.3);position:absolute;z-index:1}.tableContainer .table .playStack .card:first-child{box-shadow:0 6px 12px 6px rgba(0,0,0,.3)}.tableContainer .table .playerName{background:rgba(30,30,30,.5);border-top-left-radius:20px;border-top-right-radius:20px;bottom:0;left:450px;padding:5px 20px;position:absolute;text-align:center;width:100px;z-index:1}.tableContainer .table .playerHand{zoom:.8;bottom:20px;display:flex;height:190px;position:absolute}.tableContainer .table .playerHand .card{bottom:0;box-shadow:-8px 0 6px -6px rgba(0,0,0,.5);position:absolute;transition:.1s}.tableContainer .table .playerHand .card:first-child{box-shadow:none}.tableContainer .table .active.playerHand .card{cursor:pointer}.tableContainer .table .active.playerHand .card:hover{bottom:30px}.tableContainer .table .inactive.playerHand .card:after{background:rgba(0,0,0,.6);border-radius:8px;content:" ";height:200px;position:absolute;width:125px}.tableContainer .table .opponentHand{height:190px}.tableContainer .table .opponentHand:before{background:#000;bottom:-200px;content:" ";display:block;-webkit-filter:blur(10px);filter:blur(10px);height:7px;position:relative;width:100%}.tableContainer .table .opponentHand .card{box-shadow:-8px 0 6px -6px rgba(0,0,0,.5);position:absolute;transition:.1s;width:125px}.tableContainer .table .opponentHand .card:first-child{box-shadow:none}.tableContainer .table .leftOpponentName{background:rgba(30,30,30,.5);border-top-left-radius:20px;border-top-right-radius:20px;bottom:50%;left:-54px;padding:5px 20px;position:absolute;text-align:center;-webkit-transform:rotate(90deg);transform:rotate(90deg);width:100px;z-index:1}.tableContainer .table .leftOpponentHand{zoom:.75;display:flex;flex-direction:column;left:250px;position:absolute;-webkit-transform:rotateX(-45deg) rotateY(40deg);transform:rotateX(-45deg) rotateY(40deg)}.tableContainer .table .middleOpponentName{background:rgba(30,30,30,.5);border-end-end-radius:20px;border-end-start-radius:20px;padding:5px 20px;position:absolute;right:450px;text-align:center;top:0;width:100px;z-index:1}.tableContainer .table .middleOpponentHand{zoom:.59;display:flex;position:absolute;top:0;-webkit-transform:rotateX(-40deg);transform:rotateX(-40deg);z-index:-1}.tableContainer .table .rightOpponentName{background:rgba(30,30,30,.5);border-top-left-radius:20px;border-top-right-radius:20px;padding:5px 20px;position:absolute;right:-54px;text-align:center;top:50%;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);width:100px;z-index:1}.tableContainer .table .rightOpponentHand{zoom:.75;display:flex;flex-direction:column;position:absolute;right:250px;-webkit-transform:rotateX(-45deg) rotateY(-45deg);transform:rotateX(-45deg) rotateY(-45deg)}.tableContainer .chatContainer{zoom:.85;background:none;height:200px;position:absolute;right:20px;top:20px;width:450px}.tableContainer .chatContainer .chatMessageContainer{height:calc(100% - 21px);overflow-y:scroll}.tableContainer .chatContainer .chatMessageContainer .chatMessage{color:#fff;font-size:16px;line-height:24px;margin:0}.tableContainer .chatContainer .chatMessageContainer .chatMessage:nth-child(odd){background-color:rgba(0,0,0,.192)}.tableContainer .chatContainer .chatMessageContainer .chatMessage span{color:purple;margin-left:5px}.tableContainer .chatContainer .messageInput{background:none;border:0;border-top:1px solid #000;bottom:0;color:#fff;height:20px;margin:0;padding:0;position:absolute;width:100%}.tableContainer .chatContainer .messageInput:focus{outline:none}.card{align-items:center;border-radius:8px;display:flex;height:200px;justify-content:center;overflow:hidden;width:125px}.card span{color:#fff;font-size:48px;pointer-events:none;position:absolute}.card .back{color:#000}.card .centerCircle{background:#050505;border-radius:50%;height:130px;position:absolute;width:130px;z-index:-1}.card img{pointer-events:none;position:absolute}.card .top{left:8px;top:11px;width:20px}.card .topNumber{display:block;font-size:24px;font-weight:200;left:0;text-align:center;top:2px;width:40px}.card .centerNumber{font-size:82px;font-weight:200}.card .center{height:60px}.card .bottom{bottom:8px;font-size:26px;right:10px;width:24px}.card .bottomNumber{bottom:2px;display:block;font-size:24px;font-weight:200;right:0;text-align:center;width:40px}.card-enter{opacity:0}.card-enter-active{opacity:1;transition:opacity 1s}.card-exit{opacity:1}.card-exit-active{opacity:0;transition:opacity 1s}.colorPickerContainer{align-items:center;display:flex;height:100vh;justify-content:center;position:fixed;width:100vw}.colorPickerContainer .colorPicker{background:#000;border-radius:50%;display:flex;flex-wrap:wrap;height:400px;overflow:hidden;position:absolute;width:400px}.colorPickerContainer .colorPicker .color{height:200px;width:200px}.colorPickerContainer .colorPicker .red{background:#ff2a2a}.colorPickerContainer .colorPicker .green{background:#7fc82a}.colorPickerContainer .colorPicker .blue{background:#2a7fff}.colorPickerContainer .colorPicker .yellow{background:#fc0}.colorPickerContainer .colorPickerBackground{background:rgba(0,0,0,.5);height:100%;width:100%}.UNOButtonContainer{background:#fff;border-radius:50%;bottom:50px;box-shadow:0 10px 0 0 gray;cursor:pointer;font-size:64px;font-weight:700;height:100px;right:50px;width:200px}.gameResultContainer,.UNOButtonContainer{align-items:center;display:flex;justify-content:center;position:absolute}.gameResultContainer{border-radius:15px;height:100vh;width:100vw}.gameResultContainer:after{background:rgba(0,0,0,.5);content:" ";height:100%;width:100%}.gameResultContainer .gameResult{align-items:center;background:#fff;border-radius:15px;display:flex;flex-direction:column;height:500px;justify-content:center;position:absolute;width:500px}.gameResultContainer .gameResult h1{font-size:72px;margin:0}.gameResultContainer button{background-color:#000}
/*# sourceMappingURL=main.5bb54b56.css.map*/