:root{--bg:#0f1021;--panel:#17182e;--grid:#222443;--tile-empty:#2b2e58;--text:#f6f7ff;--muted:#aaaed9;--accent:#6b7cff}*{box-sizing:border-box}html,body{margin:0;padding:0;background:radial-gradient(circle at top,#1b1f47,var(--bg));color:var(--text);font-family:Inter,system-ui,sans-serif}body{min-height:100vh;display:grid;place-items:center;padding:12px}.app{width:min(96vw,460px);background:#141633;border:1px solid #2f3368;border-radius:16px;padding:14px;box-shadow:0 12px 32px rgba(0,0,0,.35)}.topbar{display:flex;justify-content:space-between;gap:10px}h1{margin:0;font-size:1.6rem}.subtitle{margin:4px 0 0;color:var(--muted)}.scores{display:flex;gap:8px}.score-box{background:#10122a;border:1px solid #31366e;border-radius:10px;padding:6px 10px;min-width:72px;text-align:center}.score-box span{display:block;color:var(--muted);font-size:.72rem}.score-box strong{font-size:1.15rem}.board-wrap{position:relative;margin-top:12px}.board{aspect-ratio:1/1;width:100%;background:var(--grid);border-radius:12px;padding:10px;display:grid;grid-template-columns:repeat(4,1fr);gap:10px;touch-action:none}.cell{border-radius:10px;display:grid;place-items:center;font-weight:800;font-size:clamp(1rem,5vw,2rem);color:#1b1f3b;background:var(--tile-empty);transition:transform .1s ease,background .15s ease;user-select:none}.cell.spawn{animation:spawn .14s ease-out}.cell.pop{animation:pop .14s ease-out}@keyframes spawn{from{transform:scale(.8);opacity:.8}to{transform:scale(1);opacity:1}}@keyframes pop{0%{transform:scale(1)}50%{transform:scale(1.08)}100%{transform:scale(1)}}.overlay{position:absolute;inset:0;background:rgba(12,14,28,.84);border-radius:12px;display:grid;place-content:center;text-align:center;gap:10px;padding:16px}.hidden{display:none}button{background:var(--accent);color:#fff;border:0;border-radius:10px;font-weight:700;padding:8px 12px;cursor:pointer}button[aria-pressed="false"]{opacity:.6}.controls{margin-top:12px;display:flex;justify-content:space-between;gap:8px;color:var(--muted);font-size:.86rem}.left-controls{display:flex;gap:6px;flex-wrap:wrap}kbd{background:#0e1230;border:1px solid #30366d;border-bottom-width:2px;border-radius:6px;padding:0 4px;color:#ccd3ff}[data-v="0"]{background:var(--tile-empty);color:transparent}[data-v="2"]{background:#eee4da}[data-v="4"]{background:#ede0c8}[data-v="8"]{background:#f2b179;color:#fff}[data-v="16"]{background:#f59563;color:#fff}[data-v="32"]{background:#f67c5f;color:#fff}[data-v="64"]{background:#f65e3b;color:#fff}[data-v="128"]{background:#edcf72;color:#fff}[data-v="256"]{background:#edcc61;color:#fff}[data-v="512"]{background:#edc850;color:#fff}[data-v="1024"]{background:#edc53f;color:#fff;font-size:clamp(.78rem,3.5vw,1.45rem)}[data-v="2048"]{background:#edc22e;color:#fff;font-size:clamp(.78rem,3.5vw,1.45rem)}[data-v="4096"]{background:#7b61ff;color:#fff;font-size:clamp(.78rem,3.5vw,1.35rem)}