Remove footer-controls markup and related key-label/key styles; delete footer-controls CSS rules

Author: AyushCodes160

public/main.js

@@ -117,11 +117,6 @@ async function showPokemonDetails(id, name) {
             <div class="circle-bg"></div>
             <img class="summary-img" src="https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/other/official-artwork/${id}.png" alt="${name}" />
           </div>
-          <div class="footer-controls">
-            <div class="key-label"><span class="key">A</span> Held Item</div>
-            <div class="key-label"><span class="key">X</span> Change Markings</div>
-            <button class="key-label" onclick="pokemonDetails.style.display='none'"><span class="key">B</span> Back</button>
-          </div>
         </div>
       </div>
     </div>

public/style.css

@@ -537,9 +537,6 @@ body.dark-mode header {
 .circle-bg { position: absolute; width: 400px; height: 400px; border-radius: 999px; background: linear-gradient(135deg, #f9fafb, #e5e7eb); border: 1px solid #d1d5db; opacity: 0.6; }
 .summary-img { width: 80%; filter: drop-shadow(0 20px 30px rgba(0,0,0,0.45)); position: relative; z-index: 1; }
 
-.footer-controls { position: absolute; bottom: 16px; right: 24px; display: flex; gap: 24px; }
-.key-label { display: flex; align-items: center; gap: 6px; font-weight: 700; color: #1f2937; font-size: 13px; background: none; border: none; cursor: pointer; }
-.key { background: #fff; border: 2px solid #1f2937; border-radius: 999px; width: 24px; height: 24px; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; }
 
 /* Responsive adjustments */
 @media (max-width: 720px) {
@@ -550,7 +547,7 @@ body.dark-mode header {
   .topbar-inner { transform: none; }
   .image-wrap { height: 260px; }
   .circle-bg { width: 280px; height: 280px; }
-  .footer-controls { position: static; justify-content: flex-end; margin-top: 12px; }
+  
 }