adding player profiles

public/css/style.css

@@ -52,6 +52,26 @@ body {
   color: #fff;
 }
 
+/* Hamburger toggle — hidden on desktop */
+.nav-toggle {
+  display: none;
+  background: none;
+  border: none;
+  cursor: pointer;
+  padding: 6px;
+  flex-direction: column;
+  gap: 5px;
+}
+
+.nav-toggle span {
+  display: block;
+  width: 24px;
+  height: 2px;
+  background: #b2bec3;
+  border-radius: 2px;
+  transition: all 0.25s;
+}
+
 .navbar-nav {
   display: flex;
   align-items: center;
@@ -488,30 +508,59 @@ tr:hover {
 }
 
 /* ─── Responsive ──────────────────────────────────────── */
-@media (max-width: 600px) {
+@media (max-width: 700px) {
+  /* Hamburger visible on mobile */
+  .nav-toggle {
+    display: flex;
+  }
+
   .navbar {
-    padding: 0 0.5rem;
+    padding: 0 0.75rem;
     height: 52px;
+    flex-wrap: wrap;
   }
 
   .navbar-brand {
     font-size: 1.15rem;
   }
 
+  /* Dropdown menu */
   .navbar-nav {
+    display: none;
+    flex-direction: column;
+    width: 100%;
+    background: var(--darker);
+    border-top: 1px solid rgba(255,255,255,0.08);
+    padding: 0.5rem 0;
     gap: 0;
   }
 
-  .navbar-nav a {
-    padding: 0.4rem 0.5rem;
-    font-size: 0.8rem;
+  .navbar-nav.open {
+    display: flex;
   }
 
+  .navbar-nav li {
+    width: 100%;
+  }
+
+  .navbar-nav a {
+    display: block;
+    padding: 0.7rem 1rem;
+    font-size: 0.95rem;
+    border-radius: 0;
+  }
+
+  .navbar-nav a:hover {
+    background: rgba(255,255,255,0.06);
+  }
+
+  /* Layout */
   .container,
   .container-narrow {
     padding: 0.75rem;
   }
 
+  /* Hero */
   .hero {
     padding: 1.5rem 0.5rem;
   }
@@ -524,6 +573,7 @@ tr:hover {
     font-size: 0.95rem;
   }
 
+  /* Cards */
   .card {
     padding: 1rem;
     border-radius: 10px;
@@ -533,6 +583,7 @@ tr:hover {
     font-size: 1.05rem;
   }
 
+  /* Stats */
   .stats-row {
     gap: 0.5rem;
   }
@@ -550,6 +601,7 @@ tr:hover {
     font-size: 0.7rem;
   }
 
+  /* Package grid */
   .package-grid {
     grid-template-columns: 1fr;
     gap: 0.6rem;
@@ -563,6 +615,7 @@ tr:hover {
     font-size: 1.2rem;
   }
 
+  /* Hunt cards */
   .hunt-card {
     flex-direction: column;
     align-items: flex-start;
@@ -570,6 +623,7 @@ tr:hover {
     padding: 0.75rem 1rem;
   }
 
+  /* Scan result */
   .scan-result h1 {
     font-size: 1.5rem;
   }
@@ -587,11 +641,13 @@ tr:hover {
     font-size: 2rem;
   }
 
+  /* Buttons */
   .btn {
     padding: 0.5rem 1rem;
     font-size: 0.85rem;
   }
 
+  /* Tables — horizontal scroll on mobile */
   table {
     font-size: 0.85rem;
   }
@@ -605,8 +661,23 @@ tr:hover {
     padding: 0.25rem 0.5rem;
   }
 
+  /* Footer */
   .footer {
     padding: 1rem;
     font-size: 0.75rem;
   }
+
+  /* Touch-friendly form controls */
+  .form-control {
+    font-size: 1rem;
+    padding: 0.7rem 0.8rem;
+  }
+
+  .btn {
+    min-height: 44px;
+  }
+
+  .btn-sm {
+    min-height: 36px;
+  }
 }