:root{--bg-main: #090513;--bg-panel: #130b27;--text-main: #f4f2ff;--text-soft: #bfb4e3;--cyan: #24efff;--magenta: #ff2ec4;--grid-cell: rgba(255, 255, 255, .08);--grid-size: min(88vw, 520px);--gap: 12px;--cell-size: calc((var(--grid-size) - var(--gap) * 5) / 4);--glow-cyan: 0 0 18px rgba(36, 239, 255, .45);--glow-magenta: 0 0 18px rgba(255, 46, 196, .45)}*{box-sizing:border-box}html,body{margin:0;min-height:100%}body{font-family:Trebuchet MS,Segoe UI,sans-serif;color:var(--text-main);background:radial-gradient(circle at 20% 20%,rgba(255,46,196,.2),transparent 50%),radial-gradient(circle at 80% 10%,rgba(36,239,255,.15),transparent 45%),linear-gradient(160deg,#07030f,#0b0718 40%,#13062a);display:grid;place-items:center;padding:24px 12px}.app-shell{width:min(92vw,620px)}.topbar{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:16px}h1{margin:0;font-size:clamp(2.5rem,9vw,4rem);line-height:1;color:var(--cyan);text-shadow:var(--glow-cyan)}.subtitle{margin:4px 0 0;color:var(--text-soft);letter-spacing:.12em;text-transform:uppercase;font-size:.78rem}.scoreboard{display:flex;gap:10px}.score-box{min-width:90px;background:linear-gradient(145deg,#ff2ec438,#24efff29);border:1px solid rgba(255,255,255,.2);border-radius:10px;padding:8px 12px;text-align:center;box-shadow:inset 0 0 16px #ffffff0d,var(--glow-magenta)}.score-box .label{display:block;color:var(--text-soft);font-size:.75rem;margin-bottom:2px;text-transform:uppercase;letter-spacing:.1em}.score-box strong{font-size:1.45rem}.actions{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:14px}.hint{margin:0;color:var(--text-soft)}.btn{border:1px solid rgba(255,255,255,.4);border-radius:10px;padding:10px 16px;background:linear-gradient(130deg,#24efff40,#ff2ec440);color:var(--text-main);text-transform:uppercase;letter-spacing:.07em;font-weight:700;cursor:pointer;transition:transform .12s ease,box-shadow .12s ease,filter .12s ease}.btn:hover{transform:translateY(-1px);filter:brightness(1.08)}.btn:active{transform:translateY(0)}.btn.alt{background:#ffffff1a}.board-wrap{position:relative}.board{position:relative;width:var(--grid-size);height:var(--grid-size);border-radius:16px;padding:var(--gap);background:linear-gradient(180deg,#ffffff0a,#fff0),#0c091bf0;border:1px solid rgba(255,255,255,.18);box-shadow:inset 0 0 20px #24efff14,inset 0 0 24px #ff2ec414,0 20px 40px #00000059;touch-action:none}.grid-background,.tile-layer{position:absolute;inset:var(--gap)}.grid-cell,.tile{position:absolute;width:var(--cell-size);height:var(--cell-size);border-radius:10px;transform:translate(calc((var(--cell-size) + var(--gap)) * var(--col)),calc((var(--cell-size) + var(--gap)) * var(--row)))}.grid-cell{background:var(--grid-cell)}.tile{display:grid;place-items:center;color:#fff;font-weight:800;font-size:clamp(1.1rem,4.3vw,2rem);will-change:transform;transition:transform .15s cubic-bezier(.22,.61,.36,1),background .14s ease,opacity .12s ease}.tile span{text-shadow:0 0 12px rgba(0,0,0,.35)}.tile-pop{animation:pop-in .15s ease-out}.tile-merge-fade{opacity:0}.tile-2{background:#3b2b57}.tile-4{background:#4a2f7a}.tile-8{background:linear-gradient(130deg,#2849aa,#2a74c5)}.tile-16{background:linear-gradient(140deg,#0e7f96,#0ab5c9)}.tile-32{background:linear-gradient(140deg,#0c8f92,#03c3b9)}.tile-64{background:linear-gradient(130deg,#9d196f,#db2e9f)}.tile-128{background:linear-gradient(145deg,#b1268e,#fa38c7);box-shadow:var(--glow-magenta)}.tile-256{background:linear-gradient(145deg,#2675c8,#24efff);box-shadow:var(--glow-cyan)}.tile-512{background:linear-gradient(145deg,#ec3cab,#26f0ff);box-shadow:var(--glow-cyan),var(--glow-magenta)}.tile-1024,.tile-2048,.tile-4096{background:linear-gradient(145deg,#ffe66d,#ff6cc0);color:#2d1039;box-shadow:0 0 22px #ffe66d99}.overlay{position:absolute;inset:0;border-radius:16px;display:grid;place-content:center;gap:14px;text-align:center;background:#090513d1;border:1px solid rgba(255,255,255,.15)}.overlay h2{margin:0;font-size:clamp(1.8rem,5vw,2.3rem);text-transform:uppercase;letter-spacing:.08em;color:var(--magenta);text-shadow:var(--glow-magenta)}.overlay-actions{display:flex;justify-content:center;gap:10px}.hidden{display:none}@keyframes pop-in{0%{transform:scale(.88) translate(calc((var(--cell-size) + var(--gap)) * var(--col)),calc((var(--cell-size) + var(--gap)) * var(--row)))}to{transform:scale(1) translate(calc((var(--cell-size) + var(--gap)) * var(--col)),calc((var(--cell-size) + var(--gap)) * var(--row)))}}@media(max-width:560px){.topbar{align-items:stretch;flex-direction:column}.actions{flex-direction:column;align-items:flex-start}}