@import"https://fonts.googleapis.com/css2?family=Roboto:wght@100;400;700&display=swap";#root{font-family:Roboto,sans-serif,Helvetica,Arial,sans-serif;color-scheme:dark;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%;height:100%!important;width:100%!important}.app{display:flex;align-items:center;justify-content:center;flex-direction:column;width:100%;height:100%;padding:1rem 0}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;padding:0;box-sizing:border-box;height:100vh;width:100vw;color:#ffffffde;background-color:#000}ol,ul,li{list-style:none}h1,p{margin:0;padding:0}.board-container{display:grid;grid-template-columns:repeat(6,1fr);grid-template-rows:repeat(6,1fr);justify-content:flex-start;width:432px}.board{width:360px;height:360px;display:grid;grid-template-columns:repeat(5,1fr);grid-template-rows:repeat(5,1fr);grid-area:1 / 1 / 6 / 6;position:relative;transform:rotate(270deg)}.board-piece{width:72px;height:72px;position:absolute;display:flex;align-items:center;justify-content:center}.board-right{grid-area:1 / 6 / 6 / 7;display:flex;flex-direction:column;background-color:orange;transform:rotate(180deg)}.board-right div,.board-down div,.board-empty div{display:flex;gap:10px;width:100%;height:100%;text-align:center;align-items:center;justify-content:center}.board-right div{transform:rotate(180deg)}.board-down{grid-area:6 / 1 / 7 / 6;display:flex}.board-down div,.board-right div{background-color:green}.board-down div:nth-child(odd),.board-right div:nth-child(odd){background-color:green}.board-empty{grid-area:6 / 6 / 7 / 7;background-color:#dc143c;display:flex;text-align:center;align-items:center;justify-content:center;font-weight:700}.container{display:grid;grid-template-columns:50% 50%;justify-content:center;align-items:flex-start;gap:10px;padding:1rem;min-height:70%;min-width:auto}.square{background-color:silver;display:flex;align-items:center;justify-content:center;flex-direction:column;transform:rotate(90deg);font-size:12px;width:100%;height:100%}.light{background-color:silver}.square:nth-child(odd),.dark{background-color:#003153}.blocked{background-color:#dc143c!important}.button{color:green;font-weight:700;background-color:transparent;border:1px solid green;padding:.5rem;border-radius:2px;width:100%}.button:hover{cursor:pointer;color:#000;background-color:green;border:1px solid black}.button:disabled{cursor:not-allowed}.text{color:green;display:flex;align-items:center;justify-content:center;flex-direction:column}.text-command{color:#00f;font-weight:bolder}.text-error{color:#dc143c;font-weight:bolder}.text-title{font-size:2rem;font-weight:bolder;color:#fff}.game-controls-controls{display:flex;flex-direction:column;gap:10px;width:100%}.form-container{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%}.form{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;width:100%;height:100%}.game{display:flex;align-content:center;justify-content:center;width:100%}.game-board{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px}.game-controls{display:flex;align-items:flex-start;justify-content:flex-start;gap:10px;width:600px;height:100%}.game-controls-inputs{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:10px;height:100%;width:35%}.game-controls-instructions{display:flex;align-items:flex-start;justify-content:flex-start;flex-direction:column;gap:10px;width:65%;border:1px solid green;border-radius:2px;box-sizing:border-box;padding:1rem;overflow:scroll;font-size:14px}.game-report{color:green;border:1px solid green;padding:1rem;font-weight:bolder;display:flex;flex-direction:column;gap:2px}.game-heading{height:52px;margin-bottom:1rem;display:flex;flex-direction:column;align-items:center;justify-content:flex-end}.commands-log{display:flex;border:1px solid green;border-radius:2px;width:100%;height:100%;padding:.5rem}.input{width:100%;display:flex}.input input{color:green;font-weight:700;background-color:transparent;border:1px solid green;padding:.5rem;border-radius:2px}.input input:focus{outline:none}.log{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:10px}.piece{width:54px;height:54px}.NORTH{transform:rotate(90deg)}.EAST{transform:rotate(180deg)}.SOUTH{transform:rotate(270deg)}.WEST{transform:rotate(0)}@media screen and (max-width: 1280px){.board-container{transform:scale(95%)}.container{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px}.container{min-height:auto;width:100%}.game-controls{width:90%;min-height:400px}}@media screen and (max-width: 768px){.app{justify-content:flex-start}.game-heading{margin-bottom:0}.text{font-size:16px}.button,.game-controls-instructions,.game-report,.text-error,.input,.input::placeholder{font-size:12px}}@media screen and (max-width: 480px){.game-board{height:400px}.game-controls{width:100%;justify-content:center}.game-controls-inputs{width:25%}.game-controls-instructions{width:60%}.container{padding:.25rem!important;gap:1px}.game-board{width:100%}.board-container{transform:scale(85%)}.button,.game-controls-instructions,.game-report,.text-error,.input,.input::placeholder{font-size:10px}.game-controls-instructions,.game-report{padding:.5rem;height:auto}.button{padding:.5rem .25rem}}@media screen and (max-width: 380px){.board-container{transform:scale(75%)}}@media screen and (max-width: 360px){.board-container{transform:scale(.7)}}
