:root{--color-page-background:#faf8ef;--color-text-primary:#776e65;--color-text-secondary:#8f7a66;--color-board-background:#bbada0;--color-cell-empty:#cdc1b4;--tile-2:#eee4da;--tile-4:#ede0c8;--tile-8:#f2b179;--tile-16:#f59563;--tile-32:#f67c5f;--tile-64:#f65e3b;--tile-128:#edcf72;--tile-256:#edcc61;--tile-512:#edc850;--tile-1024:#edc53f;--tile-2048:#edc22e;--tile-super:#3c3a32;--tile-text-dark:#776e65;--tile-text-light:#f9f6f2;--color-button-background:#8f7a66;--color-button-text:#f9f6f2;--color-button-hover:#9e8b78;--color-panel-background:#faf8ef;--color-panel-shadow:#9c8b7c;--color-overlay-text:#776e65;--overlay-light:#faf8efd6;--overlay-dark:#23201ca1;--radius:8px;--grid-gap:12px;--board-padding:12px;--board-width:480px;--mobile-breakpoint:600px;--window-width:640px;--window-height:800px;--min-window-width:480px;--min-window-height:660px;--font-title:64px;--font-score-label:13px;--font-score-value:26px;--font-button:15px;--font-status:13px;--font-tile-large:44px;--font-tile-medium:38px;--font-tile-small:30px;--font-overlay-title:44px;--font-overlay-body:18px;--font-menu-title:28px;--slide-duration:.11s;--spawn-duration:.12s;--merge-duration:.14s;--overlay-duration:.18s;--score-float-duration:.42s;--ease:cubic-bezier(.333333, 1, .666667, 1);--font-stack:"Segoe UI", "Microsoft YaHei", "PingFang SC", "Noto Sans CJK SC", "WenQuanYi Micro Hei", Arial, sans-serif}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}html,body{min-height:100%;margin:0}body{--page-pad:clamp(12px, 3vw, 28px);--pad-top:max(var(--page-pad), env(safe-area-inset-top,0px));--pad-right:max(var(--page-pad), env(safe-area-inset-right,0px));--pad-bottom:max(var(--page-pad), env(safe-area-inset-bottom,0px));--pad-left:max(var(--page-pad), env(safe-area-inset-left,0px));background:var(--color-page-background);color:var(--color-text-primary);font-family:var(--font-stack);min-height:100vh;min-height:100dvh;padding:var(--pad-top) var(--pad-right) var(--pad-bottom) var(--pad-left);overscroll-behavior-y:contain;-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;justify-content:center;display:flex;overflow-x:hidden}button,input,select{font-family:inherit}.app{flex-direction:column;gap:14px;width:min(100%,560px);margin:0 auto;display:flex}.header{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.title{font-size:clamp(40px, 10vw, var(--font-title));letter-spacing:-.04em;color:var(--color-text-primary);margin:0;font-weight:800;line-height:.95}.scores{flex:none;gap:10px;display:flex}.score-box{border-radius:var(--radius);background:var(--color-board-background);min-width:96px;color:var(--tile-text-light);text-align:center;padding:7px 12px 9px;position:relative;overflow:visible}.score-label{font-size:var(--font-score-label);letter-spacing:.08em;color:var(--tile-2);font-weight:700;display:block}.score-value{font-size:var(--font-score-value);font-variant-numeric:tabular-nums;margin-top:1px;font-weight:800;line-height:1.05;display:block}.score-float-layer{pointer-events:none;position:absolute;inset:0;overflow:visible}.score-float{color:var(--color-text-primary);font-size:var(--font-score-value);font-variant-numeric:tabular-nums;pointer-events:none;white-space:nowrap;font-weight:800;position:absolute}.controls{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:10px;display:grid}.btn{border-radius:var(--radius);background:var(--color-button-background);min-height:44px;color:var(--color-button-text);font-size:clamp(12px, 2.2vw, var(--font-button));cursor:pointer;touch-action:manipulation;border:0;padding:8px 6px;font-weight:700;line-height:1.1;transition:background-color .12s,transform .12s}.btn:hover{background:var(--color-button-hover)}.btn:active{transform:translateY(1px)}.btn:focus-visible{outline-offset:2px;outline:3px solid #8f7a6673}.btn.active,.btn.primary{background:var(--tile-8)}.btn.primary:hover{background:var(--tile-16)}.btn:disabled{background:var(--color-cell-empty);color:var(--color-text-secondary);cursor:not-allowed;transform:none}.board-wrap{justify-content:center;width:100%;display:flex}.board{width:min(100%, var(--board-width));aspect-ratio:1;background:var(--color-board-background);border-radius:calc(var(--radius) * 1.6);touch-action:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;position:relative;overflow:hidden}.grid-layer,.tile-layer{position:absolute;inset:0}.cell{background:var(--color-cell-empty);position:absolute}.tile{will-change:transform, opacity;font-variant-numeric:tabular-nums;justify-content:center;align-items:center;font-weight:800;line-height:1;display:flex;position:absolute;overflow:hidden;box-shadow:0 2px 3px #3c322814}.tile.merged,.tile.spawned{z-index:2}.tile[data-value="2"]{background:var(--tile-2);color:var(--tile-text-dark)}.tile[data-value="4"]{background:var(--tile-4);color:var(--tile-text-dark)}.tile[data-value="8"]{background:var(--tile-8);color:var(--tile-text-light)}.tile[data-value="16"]{background:var(--tile-16);color:var(--tile-text-light)}.tile[data-value="32"]{background:var(--tile-32);color:var(--tile-text-light)}.tile[data-value="64"]{background:var(--tile-64);color:var(--tile-text-light)}.tile[data-value="128"]{background:var(--tile-128);color:var(--tile-text-light)}.tile[data-value="256"]{background:var(--tile-256);color:var(--tile-text-light)}.tile[data-value="512"]{background:var(--tile-512);color:var(--tile-text-light)}.tile[data-value="1024"]{background:var(--tile-1024);color:var(--tile-text-light)}.tile[data-value="2048"]{background:var(--tile-2048);color:var(--tile-text-light)}.tile.tile-super{background:var(--tile-super);color:var(--tile-text-light)}.status{flex-direction:column;gap:4px;min-height:56px;display:flex}.status-line{font-size:var(--font-status);font-variant-numeric:tabular-nums;overflow-wrap:anywhere;line-height:1.45}.subtle{color:var(--color-text-secondary)}code,kbd{font-family:ui-monospace,SFMono-Regular,Consolas,Liberation Mono,monospace;font-size:.94em}kbd{background:#fff6;border:1px solid #776e6547;border-radius:4px;padding:0 4px}.help{color:var(--color-text-secondary);border-top:1px solid #bbada059;padding-top:12px;font-size:13px;line-height:1.55}.help h2{color:var(--color-text-primary);margin:0 0 6px;font-size:15px}.help p{margin:0 0 6px}.overlay{z-index:20}.overlay.hidden{display:none!important}.overlay.modal{padding:max(18px, env(safe-area-inset-top,0px)) max(18px, env(safe-area-inset-right,0px)) max(18px, env(safe-area-inset-bottom,0px)) max(18px, env(safe-area-inset-left,0px));background:var(--overlay-dark);justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.overlay-panel{background:var(--color-panel-background);border-radius:calc(var(--radius) * 1.8);width:100%;padding:26px;box-shadow:0 24px 70px #23201c40}.overlay-title{font-size:var(--font-menu-title);color:var(--color-text-primary);margin:0 0 8px;line-height:1.1}.overlay-subtitle{color:var(--color-text-secondary);font-size:var(--font-overlay-body);margin:0 0 18px}.overlay-actions{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.overlay-actions .btn{flex:120px}.end-overlay{background:var(--overlay-light);opacity:0;pointer-events:none;transition:opacity var(--overlay-duration,.18s) var(--ease);justify-content:center;align-items:center;padding:14px;display:flex;position:absolute;inset:0}.end-overlay.visible{opacity:1;pointer-events:auto}.end-overlay .overlay-panel{text-align:center;max-width:100%;padding:22px 18px}.end-overlay .overlay-title{font-size:clamp(30px, 7vw, var(--font-overlay-title))}.menu-panel{flex-direction:column;gap:9px;width:min(340px,100%);display:flex}.confirm-panel{text-align:center;width:min(390px,100%)}.confirm-panel .overlay-subtitle{margin-bottom:20px}.menu-panel .overlay-title,.settings-panel .overlay-title{text-align:center;margin-bottom:10px}.settings-panel{width:min(560px,100%);max-height:calc(100vh - 36px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));max-height:calc(100dvh - 36px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));overscroll-behavior:contain;overflow-y:auto}.settings-groups{flex-direction:column;display:flex}.setting-row{border-bottom:1px solid #bbada047;flex-direction:column;gap:6px;padding:9px 0;display:flex}.setting-label{color:var(--color-text-secondary);font-size:13px;font-weight:700}.setting-options{flex-wrap:wrap;gap:6px;display:flex}.btn.option{background:var(--color-cell-empty);min-height:44px;color:var(--color-text-primary);border-radius:6px;flex:72px;padding:6px 8px;font-size:14px}.btn.option:hover{background:var(--tile-2)}.btn.option.selected{background:var(--tile-8);color:var(--tile-text-light)}.settings-note{min-height:18px;color:var(--color-text-secondary);text-align:center;margin:10px 0;font-size:12px}.settings-note.error{color:#ac3a30}#settings-back{width:100%}.toast{left:50%;bottom:max(24px, calc(12px + env(safe-area-inset-bottom,0px)));z-index:40;border-radius:var(--radius);background:var(--tile-super);max-width:min(92vw,520px);color:var(--tile-text-light);padding:11px 16px;font-size:13px;line-height:1.4;position:fixed;transform:translate(-50%);box-shadow:0 10px 30px #23201c47}.toast.hidden{display:none}.hidden{display:none!important}@media (max-width:600px){body{--page-pad:12px}.app{gap:11px}.title{font-size:clamp(38px,12vw,52px)}.scores{gap:6px}.score-box{min-width:76px;padding:6px 8px 8px}.score-value{font-size:22px}.controls{gap:6px;margin-top:8px}.btn{min-height:46px;font-size:13px}.btn.option{min-height:44px;font-size:13px}.status-line,.help{font-size:12px}.overlay-panel{padding:20px 16px}}@media (max-width:380px){.score-box{min-width:68px}.score-label{font-size:10px}.score-value{font-size:20px}.btn{padding:7px 3px;font-size:12px}}@media (orientation:landscape) and (max-height:560px){body{--page-pad:8px}.app{grid-template:"header board""controls board""status board"minmax(0,1fr)/minmax(210px,310px) minmax(0,1fr);align-items:start;gap:10px clamp(14px,2.5vw,28px);width:min(100%,1000px);display:grid}.header{flex-direction:column;grid-area:header;align-items:stretch;gap:7px}.title{font-size:clamp(34px,9vh,46px);line-height:1}.scores{gap:7px;width:100%}.score-box{flex:1 1 0;min-width:0;padding:5px 8px 7px}.score-label{font-size:11px}.score-value{font-size:clamp(18px,5vh,24px)}.controls{grid-area:controls;margin-top:0}.btn{min-height:44px;font-size:12px}.board-wrap{grid-area:board;justify-content:center;align-items:flex-start}.board{width:min(100%, calc(100vh - var(--pad-top) - var(--pad-bottom)), var(--board-width));width:min(100%, calc(100dvh - var(--pad-top) - var(--pad-bottom)), var(--board-width))}.status{grid-area:status;gap:2px;min-height:0}.status-line{font-size:12px}.help{display:none}}@media (prefers-reduced-motion:reduce){.end-overlay{transition-duration:1ms}.btn{transition:none}}
