/* 2048 Hard - ruthless number-merge puzzle. Mostly 2-tiles spawn, 4x4 board,
   target 4096. Score = biggest tile reached. */
.m2048-arena { display: flex; flex-direction: column; align-items: center; gap: 12px; }

.m2048-board {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  padding: 10px;
  width: min(92vw, 380px);
  aspect-ratio: 1 / 1;
  background: var(--casino-carbon, #12121e);
  border: 1px solid var(--casino-line, #2e2e44);
  border-radius: 14px;
  touch-action: none;
}
.m2048-cell {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  font-family: "Chivo", system-ui, sans-serif;
  font-weight: 800;
  background: rgba(255,255,255,.04);
  color: var(--casino-ink, #f5f6fa);
  font-size: clamp(20px, 7vw, 34px);
  transition: transform .1s ease;
}
.m2048-cell.v2    { background:#3a3a52; }
.m2048-cell.v4    { background:#4a4a68; }
.m2048-cell.v8    { background:#7c5cff; color:#fff; }
.m2048-cell.v16   { background:#8f74ff; color:#fff; }
.m2048-cell.v32   { background:#a58cff; color:#0a0a14; }
.m2048-cell.v64   { background:#37e0a0; color:#0a0a14; }
.m2048-cell.v128  { background:#ffd400; color:#0a0a14; font-size:clamp(18px,6vw,30px); }
.m2048-cell.v256  { background:#ffb300; color:#0a0a14; font-size:clamp(18px,6vw,30px); }
.m2048-cell.v512  { background:#ff8c00; color:#0a0a14; font-size:clamp(18px,6vw,30px); }
.m2048-cell.v1024 { background:#ff6b6b; color:#fff; font-size:clamp(15px,5vw,26px); }
.m2048-cell.v2048 { background:#ff2d55; color:#fff; font-size:clamp(15px,5vw,26px); box-shadow:0 0 24px rgba(255,45,85,.6); }
.m2048-cell.v4096 { background:linear-gradient(135deg,#ffd400,#ff2d55); color:#fff; font-size:clamp(15px,5vw,26px); box-shadow:0 0 30px rgba(255,212,0,.8); }
.m2048-cell.super { background:linear-gradient(135deg,#7c5cff,#37e0a0); color:#fff; font-size:clamp(13px,4.4vw,22px); }
.m2048-cell.newtile { animation: m2048-pop .18s ease; }
@keyframes m2048-pop { 0%{transform:scale(.4)} 60%{transform:scale(1.14)} 100%{transform:scale(1)} }