Phone flows: the menu, a dialog, a new post, a reply and a reaction by thumb

FlowTests drive the narrowest phone through what landed so far, each opened menu, sheet or dialog checked to be whole
on the screen with 44px targets (fit.js measures inside a scope now): the menu closes after a choice, an outside tap
and Escape; "Liked by" rises from the bottom and closes from its button; a new post is written in the sheet the round
button opens from a scrolled feed, with the words focused; a reply is written in a sheet; a reaction is picked from the
React sheet, through the one-time public notice, and taken back. Cells client.mobile.flow.*. The menu's dark-mode
toggle gets a 44px hit area and a name, and the public notice dialog marks itself for the tests.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01LsXgEaXee4GCU1hwYgPJXw

tests/e2e/Mobile/fit.js

@@ -3,7 +3,8 @@
 //   settle()   waits for fonts, for the page to stop changing, two frames and the pictures in view
 //   primary()  marks the page's main scroller, the one the sweep steps through
 //   step(f)    scrolls it by f of its height; false at its end
-//   measure()  what doesn't fit: sideways overflow, boxes beyond the screen, cut popovers, small targets, small text
+//   measure(s) what doesn't fit: sideways overflow, boxes beyond the screen, cut popovers, small targets, small text;
+//              with a selector, the targets inside what it matches only (an open menu or dialog)
 window.__fit = (() => {
 	const scrolls = value => value === "auto" || value === "scroll"
 	const shown = el => el.checkVisibility({ opacityProperty: true, visibilityProperty: true })
@@ -196,9 +197,10 @@ window.__fit = (() => {
 	// a target needs a 44x44 CSS px hit area (Apple's guideline, WCAG 2.5.5): the centre and four points 21px away must
 	// reach it, so a neighbour reaching into that square fails it as much as a small box does. Only targets a tap can reach
 	// now are judged; one under an overlay or out of view is judged at another step
-	function targets() {
+	function targets(scope) {
 		const small = [], tiny = []
-		for (const el of document.querySelectorAll(candidates)) {
+		const within = scope ? [...document.querySelectorAll(scope)].flatMap(s => [...s.querySelectorAll(candidates)]) : document.querySelectorAll(candidates)
+		for (const el of within) {
 			if (exempt(el) || !shown(el))
 				continue
 			const own = el.getBoundingClientRect()
@@ -234,9 +236,9 @@ window.__fit = (() => {
 		return { small, tiny }
 	}
 
-	function measure() {
+	function measure(scope) {
 		styles = new Map()
-		const { small, tiny } = targets()
+		const { small, tiny } = targets(scope)
 		const result = { url: location.pathname + location.search, overflow: overflow(), beyond: beyond(), popovers: popovers(), small, tiny }
 		styles = new Map()
 		return result