#game-container{background-color:var(--gameBackground);width:18.4rem;height:18.4rem;border-radius:.75rem;margin-bottom:2rem;display:flex;flex-direction:column;justify-content:space-evenly;align-items:center;transform:scale(0);opacity:0;filter:saturate(0)}#game-container.show{transition:all .5s;transform:scale(1);opacity:1;filter:saturate(1)}#game-container.show.translucent{opacity:.01}#game-container .tile-row{height:20%;width:100%;display:flex;justify-content:space-evenly;align-items:center}#game-container .tile-row .tile-container{width:20%;height:100%;display:flex;justify-content:center;align-items:center;background-color:var(--tileBackground);border-radius:.5rem;position:relative}#game-container .tile-row .tile-container .tile{height:100%;width:100%;display:flex;justify-content:center;align-items:center;border-radius:.5rem;transition:all .2s;position:absolute;color:#fff}#game-container .tile-row .tile-container .tile.despawn{transform:scale(0);filter:saturate(0)}#game-container .tile-row .tile-container .tile.value-2{background-color:var(--2)}#game-container .tile-row .tile-container .tile.value-2 .tile-value{color:var(--altText)}#game-container .tile-row .tile-container .tile.value-4{background-color:var(--4)}#game-container .tile-row .tile-container .tile.value-4 .tile-value{color:var(--altText)}#game-container .tile-row .tile-container .tile.value-8{background-color:var(--8)}#game-container .tile-row .tile-container .tile.value-16{background-color:var(--16)}#game-container .tile-row .tile-container .tile.value-32{background-color:var(--32)}#game-container .tile-row .tile-container .tile.value-64{background-color:var(--64)}#game-container .tile-row .tile-container .tile.value-128{background-color:var(--128)}#game-container .tile-row .tile-container .tile.value-256{background-color:var(--256)}#game-container .tile-row .tile-container .tile.value-512{background-color:var(--512)}#game-container .tile-row .tile-container .tile.value-1024{background-color:var(--1024)}#game-container .tile-row .tile-container .tile.value-1024 .tile-value{font-size:1.25rem}#game-container .tile-row .tile-container .tile.value-2048{background-color:var(--2048)}#game-container .tile-row .tile-container .tile.value-2048 .tile-value{font-size:1.25rem}#game-container .tile-row .tile-container .tile.spawning{animation:spawn .2s ease-out 1 forwards}#game-container .tile-row .tile-container .tile.move-tile-up-1{animation:moveTileUp1 .2s ease-out 1 forwards}#game-container .tile-row .tile-container .tile.move-tile-up-2{animation:moveTileUp2 .2s ease-out 1 forwards}#game-container .tile-row .tile-container .tile.move-tile-up-3{animation:moveTileUp3 .2s ease-out 1 forwards}#game-container .tile-row .tile-container .tile.move-tile-down-1{animation:moveTileDown1 .2s ease-out 1 forwards}#game-container .tile-row .tile-container .tile.move-tile-down-2{animation:moveTileDown2 .2s ease-out 1 forwards}#game-container .tile-row .tile-container .tile.move-tile-down-3{animation:moveTileDown3 .2s ease-out 1 forwards}#game-container .tile-row .tile-container .tile.move-tile-left-1{animation:moveTileLeft1 .2s ease-out 1 forwards}#game-container .tile-row .tile-container .tile.move-tile-left-2{animation:moveTileLeft2 .2s ease-out 1 forwards}#game-container .tile-row .tile-container .tile.move-tile-left-3{animation:moveTileLeft3 .2s ease-out 1 forwards}#game-container .tile-row .tile-container .tile.move-tile-right-1{animation:moveTileRight1 .2s ease-out 1 forwards}#game-container .tile-row .tile-container .tile.move-tile-right-2{animation:moveTileRight2 .2s ease-out 1 forwards}#game-container .tile-row .tile-container .tile.move-tile-right-3{animation:moveTileRight3 .2s ease-out 1 forwards}#game-container .tile-row .tile-container .tile.shadow{box-shadow:#fff9 2px 2px 10px}#game-container .tile-row .tile-container .tile .tile-value{font-size:1.5rem;font-weight:800;color:#fff}#game-container .tile-row .tile-container .tile .tile-value.merged{animation:merged .2s ease-out 1 forwards}@keyframes spawn{0%{transform:scale(0);filter:saturate(0)}30%{transform:scale(1.25)}to{transform:scale(1);filter:saturate(1)}}@keyframes moveTileUp1{0%{transform:translateY(0)}to{transform:translateY(-4.416rem)}}@keyframes moveTileUp2{0%{transform:translateY(0)}to{transform:translateY(-8.832rem)}}@keyframes moveTileUp3{0%{transform:translateY(0)}to{transform:translateY(-13.248rem)}}@keyframes moveTileDown1{0%{transform:translateY(0)}to{transform:translateY(4.416rem)}}@keyframes moveTileDown2{0%{transform:translateY(0)}to{transform:translateY(8.832rem)}}@keyframes moveTileDown3{0%{transform:translateY(0)}to{transform:translateY(13.248rem)}}@keyframes moveTileLeft1{0%{transform:translate(0)}to{transform:translate(-4.416rem)}}@keyframes moveTileLeft2{0%{transform:translate(0)}to{transform:translate(-8.832rem)}}@keyframes moveTileLeft3{0%{transform:translate(0)}to{transform:translate(-13.248rem)}}@keyframes moveTileRight1{0%{transform:translate(0)}to{transform:translate(4.416rem)}}@keyframes moveTileRight2{0%{transform:translate(0)}to{transform:translate(8.832rem)}}@keyframes moveTileRight3{0%{transform:translate(0)}to{transform:translate(13.248rem)}}@keyframes merged{0%{transform:scale(0)}35%{transform:scale(1.125)}to{transform:scale(1)}}#score-container{color:var(--textColor);background-color:var(--tileBackground);width:18.4rem;display:flex;justify-content:space-between;align-items:center;padding:.625rem 1.875rem;border-radius:.5rem;margin-bottom:1.5rem;opacity:0;transform:scale(0)}#score-container.show{transition:all .5s;opacity:1;transform:scale(1)}#score-container.translucent{opacity:.01}#score-container .score-container__current,#score-container .score-container__high-score{display:flex;flex-direction:column;justify-content:center;align-items:center}#score-container .score-container__current .title,#score-container .score-container__high-score .title{font-size:.875rem;font-weight:800}#score-container .score-container__current .score,#score-container .score-container__high-score .score{font-size:1.25rem;font-style:800}#score-container .score-container__current .score.score-updated,#score-container .score-container__high-score .score.score-updated{animation:scoreUpdate .2s ease-out 1 forwards}@keyframes scoreUpdate{0%{filter:saturate(1);transform:scale(1);font-weight:400}40%{filter:saturate(.75);transform:scale(1.375);font-weight:800}to{filter:saturate(1);transform:scale(1);font-weight:400}}.overlay{height:100%;width:100%;position:absolute;top:0;left:0;background-color:var(--overlayColor);transition:transform 0s,opacity .5s;transform:translate(-100vw);opacity:0;z-index:999}.overlay.show{transform:translate(0);opacity:1}.overlay.show.hide{opacity:0}.toggle-theme-list{height:2.5rem;width:2.5rem;display:flex;justify-content:center;align-items:center;background-color:var(--gameBackground);border:none;border-radius:.5rem;position:fixed;top:3rem;right:calc((100vw - 18.4rem)/2);z-index:1000;transform:scale(0);opacity:0}.toggle-theme-list.show{transition:all .5s;transform:scale(1);opacity:1}.toggle-theme-list:hover{cursor:pointer}.toggle-theme-list.translucent{opacity:.01}.toggle-theme-list img{height:50%;width:auto;object-fit:cover;filter:invert(1)}.theme-list{width:100%;height:100vh;background-color:transparent;display:flex;flex-direction:column;justify-content:center;align-items:center;position:absolute;top:0;left:0;transform:translate(-100vw);z-index:999;row-gap:1rem;transition:all .5s;opacity:0}.theme-list.show{opacity:1;transform:translate(0)}.theme-list button{display:flex;justify-content:center;align-items:center;padding:.5rem 1rem;border-radius:200rem;border:none;background-color:var(--tileBackground);transition:all .375s;border:2px solid var(--tileBackground)}.theme-list button:hover{cursor:pointer;opacity:1}.theme-list button.active .theme-preview img{transform:scale(1)}.theme-list button .theme-preview{height:1.25rem;width:1.25rem;border-radius:50%;margin-right:.5rem;display:flex;justify-content:center;align-items:center}.theme-list button .theme-preview img{transition:all .375s;transform:scale(0);height:.75rem;width:.75rem;object-fit:cover}.theme-list button .theme-title{font-weight:600;color:var(--textColor)}.game-over-banner{position:absolute;top:50%;left:50%;transform:translateY(-50%) translate(-50%) scale(1);z-index:999999999;display:flex;flex-direction:column;justify-content:center;align-items:center;transition:all .5s;height:100%;width:100%}.game-over-banner.hidden{display:none}.game-over-banner.hide-banner{transform:translateY(-50%) translate(-50%) scale(0)}.game-over-banner.translucent{opacity:.1}.game-over-banner .game-over-banner__message{margin-bottom:1rem;font-size:2rem;font-weight:900;text-transform:uppercase;color:var(--altText);text-align:center}.game-over-banner .restart-game{background-color:var(--tileBackground);color:var(--backgroundColor);text-transform:uppercase;font-size:1rem;padding:.625rem 1.25rem;border-radius:.375rem;border:none;font-weight:800;transition:opacity .5s,background-color .125s}.game-over-banner .restart-game:hover{background-color:var(--altText);cursor:pointer}@font-face{font-family:Nunito;src:url(/assets/Nunito-D2sADkEI.ttf) format("truetype")}:root{--2: #eee3d9;--4: #ede0c8;--8: #f2b179;--16: #f59564;--32: #f67c60;--64: #f65e3a;--128: #edd072;--256: #edcc60;--512: #ffb904;--1024: #ff9600;--2048: black;--altText: #776e65;--backgroundColor: #faf9ef;--tileBackground: #ccc0b4;--gameBackground: #bbada0;font-family:Nunito,system-ui,Avenir,Helvetica,Arial,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*,*:before,*:after{padding:0;margin:0;box-sizing:border-box;scrollbar-width:none}html,body{height:100vh;width:100%;min-width:360px;font-size:16px;display:flex;justify-content:center;align-items:center;background-color:var(--backgroundColor);position:relative;overflow:hidden}#app{width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center}@media screen and (min-width:56.25rem){html,body{font-size:1.5vw}}@media screen and (min-width:65.625rem){html,body{font-size:1.35vw}}@media screen and (min-width:106.25rem){html,body{font-size:1vw}}