.board,.card{position:relative;width:100%;max-width:400px;aspect-ratio:1 / 1;display:flex;align-items:center;justify-content:center;background:var(--grey3)}.card{max-width:calc((100vw - 40px) / 3)}.board{background:transparent;height:400px}.empty{font-family:Rubik;color:var(--white);text-align:left;padding:5px 0}.page{height:100%;display:flex;flex-wrap:nowrap;align-content:center;flex-direction:column;justify-content:space-between}.gameWrapper .page-global{grid-template-columns:1fr 5fr 1fr}.turn-indicator{font-size:24px;color:var(--white)}.page-global{background:var(--grey4);display:grid;grid-template-columns:1fr 1fr 1fr;width:calc(100% - 20px);align-items:center;padding:5px 10px;justify-content:space-between;z-index:2}.page-footer{padding-bottom:20px}.page-global h1{font-size:24px;color:var(--white);margin:0}.notification{position:absolute;top:0;z-index:3;width:calc(100% - 20px);left:0;background:var(--grey4);padding:10px;border-radius:0 0 10px 10px;display:flex;justify-content:space-between}.notification .response{display:flex;gap:10px}.notification .response button{transform:translateY(-2.5px);aspect-ratio:1 / 1;height:35px;padding:0 15px}.notification .response button.dull{background:var(--dull1);padding:0;width:37.5px;box-shadow:0 5px 0 0 var(--dull2)}.notification .alert{font-family:Rubik;text-align:left;color:var(--white);font-weight:500;font-size:14px}.notification .alert .title{font-size:16px;font-weight:700;margin-bottom:2px}.notification .alert .challenger{display:flex;gap:5px}.notification .alert .challenger .trophies,.friends .trophies{font-size:14px;font-weight:500;justify-content:flex-start}.trophies{color:var(--white);font-size:18px;font-family:Rubik;font-weight:700;display:flex;align-items:center;justify-content:center;gap:2px}.page-global p{font-size:20px;color:var(--white);margin:0;text-align:right}.page-logo{display:flex;align-items:center;gap:5px}.page-logo img{border-radius:10px}.page-content{flex:1;padding:10px;overflow-y:auto}#addToHomeScreenMessage{position:absolute;bottom:50%;left:50%;transform:translate(-50%,50%);background-color:var(--white);border:1px solid #000000;padding:20px;border-radius:5px;color:var(--grey4);font-size:20px;box-shadow:0 2px 5px #0003;z-index:1000;width:85%;font-family:Rubik;font-weight:600}.page-content h2{font-size:24px;font-weight:700;font-family:Rubik;text-align:left;color:var(--white);margin-bottom:0;display:flex;align-items:center}.page-content h2 span{background:var(--grey2);padding:0 5px;border-radius:5px;margin-left:5px}.friends{border-radius:5px;overflow:hidden}.friend{display:grid;grid-template-columns:3fr 1fr;align-items:center;padding:10px 0}.friend:first-of-type{border-top:0px solid var(--grey2)}.friend:last-of-type{border-bottom:0 solid var(--grey2)}.friend .challenge{display:flex;justify-content:flex-end}.friend button{padding:2px;font-size:0;box-shadow:0 3px 0 0 var(--yellow4)}#userSearch{font-size:14px;font-weight:700;font-family:Rubik;text-align:left;background:var(--grey2);color:var(--white);align-items:center;width:calc(100% - 16px);border:0;padding:8px;border-radius:4px;margin:24px 0 8px;outline:0}.game-room-popup{background:var(--grey4);padding:50px;width:calc(90% - 100px);margin:auto;border-radius:10px}.game-room-popup h1{font-size:42px}.game-room .game-room-popup p{color:var(--white)}#userSearch::placeholder{color:var(--white);opacity:.75}.search.friends{background:var(--grey4);padding:10px;margin:auto}.search .friend button,.requests .friend button{font-size:14px;padding:2px 8px}.search .friend button.disabledButton{font-size:14px;padding:2px 8px;font-weight:600;background:#ffffff1a;box-shadow:none;transform:scale(1)}.friend .friendname{text-align:left;font-size:14px;font-weight:400;color:var(--white);font-family:Rubik}.friend .fullname{text-align:left;font-size:14px;font-weight:400;color:var(--dull1);font-family:Rubik}.card{aspect-ratio:1 / 1;background:var(--grey4);cursor:pointer;transition:0s ease;border-radius:10px;height:100%;width:100%}.confirmation-box{height:80px;display:flex;gap:10px;width:95%;justify-content:space-around;align-items:center}.confirmation-box:nth-of-type(1){transform:rotate(180deg)}.confirmation-box:has(.hidden){border-width:0}.confirmation-box .button-holder{width:min-content;display:contents}.confirmation-box button{outline:0;border:0;border-radius:10px;padding:5px 20px;font-size:20px;font-family:Rubik;font-weight:700;text-transform:capitalize;width:min-content}.button-holder.dull button{background:transparent;color:#666;box-shadow:none}.notification-page{position:static;border-radius:10px;flex-direction:column;gap:20px;align-items:center;padding:40px 0}.notification-page-content{display:flex;align-items:center;justify-content:center}.notification-page *{text-align:center}.notification-page .alert .title{font-size:32px}.notification-page .alert .challenger{font-size:18px;justify-content:center}.notificationsDenied{font-family:Rubik;background:#8b0000;padding:10px;font-size:16px;font-weight:500;color:var(--white);border-radius:0;border:5px solid red}.card{transition:.25s ease transform}.card.selected,.card.selected:hover{transform:translateY(-10px);background:var(--grey2)}.card .center{background:var(--grey5)}.player-hand{display:grid;grid-template-columns:1fr 1fr;width:calc(100% - 20px);max-width:100%;height:135px;padding:10px 10px 25px;grid-column-gap:10px;grid-row-gap:2px;color:#000;letter-spacing:1px;font-size:20px;justify-items:center}.homescreen h1{margin-bottom:0}.homescreen p{font-family:Rubik;font-size:18px;font-weight:700;margin:0;color:#e5b10a}.player-hand div{color:#fff2cc;border-color:#fff2cc!important}.top{transform:rotate(180deg)}.player-hand:has(.ignore){grid-template-columns:1fr 1fr 1fr}.min-game-board{width:42%;aspect-ratio:1/1;display:flex;background:var(--grey4);border-radius:20px;overflow:hidden}.min-game-board .game{background:var(--grey4)}.min-game-board.flip-staged{transform:rotate(180deg)}.game-list{margin-top:5px}.game-list-item{font-family:Rubik;color:var(--white);display:flex;margin:20px 0}.game-list-item .opponent{padding:10px;text-align:left;flex:1;display:flex;justify-content:space-evenly;flex-direction:column}.game-list-item .opponent .username{font-weight:600;margin-bottom:5px}.min-game-board .game{justify-content:center}.player-hand .ignore{filter:grayscale(1);opacity:.5}.hex-tile,.card-hex{position:absolute;width:77px;height:75px;background:var(--yellow2);clip-path:polygon(25% 5%,75% 5%,100% 50%,75% 95%,25% 95%,0% 50%);display:flex;align-items:center;justify-content:center;color:#999}.card-hex.center{background:var(--grey5)}.card-hex{width:24px;height:23px;pointer-events:none}.hex-tile{pointer-events:none}.hex-tile.active-player{cursor:pointer;pointer-events:all}.hex-tile.highlight{background:var(--yellow3)}.hex-tile.selected{background:#e6900a}.hex-tile.move img{filter:brightness(.75) grayscale(1);opacity:.5}.hex-tile.move{cursor:pointer;pointer-events:all}.hex-tile.move:after,.card-hex.move:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:#b78000;clip-path:inherit;z-index:-1;transform:scale(.25)}.hex-tile.move.start:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:#b78000;clip-path:polygon(25% 5%,75% 5%,100% 50%,75% 95%,25% 95%,0% 50%);z-index:1;transform:scale(.25,.2) translateY(50px)}.hex-tile.move.start-1:before{transform:scale(.25,.2) translateY(-50px)}.hex-tile.move.start:after{transform:scale(0)}.card-hex.move{background:#e6900a}.card-hex.move:after{transform:scale(0);background:#000}.hex-tile.start.start-2{clip-path:polygon(50% 5%,50% 5%,100% 61.5%,75% 95%,25% 95%,0% 61.5%);height:100px;margin-top:-22px;padding-top:0}.hex-tile.start.start-2 .piece{transform:translateY(10px)}.hex-tile.start.start-1{clip-path:polygon(25% 5%,75% 5%,100% 38.5%,50% 95%,50% 95%,0% 38.5%);height:100px;margin-bottom:-22px;padding-top:0}.hex-tile.start.start-1 .piece{transform:translateY(-10px)}.piece{font-size:24px}.player1{color:#00f}.player2{color:red}.queen{font-weight:700}.extraCard{position:absolute;top:50%;left:calc(100% + 10vw);transform:translateY(-50%) translate(-100%);width:100%;padding:10px 0;padding-right:10vw;background:#fff2cc;box-shadow:0 0 8px #873900;border-radius:20px 0 0 20px;display:flex;justify-content:center;display:none}.extraCard .card{width:50%;background:transparent}.piece{max-width:100%;max-height:100%;display:flex;align-items:center;justify-content:center}.piece.queen img{width:70%;height:70%}.piece.pawn img{width:50%;height:50%}.player1 img{transform:rotate(180deg)}.gameWrapper .page-footer{background:var(--grey5)}.footer-button{padding:5px;display:flex;flex-direction:column;color:#fff2cc;font-weight:500;font-family:Rubik;align-items:center;font-size:12px}.empty button{width:100%}.popup{position:absolute;bottom:0;z-index:100;background:var(--grey5);width:100%;padding:40px 0;border-radius:50px 50px 0 0;font-family:Rubik;animation:slideUp 1s ease-out forwards}.recent-game-list-item{padding:10px 0;border-top:2px solid rgba(0,0,0,.1);color:var(--white)}.recent-game-list-item .opponent{display:grid;grid-template-columns:3fr 10fr 8fr 4fr;width:100%}.recent-game-list-item .opponent .info,.recent-game-list-item .reason{display:flex;flex-direction:row;align-items:center;gap:5px;color:var(--white);font-size:14px;font-family:Rubik}.recent-game-list-item .reason{color:var(--dull1)}.recent-game-list-item .opponent .info .trophies{font-size:14px;font-weight:400}.result .winorlose{background:#000;aspect-ratio:1 / 1;width:24px;font-size:20px;font-weight:800;display:flex;align-items:center;justify-content:center;border-radius:4px}.result .win{background:#43c76b}.result .lose{background:#e15858}.trophyChange{display:flex;align-items:center;justify-content:center;font-size:20px;letter-spacing:.5px;gap:2px}.trophyChange img{margin-bottom:2px}@keyframes slideUp{0%{bottom:-100%;opacity:0}to{bottom:0;opacity:1}}.popup.menu.open{left:5%}.popup.menu{height:350px;width:90%;padding-right:5%;border-radius:10px 0 0 10px;left:calc(100% - 10px);transition:.25s ease;transform:translateY(calc(-50% - 15px))}.popup h1{font-size:36px;font-weight:800;margin:0}.popup p{margin:0 0 10px;font-size:24px;font-weight:500;color:var(--white)}.popup .winner-bee{width:75px;height:75px;border-radius:100%;margin:20px 0;animation:float 3s ease-in-out infinite}.popup h2{color:var(--white);display:flex;align-items:center;justify-content:center;gap:5px}@keyframes float{0%{transform:translateY(0) scale(1)}50%{transform:translateY(-10px) scale(1.05)}to{transform:translateY(0) scale(1)}}.footer{display:grid;grid-template-columns:1fr 1fr 1fr;width:100%;height:20px;color:#fff2cc;font-size:16px;background:#ffce31;font-family:Rubik;font-weight:700;margin-bottom:-2px;transform:translateY(-1px);display:none}.footer div{display:flex;align-items:center;flex-direction:column;height:60px;padding-top:2px;color:#fff2cc;justify-content:space-evenly}.footer div img{height:24px;aspect-ratio:1/1}.bracket{height:4px;border-width:2px 2px 0px;border-top-style:solid;border-right-style:solid;border-bottom-style:initial;border-left-style:solid;border-top-color:#000;border-right-color:#000;border-bottom-color:initial;border-left-color:#000;border-image:initial;border-radius:4px 4px 0 0}.online button{background:#ffce31;outline:0;border:0;border-radius:10px;box-shadow:0 5px #e5b10a;padding:5px 20px;font-size:20px;font-family:Rubik;font-weight:700;text-transform:capitalize;width:45%}.online h1{margin-bottom:10px}.online{display:flex;flex-direction:column;gap:40px}.online .friends{width:calc(90% - 10px);margin:auto;padding:5px;border-radius:5px;background:#ffce31;min-height:46px}.online .friend{display:grid;width:calc(100% - 10px);border-bottom:1px solid #E5B10A;border-top:1px solid #E5B10A;grid-template-columns:1fr 1fr;font-family:Rubik;font-weight:600;color:#000;align-items:center;text-align:left;padding:10px 5px;font-size:18px}.online .friend:first-child{border-top:0}.online .friend:last-child{border-bottom:0}.online .friend button{width:100%;text-align:center;padding:5px 10px;box-shadow:0 5px #000;background:#333;color:#eee;font-size:16px;margin-top:-3px}.game-room{display:contents}.game-room p{color:var(--dull1);font-family:Rubik;font-size:18px}.online-game.p1{transform:rotate(180deg)}.bracket-label,.bracket{display:none}:root{--white: #fffbee;--black: #000000;--yellow1: #ffe77a;--yellow2: #fbee77;--yellow3: #e6b10a;--yellow4: #b58a00;--yellow5: #433801;--grey1: #3b708d;--grey2: #375f75;--grey3: #2b4350;--grey4: #212c31;--grey5: #13181b;--dull1: #919191;--dull2: #696969}html{background:var(--grey4)}html{height:100%;overflow:hidden;overscroll-behavior:contain;position:fixed;width:100%}body{background:var(--grey4);display:flex;margin:0;height:100vh;align-items:center}#root{max-width:100vw;width:450px;margin:0 auto;padding:0;text-align:center;height:900px;max-height:100vh;font-family:Odibee Sans;justify-content:center;display:flex;overflow:hidden;flex-direction:column;position:relative;background-color:var(--grey3);background-repeat:repeat}h1{font-weight:400;font-size:32px;margin-top:0;margin-bottom:10px;color:var(--white)}.basic-instructions{color:#fff;font-family:Rubik;font-size:24px;font-weight:700;padding:5px}.auth-buttons{display:flex;flex-direction:column;width:66%;margin:0 auto;gap:20px}button{background:var(--yellow3);outline:0;border:0;border-radius:10px;box-shadow:0 5px 0 0 var(--yellow4);padding:10px;font-size:20px;font-family:Rubik;font-weight:800;text-transform:capitalize;color:var(--white)}button:focus{transform:scale(.95)}.settings-buttons{width:66%;margin:0 auto 20px;color:var(--white);font-weight:700;font-size:20px;display:flex;justify-content:space-between;align-items:center}.settings-buttons label{margin-bottom:-2px}.settings-buttons button{width:100px}.settings-buttons button.off{width:100px;filter:grayscale(.5);opacity:.5}.auth-buttons button:focus{transform:scale(.95)}.min-game-board{zoom:.4;pointer-events:none}@media only screen and (max-width: 450px){.aigame .board{transform:scale(.8);height:300px}}.min-game-board .game *{pointer-events:none!important}.header{background:#ffce31;height:21px;margin-top:-2px;transform:translateY(1px);display:none}.game{height:min(100% - 0px,100vh - 0px);width:100%;overflow:hidden;display:flex;align-items:center;flex-direction:column;background:var(--grey3);justify-content:space-between}.aigame .game,.aigame .confirmation-box{transform:rotate(180deg)}.game.flips:has(.top .ignore){transform:rotate(180deg)}.hidden button{opacity:0;pointer-events:none}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}.bottom-notification{background:#fff;position:absolute;width:100%;margin:auto;left:0}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (prefers-reduced-motion: no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.read-the-docs{color:#888}