.App{text-align:center;display:flexbox;flex-direction:column;justify-content:center;align-items: center;height:100%;margin:30px auto}.App-logo{pointer-events:none;height:40vmin}@media (prefers-reduced-motion:no-preference){.App-logo{animation:App-logo-spin infinite 20s linear}}html,body{height:95%}.App-header{display:flex;color:#fff;background-color:#282c34;flex-direction:column;justify-content:center;align-items: center;min-height:100vh;font-size:calc(10px + 2vmin)}.App-link{color:#61dafb}@keyframes App-logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.resource-panel{position:relative;display:flex;flex-direction:column;justify-content:flex-start;align-items: start;width:10%;margin:0;font-size:40px;top:0;left:0}.resource-panel-item{display:flex;align-self:left;flex-direction:row;justify-content:left;width:-moz-fit-content;width:fit-content;min-width:100%;margin-block-start:0;margin-block-end:0;padding:1rem}.board{flex-direction:column;justify-content:center;align-items: center;gap:1rem;height:100%;padding:10px}.top-panel,.middle-panel{position:relative;display:flex;flex-direction:row;justify-content:flex-start;align-items: flex-start;gap:1rem;width:100%;height:45%;top:0;left:0}.play-area{position:absolute;display:flex;flex-direction:column;justify-content:flex-start;align-items: flex-start;width:-moz-fit-content;width:fit-content;max-width:700px;margin-top:0%;margin-bottom:0%;margin-left:20%;font-size:40px;top:0}.permanent-row{display:flex;flex-direction:row;justify-content:flex-start;align-items: start;gap:1em;width:-moz-fit-content;width:fit-content;max-width:700px;margin-top:3%;margin-bottom:3%;margin-left:0%;font-size:40px}.permanent{display:flex;vertical-align:center;background-color:#fff;border:3px solid #000;flex-direction:column;justify-content:center;gap:1rem;width:60px;min-width:60px;height:60px;margin:10px;padding:1em}.middle-panel{position:relative;display:flexbox;border:3px solid #000;flex-direction:row;justify-content:center;align-items: center;gap:1rem;width:100%;height:20%;top:5%;bottom:5%;left:0}.played-cards-area{position:relative;display:flex;vertical-align:center;border:2px solid green;flex-direction:row;justify-content:center;align-items: center;gap:-1rem;width:80%;height:80%;margin:10px;left:0}.card-container{display:flex;border:3px dashed #000;flex-direction:row;justify-content:center;align-items: center;gap:1rem;width:95%;min-width:100px;height:300px;margin-top:auto;margin-bottom:10px}.card{--scale_value:1;display:flex;vertical-align:center;transform:scale(var(--scale_value));background-color:#fff;border:3px solid #000;border-radius:10px;flex-direction:column;justify-content:center;width:110px;height:210px;margin:auto;padding:1rem}.card-small{--scale_value:.5}.card:hover{cursor:pointer}.card-cost{margin-top:auto;font-size:20px}.deck{vertical-align:center;border:3px solid #000;width:20%;height:90%;margin-left:1rem}.hand{display:flex;vertical-align:center;border:3px solid #000;flex-direction:row;justify-content:center;width:60%;height:90%}.discard{border:3px solid #000;justify-content:center;width:20%;height:90%;margin-right:1rem}.input-container{position:fixed;opacity:1;display:flex;display:flex;background-color:#fff;border-style:double;border-color:#000;border-radius:1rem;flex-direction:column;justify-content:center;align-items: center;gap:1rem;width:70%;height:70%;inset:15%}.input-option{display:flex;background-color:#fff;border:3px solid #000;flex-direction:row;justify-content:center;align-items: center;gap:1rem;width:60%;margin:auto;font-size:40px}.input-button{background-color:#fff;align-items: center;width:30%;min-height:20px;margin:auto;font-size:30px}
