@import url(https://fonts.googleapis.com/css2?family=Rubik:wght@300;400;500;600;700&display=swap);@import url(https://fonts.googleapis.com/css2?family=Rubik+Mono+One&display=swap);*{box-sizing:border-box;font-family:Rubik;margin:0;padding:0}#root,body,html{height:100%}body{background-color:#f5f5f5}.App{display:flex;flex-direction:column;height:100%;justify-content:center;margin:0 auto}.border{border:1px solid #000}.game{aspect-ratio:1;display:grid;grid-template-columns:1fr repeat(8,1fr) 1fr;grid-template-rows:1fr repeat(8,1fr) 1fr;height:auto;margin:0 auto;max-width:100%;width:500px}.values{align-items:center;display:flex;justify-content:space-around}.values>*{font-size:26px;font-weight:700;text-align:center}.values>.exact{color:#b4b4b4}.values>.over{color:red}.column-wall-counter{flex-direction:row;grid-column:2/10;grid-row:1;height:50px}.row-wall-counter{flex-direction:column;grid-column:1;grid-row:2/10;width:50px}.board{display:grid;grid-column:2/10;grid-row:2/10;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(8,1fr);transition:box-shadow 1s linear}.board>.cell{align-items:center;background-color:#fff;box-shadow:0 0 5px 0 rgba(0,0,0,.1),0 0 1px 0 rgba(0,0,0,.1);cursor:pointer;display:flex;flex-direction:column;height:auto;justify-content:center;width:auto}.board>div.wall:before{background-color:#000;content:"";height:100%;-webkit-transform:scale(.9);transform:scale(.9);transition:-webkit-transform .5s cubic-bezier(.36,0,.66,-.56);transition:transform .5s cubic-bezier(.36,0,.66,-.56);transition:transform .5s cubic-bezier(.36,0,.66,-.56),-webkit-transform .5s cubic-bezier(.36,0,.66,-.56);width:100%}.board>div.enemy{color:red}.board>div.treasure{color:#51d8f0}.board>div.flag{color:#dbdbdb}.controls{display:flex;flex-direction:row;gap:15px;margin:0 auto}.controls>button{background-color:#fff;border-radius:8px;box-shadow:0 0 5px 0 rgba(0,0,0,.1),0 0 1px 0 rgba(0,0,0,.1);font-size:1.3em;font-weight:700;padding:8px 14px}button{align-items:center;background-color:initial;border:none;cursor:pointer;display:flex;flex-direction:row;justify-content:center;outline:none}.solved .board>div.wall:before{background-color:#000;content:"";-webkit-transform:scale(1);transform:scale(1)}.solved .board{box-shadow:0 0 5px 0 rgba(0,0,0,.1),0 0 1px 0 rgba(0,0,0,.1)}.solved .board>div{box-shadow:0 0 5px 0 transparent,0 0 1px 0 transparent;cursor:default;transition:box-shadow 1s linear}.solved .board>div.flag{color:transparent;transition:color 1s linear}.solved .treasure-icon{-webkit-animation:spin 1.5s ease-in-out .5s infinite normal forwards;animation:spin 1.5s ease-in-out .5s infinite normal forwards;background-color:initial}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}90%{-webkit-transform:rotate(1turn);transform:rotate(1turn)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}90%{-webkit-transform:rotate(1turn);transform:rotate(1turn)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}