@import "https://fonts.googleapis.com/css2?family=Nunito:wght@700;900&display=swap";.header{cursor:default;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center;width:100%;padding:20px 0;animation:1s ease-in slide-down;display:-ms-flexbox;display:flex}.header__controls{-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center;gap:10px;width:100%;padding:0 10px;display:-ms-flexbox;display:flex}.header__info{box-sizing:border-box;text-align:center;text-transform:uppercase;color:#f9f6f2;background:#bbada0;border-radius:12px;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;width:75px;height:75px;margin:0 0 0 auto;font-size:14px;transition:transform .15s ease-in-out;display:-ms-flexbox;display:flex;box-shadow:0 10px 20px rgba(119,110,101,.3)}.header__info:hover{filter:brightness(105%);transform:translateY(-5px);box-shadow:0 8px 15px rgba(242,246,180,.6)}.header__score{color:#f9f6f2;font-size:22px;font-weight:900;line-height:1.2}.header__button{color:#f9f6f2;cursor:pointer;border:none;border-radius:12px;width:75px;height:75px;font-family:inherit;font-size:18px;font-weight:700}.header__button--start{background:#1dae28;transition:transform .15s,filter .15s,box-shadow .15s;box-shadow:0 10px 20px rgba(119,110,101,.3)}.header__button--start:hover{filter:brightness(110%);transform:translateY(-5px);box-shadow:0 8px 15px rgba(45,156,94,.4)}.header__button--start:active{transform:translateY(1px)}.header__button--restart{background:#f87474;transition:filter .15s,transform .15s,box-shadow .15s;box-shadow:0 10px 20px rgba(119,110,101,.3)}.header__button--restart:hover{filter:brightness(110%);transform:translateY(-5px);box-shadow:0 8px 15px rgba(222,42,39,.4)}.header__button--restart:active{transform:translateY(1px)}.game-board{box-sizing:border-box;touch-action:none;background:#bbada0;border:none;border-radius:12px;width:fit-content;padding:10px;animation:1s ease-out forwards slide-down;position:relative;box-shadow:0 10px 20px rgba(119,110,101,.3)}.game-container{grid-template-rows:repeat(4,75px);grid-template-columns:repeat(4,75px);gap:10px;display:grid}.game-cell{background:#d6cdc4;border-radius:12px;width:75px;height:75px;box-shadow:inset -10px -10px 6px rgba(0,0,0,.05)}.message{box-sizing:border-box;text-align:center;color:#776e65;background:#fff;border:1px solid rgba(119,110,101,.1);border-radius:12px;width:100%;padding:10px;font-size:20px;transition:translate .15s ease-in-out,transform .2s ease-in-out;box-shadow:0 10px 20px rgba(119,110,101,.3)}.message:hover{filter:brightness(105%);transform:translateY(-5px);box-shadow:0 8px 15px rgba(242,246,180,.6)}.message-container{cursor:default;width:100%;height:150px;animation:1s ease-out forwards slide-down}.message-win{color:#fff;background:#edc22e;border:none;box-shadow:0 8px 25px rgba(237,194,46,.3)}.message-lose{color:#fff;background:#f87474;border:none;box-shadow:0 8px 25px rgba(248,116,116,.3)}.tile-container{width:calc(100% - 20px);height:calc(100% - 20px);position:absolute;top:10px;left:10px}.tile-new{animation:.2s ease-in-out appear}.tile-merged{animation:.2s ease-in-out pop}.tile{box-sizing:border-box;text-align:center;color:#776e65;-webkit-user-select:none;-ms-user-select:none;user-select:none;border-radius:12px;width:75px;height:75px;line-height:75px;transition:translate .15s ease-in-out,transform .2s ease-in-out;position:absolute;box-shadow:0 10px 20px rgba(119,110,101,.3)}.tile:hover{filter:brightness(105%);transform:translateY(-5px);box-shadow:0 8px 15px rgba(242,246,180,.6)}.tile--2{background:#eee4da}.tile--4{background:#ede0c8}.tile--8{color:#f9f6f2;background:#f2b179}.tile--16{color:#f9f6f2;background:#f59563}.tile--32{color:#f9f6f2;background:#f67c5f}.tile--64{color:#f9f6f2;background:#f65e3b}.tile--128{color:#f9f6f2;background:#edcf72}.tile--256{color:#f9f6f2;background:#edcc61}.tile--512{color:#f9f6f2;background:#edc850}.tile--1024{color:#f9f6f2;background:#edc53f}.tile--2048{color:#f9f6f2;background:#edc22e}.tile-position-0-0{translate:0}.tile-position-1-0{translate:85px}.tile-position-2-0{translate:170px}.tile-position-3-0{translate:255px}.tile-position-0-1{translate:0 85px}.tile-position-1-1{translate:85px 85px}.tile-position-2-1{translate:170px 85px}.tile-position-3-1{translate:255px 85px}.tile-position-0-2{translate:0 170px}.tile-position-1-2{translate:85px 170px}.tile-position-2-2{translate:170px 170px}.tile-position-3-2{translate:255px 170px}.tile-position-0-3{translate:0 255px}.tile-position-1-3{translate:85px 255px}.tile-position-2-3{translate:170px 255px}.tile-position-3-3{translate:255px 255px}@keyframes appear{0%{scale:0}to{scale:1}}@keyframes pop{0%{scale:1}50%{scale:1.2}to{scale:1}}@keyframes slide-down{0%{opacity:0;transform:translateY(20px)}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:Nunito,sans-serif;font-size:24px;font-weight:900;display:-ms-flexbox;display:flex}.app{-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;width:350px;display:-ms-flexbox;display:flex}h1{color:#f9f6f2;box-sizing:border-box;background:#edc22e;border-radius:12px;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;width:75px;height:75px;margin:0;font-size:24px;font-weight:900;transition:transform .15s ease-in-out;display:-ms-flexbox;display:flex;box-shadow:0 10px 20px rgba(119,110,101,.3)}h1:hover{filter:brightness(105%);transform:translateY(-5px);box-shadow:0 8px 15px rgba(242,246,180,.6)}.hidden{display:none}
/*# sourceMappingURL=index.63728e10.css.map */