body,canvas{margin:0;padding:0;overflow:hidden}img{width:100%;-webkit-user-select:none;user-select:none}.blackTint{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#00000080;z-index:5;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}#SoundIcon{position:absolute;top:2%;left:2%;width:15vw;max-width:70px;z-index:10;cursor:pointer}.UIElements{display:block}.UIElements .landingPage{position:absolute;top:0;left:50%;transform:translate(-50%);display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:6;-webkit-user-select:none;user-select:none}@media(max-width:1024px)and (max-aspect-ratio:13/10){.UIElements .landingPage{top:50%;transform:translate(-50%,-50%)}}.UIElements .landingPage .title{z-index:6;-webkit-user-select:none;user-select:none;width:58vh}@media(max-width:1024px)and (max-aspect-ratio:13/10){.UIElements .landingPage .title{width:85vw}}.UIElements .landingPage .chooseInstrudtion{z-index:6;-webkit-user-select:none;user-select:none;font-size:min(3.5vw,22px);font-family:font1;color:#fff;text-align:center;font-size:2.4vh}@media(max-width:1024px)and (max-aspect-ratio:13/10){.UIElements .landingPage .chooseInstrudtion{font-size:3.4vw}}.UIElements .landingPage .BtnContainer{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1.2vh;margin-top:2.5%}.UIElements .landingPage .BtnContainer #battingBtn{z-index:6;cursor:pointer;width:38vh}@media(max-width:1024px)and (max-aspect-ratio:13/10){.UIElements .landingPage .BtnContainer #battingBtn{width:60vw}}.UIElements .landingPage .BtnContainer #bowlingBtn{z-index:6;cursor:pointer;width:38vh}@media(max-width:1024px)and (max-aspect-ratio:13/10){.UIElements .landingPage .BtnContainer #bowlingBtn{width:60vw}}.UIElements .landingPage .BtnContainer #orText{z-index:6;-webkit-user-select:none;user-select:none;width:7vh}@media(max-width:1024px)and (max-aspect-ratio:13/10){.UIElements .landingPage .BtnContainer #orText{width:10vw}}.UIElements .InstructionPage{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:6}.UIElements .InstructionPage .InstructionBox{width:40vh;position:relative}@media(max-width:1024px)and (max-aspect-ratio:13/10){.UIElements .InstructionPage .InstructionBox{width:75vw}}.UIElements .InstructionPage .instPageTimer{position:absolute;width:12vh;height:13.5900339751vh;top:65%;left:50%;transform:translate(-50%);background-image:url(../UI/instPageTimer.png);background-size:100%;background-position:0% 0%}@media(max-width:1024px)and (max-aspect-ratio:13/10){.UIElements .InstructionPage .instPageTimer{width:22vw;height:24.9150622877vw}}.UIElements .InstructionPage #PlayButton{width:28vh;margin-top:-8%;cursor:pointer}@media(max-width:1024px)and (max-aspect-ratio:13/10){.UIElements .InstructionPage #PlayButton{width:55vw}}.UIElements .LookAroundInstContainer{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:55vw;max-width:400px;z-index:6}.UIElements .LookAroundInstContainer .lookAroundAnime{position:absolute;width:17vh;height:16.8885356646vh;top:50%;transform:translateY(-50%);background-size:100%;background-position:0% 76%}.UIElements .ResultPage{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:6}.UIElements .ResultPage .ResultBox{z-index:6;width:45vh}@media(max-width:1024px)and (max-aspect-ratio:13/10){.UIElements .ResultPage .ResultBox{width:80vw}}.UIElements .ResultPage .ResultBox .scoreText{position:absolute;left:50%;transform:translate(-50%);font-size:10vh;color:#fff;z-index:11;bottom:18%;text-align:center;font-family:font1;z-index:6}@media(max-width:1024px)and (max-aspect-ratio:13/10){.UIElements .ResultPage .ResultBox .scoreText{font-size:20vw}}.UIElements .ResultPage #RetryButton{width:25vh;margin-top:-8%;cursor:pointer;z-index:6}@media(max-width:1024px)and (max-aspect-ratio:13/10){.UIElements .ResultPage #RetryButton{width:50vw}}#activateBtn{position:absolute;top:20px;left:50%;transform:translate(-50%);padding:10px 20px;border:none;border-radius:8px;font-size:16px;background:#1e90ff;color:#fff;cursor:pointer;z-index:10}.objectHolder{position:absolute;left:50%;transform:translate(-50%);display:flex;justify-content:center;top:10%;z-index:10;width:100%;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.objectHolder .objectItemBg{position:relative;width:15vh;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}@media(max-width:1024px)and (max-aspect-ratio:13/10){.objectHolder .objectItemBg{width:16vw}}.objectHolder .objectItemBg .glow_circle{position:absolute;width:100%;height:100%;top:0;background-image:url(../UI/circleSeq.png);background-size:100%;background-position:0% 0%;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.objectHolder .objectItemBg .objectImg{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:60%;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.objectHolder .objectItemBg .tickImg{display:block;position:absolute;width:65%;top:49%;left:51%;transform:translate(-50%,-50%);opacity:0;transition:opacity .3s ease-in-out;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.timerContainer{position:absolute;bottom:10%;left:50%;transform:translate(-50%);width:16vh;z-index:10;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}@media(max-width:1024px)and (max-aspect-ratio:13/10){.timerContainer{width:30vw}}.timerContainer .timeText{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:4vh;color:#cfd3cf;font-family:font2;z-index:11;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}@media(max-width:1024px)and (max-aspect-ratio:13/10){.timerContainer .timeText{font-size:7vw}}.timerContainer .RedTimerImg{display:none;position:absolute;top:0;left:0;width:100%;z-index:9;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.powder-particle{position:absolute;width:4vw;height:4vw;background:#e0e0e0;border-radius:100%;opacity:0;filter:blur(3px);animation:radialSplash var(--duration) ease-out forwards;top:50%;left:50%;transform:translate(-50%,-50%);z-index:10}@keyframes radialSplash{0%{opacity:1;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,-50%) rotate(var(--angle)) translate(15vmin);scale:.5}}
