.game-header{width:100%;max-width:500px;margin:0 auto 16px}.game-header__top{align-items:center;gap:16px;margin-bottom:30px;display:flex}.game-header__stats{gap:8px;display:flex}.game-header__buttons{justify-content:space-between}.game-header__actions,.game-header__buttons{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.game-header__actions{flex:1;justify-content:flex-end}.header-brand{text-align:center;flex-direction:column;gap:6px;margin:0 auto;display:flex}.header-brand__logo{font:700 32px/1 var(--cell-font-family);color:#000;text-decoration:none!important}.header-brand__logo a{display:block}.header-brand__subtitle{color:var(--text-tips);font-size:16px}.score-box{text-align:center;min-width:76px;line-height:1}.score-box__label{letter-spacing:1px;text-transform:uppercase;opacity:.6;font-size:12px;font-weight:700}.score-box__value{font-family:var(--cell-font-family);margin-top:4px;font-size:20px}@media (width<=639px){.game-header{max-width:360px}.game-header__top{margin-bottom:20px}.header-brand__logo{font-size:26px}.header-brand__subtitle{font-size:14px}.score-box{min-width:64px}.score-box__value{font-size:18px}}@media (width<=399px){.game-header{max-width:280px}.game-header__top{margin-bottom:16px}.header-brand__logo{font-size:22px}.header-brand__subtitle{font-size:12px}.score-box{min-width:56px}.score-box__value{font-size:16px}}@media (width<=319px){.game-header{max-width:240px}.game-header__top{margin-bottom:12px}.header-brand__logo{font-size:18px}.header-brand__subtitle{font-size:11px}.score-box{min-width:48px}.score-box__value{font-size:14px}}.tile{--text:#776e65;width:var(--cell-size);height:var(--cell-size);will-change:transform;transition:transform .15s;position:absolute;top:0;left:0}.tile--old{z-index:0;transition:none!important}.tile--merged{z-index:2}.tile--new{transition:none}.tile--position-0-0{transform:translate(calc((100% + var(--gap))*0),calc((100% + var(--gap))*0))}.tile--position-0-1{transform:translate(calc((100% + var(--gap))*1),calc((100% + var(--gap))*0))}.tile--position-0-2{transform:translate(calc((100% + var(--gap))*2),calc((100% + var(--gap))*0))}.tile--position-0-3{transform:translate(calc((100% + var(--gap))*3),calc((100% + var(--gap))*0))}.tile--position-0-4{transform:translate(calc((100% + var(--gap))*4),calc((100% + var(--gap))*0))}.tile--position-0-5{transform:translate(calc((100% + var(--gap))*5),calc((100% + var(--gap))*0))}.tile--position-0-6{transform:translate(calc((100% + var(--gap))*6),calc((100% + var(--gap))*0))}.tile--position-0-7{transform:translate(calc((100% + var(--gap))*7),calc((100% + var(--gap))*0))}.tile--position-1-0{transform:translate(calc((100% + var(--gap))*0),calc((100% + var(--gap))*1))}.tile--position-1-1{transform:translate(calc((100% + var(--gap))*1),calc((100% + var(--gap))*1))}.tile--position-1-2{transform:translate(calc((100% + var(--gap))*2),calc((100% + var(--gap))*1))}.tile--position-1-3{transform:translate(calc((100% + var(--gap))*3),calc((100% + var(--gap))*1))}.tile--position-1-4{transform:translate(calc((100% + var(--gap))*4),calc((100% + var(--gap))*1))}.tile--position-1-5{transform:translate(calc((100% + var(--gap))*5),calc((100% + var(--gap))*1))}.tile--position-1-6{transform:translate(calc((100% + var(--gap))*6),calc((100% + var(--gap))*1))}.tile--position-1-7{transform:translate(calc((100% + var(--gap))*7),calc((100% + var(--gap))*1))}.tile--position-2-0{transform:translate(calc((100% + var(--gap))*0),calc((100% + var(--gap))*2))}.tile--position-2-1{transform:translate(calc((100% + var(--gap))*1),calc((100% + var(--gap))*2))}.tile--position-2-2{transform:translate(calc((100% + var(--gap))*2),calc((100% + var(--gap))*2))}.tile--position-2-3{transform:translate(calc((100% + var(--gap))*3),calc((100% + var(--gap))*2))}.tile--position-2-4{transform:translate(calc((100% + var(--gap))*4),calc((100% + var(--gap))*2))}.tile--position-2-5{transform:translate(calc((100% + var(--gap))*5),calc((100% + var(--gap))*2))}.tile--position-2-6{transform:translate(calc((100% + var(--gap))*6),calc((100% + var(--gap))*2))}.tile--position-2-7{transform:translate(calc((100% + var(--gap))*7),calc((100% + var(--gap))*2))}.tile--position-3-0{transform:translate(calc((100% + var(--gap))*0),calc((100% + var(--gap))*3))}.tile--position-3-1{transform:translate(calc((100% + var(--gap))*1),calc((100% + var(--gap))*3))}.tile--position-3-2{transform:translate(calc((100% + var(--gap))*2),calc((100% + var(--gap))*3))}.tile--position-3-3{transform:translate(calc((100% + var(--gap))*3),calc((100% + var(--gap))*3))}.tile--position-3-4{transform:translate(calc((100% + var(--gap))*4),calc((100% + var(--gap))*3))}.tile--position-3-5{transform:translate(calc((100% + var(--gap))*5),calc((100% + var(--gap))*3))}.tile--position-3-6{transform:translate(calc((100% + var(--gap))*6),calc((100% + var(--gap))*3))}.tile--position-3-7{transform:translate(calc((100% + var(--gap))*7),calc((100% + var(--gap))*3))}.tile--position-4-0{transform:translate(calc((100% + var(--gap))*0),calc((100% + var(--gap))*4))}.tile--position-4-1{transform:translate(calc((100% + var(--gap))*1),calc((100% + var(--gap))*4))}.tile--position-4-2{transform:translate(calc((100% + var(--gap))*2),calc((100% + var(--gap))*4))}.tile--position-4-3{transform:translate(calc((100% + var(--gap))*3),calc((100% + var(--gap))*4))}.tile--position-4-4{transform:translate(calc((100% + var(--gap))*4),calc((100% + var(--gap))*4))}.tile--position-4-5{transform:translate(calc((100% + var(--gap))*5),calc((100% + var(--gap))*4))}.tile--position-4-6{transform:translate(calc((100% + var(--gap))*6),calc((100% + var(--gap))*4))}.tile--position-4-7{transform:translate(calc((100% + var(--gap))*7),calc((100% + var(--gap))*4))}.tile--position-5-0{transform:translate(calc((100% + var(--gap))*0),calc((100% + var(--gap))*5))}.tile--position-5-1{transform:translate(calc((100% + var(--gap))*1),calc((100% + var(--gap))*5))}.tile--position-5-2{transform:translate(calc((100% + var(--gap))*2),calc((100% + var(--gap))*5))}.tile--position-5-3{transform:translate(calc((100% + var(--gap))*3),calc((100% + var(--gap))*5))}.tile--position-5-4{transform:translate(calc((100% + var(--gap))*4),calc((100% + var(--gap))*5))}.tile--position-5-5{transform:translate(calc((100% + var(--gap))*5),calc((100% + var(--gap))*5))}.tile--position-5-6{transform:translate(calc((100% + var(--gap))*6),calc((100% + var(--gap))*5))}.tile--position-5-7{transform:translate(calc((100% + var(--gap))*7),calc((100% + var(--gap))*5))}.tile--position-6-0{transform:translate(calc((100% + var(--gap))*0),calc((100% + var(--gap))*6))}.tile--position-6-1{transform:translate(calc((100% + var(--gap))*1),calc((100% + var(--gap))*6))}.tile--position-6-2{transform:translate(calc((100% + var(--gap))*2),calc((100% + var(--gap))*6))}.tile--position-6-3{transform:translate(calc((100% + var(--gap))*3),calc((100% + var(--gap))*6))}.tile--position-6-4{transform:translate(calc((100% + var(--gap))*4),calc((100% + var(--gap))*6))}.tile--position-6-5{transform:translate(calc((100% + var(--gap))*5),calc((100% + var(--gap))*6))}.tile--position-6-6{transform:translate(calc((100% + var(--gap))*6),calc((100% + var(--gap))*6))}.tile--position-6-7{transform:translate(calc((100% + var(--gap))*7),calc((100% + var(--gap))*6))}.tile--position-7-0{transform:translate(calc((100% + var(--gap))*0),calc((100% + var(--gap))*7))}.tile--position-7-1{transform:translate(calc((100% + var(--gap))*1),calc((100% + var(--gap))*7))}.tile--position-7-2{transform:translate(calc((100% + var(--gap))*2),calc((100% + var(--gap))*7))}.tile--position-7-3{transform:translate(calc((100% + var(--gap))*3),calc((100% + var(--gap))*7))}.tile--position-7-4{transform:translate(calc((100% + var(--gap))*4),calc((100% + var(--gap))*7))}.tile--position-7-5{transform:translate(calc((100% + var(--gap))*5),calc((100% + var(--gap))*7))}.tile--position-7-6{transform:translate(calc((100% + var(--gap))*6),calc((100% + var(--gap))*7))}.tile--position-7-7{transform:translate(calc((100% + var(--gap))*7),calc((100% + var(--gap))*7))}.tile__face{font-family:var(--cell-font-family);will-change:transform;border-radius:3px;justify-content:center;align-items:center;font-size:55px;font-weight:700;line-height:1;display:flex;position:absolute;inset:0}.tile__face,.tile__face--2{color:var(--text);background-color:var(--tile-2)}.tile__face--4{color:var(--text);background-color:var(--tile-4)}.tile__face--8{color:var(--text-light);background-color:var(--tile-8)}.tile__face--16{color:var(--text-light);background-color:var(--tile-16)}.tile__face--32{color:var(--text-light);background-color:var(--tile-32)}.tile__face--64{color:var(--text-light);background-color:var(--tile-64)}.tile__face--128{background-color:var(--tile-128)}.tile__face--128,.tile__face--256{color:var(--text-light);font-size:48px}.tile__face--256{background-color:var(--tile-256)}.tile__face--512{color:var(--text-light);background-color:var(--tile-512);font-size:48px}.tile__face--1024{background-color:var(--tile-1024)}.tile__face--1024,.tile__face--2048{color:var(--text-light);font-size:36px}.tile__face--2048{background-color:var(--tile-2048)}.tile__face--super{color:var(--text-light);background-color:var(--tile-super);font-size:32px}.tile--new .tile__face{animation:.2s cubic-bezier(.22,1.2,.36,1) .15s both appear}.tile--merged .tile__face{animation:.25s .15s both pop-in}.tile--merged .tile__face--prev{animation:1ms step-end .15s both prev-out}.tile--old .tile__face{animation:.25s .15s both vanish}@keyframes appear{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}@keyframes pop-in{0%{transform:scale(0)}50%{transform:scale(1.2)}to{transform:scale(1)}}@keyframes prev-out{0%{opacity:1}to{opacity:0}}@keyframes vanish{0%,60%{opacity:1}to{opacity:0}}@media (width<=639px){.tile__face{font-size:40px}.tile__face--128,.tile__face--256,.tile__face--512{font-size:36px}.tile__face--1024,.tile__face--2048{font-size:30px}.tile__face--super{font-size:24px}}@media (width<=399px){.tile__face{font-size:32px}.tile__face--128,.tile__face--256,.tile__face--512{font-size:28px}.tile__face--1024,.tile__face--2048{font-size:24px}.tile__face--super{font-size:18px}}@media (width<=319px){.tile__face{font-size:26px}.tile__face--128,.tile__face--256,.tile__face--512{font-size:22px}.tile__face--1024,.tile__face--2048{font-size:20px}.tile__face--super{font-size:16px}}.board{--gap:15px;contain:layout style;aspect-ratio:1;touch-action:none;-webkit-user-select:none;user-select:none;box-sizing:border-box;padding:var(--gap);background-color:var(--board-bg);border-radius:8px;width:500px;max-width:100%;margin:0 auto;position:relative}.board .grid-bg{grid-template-rows:repeat(var(--size),1fr);gap:var(--gap);width:100%;height:100%;display:grid}.board .grid-row{grid-template-columns:repeat(var(--size),1fr);gap:var(--gap);display:grid}.board .grid-cell{background-color:var(--cell-bg);border-radius:3px}.tiles-layer{--cell-size:calc((100% - (var(--size) - 1)*var(--gap))/var(--size));top:var(--gap);left:var(--gap);right:var(--gap);bottom:var(--gap);pointer-events:none;contain:layout style;position:absolute;transform:translateZ(0)}@media (width<=639px){.board{--gap:10px;width:360px}}@media (width<=399px){.board{--gap:8px;width:280px}}@media (width<=319px){.board{--gap:6px;width:240px}}.how-to__intro{margin-bottom:16px}.how-to__tip strong{font-weight:800}.how-to-steps{counter-reset:item;margin-bottom:10px;padding:0;list-style:none}.how-to-steps li{background-color:var(--tile-2);border-radius:12px;margin-bottom:12px;padding:16px 16px 16px 56px;position:relative}.how-to-steps li:before{content:counter(item);counter-increment:item;width:28px;height:28px;font-family:var(--cell-font-family);color:var(--text);background-color:#fff;border-radius:50%;justify-content:center;align-items:center;font-size:14px;display:flex;position:absolute;top:16px;left:16px}.how-to-steps li:last-child{margin-bottom:0}.how-to-steps__title{margin-bottom:8px;font-size:16px;font-weight:700}@media (width<=639px){.how-to{max-width:360px;font-size:14px}}@media (width<=399px){.how-to{max-width:280px;font-size:13px}}@media (width<=319px){.how-to{max-width:240px;font-size:12px}}.faq{flex-direction:column;gap:16px;display:flex}.faq__item{background:#fff;border-radius:12px;padding:20px 24px;box-shadow:0 1px 3px #00000014}.faq__question{margin-bottom:10px;font-size:16px;font-weight:700;line-height:1.5}.faq__answer{color:var(--text);font-size:15px;line-height:1.7}@media (width<=639px){.faq{max-width:360px}.faq__item{padding:16px 18px}.faq__question{font-size:15px}.faq__answer{font-size:14px}}@media (width<=399px){.faq{max-width:280px}.faq__item{padding:14px 16px}.faq__question{font-size:14px}.faq__answer{font-size:13px}}@media (width<=319px){.faq{max-width:240px}.faq__item{padding:12px 14px}.faq__question{font-size:13px}.faq__answer{font-size:12px}}
