:root{--bg: #0f0f1a;--bg-board: #1a1a2e;--bg-cell: #252540;--text: #e8e8f0;--text-muted: #6a6a8a;--accent: #6c63ff;--accent-glow: rgba(108, 99, 255, .3);--gold: #ffd700;--gold-glow: rgba(255, 215, 0, .4);--radius: 12px;--radius-sm: 8px;--gap: 12px;--cell-size: calc((min(90vw, 460px) - var(--gap) * 5) / 4);--board-size: calc(var(--cell-size) * 4 + var(--gap) * 5);--anim-duration: .15s}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{min-height:100vh;min-height:100dvh;background:var(--bg);color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none}.app{min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 20% 50%,rgba(108,99,255,.08) 0%,transparent 50%),radial-gradient(ellipse at 80% 20%,rgba(255,215,0,.05) 0%,transparent 50%),radial-gradient(ellipse at 50% 80%,rgba(108,99,255,.06) 0%,transparent 50%),var(--bg);padding:16px}.game-container{width:100%;max-width:480px;display:flex;flex-direction:column;gap:16px}.header{display:flex;align-items:center;justify-content:space-between;gap:12px}.title-section{flex:1}.title{font-size:3.5rem;font-weight:900;letter-spacing:-.02em;background:linear-gradient(135deg,#fff 0%,#c8c4ff 50%,var(--gold) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1}.subtitle{font-size:.85rem;color:var(--text-muted);margin-top:4px}.subtitle strong{color:var(--text)}.scores{display:flex;gap:8px}.score-box{background:var(--bg-board);border:1px solid rgba(255,255,255,.06);border-radius:var(--radius-sm);padding:8px 16px;display:flex;flex-direction:column;align-items:center;min-width:80px;position:relative}.score-label{font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.15em;color:var(--text-muted)}.score-value{font-size:1.4rem;font-weight:800;color:#fff;font-variant-numeric:tabular-nums;position:relative}.score-popup{position:absolute;top:-8px;right:-30px;font-size:.85rem;font-weight:700;color:var(--gold);animation:scoreFloat .8s ease-out forwards;pointer-events:none}@keyframes scoreFloat{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-30px)}}.controls{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.btn{border:none;border-radius:var(--radius-sm);cursor:pointer;font-family:inherit;font-weight:700;transition:all .2s ease;outline:none}.btn-new{background:linear-gradient(135deg,var(--accent),#8b83ff);color:#fff;padding:10px 20px;font-size:.85rem;letter-spacing:.03em;box-shadow:0 4px 15px var(--accent-glow)}.btn-new:hover{transform:translateY(-1px);box-shadow:0 6px 20px var(--accent-glow)}.btn-new:active{transform:translateY(0)}.btn-try{background:linear-gradient(135deg,#ff6b6b,#ee5a24);color:#fff;padding:12px 28px;font-size:1rem;box-shadow:0 4px 15px #ff6b6b4d}.btn-try:hover{transform:translateY(-1px);box-shadow:0 6px 20px #ff6b6b66}.btn-continue{background:linear-gradient(135deg,#00b894,#00cec9);color:#fff;padding:12px 28px;font-size:1rem;box-shadow:0 4px 15px #00b8944d}.btn-continue:hover{transform:translateY(-1px);box-shadow:0 6px 20px #00b89466}.hint{font-size:.72rem;color:var(--text-muted);display:flex;align-items:center;gap:4px;flex-wrap:wrap}kbd{background:var(--bg-board);border:1px solid rgba(255,255,255,.08);border-radius:4px;padding:2px 6px;font-size:.7rem;font-family:inherit;color:var(--text-muted);line-height:1.4}.board-wrapper{position:relative;width:var(--board-size);height:var(--board-size);margin:0 auto;background:var(--bg-board);border-radius:var(--radius);border:1px solid rgba(255,255,255,.04);box-shadow:0 20px 60px #00000080,0 0 0 1px #ffffff05,inset 0 1px #ffffff08;overflow:hidden}.board{display:grid;grid-template-columns:repeat(4,var(--cell-size));grid-template-rows:repeat(4,var(--cell-size));gap:var(--gap);padding:var(--gap);position:absolute;top:0;right:0;bottom:0;left:0}.cell{background:var(--bg-cell);border-radius:var(--radius-sm);box-shadow:inset 0 1px #ffffff05}.tiles-layer{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.tile{position:absolute;width:var(--cell-size);height:var(--cell-size);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;font-weight:800;left:calc(var(--gap) + var(--to-col) * (var(--cell-size) + var(--gap)));top:calc(var(--gap) + var(--to-row) * (var(--cell-size) + var(--gap)));transition:left var(--anim-duration) ease,top var(--anim-duration) ease;will-change:left,top;z-index:1}.tile-new{z-index:2;animation:tileAppear .2s ease-out}@keyframes tileAppear{0%{opacity:0;transform:scale(0)}60%{opacity:1;transform:scale(1.1)}to{opacity:1;transform:scale(1)}}.tile-merged{z-index:3;animation:tileMerge .2s ease-out}@keyframes tileMerge{0%{transform:scale(1)}40%{transform:scale(1.2)}to{transform:scale(1)}}.tile-128,.tile-256,.tile-512,.tile-1024,.tile-2048{animation:tileGlow 2s ease-in-out infinite alternate}@keyframes tileGlow{0%{filter:brightness(1)}to{filter:brightness(1.1)}}.tile-2048{background:linear-gradient(135deg,#edc22e,gold)!important;animation:tile2048 .3s ease-out,tileGlow 1.5s ease-in-out infinite alternate .3s}@keyframes tile2048{0%{transform:scale(0) rotate(-10deg)}50%{transform:scale(1.2) rotate(5deg)}to{transform:scale(1) rotate(0)}}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#0f0f1ad9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:100;animation:fadeIn .3s ease;border-radius:var(--radius)}.overlay-win{background:#0f0f1ae6}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.overlay-content{text-align:center;display:flex;flex-direction:column;gap:16px;align-items:center}.overlay-content h2{font-size:2.5rem;font-weight:900;background:linear-gradient(135deg,#fff,var(--gold));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.overlay-win .overlay-content h2{background:linear-gradient(135deg,var(--gold),#ffa500);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:winPulse 1s ease-in-out infinite alternate}@keyframes winPulse{0%{filter:brightness(1)}to{filter:brightness(1.3)}}.overlay-score{font-size:1.2rem;color:var(--text-muted);font-weight:600}.overlay-buttons{display:flex;gap:12px}.footer{text-align:center;padding:8px 0}.footer p{font-size:.75rem;color:var(--text-muted);line-height:1.5}@media(max-width:480px){:root{--gap: 10px;--cell-size: calc((min(95vw, 460px) - var(--gap) * 5) / 4);--board-size: calc(var(--cell-size) * 4 + var(--gap) * 5)}.app{padding:20px 12px 12px;align-items:flex-start}.title{font-size:2.5rem}.score-box{padding:6px 12px;min-width:65px}.score-value{font-size:1.1rem}.hint{display:none}.overlay-content h2{font-size:2rem}}@media(max-height:700px){.app{padding:10px 8px 8px;align-items:flex-start}.game-container,.controls{gap:8px}.footer{display:none}}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:2px}