init project

contracts/phase9/interaction/INTERACTION_NOTES_v1.0.md

@@ -0,0 +1,33 @@
+# Interaction Notes
+
+## Navigation
+
+Anchor navigation updates the URL hash and lands the target below the sticky header using `scroll-margin-block-start`. Locale switching preserves only hashes listed for the route. Mobile navigation closes after an internal destination activates. Focus is returned only when the close action does not immediately navigate.
+
+## Drawer
+
+`closed → opening → open → closing → closed`. Opening stores the active element, sets `aria-expanded=true`, reveals backdrop, makes page landmarks inert, locks body scroll without layout shift, and focuses the close control. Tab and Shift+Tab remain inside. Escape and backdrop close unless a nested blocking dialog is active.
+
+## Dialogs
+
+Use native `<dialog>` when browser support and QA pass; otherwise use a proven accessible primitive. The trigger regains focus on close. Backdrop click is permitted when the form is idle. During submission, closing requires an explicit cancel decision so an in-flight request is not silently duplicated.
+
+## Demo validation
+
+Validation occurs on submit, then on change/blur for fields that are already invalid. A form summary uses `role=alert` or an announced live region. First invalid field receives focus after the summary is updated. Native input semantics remain. Email syntax validation is deliberately modest; the server remains authoritative.
+
+## Theme
+
+Apply preference immediately. Persist cookie and storage in one transaction. Broadcast changes through the `storage` event. In System mode, respond to `prefers-color-scheme` changes. Never animate the entire page between themes.
+
+## Product tour
+
+Opening starts at step one. Back is disabled on the first step. Next becomes Finish on the last. Step heading receives programmatic focus after each change. Progress text is localized and announced politely. Completion does not imply a video was watched.
+
+## FAQ
+
+Native `details/summary` is the baseline. Multiple items may remain open. Do not introduce accordion exclusivity without a content reason and a new decision.
+
+## Analytics
+
+Events are emitted through a vendor-neutral adapter after consent. Event payloads contain route, locale, resolved theme, direction, component/source ID, and non-PII state. Form field values and free text are forbidden. Development logs must be disabled in production.