.App{align-items:center;background-color:#242322;display:flex;flex-direction:column;height:100vh;justify-content:center}body{margin:0}.grid-container{grid-gap:10px;display:grid;gap:10px;grid-template-areas:"T S S S S R R R" "T S S S S R R R" "T S S S S R R R" "T C C C C R R R" "T C C C C I I I" "T C C C C I I I";grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(6,1fr);height:90%;width:95%}.grid-container>div{background-color:#3a3939;border-radius:8px;box-shadow:0 4px 6px #0000001a;padding:7px}.grid-item-ChampionBox{grid-area:C}.grid-item-ItemBox{display:flex;flex-direction:row;grid-area:I}.grid-item-TraitBox{grid-area:T;overflow:auto}.grid-item-TraitBox::-webkit-scrollbar{width:7px}.grid-item-TraitBox::-webkit-scrollbar-thumb{background-color:#242322;border-radius:5px}.grid-item-RecommendDeckBox{grid-area:R}.grid-item-SetChampionBox{grid-area:S}.version{color:#fff;font-size:16px;font-weight:700;margin-top:10px;text-align:right;width:1800px}.championBoxWrap{display:inline}.championBox{height:90%;overflow:auto;width:100%}.championBox::-webkit-scrollbar{width:7px}.championBox::-webkit-scrollbar-thumb{background-color:#242322;border-radius:5px}.championBoxTool{display:flex;flex-direction:row}.button{font-size:16px;width:100px}.TraitWrap{background-color:#272525;border-radius:5px;display:flex;flex-direction:row;height:30px;margin-bottom:5px;margin-top:5px;width:97%}.TraitTextWrap{color:#fff;margin-top:5px}.TraitImgWrap{filter:brightness(0) invert(1);height:30px;margin:5px;width:30px}.TraitImg{height:100%;width:100%}.EffectsWrap{margin:5px}.traitText{color:#fff}.championComponent{border-radius:5px;cursor:pointer;display:inline-table;height:65px;margin:2px;width:65px}.championComponent img{border-radius:5px;vertical-align:middle;width:100%}.championName{color:#fff;font-size:12px;font-weight:700;height:0;left:50%;margin-bottom:0;margin-top:0;position:relative;text-align:center;text-shadow:-1px 0 #000,0 1px #000,1px 0 #000,0 -1px #000;transform:translate(-48%,-20px);width:70px}.long{font-size:12px;transform:translate(-48%,-30px)}.cost-1{background-color:grey;border:3px solid grey}.cost-2{background-color:#90ee90;border:3px solid #90ee90}.cost-3{background-color:#3993b1;border:3px solid #3993b1}.cost-4{background-color:purple;border:3px solid purple}.cost-5{background-color:gold;border:3px solid gold}.cost-6{background-color:#e0abe0;border:3px solid #e0abe0}.championINFO{background:#000000e6;border-radius:5px;box-shadow:0 4px 6px #000c;color:#fff;padding:10px;position:absolute;width:380px;z-index:10}.championINFOname{margin-bottom:10px}.championINFOtraits{display:flex;flex-direction:column;gap:8px;margin-bottom:10px}.championINFOtraits div{align-items:center;display:flex;height:20px;width:20px}.championINFOtraitImg{height:100%;margin-right:8px;object-fit:cover;width:100%}.championINFOtraits div span{text-align:left;white-space:nowrap}.championINFOskill{display:flex;flex-direction:column;gap:8px}.skillWrap{align-items:center;display:flex;gap:8px;height:60px;width:60px}.championINFOskillImg{height:100%;object-fit:cover;width:100%}.championINFOskill div span{display:block;letter-spacing:1.5px;line-height:1.5;margin-left:10px;text-align:left;white-space:nowrap}.skillINFO{font-size:13px;margin-bottom:15px;margin-top:15px}.not-matched{opacity:.3}.inputBox{background-color:#242322;border-radius:5px;color:#fff;font-size:16px;height:30px;margin-bottom:10px;margin-left:30px;padding-left:15px;width:300px}.ItemBoxWrap{display:inline}.ItemBox{height:90%;overflow:auto;width:100%}.ItemBox::-webkit-scrollbar{width:7px}.ItemBox::-webkit-scrollbar-thumb{background-color:#242322;border-radius:5px}.ItemBoxButtonWrap{display:flex;flex-direction:row}.button{background-color:#242322;border:0;border-radius:5px;color:gray;cursor:pointer;font-size:16x;height:35px;margin-bottom:5px;margin-right:5px;width:120px}.button.active{background-color:#407c42;border:1px solid #4caf50;color:#fff}.button:hover{color:#fff}.ItemComponentWrap{display:inline-table;padding:3px}.ItemImgWrap{height:40px;width:40px}.ItemImage{border-radius:3px;height:100%;object-fit:cover;width:100%}.ItemComponentUI{transform:translate(-50%,-130%)}.ItemComponentUI,.ItemComponentUI-right{background:#000000e6;border-radius:5px;box-shadow:0 2px 5px #00000080;color:#fff;padding:10px;position:absolute;width:300px;z-index:10}.ItemComponentUI-right{transform:translate(-75%,-133%)}.ItemComposition{flex-wrap:wrap;gap:8px}.ItemComposition,.compositionWrap{align-items:center;display:flex}.ItemCompositionIcon{height:40px;margin-right:4px;width:40px}.compositionWrap span{color:#fff;font-size:30px}.TraitBoxWrap{height:58px}.Trait{background-color:#242322;border-radius:10px;flex-direction:row;height:100%;margin-bottom:5px;margin-top:5px;width:100%}.Trait,.TraitImgContainer{align-items:center;display:flex}.TraitImgContainer{background-color:gray;box-shadow:0 4px 6px #0000004d;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);height:45px;justify-content:center;margin-left:5px;position:relative;width:45px}.TraitImg{border-radius:6px;clip-path:inherit;filter:grayscale(100%) brightness(0);height:70%;object-fit:cover;width:70%}.traitName{color:#fff;width:80px}.traitLevel{color:gray;display:flex;flex-direction:row}.TraitContainer{display:flex;flex-direction:column;padding-left:10px}.arrow{border-bottom:5px solid #0000;border-left:10px solid gray;border-top:5px solid #0000;height:0;margin:5px;width:0}.effectWithArrow{display:flex;flex-direction:row}.highlight{color:#adff2f}.traitStyle1{background-color:#df854e}.traitStyle3{background-color:silver}.traitStyle4{background-color:#fc7a57}.traitStyle5{background-color:gold}.traitStyle6{background-color:#defdf9}.TraitINFO{background-color:#000000e6;border-radius:5px;box-shadow:0 4px 6px #0003;color:#fff;font-size:14px;left:300px;padding:10px;position:absolute;width:400px;z-index:10}.RecommendDeckBoxWrap{display:inline}.RecommendDeckBox{height:90%;overflow:auto;width:100%}.RecommendDeckBox::-webkit-scrollbar{width:10px}.RecommendDeckBox::-webkit-scrollbar-thumb{background-color:#242322;border-radius:5px}.RecommendDeckBoxBtn{display:flex;flex-direction:row}.deckListButton{background-color:#242322;border:0;border-radius:5px;color:gray;cursor:pointer;font-size:20x;height:35px;margin-bottom:5px;margin-right:5px;width:120px}.deckListButton.active{background-color:#407c42;border:1px solid #4caf50;color:#fff}.deckListButton:hover,.deckName{color:#fff}.deckName{background-color:#242322;border-radius:5px;font-size:16px;height:30px;line-height:30px;margin:5px;padding-left:15px}.noRecommend{color:gray;font-size:24px;margin-top:10px}@font-face{font-family:GoyangDeogyang;font-style:normal;font-weight:10;src:url(https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_one@1.0/GoyangDeogyang.woff) format("woff")}body{font-family:GoyangDeogyang}body.no-scroll{overflow:hidden}
/*# sourceMappingURL=main.ee167eca.css.map*/