:root{--dark:#333;--dark-transparent:#333333bf;--darker-transparent:#20222266;--light:#f5f5f5;--light-transparent:#f5f5f599;--grid-line-color:#69696900;--error:#f56565;--focus:#63b3ed;--link:#90cdf4;--turn:#3cba92;--green:#3cba92;--purple:#b66df6;--grey:#707070;--gold:gold;--win-green:var(--turn);--win-green-transparent:#3cba92bf;--loss-red:var(--error);--loss-red-transparent:#f56565bf;--draw-grey:var(--grey)}*{box-sizing:border-box;font-family:system-ui;margin:0}body{background-image:linear-gradient(90deg,#69696900 1px,#333 0),linear-gradient(180deg,#69696900 1px,#333 0);background-image:linear-gradient(to right,var(--grid-line-color) 1px,#333 1px),linear-gradient(to bottom,var(--grid-line-color) 1px,#333 1px);background-size:20px 20px;padding:3rem}.container,header{text-align:center}header{margin-top:clamp(1rem,2vh,2rem)}h1{font-family:Lacquer,system-ui;font-size:clamp(3.5rem,5vw,10rem);font-style:normal;font-weight:400}h1,h2{color:#f5f5f5;color:var(--light)}h2{font-size:clamp(1.5rem,2vw,3rem);font-weight:500}h3{color:#f5f5f5;color:var(--light);font-size:clamp(1rem,1.8vw,2.6rem);font-weight:400}.board{height:clamp(150px,50vw,600px);margin:4rem auto;max-height:60vh;max-width:60vh;position:relative;width:clamp(150px,50vw,600px)}.strike{background-color:#3cba92;background-color:var(--win-green);border-radius:1rem;height:clamp(110px,45vw,525px);position:absolute;transform-origin:bottom!important;width:5px}.transform-origin-top{transform-origin:top!important}.transform-origin-bottom{transform-origin:bottom!important}.board__row{color:#f5f5f5;color:var(--light);display:flex;height:33.3%;justify-content:center;width:100%}.board__square{display:grid;font-size:clamp(3.5rem,7vw,9rem);place-content:center;text-align:center;width:33.3%}.board__square:first-child{border-right:1px solid #f5f5f5;border-right:1px solid var(--light)}.board__square:last-child{border-left:1px solid #f5f5f5;border-left:1px solid var(--light)}.board__row:not(.board__row~.board__row){border-bottom:1px solid #f5f5f5;border-bottom:1px solid var(--light)}.board .board__row:last-of-type{border-top:1px solid #f5f5f5;border-top:1px solid var(--light)}form{align-items:center;display:flex;flex-direction:column;margin:0 auto;max-width:375px;padding:2rem 0;width:100%}form>p{color:#f5f5f5;color:var(--light)}.btn,input{border:none;border-radius:25px;height:50px;outline:none;padding:10px}.btn-center{margin:0 auto}.input-group{display:flex;flex-direction:column;position:relative;width:80%}.input-group label{color:#333;color:var(--dark);cursor:text;left:10px;margin-bottom:3px;position:absolute;top:50%;transform:translateY(-50%);transition:.25s ease;z-index:1}.btn,.input-group{margin-top:1.5rem}input:focus{border:2px solid #63b3ed;border:2px solid var(--focus)}input:focus~label,input:valid~label{color:#63b3ed;color:var(--focus);font-size:smaller;font-weight:bolder;top:-12px}.btn{color:#f5f5f5;color:var(--light);display:block;font-weight:700;width:300px}.btn,a{cursor:pointer;font-size:1rem}.btn:hover{transform:scale(1.05)}.btn-primary{background:radial-gradient(circle at 10% 20%,#6f6fdb 0,#b66df6 72.4%)}.btn-secondary{background:radial-gradient(circle at 10% 20%,#3a3e58 3.6%,#777f94 120.8%)}.btn-icon{aspect-ratio:1;height:100%;margin:0;width:60px!important}.btn-danger{background:radial-gradient(371px at 2.9% 14.3%,#f06 0,#500523 100.7%)}.btn-disabled{background:grey;cursor:default}.button-container{align-items:center;display:flex;flex-direction:column;text-align:center}p.validation-error{color:#f56565;color:var(--error);margin-top:2px;text-align:end;width:75%}p.form-message{margin-top:1rem}p.form-message-success{color:#3cba92;color:var(--green)}a{color:#90cdf4;color:var(--link);font-weight:bolder;text-decoration:none}a:hover{text-decoration:underline}a.btn{display:grid;place-content:center}a.btn:hover{text-decoration:none}#spectate-button{margin-left:auto;margin-right:auto}@media screen and (min-width:992px){form{border-right:2px solid #f5f5f5;border-right:2px solid var(--light);margin:0}section{align-items:center;display:flex;justify-content:center}#spectate-button{margin:0 0 0 2rem}#previous-games-container{width:60%}}section#playButtons{align-items:center;display:flex;flex-direction:column}.footer{background:#333333bf;background:var(--dark-transparent);border-top:2px solid #707070;border-top:2px solid var(--grey);bottom:0;height:70px;left:0;position:fixed;right:0}.nav{background:#0000;width:100%}.nav,ul{height:100%}ul{display:flex;list-style:none;margin:0;padding:0}.nav-button{border-left:1px solid #707070;border-left:1px solid var(--grey);border-right:1px solid #707070;border-right:1px solid var(--grey);color:#f5f5f5;color:var(--light);cursor:pointer;display:grid;font-size:1.7rem;height:100%;place-content:center;place-items:center;width:33.3%}.nav-button p{font-size:1rem}.nav-button>a{display:block}.game-container{align-items:center;display:flex;flex-direction:column}.game-turn-message{color:#f5f5f5;font-size:2rem;font-weight:500}.game-result-message{font-weight:700}.game-result-message-win{color:#3cba92;color:var(--win-green)}.game-result-message-loss{color:#f56565;color:var(--loss-red)}.game-result-message-draw{color:#707070;color:var(--draw-grey)}.player-card-container{display:flex;justify-content:space-between;width:100%}.player-card{background:#333333bf;background:var(--dark-transparent);border:2px solid #f5f5f5;border:2px solid var(--light);color:#f5f5f5;color:var(--light);font-size:1.2rem;font-weight:bolder;overflow:hidden;padding:1rem;transition:background-color .5s;width:130px}.player-card-turn{background:#3cba92;background:var(--turn)}.player-card span{font-size:smaller;font-weight:lighter}.loading-ellipses:after{animation:ellipsis 2s step-end infinite;content:"";display:inline-block}.message{color:#f5f5f5;font-size:1.6rem;font-weight:500;margin:5px 0}.message-smaller{font-size:smaller}.message-error{color:#f56565;color:var(--error)}.message-smaller{font-size:1.2rem}.message-link{font-size:1rem;overflow-x:scroll}.message-link::-webkit-scrollbar{width:10px}.message-link::-webkit-scrollbar-track{background:#f5f5f5;background:var(--light);border-radius:10px}.message-link::-webkit-scrollbar-thumb{background:#333333bf;background:var(--dark-transparent);border-radius:10px}.message-link::-webkit-scrollbar-thumb:hover{background:#333;background:var(--dark)}.game-invite-link>span{margin:5px 5px 5px 10px}.game-invite-link{align-items:center;border:1px solid #b66df6;border:1px solid var(--purple);border-radius:10px;cursor:pointer;display:flex;padding:5px 10px;width:clamp(200px,80vw,420px)}.purple-text{color:#b66df6;color:var(--purple)}.green-text{color:#3cba92;color:var(--green)}.red-text{color:#f56565;color:var(--loss-red)}.grey-text{color:#707070;color:var(--grey)}@keyframes ellipsis{0%{content:""}25%{content:"."}50%{content:".."}75%{content:"..."}to{content:""}}.ongoing-games{display:flex;flex-direction:column;gap:1rem;margin-top:2vh}.ongoing-game-card{display:flex;gap:2vw;justify-content:center}.ongoing-games-player-card{background:#f5f5f599;background:var(--light-transparent);border-radius:20px;display:grid;padding:0 1rem;place-content:center}.ongoing-games-player-card>p{font-size:1rem}.ongoing-games-player-card>span{font-size:1.3rem;font-weight:600}section#profile{display:flex;flex-direction:column}#previous-games-container{border:1px solid #f5f5f5;border:1px solid var(--light);border-radius:10px;margin:1rem 0;padding:1rem}.previous-games{align-items:center;display:flex;flex-direction:column;gap:2vh;margin:1rem 0;max-height:80vh;overflow:auto}.previous-games article{align-items:center;display:flex;gap:3vw;justify-content:space-around;max-width:80%}.previous-games article>p{color:#f5f5f5;color:var(--light);display:flex;flex-direction:column;font-size:1.2rem}.previous-games article span{font-weight:bolder}.previous-game-player-info{border:1px solid #f5f5f5;border:1px solid var(--light);border-radius:15px;color:#f5f5f5;color:var(--light);min-width:115px;padding:1rem}.win{background-color:#3cba92bf;background-color:var(--win-green-transparent)}.loss{background-color:#f56565bf;background-color:var(--loss-red-transparent)}.draw{background-color:#333;background-color:var(--dark)}.loss-text{color:#f56565;color:var(--loss-red)}.win-text{color:#3cba92bf;color:var(--win-green-transparent)}.draw-text{color:#333;color:var(--dark)}.text-red{color:#f56565;color:var(--error)}.leaderboard{align-items:center;display:flex;flex-direction:column}.leaderboard-table{background:#333333bf;background:var(--dark-transparent);border:1px solid #f5f5f599;border:1px solid var(--light-transparent);border-radius:1rem;color:#f5f5f5;color:var(--light);font-size:1rem;margin-top:2vh;max-width:500px;width:60%}.leaderboard-table tbody,.leaderboard-table thead{padding:1rem}.leaderboard-table tr{padding:10px 5px}.leaderboard-table td:not(:last-of-type),.leaderboard-table th:not(:last-of-type){border-right:1px solid #f5f5f599;border-right:1px solid var(--light-transparent)}.leaderboard-table td{padding:5px}.leaderboard-table tr:nth-child(2n-1){background-color:#20222266;background-color:var(--darker-transparent)}.leaderboard-table a{font-weight:400}.leaderboard-table td.position{color:#b66df6;color:var(--purple)}span#crown{color:gold;color:var(--gold)}
/*# sourceMappingURL=main.4afdd07b.css.map*/