@keyframes appear{0%{opacity:.3;transform:scale(.5)}to{opacity:1;transform:scale(1)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes slide-in{0%{opacity:0;transform:translateY(-1.88rem)}to{opacity:1;transform:translateY(0)}}body{background:#fbf8ef;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;min-height:100vh;margin:0;font-family:sans-serif;font-size:1.5rem;font-weight:900;display:-ms-flexbox;display:flex;overflow-x:hidden}.container{box-sizing:border-box;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;width:100%;max-width:21.87rem;padding:0 .5rem;display:-ms-flexbox;display:flex}@media (max-width:300px){.container{padding:0 .25rem}}.hidden{display:none}.game-header{box-sizing:border-box;width:100%;margin-bottom:1.25rem;padding:.62rem 0}.game-header__row{-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center;gap:.5rem;width:100%;display:-ms-flexbox;display:flex}@media (max-width:360px){.game-header__row{-ms-flex-pack:center;justify-content:center;gap:.31rem}}@media (max-width:320px){.game-header__row{-ms-flex-flow:wrap;flex-flow:wrap;-ms-flex-pack:center;justify-content:center;gap:.31rem}}.game-header__title{color:#f9f6f2;background:#edc22e;border-radius:.31rem;-ms-flex-negative:0;flex-shrink:0;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;width:4.37rem;height:4.37rem;margin:0;font-size:1.5rem;display:-ms-flexbox;display:flex}@media (max-width:400px){.game-header__title{width:3.75rem;height:3.75rem;font-size:1.25rem}}@media (max-width:360px){.game-header__title{width:3.12rem;height:3.12rem;font-size:1.12rem}}.game-header__score{color:#776e65;background:#d6cdc4;border-radius:.31rem;-ms-flex-direction:column;flex-direction:column;-ms-flex-negative:0;flex-shrink:0;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;width:4.37rem;height:4.37rem;margin:0;font-size:.75rem;display:-ms-flexbox;display:flex}@media (max-width:400px){.game-header__score{width:3.75rem;height:3.75rem}}@media (max-width:360px){.game-header__score{width:3.12rem;height:3.12rem;font-size:.68rem}}.game-header__score-value{font-size:1.12rem;font-weight:900;line-height:1.2}@media (max-width:400px){.game-header__score-value{font-size:1rem}}@media (max-width:360px){.game-header__score-value{font-size:.87rem}}.button{cursor:pointer;color:#f9f6f2;border:none;border-radius:.31rem;-ms-flex-negative:0;flex-shrink:0;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;width:4.37rem;height:4.37rem;margin:0;padding:0;font-family:sans-serif;font-size:1rem;font-weight:700;transition:background .25s;display:-ms-flexbox;display:flex}@media (max-width:400px){.button{width:3.75rem;height:3.75rem;font-size:.87rem}}@media (max-width:360px){.button{width:3.12rem;height:3.12rem;font-size:.75rem}}.button--start{background:#1dae28}.button--start:hover{background:#179921}.button--restart{background:#f1b2b2}.button--restart:hover{background:#f87474}.button--help{white-space:nowrap;background:#3498db;padding:0 .5rem;font-size:1rem}.button--help:hover{background:#2980b9}@media (max-width:400px){.button--help{padding:0 .31rem;font-size:.87rem}}@media (max-width:360px){.button--help{padding:0 .25rem;font-size:.75rem}}.game-field{border-spacing:.5rem;table-layout:fixed;background:#bbada0;border-radius:.31rem;width:100%}.game-field__row{display:table-row}.game-field__cell{-webkit-user-select:none;-ms-user-select:none;user-select:none;box-sizing:border-box;color:#776e65;text-align:center;vertical-align:middle;background:#d6cdc4;border-radius:.31rem;width:4.68rem;height:4.68rem;font-size:1.5rem;font-weight:900}@media (max-width:400px){.game-field__cell{width:4.06rem;height:4.06rem;font-size:1.25rem}}@media (max-width:360px){.game-field__cell{width:3.75rem;height:3.75rem;font-size:1.12rem}}@media (max-width:320px){.game-field__cell{width:3.12rem;height:3.12rem;font-size:1rem}}@media (max-width:300px){.game-field__cell{width:2.81rem;height:2.81rem;font-size:.87rem}}.game-field__cell--appear{animation:.15s ease-out appear}.game-field__cell--2{background:#eee4da}.game-field__cell--4{background:#ede0c8}.game-field__cell--8{color:#f9f6f2;background:#f2b179}.game-field__cell--16{color:#f9f6f2;background:#f59563}.game-field__cell--32{color:#f9f6f2;background:#f67c5f}.game-field__cell--64{color:#f9f6f2;background:#f65e3b}.game-field__cell--128{color:#f9f6f2;background:#edcf72}.game-field__cell--256{color:#f9f6f2;background:#edcc61}.game-field__cell--512{color:#f9f6f2;background:#edc850}.game-field__cell--1024{color:#f9f6f2;background:#edc53f;font-size:1.25rem}@media (max-width:400px){.game-field__cell--1024{font-size:1.12rem}}@media (max-width:360px){.game-field__cell--1024{font-size:1rem}}@media (max-width:320px){.game-field__cell--1024{font-size:.87rem}}@media (max-width:300px){.game-field__cell--1024{font-size:.68rem}}.game-field__cell--2048{color:#f9f6f2;background:#edc22e;font-size:1.25rem}@media (max-width:400px){.game-field__cell--2048{font-size:1.12rem}}@media (max-width:360px){.game-field__cell--2048{font-size:1rem}}@media (max-width:320px){.game-field__cell--2048{font-size:.87rem}}@media (max-width:300px){.game-field__cell--2048{font-size:.68rem}}.message-container{width:100%;margin-top:1.25rem}.message{box-sizing:border-box;color:#776e65;text-align:center;background:#d6cdc4;border-radius:.31rem;width:100%;margin:.31rem 0;padding:.93rem;font-size:1rem}@media (max-width:400px){.message{padding:.5rem;font-size:.75rem}}.message--win{color:#f9f6f2;background:#edc22e}.message--lose{color:#776e65;background:#f1b2b2}.modal{z-index:1000;box-sizing:border-box;background-color:rgba(0,0,0,.5);-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;width:100%;height:100%;padding:.93rem;animation:.3s ease-out fade-in;display:-ms-flexbox;display:flex;position:fixed;top:0;left:0}.modal--hidden{display:none}.modal__content{background-color:#fbf8ef;border-radius:.62rem;width:100%;max-width:31.25rem;max-height:80vh;animation:.3s ease-out slide-in;overflow-y:auto;box-shadow:0 .31rem 1.87rem rgba(0,0,0,.3)}.modal__header{border-bottom:2px solid #bbada0;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center;padding:.93rem 1.25rem;display:-ms-flexbox;display:flex}.modal__title{color:#776e65;margin:0;font-size:1.25rem}@media (max-width:400px){.modal__title{font-size:1.12rem}}@media (max-width:360px){.modal__title{font-size:1rem}}.modal__close{color:#776e65;cursor:pointer;background:0 0;border:none;padding:0;font-size:1.75rem;font-weight:700;line-height:1;transition:color .25s}.modal__close:hover{color:#edc22e}@media (max-width:400px){.modal__close{font-size:1.5rem}}.modal__body{color:#776e65;padding:.93rem 1.25rem}@media (max-width:360px){.modal__body{padding:.62rem}}.modal__section-title{color:#edc22e;margin:.93rem 0 .5rem;font-size:1.12rem}@media (max-width:400px){.modal__section-title{margin:.62rem 0 .31rem;font-size:1rem}}@media (max-width:360px){.modal__section-title{font-size:.87rem}}.modal__section-title:first-child{margin-top:0}.modal__text{margin:.5rem 0;font-size:.87rem;font-weight:400;line-height:1.5}@media (max-width:400px){.modal__text{font-size:.75rem}}.modal__list{margin:.5rem 0;padding-left:1.25rem}@media (max-width:360px){.modal__list{padding-left:.93rem}}.modal__list-item{margin:.31rem 0;font-size:.87rem;font-weight:400;line-height:1.4}@media (max-width:400px){.modal__list-item{font-size:.75rem}}.modal__strong{color:#f67c5f}.modal__footer{text-align:center;padding:.93rem 1.25rem}.modal__button{cursor:pointer;color:#f9f6f2;background:#edc22e;border:none;border-radius:.31rem;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;width:auto;min-width:7.5rem;height:3.12rem;padding:0 1.25rem;font-family:sans-serif;font-size:1rem;font-weight:700;transition:background .25s;display:-ms-flexbox;display:flex}.modal__button:hover{background:#f2b179}@media (max-width:400px){.modal__button{min-width:6.25rem;height:2.81rem;font-size:.87rem}}@media (max-width:360px){.modal__button{min-width:5rem;height:2.5rem;font-size:.75rem}}
/*# sourceMappingURL=index.3f5e5ea5.css.map */
