@coolkiller007/my-page-agent 0.1.7 → 0.1.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/index.js +98 -70
  2. package/dist/index.js.map +1 -1
  3. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -1,4 +1,4 @@
1
- (function() { try { if (typeof document != "undefined") { var elementStyle = document.createElement("style"); elementStyle.appendChild(document.createTextNode("._wrapper_ur79v_1 {\n position: fixed;\n inset: 0;\n z-index: 2147483641; /* 确保在所有元素之上，除了 Agent UI */\n cursor: wait;\n overflow: hidden;\n\n display: none;\n}\n\n._wrapper_ur79v_1._visible_ur79v_11 {\n display: block;\n}\n/* AI 光标样式 */\n._cursor_1dgwb_2 {\n position: absolute;\n width: var(--cursor-size, 75px);\n height: var(--cursor-size, 75px);\n pointer-events: none;\n z-index: 10000;\n}\n\n._cursorBorder_1dgwb_10 {\n position: absolute;\n width: 100%;\n height: 100%;\n background: linear-gradient(45deg, rgb(57, 182, 255), rgb(189, 69, 251));\n mask-image: url(\"data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20100%20100'%20fill='none'%3e%3cg%3e%3cpath%20d='M%2015%2042%20L%2015%2036.99%20Q%2015%2031.99%2023.7%2031.99%20L%2028.05%2031.99%20Q%2032.41%2031.99%2032.41%2021.99%20L%2032.41%2017%20Q%2032.41%2012%2041.09%2016.95%20L%2076.31%2037.05%20Q%2085%2042%2076.31%2046.95%20L%2041.09%2067.05%20Q%2032.41%2072%2032.41%2062.01%20L%2032.41%2057.01%20Q%2032.41%2052.01%2023.7%2052.01%20L%2019.35%2052.01%20Q%2015%2052.01%2015%2047.01%20Z'%20fill='none'%20stroke='%23000000'%20stroke-width='6'%20stroke-miterlimit='10'%20style='stroke:%20light-dark(rgb(0,%200,%200),%20rgb(255,%20255,%20255));'/%3e%3c/g%3e%3c/svg%3e\");\n mask-size: 100% 100%;\n mask-repeat: no-repeat;\n\n transform-origin: center;\n transform: rotate(-135deg) scale(1.2);\n margin-left: -10px;\n margin-top: -18px;\n}\n\n._cursorFilling_1dgwb_25 {\n position: absolute;\n width: 100%;\n height: 100%;\n background: url(\"data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20100%20100'%3e%3cdefs%3e%3c/defs%3e%3cg%20xmlns='http://www.w3.org/2000/svg'%20style='filter:%20drop-shadow(light-dark(rgba(0,%200,%200,%200.4),%20rgba(237,%20237,%20237,%200.4))%203px%204px%204px);'%3e%3cpath%20d='M%2015%2042%20L%2015%2036.99%20Q%2015%2031.99%2023.7%2031.99%20L%2028.05%2031.99%20Q%2032.41%2031.99%2032.41%2021.99%20L%2032.41%2017%20Q%2032.41%2012%2041.09%2016.95%20L%2076.31%2037.05%20Q%2085%2042%2076.31%2046.95%20L%2041.09%2067.05%20Q%2032.41%2072%2032.41%2062.01%20L%2032.41%2057.01%20Q%2032.41%2052.01%2023.7%2052.01%20L%2019.35%2052.01%20Q%2015%2052.01%2015%2047.01%20Z'%20fill='%23ffffff'%20stroke='none'%20style='fill:%20%23ffffff;'/%3e%3c/g%3e%3c/svg%3e\");\n background-size: 100% 100%;\n background-repeat: no-repeat;\n\n transform-origin: center;\n transform: rotate(-135deg) scale(1.2);\n margin-left: -10px;\n margin-top: -18px;\n}\n\n._cursorRipple_1dgwb_39 {\n position: absolute;\n width: 100%;\n height: 100%;\n pointer-events: none;\n margin-left: -50%;\n margin-top: -50%;\n\n &::after {\n content: '';\n opacity: 0;\n position: absolute;\n inset: 0;\n border: 4px solid rgba(57, 182, 255, 1);\n border-radius: 50%;\n }\n}\n\n._cursor_1dgwb_2._clicking_1dgwb_57 ._cursorRipple_1dgwb_39::after {\n animation: _cursor-ripple_1dgwb_1 300ms ease-out forwards;\n}\n\n@keyframes _cursor-ripple_1dgwb_1 {\n 0% {\n transform: scale(0);\n opacity: 1;\n }\n 100% {\n transform: scale(2);\n opacity: 0;\n }\n}\n._wrapper_1xw4c_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 /* 宽度取窗口 40%，用 clamp 防止超窄/超宽窗口下过小或过大 */\n --width: clamp(280px, 40vw, 640px);\n --height: 40px; /* 状态条高度 */\n --input-height: 80px; /* 输入区高度 */\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 /* 状态条 + 输入区整合为一体，高度取二者之和，让外发光/边框包住整个面板 */\n height: calc(var(--height) + var(--input-height));\n\n /* 输入区隐藏时（任务执行中）收缩回仅状态条高度，避免面板下方留出空白发光区 */\n &:has(._inputSectionWrapper_1xw4c_35._hidden_1xw4c_35) {\n height: var(--height);\n }\n\n /* 面板统一外边框 + 发光效果，替代原来 header/input 各自的独立边框 */\n border: 2px solid rgba(255, 255, 255, 0.4);\n border-radius: var(--border-radius);\n box-shadow:\n 0 0 5px 1px rgba(255, 255, 255, 0.3),\n 0 4px 20px rgba(0, 0, 0, 0.5);\n\n transition: all 0.3s ease-in-out;\n\n /* 响应式设计 */\n @media (max-width: 480px) {\n width: calc(100vw - 40px);\n --width: calc(100vw - 40px);\n }\n\n ._background_1xw4c_54 {\n position: absolute;\n inset: -2px -8px;\n /* @edit @workaround stacking order\n * .background 本身没设 z-index，属于 auto/0 层，永远画在 historySectionWrapper(-2)、\n * inputSectionWrapper(-1) 之上。以前 wrapper 只有 40px 高，background 的矩形碰不到下面\n * 输入区；这次把 wrapper 撑高到 header+input 整体后，background 的范围跟着撑大，正好盖住\n * 输入框/历史列表，看起来像输入框消失、展开按钮点了没反应（其实是内容被盖住了）。\n * 显式给它一个比 -2 更小的 z-index，让它始终垫在最底层。\n */\n z-index: -3;\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_1xw4c_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_1xw4c_1 2s linear infinite;\n animation-delay: 1s;\n }\n }\n}\n\n@keyframes _mask-running_1xw4c_1 {\n from {\n transform: translateX(-100%);\n }\n to {\n transform: translateX(100%);\n }\n}\n\n/* 控制栏 */\n._header_1xw4c_122 {\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 top: 0;\n left: 0;\n right: 0;\n height: var(--height);\n\n cursor: pointer;\n flex-shrink: 0; /* 防止 header 被压缩 */\n\n background: rgba(0, 0, 0, 0.5);\n backdrop-filter: blur(10px);\n /* 只圆上方两角，下方与输入区拼接为一体 */\n border-radius: var(--border-radius) var(--border-radius) 0 0;\n background-clip: padding-box;\n\n /* 与输入区之间的细分隔线，替代原来独立的整圈发光边框 */\n border-bottom: 1px solid rgba(255, 255, 255, 0.15);\n\n ._statusSection_1xw4c_147 {\n display: flex;\n align-items: center;\n gap: 8px;\n flex: 1;\n min-height: 24px; /* 确保垂直居中 */\n\n ._indicator_1xw4c_154 {\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_1xw4c_163 {\n background: rgb(57, 182, 255);\n animation: _pulse_1xw4c_1 0.8s ease-in-out infinite;\n }\n\n &._tool_executing_1xw4c_168 {\n background: rgb(189, 69, 251);\n animation: _pulse_1xw4c_1 0.6s ease-in-out infinite;\n }\n\n &._retry_1xw4c_173 {\n background: rgb(255, 214, 0);\n animation: _retryPulse_1xw4c_1 1s ease-in-out infinite;\n }\n\n /* 静止状态 - 无动画 */\n &._completed_1xw4c_179,\n &._input_1xw4c_35,\n &._output_1xw4c_181 {\n background: rgb(34, 197, 94);\n animation: none;\n }\n\n &._error_1xw4c_186 {\n background: rgb(239, 68, 68);\n animation: none;\n }\n }\n\n ._statusText_1xw4c_192 {\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_1xw4c_204 {\n animation: _statusTextFadeOut_1xw4c_1 0.3s ease forwards;\n }\n\n &._fadeIn_1xw4c_208 {\n animation: _statusTextFadeIn_1xw4c_1 0.3s ease forwards;\n }\n }\n }\n\n ._controls_1xw4c_214 {\n display: flex;\n align-items: center;\n gap: 4px;\n\n ._controlButton_1xw4c_219 {\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_1xw4c_238 {\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_1xw4c_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_1xw4c_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_1xw4c_272 {\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_1xw4c_304 & {\n padding-top: 8px;\n visibility: visible;\n }\n\n ._historySection_1xw4c_272 {\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_1xw4c_304 & {\n max-height: min(500px, calc(100vh - 200px - var(--height)));\n }\n\n ._historyItem_1xw4c_323 {\n /* backdrop-filter: blur(10px); */\n padding: 8px 10px;\n margin-bottom: 6px;\n background: linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.03));\n border-radius: 8px;\n border-left: 2px solid rgba(57, 182, 255, 0.5);\n font-size: 12px;\n color: white;\n /* color: black; */\n line-height: 1.3;\n position: relative;\n overflow: hidden;\n\n /* 微妙的内阴影 */\n box-shadow:\n inset 0 1px 0 rgba(255, 255, 255, 0.1),\n 0 1px 3px rgba(0, 0, 0, 0.1);\n\n &::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n height: 1px;\n background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);\n }\n\n &:hover {\n background: linear-gradient(135deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.06));\n /* transform: translateY(-1px); */\n box-shadow:\n inset 0 1px 0 rgba(255, 255, 255, 0.15),\n 0 2px 4px rgba(0, 0, 0, 0.15);\n }\n\n &:last-child {\n margin-bottom: 10px;\n }\n\n &._completed_1xw4c_179,\n &._input_1xw4c_35,\n &._output_1xw4c_181 {\n border-left-color: rgb(34, 197, 94);\n background: linear-gradient(135deg, rgba(34, 197, 94, 0.1), rgba(34, 197, 94, 0.05));\n }\n\n &._error_1xw4c_186 {\n border-left-color: rgb(239, 68, 68);\n background: linear-gradient(135deg, rgba(239, 68, 68, 0.1), rgba(239, 68, 68, 0.05));\n }\n\n &._retry_1xw4c_173 {\n border-left-color: rgb(255, 214, 0);\n background: linear-gradient(135deg, rgba(255, 214, 0, 0.1), rgba(255, 214, 0, 0.05));\n }\n\n &._observation_1xw4c_381 {\n border-left-color: rgb(147, 51, 234);\n background: linear-gradient(135deg, rgba(147, 51, 234, 0.1), rgba(147, 51, 234, 0.05));\n }\n\n &._question_1xw4c_386 {\n border-left-color: rgb(255, 159, 67);\n background: linear-gradient(135deg, rgba(255, 159, 67, 0.15), rgba(255, 159, 67, 0.08));\n }\n\n /* 突出显示 done 成功结果 */\n &._doneSuccess_1xw4c_392 {\n background: linear-gradient(\n 135deg,\n rgba(34, 197, 94, 0.25),\n rgba(34, 197, 94, 0.15),\n rgba(34, 197, 94, 0.08)\n );\n border: none;\n border-left: 4px solid rgb(34, 197, 94);\n box-shadow:\n 0 4px 12px rgba(34, 197, 94, 0.3),\n inset 0 1px 0 rgba(255, 255, 255, 0.2),\n 0 0 20px rgba(34, 197, 94, 0.1);\n font-weight: 600;\n color: rgb(220, 252, 231);\n padding: 10px 12px;\n margin-bottom: 8px;\n border-radius: 8px;\n position: relative;\n overflow: hidden;\n\n &::before {\n background: linear-gradient(90deg, transparent, rgba(34, 197, 94, 0.4), transparent);\n }\n\n &::after {\n content: '';\n position: absolute;\n top: 0;\n left: -100%;\n width: 100%;\n height: 100%;\n background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.1), transparent);\n animation: _shimmer_1xw4c_1 2s ease-in-out infinite;\n }\n\n ._historyContent_1xw4c_428 {\n ._statusIcon_1xw4c_429 {\n font-size: 16px;\n animation: _celebrate_1xw4c_1 0.8s ease-in-out;\n filter: drop-shadow(0 2px 4px rgba(34, 197, 94, 0.5));\n }\n }\n }\n\n /* 突出显示 done 失败结果 */\n &._doneError_1xw4c_438 {\n background: linear-gradient(\n 135deg,\n rgba(239, 68, 68, 0.25),\n rgba(239, 68, 68, 0.15),\n rgba(239, 68, 68, 0.08)\n );\n border: none;\n border-left: 4px solid rgb(239, 68, 68);\n box-shadow:\n 0 4px 12px rgba(239, 68, 68, 0.3),\n inset 0 1px 0 rgba(255, 255, 255, 0.2),\n 0 0 20px rgba(239, 68, 68, 0.1);\n font-weight: 600;\n color: rgb(254, 226, 226);\n padding: 10px 12px;\n margin-bottom: 8px;\n border-radius: 8px;\n position: relative;\n overflow: hidden;\n\n &::before {\n background: linear-gradient(90deg, transparent, rgba(239, 68, 68, 0.4), transparent);\n }\n\n ._historyContent_1xw4c_428 {\n ._statusIcon_1xw4c_429 {\n font-size: 16px;\n filter: drop-shadow(0 2px 4px rgba(239, 68, 68, 0.5));\n }\n }\n }\n\n ._historyContent_1xw4c_428 {\n display: flex;\n align-items: flex-start;\n gap: 8px;\n\n word-break: break-all;\n white-space: pre-wrap;\n\n /* overflow-x: auto; */\n\n ._statusIcon_1xw4c_429 {\n font-size: 12px;\n flex-shrink: 0;\n line-height: 1;\n transition: all 0.3s ease;\n }\n\n ._reflectionLines_1xw4c_488 {\n display: flex;\n flex-direction: column;\n gap: 4px;\n }\n }\n\n ._historyMeta_1xw4c_495 {\n font-size: 10px;\n color: rgba(255, 255, 255, 0.6);\n /* color: rgb(61, 61, 61); */\n margin-top: 8px;\n line-height: 1;\n }\n }\n }\n}\n\n/* 动画关键帧 - 更快的闪烁 */\n@keyframes _pulse_1xw4c_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_1xw4c_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_1xw4c_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_1xw4c_1 {\n 0% {\n left: -100%;\n }\n 100% {\n left: 100%;\n }\n}\n\n/* 输入区域样式 */\n._inputSectionWrapper_1xw4c_35 {\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: var(--input-height);\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 &._hidden_1xw4c_35 {\n visibility: collapse;\n height: 0;\n }\n\n ._inputSection_1xw4c_35 {\n display: flex;\n align-items: center;\n gap: 8px;\n height: 100%;\n padding: 12px;\n\n ._taskInput_1xw4c_597 {\n flex: 1;\n height: 100%;\n background: rgba(255, 255, 255, 0.4);\n border: 1px solid rgba(255, 255, 255, 0.3);\n border-radius: 12px;\n padding: 8px 14px;\n color: rgb(20, 20, 20);\n font-family: inherit;\n font-size: 14px;\n line-height: 1.4;\n outline: none;\n resize: none;\n overflow-y: auto;\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/*$vite$:1*/")); document.head.appendChild(elementStyle); } } catch (e) { console.error("vite-plugin-css-injected-by-js", e); }})();
1
+ (function() { try { if (typeof document != "undefined") { var elementStyle = document.createElement("style"); elementStyle.appendChild(document.createTextNode("._wrapper_ur79v_1 {\n position: fixed;\n inset: 0;\n z-index: 2147483641; /* 确保在所有元素之上，除了 Agent UI */\n cursor: wait;\n overflow: hidden;\n\n display: none;\n}\n\n._wrapper_ur79v_1._visible_ur79v_11 {\n display: block;\n}\n/* AI 光标样式 */\n._cursor_eh09s_2 {\n position: absolute;\n width: var(--cursor-size, 48px);\n height: var(--cursor-size, 48px);\n pointer-events: none;\n z-index: 10000;\n}\n\n._cursorBorder_eh09s_10 {\n position: absolute;\n width: 100%;\n height: 100%;\n background: linear-gradient(45deg, rgb(57, 182, 255), rgb(189, 69, 251));\n mask-image: url(\"data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201024%201024'%20fill='none'%3e%3cpath%20d='M287.232%20128l514.752%20387.008L574.912%20576l149.376%20299.52-103.04%2051.392L472.32%20628.544l-185.856%20143.424z'%20stroke='%23000000'%20stroke-width='40'%20stroke-linejoin='miter'/%3e%3c/svg%3e\");\n mask-size: 100% 100%;\n mask-repeat: no-repeat;\n margin-left: -16px;\n margin-top: -7px;\n}\n\n._cursorFilling_eh09s_22 {\n position: absolute;\n width: 100%;\n height: 100%;\n background: url(\"data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201024%201024'%3e%3cpath%20d='M287.232%20128l514.752%20387.008L574.912%20576l149.376%20299.52-103.04%2051.392L472.32%20628.544l-185.856%20143.424z'%20fill='%23ffffff'/%3e%3c/svg%3e\");\n background-size: 100% 100%;\n background-repeat: no-repeat;\n margin-left: -16px;\n margin-top: -7px;\n}\n\n._cursorRipple_eh09s_33 {\n position: absolute;\n width: 100%;\n height: 100%;\n pointer-events: none;\n margin-left: -50%;\n margin-top: -50%;\n\n &::after {\n content: '';\n opacity: 0;\n position: absolute;\n inset: 0;\n border: 4px solid rgba(57, 182, 255, 1);\n border-radius: 50%;\n }\n}\n\n._cursor_eh09s_2._clicking_eh09s_51 ._cursorRipple_eh09s_33::after {\n animation: _cursor-ripple_eh09s_1 300ms ease-out forwards;\n}\n\n@keyframes _cursor-ripple_eh09s_1 {\n 0% {\n transform: scale(0);\n opacity: 1;\n }\n 100% {\n transform: scale(2);\n opacity: 0;\n }\n}\n._wrapper_1yola_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 /* 普通流布局：历史弹窗、面板依次纵向排列，靠子元素自身尺寸撑开，\n * 不再用 position:absolute + 手算偏移量拼位置（这套算法之前连续出过两次 bug：\n * 弹窗被状态条盖住、状态条运行态时下方角没跟着圆）。 */\n display: flex;\n flex-direction: column;\n align-items: center;\n\n * {\n box-sizing: border-box;\n }\n\n /* 宽度取窗口 40%，用 clamp 防止超窄/超宽窗口下过小或过大 */\n --width: clamp(280px, 40vw, 640px);\n --height: 40px; /* 状态条高度 */\n --input-height: 80px; /* 输入区高度 */\n --border-radius: 16px;\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\n transition:\n opacity 0.3s ease-in-out,\n transform 0.3s ease-in-out;\n\n /* 响应式设计 */\n @media (max-width: 480px) {\n width: calc(100vw - 40px);\n --width: calc(100vw - 40px);\n }\n}\n\n@keyframes _mask-running_1yola_1 {\n from {\n transform: translateX(-100%);\n }\n to {\n transform: translateX(100%);\n }\n}\n\n/* 状态条 + 输入区的面板容器；.background 光效挂在这一层，.panelInner 负责裁出圆角 */\n._panel_1yola_57 {\n position: relative;\n width: 100%;\n}\n\n._background_1yola_57 {\n position: absolute;\n inset: -2px;\n border-radius: calc(var(--border-radius) + 4px);\n filter: blur(4px);\n overflow: hidden;\n pointer-events: none;\n\n &::before {\n content: '';\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-1),\n var(--color-2),\n var(--color-1)\n );\n animation: _mask-running_1yola_1 2s linear infinite;\n }\n &::after {\n content: '';\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_1yola_1 2s linear infinite;\n animation-delay: 1s;\n }\n}\n\n/* 面板可视区域：靠 overflow:hidden + border-radius 统一裁角，\n * header 单独存在（运行中输入区隐藏）或 header+输入区一起存在时，四角都自动是圆的，\n * 不用再像以前那样给 header 写一条\"输入区隐藏时补圆角\"的特判规则。 */\n._panelInner_1yola_57 {\n position: relative;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n border-radius: var(--border-radius);\n border: 2px solid rgba(255, 255, 255, 0.4);\n box-shadow:\n 0 0 5px 1px rgba(255, 255, 255, 0.3),\n 0 4px 20px rgba(0, 0, 0, 0.5);\n}\n\n/* 控制栏 */\n._header_1yola_124 {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 8px 12px;\n user-select: none;\n\n height: var(--height);\n flex-shrink: 0; /* 防止 header 被压缩 */\n\n cursor: pointer;\n\n background: rgba(0, 0, 0, 0.5);\n backdrop-filter: blur(10px);\n background-clip: padding-box;\n\n ._statusSection_1yola_140 {\n display: flex;\n align-items: center;\n gap: 8px;\n flex: 1;\n min-height: 24px; /* 确保垂直居中 */\n\n ._indicator_1yola_147 {\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_1yola_156 {\n background: rgb(57, 182, 255);\n animation: _pulse_1yola_1 0.8s ease-in-out infinite;\n }\n\n &._tool_executing_1yola_161 {\n background: rgb(189, 69, 251);\n animation: _pulse_1yola_1 0.6s ease-in-out infinite;\n }\n\n &._retry_1yola_166 {\n background: rgb(255, 214, 0);\n animation: _retryPulse_1yola_1 1s ease-in-out infinite;\n }\n\n /* 静止状态 - 无动画 */\n &._completed_1yola_172,\n &._input_1yola_173,\n &._output_1yola_174 {\n background: rgb(34, 197, 94);\n animation: none;\n }\n\n &._error_1yola_179 {\n background: rgb(239, 68, 68);\n animation: none;\n }\n }\n\n ._statusText_1yola_185 {\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_1yola_197 {\n animation: _statusTextFadeOut_1yola_1 0.3s ease forwards;\n }\n\n &._fadeIn_1yola_201 {\n animation: _statusTextFadeIn_1yola_1 0.3s ease forwards;\n }\n }\n }\n\n ._controls_1yola_207 {\n display: flex;\n align-items: center;\n gap: 4px;\n\n ._controlButton_1yola_212 {\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_1yola_231 {\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_1yola_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_1yola_1 {\n 0% {\n opacity: 1;\n transform: translateY(0);\n }\n 100% {\n opacity: 0;\n transform: translateY(-5px);\n }\n}\n\n/* 历史记录弹窗：普通流里排在面板前面（视觉上在上方），默认收起为 0 高度，\n * 展开时靠 JS 量出的真实内容高度做 max-height 动画（不用固定封顶值），\n * 撑开多高、要不要出现，跟面板本身完全无关，不用再算\"面板一共多高、弹窗该挂在哪个 bottom 偏移\"。 */\n._historySectionWrapper_1yola_268 {\n width: 100%;\n overflow: hidden;\n max-height: 0;\n margin-bottom: 0;\n\n background: rgba(2, 0, 20, 0.5);\n backdrop-filter: blur(10px);\n\n text-shadow: 0 0 1px rgba(0, 0, 0, 0.2);\n\n border-radius: calc(var(--border-radius) + 4px);\n border: 0 solid rgba(255, 255, 255, 0);\n box-shadow: 0 4px 16px rgba(0, 0, 0, 0);\n\n transition:\n max-height 0.2s,\n margin-bottom 0.2s,\n border-width 0.2s,\n border-color 0.2s,\n box-shadow 0.2s;\n\n ._wrapper_1yola_1._expanded_1yola_290 & {\n margin-bottom: 8px;\n border-width: 2px;\n border-color: rgba(255, 255, 255, 0.4);\n box-shadow: 0 4px 16px rgba(0, 0, 0, 0.6);\n }\n\n ._historySection_1yola_268 {\n max-height: min(\n 500px,\n calc(100vh - 200px - var(--height))\n ); /* 列表本身的滚动上限，跟展开/收起动画解耦 */\n overflow-y: auto;\n overscroll-behavior: contain;\n scrollbar-width: none;\n padding: 8px 8px 2px;\n\n ._historyItem_1yola_307 {\n /* backdrop-filter: blur(10px); */\n padding: 8px 10px;\n margin-bottom: 6px;\n background: linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.03));\n border-radius: 8px;\n border-left: 2px solid rgba(57, 182, 255, 0.5);\n font-size: 12px;\n color: white;\n /* color: black; */\n line-height: 1.3;\n position: relative;\n overflow: hidden;\n\n /* 微妙的内阴影 */\n box-shadow:\n 0 1px 0 rgba(255, 255, 255, 0.1),\n 0 1px 3px rgba(0, 0, 0, 0.1);\n\n &::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n height: 1px;\n background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);\n }\n\n &:hover {\n background: linear-gradient(135deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.06));\n /* transform: translateY(-1px); */\n box-shadow:\n inset 0 1px 0 rgba(255, 255, 255, 0.15),\n 0 2px 4px rgba(0, 0, 0, 0.15);\n }\n\n &:last-child {\n margin-bottom: 10px;\n }\n\n &._completed_1yola_172,\n &._input_1yola_173,\n &._output_1yola_174 {\n border-left-color: rgb(34, 197, 94);\n background: linear-gradient(135deg, rgba(34, 197, 94, 0.1), rgba(34, 197, 94, 0.05));\n }\n\n &._error_1yola_179 {\n border-left-color: rgb(239, 68, 68);\n background: linear-gradient(135deg, rgba(239, 68, 68, 0.1), rgba(239, 68, 68, 0.05));\n }\n\n &._retry_1yola_166 {\n border-left-color: rgb(255, 214, 0);\n background: linear-gradient(135deg, rgba(255, 214, 0, 0.1), rgba(255, 214, 0, 0.05));\n }\n\n &._observation_1yola_365 {\n border-left-color: rgb(147, 51, 234);\n background: linear-gradient(135deg, rgba(147, 51, 234, 0.1), rgba(147, 51, 234, 0.05));\n }\n\n &._question_1yola_370 {\n border-left-color: rgb(255, 159, 67);\n background: linear-gradient(135deg, rgba(255, 159, 67, 0.15), rgba(255, 159, 67, 0.08));\n }\n\n /* 突出显示 done 成功结果 */\n &._doneSuccess_1yola_376 {\n background: linear-gradient(\n 135deg,\n rgba(34, 197, 94, 0.25),\n rgba(34, 197, 94, 0.15),\n rgba(34, 197, 94, 0.08)\n );\n border: none;\n border-left: 4px solid rgb(34, 197, 94);\n box-shadow:\n 0 4px 12px rgba(34, 197, 94, 0.3),\n inset 0 1px 0 rgba(255, 255, 255, 0.2),\n 0 0 20px rgba(34, 197, 94, 0.1);\n font-weight: 600;\n color: rgb(220, 252, 231);\n padding: 10px 12px;\n margin-bottom: 8px;\n border-radius: 8px;\n position: relative;\n overflow: hidden;\n\n &::before {\n background: linear-gradient(90deg, transparent, rgba(34, 197, 94, 0.4), transparent);\n }\n\n &::after {\n content: '';\n position: absolute;\n top: 0;\n left: -100%;\n width: 100%;\n height: 100%;\n background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.1), transparent);\n animation: _shimmer_1yola_1 2s ease-in-out infinite;\n }\n\n ._historyContent_1yola_412 {\n ._statusIcon_1yola_413 {\n font-size: 16px;\n animation: _celebrate_1yola_1 0.8s ease-in-out;\n filter: drop-shadow(0 2px 4px rgba(34, 197, 94, 0.5));\n }\n }\n }\n\n /* 突出显示 done 失败结果 */\n &._doneError_1yola_422 {\n background: linear-gradient(\n 135deg,\n rgba(239, 68, 68, 0.25),\n rgba(239, 68, 68, 0.15),\n rgba(239, 68, 68, 0.08)\n );\n border: none;\n border-left: 4px solid rgb(239, 68, 68);\n box-shadow:\n 0 4px 12px rgba(239, 68, 68, 0.3),\n inset 0 1px 0 rgba(255, 255, 255, 0.2),\n 0 0 20px rgba(239, 68, 68, 0.1);\n font-weight: 600;\n color: rgb(254, 226, 226);\n padding: 10px 12px;\n margin-bottom: 8px;\n border-radius: 8px;\n position: relative;\n overflow: hidden;\n\n &::before {\n background: linear-gradient(90deg, transparent, rgba(239, 68, 68, 0.4), transparent);\n }\n\n ._historyContent_1yola_412 {\n ._statusIcon_1yola_413 {\n font-size: 16px;\n filter: drop-shadow(0 2px 4px rgba(239, 68, 68, 0.5));\n }\n }\n }\n\n ._historyContent_1yola_412 {\n display: flex;\n align-items: center;\n gap: 8px;\n\n word-break: break-all;\n white-space: pre-wrap;\n\n /* overflow-x: auto; */\n\n ._statusIcon_1yola_413 {\n font-size: 12px;\n flex-shrink: 0;\n line-height: 1;\n transition: all 0.3s ease;\n }\n\n ._reflectionLines_1yola_472 {\n display: flex;\n flex-direction: column;\n gap: 4px;\n }\n }\n\n ._historyMeta_1yola_479 {\n font-size: 10px;\n color: rgba(255, 255, 255, 0.6);\n /* color: rgb(61, 61, 61); */\n margin-top: 8px;\n line-height: 1;\n }\n }\n }\n}\n\n/* 动画关键帧 - 更快的闪烁 */\n@keyframes _pulse_1yola_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_1yola_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_1yola_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_1yola_1 {\n 0% {\n left: -100%;\n }\n 100% {\n left: 100%;\n }\n}\n\n/* 输入区域样式 */\n._inputSectionWrapper_1yola_549 {\n width: 100%;\n margin: 0 auto;\n\n overflow: hidden;\n height: var(--input-height);\n\n transition: height 0.2s;\n\n /* 与 header 保持同色调，让面板看起来是一体的深色玻璃卡片 */\n background: rgba(0, 0, 0, 0.4);\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 &._hidden_1yola_565 {\n height: 0;\n }\n\n ._inputSection_1yola_549 {\n display: flex;\n align-items: center;\n gap: 8px;\n height: 100%;\n padding: 8px; /* 与上方状态条 padding 保持一致 */\n\n ._taskInput_1yola_576 {\n flex: 1;\n height: 100%;\n background: rgba(255, 255, 255, 0.08);\n border: 1px solid rgba(255, 255, 255, 0.15);\n border-radius: 12px;\n padding: 8px 14px;\n color: rgb(240, 240, 245);\n font-family: inherit;\n font-size: 14px;\n line-height: 1.4;\n outline: none;\n resize: none;\n overflow-y: auto;\n transition: all 0.2s ease;\n\n &::placeholder {\n color: rgba(255, 255, 255, 0.45);\n }\n\n &:focus {\n background: rgba(255, 255, 255, 0.14);\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/*$vite$:1*/")); document.head.appendChild(elementStyle); } } catch (e) { console.error("vite-plugin-css-injected-by-js", e); }})();
2
2
  import { Motion } from "ai-motion";
