feat: Added flex-wrap, max-width, and tighter mobile gaps to prevent ho…

- "frontend/src/App.css"

GSD-Task: S06/T01

frontend/src/App.css

@@ -1413,6 +1413,13 @@ a.app-footer__repo:hover {
 
 .technique-header__tags {
   display: inline-flex;
+  flex-wrap: wrap;
+  gap: 0.25rem;
+}
+
+.technique-header__creator-genres {
+  display: inline-flex;
+  flex-wrap: wrap;
   gap: 0.25rem;
 }
 
@@ -2163,6 +2170,26 @@ a.app-footer__repo:hover {
   .topic-subtopic {
     padding-left: 1rem;
   }
+
+  .app-main {
+    padding: 0 1rem;
+  }
+
+  .technique-header__meta {
+    gap: 0.375rem;
+  }
+
+  .technique-header__tags {
+    gap: 0.1875rem;
+  }
+
+  .technique-header__creator-genres {
+    gap: 0.1875rem;
+  }
+
+  .version-switcher__select {
+    max-width: 12rem;
+  }
 }
 
 /* ── Report Issue Modal ─────────────────────────────────────────────────── */
@@ -2526,6 +2553,9 @@ a.app-footer__repo:hover {
   padding: 0.3rem 0.5rem;
   font-size: 0.8rem;
   cursor: pointer;
+  max-width: 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
 }
 
 .version-switcher__select:focus {