:root{--bg:#f4efe7;--bg-accent:#efe1d1;--panel:#fffaf4c7;--panel-border:#5b43311a;--text:#35281f;--muted:#715a4a;--board:#c9b39c;--cell:#fff8f075;--shadow:0 24px 60px #53351c29;--radius-xl:32px;--radius-lg:24px;--radius-md:18px;--gap:14px;--board-size:min(78vw, 520px);--font-display:"Avenir Next", "Segoe UI Variable Display", "Trebuchet MS", sans-serif;--font-body:"IBM Plex Sans", "Segoe UI Variable Text", "Segoe UI", sans-serif}*{box-sizing:border-box}body{min-height:100vh;font-family:var(--font-body);color:var(--text);-webkit-tap-highlight-color:transparent;background:radial-gradient(circle at top left, #ffffffe0, transparent 28%), radial-gradient(circle at bottom right, #d0a6732e, transparent 36%), linear-gradient(135deg, var(--bg), var(--bg-accent));margin:0}body:before{content:"";pointer-events:none;background-image:linear-gradient(#ffffff0d 1px,#0000 1px),linear-gradient(90deg,#ffffff0d 1px,#0000 1px);background-size:32px 32px;position:fixed;inset:0;-webkit-mask-image:radial-gradient(circle,#000,#0000 82%);mask-image:radial-gradient(circle,#000,#0000 82%)}.shell{width:min(1140px,100% - 32px);margin:0 auto;padding:40px 0 56px}.hero{grid-template-columns:1.2fr 1fr;align-items:stretch;gap:24px;margin-bottom:26px;display:grid}.eyebrow{letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin:0 0 10px;font-size:.72rem}h1{font-family:var(--font-display);margin:0;font-size:clamp(3rem,8vw,5.5rem);line-height:.95}.lede{max-width:34rem;color:var(--muted);margin:18px 0 0;font-size:1.04rem;line-height:1.65}.panel{background:var(--panel);border:1px solid var(--panel-border);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:var(--radius-xl)}.panel-top{flex-direction:column;justify-content:space-between;gap:20px;padding:22px;display:flex}.score-group,.controls{gap:14px;display:flex}.score-card{background:#ffffff94;border:1px solid #5f3f2514;border-radius:20px;flex:1;padding:16px 18px}.score-card span{text-transform:uppercase;letter-spacing:.14em;color:var(--muted);margin-bottom:6px;font-size:.8rem;display:block}.score-card strong{font-family:var(--font-display);font-size:2rem}.button{font:inherit;cursor:pointer;border:0;border-radius:999px;padding:14px 18px;font-weight:600;transition:transform .15s,box-shadow .15s,background-color .15s,opacity .15s}.button:hover{transform:translateY(-1px)}.button:active{transform:translateY(1px)scale(.99)}.button-primary{color:#fff9f3;background:#b56a3b;box-shadow:0 12px 30px #b56a3b42}.button-secondary{color:var(--text);background:#ffffffb8}.button-ghost{color:var(--muted);background:0 0;padding:10px 14px}.play-area{justify-content:center;display:flex}.board-panel{width:100%;padding:22px}.status-row{color:var(--muted);justify-content:space-between;align-items:center;gap:12px;min-height:44px;margin-bottom:16px;display:flex}.status-row p{margin:0}.board{width:min(var(--board-size), 100%);aspect-ratio:1;height:auto;padding:var(--gap);border-radius:var(--radius-xl);background:linear-gradient(145deg, #fff3, transparent 35%), var(--board);touch-action:none;margin:0 auto;position:relative;overflow:hidden;box-shadow:inset 0 1px #fff3,inset 0 -8px 24px #704f3626}.cell-grid{gap:var(--gap);grid-template-rows:repeat(4,minmax(0,1fr));grid-template-columns:repeat(4,minmax(0,1fr));width:100%;height:100%;display:grid}.cell{border-radius:var(--radius-md);background:var(--cell);box-shadow:inset 0 1px 1px #ffffff38}.tile-layer{position:absolute;inset:0}.tile{width:var(--tile-size);height:var(--tile-size);border-radius:var(--radius-md);font-family:var(--font-display);color:#fffaf5;will-change:transform;place-items:center;font-weight:800;transition:transform .17s cubic-bezier(.2,.8,.2,1),opacity .12s;display:grid;position:absolute;top:0;left:0;box-shadow:0 18px 28px #663f1c24}.tile span{font-size:clamp(1.5rem,5vw,2.3rem)}.tile.value-2{color:#6f5846;background:linear-gradient(145deg,#efe3d1,#e7d3bb)}.tile.value-4{color:#5f4835;background:linear-gradient(145deg,#e9d2b8,#ddb993)}.tile.value-8{background:linear-gradient(145deg,#dd9f68,#cb8140)}.tile.value-16{background:linear-gradient(145deg,#d98953,#c76a26)}.tile.value-32{background:linear-gradient(145deg,#cc6f58,#ba5037)}.tile.value-64{background:linear-gradient(145deg,#bb5443,#9f3527)}.tile.value-128{background:linear-gradient(145deg,#e1c15a,#c9a12b)}.tile.value-256{background:linear-gradient(145deg,#dfae42,#be8621)}.tile.value-512{background:linear-gradient(145deg,#8bb97f,#63985d)}.tile.value-1024{background:linear-gradient(145deg,#5ea9b2,#2a7f8b)}.tile.value-2048,.tile.value-super{background:linear-gradient(145deg,#4e6bc7,#253e97)}.score-pop{animation:.26s score-pop}.hidden{display:none}.glitter{pointer-events:none;width:12px;height:18px;animation:.9s cubic-bezier(.18,.74,.34,1) forwards glitter-burst;animation-delay:var(--glitter-delay,0s);border-radius:999px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 0 12px #ffffff73}@keyframes score-pop{0%{transform:scale(1)}45%{transform:scale(1.12)}to{transform:scale(1)}}@keyframes glitter-burst{0%{opacity:0;transform:translate(-50%,-50%)scale(.4)rotate(0)}14%{opacity:1}to{opacity:0;transform:translate(calc(-50% + var(--glitter-x)), calc(-50% + var(--glitter-y))) scale(1) rotate(var(--glitter-rotate))}}@media (width<=840px){:root{--board-size:min(calc(100vw - 32px), 520px)}.shell{width:min(100%,100% - 24px);padding:24px 0 36px}.hero{grid-template-columns:1fr;gap:18px;margin-bottom:18px}.panel-top,.board-panel{padding:18px}}@media (width<=640px){:root{--gap:10px;--board-size:min(calc(100vw - 24px), 420px);--radius-xl:24px;--radius-md:14px}.shell{width:min(100%,100% - 18px);padding-top:24px}h1{font-size:clamp(2.6rem,18vw,4rem)}.lede{font-size:.96rem;line-height:1.5}.score-group,.controls{gap:10px}.score-card{padding:14px}.score-card strong{font-size:1.6rem}.controls{flex-wrap:wrap}.status-row{min-height:unset;align-items:flex-start}.button{flex:140px;min-height:48px;padding:13px 16px}.status-row p{font-size:.95rem}.tile span{font-size:clamp(1.1rem,8vw,1.75rem)}}