Overview

The widget is a drop-in "Connect your domain" modal. It renders inside a Shadow DOM (host CSS can't leak in or out), is fully keyboard-accessible, and adapts to mobile as a bottom sheet.

How it fits together

1. Your backend mints a short-lived widget JWT (never expose an API key to the browser).
2. The browser loads the widget bundle and opens it with that token.
3. The widget calls the browser-facing API (domains:check, connections, records:check) and drives the connect flow to success.

The flow (screens)

• Enter domain → validates and analyzes the domain.
• Domain analysis → detects the DNS provider and setup type.
• Automatic setup → confirm; the connection is created and records written.
• Manual configuration → shows the exact records with copy buttons.
• In progress → polls propagation; shows a stall hint after ~45s.
• Success → the domain is live.
• Error → retry, or switch to manual.

Overlays handle exit-confirm (Esc) and session-expired (on 401/403).

Next: install and embed the widget.