@synod-ai/extension-feedback 0.1.1

package/dist/index.mjs

@@ -0,0 +1,3160 @@
+// src/client/types.ts
+function createClientError(code, message, statusCode, retryable = false) {
+  const err = new Error(message);
+  err.name = "ClientError";
+  err.code = code;
+  err.statusCode = statusCode;
+  err.retryable = retryable;
+  return err;
+}
+
+// src/utils/retry.ts
+var BACKOFF_DELAYS_MS = [1e3, 2e3, 4e3];
+function getBackoffDelay(attempt) {
+  if (attempt < 0 || attempt >= BACKOFF_DELAYS_MS.length) {
+    return void 0;
+  }
+  return BACKOFF_DELAYS_MS[attempt];
+}
+function isRetryable(status, error) {
+  if (error instanceof TypeError) return true;
+  if (error instanceof DOMException && error.name === "AbortError") return true;
+  if (error && typeof error === "object" && "name" in error && error.name === "AbortError") {
+    return true;
+  }
+  if (status === void 0) return true;
+  if (status >= 500 && status < 600) return true;
+  if (status === 429) return true;
+  return false;
+}
+
+// src/utils/config.ts
+var DEFAULT_GATEWAY_URL = "http://localhost:8787";
+var DEFAULT_TIMEOUT = 15e3;
+var DEFAULT_MAX_RETRIES = 3;
+var DEFAULT_KEY_COMBO = "Ctrl+Shift+E";
+function validateConfig(input) {
+  const missing = [];
+  if (!input.projectId || input.projectId.trim() === "") {
+    missing.push("projectId");
+  }
+  if (!input.token || input.token.trim() === "") {
+    missing.push("token");
+  }
+  if (missing.length > 0) {
+    throw new Error(
+      `[SynodFeedback] Missing required config field(s): ${missing.join(", ")}. Please provide these in init() or <FeedbackProvider config={...}>.`
+    );
+  }
+  const gatewayUrl = input.gatewayUrl ?? DEFAULT_GATEWAY_URL;
+  try {
+    new URL(gatewayUrl);
+  } catch {
+    throw new Error(
+      `[SynodFeedback] Invalid gatewayUrl: "${gatewayUrl}". Must be a valid URL.`
+    );
+  }
+  return {
+    gatewayUrl,
+    projectId: input.projectId,
+    token: input.token,
+    keyCombo: input.keyCombo ?? DEFAULT_KEY_COMBO,
+    timeout: input.timeout ?? DEFAULT_TIMEOUT,
+    maxRetries: input.maxRetries ?? DEFAULT_MAX_RETRIES
+  };
+}
+var MAX_CONTEXT_JSON_BYTES = 10240;
+function isContextJsonValid(contextJson) {
+  const serialized = JSON.stringify(contextJson);
+  return new TextEncoder().encode(serialized).length <= MAX_CONTEXT_JSON_BYTES;
+}
+
+// src/client/SynodFeedbackClient.ts
+var ENDPOINT_PATH = "/v2/findings/external";
+var SynodFeedbackClient = class {
+  constructor(config) {
+    this._queue = [];
+    this._abortControllers = [];
+    this.config = config;
+  }
+  // ── Queue Management ────────────────────────────────────────────────
+  /**
+   * Add a finding to the local batch queue.
+   * Pre-validates context_json size to prevent oversized payloads.
+   */
+  queue(finding) {
+    if (!isContextJsonValid(finding.context_json)) {
+      throw createClientError(
+        "CONTEXT_TOO_LARGE",
+        "context_json exceeds 10KB limit (serialized). Compress or remove screenshot data.",
+        void 0,
+        false
+      );
+    }
+    this._queue.push(finding);
+  }
+  /**
+   * Get the current queue length.
+   */
+  get queueLength() {
+    return this._queue.length;
+  }
+  /**
+   * Get a shallow copy of the current queue.
+   */
+  getQueueSnapshot() {
+    return [...this._queue];
+  }
+  /**
+   * Clear all items from the queue.
+   */
+  clearQueue() {
+    this._queue = [];
+  }
+  // ── Batch Send ──────────────────────────────────────────────────────
+  /**
+   * Send all queued findings as a batch to the gateway.
+   * On success (201): created items are dequeued; errored items remain.
+   * On full failure (after retries): entire batch remains in queue.
+   *
+   * @returns BatchResult with created and errors arrays
+   * @throws ClientError on full failure after retries, or on non-retryable error
+   */
+  async sendBatch() {
+    if (this._queue.length === 0) {
+      return { created: [], errors: [] };
+    }
+    const findingsToSend = [...this._queue];
+    const requestBody = {
+      project_id: this.config.projectId,
+      findings: findingsToSend
+    };
+    const response = await this.postWithRetry(requestBody);
+    const batchResult = this.processResponse(response, findingsToSend);
+    return batchResult;
+  }
+  // ── HTTP Transport with Retry ───────────────────────────────────────
+  /**
+   * POST to the gateway with retry/backoff logic.
+   * Retries up to maxRetries times on retryable failures (5xx, 429, network, timeout).
+   * Does NOT retry on 401 or other 4xx (except 429).
+   *
+   * Worst-case wall time: ~1s + timeout + 2s + timeout + 4s + timeout.
+   */
+  async postWithRetry(body) {
+    const maxRetries = this.config.maxRetries ?? 3;
+    let lastError = null;
+    for (let attempt = 0; attempt <= maxRetries; attempt++) {
+      if (attempt > 0) {
+        const delay = getBackoffDelay(attempt - 1);
+        if (delay !== void 0) {
+          await this.sleep(delay);
+        }
+      }
+      const controller = new AbortController();
+      this._abortControllers.push(controller);
+      const timeoutId = setTimeout(() => controller.abort(), this.config.timeout);
+      try {
+        const res = await fetch(`${this.config.gatewayUrl}${ENDPOINT_PATH}`, {
+          method: "POST",
+          headers: {
+            "Content-Type": "application/json",
+            Authorization: `Bearer ${this.config.token}`
+          },
+          body: JSON.stringify(body),
+          signal: controller.signal
+        });
+        clearTimeout(timeoutId);
+        if (res.ok) {
+          const data = await res.json();
+          return data;
+        }
+        const clientErr = this.classifyHttpError(res.status);
+        if (!isRetryable(res.status, null) || attempt >= maxRetries) {
+          throw clientErr;
+        }
+        lastError = clientErr;
+      } catch (err) {
+        clearTimeout(timeoutId);
+        if (isClientError(err)) {
+          if (!err.retryable || attempt >= maxRetries) {
+            throw err;
+          }
+          lastError = err;
+          continue;
+        }
+        const classified = this.classifyTransportError(err);
+        if (!classified.retryable || attempt >= maxRetries) {
+          throw classified;
+        }
+        lastError = classified;
+      } finally {
+        const idx = this._abortControllers.indexOf(controller);
+        if (idx >= 0) {
+          this._abortControllers.splice(idx, 1);
+        }
+      }
+    }
+    throw lastError ?? createClientError(
+      "NETWORK_ERROR",
+      "All retry attempts exhausted.",
+      void 0,
+      true
+    );
+  }
+  // ── Response Processing ─────────────────────────────────────────────
+  /**
+   * Process the gateway response: dequeue created items, retain errored items.
+   * Findings are matched by their position in the original sent batch.
+   */
+  processResponse(response, sentFindings) {
+    const errorIndices = new Set(response.errors.map((e) => e.index));
+    const createdIndices = [];
+    for (let i = 0; i < sentFindings.length; i++) {
+      if (!errorIndices.has(i)) {
+        createdIndices.push(i);
+      }
+    }
+    this.dequeueByIndices(createdIndices, sentFindings.length);
+    return {
+      created: response.created,
+      errors: response.errors
+    };
+  }
+  /**
+   * Remove successfully sent items from the live queue.
+   *
+   * The sentFindings were a snapshot of the queue at send time. We need to remove
+   * the successful ones while keeping the failed ones. Since they were all at the
+   * front of the queue (in order), we rebuild: remove createdIndices from [0..sentCount-1].
+   */
+  dequeueByIndices(keepIndices, sentCount) {
+    const removeIndices = new Set(keepIndices);
+    const remaining = [];
+    for (let i = 0; i < this._queue.length; i++) {
+      if (i < sentCount) {
+        if (!removeIndices.has(i)) {
+          remaining.push(this._queue[i]);
+        }
+      } else {
+        remaining.push(this._queue[i]);
+      }
+    }
+    this._queue = remaining;
+  }
+  // ── Error Classification ────────────────────────────────────────────
+  classifyHttpError(status) {
+    switch (true) {
+      case status === 401:
+        return createClientError(
+          "AUTH_ERROR",
+          "Authentication failed (401). Token is invalid or expired.",
+          401,
+          false
+        );
+      case status === 429:
+        return createClientError(
+          "RATE_LIMITED",
+          "Rate limited (429). Too many findings in the time window.",
+          429,
+          true
+        );
+      case (status >= 500 && status < 600):
+        return createClientError(
+          "SERVER_ERROR",
+          `Server error (${status}).`,
+          status,
+          true
+        );
+      case (status >= 400 && status < 500):
+        return createClientError(
+          "CLIENT_ERROR",
+          `Client error (${status}). Request rejected.`,
+          status,
+          false
+        );
+      default:
+        return createClientError(
+          "CLIENT_ERROR",
+          `Unexpected status ${status}.`,
+          status,
+          false
+        );
+    }
+  }
+  classifyTransportError(err) {
+    if (err instanceof TypeError) {
+      return createClientError(
+        "NETWORK_ERROR",
+        `Network error: ${err.message}`,
+        void 0,
+        true
+      );
+    }
+    if (err instanceof DOMException && err.name === "AbortError" || err && typeof err === "object" && "name" in err && err.name === "AbortError") {
+      return createClientError(
+        "TIMEOUT",
+        `Request timed out after ${this.config.timeout}ms.`,
+        void 0,
+        true
+      );
+    }
+    const message = err instanceof Error ? err.message : String(err);
+    return createClientError(
+      "NETWORK_ERROR",
+      `Unexpected transport error: ${message}`,
+      void 0,
+      false
+    );
+  }
+  // ── Cleanup ─────────────────────────────────────────────────────────
+  /**
+   * Abort all in-flight requests.
+   */
+  destroy() {
+    for (const controller of this._abortControllers) {
+      try {
+        controller.abort();
+      } catch {
+      }
+    }
+    this._abortControllers = [];
+  }
+  // ── Utilities ───────────────────────────────────────────────────────
+  sleep(ms) {
+    return new Promise((resolve) => setTimeout(resolve, ms));
+  }
+};
+function isClientError(err) {
+  return err instanceof Error && "code" in err && "retryable" in err;
+}
+
+// src/lifecycle/FeedbackManager.ts
+var FeedbackManager = class {
+  constructor() {
+    this._initialized = false;
+    this._enabled = false;
+    this._client = null;
+    this._config = null;
+    this._enableHandlers = [];
+    this._disableHandlers = [];
+  }
+  get initialized() {
+    return this._initialized;
+  }
+  get enabled() {
+    return this._enabled;
+  }
+  /** The active client instance, or null if not initialized. */
+  get client() {
+    return this._client;
+  }
+  /** The validated config, or null if not initialized. */
+  get config() {
+    return this._config;
+  }
+  // ── Lifecycle ───────────────────────────────────────────────────────
+  /**
+   * Initialize the feedback system with configuration.
+   * Creates the singleton client instance. Re-init replaces existing state.
+   */
+  init(config) {
+    const validated = validateConfig(config);
+    if (this._client) {
+      this._client.destroy();
+    }
+    this._client = new SynodFeedbackClient(validated);
+    this._config = validated;
+    this._initialized = true;
+    this._enabled = false;
+  }
+  /**
+   * Enable the feedback system. Fires all registered onEnable handlers.
+   */
+  enable() {
+    if (!this._initialized) {
+      throw new Error("[SynodFeedback] Cannot enable() before init(). Call init(config) first.");
+    }
+    if (this._enabled) return;
+    this._enabled = true;
+    for (const handler of [...this._enableHandlers]) {
+      handler();
+    }
+  }
+  /**
+   * Disable the feedback system. Fires all registered onDisable handlers.
+   */
+  disable() {
+    if (!this._initialized) return;
+    if (!this._enabled) return;
+    this._enabled = false;
+    for (const handler of [...this._disableHandlers]) {
+      handler();
+    }
+  }
+  // ── Extension Hooks (for SDG-294) ───────────────────────────────────
+  /**
+   * Register a handler to be called when enable() is invoked.
+   * If already enabled, the handler fires immediately.
+   * @returns unregister function
+   */
+  onEnable(handler) {
+    this._enableHandlers.push(handler);
+    if (this._enabled) {
+      handler();
+    }
+    return () => {
+      const idx = this._enableHandlers.indexOf(handler);
+      if (idx >= 0) this._enableHandlers.splice(idx, 1);
+    };
+  }
+  /**
+   * Register a handler to be called when disable() is invoked.
+   * @returns unregister function
+   */
+  onDisable(handler) {
+    this._disableHandlers.push(handler);
+    return () => {
+      const idx = this._disableHandlers.indexOf(handler);
+      if (idx >= 0) this._disableHandlers.splice(idx, 1);
+    };
+  }
+  // ── Convenience: delegate to client ─────────────────────────────────
+  queue(finding) {
+    this.requireClient();
+    this._client.queue(finding);
+  }
+  async sendBatch() {
+    this.requireClient();
+    return this._client.sendBatch();
+  }
+  get queueLength() {
+    return this._client?.queueLength ?? 0;
+  }
+  getQueueSnapshot() {
+    return this._client?.getQueueSnapshot() ?? [];
+  }
+  /**
+   * Clear all items from the queue.
+   */
+  clearQueue() {
+    this._client?.clearQueue();
+  }
+  /**
+   * Replace the entire queue with the given items.
+   * Used by the interaction layer for remove/edit operations.
+   */
+  replaceQueue(items) {
+    if (!this._client) return;
+    this._client.clearQueue();
+    for (const item of items) {
+      this._client.queue(item);
+    }
+  }
+  // ── Teardown ────────────────────────────────────────────────────────
+  /**
+   * Reset the manager to uninitialized state.
+   * Destroys client, clears handlers.
+   */
+  destroy() {
+    this._client?.destroy();
+    this._client = null;
+    this._initialized = false;
+    this._enabled = false;
+    this._enableHandlers = [];
+    this._disableHandlers = [];
+  }
+  requireClient() {
+    if (!this._initialized || !this._client) {
+      throw new Error("[SynodFeedback] Not initialized. Call init(config) first.");
+    }
+  }
+};
+
+// src/utils/overlay-css.ts
+var OVERLAY_CSS = `
+:host {
+  all: initial;
+}
+
+*, *::before, *::after {
+  box-sizing: border-box;
+  font-family: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
+}
+
+/* \u2500\u2500 Shared variables (internal only) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
+.synod-fb {
+  --fb-bg-panel: #1e293b;
+  --fb-bg-elevated: #334155;
+  --fb-bg-input: #0f172a;
+  --fb-bg-hover: #475569;
+  --fb-border: #475569;
+  --fb-border-subtle: #334155;
+  --fb-text-primary: #f1f5f9;
+  --fb-text-secondary: #94a3b8;
+  --fb-text-muted: #64748b;
+  --fb-accent: #0d9488;
+  --fb-accent-hover: #0f766e;
+  --fb-highlight: #2DAFAF;
+  --fb-highlight-fill: rgba(45, 175, 175, 0.08);
+  --fb-sev-low: #64748b;
+  --fb-sev-medium: #d97706;
+  --fb-sev-high: #dc2626;
+  --fb-success: #059669;
+  --fb-error: #dc2626;
+  --fb-radius-sm: 4px;
+  --fb-radius-md: 8px;
+  --fb-radius-lg: 12px;
+  --fb-shadow-panel: 0 8px 32px rgba(0,0,0,0.3);
+  --fb-shadow-popover: 0 4px 16px rgba(0,0,0,0.2);
+}
+
+/* \u2500\u2500 Highlighter \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
+.synod-fb-highlighter {
+  position: absolute;
+  pointer-events: none;
+  border: 2px dashed #2DAFAF;
+  background: rgba(45, 175, 175, 0.08);
+  border-radius: 2px;
+  z-index: 1;
+  transition: all 0ms;
+}
+
+.synod-fb-inspector {
+  position: absolute;
+  pointer-events: none;
+  background: #1F8F8F;
+  color: #ffffff;
+  font-size: 11px;
+  font-family: 'SF Mono', 'Cascadia Code', 'Consolas', monospace;
+  line-height: 20px;
+  height: 20px;
+  padding: 0 8px;
+  border-radius: 4px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 400px;
+  z-index: 2;
+}
+
+.synod-fb-highlighter-logo {
+  position: absolute;
+  pointer-events: none;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 20px;
+  height: 20px;
+  background: #0f172a;
+  border: 1px solid #2DAFAF;
+  border-radius: 4px;
+  z-index: 3;
+}
+
+/* \u2500\u2500 Floating logo \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
+.synod-fb-logo {
+  position: absolute;
+  width: 36px;
+  height: 36px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: grab;
+  user-select: none;
+  pointer-events: auto;
+  transition: transform 150ms ease-out, filter 150ms ease-out;
+  z-index: 10;
+  filter: drop-shadow(0 2px 6px rgba(0,0,0,0.25));
+}
+
+.synod-fb-logo svg {
+  width: 32px;
+  height: 32px;
+  pointer-events: none;
+}
+
+.synod-fb-logo:hover {
+  transform: scale(1.08);
+  filter: drop-shadow(0 4px 10px rgba(0,0,0,0.35));
+}
+
+.synod-fb-logo:active {
+  cursor: grabbing;
+  transform: scale(0.96);
+}
+
+.synod-fb-logo-badge {
+  position: absolute;
+  top: -3px;
+  right: -3px;
+  min-width: 18px;
+  height: 18px;
+  border-radius: 9px;
+  /* Synod teal \u2014 replaces the previous generic red. Reads as brand chrome
+     rather than a notifications-style alert. */
+  background: #0d9488;
+  color: #ffffff;
+  font-size: 11px;
+  font-weight: 700;
+  font-family: 'SF Mono', 'Cascadia Code', 'Consolas', monospace;
+  line-height: 18px;
+  text-align: center;
+  padding: 0 4px;
+  letter-spacing: -0.2px;
+  /* Double-ring outline: white inner ring guarantees contrast on dark
+     backgrounds; the semi-opaque dark outer ring guarantees contrast on
+     light backgrounds. Together they pop on any backdrop without needing
+     per-site tuning. */
+  border: 2px solid #ffffff;
+  box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.55), 0 1px 3px rgba(0, 0, 0, 0.25);
+}
+
+.synod-fb-logo-badge-pulse {
+  animation: synod-fb-badge-pulse 300ms ease-in-out;
+}
+
+@keyframes synod-fb-badge-pulse {
+  0%, 100% { transform: scale(1); }
+  50% { transform: scale(1.15); }
+}
+
+/* \u2500\u2500 Logo context menu \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
+.synod-fb-context-menu {
+  position: absolute;
+  min-width: 160px;
+  background: #1e293b;
+  border: 1px solid #475569;
+  border-radius: 6px;
+  box-shadow: 0 8px 24px rgba(0,0,0,0.35);
+  padding: 4px;
+  z-index: 50;
+  pointer-events: auto;
+  font-family: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
+  animation: synod-fb-fade-in 100ms ease-out;
+}
+
+.synod-fb-context-menu-item {
+  display: block;
+  width: 100%;
+  text-align: left;
+  padding: 6px 10px;
+  background: transparent;
+  border: none;
+  border-radius: 4px;
+  color: #f1f5f9;
+  font-size: 12px;
+  font-weight: 500;
+  cursor: pointer;
+  font-family: inherit;
+}
+
+.synod-fb-context-menu-item:hover {
+  background: #dc2626;
+  color: #fff;
+}
+
+/* \u2500\u2500 Charge indicator \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
+.synod-fb-charge {
+  position: absolute;
+  pointer-events: none;
+  z-index: 15;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 40px;
+  height: 40px;
+  transform: translate(-50%, -50%);
+  transition: transform 120ms ease-out;
+}
+
+.synod-fb-charge-ring {
+  position: absolute;
+  inset: 0;
+  width: 40px;
+  height: 40px;
+  transform: rotate(-90deg);
+}
+
+.synod-fb-charge-ring-bg {
+  fill: none;
+  stroke: rgba(45, 175, 175, 0.18);
+  stroke-width: 3;
+}
+
+.synod-fb-charge-ring-fg {
+  fill: none;
+  stroke: #2DAFAF;
+  stroke-width: 3;
+  stroke-linecap: round;
+  transition: stroke-dashoffset 60ms linear, stroke 200ms ease-out;
+}
+
+.synod-fb-charge svg:not(.synod-fb-charge-ring) {
+  width: 22px;
+  height: 22px;
+  filter: drop-shadow(0 2px 6px rgba(0,0,0,0.3));
+}
+
+.synod-fb-charge.charged {
+  transform: translate(-50%, -50%) scale(1.15);
+}
+
+.synod-fb-charge.charged .synod-fb-charge-ring-fg {
+  stroke: #36D6D6;
+}
+
+/* \u2500\u2500 IssueForm \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
+.synod-fb-form {
+  position: absolute;
+  width: 340px;
+  max-height: 90vh;
+  overflow-y: auto;
+  background: #1e293b;
+  border: 1px solid #475569;
+  border-radius: 8px;
+  box-shadow: 0 8px 32px rgba(0,0,0,0.3);
+  z-index: 20;
+  pointer-events: auto;
+  color: #f1f5f9;
+  font-family: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
+  animation: synod-fb-fade-in 150ms ease-out;
+}
+
+@keyframes synod-fb-fade-in {
+  from { opacity: 0; }
+  to { opacity: 1; }
+}
+
+.synod-fb-form-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 8px 12px;
+  background: #334155;
+  border-radius: 8px 8px 0 0;
+  border-bottom: 1px solid #475569;
+  gap: 8px;
+}
+
+.synod-fb-form-header-logo {
+  display: flex;
+  align-items: center;
+  flex-shrink: 0;
+}
+
+.synod-fb-form-header-text {
+  flex: 1;
+  font-size: 11px;
+  font-family: 'SF Mono', 'Cascadia Code', 'Consolas', monospace;
+  color: #94a3b8;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.synod-fb-form-close {
+  background: none;
+  border: none;
+  color: #94a3b8;
+  cursor: pointer;
+  font-size: 16px;
+  padding: 0 4px;
+  line-height: 1;
+}
+
+.synod-fb-form-close:hover { color: #f1f5f9; }
+
+.synod-fb-form-body { padding: 12px; }
+
+.synod-fb-field { margin-bottom: 12px; }
+
+.synod-fb-label {
+  display: block;
+  font-size: 11px;
+  font-weight: 500;
+  color: #94a3b8;
+  margin-bottom: 4px;
+}
+
+.synod-fb-input,
+.synod-fb-textarea {
+  width: 100%;
+  background: #0f172a;
+  border: 1px solid #475569;
+  border-radius: 4px;
+  color: #f1f5f9;
+  font-size: 13px;
+  font-family: inherit;
+  padding: 8px 10px;
+  outline: none;
+  resize: vertical;
+}
+
+.synod-fb-input:focus,
+.synod-fb-textarea:focus {
+  border-color: #0d9488;
+}
+
+.synod-fb-textarea {
+  min-height: 48px;
+}
+
+.synod-fb-severity-group {
+  display: flex;
+  gap: 0;
+  border-radius: 4px;
+  overflow: hidden;
+  border: 1px solid #475569;
+}
+
+.synod-fb-sev-btn {
+  flex: 1;
+  padding: 6px 0;
+  border: none;
+  background: transparent;
+  color: #94a3b8;
+  font-size: 12px;
+  font-weight: 500;
+  cursor: pointer;
+  transition: background 100ms;
+}
+
+.synod-fb-sev-btn:not(:last-child) {
+  border-right: 1px solid #475569;
+}
+
+.synod-fb-sev-btn:hover { background: #475569; }
+
+.synod-fb-sev-btn.active[data-sev="low"] { background: #64748b; color: #fff; }
+.synod-fb-sev-btn.active[data-sev="medium"] { background: #d97706; color: #fff; }
+.synod-fb-sev-btn.active[data-sev="high"] { background: #dc2626; color: #fff; }
+
+.synod-fb-screenshot-toggle {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 8px 10px;
+  background: #0f172a;
+  border: 1px solid #475569;
+  border-radius: 4px;
+  cursor: pointer;
+  font-size: 12px;
+  color: #94a3b8;
+}
+
+.synod-fb-screenshot-toggle:hover { border-color: #64748b; }
+
+.synod-fb-screenshot-toggle input { accent-color: #0d9488; }
+
+.synod-fb-screenshot-toggle.disabled {
+  opacity: 0.6;
+  cursor: not-allowed;
+}
+
+.synod-fb-screenshot-toggle.unavailable {
+  color: #d97706;
+}
+
+.synod-fb-form-actions {
+  display: flex;
+  gap: 8px;
+  margin-top: 4px;
+}
+
+.synod-fb-btn-secondary {
+  flex: 1;
+  padding: 8px 12px;
+  border: 1px solid #0d9488;
+  background: transparent;
+  color: #0d9488;
+  font-size: 12px;
+  font-weight: 500;
+  border-radius: 4px;
+  cursor: pointer;
+  font-family: inherit;
+}
+
+.synod-fb-btn-secondary:hover { background: #0d9488; color: #fff; }
+
+.synod-fb-btn-primary {
+  flex: 1;
+  padding: 8px 12px;
+  border: none;
+  background: #0d9488;
+  color: #fff;
+  font-size: 12px;
+  font-weight: 500;
+  border-radius: 4px;
+  cursor: pointer;
+  font-family: inherit;
+}
+
+.synod-fb-btn-primary:hover { background: #0f766e; }
+.synod-fb-btn-primary:active { transform: scale(0.98); }
+.synod-fb-btn-primary:disabled { background: #334155; color: #64748b; cursor: not-allowed; }
+
+/* \u2500\u2500 QueuePanel \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
+.synod-fb-queue {
+  position: absolute;
+  top: 16px;
+  right: 16px;
+  width: 380px;
+  max-width: calc(100vw - 32px);
+  max-height: min(520px, calc(100vh - 32px));
+  background: #1e293b;
+  border: 1px solid #475569;
+  border-radius: 8px;
+  box-shadow: 0 8px 32px rgba(0,0,0,0.3);
+  z-index: 30;
+  pointer-events: auto;
+  display: flex;
+  flex-direction: column;
+  color: #f1f5f9;
+  font-family: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
+  animation: synod-fb-slide-in 200ms cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+@keyframes synod-fb-slide-in {
+  from { transform: translateX(400px); opacity: 0; }
+  to { transform: translateX(0); opacity: 1; }
+}
+
+.synod-fb-queue-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 12px 16px;
+  border-bottom: 1px solid #334155;
+  gap: 8px;
+}
+
+.synod-fb-queue-header-logo {
+  display: flex;
+  align-items: center;
+  flex-shrink: 0;
+}
+
+.synod-fb-queue-title {
+  font-size: 14px;
+  font-weight: 600;
+  color: #f1f5f9;
+}
+
+.synod-fb-queue-body {
+  flex: 1;
+  overflow-y: auto;
+  padding: 8px;
+}
+
+.synod-fb-queue-empty {
+  padding: 24px 16px;
+  text-align: center;
+  color: #64748b;
+  font-size: 13px;
+}
+
+.synod-fb-queue-item {
+  display: flex;
+  align-items: flex-start;
+  gap: 8px;
+  padding: 8px;
+  border-radius: 4px;
+  border: 1px solid transparent;
+  margin-bottom: 4px;
+}
+
+.synod-fb-queue-item:hover { background: #334155; }
+
+.synod-fb-queue-item-error {
+  font-size: 11px;
+  color: #dc2626;
+  padding: 4px 8px 8px;
+}
+
+.synod-fb-queue-item-thumb {
+  width: 44px;
+  height: 44px;
+  min-width: 44px;
+  border-radius: 4px;
+  border: 1px dashed #475569;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  overflow: hidden;
+}
+
+.synod-fb-queue-item-thumb img {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+}
+
+.synod-fb-queue-item-content {
+  flex: 1;
+  min-width: 0;
+}
+
+.synod-fb-queue-item-title {
+  font-size: 12px;
+  color: #f1f5f9;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.synod-fb-queue-item-title.synod-fb-pending {
+  color: #64748b;
+  font-style: italic;
+}
+
+.synod-fb-queue-item-meta {
+  font-size: 10px;
+  font-family: 'SF Mono', 'Cascadia Code', 'Consolas', monospace;
+  color: #64748b;
+}
+
+.synod-fb-queue-item-actions {
+  display: flex;
+  gap: 4px;
+}
+
+.synod-fb-icon-btn {
+  background: none;
+  border: none;
+  color: #94a3b8;
+  cursor: pointer;
+  font-size: 14px;
+  padding: 2px;
+  line-height: 1;
+}
+
+.synod-fb-icon-btn:hover { color: #f1f5f9; }
+
+.synod-fb-queue-footer {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 12px 16px;
+  border-top: 1px solid #334155;
+  gap: 8px;
+}
+
+.synod-fb-btn-danger {
+  padding: 6px 12px;
+  border: 1px solid #475569;
+  background: transparent;
+  color: #dc2626;
+  font-size: 12px;
+  font-weight: 500;
+  border-radius: 4px;
+  cursor: pointer;
+  font-family: inherit;
+}
+
+.synod-fb-btn-danger:hover { background: #dc2626; color: #fff; border-color: #dc2626; }
+
+.synod-fb-queue-banner {
+  padding: 8px 12px;
+  margin: 8px;
+  border-radius: 4px;
+  font-size: 12px;
+}
+
+.synod-fb-queue-banner.error {
+  background: rgba(220, 38, 38, 0.15);
+  color: #fca5a5;
+  border: 1px solid rgba(220, 38, 38, 0.3);
+}
+
+.synod-fb-queue-banner.info {
+  background: rgba(13, 148, 136, 0.15);
+  color: #5eead4;
+  border: 1px solid rgba(13, 148, 136, 0.3);
+}
+
+/* \u2500\u2500 Toasts \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
+.synod-fb-toast-container {
+  position: absolute;
+  bottom: 16px;
+  left: 50%;
+  transform: translateX(-50%);
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  z-index: 100;
+  pointer-events: none;
+}
+
+.synod-fb-toast {
+  max-width: 400px;
+  min-height: 36px;
+  padding: 8px 16px;
+  border-radius: 6px;
+  font-size: 12px;
+  font-weight: 500;
+  font-family: inherit;
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  animation: synod-fb-toast-in 200ms ease-out;
+  white-space: nowrap;
+}
+
+.synod-fb-toast-logo {
+  display: flex;
+  align-items: center;
+  flex-shrink: 0;
+}
+
+@keyframes synod-fb-toast-in {
+  from { transform: translateY(20px); opacity: 0; }
+  to { transform: translateY(0); opacity: 1; }
+}
+
+.synod-fb-toast.success { background: #065f46; color: #d1fae5; }
+.synod-fb-toast.error { background: #991b1b; color: #fee2e2; }
+.synod-fb-toast.info { background: #1e3a5f; color: #dbeafe; }
+
+/* \u2500\u2500 Tooltip \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
+.synod-fb-tooltip {
+  position: absolute;
+  padding: 4px 10px;
+  background: #0f172a;
+  color: #94a3b8;
+  font-size: 11px;
+  border-radius: 4px;
+  border: 1px solid #334155;
+  white-space: nowrap;
+  z-index: 5;
+  pointer-events: none;
+  animation: synod-fb-fade-in 150ms ease-out;
+}
+
+/* \u2500\u2500 Focus-visible \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
+button:focus-visible,
+input:focus-visible,
+textarea:focus-visible {
+  outline: 2px solid #0d9488;
+  outline-offset: 2px;
+}
+
+/* \u2500\u2500 Reduced motion \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
+@media (prefers-reduced-motion: reduce) {
+  *, *::before, *::after {
+    animation-duration: 0ms !important;
+    animation-delay: 0ms !important;
+    transition-duration: 0ms !important;
+  }
+  .synod-fb-queue {
+    animation: none;
+    opacity: 1;
+  }
+  .synod-fb-form {
+    animation: none;
+    opacity: 1;
+  }
+  .synod-fb-toast {
+    animation: none;
+    opacity: 1;
+  }
+}
+`;
+
+// src/ui/FeedbackOverlay.ts
+var HOST_ID = "synod-fb-host";
+var MAX_Z = 2147483647;
+var FeedbackOverlay = class {
+  constructor() {
+    this._host = null;
+    this._shadowRoot = null;
+    this._contentWrapper = null;
+  }
+  /** Whether the overlay is currently mounted. */
+  get isMounted() {
+    return this._host !== null && this._host.isConnected;
+  }
+  /** The shadow root (available only while mounted). */
+  get root() {
+    return this._shadowRoot;
+  }
+  /** The host element ID. */
+  get hostId() {
+    return HOST_ID;
+  }
+  /**
+   * Get the actual host DOM element (for contains() checks by the picker).
+   * Returns null if not mounted.
+   */
+  getHostElement() {
+    return this._host;
+  }
+  /**
+   * Mount the overlay host to the given parent element (usually document.body).
+   * Creates a closed shadow root, injects CSS, and sets up the content wrapper.
+   *
+   * Idempotent: if already mounted, returns without re-creating.
+   */
+  mount(parent) {
+    if (this.isMounted) return;
+    const host = document.createElement("div");
+    host.id = HOST_ID;
+    host.style.cssText = `position: fixed; inset: 0; z-index: ${MAX_Z}; pointer-events: none;`;
+    const shadowRoot = host.attachShadow({ mode: "closed" });
+    const style = document.createElement("style");
+    style.textContent = OVERLAY_CSS;
+    shadowRoot.appendChild(style);
+    const contentWrapper = document.createElement("div");
+    contentWrapper.className = "synod-fb";
+    shadowRoot.appendChild(contentWrapper);
+    parent.appendChild(host);
+    this._host = host;
+    this._shadowRoot = shadowRoot;
+    this._contentWrapper = contentWrapper;
+  }
+  /**
+   * Unmount the overlay: remove host element, null references.
+   * Safe to call even if not mounted.
+   */
+  unmount() {
+    if (this._host && this._host.parentElement) {
+      this._host.parentElement.removeChild(this._host);
+    }
+    this._host = null;
+    this._shadowRoot = null;
+    this._contentWrapper = null;
+  }
+  /**
+   * Get the content wrapper element inside the shadow root.
+   * Children append their DOM nodes to this wrapper.
+   */
+  getContentWrapper() {
+    return this._contentWrapper;
+  }
+  /**
+   * Check whether a given element is inside the overlay host.
+   */
+  contains(element) {
+    if (!element || !this._host) return false;
+    return this._host === element || this._host.contains(element);
+  }
+};
+
+// src/utils/logo.ts
+var SYNOD_LOGO_SVG_MARKUP = `<svg viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M50 15 L72 52 H28 Z" fill="#36D6D6" />
+  <path d="M50 15 L72 52 H28 Z" fill="#2DAFAF" transform="rotate(120 50 58)" />
+  <path d="M50 15 L72 52 H28 Z" fill="#1F8F8F" transform="rotate(240 50 58)" />
+  <circle cx="50" cy="58" r="4" fill="white" />
+</svg>`;
+function createSynodLogo(size) {
+  const doc = new DOMParser().parseFromString(SYNOD_LOGO_SVG_MARKUP, "image/svg+xml");
+  const svg = doc.documentElement;
+  svg.setAttribute("width", String(size));
+  svg.setAttribute("height", String(size));
+  svg.setAttribute("aria-hidden", "true");
+  return svg;
+}
+
+// src/interaction/Highlighter.ts
+var Highlighter = class {
+  constructor(overlay2) {
+    this._highlightEl = null;
+    this._inspectorEl = null;
+    this._logoEl = null;
+    this._overlay = overlay2;
+  }
+  /**
+   * Show highlight at the target element's bounding rect.
+   * Updates the inspector chip with tag, id/classes, and dimensions.
+   */
+  highlight(element) {
+    if (!element.isConnected) {
+      this.clear();
+      return;
+    }
+    const wrapper = this._overlay.getContentWrapper();
+    if (!wrapper) return;
+    if (!this._highlightEl) {
+      this._highlightEl = document.createElement("div");
+      this._highlightEl.className = "synod-fb-highlighter";
+      wrapper.appendChild(this._highlightEl);
+    }
+    if (!this._inspectorEl) {
+      this._inspectorEl = document.createElement("div");
+      this._inspectorEl.className = "synod-fb-inspector";
+      this._inspectorEl.setAttribute("aria-hidden", "true");
+      wrapper.appendChild(this._inspectorEl);
+    }
+    if (!this._logoEl) {
+      this._logoEl = document.createElement("div");
+      this._logoEl.className = "synod-fb-highlighter-logo";
+      this._logoEl.setAttribute("aria-hidden", "true");
+      this._logoEl.appendChild(createSynodLogo(14));
+      wrapper.appendChild(this._logoEl);
+    }
+    const rect = element.getBoundingClientRect();
+    this._highlightEl.style.display = "block";
+    this._highlightEl.style.left = `${rect.left}px`;
+    this._highlightEl.style.top = `${rect.top}px`;
+    this._highlightEl.style.width = `${rect.width}px`;
+    this._highlightEl.style.height = `${rect.height}px`;
+    const chipText = this.buildInspectorText(element, rect);
+    this._inspectorEl.style.display = "block";
+    this._inspectorEl.textContent = chipText;
+    const chipTop = rect.top > 24 ? rect.top - 24 : rect.bottom + 4;
+    this._inspectorEl.style.left = `${rect.left}px`;
+    this._inspectorEl.style.top = `${chipTop}px`;
+    this._logoEl.style.display = rect.width < 30 || rect.height < 30 ? "none" : "block";
+    if (this._logoEl.style.display === "block") {
+      this._logoEl.style.left = `${rect.left - 18}px`;
+      this._logoEl.style.top = `${rect.top - 18}px`;
+    }
+  }
+  /**
+   * Clear the highlight overlay and inspector chip.
+   */
+  clear() {
+    if (this._highlightEl) {
+      this._highlightEl.style.display = "none";
+    }
+    if (this._inspectorEl) {
+      this._inspectorEl.style.display = "none";
+    }
+    if (this._logoEl) {
+      this._logoEl.style.display = "none";
+    }
+  }
+  /**
+   * Remove all DOM nodes created by this Highlighter.
+   */
+  destroy() {
+    this._highlightEl?.remove();
+    this._inspectorEl?.remove();
+    this._logoEl?.remove();
+    this._highlightEl = null;
+    this._inspectorEl = null;
+    this._logoEl = null;
+  }
+  /**
+   * Build the inspector chip text: tagname + id/classes + dimensions.
+   */
+  buildInspectorText(element, rect) {
+    const tag = element.tagName.toLowerCase();
+    let id = element.id ? `#${element.id}` : "";
+    let classStr = "";
+    if (element.classList.length > 0) {
+      classStr = "." + Array.from(element.classList).join(".");
+      if (classStr.length > 40) {
+        classStr = classStr.substring(0, 37) + "\u2026";
+      }
+    }
+    const identifier = id || classStr ? `${id}${classStr}` : tag;
+    const dimensions = `${Math.round(rect.width)}\xD7${Math.round(rect.height)}`;
+    return `${identifier}  \xB7  ${dimensions}`;
+  }
+};
+
+// src/interaction/SelectionExtractor.ts
+function truncateText(text, max) {
+  const trimmed = text.trim().replace(/\s+/g, " ");
+  if (trimmed.length <= max) return trimmed;
+  return trimmed.substring(0, max) + "\u2026";
+}
+var NOISY_ATTRS = /* @__PURE__ */ new Set([
+  "srcset",
+  "data-srcset",
+  "integrity",
+  "onload",
+  "onerror",
+  "onclick",
+  "onmouseover",
+  "onsubmit"
+]);
+function extractAttributes(element) {
+  const out = {};
+  for (let i = 0; i < element.attributes.length; i++) {
+    const attr = element.attributes[i];
+    const name = attr.name.toLowerCase();
+    if (NOISY_ATTRS.has(name)) continue;
+    const value = attr.value;
+    if (value.length > 200) continue;
+    out[name] = value;
+  }
+  return out;
+}
+function extractParentChain(element) {
+  const chain = [];
+  let current = element.parentElement;
+  while (current && current.nodeType === 1) {
+    const id = current.id || void 0;
+    const cls = (current.getAttribute("class") ?? "").trim() || void 0;
+    if (id || cls) {
+      const entry = {
+        tag: current.tagName.toLowerCase()
+      };
+      if (id) entry.id = id;
+      if (cls) entry.className = cls;
+      chain.unshift(entry);
+    }
+    if (current.tagName === "HTML") break;
+    current = current.parentElement;
+  }
+  return chain;
+}
+function truncateHtml(html, max) {
+  if (html.length <= max) return html;
+  const slice = html.substring(0, max - 1);
+  const lastLt = slice.lastIndexOf("<");
+  const cleaned = lastLt > max - 30 && !slice.slice(lastLt).includes(">") ? slice.substring(0, lastLt) : slice;
+  return cleaned + "\u2026";
+}
+function extract(element) {
+  const rect = element.getBoundingClientRect();
+  return {
+    tagName: element.tagName.toLowerCase(),
+    elementText: truncateText(element.textContent ?? "", 200),
+    elementHtml: truncateHtml(element.outerHTML, 1500),
+    elementAttributes: extractAttributes(element),
+    parentChain: extractParentChain(element),
+    boundingRect: {
+      left: Math.round(rect.left),
+      top: Math.round(rect.top),
+      width: Math.round(rect.width),
+      height: Math.round(rect.height)
+    }
+  };
+}
+
+// src/interaction/ElementPicker.ts
+var ElementPicker = class {
+  constructor(options) {
+    this._controller = null;
+    this._active = false;
+    this._rafId = null;
+    this._pendingEvent = null;
+    // ── Event handlers ──────────────────────────────────────────────────
+    this.onMouseMove = (e) => {
+      this._pendingEvent = e;
+      if (this._rafId !== null) return;
+      this._rafId = requestAnimationFrame(() => {
+        this._rafId = null;
+        const evt = this._pendingEvent;
+        if (!evt) return;
+        const target = evt.target;
+        if (!target || target.nodeType !== 1) return;
+        if (this._options.overlayHostElement.contains(target)) return;
+        if (target === document.body || target === document.documentElement) return;
+        this._options.highlighter.highlight(target);
+      });
+    };
+    this.onClick = (e) => {
+      e.preventDefault();
+      e.stopPropagation();
+      const target = e.target;
+      if (!target || target.nodeType !== 1) return;
+      if (this._options.overlayHostElement.contains(target)) return;
+      if (!target.isConnected) return;
+      let context;
+      try {
+        context = extract(target);
+      } catch {
+        return;
+      }
+      this._options.onElementClick(target, context);
+    };
+    this.onKeyDown = (e) => {
+      if (e.key === "Escape") {
+        e.preventDefault();
+        e.stopPropagation();
+        this._options.onEscape();
+      }
+    };
+    this.onScroll = () => {
+      if (this._rafId !== null) return;
+      this._rafId = requestAnimationFrame(() => {
+        this._rafId = null;
+        const evt = this._pendingEvent;
+        if (!evt) return;
+        const target = evt.target;
+        if (target && target.isConnected && !this._options.overlayHostElement.contains(target)) {
+          this._options.highlighter.highlight(target);
+        }
+      });
+    };
+    this._options = options;
+  }
+  get isActive() {
+    return this._active;
+  }
+  /**
+   * Activate the picker: attach capture-phase listeners to document.
+   * No-op if already active (state machine guard).
+   */
+  activate() {
+    if (this._active) return;
+    this._controller = new AbortController();
+    this._active = true;
+    const signal = this._controller.signal;
+    document.addEventListener("mousemove", this.onMouseMove, { capture: true, signal });
+    document.addEventListener("click", this.onClick, { capture: true, signal });
+    document.addEventListener("keydown", this.onKeyDown, { capture: true, signal });
+    document.addEventListener("scroll", this.onScroll, { capture: true, signal });
+  }
+  /**
+   * Deactivate the picker: abort controller removes all listeners atomically.
+   * Safe to call even if not active.
+   */
+  deactivate() {
+    if (!this._active) return;
+    this._controller?.abort();
+    this._controller = null;
+    this._active = false;
+    if (this._rafId !== null) {
+      cancelAnimationFrame(this._rafId);
+      this._rafId = null;
+    }
+    this._pendingEvent = null;
+    this._options.highlighter.clear();
+  }
+};
+
+// src/interaction/KeyComboDetector.ts
+var DEFAULT_HOLD_MS = 2e3;
+var DEFAULT_COMBO = {
+  ctrl: true,
+  shift: true,
+  key: "e"
+};
+function parseCombo(comboStr) {
+  if (!comboStr) return DEFAULT_COMBO;
+  const lower = comboStr.toLowerCase();
+  const parts = lower.split("+").map((p) => p.trim());
+  const config = { key: "" };
+  for (const part of parts) {
+    switch (part) {
+      case "ctrl":
+      case "control":
+        config.ctrl = true;
+        break;
+      case "shift":
+        config.shift = true;
+        break;
+      case "alt":
+        config.alt = true;
+        break;
+      default:
+        config.key = part;
+    }
+  }
+  if (!config.key) return DEFAULT_COMBO;
+  return config;
+}
+var KeyComboDetector = class {
+  constructor(comboStr, callbacks, holdMs = DEFAULT_HOLD_MS) {
+    this._controller = null;
+    // Charge state
+    this._chargeStart = 0;
+    this._charging = false;
+    this._charged = false;
+    this._rafId = null;
+    // ── Handlers ────────────────────────────────────────────────────────
+    this.onKeyDown = (e) => {
+      if (!this.matchesCombo(e)) return;
+      if (this._charging || this._charged) return;
+      this._charging = true;
+      this._charged = false;
+      this._chargeStart = performance.now();
+      this._callbacks.onChargeStart?.();
+      this.tick();
+    };
+    this.onKeyUp = (e) => {
+      if (!this.isComboKey(e.key.toLowerCase())) return;
+      const wasCharging = this._charging;
+      const wasCharged = this._charged;
+      this.cancelRaf();
+      this._charging = false;
+      this._charged = false;
+      this._chargeStart = 0;
+      if (wasCharging || wasCharged) {
+        this._callbacks.onChargeCancel?.();
+      }
+    };
+    this.tick = () => {
+      if (!this._charging) return;
+      const elapsed = performance.now() - this._chargeStart;
+      const frac = Math.min(1, elapsed / this._holdMs);
+      this._callbacks.onChargeProgress?.(frac);
+      if (frac >= 1) {
+        this._charging = false;
+        this._charged = true;
+        this.cancelRaf();
+        this._callbacks.onCharged?.();
+        return;
+      }
+      this._rafId = requestAnimationFrame(this.tick);
+    };
+    this._combo = parseCombo(comboStr);
+    this._holdMs = holdMs;
+    this._callbacks = callbacks;
+  }
+  /** Start listening for the key combo. */
+  start() {
+    if (this._controller) return;
+    this._controller = new AbortController();
+    const signal = this._controller.signal;
+    document.addEventListener("keydown", this.onKeyDown, { capture: true, signal });
+    document.addEventListener("keyup", this.onKeyUp, { capture: true, signal });
+  }
+  /** Stop listening. Cancels any in-flight charge. */
+  stop() {
+    this._controller?.abort();
+    this._controller = null;
+    this.cancelRaf();
+    this._charging = false;
+    this._charged = false;
+    this._chargeStart = 0;
+  }
+  /** Check if a KeyboardEvent matches the configured combo. */
+  matchesCombo(e) {
+    if (this._combo.ctrl && !e.ctrlKey) return false;
+    if (this._combo.shift && !e.shiftKey) return false;
+    if (this._combo.alt && !e.altKey) return false;
+    return e.key.toLowerCase() === this._combo.key;
+  }
+  cancelRaf() {
+    if (this._rafId !== null) {
+      cancelAnimationFrame(this._rafId);
+      this._rafId = null;
+    }
+  }
+  isComboKey(key) {
+    if (key === this._combo.key) return true;
+    if (this._combo.ctrl && key === "control") return true;
+    if (this._combo.shift && key === "shift") return true;
+    if (this._combo.alt && key === "alt") return true;
+    return false;
+  }
+};
+
+// src/ui/FloatingLogo.ts
+var STORAGE_KEY = "synod-feedback-logo-pos";
+var CLICK_THRESHOLD = 5;
+var FloatingLogo = class {
+  constructor(_root, callbacks) {
+    this._logo = null;
+    this._badge = null;
+    // Drag state
+    this._dragging = false;
+    this._startX = 0;
+    this._startY = 0;
+    this._logoX = 0;
+    this._logoY = 0;
+    this._moved = false;
+    // ── Drag handlers ───────────────────────────────────────────────────
+    this.onPointerDown = (e) => {
+      if (!this._logo) return;
+      e.preventDefault();
+      e.stopPropagation();
+      this._dragging = true;
+      this._moved = false;
+      this._startX = e.clientX;
+      this._startY = e.clientY;
+      try {
+        this._logo.setPointerCapture(e.pointerId);
+      } catch {
+      }
+      this._logo.addEventListener("pointermove", this.onPointerMove);
+      this._logo.addEventListener("pointerup", this.onPointerUp);
+      this._logo.addEventListener("pointercancel", this.onPointerUp);
+    };
+    this.onPointerMove = (e) => {
+      if (!this._dragging || !this._logo) return;
+      const dx = e.clientX - this._startX;
+      const dy = e.clientY - this._startY;
+      if (!this._moved && Math.abs(dx) + Math.abs(dy) > CLICK_THRESHOLD) {
+        this._moved = true;
+      }
+      if (!this._moved) return;
+      const newX = this._logoX + dx;
+      const newY = this._logoY + dy;
+      const clampedX = Math.max(8, Math.min(newX, window.innerWidth - 56));
+      const clampedY = Math.max(8, Math.min(newY, window.innerHeight - 56));
+      this._logo.style.left = `${clampedX}px`;
+      this._logo.style.top = `${clampedY}px`;
+    };
+    this.onPointerUp = (e) => {
+      if (!this._logo) return;
+      this._dragging = false;
+      try {
+        this._logo.releasePointerCapture(e.pointerId);
+      } catch {
+      }
+      this._logo.removeEventListener("pointermove", this.onPointerMove);
+      this._logo.removeEventListener("pointerup", this.onPointerUp);
+      this._logo.removeEventListener("pointercancel", this.onPointerUp);
+      if (this._moved) {
+        const left = parseFloat(this._logo.style.left || "0");
+        const top = parseFloat(this._logo.style.top || "0");
+        this._logoX = left;
+        this._logoY = top;
+        this.savePosition(left, top);
+      } else {
+        this._callbacks.onClick();
+      }
+    };
+    this.onKeyDown = (e) => {
+      if (e.key === "Enter" || e.key === " ") {
+        e.preventDefault();
+        this._callbacks.onClick();
+      }
+    };
+    this.onContextMenu = (e) => {
+      e.preventDefault();
+      e.stopPropagation();
+      this._callbacks.onContextMenu?.(e.clientX, e.clientY);
+    };
+    void _root;
+    this._callbacks = callbacks;
+  }
+  /**
+   * Mount the logo into the shadow root content wrapper.
+   */
+  mount(wrapper) {
+    if (this._logo) return;
+    const logo2 = document.createElement("div");
+    logo2.className = "synod-fb-logo";
+    logo2.appendChild(createSynodLogo(28));
+    logo2.setAttribute("role", "button");
+    logo2.setAttribute("aria-label", "Synod feedback \u2014 click to open queue");
+    logo2.setAttribute("tabindex", "0");
+    const pos = this.loadPosition();
+    logo2.style.left = `${pos.x}px`;
+    logo2.style.top = `${pos.y}px`;
+    this._logoX = pos.x;
+    this._logoY = pos.y;
+    const badge = document.createElement("div");
+    badge.className = "synod-fb-badge";
+    badge.style.display = "none";
+    badge.setAttribute("aria-live", "polite");
+    logo2.appendChild(badge);
+    logo2.addEventListener("pointerdown", this.onPointerDown);
+    logo2.addEventListener("keydown", this.onKeyDown);
+    logo2.addEventListener("contextmenu", this.onContextMenu);
+    wrapper.appendChild(logo2);
+    this._logo = logo2;
+    this._badge = badge;
+  }
+  /**
+   * Remove the logo from the DOM.
+   */
+  unmount() {
+    this._logo?.removeEventListener("pointerdown", this.onPointerDown);
+    this._logo?.removeEventListener("keydown", this.onKeyDown);
+    this._logo?.removeEventListener("contextmenu", this.onContextMenu);
+    this._logo?.remove();
+    this._logo = null;
+    this._badge = null;
+  }
+  /**
+   * Update the badge count.
+   */
+  updateCount(count) {
+    if (!this._badge || !this._logo) return;
+    if (count > 0) {
+      this._badge.style.display = "flex";
+      this._badge.textContent = String(count);
+      this._badge.setAttribute("aria-label", `${count} ${count === 1 ? "finding" : "findings"} queued`);
+      this._badge.classList.remove("synod-fb-logo-badge-pulse");
+      void this._badge.offsetWidth;
+      this._badge.classList.add("synod-fb-logo-badge-pulse");
+    } else {
+      this._badge.style.display = "none";
+    }
+    this._callbacks.onCountChange?.(count);
+  }
+  // ── localStorage ────────────────────────────────────────────────────
+  loadPosition() {
+    try {
+      const raw = localStorage.getItem(STORAGE_KEY);
+      if (raw) {
+        const pos = JSON.parse(raw);
+        if (typeof pos.x === "number" && typeof pos.y === "number") {
+          return pos;
+        }
+      }
+    } catch {
+    }
+    return {
+      x: Math.max(8, window.innerWidth - 64),
+      y: Math.max(8, window.innerHeight - 64)
+    };
+  }
+  savePosition(x, y) {
+    try {
+      localStorage.setItem(STORAGE_KEY, JSON.stringify({ x, y }));
+    } catch {
+    }
+  }
+};
+
+// src/utils/viewport.ts
+var MIN_MARGIN = 8;
+function calculateFlippedPosition(targetRect, elementSize, viewport, margin = MIN_MARGIN) {
+  const rectBottom = targetRect.top + targetRect.height;
+  const spaceBelow = viewport.innerHeight - rectBottom;
+  let top;
+  if (spaceBelow < elementSize.height + margin) {
+    top = targetRect.top - elementSize.height - margin;
+  } else {
+    top = rectBottom + margin;
+  }
+  let left = targetRect.left;
+  if (left + elementSize.width + margin > viewport.innerWidth) {
+    left = viewport.innerWidth - elementSize.width - margin * 2;
+  }
+  top = Math.max(top, MIN_MARGIN);
+  left = Math.max(left, MIN_MARGIN);
+  return { left, top };
+}
+
+// src/utils/screenshot.ts
+var MAX_SCREENSHOT_BYTES = 8192;
+async function capture(element) {
+  try {
+    const mod = await import("modern-screenshot");
+    const domToJpeg = mod.domToJpeg ?? mod.default?.domToJpeg;
+    if (typeof domToJpeg !== "function") {
+      console.warn("[synod-feedback] Screenshot: domToJpeg not found in modern-screenshot module");
+      return null;
+    }
+    const dataUrl = await domToJpeg(element, { quality: 0.4, width: 200 });
+    if (typeof dataUrl !== "string" || dataUrl.length === 0) {
+      console.warn("[synod-feedback] Screenshot: domToJpeg returned invalid data");
+      return null;
+    }
+    if (dataUrl.length > MAX_SCREENSHOT_BYTES) {
+      console.warn(
+        `[synod-feedback] Screenshot: data URL too large (${dataUrl.length} bytes > ${MAX_SCREENSHOT_BYTES} limit), omitting`
+      );
+      return null;
+    }
+    return dataUrl;
+  } catch (err) {
+    console.warn("[synod-feedback] Screenshot capture failed:", err);
+    return null;
+  }
+}
+
+// src/ui/IssueForm.ts
+var FORM_WIDTH = 340;
+var IssueForm = class {
+  constructor(wrapper, callbacks) {
+    this._formEl = null;
+    this._currentContext = null;
+    this._screenshotDataUrl = null;
+    this._screenshotElement = null;
+    this._previouslyFocused = null;
+    this._descTextarea = null;
+    this._severity = "medium";
+    this._screenshotToggle = null;
+    this._screenshotLabel = null;
+    this.onKeyDown = (e) => {
+      if (e.key === "Escape") {
+        e.preventDefault();
+        e.stopPropagation();
+        this._callbacks.onCancel();
+        return;
+      }
+      if (e.key === "Tab" && this._formEl) {
+        const focusable = this.getFocusableElements();
+        if (focusable.length === 0) return;
+        const first = focusable[0];
+        const last = focusable[focusable.length - 1];
+        if (e.shiftKey) {
+          if (document.activeElement === first) {
+            e.preventDefault();
+            last.focus();
+          }
+        } else {
+          if (document.activeElement === last) {
+            e.preventDefault();
+            first.focus();
+          }
+        }
+      }
+      if (e.ctrlKey && e.key === "Enter") {
+        e.preventDefault();
+        this.handleSubmit(e.shiftKey ? "send" : "add");
+      }
+    };
+    this._wrapper = wrapper;
+    this._callbacks = callbacks;
+  }
+  show(context, element) {
+    this.hide();
+    this._currentContext = context;
+    this._screenshotElement = element ?? null;
+    this._screenshotDataUrl = null;
+    this._severity = "medium";
+    this._previouslyFocused = document.activeElement;
+    const form = this.buildForm();
+    this._formEl = form;
+    const estimatedHeight = 380;
+    const pos = calculateFlippedPosition(
+      context.boundingRect,
+      { width: FORM_WIDTH, height: estimatedHeight },
+      { innerWidth: window.innerWidth, innerHeight: window.innerHeight }
+    );
+    form.style.left = `${pos.left}px`;
+    form.style.top = `${pos.top}px`;
+    this._wrapper.appendChild(form);
+    requestAnimationFrame(() => {
+      if (!this._formEl) return;
+      const actualHeight = this._formEl.offsetHeight;
+      if (Math.abs(actualHeight - estimatedHeight) > 20) {
+        const adjustedPos = calculateFlippedPosition(
+          context.boundingRect,
+          { width: FORM_WIDTH, height: actualHeight },
+          { innerWidth: window.innerWidth, innerHeight: window.innerHeight }
+        );
+        this._formEl.style.left = `${adjustedPos.left}px`;
+        this._formEl.style.top = `${adjustedPos.top}px`;
+      }
+    });
+    requestAnimationFrame(() => {
+      this._descTextarea?.focus();
+    });
+    form.addEventListener("keydown", this.onKeyDown);
+  }
+  hide() {
+    this._formEl?.removeEventListener("keydown", this.onKeyDown);
+    this._formEl?.remove();
+    this._formEl = null;
+    this._currentContext = null;
+    this._screenshotDataUrl = null;
+    this._screenshotElement = null;
+    if (this._previouslyFocused && this._previouslyFocused.isConnected) {
+      this._previouslyFocused.focus?.();
+    }
+    this._previouslyFocused = null;
+  }
+  get isVisible() {
+    return this._formEl !== null && this._formEl.isConnected;
+  }
+  buildForm() {
+    const form = document.createElement("div");
+    form.className = "synod-fb-form";
+    form.setAttribute("role", "dialog");
+    form.setAttribute("aria-modal", "true");
+    form.setAttribute("aria-label", "Describe issue");
+    const header = document.createElement("div");
+    header.className = "synod-fb-form-header";
+    const headerLogo = document.createElement("div");
+    headerLogo.className = "synod-fb-form-header-logo";
+    headerLogo.appendChild(createSynodLogo(16));
+    const headerText = document.createElement("div");
+    headerText.className = "synod-fb-form-header-text";
+    const ctx = this._currentContext;
+    const id = ctx.elementAttributes?.["id"];
+    const cls = ctx.elementAttributes?.["class"]?.trim();
+    let descriptor = ctx.tagName;
+    if (id) descriptor += `#${id}`;
+    if (cls) descriptor += "." + cls.split(/\s+/).join(".");
+    if (descriptor.length > 50) descriptor = descriptor.substring(0, 49) + "\u2026";
+    headerText.textContent = `${descriptor} \xB7 ${ctx.boundingRect.width}\xD7${ctx.boundingRect.height}`;
+    const closeBtn = document.createElement("button");
+    closeBtn.className = "synod-fb-form-close";
+    closeBtn.textContent = "\xD7";
+    closeBtn.setAttribute("aria-label", "Cancel");
+    closeBtn.addEventListener("click", () => this._callbacks.onCancel());
+    header.appendChild(headerLogo);
+    header.appendChild(headerText);
+    header.appendChild(closeBtn);
+    const body = document.createElement("div");
+    body.className = "synod-fb-form-body";
+    const descField = document.createElement("div");
+    descField.className = "synod-fb-field";
+    const descLabel = document.createElement("label");
+    descLabel.className = "synod-fb-label";
+    descLabel.textContent = "Description *";
+    descLabel.setAttribute("for", "synod-fb-desc");
+    const descTextarea = document.createElement("textarea");
+    descTextarea.className = "synod-fb-textarea";
+    descTextarea.id = "synod-fb-desc";
+    descTextarea.rows = 3;
+    descTextarea.maxLength = 2e3;
+    descTextarea.setAttribute("aria-label", "Issue description");
+    descTextarea.setAttribute("placeholder", "Describe what\u2019s wrong\u2026");
+    descTextarea.setAttribute("required", "");
+    this._descTextarea = descTextarea;
+    descField.appendChild(descLabel);
+    descField.appendChild(descTextarea);
+    const sevField = document.createElement("div");
+    sevField.className = "synod-fb-field";
+    const sevLabel = document.createElement("div");
+    sevLabel.className = "synod-fb-label";
+    sevLabel.textContent = "Severity";
+    const sevGroup = document.createElement("div");
+    sevGroup.className = "synod-fb-severity-group";
+    sevGroup.setAttribute("role", "group");
+    sevGroup.setAttribute("aria-label", "Severity");
+    const severities = ["low", "medium", "high"];
+    for (const sev of severities) {
+      const btn = document.createElement("button");
+      btn.className = "synod-fb-sev-btn";
+      btn.dataset.sev = sev;
+      btn.textContent = sev.charAt(0).toUpperCase() + sev.slice(1);
+      btn.setAttribute("aria-pressed", sev === this._severity ? "true" : "false");
+      if (sev === this._severity) btn.classList.add("active");
+      btn.addEventListener("click", (e) => {
+        e.preventDefault();
+        this._severity = sev;
+        sevGroup.querySelectorAll(".synod-fb-sev-btn").forEach((b) => {
+          const btnSev = b.dataset.sev;
+          b.setAttribute("aria-pressed", btnSev === sev ? "true" : "false");
+          b.classList.toggle("active", btnSev === sev);
+        });
+      });
+      btn.addEventListener("keydown", (e) => {
+        if (e.key === "ArrowRight" || e.key === "ArrowLeft") {
+          e.preventDefault();
+          const btns = Array.from(sevGroup.querySelectorAll(".synod-fb-sev-btn"));
+          const idx = btns.indexOf(e.currentTarget);
+          const nextIdx = e.key === "ArrowRight" ? (idx + 1) % btns.length : (idx - 1 + btns.length) % btns.length;
+          btns[nextIdx].click();
+          btns[nextIdx].focus();
+        }
+      });
+      sevGroup.appendChild(btn);
+    }
+    sevField.appendChild(sevLabel);
+    sevField.appendChild(sevGroup);
+    const ssField = document.createElement("div");
+    ssField.className = "synod-fb-field";
+    const ssToggle = document.createElement("label");
+    ssToggle.className = "synod-fb-screenshot-toggle";
+    const ssCheckbox = document.createElement("input");
+    ssCheckbox.type = "checkbox";
+    ssCheckbox.addEventListener("change", () => this.onScreenshotToggle(ssCheckbox.checked));
+    this._screenshotToggle = ssCheckbox;
+    const ssLabel = document.createElement("span");
+    ssLabel.textContent = "\u{1F4F7} Include screenshot";
+    this._screenshotLabel = ssToggle;
+    ssToggle.appendChild(ssCheckbox);
+    ssToggle.appendChild(ssLabel);
+    ssField.appendChild(ssToggle);
+    const actions = document.createElement("div");
+    actions.className = "synod-fb-form-actions";
+    const addBtn = document.createElement("button");
+    addBtn.className = "synod-fb-btn-secondary";
+    addBtn.textContent = "+ Add to tray";
+    addBtn.addEventListener("click", (e) => {
+      e.preventDefault();
+      this.handleSubmit("add");
+    });
+    const sendBtn = document.createElement("button");
+    sendBtn.className = "synod-fb-btn-primary";
+    sendBtn.textContent = "Send now";
+    sendBtn.addEventListener("click", (e) => {
+      e.preventDefault();
+      this.handleSubmit("send");
+    });
+    actions.appendChild(addBtn);
+    actions.appendChild(sendBtn);
+    body.appendChild(descField);
+    body.appendChild(sevField);
+    body.appendChild(ssField);
+    body.appendChild(actions);
+    form.appendChild(header);
+    form.appendChild(body);
+    return form;
+  }
+  async onScreenshotToggle(checked) {
+    if (!checked) {
+      this._screenshotDataUrl = null;
+      return;
+    }
+    if (!this._screenshotElement) {
+      this.markScreenshotUnavailable();
+      return;
+    }
+    if (this._screenshotLabel) {
+      const labelSpan = this._screenshotLabel.querySelector("span");
+      if (labelSpan) labelSpan.textContent = "\u{1F4F7} Capturing\u2026";
+    }
+    const dataUrl = await capture(this._screenshotElement);
+    if (dataUrl) {
+      this._screenshotDataUrl = dataUrl;
+      if (this._screenshotLabel) {
+        const labelSpan = this._screenshotLabel.querySelector("span");
+        if (labelSpan) labelSpan.textContent = "\u{1F4F7} Screenshot captured \u2713";
+      }
+    } else {
+      this.markScreenshotUnavailable();
+    }
+  }
+  markScreenshotUnavailable() {
+    this._screenshotDataUrl = null;
+    if (this._screenshotToggle) {
+      this._screenshotToggle.checked = false;
+      this._screenshotToggle.disabled = true;
+    }
+    if (this._screenshotLabel) {
+      this._screenshotLabel.classList.add("disabled", "unavailable");
+      const labelSpan = this._screenshotLabel.querySelector("span");
+      if (labelSpan) labelSpan.textContent = "\u26A0 Screenshot unavailable";
+    }
+  }
+  handleSubmit(action) {
+    if (!this._currentContext || !this._descTextarea) return;
+    const description = this._descTextarea.value.trim();
+    if (!description) return;
+    const contextJson = {
+      element_text: this._currentContext.elementText,
+      element_html: this._currentContext.elementHtml,
+      element_attributes: this._currentContext.elementAttributes,
+      parent_chain: this._currentContext.parentChain,
+      url: typeof window !== "undefined" ? window.location.href : void 0,
+      // Best-effort route — pathname + hash + search captures the SPA "screen"
+      // without re-sending the origin (already in url).
+      route: typeof window !== "undefined" ? window.location.pathname + window.location.search + window.location.hash : void 0,
+      page_title: typeof document !== "undefined" ? document.title : void 0,
+      viewport: typeof window !== "undefined" ? { width: window.innerWidth, height: window.innerHeight } : void 0,
+      user_agent: typeof navigator !== "undefined" ? navigator.userAgent : void 0,
+      ...this._screenshotDataUrl ? { screenshot_data_url: this._screenshotDataUrl } : {}
+    };
+    const result = {
+      description,
+      severity: this._severity,
+      contextJson
+    };
+    if (action === "add") {
+      this._callbacks.onAddToTray(result);
+    } else {
+      this._callbacks.onSendNow(result);
+    }
+  }
+  getFocusableElements() {
+    if (!this._formEl) return [];
+    return Array.from(
+      this._formEl.querySelectorAll(
+        'input:not([disabled]), textarea:not([disabled]), button:not([disabled]), [tabindex]:not([tabindex="-1"])'
+      )
+    );
+  }
+};
+
+// src/utils/title.ts
+function isTitlePending(title) {
+  return !title || title.trim() === "";
+}
+function truncDesc(description) {
+  const trimmed = (description ?? "").trim().replace(/\s+/g, " ");
+  if (trimmed.length <= 60) return trimmed;
+  const slice = trimmed.slice(0, 57);
+  const lastSpace = slice.lastIndexOf(" ");
+  const head = lastSpace > 25 ? slice.slice(0, lastSpace) : slice;
+  return head + "\u2026";
+}
+
+// src/utils/clipboard.ts
+var PREFIX = "synod-fb-v1:";
+var FORMAT_VERSION = 1;
+function withoutScreenshot(payload) {
+  if (!payload.context_json?.screenshot_data_url) return payload;
+  const { screenshot_data_url: _drop, ...rest } = payload.context_json;
+  return { ...payload, context_json: rest };
+}
+function encodeBase64(unicodeStr) {
+  const utf8 = new TextEncoder().encode(unicodeStr);
+  let binary = "";
+  for (const b of utf8) binary += String.fromCharCode(b);
+  const standard = btoa(binary);
+  return standard.replace(/\+/g, "-").replace(/\//g, "_").replace(/=+$/, "");
+}
+function decodeBase64(urlSafe) {
+  const standard = urlSafe.replace(/-/g, "+").replace(/_/g, "/");
+  const padded = standard + "=".repeat((4 - standard.length % 4) % 4);
+  const binary = atob(padded);
+  const bytes = new Uint8Array(binary.length);
+  for (let i = 0; i < binary.length; i++) bytes[i] = binary.charCodeAt(i);
+  return new TextDecoder().decode(bytes);
+}
+function encodeFindingsToClipboard(findings) {
+  const stripped = findings.map(withoutScreenshot);
+  const payload = { v: FORMAT_VERSION, findings: stripped };
+  const json = JSON.stringify(payload);
+  return PREFIX + encodeBase64(json);
+}
+function decodeFindingsFromClipboard(raw) {
+  if (typeof raw !== "string" || raw.length === 0) {
+    return { ok: false, error: "Empty clipboard" };
+  }
+  const trimmed = raw.trim();
+  if (!trimmed.startsWith(PREFIX)) {
+    return { ok: false, error: "Not a Synod findings blob (missing prefix)" };
+  }
+  const b64 = trimmed.slice(PREFIX.length);
+  let json;
+  try {
+    json = decodeBase64(b64);
+  } catch {
+    return { ok: false, error: "Malformed base64" };
+  }
+  let parsed;
+  try {
+    parsed = JSON.parse(json);
+  } catch {
+    return { ok: false, error: "Malformed JSON payload" };
+  }
+  if (!parsed || typeof parsed !== "object") {
+    return { ok: false, error: "Payload is not an object" };
+  }
+  const obj = parsed;
+  if (obj.v !== FORMAT_VERSION) {
+    return { ok: false, error: `Unsupported format version ${obj.v}` };
+  }
+  if (!Array.isArray(obj.findings)) {
+    return { ok: false, error: "Payload.findings is not an array" };
+  }
+  const validSeverities = ["low", "medium", "high"];
+  const findings = [];
+  for (let i = 0; i < obj.findings.length; i++) {
+    const f = obj.findings[i];
+    if (typeof f?.description !== "string" || f.description.trim() === "") {
+      return { ok: false, error: `Finding[${i}] missing description` };
+    }
+    if (typeof f.severity !== "string" || !validSeverities.includes(f.severity)) {
+      return { ok: false, error: `Finding[${i}] has invalid severity "${f.severity}"` };
+    }
+    if (!f.context_json || typeof f.context_json !== "object") {
+      return { ok: false, error: `Finding[${i}] missing context_json` };
+    }
+    findings.push({
+      title: typeof f.title === "string" ? f.title : "",
+      description: f.description,
+      severity: f.severity,
+      context_json: f.context_json,
+      ...f.suggested_action ? { suggested_action: f.suggested_action } : {}
+    });
+  }
+  return { ok: true, findings };
+}
+
+// src/ui/QueuePanel.ts
+var QueuePanel = class {
+  constructor(wrapper, callbacks) {
+    this._panelEl = null;
+    this._bodyEl = null;
+    this._bannerEl = null;
+    this._sendBtn = null;
+    this._isOpen = false;
+    this._toastContainer = null;
+    this._wrapper = wrapper;
+    this._callbacks = callbacks;
+  }
+  get isOpen() {
+    return this._isOpen;
+  }
+  /**
+   * Open the queue panel drawer.
+   */
+  show() {
+    if (this._isOpen) return;
+    const panel = this.buildPanel();
+    this._panelEl = panel;
+    this._wrapper.appendChild(panel);
+    this._isOpen = true;
+    this.renderItems();
+  }
+  /**
+   * Close the queue panel drawer.
+   */
+  hide() {
+    this._panelEl?.remove();
+    this._panelEl = null;
+    this._bodyEl = null;
+    this._bannerEl = null;
+    this._sendBtn = null;
+    this._isOpen = false;
+  }
+  /**
+   * Refresh item list (call after queue changes).
+   */
+  refresh() {
+    if (!this._isOpen) return;
+    this.renderItems();
+  }
+  // ── Build DOM ───────────────────────────────────────────────────────
+  buildPanel() {
+    const panel = document.createElement("div");
+    panel.className = "synod-fb-queue";
+    panel.setAttribute("role", "dialog");
+    panel.setAttribute("aria-modal", "true");
+    panel.setAttribute("aria-label", "Pending findings review");
+    const header = document.createElement("div");
+    header.className = "synod-fb-queue-header";
+    const headerLogo = document.createElement("div");
+    headerLogo.className = "synod-fb-queue-header-logo";
+    headerLogo.appendChild(createSynodLogo(16));
+    const title = document.createElement("div");
+    title.className = "synod-fb-queue-title";
+    title.textContent = "Pending Findings";
+    const closeBtn = document.createElement("button");
+    closeBtn.className = "synod-fb-icon-btn";
+    closeBtn.textContent = "\xD7";
+    closeBtn.setAttribute("aria-label", "Close queue panel");
+    closeBtn.addEventListener("click", () => this.hide());
+    header.appendChild(headerLogo);
+    header.appendChild(title);
+    header.appendChild(closeBtn);
+    const banner = document.createElement("div");
+    banner.className = "synod-fb-queue-banner";
+    banner.style.display = "none";
+    this._bannerEl = banner;
+    const body = document.createElement("div");
+    body.className = "synod-fb-queue-body";
+    this._bodyEl = body;
+    const footer = document.createElement("div");
+    footer.className = "synod-fb-queue-footer";
+    const clearBtn = document.createElement("button");
+    clearBtn.className = "synod-fb-btn-danger";
+    clearBtn.textContent = "Clear all";
+    clearBtn.addEventListener("click", () => this.handleClearAll());
+    const copyBtn = document.createElement("button");
+    copyBtn.className = "synod-fb-icon-btn";
+    copyBtn.setAttribute("aria-label", "Copy all findings to clipboard");
+    copyBtn.title = "Copy to clipboard (offline transfer)";
+    copyBtn.textContent = "\u29C9";
+    copyBtn.addEventListener("click", () => this.handleCopyToClipboard());
+    const sendBtn = document.createElement("button");
+    sendBtn.className = "synod-fb-btn-primary";
+    sendBtn.textContent = "Send batch";
+    sendBtn.addEventListener("click", () => this.handleSendBatch());
+    this._sendBtn = sendBtn;
+    footer.appendChild(clearBtn);
+    footer.appendChild(copyBtn);
+    footer.appendChild(sendBtn);
+    panel.appendChild(header);
+    panel.appendChild(banner);
+    panel.appendChild(body);
+    panel.appendChild(footer);
+    panel.addEventListener("keydown", (e) => {
+      if (e.key === "Escape") {
+        e.preventDefault();
+        this.hide();
+      }
+    });
+    return panel;
+  }
+  renderItems() {
+    if (!this._bodyEl) return;
+    const items = this._callbacks.getQueueSnapshot();
+    this._bodyEl.innerHTML = "";
+    if (items.length === 0) {
+      const empty = document.createElement("div");
+      empty.className = "synod-fb-queue-empty";
+      empty.textContent = "No findings queued yet. Click an element to start capturing.";
+      this._bodyEl.appendChild(empty);
+      if (this._sendBtn) {
+        this._sendBtn.textContent = "Send batch";
+        this._sendBtn.disabled = true;
+      }
+      return;
+    }
+    if (this._sendBtn) {
+      this._sendBtn.textContent = `Send batch (${items.length})`;
+      this._sendBtn.disabled = false;
+    }
+    items.forEach((item, index) => {
+      const row = this.buildItemRow(item, index);
+      this._bodyEl.appendChild(row);
+    });
+  }
+  buildItemRow(item, index) {
+    const row = document.createElement("div");
+    row.className = "synod-fb-queue-item";
+    row.dataset.index = String(index);
+    const thumb = document.createElement("div");
+    thumb.className = "synod-fb-queue-item-thumb";
+    if (item.context_json.screenshot_data_url) {
+      const img = document.createElement("img");
+      img.src = item.context_json.screenshot_data_url;
+      img.alt = "Screenshot";
+      thumb.appendChild(img);
+    }
+    const content = document.createElement("div");
+    content.className = "synod-fb-queue-item-content";
+    const titleEl = document.createElement("div");
+    titleEl.className = "synod-fb-queue-item-title";
+    if (isTitlePending(item.title)) {
+      titleEl.classList.add("synod-fb-pending");
+      titleEl.textContent = truncDesc(item.description) || "(untitled)";
+    } else {
+      titleEl.textContent = item.title;
+    }
+    const metaEl = document.createElement("div");
+    metaEl.className = "synod-fb-queue-item-meta";
+    const selectorSnippet = (item.context_json.css_selector || "").substring(0, 40);
+    metaEl.textContent = `${selectorSnippet} \xB7 ${item.severity}`;
+    content.appendChild(titleEl);
+    content.appendChild(metaEl);
+    const actions = document.createElement("div");
+    actions.className = "synod-fb-queue-item-actions";
+    const editBtn = document.createElement("button");
+    editBtn.className = "synod-fb-icon-btn";
+    editBtn.textContent = "\u270E";
+    editBtn.setAttribute("aria-label", `Edit finding ${index + 1}`);
+    editBtn.addEventListener("click", (e) => {
+      e.stopPropagation();
+      this.toggleEditRow(row, item, index);
+    });
+    const deleteBtn = document.createElement("button");
+    deleteBtn.className = "synod-fb-icon-btn";
+    deleteBtn.textContent = "\u2715";
+    deleteBtn.setAttribute("aria-label", `Delete finding ${index + 1}`);
+    deleteBtn.addEventListener("click", (e) => {
+      e.stopPropagation();
+      this._callbacks.onRemoveItem(index);
+      this.refresh();
+    });
+    actions.appendChild(editBtn);
+    actions.appendChild(deleteBtn);
+    row.appendChild(thumb);
+    row.appendChild(content);
+    row.appendChild(actions);
+    return row;
+  }
+  toggleEditRow(row, item, index) {
+    const existingEdit = row.querySelector(".synod-fb-edit-form");
+    if (existingEdit) {
+      existingEdit.remove();
+      return;
+    }
+    const editForm = document.createElement("div");
+    editForm.className = "synod-fb-edit-form";
+    editForm.style.padding = "8px 0 4px";
+    const titleInput = document.createElement("input");
+    titleInput.className = "synod-fb-input";
+    titleInput.value = item.title;
+    titleInput.style.marginBottom = "4px";
+    const descInput = document.createElement("textarea");
+    descInput.className = "synod-fb-textarea";
+    descInput.value = item.description;
+    descInput.rows = 2;
+    descInput.style.marginBottom = "4px";
+    const sevGroup = document.createElement("div");
+    sevGroup.className = "synod-fb-severity-group";
+    sevGroup.setAttribute("role", "group");
+    let editSeverity = item.severity;
+    const severities = ["low", "medium", "high"];
+    for (const sev of severities) {
+      const btn = document.createElement("button");
+      btn.className = "synod-fb-sev-btn";
+      btn.dataset.sev = sev;
+      btn.textContent = sev.charAt(0).toUpperCase() + sev.slice(1);
+      btn.setAttribute("aria-pressed", sev === editSeverity ? "true" : "false");
+      if (sev === editSeverity) btn.classList.add("active");
+      btn.addEventListener("click", (e) => {
+        e.preventDefault();
+        editSeverity = sev;
+        sevGroup.querySelectorAll(".synod-fb-sev-btn").forEach((b) => {
+          const bSev = b.dataset.sev;
+          b.setAttribute("aria-pressed", bSev === sev ? "true" : "false");
+          b.classList.toggle("active", bSev === sev);
+        });
+      });
+      sevGroup.appendChild(btn);
+    }
+    const saveBtn = document.createElement("button");
+    saveBtn.className = "synod-fb-btn-primary";
+    saveBtn.textContent = "Save";
+    saveBtn.style.marginTop = "4px";
+    saveBtn.addEventListener("click", (e) => {
+      e.preventDefault();
+      this._callbacks.onEditItem(index, titleInput.value.trim(), descInput.value.trim(), editSeverity);
+      this.refresh();
+    });
+    editForm.appendChild(titleInput);
+    editForm.appendChild(descInput);
+    editForm.appendChild(sevGroup);
+    editForm.appendChild(saveBtn);
+    row.appendChild(editForm);
+    titleInput.focus();
+  }
+  // ── Actions ─────────────────────────────────────────────────────────
+  async handleSendBatch() {
+    if (!this._sendBtn) return;
+    const originalText = this._sendBtn.textContent;
+    this._sendBtn.disabled = true;
+    this._sendBtn.textContent = "Sending\u2026";
+    this.hideBanner();
+    if (this._bodyEl) {
+      this._bodyEl.style.opacity = "0.5";
+      this._bodyEl.style.pointerEvents = "none";
+    }
+    try {
+      const result = await this._callbacks.onSendBatch();
+      this.handleSendResult(result);
+    } catch (err) {
+      this.handleSendError(err);
+    } finally {
+      if (this._bodyEl) {
+        this._bodyEl.style.opacity = "";
+        this._bodyEl.style.pointerEvents = "";
+      }
+      if (this._sendBtn) {
+        this._sendBtn.disabled = false;
+        this._sendBtn.textContent = originalText || "Send batch";
+      }
+    }
+  }
+  handleSendResult(result) {
+    const total = result.created.length + result.errors.length;
+    if (result.errors.length === 0 && result.created.length > 0) {
+      this.showToast("success", `\u2713 ${result.created.length} ${result.created.length === 1 ? "finding" : "findings"} sent to Synod`);
+      setTimeout(() => this.hide(), 1e3);
+    } else if (result.created.length > 0 && result.errors.length > 0) {
+      this.showBanner("info", `${result.created.length} of ${total} findings sent. ${result.errors.length} failed.`);
+      this.showToast("info", `${result.created.length} of ${total} findings sent`);
+    } else if (result.errors.length > 0 && result.created.length === 0) {
+      const errMsg = result.errors.map((e) => e.error).join("; ");
+      this.showBanner("error", `\u26A0 Send failed: ${errMsg}. Your findings are saved \u2014 try again.`);
+    }
+    this.refresh();
+  }
+  handleSendError(err) {
+    const isClientErr = "code" in err;
+    const code = isClientErr ? err.code : null;
+    if (code === "AUTH_ERROR") {
+      this.showBanner(
+        "error",
+        "\u26A0 Token invalid or expired. Regenerate the token in Synod Desktop Settings \u2192 Extensions."
+      );
+    } else {
+      const msg = err.message || "Unknown error";
+      this.showBanner("error", `\u26A0 Send failed: ${msg}. Your findings are saved \u2014 try again.`);
+    }
+  }
+  async handleCopyToClipboard() {
+    const items = this._callbacks.getQueueSnapshot();
+    if (items.length === 0) {
+      this.showToast("info", "No findings to copy");
+      return;
+    }
+    const encoded = encodeFindingsToClipboard(items);
+    try {
+      let ok = false;
+      if (this._callbacks.onCopyToClipboard) {
+        ok = await this._callbacks.onCopyToClipboard(items);
+      } else if (typeof navigator !== "undefined" && navigator.clipboard) {
+        await navigator.clipboard.writeText(encoded);
+        ok = true;
+      }
+      if (ok) {
+        this.showToast(
+          "success",
+          `\u2713 Copied ${items.length} ${items.length === 1 ? "finding" : "findings"} (screenshots stripped)`
+        );
+      } else {
+        this.showToast("error", "\u26A0 Clipboard unavailable in this browser");
+      }
+    } catch {
+      this.showToast("error", "\u26A0 Copy failed \u2014 try Send batch instead");
+    }
+  }
+  handleClearAll() {
+    const items = this._callbacks.getQueueSnapshot();
+    if (items.length > 3) {
+      if (!window.confirm(`Clear all ${items.length} findings?`)) return;
+    }
+    this._callbacks.onClearAll();
+    this.refresh();
+  }
+  // ── Banner ──────────────────────────────────────────────────────────
+  showBanner(type, message) {
+    if (!this._bannerEl) return;
+    this._bannerEl.className = `synod-fb-queue-banner ${type}`;
+    this._bannerEl.textContent = message;
+    this._bannerEl.style.display = "block";
+  }
+  hideBanner() {
+    if (!this._bannerEl) return;
+    this._bannerEl.style.display = "none";
+  }
+  // ── Toast ───────────────────────────────────────────────────────────
+  showToast(variant, message) {
+    if (!this._toastContainer) {
+      this._toastContainer = document.createElement("div");
+      this._toastContainer.className = "synod-fb-toast-container";
+      this._wrapper.appendChild(this._toastContainer);
+    }
+    const toast = document.createElement("div");
+    toast.className = `synod-fb-toast ${variant}`;
+    toast.setAttribute("role", variant === "error" ? "alert" : "status");
+    toast.setAttribute("aria-live", variant === "error" ? "assertive" : "polite");
+    const toastLogo = document.createElement("span");
+    toastLogo.className = "synod-fb-toast-logo";
+    toastLogo.appendChild(createSynodLogo(14));
+    const toastMsg = document.createElement("span");
+    toastMsg.textContent = message;
+    toast.appendChild(toastLogo);
+    toast.appendChild(toastMsg);
+    this._toastContainer.appendChild(toast);
+    while (this._toastContainer.children.length > 3) {
+      this._toastContainer.removeChild(this._toastContainer.firstChild);
+    }
+    const duration = variant === "error" ? 6e3 : variant === "success" ? 4e3 : 3e3;
+    setTimeout(() => {
+      toast.remove();
+    }, duration);
+  }
+  // ── Cleanup ─────────────────────────────────────────────────────────
+  destroy() {
+    this.hide();
+    this._toastContainer?.remove();
+    this._toastContainer = null;
+  }
+};
+
+// src/ui/ChargeIndicator.ts
+var RING_RADIUS = 18;
+var RING_CIRCUMFERENCE = 2 * Math.PI * RING_RADIUS;
+var ChargeIndicator = class {
+  constructor() {
+    this._root = null;
+    this._circle = null;
+    this._mounted = false;
+  }
+  /**
+   * Build the indicator's DOM once and append it to the given wrapper.
+   * The indicator starts hidden; call showAt() to make it visible.
+   */
+  mount(wrapper) {
+    if (this._mounted) return;
+    const root = document.createElement("div");
+    root.className = "synod-fb-charge";
+    root.setAttribute("aria-hidden", "true");
+    root.style.display = "none";
+    const svgNS = "http://www.w3.org/2000/svg";
+    const svg = document.createElementNS(svgNS, "svg");
+    svg.setAttribute("class", "synod-fb-charge-ring");
+    svg.setAttribute("viewBox", "0 0 40 40");
+    svg.setAttribute("width", "40");
+    svg.setAttribute("height", "40");
+    const bgCircle = document.createElementNS(svgNS, "circle");
+    bgCircle.setAttribute("cx", "20");
+    bgCircle.setAttribute("cy", "20");
+    bgCircle.setAttribute("r", String(RING_RADIUS));
+    bgCircle.setAttribute("class", "synod-fb-charge-ring-bg");
+    const fgCircle = document.createElementNS(svgNS, "circle");
+    fgCircle.setAttribute("cx", "20");
+    fgCircle.setAttribute("cy", "20");
+    fgCircle.setAttribute("r", String(RING_RADIUS));
+    fgCircle.setAttribute("class", "synod-fb-charge-ring-fg");
+    fgCircle.setAttribute("stroke-dasharray", String(RING_CIRCUMFERENCE));
+    fgCircle.setAttribute("stroke-dashoffset", String(RING_CIRCUMFERENCE));
+    svg.appendChild(bgCircle);
+    svg.appendChild(fgCircle);
+    root.appendChild(svg);
+    root.appendChild(createSynodLogo(22));
+    wrapper.appendChild(root);
+    this._root = root;
+    this._circle = fgCircle;
+    this._mounted = true;
+  }
+  /** Whether mount() has been called and the indicator is in the DOM. */
+  get isMounted() {
+    return this._mounted && this._root !== null && this._root.isConnected;
+  }
+  /** Display the indicator at viewport-relative coordinates. */
+  showAt(x, y) {
+    if (!this._root) return;
+    this._root.style.left = `${x}px`;
+    this._root.style.top = `${y}px`;
+    this._root.style.display = "flex";
+  }
+  /**
+   * Update the ring's progress.
+   * @param fraction 0..1 — clamped. At 1 the .charged class is added.
+   */
+  setProgress(fraction) {
+    if (!this._root || !this._circle) return;
+    const clamped = Math.max(0, Math.min(1, fraction));
+    const offset = RING_CIRCUMFERENCE * (1 - clamped);
+    this._circle.setAttribute("stroke-dashoffset", String(offset));
+    if (clamped >= 1) {
+      this._root.classList.add("charged");
+    } else {
+      this._root.classList.remove("charged");
+    }
+  }
+  /** Hide the indicator. Safe to call when already hidden. */
+  hide() {
+    if (!this._root) return;
+    this._root.style.display = "none";
+    this._root.classList.remove("charged");
+    if (this._circle) {
+      this._circle.setAttribute(
+        "stroke-dashoffset",
+        String(RING_CIRCUMFERENCE)
+      );
+    }
+  }
+  /** Remove the indicator from the DOM and release references. */
+  destroy() {
+    if (this._root && this._root.parentElement) {
+      this._root.parentElement.removeChild(this._root);
+    }
+    this._root = null;
+    this._circle = null;
+    this._mounted = false;
+  }
+};
+
+// src/ui/LogoContextMenu.ts
+var LogoContextMenu = class {
+  constructor(callbacks) {
+    this._root = null;
+    this._outsideClickListener = null;
+    this._escapeListener = null;
+    this._dismissListener = null;
+    this._callbacks = callbacks;
+  }
+  get isOpen() {
+    return this._root !== null && this._root.isConnected;
+  }
+  /**
+   * Show the menu at the given viewport coordinates.
+   * If already open, the existing menu is closed first.
+   */
+  showAt(wrapper, x, y) {
+    this.hide();
+    const root = document.createElement("div");
+    root.className = "synod-fb-context-menu";
+    root.setAttribute("role", "menu");
+    root.setAttribute("aria-label", "Synod overlay options");
+    const menuWidth = 180;
+    const menuHeight = 40;
+    const clampedX = Math.min(x, window.innerWidth - menuWidth - 8);
+    const clampedY = Math.min(y, window.innerHeight - menuHeight - 8);
+    root.style.left = `${Math.max(8, clampedX)}px`;
+    root.style.top = `${Math.max(8, clampedY)}px`;
+    const hideItem = document.createElement("button");
+    hideItem.type = "button";
+    hideItem.className = "synod-fb-context-menu-item";
+    hideItem.setAttribute("role", "menuitem");
+    hideItem.textContent = "Hide Synod overlay";
+    hideItem.addEventListener("click", () => {
+      this.hide();
+      this._callbacks.onHide();
+    });
+    root.appendChild(hideItem);
+    wrapper.appendChild(root);
+    this._root = root;
+    this._outsideClickListener = (e) => {
+      if (!this._root) return;
+      if (e.target instanceof Node && this._root.contains(e.target)) return;
+      this.hide();
+    };
+    setTimeout(() => {
+      if (!this._root) return;
+      document.addEventListener("click", this._outsideClickListener, true);
+      document.addEventListener("contextmenu", this._outsideClickListener, true);
+    }, 0);
+    this._escapeListener = (e) => {
+      if (e.key === "Escape") {
+        e.stopPropagation();
+        this.hide();
+      }
+    };
+    document.addEventListener("keydown", this._escapeListener, true);
+    this._dismissListener = () => this.hide();
+    window.addEventListener("scroll", this._dismissListener, true);
+    window.addEventListener("resize", this._dismissListener, true);
+  }
+  hide() {
+    if (this._outsideClickListener) {
+      document.removeEventListener("click", this._outsideClickListener, true);
+      document.removeEventListener("contextmenu", this._outsideClickListener, true);
+      this._outsideClickListener = null;
+    }
+    if (this._escapeListener) {
+      document.removeEventListener("keydown", this._escapeListener, true);
+      this._escapeListener = null;
+    }
+    if (this._dismissListener) {
+      window.removeEventListener("scroll", this._dismissListener, true);
+      window.removeEventListener("resize", this._dismissListener, true);
+      this._dismissListener = null;
+    }
+    this._root?.remove();
+    this._root = null;
+  }
+  destroy() {
+    this.hide();
+  }
+};
+
+// src/interaction/setup.ts
+var manager = null;
+var overlay = null;
+var highlighter = null;
+var picker = null;
+var comboDetector = null;
+var logo = null;
+var issueForm = null;
+var queuePanel = null;
+var chargeIndicator = null;
+var contextMenu = null;
+var state = "inactive";
+var unregisterEnable = null;
+var unregisterDisable = null;
+var lastSelectionContext = null;
+var lastMouseX = 0;
+var lastMouseY = 0;
+var mouseMoveListener = null;
+function __resetInteractionLayer() {
+  if (unregisterEnable) unregisterEnable();
+  if (unregisterDisable) unregisterDisable();
+  unregisterEnable = null;
+  unregisterDisable = null;
+  manager = null;
+  overlay = null;
+  highlighter = null;
+  picker = null;
+  comboDetector = null;
+  logo = null;
+  issueForm = null;
+  queuePanel = null;
+  chargeIndicator = null;
+  contextMenu = null;
+  state = "inactive";
+  lastSelectionContext = null;
+  lastMouseX = 0;
+  lastMouseY = 0;
+  mouseMoveListener = null;
+}
+function buildFinding(description, severity, context, screenshotDataUrl) {
+  return {
+    title: "",
+    description,
+    severity,
+    // Gateway handler (crates/core/src/handlers/external_findings.rs:42)
+    // requires suggested_action as a non-optional String and validates it
+    // against ["create_story", "create_research", "create_hotfix"]. Omitting
+    // it makes the whole batch return 422.
+    suggested_action: "create_story",
+    context_json: {
+      element_text: context.elementText,
+      element_html: context.elementHtml,
+      element_attributes: context.elementAttributes,
+      parent_chain: context.parentChain,
+      url: typeof window !== "undefined" ? window.location.href : void 0,
+      // Best-effort route — pathname + hash + search captures the SPA "screen"
+      // without re-sending the origin (already in url).
+      route: typeof window !== "undefined" ? window.location.pathname + window.location.search + window.location.hash : void 0,
+      page_title: typeof document !== "undefined" ? document.title : void 0,
+      viewport: typeof window !== "undefined" ? { width: window.innerWidth, height: window.innerHeight } : void 0,
+      user_agent: typeof navigator !== "undefined" ? navigator.userAgent : void 0,
+      ...screenshotDataUrl ? { screenshot_data_url: screenshotDataUrl } : {}
+    }
+  };
+}
+function registerInteractionLayer(fm) {
+  if (unregisterEnable) return;
+  manager = fm;
+  unregisterEnable = manager.onEnable(() => {
+    if (state !== "inactive") return;
+    overlay = new FeedbackOverlay();
+    overlay.mount(document.body);
+    const wrapper = overlay.getContentWrapper();
+    highlighter = new Highlighter(overlay);
+    state = "idle";
+    chargeIndicator = new ChargeIndicator();
+    chargeIndicator.mount(wrapper);
+    contextMenu = new LogoContextMenu({
+      onHide: () => {
+        hideVisibleUI();
+      }
+    });
+    mouseMoveListener = (e) => {
+      lastMouseX = e.clientX;
+      lastMouseY = e.clientY;
+    };
+    document.addEventListener("mousemove", mouseMoveListener);
+    comboDetector = new KeyComboDetector(manager.config?.keyCombo, {
+      onChargeStart: () => {
+        if (state !== "idle") return;
+        state = "charging";
+        chargeIndicator?.showAt(lastMouseX, lastMouseY);
+      },
+      onChargeProgress: (frac) => {
+        if (state !== "charging") return;
+        chargeIndicator?.setProgress(frac);
+        chargeIndicator?.showAt(lastMouseX, lastMouseY);
+      },
+      onCharged: () => {
+        if (state !== "charging") return;
+        chargeIndicator?.hide();
+        ensureVisibleUI();
+        activateSelection();
+      },
+      onChargeCancel: () => {
+        if (state === "charging") {
+          chargeIndicator?.hide();
+          state = "idle";
+        }
+      }
+    });
+    comboDetector.start();
+  });
+  unregisterDisable = manager.onDisable(() => {
+    picker?.deactivate();
+    comboDetector?.stop();
+    queuePanel?.destroy();
+    issueForm?.hide();
+    highlighter?.destroy();
+    logo?.unmount();
+    chargeIndicator?.destroy();
+    contextMenu?.destroy();
+    if (mouseMoveListener) {
+      document.removeEventListener("mousemove", mouseMoveListener);
+    }
+    overlay?.unmount();
+    overlay = null;
+    highlighter = null;
+    picker = null;
+    comboDetector = null;
+    logo = null;
+    issueForm = null;
+    queuePanel = null;
+    chargeIndicator = null;
+    contextMenu = null;
+    mouseMoveListener = null;
+    state = "inactive";
+    lastSelectionContext = null;
+    lastMouseX = 0;
+    lastMouseY = 0;
+  });
+}
+function ensureVisibleUI() {
+  if (!overlay || !manager) return;
+  const wrapper = overlay.getContentWrapper();
+  if (!wrapper) return;
+  if (!logo) {
+    logo = new FloatingLogo(overlay.root, {
+      onClick: () => {
+        if (state === "idle" || state === "selecting") {
+          toggleQueuePanel();
+        }
+      },
+      onContextMenu: (x, y) => {
+        showLogoContextMenu(x, y);
+      }
+    });
+    logo.mount(wrapper);
+  }
+  if (!issueForm) {
+    issueForm = new IssueForm(wrapper, {
+      onAddToTray: (result) => {
+        const ctx = lastSelectionContext;
+        if (!ctx || !manager) return;
+        const finding = buildFinding(
+          result.description,
+          result.severity,
+          ctx,
+          result.contextJson.screenshot_data_url ?? null
+        );
+        manager.queue(finding);
+        updateBadgeCount();
+        issueForm?.hide();
+        deactivateSelection();
+      },
+      onSendNow: async (result) => {
+        const ctx = lastSelectionContext;
+        if (!ctx || !manager) return;
+        const finding = buildFinding(
+          result.description,
+          result.severity,
+          ctx,
+          result.contextJson.screenshot_data_url ?? null
+        );
+        manager.queue(finding);
+        issueForm?.hide();
+        try {
+          await manager.sendBatch();
+          updateBadgeCount();
+          deactivateSelection();
+        } catch {
+          updateBadgeCount();
+          toggleQueuePanel();
+        }
+      },
+      onCancel: () => {
+        issueForm?.hide();
+        deactivateSelection();
+      }
+    });
+  }
+  if (!queuePanel) {
+    queuePanel = new QueuePanel(wrapper, {
+      getQueueSnapshot: () => manager?.getQueueSnapshot() ?? [],
+      onSendBatch: () => manager.sendBatch(),
+      onClearAll: () => {
+        manager?.clearQueue();
+        updateBadgeCount();
+      },
+      onRemoveItem: (index) => {
+        if (!manager) return;
+        const snapshot = manager.getQueueSnapshot();
+        const remaining = snapshot.filter((_, i) => i !== index);
+        manager.replaceQueue(remaining);
+        updateBadgeCount();
+      },
+      onEditItem: (index, title, description, severity) => {
+        if (!manager) return;
+        const snapshot = manager.getQueueSnapshot();
+        if (index >= 0 && index < snapshot.length) {
+          snapshot[index] = { ...snapshot[index], title, description, severity };
+          manager.replaceQueue(snapshot);
+        }
+      }
+    });
+  }
+  updateBadgeCount();
+}
+function hideVisibleUI() {
+  if (state === "charging") {
+    chargeIndicator?.hide();
+  }
+  picker?.deactivate();
+  picker = null;
+  highlighter?.clear();
+  issueForm?.hide();
+  queuePanel?.destroy();
+  logo?.unmount();
+  queuePanel = null;
+  logo = null;
+  state = "idle";
+}
+function showLogoContextMenu(x, y) {
+  if (!overlay || !contextMenu) return;
+  const wrapper = overlay.getContentWrapper();
+  if (!wrapper) return;
+  contextMenu.showAt(wrapper, x, y);
+}
+function activateSelection() {
+  if (state !== "idle" && state !== "charging" || !overlay || !highlighter) return;
+  const hostEl = overlay.getHostElement();
+  if (!hostEl) return;
+  if (picker) {
+    picker.deactivate();
+  }
+  picker = new ElementPicker({
+    overlayHostElement: hostEl,
+    highlighter,
+    onElementClick: (element, context) => {
+      if (state !== "selecting") return;
+      lastSelectionContext = context;
+      state = "capturing";
+      picker?.deactivate();
+      issueForm?.show(context, element);
+    },
+    onEscape: () => {
+      if (state === "selecting") {
+        deactivateSelection();
+      } else if (state === "capturing") {
+        issueForm?.hide();
+        deactivateSelection();
+      }
+    }
+  });
+  picker.activate();
+  state = "selecting";
+}
+function deactivateSelection() {
+  picker?.deactivate();
+  highlighter?.clear();
+  state = "idle";
+}
+function toggleQueuePanel() {
+  if (!queuePanel) return;
+  if (queuePanel.isOpen) {
+    queuePanel.hide();
+  } else {
+    queuePanel.show();
+    queuePanel.refresh();
+  }
+}
+function updateBadgeCount() {
+  logo?.updateCount(manager?.getQueueSnapshot().length ?? 0);
+}
+
+// src/index.ts
+var manager2 = new FeedbackManager();
+registerInteractionLayer(manager2);
+function init(config) {
+  manager2.init(config);
+  manager2.enable();
+}
+function enable() {
+  manager2.enable();
+}
+function disable() {
+  manager2.disable();
+}
+function onEnable(handler) {
+  return manager2.onEnable(handler);
+}
+function onDisable(handler) {
+  return manager2.onDisable(handler);
+}
+async function sendBatch() {
+  return manager2.sendBatch();
+}
+function queue(finding) {
+  manager2.queue(finding);
+}
+function clearQueue() {
+  manager2.clearQueue();
+}
+function replaceQueue(items) {
+  manager2.replaceQueue(items);
+}
+function isEnabled() {
+  return manager2.enabled;
+}
+function getQueueSnapshot() {
+  return manager2.getQueueSnapshot();
+}
+function getQueueLength() {
+  return manager2.queueLength;
+}
+function __resetForTesting() {
+  __resetInteractionLayer();
+  manager2.destroy();
+  manager2 = new FeedbackManager();
+  registerInteractionLayer(manager2);
+}
+export {
+  FeedbackManager,
+  SynodFeedbackClient,
+  __resetForTesting,
+  clearQueue,
+  decodeFindingsFromClipboard,
+  disable,
+  enable,
+  encodeFindingsToClipboard,
+  getQueueLength,
+  getQueueSnapshot,
+  init,
+  isEnabled,
+  onDisable,
+  onEnable,
+  queue,
+  replaceQueue,
+  sendBatch
+};
+//# sourceMappingURL=index.mjs.map