Symmetric 3+2 layout for "Tune the search" settings grid

The auto-fit minmax(220px, 1fr) grid was wrapping the 5 settings as
4 + 1, orphaning the PLM-model dropdown on its own row. Move to an
explicit 6-track grid where the three number inputs each span 2
(row 1, 3-up) and the two dropdowns each span 3 (row 2, 2-up). Both
rows sum to the full width — no orphan, and the dropdowns get the
wider space they need for long option labels like "Saccharomyces
cerevisiae". Single column below 880 px so labels don't truncate.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

dee/static/app.css

@@ -1144,9 +1144,25 @@ input:focus, textarea:focus, select:focus {
 /* ============================================================ SETTINGS */
 
 .setting-grid {
+    /* 6-column grid so we can place 3 narrow number fields across row 1
+       (each spans 2) and 2 wider dropdown fields across row 2 (each spans 3).
+       Result is a 3-up / 2-up arrangement where both rows sum to the full
+       width — no orphan field on the second row. */
     display: grid;
-    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
-    gap: 18px;
+    grid-template-columns: repeat(6, 1fr);
+    gap: 18px 22px;
+}
+.setting-grid > .setting:nth-child(1),
+.setting-grid > .setting:nth-child(2),
+.setting-grid > .setting:nth-child(3) { grid-column: span 2; }
+.setting-grid > .setting:nth-child(4),
+.setting-grid > .setting:nth-child(5) { grid-column: span 3; }
+@media (max-width: 880px) {
+    /* On narrower viewports the 6-track grid leaves the dropdown labels
+       (e.g. "Saccharomyces cerevisiae") truncated. Collapse to a single
+       column — each label/input pair stacks cleanly, no orphan row. */
+    .setting-grid { grid-template-columns: 1fr; gap: 14px; }
+    .setting-grid > .setting:nth-child(n) { grid-column: auto; }
 }
 .setting { display: flex; flex-direction: column; gap: 5px; }
 .setting-name {

dee/static/index.html

@@ -7,7 +7,7 @@
     <!-- ?v= query bumps invalidate browser + iframe asset caches when app.css /
          app.js change. Bump these numbers whenever you ship a frontend update —
          without them, users keep getting the stale file for up to a week. -->
-    <link rel="stylesheet" href="/static/app.css?v=20260523-4" />
+    <link rel="stylesheet" href="/static/app.css?v=20260523-5" />
     <link rel="icon" type="image/svg+xml" href="/static/favicon.svg?v=2" />
     <link rel="apple-touch-icon" href="/static/favicon.svg?v=2" />
     <!-- Mol* (PDBe) viewer for AlphaFold structure embed. Loaded async; the
@@ -687,7 +687,7 @@
 
     <!-- Cloning reference data must load before app.js so the Designer
          can read VECTORS / ENZYMES / CLONING_METHODS / TAGS / LINKERS. -->
-    <script src="/static/cloning_db.js?v=20260523-4" defer></script>
-    <script src="/static/app.js?v=20260523-4" defer></script>
+    <script src="/static/cloning_db.js?v=20260523-5" defer></script>
+    <script src="/static/app.js?v=20260523-5" defer></script>
 </body>
 </html>