body{background-color:#1a1400;background-image:url(/floating-tile.png);font-family:Arial,sans-serif;margin:0;display:flex;justify-content:center;align-items:center;min-height:100vh;position:relative;overflow:hidden}body:before{content:"";position:absolute;inset:0;background:inherit;filter:blur(4px) brightness(.6);z-index:-1}:root{--gap-size: 2vw;--cell-size: 18.5vw;--board-size: calc(4 * var(--cell-size) + 5 * var(--gap-size))}@media (min-width: 520px){:root{--gap-size: 15px;--cell-size: 100px;--board-size: 480px}}.app-container{display:flex;flex-direction:column;align-items:center;padding:20px 10px;box-sizing:border-box;width:100%;min-height:100vh}.game-container{display:flex;align-items:flex-start;width:100%;justify-content:center}.header{width:var(--board-size);display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.title{font-family:Montserrat,sans-serif;font-size:clamp(40px,12vw,70px);font-weight:700;color:#f2eee1;margin:0;text-align:left}.subtitle{font-family:Poppins,sans-serif;font-weight:300;font-size:clamp(10px,2.5vw,12px);color:#f2eee1;margin:0}.right-header{display:flex;flex-direction:column;align-items:flex-end;gap:10px}.top-controls{display:flex;gap:10px;align-items:center}.new-game-button{background-color:#001f18;color:#f2eee1;border:none;padding:10px;font-family:Poppins,sans-serif;font-weight:300;font-size:clamp(14px,3vw,18px);border-radius:3px;cursor:pointer;height:fit-content}.new-game-button:hover{filter:brightness(1.2)}.score-container{background-color:#001f18;padding:5px 15px;font-family:Poppins,sans-serif;font-weight:300;font-size:clamp(20px,5vw,25px);border-radius:3px;color:#f2eee1;text-align:center}.score-label{font-size:clamp(12px,2.5vw,13px);color:#f2eee1b3}.board-container{width:var(--board-size);height:var(--board-size)}.board{background-color:#001f18;border-radius:6px;padding:var(--gap-size);position:relative;width:100%;height:100%;box-sizing:border-box}.grid-container{display:grid;grid-template-columns:repeat(4,var(--cell-size));grid-template-rows:repeat(4,var(--cell-size));gap:var(--gap-size)}.grid-cell{width:var(--cell-size);height:var(--cell-size);background-color:#1a14004d;border-radius:3px}.mute-button{background-color:#001f18;color:#f2eee1;border:none;border-radius:50%;width:40px;height:40px;font-size:20px;cursor:pointer;display:flex;justify-content:center;align-items:center;line-height:1}.mute-button:hover{filter:brightness(1.2)}.mobile-leaderboard-button{display:none}.leaderboard-container{margin-left:20px;width:250px}@media (max-width: 850px){.game-container{flex-direction:column;align-items:center}.desktop-leaderboard{display:none}.leaderboard-container{margin-left:0;margin-top:20px}.mobile-leaderboard-button{display:block;background-color:#001f18;color:#f2eee1;border:none;padding:10px 20px;font-size:18px;font-weight:700;border-radius:3px;cursor:pointer;margin-top:20px}}.tile{position:absolute;width:var(--cell-size, 100px);height:var(--cell-size, 100px);display:flex;justify-content:center;align-items:center;font-size:clamp(20px,9vw,45px);font-weight:700;border-radius:3px;color:#1a1400;transition:top .2s ease-in-out,left .2s ease-in-out}.tile-2{background:#f2eee1}.tile-4{background:#2bfae9}.tile-8{background:#d4ff28}.tile-16{background:#ff2df4}.tile-32{background:#ff1a1a}.tile-64{background:#2e0026}.tile-128{background:#00122e}.tile-256{background:#2e0700}.tile-512{background:#001f18}.tile-1024{background:#ff2df4}.tile-2048{background-image:linear-gradient(135deg,#ff2df4,#d4ff28);color:#1a1400}.tile-16,.tile-32,.tile-64,.tile-128,.tile-256,.tile-512,.tile-1024{color:#f2eee1}.tile-128,.tile-256,.tile-512{font-size:clamp(16px,7vw,35px)}.tile-1024,.tile-2048{font-size:clamp(14px,6vw,30px)}@keyframes newTileAnimation{0%{transform:scale(0)}to{transform:scale(1)}}@keyframes mergedTileAnimation{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}.tile.new{animation:newTileAnimation .2s ease-out}.tile.merged{animation:mergedTileAnimation .2s ease-out}.share-button{background-color:transparent;color:#001f18;border:2px solid #001F18;padding:10px 20px;font-size:18px;font-weight:700;border-radius:3px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;transition:all .2s ease-in-out}.share-button:hover{background-color:#000;color:#f2eee1}.game-over-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#eee4daba;border-radius:6px;display:flex;flex-direction:column;justify-content:space-between;align-items:center;z-index:10;padding:40px 20px;box-sizing:border-box}.game-over-text-content{display:flex;flex-direction:column;align-items:center;gap:15px}.game-over-message{font-size:clamp(48px,12vw,60px);font-weight:700;color:#1a1400;margin:0}.final-score{font-size:clamp(20px,5vw,24px);color:#1a1400;margin:0}.submitting-message{font-size:clamp(16px,4vw,18px);color:#1a1400;margin:0;font-style:italic;animation:pulsingOpacity 1.5s ease-in-out infinite}@keyframes pulsingOpacity{0%{opacity:1}50%{opacity:.6}to{opacity:1}}.game-over-buttons{display:flex;flex-direction:column;gap:15px;width:80%;max-width:250px}.game-over-buttons{display:flex;flex-direction:column;align-items:center;gap:15px;width:100%}.retry-button,.share-button{padding:12px 25px;font-size:18px;width:auto;min-width:200px;text-align:center}.retry-button:hover{filter:brightness(1.2)}.submitted-message{font-size:18px;color:#001f18;font-weight:700;margin:0}.error-message{font-size:16px;color:#ff1a1a;font-weight:700;margin:0}.leaderboard-container{background-color:#001f18;border-radius:6px;padding:15px;width:250px;height:fit-content;color:#f2eee1}.leaderboard-container h2{text-align:center;margin-top:0;color:#f2eee1}.leaderboard-header{display:flex;justify-content:space-between;align-items:center;font-size:10px;text-transform:uppercase;font-weight:700;color:#f2eee199;padding:0 10px;margin-bottom:5px}.header-scores{display:flex;gap:8px;text-align:right;width:90px;justify-content:flex-end}.header-scores span:first-child{width:42px}.leaderboard-container ol{padding-left:0;list-style:decimal inside;margin:0}.leaderboard-container li{display:flex;justify-content:space-between;align-items:center;padding:5px 10px;border-radius:3px}.leaderboard-container li:nth-child(odd){background-color:#f2eee11a}.leaderboard-name{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px}.score-and-tile{display:flex;align-items:center;gap:8px;width:90px;justify-content:flex-end}.leaderboard-tile,.leaderboard-tile-placeholder{color:#1a1400;font-weight:700;font-size:12px;padding:2px 6px;border-radius:3px;min-width:20px;width:42px;box-sizing:border-box;text-align:center}.leaderboard-tile{background-color:#ff2df4}.leaderboard-tile-placeholder{background-color:transparent}.leaderboard-score{font-family:monospace;text-align:right;width:40px}.pagination-controls{display:flex;justify-content:space-between;align-items:center;margin-top:15px;padding-top:10px;border-top:1px solid rgba(242,238,225,.1)}.pagination-controls button{background-color:transparent;color:#f2eee1;border:1px solid #F2EEE1;border-radius:3px;padding:5px 10px;cursor:pointer;font-weight:700}.pagination-controls button:hover:not(:disabled){background-color:#f2eee11a}.pagination-controls button:disabled{color:#f2eee14d;border-color:#f2eee14d;cursor:not-allowed}.leaderboard-subtitle{text-align:center;margin-top:-10px;margin-bottom:15px;font-size:12px;color:#f2eee1b3}.modal-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#1a1400cc;display:flex;justify-content:center;align-items:center;z-index:2000}.start-modal-content{background:linear-gradient(160deg,#0b1d1b,#122d2a);border-radius:20px;box-shadow:0 0 20px #d4ff2833,0 0 40px #2bfae94d;display:flex;flex-direction:column;align-items:center;padding:30px;max-width:90vw;width:400px}.floating-image{width:120px;height:120px;margin-bottom:15px;animation:floatAnimation 3s ease-in-out infinite;filter:drop-shadow(0 0 10px rgba(255,255,255,.2))}.modal-title{font-family:"Press Start 2P",cursive;font-size:1.8rem;font-weight:700;color:#fff;margin:0;text-shadow:0 0 5px rgba(212,255,40,.5)}.modal-subtitle{font-family:Poppins,sans-serif;font-size:1rem;color:#d4af37;margin-top:5px;margin-bottom:20px}.divider{width:80%;height:2px;background:linear-gradient(90deg,transparent,#d4af37,transparent);margin-bottom:25px;opacity:.5}.start-form{display:flex;flex-direction:column;align-items:center;width:100%}.name-input{background-color:#0003;border:2px solid #ccc;border-radius:8px;padding:10px;text-align:center;margin-bottom:15px;width:80%;color:#fff;font-family:Poppins,sans-serif;font-size:1rem}.name-input::placeholder{color:#ffffff80}.start-game-button{background:#ffb300;color:#111;border:none;border-radius:10px;padding:10px 25px;font-weight:700;font-family:Poppins,sans-serif;cursor:pointer;transition:all .3s ease}.start-game-button:hover{background:#ffd54f;transform:scale(1.05);box-shadow:0 0 15px #ffb30080}.start-game-button:active{transform:scale(.95)}@keyframes floatAnimation{0%{transform:translateY(0)}50%{transform:translateY(-10px)}to{transform:translateY(0)}}@media (max-width: 650px){.start-modal-content{padding-top:40px;padding-bottom:40px;width:250px}.floating-image{width:100px;height:100px;margin-bottom:10px}.modal-title{font-size:1.5rem}.modal-subtitle{margin-bottom:15px}.divider{margin-bottom:20px}.start-game-button{padding:8px 20px}}@media (max-height: 500px){.start-modal-content{transform:scale(.9)}}.leaderboard-modal-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.leaderboard-modal-content{position:relative}.close-leaderboard-button{position:absolute;top:-10px;right:-10px;background:#ff1a1a;color:#fff;border:none;border-radius:50%;width:30px;height:30px;font-size:20px;font-weight:700;cursor:pointer;display:flex;justify-content:center;align-items:center;line-height:1}.modal-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.modal-content{background:#faf8ef;padding:20px 40px;border-radius:6px;max-width:500px;text-align:center;color:#776e65}.close-button{background-color:#8f7a66;color:#f9f6f2;border:none;padding:10px 20px;font-size:18px;font-weight:700;border-radius:3px;cursor:pointer;margin-top:20px}.win-modal-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#d4ff2880;display:flex;justify-content:center;align-items:center;z-index:1000}.win-modal-content{background:#001f18;padding:40px;border-radius:6px;text-align:center;color:#f2eee1;box-shadow:0 10px 25px #0000004d}.win-modal-content h2{font-size:48px;color:#d4ff28;margin-top:0}.win-modal-buttons{display:flex;gap:20px;margin-top:30px}