:root{--bg-primary: #0f0f1a;--bg-secondary: #1a1a2e;--bg-card: #16213e;--text-primary: #eee;--text-secondary: #aaa;--accent: #e94560;--accent-glow: rgba(233, 69, 96, .3);--tile-empty: rgba(255, 255, 255, .05);--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;--border-radius: 12px;--grid-gap: 12px;--canvas-size: 400px}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Segoe UI,system-ui,-apple-system,sans-serif;background:linear-gradient(135deg,var(--bg-primary) 0%,var(--bg-secondary) 100%);min-height:100vh;color:var(--text-primary);display:flex;justify-content:center;align-items:center;padding:20px}#app{max-width:500px;width:100%;text-align:center}header{margin-bottom:24px}header h1{font-size:4rem;font-weight:800;background:linear-gradient(135deg,var(--accent) 0%,#ff8a00 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-shadow:0 0 40px var(--accent-glow);letter-spacing:-2px}header .subtitle{color:var(--text-secondary);font-size:.9rem;margin-top:4px}.game-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.score-container{background:var(--bg-card);border-radius:var(--border-radius);padding:12px 24px;box-shadow:0 4px 20px #0000004d}.score-label{font-size:.7rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:1px}.score-value{font-size:2rem;font-weight:700;color:var(--text-primary)}.btn{background:linear-gradient(135deg,var(--accent) 0%,#ff6b6b 100%);border:none;color:#fff;padding:12px 24px;border-radius:var(--border-radius);font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 15px var(--accent-glow)}.btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px var(--accent-glow)}.btn:active{transform:translateY(0)}.seed-container{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:16px;font-size:.9rem;color:var(--text-secondary)}.seed-container input{width:100px;padding:8px 12px;border:1px solid rgba(255,255,255,.1);border-radius:8px;background:var(--bg-card);color:var(--text-primary);font-size:.9rem;text-align:center}.seed-container input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 10px var(--accent-glow)}.game-container{position:relative;width:fit-content;margin:0 auto}#game-canvas{display:block;border-radius:var(--border-radius);box-shadow:0 8px 40px #00000080}.game-over{position:absolute;inset:0;background:#0f0f1ae6;backdrop-filter:blur(4px);border-radius:var(--border-radius);display:flex;justify-content:center;align-items:center;opacity:1;transition:opacity .3s ease}.game-over.hidden{opacity:0;pointer-events:none}.game-over-content{text-align:center}.game-over-content h2{font-size:2.5rem;margin-bottom:16px;color:var(--accent)}.game-over-content p{margin-bottom:8px;font-size:1.1rem;color:var(--text-secondary)}.game-over-content #final-score,.game-over-content #max-tile{color:var(--text-primary);font-weight:700}.game-over-content .btn{margin-top:24px}.controls{margin-top:24px;color:var(--text-secondary);font-size:.85rem}.controls kbd{display:inline-block;padding:4px 8px;background:var(--bg-card);border-radius:4px;font-family:monospace;margin:0 2px;border:1px solid rgba(255,255,255,.1)}.mobile-controls{display:none;font-size:1rem;font-weight:600;color:var(--accent)}@media (max-width: 768px),(hover: none){.desktop-controls{display:none}.mobile-controls{display:inline}}footer{margin-top:32px;color:var(--text-secondary);font-size:.8rem}footer a{color:var(--accent);text-decoration:none}footer a:hover{text-decoration:underline}@media (max-width: 480px){:root{--canvas-size: 320px}header h1{font-size:3rem}.game-header{flex-direction:column;gap:12px}}@keyframes score-pop{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}.score-pop{animation:score-pop .2s ease}.ai-section{margin-top:24px;padding:20px;background:var(--bg-card);border-radius:var(--border-radius);box-shadow:0 4px 20px #0000004d}.ai-section h3{font-size:1.2rem;margin-bottom:16px;color:var(--text-primary)}.ai-model-select{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:16px}.ai-model-select label{color:var(--text-secondary);font-size:.9rem}.ai-model-select select{padding:8px 16px;border:1px solid rgba(255,255,255,.1);border-radius:8px;background:var(--bg-primary);color:var(--text-primary);font-size:.9rem;cursor:pointer;min-width:180px}.ai-model-select select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 10px var(--accent-glow)}.ai-controls{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-bottom:16px}.btn-ai{background:linear-gradient(135deg,#4a90a4,#357a8c);padding:10px 20px;font-size:.9rem;display:flex;align-items:center;gap:6px;box-shadow:0 4px 15px #4a90a44d}.btn-ai:hover:not(:disabled){box-shadow:0 6px 20px #4a90a466}.btn-ai:disabled{background:#555;cursor:not-allowed;opacity:.6;box-shadow:none}.btn-ai.active{background:linear-gradient(135deg,#e94560,#ff6b6b);box-shadow:0 4px 15px var(--accent-glow)}.btn-icon{font-size:1rem}.ai-speed{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:16px;color:var(--text-secondary);font-size:.85rem}.ai-speed input[type=range]{width:120px;height:6px;border-radius:3px;background:#ffffff1a;appearance:none;cursor:pointer}.ai-speed input[type=range]::-webkit-slider-thumb{appearance:none;width:16px;height:16px;border-radius:50%;background:var(--accent);cursor:pointer;box-shadow:0 2px 6px var(--accent-glow)}.ai-status{display:flex;align-items:center;justify-content:center;gap:8px;color:var(--text-secondary);font-size:.85rem}.status-dot{width:8px;height:8px;border-radius:50%;background:#f59e0b;animation:pulse 1.5s infinite}.ai-status.ready .status-dot{background:#10b981;animation:none}.ai-status.error .status-dot{background:#ef4444;animation:none}.ai-status.running .status-dot{background:#3b82f6;animation:pulse .5s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}.ai-hint{margin-top:12px;padding:12px;background:#e945601a;border-radius:8px;color:var(--text-primary);font-size:.95rem;border:1px solid rgba(233,69,96,.3)}.ai-hint.hidden{display:none}.ai-hint #hint-action{font-weight:700;color:var(--accent)}.bot-stats{margin-top:16px;padding:16px;background:#3b82f61a;border-radius:8px;border:1px solid rgba(59,130,246,.3)}.bot-stats.hidden{display:none}.bot-stats h4{margin-bottom:12px;color:var(--text-primary);font-size:.9rem}.bot-stats .stats-grid{display:grid;grid-template-columns:auto auto;gap:6px 16px;font-size:.85rem}.bot-stats .stats-grid span:nth-child(odd){color:var(--text-secondary)}.bot-stats .stats-grid span:nth-child(2n){color:var(--text-primary);font-weight:600;text-align:right}.bot-info-section{margin-top:24px;background:var(--bg-card);border-radius:var(--border-radius);padding:20px;box-shadow:0 4px 20px #0000004d}.bot-info-section summary{cursor:pointer;font-size:1.1rem;font-weight:600;color:var(--text-primary);user-select:none;padding:8px 0;transition:color .2s}.bot-info-section summary:hover{color:var(--accent)}.bot-info-content{margin-top:16px;padding-top:16px;border-top:1px solid rgba(255,255,255,.1)}.bot-card{background:#ffffff08;border-radius:8px;padding:16px;margin-bottom:16px;border-left:3px solid rgba(255,255,255,.2)}.bot-card.highlight{background:#e945600d;border-left:3px solid var(--accent)}.bot-card h4{margin-bottom:8px;color:var(--text-primary);font-size:1rem}.bot-card p{color:var(--text-secondary);font-size:.9rem;line-height:1.5;margin-bottom:12px}.bot-card ul{list-style:none;padding-left:0;margin:0}.bot-card li{color:var(--text-secondary);font-size:.85rem;padding:4px 0 4px 20px;position:relative}.bot-card li:before{content:"→";position:absolute;left:0;color:var(--accent)}.bot-card strong{color:var(--text-primary)}.implementation-notes{background:#3b82f60d;border-radius:8px;padding:16px;margin-top:16px;border-left:3px solid #3b82f6}.implementation-notes h4{margin-bottom:12px;color:var(--text-primary);font-size:1rem}.implementation-notes p{color:var(--text-secondary);font-size:.85rem;line-height:1.6;margin-bottom:8px}.implementation-notes code{background:#0000004d;padding:2px 6px;border-radius:3px;font-family:Courier New,monospace;color:#10b981;font-size:.9em}.hidden{display:none!important}@media (max-width: 768px){:root{--canvas-size: min(90vw, 400px)}body{padding:12px;align-items:flex-start}#app{max-width:100%;padding-top:8px}header h1{font-size:3rem;margin-bottom:4px}header .subtitle{font-size:.8rem}.btn{min-height:48px;font-size:1rem;padding:12px 24px;-webkit-tap-highlight-color:transparent}.game-header{margin-bottom:12px;gap:8px}.score-container{padding:8px 16px;flex:1}.score-label{font-size:.65rem}.score-value{font-size:1.5rem}.seed-container{margin-bottom:12px}.seed-container input{min-height:44px;font-size:16px;padding:8px 12px}.seed-container label{font-size:.9rem}#game-canvas{touch-action:none}.game-container{margin-bottom:16px}.game-over-content{padding:24px}.game-over-content h2{font-size:2rem}.game-over-content p{font-size:1.1rem}.controls{margin-top:16px;font-size:1rem}.mobile-controls{display:flex;align-items:center;justify-content:center;gap:8px}.mobile-controls:before{content:"👆";font-size:1.2rem}.ai-section{margin-top:16px;padding:16px}.ai-section h3{font-size:1.1rem;margin-bottom:12px}.ai-model-select{flex-direction:column;align-items:stretch;gap:8px;margin-bottom:12px}.ai-model-select select{width:100%;min-height:44px;font-size:16px}.ai-controls{flex-direction:row;gap:8px;margin-bottom:12px}.btn-ai{flex:1;min-height:48px;font-size:.9rem;padding:10px}.ai-speed{flex-direction:column;align-items:stretch;gap:8px}.ai-speed input[type=range]{width:100%}.ai-status{font-size:.85rem;padding:8px}.ai-hint{font-size:.9rem;padding:10px}footer{margin-top:24px;font-size:.8rem}}@media (min-width: 769px) and (max-width: 1024px) and (orientation: portrait){:root{--canvas-size: 450px}.btn{min-height:44px}#game-canvas{touch-action:none}}@media (max-width: 896px) and (orientation: landscape){body{align-items:center;padding:8px}#app{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto 1fr auto;gap:16px;max-width:100%}header{grid-column:1 / -1;margin-bottom:0}header h1{font-size:2.5rem}.game-container{grid-row:2;grid-column:1}:root{--canvas-size: min(45vh, 300px)}.ai-section{grid-row:2;grid-column:2;margin-top:0}.controls,footer{grid-column:1 / -1}}@media (hover: none){.btn:active{transform:scale(.96);box-shadow:0 2px 10px var(--accent-glow)}.btn-ai:active{transform:scale(.96)}#game-canvas{cursor:grab}#game-canvas:active{cursor:grabbing}*{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}input,select,textarea{-webkit-user-select:text;user-select:text}}@media (-webkit-min-device-pixel-ratio: 2),(min-resolution: 192dpi){#game-canvas{image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges}}@media (prefers-color-scheme: dark){:root{--bg-primary: #000000;--bg-secondary: #0a0a0a}}@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}