:root{color-scheme:light;--paper:#f5f0e6;--card:#fffaf0;--ink:#34433d;--muted:#7b776f;--line:#d8d0c4;--sage:#6f7d6e;--sage-dark:#4e6056;--peach:#d98d70;--board:#b8ad9d;--gap:10px}
*{box-sizing:border-box}html{background:var(--paper)}body{margin:0;background:radial-gradient(circle at 85% 3%,#dce5d8 0,transparent 27%),linear-gradient(135deg,#f2ece1,#faf6ee);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif;-webkit-font-smoothing:antialiased}.shell{width:min(960px,calc(100% - 40px));margin:auto}.site-header{height:82px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.back{color:var(--ink);font-size:12px;font-weight:750;text-decoration:none}.header-actions{display:flex;gap:10px;align-items:center}.language-picker,.account-link{border:1px solid var(--line);border-radius:9px;background:#fff9;color:var(--ink);padding:8px 10px;font:12px inherit}.account-link{text-decoration:none;font-weight:750;color:var(--sage-dark)}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}:focus-visible{outline:3px solid #df9b7f;outline-offset:3px}.hero{padding:44px 0 26px}.eyebrow,.panel-label{margin:0 0 10px;color:#7d857b;font-size:10px;font-weight:850;letter-spacing:.17em}.hero h1{margin:0 0 10px;font-size:clamp(38px,6vw,58px);line-height:1;letter-spacing:-.05em}.hero>p:last-child{margin:0;max-width:650px;color:var(--muted);font-size:14px;line-height:1.8}.game-layout{display:grid;grid-template-columns:minmax(330px,550px) minmax(220px,1fr);gap:18px;align-items:start}.game-card,.side-card{border:1px solid var(--line);border-radius:22px;background:#fffaf0e8;box-shadow:0 18px 48px #6b594713}.game-card{padding:16px}.hud{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:12px}.hud div{min-width:0;padding:10px;border-radius:12px;background:#eee9de}.hud span,.hud strong{display:block}.hud span{color:var(--muted);font-size:8px;font-weight:850;letter-spacing:.09em}.hud strong{margin-top:4px;overflow:hidden;color:var(--ink);font:850 19px ui-monospace,SFMono-Regular,Consolas,monospace}.board{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(4,auto);gap:var(--gap);width:100%;padding:var(--gap);border-radius:18px;background:var(--board);touch-action:none;user-select:none;-webkit-user-select:none;box-shadow:inset 0 0 0 1px #8d8375}.cell{display:grid;place-items:center;width:100%;min-width:0;min-height:0;aspect-ratio:1;border-radius:11px;background:#d8d0c3;color:#544f48;font:850 clamp(22px,6vw,45px)/1 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:-.06em;box-shadow:inset 0 1px 0 #fff5;transition:background-color .12s,color .12s,transform .12s}.cell.new{animation:pop .16s ease-out}.cell[data-value="2"]{background:#eee9df}.cell[data-value="4"]{background:#e6dfcf}.cell[data-value="8"]{background:#e7b47e;color:#fffaf0}.cell[data-value="16"]{background:#dd9873;color:#fff}.cell[data-value="32"]{background:#cf7866;color:#fff}.cell[data-value="64"]{background:#b85f55;color:#fff}.cell[data-value="128"]{background:#a9a06a;color:#fff;font-size:clamp(19px,5vw,38px)}.cell[data-value="256"]{background:#879b72;color:#fff;font-size:clamp(19px,5vw,38px)}.cell[data-value="512"]{background:#648371;color:#fff;font-size:clamp(19px,5vw,38px)}.cell[data-value="1024"]{background:#4c6b63;color:#fff;font-size:clamp(16px,4.5vw,32px)}.cell[data-value="2048"]{background:#324f4c;color:#fff6d9;font-size:clamp(16px,4.5vw,32px);box-shadow:inset 0 0 0 2px #e7ce83,0 0 18px #d7bd6b66}.cell.high{background:#293d3b;color:#fff;font-size:clamp(13px,4vw,28px)}.side-card{padding:22px}.save-state{padding:16px;border-radius:14px;background:#eef1e8}.save-state strong{font-size:12px}.save-state p{margin:7px 0 0;color:var(--muted);font-size:10px;line-height:1.6}.save-dot{display:inline-block;width:8px;height:8px;margin-right:7px;border-radius:50%;background:#7fa184;box-shadow:0 0 0 4px #7fa18422}.save-state.syncing .save-dot{animation:pulse .8s infinite}.save-state.error .save-dot{background:#c87860}.new-game,.recovery{width:100%;margin-top:12px;border-radius:11px;padding:12px 14px;font:800 11px inherit;cursor:pointer}.new-game{border:1px solid var(--sage-dark);background:var(--sage-dark);color:#fff}.recovery{border:1px solid #d7a089;background:#fff6ee;color:#925f4d}.how{border-top:1px solid var(--line);margin-top:20px;padding-top:18px}.how p:not(.panel-label){margin:0 0 12px;color:var(--muted);font-size:11px;line-height:1.7}.mobile-arrows{display:none}.mobile-arrows button{border:1px solid #c7c7bd;border-radius:12px;background:linear-gradient(#fffdf8,#e9e6dd);color:var(--ink);font:800 21px inherit;box-shadow:0 4px 0 #b6b9b0;touch-action:manipulation}.mobile-arrows button:active{transform:translateY(3px);box-shadow:0 1px 0 #b6b9b0}footer{display:flex;justify-content:space-between;gap:15px;border-top:1px solid var(--line);margin-top:38px;padding:22px 0 30px;color:var(--muted);font-size:10px}@keyframes pop{0%{transform:scale(.72)}100%{transform:scale(1)}}@keyframes pulse{50%{opacity:.35}}
@media(max-width:720px){.shell{width:calc(100% - 20px)}.site-header{height:70px}.hero{padding:29px 4px 20px}.hero h1{font-size:41px}.hero>p:last-child{font-size:12px}.game-layout{grid-template-columns:1fr;gap:12px}.game-card{padding:10px;border-radius:18px}.hud{gap:6px;margin-bottom:8px}.hud div{padding:8px}.hud strong{font-size:16px}.board{--gap:8px;border-radius:15px}.cell{border-radius:9px}.mobile-arrows{display:grid;width:190px;height:104px;margin:12px auto 2px;grid-template-columns:repeat(3,58px);grid-template-rows:48px 48px;gap:7px;justify-content:center}.mobile-arrows button:nth-child(1){grid-column:2}.mobile-arrows button:nth-child(2){grid-column:1;grid-row:2}.mobile-arrows button:nth-child(3){grid-column:2;grid-row:2}.mobile-arrows button:nth-child(4){grid-column:3;grid-row:2}.side-card{padding:16px}.how{display:grid;grid-template-columns:1fr 1fr;gap:10px}.how .panel-label{grid-column:1/-1;margin-bottom:0}.how p:not(.panel-label){margin:0}.account-link{padding:8px}footer{margin-top:24px;flex-wrap:wrap}}
@media(max-width:370px){.board{--gap:7px;padding:7px}.cell{font-size:21px}.hud span{letter-spacing:.03em}.side-card{padding:13px}}
@media(prefers-reduced-motion:reduce){.cell.new,.save-state.syncing .save-dot{animation:none}}