Deploy ddd58bf

content-visibility was quietly shaving the top off every enzyme name

Source: https://github.com/WINTER4000/turingDNA/commit/ddd58bf0a34a50b432f11284b3eac7f91a168ceb

dee/static/app.css

@@ -8103,16 +8103,40 @@ body[data-ui="bench"] #navTuring { display: none; }
 .seqed-line .seqed-bases { position: relative; display: inline-block; }
 .seqed-line .seqed-bases[style*="--w"] { width: calc(var(--w) * 1ch); }
 
-/* Cut sites, above the strand. The tick is the truth; the label just names it. */
-.seqed-cut { height: 15px; position: relative; }
+/* Cut sites, above the strand. The tick is the truth; the label just names it.
+   The row must be TALL ENOUGH TO CONTAIN ITS OWN LABEL. `.seqed-line` carries
+   `content-visibility: auto`, which applies paint containment — so anything a
+   line paints outside its own box is clipped, silently. At `height: 15px` the
+   label (16.1px tall at the default line-height, sitting at `bottom: 6px`)
+   started 7.2px above the row's top edge and had that much shaved off the top
+   of every enzyme name. Verified by hit-test, not by eye: a point inside the
+   label but above the row returned the ancestor div with content-visibility
+   on, and the <b> with it off.
+   Two changes keep it inside: `line-height: 1` (a one-line 9.5px label has no
+   use for a 1.7 line box) and a row tall enough for tick + label. Cheaper
+   than exempting these rows from content-visibility, which would cost the
+   repaint win that rule was added for. */
+.seqed-cut { height: 18px; position: relative; }
+/* The label's containing block is `.seqed-bases`, NOT the row — it has to be,
+   because `left: Nch` is measured from the bases origin and that is what keeps
+   a tick on its own base. In a cut row that span holds only absolutely
+   positioned children, so it is zero-height, and as an inline-block its bottom
+   lands on the line box's BASELINE — leaving a font-dependent descender gap
+   (3px here) between it and the row's bottom edge. Every label rode that gap
+   upward and out of the paint-contained row.
+   `vertical-align: bottom` pins the anchor to the row's bottom edge instead,
+   so the label's clearance is arithmetic rather than a property of whatever
+   font happens to load. */
+.seqed-cut .seqed-bases { vertical-align: bottom; }
 .seqcut { position: absolute; bottom: 0; white-space: nowrap; }
 .seqcut-tick {
     display: block; width: 1px; height: 7px; margin-left: 0;
     background: var(--ink-soft);
 }
 .seqcut b {
-    position: absolute; bottom: 6px; left: 0;
+    position: absolute; bottom: 7px; left: 0;
     font-family: var(--font-ui); font-size: 9.5px; font-weight: 500;
+    line-height: 1;
     letter-spacing: .02em; color: var(--ink-soft); transform: translateX(-1px);
 }
 

dee/static/index.html

@@ -112,7 +112,7 @@
     <!-- ?v= query bumps invalidate browser + iframe asset caches when app.css /
          app.js change. Bump these numbers whenever you ship a frontend update —
          without them, users keep getting the stale file for up to a week. -->
-    <link rel="stylesheet" href="/static/app.css?v=20260824-cuts" />
+    <link rel="stylesheet" href="/static/app.css?v=20260824-cuts3" />
     <!-- The work catalog + the draggable rail. Kept out of app.css so two new
          self-contained surfaces stay reviewable; every colour is an app.css
          token, so both themes work with nothing added. -->
@@ -3132,9 +3132,9 @@
     <!-- Cloning reference data must load before app.js so the Designer
          can read VECTORS / ENZYMES / CLONING_METHODS / TAGS / LINKERS. -->
     <script src="/static/cloning_db.js?v=20260530-ui-polish" defer></script>
-    <script src="/static/context.js?v=20260824-cuts" defer></script>
-    <script src="/static/lineage.js?v=20260824-cuts" defer></script>
-    <script src="/static/app.js?v=20260824-cuts" defer></script>
+    <script src="/static/context.js?v=20260824-cuts3" defer></script>
+    <script src="/static/lineage.js?v=20260824-cuts3" defer></script>
+    <script src="/static/app.js?v=20260824-cuts3" defer></script>
     <!-- The decision trace, BEFORE cockpit.js: applyEvent calls TDTrace.push
          on the very first event, and both are `defer`, so document order is
          load order. Loading it after would drop the opening events of a
