@font-face{font-family:Titan One;font-weight:700;src:url(/assets/TitanOne-Regular-Ds7Echb6.ttf) format("truetype")}@font-face{font-family:Jost;src:url(/assets/Jost-VariableFont_wght-BvwSITGa.ttf) format("truetype")}@font-face{font-family:Jost;font-style:italic;src:url(/assets/Jost-Italic-VariableFont_wght-CRdCj9Xl.ttf) format("truetype")}@font-face{font-family:"Noto Color Emoji";src:url(/assets/NotoColorEmoji-Regular-YuApCPkg.ttf) format("truetype")}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}#root{--primary-color: rgb(128, 0, 128);--scale: 1}#root,body{background-color:#000;font-family:Jost,sans-serif;width:100vw;height:100dvh;overflow:hidden}h1,h2{font-family:Titan One,sans-serif;font-weight:700;margin:0}*{-ms-overflow-style:none;scrollbar-width:none;cursor:none!important}*::-webkit-scrollbar{display:none}.App{transform:scale(var(--scale));transform-origin:top left;height:calc(100dvh / var(--scale));width:calc(100vw / var(--scale))}@media(max-width:800px){.hatsLobbyNavNext{visibility:hidden}.roomInfo{padding:25px!important}}.background{position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1}.content{position:relative;width:100%;height:100%;overflow:hidden}.homeScreen{position:relative;width:100%;height:100%}.gameScreen{position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;width:100%;height:100%}.gameScreen.prev{animation:gameScreenSlideOut .6s forwards}.gameScreen.current{opacity:0;animation:gameScreenSlideIn .6s forwards;animation-delay:.2s}.gameScreen.prev.backwards{animation:gameScreenSlideOutReverse .6s forwards}.gameScreen.current.backwards{opacity:0;animation:gameScreenSlideInReverse .6s forwards;animation-delay:.2s}@keyframes gameScreenSlideOut{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(-200px)}}@keyframes gameScreenSlideIn{0%{opacity:0;transform:translate(200px)}to{opacity:1;transform:translate(0)}}@keyframes gameScreenSlideOutReverse{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(200px)}}@keyframes gameScreenSlideInReverse{0%{opacity:0;transform:translate(-200px)}to{opacity:1;transform:translate(0)}}.game{width:100%;height:100%}.addFriendContainer{font-family:Titan One,sans-serif;font-size:60px;color:#fff;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:20px}.roomScreen{display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%}.loginScreen{position:relative;display:flex;flex-direction:column;align-items:center;width:100%;height:100%}.loginInputs{margin-top:30vh;width:380px}.inputContainer{position:relative}.loginText,.loginApprovalText{width:100%;font-size:20px;font-style:italic;font-weight:700;text-align:center}.errorIcon{position:absolute;right:14px;top:28px;transform:translateY(-50%);color:#e99c38;display:none;transition:transform .5s}.loginApprovalText{color:#fff}.inputContainer:has(input:focus) .errorIcon{transform:translateY(calc(-50% - 10px))}.usernameInput,.passwordInput{padding-right:40px!important}.cardContainer{position:relative;display:flex;flex-wrap:wrap;justify-content:center;width:1080px;height:720px;flex-shrink:0}.card3dContainer{perspective:400px}.card{transform-style:preserve-3d;user-select:none;-webkit-user-select:none;box-shadow:0 10px 10px #000;width:200px;height:120px;box-sizing:border-box;border-radius:8px;padding:0;margin:8px}.cardFront{font-weight:700;color:#fff;width:200px;height:120px;box-sizing:border-box;display:flex;justify-content:center;align-items:center;border:1px solid white;border-radius:8px;padding-left:5px;padding-right:5px;text-align:center;word-break:break-word;overflow:hidden}.cardBack{position:absolute;top:0;left:0;text-align:center;word-break:break-word;width:200px;height:120px;box-sizing:border-box;padding:5px;border:1px solid;border-radius:8px;transform:translateZ(-.1px) rotateY(180deg);box-shadow:0 0 10px #00000080;display:flex;justify-content:center;align-items:center;overflow:hidden}.spymasterMark{position:absolute;transform:translateZ(-.2px) rotateY(180deg);top:0;left:0;padding:3px;box-sizing:border-box;width:100%;height:100%;display:flex;justify-content:flex-end;pointer-events:none}.cardFill{background-size:200% 200%;animation:cardFill 1s forwards}@keyframes cardFill{0%{background-position:right top}to{background-position:left bottom}}.controlsContainer{position:absolute;bottom:-130px;height:130px;display:flex;justify-content:center;align-items:flex-end;width:100%}.button{position:relative;font-weight:700;font-size:24px;color:var(--primary-color);background-color:transparent;height:60px;box-sizing:border-box;display:flex;justify-content:center;align-items:center;margin:8px;border-radius:30px;padding:10px 18px;text-align:center;user-select:none;-webkit-user-select:none;overflow:hidden;animation:fall .5s forwards;outline:none;border:none}.button:hover,.button:focus{animation:rise .5s forwards;color:#fff;text-shadow:0 0 5px white}.button:not(:hover)>.buttonHoverCircle{display:none}.buttonBg{position:absolute;inset:0;border-radius:inherit;pointer-events:none}.buttonHoverCircle{display:none;background-color:#fff;position:absolute;border-radius:100%;width:250%;transition:all .5s;animation:buttonHoverCircle .6s forwards;z-index:1;aspect-ratio:1 / 1}@keyframes buttonHoverCircle{0%{transform:translate(-50%,-50%) scale(0)}to{transform:translate(-50%,-50%) scale(1)}}.promptInputContainer{position:relative;width:100%;display:flex;justify-content:center;margin-top:10px}.promptInput{position:relative;font-weight:700;font-size:24px;color:#000;box-sizing:border-box;display:flex;justify-content:center;align-items:center;margin:8px;border:4px solid white;border-radius:30px;padding:10px 14px;width:367px;outline:none;animation:fall .5s forwards;background-size:200% 100%;background-position-x:-100%}.promptInput:focus{color:var(--primary-color);border-color:var(--primary-color);animation:rise .5s forwards}@keyframes rise{0%{transform:translateY(0);box-shadow:0 0 #00000080}to{transform:translateY(-10px);box-shadow:0 10px #00000080}}@keyframes fall{0%{transform:translateY(-10px);box-shadow:0 10px #00000080}to{transform:translateY(0);box-shadow:0 0 #00000080}}.cursor{position:absolute;pointer-events:none;z-index:1001}.handCursor{transform-origin:top left}.penCursor{transform-origin:bottom left;margin-top:-24px}.cursor.local{z-index:1010}.penCursorAnimation{position:absolute;width:12px;height:12px;border-radius:50%;transform:translate(-50%,-100%);pointer-events:none;animation:penCursorPulse .2s infinite;z-index:1000}@keyframes penCursorPulse{0%{transform:translate(-50%,-100%) scale(.8);opacity:.3}50%{transform:translate(-50%,-100%) scale(1.4);opacity:.05}to{transform:translate(-50%,-100%) scale(.8);opacity:.3}}.spymasterCursor{position:absolute;width:24px;height:24px;border-radius:50%;transform:translate(-50%,-50%);border:2px dashed;pointer-events:none;transition:width 1.8s ease-in-out,height 1.8s ease-in-out;z-index:1000;overflow:hidden}.powerCursor{position:absolute;width:22px;height:22px;border-radius:50%;transform:translate(-50%,-50%);border:1px solid white;pointer-events:none;z-index:1000;display:flex;justify-content:center;align-items:center}.powerCursorGlow{position:absolute;width:100%;height:100%;border-radius:50%;box-sizing:border-box;mix-blend-mode:screen;animation:outerGlowAnimation .6s infinite}@keyframes rotateCursor{0%{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}.clickCircle{position:absolute;width:12px;height:12px;border-radius:50%;transform:translate(-50%,-50%);border:1px solid;pointer-events:none;animation:growThenFade .5s forwards;z-index:1000}@keyframes growThenFade{0%{transform:translate(-50%,-50%) scale(0);opacity:.4}to{transform:translate(-50%,-50%) scale(8);opacity:0}}.userCardStackContainer{position:absolute;left:0;bottom:0;height:250px;width:100%;display:flex;padding:20px;box-sizing:border-box;pointer-events:none;transition:transform .8s ease-in-out;overflow:visible}@keyframes stackContainerFadeIn{0%{opacity:0;transform:translateY(200px)}to{opacity:1;transform:translateY(0)}}.userCardStack{position:relative;display:flex;flex-shrink:0;height:350px;transform-style:preserve-3d;perspective:1000px;transform:scale(.6);transition:transform .4s ease-in-out,left .4s ease-in-out,right .4s ease-in-out}.userCardStackHoverRegion{position:absolute;top:0;left:0;width:100%;height:100%;z-index:-10;pointer-events:all}.userCardStack.left{position:absolute;left:20px;bottom:20px;transform-origin:bottom left}.userCardStack.right{position:absolute;right:20px;bottom:20px;transform-origin:bottom right}.userCardStack:hover{transform:scale(1)}.userCardStack:hover .userCardStackLabel{opacity:0}.userCardStackLabel{font-family:Titan One,sans-serif;position:absolute;bottom:-24px;font-size:60px;font-weight:700;user-select:none;-webkit-user-select:none;text-shadow:0 5px 15px var(--primary-color);z-index:1000;transition:opacity .4s ease-in-out}.userCardStack.left .userCardStackLabel{left:-10px}.userCardStack.right .userCardStackLabel{right:-10px}.userCardStackForAddFriend{perspective:1000px;transform-style:preserve-3d}.userCard{position:relative;transform-style:preserve-3d;width:250px;height:350px;font-family:Jost,sans-serif;font-size:12px;display:flex;flex-direction:column;justify-content:center;align-items:center;flex-shrink:0;color:#fff;margin-bottom:10px;border:4px solid;border-radius:30px;animation:rotate3d 20s linear infinite;transition:transform .4s cubic-bezier(.23,1,.32,1),box-shadow .4s cubic-bezier(.23,1,.32,1),left .4s cubic-bezier(.23,1,.32,1),right .4s cubic-bezier(.23,1,.32,1);pointer-events:all;user-select:none;-webkit-user-select:none}.userCard.hovered{box-shadow:0 20px 20px #00000080}.userCardName{position:absolute;bottom:20px;font-weight:700;font-size:20px;display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;min-height:54px;padding:6px;box-sizing:border-box;user-select:none;-webkit-user-select:none;margin-bottom:10px;margin-top:10px;text-align:center;word-break:break-word;line-height:16px}.userCardNameSubtitle{color:#fff;font-size:14px;font-weight:400;font-style:italic}.userCardWins{position:absolute;top:20px;font-weight:700;font-size:20px;display:flex;justify-content:flex-end;align-items:center;width:100%;min-height:54px;box-sizing:border-box;user-select:none;-webkit-user-select:none;margin-bottom:10px;margin-top:10px;text-align:center;word-break:break-word;line-height:16px}.userCardWinItem{position:relative;font-size:16px;width:36px;height:36px;margin-right:8px;border:2px solid white;background-size:140% 55%;background-position:center;background-repeat:no-repeat;border-radius:25px;white-space:nowrap;display:flex;justify-content:center;align-items:center;text-shadow:1px 1px 0 white,-1px -1px 0 white,1px -1px 0 white,-1px 1px 0 white}.userCardStatus{position:absolute;font-size:16px;bottom:7px}.userCardControls{position:absolute;top:30px;width:180px;padding:10px;border-radius:12px;display:none;flex-direction:column;align-items:center;gap:6px;user-select:none;-webkit-user-select:none;background-color:#ffffffc4;transform:translateZ(30px);animation:fadeIn .4s forwards;box-shadow:0 10px 20px #0000004d}.userCardControlsItem{font-size:12px;color:#000;cursor:pointer;transition:transform .2s,color .2s,text-shadow .2s}.userCardControlsItem:hover{transform:scale(1.05);color:var(--primary-color);text-shadow:0 0 5px rgba(0,0,0,.5)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleIn{0%{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}.userCard:hover>.userCardControls{display:flex}.userCardControlsInputContainer{position:relative;width:100%;display:flex;color:#000}.userCardControlsInput{font-family:Poppins,sans-serif;width:100%!important;border:2px solid transparent!important;border-radius:20px;padding:5px 30px 5px 12px;box-sizing:border-box;font-size:16px;outline:none;transition:border-color .3s}.userCardControlsInput:hover{border-color:#d3d3d3!important}.userCardControlsInput::placeholder{color:#000;font-style:italic}.userCardControlsInput:focus+.userCardControlsInputIcon{color:gray}.userCardControlsInput:focus{border-color:var(--primary-color)!important}.userCardControlsInput:focus::placeholder{color:#00000080}.userCardControlsInputIcon{position:absolute;right:6px;top:5px;color:#d3d3d3;cursor:pointer}.userCardControlsInput:focus+.userCardControlsInputIcon:hover{color:var(--primary-color)!important}.userCardGrayscaleOverlay{position:absolute;inset:-4px;border-radius:30px;-webkit-backdrop-filter:grayscale(100%);backdrop-filter:grayscale(100%);pointer-events:none;user-select:none;-webkit-user-select:none}.hideUserCards{position:absolute;opacity:.4;bottom:10px;left:50%;transform:translate(-50%);font-weight:700;font-size:18px;color:#fff;user-select:none;-webkit-user-select:none;cursor:pointer;transition:background-color .3s,color .3s,border-color .3s;pointer-events:all}.teamContainer{user-select:none;-webkit-user-select:none;position:relative;font-size:24px;font-weight:700;text-align:center;border:4px solid;padding:10px;border-radius:30px;margin-bottom:10px;width:100%}.teamContainer:before{mix-blend-mode:difference;content:"";border:4px solid;width:100%;height:100%;position:absolute;top:0;left:-4px;border-radius:30px}.playerContainer{position:absolute;right:-200px;width:180px;display:flex;flex-direction:column;align-items:center;height:100%}.player{position:relative;color:#fff;font-weight:400;border:4px solid transparent;font-size:18px;display:flex;justify-content:center;align-items:center;border-radius:30px;min-width:100px;padding:10px 13px;box-sizing:border-box;user-select:none;-webkit-user-select:none;margin-bottom:10px;margin-top:10px;text-align:center;word-break:break-word}.playerText{z-index:1}.spymasterIcon{color:#fff;mix-blend-mode:overlay;position:absolute;right:1px;top:1px}.roomText{position:absolute;top:0;width:100%;height:100%;left:10px;font-weight:700;white-space:nowrap;user-select:none;-webkit-user-select:none;filter:blur(10px)}.leaveRoomButton{position:absolute;top:10px;left:10px;font-weight:700;user-select:none;-webkit-user-select:none;z-index:10}.scoreMeter{position:absolute;min-width:60px;display:flex;justify-content:center;align-items:center;font-size:24px;font-weight:700;color:#fff;border:4px solid;border-radius:30px;padding:10px;box-sizing:border-box;user-select:none;-webkit-user-select:none;transition:width .5s;z-index:-1;overflow:hidden}.scoreStar{position:absolute;margin:0 auto;top:0;z-index:-10;border-radius:50%;border:4px solid black;box-sizing:border-box}.gameStateContainer{color:#8f93cc;font-weight:700;position:absolute;top:-120px;height:120px;display:flex;justify-content:center;align-items:center;width:100%;text-shadow:0 3px;user-select:none;-webkit-user-select:none;z-index:10}@keyframes gameStateWobble{0%{transform:translateY(0)}20%{transform:translateY(-8px)}40%{transform:translateY(6px)}60%{transform:translateY(-5px)}80%{transform:translateY(0)}to{transform:translateY(0)}}.bombCircle1{position:absolute;mix-blend-mode:color-dodge;background-color:#fff;width:12px;height:12px;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none;animation:bomb1 1s forwards}.bombCircle2{position:absolute;mix-blend-mode:color-burn;background-image:radial-gradient(circle,#eee23b,#e6250b);border-radius:50%;transform:translate(-50%,-50%);pointer-events:none;animation:bomb2 2s ease-in-out forwards}.bombCircle3{position:absolute;background-image:radial-gradient(circle,#000,#000);width:6px;height:6px;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none;animation:bomb3 3s ease-in-out forwards;animation-delay:.05s}@keyframes bomb1{0%{transform:translate(-50%,-50%) scale(0);opacity:0}70%{transform:translate(-50%,-50%) scale(300);opacity:1}to{transform:translate(-50%,-50%) scale(400);opacity:0}}@keyframes bomb2{0%{transform:translate(-50%,-50%) scale(0);opacity:1}to{transform:translate(-50%,-50%) scale(400);opacity:0}}@keyframes bomb3{0%{transform:translate(-50%,-50%) scale(0);opacity:0}50%{transform:translate(-50%,-50%) scale(300);opacity:1}to{transform:translate(-50%,-50%) scale(200);opacity:0}}.victoryOverlay{position:absolute;mix-blend-mode:color;opacity:0;top:0;width:100vw;height:100dvh;display:flex;justify-content:center;align-items:center;font-size:48px;font-weight:700;color:#fff;user-select:none;-webkit-user-select:none;pointer-events:none;z-index:100;transition:opacity ease-out 1s}.cardColumnContainer{position:absolute;top:0;left:0;display:flex;justify-content:space-between;height:100%;width:100%}.cardColumn{position:relative;color:#000;height:100%;width:200px;filter:blur(2px)}.cardColumn3dContainer{perspective:400px;position:absolute;top:0;left:0}.cardColumnCard{transform-style:preserve-3d;position:absolute;top:0;left:0;width:200px;height:120px;box-sizing:border-box;border-radius:8px;padding:0;margin:8px;display:flex;justify-content:center;align-items:center;border:1px solid black;background-color:#fff;font-weight:700;font-size:24px;text-align:center;word-break:break-word;overflow:hidden;user-select:none;-webkit-user-select:none}.instructionalText{font-weight:700;color:#fff;font-style:italic;margin-bottom:6px;user-select:none;-webkit-user-select:none}.powerContainer{position:absolute;left:-200px;width:180px;display:flex;flex-direction:column;align-items:center;height:100%}.power{position:relative;width:130px;height:130px;border-radius:100px;margin:15px;box-sizing:border-box;border:12px solid;display:flex;justify-content:center;align-items:center;transition:transform .2s ease-in-out;animation:glowAnimation .4s infinite}.power:hover{transform:scale(1.15) translateY(-10px);z-index:10;box-shadow:0 20px 10px #000}.powerHoverText{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:16px;font-weight:700;color:#fff;text-align:center;display:none;text-shadow:0 0 10px rgba(0,0,0,.5);pointer-events:none}.power:hover>.powerHoverText{display:block;animation:powerHoverTextAnimation ease-in-out .4s forwards}.disabledPower:hover>.powerHoverText{display:block;animation:powerHoverTextAnimation ease-in-out .4s forwards}.heldPower>.powerHoverText{display:block}.heldPower{position:relative;width:130px;height:130px;margin:15px;border-radius:100px;display:flex;justify-content:center;align-items:center;border:4px dashed}@keyframes glowAnimation{0%{box-shadow:0 0 10px #ffffff80}50%{box-shadow:0 0 20px #fff}to{box-shadow:0 0 10px #ffffff80}}@keyframes powerHoverTextAnimation{0%{opacity:0;transform:translate(-50%,-50%) scale(.8)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}.disabledPower{position:relative;width:130px;height:130px;border-radius:100px;margin:15px;box-sizing:border-box;border:12px solid rgba(255,255,255,.5);display:flex;justify-content:center;align-items:center}.powerGlow{position:absolute;width:100%;height:100%;border-radius:100px;box-sizing:border-box;mix-blend-mode:screen;animation:outerGlowAnimation ease-in-out .6s infinite}@keyframes outerGlowAnimation{0%{transform:scale(1.4);opacity:.2}50%{transform:scale(1.5);opacity:.5}to{transform:scale(1.4);opacity:.2}}.power:hover>.powerTextContainer{animation:powerTextContainerAnimation ease-in-out .4s forwards}.powerTextContainer{position:absolute;right:0;top:0;height:100%;display:flex;opacity:0}@keyframes powerTextContainerAnimation{0%{width:150%;opacity:0}to{width:290%;opacity:1}}.powerText{font-size:14px;font-style:normal;font-weight:400;width:180px;text-align:right;color:#fff;user-select:none;-webkit-user-select:none}.powerHeading{font-size:20px;font-weight:700;width:100%}.suggestionLoading{position:absolute;left:50%;top:60%;transform:translate(-50%,-50%)}@keyframes suggestionLoadingAnimation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.mark{width:200px;height:120px;border-radius:8px;transform:translate(-50%,-50%);position:absolute;top:0;left:0;animation:markFlickerJump .8s infinite;display:flex;justify-content:center;align-items:center}@keyframes markFlickerJump{0%{opacity:1;transform:translate(-50%,-50%) scale(1) translate(0) rotate(0)}10%{opacity:.8;transform:translate(-50%,-50%) scale(1.04) translate(3px,-2px) rotate(-2deg)}20%{opacity:.7;transform:translate(-50%,-50%) scale(1.05) translate(6px,-4px) rotate(1deg)}30%{opacity:.6;transform:translate(-50%,-50%) scale(.96) translate(-4px,6px) rotate(-3deg)}40%{opacity:.5;transform:translate(-50%,-50%) scale(.97) translate(-7px,5px) rotate(2deg)}50%{opacity:.85;transform:translate(-50%,-50%) scale(1.03) translate(2px,-5px) rotate(1deg)}60%{opacity:.8;transform:translate(-50%,-50%) scale(1.06) translate(-6px,2px) rotate(-1deg)}70%{opacity:.6;transform:translate(-50%,-50%) scale(1.01) translate(5px,4px) rotate(3deg)}80%{opacity:.7;transform:translate(-50%,-50%) scale(1.08) translate(-8px,-3px) rotate(-2deg)}90%{opacity:.9;transform:translate(-50%,-50%) scale(.99) translate(3px,7px) rotate(2deg)}to{opacity:1;transform:translate(-50%,-50%) scale(1) translate(0) rotate(0)}}.spymasterColorListOuter{position:relative;height:15px;width:200%;transform:translate(25%)}.spymasterColorList{position:absolute;font-size:10px;user-select:none;-webkit-user-select:none;color:#fff;text-align:center;overflow:hidden;height:15px;transition:height .5s ease-in-out}.spymasterColorList:hover{height:500px}.spymasterColorColumnContainer{display:flex;flex-direction:row;flex-wrap:wrap}.spymasterColorColumn{width:25%;text-align:center}.spymasterColorColumn>div{padding:1px 4px;border-radius:5px;margin:2px;text-align:center}.settingItem{color:#fff;font-size:20px;font-weight:700;user-select:none;-webkit-user-select:none;border-top:4px solid white;padding:2px 10px}.settingOptions{display:flex;justify-content:center;width:100%}.settingOption{padding:0 14px}.settingOptionSelected{color:var(--primary-color);text-shadow:1px 1px white,1px -1px white,-1px 1px white,-1px -1px white}.colorPicker{position:relative;width:100%;height:10px;border-radius:15px;margin-top:10px;margin-bottom:4px;background:linear-gradient(to right,red,#ff0,#0f0,#0ff,#00f,#f0f,red);cursor:pointer}.colorPickerSelector{position:absolute;top:50%;width:15px;height:15px;border-radius:50%;border:2px solid white;transform:translate(-50%,-50%);box-shadow:0 0 5px #00000080;background-color:transparent;pointer-events:none}.playerIcon{position:absolute;top:10px;left:10px;width:100px;height:100px;border-radius:50%;border:4px solid;box-sizing:border-box;background-size:cover;background-position:center}.playerIconPickButton{cursor:pointer}.playerIconDelete{position:absolute;top:50%;right:-26px;transform:translateY(-9px);cursor:pointer}.QRContainer{display:flex;flex-direction:column;align-items:center;justify-content:center;border:2px solid transparent;padding:0 5px 5px;border-radius:8px;font-size:14px}.gameOptionsOuter{position:absolute;top:calc(50% - 200px);left:50%}.gameOptionContainer{position:relative}.gameOption{position:relative;width:560px;height:370px;display:flex;justify-content:center;align-items:center;border:6px solid;box-sizing:border-box;background-color:#000;box-shadow:0 10px 20px #00000080}.gameOptionTitle{font-size:60px;font-weight:700;text-shadow:0 0 18px black;color:#fff;z-index:1;user-select:none;-webkit-user-select:none}.gameOptionButton{font-size:16px;position:absolute;left:50%;bottom:40px;transform:translate(-50%);font-weight:700;user-select:none;-webkit-user-select:none;padding:10px 20px;border:4px solid;border-radius:30px;background-color:#fff;cursor:pointer;transition:all .3s}.gameOptionButton.enabled:hover{box-shadow:0 10px 20px #9b9b9b;transform:translate(-50%) translateY(-5px)}.gameOptionButton.disabled{background-color:gray;border-color:#a9a9a9;color:#d3d3d3;cursor:not-allowed}.gameOptionVideo{opacity:.6;position:absolute;top:0;left:0;width:100%;height:100%;box-sizing:border-box;object-fit:cover;filter:blur(2px)}.gameOptionVideoBg{opacity:.6;position:absolute;top:-100px;left:0;width:600px;height:600px;box-sizing:border-box;object-fit:cover;overflow:hidden;filter:blur(10px);-webkit-mask-image:radial-gradient(circle at center,#000,#0000 70%);mask-image:radial-gradient(circle at center,#000,#0000 70%);transform:scale(1.8);transition:opacity 1s;pointer-events:none;z-index:-1}.sliderOuter{display:flex;width:100%;touch-action:pan-x}.sliderInner{display:flex;transition:transform .3s cubic-bezier(.25,.8,.25,1)}.sliderInner.dragging{transition:none}.sliderInner.animating{transition:transform .3s cubic-bezier(.25,.8,.25,1)}.sliderItem{position:absolute;top:0;cursor:grab;transition:transform .3s,opacity .3s}.bgCanvas{position:absolute;top:0;left:0;width:100%;height:100%}.canvasContainer{position:relative;width:calc(100% - 200px);height:calc(100% - 120px);margin:60px 100px;box-sizing:border-box}.drawingCanvas{position:absolute;top:0;left:0;width:100%;height:100%;cursor:crosshair;background-color:#ffffffb0;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-sizing:border-box}.canvasControls{position:absolute;top:0;display:flex;flex-direction:column;gap:6px;user-select:none;-webkit-user-select:none;width:40px;align-items:flex-end}.canvasControls.right{right:-50px}.canvasControls.left{left:-50px}.canvasControlButton{width:40px;height:40px;border-radius:12px;background-color:#fffc;display:flex;justify-content:center;align-items:center;cursor:pointer;box-shadow:0 5px 10px #0000004d;transition:transform .2s,box-shadow .2s;box-sizing:border-box}.canvasControlButton:hover,.strokeHistoryItem:hover,.drawingHistoryItem:hover,.drawingHistoryControl:hover{transform:scale(1.1);box-shadow:0 8px 15px #0006}.canvasControlColorContainer{width:40px;height:40px;position:relative}.canvasControlColorAbsolute{position:absolute;transform:translate(-46px);display:flex;gap:6px;animation:colorScaleIn .5s forwards}@keyframes colorScaleIn{0%{transform:translate(-46px) scale(.6);opacity:0}to{transform:translate(-46px) scale(1);opacity:1}}.canvasControlDivider{width:100%;height:4px;background-color:#0000001a;margin:6px 0;box-sizing:border-box}.strokeHistoryItem{width:60px;height:40px;border-radius:12px;background-color:#fffc;display:flex;justify-content:center;align-items:center;cursor:pointer;box-shadow:0 5px 10px #0000004d;transition:transform .2s,box-shadow .2s;box-sizing:border-box;overflow:hidden;animation:strokeHistoryGrow .6s}.strokeHistoryItemHover{display:none}.strokeHistoryItem:hover .strokeHistoryItemHover{display:block}.strokeHistoryItem:hover .strokeHistoryItemNoHover{display:none}.strokeHistoryOtherUser{width:60px;height:40px;display:flex;align-items:center;justify-content:center;animation:strokeHistoryGrow .6s}@keyframes strokeHistoryGrow{0%{height:0px}to{height:40px}}.drawingHistoryItem{position:relative;width:60px;height:86px;border-radius:12px;padding:5px;background-color:#fffc;display:flex;flex-direction:column;justify-content:center;align-items:center;cursor:pointer;box-shadow:0 5px 10px #0000004d;transition:transform .2s,box-shadow .2s;box-sizing:border-box;animation:drawingHistoryGrow .6s;z-index:2}@keyframes drawingHistoryGrow{0%{overflow:hidden;height:0px}to{overflow:hidden;height:86px}}.drawingHistoryItem:hover .drawingHistoryControlsContainer{display:flex}.drawingHistoryControlsContainer{position:absolute;right:-40px;width:40px;height:100%;display:none;flex-direction:column;justify-content:space-around;align-items:center;animation:fadeIn .4s forwards}.drawingHistoryControl{height:30px;width:30px;display:flex;justify-content:center;align-items:center;border-radius:30px;background-color:#fffc;box-sizing:border-box;border:2px solid;transition:transform .2s,box-shadow .2s}.drawingHistoryColorContainer{width:100%;display:flex;flex-wrap:wrap;justify-content:center}.drawingHistoryColorDot{width:10px;height:10px;border-radius:50%}.roomInfoContainer{position:absolute;width:100%;display:flex;justify-content:center;z-index:9}.roomInfo{position:relative;padding:25px 90px;user-select:none;-webkit-user-select:none;font-size:24px;display:flex;align-items:center;gap:16px;box-shadow:0 10px 20px #0000005d;transition:padding .3s;width:100%}.roomInfo:hover{padding:35px 110px}.roomInfoText{display:flex;flex-direction:column;align-items:flex-start}.roomInfoTitle{font-family:Titan One,sans-serif;font-size:50px;font-weight:700;margin-bottom:1px}.leaveRoomButton{color:var(--primary-color);position:absolute;font-size:14px;left:20px;height:20px;user-select:none;-webkit-user-select:none}.hatsLobbyInputContainer{position:relative;width:600px;height:100%;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center}.hatsNotMyTurnContainer{color:var(--primary-color);position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:1;text-shadow:0 0 10px white}.hatsLobbyNavButtons{position:relative;display:flex;justify-content:space-between;align-items:center;width:100%}.hatsLobbyPromptsSubmitted{font-weight:700;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:20px;color:var(--primary-color)}.hatsLobbyPromptsSubmittedSubtitle{font-style:italic;font-size:14px;color:#000;font-weight:400}.hatsLobbyNavBarContainer{position:absolute;top:20px;width:100%;height:100px;display:flex;justify-content:center;align-items:center;z-index:1}.hatsLobbyNavBar{position:relative;width:80%;min-width:600px;height:60px;border-radius:30px;display:flex;justify-content:space-between;align-items:center;font-size:24px;font-weight:700;color:#000}.hatsLobbyNavBarProgress{position:absolute;top:50%;transform:translateY(-50%);left:0;height:50%;border-radius:30px;background-color:#fff;z-index:-1;transition:width .2s}.hatsLobbyNavBarButtonWrapper{width:0}.hatsLobbyNavBarButton{position:absolute;top:0;padding:10px 20px;border-radius:30px;cursor:pointer;border:4px solid transparent;transition:background-color .3s,color .3s;user-select:none;-webkit-user-select:none}.hatsLobbyNavBarButton.current{background-color:var(--primary-color);border-color:#fff;color:#fff}.hatsLobbyNavSubtitle{font-weight:400;font-size:14px;position:absolute;bottom:0;left:0;width:100%;text-align:center;user-select:none;-webkit-user-select:none}.hatsLobbyNavNext{position:absolute;right:-70px;top:50%;transform:translateY(-50%);font-size:18px;padding:3px 10px;border-radius:30px;cursor:pointer;transition:background-color .3s,color .3s;background-color:var(--primary-color);color:#fff;transition:all .3s}.hatsLobbyNavNext:hover{transform:translateY(-50%) scale(1.05);background-color:#000}.hatsLobbyStartButton{position:relative;font-size:22px;padding:3px 10px;border-radius:30px;cursor:pointer;background-color:var(--primary-color);color:#fff;transition:all .3s;user-select:none;-webkit-user-select:none}.hatsLobbyStartButton.disabled{background-color:gray;cursor:default}.hatsLobbyStartButton.enabled:hover{transform:scale(1.2)}.hatsLobbyStartButton.active.enabled{font-size:30px;padding:10px 25px;animation:hatsLobbyStartButtonBlink .15s infinite}@keyframes hatsLobbyStartButtonBlink{0%{background-color:#07691c}50%{background-color:#0f8528}to{background-color:#07691c}}.hatsLobbyStartSubtitle{color:#000;font-weight:400;font-size:12px;position:absolute;text-align:center;top:100%;left:50%;transform:translate(-50%);width:220px;margin-top:1px;user-select:none;-webkit-user-select:none;white-space:pre-wrap}.instructionsText{font-size:16px;font-weight:700;margin-bottom:10px;user-select:none;-webkit-user-select:none;line-height:22px}.sliderContainer{position:relative;width:100%;margin-top:20px;user-select:none;-webkit-user-select:none;box-sizing:border-box}.sliderLabel{position:absolute;top:0;color:#000;font-size:20px;font-weight:700;padding:0 20px;height:100%;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;line-height:18px}.sliderDescription{font-size:14px;font-weight:400;line-height:16px;font-style:italic}.sliderTrack{position:relative;height:70px;border-radius:999px;background:#fff;cursor:pointer;border:4px solid white;box-sizing:border-box}.sliderTrackFill{position:relative;top:0;left:0;height:100%;border-radius:999px;background:var(--primary-color);pointer-events:none}.sliderHandle{position:absolute;top:50%;transform:translate(-50%,-50%);width:50px;height:50px;border-radius:25px;pointer-events:none}.roundContainerTitle{font-size:18px;font-weight:700;user-select:none;-webkit-user-select:none}.selectedRoundsContainer{font-size:12px;position:relative;margin:0 20px;background-color:#fff;border-radius:48px;padding:14px 22px;box-sizing:border-box;display:flex;flex-direction:column;gap:4px;user-select:none;-webkit-user-select:none}.availableRoundsContainer{display:flex;flex-direction:column;gap:4px;margin:0 20px;padding:4px 22px;user-select:none;-webkit-user-select:none}.roundOption{position:relative;font-size:12px;padding:4px 34px;border-radius:40px;user-select:none;-webkit-user-select:none;cursor:pointer;background-color:var(--primary-color)}.roundOptionTitle{font-size:18px;font-weight:700;color:#fff;user-select:none;-webkit-user-select:none}.roundOption.unselected{background-color:#fff;color:#000}.roundOption.unselected .roundOptionTitle{color:var(--primary-color)}.dropZoneContainer{position:absolute;top:-2px;left:0;width:100%;height:calc(100% + 4px)}.dropZone{height:50%;display:flex;justify-content:center;align-items:center;font-style:italic}.draggingItem{position:absolute;pointer-events:none;z-index:1000;animation:scaleUp .2s forwards}.draggingItem>*{box-shadow:0 10px 20px #00000080}@keyframes scaleUp{0%{transform:scale(1)}to{transform:scale(1.1)}}.cardGhostPositioner{position:absolute;bottom:80px;left:50%}.ghostContainer{position:relative;pointer-events:none;transition:transform .4s ease-in-out}.ghost{position:absolute;bottom:0;left:0;transform-origin:bottom center;user-select:none;-webkit-user-select:none}.ghostBody,.ghostFace,.ghostHat{position:absolute;bottom:0;transform:translate(-50%)}.gameOptionTypewriterContainer{font-size:26px;font-weight:700;text-align:center;line-height:32px;user-select:none;-webkit-user-select:none}@keyframes typewriterFadeIn{0%{opacity:0;transform:translateY(.3em)}to{opacity:1;transform:translateY(0)}}.statusMessage{position:absolute;top:20px;left:50%;transform:translate(-50%);font-size:18px;font-weight:700;color:#fff;background-color:var(--primary-color);user-select:none;-webkit-user-select:none;text-shadow:0 0 10px rgba(0,0,0,.5);padding:10px 20px;border-radius:30px;box-sizing:border-box;animation:statusMessageFadeInOut 4s forwards;z-index:100}@keyframes statusMessageFadeInOut{0%{opacity:0;transform:translate(-50%) translateY(-20px)}10%{opacity:1;transform:translate(-50%) translateY(0)}90%{opacity:1;transform:translate(-50%) translateY(0)}to{opacity:0;transform:translate(-50%) translateY(-20px)}}.hatsPromptSourceContainer{color:#000;position:relative;width:570px;border-radius:40px;padding:10px 20px;box-sizing:border-box;margin-top:10px;margin-bottom:10px;transition:all .4s;background-color:#fff;border:4px solid transparent}.hatsPromptSourceContainer.selected{background-color:#fff;transform:scale(1.1);border:4px solid var(--primary-color);margin-top:25px;margin-bottom:25px}.hatsPromptSourceContent{height:0;overflow:hidden;transition:height .4s}.hatsPromptSourceContainer.selected .hatsPromptSourceContent{height:auto}.promptHistoryContainer{display:flex;flex-wrap:wrap;max-height:220px;overflow-y:scroll;gap:5px;padding-top:10px;padding-bottom:10px;margin-top:8px;-webkit-mask-image:linear-gradient(to bottom,transparent 0,black 10px,black calc(100% - 10px),transparent 100%);mask-image:linear-gradient(to bottom,transparent 0,black 10px,black calc(100% - 10px),transparent 100%)}.promptHistoryItem{position:relative;flex-grow:1;font-size:14px;min-width:80px;max-width:260px;padding:5px 10px;border-radius:8px;border:2px solid;box-sizing:border-box;cursor:pointer;transition:background-color .3s,border-color .3s}.promptHistoryText{font-size:12px}.hatsPromptInput{position:relative;font-family:Jost,sans-serif;font-weight:700;font-size:24px;color:#000;box-sizing:border-box;display:flex;justify-content:center;align-items:center;margin:8px;border:4px solid var(--primary-color);border-radius:30px;padding:10px 14px;width:100%;outline:none;background-size:200% 100%;background-position-x:-100%;transform-origin:center bottom}.offlineMessage{position:absolute;top:50%;left:50%;transform:translate(-50%);font-size:18px;font-weight:700;color:#fff;background-color:red;user-select:none;-webkit-user-select:none;text-shadow:0 0 10px rgba(0,0,0,.5);padding:10px 20px;border-radius:30px;box-sizing:border-box;z-index:1000}.roomInfoButtonsContainer{position:absolute;top:10px;right:10px;display:flex;gap:10px;z-index:10;flex-direction:column}.roomInfoButton{font-size:16px;font-weight:700;color:#fff;padding:10px 20px;border-radius:30px;border:1px solid rgba(255,255,255,.247);user-select:none;-webkit-user-select:none;cursor:pointer;transition:background-color .3s,box-shadow .3s}.roomInfoButton:hover{background-color:#fff3;box-shadow:0 0 10px #ffffff80}.overlay{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#00000080;z-index:1005;display:flex;justify-content:center;align-items:center;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);animation:fadeIn .8s forwards}.historyContainer{min-width:640px;max-width:calc(100vw - 300px);background-color:#fff;padding:20px;border-radius:30px;user-select:none;-webkit-user-select:none;display:flex;flex-direction:column;box-sizing:border-box}.historyList{display:flex;flex-direction:column;gap:10px;width:100%;box-sizing:border-box;max-height:600px;overflow-y:scroll;padding:15px;-webkit-mask-image:linear-gradient(to bottom,transparent 0,black 10px,black calc(100% - 10px),transparent 100%);mask-image:linear-gradient(to bottom,transparent 0,black 10px,black calc(100% - 10px),transparent 100%)}.historyItem{position:relative;background-color:#fffc;padding:10px 10px 40px;border-radius:12px;box-shadow:0 4px 8px #0003;width:100%;box-sizing:border-box;border:2px solid transparent}.historyItemTitle{display:flex;gap:6px;align-items:center}.historyItemInfo{font-family:Titan One,sans-serif;font-size:22px;display:flex;justify-content:space-between;align-items:flex-start}.historyItem.incomplete{border-color:#e44848}.historyItemPlayersContainer{display:flex;align-items:center;gap:10px}.historyItemPromptsContainer{display:flex;flex-wrap:wrap;width:100%;gap:10px}.historyItemOldPromptsBanner{width:100%;color:#fff;border-radius:8px;text-align:center;font-size:12px;font-weight:700;font-style:italic;user-select:none;height:40px;display:flex;justify-content:center;align-items:center;-webkit-user-select:none}.historyItemPrompt{flex-grow:1;position:relative;font-size:14px;word-wrap:break-word;min-width:80px;max-width:300px;padding:10px 10px 25px;background-color:#fffc;box-shadow:0 4px 8px #0003}.historyItemPromptName{position:absolute;right:4px;bottom:4px;font-size:10px}.historyItemLoadButton{position:absolute;bottom:7px;right:7px;font-size:12px;font-weight:700;padding:3px 12px;border-radius:20px;background-color:#e44848;color:#fff;cursor:pointer;-webkit-user-select:none;user-select:none}.historyItemLoadButton:hover{background-color:#881e1e}.historyItemGameTagContainer{margin-top:8px;margin-bottom:8px;display:flex;gap:8px}.historyItemGameTag{padding:3px 12px;border-radius:8px;color:#fff;font-size:12px;font-weight:700}.historyItemDelete{visibility:hidden}.historyItem:hover .historyItemDelete{visibility:visible}.historyItemDrawingsContainer{margin-top:10px;display:flex;flex-wrap:wrap;gap:10px;padding-bottom:10px}.historyItemDrawing{background-color:#fff;height:200px;width:300px;box-shadow:0 4px 8px #0003}.historyItemDate{position:absolute;bottom:5px;left:10px;font-size:12px;font-weight:700;font-style:italic}.historyItemTeamStructureContainer{font-family:Jost,sans-serif;font-size:14px;display:flex;gap:10px;min-height:100%}.historyItemTeamStructure{color:#fff;padding:8px 12px;border-radius:16px;border:2px solid;text-align:center;max-width:220px}.historyItemTeamStructureTitle{font-weight:700;margin-bottom:4px}.screenSizes{position:absolute;left:0;top:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;pointer-events:none}.screenSize{position:absolute;padding:60px 100px;box-sizing:border-box}.screenSizeCanvasBorder{position:relative;width:100%;height:100%;box-sizing:border-box;border:2px dashed;display:flex;justify-content:flex-start;align-items:flex-start;padding:5px 10px;font-size:14px}.hatsPlayersContainer{position:absolute;bottom:0;left:0;width:100%;display:flex;justify-content:space-evenly;pointer-events:none}.hatsPlayerItem{position:relative;flex-shrink:0;display:flex;justify-content:flex-end;flex-direction:column;align-items:center;border:4px dashed;border-radius:30px;box-sizing:border-box;height:150px;margin-bottom:10px;padding-bottom:50px;width:0;transform-origin:center bottom}.hatsPlayerItemTitleContainer{position:absolute;bottom:0;line-height:22px;display:flex;justify-content:flex-end;flex-direction:column;align-items:center;margin-top:10px;text-align:center;height:45px;width:220px;user-select:none;-webkit-user-select:none;text-shadow:1px 1px white,1px -1px white,-1px 1px white,-1px -1px white,1px 0 white,0 1px white,-1px 0 white,0 -1px white;z-index:1}.hatsPlayerItemSubtitle{color:#000;font-size:14px;font-weight:400;font-style:italic;text-shadow:none;user-select:none;-webkit-user-select:none}.hatsPlayerItemTitle{position:relative;font-weight:700;font-size:24px}.hatsPlayerItemRemoveButton{position:absolute;top:50%;transform:translateY(-50%);right:-30px;flex-shrink:0;font-size:18px;color:red;background-color:#fff;border-radius:50%;width:28px;height:28px;display:flex;justify-content:center;align-items:center;cursor:pointer;user-select:none;-webkit-user-select:none;pointer-events:all;z-index:2}.addSubplayerContainer{pointer-events:all;position:absolute;right:20px;bottom:35px;width:125px;text-align:center;font-weight:700;font-style:italic;font-size:12px;padding:4px 10px;border-radius:25px;border:4px dashed black;display:flex;flex-direction:column;justify-content:center;align-items:center;cursor:pointer;box-sizing:border-box;user-select:none;-webkit-user-select:none;z-index:1;opacity:.8;transition:all .3s;line-height:20px}.addSubplayerContainer:hover{background-color:var(--primary-color);color:#fff;opacity:1;border:4px dashed transparent;padding:20px 25px;width:175px}.addSubplayerContainer:hover .addSubplayerInputContainer{height:auto;margin-top:10px}.addSubplayerInputContainer{height:0;margin-top:6px;display:flex;justify-content:center;align-items:center;overflow:hidden}.subplayerInput{font-family:Jost,sans-serif;font-size:16px;width:86px;padding:5px 10px;border-radius:20px;border:4px solid transparent;outline:none;box-sizing:border-box}.subplayerAddButton{font-size:12px;padding:3px 10px;margin-left:4px;height:30px;border-radius:20px;border:1px solid white;background-color:var(--primary-color);color:#fff;cursor:pointer;user-select:none;-webkit-user-select:none;display:flex;justify-content:center;align-items:center}.subplayerAddButton:hover{background-color:#000}.hatsPlayerItemRemoveButton:hover{background-color:#000;color:#fff}.teamsContainer{position:absolute;width:100%;height:100%;top:0;left:0;display:flex;box-sizing:border-box;padding:110px 38px 150px;gap:38px}.teamRegion{position:relative;width:calc(50% - 17.5px);display:flex;justify-content:center;align-items:center;flex-direction:column;border:4px solid;box-sizing:border-box;border-radius:30px;user-select:none;-webkit-user-select:none;font-size:14px;z-index:1;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);overflow:hidden}.teamTitle{font-size:38px;text-align:center;font-weight:700;text-shadow:1px 1px white,1px -1px white,-1px 1px white,-1px -1px white,1px 0 white,0 1px white,-1px 0 white,0 -1px white}.teamEdit:hover{color:gray}.teamNameInputContainer{display:flex;flex-direction:column}.teamNameInput{font-size:24px;font-weight:700;border:none;outline:none;background-color:#fff;border-radius:30px;padding:8px 16px;width:100%;box-sizing:border-box}.teamNameButtons{display:flex;justify-content:center;gap:10px;margin-top:10px;width:100%}.teamNameButton{font-size:16px;font-weight:700;padding:1px 12px;border-radius:20px;cursor:pointer;user-select:none;-webkit-user-select:none;background-color:#fff}.teamNameButton:hover{background-color:var(--primary-color);color:#fff}.teamMembersContainer{margin-top:80px;width:100%;display:flex;gap:10px;align-items:center;justify-content:center;flex-wrap:wrap}.teamHatSwitcherContainer{display:flex;align-items:center;gap:10px;margin-bottom:10px}.teamHatImageContainer{position:relative;width:100px;height:100px;border-radius:50%;border:4px solid;display:flex;justify-content:center;align-items:center;box-sizing:border-box}.teamHatImage{position:absolute;bottom:-70px;width:150px;pointer-events:none}.teamHatButton{transition:transform .3s}.teamHatButton:hover{transform:scale(1.2)}.floatingPromptsContainer{position:absolute;left:-300px;top:0;width:100%;height:100%;pointer-events:none}.promptDisplayContainer{position:absolute;flex-direction:column;right:30px;pointer-events:none;display:flex;justify-content:center;align-items:center;z-index:1}.promptDisplayItem{transform:scale(.7);height:140px;display:flex;align-items:center;animation:fadeIn .5s forwards;pointer-events:none}.promptCompletionButton{position:absolute;left:-110px;pointer-events:all;transition:transform .3s;color:#388e3c}.promptCompletionButton:hover{transform:scale(1.2);color:#4caf50}.promptDrawButton{pointer-events:all;transition:transform .3s}.promptDrawButton:hover{transform:scale(1.2);color:#1976d2}.paper{font-size:40px;display:flex;justify-content:center;align-items:center;text-align:center;width:550px;height:180px;background-color:#fff;background-position:center;background-size:cover;border-radius:16px;box-shadow:0 15px 30px #00000080;border:1px solid rgb(158,158,158);box-sizing:border-box;padding:20px;-webkit-user-select:none;user-select:none;transform-origin:center center}.debug{position:absolute;bottom:0;left:0;font-size:10px;font-weight:400;color:#fff;background-color:#00000080;padding:5px 10px;border-radius:8px;user-select:none;-webkit-user-select:none;white-space:pre-wrap;word-wrap:break-word;max-width:100%;z-index:1000;box-sizing:border-box;pointer-events:none}.spectatorsContainer{font-size:20px;position:absolute;top:15px;right:15px;z-index:1001;display:flex;flex-direction:column;align-items:flex-end;gap:4px}.spectator{font-weight:700;color:#fff;background-color:#00000080;padding:5px 10px;border-radius:8px;user-select:none;-webkit-user-select:none}.spectatorYouTag{font-family:Titan One,sans-serif;font-size:26px;color:var(--primary-color)}.hatsRoundTimerContainer{pointer-events:none;width:100%;position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;z-index:1}.hatsRoundTimer{position:relative;font-family:Titan One,sans-serif;font-size:90px;font-weight:700;color:var(--primary-color)}.hatsRoundTimerScaleText{position:absolute;top:0;left:0;z-index:-1;-webkit-user-select:none;user-select:none;mix-blend-mode:multiply}.roundInstructionsText{position:relative;font-size:22px;font-weight:700;user-select:none;-webkit-user-select:none;text-align:justify}.roundInstructionsText h1{margin-bottom:20px;margin-top:30px;text-align:left}.gameProgressContainer{display:flex;width:600px;height:60px;gap:8px;justify-content:space-evenly;align-items:center}.gameProgressDot{position:absolute;width:50px;height:50px;border-radius:50%;display:flex;justify-content:center;align-items:center;border:4px solid}.gameProgressDot.current{animation:gameProgressDotFlash .2s infinite}@keyframes gameProgressDotFlash{0%{color:#fff;background-color:var(--primary-color);border-color:#000}33%{color:#000;background-color:#fff;border-color:var(--primary-color)}66%{color:var(--primary-color);background-color:#000;border-color:#fff}to{color:#fff;background-color:var(--primary-color);border-color:#000}}.gameProgressArrow{position:absolute;top:3px;left:-60px}.recentHistoryContainer{position:absolute;font-style:italic;left:30px;bottom:70px;display:flex;flex-direction:column-reverse;align-items:center;gap:6px;user-select:none;-webkit-user-select:none;z-index:1}.recentHistoryItem{position:relative;width:200px;height:75px;display:flex;justify-content:center;align-items:center;font-size:14px;text-align:center;border-radius:8px;padding:4px;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background-color:#fff;box-sizing:border-box;cursor:pointer;animation:recentHistoryAppear .4s ease-out forwards}@keyframes recentHistoryAppear{0%{transform:translateY(-30px) scale(2.3)}to{transform:translateY(0) scale(1)}}.recentHistoryItem:hover .recentHistoryLikeButton{display:flex}.recentHistoryLikesContainer{position:absolute;bottom:4px;right:4px;display:flex;align-items:center;gap:4px;font-size:12px;color:var(--primary-color)}.recentHistoryLikeButton{position:absolute;color:#000;height:100%;right:-40px;width:40px;display:none;justify-content:center;align-items:center;animation:fadeIn .4s ease-out forwards;transition:transform .2s}.recentHistoryLike{animation:recentHistoryAppear .4s ease-out forwards}.recentHistoryLikeButton:hover{transform:scale(1.2)}.centerCenter{position:relative;width:100%;height:100%;display:flex;justify-content:center;align-items:center;text-align:center;box-sizing:border-box}.emojiRoundContainer{font-family:"Noto Color Emoji",sans-serif;position:relative;width:600px;height:600px;background-color:#fff;border:4px solid black;border-radius:30px;overflow:hidden;box-sizing:border-box}.emojiItemWrapper{display:flex;justify-content:center;align-items:center;width:60px;height:60px;box-sizing:border-box}.emojiItem{font-size:30px;color:#fff;background-color:#000;border-radius:12px;width:50px;height:50px;display:flex;justify-content:center;align-items:center;user-select:none;-webkit-user-select:none;transition:transform .2s,border .2s;border:4px solid transparent;box-sizing:border-box}.emojiItem.selected{border:4px solid var(--primary-color)}.emojiItem.enabled:hover{cursor:pointer;transform:scale(1.2)}.emojiItem.disabled{background-color:gray}.pickedEmojiContainer{position:absolute;bottom:20px;left:50%;transform:translate(-50%);background-color:#fff;color:#000;box-shadow:0 5px 10px #00000080;height:75px;min-width:75px;display:flex;justify-content:center;align-items:center;border-radius:12px;gap:6px;max-width:90%;padding:4px 15px;box-sizing:border-box}.pickedEmojiItem{font-size:50px;user-select:none;-webkit-user-select:none;transform-origin:center center;animation:emojiPopIn .3s forwards;display:flex;justify-content:center;align-items:center}@keyframes emojiPopIn{0%{width:0px;transform:scale(0)}to{width:60px;transform:scale(1)}}.threeCanvasContainer{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:400}.hatsLogoBgCircle{position:absolute;top:30%;left:50%;transform:translate(-50%,-50%);width:3000px;height:3000px;border-radius:50%;background-color:#000}.hatsLogoBgImage{position:absolute;top:262px;left:50%;transform:translate(-50%,-50%);width:597px}.canvasCorrector{transform:scale(calc(1 / var(--scale)));transform-origin:0 0;width:calc(100% * var(--scale));height:calc(100% * var(--scale))}.quitScreenContainer{position:relative;font-size:20px;font-weight:700;color:#fff;width:300px;display:flex;flex-direction:column;align-items:center;gap:20px}.quitScreenProgressBarContainer{position:relative;width:100%;height:30px;box-sizing:border-box}.quitScreenProgressBar{position:relative;height:30px;border-radius:15px;background-color:var(--primary-color);box-sizing:border-box}.gameOverTeamItem{position:absolute}.progressBarContainer{width:800px;height:800px}.progressBarLabel{position:absolute;font-size:30px;width:60px;height:60px;display:flex;align-items:center;justify-content:center;transform:translate(-50%,-50%);background-color:#fff;border-radius:999px;font-weight:600;box-shadow:0 2px 6px #0003;pointer-events:none}.progressBarTeamName{position:absolute;left:110%;white-space:nowrap;text-shadow:1px 1px white,1px -1px white,-1px 1px white,-1px -1px white,1px 0 white,0 1px white,-1px 0 white,0 -1px white;z-index:1}.gameOverButtonsContainer{position:absolute;width:100%;top:30px;display:flex;justify-content:space-evenly;align-items:center}.gameOverContainer{width:1080px;height:1080px;display:flex;justify-content:center;align-items:center;font-size:40px;font-weight:700}.gameOverCenter{display:flex;flex-direction:column;align-items:center;justify-content:center}
