body{display:flex;align-items:center;justify-content:center;width:100vw;height:100vh;margin:0;padding:0;background-color:#000;font-family:'Courier New', Courier, monospace;color:#fff}

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


﻿.start-screen-container{display:flex;flex-direction:column}.start-screen-container .-stat{display:flex;align-items:center;justify-content:center;width:calc(120vmin);height:calc(78vmin);font-size:4.5vmin;color:#fff;text-align:center;user-select:none}.start-screen-container .-continue{width:calc(120vmin);height:6vmin;font-size:4.5vmin;color:#fff;text-align:center;user-select:none}.game-container{display:flex;flex-direction:column;width:calc(120vmin);height:calc(84vmin);user-select:none}.game-container .-panel{display:flex;align-items:center;justify-content:space-between;width:calc(120vmin);height:6vmin}.game-container .-panel .-diamonds,.game-container .-panel .-time,.game-container .-panel .-score{width:30%;font-size:4.5vmin;color:#fff}.game-container .-panel .-diamonds .-label,.game-container .-panel .-time .-label,.game-container .-panel .-score .-label{display:inline}.game-container .-panel .-diamonds{display:flex}.game-container .-panel .-diamonds .-label{display:flex}.game-container .-panel .-diamonds .-label:after{content:'◈';margin:0 1vmin;line-height:5vmin}.game-container .-panel .-time{text-align:center}.game-container .-panel .-time .-label:before{content:'TIME';margin-right:3vmin}.game-container .-panel .-time .-label.paused:before{content:'';margin:0}.game-container .-panel .-score{text-align:right}.game-container .-panel .-score .-label:before{content:'SCORE';margin-right:3vmin}.game-container .-map{position:relative;width:calc(120vmin);height:calc(78vmin);overflow:hidden}.game-container .-map .-map-canvas{position:absolute;top:0;left:0;width:calc(240vmin);height:calc(132vmin)}

.menu-container{display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:4.5vmin;color:#fff;text-align:center;user-select:none}.menu-container .-controls{display:flex;margin-top:4vmin}.menu-container .-controls .-col{display:flex;align-items:center;margin:0 0.6em}.menu-container .-controls .-col .-level-id{margin:0 0.2em}.menu-container .-controls .-col button{display:inline-block;padding:0 1.4em;margin:0 0 0.3em 0;border-radius:0.15em;box-sizing:border-box;text-decoration:none;font-family:'Courier New', Courier, monospace;font-size:2.5vmin;text-transform:uppercase;color:#fff;background-color:#00b3ff;box-shadow:inset 0 -0.6em 0 -0.35em rgba(0,0,0,0.17);text-align:center;line-height:4.5vmin;position:relative;outline:none;font-weight:400;cursor:pointer}.menu-container .-controls .-col button:active{top:0.1em}.menu-container .-controls .-col button.-lower,.menu-container .-controls .-col button.-higher{padding:0 0.6em}.menu-container .-controls .-col button.-lower span,.menu-container .-controls .-col button.-higher span{position:relative;top:0.1em;display:inline-block;width:0;height:0;border-top:1.125vmin solid transparent;border-bottom:1.125vmin solid transparent}.menu-container .-controls .-col button.-lower span{left:-0.1em;border-right:1.125vmin solid #fff}.menu-container .-controls .-col button.-higher span{left:0.1em;border-left:1.125vmin solid #fff}.modal-container.help .modal-window{border:1px solid #fff;background-color:#000;color:#fff;user-select:none}.modal-container.help .modal-window .modal-close{font-family:'Helvetica', 'Arial', 'sans-serif';color:#b0b0b0}.modal-container.help .modal-window .modal-close:hover{color:#fff}.modal-container.help .modal-window .modal-body .help{width:100%;display:flex;flex-direction:column;font-size:1.7vmin}.modal-container.help .modal-window .modal-body .help h3{margin:0 0 2vmin;padding:0;font-size:3vmin;font-weight:400;text-align:center;text-decoration:underline}.modal-container.help .modal-window .modal-body .help .row{display:flex;align-items:center;justify-content:space-between}.modal-container.help .modal-window .modal-body .help .col{display:flex;align-items:center;width:100%;padding:2vmin}.row+.modal-container.help .modal-window .modal-body .help .col{width:50%}.modal-container.help .modal-window .modal-body .help .col canvas{width:6vmin;height:6vmin;margin-right:2vmin}.modal-container.help .modal-window .modal-body .help .col .description{width:calc(100% - 6vmin - 2vmin)}

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}
