body{height:100vh;width:100vw;margin:0;padding:0;background-color:#000;color:#fff;font-family:'Helvetica', 'Arial', 'sans-serif';user-select:none}#root{display:flex;align-items:center;justify-content:center;width:100%;height:100%}button,input[type=button]{box-shadow:inset 0px 1px 0px 0px #fff;background:linear-gradient(to bottom, #fff 5%, #f6f6f6 100%);background-color:#fff;border:1px solid #dcdcdc;display:inline-block;cursor:pointer;color:#4f4f4f;padding:0.5vmin 1.5vmin;text-decoration:none;text-shadow:0px 1px 0px #fff;font-size:2vmin;outline:none}button:hover,input[type=button]:hover{background:linear-gradient(to bottom, #f6f6f6 5%, #fff 100%);background-color:#f6f6f6;color:#000}button:active,input[type=button]:active{position:relative;top:1px}

@media screen and (orientation: portrait) and (max-device-width: 900px){body{transform:rotate(90deg)}}


.gameWindow{position:relative;display:flex;width:calc(80vmin + calc(10vmin * 4 + 2vmin) + 4vmin);height:calc(80vmin + 4vmin);border:1vmin solid yellow}.gameWindow .boardGrid{width:calc(80vmin);height:calc(80vmin);margin:2vmin}.gameWindow .boardGrid .-board-canvas{z-index:100}.gameWindow .boardGrid .-item-canvas{z-index:101}.gameWindow .boardGrid .-cursor-canvas{z-index:101}.gameWindow .boardGrid .-board-canvas,.gameWindow .boardGrid .-item-canvas,.gameWindow .boardGrid .-cursor-canvas{position:absolute;top:2vmin;left:2vmin;width:calc(80vmin);height:calc(80vmin)}.gameWindow .boardPanel{width:calc(10vmin * 4 + 2vmin)}.gameWindow .boardPanel .-panel-canvas{margin:2vmin 2vmin 0 0;width:calc(10vmin * 4);height:calc(10vmin * 7)}.gameWindow .boardPanel .-panel-buttons{display:flex;align-items:center;justify-content:space-between;height:10vmin;margin:0 2vmin 0 0;padding:0 .5vmin}.gameWindow .boardPanel .-panel-buttons .-button{margin:0 2vmin}

.menu-container{position:relative;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:4vmin;min-width:35vmin;background-color:#bebebe;user-select:none;-moz-user-select:none;font-size:2.5vmin;color:#000}.menu-container .menu-item{width:100%}.menu-container .menu-item:not(:last-child){margin:0 0 2vmin}.menu-container .menu-item .h1{font-size:3vmin;font-weight:700;color:#000;text-align:center;text-transform:uppercase}.menu-container .menu-item .h2{font-size:2.5vmin;font-weight:700;color:#000;text-align:center}.menu-container .menu-item .label{margin:0;padding:0;font-size:2.5vmin;color:#000}.menu-container .menu-item .break{display:block;height:0}.menu-container .menu-item p{margin:0 0 2vmin;padding:0}.menu-container .menu-item hr{margin:0;border:0;height:1px;background-image:-webkit-linear-gradient(left, #bebebe, #000, #bebebe);background-image:-moz-linear-gradient(left, #bebebe, #000, #bebebe);background-image:-ms-linear-gradient(left, #bebebe, #000, #bebebe);background-image:-o-linear-gradient(left, #bebebe, #000, #bebebe)}.menu-container .menu-item input:not([type=checkbox]):not([type=radio]){-webkit-appearance:none;-moz-appearance:none;width:100%;font-size:2.5vmin;outline:none}.menu-container .menu-item input:not([type=checkbox]):not([type=radio])[type=text],.menu-container .menu-item input:not([type=checkbox]):not([type=radio])[type=password]{box-sizing:border-box}.menu-container .menu-item input[type=checkbox],.menu-container .menu-item input[type=radio]{margin:0 1.5vmin 0 0}.menu-container .menu-item select{-webkit-appearance:menulist-button;width:100%;font-size:2.5vmin;outline:none}.menu-container .menu-close{position:absolute;top:0.5vmin;right:0.7vmin;color:#4c4c4c}.menu-container .menu-close:before{content:'\2715';cursor:pointer}.menu-container .menu-close:hover{color:#000}

body{position:relative}.modal-container{position:absolute;top:0;left:0;display:flex;align-items:center;justify-content:center;width:100vw;height:100vh}.modal-container .modal-mask{position:absolute;top:0;left:0;width:100vw;height:100vh;z-index:100001;background-color:rgba(0,0,0,0.5)}.modal-container .modal-window{position:relative;height:auto;padding:2vmin;background-color:#b0b0b0;z-index:100002;font-size:2vmin;color:#000}.modal-container .modal-window.large{width:80vmin}.modal-container .modal-window.medium{width:50vmin}.modal-container .modal-window.small{width:30vmin}.modal-container .modal-window .modal-close{position:absolute;top:0.5vmin;right:0.7vmin;color:#4c4c4c}.modal-container .modal-window .modal-close:before{content:'\2715';cursor:pointer}.modal-container .modal-window .modal-close:hover{color:#000}.modal-container .modal-window .modal-body{padding-right:2vmin}