From c3e419e686a7317a7822c35d10ae8393f6864cbc Mon Sep 17 00:00:00 2001 From: leaf-agent <318509791+leaf-agent@users.noreply.github.com> Date: Sun, 30 Aug 2026 08:07:25 +0000 Subject: [PATCH 1/2] Withhold an option's box-shadow ease until the page is presented MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The default package theme grants `lf-option` a .12s box-shadow ease, and the stylesheet that grants it is also the one that first gives the property a value. theme.css is render-blocking but not style-blocking, so on a load where a style recalc falls inside its own fetch the parser has already styled the options with box-shadow's initial `none`; the sheet then lands, states `var(--lf-ring), var(--lf-lift)` — two transparent channels, no pixel different — and the ease it granted in the same breath plays on every option of a page nobody has touched. The returning-reader gate reports exactly that, on whichever arrangement happens to load slowly enough, and reports nothing on the loads where the recalc misses the window. Withhold the transition behind the presentation stamp, spelled as theme.css's own arrival guard is, so a page with no runtime behind it keeps the ease it always had. --- skills/leaf/packages/default/theme.css | 19 +++++++++++++++++++ 1 file changed, 19 insertions(+) diff --git a/skills/leaf/packages/default/theme.css b/skills/leaf/packages/default/theme.css index ba16560a8..0e1515d4d 100644 --- a/skills/leaf/packages/default/theme.css +++ b/skills/leaf/packages/default/theme.css @@ -355,6 +355,25 @@ lf-compare:has(> lf-variant > :not(a, abbr, area, audio, b, bdi, bdo, br, button --lf-lift: 0 3px 10px rgba(0, 0, 0, .14); } } } + /* Arriving is not a gesture, which theme.css says for body and for the runtime's own + * chrome and cannot say for a page element: `transition` does not inherit, so what an + * unreached descendant still plays is a transition of its own declaring. That comment + * names the trade and leaves the finding to the suite; this is the finding, and the + * option's own rule is where it is answered. + * + * Nothing about the reader moves here. The stylesheet is render-blocking but not + * style-blocking, so the parser styles the options before it lands and box-shadow holds + * its initial `none`; the sheet then arrives and states `var(--lf-ring), var(--lf-lift)` + * — two transparent channels, no pixel different — while the line above has already + * granted the ease. Chrome reports a 120ms box-shadow transition on every option of a + * page nobody has touched, and whether it reports one at all turns on whether a recalc + * fell inside the sheet's own load, which is why the returning-reader gate found it on + * some loads and not others. Withheld until the page says it is presented, so the ease + * belongs to the pointer that earns it. Spelled as the layer's guard is — the runtime's + * own script link, the presentation stamp — so a page with no runtime behind it, which + * never stamps and never held its options back, keeps the ease it always had. */ + html:has(script[type="module"][src="/leaf.js"]) + body:not([data-lf-presented]) lf-option { transition: none; } } /* The mark the upgrade injects: the keyboard path and the state in one element. It is * silent until there is a pick to state, so its box is not the same in both states — the From cb1234f3ddf9bd0c9c73805cc0e89f18340a2026 Mon Sep 17 00:00:00 2001 From: leaf-agent <318509791+leaf-agent@users.noreply.github.com> Date: Sun, 30 Aug 2026 08:37:21 +0000 Subject: [PATCH 2/2] Name what the returning-reader gate cannot report in the withhold comment --- skills/leaf/packages/default/theme.css | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/skills/leaf/packages/default/theme.css b/skills/leaf/packages/default/theme.css index 0e1515d4d..51416a02f 100644 --- a/skills/leaf/packages/default/theme.css +++ b/skills/leaf/packages/default/theme.css @@ -359,7 +359,12 @@ lf-compare:has(> lf-variant > :not(a, abbr, area, audio, b, bdi, bdo, br, button * chrome and cannot say for a page element: `transition` does not inherit, so what an * unreached descendant still plays is a transition of its own declaring. That comment * names the trade and leaves the finding to the suite; this is the finding, and the - * option's own rule is where it is answered. + * option's own rule is where it is answered. The suite carries less of that trade than + * the sentence sounds: the returning-reader gate holds a return against a first visit + * and reports only what the return adds, so it names a transition that plays on some + * arrivals and not others and says nothing about one that plays on every arrival alike. + * This was the first kind. A package declaring a transition on an element of its own + * gets no warning of the second and has to withhold it the way this rule does. * * Nothing about the reader moves here. The stylesheet is render-blocking but not * style-blocking, so the parser styles the options before it lands and box-shadow holds