.m-board-wrap{aspect-ratio:1;touch-action:none;overscroll-behavior:contain;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;width:min(100%,520px);margin-inline:auto;position:relative;container-type:inline-size}.m-board{--gap:clamp(6px, 2.6cqw, 12px);--slide:.11s;gap:var(--gap);padding:var(--gap);cursor:grab;background:#cfc8bb;border-radius:14px;grid-template-rows:repeat(4,1fr);grid-template-columns:repeat(4,1fr);width:100%;height:100%;display:grid;position:relative}.m-board:focus-visible{outline:3px solid var(--accent);outline-offset:3px}.m-slot{background:#e7e1d6;border-radius:8px}.m-tiles{inset:var(--gap);pointer-events:none;position:absolute}.m-tile{width:calc((100% - 3 * var(--gap)) / 4);height:calc((100% - 3 * var(--gap)) / 4);transform:translate(calc(var(--c) * (100% + var(--gap))), calc(var(--r) * (100% + var(--gap))));transition:transform var(--slide) ease-in-out;z-index:1;position:absolute;top:0;left:0}.m-tile.is-merged{z-index:2}.m-tile-in{letter-spacing:-.02em;font-variant-numeric:tabular-nums;background:var(--t-bg,#f4efe6);width:100%;height:100%;color:var(--t-fg,#3d382f);border-radius:8px;place-items:center;font-size:10.5cqw;font-weight:800;line-height:1;display:grid;box-shadow:0 1px #00000014}.m-tile[data-digits="3"] .m-tile-in{font-size:8.6cqw}.m-tile[data-digits="4"] .m-tile-in{font-size:6.8cqw}.m-tile[data-digits="5"] .m-tile-in,.m-tile[data-digits="6"] .m-tile-in{font-size:5.2cqw}.m-tile[data-v="2"]{--t-bg:#f4efe6;--t-fg:#3d382f}.m-tile[data-v="4"]{--t-bg:#ece3d2;--t-fg:#3d382f}.m-tile[data-v="8"]{--t-bg:#ece6ff;--t-fg:#3b2a85}.m-tile[data-v="16"]{--t-bg:#d9ccff;--t-fg:#33237a}.m-tile[data-v="32"]{--t-bg:#bfa8ff;--t-fg:#26185f}.m-tile[data-v="64"]{--t-bg:#9d80f5;--t-fg:#fff}.m-tile[data-v="128"]{--t-bg:#7d5ce3;--t-fg:#fff}.m-tile[data-v="256"]{--t-bg:#5b3cc4;--t-fg:#fff}.m-tile[data-v="512"]{--t-bg:#46299f;--t-fg:#fff}.m-tile[data-v="1024"]{--t-bg:#321a7c;--t-fg:#fff}.m-tile[data-v="2048"]{--t-bg:#f2b134;--t-fg:#2b1d00}.m-tile[data-v=big]{--t-bg:#1c1b19;--t-fg:#f2b134}.m-tile[data-v="512"] .m-tile-in,.m-tile[data-v="1024"] .m-tile-in,.m-tile[data-v="2048"] .m-tile-in{box-shadow:inset 0 0 0 2px #ffffff40,0 2px 10px #5b3cc459}.m-tile.is-new .m-tile-in{animation:m-appear .16s ease-out calc(var(--slide) - 10ms) backwards}.m-tile.is-merged .m-tile-in{animation:m-merge .19s ease-out calc(var(--slide) - 20ms) backwards}@keyframes m-appear{0%{opacity:0;transform:scale(.2)}}@keyframes m-merge{0%{transform:scale(.6)}55%{transform:scale(1.14)}to{transform:scale(1)}}.m-board.is-bump[data-bump=left]{--bx:-5px;animation:.16s ease-out m-bump-x}.m-board.is-bump[data-bump=right]{--bx:5px;animation:.16s ease-out m-bump-x}.m-board.is-bump[data-bump=up]{--by:-5px;animation:.16s ease-out m-bump-y}.m-board.is-bump[data-bump=down]{--by:5px;animation:.16s ease-out m-bump-y}@keyframes m-bump-x{40%{transform:translateX(var(--bx))}}@keyframes m-bump-y{40%{transform:translateY(var(--by))}}.m-score-box{position:relative}.m-pop{color:var(--accent);pointer-events:none;font-size:.9rem;font-weight:800;animation:.7s ease-out forwards m-float;position:absolute;top:.9rem;right:.5rem}@keyframes m-float{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-.9rem)}}.m-meter{background:var(--surface-2);border-radius:999px;height:6px;overflow:hidden}.m-meter>span{height:100%;width:calc(var(--p,0) * 100%);background:var(--accent);border-radius:inherit;transition:width .25s;display:block}[data-merge-game].is-reached .m-meter>span{background:var(--success)}.m-overlay{z-index:5;color:#1c1b19;text-align:center;backdrop-filter:blur(2px);background:#f7f6f3d1;border-radius:14px;flex-direction:column;justify-content:center;align-items:center;gap:.75rem;padding:1rem;font-size:1.4rem;font-weight:700;display:none;position:absolute;inset:0}[data-merge-game].is-paused .m-overlay[data-for=paused],[data-merge-game].is-over .m-overlay[data-for=over]{display:flex}[data-merge-game].is-over .m-overlay[data-for=over]{pointer-events:none;background:#f7f6f399}[data-merge-game].is-paused .m-tiles{filter:blur(6px)}.m-win dl>div{border-bottom:1px solid var(--border);justify-content:space-between;gap:1rem;padding:.3rem 0;display:flex}.m-win dt{color:var(--muted)}.m-win dd{font-variant-numeric:tabular-nums;font-weight:700}.m-win::backdrop{background:#00000073}@media (prefers-reduced-motion:reduce){.m-board{--slide:0s}.m-tile,.m-meter>span{transition:none}.m-tile .m-tile-in,.m-board.is-bump,.m-pop{animation:none!important}.m-pop{display:none}}.m-static{touch-action:auto;margin:0}