feat: approval-gated visual executor + cursor + highlight + audit trail

[EpicStarAi]

P-VISUAL-EXECUTOR-1 — Visual Executor + Cursor + Action Highlight + Audit Trail

Approval-gated visual execution mode for the TMA AI Operator. After the user taps «Разрешить», the operator enters a controlled, observable flow: a visible AI cursor moves to targets, targets get phase-coloured highlights, a step progress panel offers pause/cancel/hide, the irreversible save requires a separate final confirmation, and every step is recorded to an audit trail.

UI-only + local demo executor. No Telegram send, no TDLib mutation, no changes to /client, backend, or VPS. The existing approval gate (pending/cancelled/approved) was reused, not rewritten.

State machine

idle → pending_approval → approved → executing → (paused) → awaiting_final_confirmation → completed | cancelled | failed

Demo scenario «Изменить bio на: TOP SECRET // AI MODE»: highlight profile card → cursor to «Изменить» → highlight → open sim form → highlight Bio → stage text in local React state only → awaiting_final_confirmation → [Назад] [Отмена] [Сохранить] → only «Сохранить» commits the local demo bio. Nothing reaches Telegram/external APIs.

DOM targeting allowlist (no text search, no arbitrary CSS, no eval)

profile-card, profile-edit-button, profile-bio-field, profile-save-button — resolved only via [data-epic-target="…"] after an allowlist check.

Safety invariants

• TELEGRAM_MUTATION is always false — no code path flips it.
• EXECUTION_MODE = local_demo.
• First approval authorises only the preparatory plan; the local save needs a second confirmation. No auto-save.
• Read-only chat requests never start the executor.

Files

• apps/web/lib/visualExecutor.ts — framework-agnostic state machine, allowlist, audit builder, cursor geometry/clamp, phase colours.
• apps/web/components/tma/VisualExecutorCursor.tsx — pointer-events:none EPIC💀CLAW cursor, reduced-motion aware.
• apps/web/components/tma/TelegramNativeProfile.tsx — wires executor, cursor, highlight overlay, progress panel, final confirmation, audit log; adds data-epic-target attributes.
• tests/visualExecutor.test.ts — 15 node:test cases.
• package.json — test script (node --test, zero new deps).

Verification

• Tests: 15/15 pass (npm test).
• Lint: next lint exit 0, no new warnings.
• Build: next build exit 0, /tma/profile 13 kB.
• E2E (browser): approve → cursor + phase-coloured highlights (violet→cyan→emerald→gold) → draft staged with «черновик» badge (bio uncommitted) → gate → Save commits local bio → cursor/highlight cleared; audit shows 10 events in correct order; TELEGRAM_MUTATION=false throughout.

Notes / blockers

• Branch was cut from origin/main (local main had diverged: 21 ahead / 27 behind, and the target files existed only on origin/main).
• Measurement uses a short setInterval rather than requestAnimationFrame so cursor/highlight tracking keeps working when the tab is backgrounded (rAF is paused for hidden tabs).
• Draft PR — no merge/deploy/restart. Production untouched.

🤖 Generated with Claude Code