:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:#776e65;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#faf8ef;font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;font-weight:400;line-height:1.5}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}body{place-items:center;min-width:320px;min-height:100vh;margin:0;display:flex}#root{text-align:center;width:100%;max-width:1280px;margin:0 auto;padding:2rem}.tile{width:var(--tile-size);height:var(--tile-size);z-index:10;justify-content:center;align-items:center;transition:transform .1s ease-in-out;display:flex;position:absolute}.tile-inner{width:calc(100% - var(--grid-gap,15px));height:calc(100% - var(--grid-gap,15px));text-align:center;z-index:10;color:#776e65;background:#eee4da;border-radius:3px;justify-content:center;align-items:center;font-size:55px;font-weight:700;transition:all .1s ease-in-out;display:flex}.tile-2 .tile-inner{background:#eee4da}.tile-4 .tile-inner{background:#ede0c8}.tile-8 .tile-inner{color:#f9f6f2;background:#f2b179}.tile-16 .tile-inner{color:#f9f6f2;background:#f59563}.tile-32 .tile-inner{color:#f9f6f2;background:#f67c5f}.tile-64 .tile-inner{color:#f9f6f2;background:#f65e3b}.tile-128 .tile-inner{color:#f9f6f2;background:#edcf72;font-size:45px}.tile-256 .tile-inner{color:#f9f6f2;background:#edcc61;font-size:45px}.tile-512 .tile-inner{color:#f9f6f2;background:#edc850;font-size:45px}.tile-1024 .tile-inner{color:#f9f6f2;background:#edc53f;font-size:35px}.tile-2048 .tile-inner{color:#f9f6f2;background:#edc22e;font-size:35px}.tile-4096 .tile-inner,.tile-8192 .tile-inner{color:#f9f6f2;background:#3c3a32;font-size:30px}.tile-super .tile-inner{color:#f9f6f2;background:#3c3a32;font-size:25px}@keyframes appear{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}@keyframes pop{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}.tile{animation:.2s ease-in-out appear}.tile-merged .tile-inner{animation:.2s ease-in-out pop}@media screen and (width<=520px){.tile-inner{font-size:35px}.tile-128 .tile-inner,.tile-256 .tile-inner,.tile-512 .tile-inner{font-size:25px}.tile-1024 .tile-inner,.tile-2048 .tile-inner{font-size:20px}}:root{--field-size:min(90vw, 500px);--grid-gap:min(2vw, 15px)}.game-container{padding:var(--grid-gap);cursor:default;touch-action:none;width:var(--field-size);height:var(--field-size);box-sizing:border-box;background:#bbada0;border-radius:6px;position:relative}.grid-container{grid-template-columns:repeat(var(--grid-size,4), 1fr);grid-template-rows:repeat(var(--grid-size,4), 1fr);grid-gap:var(--grid-gap);background:#bbada0;width:100%;height:100%;display:grid}.grid-cell{background:#eee4da59;border-radius:3px;width:100%;height:100%}.tile-container{top:var(--grid-gap);left:var(--grid-gap);right:var(--grid-gap);bottom:var(--grid-gap);z-index:2;position:absolute}.app{color:#776e65;background-color:#faf8ef;flex-direction:column;justify-content:flex-start;align-items:center;min-height:100vh;padding:40px 20px;font-family:Clear Sans,Helvetica Neue,Arial,sans-serif;display:flex}.container{width:100%;max-width:500px}.header{justify-content:space-between;align-items:center;margin-bottom:10px;display:flex}.title{color:#776e65;margin:0;font-size:80px;font-weight:700;line-height:1}.scores-wrapper{gap:10px;display:flex}.score-container{color:#fff;text-align:center;background-color:#bbada0;border-radius:3px;flex-direction:column;justify-content:center;min-width:60px;padding:10px 20px;display:flex}.score-label{text-transform:uppercase;color:#eee4da;font-size:13px;font-weight:700;line-height:1.2;display:block}.score-value{font-size:25px;font-weight:700;line-height:1.2}.game-intro{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.game-description{margin:0;font-size:18px}.controls{margin-bottom:20px}.size-buttons{gap:8px;display:flex}.size-buttons button{color:#fff;cursor:pointer;background:#bbada0;border:none;border-radius:3px;padding:8px 12px;font-size:14px;font-weight:700;transition:background .2s}.size-buttons button:hover{background:#9d8d7d}.size-buttons button.active{background:#8f7a66}.restart-button{color:#fff;cursor:pointer;background:#8f7a66;border:none;border-radius:3px;padding:10px 20px;font-size:18px;font-weight:700;transition:background .2s}.restart-button:hover{background:#7f6a56}.board-container{border-radius:6px;width:fit-content;margin-top:10px;margin-left:auto;margin-right:auto;position:relative;overflow:hidden}.game-message{z-index:100;text-align:center;background:#eee4daba;flex-direction:column;justify-content:center;align-items:center;animation:.8s .1s both fade-in;display:flex;position:absolute;inset:0}.game-message p{margin:0;font-size:60px;font-weight:700}.game-message .lower{gap:15px;margin-top:20px;display:flex}.game-message button{color:#f9f6f2;cursor:pointer;background:#8f7a66;border:none;border-radius:3px;height:40px;padding:0 20px;font-size:18px;font-weight:700;line-height:40px;text-decoration:none;display:inline-block}.game-message button:hover{background:#7f6a56}.game-message.game-won{color:#f9f6f2;background:#edc22e80}.game-explanation{color:#776e65;margin-top:40px;line-height:1.65}.game-explanation hr{border:none;border-bottom:1px solid #d8d4d0;margin:20px 0}.game-explanation a{color:#776e65;font-weight:700;text-decoration:underline}.important{text-transform:uppercase}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@media screen and (width<=520px){.app{padding:20px 10px}.title{font-size:50px}.score-container{padding:5px 10px}.score-value{font-size:18px}.game-description{font-size:15px}.restart-button{padding:8px 15px;font-size:16px}.game-message p{font-size:40px}}
