.styles_root__YsfQK{display:flex;align-items:center;justify-content:center;--ggs:1}@media only screen and (min-width:768px){.styles_root__YsfQK{--ggs:2}}.styles_root__pDCy6{height:100%;width:100%;display:grid;position:relative;grid-template-areas:"viewport viewport viewport viewport" "options options options options" "back draw direction play";grid-template-rows:1fr 12.5vw 12.5vw;grid-template-columns:1fr 1fr 1fr 1fr;font-family:Oxanium;background-color:#000}.styles_root__pDCy6 button{border-radius:0;background-color:#fff;z-index:100}.styles_root__pDCy6 button.styles_activeButton___pyx_{background-color:#191970;color:#fff}@media only screen and (min-width:768px){.styles_root__pDCy6{grid-template-areas:"viewport options back" "viewport options draw" "viewport options direction" "viewport options play";grid-template-rows:1fr 1fr 1fr 1fr;grid-template-columns:1fr 12.5vh 12.5vh}}.styles_viewport__EY2Im{grid-area:viewport;height:100%;width:100%;overflow:hidden;background-color:#000;position:relative}.styles_viewport__EY2Im canvas{background-color:#fff}.styles_minimap__aXzKq{position:absolute;top:5px;right:5px;height:20vw;width:40vw;border:1px solid #000;z-index:100;background-color:#ffffffc2}@media only screen and (min-width:768px){.styles_minimap__aXzKq{right:calc(25vh + 5px)}}.styles_actionOptions__MAFOq{grid-area:options;display:flex;border-top:2px solid #000;border-bottom:2px solid #000}@media only screen and (min-width:768px){.styles_actionOptions__MAFOq{border:2px solid #000;border-top:none;border-bottom:none;flex-direction:column}}.styles_actionButton__BO3a5{flex:1 1}.styles_actionButton__BO3a5.styles_left-character__XUS1V{color:#000}.styles_actionButton__BO3a5.styles_right-character__HIrzA{color:gray}.styles_miniViewport__EtZIx{position:absolute;border:1px solid gray}.styles_directionButton__4rkBa{grid-area:direction}.styles_backButton__mwa4N{grid-area:back}.styles_playButton__3h7oP{grid-area:play}.styles_drawButton__2GXMe{grid-area:draw}