:root{--bg:#f7f5f0;--fg:#24262b;--muted:#71747e;--panel:#fff;--line:#e7e4dd;--accent:#ef7e51;--accent-deep:#d7643c;--board:#b7aca0;--empty:#cec5b9;--soft:#f5ede2;--shadow:0 20px 65px rgba(69,53,37,.09)}
*{box-sizing:border-box}html{min-height:100%;}body{margin:0;background:var(--bg);color:var(--fg);font-family:Arial,Helvetica,sans-serif;transition:background .2s,color .2s}body.dark{--bg:#202329;--fg:#f8f6f1;--muted:#b5b1b1;--panel:#2c3039;--line:#484a50;--board:#5b544e;--empty:#71675f;--soft:#34383e;--shadow:0 20px 65px rgba(0,0,0,.2)}button,select{font:inherit}button{cursor:pointer}button:focus-visible,select:focus-visible,input:focus-visible,.board:focus-visible{outline:3px solid var(--accent);outline-offset:3px}.screen{min-height:100vh;padding:35px 22px;display:flex;flex-direction:column;align-items:center;justify-content:center}.start-screen{position:relative;overflow:hidden;gap:24px}.start-mark{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;gap:10px;width:min(900px,100%);margin:auto;opacity:.07;transform:translateY(-18%);pointer-events:none}.start-mark span{font-size:clamp(70px,15vw,185px);font-weight:900}.panel{position:relative;width:min(550px,100%);background:var(--panel);border:1px solid var(--line);border-radius:26px;padding:42px 44px;box-shadow:var(--shadow)}.welcome-panel{text-align:center}.eyebrow{color:var(--accent-deep);font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-weight:800;margin:0 0 16px}.welcome-panel h1{font-size:clamp(90px,18vw,136px);line-height:1;margin:0 0 15px;font-weight:900;letter-spacing:-.08em}.period{color:var(--accent)}.subtitle{font-size:16px;line-height:1.6;color:var(--muted);margin:10px 0 24px}.instruction{text-align:left;background:var(--soft);border-radius:15px;padding:17px 20px;margin:30px 0}.instruction strong{font-size:13px}.instruction p{font-size:13px;line-height:1.6;margin:5px 0 0;color:var(--muted)}.actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:20px}.button{border:1px solid var(--line);background:var(--soft);color:var(--fg);border-radius:12px;padding:14px 20px;font-weight:700;transition:transform .12s,background .15s}.button:hover{transform:translateY(-2px)}.button-primary{background:var(--accent);color:white;border-color:var(--accent)}.button-primary:hover{background:var(--accent-deep)}.button-outline{background:transparent;border-color:var(--line)}.button-text{background:transparent;border-color:transparent;color:var(--muted)}.button-small{font-size:12px;padding:10px 13px}.best-line{margin:25px 0 0;color:var(--muted);font-size:13px}.best-line strong{color:var(--fg)}.footer-note{font-size:12px;color:var(--muted);position:relative}.game-layout{width:min(580px,100%)}.game-screen{justify-content:flex-start;padding-top:48px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:22px}.topbar .eyebrow{margin:0 0 4px}.brand{font-size:54px;letter-spacing:-.07em;margin:0;line-height:1}.topbar-buttons{display:flex;gap:9px}.dashboard{display:flex;gap:10px;align-items:stretch;margin-bottom:18px}.stat{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px 14px;min-width:93px;flex:1}.stat span,.target-label{display:block;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.08em}.stat strong{font-size:25px;display:block;margin-top:4px}.target-label{background:var(--accent);color:#fff;border-radius:12px;padding:13px 18px;text-align:center;line-height:1.3}.target-label strong{font-size:21px;letter-spacing:0}.board-wrap{padding:12px;background:var(--board);border-radius:18px;box-shadow:var(--shadow);width:100%}.board{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px;touch-action:none;outline-offset:5px;user-select:none}.tile{aspect-ratio:1;min-width:0;display:flex;align-items:center;justify-content:center;border-radius:10px;background:var(--empty);font-size:clamp(19px,5vw,37px);font-weight:900;color:#66594d;transition:background var(--speed,160ms),color var(--speed,160ms)}.tile[data-value="2"]{background:#eee4da}.tile[data-value="4"]{background:#ede0c8}.tile[data-value="8"]{background:#f2b179;color:#fff}.tile[data-value="16"]{background:#f59563;color:#fff}.tile[data-value="32"]{background:#f67c5f;color:#fff}.tile[data-value="64"]{background:#f65e3b;color:#fff}.tile[data-value="128"]{background:#edcf72;color:#fff}.tile[data-value="256"]{background:#edcc61;color:#fff}.tile[data-value="512"]{background:#edc850;color:#fff}.tile[data-value="1024"]{background:#edc53f;color:#fff}.tile[data-value="2048"]{background:#edc22e;color:#fff}.tile[data-value="4096"],.tile[data-value="8192"]{background:#3c4b62;color:#fff;font-size:28px}.tile.new-tile{animation:tileAppear .2s ease}.board.complete{animation:winFlash .6s ease-in-out}.game-bottom{text-align:center;margin-top:17px}.game-hint{color:var(--muted);font-size:13px;line-height:1.5;min-height:18px;margin:0 0 18px}.controls{display:flex;gap:9px;justify-content:center}.arrow-btn{height:44px;width:60px;border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--fg);font-weight:800;font-size:23px}.arrow-btn:hover{background:var(--soft)}.restart{margin-top:15px}.form-screen{justify-content:center}.panel-title{font-size:38px;margin:0;letter-spacing:-.04em}.settings-panel .subtitle{font-size:14px}.field{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:16px 0;border-bottom:1px solid var(--line);font-size:14px;font-weight:700}.field select{width:60%;border:1px solid var(--line);border-radius:9px;background:var(--soft);color:var(--fg);padding:10px}.field input{width:19px;height:19px;accent-color:var(--accent)}.help-note{color:var(--muted);font-size:12px;line-height:1.5;margin:25px 0 0}.finish-panel{text-align:center}.trophy{margin:auto auto 19px;width:72px;height:72px;display:grid;place-items:center;border-radius:50%;background:#fbe3c9;color:#c97b38;font-size:35px}.finish-stats{display:flex;gap:12px;justify-content:center;margin:27px 0 20px}.finish-stats>div{flex:1;background:var(--soft);padding:13px 5px;border-radius:10px}.finish-stats span{display:block;color:var(--muted);font-size:11px;margin-bottom:6px}.finish-stats strong{font-size:22px}.finish-screen .actions{gap:8px}.finish-screen .actions .button{padding:12px 14px}.no-next #btn-next{display:none}@keyframes tileAppear{from{transform:scale(.7);opacity:.4}to{transform:scale(1);opacity:1}}@keyframes winFlash{0%,100%{filter:brightness(1);transform:scale(1)}50%{filter:brightness(1.1);transform:scale(1.022)}}@media(max-width:600px){.screen{padding:23px 12px}.panel{padding:30px 22px}.game-screen{padding-top:25px}.topbar-buttons{flex-wrap:wrap;justify-content:end}.dashboard{gap:6px}.stat{min-width:0;padding:9px 10px}.stat strong{font-size:20px}.target-label{padding:9px}.board-wrap{padding:8px}.board{gap:7px}.tile{border-radius:7px}.brand{font-size:44px}.arrow-btn{width:57px}.panel-title{font-size:33px}.field select{width:57%}}@media(prefers-reduced-motion:reduce){.button,.tile,body{transition:none}.board.complete{animation-duration:.1s}}

/* Постоянные ячейки. Внутрь добавляются/перемещаются живые DOM-плитки. */
.screen[hidden]{display:none}
.board>.cell{aspect-ratio:1;position:relative;min-width:0;background:var(--empty);border-radius:10px}
.board>.cell>.tile{position:absolute;inset:0;aspect-ratio:auto;width:100%;height:100%;}
@media(max-width:600px){.board>.cell{border-radius:7px}}