body{-webkit-tap-highlight-color:transparent}button:focus,button:focus-visible,div:focus,div:focus-visible{outline:none}html,body{margin:0;padding:0;height:100%}body{margin:0;display:flex;justify-content:center;align-items:center;background:#6a6a6a}.gameScreenContainer{height:100%;max-height:800px;width:100%;max-width:450px;aspect-ratio:9/16;background:linear-gradient(to bottom right,#4c4c4c,#232323,#434343);display:flex;flex-direction:column;align-items:center;box-sizing:border-box;border-radius:10px}@media(orientation:portrait){.gameScreenContainer{width:100%;height:auto}}@media(orientation:landscape){.gameScreenContainer{width:auto;height:100%}}.canvasWrapper{position:relative;height:55%;width:98%;margin:1%}#gameCanvas{position:absolute;top:0;left:0;height:100%;width:100%;background:#b79292;border-radius:10px}#menuAreaTop{position:absolute;top:0;left:0;background-color:bisque;height:100%;width:100%;opacity:.5;border-radius:10px;z-index:2}.controllerAreaWrapper{position:relative;height:44%;width:98%;border-radius:10px;margin-bottom:1%}#controllerArea{position:absolute;top:0;left:0;height:100%;width:100%;background:linear-gradient(to bottom right,#e6e6e6,#c9c9c9,#a7a7a7);border-radius:10px}.topBottonContainer{display:flex;gap:1.5%;position:relative;width:100%;height:70%;padding:1%;box-sizing:border-box;border-top-left-radius:10px;border-top-right-radius:10px}.side.left{background:linear-gradient(to bottom right,#666,#474747,#585858);height:100%;width:50%;border-top-left-radius:10px;transition:transform .1s ease,background .1s ease;box-shadow:1px 1px 3px #000;cursor:pointer}.side.left:active{background:linear-gradient(to bottom right,#4f4f4f,#303030,#585858);transform:scale(.99)}.side.right{background:linear-gradient(to bottom right,#666,#474747,#585858);height:100%;width:50%;border-top-right-radius:10px;transition:transform .1s ease,background .1s ease;box-shadow:1px 1px 3px #000;cursor:pointer}.side.right:active{background:linear-gradient(to bottom right,#4f4f4f,#303030,#585858);transform:scale(.99)}.center{position:absolute;width:45%;aspect-ratio:1/1;background:linear-gradient(to bottom right,#e6e6e6,#c9c9c9,#b6b6b6);border-radius:50%;top:50%;left:50%;transform:translate(-50%,-50%) translateY(25%);display:flex;justify-content:center;align-items:center;z-index:1}.centerCenter{position:relative;width:90%;aspect-ratio:1/1;border-radius:50%;background:linear-gradient(to bottom right,#666,#1b1b1b,#585858);border:1px solid rgb(255,255,255)}.moveBotton{position:absolute;background-color:#9c9c9c;display:flex;align-items:center;justify-content:center;border-radius:3%;z-index:3}.moveBottonCenter{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background-color:#e4e4e4;width:53%;height:53%;z-index:2;display:flex;justify-content:center;align-items:center}.moveBottonCenterCenter{width:60%;aspect-ratio:1/1;border-radius:50%}.moveBotton.Top{top:10%;left:50%;transform:translate(-50%);width:52%;height:39%;border:1px solid rgb(255,255,255);clip-path:polygon(0 0,0 32%,50% 98%,100% 32%,100% 0);background:linear-gradient(to bottom right,#6e6e6e,#343434,#282828);transition:transform .1s ease,background .1s ease;cursor:pointer}.moveBotton.Top:active{background:linear-gradient(to bottom right,#5c5c5c,#1d1d1d,#3f3f3f)}.TopTriangle{background:linear-gradient(to bottom right,#fff,#a2fffd,#d3d3d3);width:22%;aspect-ratio:1/1;position:relative;top:-17%;clip-path:polygon(0 68%,50% 0,100% 68%)}.moveBotton.Bottom{bottom:10%;left:50%;transform:translate(-50%);width:52%;height:39%;clip-path:polygon(0 68%,0 100%,100% 100%,100% 68%,50% 2%);border:1px solid rgb(255,255,255);background:linear-gradient(to bottom right,#6e6e6e,#343434,#282828);transition:transform .1s ease,background .1s ease;cursor:pointer}.moveBotton.Bottom:active{background:linear-gradient(to bottom right,#606060,#1a1a1a,#292929)}.BottomTriangle{background:linear-gradient(to bottom right,#fff,#a2fffd,#d3d3d3);width:22%;aspect-ratio:1/1;position:relative;bottom:-17%;clip-path:polygon(0 32%,50% 100%,100% 32%)}.moveBotton.Left{left:10%;top:50%;transform:translateY(-50%);width:39%;height:52%;clip-path:polygon(0 0,0 100%,32% 100%,98% 50%,32% 0);border:1px solid rgb(255,255,255);background:linear-gradient(to bottom right,#6e6e6e,#343434,#282828);transition:transform .1s ease,background .1s ease;cursor:pointer}.moveBotton.Left:active{background:linear-gradient(to bottom right,#5c5c5c,#1d1d1d,#3f3f3f)}.LeftTriangle{background:linear-gradient(to bottom right,#fff,#a2fffd,#d3d3d3);height:22%;aspect-ratio:1/1;position:relative;left:-17%;clip-path:polygon(0 50%,68% 0%,68% 100%)}.moveBotton.Right{right:10%;top:50%;transform:translateY(-50%);width:39%;height:52%;clip-path:polygon(68% 0,100% 0,100% 100%,68% 100%,2% 50%);border:1px solid rgb(255,255,255);background:linear-gradient(to bottom right,#6e6e6e,#343434,#282828);transition:transform .1s ease,background .1s ease;cursor:pointer}.moveBotton.Right:active{background:linear-gradient(to bottom right,#5c5c5c,#1d1d1d,#2b2b2b)}.RightTriagnle{background:linear-gradient(to bottom right,#fff,#a2fffd,#d3d3d3);height:22%;aspect-ratio:1/1;position:relative;right:-17%;clip-path:polygon(32% 0%,100% 50%,32% 100%)}.bottomBottonContainer{height:30%;width:100%;border-bottom-left-radius:10px;border-bottom-right-radius:10px;display:flex;justify-content:center;align-items:center;flex-direction:column}.startButtonContainer{width:98%;height:29%;display:flex;align-items:center;padding-left:10%;box-sizing:border-box}#startButton{width:20%;height:55%;border-radius:20px;background:linear-gradient(to bottom right,#b0b0b0,#676767,#b2b2b2);box-shadow:2px 2px 2px #595959;margin-top:-.85%;border:1px solid black;transition:transform .1s ease,background .1s ease;cursor:pointer}#startButton:active{background:linear-gradient(to bottom right,#8a8a8a,#414141,#8b8b8b);transform:scale(.96)}#myMonsterContainer{background:linear-gradient(to bottom,#fff,#a9a9a9,#fff);width:98%;height:70%;margin-bottom:1%;border-radius:10px;border:1px solid black;padding:1% 0;box-shadow:1px 1px 1px #181818;display:flex;justify-content:space-evenly;align-items:center;flex-direction:row;box-sizing:border-box}.eachThumbnail-container{position:relative;width:15%;height:100%;background-color:#b4b4b4;display:flex;justify-content:center;align-items:center;border-radius:5px;border:1px solid rgb(59,59,59);overflow:hidden;box-shadow:1px 1px 1px #181818}.party-thumbnail{width:100%}.hp-bar-bg{position:absolute;bottom:2%;left:50%;transform:translate(-50%);height:10%;background-color:gray;border:1px solid black;border-radius:3px;width:90%}.hp-bar-fg{position:absolute;bottom:2%;left:5%;height:10%;border-radius:3px}#menuScreen{position:absolute;top:0;left:0;background:linear-gradient(to bottom right,#e6e6e6,#c9c9c9,#a7a7a7);z-index:2;width:100%;height:100%;border-radius:10px;display:flex;flex-direction:column;justify-content:center;align-items:center;box-sizing:border-box}#menuAreaBottom{height:100%;width:100%;border-radius:10px;z-index:2;display:flex;justify-content:center;align-items:center}#commandContainer-menuScreen{height:100%;width:30%;background:linear-gradient(to bottom right,#d3d3d3,#a4a4a4,#b7b7b7);display:flex;justify-content:space-evenly;align-items:center;flex-direction:column;border-top-left-radius:10px;border-bottom-left-radius:10px;box-shadow:inset 0 0 10px #00000080}.selectedMonsterDataContainer-menuScreen{position:relative;height:22%;width:70%;display:flex;justify-content:center;align-items:flex-start;box-sizing:border-box;margin-top:-7%}.selectedMonsterThumbnailCotainer-menuScreen{height:83%;aspect-ratio:1/1;display:flex;justify-content:center;align-items:center;border-radius:50%;border:1px solid rgb(59,59,59);box-shadow:1px 1px 1px #fff;overflow:hidden;cursor:pointer;transition:transform .2s ease}.selectedMonsterThumbnailCotainer-menuScreen:active{transform:scale(.9)}.selectedMonsterThumbnail-menuScreen{height:93%;border:1px solid rgb(59,59,59);border-radius:50%;display:flex;justify-content:center;align-items:center;flex-direction:row;box-sizing:border-box}#myMonstersBtn-menuScreen{position:relative;background:linear-gradient(to bottom right,#8b8b8b,#252525,#505050);width:80%;height:10%;display:flex;justify-content:center;align-items:center;border-radius:7px;font-size:15px;border:1px solid rgb(255,255,255);color:#d7d7d7;box-shadow:1px 1px 1px #000;cursor:pointer;transition:transform .1s ease,background .1s ease;user-select:none;-webkit-user-select:none;-ms-user-select:none;-webkit-touch-callout:none}#myMonstersBtn-menuScreen:active{transform:scale(.94);filter:brightness(.9)}#myMonstersBtn-menuScreen:before{content:"";position:absolute;right:0;top:-65.5%;width:100%;height:1px;background-color:#727272}#itemsBtn-menuScreen{background:linear-gradient(to bottom right,#8b8b8b,#252525,#505050);width:80%;height:10%;display:flex;justify-content:center;align-items:center;border-radius:7px;font-size:15px;border:1px solid rgb(255,255,255);color:#d7d7d7;box-shadow:1px 1px 1px #000;cursor:pointer;transition:transform .1s ease,background .1s ease;user-select:none;-webkit-user-select:none;-ms-user-select:none;-webkit-touch-callout:none}#itemsBtn-menuScreen:active{transform:scale(.94);filter:brightness(.9)}#saveDataBtn-menuScreen{background:linear-gradient(to bottom right,#8b8b8b,#252525,#505050);width:80%;height:10%;display:flex;justify-content:center;align-items:center;border-radius:7px;font-size:15px;border:1px solid rgb(255,255,255);color:#d7d7d7;box-shadow:1px 1px 1px #000;cursor:pointer;transition:transform .1s ease,background .1s ease;user-select:none;-webkit-user-select:none;-ms-user-select:none;-webkit-touch-callout:none}#saveDataBtn-menuScreen:active{transform:scale(.94);filter:brightness(.9)}#closeMenuScreenBtn{background:linear-gradient(to bottom right,#8b8b8b,#252525,#505050);width:80%;height:10%;display:flex;justify-content:center;align-items:center;border-radius:7px;font-size:15px;border:1px solid rgb(255,255,255);color:#d7d7d7;box-shadow:1px 1px 1px #000;cursor:pointer;transition:transform .1s ease,background .1s ease;user-select:none;-webkit-user-select:none;-ms-user-select:none;-webkit-touch-callout:none}#closeMenuScreenBtn:active{transform:scale(.94);filter:brightness(.9)}#selectedDataContainer-menuScreen{height:100%;width:70%;background:linear-gradient(to bottom right,#d3d3d3,#a4a4a4,#b7b7b7);border-top-right-radius:10px;border-bottom-right-radius:10px;box-shadow:inset 0 0 10px #00000080;display:flex;flex-direction:column;justify-content:center;align-items:center}.selectedData-TopAreaContainer-menuScreen{position:relative;height:26%;width:100%;display:flex;justify-content:center;align-items:flex-end}.selectedData-TopAreaContainer-menuScreen:after{content:"";position:absolute;left:5%;bottom:0;width:90%;height:1.8%;background-color:#727272}.selectedData-TopArea-MenuScreen{position:relative;width:100%;height:86%;display:flex;justify-content:center;align-items:flex-start}#swapBtn-MenuScreen{position:absolute;bottom:16%;left:-1%;width:30%;height:40%;transform:translateY(-50%);background-color:#000;border-radius:5px;display:flex;justify-content:center;align-items:center;cursor:pointer;color:#e6e6e6;font-size:15px}.selectedMosnterThumbnailContainerRight-menuScreen{height:83%;aspect-ratio:1/1;background-color:#e4e4e4;display:flex;justify-content:center;align-items:center;border-radius:50%;border:1px solid rgb(59,59,59);box-shadow:1px 1px 1px #fff;overflow:hidden;cursor:pointer;transition:transform .2s ease}.selectedMosnterThumbnailContainerRight-menuScreen:active{transform:scale(.9)}.selectedMonsterThumbnailRight-menuScreen{height:93%;border:1px solid rgb(59,59,59);border-radius:50%;display:flex;justify-content:center;align-items:center;flex-direction:row;box-sizing:border-box}.selectedData-BottomAreaContainer-menuScreen{position:relative;width:100%;height:74%;border-bottom-right-radius:10px}#myMonstersContainer-menuScreen{height:100%;width:100%;display:flex;align-items:center;box-sizing:border-box}.monsterContainer-Left-menuScreen,.monsterContainer-Right-menuScreen{width:50%;height:100%;display:flex;justify-content:space-evenly;align-items:center;flex-direction:column}.eachMonsterContainer-menuScreen{background-color:#1a1a1a;background:linear-gradient(to bottom right,#b8b8b8,#939393,#707070);width:90%;height:31%;border:2px solid rgb(59,59,59);border-radius:10px;box-sizing:border-box;overflow:hidden;position:relative;box-shadow:2px 2px 2px #363636;cursor:pointer}.monsterIcon-menuScreen{border-radius:0;width:100%;height:100%;object-fit:cover;transform:scale(1.1);transform-origin:center}#items-menuScreen{background-color:#cd9494;width:100%;height:98%;border-radius:10px;display:flex;align-items:center;justify-content:space-between;box-sizing:border-box;flex-direction:row}#itemsContainer-menuScreen{width:49%;height:98.5%;border-radius:10px;overflow-y:scroll;scrollbar-width:none;-ms-overflow-style:none;display:flex;align-items:center;flex-direction:column;gap:6px;padding-top:2%;padding-bottom:62%;box-sizing:border-box;border:1px solid black;margin-top:1.5%;margin-left:1%}#itemsContainer-menuScreen::-webkit-scrollbar{display:none}.eachItem-menuScreen{background-color:#e9e9b9;border-radius:10px;width:92%;display:flex;flex-direction:column;justify-content:center;align-items:center;cursor:pointer;border:1px solid rgb(89,99,171);padding:2% 0}.eachItem-menuScreen.disabled{opacity:.5;pointer-events:none}.eachItem-menuScreen.selected{outline:2px solid rgb(244,4,4)}.itemName-menuScreen{width:100%;height:50%;font-size:14px;box-sizing:border-box;padding-left:4%}.itemCount-menuScreen{width:100%;height:50%;text-align:end;font-weight:600;padding-right:4%;text-decoration:underline;font-size:15px;box-sizing:border-box}#myMonsterStatus-menuScreen{width:49%;height:100%;display:flex;justify-content:space-evenly;align-items:center;flex-direction:column}.eachMonsterData-menuScreen{background-color:#1a00c2a4;height:15%;width:97%;display:flex;flex-direction:row;align-items:end;border-top-right-radius:20px}.monsterIconContainer-menuScreen{height:97%;aspect-ratio:1/1}.monsterIcon-itemsMenuScreen{height:100%;aspect-ratio:1/1}.monsterHpBarBg-menuScreen{position:relative;height:40%;background-color:gray;border:1px solid black;border-radius:3px;width:90%;font-weight:500;color:#fff;display:flex;align-items:center;justify-content:center}.monsterHpBarFg-menuScreen{position:absolute;bottom:0%;left:0%;height:100%;border-radius:3px}.monsterHpBarValue-menuScreen{position:absolute;top:50%;left:50%;transform:translate(-50%) translateY(-50%);font-size:16px}#battleScreen{position:absolute;top:0;left:0;background:linear-gradient(to bottom right,#e6e6e6,#c9c9c9,#a7a7a7);height:0%;opacity:0;width:100%;border-radius:10px;z-index:2;padding:.5%;display:flex;flex-direction:column;justify-content:center;align-items:center;box-sizing:border-box;transition:height .4s ease,opacity .4s ease;pointer-events:none;overflow:hidden;cursor:default}#battleScreen.openBattleArea{height:100%;opacity:1;pointer-events:auto}.selectedMonsterNameHpBarCotnainer{position:absolute;top:0;left:130%;height:90%;opacity:0;width:0;display:flex;flex-direction:column;justify-content:space-between;transition:width .4s ease,opacity .4s ease}.open{width:315%;opacity:1}.selectedMonsterNameLevelContainer{width:100%;height:50%;display:flex;flex-direction:row;justify-content:space-between;padding-left:5%;padding-right:5%;box-sizing:border-box}.selectedMonsterName,.selectedMonsterLevel{white-space:nowrap;overflow:hidden}.selectedMonster-hp-bar-bg{position:relative;bottom:3%;left:50%;transform:translate(-50%);height:36%;background-color:gray;border:1px solid black;border-radius:3px;width:90%;font-weight:500;color:#fff;display:flex;align-items:center;justify-content:center}.selectedMonster-hp-bar-fg{position:absolute;bottom:0%;left:0%;height:100%;border-radius:3px}.selectedMonster-hpText{position:absolute;top:50%;left:50%;transform:translate(-50%) translateY(-50%)}#battleScreenBottomArea{width:100%;height:100%;display:flex;justify-content:center;align-items:center}#commandContainer{height:100%;width:30%;background:linear-gradient(to bottom right,#d3d3d3,#a4a4a4,#b7b7b7);display:flex;justify-content:space-evenly;align-items:center;flex-direction:column;border-top-left-radius:10px;border-bottom-left-radius:10px;box-shadow:inset 0 0 10px #00000080}#selectedMonsterDataContainer{position:relative;height:22%;width:70%;display:flex;justify-content:center;align-items:flex-start;box-sizing:border-box}.selectedMosnterThumbnailContainer{height:83%;aspect-ratio:1/1;background-color:#e4e4e4;display:flex;justify-content:center;align-items:center;border-radius:50%;border:1px solid rgb(59,59,59);box-shadow:1px 1px 1px #fff;overflow:hidden;cursor:pointer;transition:transform .2s ease}.selectedMosnterThumbnailContainer:active{transform:scale(.9)}.selectedMosnterThumbnailContainerRight{height:83%;aspect-ratio:1/1;background-color:#e4e4e4;display:flex;justify-content:center;align-items:center;border-radius:50%;border:1px solid rgb(59,59,59);box-shadow:1px 1px 1px #fff;overflow:hidden;cursor:pointer;transition:transform .2s ease}.selectedMosnterThumbnailContainerRight:active{transform:scale(.9)}.selectedMonsterThumbnail,.selectedMonsterThumbnailRight{height:93%;border:1px solid rgb(59,59,59);border-radius:50%;display:flex;justify-content:center;align-items:center;flex-direction:row;box-sizing:border-box}#selectedDataContainer{height:100%;width:70%;background:linear-gradient(to bottom right,#d3d3d3,#a4a4a4,#b7b7b7);border-top-right-radius:10px;border-bottom-right-radius:10px;box-shadow:inset 0 0 10px #00000080;display:flex;flex-direction:column;justify-content:center;align-items:center}.selectedData-TopAreaContainer{position:relative;height:26%;width:100%;display:flex;justify-content:center;align-items:flex-end}.selectedData-TopAreaContainer:after{content:"";position:absolute;left:5%;bottom:0;width:90%;height:1.8%;background-color:#727272}.selectedData-TopArea{position:relative;width:100%;height:86%;display:flex;justify-content:center;align-items:flex-start}.selectedMonsterMoreDetailedCotnainer{position:absolute;top:0%;left:50%;transform:translate(-50%);height:0;opacity:0;width:97%;background:linear-gradient(to bottom right,#bfbfbf,#a7a7a7,#b7b7b7);display:flex;flex-direction:column;transition:height .4s ease,opacity .4s ease;border-bottom-right-radius:10px;pointer-events:none;overflow:hidden;cursor:default}.openDropDown{height:99%;opacity:1;pointer-events:auto}.nameLvHpbarContainer-moreDetailed{background:linear-gradient(to bottom right,#d7d7d7,#b8b8b8,#d2d2d2);width:98%;height:19%;margin:1% auto auto;border-radius:5px;border:1px solid rgb(72,72,72);display:flex;flex-direction:column;gap:3%}.NameLevelContainer-moreDetailed{width:100%;height:45%;display:flex;flex-direction:row;justify-content:space-between;padding-left:2%;padding-right:5%;box-sizing:border-box}.MonsterName-moreDetailed{white-space:nowrap;overflow:hidden;font-size:14px}.MonsterLevel-moreDetailed{white-space:nowrap;overflow:hidden;font-size:14px;font-weight:500}.monster-hpbar-bg-moreDetailed{position:relative;bottom:0%;left:50%;transform:translate(-50%);height:40%;background-color:gray;border:1px solid black;border-radius:3px;width:90%;font-weight:500;color:#fff;display:flex;align-items:center;justify-content:center}.monster-hpbar-fg-moreDetailed{position:absolute;bottom:0%;left:0%;height:100%;border-radius:3px;width:10%}.hpText-moreDetailed{position:absolute;top:50%;left:50%;transform:translate(-50%) translateY(-50%);font-size:15px}.statusExpSkillsContainer-moreDetailed{height:81%;width:100%;display:flex;padding:1%;box-sizing:border-box;gap:1%}.statusContainer-moreDetailed{width:25%;height:100%;background:linear-gradient(to bottom right,#ffdbdb,#ffd0d0,#ffe6e6);display:flex;flex-direction:column;justify-content:space-between;align-items:center;border-radius:5px;padding:1% 1% 2.5%;box-sizing:border-box;border:1px solid rgb(87,87,87)}.attackStatus-moreDetailed{width:97%;height:19%}.attackStatus-moreDetailed div:first-child{height:50%;font-size:15px}.attackStatus-moreDetailed div:last-child{height:50%;text-align:end;font-weight:500;margin-right:4%;text-decoration:underline;font-size:15px}.defenseStatus-moreDetailed{width:97%;height:19%}.defenseStatus-moreDetailed div:first-child{height:50%;font-size:15px}.defenseStatus-moreDetailed div:last-child{height:50%;text-align:end;font-weight:500;margin-right:4%;text-decoration:underline;font-size:15px}.specialAttackStatus-moreDetailed{width:97%;height:19%}.specialAttackStatus-moreDetailed div:first-child{height:50%;font-size:15px}.specialAttackStatus-moreDetailed div:last-child{height:50%;text-align:end;font-weight:500;margin-right:4%;text-decoration:underline;font-size:15px}.specialDefenseStatus-moreDetailed{width:97%;height:19%}.specialDefenseStatus-moreDetailed div:first-child{height:50%;font-size:15px}.specialDefenseStatus-moreDetailed div:last-child{height:50%;text-align:end;font-weight:500;margin-right:4%;text-decoration:underline;font-size:15px}.speedStatus-moreDetailed{width:97%;height:19%}.speedStatus-moreDetailed div:first-child{height:50%;font-size:15px}.speedStatus-moreDetailed div:last-child{height:50%;text-align:end;font-weight:500;margin-right:4%;text-decoration:underline;font-size:15px}.expSkillsContainer-moreDetailed{width:75%;height:100%;border-top-right-radius:10px;display:flex;flex-direction:column;gap:1%}.skillsContainer-moreDetailed{width:100%;height:78%;background:linear-gradient(to bottom right,#d3eaff,#d0e7ff,#dcefff);display:flex;flex-direction:column;align-items:flex-start;padding:1%;border-radius:5px;box-sizing:border-box;border:1px solid rgb(87,87,87);overflow-y:scroll}.eachSkill-moreDetailed{width:100%;font-size:15px;display:flex;align-items:center}.eachSkill-moreDetailed.hidden{display:none}.expContainer-moreDetailed{width:100%;height:22%;background:linear-gradient(to bottom right,#f0efcc,#ebeac6,#e4e4c8);display:flex;flex-direction:column;border-radius:5px;border:1px solid rgb(87,87,87);box-sizing:border-box;gap:3%}.expBarBg-moreDetailed{position:relative;bottom:3%;left:50%;transform:translate(-50%);height:37%;background-color:gray;border:1px solid black;border-radius:3px;width:90%;font-weight:500;color:#fff;display:flex;align-items:center;justify-content:center}.expBarFg-moreDetailed{position:absolute;bottom:0%;left:0%;height:100%;border-radius:3px}.expBarText-moreDetailed{margin-left:2%;font-size:14px}.expBarValue-moreDetailed{position:absolute;top:50%;left:50%;transform:translate(-50%) translateY(-50%)}#swapBtn2{position:absolute;bottom:16%;left:-1%;width:30%;height:40%;transform:translateY(-50%);background-color:#000;border-radius:5px;display:flex;justify-content:center;align-items:center;cursor:pointer;color:#e6e6e6;font-size:15px}.triangleRight-swapBtn2{position:absolute;right:3%;top:-44%;width:60%;height:46%;background-color:#000;clip-path:polygon(0 0,0 100%,100% 100%)}.triangleLeft-swapBtn2{position:absolute;left:3%;bottom:-37%;width:60%;height:40%;background-color:#000;clip-path:polygon(0 0,100% 100%,100% 0)}.selectedData-BottomAreaContainer{position:relative;width:100%;height:74%;border-bottom-right-radius:10px}#fight-battle{position:relative;background:linear-gradient(to bottom right,#8b8b8b,#252525,#505050);width:80%;height:10%;display:flex;justify-content:center;align-items:center;border-radius:7px;font-size:15px;border:1px solid rgb(255,255,255);color:#d7d7d7;box-shadow:1px 1px 1px #000;cursor:pointer;transition:transform .1s ease,background .1s ease;user-select:none;-webkit-user-select:none;-ms-user-select:none;-webkit-touch-callout:none}#fight-battle:active{transform:scale(.94);filter:brightness(.9)}#fight-battle:before{content:"";position:absolute;right:0;top:-39.5%;width:100%;height:1px;background-color:#727272}#myMonsters-battle{background:linear-gradient(to bottom right,#8b8b8b,#252525,#505050);width:80%;height:10%;display:flex;justify-content:center;align-items:center;border-radius:7px;font-size:15px;border:1px solid rgb(255,255,255);color:#d7d7d7;box-shadow:1px 1px 1px #000;cursor:pointer;transition:transform .1s ease,background .1s ease;user-select:none;-webkit-user-select:none;-ms-user-select:none;-webkit-touch-callout:none}#myMonsters-battle:active{transform:scale(.94);filter:brightness(.9)}#items-battle{background:linear-gradient(to bottom right,#8b8b8b,#252525,#505050);width:80%;height:10%;display:flex;justify-content:center;align-items:center;border-radius:7px;font-size:15px;border:1px solid rgb(255,255,255);color:#d7d7d7;box-shadow:1px 1px 1px #000;cursor:pointer;transition:transform .1s ease,background .1s ease;user-select:none;-webkit-user-select:none;-ms-user-select:none;-webkit-touch-callout:none}#items-battle:active{transform:scale(.94);filter:brightness(.9)}#escape-battle{background:linear-gradient(to bottom right,#8b8b8b,#252525,#505050);width:80%;height:10%;display:flex;justify-content:center;align-items:center;border-radius:7px;font-size:15px;border:1px solid rgb(255,255,255);color:#d7d7d7;box-shadow:1px 1px 1px #000;cursor:pointer;transition:transform .1s ease,background .1s ease;user-select:none;-webkit-user-select:none;-ms-user-select:none;-webkit-touch-callout:none}#escape-battle:active{transform:scale(.94);filter:brightness(.9)}#goBack-battle{background:linear-gradient(to bottom right,#8b8b8b,#252525,#505050);width:80%;height:10%;display:flex;justify-content:center;align-items:center;border-radius:7px;font-size:15px;border:1px solid rgb(255,255,255);color:#d7d7d7;box-shadow:1px 1px 1px #000;cursor:pointer;transition:transform .1s ease,background .1s ease;user-select:none;-webkit-user-select:none;-ms-user-select:none;-webkit-touch-callout:none}#goBack-battle:active{transform:scale(.94);filter:brightness(.9)}#skillButtons1{height:100%;width:100%;display:flex;flex-wrap:wrap;justify-content:space-evenly;align-content:flex-start;gap:2%;padding:2% 0;box-sizing:border-box}.skill-button{width:45%;height:20%;display:flex;justify-content:center;align-items:center;border:2px solid black;cursor:pointer}.skill-physical{background-color:#ffcba5}.skill-special{background-color:#a4fcff;border-radius:25%}#myMonstersBtn2{height:100%;width:100%;display:flex;align-items:center;box-sizing:border-box}.monsterIconsContainer-Left,.monsterIconsContainer-Right{width:50%;height:100%;display:flex;justify-content:space-evenly;align-items:center;flex-direction:column}.eachMonsterIconContainer{background-color:#1a1a1a;background:linear-gradient(to bottom right,#b8b8b8,#939393,#707070);width:90%;height:31%;border:2px solid rgb(59,59,59);border-radius:10px;box-sizing:border-box;overflow:hidden;position:relative;box-shadow:2px 2px 2px #363636;cursor:pointer}.monster-icon{border-radius:0;width:100%;height:100%;object-fit:cover;transform:scale(1.1);transform-origin:center}.active-monster{outline:2px solid rgb(0,17,255)}.select-target{outline:2px solid rgb(244,4,4)}#itemsBtn3{width:100%;height:98%;border-radius:10px;display:flex;align-items:center;justify-content:space-between;box-sizing:border-box;flex-direction:row}#itemsContainer{width:49%;height:98.5%;border-radius:10px;overflow-y:scroll;scrollbar-width:none;-ms-overflow-style:none;display:flex;align-items:center;flex-direction:column;gap:6px;padding-top:2%;padding-bottom:62%;box-sizing:border-box;border:1px solid black;margin-top:1.5%;margin-left:1%}#itemsContainer::-webkit-scrollbar{display:none}.item{background-color:#e9e9b9;border-radius:10px;width:92%;display:flex;flex-direction:column;justify-content:center;align-items:center;cursor:pointer;border:1px solid rgb(89,99,171);padding:2% 0}.item.disabled{opacity:.5;pointer-events:none}.item.selected{outline:2px solid rgb(244,4,4)}#selectedItemContainer{position:absolute;top:-14%;width:100%;height:110%}#selectedItemTopArea{height:34%;width:100%;display:flex;justify-content:center;align-items:center}#questionOne-selectedItem,#questionTwo-selectedItem{font-weight:500;background-color:#ffffff0f}#selectedItemBottomArea{height:66%;width:100%;display:flex;flex-direction:row}#useGoBackButtonsContainer{width:35%;height:100%;display:flex;align-items:center;justify-content:space-around;flex-direction:column}#useBotton{background-color:#d9bb8a;width:60%;display:flex;justify-content:center;align-items:center;cursor:pointer;padding:3% 0;border-radius:6px;box-shadow:2px 2px 2px #363636;transition:transform .1s ease,background .1s ease;user-select:none;-webkit-user-select:none;-ms-user-select:none;-webkit-touch-callout:none}#useBotton:active{transform:scale(.94);filter:brightness(.9)}#goBackBotton{background-color:#87ceeb;width:60%;display:flex;justify-content:center;align-items:center;cursor:pointer;padding:3% 0;border-radius:6px;box-shadow:2px 2px 2px #363636;user-select:none;-webkit-user-select:none;-ms-user-select:none;-webkit-touch-callout:none}#goBackBotton:active{transform:scale(.94);filter:brightness(.9)}#itemExplanation{padding:1% 2.4%;background-color:#8cb3e6;border-radius:5px;border:1px solid rgb(255,255,255);width:63%;height:100%;box-sizing:border-box}.itemName{width:100%;height:50%;font-size:14px;box-sizing:border-box;padding-left:4%}.itemCount{width:100%;height:50%;text-align:end;font-weight:600;padding-right:4%;text-decoration:underline;font-size:15px;box-sizing:border-box}#myMonstersStatus-itemsBtn3{width:49%;height:100%;display:flex;justify-content:space-evenly;align-items:center;flex-direction:column}.eachMonsterData-itemsBtn3{background-color:#1a00c2a4;height:15%;width:97%;display:flex;flex-direction:row;align-items:end;border-top-right-radius:20px}.monsterIconContainer-itemsBtn3{height:97%;aspect-ratio:1/1}.monsterIcon-itemsBtn3{height:100%;aspect-ratio:1/1}.monsterHpBarBg{position:relative;height:40%;background-color:gray;border:1px solid black;border-radius:3px;width:90%;font-weight:500;color:#fff;display:flex;align-items:center;justify-content:center}.monsterHpBarFg{position:absolute;bottom:0%;left:0%;height:100%;border-radius:3px}.monsterHpBarValue{position:absolute;top:50%;left:50%;transform:translate(-50%) translateY(-50%);font-size:16px}#itemToMyMonsters{position:absolute;top:0%;right:0%;height:100%;width:0%;border-radius:10px;opacity:1;display:flex;align-items:center;transition:width .4s ease,opacity .4s ease;box-sizing:border-box;pointer-events:none;overflow:hidden;cursor:default}#itemToMyMonsters.openitemToMyMonsters{width:100%;opacity:1;pointer-events:auto}.itemToMyMonsters-LeftColumn,.itemToMyMonsters-RightColumn{width:50%;height:100%;display:flex;justify-content:space-evenly;align-items:center;flex-direction:column}.eachMonsterIconContainer-itemToMyMonsters{background:linear-gradient(to bottom right,#b8b8b8,#939393,#707070);width:90%;height:31%;border:2px solid rgb(59,59,59);border-radius:10px;box-sizing:border-box;overflow:hidden;position:relative;box-shadow:2px 2px 2px #363636;cursor:pointer}.monsterIcon-itemToMyMonsters{border-radius:0;width:100%;height:100%;object-fit:cover;transform:scale(1.1);transform-origin:center}#escapeBtn4{width:100%;height:100%;display:flex;justify-content:center;align-items:flex-end}#escapeContainer{background-color:#f5f5f5ea;display:flex;flex-direction:column;width:90%;margin-bottom:3.4%;padding-bottom:6%;padding-right:1%;border-radius:5px;box-shadow:2px 2px 2px #363636;box-sizing:border-box}#escapeQuestion{font-weight:500;font-size:16px;text-align:center}#escapeAnswerButtonsContainer{display:flex;flex-direction:row;justify-content:space-around}#escapeBtnYes{background-color:#c1c1c1;padding:2% 0%;width:28%;display:flex;justify-content:center;align-items:center;border-radius:5px;box-shadow:2px 2px 2px #363636;user-select:none;-webkit-user-select:none;-ms-user-select:none;-webkit-touch-callout:none}#escapeBtnNo{background-color:#e7b0b0;padding:2% 0%;width:28%;display:flex;justify-content:center;align-items:center;border-radius:5px;box-shadow:2px 2px 2px #363636;user-select:none;-webkit-user-select:none;-ms-user-select:none;-webkit-touch-callout:none}#nextMessageBtnContainer{position:absolute;top:0;left:0;background:linear-gradient(to bottom right,#e6e6e6,#c9c9c9,#a7a7a7);height:100%;width:100%;border-radius:10px;display:flex;justify-content:center;align-items:center}#nextMessageBtn{background:linear-gradient(to bottom right,#b0b0b0,#c9c9c9,#a7a7a7);box-shadow:3px 2px 5px #626262;border-radius:12px;border:1px solid rgb(0,0,0);margin-bottom:2%;transition:transform .1s ease,background .1s ease;cursor:pointer;width:43%;height:43%;font-size:17px}#nextMessageBtn:active{background:linear-gradient(to bottom right,#929292,#b8b8b8,#8e8e8e);transform:scale(.98)}.hidden{display:none!important}.invisible{visibility:hidden!important}@media only screen and (max-width:450px){.gameScreenContainer,#gameCanvas,#battleScreen{border-radius:2.4vw}#commandContainer{border-top-left-radius:2.4vw;border-bottom-left-radius:2.4vw;box-shadow:inset 0 0 2.3vw #00000080}.selectedMosnterThumbnailContainer{border:.4vw solid rgb(59,59,59);box-shadow:.2vw .2vw .2vw #fff}.selectedMonsterThumbnail{border:.4vw solid rgb(59,59,59)}.selectedMosnterThumbnailContainerRight{border:.4vw solid rgb(59,59,59);box-shadow:.2vw .2vw .2vw #fff}.selectedMonsterThumbnailRight{border:.4vw solid rgb(59,59,59)}#selectedDataContainer{box-shadow:inset 0 0 2.3vw #00000080}.nameLvHpbarContainer-moreDetailed{border-radius:1vw;border:.4vw solid rgb(72,72,72)}.selectedMonsterMoreDetailedCotnainer,.selectedData-BottomAreaContainer{border-bottom-right-radius:2.3vw}#fight-battle,#myMonsters-battle,#items-battle,#escape-battle,#goBack-battle{border-radius:1.3vw;font-size:3.3vw;border:.1vw solid rgb(255,255,255)}.selectedMonsterName,.selectedMonsterLevel{font-size:3.6vw}.selectedMonster-hp-bar-bg{border:.4vw solid black;border-radius:.8vw}.selectedMonster-hp-bar-fg{border-radius:.8vw}.selectedMonster-hpText{font-size:3.6vw}.skill-button{font-size:3vw;border-radius:2vw;border:.6vw solid black}.eachMonsterIconContainer{border:.6vw solid rgb(59,59,59);border-radius:2vw;box-shadow:.6vw .6vw .6vw #363636}.active-monster{outline:.6vw solid rgb(0,17,255)}.select-target{outline:.6vw solid rgb(244,4,4)}#swapBtn2{border-radius:1vw;font-size:3.3vw}.MonsterName-moreDetailed,.MonsterLevel-moreDetailed{font-size:3.1vw}.monster-hpbar-bg-moreDetailed{border:.4vw solid black;border-radius:.5vw}.monster-hpbar-fg-moreDetailed{border-radius:.5vw}.hpText-moreDetailed{font-size:3.4vw}.statusContainer-moreDetailed{border-radius:1vw;border:.4vw solid rgb(87,87,87)}.attackStatus-moreDetailed div:first-child{font-size:3.3vw}.attackStatus-moreDetailed div:last-child{font-size:3.3vw}.defenseStatus-moreDetailed div:first-child{font-size:3.3vw}.defenseStatus-moreDetailed div:last-child{font-size:3.3vw}.specialAttackStatus-moreDetailed div:first-child{font-size:3.3vw}.specialAttackStatus-moreDetailed div:last-child{font-size:3.3vw}.specialDefenseStatus-moreDetailed div:first-child{font-size:3.3vw}.specialDefenseStatus-moreDetailed div:last-child{font-size:3.3vw}.speedStatus-moreDetailed div:first-child{font-size:3.3vw}.speedStatus-moreDetailed div:last-child{font-size:3.3vw}.expSkillsContainer-moreDetailed{border-radius:2vw}.skillsContainer-moreDetailed{border-radius:1vw;border:.4vw solid rgb(87,87,87)}.eachSkill-moreDetailed{font-size:3.6vw}.expContainer-moreDetailed{border-radius:1vw;border:.4vw solid rgb(87,87,87)}.expBarBg-moreDetailed{border:.4vw solid black;border-radius:.5vw}.expBarFg-moreDetailed{border-radius:.5vw}.expBarText-moreDetailed{font-size:3.1vw}.expBarValue-moreDetailed,#questionOne-selectedItem,#questionTwo-selectedItem{font-size:3.6vw}#useBotton,#goBackBotton{border-radius:.9vw;box-shadow:.4vw .4vw .4vw #363636;font-size:3.6vw}#itemExplanation{padding:1% 2.4%;border-radius:1.2vw;border:.4vw solid rgb(255,255,255);font-size:3.6vw}#itemsContainer{border-radius:2vw;gap:1.36vw;border:.1vw solid black}.item{border-radius:2vw;border:.4vw solid rgb(89,99,171)}.item.selected{outline:.6vw solid rgb(244,4,4)}.itemName{font-size:3.1vw}.itemCount{font-size:3.2vw}.eachMonsterData-itemsBtn3{border-top-right-radius:4.7vw}.monsterHpBarBg{border:.4vw solid black;border-radius:.8vw}.monsterHpBarFg{border-radius:.8vw}.monsterHpBarValue{font-size:3.6vw}#escapeContainer{border-radius:1vw;box-shadow:.4vw .4vw .4vw #363636}#escapeQuestion{font-size:3.6vw}#escapeBtnYes,#escapeBtnNo{border-radius:1vw;box-shadow:.4vw .4vw .4vw #363636;font-size:3.6vw}#nextMessageBtnContainer{border-radius:2vw}#nextMessageBtn{box-shadow:.7vw .5vw 1.2vw #626262;border-radius:2.7vw;border:.1vw solid rgb(0,0,0);font-size:3.8vw}}