chore: create Multica handoff checkpoint

app/frontend/pages/screener/foundation.css

@@ -5,7 +5,7 @@
   font-weight: 800;
 }
 
-@media (max-width: 720px) {
+@media (max-width: 767px) {
   #screenerView {
     border-radius: 0px;
   }
@@ -311,7 +311,7 @@
   }
 }
 
-@media (max-width: 720px) {
+@media (max-width: 767px) {
   #screenerView.mobile-results [data-screener-panel]:not([hidden]) {
     display: block !important;
   }
@@ -786,7 +786,7 @@
   box-shadow: 1px 0 0 var(--border);
 }
 
-@media (max-width: 1023px) and (min-width: 721px) {
+@media (max-width: 1023px) and (min-width: 768px) {
 
   #screenerView .factor-data-status,
   #screenerView .regime-evidence {
@@ -794,7 +794,7 @@
   }
 }
 
-@media (max-width: 720px) {
+@media (max-width: 767px) {
   body[data-active-view="screenerView"] .overview-strip {
     display: none;
   }
@@ -1114,7 +1114,7 @@
   color: var(--market-down);
 }
 
-@media (max-width: 720px) {
+@media (max-width: 767px) {
   .tracking-summary {
     grid-template-columns: repeat(2, minmax(0px, 1fr));
   }
@@ -1450,7 +1450,63 @@
   }
 }
 
-@media (max-width: 720px) {
+@media (max-width: 767px) {
+  body.mobile-shell #screenerView .screener-stepper {
+    width: 100%;
+    display: flex;
+    padding-inline: var(--space-8);
+    overflow: visible;
+  }
+
+  body.mobile-shell #screenerView .screener-step {
+    min-width: 0;
+    flex: 1 1 0;
+    flex-direction: column;
+    justify-content: flex-start;
+    gap: var(--space-4);
+    text-align: center;
+  }
+
+  body.mobile-shell #screenerView .screener-step > div {
+    width: 100%;
+    min-width: 0;
+  }
+
+  body.mobile-shell #screenerView .screener-step :is(strong, small) {
+    width: 100%;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  body.mobile-shell #screenerView .step-line {
+    width: var(--space-8);
+    flex: 0 0 var(--space-8);
+    align-self: flex-start;
+    margin: var(--space-12) var(--space-4) 0;
+  }
+}
+
+@media (max-width: 767px) {
+  body.mobile-shell #screenerView,
+  body.mobile-shell #screenerTrackingView {
+    padding-inline: 0;
+  }
+
+  body.mobile-shell #screenerView :is(.screener-result-frame, .curated-strategy-list, .quant-builder-pane, .quant-summary-pane),
+  body.mobile-shell #screenerTrackingView .tracking-table-frame.tbl-wrap {
+    max-height: none;
+    overflow-y: visible;
+  }
+
+  body.mobile-shell #screenerView .screener-result-frame,
+  body.mobile-shell #screenerTrackingView .tracking-table-frame {
+    overflow-x: auto;
+  }
+
+}
+
+@media (max-width: 767px) {
   .screener-page-heading {
     min-height: 54px;
 
@@ -1673,7 +1729,7 @@
   border-color: var(--border-strong);
 }
 
-@media (max-width: 720px) {
+@media (max-width: 767px) {
   #screenerView .screener-strategy-view {
     padding: 8px;
   }
@@ -2031,7 +2087,7 @@ body[data-active-view="screenerView"] .workspace-view {
   min-height: 45px;
 }
 
-@media (min-width: 721px) and (max-width: 1279px) {
+@media (min-width: 768px) and (max-width: 1279px) {
   .quant-screener-panel {
     grid-template-columns: 1fr;
   }
@@ -2041,7 +2097,7 @@ body[data-active-view="screenerView"] .workspace-view {
   }
 }
 
-@media (max-width: 720px) {
+@media (max-width: 767px) {
   body[data-active-view="screenerView"] .workspace-view {
     margin-top: 0px;
 
@@ -2373,7 +2429,7 @@ body[data-active-view="screenerView"] .overview-strip {
   }
 }
 
-@media (max-width: 720px) {
+@media (max-width: 767px) {
   .screener-mode-tabs {
     min-height: 50px;
 
@@ -6042,7 +6098,7 @@ body[data-active-view="screenerView"] .overview-strip {
   min-width: var(--table-wide);
 }
 
-@media (min-width: 721px) {
+@media (min-width: 768px) {
   :root #screenerView.active-view {
     height: auto;