Stop rows shifting 2px when selected

7.css gives ONLY tr.highlighted a border (1px solid #aaddfa), and its table is
border-collapse: collapse — so a selected row genuinely grew 1px at top and
bottom and pushed every row beneath it down by 2px. Moving the cursor made the
whole list jitter.

Every tbody row now reserves that 1px as a transparent border, so selecting a
row changes colour and nothing about the geometry.

The rule has to live in `skinfix`, which outranks `skin` by LAYER regardless of
specificity — so a blanket transparent border there also blanks 7.css's own
highlight border. Both selected states therefore restate border-color
explicitly: the inactive pane via --w7-li-bd-hl (the same #aaddfa 7.css uses,
and already restated by the dark palette), the focused pane via --w7-el-bd-h.

Added a "selection geometry" pair to the harness — identical tables, one with a
middle row selected — so the baselines either line up or they visibly do not.
They did not before this change; they do now, verified zoomed.

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

ui/dev/harness.html

@@ -138,6 +138,36 @@
       </figure>
     </div>
 
+    <h2>2b — Selection geometry (rows must NOT shift when selected)</h2>
+    <div class="pair">
+      <figure class="cell" style="margin:0">
+        <figcaption>no selection</figcaption>
+        <table class="is-active">
+          <colgroup><col /><col style="width:6rem" /></colgroup>
+          <thead><tr><th>Name</th><th>Size</th></tr></thead>
+          <tbody>
+            <tr><td>aaa.txt</td><td>1 KB</td></tr>
+            <tr><td>bbb.txt</td><td>2 KB</td></tr>
+            <tr><td>ccc.txt</td><td>3 KB</td></tr>
+            <tr><td>ddd.txt</td><td>4 KB</td></tr>
+          </tbody>
+        </table>
+      </figure>
+      <figure class="cell" style="margin:0">
+        <figcaption>middle row selected — baselines must still line up</figcaption>
+        <table class="is-active">
+          <colgroup><col /><col style="width:6rem" /></colgroup>
+          <thead><tr><th>Name</th><th>Size</th></tr></thead>
+          <tbody>
+            <tr><td>aaa.txt</td><td>1 KB</td></tr>
+            <tr class="highlighted"><td>bbb.txt</td><td>2 KB</td></tr>
+            <tr><td>ccc.txt</td><td>3 KB</td></tr>
+            <tr><td>ddd.txt</td><td>4 KB</td></tr>
+          </tbody>
+        </table>
+      </figure>
+    </div>
+
     <h2>3 — Context menu</h2>
     <div class="pair">
       <figure class="cell" style="margin:0">

ui/src/styles.css

@@ -639,6 +639,21 @@ body {
     border-color: var(--w7-li-bd-hl);
   }
 
+  /* Constant row geometry. 7.css gives ONLY tr.highlighted a 1px border, and
+     the table is border-collapse: collapse — so a selected row physically grew
+     1px at top and bottom and shoved every row below it down by 2px as the
+     cursor moved. Every row reserves that border instead, transparent when not
+     selected, so selecting changes colour and nothing else.
+     NOTE: this sits in `skinfix`, which outranks `skin` by LAYER regardless of
+     specificity, so it would also blank 7.css's highlight border — both
+     selected states therefore restate their border-color below. */
+  .win7 table > tbody > tr {
+    border: 1px solid transparent;
+  }
+  .win7 table > tbody > tr.highlighted {
+    border-color: var(--w7-li-bd-hl);
+  }
+
   /* Pane-focus model (commander convention, matching Win7 Explorer):
      the CURSOR ROW always carries the selection band in BOTH panels —
      tr.highlighted covers "selected via Space" AND "cursor row" (the template