:root{--main-inc-color:#8a2be2;--enemy-inc-color:red}*{margin:0;padding:0}html{height:100%}body{display:flex;height:90%}.hidden,.hidden2{display:none}@keyframes blink{50%{border-color:transparent}}@keyframes bump{0%{border:2px solid var(--main-inc-color);box-shadow:inset 0 0 0 5px var(--main-inc-color,green);height:20px;opacity:1;transform:scale(1.5)}25%{border:2px solid var(--main-inc-color);box-shadow:inset 0 0 0 1px var(--main-inc-color);height:20px;opacity:.5;transform:scale(1)}50%{border:2px solid var(--main-inc-color);box-shadow:none;height:20px;opacity:0;transform:scale(.5)}to{border:0;height:0;margin:0;opacity:0}}@keyframes up{0%{padding-top:93px}to{padding-top:53px}}@keyframes show{0%{opacity:0}to{opacity:1}}.choosen{animation:blink .5s step-end infinite alternate}.tetradka{background-image:linear-gradient(90deg,transparent 708px,#ed82ad 710px,#ed82ad 711px,transparent 712px),linear-gradient(#e9e9e9 1px,transparent 0),linear-gradient(90deg,#e9e9e9 1px,transparent 0);background-position:0 0,-1px -1px,-1px 1px;background-size:100% 100%,20px 20px,20px 20px;height:100%;margin:10px;max-height:700px}.grid{display:grid;grid-template-columns:2fr 1fr;width:710px}.container{height:100%;position:relative;width:823px}.qrcode.big{left:0;position:fixed;top:0;width:823px}.field{padding-left:60px}.adjust-first{padding-top:93px}.adjust-second{animation-duration:1.2s;animation-fill-mode:forwards;animation-name:show;animation-timing-function:linear;padding-top:55px}.adjust-third{animation-duration:1.2s;animation-fill-mode:forwards;animation-name:up;animation-timing-function:linear}.frame-text{color:var(--main-inc-color);font-family:monospace;font-size:18px;line-height:24px}.frame-text span{display:inline-block;height:20px;text-align:center;width:20px}.before-line{width:710px}.river{background-image:linear-gradient(var(--main-inc-color) 1px,transparent 0),linear-gradient(90deg,var(--main-inc-color) 1px,transparent 0);background-position:0 0,-1px -1px,-1px 1px;background-size:100% 100%,20px 20px,20px 20px;border-bottom:1px solid var(--main-inc-color);border-left:1px solid var(--main-inc-color);height:20px;position:relative;width:360px}.ship{border:1px solid var(--main-inc-color);height:20px;margin-top:18px}.ship-river{top:0}.dot,.ship-river{height:19px;pointer-events:none;position:absolute}.dot{bottom:2px;color:var(--main-inc-color);font-size:20px;text-align:center}.ship.disabled{animation-duration:.8s;animation-fill-mode:forwards;animation-iteration-count:1;animation-name:bump;animation-timing-function:linear;overflow:hidden}.message{color:var(--main-inc-color);font-size:30px;font-style:italic;padding-left:60px;padding-top:26px}.diagonal-line{background:linear-gradient(45deg,transparent 49.9%,var(--main-inc-color) 49.9%,var(--main-inc-color) 60%,transparent 60%) fixed,linear-gradient(45deg,var(--main-inc-color) 10%,transparent 10%) fixed;background-size:.5em .5em}.diagonal-line-enemy{background:linear-gradient(135deg,transparent 49.9%,var(--enemy-inc-color) 49.9%,var(--enemy-inc-color) 60%,transparent 60%) fixed,linear-gradient(135deg,var(--enemy-inc-color) 10%,transparent 10%) fixed;background-size:.5em .5em}.enemy{color:var(--enemy-inc-color)}.shipyard{padding-left:25px;padding-top:19px}.secret-code{cursor:crosshair;user-select:none}.clickable{cursor:pointer;user-select:none}.header1{clear:both;letter-spacing:.4em;overflow:hidden;text-align:center;text-transform:uppercase;white-space:nowrap}.kletka-pole{background-image:linear-gradient(90deg,transparent 81px,#ed82ad 0,#ed82ad 84px,transparent 0),linear-gradient(#bbb 1px,transparent 0),linear-gradient(90deg,#bbb 1px,transparent 0)}.kletka-pole,.kletka-pole-right{background-position:0 0,-1px -1px,-1px 1px;background-size:100% 100%,20px 20px,20px 20px}.kletka-pole-right{background-image:linear-gradient(90deg,transparent 735px,#ed82ad 0,#ed82ad 738px,transparent 0),linear-gradient(#bbb 1px,transparent 0),linear-gradient(90deg,#bbb 1px,transparent 0);font-style:italic}.kletka-pole-yellow{background-color:#ffffef;background-image:linear-gradient(90deg,transparent 81px,#ed82ad 0,#ed82ad 84px,transparent 0),linear-gradient(#eee 1px,transparent 0),linear-gradient(90deg,#eee 1px,transparent 0);background-position:0 0,-1px -1px,-1px 1px;background-size:100% 100%,20px 20px,20px 20px}.qrcode{height:300px}.qrcode,.qrcontainer{display:inline-block;width:300px}.qrcontainer{position:fixed}@media (min-width:1180px){.qrcontainer{right:0;top:0}}@media (max-width:1090px){.qrcontainer{bottom:0;left:0;margin:5% auto;right:0}}.install{background-color:var(--main-inc-color);border:none;cursor:pointer;font:700 24px/100px Tahoma,sans-serif;height:100px;margin-top:10px;max-height:100px;padding:0;text-align:center;width:100%}.overlay{background:rgba(0,0,0,.7);inset:0;opacity:0;position:absolute;transition:opacity .5s;visibility:hidden}.overlay.show{opacity:1;visibility:visible}.popup{background:#fff;border-radius:5px;margin:70px auto;padding:20px;position:relative;transition:all 5s ease-in-out;width:80%}.popup h2{color:#333;font-family:Tahoma,Arial,sans-serif;margin-top:0}.popup .close{color:#333;font-size:30px;font-weight:700;position:absolute;right:30px;text-decoration:none;top:20px;transition:all .2s}.popup .close:hover{color:#4169e1}.popup .content{max-height:30%;overflow:auto}@media (max-width:450px){.grid{grid-template-columns:1fr;width:calc(100vw - 10px)}.field{padding-left:0}.tetradka{margin:5px}.before-line{width:calc(100vw - 10px)}.header1{font-size:1.5em;letter-spacing:.3em;padding-top:13px}.shipyard{display:flex;padding-left:19px;padding-top:20px}.adjust-second{padding-top:53px}.ship{margin-right:18px;margin-top:0}.ship.disabled{animation:none;border-color:transparent;pointer-events:none}body{display:flex;flex-wrap:wrap}.qrcode.big{left:0;position:fixed;top:0;width:calc(100vw - 10px)}}