From 28aa7012f1e3722ec60544a3e054a7c22f8b7733 Mon Sep 17 00:00:00 2001
From: Paul Trowbridge <paul@hptrow.me>
Date: Fri, 18 Sep 2026 09:43:12 -0400
Subject: [PATCH] Put what cannot move at the top of the ledger

The immovable rows sat between Adjustable and Selected total, which made
them read as an afterthought to a figure they in fact constrain. They come
first now: this much is already booked and billed, this is what is left to
work with, and here is how that got to where it is.

The walk stays immediately above Adjustable, because it sums to it -- the
two are one statement and separating them would leave a column of numbers
adding up to nothing on the page.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
---
 ui/src/components/OperationPanel.jsx | 40 ++++++++++++++++------------
 1 file changed, 23 insertions(+), 17 deletions(-)

diff --git a/ui/src/components/OperationPanel.jsx b/ui/src/components/OperationPanel.jsx
index fcdb223..917bd5e 100644
--- a/ui/src/components/OperationPanel.jsx
+++ b/ui/src/components/OperationPanel.jsx
@@ -453,6 +453,29 @@ function ScaleLedger({ currentTotals, scaleInputs, setScaleInputs, scalePlug, se
           </tr>
         </thead>
         <tbody>
+          {/* What cannot move comes first: it is the constraint the rest is
+              worked out against. Then the walk, which sums to Adjustable, and
+              the two together make the selected total. */}
+          {exclLines.map(seg => (
+            <tr key={seg.name} className="text-amber-700">
+              <td className="pr-3 whitespace-nowrap max-w-[16rem] truncate" title={seg.name}>
+                {seg.name}
+                <span className="ml-1.5 px-1 py-0.5 rounded bg-amber-50 text-amber-700 text-[10px] uppercase tracking-wide">
+                  final
+                </span>
+              </td>
+              {measures.map(m => (
+                <td key={m.key} className={`${numCell} text-amber-700`}>
+                  {m.key === 'price' ? fmtNum(priceOf(seg), m.dp) : fmtNum(seg[m.key], m.dp)}
+                </td>
+              ))}
+            </tr>
+          ))}
+
+          {exclLines.length > 0 && (
+            <tr>{rule}{measures.map(m => <td key={m.key} className="p-0 px-2"><div className="border-t border-gray-300 my-1" /></td>)}</tr>
+          )}
+
           {/* the walk from baseline to current, by initiative */}
           {lines.map(e => (
             <tr key={e.key} className="text-gray-600">
@@ -480,23 +503,6 @@ function ScaleLedger({ currentTotals, scaleInputs, setScaleInputs, scalePlug, se
             ))}
           </tr>
 
-          {/* Rows the pivot shows but operations cannot write. Listed so the
-              panel's figures reconcile with what the grid displays. */}
-          {exclLines.map(seg => (
-            <tr key={seg.name} className="text-amber-700">
-              <td className="pr-3 whitespace-nowrap max-w-[16rem] truncate" title={seg.name}>
-                {seg.name}
-                <span className="ml-1.5 px-1 py-0.5 rounded bg-amber-50 text-amber-700 text-[10px] uppercase tracking-wide">
-                  final
-                </span>
-              </td>
-              {measures.map(m => (
-                <td key={m.key} className={`${numCell} text-amber-700`}>
-                  {m.key === 'price' ? fmtNum(priceOf(seg), m.dp) : fmtNum(seg[m.key], m.dp)}
-                </td>
-              ))}
-            </tr>
-          ))}
 
           {hasExcl && (
             <tr className={onTotal ? 'font-semibold text-gray-700' : 'text-gray-600'}>