@astryxdesign/core 0.7.6-canary.fdabeba → 0.7.6

package/src/gestures/GestureHost.ts

@@ -3,10 +3,9 @@
 /**
  * @file GestureHost.ts
  * @input DOM touch, pointer, click, contextmenu, scroll and focus events of
- *   one document; elements with recognizers and consumers attached, and
- *   consumer types found by attribute
- * @output Exports GestureHost (the DOM side of the gesture system),
- *   getGestureHost (one host per document) and the delegated consumer type
+ *   one document; elements with recognizers and consumers attached
+ * @output Exports GestureHost (the DOM side of the gesture system) and
+ *   getGestureHost (one host per document)
  * @position Browser adapter of packages/core/src/gestures: turns real events
  *   into GestureArena input, and carries out what the arena decides
  *
@@ -14,36 +13,36 @@
  *
  * - Recognizers and press consumers attach for a mouse, a pen and a finger
  *   alike (`spec:AST-094` FR43, FR19). Where the primary pointer is coarse
- *   the host listens on the page while something enabled could take a
- *   touch. Where it is fine, each element with an enabled recognizer or
- *   consumer keeps one passive `pointerdown` listener and the page has none:
- *   a press on it (a mouse's primary button, a pen, or a finger, whose
- *   `pointerdown` comes before its `touchstart`) installs the host's page
- *   listeners, which go once that press's contacts end; the click listener
- *   alone stays through the swallower's window, for the click a claimed lift
- *   owes (FR21, FR24). An element whose recognizer claims a moving finger
- *   keeps its blocking `touchmove` under every pointer, a listener FR24
- *   counts apart.
- * - A right click, a pen's barrel button and a ctrl-click on macOS start no
- *   press (primaryClick.ts).
- * - The host follows the primary pointer (a tablet docking a mouse): turning
- *   fine with no press held removes the page listeners and cancels every
- *   touch in flight.
- * - A delegated consumer type has no element to listen on: where the
- *   primary pointer is fine, the document keeps one passive `pointerdown`
- *   listener for every type, counted once per page (FR24).
+ *   the host listens while something enabled could take a touch. Where it
+ *   is fine, each element with an enabled recognizer or consumer keeps one
+ *   passive `pointerdown` listener and the page has none; a press on it (a
+ *   mouse's primary button, a pen, or a finger, whose `pointerdown` comes
+ *   before its `touchstart`) installs the host's page listeners, which go
+ *   once that press's contacts end and the arena has decided them, a tap
+ *   that waits on a double tap included (FR24). After the last detach the
+ *   host holds nothing: no listener, note, frame or timer (releaseWhenIdle).
+ *   Under every pointer, an element whose recognizer claims a moving finger
+ *   also keeps its blocking `touchmove`, a listener FR24 counts apart from
+ *   the press's one.
+ * - A press consumer takes a mouse press as a press (DEC-21): PressTracker's
+ *   fine-pointer profile paints at once and brakes no scroll (FR11).
+ * - The host follows the query (a tablet docking or undocking a mouse):
+ *   turning fine cancels every touch in flight.
+ * - `perEventPointer` (AttachOptions), from before FR43, changes nothing.
  *
  * INPUT CHANNELS
  *
  * - Fingers begin and end with Touch Events: they are the only cancelable
  *   channel (a pointer event's preventDefault cannot stop a scroll or a
- *   click), they keep arriving after the browser takes a pan (which a scroll
- *   handoff needs), and every event lists all the fingers at once. A
- *   finger's movement comes from BOTH its `touchmove`s and its
- *   `pointermove`s (paired at touchstart by target and position), the echo
- *   of one in the other dropped: Chromium sends no `touchmove` until a
- *   finger has travelled about 16 px, while a tap fails and a pan begins at
- *   10.
+ *   click), they keep arriving after the browser takes a pan (which a
+ *   watcher following the scroll to the lift needs, `spec:AST-094` FR20,
+ *   DEC-7), and every event lists all the fingers at once. A
+ *   finger's movement is sampled from ONE channel: its `pointermove`s, once
+ *   its pointerdown has paired with its touchstart (by target and
+ *   position), since Chromium sends no `touchmove` until a finger has
+ *   travelled about 16 px while a tap fails and a pan begins at 10; touch
+ *   events sample only a finger no pointer event reported. The other
+ *   channel keeps its control duties but feeds no sample.
  * - A finger's events go to the element it landed on even after that
  *   element leaves the document, and then never reach the document. Each
  *   tracked finger's target therefore gets its own listeners, and a finger
@@ -51,17 +50,43 @@
  *   removed target never strands a gesture.
  * - Mice and pens come from Pointer Events, with coalesced samples for
  *   velocity. A pen on an iPad also produces `stylus` touches; those are left
- *   to the pointer path.
+ *   to the pointer path, except that a claimed pen's stylus moves are
+ *   cancelled as a finger's.
  * - `pointercancel` on a finger is the browser saying it took that finger
  *   for its own pan or zoom; so is a `touchmove` that can no longer be
  *   cancelled where `touch-action` let the browser pan, and a scroll above
  *   the touch.
  *
+ * FINGERS
+ *
+ * - The host keeps one record of where each finger on the screen landed
+ *   (`fingersDown()`). Finger scrolls (fingerScroll.ts) read it, and a
+ *   scroll lock's page hold (pageHold.ts) asks which touches a recognizer
+ *   owns; both live in their own modules, so a page that needs neither
+ *   never ships them.
+ *
+ * TOUCHES ON MOVING ELEMENTS
+ *
+ * - iOS WebKit hit-tests an element a compositor animation moves where the
+ *   animation started. There, at touch-down, the host resolves the moving
+ *   elements (motion/presentation.ts: one style write each) and asks the
+ *   engine again, so a contact goes to what is drawn under it; press
+ *   trackers read `presentedRect`, and a retargeted tap clicks what it
+ *   touched once, with the engine's own click cancelled or swallowed.
+ *
  * WHAT THE BROWSER IS TOLD
  *
  * - Each element gets the `touch-action` its recognizers leave the browser
- *   (touchAction.ts), set inline when they attach and restored when they
- *   detach.
+ *   (touchAction.ts), never wider than the element's own value (a caller's
+ *   explicit `touch-action` stays in force), set inline when they attach and
+ *   restored when they detach.
+ * - While a finger or a pen is down, text selection and the touch callout
+ *   are off only where the hold does something (`spec:AST-094` FR41): on the
+ *   elements of recognizers that bring a `selectionLock`, and on a non-text
+ *   input under the finger inside them (WebKit's own style makes every
+ *   input selectable); restored when the contact ends. A finger or a pen
+ *   takes it under any primary pointer; a mouse never does (`spec:AST-017`
+ *   FR59).
  * - Each element with a recognizer that can claim a touch while it moves (a
  *   pan, a swipe, a long press that then drags, a pinch) gets a
  *   NON-passive `touchmove` listener that cancels the event only while a
@@ -71,27 +96,39 @@
  *   known cost: a scroll that BEGINS on such an element waits for a busy main
  *   thread (measured in iOS Safari; a passive listener would hand every
  *   diagonal to the scroll instead). Elements whose recognizers only claim
- *   at the lift (taps) and press consumers get no blocking listener, so a
- *   scroll starting on them never waits.
+ *   at the lift (taps), recognizers that never claim (`claimsTouches` false)
+ *   and press consumers get no blocking listener, and the listener a
+ *   finger's target gets at touch-down is passive for them too, so a scroll
+ *   starting on them never waits.
+ * - The browser took a finger on `pointercancel`, on its first uncancelable
+ *   `touchmove` where it could pan, or on a scroll above it once the finger
+ *   has travelled the slop; a scroll under a finger that has not moved is
+ *   the page's own and leaves the touch alone.
  * - A lift whose click must not happen cancels its `touchend` (no click, no
- *   compatibility mouse events) and arms a one-shot swallower for the next
- *   trusted click; a click held for a recognizer that may still recognize is
+ *   compatibility mouse events) and arms the shared click guard
+ *   (utils/clickGuard.ts, the menu press model's too) for the browser's next
+ *   click; a click held for a recognizer that may still recognize is
  *   replayed if they all fail. Keyboard and assistive-technology clicks
  *   (`detail === 0`) always pass.
  * - A `contextmenu` while a recognizer owns a touch is cancelled, so a long
  *   press never also opens the browser's menu.
- *
- * DELEGATED CONSUMERS. A consumer type registered with an attribute (a
- * pressable row) is found at touch-down by walking up from the touch target,
- * and an instance is created for that one touch: a list of a thousand rows
- * costs nothing until a finger lands on one.
+ * - When the app loses focus (a window blur, a hidden page), every touch in
+ *   flight is cancelled, as in UIKit; a finger the browser keeps alive lifts
+ *   on nothing: its `touchend` is cancelled (`spec:AST-094` FR28).
  *
  * SSR-safe: nothing touches `window` or `document` until something attaches.
  *
  * SYNC: When modified, update GestureHost.test.ts and README.md.
  */
 