@@ -3143,7 +3143,7 @@
     <!-- THE COCKPIT — the persistent orchestrator rail. Loads after app.js so
          TDBench/TDStructure exist when a tool result asks the workspace to
          render something. This is the only conversation surface in the app. -->
-    <script src="/static/cockpit.js?v=20260824-cuts" defer></script>
+    <script src="/static/cockpit.js?v=20260824-cuts3" defer></script>
     <!-- structcard before catalog: the catalog calls TDStructCard.observe as
          soon as it paints. Both are defer, so document order is load order. -->
     <script src="/static/structcard.js?v=20260811-buildC" defer></script>

tests/test_plasmid_editor_ui.py

@@ -491,3 +491,58 @@ def test_the_control_strip_has_one_height():
     css = _code(_read(_APP_CSS))
     assert re.search(r"\.pe-focus \.seqtool-find \{[^}]*height: var\(--pe-ctl-h\)", css, re.S), \
         "the find group is off the shared control height again"
+
+
+def test_a_cut_row_is_tall_enough_to_paint_its_own_enzyme_name():
+    """`.seqed-line` carries `content-visibility: auto`, which applies paint
+    containment — anything a line paints outside its own box is CLIPPED, with
+    no warning and no layout change to notice it by.
+
+    The enzyme label is absolutely positioned inside that line, so the row has
+    to be tall enough to hold it. It was not: a 16.1px label (9.5px text at the
+    default line-height) sitting at `bottom: 6px` needed 22.1px inside a 15px
+    row, and the top 7.2px of every name on the map was shaved off. Confirmed
+    by hit-test at the time — a point inside the label but above the row
+    returned the ancestor div with content-visibility on, and the <b> with it
+    off.
+
+    So this asserts the ARITHMETIC that keeps it inside, which is the thing
+    that actually has to hold. A future tweak to the font size, the offset or
+    the row height fails here rather than silently cropping the label again.
+    """
+    css = _read(_APP_CSS)
+
+    row = _rule_bodies(css, r"\.seqed-cut")
+    assert row, ".seqed-cut rule is gone"
+    row_h = re.search(r"height:\s*([\d.]+)px", row[0])
+    assert row_h, ".seqed-cut lost its explicit height"
+
+    label = _rule_bodies(css, r"\.seqcut b")
+    assert label, ".seqcut b rule is gone"
+    body = label[0]
+    bottom = re.search(r"bottom:\s*([\d.]+)px", body)
+    size = re.search(r"font-size:\s*([\d.]+)px", body)
+    assert bottom and size, ".seqcut b lost its offset or its size"
+
+    # A one-line label with `line-height: 1` is exactly font-size tall. Without
+    # that declaration the used line box is ~1.7x, which is what overflowed.
+    assert re.search(r"line-height:\s*1\b", body), (
+        ".seqcut b needs line-height: 1 — the default line box is ~1.7x the "
+        "font size and pushes the label out of the paint-contained row"
+    )
+    needed = float(bottom.group(1)) + float(size.group(1))
+    assert float(row_h.group(1)) >= needed, (
+        f".seqed-cut is {row_h.group(1)}px but the label needs {needed}px "
+        f"(bottom {bottom.group(1)}px + {size.group(1)}px of text). The top of "
+        f"every enzyme name will be clipped by content-visibility."
+    )
+
+    # The label's containing block is `.seqed-bases`, which is a zero-height
+    # inline-block in a cut row. Left on the baseline it sits a font-dependent
+    # descender gap above the row's bottom edge, and the arithmetic above stops
+    # being true. Pinning it to the bottom is what makes the sum reliable.
+    anchor = _rule_bodies(css, r"\.seqed-cut \.seqed-bases")
+    assert anchor and "vertical-align: bottom" in anchor[0], (
+        ".seqed-cut .seqed-bases must be vertical-align: bottom, or the label "
+        "floats up by however much descender space the font happens to have"
+    )