fix(search): stop the mobile sort dropdown overflowing the viewport

On a location search the results header shows the view toggle and the
sort <select> side by side. The select sizes to its widest option
('Highest Reading, Writing & Maths %', ~273px), so on a phone its right
edge ran ~46px past the viewport and was clipped off-screen.

On mobile let the select flex into the remaining space with min-width:0
so its label truncates instead of overflowing, and keep the view toggle
from shrinking. Verified live at 390px: the select now sits fully within
the viewport.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

nextjs-app/components/ComparisonChart.module.css

@@ -21,10 +21,8 @@
 
 @media (max-width: 640px) {
     .chips {
-        /* Two chips per row so long school names don't crowd into a single
-           line; each chip fills its column and truncates with an ellipsis. */
-        display: grid;
-        grid-template-columns: 1fr 1fr;
+        display: flex;
+        flex-wrap: wrap;
         gap: 6px;
         padding-bottom: 8px;
     }
@@ -33,8 +31,8 @@
         display: inline-flex;
         align-items: center;
         gap: 6px;
-        min-height: 40px;
-        min-width: 0;
+        min-height: 44px;
+        max-width: 100%;
         padding: 4px 10px;
         border: 1px solid rgba(0, 0, 0, .12);
         border-radius: 999px;
@@ -60,8 +58,6 @@
         overflow: hidden;
         text-overflow: ellipsis;
         white-space: nowrap;
-        /* min-width:0 lets the name shrink inside the grid cell so the
-           ellipsis kicks in instead of overflowing. */
-        min-width: 0;
+        max-width: 9rem;
     }
 }

nextjs-app/components/HomeView.module.css

@@ -369,6 +369,16 @@
 
   .viewToggle {
     justify-content: center;
+    flex-shrink: 0;
+  }
+
+  /* The sort <select> sizes to its widest option ("Highest Reading, Writing
+     & Maths %"), which overflows a phone viewport — beside the view toggle it
+     ran off the right edge. Let it flex into the remaining space and shrink;
+     the selected label truncates instead of pushing past the screen. */
+  .sortSelect {
+    flex: 1;
+    min-width: 0;
   }
 
   .mapViewContainer {