-import {UIKIT_GESTURES} from '../motion/uikit/gestures';
+import {isRtlElement} from '../hooks/isRtlElement';
+import {
+  presentedElements,
+  presentedOffsetOf,
+  resolvePresented,
+  watchPresentedElements,
+} from '../motion/presentation';
+import {UIKIT_PRESS, UIKIT_TAP} from '../motion/uikit/gestures';
 import {
   browserClock,
   GestureArena,
@@ -100,14 +137,15 @@ import {
   type GestureArenaOptions,
   type GestureClock,
 } from './GestureArena';
-import type {GestureRecognizer} from './GestureRecognizer';
-import {HAPTIC_SWITCH_ATTRIBUTE} from './haptics';
-import {isPrimaryClick} from '../utils/primaryClick';
+import type {GestureRecognizer, SelectionLock} from './GestureRecognizer';
+import type {PressBounds} from './PressTracker';
+import type {PanGestureRecognizer} from './PanGestureRecognizer';
 import {createNativeScrollProbe, parentAcrossShadow} from './nativeScroll';
+import {containsAlongFlatTree} from '../utils/flatTree';
+import {isIosWebKit} from '../utils/touchQueries';
 import {
   gestureHostStyle,
   type GestureHostStyle,
-  holdSelectionStyle,
   intersectTouchAction,
 } from './touchAction';
 import {
@@ -125,16 +163,29 @@ import type {
   TouchInput,
   TouchSample,
 } from './types';
+import {internals} from './recognizerInternals';
+import {
+  armClickGuard,
+  disarmClickGuard,
+  withoutClickGuard,
+} from '../utils/clickGuard';
+import {subscribeInput} from '../utils/inputStream';
+import {isPrimaryClick} from '../utils/primaryClick';
+import {locksSelectionFor} from '../utils/selectionLock';
+import {isCoarsePointer, watchCoarsePointer} from '../utils/coarsePointer';
+import {gestureHosts} from './hostRegistry';
 
 interface Registration {
   readonly recognizers: GestureRecognizer[];
   consumer: TouchConsumer | null;
-  touchMoveListener: EventListener | null;
   /**
-   * Under `inputMode: 'pointer-events'`, the element's blocking `touchend`
-   * listener: it cancels a claimed finger's lift (`spec:AST-094` FR21).
+   * Where fingers come from their pointer events, whether the element
+   * carries the host's blocking `touchend` handler, which cancels a claimed
+   * finger's lift (`spec:AST-094` FR21).
    */
-  touchEndListener: EventListener | null;
+  hasTouchEndListener: boolean;
+  /** Whether the element carries the host's shared blocking touchmove handler. */
+  hasTouchMoveListener: boolean;
   /** Inline values the host replaced, to restore on detach. */
   readonly savedStyle: Map<string, string>;
   /**
@@ -147,6 +198,8 @@ interface Registration {
   manageStyle: boolean;
   /** An action group (`family:action-groups` FR5). */
   actionGroup: boolean;
+  /** The attachments that asked for the action group; it lasts while one does. */
+  actionGroupAsks: number;
 }
 
 export interface GestureHostOptions {
@@ -159,6 +212,13 @@ export interface GestureHostOptions {
   inputMode?: 'auto' | 'pointer-events';
   /** Every recognizer transition, for debugging and tests. */
   onTransition?: GestureArenaOptions['onTransition'];
+  /**
+   * Send a contact to what is drawn while a compositor animation moves an
+   * element (motion/presentation.ts): `auto` where the engine hit-tests such
+   * an element where its animation started (iOS WebKit); `always` or
+   * `never` for tests. @default 'auto'
+   */
+  presentedHitTesting?: 'auto' | 'always' | 'never';
   /**
    * Whether the primary pointer is coarse (a phone, a tablet). Gestures
    * attach for every pointer (`spec:AST-094` FR43); where it is fine, an
@@ -178,6 +238,12 @@ export interface AttachOptions {
    * @default true
    */
   manageStyle?: boolean;
+  /**
+   * Accepted and ignored: every attachment reads each event's pointer
+   * (`spec:AST-094` FR43). Kept so callers written before FR43 compile.
+   * @deprecated
+   */
+  perEventPointer?: boolean;
   /**
    * The element is an action group, sibling actions a held pointer slides
    * across (`family:action-groups` FR5). It is served like every
@@ -186,21 +252,6 @@ export interface AttachOptions {
   actionGroup?: boolean;
 }
 
-/**
- * A kind of view-level consumer found by attribute instead of attached to
- * each element.
- */
-export interface DelegatedConsumerType {
-  /** Marks an element as this kind of consumer. */
-  readonly attribute: string;
-  /**
-   * The consumer for one contact on `element`, or null for none (a disabled
-   * control). The innermost marked element decides, even with null: a press
-   * on a disabled button does not light the row around it.
-   */
-  create(element: Element, pointerType: PointerKind): TouchConsumer | null;
-}
-
 const STYLE_PROPERTIES: Record<keyof GestureHostStyle, string> = {
   touchAction: 'touch-action',
   WebkitTouchCallout: '-webkit-touch-callout',
@@ -208,15 +259,6 @@ const STYLE_PROPERTIES: Record<keyof GestureHostStyle, string> = {
   userSelect: 'user-select',
 };
 
-/**
- * Whether a recognizer can take a touch while it moves, and so needs the
- * blocking `touchmove` listener that stops the browser's pan. A tap claims
- * only at the lift (it fails once the finger travels), so it needs none.
- */
-function claimsWhileMoving(recognizer: GestureRecognizer): boolean {
-  return recognizer.acceptsTouchInput && recognizer.kind !== 'tap';
-}
-
 /**
  * A CSS-wide keyword, which names no touch-action of its own: the value in
  * force resolves it (`initial` and `unset` to `auto`, `inherit` to the
@@ -238,16 +280,41 @@ const CSS_WIDE_KEYWORDS: ReadonlySet<string> = new Set([
  * Run `task` in the next frame, before it paints: a read there styles what
  * the frame must style anyway, and its writes are what the frame shows.
  */
-function inNextFrame(view: Window | null, task: () => void): void {
+function inNextFrame(view: Window | null, task: () => void): () => void {
   if (view != null && typeof view.requestAnimationFrame === 'function') {
-    view.requestAnimationFrame(task);
-  } else {
-    setTimeout(task, 0);
+    const frame = view.requestAnimationFrame(task);
+    return () => view.cancelAnimationFrame(frame);
   }
+  const timeout = setTimeout(task, 0);
+  return () => clearTimeout(timeout);
 }
 
+/** An armed press tracker's own element listeners: they never cancel. */
 const PASSIVE_CAPTURE = {capture: true, passive: true} as const;
 
+/**
+ * Whether a recognizer can take a touch while it moves, and so needs the
+ * blocking `touchmove` listener that stops the browser's pan. A tap claims
+ * only at the lift (it fails once the finger travels), so it needs none.
+ */
+function claimsWhileMoving(recognizer: GestureRecognizer): boolean {
+  return (
+    recognizer.claimsTouches &&
+    internals(recognizer).acceptsTouchInput &&
+    internals(recognizer).family !== 'tap'
+  );
+}
+
+/**
+ * A pan (or a pan subclass), told apart by its family rather than its class,
+ * so a page that constructs no pan never ships PanGestureRecognizer.
+ */
+function isPanRecognizer(
+  recognizer: GestureRecognizer,
+): recognizer is PanGestureRecognizer {
+  return internals(recognizer).family === 'pan';
+}
+
 /**
  * A screen-edge pan, told apart by its kind (architecture:react-component-runtime
  * INV13), so the host can report its layout changes without importing it.
@@ -260,31 +327,30 @@ function asScreenEdgePan(
     : null;
 }
 
-/** The inline properties a held press sets to none (holdSelectionStyle). */
-const HOLD_SELECTION_PROPERTIES = [
-  '-webkit-touch-callout',
-  '-webkit-user-select',
-  'user-select',
-] as const;
-
-/** Elements a held press turned selection off on, and what to restore. */
-const heldSelection = new WeakMap<
-  HTMLElement,
-  {
-    count: number;
-    saved: ReadonlyArray<{name: string; value: string; priority: string}>;
-  }
->();
-const ACTIVE_CAPTURE = {capture: true, passive: false} as const;
-
 type StylusTouch = Touch & {touchType?: string};
 
+function hasStylusTouch(event: TouchEvent): boolean {
+  return touchesOf(event.changedTouches).some(
+    touch => (touch as StylusTouch).touchType === 'stylus',
+  );
+}
+
 interface PlacedContact {
   readonly x: number;
   readonly y: number;
   readonly target: unknown;
 }
 
+/**
+ * How long a claimed finger's lift waits for its `touchend`, ms. The touchend
+ * follows its pointerup in the same frame; a browser that sends pointer events
+ * alone for a finger never sends it, and the record goes.
+ */
+const CLAIMED_LIFT_MS = 500;
+
+/** At most this many claimed lifts wait for their `touchend` at once (FR24). */
+const CLAIMED_LIFT_LIMIT = 8;
+
 /** A touchstart and a pointerdown describe one finger: same target, same spot. */
 function isSamePlace(a: PlacedContact, b: PlacedContact): boolean {
   return (
@@ -298,6 +364,23 @@ function isPointerKind(type: string): type is PointerKind {
   return type === 'touch' || type === 'mouse' || type === 'pen';
 }
 
+/**
+ * What an event, or one of its touches, landed on. Inside an open shadow root
+ * the document's listeners see the shadow host, in `event.target` and in a
+ * touch's `target` alike, while the composed path starts at the element
+ * itself. A touch whose target is not the event's (another finger) keeps its
+ * own.
+ */
+function landedOn(
+  event: Event,
+  retargeted: EventTarget | null = event.target,
+): EventTarget | null {
+  if (retargeted !== event.target) {
+    return retargeted;
+  }
+  return event.composedPath()[0] ?? retargeted;
+}
+
 /**
  * An event's time on the arena's clock (`performance.now()`). Some engines
  * and DOM emulators stamp events in epoch milliseconds instead.
@@ -323,9 +406,34 @@ export class GestureHost {
   readonly arena: GestureArena;
   private readonly doc: Document;
   private readonly registry = new Map<Element, Registration>();
-  private readonly delegated = new Set<DelegatedConsumerType>();
+  /** Stops following the animator's moving elements (iOS WebKit only). */
+  private stopWatchingMovers: (() => void) | null = null;
+  /** Whether the document carries the blocking touchmove for a mover. */
+  private stopBlockingForMovers: (() => void) | null = null;
+  /** Elements whose caller touch-action waits for a read after paint. */
+  private readonly pendingCallerReads = new Set<HTMLElement>();
+  private isCallerReadScheduled = false;
+  /** Cancels the scheduled next-frame read (readCallerTouchActionInNextFrame). */
+  private cancelCallerRead: (() => void) | null = null;
+  /** The selection lock each contact holds, by host contact id. */
+  private readonly lockedBy = new Map<number, () => void>();
+  private readonly presentedHitTesting: 'auto' | 'always' | 'never';
+  /**
+   * Contacts sent to what is drawn instead of what the engine hit, by host
+   * contact id, with where they landed (for their click).
+   */
+  private readonly retargeted = new Map<
+    number,
+    {x: number; y: number; target: EventTarget}
+  >();
   /** Touch.identifier → arena id, for live fingers. */
   private readonly touchIds = new Map<number, number>();
+  /**
+   * Fingers cancelled because the app lost focus, kept until the browser
+   * ends them: a browser that keeps such a touch alive must not let its
+   * lift click (`spec:AST-094` FR28: nothing acts).
+   */
+  private readonly cancelledFingers = new Set<number>();
   /** Touch.identifier → the element the finger landed on. */
   private readonly touchTargets = new Map<number, EventTarget>();
   /**
@@ -335,17 +443,21 @@ export class GestureHost {
    */
   private readonly watched = new Map<
     EventTarget,
-    {count: number; blocking: number}
+    {count: number; blocking: number; claiming: number}
   >();
   /** Fingers whose target listener is the blocking one. */
   private readonly blockingFingers = new Set<number>();
+  /**
+   * Fingers a participant could claim (a recognizer that claims touches, or
+   * a press consumer): only their target's `touchend` may need cancelling,
+   * so a touch only watchers follow gets a passive one (`spec:AST-094`
+   * FR20).
+   */
+  private readonly claimingFingers = new Set<number>();
   /** Touch events already handled (the document's and the target's listeners both see one). */
   private readonly processed = new WeakSet<Event>();
   /** pointerId → arena id, for live mouse and pen contacts. */
   private readonly pointerIds = new Map<number, number>();
-  /** Elements whose caller touch-action waits for a read after paint. */
-  private readonly pendingCallerReads = new Set<HTMLElement>();
-  private isCallerReadScheduled = false;
   /**
    * The boxes the host watches for screen-edge pans (syncLayoutWatch): each
    * element with an enabled one, and the root for one whose band moves with
@@ -359,63 +471,103 @@ export class GestureHost {
   /**
    * A finger's pointerId → its arena id, once its pointerdown and its
    * touchstart are paired. Chromium sends no `touchmove` until a finger has
-   * travelled its slop (about 16 px), but sends every `pointermove`, so the
-   * finger's movement comes from both channels; and its `pointercancel` is
-   * the browser's claim of exactly that finger.
+   * travelled its slop (about 16 px), but sends every `pointermove`, so a
+   * paired finger is sampled from its pointer events (`pointerFed`); and its
+   * `pointercancel` is the browser's claim of exactly that finger.
    */
   private readonly fingerPointers = new Map<number, number>();
   /** Finger pointerdowns still waiting for their touchstart. */
   private readonly pendingPointers = new Map<number, PlacedContact>();
   /**
-   * Under `inputMode: 'pointer-events'`, where claimed fingers lifted: the
-   * `touchend` that follows their `pointerup` is cancelled (FR21).
+   * Where fingers come from their pointer events, where claimed fingers
+   * lifted and when: the `touchend` that follows each `pointerup` is
+   * cancelled (FR21). A record no `touchend` consumed expires
+   * (CLAIMED_LIFT_MS).
    */
-  private readonly claimedLifts: PlacedContact[] = [];
+  private readonly claimedLifts: (PlacedContact & {time: number})[] = [];
+  /** The one timer that drops claimed lifts whose `touchend` never came. */
+  private claimedLiftTimer: unknown = null;
+  /** The arena's clock, which the claimed lifts' timer runs on too. */
+  private readonly clock: GestureClock;
   /** Fingers still waiting for their pointerdown, by arena id. */
   private readonly unpairedTouches = new Map<number, PlacedContact>();
-  /** The elements each held contact turned selection off on. */
-  private readonly heldSelectionBy = new Map<number, HTMLElement[]>();
   private readonly isPrimaryPointerCoarse: () => boolean;
-  private readonly coarseQuery: MediaQueryList | null;
-  private isWatchingPointer = false;
-  private readonly onPointerKindChange = (): void => this.refreshAll();
-  /** The last position fed per contact, so one channel's echo is dropped. */
+  /** Whether the host follows `(pointer: coarse)` (no read was passed). */
+  private readonly followsPointer: boolean;
+  /** The last sample fed per contact: a contact's time never runs back. */
   private readonly lastFed = new Map<number, TouchSample>();
+  /**
+   * Fingers whose samples come from their pointer events. A finger the
+   * browser reports on both channels is sampled from ONE: the pointer
+   * channel, where its pointerdown paired with its touchstart; touch events
+   * sample only a finger no pointer event reported (no Pointer Events). The
+   * other channel keeps its control duties (cancelling, claiming, the
+   * browser's takeover) but never feeds a sample, so the two copies of one
+   * move cannot both reach a velocity, however far apart they arrive.
+   */
+  private readonly pointerFed = new Set<number>();
   /** When a finger was last down or lifted, and where it landed. */
   private lastTouch: {readonly target: Node; readonly time: number} | null =
     null;
   /** Scrollers a recognizer is scrolling itself this frame (ownScroll). */
-  private readonly ownedScrolls = new Set<Node>();
+  private readonly ownedScrolls = new Map<Node, number>();
+  /** Numbers each ownScroll call: only the newest one's timer clears it. */
+  private ownScrollCalls = 0;
+  /** Cancels each scroller's pending ownScroll frames. */
+  private readonly ownScrollFrames = new Map<Node, () => void>();
   /** The last scroll a finger drove, and when. */
   private lastScroll: {readonly scroller: Node; readonly time: number} | null =
     null;
+  /** Predicates that hold a touch's target away from every participant. */
+  private readonly touchGates = new Set<(target: Node) => boolean>();
+  /** Who keeps the listeners installed without a registration (retain). */
+  private retainers = 0;
+  /** Told after every touch event that changed the fingers on the screen. */
+  private readonly fingerListeners = new Set<() => void>();
+  /**
+   * Where each finger now on the screen landed, from the last touch event's
+   * `touches` (every finger, whether or not a recognizer tracks it).
+   */
+  private fingerTargets: ReadonlyArray<Node> = [];
   private nextId = 1;
   private isInstalled = false;
-  private readonly inputMode: 'auto' | 'pointer-events';
-  private usesTouchEvents = true;
-  private swallowDeadline = Number.NEGATIVE_INFINITY;
   /**
-   * Where the primary pointer is fine: what listens for a press itself (the
-   * elements that use a gesture, and the document for delegated consumers),
-   * with its removal; whether a press one armed is held, the page's
-   * listeners lasting that long; and the pending removal of the click
-   * listener a released press kept (FR21, FR24).
+   * Whether the primary pointer is coarse (`spec:AST-094` FR19), read when
+   * something first attaches and kept current while anything is attached.
+   */
+  private isCoarse = false;
+  private stopWatchingPointer: (() => void) | null = null;
+  /** The input stream subscriptions while installed. */
+  private unsubscribers: (() => void)[] = [];
+  /**
+   * Where the primary pointer is fine, each element that uses a gesture
+   * listens for a press itself; the page's listeners last that press (FR24).
    */
-  private readonly armed = new Map<EventTarget, () => void>();
+  private readonly armedElements = new Map<Element, () => void>();
   private isArmedPress = false;
-  private clickRemoval: ReturnType<typeof setTimeout> | null = null;
+  /**
+   * Whether the installed listeners include the cancelable ones (the
+   * document's touchend, contextmenu and the window's click): only while a
+   * participant that can claim is attached (`spec:AST-094` FR20).
+   */
+  private isClaimingInstalled = false;
+  /** The input stream subscriptions syncClaimingListeners keeps. */
+  private claimingUnsubscribers: (() => void)[] = [];
+  private readonly inputMode: 'auto' | 'pointer-events';
+  private usesTouchEvents = true;
 
   constructor(doc: Document, options: GestureHostOptions = {}) {
     this.doc = doc;
     this.inputMode = options.inputMode ?? 'auto';
+    this.presentedHitTesting = options.presentedHitTesting ?? 'auto';
     const environment: GestureEnvironment = {
       viewportSize: () => ({
         width: doc.defaultView?.innerWidth ?? 0,
         height: doc.defaultView?.innerHeight ?? 0,
       }),
+      // The writing direction through core's one helper.
       isRtl: view =>
-        view instanceof Element &&
-        doc.defaultView?.getComputedStyle(view).direction === 'rtl',
+        view instanceof Element && isRtlElement(view as HTMLElement),
       // A screen-edge pan tells a view within its edge band from any other
       // by its box (spec:AST-094 FR18).
       viewRect: view => {
@@ -426,29 +578,22 @@ export class GestureHost {
         return {left, top, width, height};
       },
     };
+    this.clock = options.clock ?? browserClock;
     this.arena = new GestureArena({
-      clock: options.clock ?? browserClock,
+      clock: this.clock,
       environment,
       onDeferredClick: (touch, allowed) => this.replayClick(touch, allowed),
+      // A press whose decision waited on a timer (a tap waiting on a double
+      // tap) ends here: an armed press stops listening (FR24).
+      onIdle: () => this.releaseArmedPress(),
       onTransition: options.onTransition,
     });
     const view = doc.defaultView;
-    const coarseQuery =
-      options.isPrimaryPointerCoarse == null &&
-      typeof view?.matchMedia === 'function'
-        ? view.matchMedia('(pointer: coarse)')
-        : null;
+    // A test may pass its own read; otherwise the one coarse-pointer gate,
+    // followed as it changes.
+    this.followsPointer = options.isPrimaryPointerCoarse == null;
     this.isPrimaryPointerCoarse =
-      options.isPrimaryPointerCoarse ?? (() => coarseQuery?.matches ?? false);
-    this.coarseQuery = coarseQuery;
-  }
-
-  /** Re-derive every element's styles and the host's listeners. */
-  private refreshAll(): void {
-    for (const [element, registration] of this.registry) {
-      this.refresh(element, registration);
-    }
-    this.syncListeners();
+      options.isPrimaryPointerCoarse ?? (() => isCoarsePointer(view));
   }
 
   // --- Attachment ------------------------------------------------------------
@@ -461,7 +606,12 @@ export class GestureHost {
   ): () => void {
     const registration = this.registrationFor(element);
     registration.manageStyle = options.manageStyle ?? registration.manageStyle;
-    registration.actionGroup = options.actionGroup ?? registration.actionGroup;
+    // An action group while any attachment asks, whatever their order.
+    const asksForGroup = options.actionGroup === true;
+    if (asksForGroup) {
+      registration.actionGroupAsks += 1;
+      registration.actionGroup = true;
+    }
     recognizer.view = element;
     registration.recognizers.push(recognizer);
     recognizer.onEnabledChange = () => {
@@ -482,6 +632,10 @@ export class GestureHost {
     this.syncListeners();
     return () => {
       recognizer.onEnabledChange = null;
+      if (asksForGroup) {
+        registration.actionGroupAsks -= 1;
+        registration.actionGroup = registration.actionGroupAsks > 0;
+      }
       if (edgePan != null) {
         edgePan.onTouchBehaviorChange = null;
       }
@@ -570,14 +724,22 @@ export class GestureHost {
   };
 
   /** Attach the view-level touch consumer of an element (a pressable control). */
-  attachConsumer(element: Element, consumer: TouchConsumer): () => void {
+  attachConsumer(
+    element: Element,
+    consumer: TouchConsumer,
+    _options: Pick<AttachOptions, 'perEventPointer'> = {},
+  ): () => void {
     const registration = this.registrationFor(element);
     registration.consumer = consumer;
+    this.refresh(element, registration);
     this.syncListeners();
     return () => {
       if (registration.consumer === consumer) {
         registration.consumer = null;
       }
+      // A keepsTouch consumer's blocking touchmove goes with it, even while
+      // the element keeps its recognizers.
+      this.refresh(element, registration);
       // Even when the element keeps a recognizer: one left disabled keeps
       // no listener or observer (FR24).
       this.syncListeners();
@@ -586,23 +748,217 @@ export class GestureHost {
   }
 
   /**
-   * Find consumers of a kind by attribute, one instance per contact. Returns
-   * the function that stops it.
+   * @internal The document this host serves.
    */
-  addDelegatedConsumer(type: DelegatedConsumerType): () => void {
-    this.delegated.add(type);
-    this.syncListeners();
-    return () => {
-      this.delegated.delete(type);
-      this.syncListeners();
+  get document(): Document {
+    return this.doc;
+  }
+
+  /**
+   * @internal Whether a recognizer owns the touch with this Touch Events
+   * `identifier`, so the browser must not pan it (pageHold.ts asks).
+   */
+  isTouchClaimed(identifier: number): boolean {
+    const id = this.touchIds.get(identifier);
+    return id != null && this.arena.isClaimed(id);
+  }
+
+  /**
+   * An element's box where it is drawn: the box the engine reports, moved
+   * by the compositor animations of it and its ancestors on engines that
+   * report and hit-test those where they started (iOS WebKit). Elsewhere
+   * `getBoundingClientRect` already reports the drawn box. Press trackers
+   * read their bounds through it.
+   */
+  presentedRect(element: Element): PressBounds {
+    const box = element.getBoundingClientRect();
+    if (!this.hitTestsLayout()) {
+      return box;
+    }
+    const {x, y} = presentedOffsetOf(element);
+    if (x === 0 && y === 0) {
+      return box;
+    }
+    return {
+      left: box.left + x,
+      top: box.top + y,
+      right: box.right + x,
+      bottom: box.bottom + y,
     };
   }
 
+  /** Whether this engine hit-tests a compositor-moved element at layout. */
+  private hitTestsLayout(): boolean {
+    return (
+      this.presentedHitTesting === 'always' ||
+      (this.presentedHitTesting === 'auto' && isIosWebKit(this.doc.defaultView))
+    );
+  }
+
+  /**
+   * Where a contact lands among what is drawn. iOS WebKit hit-tests an
+   * element that a compositor animation moves where the animation started:
+   * a finger on a settling sheet lands on whatever sat under the sheet's
+   * start (the scrim, which closes it), and a finger where the sheet was
+   * lands on the sheet. UIKit keeps an interruptible animation hit-testable
+   * where it is drawn (UIViewPropertyAnimator). The touch goes to what was
+   * drawn under the finger when it landed (`time`, its event's timestamp),
+   * even when a busy main thread hands it over later, and content that slid
+   * under the finger since takes nothing (`spec:AST-094` FR11).
+   */
+  private presentedTarget(
+    native: EventTarget | null,
+    x: number,
+    y: number,
+    time: number,
+  ): EventTarget | null {
+    if (!this.hitTestsLayout()) {
+      return native;
+    }
+    const movers = presentedElements().filter(element => {
+      if (!element.isConnected || element.ownerDocument !== this.doc) {
+        return false;
+      }
+      const {x: dx, y: dy} = presentedOffsetOf(element);
+      return Math.abs(dx) >= 0.5 || Math.abs(dy) >= 0.5;
+    });
+    if (movers.length === 0) {
+      return native;
+    }
+    // One style write per mover makes the engine hit-test it where it is
+    // drawn now; the hit test below flushes them. The engine then gets
+    // z-order, pointer-events and clipping right, which no box math would.
+    resolvePresented(movers);
+    let hit = this.drawnAt(x, y);
+    // A mover kept going while the touch waited for the main thread: what
+    // was under the finger when it landed is now that far along. A timestamp
+    // on another clock, or older than a second, is not corrected.
+    const age = (this.doc.defaultView?.performance.now() ?? time) - time;
+    if (age > 0 && age < 1000) {
+      const movedSince = (mover: Element) => {
+        const then = presentedOffsetOf(mover, time);
+        return Math.abs(then.x) >= 0.5 || Math.abs(then.y) >= 0.5 ? then : null;
+      };
+      const now = hit;
+      const under =
+        now == null
+          ? undefined
+          : movers.find(mover => containsAlongFlatTree(mover, now));
+      let landedOnMover = false;
+      for (const mover of movers) {
+        const then = movedSince(mover);
+        if (then == null) {
+          continue;
+        }
+        const landed = this.drawnAt(x - then.x, y - then.y);
+        if (landed != null && containsAlongFlatTree(mover, landed)) {
+          hit = landed;
+          landedOnMover = true;
+          break;
+        }
+      }
+      // Content that slid under the finger after it landed takes nothing:
+      // the touch goes to what was there, beneath it.
+      if (!landedOnMover && under != null && movedSince(under) != null) {
+        hit = this.drawnBeneath(x, y, movers);
+      }
+    }
+    if (hit == null || hit === native) {
+      return native;
+    }
+    const found = hit;
+    const node = native instanceof Node ? native : null;
+    const isAboutMover = movers.some(
+      mover =>
+        containsAlongFlatTree(mover, found) ||
+        (node != null && containsAlongFlatTree(mover, node)),
+    );
+    return isAboutMover ? found : native;
+  }
+
+  /** What is drawn at a point beneath every mover. */
+  private drawnBeneath(
+    x: number,
+    y: number,
+    movers: ReadonlyArray<Element>,
+  ): Element | null {
+    if (typeof this.doc.elementsFromPoint !== 'function') {
+      return null;
+    }
+    return (
+      this.doc
+        .elementsFromPoint(x, y)
+        .find(
+          element =>
+            !movers.some(mover => containsAlongFlatTree(mover, element)),
+        ) ?? null
+    );
+  }
+
+  /** What is drawn at a point, inside open shadow roots too. */
+  private drawnAt(x: number, y: number): Element | null {
+    let hit = this.doc.elementFromPoint(x, y);
+    // The document answers a shadow host for anything inside its open root:
+    // descend to what is drawn there.
+    while (hit?.shadowRoot != null) {
+      const inner = hit.shadowRoot.elementFromPoint(x, y);
+      if (inner == null || inner === hit) {
+        break;
+      }
+      hit = inner;
+    }
+    return hit;
+  }
+
+  /** The browser took these touches (a scroll): no click of ours for them. */
+  private browserTook(ids: ReadonlyArray<number>, time: number): void {
+    for (const id of ids) {
+      this.retargeted.delete(id);
+    }
+    this.arena.browserTookOver(ids, time);
+  }
+
+  /**
+   * The click a retargeted tap earned, on what was drawn under the finger.
+   * The engine's own click would hit the start position, so the caller
+   * cancels it (or the click guard drops it, a late one included) and this one
+   * is the tap's single activation.
+   */
+  private clickRetargeted(target: EventTarget, x: number, y: number): void {
+    const view = this.doc.defaultView;
+    if (!(target instanceof Element) || !target.isConnected || view == null) {
+      return;
+    }
+    armClickGuard(this.doc);
+    if (
+      target instanceof view.HTMLElement &&
+      target.matches('input, textarea, select, [contenteditable]')
+    ) {
+      target.focus();
+    }
+    withoutClickGuard(() =>
+      target.dispatchEvent(
+        new view.MouseEvent('click', {
+          bubbles: true,
+          cancelable: true,
+          composed: true,
+          detail: 1,
+          clientX: x,
+          clientY: y,
+        }),
+      ),
+    );
+  }
+
   /**
    * Re-derive an element's styles and the host's listeners after its
    * recognizers' options or its consumer's enabled state changed.
    */
   update(element: Element): void {
+    if (!this.followsPointer) {
+      // A read passed in (a test's) is not followed: an update reads it again.
+      this.isCoarse = this.isPrimaryPointerCoarse();
+    }
     const registration = this.registry.get(element);
     if (registration != null) {
       this.refresh(element, registration);
@@ -639,77 +995,165 @@ export class GestureHost {
    */
   isScrollBraking(
     node: Node,
-    window: number = UIKIT_GESTURES.press.scrollBrake.value,
+    window: number = UIKIT_PRESS.scrollBrake.value,
   ): boolean {
     const last = this.lastScroll;
     return (
       last != null &&
       this.arena.now() - last.time < window &&
-      last.scroller.contains(node)
+      containsAlongFlatTree(last.scroller, node)
+    );
+  }
+
+  /**
+   * @internal Keep the host's listeners installed until the returned
+   * function runs, with no recognizer attached (fingerScroll.ts reads the
+   * finger record meanwhile).
+   */
+  retain(): () => void {
+    this.retainers += 1;
+    // A watch is not an attach: no warning where the pointer is fine.
+    this.watchPointer();
+    this.syncListeners();
+    let isRetained = true;
+    return () => {
+      if (!isRetained) {
+        return;
+      }
+      isRetained = false;
+      this.retainers -= 1;
+      this.uninstallIfIdle();
+    };
+  }
+
+  /**
+   * @internal Call `listener` after each touch event the host hears, once
+   * the finger record is up to date. Returns the unsubscribe.
+   */
+  onFingersChange(listener: () => void): () => void {
+    this.fingerListeners.add(listener);
+    return () => {
+      this.fingerListeners.delete(listener);
+    };
+  }
+
+  /** @internal Whether a finger that landed inside `node` is down now. */
+  isFingerDownIn(node: Node): boolean {
+    // Along the flat tree: a finger on content inside an open shadow root is
+    // in the scroller around that root.
+    return this.fingerTargets.some(target =>
+      containsAlongFlatTree(node, target),
     );
   }
 
   private registrationFor(element: Element): Registration {
+    this.watchPointer();
     let registration = this.registry.get(element);
     if (registration == null) {
       registration = {
         recognizers: [],
         consumer: null,
-        touchMoveListener: null,
-        touchEndListener: null,
+        hasTouchEndListener: false,
+        hasTouchMoveListener: false,
         savedStyle: new Map(),
         authorTouchAction: null,
         manageStyle: true,
         actionGroup: false,
+        actionGroupAsks: 0,
       };
       this.registry.set(element, registration);
     }
     return registration;
   }
 
+  /** Whether anything attached could take input. */
+  private needsInput(): boolean {
+    return this.registry.size > 0 || this.retainers > 0;
+  }
+
   private refresh(element: Element, registration: Registration): void {
     if (registration.manageStyle && element instanceof HTMLElement) {
       this.applyStyle(element, registration);
     }
-    // For every pointer (FR43): a finger's claim cancels its moves here
-    // (FR19), a listener FR24 counts apart from the one an element keeps for
-    // its press.
-    const needsListener = registration.recognizers.some(
-      r => r.isEnabled && claimsWhileMoving(r),
-    );
-    if (needsListener && registration.touchMoveListener == null) {
-      const listener: EventListener = event =>
-        this.cancelIfClaimed(event as TouchEvent);
-      registration.touchMoveListener = listener;
-      element.addEventListener('touchmove', listener, {passive: false});
-    } else if (!needsListener && registration.touchMoveListener != null) {
-      element.removeEventListener('touchmove', registration.touchMoveListener);
-      registration.touchMoveListener = null;
-    }
-    // Pointer Events only: a claimed finger's touchend is not the host's
-    // own document listener's to cancel, so the element cancels it.
+    this.syncTouchMoveListener(element, registration);
+  }
+
+  /**
+   * The element's blocking `touchmove`. For every pointer a claiming
+   * recognizer keeps it: a finger's claim cancels its moves here (FR19), a
+   * listener FR24 counts outside the one-listener budget a fine pointer's
+   * element keeps for its press (syncArmed). A kept press needs it only
+   * while a press is held: a phone's before every touch (Safari honours a
+   * blocking listener only when registered before the touch began), a fine
+   * pointer's only during an armed press, whose `pointerdown` comes before
+   * the touch it brings (FR24).
+   */
+  private syncTouchMoveListener(
+    element: Element,
+    registration: Registration,
+  ): void {
+    // Where fingers come from their pointer events (Pointer Events input, or
+    // a window with no ontouchstart), a claimed finger's touchend is not the
+    // host's own document listener's to cancel, so the element cancels it
+    // (FR21). Under a coarse pointer always: touch emulation turned on after
+    // load hides ontouchstart yet sends touches. Under a fine one wherever
+    // the browser sends Touch Events, as a touchscreen laptop does (FR43);
+    // elsewhere no touchend ever comes, and the element keeps no listener
+    // (FR24).
     const needsEndListener =
-      this.inputMode === 'pointer-events' &&
-      registration.recognizers.some(r => r.isEnabled && r.acceptsTouchInput);
-    if (needsEndListener && registration.touchEndListener == null) {
-      const listener: EventListener = event =>
-        this.cancelClaimedLift(event as TouchEvent);
-      registration.touchEndListener = listener;
-      element.addEventListener('touchend', listener, {passive: false});
-    } else if (!needsEndListener && registration.touchEndListener != null) {
-      element.removeEventListener('touchend', registration.touchEndListener);
-      registration.touchEndListener = null;
+      this.readsFingersFromPointerEvents() &&
+      (this.isCoarse || this.sendsTouchEvents()) &&
+      registration.recognizers.some(
+        recognizer =>
+          recognizer.isEnabled && internals(recognizer).acceptsTouchInput,
+      );
+    if (needsEndListener && !registration.hasTouchEndListener) {
+      element.addEventListener('touchend', this.onClaimedTouchEnd, {
+        passive: false,
+      });
+      registration.hasTouchEndListener = true;
+    } else if (!needsEndListener && registration.hasTouchEndListener) {
+      element.removeEventListener('touchend', this.onClaimedTouchEnd);
+      registration.hasTouchEndListener = false;
+    }
+    const needsListener =
+      registration.recognizers.some(
+        recognizer => recognizer.isEnabled && claimsWhileMoving(recognizer),
+      ) ||
+      (registration.consumer?.keepsTouch != null &&
+        registration.consumer.isEnabled?.() !== false &&
+        (this.isCoarse || this.isArmedPress));
+    // The blocking listener sits on the element itself (FR19: a scroll that
+    // starts elsewhere never waits on it), but every element shares the
+    // host's one handler, which routes through the arena.
+    if (needsListener && !registration.hasTouchMoveListener) {
+      element.addEventListener('touchmove', this.onBlockingTouchMove, {
+        passive: false,
+      });
+      registration.hasTouchMoveListener = true;
+    } else if (!needsListener && registration.hasTouchMoveListener) {
+      element.removeEventListener('touchmove', this.onBlockingTouchMove);
+      registration.hasTouchMoveListener = false;
     }
   }
 
   private applyStyle(element: HTMLElement, registration: Registration): void {
-    // Where no attached recognizer is enabled the host manages no style: the
-    // element keeps its own touch-action, and any value set before is
-    // restored (FR24). Every pointer gets it: a touchscreen laptop's finger
-    // as a phone's (spec:AST-094 FR43).
-    const enabled = registration.recognizers.filter(r => r.isEnabled);
-    const style: GestureHostStyle =
-      enabled.length > 0 ? gestureHostStyle(enabled) : {};
+    // A disabled recognizer leaves the browser everything (FR24).
+    // Every pointer gets it: a touchscreen laptop's finger as a phone's (FR43).
+    const active = registration.recognizers.filter(
+      recognizer => recognizer.isEnabled,
+    );
+    let style: GestureHostStyle =
+      active.length > 0 ? gestureHostStyle(active) : {};
+    // A control that keeps its touch (a stepper's hold-repeat) takes taps in
+    // quick succession: the browser's double-tap zoom goes, as for a tap
+    // recognizer (`spec:AST-094` FR18), for every pointer (FR43).
+    if (
+      style.touchAction == null &&
+      registration.consumer?.keepsTouch != null
+    ) {
+      style = {...style, touchAction: 'manipulation'};
+    }
     for (const key of Object.keys(
       STYLE_PROPERTIES,
     ) as (keyof GestureHostStyle)[]) {
@@ -804,8 +1248,9 @@ export class GestureHost {
       return;
     }
     this.isCallerReadScheduled = true;
-    inNextFrame(this.doc.defaultView, () => {
+    this.cancelCallerRead = inNextFrame(this.doc.defaultView, () => {
       this.isCallerReadScheduled = false;
+      this.cancelCallerRead = null;
       const pending: [HTMLElement, Registration][] = [];
       for (const candidate of this.pendingCallerReads) {
         const registration = this.registry.get(candidate);
@@ -834,60 +1279,99 @@ export class GestureHost {
 
   private cleanup(element: Element, registration: Registration): void {
     if (registration.recognizers.length > 0 || registration.consumer != null) {
+      // What stays may take nothing (only disabled recognizers): FR24.
+      this.syncListeners();
       return;
     }
-    if (registration.touchMoveListener != null) {
-      element.removeEventListener('touchmove', registration.touchMoveListener);
+    if (registration.hasTouchEndListener) {
+      element.removeEventListener('touchend', this.onClaimedTouchEnd);
+      registration.hasTouchEndListener = false;
     }
-    if (registration.touchEndListener != null) {
-      element.removeEventListener('touchend', registration.touchEndListener);
-      registration.touchEndListener = null;
+    if (registration.hasTouchMoveListener) {
+      element.removeEventListener('touchmove', this.onBlockingTouchMove);
     }
     this.registry.delete(element);
-    this.syncListeners();
+    this.uninstallIfIdle();
   }
 
   /**
    * Listen only while something could take a touch now (`spec:AST-094`
-   * FR24, FR43): where the primary pointer is coarse, while an enabled
-   * recognizer or consumer, or a delegated consumer, is attached; where it is
-   * fine, only during a press something armed (syncArmed). Otherwise no page
-   * listener is registered, so an idle page and a disabled control pay
-   * nothing.
+   * FR24, FR43): where the primary pointer is coarse, an enabled recognizer
+   * or consumer, or a finger-scroll watch; where it is fine, only during a
+   * press an element armed (syncArmed). Otherwise no document listener is
+   * registered, so an idle page and a disabled control pay nothing.
    */
   private syncListeners(): void {
     this.syncLayoutWatch();
-    // The primary pointer can change (a tablet's keyboard attached or
-    // removed): while anything is attached, styles and listeners follow it.
-    // Nothing touch-related stays once the last attachment goes (FR24).
-    const hasAttachments = this.registry.size > 0 || this.delegated.size > 0;
-    if (hasAttachments && !this.isWatchingPointer) {
-      this.coarseQuery?.addEventListener?.('change', this.onPointerKindChange);
-      this.isWatchingPointer = true;
-    } else if (!hasAttachments && this.isWatchingPointer) {
-      this.coarseQuery?.removeEventListener?.(
-        'change',
-        this.onPointerKindChange,
-      );
-      this.isWatchingPointer = false;
-    }
     this.syncArmed();
     if (this.shouldListen()) {
       this.install();
-    } else if (this.isInstalled) {
+      this.syncClaimingListeners();
+    } else {
       this.uninstall();
     }
+    this.syncMoverBlocking();
   }
 
-  private shouldListen(): boolean {
-    if (!this.isPrimaryPointerCoarse()) {
-      return this.isArmedPress;
+  /**
+   * Safari honours a blocking `touchmove` only where it was registered before
+   * the touch began, on the engine's own target, and on iOS WebKit a finger
+   * on an element a compositor animation moves lands, for the engine, on
+   * whatever sits under the motion's start (see presentedTarget). So while an
+   * element a recognizer that claims moving touches lives in (or around) is
+   * moving, the blocking listener subscribes to the window's capturing
+   * `touchmove` through the shared input stream with `{cancels: true}`,
+   * which sees every touch on the page whatever the engine targets and makes
+   * that one listener non-passive (`spec:AST-094` FR19;
+   * architecture:react-component-runtime INV13). It leaves when the motion
+   * ends: only while it is subscribed does a scroll starting anywhere wait on
+   * the main thread.
+   */
+  private syncMoverBlocking(): void {
+    const isWatching = this.isInstalled && this.hitTestsLayout();
+    if (isWatching && this.stopWatchingMovers == null) {
+      this.stopWatchingMovers = watchPresentedElements(() =>
+        this.syncMoverBlocking(),
+      );
+    } else if (!isWatching && this.stopWatchingMovers != null) {
+      this.stopWatchingMovers();
+      this.stopWatchingMovers = null;
+    }
+    const needed =
+      isWatching &&
+      presentedElements().some(mover =>
+        this.hasClaimingRecognizerAround(mover),
+      );
+    if (needed === (this.stopBlockingForMovers != null)) {
+      return;
     }
-    if (this.delegated.size > 0) {
-      return true;
+    const view = this.doc.defaultView;
+    if (needed && view != null) {
+      this.stopBlockingForMovers = subscribeInput(
+        view,
+        'touchmove',
+        this.onBlockingTouchMove,
+        {cancels: true},
+      );
+    } else if (!needed) {
+      this.stopBlockingForMovers?.();
+      this.stopBlockingForMovers = null;
     }
-    for (const registration of this.registry.values()) {
-      if (isServed(registration)) {
+  }
+
+  /** Whether a recognizer that claims moving touches lives in or around `mover`. */
+  private hasClaimingRecognizerAround(mover: Element): boolean {
+    if (!mover.isConnected || mover.ownerDocument !== this.doc) {
+      return false;
+    }
+    for (const [element, registration] of this.registry) {
+      if (
+        (containsAlongFlatTree(mover, element) ||
+          containsAlongFlatTree(element, mover)) &&
+        registration.recognizers.some(
+          recognizer => recognizer.isEnabled && claimsWhileMoving(recognizer),
+        )
+      ) {
         return true;
       }
     }
@@ -897,56 +1381,56 @@ export class GestureHost {
   /**
    * Where the primary pointer is fine, each element with an enabled
    * recognizer or press consumer listens for a press itself: one passive
-   * `pointerdown` listener, in the capture phase, so the outermost one hears
-   * a press first and serves every recognizer on its path. Delegated
-   * consumer types, which have no element, arm the document once. A press
-   * installs the host's page listeners for as long as its contacts last
-   * (`spec:AST-094` FR24, FR43). Where the primary pointer is coarse the
-   * page's listeners serve every press, and nothing is armed.
+   * `pointerdown` listener on the element. The host's page listeners come at
+   * that press and go once its contacts end and the arena drops their last
+   * record (onIdle: a decision that waited on a timer), so an idle page has none
+   * (`spec:AST-094` FR24, FR43). A finger on a touchscreen whose primary
+   * pointer is fine sends its `pointerdown` before its `touchstart`, so the
+   * host hears both.
    */
   private syncArmed(): void {
-    const wanted = new Set<EventTarget>();
-    if (!this.isPrimaryPointerCoarse()) {
+    const wanted = new Set<Element>();
+    if (!this.isCoarse) {
       for (const [element, registration] of this.registry) {
-        if (isServed(registration)) {
+        const consumer = registration.consumer;
+        if (
+          registration.recognizers.some(recognizer => recognizer.isEnabled) ||
+          (consumer != null && consumer.isEnabled?.() !== false)
+        ) {
           wanted.add(element);
         }
       }
-      if (this.delegated.size > 0) {
-        wanted.add(this.doc);
-      }
     }
-    for (const [target, disarm] of [...this.armed]) {
-      if (!wanted.has(target)) {
-        disarm();
-        this.armed.delete(target);
+    for (const [element, release] of this.armedElements) {
+      if (!wanted.has(element)) {
+        release();
+        this.armedElements.delete(element);
       }
     }
-    for (const target of wanted) {
-      if (this.armed.has(target)) {
+    for (const element of wanted) {
+      if (this.armedElements.has(element)) {
         continue;
       }
-      target.addEventListener(
+      element.addEventListener(
         'pointerdown',
         this.onArmedPress,
         PASSIVE_CAPTURE,
       );
-      this.armed.set(target, () => {
-        target.removeEventListener(
+      this.armedElements.set(element, () => {
+        element.removeEventListener(
           'pointerdown',
           this.onArmedPress,
           PASSIVE_CAPTURE,
         );
       });
     }
+    if (wanted.size === 0 && this.isArmedPress) {
+      this.isArmedPress = false;
+      this.syncKeptPresses();
+    }
   }
 
-  /**
-   * A press on something armed, where the primary pointer is fine: a
-   * mouse's primary button, a pen, or a finger. The page's listeners come
-   * for this press, and the press goes on to them, its capture phase on the
-   * page being over.
-   */
+  /** A press on an armed element, a mouse's primary button, a pen or a finger: listen for this press. */
   private readonly onArmedPress = (event: Event): void => {
     const press = event as PointerEvent;
     if (
@@ -957,95 +1441,250 @@ export class GestureHost {
       return;
     }
     this.isArmedPress = true;
+    this.syncKeptPresses();
     this.install();
+    // A finger's or a pen's press brings the cancelable touchend and the
+    // contextmenu canceller, as wherever the host installs, so a claimed
+    // lift clicks nothing and a claimed hold opens no browser menu (FR21). A
+    // mouse's press needs neither.
+    if (press.pointerType !== 'mouse') {
+      this.syncClaimingListeners();
+    }
+    // The window's capture phase is over for this event: hand it on.
     this.onPointerDown(press);
-    // A mouse's or a pen's press that nothing took has nothing to wait for;
-    // a finger's contact begins at its touchstart, which comes next.
-    if (press.pointerType !== 'touch') {
-      this.releaseArmedPress();
-    }
   };
 
-  /**
-   * After a contact ends: once no contact of the press that armed the page's
-   * listeners is down, they go (FR24). A recognizer still deciding after the
-   * lift needs no input; the click it may owe keeps its listener
-   * (releaseClickListener).
-   */
+  /** A kept press's blocking `touchmove` follows the armed press (syncTouchMoveListener). */
+  private syncKeptPresses(): void {
+    for (const [element, registration] of this.registry) {
+      if (registration.consumer?.keepsTouch != null) {
+        this.syncTouchMoveListener(element, registration);
+      }
+    }
+  }
+
+  /** After a contact ends: an armed press that is over stops listening. */
   private releaseArmedPress(): void {
-    if (
-      this.isArmedPress &&
-      !this.arena.touches.some(
-        touch => touch.phase !== 'ended' && touch.phase !== 'cancelled',
-      )
-    ) {
-      this.isArmedPress = false;
-      this.syncListeners();
+    if (!this.isArmedPress) {
+      return;
+    }
+    queueMicrotask(() => {
+      if (this.isArmedPress && this.arena.touches.length === 0) {
+        this.isArmedPress = false;
+        this.syncKeptPresses();
+        this.syncListeners();
+      }
+    });
+  }
+
+  /** With nothing attached, stop listening and stop following the pointer. */
+  private uninstallIfIdle(): void {
+    this.syncListeners();
+    if (this.registry.size === 0 && this.retainers === 0) {
+      this.uninstall();
+      this.stopWatchingPointer?.();
+      this.stopWatchingPointer = null;
+      this.releaseWhenIdle();
     }
   }
 
   /**
-   * The click listener outlives the page's others while the swallower is
-   * armed: a claimed lift's click comes after its pointerup or touchend
-   * (`spec:AST-094` FR21; FR24 counts it as press work). It goes when that
-   * window closes, unless the host listens again by then.
+   * In the microtask after the last detach, unless something attached again
+   * in the same task (a component that remounts mid-press keeps its notes):
+   * nothing the host holds outlives it, no note and no pending frame or
+   * timer (`spec:AST-094` FR24).
    */
-  private releaseClickListener(): void {
+  private releaseWhenIdle(): void {
+    queueMicrotask(() => {
+      if (this.registry.size > 0 || this.retainers > 0) {
+        return;
+      }
+      this.cancelledFingers.clear();
+      this.clearClaimedLifts();
+      this.cancelCallerRead?.();
+      this.cancelCallerRead = null;
+      this.isCallerReadScheduled = false;
+      this.pendingCallerReads.clear();
+      for (const cancel of this.ownScrollFrames.values()) {
+        cancel();
+      }
+      this.ownScrollFrames.clear();
+      this.ownedScrolls.clear();
+    });
+  }
+
+  /** Read the primary pointer, and follow it while anything is attached. */
+  private watchPointer(): void {
+    if (this.stopWatchingPointer != null) {
+      return;
+    }
     const view = this.doc.defaultView;
-    if (this.clickRemoval != null) {
-      clearTimeout(this.clickRemoval);
-      this.clickRemoval = null;
+    this.isCoarse = this.isPrimaryPointerCoarse();
+    this.stopWatchingPointer = this.followsPointer
+      ? watchCoarsePointer(view, isCoarse => this.pointerChanged(isCoarse))
+      : () => {};
+  }
+
+  /**
+   * The primary pointer turned coarse or fine (a tablet docking a mouse):
+   * install or remove everything, as if each attach happened now.
+   */
+  private pointerChanged(isCoarse: boolean): void {
+    if (isCoarse === this.isCoarse) {
+      return;
     }
-    const remaining = this.swallowDeadline - browserClock.now();
-    if (view == null || remaining < 0) {
-      view?.removeEventListener('click', this.onClick, ACTIVE_CAPTURE);
+    this.isCoarse = isCoarse;
+    if (!isCoarse) {
+      this.cancelEverything(this.arena.now());
+    }
+    for (const [element, registration] of this.registry) {
+      this.refresh(element, registration);
+    }
+    this.syncListeners();
+  }
+
+  /**
+   * Whether an enabled participant could claim a touch or cancel a lift: a
+   * consumer, or a recognizer that claims touches. With only watchers
+   * attached, the host's listeners are all passive (`spec:AST-094` FR20).
+   */
+  private hasClaimer(): boolean {
+    for (const registration of this.registry.values()) {
+      const consumer = registration.consumer;
+      if (
+        (consumer != null && consumer.isEnabled?.() !== false) ||
+        registration.recognizers.some(
+          recognizer => recognizer.isEnabled && recognizer.claimsTouches,
+        )
+      ) {
+        return true;
+      }
+    }
+    return false;
+  }
+
+  /**
+   * Keeps the touchend cancelable, and the contextmenu subscription on,
+   * only while a claimer is attached; with only watchers the touchend is
+   * passive and the contextmenu is off. Clicks are the click guard's
+   * (utils/clickGuard.ts), whose one listener a window gets only once a
+   * gesture first arms it.
+   */
+  private syncClaimingListeners(): void {
+    if (!this.isInstalled) {
+      return;
+    }
+    const isClaiming = this.hasClaimer();
+    if (isClaiming === this.isClaimingInstalled) {
       return;
     }
-    this.clickRemoval = setTimeout(() => {
-      this.clickRemoval = null;
-      if (!this.isInstalled) {
-        view.removeEventListener('click', this.onClick, ACTIVE_CAPTURE);
+    const view = this.doc.defaultView;
+    for (const unsubscribe of this.claimingUnsubscribers.splice(0)) {
+      unsubscribe();
+    }
+    if (view != null) {
+      if (this.inputMode === 'auto') {
+        this.claimingUnsubscribers.push(
+          subscribeInput(view, 'touchend', this.onTouchEnd, {
+            cancels: isClaiming,
+          }),
+        );
+      }
+      if (isClaiming) {
+        this.claimingUnsubscribers.push(
+          subscribeInput(view, 'contextmenu', this.onContextMenu, {
+            cancels: true,
+          }),
+        );
+      }
+    }
+    this.isClaimingInstalled = isClaiming;
+  }
+
+  private shouldListen(): boolean {
+    if (!this.needsInput()) {
+      return false;
+    }
+    // A retainer (a finger-scroll watch) listens only where the pointer is
+    // coarse: it follows a finger's scroll, which a fine pointer's page
+    // leaves to the browser (FR24).
+    if (this.isCoarse && this.retainers > 0) {
+      return true;
+    }
+    let isUsed = false;
+    for (const registration of this.registry.values()) {
+      const consumer = registration.consumer;
+      if (
+        (consumer != null && consumer.isEnabled?.() !== false) ||
+        registration.recognizers.some(recognizer => recognizer.isEnabled)
+      ) {
+        isUsed = true;
+        break;
       }
-    }, remaining + 1);
+    }
+    // Where the primary pointer is fine, only while a press an element armed
+    // is held (syncArmed, FR24, FR43).
+    return isUsed && (this.isCoarse || this.isArmedPress);
   }
 
   // --- Listeners -------------------------------------------------------------
 
   private install(): void {
-    if (this.isInstalled) {
+    this.watchPointer();
+    if (!this.needsInput()) {
       return;
     }
-    if (this.clickRemoval != null) {
-      clearTimeout(this.clickRemoval);
-      this.clickRemoval = null;
+    if (this.isInstalled) {
+      return;
     }
     const view = this.doc.defaultView;
     this.isInstalled = true;
     this.usesTouchEvents =
       this.inputMode === 'auto' && view != null && 'ontouchstart' in view;
-    const doc = this.doc;
-    // Pointer Events only: a finger comes from its pointer events alone. A
-    // browser that has Touch Events still sends them for the same finger, and
-    // reading both would track it twice (a long press needs one touch).
-    if (this.inputMode === 'auto') {
-      doc.addEventListener('touchstart', this.onTouchStart, PASSIVE_CAPTURE);
-      doc.addEventListener('touchmove', this.onTouchMove, PASSIVE_CAPTURE);
-      doc.addEventListener('touchend', this.onTouchEnd, ACTIVE_CAPTURE);
-      doc.addEventListener('touchcancel', this.onTouchCancel, PASSIVE_CAPTURE);
-    }
-    doc.addEventListener('pointerdown', this.onPointerDown, PASSIVE_CAPTURE);
-    doc.addEventListener('pointermove', this.onPointerMove, PASSIVE_CAPTURE);
-    doc.addEventListener('pointerup', this.onPointerUp, PASSIVE_CAPTURE);
-    doc.addEventListener(
-      'pointercancel',
-      this.onPointerCancel,
-      PASSIVE_CAPTURE,
-    );
-    doc.addEventListener('contextmenu', this.onContextMenu, ACTIVE_CAPTURE);
-    doc.addEventListener('scroll', this.onScroll, PASSIVE_CAPTURE);
-    doc.addEventListener('visibilitychange', this.onVisibilityChange);
-    view?.addEventListener('click', this.onClick, ACTIVE_CAPTURE);
-    view?.addEventListener('blur', this.onBlur);
+    if (view == null) {
+      // A document without a window receives no input.
+      return;
+    }
+    // The window's capture phase, through the shared input stream
+    // (utils/inputStream.ts): ahead of any document listener, so an app's
+    // window-capture stopPropagation, or a document-capture
+    // stopImmediatePropagation registered first, no longer hides a touch
+    // from the recognizers. A recognizer that must claim mid-gesture still
+    // needs the touch to reach its element, where its blocking touchmove
+    // sits. Only the listeners that cancel are non-passive, and only while a
+    // claimer is attached (syncClaimingListeners); none of them is a
+    // touchstart or touchmove, so none of them holds a scroll.
+    this.unsubscribers = [
+      // Pointer Events only: a finger comes from its pointer events alone. A
+      // browser that has Touch Events still sends them for the same finger,
+      // and reading both would track it twice (a long press needs one touch).
+      ...(this.inputMode === 'auto'
+        ? [
+            subscribeInput(view, 'touchstart', this.onTouchStart),
+            subscribeInput(view, 'touchmove', this.onTouchMove),
+            subscribeInput(view, 'touchcancel', this.onTouchCancel),
+          ]
+        : []),
+      subscribeInput(view, 'pointerdown', this.onPointerDown),
+      subscribeInput(view, 'pointermove', this.onPointerMove),
+      subscribeInput(view, 'pointerup', this.onPointerUp),
+      subscribeInput(view, 'pointercancel', this.onPointerCancel),
+      subscribeInput(view, 'scroll', this.onScroll),
+      subscribeInput(view, 'visibilitychange', this.onVisibilityChange),
+      // The window's own blur; an element's blur (a Node's) reaches the
+      // window's capture phase too and means nothing here.
+      subscribeInput(view, 'blur', event => {
+        if (!(event.target instanceof view.Node)) {
+          this.onBlur();
+        }
+      }),
+    ];
+    // Passive until a claimer is attached (syncClaimingListeners).
+    this.isClaimingInstalled = false;
+    this.claimingUnsubscribers =
+      this.inputMode === 'auto'
+        ? [subscribeInput(view, 'touchend', this.onTouchEnd)]
+        : [];
   }
 
   private uninstall(): void {
@@ -1053,26 +1692,20 @@ export class GestureHost {
       return;
     }
     this.isInstalled = false;
-    const doc = this.doc;
-    const view = doc.defaultView;
-    doc.removeEventListener('touchstart', this.onTouchStart, PASSIVE_CAPTURE);
-    doc.removeEventListener('touchmove', this.onTouchMove, PASSIVE_CAPTURE);
-    doc.removeEventListener('touchend', this.onTouchEnd, ACTIVE_CAPTURE);
-    doc.removeEventListener('touchcancel', this.onTouchCancel, PASSIVE_CAPTURE);
-    doc.removeEventListener('pointerdown', this.onPointerDown, PASSIVE_CAPTURE);
-    doc.removeEventListener('pointermove', this.onPointerMove, PASSIVE_CAPTURE);
-    doc.removeEventListener('pointerup', this.onPointerUp, PASSIVE_CAPTURE);
-    doc.removeEventListener(
-      'pointercancel',
-      this.onPointerCancel,
-      PASSIVE_CAPTURE,
-    );
-    doc.removeEventListener('contextmenu', this.onContextMenu, ACTIVE_CAPTURE);
-    doc.removeEventListener('scroll', this.onScroll, PASSIVE_CAPTURE);
-    doc.removeEventListener('visibilitychange', this.onVisibilityChange);
-    this.releaseClickListener();
-    view?.removeEventListener('blur', this.onBlur);
+    // Unheard from here on: no fingers to keep.
+    this.fingerTargets = [];
+    this.isClaimingInstalled = false;
+    for (const unsubscribe of [
+      ...this.unsubscribers.splice(0),
+      ...this.claimingUnsubscribers.splice(0),
+    ]) {
+      unsubscribe();
+    }
     this.cancelEverything(this.arena.now());
+    // A claimed lift's note stays: an armed press's listeners go in the
+    // microtask after its pointerup, the touchend comes after that microtask
+    // in the same task (iOS and WebKit), and the element's own listener still
+    // takes it (noteClaimedLift).
     this.lastTouch = null;
     this.lastScroll = null;
   }
@@ -1082,7 +1715,7 @@ export class GestureHost {
   /**
    * The recognizers on the path from `target` to the document, innermost
    * first, and (for a contact) its consumer: the innermost element with an
-   * attached consumer or a delegated consumer type's attribute.
+   * attached consumer.
    */
   private participantsAt(
     target: unknown,
@@ -1090,9 +1723,17 @@ export class GestureHost {
   ): {
     recognizers: GestureRecognizer[];
     consumer: TouchConsumer | null;
+    consumerElement: Element | null;
   } {
     const recognizers: GestureRecognizer[] = [];
     let consumer: TouchConsumer | null = null;
+    let consumerElement: Element | null = null;
+    if (
+      target instanceof Node &&
+      [...this.touchGates].some(gate => gate(target))
+    ) {
+      return {recognizers, consumer, consumerElement};
+    }
     let hasConsumerOwner = pointerType == null;
     for (
       let node: Node | null = target instanceof Node ? target : null;
@@ -1104,29 +1745,120 @@ export class GestureHost {
       }
       const registration = this.registry.get(node);
       if (registration != null) {
+        // Every pointer (`spec:AST-094` FR43), hover included.
         recognizers.push(...registration.recognizers);
       }
       if (hasConsumerOwner || pointerType == null) {
         continue;
       }
+      // A press consumer takes every pointer's press, a mouse's too
+      // (`spec:AST-094` FR43, DEC-21).
       if (registration?.consumer != null) {
         consumer = registration.consumer;
+        consumerElement = node;
         hasConsumerOwner = true;
         continue;
       }
-      for (const type of this.delegated) {
-        if (node.hasAttribute(type.attribute)) {
-          consumer = type.create(node, pointerType);
-          hasConsumerOwner = true;
-          break;
-        }
+    }
+    return {recognizers, consumer, consumerElement};
+  }
+
+  /**
+   * Turn text selection and the touch callout off, for as long as this
+   * finger or pen is down, only on the elements whose hold does something:
+   * a long press's (a menu, a hold-repeat), those of recognizers created
+   * with a `selectionLock` (a slider's thumb, a switch's drag, a tab bar's
+   * zero-delay lens) and that of a press tracker created with one (a
+   * stepper's hold-repeat). Anything whose hold does nothing, a plain
+   * press-tracked control or row included, keeps the browser's long-press
+   * selection (`spec:AST-094` FR41). Restored when the contact ends. Callers
+   * lock for a finger or a pen under any primary pointer, never for a mouse
+   * (locksSelectionFor), and only once the arena has admitted the contact:
+   * `recognizers` and `consumer` are the ones that took it.
+   */
+  private lockSelection(
+    id: number,
+    recognizers: ReadonlyArray<GestureRecognizer>,
+    target: EventTarget | null,
+    consumer: TouchConsumer | null,
+    consumerElement: Element | null,
+  ): void {
+    // Each recognizer whose hold does something brings its lock; the host
+    // never imports one (a component without such a hold does not bundle
+    // it). Only one that took this contact locks for it: a recognizer that
+    // declined it (its pointer, or its own shouldReceiveTouch) has no hold
+    // here.
+    // An element attached with manageStyle: false keeps its own styles, the
+    // lock included (AttachOptions.manageStyle).
+    const managed = (element: Element) =>
+      this.registry.get(element)?.manageStyle !== false;
+    const byLock = new Map<SelectionLock, Set<Element>>();
+    for (const recognizer of recognizers) {
+      const lock = recognizer.selectionLock;
+      if (
+        lock != null &&
+        recognizer.view instanceof Element &&
+        managed(recognizer.view)
+      ) {
+        const elements = byLock.get(lock) ?? new Set<Element>();
+        elements.add(recognizer.view);
+        byLock.set(lock, elements);
       }
     }
-    return {recognizers, consumer};
+    const consumerLock = consumer?.selectionLock;
+    if (
+      consumerLock != null &&
+      consumerElement != null &&
+      managed(consumerElement)
+    ) {
+      const elements = byLock.get(consumerLock) ?? new Set<Element>();
+      elements.add(consumerElement);
+      byLock.set(consumerLock, elements);
+    }
+    if (byLock.size > 0) {
+      const undo = [...byLock].map(([lock, elements]) =>
+        lock(elements, target),
+      );
+      this.lockedBy.set(id, () => {
+        for (const release of undo) {
+          release();
+        }
+      });
+    }
+  }
+
+  /** Undo `lockSelection` for a contact that ended; idempotent. */
+  private unlockSelection(id: number): void {
+    this.lockedBy.get(id)?.();
+    this.lockedBy.delete(id);
   }
 
   // --- Touch events ----------------------------------------------------------
 
+  /**
+   * Hold touches away from every participant while `gate(target)` answers
+   * true (a presentation running in a layer: its content takes no touch
+   * until it settles). Returns the release.
+   */
+  addTouchGate(gate: (target: Node) => boolean): () => void {
+    this.touchGates.add(gate);
+    return () => {
+      this.touchGates.delete(gate);
+    };
+  }
+
+  /**
+   * How many fingers are on the screen: the length of `touches` in the last
+   * touch event the host's listeners heard (`touchstart`, `touchmove`,
+   * `touchend`, `touchcancel`), whatever its target, so a finger on an
+   * element with no recognizer counts too. 0 before any, and while no
+   * listener is installed. A recognizer that must not begin under a second
+   * finger reads it in `shouldBegin`.
+   */
+  fingersDown(): number {
+    return this.fingerTargets.length;
+  }
+
   /** Whether this event is new to the host (and mark it handled). */
   private takeEvent(event: Event): boolean {
     if (this.processed.has(event)) {
@@ -1137,25 +1869,50 @@ export class GestureHost {
   }
 
   private readonly onTouchStart = (event: TouchEvent): void => {
-    if (!this.takeEvent(event)) {
+    this.noteFingersDown(event);
+    // Where the host reads a finger from its pointer events (no ontouchstart,
+    // as after touch emulation turns on), its Touch Events would track it twice.
+    if (!this.usesTouchEvents || !this.takeEvent(event)) {
       return;
     }
+    if (this.fingerTargets.length > 1) {
+      this.failUnclaimedLoneFingerPans();
+    }
     const time = eventTime(event);
     const inputs: ArenaBeganInput[] = [];
     const untracked: TouchBeganInput[] = [];
     const stale: number[] = [];
+    // Locked once the arena knows which recognizers took each finger.
+    const toLock: {
+      id: number;
+      target: EventTarget | null;
+      consumerElement: Element | null;
+    }[] = [];
     for (const touch of touchesOf(event.changedTouches)) {
       if ((touch as StylusTouch).touchType === 'stylus') {
         continue;
       }
       // A finger number still tracked here began again: the touch it named
       // ended where no listener of ours could hear it.
+      this.cancelledFingers.delete(touch.identifier);
       const previous = this.forgetFinger(touch.identifier);
       if (previous != null) {
         stale.push(previous);
       }
-      const target = touch.target instanceof Node ? touch.target : event.target;
-      const {recognizers, consumer} = this.participantsAt(target, 'touch');
+      const native =
+        touch.target instanceof Node
+          ? landedOn(event, touch.target)
+          : landedOn(event);
+      const target = this.presentedTarget(
+        native,
+        touch.clientX,
+        touch.clientY,
+        event.timeStamp,
+      );
+      const {recognizers, consumer, consumerElement} = this.participantsAt(
+        target,
+        'touch',
+      );
       if (recognizers.length === 0 && consumer == null) {
         // Nothing here takes part: the touch stays the page's, but a
         // recognizer tracking another finger hears it began (a second
@@ -1172,14 +1929,22 @@ export class GestureHost {
       }
       const id = this.nextId++;
       this.touchIds.set(touch.identifier, id);
-      this.holdSelection(id, recognizers);
+      if (locksSelectionFor('touch')) {
+        toLock.push({id, target, consumerElement});
+      }
+      // The finger's events keep going to what the engine hit.
       this.watchTarget(
         touch.identifier,
-        target,
-        recognizers.some(claimsWhileMoving),
+        native,
+        recognizers.some(claimsWhileMoving) || consumer?.keepsTouch != null,
+        consumer != null ||
+          recognizers.some(recognizer => recognizer.claimsTouches),
       );
       this.lastFed.set(id, {x: touch.clientX, y: touch.clientY, time});
-      this.pairTouch(id, {x: touch.clientX, y: touch.clientY, target});
+      this.pairTouch(id, {x: touch.clientX, y: touch.clientY, target: native});
+      if (target !== native && target != null) {
+        this.retargeted.set(id, {x: touch.clientX, y: touch.clientY, target});
+      }
       inputs.push({
         id,
         x: touch.clientX,
@@ -1196,18 +1961,31 @@ export class GestureHost {
       this.arena.cancelled(stale, time);
     }
     this.arena.began(inputs);
+    for (const {id, target, consumerElement} of toLock) {
+      this.lockSelection(
+        id,
+        this.arena.participantsOf(id),
+        target,
+        this.arena.consumerOf(id) ?? null,
+        consumerElement,
+      );
+    }
     for (const input of untracked) {
       this.arena.untrackedBegan(input);
     }
     // Stamped after the consumers judged the touch: the brake asks whether
     // an EARLIER finger is still driving a scroll.
-    if (event.target instanceof Node) {
-      this.lastTouch = {target: event.target, time};
+    const landed = landedOn(event);
+    if (landed instanceof Node) {
+      this.lastTouch = {target: landed, time};
     }
   };
 
   private readonly onTouchMove = (event: TouchEvent): void => {
-    if (!this.takeEvent(event)) {
+    this.noteFingersDown(event);
+    // Where the host reads a finger from its pointer events (no ontouchstart,
+    // as after touch emulation turns on), its Touch Events would track it twice.
+    if (!this.usesTouchEvents || !this.takeEvent(event)) {
       return;
     }
     this.dropFingersNotDown(event);
@@ -1258,12 +2036,25 @@ export class GestureHost {
           : touch.scroll.canScroll(0, dy);
       });
       if (taken.length > 0) {
-        this.arena.browserTookOver(taken, time);
+        this.browserTook(taken, time);
       }
     }
-    this.feedMoves(inputs);
+    // A finger its pointer events sample is fed from there, never from here.
+    this.feedMoves(inputs.filter(input => !this.pointerFed.has(input.id)));
   };
 
+  /** The one blocking `touchmove` handler every claiming element shares. */
+  private readonly onBlockingTouchMove = (event: Event): void => {
+    this.cancelIfClaimed(event as TouchEvent);
+  };
+
+  /**
+   * Cancel a `touchmove` while a recognizer owns one of its fingers. A touch
+   * no recognizer owns keeps its moves (`spec:AST-094` FR19): nothing is
+   * cancelled before a recognizer begins, or for a touch it does not track,
+   * unless a recognizer holds that finger already (a scroll-edge pan pulling
+   * away from an edge every scroller under it is at; FR19, DEC-18).
+   */
   /**
    * Under `inputMode: 'pointer-events'` a finger comes from its pointer
    * events, so its touches carry no id of ours: the live finger it is, the
@@ -1280,10 +2071,11 @@ export class GestureHost {
         finger.phase === 'cancelled' ||
         !(finger.target instanceof Node) ||
         !(touch.target instanceof Node) ||
+        // Along the flat tree, both ways: the finger's target can be inside
+        // an open shadow root while its touches reach the host retargeted.
         !(
-          finger.target === touch.target ||
-          finger.target.contains(touch.target) ||
-          touch.target.contains(finger.target)
+          containsAlongFlatTree(finger.target, touch.target) ||
+          containsAlongFlatTree(touch.target, finger.target)
         )
       ) {
         continue;
@@ -1300,33 +2092,41 @@ export class GestureHost {
   /**
    * Cancel the `touchend` of a finger a recognizer owned when it lifted
    * (`inputMode: 'pointer-events'`): its `pointerup` came first, at the same
-   * place on the same target (`spec:AST-094` FR21).
+   * place on the same target (`spec:AST-094` FR21). Records older than
+   * CLAIMED_LIFT_MS are dropped first: their touchend never came.
    */
-  private cancelClaimedLift(event: TouchEvent): void {
-    if (!event.cancelable || event.defaultPrevented) {
+  private readonly onClaimedTouchEnd = (event: Event): void => {
+    const end = event as TouchEvent;
+    const time = eventTime(end);
+    for (let i = this.claimedLifts.length - 1; i >= 0; i--) {
+      if (time - this.claimedLifts[i].time > CLAIMED_LIFT_MS) {
+        this.claimedLifts.splice(i, 1);
+      }
+    }
+    if (!end.cancelable || end.defaultPrevented) {
       return;
     }
-    for (const touch of touchesOf(event.changedTouches)) {
+    for (const touch of touchesOf(end.changedTouches)) {
+      // As its pointer landed: inside an open shadow root this listener
+      // sees the touch retargeted to the host.
       const index = this.claimedLifts.findIndex(lift =>
         isSamePlace(lift, {
           x: touch.clientX,
           y: touch.clientY,
-          target: touch.target,
+          target: landedOn(end, touch.target),
         }),
       );
       if (index >= 0) {
         this.claimedLifts.splice(index, 1);
-        event.preventDefault();
+        if (this.claimedLifts.length === 0) {
+          this.clearClaimedLifts();
+        }
+        end.preventDefault();
         return;
       }
     }
-  }
+  };
 
-  /**
-   * Cancel a `touchmove` while a recognizer owns one of its fingers. A touch
-   * no recognizer owns keeps its moves (`spec:AST-094` FR19): nothing is
-   * cancelled before a recognizer begins, or for a touch it does not track.
-   */
   private cancelIfClaimed(event: TouchEvent): void {
     if (!event.cancelable || event.defaultPrevented) {
       return;
@@ -1337,15 +2137,29 @@ export class GestureHost {
     for (const touch of moved) {
       const id =
         this.touchIds.get(touch.identifier) ??
-        (this.inputMode === 'pointer-events'
-          ? this.pointerFingerAt(touch)
-          : undefined);
-      if (id != null && this.arena.isClaimed(id)) {
+        // Where fingers come from pointer events (inputMode 'pointer-events',
+        // or 'auto' with no ontouchstart), the touch is matched to its pointer.
+        (this.usesTouchEvents ? undefined : this.pointerFingerAt(touch));
+      if (
+        id != null &&
+        (this.arena.isClaimed(id) ||
+          // A kept press keeps its finger under any pointer (FR11, DEC-21).
+          this.arena.consumerOf(id)?.keepsTouch?.(id) === true ||
+          // A recognizer that holds the finger before it begins: a
+          // scroll-edge pan pulling away from an edge (FR19, DEC-18), only
+          // while this is the one finger on the screen: with a second one
+          // down anywhere, even off the recognizer's element, the moves stay
+          // the browser's, for its pinch (FR10).
+          (event.touches.length === 1 &&
+            this.arena
+              .participantsOf(id)
+              .some(recognizer => internals(recognizer).keepsTouch(id))))
+      ) {
         event.preventDefault();
         return;
       }
     }
-    if (moved.some(touch => (touch as StylusTouch).touchType === 'stylus')) {
+    if (hasStylusTouch(event)) {
       for (const id of this.pointerIds.values()) {
         if (this.arena.isClaimed(id)) {
           // A pen whose pointer a recognizer owns: its stylus touches too,
@@ -1358,39 +2172,92 @@ export class GestureHost {
   }
 
   private readonly onTouchEnd = (event: TouchEvent): void => {
-    if (!this.takeEvent(event)) {
+    this.releaseArmedPress();
+    this.noteFingersDown(event);
+    // Where the host reads a finger from its pointer events (no ontouchstart,
+    // as after touch emulation turns on), its Touch Events would track it twice.
+    if (!this.usesTouchEvents || !this.takeEvent(event)) {
       return;
     }
     this.dropFingersNotDown(event);
     const time = eventTime(event);
     const inputs: TouchInput[] = [];
+    const retargetedEnds: {
+      id: number;
+      landed: {x: number; y: number; target: EventTarget};
+      x: number;
+      y: number;
+    }[] = [];
+    let isRefused = false;
     for (const touch of touchesOf(event.changedTouches)) {
+      if (this.cancelledFingers.delete(touch.identifier)) {
+        isRefused = true;
+        continue;
+      }
+      const tracked = this.touchIds.get(touch.identifier);
+      const landed = tracked == null ? undefined : this.retargeted.get(tracked);
       const id = this.forgetFinger(touch.identifier);
       if (id == null) {
         continue;
       }
       inputs.push({id, x: touch.clientX, y: touch.clientY, time});
+      if (landed != null) {
+        retargetedEnds.push({id, landed, x: touch.clientX, y: touch.clientY});
+      }
     }
     // The lift is when momentum starts: the clock the brake wants most.
-    if (event.target instanceof Node) {
-      this.lastTouch = {target: event.target, time};
-    }
-    if (inputs.length === 0) {
-      this.releaseArmedPress();
-      return;
+    const landed = landedOn(event);
+    if (landed instanceof Node) {
+      this.lastTouch = {target: landed, time};
+    }
+    const dispositions =
+      inputs.length > 0
+        ? this.arena.ended(inputs)
+        : new Map<number, ClickDisposition>();
+    let cancelsClick = isRefused || needsSuppression(dispositions);
+    // A tap sent to what is drawn: the engine's click would hit the layout
+    // position, so it is cancelled and the tap clicks what it touched.
+    for (const end of retargetedEnds) {
+      if (this.clickRetargetedTap(end.landed, end, dispositions.get(end.id))) {
+        cancelsClick = true;
+      }
     }
-    const dispositions = this.arena.ended(inputs);
-    if (needsSuppression(dispositions)) {
+    if (cancelsClick) {
       if (event.cancelable) {
         event.preventDefault();
       }
-      this.armSwallower();
+      armClickGuard(this.doc);
     }
-    this.releaseArmedPress();
   };
 
+  /**
+   * Clicks what a retargeted contact touched if it ended as a tap the
+   * engine would click: nothing claimed it, the browser did not take it
+   * (a taken contact is no longer retargeted), and the finger stayed within
+   * a tap's movement. Returns whether it clicked.
+   */
+  private clickRetargetedTap(
+    landed: {x: number; y: number; target: EventTarget} | undefined,
+    end: {x: number; y: number},
+    disposition: ClickDisposition | undefined,
+  ): boolean {
+    if (landed == null || disposition !== 'allow') {
+      return false;
+    }
+    const moved = Math.hypot(end.x - landed.x, end.y - landed.y);
+    if (moved > UIKIT_TAP.allowableMovement.value) {
+      return false;
+    }
+    this.clickRetargeted(landed.target, end.x, end.y);
+    return true;
+  }
+
   private readonly onTouchCancel = (event: TouchEvent): void => {
-    if (!this.takeEvent(event)) {
+    this.releaseArmedPress();
+    this.noteFingersDown(event);
+    // Where the host reads a finger from its pointer events (no ontouchstart,
+    // as after touch emulation turns on), its Touch Events would track it twice.
+    if (!this.usesTouchEvents || !this.takeEvent(event)) {
       return;
     }
     const listed = touchesOf(event.changedTouches);
@@ -1399,6 +2266,12 @@ export class GestureHost {
       listed.length > 0
         ? listed.map(touch => touch.identifier)
         : [...this.touchIds.keys()];
+    if (listed.length === 0) {
+      this.cancelledFingers.clear();
+    }
+    for (const identifier of identifiers) {
+      this.cancelledFingers.delete(identifier);
+    }
     const ids: number[] = [];
     for (const identifier of identifiers) {
       const id = this.forgetFinger(identifier);
@@ -1409,7 +2282,6 @@ export class GestureHost {
     if (ids.length > 0) {
       this.arena.cancelled(ids, eventTime(event));
     }
-    this.releaseArmedPress();
   };
 
   /** The target's own listeners, for a target that left the document. */
@@ -1427,6 +2299,11 @@ export class GestureHost {
     this.onTouchEnd(event as TouchEvent);
   };
 
+  /** The same, registered passively for a touch only watchers follow. */
+  private readonly onTargetTouchEndPassive = (event: Event): void => {
+    this.onTouchEnd(event as TouchEvent);
+  };
+
   private readonly onTargetTouchCancel = (event: Event): void => {
     this.onTouchCancel(event as TouchEvent);
   };
@@ -1437,7 +2314,10 @@ export class GestureHost {
    * in this very event) ended where we could not see it.
    */
   private dropFingersNotDown(event: TouchEvent): void {
-    if (event.touches == null || this.touchIds.size === 0) {
+    if (
+      event.touches == null ||
+      (this.touchIds.size === 0 && this.cancelledFingers.size === 0)
+    ) {
       return;
     }
     const down = new Set<number>();
@@ -1447,6 +2327,11 @@ export class GestureHost {
     for (const touch of touchesOf(event.changedTouches)) {
       down.add(touch.identifier);
     }
+    for (const identifier of [...this.cancelledFingers]) {
+      if (!down.has(identifier)) {
+        this.cancelledFingers.delete(identifier);
+      }
+    }
     const gone = [...this.touchIds.keys()].filter(
       identifier => !down.has(identifier),
     );
@@ -1466,6 +2351,7 @@ export class GestureHost {
     identifier: number,
     target: EventTarget | null,
     isBlocking: boolean,
+    isClaiming: boolean,
   ): void {
     if (target == null || typeof target.addEventListener !== 'function') {
       return;
@@ -1473,30 +2359,45 @@ export class GestureHost {
     this.touchTargets.set(identifier, target);
     const state = this.watched.get(target);
     if (state == null) {
-      this.watched.set(target, {count: 1, blocking: isBlocking ? 1 : 0});
+      this.watched.set(target, {
+        count: 1,
+        blocking: isBlocking ? 1 : 0,
+        claiming: isClaiming ? 1 : 0,
+      });
       if (isBlocking) {
         this.blockingFingers.add(identifier);
       }
+      if (isClaiming) {
+        this.claimingFingers.add(identifier);
+      }
       target.addEventListener(
         'touchmove',
         isBlocking ? this.onTargetTouchMove : this.onTargetTouchMovePassive,
         {passive: !isBlocking},
       );
-      target.addEventListener('touchend', this.onTargetTouchEnd, {
-        passive: false,
-      });
+      target.addEventListener(
+        'touchend',
+        isClaiming ? this.onTargetTouchEnd : this.onTargetTouchEndPassive,
+        {passive: !isClaiming},
+      );
       target.addEventListener('touchcancel', this.onTargetTouchCancel, {
         passive: true,
       });
       return;
     }
     const wasBlocking = state.blocking > 0;
+    const wasClaiming = state.claiming > 0;
     state.count += 1;
     if (isBlocking) {
       state.blocking += 1;
       this.blockingFingers.add(identifier);
     }
+    if (isClaiming) {
+      state.claiming += 1;
+      this.claimingFingers.add(identifier);
+    }
     this.swapTargetTouchMove(target, wasBlocking, state.blocking > 0);
+    this.swapTargetTouchEnd(target, wasClaiming, state.claiming > 0);
   }
 
   private unwatchTarget(identifier: number): void {
@@ -1510,12 +2411,17 @@ export class GestureHost {
       return;
     }
     const wasBlocking = state.blocking > 0;
+    const wasClaiming = state.claiming > 0;
     state.count -= 1;
     if (this.blockingFingers.delete(identifier)) {
       state.blocking -= 1;
     }
+    if (this.claimingFingers.delete(identifier)) {
+      state.claiming -= 1;
+    }
     if (state.count > 0) {
       this.swapTargetTouchMove(target, wasBlocking, state.blocking > 0);
+      this.swapTargetTouchEnd(target, wasClaiming, state.claiming > 0);
       return;
     }
     this.watched.delete(target);
@@ -1523,7 +2429,10 @@ export class GestureHost {
       'touchmove',
       wasBlocking ? this.onTargetTouchMove : this.onTargetTouchMovePassive,
     );
-    target.removeEventListener('touchend', this.onTargetTouchEnd);
+    target.removeEventListener(
+      'touchend',
+      wasClaiming ? this.onTargetTouchEnd : this.onTargetTouchEndPassive,
+    );
     target.removeEventListener('touchcancel', this.onTargetTouchCancel);
   }
 
@@ -1552,6 +2461,31 @@ export class GestureHost {
     );
   }
 
+  /**
+   * Keeps one `touchend` listener on a watched target: the cancelable one
+   * while a finger on it has a participant that could claim (a lift whose
+   * click must not happen cancels its `touchend`), a passive one while only
+   * watchers follow its fingers (`spec:AST-094` FR20).
+   */
+  private swapTargetTouchEnd(
+    target: EventTarget,
+    wasClaiming: boolean,
+    isClaiming: boolean,
+  ): void {
+    if (wasClaiming === isClaiming) {
+      return;
+    }
+    target.removeEventListener(
+      'touchend',
+      wasClaiming ? this.onTargetTouchEnd : this.onTargetTouchEndPassive,
+    );
+    target.addEventListener(
+      'touchend',
+      isClaiming ? this.onTargetTouchEnd : this.onTargetTouchEndPassive,
+      {passive: !isClaiming},
+    );
+  }
+
   /** Stop tracking a finger by its Touch.identifier; returns its arena id. */
   private forgetFinger(identifier: number): number | undefined {
     const id = this.touchIds.get(identifier);
@@ -1568,6 +2502,7 @@ export class GestureHost {
       if (isSamePlace(pending, place)) {
         this.pendingPointers.delete(pointerId);
         this.fingerPointers.set(pointerId, id);
+        this.pointerFed.add(id);
         return;
       }
     }
@@ -1579,23 +2514,18 @@ export class GestureHost {
       if (isSamePlace(unpaired, place)) {
         this.unpairedTouches.delete(id);
         this.fingerPointers.set(pointerId, id);
+        this.pointerFed.add(id);
         return;
       }
     }
     this.pendingPointers.set(pointerId, place);
   }
 
-  /** Feed moves, dropping the echo of a move the other channel delivered. */
+  /** Feed moves from a contact's sampling channel, in time order. */
   private feedMoves(inputs: ReadonlyArray<TouchInput>): void {
     const fresh = inputs.filter(input => {
       const last = this.lastFed.get(input.id);
-      if (
-        last != null &&
-        (input.time < last.time ||
-          (input.time === last.time &&
-            input.x === last.x &&
-            input.y === last.y))
-      ) {
+      if (last != null && input.time < last.time) {
         return false;
       }
       this.lastFed.set(input.id, {x: input.x, y: input.y, time: input.time});
@@ -1606,83 +2536,12 @@ export class GestureHost {
     }
   }
 
-  /**
-   * For one held press by a finger or a pen: text selection and the touch
-   * callout off on the elements whose hold does something (a long press),
-   * as `holdSelectionStyle` decides (`spec:AST-094` FR41, DEC-9).
-   * Everything else keeps the browser's long-press selection. Restored when
-   * the contact ends; refcounted across contacts on one element.
-   */
-  private holdSelection(
-    id: number,
-    recognizers: ReadonlyArray<GestureRecognizer>,
-  ): void {
-    const elements = new Set<HTMLElement>();
-    for (const recognizer of recognizers) {
-      if (
-        recognizer.view instanceof HTMLElement &&
-        recognizer.isEnabled &&
-        // An element attached with manageStyle: false keeps its own styles.
-        this.registry.get(recognizer.view)?.manageStyle !== false &&
-        holdSelectionStyle([recognizer]) != null
-      ) {
-        elements.add(recognizer.view);
-      }
-    }
-    if (elements.size === 0) {
-      return;
-    }
-    const held = [...elements];
-    for (const element of held) {
-      const entry = heldSelection.get(element);
-      if (entry != null) {
-        entry.count += 1;
-        continue;
-      }
-      const saved = HOLD_SELECTION_PROPERTIES.map(name => ({
-        name,
-        value: element.style.getPropertyValue(name),
-        priority: element.style.getPropertyPriority(name),
-      }));
-      for (const name of HOLD_SELECTION_PROPERTIES) {
-        element.style.setProperty(name, 'none');
-      }
-      heldSelection.set(element, {count: 1, saved});
-    }
-    this.heldSelectionBy.set(id, held);
-  }
-
-  /** Undo `holdSelection` for a contact that ended; idempotent. */
-  private releaseSelection(id: number): void {
-    const held = this.heldSelectionBy.get(id);
-    if (held == null) {
-      return;
-    }
-    this.heldSelectionBy.delete(id);
-    for (const element of held) {
-      const entry = heldSelection.get(element);
-      if (entry == null) {
-        continue;
-      }
-      entry.count -= 1;
-      if (entry.count > 0) {
-        continue;
-      }
-      heldSelection.delete(element);
-      for (const {name, value, priority} of entry.saved) {
-        if (value === '') {
-          element.style.removeProperty(name);
-        } else {
-          element.style.setProperty(name, value, priority);
-        }
-      }
-    }
-  }
-
   /** Forget a contact's pairing and echo state. */
   private forgetContact(id: number): void {
-    this.releaseSelection(id);
+    this.unlockSelection(id);
+    this.retargeted.delete(id);
     this.lastFed.delete(id);
+    this.pointerFed.delete(id);
     this.judgedUncancelable.delete(id);
     this.unpairedTouches.delete(id);
     for (const [pointerId, paired] of this.fingerPointers) {
@@ -1696,7 +2555,7 @@ export class GestureHost {
 
   private readonly onPointerDown = (event: PointerEvent): void => {
     // A new press: whatever click is still owed to the last one is not this.
-    this.disarmSwallower();
+    disarmClickGuard(this.doc);
     if (!isPointerKind(event.pointerType)) {
       return;
     }
@@ -1704,17 +2563,24 @@ export class GestureHost {
       this.pairPointer(event.pointerId, {
         x: event.clientX,
         y: event.clientY,
-        target: event.target,
+        target: landedOn(event),
       });
       return;
     }
-    // A right click, a pen's barrel button and a ctrl-click on macOS start
-    // no press (FR43).
+    // A right click, a pen's barrel button, or a ctrl-click on macOS (its
+    // context click) starts no press (FR43).
     if (event.pointerType !== 'touch' && !isPrimaryClick(event)) {
       return;
     }
-    const {recognizers, consumer} = this.participantsAt(
-      event.target,
+    const landed = landedOn(event);
+    const target = this.presentedTarget(
+      landed,
+      event.clientX,
+      event.clientY,
+      event.timeStamp,
+    );
+    const {recognizers, consumer, consumerElement} = this.participantsAt(
+      target,
       event.pointerType,
     );
     if (recognizers.length === 0 && consumer == null) {
@@ -1722,8 +2588,8 @@ export class GestureHost {
     }
     const id = this.nextId++;
     this.pointerIds.set(event.pointerId, id);
-    if (event.pointerType !== 'mouse') {
-      this.holdSelection(id, recognizers);
+    if (target !== landed && target != null) {
+      this.retargeted.set(id, {x: event.clientX, y: event.clientY, target});
     }
     this.arena.began([
       {
@@ -1732,12 +2598,23 @@ export class GestureHost {
         y: event.clientY,
         time: eventTime(event),
         pointerType: event.pointerType,
-        target: event.target,
-        scroll: createNativeScrollProbe(event.target),
+        target,
+        scroll: createNativeScrollProbe(target),
         recognizers,
         consumer,
       },
     ]);
+    if (locksSelectionFor(event.pointerType)) {
+      // The presented target: what the pen is on, where the engine's own
+      // hit test may still see the motion's start.
+      this.lockSelection(
+        id,
+        this.arena.participantsOf(id),
+        target,
+        this.arena.consumerOf(id) ?? null,
+        consumerElement,
+      );
+    }
   };
 
   private readonly onPointerMove = (event: PointerEvent): void => {
@@ -1772,6 +2649,7 @@ export class GestureHost {
   };
 
   private readonly onPointerUp = (event: PointerEvent): void => {
+    this.releaseArmedPress();
     if (event.pointerType === 'touch' && this.usesTouchEvents) {
       // The lift itself is the touchend's: it alone can cancel the click.
       this.fingerPointers.delete(event.pointerId);
@@ -1780,31 +2658,96 @@ export class GestureHost {
     }
     const id = this.pointerIds.get(event.pointerId);
     if (id == null) {
-      this.releaseArmedPress();
       return;
     }
     this.pointerIds.delete(event.pointerId);
-    this.releaseSelection(id);
-    if (event.pointerType === 'touch' && this.arena.isClaimed(id)) {
-      this.claimedLifts.push({
-        x: event.clientX,
-        y: event.clientY,
-        target: event.target,
-      });
-      if (this.claimedLifts.length > 8) {
-        this.claimedLifts.shift();
-      }
-    }
+    this.unlockSelection(id);
     const dispositions = this.arena.ended([
       {id, x: event.clientX, y: event.clientY, time: eventTime(event)},
     ]);
-    if (needsSuppression(dispositions)) {
-      this.armSwallower();
+    // A retargeted tap's own click arms the click guard for the engine's.
+    const landed = this.retargeted.get(id);
+    this.retargeted.delete(id);
+    const clicked = this.clickRetargetedTap(
+      landed,
+      {x: event.clientX, y: event.clientY},
+      dispositions.get(id),
+    );
+    if (!clicked && needsSuppression(dispositions)) {
+      armClickGuard(this.doc);
+    }
+    // A finger read from its pointer events: the touchend that follows the
+    // lift is cancelled when a gesture took it, which the lift itself may
+    // decide (a hold whose time came with it), or when its tap was retargeted
+    // (FR21).
+    if (
+      event.pointerType === 'touch' &&
+      (clicked || needsSuppression(dispositions))
+    ) {
+      this.noteClaimedLift(event);
     }
-    this.releaseArmedPress();
   };
 
+  /**
+   * Note a claimed finger's lift, so the `touchend` that follows its
+   * `pointerup` is cancelled (FR21). Only where an element's listener can take
+   * that touchend: elsewhere none comes, and the note would hold its node for
+   * nothing. At most CLAIMED_LIFT_LIMIT wait, the oldest going first, and one
+   * timer drops each once CLAIMED_LIFT_MS has passed (FR24); the host's
+   * uninstall keeps them, as it can run in the microtask after the pointerup,
+   * before the touchend that comes later in the same task.
+   */
+  private noteClaimedLift(event: PointerEvent): void {
+    if (
+      !this.readsFingersFromPointerEvents() ||
+      !(this.isCoarse || this.sendsTouchEvents())
+    ) {
+      return;
+    }
+    this.claimedLifts.push({
+      x: event.clientX,
+      y: event.clientY,
+      target: landedOn(event),
+      time: eventTime(event),
+    });
+    if (this.claimedLifts.length > CLAIMED_LIFT_LIMIT) {
+      this.claimedLifts.shift();
+    }
+    this.armClaimedLiftTimer();
+  }
+
+  /** Arm the one timer for the oldest claimed lift still waiting. */
+  private armClaimedLiftTimer(): void {
+    if (this.claimedLiftTimer != null || this.claimedLifts.length === 0) {
+      return;
+    }
+    const due = this.claimedLifts[0].time + CLAIMED_LIFT_MS;
+    this.claimedLiftTimer = this.clock.setTimeout(
+      () => {
+        this.claimedLiftTimer = null;
+        const now = this.clock.now();
+        for (let i = this.claimedLifts.length - 1; i >= 0; i--) {
+          if (now - this.claimedLifts[i].time >= CLAIMED_LIFT_MS) {
+            this.claimedLifts.splice(i, 1);
+          }
+        }
+        this.armClaimedLiftTimer();
+      },
+      Math.max(0, due - this.clock.now()),
+    );
+  }
+
+  /** Drop every claimed lift and its timer, once the last one is taken. */
+  private clearClaimedLifts(): void {
+    this.claimedLifts.length = 0;
+    if (this.claimedLiftTimer != null) {
+      this.clock.clearTimeout(this.claimedLiftTimer);
+      this.claimedLiftTimer = null;
+    }
+  }
+
   private readonly onPointerCancel = (event: PointerEvent): void => {
+    this.releaseArmedPress();
     if (event.pointerType === 'touch' && this.usesTouchEvents) {
       const id =
         this.fingerPointers.get(event.pointerId) ??
@@ -1812,17 +2755,21 @@ export class GestureHost {
       this.fingerPointers.delete(event.pointerId);
       this.pendingPointers.delete(event.pointerId);
       if (id != null) {
-        this.arena.browserTookOver([id], eventTime(event));
+        // The pointer channel ends here while the finger keeps moving (the
+        // browser scrolls with it): its touch events, now the only channel,
+        // sample it, as a watcher following the scroll to the lift needs.
+        this.pointerFed.delete(id);
+        this.browserTook([id], eventTime(event));
       }
       return;
     }
     const id = this.pointerIds.get(event.pointerId);
     if (id != null) {
       this.pointerIds.delete(event.pointerId);
-      this.releaseSelection(id);
+      this.unlockSelection(id);
+      this.retargeted.delete(id);
       this.arena.cancelled([id], eventTime(event));
     }
-    this.releaseArmedPress();
   };
 
   /**
@@ -1839,7 +2786,7 @@ export class GestureHost {
         touch.pointerType !== 'touch' ||
         touch.phase === 'ended' ||
         touch.phase === 'cancelled' ||
-        touch.target !== event.target
+        touch.target !== landedOn(event)
       ) {
         continue;
       }
@@ -1857,54 +2804,29 @@ export class GestureHost {
 
   // --- Clicks, menus, scrolls, focus -----------------------------------------
 
-  private armSwallower(): void {
-    this.swallowDeadline =
-      browserClock.now() + UIKIT_GESTURES.click.strayClickWindow.value;
-  }
-
-  private disarmSwallower(): void {
-    this.swallowDeadline = Number.NEGATIVE_INFINITY;
-  }
-
-  private readonly onClick = (event: MouseEvent): void => {
-    if (browserClock.now() > this.swallowDeadline) {
-      return;
-    }
-    if (!event.isTrusted || event.detail === 0) {
-      return;
-    }
-    if (
-      event.target instanceof Element &&
-      event.target.hasAttribute(HAPTIC_SWITCH_ATTRIBUTE)
-    ) {
-      return;
-    }
-    this.disarmSwallower();
-    event.preventDefault();
-    event.stopImmediatePropagation();
-  };
-
   private replayClick(touch: GestureTouch, allowed: boolean): void {
     if (!allowed) {
       return;
     }
     // The browser's own click was swallowed while recognizers decided; they
     // all failed, so the click the touch earned is delivered now.
-    this.disarmSwallower();
+    disarmClickGuard(this.doc);
     const target = touch.target;
     const view = this.doc.defaultView;
     if (!(target instanceof Element) || !target.isConnected || view == null) {
       return;
     }
-    target.dispatchEvent(
-      new view.MouseEvent('click', {
-        bubbles: true,
-        cancelable: true,
-        composed: true,
-        detail: 1,
-        clientX: touch.x,
-        clientY: touch.y,
-      }),
+    withoutClickGuard(() =>
+      target.dispatchEvent(
+        new view.MouseEvent('click', {
+          bubbles: true,
+          cancelable: true,
+          composed: true,
+          detail: 1,
+          clientX: touch.x,
+          clientY: touch.y,
+        }),
+      ),
     );
   }
 
@@ -1925,16 +2847,38 @@ export class GestureHost {
    * reports itself through pointercancel or touchcancel.
    */
   ownScroll(scroller: Node): void {
-    this.ownedScrolls.add(scroller);
+    const call = ++this.ownScrollCalls;
+    this.ownedScrolls.set(scroller, call);
     const view = this.doc.defaultView;
     if (view == null) {
       return;
     }
-    view.requestAnimationFrame(() => {
-      view.requestAnimationFrame(() => {
-        this.ownedScrolls.delete(scroller);
+    // A newer call keeps it until its own frame has passed: its frames
+    // replace the older call's.
+    this.ownScrollFrames.get(scroller)?.();
+    let inner = 0;
+    const outer = view.requestAnimationFrame(() => {
+      inner = view.requestAnimationFrame(() => {
+        this.ownScrollFrames.delete(scroller);
+        if (this.ownedScrolls.get(scroller) === call) {
+          this.ownedScrolls.delete(scroller);
+        }
       });
     });
+    this.ownScrollFrames.set(scroller, () => {
+      view.cancelAnimationFrame(outer);
+      if (inner !== 0) {
+        view.cancelAnimationFrame(inner);
+      }
+    });
+  }
+
+  /**
+   * @internal Whether a recognizer is scrolling `scroller` itself now
+   * (ownScroll): that scroll is not a finger's (fingerScroll.ts reads it).
+   */
+  isOwnScroll(scroller: Node): boolean {
+    return this.ownedScrolls.has(scroller);
   }
 
   private readonly onScroll = (event: Event): void => {
@@ -1948,8 +2892,8 @@ export class GestureHost {
     const last = this.lastTouch;
     if (
       last != null &&
-      time - last.time < UIKIT_GESTURES.press.momentumMemory.value &&
-      scroller.contains(last.target)
+      time - last.time < UIKIT_PRESS.momentumMemory.value &&
+      containsAlongFlatTree(scroller, last.target)
     ) {
       this.lastScroll = {scroller, time};
     }
@@ -1966,7 +2910,7 @@ export class GestureHost {
       }
       if (
         touch.target instanceof Node &&
-        scroller.contains(touch.target) &&
+        containsAlongFlatTree(scroller, touch.target) &&
         // Only a pan this finger drove takes the touch: the browser starts
         // one only once the finger has travelled the take distance
         // (spec:AST-094 FR20). A scroll under a finger that has not
@@ -1974,60 +2918,118 @@ export class GestureHost {
         // anchoring) is the page's own: the touch, and the click it earns,
         // stay where they are.
         Math.hypot(touch.x - touch.startX, touch.y - touch.startY) >=
-          UIKIT_GESTURES.press.slop.value
+          UIKIT_PRESS.slop.value
       ) {
         taken.push(touch.id);
       }
     }
     if (taken.length > 0) {
-      this.arena.browserTookOver(taken, time);
+      this.browserTook(taken, time);
     }
   };
 
+  private noteFingersDown(event: TouchEvent): void {
+    const fingers: Node[] = [];
+    for (const touch of touchesOf(event.touches)) {
+      if ((touch as StylusTouch).touchType !== 'stylus') {
+        if (touch.target instanceof Node) {
+          fingers.push(touch.target);
+        }
+      }
+    }
+    this.fingerTargets = fingers;
+    for (const listener of [...this.fingerListeners]) {
+      listener();
+    }
+  }
+
+  /**
+   * A second finger landed somewhere (wherever: often on a plain row): a
+   * pan that takes one finger only and has not claimed its touch fails, so
+   * the two fingers stay the browser's pinch (WCAG 1.4.4) instead of the
+   * pan claiming them midway. A drag a recognizer has claimed keeps its
+   * finger: a second finger never cancels or redirects it (`spec:AST-094`
+   * FR10), and no claim is released here.
+   */
+  private failUnclaimedLoneFingerPans(): void {
+    for (const recognizer of [...this.arena.involvedRecognizers]) {
+      if (
+        isPanRecognizer(recognizer) &&
+        recognizer.state === 'possible' &&
+        recognizer.maximumNumberOfTouches === 1 &&
+        recognizer.trackedTouches.length > 0 &&
+        recognizer.trackedTouches.every(
+          touch =>
+            touch.pointerType === 'touch' && !this.arena.isClaimed(touch.id),
+        )
+      ) {
+        recognizer.cancel();
+      }
+    }
+  }
+
   private readonly onVisibilityChange = (): void => {
     if (this.doc.visibilityState === 'hidden') {
       this.cancelEverything(this.arena.now());
+      // As at a blur: the press sends no further pointer event, so an armed
+      // press's page listeners go now (FR24).
       this.releaseArmedPress();
     }
   };
 
   private readonly onBlur = (): void => {
     this.cancelEverything(this.arena.now());
+    // The press a blur ends sends no further pointer event: an armed press's
+    // page listeners go now, as at its lift (FR24).
     this.releaseArmedPress();
   };
 
+  /** Whether the browser sends Touch Events at all (`ontouchstart`). */
+  private sendsTouchEvents(): boolean {
+    const view = this.doc.defaultView;
+    return view != null && 'ontouchstart' in view;
+  }
+
+  /**
+   * Whether the host reads fingers from their pointer events: Pointer Events
+   * input, or a window with no `ontouchstart` (touch emulation turned on
+   * after load), as the move path does.
+   */
+  private readsFingersFromPointerEvents(): boolean {
+    const view = this.doc.defaultView;
+    return (
+      this.inputMode === 'pointer-events' ||
+      (view != null && !('ontouchstart' in view))
+    );
+  }
+
   /** The app lost focus: UIKit cancels every touch in flight. */
   private cancelEverything(time: number): void {
     const ids = [...this.pointerIds.values()];
     for (const id of ids) {
-      this.releaseSelection(id);
+      this.unlockSelection(id);
     }
     for (const identifier of [...this.touchIds.keys()]) {
+      // The browser may keep the touch alive: its lift must not click.
+      this.cancelledFingers.add(identifier);
       const id = this.forgetFinger(identifier);
       if (id != null) {
         ids.push(id);
       }
     }
     this.pointerIds.clear();
+    this.retargeted.clear();
     this.fingerPointers.clear();
     this.pendingPointers.clear();
     this.unpairedTouches.clear();
     this.lastFed.clear();
+    this.pointerFed.clear();
     if (ids.length > 0) {
       this.arena.cancelled(ids, time);
     }
   }
 }
 
-/** Whether an attachment could take a press now: something on it is enabled. */
-function isServed(registration: Registration): boolean {
-  return (
-    registration.recognizers.some(r => r.isEnabled) ||
-    (registration.consumer != null &&
-      registration.consumer.isEnabled?.() !== false)
-  );
-}
-
 function needsSuppression(
   dispositions: Map<number, ClickDisposition>,
 ): boolean {
@@ -2051,14 +3053,12 @@ function coalescedHistory(event: PointerEvent): TouchSample[] {
   }));
 }
 
-const hosts = new WeakMap<Document, GestureHost>();
-
 /** The gesture host of a document, created on first use. */
 export function getGestureHost(doc: Document): GestureHost {
-  let host = hosts.get(doc);
+  let host = gestureHosts.get(doc);
   if (host == null) {
     host = new GestureHost(doc);
-    hosts.set(doc, host);
+    gestureHosts.set(doc, host);
   }
   return host;
 }