Fix .tbl-wrap::before float bug (<=560px): float:right 340px-tall pseudo-element pushed tables 340px below their wrap, clipping them out of view — broke BOTH the PS pension card table AND the year-by-year table on mobile. Now position:absolute overlay. PS card also gets max-height:none (8 rows, show all).

site/style.css

@@ -153,6 +153,7 @@ input[type=range]{width:100%;accent-color:var(--blue)}
 .wi-grid label{font-size:14px;font-weight:600}
 .wi-grid output{color:var(--blue);font-weight:800;float:right}
 .tbl-wrap{overflow:auto;max-height:340px;border:1px solid var(--line);border-radius:8px;margin-top:8px}
+#ps-card .tbl-wrap{max-height:none} /* PS card: only 8 rows — show them all, no inner scroll */
 table{border-collapse:collapse;font-size:12.5px;width:100%}
 th,td{padding:5px 8px;border-bottom:1px solid var(--line);text-align:right;white-space:nowrap}
 /* PS pension card breakdown table: wrap text, fixed layout → fits 320px.
@@ -172,9 +173,9 @@ tr.dep td{color:var(--red)}
 @media(max-width:560px){
   th:nth-child(4),td:nth-child(4),th:nth-child(9),td:nth-child(9){display:none} /* Non-reg, GIS */
   table{font-size:13px}
-  /* right-edge fade so the horizontal scroll is discoverable (::before = first child, pinned to the visible top-right) */
+  /* right-edge fade so the horizontal scroll is discoverable (::before pinned to the visible top-right) */
   .tbl-wrap{position:relative}
-  .tbl-wrap::before{content:"";float:right;width:26px;height:340px;background:linear-gradient(90deg,transparent,var(--card));pointer-events:none}
+  .tbl-wrap::before{content:"";position:absolute;right:0;top:0;width:26px;height:100%;background:linear-gradient(90deg,transparent,var(--card));pointer-events:none}
 }
 
 /* Round 4: app-shell the quiz screen — #step-body is the only scroll container;