diff --git a/nextjs-app/components/PerformanceChart.module.css b/nextjs-app/components/PerformanceChart.module.css
index 857c6d5..a35525f 100644
--- a/nextjs-app/components/PerformanceChart.module.css
+++ b/nextjs-app/components/PerformanceChart.module.css
@@ -118,6 +118,12 @@
   .mobileChips {
     display: block;
   }
+  /* Canvas needs an explicit height now that the parent .chartContainer
+     flows naturally (its old fixed 220px was clipping the chip strip and
+     pushing the disclosure link onto the plot area). */
+  .chartWrapper {
+    height: 220px;
+  }
   /* The desktop "click the legend to show progress" hint is irrelevant
      once the chip row is the disclosure mechanism. */
   .chartHint {
diff --git a/nextjs-app/components/SchoolDetailView.module.css b/nextjs-app/components/SchoolDetailView.module.css
index 3f42cd8..a3612fc 100644
--- a/nextjs-app/components/SchoolDetailView.module.css
+++ b/nextjs-app/components/SchoolDetailView.module.css
@@ -880,8 +880,12 @@
         grid-template-columns: 1fr;
     }
 
+    /* PerformanceChart on mobile now stacks: trend banner → chip subtitle →
+       chip row → canvas → mini-legend → COVID footnote. The container must
+       flow naturally instead of clipping to a fixed 220px — PerformanceChart's
+       own .chartWrapper carries the canvas height. */
     .chartContainer {
-        height: 220px;
+        height: auto;
     }
 
     .mapContainer {