Phase 4 Step 12: Supporting CSS features (@supports, position: sticky, pointer events)

[thomasnemer]

Parent: #41

Goal

Implement supporting CSS features: @supports feature queries, position: sticky, and pointer events. These three sub-tasks are independent and can be parallelized.

Prerequisites

• None (independent of other Phase 4 steps)

Implementation

12a: @supports (Feature Queries)

• Parse @supports at-rule with feature query syntax
• Evaluate feature queries against the set of supported CSS properties
• Support not, and, or combinators
• Conditional rule processing based on query result

12b: position: sticky

• Implement sticky positioning relative to scroll container
• Compute sticky constraint rectangle from top, right, bottom, left thresholds
• Switch between relative and fixed behavior based on scroll position
• Handle nested scroll containers

12c: Pointer Events

• Implement pointer event types: pointerdown, pointermove, pointerup, pointerenter, pointerleave, pointerover, pointerout, pointercancel, gotpointercapture, lostpointercapture
• PointerEvent interface with pointerId, pointerType, pressure, width, height, etc.
• Pointer capture: setPointerCapture(), releasePointerCapture(), hasPointerCapture()
• Fire pointer events before corresponding mouse events (modern replacement for mouse events, required by React and other frameworks)

Tests

• @supports: parsing, evaluation, negation, and combinator tests
• position: sticky: threshold tests, scroll behavior tests, nested container tests
• Pointer events: event ordering, capture, properties, and interaction with mouse events

Acceptance Criteria

• @supports correctly evaluates feature queries and conditionally applies rules
• position: sticky elements stick at the correct scroll thresholds
• Pointer events fire in correct order with correct properties
• Pointer capture works per spec