*{box-sizing:border-box}
body{margin:0;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif;background:#faf8ef;color:#776e65;display:flex;min-height:100vh;align-items:center;justify-content:center}
h1{margin:0;font-size:56px;line-height:1}
.wrap{width:min(520px,92vw)}
.top{display:flex;align-items:end;justify-content:space-between;margin-bottom:14px}
.scores{display:flex;gap:8px}
.score{background:#bbada0;color:#fff;border-radius:8px;padding:6px 10px;text-align:center;min-width:78px}
.score span{display:block;font-size:12px;text-transform:uppercase;opacity:.9}
.score strong{font-size:20px}
.controls{display:flex;justify-content:flex-end;margin-bottom:12px}
.controls button{border:0;background:#8f7a66;color:#fff;border-radius:8px;padding:10px 14px;font-weight:700;cursor:pointer}
.board{position:relative;background:#bbada0;border-radius:10px;padding:12px;width:100%;aspect-ratio:1/1}
.grid{position:absolute;inset:12px;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(4,1fr);gap:12px}
.cell{background:#cdc1b4;border-radius:8px}
.tiles{position:absolute;inset:12px}
.tile{position:absolute;display:flex;align-items:center;justify-content:center;width:calc((100% - 36px)/4);height:calc((100% - 36px)/4);border-radius:8px;font-weight:900;font-size:30px;transition:transform .1s ease, background .2s ease, color .2s ease}
.tile.new{animation:pop .12s ease}
.tile.merged{animation:pop .12s ease}
@keyframes pop{0%{transform:scale(.8)}100%{transform:scale(1)}}
.hint{opacity:.7;text-align:center;margin-top:10px}
.tile.v2{background:#eee4da;color:#776e65}
.tile.v4{background:#ede0c8;color:#776e65}
.tile.v8{background:#f2b179;color:#f9f6f2}
.tile.v16{background:#f59563;color:#f9f6f2}
.tile.v32{background:#f67c5f;color:#f9f6f2}
.tile.v64{background:#f65e3b;color:#f9f6f2}
.tile.v128{background:#edcf72;color:#f9f6f2;font-size:26px}
.tile.v256{background:#edcc61;color:#f9f6f2;font-size:26px}
.tile.v512{background:#edc850;color:#f9f6f2;font-size:26px}
.tile.v1024{background:#edc53f;color:#f9f6f2;font-size:22px}
.tile.v2048{background:#edc22e;color:#f9f6f2;font-size:22px}