@omnivoice/page-agent 0.4.0 → 0.6.0

package/dist/esm/page-agent.js

@@ -0,0 +1,4870 @@
+(function() {
+  "use strict";
+  try {
+    if (typeof document != "undefined") {
+      var elementStyle = document.createElement("style");
+      elementStyle.appendChild(document.createTextNode("._wrapper_1rq3n_1 {\n	position: fixed;\n	bottom: 100px;\n	left: 50%;\n	transform: translateX(-50%) translateY(20px);\n	opacity: 0;\n	z-index: 2147483642; /* 比 SimulatorMask 高一层 */\n	box-sizing: border-box;\n\n	overflow: visible;\n\n	* {\n		box-sizing: border-box;\n	}\n\n	--width: 360px;\n	--height: 40px;\n	--border-radius: 12px;\n\n	--side-space: 12px; /* 控制栏两侧的间距 */\n	--history-width: calc(var(--width) - var(--side-space) * 2);\n\n	--color-1: rgb(57, 182, 255);\n	--color-2: rgb(189, 69, 251);\n	--color-3: rgb(255, 87, 51);\n	--color-4: rgb(255, 214, 0);\n\n	width: var(--width);\n	height: var(--height);\n\n	transition: all 0.3s ease-in-out;\n\n	/* FORK: responsivo. O upstream só encolhia a largura; no celular o painel ainda ficava a\n	   100px do rodapé (sobre a área do polegar e sobre a barra do navegador), com as mesmas\n	   margens laterais de desktop. Aqui ele encosta no rodapé respeitando a safe area, usa a\n	   largura quase inteira e limita a altura do histórico para não cobrir a página. */\n	@media (max-width: 640px) {\n		--width: calc(100vw - 16px);\n		--side-space: 8px;\n		width: var(--width);\n		bottom: calc(12px + env(safe-area-inset-bottom, 0px));\n		--history-max: min(60vh, calc(100dvh - 120px - var(--height)));\n	}\n\n	/* Quem prefere menos animação não deve receber transição de layout. */\n	@media (prefers-reduced-motion: reduce) {\n		transition: none;\n\n		* {\n			animation: none !important;\n			transition: none !important;\n		}\n	}\n\n	._background_1rq3n_55 {\n		position: absolute;\n		inset: -2px -8px;\n		border-radius: calc(var(--border-radius) + 4px);\n		filter: blur(16px);\n		overflow: hidden;\n		/* mix-blend-mode: lighten; */\n		/* display: none; */\n\n		&::before {\n			content: '';\n			z-index: -1;\n			pointer-events: none;\n			position: absolute;\n			width: 100%;\n			height: 100%;\n			/* left: -100%; */\n			left: 0;\n			top: 0;\n\n			background-image: linear-gradient(\n				to bottom left,\n				var(--color-1),\n				var(--color-2),\n				var(--color-1)\n			);\n			animation: _mask-running_1rq3n_1 2s linear infinite;\n		}\n		&::after {\n			content: '';\n			z-index: -1;\n			pointer-events: none;\n			position: absolute;\n			width: 100%;\n			height: 100%;\n			left: 0;\n			top: 0;\n\n			background-image: linear-gradient(\n				to bottom left,\n				var(--color-2),\n				var(--color-1),\n				var(--color-2)\n			);\n			animation: _mask-running_1rq3n_1 2s linear infinite;\n			animation-delay: 1s;\n		}\n	}\n}\n\n@keyframes _mask-running_1rq3n_1 {\n	from {\n		transform: translateX(-100%);\n	}\n	to {\n		transform: translateX(100%);\n	}\n}\n\n/* 控制栏 */\n._header_1rq3n_115 {\n	display: flex;\n	align-items: center;\n	justify-content: space-between;\n	padding: 8px 12px;\n	user-select: none;\n\n	position: absolute;\n	inset: 0;\n\n	cursor: pointer;\n	flex-shrink: 0; /* 防止 header 被压缩 */\n\n	background: rgba(0, 0, 0, 0.5);\n	backdrop-filter: blur(10px);\n	border-radius: var(--border-radius);\n	background-clip: padding-box;\n\n	box-shadow:\n		0 0 0px 2px rgba(255, 255, 255, 0.4),\n		0 0 5px 1px rgba(255, 255, 255, 0.3);\n\n	._statusSection_1rq3n_137 {\n		display: flex;\n		align-items: center;\n		gap: 8px;\n		flex: 1;\n		min-height: 24px; /* 确保垂直居中 */\n\n		._indicator_1rq3n_144 {\n			width: 6px;\n			height: 6px;\n			border-radius: 50%;\n			background: rgba(255, 255, 255, 0.5);\n			flex-shrink: 0;\n			animation: none; /* 默认无动画 */\n\n			/* 运行状态 - 有动画 */\n			&._thinking_1rq3n_153 {\n				background: rgb(57, 182, 255);\n				animation: _pulse_1rq3n_1 0.8s ease-in-out infinite;\n			}\n\n			&._tool_executing_1rq3n_158 {\n				background: rgb(189, 69, 251);\n				animation: _pulse_1rq3n_1 0.6s ease-in-out infinite;\n			}\n\n			&._retry_1rq3n_163 {\n				background: rgb(255, 214, 0);\n				animation: _retryPulse_1rq3n_1 1s ease-in-out infinite;\n			}\n\n			/* 静止状态 - 无动画 */\n			&._completed_1rq3n_169,\n			&._input_1rq3n_170,\n			&._output_1rq3n_171 {\n				background: rgb(34, 197, 94);\n				animation: none;\n			}\n\n			&._error_1rq3n_176 {\n				background: rgb(239, 68, 68);\n				animation: none;\n			}\n		}\n\n		._statusText_1rq3n_182 {\n			color: white;\n			font-size: 12px;\n			line-height: 1;\n			font-weight: 500;\n			transition: all 0.3s ease-in-out;\n			position: relative;\n			overflow: hidden;\n			display: flex;\n			align-items: center;\n			min-height: 24px; /* 确保垂直居中 */\n\n			&._fadeOut_1rq3n_194 {\n				animation: _statusTextFadeOut_1rq3n_1 0.3s ease forwards;\n			}\n\n			&._fadeIn_1rq3n_198 {\n				animation: _statusTextFadeIn_1rq3n_1 0.3s ease forwards;\n			}\n		}\n	}\n\n	._controls_1rq3n_204 {\n		display: flex;\n		align-items: center;\n		gap: 4px;\n\n		._controlButton_1rq3n_209 {\n			width: 24px;\n			height: 24px;\n			border: none;\n			border-radius: 4px;\n			background: rgba(255, 255, 255, 0.1);\n			color: white;\n			cursor: pointer;\n			display: flex;\n			align-items: center;\n			justify-content: center;\n			font-size: 12px;\n			line-height: 1;\n\n			&:hover {\n				background: rgba(255, 255, 255, 0.2);\n			}\n		}\n\n		._stopButton_1rq3n_228 {\n			background: rgba(239, 68, 68, 0.2);\n			color: rgb(255, 41, 41);\n			font-weight: 600;\n\n			&:hover {\n				background: rgba(239, 68, 68, 0.3);\n			}\n		}\n	}\n}\n\n@keyframes _statusTextFadeIn_1rq3n_1 {\n	0% {\n		opacity: 0;\n		transform: translateY(5px);\n	}\n	100% {\n		opacity: 1;\n		transform: translateY(0);\n	}\n}\n\n@keyframes _statusTextFadeOut_1rq3n_1 {\n	0% {\n		opacity: 1;\n		transform: translateY(0);\n	}\n	100% {\n		opacity: 0;\n		transform: translateY(-5px);\n	}\n}\n\n._historySectionWrapper_1rq3n_262 {\n	position: absolute;\n	width: var(--history-width);\n	bottom: var(--height);\n	left: var(--side-space);\n	z-index: -2;\n\n	padding-top: 0px;\n	visibility: collapse;\n	overflow: hidden;\n\n	transition: all 0.2s;\n\n	background: rgba(2, 0, 20, 0.5);\n	/* background: rgba(186, 186, 186, 0.2); */\n	backdrop-filter: blur(10px);\n\n	text-shadow: 0 0 1px rgba(0, 0, 0, 0.2);\n\n	border-top-left-radius: calc(var(--border-radius) + 4px);\n	border-top-right-radius: calc(var(--border-radius) + 4px);\n\n	/* border: 2px solid rgba(255, 255, 255, 0.8); */\n	border: 2px solid rgba(255, 255, 255, 0.4);\n	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.6);\n\n	/* @media (prefers-color-scheme: dark) {\n		box-shadow:\n			0 8px 32px 0 rgba(0, 0, 0, 0.85),\n			0 2px 12px 0 rgba(57, 182, 255, 0.1);\n	} */\n\n	._expanded_1rq3n_294 & {\n		padding-top: 8px;\n		visibility: visible;\n	}\n\n	._historySection_1rq3n_262 {\n		position: relative;\n		overflow-y: auto;\n		overscroll-behavior: contain;\n		scrollbar-width: none;\n		max-height: 0;\n		padding-inline: 8px;\n\n		transition: max-height 0.2s;\n\n		._expanded_1rq3n_294 & {\n			/* FORK: vira variável para o celular poder reaproveitar o espaço que o painel deixou de\n			   ocupar no rodapé; a reserva fixa de 200px era do layout de desktop. */\n			max-height: var(--history-max, min(500px, calc(100vh - 200px - var(--height))));\n		}\n\n		/* FORK: componentes de mensagem redesenhados.\n		   O upstream usava lajota translúcida sobre a página do usuário, então o contraste do texto\n		   dependia do que estivesse atrás — sobre página clara o texto branco sumia. Aqui a bolha é\n		   OPACA, com par de cores fixo e contraste medido (o teste mede). O formato segue o de um\n		   aplicativo de mensagens: a fala da pessoa de um lado, a do agente do outro. */\n		._historyRow_1rq3n_320 {\n			display: flex;\n			margin-bottom: 8px;\n\n			&:last-child {\n				margin-bottom: 12px;\n			}\n\n			&._fromPessoa_1rq3n_328 {\n				justify-content: flex-end;\n			}\n\n			&._fromAgente_1rq3n_332,\n			&._fromSistema_1rq3n_333 {\n				justify-content: flex-start;\n			}\n		}\n\n		._historyItem_1rq3n_338 {\n			--bolha: #22222e;\n			--bolha-texto: #ececf2;\n			--bolha-meta: #a9a9bd;\n			--bolha-realce: #7a8cff;\n\n			max-width: 88%;\n			min-width: 0;\n			padding: 7px 10px 8px;\n			border-radius: 12px;\n			background: var(--bolha);\n			color: var(--bolha-texto);\n			font-size: 13px;\n			line-height: 1.45;\n			box-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);\n\n			/* A bolha só precisa de um canto reto do lado de quem fala — é o que dá a leitura de\n			   conversa sem desenhar rabicho. */\n			._fromPessoa_1rq3n_328 & {\n				--bolha: #2f4f74;\n				--bolha-texto: #f2f6fb;\n				--bolha-meta: #bcd0e6;\n				border-bottom-right-radius: 4px;\n			}\n\n			._fromAgente_1rq3n_332 &,\n			._fromSistema_1rq3n_333 & {\n				border-bottom-left-radius: 4px;\n			}\n\n			/* O tipo não pinta o fundo inteiro: pintar derruba o contraste e some com a hierarquia.\n			   Ele colore só o ícone e o nome do autor, que é onde a informação faz falta. */\n			&._output_1rq3n_171 {\n				--bolha-realce: #58d68d;\n			}\n\n			&._observation_1rq3n_374 {\n				--bolha-realce: #c49bff;\n			}\n\n			&._question_1rq3n_378 {\n				--bolha-realce: #ffb067;\n			}\n\n			&._doneSuccess_1rq3n_382 {\n				--bolha: #1d3b2a;\n				--bolha-texto: #e3f8ec;\n				--bolha-meta: #a9d8bd;\n				--bolha-realce: #58d68d;\n				font-weight: 500;\n			}\n\n			&._doneFailure_1rq3n_390,\n			&._error_1rq3n_176 {\n				--bolha: #412128;\n				--bolha-texto: #fde8ec;\n				--bolha-meta: #e3aeb8;\n				--bolha-realce: #ff8095;\n			}\n\n			&._retry_1rq3n_163 {\n				--bolha-realce: #ffd166;\n			}\n\n			._historyHeader_1rq3n_402 {\n				display: flex;\n				align-items: center;\n				gap: 6px;\n				margin-bottom: 3px;\n				color: var(--bolha-realce);\n			}\n\n			._historyAuthor_1rq3n_410 {\n				font-size: 11px;\n				font-weight: 600;\n				letter-spacing: 0.01em;\n			}\n\n			._historyMeta_1rq3n_416 {\n				margin-left: auto;\n				font-size: 11px;\n				color: var(--bolha-meta);\n				white-space: nowrap;\n			}\n\n			/* O ícone é SVG, então o tamanho vem de uma caixa fixa e não do font-size — emoji herdava\n			   a métrica da fonte do sistema e saía desproporcional. É decorativo: o autor vai em texto\n			   ao lado, e o SVG carrega aria-hidden. */\n			._statusIcon_1rq3n_426 {\n				flex-shrink: 0;\n				width: 14px;\n				height: 14px;\n				line-height: 1;\n\n				svg {\n					width: 100%;\n					height: 100%;\n					display: block;\n				}\n			}\n\n			._historyContent_1rq3n_439 {\n				/* FORK: `break-all` partia palavra no meio (\"corretamen/te\"). `anywhere` só quebra\n				   quando o token não cabe de jeito nenhum — uma URL longa, não uma palavra comum. */\n				word-break: normal;\n				overflow-wrap: anywhere;\n\n				> span,\n				._reflectionLine_1rq3n_446 {\n					white-space: pre-wrap;\n				}\n			}\n\n			._reflectionLines_1rq3n_451 {\n				display: flex;\n				flex-direction: column;\n				gap: 7px;\n			}\n\n			._reflectionLine_1rq3n_446 {\n				display: block;\n			}\n\n			/* O rótulo substitui o emoji que antes dava o sentido da linha. */\n			._reflectionLabel_1rq3n_462 {\n				display: block;\n				font-size: 10px;\n				font-weight: 700;\n				letter-spacing: 0.07em;\n				text-transform: uppercase;\n				color: var(--bolha-meta);\n				margin-bottom: 1px;\n			}\n		}\n\n		/* Em telas de alto contraste, a borda devolve o limite da bolha que a cor sozinha dá. */\n		@media (prefers-contrast: more) {\n			._historyItem_1rq3n_338 {\n				--bolha: #000000;\n				--bolha-texto: #ffffff;\n				--bolha-meta: #e0e0e0;\n				border: 1px solid #ffffff;\n			}\n		}\n	}\n}\n\n/* 动画关键帧 - 更快的闪烁 */\n@keyframes _pulse_1rq3n_1 {\n	0%,\n	100% {\n		opacity: 1;\n		transform: scale(1);\n	}\n	50% {\n		opacity: 0.4;\n		transform: scale(1.3);\n	}\n}\n\n/* 重试动画 - 旋转脉冲 */\n@keyframes _retryPulse_1rq3n_1 {\n	0%,\n	100% {\n		opacity: 1;\n		transform: scale(1) rotate(0deg);\n	}\n	25% {\n		opacity: 0.6;\n		transform: scale(1.2) rotate(90deg);\n	}\n	50% {\n		opacity: 0.8;\n		transform: scale(1.1) rotate(180deg);\n	}\n	75% {\n		opacity: 0.6;\n		transform: scale(1.2) rotate(270deg);\n	}\n}\n\n/* 庆祝动画 */\n@keyframes _celebrate_1rq3n_1 {\n	0%,\n	100% {\n		transform: scale(1);\n	}\n	25% {\n		transform: scale(1.2) rotate(-5deg);\n	}\n	75% {\n		transform: scale(1.2) rotate(5deg);\n	}\n}\n\n/* done 卡片的光泽效果 */\n@keyframes _shimmer_1rq3n_1 {\n	0% {\n		left: -100%;\n	}\n	100% {\n		left: 100%;\n	}\n}\n\n/* 输入区域样式 */\n._inputSectionWrapper_1rq3n_544 {\n	position: absolute;\n	width: var(--history-width);\n	top: var(--height);\n	left: var(--side-space);\n	z-index: -1;\n\n	visibility: visible;\n	overflow: hidden;\n\n	height: 48px;\n\n	transition: all 0.2s;\n\n	background: rgba(186, 186, 186, 0.2);\n	backdrop-filter: blur(10px);\n\n	border-bottom-left-radius: calc(var(--border-radius) + 4px);\n	border-bottom-right-radius: calc(var(--border-radius) + 4px);\n\n	border: 2px solid rgba(255, 255, 255, 0.3);\n	box-shadow: 0 1px 16px rgba(0, 0, 0, 0.4);\n\n	&._hidden_1rq3n_567 {\n		visibility: collapse;\n		height: 0;\n	}\n\n	._inputSection_1rq3n_544 {\n		display: flex;\n		align-items: center;\n		gap: 4px;\n		padding: 8px 8px;\n\n		._taskInput_1rq3n_578 {\n			flex: 1;\n			background: rgba(255, 255, 255, 0.4);\n			border: 1px solid rgba(255, 255, 255, 0.3);\n			border-radius: 10px;\n			padding-inline: 10px;\n			color: rgb(20, 20, 20);\n			font-size: 12px;\n			height: 28px;\n			line-height: 1;\n			outline: none;\n			transition: all 0.2s ease;\n\n			/* text-shadow: 0 0 2px rgba(255, 255, 255, 0.8); */\n\n			/* border-color: rgba(57, 182, 255, 0.3); */\n\n			&::placeholder {\n				color: rgb(53, 53, 53);\n			}\n\n			&:focus {\n				background: rgba(255, 255, 255, 0.8);\n				border-color: rgba(57, 182, 255, 0.6);\n				box-shadow: 0 0 0 2px rgba(57, 182, 255, 0.2);\n			}\n		}\n	}\n}\n/* FORK: estilos do widget central (launcher + microfone). Injetados via CSS-in-JS — sem\n   request de CSS separada, sem fontes externas. Pensado para mobile (alvo de toque 48px,\n   safe-area) e para não brigar com a página host (z-index alto, cor própria). */\n\n.page-agent-widget-launcher {\n	position: fixed;\n	z-index: 2147483630;\n	width: 48px;\n	height: 48px;\n	padding: 0;\n	display: inline-flex;\n	align-items: center;\n	justify-content: center;\n	border: none;\n	border-radius: 50%;\n	background: #111827;\n	color: #f9fafb;\n	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.28);\n	cursor: pointer;\n	transition: transform 0.12s ease, box-shadow 0.12s ease, background 0.12s ease;\n	-webkit-tap-highlight-color: transparent;\n}\n\n/* Safe-area em telas com notch/barras: o botão não fica preso na borda. */\n.page-agent-widget-launcher {\n	right: calc(20px + env(safe-area-inset-right, 0px));\n	bottom: calc(20px + env(safe-area-inset-bottom, 0px));\n}\n\n.page-agent-widget-launcher:hover {\n	transform: translateY(-1px);\n	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.34);\n	background: #1f2937;\n}\n\n.page-agent-widget-launcher:active {\n	transform: translateY(0) scale(0.97);\n}\n\n.page-agent-widget-launcher:focus-visible {\n	outline: 3px solid #60a5fa;\n	outline-offset: 2px;\n}\n\n.page-agent-widget-launcher svg {\n	display: block;\n}\n\n/* Botão de microfone, injetado ao lado do input de tarefa do painel. */\n.page-agent-voice-mic {\n	display: inline-flex;\n	align-items: center;\n	justify-content: center;\n	width: 34px;\n	height: 34px;\n	flex: 0 0 auto;\n	margin-right: 8px;\n	padding: 0;\n	border: 1px solid rgba(148, 163, 184, 0.4);\n	border-radius: 8px;\n	background: rgba(148, 163, 184, 0.12);\n	color: inherit;\n	cursor: pointer;\n	transition: background 0.12s ease, border-color 0.12s ease, transform 0.12s ease;\n	-webkit-tap-highlight-color: transparent;\n}\n\n.page-agent-voice-mic:hover {\n	background: rgba(148, 163, 184, 0.22);\n	border-color: rgba(148, 163, 184, 0.6);\n}\n\n.page-agent-voice-mic:active {\n	transform: scale(0.96);\n}\n\n.page-agent-voice-mic:focus-visible {\n	outline: 2px solid #60a5fa;\n	outline-offset: 1px;\n}\n\n.page-agent-voice-mic.is-listening {\n	background: rgba(239, 68, 68, 0.16);\n	border-color: rgba(239, 68, 68, 0.6);\n	animation: page-agent-voice-pulse 1.4s ease-in-out infinite;\n}\n\n@keyframes page-agent-voice-pulse {\n	0%,\n	100% {\n		box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.35);\n	}\n	50% {\n		box-shadow: 0 0 0 6px rgba(239, 68, 68, 0);\n	}\n}\n\n@media (prefers-reduced-motion: reduce) {\n	.page-agent-voice-mic.is-listening {\n		animation: none;\n	}\n}"));
+      document.head.appendChild(elementStyle);
+    }
+  } catch (e) {
+    console.error("vite-plugin-css-injected-by-js", e);
+  }
+})();
+import * as z from "zod/v4";
+import chalk from "chalk";
+const InvokeErrorTypes = {
+  // Retryable
+  NETWORK_ERROR: "network_error",
+  // Network error, retry
+  RATE_LIMIT: "rate_limit",
+  // Rate limit, retry
+  SERVER_ERROR: "server_error",
+  // 5xx, retry
+  NO_TOOL_CALL: "no_tool_call",
+  // Model did not call tool
+  INVALID_TOOL_ARGS: "invalid_tool_args",
+  // Tool args don't match schema
+  TOOL_EXECUTION_ERROR: "tool_execution_error",
+  // Tool execution error
+  INVALID_RESPONSE: "invalid_response",
+  // Response body is not valid JSON
+  INVALID_SCHEMA: "invalid_schema",
+  // Response is valid JSON but doesn't match expected shape
+  UNKNOWN: "unknown",
+  // Non-retryable
+  CONFIG_ERROR: "config_error",
+  // Invalid local configuration or hook
+  AUTH_ERROR: "auth_error",
+  // Authentication failed
+  CONTEXT_LENGTH: "context_length",
+  // Prompt too long
+  CONTENT_FILTER: "content_filter"
+  // Content filtered
+};
+const RETRYABLE_TYPES = [
+  InvokeErrorTypes.NETWORK_ERROR,
+  InvokeErrorTypes.RATE_LIMIT,
+  InvokeErrorTypes.SERVER_ERROR,
+  InvokeErrorTypes.NO_TOOL_CALL,
+  InvokeErrorTypes.INVALID_TOOL_ARGS,
+  InvokeErrorTypes.TOOL_EXECUTION_ERROR,
+  InvokeErrorTypes.INVALID_RESPONSE,
+  InvokeErrorTypes.INVALID_SCHEMA,
+  InvokeErrorTypes.UNKNOWN
+];
+class InvokeError extends Error {
+  type;
+  retryable;
+  statusCode;
+  /* raw error (provided if this error is caused by another error) */
+  rawError;
+  /* raw response from the API (provided if this error is caused by an API calling) */
+  rawResponse;
+  constructor(type, message, rawError, rawResponse) {
+    super(message);
+    this.name = "InvokeError";
+    this.type = type;
+    this.retryable = RETRYABLE_TYPES.includes(type);
+    this.rawError = rawError;
+    this.rawResponse = rawResponse;
+  }
+}
+function debug(...args) {
+  console.debug(chalk.gray("[LLM]"), ...args);
+}
+function zodToOpenAITool(name, tool2) {
+  return {
+    type: "function",
+    function: {
+      name,
+      description: tool2.description,
+      parameters: z.toJSONSchema(tool2.inputSchema, { target: "openapi-3.0" })
+    }
+  };
+}
+function modelPatch(body, baseURL) {
+  const model = body.model || "";
+  if (!model) return body;
+  const provider = getProvider(baseURL);
+  const modelName = normalizeModelName(model);
+  if (modelName.startsWith("qwen")) {
+    if (provider === "openrouter" && modelName.startsWith("qwen38-max")) {
+      debug("Patch Qwen3.8-max on OpenRouter: reasoning_effort=low, remove tool_choice");
+      body.reasoning_effort = "low";
+      delete body.tool_choice;
+    } else {
+      debug("Patch Qwen: disable thinking");
+      body.enable_thinking = false;
+    }
+    if (body.temperature === void 0 && !/max|plus/.test(modelName)) {
+      debug("Patch Qwen: raise temperature to 1.0");
+      body.temperature = 1;
+    }
+  }
+  if (modelName.startsWith("deepseek")) {
+    debug("Patch DeepSeek: disable thinking, remove tool_choice");
+    body.thinking = { type: "disabled" };
+    delete body.tool_choice;
+  }
+  if (modelName.startsWith("gpt")) {
+    if (modelName.startsWith("gpt-5")) {
+      body.verbosity = "low";
+    }
+    if (modelName.includes("chat-latest")) {
+      debug("Patch chat-latest: omit reasoning_effort and temperature");
+      delete body.reasoning_effort;
+      delete body.temperature;
+    } else if (/^gpt-5[12](-|$)/.test(modelName)) {
+      debug("Patch GPT-5.1/5.2: reasoning_effort=none");
+      body.reasoning_effort = "none";
+    } else if (/^gpt-5(-|$)/.test(modelName)) {
+      debug("Patch GPT-5: reasoning_effort=minimal");
+      body.reasoning_effort = "minimal";
+    } else {
+      debug("Patch GPT: omit reasoning_effort");
+      delete body.reasoning_effort;
+    }
+  }
+  if (modelName.startsWith("claude")) {
+    if (/opus|sonnet|haiku/.test(modelName)) {
+      debug("Patch Claude: disable thinking");
+      body.thinking = { type: "disabled" };
+      if (provider !== "openrouter") {
+        if (body.tool_choice === "required") {
+          debug('Applying Claude patch: convert tool_choice "required" to { type: "any" }');
+          body.tool_choice = { type: "any" };
+        } else if (body.tool_choice?.function?.name) {
+          debug("Applying Claude patch: convert tool_choice format");
+          body.tool_choice = { type: "tool", name: body.tool_choice.function.name };
+        }
+      }
+    } else {
+      debug("Patch Claude: reasoning_effort=low");
+      body.reasoning_effort = "low";
+      delete body.tool_choice;
+    }
+  }
+  if (modelName.startsWith("gemini")) {
+    debug("Patch Gemini: reasoning_effort=low");
+    body.reasoning_effort = "low";
+    if (/^gemini-25(?!.*pro)/.test(modelName)) {
+      debug("Patch Gemini 2.5 non-Pro: reasoning_effort=none");
+      body.reasoning_effort = "none";
+    } else if (modelName.startsWith("gemini-35-flash") || modelName.startsWith("gemini-31-flash-lite") || modelName.startsWith("gemini-3-flash")) {
+      debug("Patch Gemini 3.x Flash/Lite: reasoning_effort=minimal");
+      body.reasoning_effort = "minimal";
+    }
+  }
+  if (modelName.startsWith("glm")) {
+    if (/^glm-5[3-9]/.test(modelName)) {
+      debug("Patch GLM 5.3+: reasoning_effort=low");
+      body.reasoning_effort = "low";
+    } else {
+      debug("Patch GLM: disable thinking");
+      body.thinking = { type: "disabled" };
+    }
+  }
+  if (modelName.startsWith("hy")) {
+    debug("Patch Hunyuan: disable thinking, reasoning_effort=low");
+    body.thinking = { type: "disabled" };
+    body.reasoning_effort = "low";
+  }
+  if (modelName.startsWith("grok")) {
+    if (/^grok-4-?3/.test(modelName)) {
+      debug("Patch Grok 4.3: reasoning_effort=none");
+      body.reasoning_effort = "none";
+    } else if (modelName.startsWith("grok-3-mini") || modelName.startsWith("grok-code-fast")) {
+      debug("Patch Grok mini/code: reasoning_effort=low");
+      body.reasoning_effort = "low";
+    }
+  }
+  if (modelName.startsWith("kimi")) {
+    if (modelName.startsWith("kimi-k3")) {
+      debug("Patch Kimi K3: use required tool choice, remove parallel tool calls");
+      delete body.parallel_tool_calls;
+      if (body.tool_choice?.function?.name) body.tool_choice = "required";
+    } else if (!modelName.includes("code")) {
+      debug("Patch Kimi: disable thinking");
+      body.thinking = { type: "disabled" };
+    }
+  }
+  if (modelName.startsWith("minimax")) {
+    debug("Patch MiniMax: remove parallel_tool_calls");
+    delete body.parallel_tool_calls;
+    if (modelName.includes("m3")) {
+      debug("Patch MiniMax: disable thinking");
+      body.thinking = { type: "disabled" };
+    }
+  }
+  if (provider === "openrouter") {
+    const reasoningEffort = body.reasoning_effort;
+    const reasoningDisabled = body.thinking?.type === "disabled" || body.enable_thinking === false || reasoningEffort === "none";
+    if (reasoningDisabled) {
+      body.reasoning = { enabled: false };
+    } else if (reasoningEffort) {
+      body.reasoning = { enabled: true, effort: reasoningEffort };
+    }
+  }
+  return body;
+}
+function normalizeModelName(modelName) {
+  let normalizedName = modelName.toLowerCase();
+  if (normalizedName.includes("/")) {
+    normalizedName = normalizedName.split("/")[1];
+  }
+  normalizedName = normalizedName.replace(/_/g, "");
+  normalizedName = normalizedName.replace(/\./g, "");
+  return normalizedName;
+}
+function getProvider(baseURL) {
+  if (!baseURL) return void 0;
+  try {
+    const url = new URL(baseURL);
+    const hostname = url.hostname;
+    if (hostname === "openrouter.ai") return "openrouter";
+    return void 0;
+  } catch (e) {
+    return void 0;
+  }
+}
+class OpenAIClient {
+  config;
+  fetch;
+  constructor(config) {
+    this.config = config;
+    this.fetch = config.customFetch;
+  }
+  async invoke(messages, tools2, abortSignal, options) {
+    abortSignal?.throwIfAborted();
+    const openaiTools = Object.entries(tools2).map(([name, t]) => zodToOpenAITool(name, t));
+    let toolChoice = "required";
+    if (options?.toolChoiceName && !this.config.disableNamedToolChoice) {
+      toolChoice = { type: "function", function: { name: options.toolChoiceName } };
+    }
+    const requestBody = {
+      model: this.config.model,
+      messages,
+      tools: openaiTools,
+      parallel_tool_calls: false,
+      tool_choice: toolChoice
+    };
+    if (this.config.temperature !== void 0) {
+      requestBody.temperature = this.config.temperature;
+    }
+    modelPatch(requestBody, this.config.baseURL);
+    let transformedBody;
+    try {
+      transformedBody = this.config.transformRequestBody(requestBody);
+    } catch (error2) {
+      throw new InvokeError(
+        InvokeErrorTypes.CONFIG_ERROR,
+        `transformRequestBody failed: ${error2.message}`,
+        error2
+      );
+    }
+    const finalRequestBody = transformedBody ?? requestBody;
+    let response;
+    try {
+      response = await this.fetch(`${this.config.baseURL}/chat/completions`, {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+          ...this.config.apiKey && { Authorization: `Bearer ${this.config.apiKey}` }
+        },
+        body: JSON.stringify(finalRequestBody),
+        signal: abortSignal
+      });
+    } catch (error2) {
+      if (error2?.name === "AbortError") throw error2;
+      console.error(error2);
+      throw new InvokeError(InvokeErrorTypes.NETWORK_ERROR, "Network request failed", error2);
+    }
+    if (!response.ok) {
+      let errorData;
+      try {
+        errorData = await response.json();
+      } catch (error2) {
+        if (error2?.name === "AbortError") throw error2;
+      }
+      const errorMessage = errorData?.error?.message || response.statusText;
+      if (response.status === 401 || response.status === 403) {
+        throw new InvokeError(
+          InvokeErrorTypes.AUTH_ERROR,
+          `Authentication failed: ${errorMessage}`,
+          errorData
+        );
+      }
+      if (response.status === 429) {
+        throw new InvokeError(
+          InvokeErrorTypes.RATE_LIMIT,
+          `Rate limit exceeded: ${errorMessage}`,
+          errorData
+        );
+      }
+      if (response.status >= 500) {
+        throw new InvokeError(
+          InvokeErrorTypes.SERVER_ERROR,
+          `Server error: ${errorMessage}`,
+          errorData
+        );
+      }
+      throw new InvokeError(
+        InvokeErrorTypes.UNKNOWN,
+        `HTTP ${response.status}: ${errorMessage}`,
+        errorData
+      );
+    }
+    let data;
+    try {
+      data = await response.json();
+    } catch (error2) {
+      if (error2?.name === "AbortError") throw error2;
+      throw new InvokeError(
+        InvokeErrorTypes.INVALID_RESPONSE,
+        "Response body is not valid JSON",
+        error2
+      );
+    }
+    const choice = data.choices?.[0];
+    if (!choice) {
+      throw new InvokeError(InvokeErrorTypes.INVALID_SCHEMA, "No choices in response", data);
+    }
+    switch (choice.finish_reason) {
+      case "tool_calls":
+      case "function_call":
+      // gemini
+      case "stop":
+        break;
+      case "length":
+        throw new InvokeError(
+          InvokeErrorTypes.CONTEXT_LENGTH,
+          "Response truncated: max tokens reached",
+          void 0,
+          data
+        );
+      case "content_filter":
+        throw new InvokeError(
+          InvokeErrorTypes.CONTENT_FILTER,
+          "Content filtered by safety system",
+          void 0,
+          data
+        );
+      default:
+        throw new InvokeError(
+          InvokeErrorTypes.INVALID_SCHEMA,
+          `Unexpected finish_reason: ${choice.finish_reason}`,
+          void 0,
+          data
+        );
+    }
+    const normalizedData = options?.normalizeResponse ? options.normalizeResponse(data) : data;
+    const normalizedChoice = normalizedData.choices?.[0];
+    const toolCallName = normalizedChoice?.message?.tool_calls?.[0]?.function?.name;
+    if (!toolCallName) {
+      throw new InvokeError(
+        InvokeErrorTypes.NO_TOOL_CALL,
+        "No tool call found in response",
+        void 0,
+        data
+      );
+    }
+    const tool2 = tools2[toolCallName];
+    if (!tool2) {
+      throw new InvokeError(
+        InvokeErrorTypes.UNKNOWN,
+        `Tool "${toolCallName}" not found in tools`,
+        void 0,
+        data
+      );
+    }
+    const argString = normalizedChoice.message?.tool_calls?.[0]?.function?.arguments;
+    if (!argString) {
+      throw new InvokeError(
+        InvokeErrorTypes.INVALID_TOOL_ARGS,
+        "No tool call arguments found",
+        void 0,
+        data
+      );
+    }
+    let parsedArgs;
+    try {
+      parsedArgs = JSON.parse(argString);
+    } catch (error2) {
+      throw new InvokeError(
+        InvokeErrorTypes.INVALID_TOOL_ARGS,
+        "Failed to parse tool arguments as JSON",
+        error2,
+        data
+      );
+    }
+    const validation = tool2.inputSchema.safeParse(parsedArgs);
+    if (!validation.success) {
+      console.error(z.prettifyError(validation.error));
+      throw new InvokeError(
+        InvokeErrorTypes.INVALID_TOOL_ARGS,
+        "Tool arguments validation failed",
+        validation.error,
+        data
+      );
+    }
+    const toolInput = validation.data;
+    let toolResult;
+    try {
+      toolResult = await tool2.execute(toolInput);
+    } catch (error2) {
+      if (error2?.name === "AbortError") throw error2;
+      throw new InvokeError(
+        InvokeErrorTypes.TOOL_EXECUTION_ERROR,
+        `Tool execution failed: ${error2?.message}`,
+        error2,
+        data
+      );
+    }
+    return {
+      toolCall: {
+        name: toolCallName,
+        args: toolInput
+      },
+      toolResult,
+      usage: {
+        promptTokens: data.usage?.prompt_tokens ?? 0,
+        completionTokens: data.usage?.completion_tokens ?? 0,
+        totalTokens: data.usage?.total_tokens ?? 0,
+        cachedTokens: data.usage?.prompt_tokens_details?.cached_tokens,
+        reasoningTokens: data.usage?.completion_tokens_details?.reasoning_tokens
+      },
+      rawResponse: data,
+      rawRequest: finalRequestBody
+    };
+  }
+}
+class LLM extends EventTarget {
+  config;
+  client;
+  constructor(config) {
+    super();
+    this.config = parseLLMConfig(config);
+    this.client = new OpenAIClient(this.config);
+  }
+  /**
+   * - call llm api *once*
+   * - invoke tool call *once*
+   * - return the result of the tool
+   */
+  async invoke(messages, tools2, abortSignal, options) {
+    return await withRetry(async () => this.client.invoke(messages, tools2, abortSignal, options), {
+      maxRetries: this.config.maxRetries,
+      onRetry: (attempt, lastError) => {
+        this.dispatchEvent(
+          new CustomEvent("retry", {
+            detail: { attempt, maxAttempts: this.config.maxRetries, lastError }
+          })
+        );
+      }
+    });
+  }
+}
+async function withRetry(fn, settings) {
+  let attempt = 0;
+  while (true) {
+    try {
+      return await fn();
+    } catch (error2) {
+      if (error2?.name === "AbortError") throw error2;
+      if (error2 instanceof InvokeError && !error2.retryable) throw error2;
+      attempt++;
+      if (attempt > settings.maxRetries) throw error2;
+      console.debug("[LLM] retryable failure, will retry:", error2);
+      settings.onRetry(attempt, error2);
+      await new Promise((resolve) => setTimeout(resolve, 100));
+    }
+  }
+}
+function parseLLMConfig(config) {
+  if (!config.baseURL || !config.model) {
+    throw new Error(
+      "[PageAgent] LLM configuration required. Please provide: baseURL, model. See: https://alibaba.github.io/page-agent/docs/features/models"
+    );
+  }
+  if (config.temperature !== void 0) {
+    console.warn(
+      "[PageAgent] LLMConfig.temperature is deprecated and will be removed in a future version. Use transformRequestBody to set it only for models you have verified accept it."
+    );
+  }
+  return {
+    baseURL: config.baseURL,
+    model: config.model,
+    apiKey: config.apiKey || "",
+    temperature: config.temperature,
+    maxRetries: config.maxRetries ?? 2,
+    transformRequestBody: config.transformRequestBody ?? ((requestBody) => requestBody),
+    disableNamedToolChoice: config.disableNamedToolChoice ?? false,
+    customFetch: (config.customFetch ?? fetch).bind(globalThis)
+    // fetch will be illegal unless bound
+  };
+}
+const SYSTEM_PROMPT = 'You are an AI agent designed to operate in an iterative loop to automate browser tasks. Your ultimate goal is accomplishing the task provided in <user_request>.\n\n<intro>\nYou excel at following tasks:\n1. Navigating complex websites and extracting precise information\n2. Automating form submissions and interactive web actions\n3. Gathering and saving information \n4. Operate effectively in an agent loop\n5. Efficiently performing diverse web tasks\n</intro>\n\n<language_settings>\n- Default working language: **English**\n- Use the language that user is using. Return in user\'s language.\n</language_settings>\n\n<input>\nAt every step, your input will consist of: \n1. <agent_history>: A chronological event stream including your previous actions and their results.\n2. <agent_state>: Current <user_request> and <step_info>.\n3. <browser_state>: Current URL, interactive elements indexed for actions, and visible page content.\n</input>\n\n<agent_history>\nAgent history will be given as a list of step information as follows:\n\n<step_{step_number}>:\nEvaluation of Previous Step: Assessment of last action\nMemory: Your memory of this step\nNext Goal: Your goal for this step\nAction Results: Your actions and their results\n</step_{step_number}>\n\nand system messages wrapped in <sys> tag.\n</agent_history>\n\n<user_request>\nUSER REQUEST: This is your ultimate objective and always remains visible.\n- This has the highest priority. Make the user happy.\n- If the user request is very specific - then carefully follow each step and don\'t skip or hallucinate steps.\n- If the task is open ended you can plan yourself how to get it done.\n</user_request>\n\n<browser_state>\n1. Browser State will be given as:\n\nCurrent URL: URL of the page you are currently viewing.\nInteractive Elements: All interactive elements will be provided in format as [index]<type>text</type> where\n- index: Numeric identifier for interaction\n- type: HTML element type (button, input, etc.)\n- text: Element description\n\nExamples:\n[33]<div>User form</div>\n\\t*[35]<button aria-label=\'Submit form\'>Submit</button>\n\nNote that:\n- Only elements with numeric indexes in [] are interactive\n- (stacked) indentation (with \\t) is important and means that the element is a (html) child of the element above (with a lower index)\n- Elements tagged with `*[` are the new clickable elements that appeared on the website since the last step - if url has not changed.\n- Pure text elements without [] are not interactive.\n</browser_state>\n\n<browser_rules>\nStrictly follow these rules while using the browser and navigating the web:\n- Only interact with elements that have a numeric [index] assigned.\n- Only use indexes that are explicitly provided.\n- If the page changes after, for example, an input text action, analyze if you need to interact with new elements, e.g. selecting the right option from the list.\n- By default, only elements in the visible viewport are listed. Use scrolling actions if you suspect relevant content is offscreen which you need to interact with. Scroll ONLY if there are more pixels below or above the page.\n- You can scroll by a specific number of pages using the num_pages parameter (e.g., 0.5 for half page, 2.0 for two pages).\n- All the elements that are scrollable are marked with `data-scrollable` attribute. Including the scrollable distance in every directions. You can scroll *the element* in case some area are overflowed.\n- If a captcha appears, tell user you can not solve captcha. Finish the task and ask user to solve it.\n- If the page is not fully loaded, use the `wait` action.\n- Do not repeat one action for more than 3 times unless some conditions changed.\n- If you fill an input field and your action sequence is interrupted, most often something changed e.g. suggestions popped up under the field.\n- If the <user_request> includes specific page information such as product type, rating, price, location, etc., try to apply filters to be more efficient.\n- The <user_request> is the ultimate goal. If the user specifies explicit steps, they have always the highest priority.\n- If you input_text into a field, you might need to press enter, click the search button, or select from dropdown for completion.\n- Don\'t login into a page if you don\'t have to. Don\'t login if you don\'t have the credentials. \n- There are 2 types of tasks always first think which type of request you are dealing with:\n1. Very specific step by step instructions:\n- Follow them as very precise and don\'t skip steps. Try to complete everything as requested.\n2. Open ended tasks. Plan yourself, be creative in achieving them.\n- If you get stuck e.g. with logins or captcha in open-ended tasks you can re-evaluate the task and try alternative ways, e.g. sometimes accidentally login pops up, even though there some part of the page is accessible or you get some information via web search.\n</browser_rules>\n\n<capability>\n- You can only handle single page app. Do not jump out of current page.\n- Do not click on link if it will open in a new page (e.g., <a target="_blank">)\n- It is ok to fail the task.\n	- User can be wrong. If the request of user is not achievable, inappropriate or you do not have enough information or tools to achieve it. Tell user to make a better request.\n	- Webpage can be broken. All webpages or apps have bugs. Some bug will make it hard for your job. It\'s encouraged to tell user the problem of current page. Your feedbacks (including failing) are valuable for user.\n	- Trying too hard can be harmful. Repeating some action back and forth or pushing for a complex procedure with little knowledge can cause unwanted results and harmful side-effects. User would rather you complete the task with a fail.\n- If you do not have knowledge for the current webpage or task. You must require user to give specific instructions and detailed steps.\n</capability>\n\n<task_completion_rules>\nYou must call the `done` action in one of three cases:\n- When you have fully completed the USER REQUEST.\n- When you reach the final allowed step (`max_steps`), even if the task is incomplete.\n- When you feel stuck or unable to solve user request. Or user request is not clear or contains inappropriate content.\n- If it is ABSOLUTELY IMPOSSIBLE to continue.\n\nThe `done` action is your opportunity to terminate and share your findings with the user.\n- Set `success` to `true` only if the full USER REQUEST has been completed with no missing components.\n- If any part of the request is missing, incomplete, or uncertain, set `success` to `false`.\n- You can use the `text` field of the `done` action to communicate your findings and to provide a coherent reply to the user and fulfill the USER REQUEST.\n- You are ONLY ALLOWED to call `done` as a single action. Don\'t call it together with other actions.\n- If the user asks for specified format, such as "return JSON with following structure", "return a list of format...", MAKE sure to use the right format in your answer.\n- If the user asks for a structured output, your `done` action\'s schema may be modified. Take this schema into account when solving the task!\n</task_completion_rules>\n\n<reasoning_rules>\nExhibit the following reasoning patterns to successfully achieve the <user_request>:\n\n- Reason about <agent_history> to track progress and context toward <user_request>.\n- Analyze the most recent "Next Goal" and "Action Result" in <agent_history> and clearly state what you previously tried to achieve.\n- Analyze all relevant items in <agent_history> and <browser_state> to understand your state.\n- Explicitly judge success/failure/uncertainty of the last action. Never assume an action succeeded just because it appears to be executed in your last step in <agent_history>. If the expected change is missing, mark the last action as failed (or uncertain) and plan a recovery.\n- Analyze whether you are stuck, e.g. when you repeat the same actions multiple times without any progress. Then consider alternative approaches e.g. scrolling for more context or ask user for help.\n- Ask user for help if you have any difficulty. Keep user in the loop.\n- If you see information relevant to <user_request>, plan saving the information to memory.\n- Always reason about the <user_request>. Make sure to carefully analyze the specific steps and information required. E.g. specific filters, specific form fields, specific information to search. Make sure to always compare the current trajectory with the user request and think carefully if thats how the user requested it.\n</reasoning_rules>\n\n<examples>\nHere are examples of good output patterns. Use them as reference but never copy them directly.\n\n<evaluation_examples>\n"evaluation_previous_goal": "Successfully navigated to the product page and found the target information. Verdict: Success"\n"evaluation_previous_goal": "Clicked the login button and user authentication form appeared. Verdict: Success"\n</evaluation_examples>\n\n<memory_examples>\n"memory": "Found many pending reports that need to be analyzed in the main page. Successfully processed the first 2 reports on quarterly sales data and moving on to inventory analysis and customer feedback reports."\n</memory_examples>\n\n<next_goal_examples>\n"next_goal": "Click on the \'Add to Cart\' button to proceed with the purchase flow."\n</next_goal_examples>\n</examples>\n\n<output>\n{\n  "evaluation_previous_goal": "Concise one-sentence analysis of your last action. Clearly state success, failure, or uncertain.",\n  "memory": "1-3 concise sentences of specific memory of this step and overall progress. You should put here everything that will help you track progress in future steps. Like counting pages visited, items found, etc.",\n  "next_goal": "State the next immediate goal and action to achieve it, in one clear sentence.",\n  "action":{\n    "Action name": {// Action parameters}\n  }\n}\n</output>\n';
+const log = console.log.bind(console, chalk.yellow("[autoFixer]"));
+function normalizeResponse(response, tools2) {
+  let resolvedArguments;
+  const choice = response.choices?.[0];
+  if (!choice) throw new Error("No choices in response");
+  const message = choice.message;
+  if (!message) throw new Error("No message in choice");
+  const toolCall = message.tool_calls?.[0];
+  if (toolCall?.function?.arguments) {
+    resolvedArguments = safeJsonParse(toolCall.function.arguments);
+    if (toolCall.function.name && toolCall.function.name !== "AgentOutput") {
+      log(`#1: fixing tool_call`);
+      resolvedArguments = { action: safeJsonParse(resolvedArguments) };
+    }
+  } else {
+    if (message.content) {
+      const content = message.content.trim();
+      const jsonInContent = retrieveJsonFromString(content);
+      if (jsonInContent) {
+        resolvedArguments = safeJsonParse(jsonInContent);
+        if (resolvedArguments?.name === "AgentOutput") {
+          log(`#2: fixing tool_call`);
+          resolvedArguments = safeJsonParse(resolvedArguments.arguments);
+        }
+        if (resolvedArguments?.type === "function") {
+          log(`#3: fixing tool_call`);
+          resolvedArguments = safeJsonParse(resolvedArguments.function.arguments);
+        }
+        if (!resolvedArguments?.action && !resolvedArguments?.evaluation_previous_goal && !resolvedArguments?.memory && !resolvedArguments?.next_goal && !resolvedArguments?.thinking) {
+          log(`#4: fixing tool_call`);
+          resolvedArguments = { action: safeJsonParse(resolvedArguments) };
+        }
+      } else {
+        throw new Error("No tool_call and the message content does not contain valid JSON");
+      }
+    } else {
+      throw new Error("No tool_call nor message content is present");
+    }
+  }
+  resolvedArguments = safeJsonParse(resolvedArguments);
+  if (resolvedArguments.action) {
+    resolvedArguments.action = safeJsonParse(resolvedArguments.action);
+  }
+  if (resolvedArguments.action && tools2) {
+    resolvedArguments.action = validateAction(resolvedArguments.action, tools2);
+  }
+  if (!resolvedArguments.action) {
+    log(`#5: fixing tool_call`);
+    resolvedArguments.action = { wait: { seconds: 1 } };
+  }
+  return {
+    ...response,
+    choices: [
+      {
+        ...choice,
+        message: {
+          ...message,
+          tool_calls: [
+            {
+              ...toolCall || {},
+              function: {
+                ...toolCall?.function || {},
+                name: "AgentOutput",
+                arguments: JSON.stringify(resolvedArguments)
+              }
+            }
+          ]
+        }
+      }
+    ]
+  };
+}
+function validateAction(action, tools2) {
+  if (typeof action !== "object" || action === null) return action;
+  const toolName = Object.keys(action)[0];
+  if (!toolName) return action;
+  const tool2 = tools2.get(toolName);
+  if (!tool2) {
+    const available = Array.from(tools2.keys()).join(", ");
+    throw new InvokeError(
+      InvokeErrorTypes.INVALID_TOOL_ARGS,
+      `Unknown action "${toolName}". Available: ${available}`
+    );
+  }
+  let value = action[toolName];
+  const schema = tool2.inputSchema;
+  if (schema instanceof z.ZodObject && value !== null && typeof value !== "object") {
+    const requiredKey = Object.keys(schema.shape).find(
+      (k) => !schema.shape[k].safeParse(void 0).success
+    );
+    if (requiredKey) {
+      log(`coercing primitive action input for "${toolName}"`);
+      value = { [requiredKey]: value };
+    }
+  }
+  const result2 = schema.safeParse(value);
+  if (!result2.success) {
+    throw new InvokeError(
+      InvokeErrorTypes.INVALID_TOOL_ARGS,
+      `Invalid input for action "${toolName}": ${z.prettifyError(result2.error)}`
+    );
+  }
+  return { [toolName]: result2.data };
+}
+function safeJsonParse(input2) {
+  if (typeof input2 === "string") {
+    try {
+      return JSON.parse(input2.trim());
+    } catch {
+      return input2;
+    }
+  }
+  return input2;
+}
+function retrieveJsonFromString(str) {
+  try {
+    const json = /({[\s\S]*})/.exec(str) ?? [];
+    if (json.length === 0) {
+      return null;
+    }
+    return JSON.parse(json[0]);
+  } catch {
+    return null;
+  }
+}
+async function waitFor$1(seconds, signal2) {
+  if (!signal2) {
+    await new Promise((resolve) => setTimeout(resolve, seconds * 1e3));
+    return;
+  }
+  signal2.throwIfAborted();
+  await new Promise((resolve, reject) => {
+    const timer = setTimeout(() => {
+      signal2.removeEventListener("abort", onAbort);
+      resolve();
+    }, seconds * 1e3);
+    const onAbort = () => {
+      clearTimeout(timer);
+      reject(signal2.reason);
+    };
+    signal2.addEventListener("abort", onAbort, { once: true });
+  });
+}
+function truncate$1(text, maxLength) {
+  if (text.length > maxLength) {
+    return text.substring(0, maxLength) + "...";
+  }
+  return text;
+}
+function randomID(existingIDs) {
+  let id = Math.random().toString(36).substring(2, 11);
+  if (!existingIDs) {
+    return id;
+  }
+  const MAX_TRY = 1e3;
+  let tryCount = 0;
+  while (existingIDs.includes(id)) {
+    id = Math.random().toString(36).substring(2, 11);
+    tryCount++;
+    if (tryCount > MAX_TRY) {
+      throw new Error("randomID: too many tries");
+    }
+  }
+  return id;
+}
+const _global = globalThis;
+if (!_global.__PAGE_AGENT_IDS__) {
+  _global.__PAGE_AGENT_IDS__ = [];
+}
+const ids = _global.__PAGE_AGENT_IDS__;
+function uid() {
+  const id = randomID(ids);
+  ids.push(id);
+  return id;
+}
+const llmsTxtCache = /* @__PURE__ */ new Map();
+async function fetchLlmsTxt(url) {
+  let origin;
+  try {
+    origin = new URL(url).origin;
+  } catch {
+    return null;
+  }
+  if (origin === "null") return null;
+  if (llmsTxtCache.has(origin)) return llmsTxtCache.get(origin);
+  const endpoint = `${origin}/llms.txt`;
+  let result2 = null;
+  try {
+    console.log(chalk.gray(`[llms.txt] Fetching ${endpoint}`));
+    const res = await fetch(endpoint, { signal: AbortSignal.timeout(3e3) });
+    if (res.ok) {
+      result2 = await res.text();
+      console.log(chalk.green(`[llms.txt] Found (${result2.length} chars)`));
+      if (result2.length > 1e3) {
+        console.log(chalk.yellow(`[llms.txt] Truncating to 1000 chars`));
+        result2 = truncate$1(result2, 1e3);
+      }
+    } else {
+      console.debug(chalk.gray(`[llms.txt] ${res.status} for ${endpoint}`));
+    }
+  } catch (e) {
+    console.debug(chalk.gray(`[llms.txt] not found for ${endpoint}`), e);
+  }
+  llmsTxtCache.set(origin, result2);
+  return result2;
+}
+function assert(condition, message, silent) {
+  if (!condition) {
+    const errorMessage = message ?? "Assertion failed";
+    console.error(chalk.red(`❌ assert: ${errorMessage}`));
+    throw new Error(errorMessage);
+  }
+}
+async function suppress(fn) {
+  try {
+    return await fn();
+  } catch (error2) {
+    console.error(error2);
+    return void 0;
+  }
+}
+function tool(options) {
+  return options;
+}
+const tools = /* @__PURE__ */ new Map();
+tools.set(
+  "done",
+  tool({
+    description: "Complete task. Text is your final response to the user — keep it concise unless the user explicitly asks for detail.",
+    inputSchema: z.object({
+      text: z.string(),
+      success: z.boolean().default(true)
+    }),
+    execute: async function(input2) {
+      return Promise.resolve("Task completed");
+    }
+  })
+);
+tools.set(
+  "wait",
+  tool({
+    description: "Wait for x seconds. Can be used to wait until the page or data is fully loaded.",
+    inputSchema: z.object({
+      seconds: z.number().min(1).max(10).default(1)
+    }),
+    execute: async function(input2, { signal: signal2 }) {
+      const lastTimeUpdate = await this.pageController.getLastUpdateTime();
+      const secondsSinceLastUpdate = (Date.now() - lastTimeUpdate) / 1e3;
+      const actualWaitTime = Math.max(0, input2.seconds - secondsSinceLastUpdate);
+      console.log(`actualWaitTime: ${actualWaitTime} seconds`);
+      await waitFor$1(actualWaitTime, signal2);
+      const waitedSeconds = (secondsSinceLastUpdate + actualWaitTime).toFixed(2);
+      return `✅ Waited for ${waitedSeconds} seconds.`;
+    }
+  })
+);
+tools.set(
+  "ask_user",
+  tool({
+    description: "Ask the user a question and wait for their answer. Use this if you need more information or clarification.",
+    inputSchema: z.object({
+      question: z.string()
+    }),
+    execute: async function(input2, { signal: signal2 }) {
+      if (!this.onAskUser) {
+        throw new Error("ask_user tool requires onAskUser callback to be set");
+      }
+      const answer = await this.onAskUser(input2.question, { signal: signal2 });
+      return `User answered: ${answer}`;
+    }
+  })
+);
+tools.set(
+  "click_element_by_index",
+  tool({
+    description: "Click element by index",
+    inputSchema: z.object({
+      index: z.int().min(0)
+    }),
+    execute: async function(input2) {
+      const result2 = await this.pageController.clickElement(input2.index);
+      return result2.message;
+    }
+  })
+);
+tools.set(
+  "input_text",
+  tool({
+    description: "Click and type text into an interactive input element",
+    inputSchema: z.object({
+      index: z.int().min(0),
+      text: z.string()
+    }),
+    execute: async function(input2) {
+      const result2 = await this.pageController.inputText(input2.index, input2.text);
+      return result2.message;
+    }
+  })
+);
+tools.set(
+  "select_dropdown_option",
+  tool({
+    description: "Select dropdown option for interactive element index by the text of the option you want to select",
+    inputSchema: z.object({
+      index: z.int().min(0),
+      text: z.string()
+    }),
+    execute: async function(input2) {
+      const result2 = await this.pageController.selectOption(input2.index, input2.text);
+      return result2.message;
+    }
+  })
+);
+tools.set(
+  "scroll",
+  tool({
+    description: "Scroll vertically. Without index: scrolls the document. With index: scrolls the container at that index (or its nearest scrollable ancestor). Use index of a data-scrollable element to scroll a specific area.",
+    inputSchema: z.object({
+      down: z.boolean().default(true),
+      num_pages: z.number().min(0).max(10).optional().default(0.1),
+      pixels: z.number().int().min(0).optional(),
+      index: z.number().int().min(0).optional()
+    }),
+    execute: async function(input2) {
+      const result2 = await this.pageController.scroll({
+        ...input2,
+        numPages: input2.num_pages
+      });
+      return result2.message;
+    }
+  })
+);
+tools.set(
+  "scroll_horizontally",
+  tool({
+    description: "Scroll horizontally. Without index: scrolls the document. With index: scrolls the container at that index (or its nearest scrollable ancestor). Use index of a data-scrollable element to scroll a specific area.",
+    inputSchema: z.object({
+      right: z.boolean().default(true),
+      pixels: z.number().int().min(0),
+      index: z.number().int().min(0).optional()
+    }),
+    execute: async function(input2) {
+      const result2 = await this.pageController.scrollHorizontally(input2);
+      return result2.message;
+    }
+  })
+);
+tools.set(
+  "execute_javascript",
+  tool({
+    description: "Execute JavaScript code on the current page. Supports async/await syntax. Use with caution! An `AbortSignal` named `signal` is available in scope: long-running async code MUST honor it (e.g. `await fetch(url, { signal })`, or `signal.throwIfAborted()` in loops)",
+    inputSchema: z.object({
+      script: z.string()
+    }),
+    execute: async function(input2, { signal: signal2 }) {
+      const result2 = await this.pageController.executeJavascript(input2.script, signal2);
+      signal2.throwIfAborted();
+      return result2.message;
+    }
+  })
+);
+class PageAgentCore extends EventTarget {
+  id = uid();
+  config;
+  tools;
+  /** PageController for DOM operations */
+  pageController;
+  task = "";
+  taskId = "";
+  /** History events */
+  history = [];
+  /** Whether this agent has been disposed */
+  disposed = false;
+  /**
+   * Called when the agent needs to ask the user questions.
+   * If unset, the `ask_user` tool will be disabled.
+   * Implementations should reject the promise when `signal` aborts.
+   * @example onAskUser: (q) => window.prompt(q) || ''
+   */
+  onAskUser;
+  #status = "idle";
+  #llm;
+  /**
+   * Task cancellation primitive: its signal reaches the LLM fetch, tools
+   * (via `ctx.signal`) and async callbacks. Aborted only by `stop`/`dispose`
+   * (during a task) or task setup, always WITHOUT a reason so `signal.reason`
+   * stays a standard `AbortError`.
+   */
+  #abortController = new AbortController();
+  #observations = [];
+  /** Resolves when the current run has fully settled. Awaited by `stop()`. */
+  #running = Promise.resolve();
+  #lastResult = null;
+  /** internal states during a single task execution */
+  #states = {
+    /** Accumulated wait time in seconds */
+    totalWaitTime: 0,
+    /** For detecting navigation */
+    lastURL: "",
+    /** Browser state */
+    browserState: null
+  };
+  constructor(config) {
+    super();
+    this.config = { ...config, maxSteps: config.maxSteps ?? 40 };
+    this.#llm = new LLM(this.config);
+    this.tools = new Map(tools);
+    this.pageController = config.pageController;
+    this.#llm.addEventListener("retry", (e) => {
+      const { attempt, maxAttempts, lastError } = e.detail;
+      this.#emitActivity({ type: "retrying", attempt, maxAttempts });
+      this.history.push({
+        type: "error",
+        message: String(lastError),
+        rawResponse: lastError.rawResponse
+      });
+      this.history.push({
+        type: "retry",
+        message: `LLM retry attempt ${attempt} of ${maxAttempts}`,
+        attempt,
+        maxAttempts
+      });
+      this.#emitHistoryChange();
+    });
+    if (this.config.customTools) {
+      for (const [name, tool2] of Object.entries(this.config.customTools)) {
+        if (tool2 === null) {
+          this.tools.delete(name);
+          continue;
+        }
+        this.tools.set(name, tool2);
+      }
+    }
+    if (!this.config.experimentalScriptExecutionTool) {
+      this.tools.delete("execute_javascript");
+    }
+  }
+  /** Get current agent status */
+  get status() {
+    return this.#status;
+  }
+  /** Result of the most recent run, or `null` before the first run completes. */
+  get lastResult() {
+    return this.#lastResult;
+  }
+  /** Emit statuschange event */
+  #emitStatusChange() {
+    this.dispatchEvent(new Event("statuschange"));
+  }
+  /** Emit historychange event */
+  #emitHistoryChange(pushHistoricalEvent) {
+    if (pushHistoricalEvent) this.history.push(pushHistoricalEvent);
+    this.dispatchEvent(new Event("historychange"));
+  }
+  /**
+   * Emit activity event - for transient UI feedback
+   * @param activity - Current agent activity
+   */
+  #emitActivity(activity) {
+    this.dispatchEvent(new CustomEvent("activity", { detail: activity }));
+  }
+  /** Update status and emit event */
+  #setStatus(status) {
+    if (this.#status !== status) {
+      this.#status = status;
+      this.#emitStatusChange();
+    }
+  }
+  /**
+   * Push an observation message to the history event stream.
+   * This will be visible in <agent_history> and remain persistent in memory across steps.
+   * @experimental @internal
+   * @note history change will be emitted before next step starts
+   */
+  pushObservation(content) {
+    this.#observations.push(content);
+  }
+  /**
+   * Stop the current task and wait until the run has fully settled (including lifecycle hooks).
+   * @note never await .stop() in a lifecycle hook.
+   */
+  async stop() {
+    if (this.#status !== "running") return;
+    this.#abortController.abort();
+    await this.#running;
+  }
+  /**
+   * external errors (pre-checks/config/hooks) will threw;
+   * agent errors will be caught and added to history, and return a failed result
+   */
+  async execute(task) {
+    if (this.disposed) throw new Error("PageAgent has been disposed. Create a new instance.");
+    if (this.#status === "running") throw new Error("A task is already running.");
+    if (!task) throw new Error("Task is required");
+    this.task = task;
+    this.taskId = uid();
+    this.history = [];
+    this.#observations = [];
+    this.#states = { totalWaitTime: 0, lastURL: "", browserState: null };
+    this.#abortController = new AbortController();
+    const signal2 = this.#abortController.signal;
+    let resolveRunning;
+    this.#running = new Promise((r) => resolveRunning = r);
+    this.#setStatus("running");
+    this.#emitHistoryChange();
+    if (!this.onAskUser) this.tools.delete("ask_user");
+    const onBeforeStep = this.config.onBeforeStep;
+    const onAfterStep = this.config.onAfterStep;
+    const onBeforeTask = this.config.onBeforeTask;
+    const onAfterTask = this.config.onAfterTask;
+    const stepDelay = this.config.stepDelay ?? 0.4;
+    const maxSteps = this.config.maxSteps;
+    let step = 0;
+    let taskResult;
+    let finalStatus = "error";
+    await suppress(() => this.pageController.showMask());
+    try {
+      await onBeforeTask?.(this);
+      while (true) {
+        await onBeforeStep?.(this, step);
+        try {
+          console.group(`step: ${step}`);
+          if (step > 0) await waitFor$1(stepDelay, signal2);
+          signal2.throwIfAborted();
+          console.log(chalk.blue.bold("👀 Observing..."));
+          this.#states.browserState = await this.pageController.getBrowserState();
+          await this.#handleObservations(step);
+          const messages = [
+            { role: "system", content: this.#getSystemPrompt() },
+            { role: "user", content: await this.#assembleUserPrompt() }
+          ];
+          const macroTool = { AgentOutput: this.#packMacroTool() };
+          console.log(chalk.blue.bold("🧠 Thinking..."));
+          this.#emitActivity({ type: "thinking" });
+          const result2 = await this.#llm.invoke(messages, macroTool, signal2, {
+            toolChoiceName: "AgentOutput",
+            normalizeResponse: (res) => normalizeResponse(res, this.tools)
+          });
+          const macroResult = result2.toolResult;
+          const input2 = macroResult.input;
+          const output2 = macroResult.output;
+          const reflection = {
+            evaluation_previous_goal: input2.evaluation_previous_goal,
+            memory: input2.memory,
+            next_goal: input2.next_goal
+          };
+          const actionName = Object.keys(input2.action)[0];
+          const action = {
+            name: actionName,
+            input: input2.action[actionName],
+            output: output2
+          };
+          this.#emitHistoryChange({
+            type: "step",
+            stepIndex: step,
+            reflection,
+            action,
+            usage: result2.usage,
+            rawResponse: result2.rawResponse,
+            rawRequest: result2.rawRequest
+          });
+          if (actionName === "done") {
+            const success = action.input?.success ?? false;
+            const data = action.input?.text || "no text provided";
+            console.log(chalk.green.bold("Task completed"), success, data);
+            taskResult = { success, data, history: this.history };
+            this.#lastResult = taskResult;
+            finalStatus = "completed";
+            break;
+          }
+        } catch (error2) {
+          const isAbortError = error2?.name === "AbortError";
+          if (!isAbortError) console.error("Task failed", error2);
+          const message = isAbortError ? "Tarefa interrompida" : String(error2);
+          this.#emitActivity({ type: "error", message });
+          this.#emitHistoryChange({ type: "error", message, rawResponse: error2 });
+          taskResult = { success: false, data: message, history: this.history };
+          this.#lastResult = taskResult;
+          finalStatus = isAbortError ? "stopped" : "error";
+          break;
+        } finally {
+          console.groupEnd();
+          await onAfterStep?.(this, this.history);
+        }
+        step++;
+        if (step > maxSteps) {
+          const message = "Step count exceeded maximum limit";
+          console.error(message);
+          this.#emitActivity({ type: "error", message });
+          this.#emitHistoryChange({ type: "error", message });
+          taskResult = { success: false, data: message, history: this.history };
+          this.#lastResult = taskResult;
+          finalStatus = "error";
+          break;
+        }
+      }
+      await onAfterTask?.(this, taskResult);
+      return taskResult;
+    } catch (error2) {
+      this.#emitActivity({ type: "error", message: String(error2) });
+      finalStatus = "error";
+      throw error2;
+    } finally {
+      await suppress(() => this.pageController.cleanUpHighlights());
+      await suppress(() => this.pageController.hideMask());
+      this.#abortController.abort();
+      resolveRunning();
+      this.#setStatus(finalStatus);
+    }
+  }
+  /**
+   * Merge all tools into a single MacroTool with the following input:
+   * - thinking: string
+   * - evaluation_previous_goal: string
+   * - memory: string
+   * - next_goal: string
+   * - action: { toolName: toolInput }
+   * where action must be selected from tools defined in this.tools
+   */
+  #packMacroTool() {
+    const tools2 = this.tools;
+    const actionSchemas = Array.from(tools2.entries()).map(([toolName, tool2]) => {
+      return z.object({ [toolName]: tool2.inputSchema }).describe(tool2.description);
+    });
+    const actionSchema = z.union(actionSchemas);
+    const macroToolSchema = z.object({
+      // thinking: z.string().optional(),
+      evaluation_previous_goal: z.string().optional(),
+      memory: z.string().optional(),
+      next_goal: z.string().optional(),
+      action: actionSchema
+    });
+    return {
+      description: "You MUST call this tool every step!",
+      inputSchema: macroToolSchema,
+      execute: async (input2) => {
+        const signal2 = this.#abortController.signal;
+        signal2.throwIfAborted();
+        console.log(chalk.blue.bold("MacroTool input"), input2);
+        const action = input2.action;
+        const toolName = Object.keys(action)[0];
+        const toolInput = action[toolName];
+        const reflectionLines2 = [];
+        if (input2.evaluation_previous_goal)
+          reflectionLines2.push(`✅: ${input2.evaluation_previous_goal}`);
+        if (input2.memory) reflectionLines2.push(`💾: ${input2.memory}`);
+        if (input2.next_goal) reflectionLines2.push(`🎯: ${input2.next_goal}`);
+        const reflectionText = reflectionLines2.length > 0 ? reflectionLines2.join("\n") : "";
+        if (reflectionText) {
+          console.log(reflectionText);
+        }
+        const tool2 = tools2.get(toolName);
+        assert(tool2, `Tool ${toolName} not found`);
+        console.log(chalk.blue.bold(`Executing tool: ${toolName}`), toolInput);
+        this.#emitActivity({ type: "executing", tool: toolName, input: toolInput });
+        const startTime = Date.now();
+        const result2 = await tool2.execute.bind(this)(toolInput, { signal: signal2 });
+        signal2.throwIfAborted();
+        const duration = Date.now() - startTime;
+        console.log(chalk.green.bold(`Tool (${toolName}) executed for ${duration}ms`), result2);
+        this.#emitActivity({
+          type: "executed",
+          tool: toolName,
+          input: toolInput,
+          output: result2,
+          duration
+        });
+        if (toolName === "wait") {
+          this.#states.totalWaitTime += toolInput?.seconds || 0;
+        } else {
+          this.#states.totalWaitTime = 0;
+        }
+        return {
+          input: input2,
+          output: result2
+        };
+      }
+    };
+  }
+  /**
+   * Get system prompt, dynamically replace language settings based on configured language
+   */
+  #getSystemPrompt() {
+    if (this.config.customSystemPrompt) {
+      return this.config.customSystemPrompt;
+    }
+    const targetLanguage = this.config.language === "pt-BR" ? "Portuguese (Brazil)" : this.config.language === "zh-CN" ? "Chinese" : "English";
+    const systemPrompt = SYSTEM_PROMPT.replace(
+      /Default working language: \*\*.*?\*\*/,
+      `Default working language: **${targetLanguage}**`
+    );
+    return systemPrompt;
+  }
+  /**
+   * Get instructions from config
+   */
+  async #getInstructions() {
+    const { instructions, experimentalLlmsTxt } = this.config;
+    const systemInstructions = instructions?.system?.trim();
+    let pageInstructions;
+    const url = this.#states.browserState?.url || "";
+    if (instructions?.getPageInstructions && url) {
+      try {
+        pageInstructions = instructions.getPageInstructions(url)?.trim();
+      } catch (error2) {
+        console.error(
+          chalk.red("[PageAgent] Failed to execute getPageInstructions callback:"),
+          error2
+        );
+      }
+    }
+    const llmsTxt = experimentalLlmsTxt && url ? await fetchLlmsTxt(url) : void 0;
+    if (!systemInstructions && !pageInstructions && !llmsTxt) return "";
+    let result2 = "<instructions>\n";
+    if (systemInstructions) {
+      result2 += `<system_instructions>
+${systemInstructions}
+</system_instructions>
+`;
+    }
+    if (pageInstructions) {
+      result2 += `<page_instructions>
+${pageInstructions}
+</page_instructions>
+`;
+    }
+    if (llmsTxt) {
+      result2 += `<llms_txt>
+${llmsTxt}
+</llms_txt>
+`;
+    }
+    result2 += "</instructions>\n\n";
+    return result2;
+  }
+  /**
+   * Generate system observations before each step
+   * @todo loop detection
+   * @todo console error
+   */
+  async #handleObservations(step) {
+    if (this.#states.totalWaitTime >= 3) {
+      this.pushObservation(
+        `You have waited ${this.#states.totalWaitTime} seconds accumulatively. DO NOT wait any longer unless you have a good reason.`
+      );
+    }
+    const currentURL = this.#states.browserState?.url || "";
+    if (currentURL !== this.#states.lastURL) {
+      this.pushObservation(`A página navegou para → ${currentURL}`);
+      this.#states.lastURL = currentURL;
+      await waitFor$1(0.5);
+    }
+    const remaining = this.config.maxSteps - step;
+    if (remaining === 5) {
+      this.pushObservation(
+        `⚠️ Only ${remaining} steps remaining. Consider wrapping up or calling done with partial results.`
+      );
+    } else if (remaining === 2) {
+      this.pushObservation(
+        `⚠️ Critical: Only ${remaining} steps left! You must finish the task or call done immediately.`
+      );
+    }
+    if (this.#observations.length > 0) {
+      for (const content of this.#observations) {
+        this.history.push({ type: "observation", content });
+        console.log(chalk.cyan("Observation:"), content);
+      }
+      this.#observations = [];
+      this.#emitHistoryChange();
+    }
+  }
+  async #assembleUserPrompt() {
+    const browserState = this.#states.browserState;
+    let prompt = "";
+    prompt += await this.#getInstructions();
+    const stepCount = this.history.filter((e) => e.type === "step").length;
+    prompt += "<agent_state>\n";
+    prompt += "<user_request>\n";
+    prompt += `${this.task}
+`;
+    prompt += "</user_request>\n";
+    prompt += "<step_info>\n";
+    prompt += `Step ${stepCount + 1} of ${this.config.maxSteps} max possible steps
+`;
+    prompt += `Current time: ${(/* @__PURE__ */ new Date()).toLocaleString()}
+`;
+    prompt += "</step_info>\n";
+    prompt += "</agent_state>\n\n";
+    prompt += "<agent_history>\n";
+    let stepIndex = 0;
+    for (const event of this.history) {
+      if (event.type === "step") {
+        stepIndex++;
+        prompt += `<step_${stepIndex}>
+`;
+        prompt += `Evaluation of Previous Step: ${event.reflection.evaluation_previous_goal}
+`;
+        prompt += `Memory: ${event.reflection.memory}
+`;
+        prompt += `Next Goal: ${event.reflection.next_goal}
+`;
+        prompt += `Action Results: ${event.action.output}
+`;
+        prompt += `</step_${stepIndex}>
+`;
+      } else if (event.type === "observation") {
+        prompt += `<sys>${event.content}</sys>
+`;
+      } else if (event.type === "user_takeover") {
+        prompt += `<sys>User took over control and made changes to the page</sys>
+`;
+      } else if (event.type === "error") ;
+    }
+    prompt += "</agent_history>\n\n";
+    let pageContent = browserState.content;
+    if (this.config.transformPageContent) {
+      pageContent = await this.config.transformPageContent(pageContent);
+    }
+    prompt += "<browser_state>\n";
+    prompt += browserState.header + "\n";
+    prompt += pageContent + "\n";
+    prompt += browserState.footer + "\n\n";
+    prompt += "</browser_state>\n\n";
+    return prompt;
+  }
+  dispose() {
+    console.log("Disposing PageAgent...");
+    this.disposed = true;
+    this.pageController.dispose();
+    this.#abortController.abort();
+    this.dispatchEvent(new Event("dispose"));
+    this.config.onDispose?.(this);
+  }
+}
+function isHTMLElement(el) {
+  return !!el && el.nodeType === 1;
+}
+function isInputElement(el) {
+  return el?.nodeType === 1 && el.tagName === "INPUT";
+}
+function isTextAreaElement(el) {
+  return el?.nodeType === 1 && el.tagName === "TEXTAREA";
+}
+function isSelectElement(el) {
+  return el?.nodeType === 1 && el.tagName === "SELECT";
+}
+function isAnchorElement(el) {
+  return el?.nodeType === 1 && el.tagName === "A";
+}
+function getIframeOffset(element) {
+  const frame = element.ownerDocument.defaultView?.frameElement;
+  if (!frame) return { x: 0, y: 0 };
+  const rect = frame.getBoundingClientRect();
+  return { x: rect.left, y: rect.top };
+}
+function getNativeValueSetter(element) {
+  return Object.getOwnPropertyDescriptor(Object.getPrototypeOf(element), "value").set;
+}
+async function waitFor(seconds) {
+  await new Promise((resolve) => setTimeout(resolve, seconds * 1e3));
+}
+async function movePointerToElement(element, x, y) {
+  const offset = getIframeOffset(element);
+  window.dispatchEvent(
+    new CustomEvent("PageAgent::MovePointerTo", {
+      detail: { x: x + offset.x, y: y + offset.y }
+    })
+  );
+  await waitFor(0.3);
+}
+async function clickPointer() {
+  window.dispatchEvent(new CustomEvent("PageAgent::ClickPointer"));
+}
+async function enablePassThrough() {
+  window.dispatchEvent(new CustomEvent("PageAgent::EnablePassThrough"));
+}
+async function disablePassThrough() {
+  window.dispatchEvent(new CustomEvent("PageAgent::DisablePassThrough"));
+}
+function getElementByIndex(selectorMap, index) {
+  const interactiveNode = selectorMap.get(index);
+  if (!interactiveNode) {
+    throw new Error(`No interactive element found at index ${index}`);
+  }
+  const element = interactiveNode.ref;
+  if (!element) {
+    throw new Error(`Element at index ${index} does not have a reference`);
+  }
+  if (!isHTMLElement(element)) {
+    throw new Error(`Element at index ${index} is not an HTMLElement`);
+  }
+  return element;
+}
+let lastClickedElement = null;
+function blurLastClickedElement() {
+  if (lastClickedElement) {
+    lastClickedElement.dispatchEvent(new PointerEvent("pointerout", { bubbles: true }));
+    lastClickedElement.dispatchEvent(new PointerEvent("pointerleave", { bubbles: false }));
+    lastClickedElement.dispatchEvent(new MouseEvent("mouseout", { bubbles: true }));
+    lastClickedElement.dispatchEvent(new MouseEvent("mouseleave", { bubbles: false }));
+    lastClickedElement.blur();
+    lastClickedElement = null;
+  }
+}
+async function clickElement(element) {
+  blurLastClickedElement();
+  lastClickedElement = element;
+  await scrollIntoViewIfNeeded(element);
+  const frame = element.ownerDocument.defaultView?.frameElement;
+  if (frame) await scrollIntoViewIfNeeded(frame);
+  const rect = element.getBoundingClientRect();
+  const x = rect.left + rect.width / 2;
+  const y = rect.top + rect.height / 2;
+  await movePointerToElement(element, x, y);
+  await clickPointer();
+  await waitFor(0.1);
+  const doc = element.ownerDocument;
+  await enablePassThrough();
+  const hitTarget = doc.elementFromPoint(x, y);
+  await disablePassThrough();
+  const target = hitTarget instanceof HTMLElement && element.contains(hitTarget) ? hitTarget : element;
+  const pointerOpts = {
+    bubbles: true,
+    cancelable: true,
+    clientX: x,
+    clientY: y,
+    pointerType: "mouse"
+  };
+  const mouseOpts = { bubbles: true, cancelable: true, clientX: x, clientY: y, button: 0 };
+  target.dispatchEvent(new PointerEvent("pointerover", pointerOpts));
+  target.dispatchEvent(new PointerEvent("pointerenter", { ...pointerOpts, bubbles: false }));
+  target.dispatchEvent(new MouseEvent("mouseover", mouseOpts));
+  target.dispatchEvent(new MouseEvent("mouseenter", { ...mouseOpts, bubbles: false }));
+  target.dispatchEvent(new PointerEvent("pointerdown", pointerOpts));
+  target.dispatchEvent(new MouseEvent("mousedown", mouseOpts));
+  element.focus({ preventScroll: true });
+  target.dispatchEvent(new PointerEvent("pointerup", pointerOpts));
+  target.dispatchEvent(new MouseEvent("mouseup", mouseOpts));
+  target.click();
+  await waitFor(0.2);
+}
+async function inputTextElement(element, text) {
+  const isContentEditable = element.isContentEditable;
+  if (!isInputElement(element) && !isTextAreaElement(element) && !isContentEditable) {
+    throw new Error("Element is not an input, textarea, or contenteditable");
+  }
+  await clickElement(element);
+  if (isContentEditable) {
+    if (element.dispatchEvent(
+      new InputEvent("beforeinput", {
+        bubbles: true,
+        cancelable: true,
+        inputType: "deleteContent"
+      })
+    )) {
+      element.innerText = "";
+      element.dispatchEvent(
+        new InputEvent("input", {
+          bubbles: true,
+          inputType: "deleteContent"
+        })
+      );
+    }
+    if (element.dispatchEvent(
+      new InputEvent("beforeinput", {
+        bubbles: true,
+        cancelable: true,
+        inputType: "insertText",
+        data: text
+      })
+    )) {
+      element.innerText = text;
+      element.dispatchEvent(
+        new InputEvent("input", {
+          bubbles: true,
+          inputType: "insertText",
+          data: text
+        })
+      );
+    }
+    const planASucceeded = element.innerText.trim() === text.trim();
+    if (!planASucceeded) {
+      element.focus();
+      const doc = element.ownerDocument;
+      const selection = (doc.defaultView || window).getSelection();
+      const range = doc.createRange();
+      range.selectNodeContents(element);
+      selection?.removeAllRanges();
+      selection?.addRange(range);
+      doc.execCommand("delete", false);
+      doc.execCommand("insertText", false, text);
+    }
+    element.dispatchEvent(new Event("change", { bubbles: true }));
+    element.blur();
+  } else {
+    getNativeValueSetter(element).call(element, text);
+  }
+  if (!isContentEditable) {
+    element.dispatchEvent(new Event("input", { bubbles: true }));
+  }
+  await waitFor(0.1);
+}
+async function selectOptionElement(selectElement, optionText) {
+  if (!isSelectElement(selectElement)) {
+    throw new Error("Element is not a select element");
+  }
+  const options = Array.from(selectElement.options);
+  const option = options.find((opt) => opt.textContent?.trim() === optionText.trim());
+  if (!option) {
+    throw new Error(`Option with text "${optionText}" not found in select element`);
+  }
+  selectElement.value = option.value;
+  selectElement.dispatchEvent(new Event("change", { bubbles: true }));
+  await waitFor(0.1);
+}
+async function scrollIntoViewIfNeeded(element) {
+  const el = element;
+  if (typeof el.scrollIntoViewIfNeeded === "function") {
+    el.scrollIntoViewIfNeeded();
+  } else {
+    element.scrollIntoView({ behavior: "auto", block: "center", inline: "nearest" });
+  }
+}
+async function scrollVertically(scroll_amount, element) {
+  if (element) {
+    const targetElement = element;
+    let currentElement = targetElement;
+    let scrollSuccess = false;
+    let scrolledElement = null;
+    let scrollDelta = 0;
+    let attempts = 0;
+    const dy2 = scroll_amount;
+    while (currentElement && attempts < 10) {
+      const computedStyle = window.getComputedStyle(currentElement);
+      const hasScrollableY = /(auto|scroll|overlay)/.test(computedStyle.overflowY) || computedStyle.scrollbarWidth && computedStyle.scrollbarWidth !== "auto" || computedStyle.scrollbarGutter && computedStyle.scrollbarGutter !== "auto";
+      const canScrollVertically = currentElement.scrollHeight > currentElement.clientHeight;
+      if (hasScrollableY && canScrollVertically) {
+        const beforeScroll = currentElement.scrollTop;
+        const maxScroll = currentElement.scrollHeight - currentElement.clientHeight;
+        let scrollAmount = dy2 / 3;
+        if (scrollAmount > 0) {
+          scrollAmount = Math.min(scrollAmount, maxScroll - beforeScroll);
+        } else {
+          scrollAmount = Math.max(scrollAmount, -beforeScroll);
+        }
+        currentElement.scrollTop = beforeScroll + scrollAmount;
+        const afterScroll = currentElement.scrollTop;
+        const actualScrollDelta = afterScroll - beforeScroll;
+        if (Math.abs(actualScrollDelta) > 0.5) {
+          scrollSuccess = true;
+          scrolledElement = currentElement;
+          scrollDelta = actualScrollDelta;
+          break;
+        }
+      }
+      if (currentElement === document.body || currentElement === document.documentElement) {
+        break;
+      }
+      currentElement = currentElement.parentElement;
+      attempts++;
+    }
+    if (scrollSuccess) {
+      return `Scrolled container (${scrolledElement?.tagName}) by ${scrollDelta}px`;
+    } else {
+      return `No scrollable container found for element (${targetElement.tagName})`;
+    }
+  }
+  const dy = scroll_amount;
+  const bigEnough = (el2) => el2.clientHeight >= window.innerHeight * 0.5;
+  const canScroll = (el2) => Boolean(
+    el2 && /(auto|scroll|overlay)/.test(getComputedStyle(el2).overflowY) && el2.scrollHeight > el2.clientHeight && bigEnough(el2)
+  );
+  let el = document.activeElement;
+  while (el && !canScroll(el) && el !== document.body) el = el.parentElement;
+  el = canScroll(el) ? el : Array.from(document.querySelectorAll("*")).find(canScroll) || document.scrollingElement || document.documentElement;
+  if (el === document.scrollingElement || el === document.documentElement || el === document.body) {
+    const scrollBefore = window.scrollY;
+    const scrollMax = document.documentElement.scrollHeight - window.innerHeight;
+    window.scrollBy(0, dy);
+    const scrollAfter = window.scrollY;
+    const scrolled = scrollAfter - scrollBefore;
+    if (Math.abs(scrolled) < 1) {
+      return dy > 0 ? `⚠️ Already at the bottom of the page, cannot scroll down further.` : `⚠️ Already at the top of the page, cannot scroll up further.`;
+    }
+    const reachedBottom = dy > 0 && scrollAfter >= scrollMax - 1;
+    const reachedTop = dy < 0 && scrollAfter <= 1;
+    if (reachedBottom) return `✅ Scrolled page by ${scrolled}px. Reached the bottom of the page.`;
+    if (reachedTop) return `✅ Scrolled page by ${scrolled}px. Reached the top of the page.`;
+    return `✅ Scrolled page by ${scrolled}px.`;
+  } else {
+    const warningMsg = `The document is not scrollable. Falling back to container scroll.`;
+    console.log(`[PageController] ${warningMsg}`);
+    const scrollBefore = el.scrollTop;
+    const scrollMax = el.scrollHeight - el.clientHeight;
+    el.scrollBy({ top: dy, behavior: "smooth" });
+    await waitFor(0.1);
+    const scrollAfter = el.scrollTop;
+    const scrolled = scrollAfter - scrollBefore;
+    if (Math.abs(scrolled) < 1) {
+      return dy > 0 ? `⚠️ ${warningMsg} Already at the bottom of container (${el.tagName}), cannot scroll down further.` : `⚠️ ${warningMsg} Already at the top of container (${el.tagName}), cannot scroll up further.`;
+    }
+    const reachedBottom = dy > 0 && scrollAfter >= scrollMax - 1;
+    const reachedTop = dy < 0 && scrollAfter <= 1;
+    if (reachedBottom)
+      return `✅ ${warningMsg} Scrolled container (${el.tagName}) by ${scrolled}px. Reached the bottom.`;
+    if (reachedTop)
+      return `✅ ${warningMsg} Scrolled container (${el.tagName}) by ${scrolled}px. Reached the top.`;
+    return `✅ ${warningMsg} Scrolled container (${el.tagName}) by ${scrolled}px.`;
+  }
+}
+async function scrollHorizontally(scroll_amount, element) {
+  if (element) {
+    const targetElement = element;
+    let currentElement = targetElement;
+    let scrollSuccess = false;
+    let scrolledElement = null;
+    let scrollDelta = 0;
+    let attempts = 0;
+    const dx2 = scroll_amount;
+    while (currentElement && attempts < 10) {
+      const computedStyle = window.getComputedStyle(currentElement);
+      const hasScrollableX = /(auto|scroll|overlay)/.test(computedStyle.overflowX) || computedStyle.scrollbarWidth && computedStyle.scrollbarWidth !== "auto" || computedStyle.scrollbarGutter && computedStyle.scrollbarGutter !== "auto";
+      const canScrollHorizontally = currentElement.scrollWidth > currentElement.clientWidth;
+      if (hasScrollableX && canScrollHorizontally) {
+        const beforeScroll = currentElement.scrollLeft;
+        const maxScroll = currentElement.scrollWidth - currentElement.clientWidth;
+        let scrollAmount = dx2 / 3;
+        if (scrollAmount > 0) {
+          scrollAmount = Math.min(scrollAmount, maxScroll - beforeScroll);
+        } else {
+          scrollAmount = Math.max(scrollAmount, -beforeScroll);
+        }
+        currentElement.scrollLeft = beforeScroll + scrollAmount;
+        const afterScroll = currentElement.scrollLeft;
+        const actualScrollDelta = afterScroll - beforeScroll;
+        if (Math.abs(actualScrollDelta) > 0.5) {
+          scrollSuccess = true;
+          scrolledElement = currentElement;
+          scrollDelta = actualScrollDelta;
+          break;
+        }
+      }
+      if (currentElement === document.body || currentElement === document.documentElement) {
+        break;
+      }
+      currentElement = currentElement.parentElement;
+      attempts++;
+    }
+    if (scrollSuccess) {
+      return `Scrolled container (${scrolledElement?.tagName}) horizontally by ${scrollDelta}px`;
+    } else {
+      return `No horizontally scrollable container found for element (${targetElement.tagName})`;
+    }
+  }
+  const dx = scroll_amount;
+  const bigEnough = (el2) => el2.clientWidth >= window.innerWidth * 0.5;
+  const canScroll = (el2) => Boolean(
+    el2 && /(auto|scroll|overlay)/.test(getComputedStyle(el2).overflowX) && el2.scrollWidth > el2.clientWidth && bigEnough(el2)
+  );
+  let el = document.activeElement;
+  while (el && !canScroll(el) && el !== document.body) el = el.parentElement;
+  el = canScroll(el) ? el : Array.from(document.querySelectorAll("*")).find(canScroll) || document.scrollingElement || document.documentElement;
+  if (el === document.scrollingElement || el === document.documentElement || el === document.body) {
+    const scrollBefore = window.scrollX;
+    const scrollMax = document.documentElement.scrollWidth - window.innerWidth;
+    window.scrollBy(dx, 0);
+    const scrollAfter = window.scrollX;
+    const scrolled = scrollAfter - scrollBefore;
+    if (Math.abs(scrolled) < 1) {
+      return dx > 0 ? `⚠️ Already at the right edge of the page, cannot scroll right further.` : `⚠️ Already at the left edge of the page, cannot scroll left further.`;
+    }
+    const reachedRight = dx > 0 && scrollAfter >= scrollMax - 1;
+    const reachedLeft = dx < 0 && scrollAfter <= 1;
+    if (reachedRight)
+      return `✅ Scrolled page by ${scrolled}px. Reached the right edge of the page.`;
+    if (reachedLeft) return `✅ Scrolled page by ${scrolled}px. Reached the left edge of the page.`;
+    return `✅ Scrolled page horizontally by ${scrolled}px.`;
+  } else {
+    const warningMsg = `The document is not scrollable. Falling back to container scroll.`;
+    console.log(`[PageController] ${warningMsg}`);
+    const scrollBefore = el.scrollLeft;
+    const scrollMax = el.scrollWidth - el.clientWidth;
+    el.scrollBy({ left: dx, behavior: "smooth" });
+    await waitFor(0.1);
+    const scrollAfter = el.scrollLeft;
+    const scrolled = scrollAfter - scrollBefore;
+    if (Math.abs(scrolled) < 1) {
+      return dx > 0 ? `⚠️ ${warningMsg} Already at the right edge of container (${el.tagName}), cannot scroll right further.` : `⚠️ ${warningMsg} Already at the left edge of container (${el.tagName}), cannot scroll left further.`;
+    }
+    const reachedRight = dx > 0 && scrollAfter >= scrollMax - 1;
+    const reachedLeft = dx < 0 && scrollAfter <= 1;
+    if (reachedRight)
+      return `✅ ${warningMsg} Scrolled container (${el.tagName}) by ${scrolled}px. Reached the right edge.`;
+    if (reachedLeft)
+      return `✅ ${warningMsg} Scrolled container (${el.tagName}) by ${scrolled}px. Reached the left edge.`;
+    return `✅ ${warningMsg} Scrolled container (${el.tagName}) horizontally by ${scrolled}px.`;
+  }
+}
+const domTree = (args = {
+  doHighlightElements: true,
+  focusHighlightIndex: -1,
+  viewportExpansion: 0,
+  debugMode: false,
+  /**
+   * @edit
+   */
+  /** @type {Element[]} */
+  interactiveBlacklist: [],
+  /** @type {Element[]} */
+  interactiveWhitelist: [],
+  highlightOpacity: 0.1,
+  highlightLabelOpacity: 0.5
+}) => {
+  const { interactiveBlacklist, interactiveWhitelist, highlightOpacity, highlightLabelOpacity } = args;
+  const { doHighlightElements, focusHighlightIndex, viewportExpansion, debugMode } = args;
+  let highlightIndex = 0;
+  const extraData = /* @__PURE__ */ new WeakMap();
+  function addExtraData(element, data) {
+    if (!element || element.nodeType !== Node.ELEMENT_NODE) return;
+    extraData.set(element, { ...extraData.get(element), ...data });
+  }
+  const DOM_CACHE = {
+    boundingRects: /* @__PURE__ */ new WeakMap(),
+    clientRects: /* @__PURE__ */ new WeakMap(),
+    computedStyles: /* @__PURE__ */ new WeakMap(),
+    clearCache: () => {
+      DOM_CACHE.boundingRects = /* @__PURE__ */ new WeakMap();
+      DOM_CACHE.clientRects = /* @__PURE__ */ new WeakMap();
+      DOM_CACHE.computedStyles = /* @__PURE__ */ new WeakMap();
+    }
+  };
+  function getCachedBoundingRect(element) {
+    if (!element) return null;
+    if (DOM_CACHE.boundingRects.has(element)) {
+      return DOM_CACHE.boundingRects.get(element);
+    }
+    const rect = element.getBoundingClientRect();
+    if (rect) {
+      DOM_CACHE.boundingRects.set(element, rect);
+    }
+    return rect;
+  }
+  function getCachedComputedStyle(element) {
+    if (!element) return null;
+    if (DOM_CACHE.computedStyles.has(element)) {
+      return DOM_CACHE.computedStyles.get(element);
+    }
+    const style = window.getComputedStyle(element);
+    if (style) {
+      DOM_CACHE.computedStyles.set(element, style);
+    }
+    return style;
+  }
+  function getCachedClientRects(element) {
+    if (!element) return null;
+    if (DOM_CACHE.clientRects.has(element)) {
+      return DOM_CACHE.clientRects.get(element);
+    }
+    const rects = element.getClientRects();
+    if (rects) {
+      DOM_CACHE.clientRects.set(element, rects);
+    }
+    return rects;
+  }
+  const DOM_HASH_MAP = {};
+  const ID = { current: 0 };
+  const HIGHLIGHT_CONTAINER_ID = "playwright-highlight-container";
+  function highlightElement(element, index, parentIframe = null) {
+    if (!element) return index;
+    const overlays = [];
+    let label = null;
+    let labelWidth = 20;
+    let labelHeight = 16;
+    let cleanupFn = null;
+    try {
+      let container = document.getElementById(HIGHLIGHT_CONTAINER_ID);
+      if (!container) {
+        container = document.createElement("div");
+        container.id = HIGHLIGHT_CONTAINER_ID;
+        container.style.position = "fixed";
+        container.style.pointerEvents = "none";
+        container.style.top = "0";
+        container.style.left = "0";
+        container.style.width = "100%";
+        container.style.height = "100%";
+        container.style.zIndex = "2147483640";
+        container.style.backgroundColor = "transparent";
+        document.body.appendChild(container);
+      }
+      const rects = element.getClientRects();
+      if (!rects || rects.length === 0) return index;
+      const colors = [
+        "#FF0000",
+        "#00FF00",
+        "#0000FF",
+        "#FFA500",
+        "#800080",
+        "#008080",
+        "#FF69B4",
+        "#4B0082",
+        "#FF4500",
+        "#2E8B57",
+        "#DC143C",
+        "#4682B4"
+      ];
+      const colorIndex = index % colors.length;
+      let baseColor = colors[colorIndex];
+      const backgroundColor = baseColor + Math.floor(highlightOpacity * 255).toString(16).padStart(2, "0");
+      baseColor = baseColor + Math.floor(highlightLabelOpacity * 255).toString(16).padStart(2, "0");
+      let iframeOffset = { x: 0, y: 0 };
+      if (parentIframe) {
+        const iframeRect = parentIframe.getBoundingClientRect();
+        iframeOffset.x = iframeRect.left;
+        iframeOffset.y = iframeRect.top;
+      }
+      const fragment = document.createDocumentFragment();
+      for (const rect of rects) {
+        if (rect.width === 0 || rect.height === 0) continue;
+        const overlay = document.createElement("div");
+        overlay.style.position = "fixed";
+        overlay.style.border = `2px solid ${baseColor}`;
+        overlay.style.backgroundColor = backgroundColor;
+        overlay.style.pointerEvents = "none";
+        overlay.style.boxSizing = "border-box";
+        const top = rect.top + iframeOffset.y;
+        const left = rect.left + iframeOffset.x;
+        overlay.style.top = `${top}px`;
+        overlay.style.left = `${left}px`;
+        overlay.style.width = `${rect.width}px`;
+        overlay.style.height = `${rect.height}px`;
+        fragment.appendChild(overlay);
+        overlays.push({ element: overlay, initialRect: rect });
+      }
+      const firstRect = rects[0];
+      label = document.createElement("div");
+      label.className = "playwright-highlight-label";
+      label.style.position = "fixed";
+      label.style.background = baseColor;
+      label.style.color = "white";
+      label.style.padding = "1px 4px";
+      label.style.borderRadius = "4px";
+      label.style.fontSize = `${Math.min(12, Math.max(8, firstRect.height / 2))}px`;
+      label.textContent = index.toString();
+      labelWidth = label.offsetWidth > 0 ? label.offsetWidth : labelWidth;
+      labelHeight = label.offsetHeight > 0 ? label.offsetHeight : labelHeight;
+      const firstRectTop = firstRect.top + iframeOffset.y;
+      const firstRectLeft = firstRect.left + iframeOffset.x;
+      let labelTop = firstRectTop + 2;
+      let labelLeft = firstRectLeft + firstRect.width - labelWidth - 2;
+      if (firstRect.width < labelWidth + 4 || firstRect.height < labelHeight + 4) {
+        labelTop = firstRectTop - labelHeight - 2;
+        labelLeft = firstRectLeft + firstRect.width - labelWidth;
+        if (labelLeft < iframeOffset.x) labelLeft = firstRectLeft;
+      }
+      labelTop = Math.max(0, Math.min(labelTop, window.innerHeight - labelHeight));
+      labelLeft = Math.max(0, Math.min(labelLeft, window.innerWidth - labelWidth));
+      label.style.top = `${labelTop}px`;
+      label.style.left = `${labelLeft}px`;
+      fragment.appendChild(label);
+      const updatePositions = () => {
+        const newRects = element.getClientRects();
+        let newIframeOffset = { x: 0, y: 0 };
+        if (parentIframe) {
+          const iframeRect = parentIframe.getBoundingClientRect();
+          newIframeOffset.x = iframeRect.left;
+          newIframeOffset.y = iframeRect.top;
+        }
+        overlays.forEach((overlayData, i) => {
+          if (i < newRects.length) {
+            const newRect = newRects[i];
+            const newTop = newRect.top + newIframeOffset.y;
+            const newLeft = newRect.left + newIframeOffset.x;
+            overlayData.element.style.top = `${newTop}px`;
+            overlayData.element.style.left = `${newLeft}px`;
+            overlayData.element.style.width = `${newRect.width}px`;
+            overlayData.element.style.height = `${newRect.height}px`;
+            overlayData.element.style.display = newRect.width === 0 || newRect.height === 0 ? "none" : "block";
+          } else {
+            overlayData.element.style.display = "none";
+          }
+        });
+        if (newRects.length < overlays.length) {
+          for (let i = newRects.length; i < overlays.length; i++) {
+            overlays[i].element.style.display = "none";
+          }
+        }
+        if (label && newRects.length > 0) {
+          const firstNewRect = newRects[0];
+          const firstNewRectTop = firstNewRect.top + newIframeOffset.y;
+          const firstNewRectLeft = firstNewRect.left + newIframeOffset.x;
+          let newLabelTop = firstNewRectTop + 2;
+          let newLabelLeft = firstNewRectLeft + firstNewRect.width - labelWidth - 2;
+          if (firstNewRect.width < labelWidth + 4 || firstNewRect.height < labelHeight + 4) {
+            newLabelTop = firstNewRectTop - labelHeight - 2;
+            newLabelLeft = firstNewRectLeft + firstNewRect.width - labelWidth;
+            if (newLabelLeft < newIframeOffset.x) newLabelLeft = firstNewRectLeft;
+          }
+          newLabelTop = Math.max(0, Math.min(newLabelTop, window.innerHeight - labelHeight));
+          newLabelLeft = Math.max(0, Math.min(newLabelLeft, window.innerWidth - labelWidth));
+          label.style.top = `${newLabelTop}px`;
+          label.style.left = `${newLabelLeft}px`;
+          label.style.display = "block";
+        } else if (label) {
+          label.style.display = "none";
+        }
+      };
+      const throttleFunction = (func, delay) => {
+        let lastCall = 0;
+        return (...args2) => {
+          const now = performance.now();
+          if (now - lastCall < delay) return;
+          lastCall = now;
+          return func(...args2);
+        };
+      };
+      const throttledUpdatePositions = throttleFunction(updatePositions, 16);
+      window.addEventListener("scroll", throttledUpdatePositions, true);
+      window.addEventListener("resize", throttledUpdatePositions);
+      cleanupFn = () => {
+        window.removeEventListener("scroll", throttledUpdatePositions, true);
+        window.removeEventListener("resize", throttledUpdatePositions);
+        overlays.forEach((overlay) => overlay.element.remove());
+        if (label) label.remove();
+      };
+      container.appendChild(fragment);
+      return index + 1;
+    } finally {
+      if (cleanupFn) {
+        (window._highlightCleanupFunctions = window._highlightCleanupFunctions || []).push(
+          cleanupFn
+        );
+      }
+    }
+  }
+  function isScrollableElement(element) {
+    if (!element || element.nodeType !== Node.ELEMENT_NODE) {
+      return null;
+    }
+    const style = getCachedComputedStyle(element);
+    if (!style) return null;
+    const display = style.display;
+    if (display === "inline" || display === "inline-block") {
+      return null;
+    }
+    const overflowX = style.overflowX;
+    const overflowY = style.overflowY;
+    const hasScrollbarSignal = style.scrollbarWidth && style.scrollbarWidth !== "auto" || style.scrollbarGutter && style.scrollbarGutter !== "auto";
+    const scrollableX = overflowX === "auto" || overflowX === "scroll";
+    const scrollableY = overflowY === "auto" || overflowY === "scroll";
+    if (!scrollableX && !scrollableY && !hasScrollbarSignal) {
+      return null;
+    }
+    const scrollWidth = element.scrollWidth - element.clientWidth;
+    const scrollHeight = element.scrollHeight - element.clientHeight;
+    const threshold = 4;
+    if (scrollWidth < threshold && scrollHeight < threshold) {
+      return null;
+    }
+    if (!scrollableY && !hasScrollbarSignal && scrollWidth < threshold) {
+      return null;
+    }
+    if (!scrollableX && !hasScrollbarSignal && scrollHeight < threshold) {
+      return null;
+    }
+    const distanceToTop = element.scrollTop;
+    const distanceToLeft = element.scrollLeft;
+    const distanceToRight = element.scrollWidth - element.clientWidth - element.scrollLeft;
+    const distanceToBottom = element.scrollHeight - element.clientHeight - element.scrollTop;
+    const scrollData = {
+      top: distanceToTop,
+      right: distanceToRight,
+      bottom: distanceToBottom,
+      left: distanceToLeft
+    };
+    addExtraData(element, {
+      scrollable: true,
+      scrollData
+    });
+    return scrollData;
+  }
+  function isTextNodeVisible(textNode) {
+    try {
+      if (viewportExpansion === -1) {
+        const parentElement2 = textNode.parentElement;
+        if (!parentElement2) return false;
+        try {
+          return parentElement2.checkVisibility({
+            checkOpacity: true,
+            checkVisibilityCSS: true
+          });
+        } catch (e) {
+          const style = window.getComputedStyle(parentElement2);
+          return style.display !== "none" && style.visibility !== "hidden" && style.opacity !== "0";
+        }
+      }
+      const range = document.createRange();
+      range.selectNodeContents(textNode);
+      const rects = range.getClientRects();
+      if (!rects || rects.length === 0) {
+        return false;
+      }
+      let isAnyRectVisible = false;
+      let isAnyRectInViewport = false;
+      for (const rect of rects) {
+        if (rect.width > 0 && rect.height > 0) {
+          isAnyRectVisible = true;
+          if (!(rect.bottom < -viewportExpansion || rect.top > window.innerHeight + viewportExpansion || rect.right < -viewportExpansion || rect.left > window.innerWidth + viewportExpansion)) {
+            isAnyRectInViewport = true;
+            break;
+          }
+        }
+      }
+      if (!isAnyRectVisible || !isAnyRectInViewport) {
+        return false;
+      }
+      const parentElement = textNode.parentElement;
+      if (!parentElement) return false;
+      try {
+        return parentElement.checkVisibility({
+          checkOpacity: true,
+          checkVisibilityCSS: true
+        });
+      } catch (e) {
+        const style = window.getComputedStyle(parentElement);
+        return style.display !== "none" && style.visibility !== "hidden" && style.opacity !== "0";
+      }
+    } catch (e) {
+      console.warn("Error checking text node visibility:", e);
+      return false;
+    }
+  }
+  function isElementAccepted(element) {
+    if (!element || !element.tagName) return false;
+    const alwaysAccept = /* @__PURE__ */ new Set([
+      "body",
+      "div",
+      "main",
+      "article",
+      "section",
+      "nav",
+      "header",
+      "footer"
+    ]);
+    const tagName = element.tagName.toLowerCase();
+    if (alwaysAccept.has(tagName)) return true;
+    const leafElementDenyList = /* @__PURE__ */ new Set([
+      "svg",
+      "script",
+      "style",
+      "link",
+      "meta",
+      "noscript",
+      "template"
+    ]);
+    return !leafElementDenyList.has(tagName);
+  }
+  function isElementVisible(element) {
+    const style = getCachedComputedStyle(element);
+    return element.offsetWidth > 0 && element.offsetHeight > 0 && style?.visibility !== "hidden" && style?.display !== "none";
+  }
+  function isInteractiveElement(element) {
+    if (!element || element.nodeType !== Node.ELEMENT_NODE) {
+      return false;
+    }
+    if (interactiveBlacklist.includes(element)) {
+      return false;
+    }
+    if (interactiveWhitelist.includes(element)) {
+      return true;
+    }
+    const tagName = element.tagName.toLowerCase();
+    const style = getCachedComputedStyle(element);
+    const interactiveCursors = /* @__PURE__ */ new Set([
+      "pointer",
+      // Link/clickable elements
+      "move",
+      // Movable elements
+      "text",
+      // Text selection
+      "grab",
+      // Grabbable elements
+      "grabbing",
+      // Currently grabbing
+      "cell",
+      // Table cell selection
+      "copy",
+      // Copy operation
+      "alias",
+      // Alias creation
+      "all-scroll",
+      // Scrollable content
+      "col-resize",
+      // Column resize
+      "context-menu",
+      // Context menu available
+      "crosshair",
+      // Precise selection
+      "e-resize",
+      // East resize
+      "ew-resize",
+      // East-west resize
+      "help",
+      // Help available
+      "n-resize",
+      // North resize
+      "ne-resize",
+      // Northeast resize
+      "nesw-resize",
+      // Northeast-southwest resize
+      "ns-resize",
+      // North-south resize
+      "nw-resize",
+      // Northwest resize
+      "nwse-resize",
+      // Northwest-southeast resize
+      "row-resize",
+      // Row resize
+      "s-resize",
+      // South resize
+      "se-resize",
+      // Southeast resize
+      "sw-resize",
+      // Southwest resize
+      "vertical-text",
+      // Vertical text selection
+      "w-resize",
+      // West resize
+      "zoom-in",
+      // Zoom in
+      "zoom-out"
+      // Zoom out
+    ]);
+    const nonInteractiveCursors = /* @__PURE__ */ new Set([
+      "not-allowed",
+      // Action not allowed
+      "no-drop",
+      // Drop not allowed
+      "wait",
+      // Processing
+      "progress",
+      // In progress
+      "initial",
+      // Initial value
+      "inherit"
+      // Inherited value
+      //? Let's just include all potentially clickable elements that are not specifically blocked
+      // 'none',        // No cursor
+      // 'default',     // Default cursor
+      // 'auto',        // Browser default
+    ]);
+    function doesElementHaveInteractivePointer(element2) {
+      if (element2.tagName.toLowerCase() === "html") return false;
+      if (style?.cursor && interactiveCursors.has(style.cursor)) return true;
+      return false;
+    }
+    let isInteractiveCursor = doesElementHaveInteractivePointer(element);
+    if (isInteractiveCursor) {
+      return true;
+    }
+    const interactiveElements = /* @__PURE__ */ new Set([
+      "a",
+      // Links
+      "button",
+      // Buttons
+      "input",
+      // All input types (text, checkbox, radio, etc.)
+      "select",
+      // Dropdown menus
+      "textarea",
+      // Text areas
+      "details",
+      // Expandable details
+      "summary",
+      // Summary element (clickable part of details)
+      "label",
+      // Form labels (often clickable)
+      "option",
+      // Select options
+      "optgroup",
+      // Option groups
+      "fieldset",
+      // Form fieldsets (can be interactive with legend)
+      "legend"
+      // Fieldset legends
+    ]);
+    const explicitDisableTags = /* @__PURE__ */ new Set([
+      "disabled",
+      // Standard disabled attribute
+      // 'aria-disabled',      // ARIA disabled state
+      "readonly"
+      // Read-only state
+      // 'aria-readonly',     // ARIA read-only state
+      // 'aria-hidden',       // Hidden from accessibility
+      // 'hidden',            // Hidden attribute
+      // 'inert',             // Inert attribute
+      // 'aria-inert',        // ARIA inert state
+      // 'tabindex="-1"',     // Removed from tab order
+      // 'aria-hidden="true"' // Hidden from screen readers
+    ]);
+    if (interactiveElements.has(tagName)) {
+      if (style?.cursor && nonInteractiveCursors.has(style.cursor)) {
+        return false;
+      }
+      for (const disableTag of explicitDisableTags) {
+        if (element.hasAttribute(disableTag) || element.getAttribute(disableTag) === "true" || element.getAttribute(disableTag) === "") {
+          return false;
+        }
+      }
+      if (element.disabled) {
+        return false;
+      }
+      if (element.readOnly) {
+        return false;
+      }
+      if (element.inert) {
+        return false;
+      }
+      return true;
+    }
+    const role = element.getAttribute("role");
+    const ariaRole = element.getAttribute("aria-role");
+    if (element.getAttribute("contenteditable") === "true" || element.isContentEditable) {
+      return true;
+    }
+    if (element.classList && (element.classList.contains("button") || element.classList.contains("dropdown-toggle") || element.getAttribute("data-index") || element.getAttribute("data-toggle") === "dropdown" || element.getAttribute("aria-haspopup") === "true")) {
+      return true;
+    }
+    const interactiveRoles = /* @__PURE__ */ new Set([
+      "button",
+      // Directly clickable element
+      // 'link',            // Clickable link
+      "menu",
+      // Menu container (ARIA menus)
+      "menubar",
+      // Menu bar container
+      "menuitem",
+      // Clickable menu item
+      "menuitemradio",
+      // Radio-style menu item (selectable)
+      "menuitemcheckbox",
+      // Checkbox-style menu item (toggleable)
+      "radio",
+      // Radio button (selectable)
+      "checkbox",
+      // Checkbox (toggleable)
+      "tab",
+      // Tab (clickable to switch content)
+      "switch",
+      // Toggle switch (clickable to change state)
+      "slider",
+      // Slider control (draggable)
+      "spinbutton",
+      // Number input with up/down controls
+      "combobox",
+      // Dropdown with text input
+      "searchbox",
+      // Search input field
+      "textbox",
+      // Text input field
+      "listbox",
+      // Selectable list
+      "option",
+      // Selectable option in a list
+      "scrollbar"
+      // Scrollable control
+    ]);
+    const hasInteractiveRole = interactiveElements.has(tagName) || role && interactiveRoles.has(role) || ariaRole && interactiveRoles.has(ariaRole);
+    if (hasInteractiveRole) return true;
+    try {
+      if (typeof getEventListeners === "function") {
+        const listeners = getEventListeners(element);
+        const mouseEvents = ["click", "mousedown", "mouseup", "dblclick"];
+        for (const eventType of mouseEvents) {
+          if (listeners[eventType] && listeners[eventType].length > 0) {
+            return true;
+          }
+        }
+      }
+      const getEventListenersForNode = element?.ownerDocument?.defaultView?.getEventListenersForNode || window.getEventListenersForNode;
+      if (typeof getEventListenersForNode === "function") {
+        const listeners = getEventListenersForNode(element);
+        const interactionEvents = [
+          "click",
+          "mousedown",
+          "mouseup",
+          "keydown",
+          "keyup",
+          "submit",
+          "change",
+          "input",
+          "focus",
+          "blur"
+        ];
+        for (const eventType of interactionEvents) {
+          for (const listener of listeners) {
+            if (listener.type === eventType) {
+              return true;
+            }
+          }
+        }
+      }
+      const commonMouseAttrs = ["onclick", "onmousedown", "onmouseup", "ondblclick"];
+      for (const attr of commonMouseAttrs) {
+        if (element.hasAttribute(attr) || typeof element[attr] === "function") {
+          return true;
+        }
+      }
+    } catch (e) {
+    }
+    if (isScrollableElement(element)) {
+      return true;
+    }
+    return false;
+  }
+  function isTopElement(element) {
+    if (viewportExpansion === -1) {
+      return true;
+    }
+    const rects = getCachedClientRects(element);
+    if (!rects || rects.length === 0) {
+      return false;
+    }
+    let isAnyRectInViewport = false;
+    for (const rect2 of rects) {
+      if (rect2.width > 0 && rect2.height > 0 && !// Only check non-empty rects
+      (rect2.bottom < -viewportExpansion || rect2.top > window.innerHeight + viewportExpansion || rect2.right < -viewportExpansion || rect2.left > window.innerWidth + viewportExpansion)) {
+        isAnyRectInViewport = true;
+        break;
+      }
+    }
+    if (!isAnyRectInViewport) {
+      return false;
+    }
+    let doc = element.ownerDocument;
+    if (doc !== window.document) {
+      return true;
+    }
+    let rect = Array.from(rects).find((r) => r.width > 0 && r.height > 0);
+    if (!rect) {
+      return false;
+    }
+    const shadowRoot = element.getRootNode();
+    if (shadowRoot instanceof ShadowRoot) {
+      const centerX = rect.left + rect.width / 2;
+      const centerY = rect.top + rect.height / 2;
+      try {
+        const topEl = shadowRoot.elementFromPoint(centerX, centerY);
+        if (!topEl) return false;
+        let current = topEl;
+        while (current && current !== shadowRoot) {
+          if (current === element) return true;
+          current = current.parentElement;
+        }
+        return false;
+      } catch (e) {
+        return true;
+      }
+    }
+    const margin = 5;
+    const checkPoints = [
+      // Initially only this was used, but it was not enough
+      { x: rect.left + rect.width / 2, y: rect.top + rect.height / 2 },
+      { x: rect.left + margin, y: rect.top + margin },
+      // top left
+      // { x: rect.right - margin, y: rect.top + margin },    // top right
+      // { x: rect.left + margin, y: rect.bottom - margin },  // bottom left
+      { x: rect.right - margin, y: rect.bottom - margin }
+      // bottom right
+    ];
+    return checkPoints.some(({ x, y }) => {
+      try {
+        const topEl = document.elementFromPoint(x, y);
+        if (!topEl) return false;
+        let current = topEl;
+        while (current && current !== document.documentElement) {
+          if (current === element) return true;
+          current = current.parentElement;
+        }
+        return false;
+      } catch (e) {
+        return true;
+      }
+    });
+  }
+  function isInExpandedViewport(element, viewportExpansion2) {
+    if (viewportExpansion2 === -1) {
+      return true;
+    }
+    const rects = element.getClientRects();
+    if (!rects || rects.length === 0) {
+      const boundingRect = getCachedBoundingRect(element);
+      if (!boundingRect || boundingRect.width === 0 || boundingRect.height === 0) {
+        return false;
+      }
+      return !(boundingRect.bottom < -viewportExpansion2 || boundingRect.top > window.innerHeight + viewportExpansion2 || boundingRect.right < -viewportExpansion2 || boundingRect.left > window.innerWidth + viewportExpansion2);
+    }
+    for (const rect of rects) {
+      if (rect.width === 0 || rect.height === 0) continue;
+      if (!(rect.bottom < -viewportExpansion2 || rect.top > window.innerHeight + viewportExpansion2 || rect.right < -viewportExpansion2 || rect.left > window.innerWidth + viewportExpansion2)) {
+        return true;
+      }
+    }
+    return false;
+  }
+  const INTERACTIVE_ARIA_ATTRS = [
+    "aria-expanded",
+    "aria-checked",
+    "aria-selected",
+    "aria-pressed",
+    "aria-haspopup",
+    "aria-controls",
+    "aria-owns",
+    "aria-activedescendant",
+    "aria-valuenow",
+    "aria-valuetext",
+    "aria-valuemax",
+    "aria-valuemin",
+    "aria-autocomplete"
+  ];
+  function hasInteractiveAria(el) {
+    for (let i = 0; i < INTERACTIVE_ARIA_ATTRS.length; i++) {
+      if (el.hasAttribute(INTERACTIVE_ARIA_ATTRS[i])) return true;
+    }
+    return false;
+  }
+  function isInteractiveCandidate(element) {
+    if (!element || element.nodeType !== Node.ELEMENT_NODE) return false;
+    const tagName = element.tagName.toLowerCase();
+    const interactiveElements = /* @__PURE__ */ new Set([
+      "a",
+      "button",
+      "input",
+      "select",
+      "textarea",
+      "details",
+      "summary",
+      "label"
+    ]);
+    if (interactiveElements.has(tagName)) return true;
+    const hasQuickInteractiveAttr = element.hasAttribute("onclick") || element.hasAttribute("role") || element.hasAttribute("tabindex") || hasInteractiveAria(element) || element.hasAttribute("data-action") || element.getAttribute("contenteditable") === "true";
+    return hasQuickInteractiveAttr;
+  }
+  const DISTINCT_INTERACTIVE_TAGS = /* @__PURE__ */ new Set([
+    "a",
+    "button",
+    "input",
+    "select",
+    "textarea",
+    "summary",
+    "details",
+    "label",
+    "option",
+    "li"
+  ]);
+  const DISTINCT_INTERACTIVE_ROLES = /* @__PURE__ */ new Set([
+    "button",
+    "link",
+    "menuitem",
+    "menuitemradio",
+    "menuitemcheckbox",
+    "radio",
+    "checkbox",
+    "tab",
+    "switch",
+    "slider",
+    "spinbutton",
+    "combobox",
+    "searchbox",
+    "textbox",
+    "listbox",
+    "listitem",
+    "treeitem",
+    "row",
+    "option",
+    "scrollbar"
+  ]);
+  function isHeuristicallyInteractive(element) {
+    if (!element || element.nodeType !== Node.ELEMENT_NODE) return false;
+    if (!isElementVisible(element)) return false;
+    const hasInteractiveAttributes = element.hasAttribute("role") || element.hasAttribute("tabindex") || element.hasAttribute("onclick") || typeof element.onclick === "function";
+    const hasInteractiveClass = /\b(btn|clickable|menu|item|entry|link)\b/i.test(
+      element.className || ""
+    );
+    const isInKnownContainer = Boolean(
+      element.closest('button,a,[role="button"],.menu,.dropdown,.list,.toolbar')
+    );
+    const hasVisibleChildren = [...element.children].some(isElementVisible);
+    const isParentBody = element.parentElement && element.parentElement.isSameNode(document.body);
+    return (isInteractiveElement(element) || hasInteractiveAttributes || hasInteractiveClass) && hasVisibleChildren && isInKnownContainer && !isParentBody;
+  }
+  function isElementDistinctInteraction(element) {
+    if (!element || element.nodeType !== Node.ELEMENT_NODE) {
+      return false;
+    }
+    const tagName = element.tagName.toLowerCase();
+    const role = element.getAttribute("role");
+    if (tagName === "iframe") {
+      return true;
+    }
+    if (DISTINCT_INTERACTIVE_TAGS.has(tagName)) {
+      return true;
+    }
+    if (role && DISTINCT_INTERACTIVE_ROLES.has(role)) {
+      return true;
+    }
+    if (element.isContentEditable || element.getAttribute("contenteditable") === "true") {
+      return true;
+    }
+    if (element.hasAttribute("data-testid") || element.hasAttribute("data-cy") || element.hasAttribute("data-test")) {
+      return true;
+    }
+    if (element.hasAttribute("onclick") || typeof element.onclick === "function") {
+      return true;
+    }
+    if (hasInteractiveAria(element)) {
+      return true;
+    }
+    try {
+      const getEventListenersForNode = element?.ownerDocument?.defaultView?.getEventListenersForNode || window.getEventListenersForNode;
+      if (typeof getEventListenersForNode === "function") {
+        const listeners = getEventListenersForNode(element);
+        const interactionEvents = [
+          "click",
+          "mousedown",
+          "mouseup",
+          "keydown",
+          "keyup",
+          "submit",
+          "change",
+          "input",
+          "focus",
+          "blur"
+        ];
+        for (const eventType of interactionEvents) {
+          for (const listener of listeners) {
+            if (listener.type === eventType) {
+              return true;
+            }
+          }
+        }
+      }
+      const commonEventAttrs = [
+        "onmousedown",
+        "onmouseup",
+        "onkeydown",
+        "onkeyup",
+        "onsubmit",
+        "onchange",
+        "oninput",
+        "onfocus",
+        "onblur"
+      ];
+      if (commonEventAttrs.some((attr) => element.hasAttribute(attr))) {
+        return true;
+      }
+    } catch (e) {
+    }
+    if (isHeuristicallyInteractive(element)) {
+      return true;
+    }
+    if (extraData.get(element)?.scrollable) {
+      return true;
+    }
+    return false;
+  }
+  function handleHighlighting(nodeData, node, parentIframe, isParentHighlighted) {
+    if (!nodeData.isInteractive) return false;
+    let shouldHighlight = false;
+    if (!isParentHighlighted) {
+      shouldHighlight = true;
+    } else {
+      if (isElementDistinctInteraction(node)) {
+        shouldHighlight = true;
+      } else {
+        shouldHighlight = false;
+      }
+    }
+    if (shouldHighlight) {
+      nodeData.isInViewport = isInExpandedViewport(node, viewportExpansion);
+      if (nodeData.isInViewport || viewportExpansion === -1) {
+        nodeData.highlightIndex = highlightIndex++;
+        if (doHighlightElements) {
+          if (focusHighlightIndex >= 0) {
+            if (focusHighlightIndex === nodeData.highlightIndex) {
+              highlightElement(node, nodeData.highlightIndex, parentIframe);
+            }
+          } else {
+            highlightElement(node, nodeData.highlightIndex, parentIframe);
+          }
+          return true;
+        }
+      }
+    }
+    return false;
+  }
+  function buildDomTree(node, parentIframe = null, isParentHighlighted = false) {
+    if (!node || node.id === HIGHLIGHT_CONTAINER_ID || node.nodeType !== Node.ELEMENT_NODE && node.nodeType !== Node.TEXT_NODE) {
+      return null;
+    }
+    if (!node || node.id === HIGHLIGHT_CONTAINER_ID) {
+      return null;
+    }
+    if (node.dataset?.browserUseIgnore === "true" || node.dataset?.pageAgentIgnore === "true") {
+      return null;
+    }
+    if (node.getAttribute && node.getAttribute("aria-hidden") === "true") {
+      return null;
+    }
+    if (node === document.body) {
+      const nodeData2 = {
+        tagName: "body",
+        attributes: {},
+        xpath: "/body",
+        children: []
+      };
+      for (const child of node.childNodes) {
+        const domElement = buildDomTree(child, parentIframe, false);
+        if (domElement) nodeData2.children.push(domElement);
+      }
+      const id2 = `${ID.current++}`;
+      DOM_HASH_MAP[id2] = nodeData2;
+      return id2;
+    }
+    if (node.nodeType !== Node.ELEMENT_NODE && node.nodeType !== Node.TEXT_NODE) {
+      return null;
+    }
+    if (node.nodeType === Node.TEXT_NODE) {
+      const textContent = node.textContent?.trim();
+      if (!textContent) {
+        return null;
+      }
+      const parentElement = node.parentElement;
+      if (!parentElement || parentElement.tagName.toLowerCase() === "script") {
+        return null;
+      }
+      const id2 = `${ID.current++}`;
+      DOM_HASH_MAP[id2] = {
+        type: "TEXT_NODE",
+        text: textContent,
+        isVisible: isTextNodeVisible(node)
+      };
+      return id2;
+    }
+    if (node.nodeType === Node.ELEMENT_NODE && !isElementAccepted(node)) {
+      return null;
+    }
+    if (viewportExpansion !== -1 && !node.shadowRoot) {
+      const rect = getCachedBoundingRect(node);
+      const style = getCachedComputedStyle(node);
+      const isFixedOrSticky = style && (style.position === "fixed" || style.position === "sticky");
+      const hasSize = node.offsetWidth > 0 || node.offsetHeight > 0;
+      if (!rect || !isFixedOrSticky && !hasSize && (rect.bottom < -viewportExpansion || rect.top > window.innerHeight + viewportExpansion || rect.right < -viewportExpansion || rect.left > window.innerWidth + viewportExpansion)) {
+        return null;
+      }
+    }
+    const nodeData = {
+      tagName: node.tagName.toLowerCase(),
+      attributes: {},
+      /**
+       * @edit no need for xpath
+       */
+      // xpath: getXPathTree(node, true),
+      children: []
+    };
+    if (isInteractiveCandidate(node) || node.tagName.toLowerCase() === "iframe" || node.tagName.toLowerCase() === "body") {
+      const attributeNames = node.getAttributeNames?.() || [];
+      for (const name of attributeNames) {
+        const value = node.getAttribute(name);
+        nodeData.attributes[name] = value;
+      }
+      if (node.tagName.toLowerCase() === "input" && (node.type === "checkbox" || node.type === "radio")) {
+        nodeData.attributes.checked = node.checked ? "true" : "false";
+      }
+    }
+    let nodeWasHighlighted = false;
+    if (node.nodeType === Node.ELEMENT_NODE) {
+      nodeData.isVisible = isElementVisible(node);
+      if (nodeData.isVisible) {
+        nodeData.isTopElement = isTopElement(node);
+        const role = node.getAttribute("role");
+        const isMenuContainer = role === "menu" || role === "menubar" || role === "listbox";
+        if (nodeData.isTopElement || isMenuContainer) {
+          nodeData.isInteractive = isInteractiveElement(node);
+          nodeWasHighlighted = handleHighlighting(nodeData, node, parentIframe, isParentHighlighted);
+          nodeData.ref = node;
+          if (nodeData.isInteractive && Object.keys(nodeData.attributes).length === 0) {
+            const attributeNames = node.getAttributeNames?.() || [];
+            for (const name of attributeNames) {
+              const value = node.getAttribute(name);
+              nodeData.attributes[name] = value;
+            }
+          }
+        }
+      }
+    }
+    if (node.tagName) {
+      const tagName = node.tagName.toLowerCase();
+      if (tagName === "iframe") {
+        try {
+          const iframeDoc = node.contentDocument || node.contentWindow?.document;
+          if (iframeDoc) {
+            for (const child of iframeDoc.childNodes) {
+              const domElement = buildDomTree(child, node, false);
+              if (domElement) nodeData.children.push(domElement);
+            }
+          }
+        } catch (e) {
+          console.warn("Unable to access iframe:", e);
+        }
+      } else if (node.isContentEditable || node.getAttribute("contenteditable") === "true" || node.id === "tinymce" || node.classList.contains("mce-content-body") || tagName === "body" && node.getAttribute("data-id")?.startsWith("mce_")) {
+        for (const child of node.childNodes) {
+          const domElement = buildDomTree(child, parentIframe, nodeWasHighlighted);
+          if (domElement) nodeData.children.push(domElement);
+        }
+      } else {
+        if (node.shadowRoot) {
+          nodeData.shadowRoot = true;
+          for (const child of node.shadowRoot.childNodes) {
+            const domElement = buildDomTree(child, parentIframe, nodeWasHighlighted);
+            if (domElement) nodeData.children.push(domElement);
+          }
+        }
+        for (const child of node.childNodes) {
+          const passHighlightStatusToChild = nodeWasHighlighted || isParentHighlighted;
+          const domElement = buildDomTree(child, parentIframe, passHighlightStatusToChild);
+          if (domElement) nodeData.children.push(domElement);
+        }
+      }
+    }
+    if (nodeData.tagName === "a" && nodeData.children.length === 0 && !nodeData.attributes.href) {
+      const rect = getCachedBoundingRect(node);
+      const hasSize = rect && rect.width > 0 && rect.height > 0 || node.offsetWidth > 0 || node.offsetHeight > 0;
+      if (!hasSize) {
+        return null;
+      }
+    }
+    nodeData.extra = extraData.get(node) || null;
+    const id = `${ID.current++}`;
+    DOM_HASH_MAP[id] = nodeData;
+    return id;
+  }
+  const rootId = buildDomTree(document.body);
+  DOM_CACHE.clearCache();
+  return { rootId, map: DOM_HASH_MAP };
+};
+const DEFAULT_VIEWPORT_EXPANSION = -1;
+function resolveViewportExpansion(viewportExpansion) {
+  return viewportExpansion ?? DEFAULT_VIEWPORT_EXPANSION;
+}
+const SEMANTIC_TAGS = /* @__PURE__ */ new Set([
+  "nav",
+  "menu",
+  // 'main',
+  "header",
+  "footer",
+  "aside",
+  // 'article',
+  // 'form',
+  "dialog"
+]);
+const newElementsCache = /* @__PURE__ */ new WeakMap();
+function getFlatTree(config) {
+  const viewportExpansion = resolveViewportExpansion(config.viewportExpansion);
+  const interactiveBlacklist = [];
+  for (const item of config.interactiveBlacklist || []) {
+    if (typeof item === "function") {
+      interactiveBlacklist.push(item());
+    } else {
+      interactiveBlacklist.push(item);
+    }
+  }
+  const interactiveWhitelist = [];
+  for (const item of config.interactiveWhitelist || []) {
+    if (typeof item === "function") {
+      interactiveWhitelist.push(item());
+    } else {
+      interactiveWhitelist.push(item);
+    }
+  }
+  const elements = domTree({
+    doHighlightElements: true,
+    debugMode: true,
+    focusHighlightIndex: -1,
+    viewportExpansion,
+    interactiveBlacklist,
+    interactiveWhitelist,
+    highlightOpacity: config.highlightOpacity ?? 0,
+    highlightLabelOpacity: config.highlightLabelOpacity ?? 0.1
+  });
+  const currentUrl = window.location.href;
+  for (const nodeId in elements.map) {
+    const node = elements.map[nodeId];
+    if (node.isInteractive && node.ref) {
+      const ref = node.ref;
+      if (!newElementsCache.has(ref)) {
+        newElementsCache.set(ref, currentUrl);
+        node.isNew = true;
+      }
+    }
+  }
+  return elements;
+}
+const globRegexCache = /* @__PURE__ */ new Map();
+function globToRegex(pattern) {
+  let regex = globRegexCache.get(pattern);
+  if (!regex) {
+    const escaped = pattern.replace(/[.+^${}()|[\]\\]/g, "\\$&");
+    regex = new RegExp(`^${escaped.replace(/\*/g, ".*")}$`);
+    globRegexCache.set(pattern, regex);
+  }
+  return regex;
+}
+function matchAttributes(attrs, patterns) {
+  const result2 = {};
+  for (const pattern of patterns) {
+    if (pattern.includes("*")) {
+      const regex = globToRegex(pattern);
+      for (const key of Object.keys(attrs)) {
+        if (regex.test(key) && attrs[key].trim()) {
+          result2[key] = attrs[key].trim();
+        }
+      }
+    } else {
+      const value = attrs[pattern];
+      if (value && value.trim()) {
+        result2[pattern] = value.trim();
+      }
+    }
+  }
+  return result2;
+}
+function flatTreeToString(flatTree, includeAttributes = [], keepSemanticTags = false) {
+  const DEFAULT_INCLUDE_ATTRIBUTES = [
+    "title",
+    "type",
+    "checked",
+    "name",
+    "role",
+    "value",
+    "placeholder",
+    "data-date-format",
+    "alt",
+    "aria-label",
+    "aria-expanded",
+    "data-state",
+    "aria-checked",
+    // @edit added for better form handling
+    "id",
+    "for",
+    // for jump check
+    "target",
+    // absolute position dropdown menu
+    "aria-haspopup",
+    "aria-controls",
+    "aria-owns",
+    // content editable
+    "contenteditable"
+  ];
+  const includeAttrs = [...includeAttributes, ...DEFAULT_INCLUDE_ATTRIBUTES];
+  const capTextLength = (text, maxLength) => {
+    if (text.length > maxLength) {
+      return text.substring(0, maxLength) + "...";
+    }
+    return text;
+  };
+  const buildTreeNode = (nodeId) => {
+    const node = flatTree.map[nodeId];
+    if (!node) return null;
+    if (node.type === "TEXT_NODE") {
+      const textNode = node;
+      return {
+        type: "text",
+        text: textNode.text,
+        isVisible: textNode.isVisible,
+        parent: null,
+        children: []
+      };
+    } else {
+      const elementNode = node;
+      const children = [];
+      if (elementNode.children) {
+        for (const childId of elementNode.children) {
+          const child = buildTreeNode(childId);
+          if (child) {
+            child.parent = null;
+            children.push(child);
+          }
+        }
+      }
+      return {
+        type: "element",
+        tagName: elementNode.tagName,
+        attributes: elementNode.attributes ?? {},
+        isVisible: elementNode.isVisible ?? false,
+        isInteractive: elementNode.isInteractive ?? false,
+        isTopElement: elementNode.isTopElement ?? false,
+        isNew: elementNode.isNew ?? false,
+        highlightIndex: elementNode.highlightIndex,
+        parent: null,
+        children,
+        extra: elementNode.extra ?? {}
+      };
+    }
+  };
+  const setParentReferences = (node, parent = null) => {
+    node.parent = parent;
+    for (const child of node.children) {
+      setParentReferences(child, node);
+    }
+  };
+  const rootNode = buildTreeNode(flatTree.rootId);
+  if (!rootNode) return "";
+  setParentReferences(rootNode);
+  const hasParentWithHighlightIndex = (node) => {
+    let current = node.parent;
+    while (current) {
+      if (current.type === "element" && current.highlightIndex !== void 0) {
+        return true;
+      }
+      current = current.parent;
+    }
+    return false;
+  };
+  const processNode = (node, depth, result22) => {
+    let nextDepth = depth;
+    const depthStr = "	".repeat(depth);
+    if (node.type === "element") {
+      const isSemantic = keepSemanticTags && node.tagName && SEMANTIC_TAGS.has(node.tagName);
+      if (node.highlightIndex !== void 0) {
+        nextDepth += 1;
+        const text = getAllTextTillNextClickableElement(node);
+        let attributesHtmlStr = "";
+        if (includeAttrs.length > 0 && node.attributes) {
+          const attributesToInclude = matchAttributes(node.attributes, includeAttrs);
+          const keys = Object.keys(attributesToInclude);
+          if (keys.length > 1) {
+            const keysToRemove = /* @__PURE__ */ new Set();
+            const seenValues = {};
+            for (const key of keys) {
+              const value = attributesToInclude[key];
+              if (value.length > 5) {
+                if (value in seenValues) {
+                  keysToRemove.add(key);
+                } else {
+                  seenValues[value] = key;
+                }
+              }
+            }
+            for (const key of keysToRemove) {
+              delete attributesToInclude[key];
+            }
+          }
+          if (attributesToInclude.role === node.tagName) {
+            delete attributesToInclude.role;
+          }
+          const attrsToRemoveIfTextMatches = ["aria-label", "placeholder", "title"];
+          for (const attr of attrsToRemoveIfTextMatches) {
+            if (attributesToInclude[attr] && attributesToInclude[attr].toLowerCase().trim() === text.toLowerCase().trim()) {
+              delete attributesToInclude[attr];
+            }
+          }
+          if (Object.keys(attributesToInclude).length > 0) {
+            attributesHtmlStr = Object.entries(attributesToInclude).map(([key, value]) => `${key}=${capTextLength(value, 20)}`).join(" ");
+          }
+        }
+        const highlightIndicator = node.isNew ? `*[${node.highlightIndex}]` : `[${node.highlightIndex}]`;
+        let line = `${depthStr}${highlightIndicator}<${node.tagName ?? ""}`;
+        if (attributesHtmlStr) {
+          line += ` ${attributesHtmlStr}`;
+        }
+        if (node.extra) {
+          if (node.extra.scrollable) {
+            let scrollDataText = "";
+            if (node.extra.scrollData?.left)
+              scrollDataText += `left=${node.extra.scrollData.left}, `;
+            if (node.extra.scrollData?.top) scrollDataText += `top=${node.extra.scrollData.top}, `;
+            if (node.extra.scrollData?.right)
+              scrollDataText += `right=${node.extra.scrollData.right}, `;
+            if (node.extra.scrollData?.bottom)
+              scrollDataText += `bottom=${node.extra.scrollData.bottom}`;
+            line += ` data-scrollable="${scrollDataText}"`;
+          }
+        }
+        if (text) {
+          const trimmedText = text.trim();
+          if (!attributesHtmlStr) {
+            line += " ";
+          }
+          line += `>${trimmedText}`;
+        } else if (!attributesHtmlStr) {
+          line += " ";
+        }
+        line += " />";
+        result22.push(line);
+      }
+      const emitSemantic = isSemantic && node.highlightIndex === void 0;
+      const mark = emitSemantic ? result22.length : -1;
+      if (emitSemantic) {
+        result22.push(`${depthStr}<${node.tagName}>`);
+        nextDepth += 1;
+      }
+      for (const child of node.children) {
+        processNode(child, nextDepth, result22);
+      }
+      if (emitSemantic) {
+        if (result22.length === mark + 1) {
+          result22.pop();
+        } else {
+          result22.push(`${depthStr}</${node.tagName}>`);
+        }
+      }
+    } else if (node.type === "text") {
+      if (hasParentWithHighlightIndex(node)) {
+        return;
+      }
+      if (node.parent && node.parent.type === "element" && node.parent.isVisible && node.parent.isTopElement) {
+        result22.push(`${depthStr}${node.text ?? ""}`);
+      }
+    }
+  };
+  const result2 = [];
+  processNode(rootNode, 0, result2);
+  return result2.join("\n");
+}
+const getAllTextTillNextClickableElement = (node, maxDepth = -1) => {
+  const textParts = [];
+  const collectText = (currentNode, currentDepth) => {
+    if (maxDepth !== -1 && currentDepth > maxDepth) {
+      return;
+    }
+    if (currentNode.type === "element" && currentNode !== node && currentNode.highlightIndex !== void 0) {
+      return;
+    }
+    if (currentNode.type === "text" && currentNode.text) {
+      textParts.push(currentNode.text);
+    } else if (currentNode.type === "element") {
+      for (const child of currentNode.children) {
+        collectText(child, currentDepth + 1);
+      }
+    }
+  };
+  collectText(node, 0);
+  return textParts.join("\n").trim();
+};
+function getSelectorMap(flatTree) {
+  const selectorMap = /* @__PURE__ */ new Map();
+  const keys = Object.keys(flatTree.map);
+  for (const key of keys) {
+    const node = flatTree.map[key];
+    if (node.isInteractive && typeof node.highlightIndex === "number") {
+      selectorMap.set(node.highlightIndex, node);
+    }
+  }
+  return selectorMap;
+}
+function getElementTextMap(simplifiedHTML) {
+  const lines = simplifiedHTML.split("\n").map((line) => line.trim()).filter((line) => line.length > 0);
+  const elementTextMap = /* @__PURE__ */ new Map();
+  for (const line of lines) {
+    const regex = /^\[(\d+)\]<[^>]+>([^<]*)/;
+    const match = regex.exec(line);
+    if (match) {
+      const index = parseInt(match[1], 10);
+      elementTextMap.set(index, line);
+    }
+  }
+  return elementTextMap;
+}
+function cleanUpHighlights() {
+  const cleanupFunctions = window._highlightCleanupFunctions || [];
+  for (const cleanup of cleanupFunctions) {
+    if (typeof cleanup === "function") {
+      cleanup();
+    }
+  }
+  window._highlightCleanupFunctions = [];
+}
+window.addEventListener("popstate", () => {
+  cleanUpHighlights();
+});
+window.addEventListener("hashchange", () => {
+  cleanUpHighlights();
+});
+window.addEventListener("beforeunload", () => {
+  cleanUpHighlights();
+});
+const navigation = window.navigation;
+if (navigation && typeof navigation.addEventListener === "function") {
+  navigation.addEventListener("navigate", () => {
+    cleanUpHighlights();
+  });
+} else {
+  let currentUrl = window.location.href;
+  setInterval(() => {
+    if (window.location.href !== currentUrl) {
+      currentUrl = window.location.href;
+      cleanUpHighlights();
+    }
+  }, 500);
+}
+function getPageInfo() {
+  const viewport_width = window.innerWidth;
+  const viewport_height = window.innerHeight;
+  const page_width = Math.max(document.documentElement.scrollWidth, document.body.scrollWidth || 0);
+  const page_height = Math.max(
+    document.documentElement.scrollHeight,
+    document.body.scrollHeight || 0
+  );
+  const scroll_x = window.scrollX || window.pageXOffset || document.documentElement.scrollLeft || 0;
+  const scroll_y = window.scrollY || window.pageYOffset || document.documentElement.scrollTop || 0;
+  const pixels_below = Math.max(0, page_height - (window.innerHeight + scroll_y));
+  const pixels_right = Math.max(0, page_width - (window.innerWidth + scroll_x));
+  return {
+    // Current viewport dimensions
+    viewport_width,
+    viewport_height,
+    // Total page dimensions
+    page_width,
+    page_height,
+    // Current scroll position
+    scroll_x,
+    scroll_y,
+    pixels_above: scroll_y,
+    pixels_below,
+    pages_above: viewport_height > 0 ? scroll_y / viewport_height : 0,
+    pages_below: viewport_height > 0 ? pixels_below / viewport_height : 0,
+    total_pages: viewport_height > 0 ? page_height / viewport_height : 0,
+    current_page_position: scroll_y / Math.max(1, page_height - viewport_height),
+    pixels_left: scroll_x,
+    pixels_right
+  };
+}
+function patchReact(pageController) {
+  const reactRootElements = document.querySelectorAll(
+    '[data-reactroot], [data-reactid], [data-react-checksum], #root, #app, [id^="root-"], [id^="app-"], #adex-wrapper, #adex-root'
+  );
+  for (const element of reactRootElements) {
+    element.setAttribute("data-page-agent-not-interactive", "true");
+  }
+}
+class PageController extends EventTarget {
+  config;
+  /** Corresponds to eval_page in browser-use */
+  flatTree = null;
+  /**
+   * All highlighted index-mapped interactive elements
+   * Corresponds to DOMState.selector_map in browser-use
+   */
+  selectorMap = /* @__PURE__ */ new Map();
+  /** Index -> element text description mapping */
+  elementTextMap = /* @__PURE__ */ new Map();
+  /**
+   * Simplified HTML for LLM consumption.
+   * Corresponds to clickable_elements_to_string in browser-use
+   */
+  simplifiedHTML = "<EMPTY>";
+  /** last time the tree was updated */
+  lastTimeUpdate = 0;
+  /** Whether the tree has been indexed at least once */
+  isIndexed = false;
+  /** Visual mask overlay for blocking user interaction during automation */
+  mask = null;
+  maskReady = null;
+  constructor(config = {}) {
+    super();
+    this.config = config;
+    patchReact();
+    if (config.enableMask) this.initMask();
+  }
+  /**
+   * FORK: expõe, somente leitura, a árvore achatada da última `updateTree()`.
+   * O perfilador da página precisa descrever os mesmos elementos que o agente vê, e `flatTree`
+   * é privado (o pacote nem exporta o namespace `dom`). O campo continua privado: quem lê
+   * não pode substituir a árvore do agente. Ver vendor/UPSTREAM.md.
+   */
+  readFlatTree() {
+    return this.flatTree;
+  }
+  /**
+   * FORK: expõe, somente leitura, o mapa índice -> elemento interativo da última `updateTree()`.
+   * Mesmo motivo de `readFlatTree()`; o tipo `ReadonlyMap` impede `set`/`delete` por quem lê.
+   */
+  readSelectorMap() {
+    return this.selectorMap;
+  }
+  /**
+   * Initialize mask asynchronously (dynamic import to avoid CSS loading in Node)
+   */
+  initMask() {
+    if (this.maskReady !== null) return;
+    this.maskReady = (async () => {
+      const { SimulatorMask } = await import("./SimulatorMask-DIoKZt1z.js");
+      this.mask = new SimulatorMask();
+    })();
+  }
+  // ======= State Queries =======
+  /**
+   * Get current page URL
+   */
+  async getCurrentUrl() {
+    return window.location.href;
+  }
+  /**
+   * Get last tree update timestamp
+   */
+  async getLastUpdateTime() {
+    return this.lastTimeUpdate;
+  }
+  /**
+   * Get structured browser state for LLM consumption.
+   * Automatically calls updateTree() to refresh the DOM state.
+   */
+  async getBrowserState() {
+    const url = window.location.href;
+    const title = document.title;
+    const pi = getPageInfo();
+    const viewportExpansion = resolveViewportExpansion(this.config.viewportExpansion);
+    await this.updateTree();
+    const content = this.simplifiedHTML;
+    const titleLine = `Current Page: [${title}](${url})`;
+    const pageInfoLine = `Page info: ${pi.viewport_width}x${pi.viewport_height}px viewport, ${pi.page_width}x${pi.page_height}px total page size, ${pi.pages_above.toFixed(1)} pages above, ${pi.pages_below.toFixed(1)} pages below, ${pi.total_pages.toFixed(1)} total pages, at ${(pi.current_page_position * 100).toFixed(0)}% of page`;
+    const elementsLabel = viewportExpansion === -1 ? "Interactive elements from top layer of the current page (full page):" : "Interactive elements from top layer of the current page inside the viewport:";
+    const hasContentAbove = pi.pixels_above > 4;
+    const scrollHintAbove = hasContentAbove && viewportExpansion !== -1 ? `... ${pi.pixels_above} pixels above (${pi.pages_above.toFixed(1)} pages) - scroll to see more ...` : "[Start of page]";
+    const header2 = `${titleLine}
+${pageInfoLine}
+
+${elementsLabel}
+
+${scrollHintAbove}`;
+    const hasContentBelow = pi.pixels_below > 4;
+    const footer = hasContentBelow && viewportExpansion !== -1 ? `... ${pi.pixels_below} pixels below (${pi.pages_below.toFixed(1)} pages) - scroll to see more ...` : "[End of page]";
+    return { url, title, header: header2, content, footer };
+  }
+  // ======= DOM Tree Operations =======
+  /**
+   * Update DOM tree, returns simplified HTML for LLM.
+   * This is the main method to refresh the page state.
+   * Automatically bypasses mask during DOM extraction if enabled.
+   */
+  async updateTree() {
+    this.dispatchEvent(new Event("beforeUpdate"));
+    this.lastTimeUpdate = Date.now();
+    if (this.mask) {
+      this.mask.wrapper.style.pointerEvents = "none";
+    }
+    cleanUpHighlights();
+    const blacklist = [
+      ...this.config.interactiveBlacklist || [],
+      ...Array.from(document.querySelectorAll("[data-page-agent-not-interactive]"))
+    ];
+    this.flatTree = getFlatTree({
+      ...this.config,
+      interactiveBlacklist: blacklist
+    });
+    this.simplifiedHTML = flatTreeToString(
+      this.flatTree,
+      this.config.includeAttributes,
+      this.config.keepSemanticTags
+    );
+    this.selectorMap.clear();
+    this.selectorMap = getSelectorMap(this.flatTree);
+    this.elementTextMap.clear();
+    this.elementTextMap = getElementTextMap(this.simplifiedHTML);
+    this.isIndexed = true;
+    if (this.mask) {
+      this.mask.wrapper.style.pointerEvents = "auto";
+    }
+    this.dispatchEvent(new Event("afterUpdate"));
+    return this.simplifiedHTML;
+  }
+  /**
+   * Clean up all element highlights
+   */
+  async cleanUpHighlights() {
+    console.log("[PageController] cleanUpHighlights");
+    cleanUpHighlights();
+  }
+  // ======= Element Actions =======
+  /**
+   * Ensure the tree has been indexed before any index-based operation.
+   * Throws if updateTree() hasn't been called yet.
+   */
+  assertIndexed() {
+    if (!this.isIndexed) {
+      throw new Error("DOM tree not indexed yet. Can not perform actions on elements.");
+    }
+  }
+  /**
+   * Click element by index
+   */
+  async clickElement(index) {
+    try {
+      this.assertIndexed();
+      const element = getElementByIndex(this.selectorMap, index);
+      const elemText = this.elementTextMap.get(index);
+      await clickElement(element);
+      if (isAnchorElement(element) && element.target === "_blank") {
+        return {
+          success: true,
+          message: `OK: elemento (${elemText ?? index}) clicado. ATENÇÃO: o link abriu em uma nova aba.`
+        };
+      }
+      return {
+        success: true,
+        message: `OK: elemento (${elemText ?? index}) clicado.`
+      };
+    } catch (error2) {
+      return {
+        success: false,
+        message: `ERRO: não foi possível clicar no elemento: ${error2}`
+      };
+    }
+  }
+  /**
+   * Input text into element by index
+   */
+  async inputText(index, text) {
+    try {
+      this.assertIndexed();
+      const element = getElementByIndex(this.selectorMap, index);
+      const elemText = this.elementTextMap.get(index);
+      await inputTextElement(element, text);
+      return {
+        success: true,
+        message: `OK: texto (${text}) digitado no elemento (${elemText ?? index}).`
+      };
+    } catch (error2) {
+      return {
+        success: false,
+        message: `ERRO: não foi possível digitar o texto: ${error2}`
+      };
+    }
+  }
+  /**
+   * Select dropdown option by index and option text
+   */
+  async selectOption(index, optionText) {
+    try {
+      this.assertIndexed();
+      const element = getElementByIndex(this.selectorMap, index);
+      const elemText = this.elementTextMap.get(index);
+      await selectOptionElement(element, optionText);
+      return {
+        success: true,
+        message: `OK: opção (${optionText}) escolhida no elemento (${elemText ?? index}).`
+      };
+    } catch (error2) {
+      return {
+        success: false,
+        message: `ERRO: não foi possível escolher a opção: ${error2}`
+      };
+    }
+  }
+  /**
+   * Scroll vertically
+   */
+  async scroll(options) {
+    try {
+      const { down, numPages, pixels, index } = options;
+      this.assertIndexed();
+      const scrollAmount = (pixels ?? numPages * window.innerHeight) * (down ? 1 : -1);
+      const element = index !== void 0 ? getElementByIndex(this.selectorMap, index) : null;
+      const message = await scrollVertically(scrollAmount, element);
+      return {
+        success: true,
+        message
+      };
+    } catch (error2) {
+      return {
+        success: false,
+        message: `ERRO: não foi possível rolar a página: ${error2}`
+      };
+    }
+  }
+  /**
+   * Scroll horizontally
+   */
+  async scrollHorizontally(options) {
+    try {
+      const { right, pixels, index } = options;
+      this.assertIndexed();
+      const scrollAmount = pixels * (right ? 1 : -1);
+      const element = index !== void 0 ? getElementByIndex(this.selectorMap, index) : null;
+      const message = await scrollHorizontally(scrollAmount, element);
+      return {
+        success: true,
+        message
+      };
+    } catch (error2) {
+      return {
+        success: false,
+        message: `ERRO: não foi possível rolar na horizontal: ${error2}`
+      };
+    }
+  }
+  /**
+   * Execute arbitrary JavaScript on the page.
+   * The optional `signal` is exposed to the script scope so cooperative code
+   * can abort promptly when the task is stopped.
+   */
+  async executeJavascript(script, signal) {
+    try {
+      const asyncFunction = eval(`(async (signal) => { ${script} })`);
+      const result = await asyncFunction(signal);
+      return {
+        success: true,
+        message: `OK: JavaScript executado. Resultado: ${result}`
+      };
+    } catch (error2) {
+      return {
+        success: false,
+        message: `ERRO: falha ao executar JavaScript: ${error2}`
+      };
+    }
+  }
+  // ======= Mask Operations =======
+  /**
+   * Show the visual mask overlay.
+   * Only works after mask is setup.
+   */
+  async showMask() {
+    await this.maskReady;
+    this.mask?.show();
+  }
+  /**
+   * Hide the visual mask overlay.
+   * Only works after mask is setup.
+   */
+  async hideMask() {
+    await this.maskReady;
+    this.mask?.hide();
+  }
+  /**
+   * Dispose and clean up resources
+   */
+  dispose() {
+    cleanUpHighlights();
+    this.flatTree = null;
+    this.selectorMap.clear();
+    this.elementTextMap.clear();
+    this.simplifiedHTML = "<EMPTY>";
+    this.isIndexed = false;
+    this.mask?.dispose();
+    this.mask = null;
+  }
+}
+const enUS = {
+  ui: {
+    panel: {
+      ready: "Ready",
+      thinking: "Thinking...",
+      taskInput: "Enter new task, describe steps in detail, press Enter to submit",
+      userAnswerPrompt: "Please answer the question above, press Enter to submit",
+      taskTerminated: "Task terminated",
+      taskCompleted: "Task completed",
+      userAnswer: "User answer: {{input}}",
+      question: "Question: {{question}}",
+      waitingPlaceholder: "Waiting for task to start...",
+      stop: "Stop",
+      close: "Close",
+      expand: "Expand history",
+      collapse: "Collapse history",
+      step: "Step {{number}}",
+      // FORK: textos que estavam cravados em inglês dentro do Panel.ts.
+      userTakeover: "User takeover",
+      retrying: "Retrying",
+      errorLabel: "Error",
+      reflectionEvaluation: "Assessment",
+      reflectionMemory: "Memory",
+      reflectionNextGoal: "Next goal",
+      // FORK: nome de quem fala em cada mensagem, e rótulos das regiões.
+      authorPerson: "You",
+      authorAgent: "Agent",
+      authorReasoning: "Reasoning",
+      authorAction: "Action",
+      authorResult: "Result",
+      authorPage: "Page",
+      authorSystem: "System",
+      historyLabel: "Agent activity history",
+      panelLabel: "Agent panel"
+    },
+    tools: {
+      clicking: "Clicking element [{{index}}]...",
+      inputting: "Inputting text to element [{{index}}]...",
+      selecting: 'Selecting option "{{text}}"...',
+      scrolling: "Scrolling page...",
+      waiting: "Waiting {{seconds}} seconds...",
+      askingUser: "Asking user...",
+      done: "Task done",
+      clicked: "Clicked element [{{index}}]",
+      inputted: 'Inputted text "{{text}}"',
+      selected: 'Selected option "{{text}}"',
+      scrolled: "Page scrolled",
+      waited: "Wait completed",
+      executing: "Executing {{toolName}}...",
+      resultSuccess: "success",
+      resultFailure: "failed",
+      resultError: "error"
+    },
+    errors: {
+      elementNotFound: "No interactive element found at index {{index}}",
+      taskRequired: "Task description is required",
+      executionFailed: "Task execution failed",
+      notInputElement: "Element is not an input or textarea",
+      notSelectElement: "Element is not a select element",
+      optionNotFound: 'Option "{{text}}" not found'
+    }
+  }
+};
+const ptBR = {
+  ui: {
+    panel: {
+      ready: "Pronto",
+      thinking: "Pensando...",
+      taskInput: "Descreva a próxima tarefa com os passos em detalhe e tecle Enter",
+      userAnswerPrompt: "Responda à pergunta acima e tecle Enter",
+      taskTerminated: "Tarefa interrompida",
+      taskCompleted: "Tarefa concluída",
+      userAnswer: "Resposta: {{input}}",
+      question: "Pergunta: {{question}}",
+      waitingPlaceholder: "Aguardando o início da tarefa...",
+      stop: "Parar",
+      close: "Fechar",
+      expand: "Abrir histórico",
+      collapse: "Fechar histórico",
+      step: "Passo {{number}}",
+      userTakeover: "A pessoa assumiu o controle",
+      retrying: "Tentando de novo",
+      errorLabel: "Erro",
+      reflectionEvaluation: "Avaliação",
+      reflectionMemory: "Memória",
+      reflectionNextGoal: "Próximo passo",
+      authorPerson: "Você",
+      authorAgent: "Agente",
+      authorReasoning: "Raciocínio",
+      authorAction: "Ação",
+      authorResult: "Resultado",
+      authorPage: "Página",
+      authorSystem: "Sistema",
+      historyLabel: "Histórico de atividade do agente",
+      panelLabel: "Painel do agente"
+    },
+    tools: {
+      clicking: "Clicando no elemento [{{index}}]...",
+      inputting: "Digitando no elemento [{{index}}]...",
+      selecting: 'Escolhendo a opção "{{text}}"...',
+      scrolling: "Rolando a página...",
+      waiting: "Aguardando {{seconds}} segundos...",
+      askingUser: "Perguntando à pessoa...",
+      done: "Tarefa encerrada",
+      clicked: "Elemento [{{index}}] clicado",
+      inputted: 'Texto "{{text}}" digitado',
+      selected: 'Opção "{{text}}" escolhida',
+      scrolled: "Página rolada",
+      waited: "Espera concluída",
+      executing: "Executando {{toolName}}...",
+      resultSuccess: "sucesso",
+      resultFailure: "falha",
+      resultError: "erro"
+    },
+    errors: {
+      elementNotFound: "Nenhum elemento interativo no índice {{index}}",
+      taskRequired: "A descrição da tarefa é obrigatória",
+      executionFailed: "A execução da tarefa falhou",
+      notInputElement: "O elemento não é um campo de texto",
+      notSelectElement: "O elemento não é uma lista de seleção",
+      optionNotFound: 'Opção "{{text}}" não encontrada'
+    }
+  }
+};
+const locales = {
+  "en-US": enUS,
+  "pt-BR": ptBR
+};
+class I18n {
+  language;
+  translations;
+  /**
+   * FORK: aceita qualquer identificador de língua, porque o corpo já trata o caso desconhecido
+   * caindo em 'en-US'. O tipo estreito contradizia essa checagem: ou ela era morta, ou o tipo
+   * mentia. O núcleo conhece línguas que o painel ainda não traduz, e isso é normal.
+   */
+  constructor(language = "en-US") {
+    this.language = language in locales ? language : "en-US";
+    this.translations = locales[this.language];
+  }
+  // 类型安全的翻译方法
+  t(key, params) {
+    const value = this.getNestedValue(this.translations, key);
+    if (!value) {
+      console.warn(`Translation key "${key}" not found for language "${this.language}"`);
+      return key;
+    }
+    if (params) {
+      return this.interpolate(value, params);
+    }
+    return value;
+  }
+  getNestedValue(obj, path) {
+    return path.split(".").reduce((current, key) => current?.[key], obj);
+  }
+  interpolate(template, params) {
+    return template.replace(/\{\{(\w+)\}\}/g, (match, key) => {
+      return params[key] != null ? params[key].toString() : match;
+    });
+  }
+  getLanguage() {
+    return this.language;
+  }
+}
+function truncate(text, maxLength) {
+  if (text.length > maxLength) {
+    return text.substring(0, maxLength) + "...";
+  }
+  return text;
+}
+function escapeHtml(text) {
+  return text.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#039;");
+}
+const wrapper = "_wrapper_1rq3n_1";
+const background = "_background_1rq3n_55";
+const header = "_header_1rq3n_115";
+const pulse = "_pulse_1rq3n_1";
+const retryPulse = "_retryPulse_1rq3n_1";
+const statusTextFadeOut = "_statusTextFadeOut_1rq3n_1";
+const statusTextFadeIn = "_statusTextFadeIn_1rq3n_1";
+const statusSection = "_statusSection_1rq3n_137";
+const indicator = "_indicator_1rq3n_144";
+const thinking = "_thinking_1rq3n_153";
+const tool_executing = "_tool_executing_1rq3n_158";
+const retry = "_retry_1rq3n_163";
+const completed = "_completed_1rq3n_169";
+const input = "_input_1rq3n_170";
+const output = "_output_1rq3n_171";
+const error = "_error_1rq3n_176";
+const statusText = "_statusText_1rq3n_182";
+const fadeOut = "_fadeOut_1rq3n_194";
+const fadeIn = "_fadeIn_1rq3n_198";
+const controls = "_controls_1rq3n_204";
+const controlButton = "_controlButton_1rq3n_209";
+const stopButton = "_stopButton_1rq3n_228";
+const historySectionWrapper = "_historySectionWrapper_1rq3n_262";
+const expanded = "_expanded_1rq3n_294";
+const historySection = "_historySection_1rq3n_262";
+const historyRow = "_historyRow_1rq3n_320";
+const fromPessoa = "_fromPessoa_1rq3n_328";
+const fromAgente = "_fromAgente_1rq3n_332";
+const fromSistema = "_fromSistema_1rq3n_333";
+const historyItem = "_historyItem_1rq3n_338";
+const observation = "_observation_1rq3n_374";
+const question = "_question_1rq3n_378";
+const doneSuccess = "_doneSuccess_1rq3n_382";
+const doneFailure = "_doneFailure_1rq3n_390";
+const historyHeader = "_historyHeader_1rq3n_402";
+const historyAuthor = "_historyAuthor_1rq3n_410";
+const historyMeta = "_historyMeta_1rq3n_416";
+const statusIcon = "_statusIcon_1rq3n_426";
+const historyContent = "_historyContent_1rq3n_439";
+const reflectionLine = "_reflectionLine_1rq3n_446";
+const reflectionLines = "_reflectionLines_1rq3n_451";
+const reflectionLabel = "_reflectionLabel_1rq3n_462";
+const inputSectionWrapper = "_inputSectionWrapper_1rq3n_544";
+const hidden = "_hidden_1rq3n_567";
+const inputSection = "_inputSection_1rq3n_544";
+const taskInput = "_taskInput_1rq3n_578";
+const celebrate = "_celebrate_1rq3n_1";
+const shimmer = "_shimmer_1rq3n_1";
+const styles = {
+  wrapper,
+  "mask-running": "_mask-running_1rq3n_1",
+  background,
+  header,
+  pulse,
+  retryPulse,
+  statusTextFadeOut,
+  statusTextFadeIn,
+  statusSection,
+  indicator,
+  thinking,
+  tool_executing,
+  retry,
+  completed,
+  input,
+  output,
+  error,
+  statusText,
+  fadeOut,
+  fadeIn,
+  controls,
+  controlButton,
+  stopButton,
+  historySectionWrapper,
+  expanded,
+  historySection,
+  historyRow,
+  fromPessoa,
+  fromAgente,
+  fromSistema,
+  historyItem,
+  observation,
+  question,
+  doneSuccess,
+  doneFailure,
+  historyHeader,
+  historyAuthor,
+  historyMeta,
+  statusIcon,
+  historyContent,
+  reflectionLine,
+  reflectionLines,
+  reflectionLabel,
+  inputSectionWrapper,
+  hidden,
+  inputSection,
+  taskInput,
+  celebrate,
+  shimmer
+};
+function createCard({ icon, content, meta, type, from = "agente", author }) {
+  const typeClass = type ? styles[type] : "";
+  const fromClass = from === "pessoa" ? styles.fromPessoa : from === "sistema" ? styles.fromSistema : styles.fromAgente;
+  const contentHtml = Array.isArray(content) ? `<div class="${styles.reflectionLines}">${content.map(
+    (line) => `<span class="${styles.reflectionLine}"><span class="${styles.reflectionLabel}">${escapeHtml(line.label)}</span>${escapeHtml(line.text)}</span>`
+  ).join("")}</div>` : `<span>${escapeHtml(content)}</span>`;
+  const cabecalho = `
+			<div class="${styles.historyHeader}">
+				<span class="${styles.statusIcon}">${icon}</span>
+				<span class="${styles.historyAuthor}" data-autor="${from}">${escapeHtml(author || "")}</span>
+				${meta ? `<span class="${styles.historyMeta}">${escapeHtml(meta)}</span>` : ""}
+			</div>`;
+  return `
+		<div class="${styles.historyRow} ${fromClass}">
+			<div class="${styles.historyItem} ${typeClass}" data-mensagem="${from}">
+				${cabecalho}
+				<div class="${styles.historyContent}" data-conteudo>${contentHtml}</div>
+			</div>
+		</div>
+	`;
+}
+function createReflectionLines(reflection, labels) {
+  const lines = [];
+  if (reflection.evaluation_previous_goal) {
+    lines.push({ label: labels.evaluation, text: reflection.evaluation_previous_goal });
+  }
+  if (reflection.memory) {
+    lines.push({ label: labels.memory, text: reflection.memory });
+  }
+  if (reflection.next_goal) {
+    lines.push({ label: labels.nextGoal, text: reflection.next_goal });
+  }
+  return lines;
+}
+const svg = (paths) => `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false">${paths}</svg>`;
+const iconTask = svg('<circle cx="12" cy="12" r="9"/><circle cx="12" cy="12" r="4"/><path d="M12 3v2M12 19v2M3 12h2M19 12h2"/>');
+const iconThinking = svg('<path d="M12 3l1.8 4.2L18 9l-4.2 1.8L12 15l-1.8-4.2L6 9l4.2-1.8z"/><path d="M18 15l.9 2.1L21 18l-2.1.9L18 21l-.9-2.1L15 18l2.1-.9z"/>');
+const iconObservation = svg('<path d="M2 12s3.5-6 10-6 10 6 10 6-3.5 6-10 6-10-6-10-6z"/><circle cx="12" cy="12" r="2.5"/>');
+const iconUser = svg('<circle cx="12" cy="8" r="3.5"/><path d="M5 20c0-3.3 3.1-5.5 7-5.5s7 2.2 7 5.5"/>');
+const iconRetry = svg('<path d="M20 11a8 8 0 1 0-2.3 6.3"/><path d="M20 5v6h-6"/>');
+const iconError = svg('<circle cx="12" cy="12" r="9"/><path d="M12 7.5v5"/><path d="M12 16.2h.01"/>');
+const iconDone = svg('<circle cx="12" cy="12" r="9"/><path d="M8.2 12.3l2.6 2.6 5-5.2"/>');
+const iconQuestion = svg('<circle cx="12" cy="12" r="9"/><path d="M9.6 9.4a2.5 2.5 0 1 1 3.3 2.4c-.6.2-.9.8-.9 1.4v.3"/><path d="M12 16.6h.01"/>');
+const iconAnswer = svg('<path d="M20 14.5a2.5 2.5 0 0 1-2.5 2.5H9l-5 3.5V6.5A2.5 2.5 0 0 1 6.5 4h11A2.5 2.5 0 0 1 20 6.5z"/>');
+const iconTool = svg('<path d="M5 7.5l3.5 3.5L5 14.5"/><path d="M11.5 15.5H19"/><rect x="2.5" y="3.5" width="19" height="17" rx="2.5"/>');
+class Panel {
+  #wrapper;
+  #indicator;
+  #statusText;
+  #historySection;
+  #expandButton;
+  #actionButton;
+  #inputSection;
+  #taskInput;
+  #agent;
+  #config;
+  #isExpanded = false;
+  #i18n;
+  #userAnswerResolver = null;
+  #isWaitingForUserAnswer = false;
+  #headerUpdateTimer = null;
+  #pendingHeaderText = null;
+  #isAnimating = false;
+  // Event handlers (bound for removal)
+  #onStatusChange = () => this.#handleStatusChange();
+  #onHistoryChange = () => this.#handleHistoryChange();
+  #onActivity = (e) => this.#handleActivity(e.detail);
+  #onAgentDispose = () => this.dispose();
+  get wrapper() {
+    return this.#wrapper;
+  }
+  /**
+   * Create a Panel bound to an agent
+   * @param agent - Agent instance that implements PanelAgentAdapter
+   * @param config - Optional panel configuration
+   */
+  constructor(agent, config = {}) {
+    this.#agent = agent;
+    this.#config = config;
+    this.#i18n = new I18n(config.language ?? "en-US");
+    this.#agent.onAskUser = (question2, options) => this.#askUser(question2, options?.signal);
+    this.#wrapper = this.#createWrapper();
+    this.#indicator = this.#wrapper.querySelector(`.${styles.indicator}`);
+    this.#statusText = this.#wrapper.querySelector(`.${styles.statusText}`);
+    this.#historySection = this.#wrapper.querySelector(`.${styles.historySection}`);
+    this.#expandButton = this.#wrapper.querySelector(`.${styles.expandButton}`);
+    this.#actionButton = this.#wrapper.querySelector(`.${styles.stopButton}`);
+    this.#inputSection = this.#wrapper.querySelector(`.${styles.inputSectionWrapper}`);
+    this.#taskInput = this.#wrapper.querySelector(`.${styles.taskInput}`);
+    this.#agent.addEventListener("statuschange", this.#onStatusChange);
+    this.#agent.addEventListener("historychange", this.#onHistoryChange);
+    this.#agent.addEventListener("activity", this.#onActivity);
+    this.#agent.addEventListener("dispose", this.#onAgentDispose);
+    this.#setupEventListeners();
+    this.#startHeaderUpdateLoop();
+    this.#showInputArea();
+    this.hide();
+  }
+  // ========== Agent event handlers ==========
+  /** Handle agent status change */
+  #handleStatusChange() {
+    const status = this.#agent.status;
+    const failed = status === "completed" && this.#agent.lastResult?.success === false;
+    this.#updateStatusIndicator(failed ? "error" : status);
+    if (status === "running") {
+      this.#actionButton.textContent = "■";
+      this.#actionButton.title = this.#i18n.t("ui.panel.stop");
+    } else {
+      this.#actionButton.textContent = "X";
+      this.#actionButton.title = this.#i18n.t("ui.panel.close");
+    }
+    if (status === "running") {
+      this.show();
+      this.#hideInputArea();
+    }
+    if (status === "completed" || status === "error" || status === "stopped") {
+      if (!this.#isExpanded) {
+        this.#expand();
+      }
+      if (this.#shouldShowInputArea()) {
+        this.#showInputArea();
+      }
+    }
+  }
+  /** Handle agent history change - re-render history list from agent.history */
+  #handleHistoryChange() {
+    this.#renderHistory();
+  }
+  /**
+   * Handle agent activity - transient state for immediate UI feedback
+   * Activity events are NOT persisted in history, only used for header bar updates
+   */
+  #handleActivity(activity) {
+    switch (activity.type) {
+      case "thinking":
+        this.#pendingHeaderText = this.#i18n.t("ui.panel.thinking");
+        this.#updateStatusIndicator("thinking");
+        break;
+      case "executing":
+        this.#pendingHeaderText = this.#getToolExecutingText(activity.tool, activity.input);
+        this.#updateStatusIndicator("executing");
+        break;
+      case "executed":
+        this.#pendingHeaderText = truncate(activity.output, 50);
+        break;
+      case "retrying":
+        this.#pendingHeaderText = `Retrying (${activity.attempt}/${activity.maxAttempts})`;
+        this.#updateStatusIndicator("retrying");
+        break;
+      case "error":
+        this.#pendingHeaderText = truncate(activity.message, 50);
+        this.#updateStatusIndicator("error");
+        break;
+    }
+  }
+  /**
+   * Ask for user input (internal, called by agent via onAskUser).
+   * Rejects when `signal` aborts (task stopped or disposed), cleaning up the
+   * question card and pending state so the agent loop can settle.
+   */
+  #askUser(question2, signal2) {
+    return new Promise((resolve, reject) => {
+      this.#isWaitingForUserAnswer = true;
+      this.#userAnswerResolver = resolve;
+      if (!this.#isExpanded) {
+        this.#expand();
+      }
+      const tempCard = document.createElement("div");
+      tempCard.innerHTML = createCard({
+        icon: iconQuestion,
+        content: this.#i18n.t("ui.panel.question", { question: question2 }),
+        type: "question",
+        author: this.#i18n.t("ui.panel.authorAgent")
+      });
+      const cardElement = tempCard.firstElementChild;
+      cardElement.setAttribute("data-temp-card", "true");
+      this.#historySection.appendChild(cardElement);
+      this.#scrollToBottom();
+      this.#showInputArea(this.#i18n.t("ui.panel.userAnswerPrompt"));
+      signal2?.addEventListener(
+        "abort",
+        () => {
+          this.#removeTempCards();
+          this.#isWaitingForUserAnswer = false;
+          this.#userAnswerResolver = null;
+          reject(signal2.reason);
+        },
+        { once: true }
+      );
+    });
+  }
+  /** Remove temporary question cards (only direct children for safety) */
+  #removeTempCards() {
+    Array.from(this.#historySection.children).forEach((child) => {
+      if (child.getAttribute("data-temp-card") === "true") {
+        child.remove();
+      }
+    });
+  }
+  // ========== Public control methods ==========
+  show() {
+    this.wrapper.style.display = "block";
+    this.wrapper.getBoundingClientRect();
+    this.wrapper.style.opacity = "1";
+    this.wrapper.style.transform = "translateX(-50%) translateY(0)";
+  }
+  hide() {
+    this.wrapper.style.opacity = "0";
+    this.wrapper.style.transform = "translateX(-50%) translateY(20px)";
+    this.wrapper.style.display = "none";
+  }
+  reset() {
+    this.#statusText.textContent = this.#i18n.t("ui.panel.ready");
+    this.#updateStatusIndicator("thinking");
+    this.#renderHistory();
+    this.#collapse();
+    this.#isWaitingForUserAnswer = false;
+    this.#userAnswerResolver = null;
+    this.#showInputArea();
+  }
+  expand() {
+    this.#expand();
+  }
+  collapse() {
+    this.#collapse();
+  }
+  /**
+   * Dispose panel and clean up event listeners
+   */
+  dispose() {
+    this.#agent.removeEventListener("statuschange", this.#onStatusChange);
+    this.#agent.removeEventListener("historychange", this.#onHistoryChange);
+    this.#agent.removeEventListener("activity", this.#onActivity);
+    this.#agent.removeEventListener("dispose", this.#onAgentDispose);
+    this.#isWaitingForUserAnswer = false;
+    this.#stopHeaderUpdateLoop();
+    this.wrapper.remove();
+  }
+  // ========== Private methods ==========
+  #getToolExecutingText(toolName, args) {
+    const a = args;
+    switch (toolName) {
+      case "click_element_by_index":
+        return this.#i18n.t("ui.tools.clicking", { index: a.index });
+      case "input_text":
+        return this.#i18n.t("ui.tools.inputting", { index: a.index });
+      case "select_dropdown_option":
+        return this.#i18n.t("ui.tools.selecting", { text: a.text });
+      case "scroll":
+        return this.#i18n.t("ui.tools.scrolling");
+      case "wait":
+        return this.#i18n.t("ui.tools.waiting", { seconds: a.seconds });
+      case "ask_user":
+        return this.#i18n.t("ui.tools.askingUser");
+      case "done":
+        return this.#i18n.t("ui.tools.done");
+      default:
+        return this.#i18n.t("ui.tools.executing", { toolName });
+    }
+  }
+  /**
+   * Action button handler: stop when running, close (dispose) when idle
+   */
+  #handleActionButton() {
+    if (this.#agent.status === "running") {
+      this.#agent.stop();
+    } else {
+      this.#agent.dispose();
+    }
+  }
+  /**
+   * Submit task
+   */
+  #submitTask() {
+    const input2 = this.#taskInput.value.trim();
+    if (!input2) return;
+    this.#hideInputArea();
+    if (this.#isWaitingForUserAnswer) {
+      this.#handleUserAnswer(input2);
+    } else {
+      this.#agent.execute(input2);
+    }
+  }
+  /**
+   * Handle user answer
+   */
+  #handleUserAnswer(input2) {
+    this.#removeTempCards();
+    this.#isWaitingForUserAnswer = false;
+    if (this.#userAnswerResolver) {
+      this.#userAnswerResolver(input2);
+      this.#userAnswerResolver = null;
+    }
+  }
+  /**
+   * Show input area
+   */
+  #showInputArea(placeholder) {
+    this.#taskInput.value = "";
+    this.#taskInput.placeholder = placeholder || this.#i18n.t("ui.panel.taskInput");
+    this.#inputSection.classList.remove(styles.hidden);
+    setTimeout(() => {
+      this.#taskInput.focus();
+    }, 100);
+  }
+  /**
+   * Hide input area
+   */
+  #hideInputArea() {
+    this.#inputSection.classList.add(styles.hidden);
+  }
+  /**
+   * Check if input area should be shown
+   */
+  #shouldShowInputArea() {
+    if (this.#isWaitingForUserAnswer) return true;
+    const history = this.#agent.history;
+    if (history.length === 0) {
+      return true;
+    }
+    const status = this.#agent.status;
+    const isTaskEnded = status === "completed" || status === "error" || status === "stopped";
+    if (isTaskEnded) {
+      return this.#config.promptForNextTask ?? true;
+    }
+    return false;
+  }
+  #createWrapper() {
+    const taskInputMaxLength = 1e3;
+    const wrapper2 = document.createElement("div");
+    wrapper2.id = "page-agent-runtime_agent-panel";
+    wrapper2.className = styles.wrapper;
+    wrapper2.setAttribute("data-browser-use-ignore", "true");
+    wrapper2.setAttribute("data-page-agent-ignore", "true");
+    wrapper2.setAttribute("role", "complementary");
+    wrapper2.setAttribute("aria-label", this.#i18n.t("ui.panel.panelLabel"));
+    wrapper2.innerHTML = `
+			<div class="${styles.background}"></div>
+			<div class="${styles.historySectionWrapper}">
+				<!-- FORK: role=log + aria-live faz o leitor de tela anunciar cada mensagem nova sem
+				     roubar o foco de quem está usando a página. aria-relevant=additions evita
+				     reanunciar o histórico inteiro a cada render. -->
+				<div
+					class="${styles.historySection}"
+					role="log"
+					aria-live="polite"
+					aria-relevant="additions"
+					aria-label="${this.#i18n.t("ui.panel.historyLabel")}"
+				>
+					<div class="${styles.historyRow} ${styles.fromSistema}">
+						<div class="${styles.historyItem}" data-mensagem="sistema">
+							<div class="${styles.historyHeader}">
+								<span class="${styles.statusIcon}">${iconThinking}</span>
+								<span class="${styles.historyAuthor}" data-autor="sistema">${this.#i18n.t("ui.panel.authorSystem")}</span>
+							</div>
+							<div class="${styles.historyContent}" data-conteudo><span>${this.#i18n.t("ui.panel.waitingPlaceholder")}</span></div>
+						</div>
+					</div>
+				</div>
+			</div>
+			<div class="${styles.header}">
+				<div class="${styles.statusSection}">
+					<div class="${styles.indicator} ${styles.thinking}"></div>
+					<div class="${styles.statusText}">${this.#i18n.t("ui.panel.ready")}</div>
+				</div>
+				<div class="${styles.controls}">
+					<button class="${styles.controlButton} ${styles.expandButton}" title="${this.#i18n.t("ui.panel.expand")}">
+						▼
+					</button>
+					<button class="${styles.controlButton} ${styles.stopButton}" title="${this.#i18n.t("ui.panel.close")}">
+						X
+					</button>
+				</div>
+			</div>
+			<div class="${styles.inputSectionWrapper} ${styles.hidden}">
+				<div class="${styles.inputSection}">
+					<input 
+						type="text" 
+						class="${styles.taskInput}" 
+						maxlength="${taskInputMaxLength}"
+					/>
+				</div>
+			</div>
+		`;
+    document.body.appendChild(wrapper2);
+    return wrapper2;
+  }
+  #setupEventListeners() {
+    const header2 = this.wrapper.querySelector(`.${styles.header}`);
+    header2.addEventListener("click", (e) => {
+      if (e.target.closest(`.${styles.controlButton}`)) {
+        return;
+      }
+      this.#toggle();
+    });
+    this.#expandButton.addEventListener("click", (e) => {
+      e.stopPropagation();
+      this.#toggle();
+    });
+    this.#actionButton.addEventListener("click", (e) => {
+      e.stopPropagation();
+      this.#handleActionButton();
+    });
+    this.#taskInput.addEventListener("keydown", (e) => {
+      if (e.isComposing) return;
+      if (e.key === "Enter") {
+        e.preventDefault();
+        this.#submitTask();
+      }
+    });
+    this.#inputSection.addEventListener("click", (e) => {
+      e.stopPropagation();
+    });
+  }
+  #toggle() {
+    if (this.#isExpanded) {
+      this.#collapse();
+    } else {
+      this.#expand();
+    }
+  }
+  #expand() {
+    this.#isExpanded = true;
+    this.wrapper.classList.add(styles.expanded);
+    this.#expandButton.textContent = "▲";
+  }
+  #collapse() {
+    this.#isExpanded = false;
+    this.wrapper.classList.remove(styles.expanded);
+    this.#expandButton.textContent = "▼";
+  }
+  /**
+   * Start periodic header update loop
+   */
+  #startHeaderUpdateLoop() {
+    this.#headerUpdateTimer = setInterval(() => {
+      this.#checkAndUpdateHeader();
+    }, 450);
+  }
+  /**
+   * Stop periodic header update loop
+   */
+  #stopHeaderUpdateLoop() {
+    if (this.#headerUpdateTimer) {
+      clearInterval(this.#headerUpdateTimer);
+      this.#headerUpdateTimer = null;
+    }
+  }
+  /**
+   * Check if header needs update and trigger animation if not currently animating
+   */
+  #checkAndUpdateHeader() {
+    if (!this.#pendingHeaderText || this.#isAnimating) {
+      return;
+    }
+    if (this.#statusText.textContent === this.#pendingHeaderText) {
+      this.#pendingHeaderText = null;
+      return;
+    }
+    const textToShow = this.#pendingHeaderText;
+    this.#pendingHeaderText = null;
+    this.#animateTextChange(textToShow);
+  }
+  /**
+   * Animate text change with fade out/in effect
+   */
+  #animateTextChange(newText) {
+    this.#isAnimating = true;
+    this.#statusText.classList.add(styles.fadeOut);
+    setTimeout(() => {
+      this.#statusText.textContent = newText;
+      this.#statusText.classList.remove(styles.fadeOut);
+      this.#statusText.classList.add(styles.fadeIn);
+      setTimeout(() => {
+        this.#statusText.classList.remove(styles.fadeIn);
+        this.#isAnimating = false;
+      }, 300);
+    }, 150);
+  }
+  #updateStatusIndicator(type) {
+    const variant = type === "running" ? "thinking" : type;
+    this.#indicator.className = styles.indicator;
+    if (variant !== "idle" && variant !== "stopped") {
+      this.#indicator.classList.add(styles[variant]);
+    }
+  }
+  #scrollToBottom() {
+    setTimeout(() => {
+      this.#historySection.scrollTop = this.#historySection.scrollHeight;
+    }, 0);
+  }
+  /**
+   * Render history directly from agent.history
+   *
+   * Renders:
+   * 1. Task (first item, from agent.task)
+   * 2. Reflection cards (evaluation, memory, next_goal)
+   * 3. Tool execution with output
+   * 4. Observations
+   */
+  #renderHistory() {
+    const items = [];
+    const task = this.#agent.task;
+    if (task) {
+      items.push(this.#createTaskCard(task));
+    }
+    const history = this.#agent.history;
+    for (const event of history) {
+      items.push(...this.#createHistoryCards(event));
+    }
+    this.#historySection.innerHTML = items.join("");
+    this.#scrollToBottom();
+  }
+  #createTaskCard(task) {
+    return createCard({
+      icon: iconTask,
+      content: task,
+      type: "input",
+      from: "pessoa",
+      author: this.#i18n.t("ui.panel.authorPerson")
+    });
+  }
+  /** Create cards for a history event */
+  #createHistoryCards(event) {
+    const cards = [];
+    const meta = event.type === "step" && event.stepIndex !== void 0 ? this.#i18n.t("ui.panel.step", {
+      number: (event.stepIndex + 1).toString()
+    }) : void 0;
+    if (event.type === "step") {
+      if (event.reflection) {
+        const lines = createReflectionLines(event.reflection, {
+          evaluation: this.#i18n.t("ui.panel.reflectionEvaluation"),
+          memory: this.#i18n.t("ui.panel.reflectionMemory"),
+          nextGoal: this.#i18n.t("ui.panel.reflectionNextGoal")
+        });
+        if (lines.length > 0) {
+          cards.push(
+            createCard({
+              icon: iconThinking,
+              content: lines,
+              meta,
+              author: this.#i18n.t("ui.panel.authorReasoning")
+            })
+          );
+        }
+      }
+      const action = event.action;
+      if (action) {
+        cards.push(...this.#createActionCards(action, meta));
+      }
+    } else if (event.type === "observation") {
+      cards.push(
+        createCard({
+          icon: iconObservation,
+          content: event.content || "",
+          meta,
+          type: "observation",
+          author: this.#i18n.t("ui.panel.authorPage")
+        })
+      );
+    } else if (event.type === "user_takeover") {
+      cards.push(
+        createCard({
+          icon: iconUser,
+          content: this.#i18n.t("ui.panel.userTakeover"),
+          meta,
+          type: "input",
+          from: "pessoa",
+          author: this.#i18n.t("ui.panel.authorPerson")
+        })
+      );
+    } else if (event.type === "retry") {
+      const retryInfo = `${event.message || this.#i18n.t("ui.panel.retrying")} (${event.attempt}/${event.maxAttempts})`;
+      cards.push(
+        createCard({
+          icon: iconRetry,
+          content: retryInfo,
+          meta,
+          type: "observation",
+          from: "sistema",
+          author: this.#i18n.t("ui.panel.authorSystem")
+        })
+      );
+    } else if (event.type === "error") {
+      cards.push(
+        createCard({
+          icon: iconError,
+          content: event.message || this.#i18n.t("ui.panel.errorLabel"),
+          meta,
+          type: "observation",
+          from: "sistema",
+          author: this.#i18n.t("ui.panel.authorSystem")
+        })
+      );
+    }
+    return cards;
+  }
+  /** Create cards for an action */
+  #createActionCards(action, meta) {
+    const cards = [];
+    if (action.name === "done") {
+      const input2 = action.input;
+      const text = input2.text || action.output || "";
+      if (text) {
+        cards.push(
+          createCard({
+            icon: iconDone,
+            content: text,
+            meta,
+            type: "output",
+            author: this.#i18n.t("ui.panel.authorAgent")
+          })
+        );
+      }
+    } else if (action.name === "ask_user") {
+      const input2 = action.input;
+      const answer = action.output.replace(/^User answered:\s*/i, "");
+      cards.push(
+        createCard({
+          icon: iconQuestion,
+          content: this.#i18n.t("ui.panel.question", { question: input2.question || "" }),
+          meta,
+          type: "question",
+          author: this.#i18n.t("ui.panel.authorAgent")
+        })
+      );
+      cards.push(
+        createCard({
+          icon: iconAnswer,
+          content: this.#i18n.t("ui.panel.userAnswer", { input: answer }),
+          meta,
+          type: "input",
+          from: "pessoa",
+          author: this.#i18n.t("ui.panel.authorPerson")
+        })
+      );
+    } else {
+      const toolText = this.#getToolExecutingText(action.name, action.input);
+      cards.push(
+        createCard({ icon: iconTool, content: toolText, meta, author: this.#i18n.t("ui.panel.authorAction") })
+      );
+      if (action.output?.length > 0) {
+        cards.push(
+          createCard({
+            icon: iconTool,
+            content: action.output,
+            meta,
+            type: "output",
+            author: this.#i18n.t("ui.panel.authorResult")
+          })
+        );
+      }
+    }
+    return cards;
+  }
+}
+class PageAgent extends PageAgentCore {
+  panel;
+  constructor(config) {
+    const pageController = new PageController({
+      ...config,
+      enableMask: config.enableMask ?? true
+    });
+    super({ ...config, pageController });
+    this.panel = new Panel(this, {
+      language: config.language,
+      promptForNextTask: config.promptForNextTask
+    });
+  }
+}
+function getRecognitionCtor() {
+  const w = globalThis;
+  return w.SpeechRecognition ?? w.webkitSpeechRecognition ?? null;
+}
+const STATUS_LISTENING = "listening";
+const STATUS_SPEAKING = "speaking";
+const STATUS_IDLE = "idle";
+function createVoice(options = {}) {
+  const lang = options.lang ?? "pt-BR";
+  const rate = options.rate ?? 1;
+  const pitch = options.pitch ?? 1;
+  const inputEnabled = options.input ?? true;
+  const outputEnabled = options.output ?? false;
+  const listenTimeoutMs = options.listenTimeoutMs ?? 3e4;
+  const Recognition = inputEnabled ? getRecognitionCtor() : null;
+  const synth = typeof window !== "undefined" ? window.speechSynthesis : void 0;
+  const supported = {
+    input: Boolean(inputEnabled && Recognition),
+    output: Boolean(outputEnabled && synth)
+  };
+  let status = STATUS_IDLE;
+  const statusListeners = /* @__PURE__ */ new Set();
+  function setStatus(next) {
+    if (status === next) return;
+    status = next;
+    statusListeners.forEach((cb) => {
+      try {
+        cb(next);
+      } catch {
+      }
+    });
+  }
+  let activeRecognition = null;
+  let currentVoice = null;
+  if (synth) {
+    const pickVoice = () => {
+      if (options.voiceURI) {
+        currentVoice = synth.getVoices().find((v) => v.voiceURI === options.voiceURI) ?? null;
+      } else {
+        const voices = synth.getVoices();
+        const prefix = lang.split("-")[0].toLowerCase();
+        currentVoice = voices.find((v) => v.lang?.toLowerCase() === lang.toLowerCase()) ?? voices.find((v) => v.lang?.toLowerCase().startsWith(prefix)) ?? null;
+      }
+    };
+    pickVoice();
+    synth.onvoiceschanged = pickVoice;
+  }
+  function speak(text, opts) {
+    if (!synth || !outputEnabled) return;
+    const clean = (text ?? "").trim();
+    if (!clean) return;
+    if (opts?.interrupt !== false) {
+      synth.cancel();
+    }
+    const utterance = new SpeechSynthesisUtterance(clean);
+    utterance.lang = lang;
+    utterance.rate = rate;
+    utterance.pitch = pitch;
+    if (currentVoice) utterance.voice = currentVoice;
+    utterance.onend = () => setStatus(STATUS_IDLE);
+    utterance.onerror = () => setStatus(STATUS_IDLE);
+    setStatus(STATUS_SPEAKING);
+    synth.speak(utterance);
+  }
+  function listen() {
+    if (!Recognition) {
+      return Promise.reject(new Error("Voz de entrada não suportada neste navegador"));
+    }
+    return new Promise((resolve, reject) => {
+      const recognition = new Recognition();
+      activeRecognition = recognition;
+      let finalText = "";
+      let settled = false;
+      let timer;
+      const finish = (fn) => {
+        if (settled) return;
+        settled = true;
+        if (timer) clearTimeout(timer);
+        if (activeRecognition === recognition) activeRecognition = null;
+        setStatus(STATUS_IDLE);
+        fn();
+      };
+      timer = setTimeout(() => {
+        try {
+          recognition.stop();
+        } catch {
+        }
+        finish(() => reject(new Error("Tempo de escuta esgotado")));
+      }, listenTimeoutMs);
+      recognition.lang = lang;
+      recognition.continuous = false;
+      recognition.interimResults = true;
+      recognition.maxAlternatives = 1;
+      recognition.onstart = () => setStatus(STATUS_LISTENING);
+      recognition.onresult = (event) => {
+        for (let i = event.resultIndex; i < event.results.length; i++) {
+          const result2 = event.results[i];
+          if (result2?.isFinal) finalText = result2[0]?.transcript ?? finalText;
+        }
+      };
+      recognition.onerror = (event) => {
+        const code = event?.error;
+        if (code === "no-speech" || code === "aborted") {
+          finish(() => resolve(finalText.trim()));
+          return;
+        }
+        finish(() => reject(new Error(`Erro de reconhecimento de voz: ${code ?? "desconhecido"}`)));
+      };
+      recognition.onend = () => {
+        finish(() => resolve(finalText.trim()));
+      };
+      try {
+        recognition.start();
+      } catch (error2) {
+        finish(() => reject(error2 instanceof Error ? error2 : new Error(String(error2))));
+      }
+    });
+  }
+  return {
+    supported,
+    listen,
+    stopListening() {
+      try {
+        activeRecognition?.stop();
+      } catch {
+      }
+      activeRecognition = null;
+      setStatus(STATUS_IDLE);
+    },
+    speak,
+    stopSpeaking() {
+      if (!synth) return;
+      synth.cancel();
+      setStatus(STATUS_IDLE);
+    },
+    onStatus(cb) {
+      statusListeners.add(cb);
+      return () => statusListeners.delete(cb);
+    }
+  };
+}
+const DEFAULTS = {
+  language: "pt-BR",
+  maxSteps: 30,
+  enableMask: true,
+  viewportExpansion: 0,
+  promptForNextTask: true,
+  position: "bottom-right",
+  launcherLabel: "Abrir assistente da página",
+  open: false
+};
+const LAUNCHER_ICON = '<svg viewBox="0 0 24 24" width="24" height="24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M12 3l1.9 4.6L18.5 9l-4.6 1.9L12 15.5l-1.9-4.6L5.5 9l4.6-1.4L12 3z"/><path d="M19 14l.8 2 2 .8-2 .8-.8 2-.8-2-2-.8 2-.8.8-2z"/></svg>';
+const MIC_ICON = '<svg viewBox="0 0 24 24" width="18" height="18" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="9" y="3" width="6" height="11" rx="3"/><path d="M5 11a7 7 0 0 0 14 0M12 18v3"/></svg>';
+function positionCss(position) {
+  switch (position) {
+    case "bottom-left":
+      return { bottom: "20px", left: "20px", right: "auto", top: "auto" };
+    case "top-right":
+      return { top: "20px", right: "20px", bottom: "auto", left: "auto" };
+    case "top-left":
+      return { top: "20px", left: "20px", bottom: "auto", right: "auto" };
+    default:
+      return { bottom: "20px", right: "20px", top: "auto", left: "auto" };
+  }
+}
+function logHookError(name, error2) {
+  console.error(`[page-agent-widget] gancho ${name} falhou (a tarefa segue):`, error2);
+}
+function mergeExtensions(host, extensions) {
+  const customTools = { ...host.customTools };
+  for (const extension of extensions) Object.assign(customTools, extension.customTools);
+  const system = [host.instructions?.system, ...extensions.map((e) => e.instructions?.system)].map((text) => text?.trim()).filter((text) => Boolean(text)).join("\n\n");
+  const pageProviders = [host.instructions?.getPageInstructions, ...extensions.map((e) => e.instructions?.getPageInstructions)].filter(
+    (fn) => typeof fn === "function"
+  );
+  const getPageInstructions = pageProviders.length ? (url) => {
+    const parts = [];
+    for (const provide of pageProviders) {
+      try {
+        const text = provide(url)?.trim();
+        if (text) parts.push(text);
+      } catch (error2) {
+        logHookError("getPageInstructions", error2);
+      }
+    }
+    return parts.join("\n\n") || void 0;
+  } : void 0;
+  const sources = [host.hooks, ...extensions.map((e) => e.hooks)].filter((h) => Boolean(h));
+  const chain = (name) => {
+    const fns = sources.map((source) => source[name]).filter((fn) => typeof fn === "function");
+    if (!fns.length) return void 0;
+    return (async (...args) => {
+      for (const fn of fns) {
+        try {
+          await fn(...args);
+        } catch (error2) {
+          logHookError(String(name), error2);
+        }
+      }
+    });
+  };
+  const transforms = sources.map((source) => source.transformPageContent).filter((fn) => typeof fn === "function");
+  const transformPageContent = transforms.length ? async (content) => {
+    let current = content;
+    for (const transform of transforms) {
+      try {
+        current = await transform(current);
+      } catch (error2) {
+        logHookError("transformPageContent", error2);
+      }
+    }
+    return current;
+  } : void 0;
+  return {
+    customTools,
+    instructions: system || getPageInstructions ? { ...system ? { system } : {}, ...getPageInstructions ? { getPageInstructions } : {} } : void 0,
+    onBeforeStep: chain("onBeforeStep"),
+    onAfterStep: chain("onAfterStep"),
+    onBeforeTask: chain("onBeforeTask"),
+    onAfterTask: chain("onAfterTask"),
+    onDispose: chain("onDispose"),
+    transformPageContent
+  };
+}
+function mountWidget$1(options = {}) {
+  const position = options.position ?? DEFAULTS.position;
+  const launcherLabel = options.launcherLabel ?? DEFAULTS.launcherLabel;
+  const open = options.open ?? DEFAULTS.open;
+  let agent = null;
+  let voice = null;
+  let micButton = null;
+  let listening = false;
+  let configPromise = null;
+  async function ensureConfig() {
+    if (configPromise) return configPromise;
+    if (!options.configUrl) return;
+    configPromise = (async () => {
+      const res = await fetch(options.configUrl, { headers: { accept: "application/json" } });
+      if (!res.ok) throw new Error(`mountWidget: configUrl respondeu ${res.status} — o gateway está no ar?`);
+      const server = await res.json();
+      for (const key of ["model", "language", "maxSteps", "promptForNextTask", "instructions", "voice", "brain", "debug"]) {
+        const value = server[key];
+        if (value !== void 0 && value !== null) {
+          options[key] = value;
+        }
+      }
+    })();
+    return configPromise;
+  }
+  function ensureVoice() {
+    if (!voice) voice = createVoice(options.voice ?? {});
+    return voice;
+  }
+  async function ensureAgent() {
+    if (agent && !agent.disposed) return agent;
+    await ensureConfig();
+    const v = ensureVoice();
+    const model = options.model;
+    const baseURL = options.baseURL;
+    if (!model || !baseURL) {
+      throw new Error(
+        options.configUrl ? "mountWidget: o gateway não enviou `model` e/ou falta `baseURL` no front. Confira AGENT_MODEL no gateway e a baseURL do widget." : "mountWidget: configure `model` e `baseURL` (config central do LLM) antes de abrir o agente."
+      );
+    }
+    const resolved = options.resolveExtensions ? await options.resolveExtensions(options) : [];
+    const merged = mergeExtensions(options, [...options.extensions ?? [], ...resolved]);
+    agent = new PageAgent({
+      model,
+      baseURL,
+      apiKey: options.apiKey,
+      transformRequestBody: options.transformRequestBody,
+      customFetch: options.customFetch,
+      maxRetries: options.maxRetries,
+      language: options.language ?? DEFAULTS.language,
+      maxSteps: options.maxSteps ?? DEFAULTS.maxSteps,
+      enableMask: options.enableMask ?? DEFAULTS.enableMask,
+      viewportExpansion: options.viewportExpansion ?? DEFAULTS.viewportExpansion,
+      instructions: merged.instructions,
+      customTools: merged.customTools,
+      onBeforeStep: merged.onBeforeStep,
+      onAfterStep: merged.onAfterStep,
+      onBeforeTask: merged.onBeforeTask,
+      onAfterTask: merged.onAfterTask,
+      onDispose: merged.onDispose,
+      transformPageContent: merged.transformPageContent,
+      promptForNextTask: options.promptForNextTask ?? DEFAULTS.promptForNextTask
+    });
+    wireVoiceOutput(agent, v);
+    injectMicButton(agent, v);
+    return agent;
+  }
+  function wireVoiceOutput(a, v) {
+    const speakOnComplete = options.voice?.speakOnComplete ?? true;
+    const speakSteps = options.voice?.speakSteps ?? false;
+    const onStatus = () => {
+      const status = a.status;
+      const result2 = a.lastResult;
+      if (status === "completed" || status === "error") {
+        if (speakOnComplete && v.supported.output) {
+          if (status === "error") {
+            v.speak("A tarefa encontrou um problema e foi parada.");
+          } else if (result2?.success) {
+            v.speak("Tarefa concluída com sucesso.");
+          } else {
+            v.speak("A tarefa terminou, mas o resultado não foi confirmado.");
+          }
+        }
+        return;
+      }
+      if (speakSteps && status === "running" && v.supported.output) {
+        const lastStep = [...a.history].reverse().find((h) => h.type === "step");
+        const goal = lastStep?.reflection?.next_goal;
+        if (goal) v.speak(goal, { interrupt: true });
+      }
+    };
+    a.addEventListener("statuschange", onStatus);
+    a.addEventListener("activity", (event) => {
+      const detail = event.detail;
+      if (detail?.type === "error" && detail.message && v.supported.output) {
+        v.speak(detail.message, { interrupt: true });
+      }
+    });
+  }
+  function injectMicButton(a, v) {
+    const wrapper2 = a.panel.wrapper;
+    const input2 = wrapper2.querySelector("input");
+    if (!input2 || !v.supported.input) return;
+    if (wrapper2.querySelector('[data-page-agent-voice="mic"]')) return;
+    if (micButton) micButton.remove();
+    micButton = document.createElement("button");
+    micButton.type = "button";
+    micButton.className = "page-agent-voice-mic";
+    micButton.setAttribute("data-page-agent-voice", "mic");
+    micButton.setAttribute("aria-label", "Ditar tarefa por voz");
+    micButton.title = "Ditar tarefa por voz";
+    micButton.innerHTML = MIC_ICON;
+    micButton.style.display = "inline-flex";
+    const host = input2.parentElement ?? wrapper2;
+    host.insertBefore(micButton, input2);
+    v.onStatus((s) => {
+      micButton?.classList.toggle("is-listening", s === "listening");
+    });
+    micButton.addEventListener("click", async () => {
+      if (listening) {
+        v.stopListening();
+        return;
+      }
+      listening = true;
+      try {
+        const transcript = await v.listen();
+        if (transcript) {
+          input2.value = transcript;
+          input2.dispatchEvent(new KeyboardEvent("keydown", { key: "Enter", bubbles: true }));
+        }
+      } catch (error2) {
+        input2.setAttribute("placeholder", error2 instanceof Error ? error2.message : "Não foi possível ouvir; digite a tarefa.");
+        setTimeout(() => input2.removeAttribute("placeholder"), 6e3);
+      } finally {
+        listening = false;
+      }
+    });
+  }
+  const launcher = document.createElement("button");
+  launcher.type = "button";
+  launcher.className = "page-agent-widget-launcher";
+  launcher.setAttribute("aria-label", launcherLabel);
+  launcher.title = launcherLabel;
+  launcher.innerHTML = LAUNCHER_ICON;
+  const pos = positionCss(position);
+  Object.assign(launcher.style, pos);
+  let panelVisible = false;
+  async function openPanel(silent = false) {
+    try {
+      const a = await ensureAgent();
+      a.panel.show();
+      panelVisible = true;
+    } catch (error2) {
+      if (silent) console.error("[page-agent-widget] não abriu o agente:", error2);
+      else throw error2;
+    }
+  }
+  function closePanel() {
+    agent?.panel.hide?.();
+    panelVisible = false;
+  }
+  launcher.addEventListener("click", () => {
+    if (panelVisible) {
+      closePanel();
+    } else {
+      void openPanel(true);
+    }
+  });
+  document.body.appendChild(launcher);
+  if (open) {
+    void openPanel(true);
+  }
+  const widget = {
+    get agent() {
+      return agent;
+    },
+    get voice() {
+      return voice;
+    },
+    launcher,
+    ready() {
+      return ensureAgent();
+    },
+    async run(task) {
+      const a = await ensureAgent();
+      return await a.execute(task);
+    },
+    async stop() {
+      if (agent) await agent.stop();
+    },
+    show() {
+      return openPanel(false);
+    },
+    hide() {
+      closePanel();
+    },
+    toggle() {
+      launcher.click();
+    },
+    setConfig(patch) {
+      Object.assign(options, patch);
+      if (agent) {
+        agent.dispose();
+        agent = null;
+      }
+      if (panelVisible) {
+        panelVisible = false;
+        void openPanel(true);
+      }
+    },
+    unmount() {
+      voice?.stopSpeaking();
+      voice?.stopListening();
+      agent?.dispose();
+      agent = null;
+      voice = null;
+      micButton?.remove();
+      micButton = null;
+      launcher.remove();
+    }
+  };
+  return widget;
+}
+function mountWidget(options = {}) {
+  const { brain: brainOption, ...rest } = options;
+  const previous = rest.resolveExtensions;
+  return mountWidget$1({
+    ...rest,
+    brain: Boolean(brainOption),
+    resolveExtensions: async (resolved) => {
+      const extensions = previous ? [...await previous(resolved)] : [];
+      if (resolved.brain) {
+        const { createBrainExtension } = await import("./brain-extension-DDuKTYrJ.js").then((n) => n.d);
+        extensions.push(createBrainExtension(typeof brainOption === "object" ? brainOption : {}));
+      }
+      if (resolved.debug) {
+        const { createDebugExtension } = await import("./debug-extension-D0P_sNkc.js");
+        extensions.push(createDebugExtension());
+      }
+      return extensions;
+    }
+  });
+}
+export {
+  PageAgent,
+  PageAgentCore,
+  createVoice,
+  mountWidget,
+  tool
+};
+//# sourceMappingURL=page-agent.js.map