3
3
  import * as z from "zod/v4";
4
4
  //#region \0rolldown/runtime.js
@@ -1938,18 +1938,18 @@ var init_SimulatorMask_module = __esmMin((() => {
1938
1938
  //#region src/browser/visual/cursor.module.css
1939
1939
  var cursor, cursorBorder, cursorFilling, cursorRipple, clicking, cursor_module_default;
1940
1940
  var init_cursor_module = __esmMin((() => {
1941
- cursor = "_cursor_1dgwb_2";
1942
- cursorBorder = "_cursorBorder_1dgwb_10";
1943
- cursorFilling = "_cursorFilling_1dgwb_25";
1944
- cursorRipple = "_cursorRipple_1dgwb_39";
1945
- clicking = "_clicking_1dgwb_57";
1941
+ cursor = "_cursor_eh09s_2";
1942
+ cursorBorder = "_cursorBorder_eh09s_10";
1943
+ cursorFilling = "_cursorFilling_eh09s_22";
1944
+ cursorRipple = "_cursorRipple_eh09s_33";
1945
+ clicking = "_clicking_eh09s_51";
1946
1946
  cursor_module_default = {
1947
1947
  cursor,
1948
1948
  cursorBorder,
1949
1949
  cursorFilling,
1950
1950
  cursorRipple,
1951
1951
  clicking,
1952
- "cursor-ripple": "_cursor-ripple_1dgwb_1"
1952
+ "cursor-ripple": "_cursor-ripple_eh09s_1"
1953
1953
  };
1954
1954
  }));
1955
1955
  //#endregion
@@ -1979,6 +1979,8 @@ var init_SimulatorMask = __esmMin((() => {
1979
1979
  try {
1980
1980
  const motion = new Motion({
1981
1981
  mode: isPageDark() ? "dark" : "light",
1982
+ borderWidth: 2,
1983
+ glowWidth: 80,
1982
1984
  styles: {
1983
1985
  position: "absolute",
1984
1986
  inset: "0"
@@ -2547,47 +2549,49 @@ function escapeHtml(text) {
2547
2549
  return text.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#039;");
2548
2550
  }
2549
2551
  var UI_module_default = {
2550
- wrapper: "_wrapper_1xw4c_1",
2551
- "mask-running": "_mask-running_1xw4c_1",
2552
- inputSectionWrapper: "_inputSectionWrapper_1xw4c_35",
2553
- hidden: "_hidden_1xw4c_35",
2554
- background: "_background_1xw4c_54",
2555
- header: "_header_1xw4c_122",
2556
- pulse: "_pulse_1xw4c_1",
2557
- retryPulse: "_retryPulse_1xw4c_1",
2558
- statusTextFadeOut: "_statusTextFadeOut_1xw4c_1",
2559
- statusTextFadeIn: "_statusTextFadeIn_1xw4c_1",
2560
- statusSection: "_statusSection_1xw4c_147",
2561
- indicator: "_indicator_1xw4c_154",
2562
- thinking: "_thinking_1xw4c_163",
2563
- tool_executing: "_tool_executing_1xw4c_168",
2564
- retry: "_retry_1xw4c_173",
2565
- completed: "_completed_1xw4c_179",
2566
- input: "_input_1xw4c_35",
2567
- output: "_output_1xw4c_181",
2568
- error: "_error_1xw4c_186",
2569
- statusText: "_statusText_1xw4c_192",
2570
- fadeOut: "_fadeOut_1xw4c_204",
2571
- fadeIn: "_fadeIn_1xw4c_208",
2572
- controls: "_controls_1xw4c_214",
2573
- controlButton: "_controlButton_1xw4c_219",
2574
- stopButton: "_stopButton_1xw4c_238",
2575
- historySectionWrapper: "_historySectionWrapper_1xw4c_272",
2576
- shimmer: "_shimmer_1xw4c_1",
2577
- celebrate: "_celebrate_1xw4c_1",
2578
- expanded: "_expanded_1xw4c_304",
2579
- historySection: "_historySection_1xw4c_272",
2580
- historyItem: "_historyItem_1xw4c_323",
2581
- observation: "_observation_1xw4c_381",
2582
- question: "_question_1xw4c_386",
2583
- doneSuccess: "_doneSuccess_1xw4c_392",
2584
- historyContent: "_historyContent_1xw4c_428",
2585
- statusIcon: "_statusIcon_1xw4c_429",
2586
- doneError: "_doneError_1xw4c_438",
2587
- reflectionLines: "_reflectionLines_1xw4c_488",
2588
- historyMeta: "_historyMeta_1xw4c_495",
2589
- inputSection: "_inputSection_1xw4c_35",
2590
- taskInput: "_taskInput_1xw4c_597"
2552
+ wrapper: "_wrapper_1yola_1",
2553
+ panel: "_panel_1yola_57",
2554
+ background: "_background_1yola_57",
2555
+ "mask-running": "_mask-running_1yola_1",
2556
+ panelInner: "_panelInner_1yola_57",
2557
+ header: "_header_1yola_124",
2558
+ pulse: "_pulse_1yola_1",
2559
+ retryPulse: "_retryPulse_1yola_1",
2560
+ statusTextFadeOut: "_statusTextFadeOut_1yola_1",
2561
+ statusTextFadeIn: "_statusTextFadeIn_1yola_1",
2562
+ statusSection: "_statusSection_1yola_140",
2563
+ indicator: "_indicator_1yola_147",
2564
+ thinking: "_thinking_1yola_156",
2565
+ tool_executing: "_tool_executing_1yola_161",
2566
+ retry: "_retry_1yola_166",
2567
+ completed: "_completed_1yola_172",
2568
+ input: "_input_1yola_173",
2569
+ output: "_output_1yola_174",
2570
+ error: "_error_1yola_179",
2571
+ statusText: "_statusText_1yola_185",
2572
+ fadeOut: "_fadeOut_1yola_197",
2573
+ fadeIn: "_fadeIn_1yola_201",
2574
+ controls: "_controls_1yola_207",
2575
+ controlButton: "_controlButton_1yola_212",
2576
+ stopButton: "_stopButton_1yola_231",
2577
+ historySectionWrapper: "_historySectionWrapper_1yola_268",
2578
+ shimmer: "_shimmer_1yola_1",
2579
+ celebrate: "_celebrate_1yola_1",
2580
+ expanded: "_expanded_1yola_290",
2581
+ historySection: "_historySection_1yola_268",
2582
+ historyItem: "_historyItem_1yola_307",
2583
+ observation: "_observation_1yola_365",
2584
+ question: "_question_1yola_370",
2585
+ doneSuccess: "_doneSuccess_1yola_376",
2586
+ historyContent: "_historyContent_1yola_412",
2587
+ statusIcon: "_statusIcon_1yola_413",
2588
+ doneError: "_doneError_1yola_422",
2589
+ reflectionLines: "_reflectionLines_1yola_472",
2590
+ historyMeta: "_historyMeta_1yola_479",
2591
+ inputSectionWrapper: "_inputSectionWrapper_1yola_549",
2592
+ hidden: "_hidden_1yola_565",
2593
+ inputSection: "_inputSection_1yola_549",
2594
+ taskInput: "_taskInput_1yola_576"
2591
2595
  };
2592
2596
  //#endregion
2593
2597
  //#region src/ui/cards.ts
@@ -2632,6 +2636,7 @@ var UI = class {
2632
2636
  #wrapper;
2633
2637
  #indicator;
2634
2638
  #statusText;
2639
+ #historySectionWrapper;
2635
2640
  #historySection;
2636
2641
  #expandButton;
2637
2642
  #actionButton;
@@ -2672,6 +2677,7 @@ var UI = class {
2672
2677
  this.#wrapper = this.#createWrapper();
2673
2678
  this.#indicator = this.#wrapper.querySelector(`.${UI_module_default.indicator}`);
2674
2679
  this.#statusText = this.#wrapper.querySelector(`.${UI_module_default.statusText}`);
2680
+ this.#historySectionWrapper = this.#wrapper.querySelector(`.${UI_module_default.historySectionWrapper}`);
2675
2681
  this.#historySection = this.#wrapper.querySelector(`.${UI_module_default.historySection}`);
2676
2682
  this.#expandButton = this.#wrapper.querySelector(`.${UI_module_default.expandButton}`);
2677
2683
  this.#actionButton = this.#wrapper.querySelector(`.${UI_module_default.stopButton}`);
@@ -2760,6 +2766,7 @@ var UI = class {
2760
2766
  cardElement.setAttribute("data-temp-card", "true");
2761
2767
  this.#historySection.appendChild(cardElement);
2762
2768
  this.#scrollToBottom();
2769
+ this.#syncHistoryHeight();
2763
2770
  this.#showInputArea(this.#i18n.t("ui.userAnswerPrompt"));
2764
2771
  if (signal) {
2765
2772
  this.#userAnswerSignal = signal;
@@ -2792,6 +2799,7 @@ var UI = class {
2792
2799
  Array.from(this.#historySection.children).forEach((child) => {
2793
2800
  if (child.getAttribute("data-temp-card") === "true") child.remove();
2794
2801
  });
2802
+ this.#syncHistoryHeight();
2795
2803
  }
2796
2804
  show() {
2797
2805
  this.wrapper.style.display = "block";
@@ -2914,7 +2922,6 @@ var UI = class {
2914
2922
  wrapper.setAttribute("data-browser-use-ignore", "true");
2915
2923
  wrapper.setAttribute("data-page-agent-ignore", "true");
2916
2924
  wrapper.innerHTML = `
2917
- <div class="${UI_module_default.background}"></div>
2918
2925
  <div class="${UI_module_default.historySectionWrapper}">
2919
2926
  <div class="${UI_module_default.historySection}">
2920
2927
  <div class="${UI_module_default.historyItem}">
@@ -2925,27 +2932,32 @@ var UI = class {
2925
2932
  </div>
2926
2933
  </div>
2927
2934
  </div>
2928
- <div class="${UI_module_default.header}">
2929
- <div class="${UI_module_default.statusSection}">
2930
- <div class="${UI_module_default.indicator} ${UI_module_default.thinking}"></div>
2931
- <div class="${UI_module_default.statusText}">${this.#i18n.t("ui.ready")}</div>
2932
- </div>
2933
- <div class="${UI_module_default.controls}">
2934
- <button class="${UI_module_default.controlButton} ${UI_module_default.expandButton}" title="${this.#i18n.t("ui.expand")}">
2935
- ▼
2936
- </button>
2937
- <button class="${UI_module_default.controlButton} ${UI_module_default.stopButton}" title="${this.#i18n.t("ui.close")}">
2938
- X
2939
- </button>
2940
- </div>
2941
- </div>
2942
- <div class="${UI_module_default.inputSectionWrapper} ${UI_module_default.hidden}">
2943
- <div class="${UI_module_default.inputSection}">
2944
- <textarea
2945
- class="${UI_module_default.taskInput}"
2946
- maxlength="${taskInputMaxLength}"
2947
- rows="1"
2948
- ></textarea>
2935
+ <div class="${UI_module_default.panel}">
2936
+ <div class="${UI_module_default.background}"></div>
2937
+ <div class="${UI_module_default.panelInner}">
2938
+ <div class="${UI_module_default.header}">
2939
+ <div class="${UI_module_default.statusSection}">
2940
+ <div class="${UI_module_default.indicator} ${UI_module_default.thinking}"></div>
2941
+ <div class="${UI_module_default.statusText}">${this.#i18n.t("ui.ready")}</div>
2942
+ </div>
2943
+ <div class="${UI_module_default.controls}">
2944
+ <button class="${UI_module_default.controlButton} ${UI_module_default.expandButton}" title="${this.#i18n.t("ui.expand")}">
2945
+ ▼
2946
+ </button>
2947
+ <button class="${UI_module_default.controlButton} ${UI_module_default.stopButton}" title="${this.#i18n.t("ui.close")}">
2948
+ X
2949
+ </button>
2950
+ </div>
2951
+ </div>
2952
+ <div class="${UI_module_default.inputSectionWrapper} ${UI_module_default.hidden}">
2953
+ <div class="${UI_module_default.inputSection}">
2954
+ <textarea
2955
+ class="${UI_module_default.taskInput}"
2956
+ maxlength="${taskInputMaxLength}"
2957
+ rows="1"
2958
+ ></textarea>
2959
+ </div>
2960
+ </div>
2949
2961
  </div>
2950
2962
  </div>
2951
2963
  `;
@@ -2980,15 +2992,30 @@ var UI = class {
2980
2992
  if (this.#isExpanded) this.#collapse();
2981
2993
  else this.#expand();
2982
2994
  }
2995
+ /**
2996
+ * Expand the history popup.
2997
+ *
2998
+ * `max-height` is measured in JS (not animated to a fixed CSS cap) so the
2999
+ * transition distance always matches the real content height — otherwise
3000
+ * expand/collapse feel like different speeds (expand reaches its real
3001
+ * height early and idles, collapse animates the full cap every time).
3002
+ */
2983
3003
  #expand() {
2984
3004
  this.#isExpanded = true;
2985
3005
  this.wrapper.classList.add(UI_module_default.expanded);
2986
3006
  this.#expandButton.textContent = "▲";
3007
+ this.#syncHistoryHeight();
2987
3008
  }
2988
3009
  #collapse() {
2989
3010
  this.#isExpanded = false;
2990
3011
  this.wrapper.classList.remove(UI_module_default.expanded);
2991
3012
  this.#expandButton.textContent = "▼";
3013
+ this.#historySectionWrapper.style.maxHeight = "0px";
3014
+ }
3015
+ /** Sync the history popup's max-height to its current (already capped) content height */
3016
+ #syncHistoryHeight() {
3017
+ if (!this.#isExpanded) return;
3018
+ this.#historySectionWrapper.style.maxHeight = `${this.#historySectionWrapper.scrollHeight}px`;
2992
3019
  }
2993
3020
  /**
2994
3021
  * Start periodic header update loop
@@ -3070,6 +3097,7 @@ var UI = class {
3070
3097
  for (const event of history) items.push(...this.#createHistoryCards(event));
3071
3098
  this.#historySection.innerHTML = items.join("");
3072
3099
  this.#scrollToBottom();
3100
+ this.#syncHistoryHeight();
3073
3101
  }
3074
3102
  #createTaskCard(task) {
3075
3103
  return createCard({