*{box-sizing:border-box}:root{--bg-color: #faf8ef;--container-bg: #bbada0;--cell-bg: #cdc1b4;--text-dark: #776e65;--text-light: #f9f6f2;--grid-gap: 15px;--tile-radius: 3px;--transition-speed: .1s}@media(max-width:450px){:root{--grid-gap: 8px}}body{margin:0;padding:0;font-family:Clear Sans,Helvetica Neue,Arial,sans-serif;background-color:var(--bg-color);color:var(--text-dark);display:flex;justify-content:center;align-items:center;min-height:100vh}#app{width:100%;max-width:500px;padding:0 10px;box-sizing:border-box;display:flex;flex-direction:column}@media(min-width:900px){#app{max-width:900px}}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;margin-top:10px}.title-container h1{margin:0;font-size:40px;font-weight:700;letter-spacing:-1px}@media(min-width:450px){.title-container h1{font-size:80px;letter-spacing:-2px}}.title-container p{margin:0;font-size:14px;font-weight:700}@media(min-width:450px){.title-container p{font-size:18px}}.stats-container{display:flex;gap:5px}.stat-box{background:var(--container-bg);padding:4px 10px;border-radius:3px;text-align:center;min-width:40px;color:#fff}@media(min-width:450px){.stat-box{padding:5px 20px;min-width:60px}}.stat-label{display:block;font-size:9px;text-transform:uppercase;color:#eee4da;font-weight:700}.stat-value{display:block;font-size:16px;font-weight:700}@media(min-width:450px){.stat-label{font-size:13px}.stat-value{font-size:25px}}.controls{margin-bottom:20px}.game-intro{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.game-intro p{margin:0;font-size:14px;line-height:1.4}@media(min-width:450px){.game-intro p{font-size:18px}}.ai-dashboard{background:var(--container-bg);padding:10px;border-radius:6px;display:flex;flex-direction:column;gap:10px;justify-content:space-between;align-items:center;color:#fff;margin-bottom:20px}@media(min-width:450px){.ai-dashboard{flex-direction:row;padding:15px;width:100%}}@media(min-width:900px){.ai-dashboard{padding:15px 25px}}.ai-config{display:flex;gap:15px;width:100%;justify-content:space-around;flex-wrap:wrap}@media(min-width:450px){.ai-config{width:auto;gap:15px;flex:1;justify-content:flex-start}}@media(min-width:900px){.ai-config{gap:30px}}.config-item{display:flex;flex-direction:column;gap:5px}.config-item label{font-size:11px;text-transform:uppercase;font-weight:700}.config-item select,.config-item input[type=range]{height:30px}.config-item select{padding:0 5px;border:none;border-radius:3px;background:#faf8ef;color:#776e65;font-weight:700}.config-item input[type=range]{cursor:pointer;accent-color:#8f7a66;width:100px}@media(min-width:450px){.config-item input[type=range]{width:120px}}#speed-value{font-size:12px;font-weight:700}button{background:#8f7a66;color:var(--text-light);border:none;padding:10px 15px;border-radius:3px;font-weight:700;font-size:16px;cursor:pointer;white-space:nowrap}@media(min-width:450px){button{padding:10px 20px;font-size:18px}}button:hover{background:#7f6a56}#ai-toggle{background:#f67c5f;width:100%}@media(min-width:450px){#ai-toggle{width:auto}}#ai-toggle:hover{background:#f43f5e}#ai-toggle.active{background:#edc22e}.game-container{position:relative;background:var(--container-bg);border-radius:6px;width:100%;aspect-ratio:1 / 1;height:auto;padding:var(--grid-gap);box-sizing:border-box;touch-action:none}.grid-background{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(4,1fr);gap:var(--grid-gap);width:100%;height:100%}.grid-cell{background:var(--cell-bg);border-radius:var(--tile-radius)}.tile-container{position:absolute;top:var(--grid-gap);left:var(--grid-gap);right:var(--grid-gap);bottom:var(--grid-gap)}.tile{position:absolute;width:calc((100% - 3 * var(--grid-gap)) / 4);height:calc((100% - 3 * var(--grid-gap)) / 4);border-radius:var(--tile-radius);display:flex;justify-content:center;align-items:center;font-weight:700;transition:top var(--transition-speed) ease-in-out,left var(--transition-speed) ease-in-out,transform .1s ease-in-out;z-index:10}.tile-inner{font-size:35px;width:100%;text-align:center}@media(min-width:450px){.tile-inner{font-size:55px}}.tile-2{background:#eee4da;color:#776e65}.tile-4{background:#ede0c8;color:#776e65}.tile-8{background:#f2b179;color:#f9f6f2}.tile-16{background:#f59563;color:#f9f6f2}.tile-32{background:#f67c5f;color:#f9f6f2}.tile-64{background:#f65e3b;color:#f9f6f2}.tile-128{background:#edcf72;color:#f9f6f2}.tile-128 .tile-inner{font-size:25px}@media(min-width:450px){.tile-128 .tile-inner{font-size:40px}}.tile-256{background:#edcc61;color:#f9f6f2}.tile-256 .tile-inner,.tile-512 .tile-inner{font-size:25px}.tile-512{background:#edc850;color:#f9f6f2}@media(min-width:450px){.tile-256 .tile-inner,.tile-512 .tile-inner{font-size:40px}}.tile-1024{background:#edc53f;color:#f9f6f2}.tile-1024 .tile-inner,.tile-2048 .tile-inner,.tile-4096 .tile-inner,.tile-8192 .tile-inner{font-size:20px}.tile-2048{background:#edc22e;color:#f9f6f2}.tile-4096,.tile-8192{background:#3c3a32;color:#f9f6f2}@media(min-width:450px){.tile-1024 .tile-inner,.tile-2048 .tile-inner,.tile-4096 .tile-inner,.tile-8192 .tile-inner{font-size:30px}}.tile-super{background:#3c3a32;color:#f9f6f2}.tile-super .tile-inner{font-size:15px}@media(min-width:450px){.tile-super .tile-inner{font-size:25px}}.tile-new{animation:tile-spawn .2s ease-out}.tile-merged{animation:tile-merge .2s ease-in-out;z-index:20}@keyframes tile-spawn{0%{transform:scale(0)}to{transform:scale(1)}}@keyframes tile-merge{0%{transform:scale(1)}50%{transform:scale(1.15)}to{transform:scale(1)}}.status-overlay{position:absolute;inset:0;background:#eee4daba;z-index:100;display:flex;flex-direction:column;justify-content:center;align-items:center;opacity:0;pointer-events:none;transition:opacity .5s;border-radius:6px}.status-overlay.active{opacity:1;pointer-events:all}.status-overlay h2{font-size:40px;color:#776e65;margin-bottom:20px}@media(min-width:450px){.status-overlay h2{font-size:60px}}.overlay-controls{display:flex;gap:12px}.footer{text-align:left;color:var(--text-dark);font-size:14px;line-height:1.6;margin-top:30px}@media(min-width:450px){.footer{font-size:18px}}.footer b{color:var(--text-dark)}.github-corner:hover .octo-arm{animation:octocat-wave .56s ease-in-out}@keyframes octocat-wave{0%,to{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media(max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave .56s ease-in-out}}@media(max-width:450px){.github-corner svg{width:60px!important;height:60px!important}}.main-layout{display:flex;flex-direction:column;gap:20px;width:100%}@media(min-width:900px){.main-layout{flex-direction:row;align-items:flex-start}.game-container{flex:0 0 480px}.strategy-viewer{flex:1;margin-bottom:0}}.strategy-viewer{margin-bottom:20px}.toggle-code-btn{width:100%;background:#8f7a66;color:var(--text-light);border:none;padding:10px 15px;border-radius:3px;font-weight:700;font-size:14px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:background .2s}.toggle-code-btn:hover{background:#7f6a56}@media(min-width:900px){.toggle-code-btn{display:none}}#toggle-icon{display:inline-block;transition:transform .3s ease;font-size:12px}#toggle-icon.expanded{transform:rotate(90deg)}.code-panel{max-height:400px;overflow:hidden;transition:max-height .3s ease-out;margin-top:10px}.code-panel.collapsed{max-height:0;margin-top:0}@media(min-width:900px){.code-panel.collapsed{max-height:500px;margin-top:0}.code-panel{max-height:500px}}#strategy-code{width:100%;height:380px;padding:12px;border:2px solid var(--container-bg);border-radius:3px;font-family:Courier New,Courier,monospace;font-size:11px;line-height:1.5;background:#f5f5f5;color:#333;resize:none;box-sizing:border-box}@media(min-width:900px){#strategy-code{height:480px;border:none;background:#fdfdfd}}@media(min-width:450px){.toggle-code-btn{font-size:16px}#strategy-code{font-size:13px;height:400px}.code-panel{max-height:450px}}