.g2048{--move: .17s;--board: #e7e6e3;--empty: var(--g0);width:min(100%,440px);display:flex;flex-direction:column;gap:14px;--ease: cubic-bezier(.2, 0, 0, 1)}.g2048 .head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px}.g2048 .back{display:inline-block;margin-bottom:8px;font-size:14px}.g2048 .lede{margin-top:6px;max-width:26ch}.g2048 .scores{display:flex;gap:8px;flex:none}.g2048 .score{min-width:76px;padding:6px 10px 8px;border-radius:4px;background:var(--g0);text-align:right}.g2048 .score span{display:block;color:var(--muted)}.g2048 .score b{display:block;margin-top:2px;font-size:20px;font-weight:600;line-height:1.1;font-variant-numeric:tabular-nums;color:var(--fg)}.g2048 .score b.up{animation:g2048-score .42s var(--ease)}.g2048 .bar{display:flex;align-items:center;justify-content:space-between;gap:12px}.g2048 .how{margin:0}.g2048 button{height:28px;padding:0 10px;border:1px solid var(--btn-line);border-radius:6px;background:transparent;color:var(--muted);font:12px var(--font-mono);cursor:pointer}.g2048 button:hover,.g2048 button:focus-visible{border-color:var(--hairline);color:var(--fg)}.g2048 .board{position:relative;width:100%;aspect-ratio:1;padding:8px;border-radius:8px;background:var(--board);touch-action:none;user-select:none;-webkit-user-select:none}.g2048 .cells{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;height:100%}.g2048 .cells i{border-radius:4px;background:var(--empty);box-shadow:inset 0 0 0 1px var(--hairline)}.g2048 .tiles{position:absolute;inset:8px}.g2048 .slot{position:absolute;width:calc((100% - 24px)/4);height:calc((100% - 24px)/4);transform:translate(calc(var(--c) * (100% + 8px)),calc(var(--r) * (100% + 8px)));transition:transform var(--move) var(--ease);will-change:transform;z-index:1;container-type:inline-size}.g2048 .slot.is-absorb{z-index:2}.g2048 .face{width:100%;height:100%;border-radius:4px;display:grid;place-items:center;font-weight:600;letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums;font-size:34cqw}.g2048 .face[data-d="3"]{font-size:28cqw}.g2048 .face[data-d="4"]{font-size:22cqw}.g2048 .face[data-d="5"],.g2048 .face[data-d="6"]{font-size:16cqw}.g2048 .face[data-v="2"]{background:var(--g0);color:var(--fg);box-shadow:inset 0 0 0 1px var(--hairline)}.g2048 .face[data-v="4"]{background:color-mix(in srgb,var(--g0) 42%,var(--g1));color:var(--fg)}.g2048 .face[data-v="8"]{background:var(--g1);color:light-dark(#431407,var(--fg))}.g2048 .face[data-v="16"]{background:color-mix(in srgb,var(--g1) 40%,var(--g2));color:light-dark(#431407,#fed7aa)}.g2048 .face[data-v="32"]{background:var(--g2);color:light-dark(#431407,#fff7ed)}.g2048 .face[data-v="64"]{background:color-mix(in srgb,var(--g2) 38%,var(--g3));color:light-dark(#fff,#2a0e05)}.g2048 .face[data-v="128"]{background:var(--g3);color:light-dark(#fff,#1a0904)}.g2048 .face[data-v="256"]{background:light-dark(#9a3412,#fdba74);color:light-dark(#fff,#431407)}.g2048 .face[data-v="512"]{background:light-dark(#7c2d12,#fed7aa);color:light-dark(#fed7aa,#431407)}.g2048 .face[data-v="1024"]{background:light-dark(#5c220c,#ffedd5);color:light-dark(#fed7aa,#7c2d12)}.g2048 .face[data-v="2048"]{background:light-dark(#431407,#fff7ed);color:light-dark(#fb923c,#9a3412);box-shadow:inset 0 0 0 1.5px light-dark(#fb923c,#c2410c)}.g2048 .face[data-v=super]{background:light-dark(#111111,#ffffff);color:light-dark(#fb923c,#c2410c)}.g2048 .slot.is-new .face{animation:g2048-in var(--move) var(--ease)}.g2048 .slot.is-pop .face{animation:g2048-pop .18s var(--ease)}.g2048 .overlay{position:absolute;inset:0;z-index:5;border-radius:inherit;background:color-mix(in srgb,var(--bg) 84%,transparent);text-align:center;padding:16px}.g2048 .overlay:not([hidden]){display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px}.g2048 .overlay .kicker,.g2048 .overlay .msg,.g2048 .overlay .sub{margin:0}.g2048 .overlay .msg{font-size:22px;font-weight:600;letter-spacing:-.03em}.g2048 .actions{display:flex;gap:8px;margin-top:8px}.g2048 .sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@keyframes g2048-in{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}@keyframes g2048-pop{0%{transform:scale(1)}40%{transform:scale(1.14)}to{transform:scale(1)}}@keyframes g2048-in-quiet{0%{opacity:.2}to{opacity:1}}@keyframes g2048-pop-quiet{0%{opacity:.4}to{opacity:1}}@keyframes g2048-score{0%{color:var(--accent)}to{color:var(--fg)}}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .g2048{--board: #121212}}:root[data-theme=dark] .g2048{--board: #121212}@media(prefers-reduced-motion:reduce){.g2048{--move: .11s}.g2048 .slot.is-new .face{animation-name:g2048-in-quiet;animation-duration:.14s}.g2048 .slot.is-pop .face{animation-name:g2048-pop-quiet;animation-duration:.14s}.g2048 .score b.up{animation-duration:.18s}}@media(max-width:560px){.g2048{width:100%}.g2048 .head{align-items:flex-start}.g2048 .bar{flex-wrap:wrap}.g2048 button{height:44px;padding:0 14px}}