.board{display:grid;grid-template-columns:repeat(4,90px);grid-auto-rows:90px;gap:12px;padding:12px;background:#bbada0;border-radius:8px;box-shadow:0 4px #998c7e}@tailwind base;@tailwind components;@tailwind utilities;:root{--color-grid-background: #232d3b;--color-empty-cell: #37475c;--color-border-accent: #64b5f6;--tile-bg-2: #e0e0e0;--tile-bg-4: #aee615;--tile-bg-8: #3d799f;--tile-bg-16: #33a7ad;--tile-bg-32: #2cb7a7;--tile-bg-64: #1fa08d;--tile-bg-128: #a67bbd;--tile-bg-256: #8e5fb5;--tile-bg-512: #75479e;--tile-bg-1024: #ff8a65;--tile-bg-2048: #ff5722;--tile-bg-4096: #ffd700;--tile-bg-8192: #c0c0c0}body{font-family:Inter,sans-serif;background-color:#3c424b;display:flex;justify-content:center;align-items:center;min-height:100vh;margin:0;color:#fffffd}.tile-2{background-color:var(--tile-bg-2);color:#555;font-size:2.5rem}.tile-4{background-color:var(--tile-bg-4);color:#555;font-size:2.5rem}.tile-8{background-color:var(--tile-bg-8);color:#fff;font-size:2.5rem}.tile-16{background-color:var(--tile-bg-16);color:#fff;font-size:2.5rem}.tile-32{background-color:var(--tile-bg-32);color:#fff;font-size:2.5rem}.tile-64{background-color:var(--tile-bg-64);color:#fff;font-size:2.5rem}.tile-128{background-color:var(--tile-bg-128);color:#fff;font-size:2rem}.tile-256{background-color:var(--tile-bg-256);color:#fff;font-size:2rem}.tile-512{background-color:var(--tile-bg-512);color:#fff;font-size:2rem}.tile-1024{background-color:var(--tile-bg-1024);color:#fff;font-size:1.75rem}.tile-2048{background-color:var(--tile-bg-2048);color:#fff;font-size:1.75rem}.tile-4096{background-color:var(--tile-bg-4096);color:#fff;font-size:1.75rem}.tile-8192{background-color:var(--tile-bg-8192);color:#fff;font-size:1.75rem}[data-value]:where([data-value]:not([data-value="0"])):not([class*=tile-]){background-color:#4a4a5d;color:#fff;font-size:1.5rem}.control-button{@apply px-4 py-2 rounded-lg shadow-lg font-semibold text-white transition-all duration-200 hover:scale-105 active:scale-95;}.directional-button{@apply bg-gray-700 hover:bg-gray-600 text-sm shadow-[0_4px_0_0_#4a4a4a] active:shadow-none active:translate-y-1;}:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}