:root{--bg:#253b36;--text:#f7f3e9;--muted:#aab6b1;--accent:#f2b84b;--board:#172a26;--gap:12px}
*{box-sizing:border-box}body{margin:0;min-height:100vh;color:var(--text);font-family:Inter,"PingFang SC","Microsoft YaHei",sans-serif;background:var(--bg)}
.app2048{width:min(92vw,560px);margin:auto;padding:30px 0 50px}nav{display:flex;justify-content:space-between;margin-bottom:38px;color:#82958f;font-size:12px}nav a{color:var(--text);text-decoration:none}nav a:hover{color:var(--accent)}
header{display:flex;align-items:end;justify-content:space-between;margin-bottom:22px}.eyebrow{margin:0 0 5px;color:var(--accent);font-size:11px;font-weight:800;letter-spacing:.18em}h1{margin:0;font:800 70px/1 Georgia,serif;letter-spacing:0}.scores{display:flex;gap:8px}.scores div{min-width:82px;padding:9px 12px;text-align:center;border-radius:6px;background:#172a26}.scores small{display:block;margin-bottom:3px;color:#91a29d;font-size:10px}.scores strong{font:700 22px Georgia,serif}
.toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.toolbar p{margin:0;color:var(--muted);font-size:13px}.toolbar>div{display:flex;gap:8px}button{height:40px;padding:0 16px;border:0;border-radius:6px;color:#211a0f;background:var(--accent);font:700 13px inherit;cursor:pointer}.toolbar .icon-control{width:40px;padding:0;color:var(--text);background:#3b514c;font-size:19px}.toolbar .icon-control.active{color:#211a0f;background:var(--accent)}.toolbar button:disabled{opacity:.35;cursor:not-allowed}
.board-wrap{position:relative;width:100%;aspect-ratio:1}.board{height:100%;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(4,1fr);gap:var(--gap);padding:var(--gap);border-radius:8px;background:var(--board);touch-action:none}.cell{display:grid;place-items:center;min-width:0;border-radius:6px;color:#4c493f;background:#3d514c;font:800 clamp(24px,8vw,43px) Georgia,serif;transition:transform .12s}.cell.new{animation:pop .18s}.cell.merged{animation:mergePulse .22s}.v2{background:#eee8dc}.v4{background:#ece0c8}.v8{color:white;background:#efae62}.v16{color:white;background:#ed8b54}.v32{color:white;background:#e96b55}.v64{color:white;background:#df4f3e}.v128{color:white;background:#e6c14d;font-size:34px}.v256{color:white;background:#dfb735;font-size:34px}.v512{color:white;background:#d7a929;font-size:34px}.v1024{color:white;background:#cf9424;font-size:27px}.v2048{color:white;background:#f0cb42;font-size:27px;box-shadow:0 0 22px #f0cb4266}.v4096,.v8192{color:white;background:#aa4c79;font-size:24px}
.overlay{position:absolute;inset:0;display:none;place-items:center;padding:25px;border-radius:8px;text-align:center;background:#172a26dd;backdrop-filter:blur(3px)}.overlay.show{display:grid}.overlay h2{margin:0 0 8px;font:700 38px Georgia,serif}.overlay p{margin:0 0 22px;color:var(--muted)}.overlay button{margin:4px}.overlay #continueBtn{display:none}.overlay.win #continueBtn{display:inline-block}.overlay.win #retryBtn{background:#e9e3d6}
.mobile-controls{display:none;grid-template-columns:repeat(3,48px);justify-content:center;gap:7px;margin-top:18px}.mobile-controls button{height:44px;padding:0;color:var(--text);background:#3b514c;font-size:22px}.mobile-controls button:first-child{grid-column:2}.mobile-controls button:nth-child(2){grid-column:1;grid-row:2}.mobile-controls button:nth-child(3){grid-column:2;grid-row:2}.mobile-controls button:nth-child(4){grid-column:3;grid-row:2}.tip{margin:17px 0 0;text-align:center;color:#82958f;font-size:11px}@keyframes pop{0%{transform:scale(.5)}100%{transform:scale(1)}}@keyframes mergePulse{0%{transform:scale(.82)}55%{transform:scale(1.1)}100%{transform:scale(1)}}
@media(max-width:600px){.app2048{padding-top:22px}nav{margin-bottom:25px}h1{font-size:58px}.scores div{min-width:67px;padding:8px}.scores strong{font-size:18px}.toolbar p{max-width:180px}.board{--gap:8px}.mobile-controls{display:grid}.cell.v128,.cell.v256,.cell.v512{font-size:27px}.cell.v1024,.cell.v2048{font-size:22px}}