html{--u:min(.133333333vw,.573333333px)}body{margin:0;background:#eae6df;color:#41372e;font-family:-apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif}button{cursor:pointer;border:0}button:disabled{cursor:default}button:active:not(:disabled){transform:translateY(2px) scale(.98)}.page{background:#faf6ef;min-height:100vh;max-width:430px!important}button:focus-visible{outline:2px solid #d77646;outline-offset:3px}[hidden]{display:none!important}.tile-layer{pointer-events:none}.page{max-width:calc(860 * var(--u));margin:0 auto;padding:calc(24 * var(--u)) calc(36 * var(--u)) calc(20 * var(--u));box-sizing:border-box}
.topline,.wordmark,.heading,.stats,.board-meta,.actions,.bottom-row,.label,.hint,.saved{display:flex;align-items:center}
.topline,.heading,.board-meta,.bottom-row{justify-content:space-between}
.wordmark{gap:calc(14 * var(--u));font-size:calc(25 * var(--u));font-weight:600;letter-spacing:calc(2 * var(--u));color:#514d48}
.brand-icon{display:grid;grid-template-columns:repeat(2,calc(9 * var(--u)));gap:calc(4 * var(--u));transform:rotate(-9deg)}.brand-icon div{width:calc(9 * var(--u));height:calc(9 * var(--u));border-radius:calc(2 * var(--u));background:#ea7548}.brand-icon div:last-child{background:#efb48b}
button{font-family:inherit;margin:0;padding:0;box-sizing:border-box}button::after{border:0}
.icon-button{width:calc(80 * var(--u));height:calc(80 * var(--u));line-height:calc(76 * var(--u));border-radius:50%;background:transparent;color:#83796e;font-size:calc(30 * var(--u));text-align:center}
.heading{margin:0 0 calc(30 * var(--u));align-items:center}.title{font-size:calc(140 * var(--u));line-height:1;font-weight:800;letter-spacing:calc(-9 * var(--u));color:#302d2a;font-family:Arial,sans-serif}.title-dot{color:#eb7646;letter-spacing:calc(-2 * var(--u))}.heading-note{font-size:calc(23 * var(--u));line-height:1.65;letter-spacing:calc(6 * var(--u));color:#9b8e81;text-align:right;padding-right:calc(6 * var(--u))}
.stats{gap:calc(18 * var(--u));align-items:stretch}.stat{flex:1;min-width:0;padding:calc(24 * var(--u)) calc(30 * var(--u)) calc(20 * var(--u));border-radius:calc(26 * var(--u));border:calc(2 * var(--u)) solid #e9e2d9;background:#fffcf7;box-sizing:border-box}.current{background:#fff8ed;border-color:#eddfcc}.label{gap:calc(10 * var(--u));font-size:calc(22 * var(--u));line-height:calc(30 * var(--u));color:#8a7b69}.live-dot{width:calc(9 * var(--u));height:calc(9 * var(--u));border-radius:50%;background:#e57947}.crown{font-size:calc(29 * var(--u));line-height:calc(26 * var(--u));color:#b69a6f}.score-line{position:relative}.number{font-size:calc(50 * var(--u));line-height:1.2;font-weight:700;letter-spacing:calc(-1 * var(--u));font-variant-numeric:tabular-nums;color:#42382e;display:block;margin-top:calc(10 * var(--u))}.gain{position:absolute;right:0;top:calc(8 * var(--u));color:#df713f;font-size:calc(26 * var(--u));font-weight:700;pointer-events:none;animation:score-rise .65s ease-out both}
.board-meta{margin:calc(30 * var(--u)) calc(2 * var(--u)) calc(16 * var(--u))}.mode-tag{font-size:calc(21 * var(--u));color:#7b7167;letter-spacing:calc(1 * var(--u))}.move-count{font-size:calc(24 * var(--u));color:#574d43;font-variant-numeric:tabular-nums}.move-count text{font-size:calc(21 * var(--u));color:#9c9084;margin-left:calc(6 * var(--u))}
.board{position:relative;width:100%;padding-bottom:100%;height:0;background:#c7b9a9;border-radius:calc(32 * var(--u));box-shadow:0 calc(18 * var(--u)) calc(36 * var(--u)) calc(-18 * var(--u)) #75604b40,inset 0 calc(2 * var(--u)) 0 #ffffff50;touch-action:none;user-select:none;transition:box-shadow .15s}
.board-surface{position:absolute;top:calc(18 * var(--u));left:calc(18 * var(--u));right:calc(18 * var(--u));bottom:calc(18 * var(--u))}.slots,.tile-layer{position:absolute;inset:0}.slots{display:grid;grid-template-columns:repeat(4,22.75%);grid-template-rows:repeat(4,22.75%);gap:3%}.slot{border-radius:calc(19 * var(--u));background:#dbd0c3;box-shadow:inset 0 calc(2 * var(--u)) calc(4 * var(--u)) #68594708}
.tile{position:absolute;top:0;left:0;width:22.75%;height:22.75%;z-index:1;transition:transform 115ms cubic-bezier(.22,.61,.36,1)}.tile-face{height:100%;width:100%;display:flex;align-items:center;justify-content:center;border-radius:calc(19 * var(--u));font-size:calc(64 * var(--u));font-weight:750;font-family:Arial,sans-serif;letter-spacing:calc(-2 * var(--u));box-shadow:0 calc(4 * var(--u)) 0 #58412e12,inset 0 calc(2 * var(--u)) calc(1 * var(--u)) #ffffff90;box-sizing:border-box;color:#695848;background:#fff9ef}
.tile-2{background:linear-gradient(145deg,#fffcf6,#f8eedf);color:#756352}.tile-4{background:linear-gradient(145deg,#fff1d8,#f6dfb3);color:#80633c}.tile-8{background:linear-gradient(145deg,#f8bd7b,#efa25d);color:#603c22}.tile-16{background:linear-gradient(145deg,#f69a62,#e97c45);color:#fffaf2}.tile-32{background:linear-gradient(145deg,#f08061,#df654c);color:#fffaf2}.tile-64{background:linear-gradient(145deg,#e76349,#ca4637);color:#fffaf2}.tile-128{background:linear-gradient(145deg,#e7c56b,#cfa449);color:#fffdf3;font-size:calc(50 * var(--u))}.tile-256{background:linear-gradient(145deg,#dcb254,#be9131);color:#fffdf3;font-size:calc(50 * var(--u))}.tile-512{background:linear-gradient(145deg,#c7a04e,#a57c29);color:#fffdf3;font-size:calc(50 * var(--u))}.tile-1024{background:linear-gradient(145deg,#7a9c87,#557965);color:#fffdf3;font-size:calc(41 * var(--u))}.tile-2048{background:linear-gradient(145deg,#507d6c,#2e5748);color:#fff7d5;font-size:calc(41 * var(--u));box-shadow:0 0 calc(22 * var(--u)) #64836b50}.tile-super{background:linear-gradient(145deg,#565775,#35364e);color:#fff7da;font-size:calc(34 * var(--u));letter-spacing:calc(-1 * var(--u))}
.appear{animation:tile-appear 160ms cubic-bezier(.2,.8,.3,1) both}.merge{animation:tile-merge 180ms cubic-bezier(.2,.8,.3,1) both}.blocked{box-shadow:0 0 0 calc(4 * var(--u)) #ae998264,0 calc(18 * var(--u)) calc(36 * var(--u)) calc(-18 * var(--u)) #75604b40}
@keyframes tile-appear{from{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}@keyframes tile-merge{0%{transform:scale(1)}45%{transform:scale(1.13)}100%{transform:scale(1)}}@keyframes score-rise{0%{opacity:0;transform:translateY(calc(12 * var(--u)))}20%{opacity:1}70%{opacity:1}100%{opacity:0;transform:translateY(calc(-24 * var(--u)))}}
.hint{justify-content:center;gap:calc(12 * var(--u));margin:calc(23 * var(--u)) 0 calc(28 * var(--u));font-size:calc(22 * var(--u));color:#9b8e80}.swipe-symbol{font-size:calc(30 * var(--u));line-height:1;color:#b6a594}.actions{gap:calc(20 * var(--u))}.primary,.secondary{border-radius:calc(24 * var(--u));min-height:calc(100 * var(--u));line-height:calc(100 * var(--u));font-size:calc(27 * var(--u));font-weight:600;text-align:center;transition:transform .12s,background .12s}.actions button{flex:1;display:flex;align-items:center;justify-content:center;gap:calc(13 * var(--u))}.primary{background:#e97a49;color:#fffdf8;box-shadow:0 calc(6 * var(--u)) 0 #c75c2f,0 calc(12 * var(--u)) calc(24 * var(--u)) calc(-12 * var(--u)) #db75477a}.secondary{background:#f0e8dc;color:#7d6b57;box-shadow:0 calc(5 * var(--u)) 0 #e0d4c2}.action-icon{font-size:calc(37 * var(--u));line-height:1;font-weight:400}.secondary[disabled]{background:#f0ebe3;color:#b7ab9d;box-shadow:0 calc(4 * var(--u)) 0 #e7ded2}.pressed{transform:translateY(calc(3 * var(--u))) scale(.98)}
.bottom-row{margin-top:calc(25 * var(--u))}.haptic-button{display:flex;align-items:center;gap:calc(10 * var(--u));min-height:calc(80 * var(--u));padding:0 calc(4 * var(--u));background:transparent;font-size:calc(21 * var(--u));color:#9b9083;line-height:calc(80 * var(--u))}.haptic-button.enabled{color:#867763}.haptic-icon{display:flex;align-items:center;justify-content:center;width:calc(26 * var(--u));height:calc(24 * var(--u));border-left:calc(2 * var(--u)) solid currentColor;border-right:calc(2 * var(--u)) solid currentColor;border-radius:calc(8 * var(--u));opacity:.7}.haptic-icon div{width:calc(10 * var(--u));height:calc(20 * var(--u));border:calc(2 * var(--u)) solid currentColor;border-radius:calc(3 * var(--u))}.saved{gap:calc(9 * var(--u));color:#a79b8c;font-size:calc(20 * var(--u))}.save-dot{width:calc(7 * var(--u));height:calc(7 * var(--u));border-radius:50%;background:#a4b39a}.storage-warning{font-size:calc(22 * var(--u));color:#b55438;text-align:center}.bottom-row{padding-bottom:env(safe-area-inset-bottom)}
.overlay{position:absolute;inset:0;border-radius:calc(32 * var(--u));background:#f8f2e7dd;backdrop-filter:blur(calc(8 * var(--u)));z-index:4;display:flex;align-items:center;justify-content:center;text-align:center;animation:veil-in .25s both}.result-card{width:84%}.result-mark{font-size:calc(70 * var(--u));color:#e4814c;line-height:1.3}.result-kicker{font-size:calc(18 * var(--u));letter-spacing:calc(5 * var(--u));color:#b09068;margin:calc(10 * var(--u)) 0 calc(18 * var(--u))}.overlay-title{font-size:calc(42 * var(--u));font-weight:700;letter-spacing:calc(-1 * var(--u));color:#4f4032}.overlay-copy{font-size:calc(24 * var(--u));color:#9a8773;margin:calc(22 * var(--u)) 0 calc(30 * var(--u))}.overlay-copy text{font-size:calc(32 * var(--u));font-weight:600;color:#785f45;margin-left:calc(10 * var(--u))}.text-button{background:transparent;color:#96816b;font-size:calc(25 * var(--u));min-height:calc(80 * var(--u));line-height:calc(80 * var(--u));margin-top:calc(12 * var(--u))}.help-mask{position:fixed;inset:0;background:#44362966;backdrop-filter:blur(calc(6 * var(--u)));z-index:10;display:flex;align-items:flex-end;justify-content:center;animation:veil-in .2s both}.help-card{width:100%;max-width:calc(860 * var(--u));box-sizing:border-box;background:#fffaf2;border-radius:calc(40 * var(--u)) calc(40 * var(--u)) 0 0;padding:calc(22 * var(--u)) calc(44 * var(--u)) calc(calc(44 * var(--u)) + env(safe-area-inset-bottom));animation:sheet-in .22s ease-out;max-height:90vh;overflow-y:auto}.sheet-handle{width:calc(64 * var(--u));height:calc(8 * var(--u));border-radius:calc(8 * var(--u));background:#e4d9c9;margin:0 auto calc(30 * var(--u))}.example{display:flex;align-items:center;justify-content:center;gap:calc(22 * var(--u));margin:calc(34 * var(--u)) 0;color:#bdac99;font-size:calc(28 * var(--u))}.example-tile{width:calc(104 * var(--u));height:calc(104 * var(--u));line-height:calc(104 * var(--u));text-align:center;background:#f7eedf;border-radius:calc(20 * var(--u));color:#8b7357;font-size:calc(48 * var(--u));font-weight:700;box-shadow:0 calc(4 * var(--u)) 0 #e7d9c7}.example-result{background:#f2d4a1;color:#866135}.help-copy{font-size:calc(28 * var(--u));line-height:1.7;color:#6d5d4c;margin:calc(24 * var(--u)) 0}.help-detail{font-size:calc(24 * var(--u));line-height:1.7;color:#a08e79;margin:calc(18 * var(--u)) 0}.help-card .primary{margin-top:calc(34 * var(--u))}@keyframes veil-in{from{opacity:0}to{opacity:1}}@keyframes sheet-in{from{transform:translateY(calc(50 * var(--u)))}to{transform:translateY(0)}}
@media(max-height:700px){.page{padding-top:calc(8 * var(--u))}.topline{height:calc(64 * var(--u))}.heading{margin-bottom:calc(22 * var(--u))}.title{font-size:calc(118 * var(--u))}.stat{padding:calc(18 * var(--u)) calc(26 * var(--u)) calc(16 * var(--u))}.number{font-size:calc(44 * var(--u))}.board-meta{margin-top:calc(22 * var(--u))}.hint{margin:calc(18 * var(--u)) 0 calc(22 * var(--u))}.primary,.secondary{min-height:calc(88 * var(--u));line-height:calc(88 * var(--u))}.bottom-row{margin-top:calc(16 * var(--u))}}
@media(prefers-reduced-motion:reduce){.tile{transition:none}.appear,.merge,.gain,.overlay,.help-mask,.help-card{animation:none}}

/* Keep the board and primary actions together on compact phones. */
.topline{height:calc(64 * var(--u))}.heading{gap:calc(22 * var(--u));margin:calc(16 * var(--u)) 0 0}.hero{flex:1;min-width:0}.title{font-size:calc(112 * var(--u));letter-spacing:calc(-7 * var(--u))}.subtitle{font-size:calc(20 * var(--u));letter-spacing:calc(1 * var(--u));color:#a08e79;margin-top:calc(12 * var(--u));white-space:nowrap}.stats{width:calc(338 * var(--u));flex-shrink:0;gap:calc(12 * var(--u))}.stat{padding:calc(18 * var(--u)) calc(18 * var(--u)) calc(16 * var(--u));border-radius:calc(22 * var(--u))}.label{font-size:calc(20 * var(--u));gap:calc(7 * var(--u));white-space:nowrap}.number{font-size:calc(40 * var(--u));letter-spacing:calc(-1 * var(--u))}.crown{font-size:calc(24 * var(--u))}.gain{top:calc(40 * var(--u));right:0;font-size:calc(24 * var(--u));z-index:3}.board-meta{margin:calc(30 * var(--u)) calc(2 * var(--u)) calc(16 * var(--u))}.bottom-row{margin-top:calc(18 * var(--u))}
@media(max-height:700px){.topline{height:calc(56 * var(--u))}.heading{margin-top:calc(10 * var(--u))}.title{font-size:calc(108 * var(--u))}.stat{padding:calc(16 * var(--u)) calc(18 * var(--u)) calc(14 * var(--u))}.number{font-size:calc(38 * var(--u))}.board-meta{margin-top:calc(22 * var(--u))}.bottom-row{margin-top:calc(12 * var(--u))}}

.help-card>.primary,.result-card>.primary{width:100%}.number.small{font-size:calc(32 * var(--u))}.number.tiny{font-size:calc(26 * var(--u))}

.icon-button{min-width:44px;min-height:44px;line-height:44px}.haptic-button{min-height:44px}
@media(max-width:360px){.primary,.secondary{min-height:44px;line-height:44px;font-size:13px}.label,.hint,.saved,.haptic-button,.mode-tag{font-size:11px}.subtitle{font-size:10px}.wordmark{font-size:12px}}

.hint-alert{color:#a5502c;font-weight:500}.hint-alert .swipe-symbol{font-size:calc(22 * var(--u));color:#b76436;font-weight:700}.result-card{animation:result-enter .24s cubic-bezier(.2,.8,.3,1) both}.result-card .result-kicker{margin:0 0 calc(12 * var(--u))}.result-card .overlay-title{font-size:calc(42 * var(--u))}.result-reason{font-size:calc(22 * var(--u));color:#97816b;margin:calc(12 * var(--u)) 0 0;line-height:1.5}.result-score{font-family:Arial,sans-serif;font-size:calc(76 * var(--u));font-weight:750;line-height:1.05;color:#9b5d32;margin:calc(22 * var(--u)) 0 calc(8 * var(--u));letter-spacing:calc(-2 * var(--u))}.result-score-label{font-size:calc(20 * var(--u));color:#a1886d}.result-details{display:flex;align-items:center;justify-content:center;gap:calc(16 * var(--u));font-size:calc(23 * var(--u));color:#887057;margin:calc(20 * var(--u)) 0 calc(26 * var(--u))}.result-separator{color:#bda88c}.result-card .text-button{min-height:44px;line-height:44px;margin-top:calc(12 * var(--u))}.result-footnote{font-size:calc(19 * var(--u));color:#a38d75;margin-top:calc(24 * var(--u))}.overlay{background:#fcf6ebeF}.result-card .primary{min-height:44px}.result-card .result-reason,.result-card .result-details{min-height:12px}@keyframes result-enter{from{opacity:0;transform:translateY(calc(18 * var(--u))) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}@media(prefers-reduced-motion:reduce){.result-card{animation:none}}

/* Touch devices use one moving layer per tile and a cheap, flat face. */
@media(hover:none) and (pointer:coarse), (max-width:600px){
 .board{contain:layout paint;box-shadow:0 calc(8 * var(--u)) calc(18 * var(--u)) #75604b20}
 .tile-face,.slot{box-shadow:none}
 .tile-2{background:#f9f0e3}.tile-4{background:#f7e4bf}.tile-8{background:#f3ad68}
 .tile-16{background:#ee8a52}.tile-32{background:#e97155}.tile-64{background:#d95040}
 .tile-128{background:#dbb45a}.tile-256{background:#cfa03f}.tile-512{background:#b88d3b}
 .tile-1024{background:#668d76}.tile-2048{background:#3f6957}.tile-super{background:#45465f}
 .appear{animation:mobile-tile-in 110ms ease-out}.merge{animation:mobile-tile-in 90ms ease-out}
 .overlay,.help-mask{backdrop-filter:none;-webkit-backdrop-filter:none}
 .overlay{background:#fcf6ebf5}.help-mask{background:#44362999}
}
@keyframes mobile-tile-in{from{opacity:.65}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.appear,.merge{animation:none}}