Accessibility

Decorative by contract

The field is ambiance, never content. It's built so assistive tech skips it, motion preferences are honoured, and keyboard users get the same reactions as the mouse.

The canvas is hidden from assistive tech

Every field surface — <field-root>, <field-cell>, and mountField() — marks its canvas aria-hidden="true" automatically, sits at z-index: 0 behind the content, and is pointer-events: none. Screen readers and tab order never touch it.

Reduced motion is honoured

Under prefers-reduced-motion: reduce, the integrator runs with dt = 0 — the simulation freezes to a single calm frame, and the CSS backdrop animation is disabled. The field is present but still.

Focus engages, like hover

Bodies marked data-hot activate on focus as well as hover — so a keyboard user tabbing through links gets the same field reaction (and the same --d feedback) a pointer user gets. Reactions are progressive enhancement layered on real, focusable elements.

Guidance for consumers

  • Never put essential content in the field. It's a backdrop; all meaning lives in real DOM.
  • Keep text legible on its own. Don't rely on the field for contrast — --d effects should enhance already-readable type, not create it.
  • Respect the user's setting. If you add your own --d-driven motion, gate it behind prefers-reduced-motion too.
  • Words glow, they are never drawn. The engine never assembles particles into letterforms — text stays real and selectable.