@promptbook/components 0.112.0-48 → 0.112.0-50

package/esm/index.es.js

@@ -40,7 +40,7 @@ const BOOK_LANGUAGE_VERSION = '2.0.0';
  * @generated
  * @see https://github.com/webgptorg/promptbook
  */
-const PROMPTBOOK_ENGINE_VERSION = '0.112.0-48';
+const PROMPTBOOK_ENGINE_VERSION = '0.112.0-50';
 /**
  * TODO: string_promptbook_version should be constrained to the all versions of Promptbook engine
  * Note: [💞] Ignore a discrepancy between file name and entity name
@@ -1519,10 +1519,22 @@ function createAvatarRandomFactory(avatarDefinition) {
  */
 function prepareAvatarCanvas(canvas, context, size, devicePixelRatio) {
     const normalizedDevicePixelRatio = Math.max(1, Math.round(devicePixelRatio * 100) / 100);
-    canvas.width = Math.round(size * normalizedDevicePixelRatio);
-    canvas.height = Math.round(size * normalizedDevicePixelRatio);
-    canvas.style.width = `${size}px`;
-    canvas.style.height = `${size}px`;
+    const nextCanvasWidth = Math.round(size * normalizedDevicePixelRatio);
+    const nextCanvasHeight = Math.round(size * normalizedDevicePixelRatio);
+    const nextCanvasStyleWidth = `${size}px`;
+    const nextCanvasStyleHeight = `${size}px`;
+    if (canvas.width !== nextCanvasWidth) {
+        canvas.width = nextCanvasWidth;
+    }
+    if (canvas.height !== nextCanvasHeight) {
+        canvas.height = nextCanvasHeight;
+    }
+    if (canvas.style.width !== nextCanvasStyleWidth) {
+        canvas.style.width = nextCanvasStyleWidth;
+    }
+    if (canvas.style.height !== nextCanvasStyleHeight) {
+        canvas.style.height = nextCanvasStyleHeight;
+    }
     context.setTransform(normalizedDevicePixelRatio, 0, 0, normalizedDevicePixelRatio, 0, 0);
     context.clearRect(0, 0, size, size);
 }
@@ -18716,8 +18728,8 @@ const DEFAULT_BOOK = padBook(validateBook(spaceTrim$1(`
 //                  <- [🐱‍🚀] Buttons into genesis book
 // <- TODO: [🐱‍🚀] generateBookBoilerplate and deprecate `DEFAULT_BOOK`
 
-var css_248z$d = ".BookEditor-module_BookEditor__s-0PU{width:100%}.BookEditor-module_bookEditorContainer__wLMwM{box-sizing:border-box;height:100%;padding:10px 25px 0;position:relative;width:100%}.BookEditor-module_bookEditorContainer__wLMwM.BookEditor-module_isVerbose__VQ6iL{background-color:rgba(0,0,0,.05);outline:1px dotted rgba(0,0,0,.5)}.BookEditor-module_isVerbose__VQ6iL{outline:2px dotted #ff7526}.BookEditor-module_bookEditorWrapper__twppD{background-color:#fff;border:1px solid rgba(209,213,219,.8);border-radius:1rem;box-shadow:0 1px 2px 0 rgba(0,0,0,.05);overflow:hidden;padding-top:10px;transition:box-shadow .2s ease-in-out}.BookEditor-module_isVerbose__VQ6iL .BookEditor-module_bookEditorWrapper__twppD{overflow:visible}.BookEditor-module_bookEditorWrapper__twppD:hover{box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06)}.BookEditor-module_bookEditorWrapper__twppD.BookEditor-module_isBorderRadiusDisabled__h1I3v{border-radius:0}.BookEditor-module_dropOverlay__xWWoX{align-items:center;background-color:rgba(0,0,0,.5);bottom:0;color:#fff;display:flex;font-size:1.5rem;justify-content:center;left:0;pointer-events:none;position:absolute;right:0;top:0;z-index:100}.BookEditor-module_bookEditorActionbar__KW6dc{position:absolute;right:55px;top:10px;z-index:100}.BookEditor-module_fullscreen__rktsl{border:none;border-radius:0;bottom:0;box-shadow:none;height:100%;left:0;padding-top:50px;position:fixed;right:0;top:0;width:100%;z-index:9999}.BookEditor-module_button__hS390{align-items:center;background-color:#fff;border:1px solid #d1d5db;border-radius:.375rem;box-shadow:0 1px 2px 0 rgba(0,0,0,.05);color:#374151;cursor:pointer;display:inline-flex;gap:.5rem;padding:.5rem 1rem;transition:all .2s ease-in-out}.BookEditor-module_button__hS390:hover{background-color:#f9fafb;border-color:#b7bcce;box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06)}.BookEditor-module_savedNotification__OiX9L{align-items:center;animation:BookEditor-module_fadeOut__q8JnR 2s forwards;background-color:rgba(0,0,0,.7);border-radius:.5rem;color:#fff;display:flex;font-size:1.25rem;gap:.5rem;left:50%;padding:1rem 2rem;pointer-events:none;position:absolute;top:50%;transform:translate(-50%,-50%);z-index:1000}.BookEditor-module_uploadPanel__2JJtD{background:hsla(0,0%,100%,.98);border:1px solid rgba(209,213,219,.9);border-radius:12px;bottom:20px;box-shadow:0 12px 30px rgba(15,23,42,.15);display:flex;flex-direction:column;gap:10px;max-width:calc(100% - 40px);padding:12px;position:absolute;right:20px;width:420px;z-index:220}.BookEditor-module_uploadPanelHeader__pdJd2{align-items:center;display:flex;gap:12px;justify-content:space-between}.BookEditor-module_uploadPanelTitle__TJIVF{color:#111827;font-size:.95rem;font-weight:600}.BookEditor-module_uploadPanelHeaderMeta__Xw0uI{color:#6b7280;font-size:.75rem}.BookEditor-module_uploadPanelSummary__rwSbG{color:#6b7280;display:grid;font-size:.75rem;gap:4px 12px;grid-template-columns:1fr 1fr}.BookEditor-module_uploadPanelProgressBar__a6pjf{background:#e5e7eb;border-radius:999px;height:6px;overflow:hidden}.BookEditor-module_uploadPanelProgressFill__l-TKR{background:linear-gradient(90deg,#2563eb,#10b981);height:100%;transition:width .2s ease}.BookEditor-module_uploadPanelList__VxEd5{display:flex;flex-direction:column;gap:8px;max-height:220px;overflow-y:auto;padding-right:4px}.BookEditor-module_uploadRow__QiSFg{background:#fff;border:1px solid #e5e7eb;border-radius:10px;display:flex;flex-direction:column;gap:6px;padding:8px}.BookEditor-module_uploadRowHeader__po0j5{align-items:center;display:flex;gap:8px;justify-content:space-between}.BookEditor-module_uploadRowName__doQRO{color:#111827;font-size:.8rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.BookEditor-module_uploadRowStatus__jsUb-{color:#6b7280;font-size:.7rem}.BookEditor-module_uploadRowMeta__1lz9h{color:#6b7280;display:flex;font-size:.7rem;justify-content:space-between}.BookEditor-module_uploadRowProgressBar__NoBA7{background:#e5e7eb;border-radius:999px;height:4px;overflow:hidden}.BookEditor-module_uploadRowProgressFill__TrP7e{background:#3b82f6;height:100%;transition:width .2s ease}.BookEditor-module_uploadRowActions__5Y1Mq{display:flex;gap:6px}.BookEditor-module_uploadActionButton__CqJrr{background:#f9fafb;border:1px solid #d1d5db;border-radius:6px;color:#374151;cursor:pointer;font-size:.7rem;padding:2px 8px;transition:all .15s ease-in-out}.BookEditor-module_uploadActionButton__CqJrr:hover{background:#eef2f7;border-color:#cbd5f5}.BookEditor-module_uploadRowError__eEHWw{color:#b91c1c;font-size:.7rem}@keyframes BookEditor-module_fadeOut__q8JnR{0%{opacity:0}10%{opacity:1}70%{opacity:1}to{opacity:0}}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkJvb2tFZGl0b3IubW9kdWxlLmNzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxxQ0FFSSxVQUNKLENBRUEsOENBS0kscUJBQXNCLENBSHRCLFdBQVksQ0FFWixtQkFBb0IsQ0FEcEIsaUJBQWtCLENBRmxCLFVBS0osQ0FFQSxpRkFFSSxnQ0FBcUMsQ0FDckMsaUNBRUosQ0FFQSxvQ0FDSSwwQkFDSixDQUVBLDRDQUtJLHFCQUF1QixDQUR2QixxQ0FBMEMsQ0FGMUMsa0JBQW1CLENBSW5CLHNDQUEyQyxDQUwzQyxlQUFnQixDQUVoQixnQkFBaUIsQ0FJakIscUNBQ0osQ0FDQSxnRkFFSSxnQkFFSixDQUVBLGtEQUNJLHVFQUNKLENBVUEsNEZBQ0ksZUFDSixDQUVBLHNDQVNJLGtCQUFtQixDQUhuQiwrQkFBb0MsQ0FEcEMsUUFBUyxDQUVULFVBQVksQ0FDWixZQUFhLENBR2IsZ0JBQWlCLENBRGpCLHNCQUF1QixDQVB2QixNQUFPLENBVVAsbUJBQW9CLENBWnBCLGlCQUFrQixDQUdsQixPQUFRLENBRlIsS0FBTSxDQVVOLFdBRUosQ0FRQSw4Q0FDSSxpQkFBa0IsQ0FFbEIsVUFBVyxDQURYLFFBQVMsQ0FFVCxXQUNKLENBRUEscUNBV0ksV0FBWSxDQUZaLGVBQWdCLENBSmhCLFFBQVMsQ0FPVCxlQUFnQixDQUxoQixXQUFZLENBSlosTUFBTyxDQU9QLGdCQUFpQixDQVRqQixjQUFlLENBR2YsT0FBUSxDQUZSLEtBQU0sQ0FJTixVQUFXLENBRVgsWUFLSixDQUVBLGlDQU9JLGtCQUFtQixDQU5uQixxQkFBc0IsQ0FDdEIsd0JBQXlCLENBQ3pCLHFCQUF1QixDQU92QixzQ0FBMkMsQ0FEM0MsYUFBYyxDQUpkLGNBQWUsQ0FDZixtQkFBb0IsQ0FFcEIsU0FBVyxDQUpYLGtCQUFvQixDQU9wQiw4QkFDSixDQUVBLHVDQUNJLHdCQUF5QixDQUN6QixvQkFBcUIsQ0FDckIsaUVBQ0osQ0FFQSw0Q0FhSSxrQkFBbUIsQ0FFbkIsc0RBQThCLENBVjlCLCtCQUFvQyxDQUdwQyxtQkFBcUIsQ0FGckIsVUFBWSxDQU1aLFlBQWEsQ0FIYixpQkFBa0IsQ0FLbEIsU0FBVyxDQVhYLFFBQVMsQ0FJVCxpQkFBa0IsQ0FJbEIsbUJBQW9CLENBVnBCLGlCQUFrQixDQUNsQixPQUFRLENBRVIsOEJBQWdDLENBTWhDLFlBTUosQ0FFQSxzQ0FNSSw4QkFBcUMsQ0FDckMscUNBQTBDLENBQzFDLGtCQUFtQixDQUxuQixXQUFZLENBTVoseUNBQThDLENBRTlDLFlBQWEsQ0FDYixxQkFBc0IsQ0FDdEIsUUFBUyxDQVJULDJCQUE0QixDQUs1QixZQUFhLENBVGIsaUJBQWtCLENBQ2xCLFVBQVcsQ0FFWCxXQUFZLENBVVosV0FDSixDQUVBLDRDQUVJLGtCQUFtQixDQURuQixZQUFhLENBR2IsUUFBUyxDQURULDZCQUVKLENBRUEsMkNBR0ksYUFBYyxDQURkLGdCQUFrQixDQURsQixlQUdKLENBRUEsZ0RBRUksYUFBYyxDQURkLGdCQUVKLENBRUEsNkNBS0ksYUFBYyxDQUpkLFlBQWEsQ0FHYixnQkFBa0IsQ0FEbEIsWUFBYSxDQURiLDZCQUlKLENBRUEsaURBRUksa0JBQW1CLENBQ25CLG1CQUFvQixDQUZwQixVQUFXLENBR1gsZUFDSixDQUVBLGtEQUVJLGlEQUFvRCxDQURwRCxXQUFZLENBRVoseUJBQ0osQ0FFQSwwQ0FDSSxZQUFhLENBQ2IscUJBQXNCLENBQ3RCLE9BQVEsQ0FDUixnQkFBaUIsQ0FDakIsZUFBZ0IsQ0FDaEIsaUJBQ0osQ0FFQSxvQ0FPSSxlQUFnQixDQU5oQix3QkFBeUIsQ0FDekIsa0JBQW1CLENBRW5CLFlBQWEsQ0FDYixxQkFBc0IsQ0FDdEIsT0FBUSxDQUhSLFdBS0osQ0FFQSwwQ0FFSSxrQkFBbUIsQ0FEbkIsWUFBYSxDQUdiLE9BQVEsQ0FEUiw2QkFFSixDQUVBLHdDQUdJLGFBQWMsQ0FGZCxlQUFpQixDQUNqQixlQUFnQixDQUVoQixlQUFnQixDQUNoQixzQkFBdUIsQ0FDdkIsa0JBQ0osQ0FFQSwwQ0FFSSxhQUFjLENBRGQsZUFFSixDQUVBLHdDQUlJLGFBQWMsQ0FIZCxZQUFhLENBRWIsZUFBaUIsQ0FEakIsNkJBR0osQ0FFQSwrQ0FFSSxrQkFBbUIsQ0FDbkIsbUJBQW9CLENBRnBCLFVBQVcsQ0FHWCxlQUNKLENBRUEsZ0RBRUksa0JBQW1CLENBRG5CLFdBQVksQ0FFWix5QkFDSixDQUVBLDJDQUNJLFlBQWEsQ0FDYixPQUNKLENBRUEsNkNBRUksa0JBQW1CLENBRG5CLHdCQUF5QixDQUt6QixpQkFBa0IsQ0FIbEIsYUFBYyxDQUlkLGNBQWUsQ0FIZixlQUFpQixDQUNqQixlQUFnQixDQUdoQiwrQkFDSixDQUVBLG1EQUNJLGtCQUFtQixDQUNuQixvQkFDSixDQUVBLHlDQUVJLGFBQWMsQ0FEZCxlQUVKLENBRUEsNENBQ0ksR0FDSSxTQUNKLENBQ0EsSUFDSSxTQUNKLENBQ0EsSUFDSSxTQUNKLENBQ0EsR0FDSSxTQUNKLENBQ0oiLCJmaWxlIjoiQm9va0VkaXRvci5tb2R1bGUuY3NzIiwic291cmNlc0NvbnRlbnQiOlsiLkJvb2tFZGl0b3Ige1xuICAgIC8qIGhlaWdodDogNDUwcHg7ICovXG4gICAgd2lkdGg6IDEwMCU7XG59XG5cbi5ib29rRWRpdG9yQ29udGFpbmVyIHtcbiAgICB3aWR0aDogMTAwJTtcbiAgICBoZWlnaHQ6IDEwMCU7XG4gICAgcG9zaXRpb246IHJlbGF0aXZlO1xuICAgIHBhZGRpbmc6IDEwcHggMjVweCAwO1xuICAgIGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG59XG5cbi5ib29rRWRpdG9yQ29udGFpbmVyLmlzVmVyYm9zZSB7XG4gICAgLyoqL1xuICAgIGJhY2tncm91bmQtY29sb3I6IHJnYmEoMCwgMCwgMCwgMC4wNSk7XG4gICAgb3V0bGluZTogMXB4IGRvdHRlZCByZ2JhKDAsIDAsIDAsIDAuNSk7XG4gICAgLyoqL1xufVxuXG4uaXNWZXJib3NlIHtcbiAgICBvdXRsaW5lOiAycHggZG90dGVkIHJnYigyNTUgMTE3IDM4KTtcbn1cblxuLmJvb2tFZGl0b3JXcmFwcGVyIHtcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xuICAgIGJvcmRlci1yYWRpdXM6IDFyZW07XG4gICAgcGFkZGluZy10b3A6IDEwcHg7XG4gICAgYm9yZGVyOiAxcHggc29saWQgcmdiYSgyMDksIDIxMywgMjE5LCAwLjgpO1xuICAgIGJhY2tncm91bmQtY29sb3I6IHdoaXRlO1xuICAgIGJveC1zaGFkb3c6IDAgMXB4IDJweCAwIHJnYmEoMCwgMCwgMCwgMC4wNSk7XG4gICAgdHJhbnNpdGlvbjogYm94LXNoYWRvdyAwLjJzIGVhc2UtaW4tb3V0O1xufVxuLmlzVmVyYm9zZSAuYm9va0VkaXRvcldyYXBwZXIge1xuICAgIC8qKi9cbiAgICBvdmVyZmxvdzogdmlzaWJsZTtcbiAgICAvKiovXG59XG5cbi5ib29rRWRpdG9yV3JhcHBlcjpob3ZlciB7XG4gICAgYm94LXNoYWRvdzogMCA0cHggNnB4IC0xcHggcmdiYSgwLCAwLCAwLCAwLjEpLCAwIDJweCA0cHggLTFweCByZ2JhKDAsIDAsIDAsIDAuMDYpO1xufVxuXG4uYm9va0VkaXRvcldyYXBwZXI6Zm9jdXMtd2l0aGluIHtcbiAgICAvKlxuICAgIG91dGxpbmU6IDJweCBzb2xpZCB0cmFuc3BhcmVudDtcbiAgICBvdXRsaW5lLW9mZnNldDogMnB4O1xuICAgIGJveC1zaGFkb3c6IDAgMCAwIDNweCByZ2JhKDk5LCAxMDIsIDI0MSwgMC40KTtcbiAgICAqL1xufVxuXG4uYm9va0VkaXRvcldyYXBwZXIuaXNCb3JkZXJSYWRpdXNEaXNhYmxlZCB7XG4gICAgYm9yZGVyLXJhZGl1czogMDtcbn1cblxuLmRyb3BPdmVybGF5IHtcbiAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgdG9wOiAwO1xuICAgIGxlZnQ6IDA7XG4gICAgcmlnaHQ6IDA7XG4gICAgYm90dG9tOiAwO1xuICAgIGJhY2tncm91bmQtY29sb3I6IHJnYmEoMCwgMCwgMCwgMC41KTtcbiAgICBjb2xvcjogd2hpdGU7XG4gICAgZGlzcGxheTogZmxleDtcbiAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICAgIGZvbnQtc2l6ZTogMS41cmVtO1xuICAgIHotaW5kZXg6IDEwMDtcbiAgICBwb2ludGVyLWV2ZW50czogbm9uZTtcbn1cblxuLypcbi5ib29rRWRpdG9yQ29udGFpbmVyIDpnbG9iYWwoLnZpZXctbGluZSkge1xuICAgIGJvcmRlci1ib3R0b206IDFweCBzb2xpZCAjZWVlOyAvKiA8LSBOb3RlOiBgUFJPTVBUQk9PS19TWU5UQVhfQ09MT1JTLkxJTkVgICogL1xufVxuKi9cblxuLmJvb2tFZGl0b3JBY3Rpb25iYXIge1xuICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgICB0b3A6IDEwcHg7XG4gICAgcmlnaHQ6IDU1cHg7XG4gICAgei1pbmRleDogMTAwO1xufVxuXG4uZnVsbHNjcmVlbiB7XG4gICAgcG9zaXRpb246IGZpeGVkO1xuICAgIHRvcDogMDtcbiAgICBsZWZ0OiAwO1xuICAgIHJpZ2h0OiAwO1xuICAgIGJvdHRvbTogMDtcbiAgICB3aWR0aDogMTAwJTtcbiAgICBoZWlnaHQ6IDEwMCU7XG4gICAgei1pbmRleDogOTk5OTtcbiAgICBib3JkZXItcmFkaXVzOiAwO1xuICAgIHBhZGRpbmctdG9wOiA1MHB4O1xuICAgIGJvcmRlcjogbm9uZTtcbiAgICBib3gtc2hhZG93OiBub25lO1xufVxuXG4uYnV0dG9uIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmZmO1xuICAgIGJvcmRlcjogMXB4IHNvbGlkICNkMWQ1ZGI7XG4gICAgYm9yZGVyLXJhZGl1czogMC4zNzVyZW07XG4gICAgcGFkZGluZzogMC41cmVtIDFyZW07XG4gICAgY3Vyc29yOiBwb2ludGVyO1xuICAgIGRpc3BsYXk6IGlubGluZS1mbGV4O1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgZ2FwOiAwLjVyZW07XG4gICAgY29sb3I6ICMzNzQxNTE7XG4gICAgYm94LXNoYWRvdzogMCAxcHggMnB4IDAgcmdiYSgwLCAwLCAwLCAwLjA1KTtcbiAgICB0cmFuc2l0aW9uOiBhbGwgMC4ycyBlYXNlLWluLW91dDtcbn1cblxuLmJ1dHRvbjpob3ZlciB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogI2Y5ZmFmYjtcbiAgICBib3JkZXItY29sb3I6ICNiN2JjY2U7XG4gICAgYm94LXNoYWRvdzogMCAxcHggM3B4IDAgcmdiYSgwLCAwLCAwLCAwLjEpLCAwIDFweCAycHggMCByZ2JhKDAsIDAsIDAsIDAuMDYpO1xufVxuXG4uc2F2ZWROb3RpZmljYXRpb24ge1xuICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgICB0b3A6IDUwJTtcbiAgICBsZWZ0OiA1MCU7XG4gICAgdHJhbnNmb3JtOiB0cmFuc2xhdGUoLTUwJSwgLTUwJSk7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogcmdiYSgwLCAwLCAwLCAwLjcpO1xuICAgIGNvbG9yOiB3aGl0ZTtcbiAgICBwYWRkaW5nOiAxcmVtIDJyZW07XG4gICAgYm9yZGVyLXJhZGl1czogMC41cmVtO1xuICAgIGZvbnQtc2l6ZTogMS4yNXJlbTtcbiAgICB6LWluZGV4OiAxMDAwO1xuICAgIHBvaW50ZXItZXZlbnRzOiBub25lO1xuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgICBnYXA6IDAuNXJlbTtcbiAgICBhbmltYXRpb246IGZhZGVPdXQgMnMgZm9yd2FyZHM7XG59XG5cbi51cGxvYWRQYW5lbCB7XG4gICAgcG9zaXRpb246IGFic29sdXRlO1xuICAgIHJpZ2h0OiAyMHB4O1xuICAgIGJvdHRvbTogMjBweDtcbiAgICB3aWR0aDogNDIwcHg7XG4gICAgbWF4LXdpZHRoOiBjYWxjKDEwMCUgLSA0MHB4KTtcbiAgICBiYWNrZ3JvdW5kOiByZ2JhKDI1NSwgMjU1LCAyNTUsIDAuOTgpO1xuICAgIGJvcmRlcjogMXB4IHNvbGlkIHJnYmEoMjA5LCAyMTMsIDIxOSwgMC45KTtcbiAgICBib3JkZXItcmFkaXVzOiAxMnB4O1xuICAgIGJveC1zaGFkb3c6IDAgMTJweCAzMHB4IHJnYmEoMTUsIDIzLCA0MiwgMC4xNSk7XG4gICAgcGFkZGluZzogMTJweDtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47XG4gICAgZ2FwOiAxMHB4O1xuICAgIHotaW5kZXg6IDIyMDtcbn1cblxuLnVwbG9hZFBhbmVsSGVhZGVyIHtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAganVzdGlmeS1jb250ZW50OiBzcGFjZS1iZXR3ZWVuO1xuICAgIGdhcDogMTJweDtcbn1cblxuLnVwbG9hZFBhbmVsVGl0bGUge1xuICAgIGZvbnQtd2VpZ2h0OiA2MDA7XG4gICAgZm9udC1zaXplOiAwLjk1cmVtO1xuICAgIGNvbG9yOiAjMTExODI3O1xufVxuXG4udXBsb2FkUGFuZWxIZWFkZXJNZXRhIHtcbiAgICBmb250LXNpemU6IDAuNzVyZW07XG4gICAgY29sb3I6ICM2YjcyODA7XG59XG5cbi51cGxvYWRQYW5lbFN1bW1hcnkge1xuICAgIGRpc3BsYXk6IGdyaWQ7XG4gICAgZ3JpZC10ZW1wbGF0ZS1jb2x1bW5zOiAxZnIgMWZyO1xuICAgIGdhcDogNHB4IDEycHg7XG4gICAgZm9udC1zaXplOiAwLjc1cmVtO1xuICAgIGNvbG9yOiAjNmI3MjgwO1xufVxuXG4udXBsb2FkUGFuZWxQcm9ncmVzc0JhciB7XG4gICAgaGVpZ2h0OiA2cHg7XG4gICAgYmFja2dyb3VuZDogI2U1ZTdlYjtcbiAgICBib3JkZXItcmFkaXVzOiA5OTlweDtcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xufVxuXG4udXBsb2FkUGFuZWxQcm9ncmVzc0ZpbGwge1xuICAgIGhlaWdodDogMTAwJTtcbiAgICBiYWNrZ3JvdW5kOiBsaW5lYXItZ3JhZGllbnQoOTBkZWcsICMyNTYzZWIsICMxMGI5ODEpO1xuICAgIHRyYW5zaXRpb246IHdpZHRoIDAuMnMgZWFzZTtcbn1cblxuLnVwbG9hZFBhbmVsTGlzdCB7XG4gICAgZGlzcGxheTogZmxleDtcbiAgICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICAgIGdhcDogOHB4O1xuICAgIG1heC1oZWlnaHQ6IDIyMHB4O1xuICAgIG92ZXJmbG93LXk6IGF1dG87XG4gICAgcGFkZGluZy1yaWdodDogNHB4O1xufVxuXG4udXBsb2FkUm93IHtcbiAgICBib3JkZXI6IDFweCBzb2xpZCAjZTVlN2ViO1xuICAgIGJvcmRlci1yYWRpdXM6IDEwcHg7XG4gICAgcGFkZGluZzogOHB4O1xuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcbiAgICBnYXA6IDZweDtcbiAgICBiYWNrZ3JvdW5kOiAjZmZmO1xufVxuXG4udXBsb2FkUm93SGVhZGVyIHtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAganVzdGlmeS1jb250ZW50OiBzcGFjZS1iZXR3ZWVuO1xuICAgIGdhcDogOHB4O1xufVxuXG4udXBsb2FkUm93TmFtZSB7XG4gICAgZm9udC1zaXplOiAwLjhyZW07XG4gICAgZm9udC13ZWlnaHQ6IDYwMDtcbiAgICBjb2xvcjogIzExMTgyNztcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xuICAgIHRleHQtb3ZlcmZsb3c6IGVsbGlwc2lzO1xuICAgIHdoaXRlLXNwYWNlOiBub3dyYXA7XG59XG5cbi51cGxvYWRSb3dTdGF0dXMge1xuICAgIGZvbnQtc2l6ZTogMC43cmVtO1xuICAgIGNvbG9yOiAjNmI3MjgwO1xufVxuXG4udXBsb2FkUm93TWV0YSB7XG4gICAgZGlzcGxheTogZmxleDtcbiAgICBqdXN0aWZ5LWNvbnRlbnQ6IHNwYWNlLWJldHdlZW47XG4gICAgZm9udC1zaXplOiAwLjdyZW07XG4gICAgY29sb3I6ICM2YjcyODA7XG59XG5cbi51cGxvYWRSb3dQcm9ncmVzc0JhciB7XG4gICAgaGVpZ2h0OiA0cHg7XG4gICAgYmFja2dyb3VuZDogI2U1ZTdlYjtcbiAgICBib3JkZXItcmFkaXVzOiA5OTlweDtcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xufVxuXG4udXBsb2FkUm93UHJvZ3Jlc3NGaWxsIHtcbiAgICBoZWlnaHQ6IDEwMCU7XG4gICAgYmFja2dyb3VuZDogIzNiODJmNjtcbiAgICB0cmFuc2l0aW9uOiB3aWR0aCAwLjJzIGVhc2U7XG59XG5cbi51cGxvYWRSb3dBY3Rpb25zIHtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGdhcDogNnB4O1xufVxuXG4udXBsb2FkQWN0aW9uQnV0dG9uIHtcbiAgICBib3JkZXI6IDFweCBzb2xpZCAjZDFkNWRiO1xuICAgIGJhY2tncm91bmQ6ICNmOWZhZmI7XG4gICAgY29sb3I6ICMzNzQxNTE7XG4gICAgZm9udC1zaXplOiAwLjdyZW07XG4gICAgcGFkZGluZzogMnB4IDhweDtcbiAgICBib3JkZXItcmFkaXVzOiA2cHg7XG4gICAgY3Vyc29yOiBwb2ludGVyO1xuICAgIHRyYW5zaXRpb246IGFsbCAwLjE1cyBlYXNlLWluLW91dDtcbn1cblxuLnVwbG9hZEFjdGlvbkJ1dHRvbjpob3ZlciB7XG4gICAgYmFja2dyb3VuZDogI2VlZjJmNztcbiAgICBib3JkZXItY29sb3I6ICNjYmQ1ZjU7XG59XG5cbi51cGxvYWRSb3dFcnJvciB7XG4gICAgZm9udC1zaXplOiAwLjdyZW07XG4gICAgY29sb3I6ICNiOTFjMWM7XG59XG5cbkBrZXlmcmFtZXMgZmFkZU91dCB7XG4gICAgMCUge1xuICAgICAgICBvcGFjaXR5OiAwO1xuICAgIH1cbiAgICAxMCUge1xuICAgICAgICBvcGFjaXR5OiAxO1xuICAgIH1cbiAgICA3MCUge1xuICAgICAgICBvcGFjaXR5OiAxO1xuICAgIH1cbiAgICAxMDAlIHtcbiAgICAgICAgb3BhY2l0eTogMDtcbiAgICB9XG59XG4iXX0= */";
-var styles$d = {"BookEditor":"BookEditor-module_BookEditor__s-0PU","bookEditorContainer":"BookEditor-module_bookEditorContainer__wLMwM","isVerbose":"BookEditor-module_isVerbose__VQ6iL","bookEditorWrapper":"BookEditor-module_bookEditorWrapper__twppD","isBorderRadiusDisabled":"BookEditor-module_isBorderRadiusDisabled__h1I3v","dropOverlay":"BookEditor-module_dropOverlay__xWWoX","bookEditorActionbar":"BookEditor-module_bookEditorActionbar__KW6dc","fullscreen":"BookEditor-module_fullscreen__rktsl","button":"BookEditor-module_button__hS390","savedNotification":"BookEditor-module_savedNotification__OiX9L","fadeOut":"BookEditor-module_fadeOut__q8JnR","uploadPanel":"BookEditor-module_uploadPanel__2JJtD","uploadPanelHeader":"BookEditor-module_uploadPanelHeader__pdJd2","uploadPanelTitle":"BookEditor-module_uploadPanelTitle__TJIVF","uploadPanelHeaderMeta":"BookEditor-module_uploadPanelHeaderMeta__Xw0uI","uploadPanelSummary":"BookEditor-module_uploadPanelSummary__rwSbG","uploadPanelProgressBar":"BookEditor-module_uploadPanelProgressBar__a6pjf","uploadPanelProgressFill":"BookEditor-module_uploadPanelProgressFill__l-TKR","uploadPanelList":"BookEditor-module_uploadPanelList__VxEd5","uploadRow":"BookEditor-module_uploadRow__QiSFg","uploadRowHeader":"BookEditor-module_uploadRowHeader__po0j5","uploadRowName":"BookEditor-module_uploadRowName__doQRO","uploadRowStatus":"BookEditor-module_uploadRowStatus__jsUb-","uploadRowMeta":"BookEditor-module_uploadRowMeta__1lz9h","uploadRowProgressBar":"BookEditor-module_uploadRowProgressBar__NoBA7","uploadRowProgressFill":"BookEditor-module_uploadRowProgressFill__TrP7e","uploadRowActions":"BookEditor-module_uploadRowActions__5Y1Mq","uploadActionButton":"BookEditor-module_uploadActionButton__CqJrr","uploadRowError":"BookEditor-module_uploadRowError__eEHWw"};
+var css_248z$d = ".BookEditor-module_BookEditor__s-0PU{width:100%}.BookEditor-module_bookEditorContainer__wLMwM{box-sizing:border-box;height:100%;padding:10px 25px 0;position:relative;width:100%}.BookEditor-module_bookEditorContainer__wLMwM.BookEditor-module_isVerbose__VQ6iL{background-color:rgba(0,0,0,.05);outline:1px dotted rgba(0,0,0,.5)}.BookEditor-module_isVerbose__VQ6iL{outline:2px dotted #ff7526}.BookEditor-module_bookEditorWrapper__twppD{background-color:#fff;border:1px solid rgba(209,213,219,.8);border-radius:1rem;box-shadow:0 1px 2px 0 rgba(0,0,0,.05);overflow:hidden;padding-top:10px;transition:box-shadow .2s ease-in-out}.BookEditor-module_isVerbose__VQ6iL .BookEditor-module_bookEditorWrapper__twppD{overflow:visible}.BookEditor-module_bookEditorWrapper__twppD:hover{box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06)}.BookEditor-module_BookEditor__s-0PU[data-book-editor-theme=dark] .BookEditor-module_bookEditorWrapper__twppD{background:linear-gradient(180deg,rgba(15,23,42,.98),rgba(8,15,28,.98));border-color:rgba(51,65,85,.92);box-shadow:0 20px 45px rgba(2,6,23,.4)}.BookEditor-module_BookEditor__s-0PU[data-book-editor-theme=dark] .BookEditor-module_bookEditorWrapper__twppD:hover{box-shadow:0 24px 50px rgba(2,6,23,.48)}.BookEditor-module_bookEditorWrapper__twppD.BookEditor-module_isBorderRadiusDisabled__h1I3v{border-radius:0}.BookEditor-module_dropOverlay__xWWoX{align-items:center;background-color:rgba(0,0,0,.5);bottom:0;color:#fff;display:flex;font-size:1.5rem;justify-content:center;left:0;pointer-events:none;position:absolute;right:0;top:0;z-index:100}.BookEditor-module_bookEditorActionbar__KW6dc{position:absolute;right:55px;top:10px;z-index:100}.BookEditor-module_fullscreen__rktsl{border:none;border-radius:0;bottom:0;box-shadow:none;height:100%;left:0;padding-top:50px;position:fixed;right:0;top:0;width:100%;z-index:9999}.BookEditor-module_button__hS390{align-items:center;background-color:#fff;border:1px solid #d1d5db;border-radius:.375rem;box-shadow:0 1px 2px 0 rgba(0,0,0,.05);color:#374151;cursor:pointer;display:inline-flex;gap:.5rem;padding:.5rem 1rem;transition:all .2s ease-in-out}.BookEditor-module_button__hS390:hover{background-color:#f9fafb;border-color:#b7bcce;box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06)}.BookEditor-module_BookEditor__s-0PU[data-book-editor-theme=dark] .BookEditor-module_button__hS390{background-color:rgba(15,23,42,.92);border-color:rgba(71,85,105,.9);box-shadow:0 1px 2px 0 rgba(2,6,23,.35);color:#e2e8f0}.BookEditor-module_BookEditor__s-0PU[data-book-editor-theme=dark] .BookEditor-module_button__hS390:hover{background-color:rgba(30,41,59,.98);border-color:rgba(125,211,252,.5);box-shadow:0 10px 24px rgba(2,6,23,.35)}.BookEditor-module_savedNotification__OiX9L{align-items:center;animation:BookEditor-module_fadeOut__q8JnR 2s forwards;background-color:rgba(0,0,0,.7);border-radius:.5rem;color:#fff;display:flex;font-size:1.25rem;gap:.5rem;left:50%;padding:1rem 2rem;pointer-events:none;position:absolute;top:50%;transform:translate(-50%,-50%);z-index:1000}.BookEditor-module_BookEditor__s-0PU[data-book-editor-theme=dark] .BookEditor-module_savedNotification__OiX9L{background-color:rgba(2,6,23,.86);border:1px solid rgba(51,65,85,.9);color:#e2e8f0}.BookEditor-module_uploadPanel__2JJtD{background:hsla(0,0%,100%,.98);border:1px solid rgba(209,213,219,.9);border-radius:12px;bottom:20px;box-shadow:0 12px 30px rgba(15,23,42,.15);display:flex;flex-direction:column;gap:10px;max-width:calc(100% - 40px);padding:12px;position:absolute;right:20px;width:420px;z-index:220}.BookEditor-module_BookEditor__s-0PU[data-book-editor-theme=dark] .BookEditor-module_uploadPanel__2JJtD{background:rgba(8,15,28,.96);border-color:rgba(51,65,85,.9);box-shadow:0 18px 40px rgba(2,6,23,.45)}.BookEditor-module_uploadPanelHeader__pdJd2{align-items:center;display:flex;gap:12px;justify-content:space-between}.BookEditor-module_uploadPanelTitle__TJIVF{color:#111827;font-size:.95rem;font-weight:600}.BookEditor-module_BookEditor__s-0PU[data-book-editor-theme=dark] .BookEditor-module_uploadPanelTitle__TJIVF{color:#f8fafc}.BookEditor-module_uploadPanelHeaderMeta__Xw0uI{color:#6b7280;font-size:.75rem}.BookEditor-module_BookEditor__s-0PU[data-book-editor-theme=dark] .BookEditor-module_uploadPanelHeaderMeta__Xw0uI,.BookEditor-module_BookEditor__s-0PU[data-book-editor-theme=dark] .BookEditor-module_uploadPanelSummary__rwSbG,.BookEditor-module_BookEditor__s-0PU[data-book-editor-theme=dark] .BookEditor-module_uploadRowMeta__1lz9h,.BookEditor-module_BookEditor__s-0PU[data-book-editor-theme=dark] .BookEditor-module_uploadRowStatus__jsUb-{color:#94a3b8}.BookEditor-module_uploadPanelSummary__rwSbG{color:#6b7280;display:grid;font-size:.75rem;gap:4px 12px;grid-template-columns:1fr 1fr}.BookEditor-module_uploadPanelProgressBar__a6pjf{background:#e5e7eb;border-radius:999px;height:6px;overflow:hidden}.BookEditor-module_uploadPanelProgressFill__l-TKR{background:linear-gradient(90deg,#2563eb,#10b981);height:100%;transition:width .2s ease}.BookEditor-module_BookEditor__s-0PU[data-book-editor-theme=dark] .BookEditor-module_uploadPanelProgressBar__a6pjf,.BookEditor-module_BookEditor__s-0PU[data-book-editor-theme=dark] .BookEditor-module_uploadRowProgressBar__NoBA7{background:#1e293b}.BookEditor-module_uploadPanelList__VxEd5{display:flex;flex-direction:column;gap:8px;max-height:220px;overflow-y:auto;padding-right:4px}.BookEditor-module_uploadRow__QiSFg{background:#fff;border:1px solid #e5e7eb;border-radius:10px;display:flex;flex-direction:column;gap:6px;padding:8px}.BookEditor-module_BookEditor__s-0PU[data-book-editor-theme=dark] .BookEditor-module_uploadRow__QiSFg{background:rgba(15,23,42,.92);border-color:#334155}.BookEditor-module_uploadRowHeader__po0j5{align-items:center;display:flex;gap:8px;justify-content:space-between}.BookEditor-module_uploadRowName__doQRO{color:#111827;font-size:.8rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.BookEditor-module_BookEditor__s-0PU[data-book-editor-theme=dark] .BookEditor-module_uploadRowName__doQRO{color:#f8fafc}.BookEditor-module_uploadRowStatus__jsUb-{color:#6b7280;font-size:.7rem}.BookEditor-module_uploadRowMeta__1lz9h{color:#6b7280;display:flex;font-size:.7rem;justify-content:space-between}.BookEditor-module_uploadRowProgressBar__NoBA7{background:#e5e7eb;border-radius:999px;height:4px;overflow:hidden}.BookEditor-module_uploadRowProgressFill__TrP7e{background:#3b82f6;height:100%;transition:width .2s ease}.BookEditor-module_uploadRowActions__5Y1Mq{display:flex;gap:6px}.BookEditor-module_uploadActionButton__CqJrr{background:#f9fafb;border:1px solid #d1d5db;border-radius:6px;color:#374151;cursor:pointer;font-size:.7rem;padding:2px 8px;transition:all .15s ease-in-out}.BookEditor-module_uploadActionButton__CqJrr:hover{background:#eef2f7;border-color:#cbd5f5}.BookEditor-module_BookEditor__s-0PU[data-book-editor-theme=dark] .BookEditor-module_uploadActionButton__CqJrr{background:#0f172a;border-color:#475569;color:#e2e8f0}.BookEditor-module_BookEditor__s-0PU[data-book-editor-theme=dark] .BookEditor-module_uploadActionButton__CqJrr:hover{background:#1e293b;border-color:#7dd3fc}.BookEditor-module_uploadRowError__eEHWw{color:#b91c1c;font-size:.7rem}@keyframes BookEditor-module_fadeOut__q8JnR{0%{opacity:0}10%{opacity:1}70%{opacity:1}to{opacity:0}}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkJvb2tFZGl0b3IubW9kdWxlLmNzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxxQ0FFSSxVQUNKLENBRUEsOENBS0kscUJBQXNCLENBSHRCLFdBQVksQ0FFWixtQkFBb0IsQ0FEcEIsaUJBQWtCLENBRmxCLFVBS0osQ0FFQSxpRkFFSSxnQ0FBcUMsQ0FDckMsaUNBRUosQ0FFQSxvQ0FDSSwwQkFDSixDQUVBLDRDQUtJLHFCQUF1QixDQUR2QixxQ0FBMEMsQ0FGMUMsa0JBQW1CLENBSW5CLHNDQUEyQyxDQUwzQyxlQUFnQixDQUVoQixnQkFBaUIsQ0FJakIscUNBQ0osQ0FDQSxnRkFFSSxnQkFFSixDQUVBLGtEQUNJLHVFQUNKLENBRUEsOEdBRUksdUVBQWtGLENBRGxGLCtCQUFvQyxDQUVwQyxzQ0FDSixDQUVBLG9IQUNJLHVDQUNKLENBVUEsNEZBQ0ksZUFDSixDQUVBLHNDQVNJLGtCQUFtQixDQUhuQiwrQkFBb0MsQ0FEcEMsUUFBUyxDQUVULFVBQVksQ0FDWixZQUFhLENBR2IsZ0JBQWlCLENBRGpCLHNCQUF1QixDQVB2QixNQUFPLENBVVAsbUJBQW9CLENBWnBCLGlCQUFrQixDQUdsQixPQUFRLENBRlIsS0FBTSxDQVVOLFdBRUosQ0FRQSw4Q0FDSSxpQkFBa0IsQ0FFbEIsVUFBVyxDQURYLFFBQVMsQ0FFVCxXQUNKLENBRUEscUNBV0ksV0FBWSxDQUZaLGVBQWdCLENBSmhCLFFBQVMsQ0FPVCxlQUFnQixDQUxoQixXQUFZLENBSlosTUFBTyxDQU9QLGdCQUFpQixDQVRqQixjQUFlLENBR2YsT0FBUSxDQUZSLEtBQU0sQ0FJTixVQUFXLENBRVgsWUFLSixDQUVBLGlDQU9JLGtCQUFtQixDQU5uQixxQkFBc0IsQ0FDdEIsd0JBQXlCLENBQ3pCLHFCQUF1QixDQU92QixzQ0FBMkMsQ0FEM0MsYUFBYyxDQUpkLGNBQWUsQ0FDZixtQkFBb0IsQ0FFcEIsU0FBVyxDQUpYLGtCQUFvQixDQU9wQiw4QkFDSixDQUVBLHVDQUNJLHdCQUF5QixDQUN6QixvQkFBcUIsQ0FDckIsaUVBQ0osQ0FFQSxtR0FDSSxtQ0FBd0MsQ0FDeEMsK0JBQW9DLENBRXBDLHVDQUE0QyxDQUQ1QyxhQUVKLENBRUEseUdBQ0ksbUNBQXdDLENBQ3hDLGlDQUFzQyxDQUN0Qyx1Q0FDSixDQUVBLDRDQWFJLGtCQUFtQixDQUVuQixzREFBOEIsQ0FWOUIsK0JBQW9DLENBR3BDLG1CQUFxQixDQUZyQixVQUFZLENBTVosWUFBYSxDQUhiLGlCQUFrQixDQUtsQixTQUFXLENBWFgsUUFBUyxDQUlULGlCQUFrQixDQUlsQixtQkFBb0IsQ0FWcEIsaUJBQWtCLENBQ2xCLE9BQVEsQ0FFUiw4QkFBZ0MsQ0FNaEMsWUFNSixDQUVBLDhHQUNJLGlDQUFzQyxDQUV0QyxrQ0FBdUMsQ0FEdkMsYUFFSixDQUVBLHNDQU1JLDhCQUFxQyxDQUNyQyxxQ0FBMEMsQ0FDMUMsa0JBQW1CLENBTG5CLFdBQVksQ0FNWix5Q0FBOEMsQ0FFOUMsWUFBYSxDQUNiLHFCQUFzQixDQUN0QixRQUFTLENBUlQsMkJBQTRCLENBSzVCLFlBQWEsQ0FUYixpQkFBa0IsQ0FDbEIsVUFBVyxDQUVYLFdBQVksQ0FVWixXQUNKLENBRUEsd0dBQ0ksNEJBQWlDLENBQ2pDLDhCQUFtQyxDQUNuQyx1Q0FDSixDQUVBLDRDQUVJLGtCQUFtQixDQURuQixZQUFhLENBR2IsUUFBUyxDQURULDZCQUVKLENBRUEsMkNBR0ksYUFBYyxDQURkLGdCQUFrQixDQURsQixlQUdKLENBRUEsNkdBQ0ksYUFDSixDQUVBLGdEQUVJLGFBQWMsQ0FEZCxnQkFFSixDQUVBLHViQUlJLGFBQ0osQ0FFQSw2Q0FLSSxhQUFjLENBSmQsWUFBYSxDQUdiLGdCQUFrQixDQURsQixZQUFhLENBRGIsNkJBSUosQ0FFQSxpREFFSSxrQkFBbUIsQ0FDbkIsbUJBQW9CLENBRnBCLFVBQVcsQ0FHWCxlQUNKLENBRUEsa0RBRUksaURBQW9ELENBRHBELFdBQVksQ0FFWix5QkFDSixDQUVBLG9PQUVJLGtCQUNKLENBRUEsMENBQ0ksWUFBYSxDQUNiLHFCQUFzQixDQUN0QixPQUFRLENBQ1IsZ0JBQWlCLENBQ2pCLGVBQWdCLENBQ2hCLGlCQUNKLENBRUEsb0NBT0ksZUFBZ0IsQ0FOaEIsd0JBQXlCLENBQ3pCLGtCQUFtQixDQUVuQixZQUFhLENBQ2IscUJBQXNCLENBQ3RCLE9BQVEsQ0FIUixXQUtKLENBRUEsc0dBRUksNkJBQWtDLENBRGxDLG9CQUVKLENBRUEsMENBRUksa0JBQW1CLENBRG5CLFlBQWEsQ0FHYixPQUFRLENBRFIsNkJBRUosQ0FFQSx3Q0FHSSxhQUFjLENBRmQsZUFBaUIsQ0FDakIsZUFBZ0IsQ0FFaEIsZUFBZ0IsQ0FDaEIsc0JBQXVCLENBQ3ZCLGtCQUNKLENBRUEsMEdBQ0ksYUFDSixDQUVBLDBDQUVJLGFBQWMsQ0FEZCxlQUVKLENBRUEsd0NBSUksYUFBYyxDQUhkLFlBQWEsQ0FFYixlQUFpQixDQURqQiw2QkFHSixDQUVBLCtDQUVJLGtCQUFtQixDQUNuQixtQkFBb0IsQ0FGcEIsVUFBVyxDQUdYLGVBQ0osQ0FFQSxnREFFSSxrQkFBbUIsQ0FEbkIsV0FBWSxDQUVaLHlCQUNKLENBRUEsMkNBQ0ksWUFBYSxDQUNiLE9BQ0osQ0FFQSw2Q0FFSSxrQkFBbUIsQ0FEbkIsd0JBQXlCLENBS3pCLGlCQUFrQixDQUhsQixhQUFjLENBSWQsY0FBZSxDQUhmLGVBQWlCLENBQ2pCLGVBQWdCLENBR2hCLCtCQUNKLENBRUEsbURBQ0ksa0JBQW1CLENBQ25CLG9CQUNKLENBRUEsK0dBRUksa0JBQW1CLENBRG5CLG9CQUFxQixDQUVyQixhQUNKLENBRUEscUhBQ0ksa0JBQW1CLENBQ25CLG9CQUNKLENBRUEseUNBRUksYUFBYyxDQURkLGVBRUosQ0FFQSw0Q0FDSSxHQUNJLFNBQ0osQ0FDQSxJQUNJLFNBQ0osQ0FDQSxJQUNJLFNBQ0osQ0FDQSxHQUNJLFNBQ0osQ0FDSiIsImZpbGUiOiJCb29rRWRpdG9yLm1vZHVsZS5jc3MiLCJzb3VyY2VzQ29udGVudCI6WyIuQm9va0VkaXRvciB7XG4gICAgLyogaGVpZ2h0OiA0NTBweDsgKi9cbiAgICB3aWR0aDogMTAwJTtcbn1cblxuLmJvb2tFZGl0b3JDb250YWluZXIge1xuICAgIHdpZHRoOiAxMDAlO1xuICAgIGhlaWdodDogMTAwJTtcbiAgICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gICAgcGFkZGluZzogMTBweCAyNXB4IDA7XG4gICAgYm94LXNpemluZzogYm9yZGVyLWJveDtcbn1cblxuLmJvb2tFZGl0b3JDb250YWluZXIuaXNWZXJib3NlIHtcbiAgICAvKiovXG4gICAgYmFja2dyb3VuZC1jb2xvcjogcmdiYSgwLCAwLCAwLCAwLjA1KTtcbiAgICBvdXRsaW5lOiAxcHggZG90dGVkIHJnYmEoMCwgMCwgMCwgMC41KTtcbiAgICAvKiovXG59XG5cbi5pc1ZlcmJvc2Uge1xuICAgIG91dGxpbmU6IDJweCBkb3R0ZWQgcmdiKDI1NSAxMTcgMzgpO1xufVxuXG4uYm9va0VkaXRvcldyYXBwZXIge1xuICAgIG92ZXJmbG93OiBoaWRkZW47XG4gICAgYm9yZGVyLXJhZGl1czogMXJlbTtcbiAgICBwYWRkaW5nLXRvcDogMTBweDtcbiAgICBib3JkZXI6IDFweCBzb2xpZCByZ2JhKDIwOSwgMjEzLCAyMTksIDAuOCk7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogd2hpdGU7XG4gICAgYm94LXNoYWRvdzogMCAxcHggMnB4IDAgcmdiYSgwLCAwLCAwLCAwLjA1KTtcbiAgICB0cmFuc2l0aW9uOiBib3gtc2hhZG93IDAuMnMgZWFzZS1pbi1vdXQ7XG59XG4uaXNWZXJib3NlIC5ib29rRWRpdG9yV3JhcHBlciB7XG4gICAgLyoqL1xuICAgIG92ZXJmbG93OiB2aXNpYmxlO1xuICAgIC8qKi9cbn1cblxuLmJvb2tFZGl0b3JXcmFwcGVyOmhvdmVyIHtcbiAgICBib3gtc2hhZG93OiAwIDRweCA2cHggLTFweCByZ2JhKDAsIDAsIDAsIDAuMSksIDAgMnB4IDRweCAtMXB4IHJnYmEoMCwgMCwgMCwgMC4wNik7XG59XG5cbi5Cb29rRWRpdG9yW2RhdGEtYm9vay1lZGl0b3ItdGhlbWU9J2RhcmsnXSAuYm9va0VkaXRvcldyYXBwZXIge1xuICAgIGJvcmRlci1jb2xvcjogcmdiYSg1MSwgNjUsIDg1LCAwLjkyKTtcbiAgICBiYWNrZ3JvdW5kOiBsaW5lYXItZ3JhZGllbnQoMTgwZGVnLCByZ2JhKDE1LCAyMywgNDIsIDAuOTgpLCByZ2JhKDgsIDE1LCAyOCwgMC45OCkpO1xuICAgIGJveC1zaGFkb3c6IDAgMjBweCA0NXB4IHJnYmEoMiwgNiwgMjMsIDAuNCk7XG59XG5cbi5Cb29rRWRpdG9yW2RhdGEtYm9vay1lZGl0b3ItdGhlbWU9J2RhcmsnXSAuYm9va0VkaXRvcldyYXBwZXI6aG92ZXIge1xuICAgIGJveC1zaGFkb3c6IDAgMjRweCA1MHB4IHJnYmEoMiwgNiwgMjMsIDAuNDgpO1xufVxuXG4uYm9va0VkaXRvcldyYXBwZXI6Zm9jdXMtd2l0aGluIHtcbiAgICAvKlxuICAgIG91dGxpbmU6IDJweCBzb2xpZCB0cmFuc3BhcmVudDtcbiAgICBvdXRsaW5lLW9mZnNldDogMnB4O1xuICAgIGJveC1zaGFkb3c6IDAgMCAwIDNweCByZ2JhKDk5LCAxMDIsIDI0MSwgMC40KTtcbiAgICAqL1xufVxuXG4uYm9va0VkaXRvcldyYXBwZXIuaXNCb3JkZXJSYWRpdXNEaXNhYmxlZCB7XG4gICAgYm9yZGVyLXJhZGl1czogMDtcbn1cblxuLmRyb3BPdmVybGF5IHtcbiAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgdG9wOiAwO1xuICAgIGxlZnQ6IDA7XG4gICAgcmlnaHQ6IDA7XG4gICAgYm90dG9tOiAwO1xuICAgIGJhY2tncm91bmQtY29sb3I6IHJnYmEoMCwgMCwgMCwgMC41KTtcbiAgICBjb2xvcjogd2hpdGU7XG4gICAgZGlzcGxheTogZmxleDtcbiAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICAgIGZvbnQtc2l6ZTogMS41cmVtO1xuICAgIHotaW5kZXg6IDEwMDtcbiAgICBwb2ludGVyLWV2ZW50czogbm9uZTtcbn1cblxuLypcbi5ib29rRWRpdG9yQ29udGFpbmVyIDpnbG9iYWwoLnZpZXctbGluZSkge1xuICAgIGJvcmRlci1ib3R0b206IDFweCBzb2xpZCAjZWVlOyAvKiA8LSBOb3RlOiBgUFJPTVBUQk9PS19TWU5UQVhfQ09MT1JTLkxJTkVgICogL1xufVxuKi9cblxuLmJvb2tFZGl0b3JBY3Rpb25iYXIge1xuICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgICB0b3A6IDEwcHg7XG4gICAgcmlnaHQ6IDU1cHg7XG4gICAgei1pbmRleDogMTAwO1xufVxuXG4uZnVsbHNjcmVlbiB7XG4gICAgcG9zaXRpb246IGZpeGVkO1xuICAgIHRvcDogMDtcbiAgICBsZWZ0OiAwO1xuICAgIHJpZ2h0OiAwO1xuICAgIGJvdHRvbTogMDtcbiAgICB3aWR0aDogMTAwJTtcbiAgICBoZWlnaHQ6IDEwMCU7XG4gICAgei1pbmRleDogOTk5OTtcbiAgICBib3JkZXItcmFkaXVzOiAwO1xuICAgIHBhZGRpbmctdG9wOiA1MHB4O1xuICAgIGJvcmRlcjogbm9uZTtcbiAgICBib3gtc2hhZG93OiBub25lO1xufVxuXG4uYnV0dG9uIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmZmO1xuICAgIGJvcmRlcjogMXB4IHNvbGlkICNkMWQ1ZGI7XG4gICAgYm9yZGVyLXJhZGl1czogMC4zNzVyZW07XG4gICAgcGFkZGluZzogMC41cmVtIDFyZW07XG4gICAgY3Vyc29yOiBwb2ludGVyO1xuICAgIGRpc3BsYXk6IGlubGluZS1mbGV4O1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgZ2FwOiAwLjVyZW07XG4gICAgY29sb3I6ICMzNzQxNTE7XG4gICAgYm94LXNoYWRvdzogMCAxcHggMnB4IDAgcmdiYSgwLCAwLCAwLCAwLjA1KTtcbiAgICB0cmFuc2l0aW9uOiBhbGwgMC4ycyBlYXNlLWluLW91dDtcbn1cblxuLmJ1dHRvbjpob3ZlciB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogI2Y5ZmFmYjtcbiAgICBib3JkZXItY29sb3I6ICNiN2JjY2U7XG4gICAgYm94LXNoYWRvdzogMCAxcHggM3B4IDAgcmdiYSgwLCAwLCAwLCAwLjEpLCAwIDFweCAycHggMCByZ2JhKDAsIDAsIDAsIDAuMDYpO1xufVxuXG4uQm9va0VkaXRvcltkYXRhLWJvb2stZWRpdG9yLXRoZW1lPSdkYXJrJ10gLmJ1dHRvbiB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogcmdiYSgxNSwgMjMsIDQyLCAwLjkyKTtcbiAgICBib3JkZXItY29sb3I6IHJnYmEoNzEsIDg1LCAxMDUsIDAuOSk7XG4gICAgY29sb3I6ICNlMmU4ZjA7XG4gICAgYm94LXNoYWRvdzogMCAxcHggMnB4IDAgcmdiYSgyLCA2LCAyMywgMC4zNSk7XG59XG5cbi5Cb29rRWRpdG9yW2RhdGEtYm9vay1lZGl0b3ItdGhlbWU9J2RhcmsnXSAuYnV0dG9uOmhvdmVyIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiByZ2JhKDMwLCA0MSwgNTksIDAuOTgpO1xuICAgIGJvcmRlci1jb2xvcjogcmdiYSgxMjUsIDIxMSwgMjUyLCAwLjUpO1xuICAgIGJveC1zaGFkb3c6IDAgMTBweCAyNHB4IHJnYmEoMiwgNiwgMjMsIDAuMzUpO1xufVxuXG4uc2F2ZWROb3RpZmljYXRpb24ge1xuICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgICB0b3A6IDUwJTtcbiAgICBsZWZ0OiA1MCU7XG4gICAgdHJhbnNmb3JtOiB0cmFuc2xhdGUoLTUwJSwgLTUwJSk7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogcmdiYSgwLCAwLCAwLCAwLjcpO1xuICAgIGNvbG9yOiB3aGl0ZTtcbiAgICBwYWRkaW5nOiAxcmVtIDJyZW07XG4gICAgYm9yZGVyLXJhZGl1czogMC41cmVtO1xuICAgIGZvbnQtc2l6ZTogMS4yNXJlbTtcbiAgICB6LWluZGV4OiAxMDAwO1xuICAgIHBvaW50ZXItZXZlbnRzOiBub25lO1xuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgICBnYXA6IDAuNXJlbTtcbiAgICBhbmltYXRpb246IGZhZGVPdXQgMnMgZm9yd2FyZHM7XG59XG5cbi5Cb29rRWRpdG9yW2RhdGEtYm9vay1lZGl0b3ItdGhlbWU9J2RhcmsnXSAuc2F2ZWROb3RpZmljYXRpb24ge1xuICAgIGJhY2tncm91bmQtY29sb3I6IHJnYmEoMiwgNiwgMjMsIDAuODYpO1xuICAgIGNvbG9yOiAjZTJlOGYwO1xuICAgIGJvcmRlcjogMXB4IHNvbGlkIHJnYmEoNTEsIDY1LCA4NSwgMC45KTtcbn1cblxuLnVwbG9hZFBhbmVsIHtcbiAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgcmlnaHQ6IDIwcHg7XG4gICAgYm90dG9tOiAyMHB4O1xuICAgIHdpZHRoOiA0MjBweDtcbiAgICBtYXgtd2lkdGg6IGNhbGMoMTAwJSAtIDQwcHgpO1xuICAgIGJhY2tncm91bmQ6IHJnYmEoMjU1LCAyNTUsIDI1NSwgMC45OCk7XG4gICAgYm9yZGVyOiAxcHggc29saWQgcmdiYSgyMDksIDIxMywgMjE5LCAwLjkpO1xuICAgIGJvcmRlci1yYWRpdXM6IDEycHg7XG4gICAgYm94LXNoYWRvdzogMCAxMnB4IDMwcHggcmdiYSgxNSwgMjMsIDQyLCAwLjE1KTtcbiAgICBwYWRkaW5nOiAxMnB4O1xuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcbiAgICBnYXA6IDEwcHg7XG4gICAgei1pbmRleDogMjIwO1xufVxuXG4uQm9va0VkaXRvcltkYXRhLWJvb2stZWRpdG9yLXRoZW1lPSdkYXJrJ10gLnVwbG9hZFBhbmVsIHtcbiAgICBiYWNrZ3JvdW5kOiByZ2JhKDgsIDE1LCAyOCwgMC45Nik7XG4gICAgYm9yZGVyLWNvbG9yOiByZ2JhKDUxLCA2NSwgODUsIDAuOSk7XG4gICAgYm94LXNoYWRvdzogMCAxOHB4IDQwcHggcmdiYSgyLCA2LCAyMywgMC40NSk7XG59XG5cbi51cGxvYWRQYW5lbEhlYWRlciB7XG4gICAgZGlzcGxheTogZmxleDtcbiAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgIGp1c3RpZnktY29udGVudDogc3BhY2UtYmV0d2VlbjtcbiAgICBnYXA6IDEycHg7XG59XG5cbi51cGxvYWRQYW5lbFRpdGxlIHtcbiAgICBmb250LXdlaWdodDogNjAwO1xuICAgIGZvbnQtc2l6ZTogMC45NXJlbTtcbiAgICBjb2xvcjogIzExMTgyNztcbn1cblxuLkJvb2tFZGl0b3JbZGF0YS1ib29rLWVkaXRvci10aGVtZT0nZGFyayddIC51cGxvYWRQYW5lbFRpdGxlIHtcbiAgICBjb2xvcjogI2Y4ZmFmYztcbn1cblxuLnVwbG9hZFBhbmVsSGVhZGVyTWV0YSB7XG4gICAgZm9udC1zaXplOiAwLjc1cmVtO1xuICAgIGNvbG9yOiAjNmI3MjgwO1xufVxuXG4uQm9va0VkaXRvcltkYXRhLWJvb2stZWRpdG9yLXRoZW1lPSdkYXJrJ10gLnVwbG9hZFBhbmVsSGVhZGVyTWV0YSxcbi5Cb29rRWRpdG9yW2RhdGEtYm9vay1lZGl0b3ItdGhlbWU9J2RhcmsnXSAudXBsb2FkUGFuZWxTdW1tYXJ5LFxuLkJvb2tFZGl0b3JbZGF0YS1ib29rLWVkaXRvci10aGVtZT0nZGFyayddIC51cGxvYWRSb3dTdGF0dXMsXG4uQm9va0VkaXRvcltkYXRhLWJvb2stZWRpdG9yLXRoZW1lPSdkYXJrJ10gLnVwbG9hZFJvd01ldGEge1xuICAgIGNvbG9yOiAjOTRhM2I4O1xufVxuXG4udXBsb2FkUGFuZWxTdW1tYXJ5IHtcbiAgICBkaXNwbGF5OiBncmlkO1xuICAgIGdyaWQtdGVtcGxhdGUtY29sdW1uczogMWZyIDFmcjtcbiAgICBnYXA6IDRweCAxMnB4O1xuICAgIGZvbnQtc2l6ZTogMC43NXJlbTtcbiAgICBjb2xvcjogIzZiNzI4MDtcbn1cblxuLnVwbG9hZFBhbmVsUHJvZ3Jlc3NCYXIge1xuICAgIGhlaWdodDogNnB4O1xuICAgIGJhY2tncm91bmQ6ICNlNWU3ZWI7XG4gICAgYm9yZGVyLXJhZGl1czogOTk5cHg7XG4gICAgb3ZlcmZsb3c6IGhpZGRlbjtcbn1cblxuLnVwbG9hZFBhbmVsUHJvZ3Jlc3NGaWxsIHtcbiAgICBoZWlnaHQ6IDEwMCU7XG4gICAgYmFja2dyb3VuZDogbGluZWFyLWdyYWRpZW50KDkwZGVnLCAjMjU2M2ViLCAjMTBiOTgxKTtcbiAgICB0cmFuc2l0aW9uOiB3aWR0aCAwLjJzIGVhc2U7XG59XG5cbi5Cb29rRWRpdG9yW2RhdGEtYm9vay1lZGl0b3ItdGhlbWU9J2RhcmsnXSAudXBsb2FkUGFuZWxQcm9ncmVzc0Jhcixcbi5Cb29rRWRpdG9yW2RhdGEtYm9vay1lZGl0b3ItdGhlbWU9J2RhcmsnXSAudXBsb2FkUm93UHJvZ3Jlc3NCYXIge1xuICAgIGJhY2tncm91bmQ6ICMxZTI5M2I7XG59XG5cbi51cGxvYWRQYW5lbExpc3Qge1xuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcbiAgICBnYXA6IDhweDtcbiAgICBtYXgtaGVpZ2h0OiAyMjBweDtcbiAgICBvdmVyZmxvdy15OiBhdXRvO1xuICAgIHBhZGRpbmctcmlnaHQ6IDRweDtcbn1cblxuLnVwbG9hZFJvdyB7XG4gICAgYm9yZGVyOiAxcHggc29saWQgI2U1ZTdlYjtcbiAgICBib3JkZXItcmFkaXVzOiAxMHB4O1xuICAgIHBhZGRpbmc6IDhweDtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47XG4gICAgZ2FwOiA2cHg7XG4gICAgYmFja2dyb3VuZDogI2ZmZjtcbn1cblxuLkJvb2tFZGl0b3JbZGF0YS1ib29rLWVkaXRvci10aGVtZT0nZGFyayddIC51cGxvYWRSb3cge1xuICAgIGJvcmRlci1jb2xvcjogIzMzNDE1NTtcbiAgICBiYWNrZ3JvdW5kOiByZ2JhKDE1LCAyMywgNDIsIDAuOTIpO1xufVxuXG4udXBsb2FkUm93SGVhZGVyIHtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAganVzdGlmeS1jb250ZW50OiBzcGFjZS1iZXR3ZWVuO1xuICAgIGdhcDogOHB4O1xufVxuXG4udXBsb2FkUm93TmFtZSB7XG4gICAgZm9udC1zaXplOiAwLjhyZW07XG4gICAgZm9udC13ZWlnaHQ6IDYwMDtcbiAgICBjb2xvcjogIzExMTgyNztcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xuICAgIHRleHQtb3ZlcmZsb3c6IGVsbGlwc2lzO1xuICAgIHdoaXRlLXNwYWNlOiBub3dyYXA7XG59XG5cbi5Cb29rRWRpdG9yW2RhdGEtYm9vay1lZGl0b3ItdGhlbWU9J2RhcmsnXSAudXBsb2FkUm93TmFtZSB7XG4gICAgY29sb3I6ICNmOGZhZmM7XG59XG5cbi51cGxvYWRSb3dTdGF0dXMge1xuICAgIGZvbnQtc2l6ZTogMC43cmVtO1xuICAgIGNvbG9yOiAjNmI3MjgwO1xufVxuXG4udXBsb2FkUm93TWV0YSB7XG4gICAgZGlzcGxheTogZmxleDtcbiAgICBqdXN0aWZ5LWNvbnRlbnQ6IHNwYWNlLWJldHdlZW47XG4gICAgZm9udC1zaXplOiAwLjdyZW07XG4gICAgY29sb3I6ICM2YjcyODA7XG59XG5cbi51cGxvYWRSb3dQcm9ncmVzc0JhciB7XG4gICAgaGVpZ2h0OiA0cHg7XG4gICAgYmFja2dyb3VuZDogI2U1ZTdlYjtcbiAgICBib3JkZXItcmFkaXVzOiA5OTlweDtcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xufVxuXG4udXBsb2FkUm93UHJvZ3Jlc3NGaWxsIHtcbiAgICBoZWlnaHQ6IDEwMCU7XG4gICAgYmFja2dyb3VuZDogIzNiODJmNjtcbiAgICB0cmFuc2l0aW9uOiB3aWR0aCAwLjJzIGVhc2U7XG59XG5cbi51cGxvYWRSb3dBY3Rpb25zIHtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGdhcDogNnB4O1xufVxuXG4udXBsb2FkQWN0aW9uQnV0dG9uIHtcbiAgICBib3JkZXI6IDFweCBzb2xpZCAjZDFkNWRiO1xuICAgIGJhY2tncm91bmQ6ICNmOWZhZmI7XG4gICAgY29sb3I6ICMzNzQxNTE7XG4gICAgZm9udC1zaXplOiAwLjdyZW07XG4gICAgcGFkZGluZzogMnB4IDhweDtcbiAgICBib3JkZXItcmFkaXVzOiA2cHg7XG4gICAgY3Vyc29yOiBwb2ludGVyO1xuICAgIHRyYW5zaXRpb246IGFsbCAwLjE1cyBlYXNlLWluLW91dDtcbn1cblxuLnVwbG9hZEFjdGlvbkJ1dHRvbjpob3ZlciB7XG4gICAgYmFja2dyb3VuZDogI2VlZjJmNztcbiAgICBib3JkZXItY29sb3I6ICNjYmQ1ZjU7XG59XG5cbi5Cb29rRWRpdG9yW2RhdGEtYm9vay1lZGl0b3ItdGhlbWU9J2RhcmsnXSAudXBsb2FkQWN0aW9uQnV0dG9uIHtcbiAgICBib3JkZXItY29sb3I6ICM0NzU1Njk7XG4gICAgYmFja2dyb3VuZDogIzBmMTcyYTtcbiAgICBjb2xvcjogI2UyZThmMDtcbn1cblxuLkJvb2tFZGl0b3JbZGF0YS1ib29rLWVkaXRvci10aGVtZT0nZGFyayddIC51cGxvYWRBY3Rpb25CdXR0b246aG92ZXIge1xuICAgIGJhY2tncm91bmQ6ICMxZTI5M2I7XG4gICAgYm9yZGVyLWNvbG9yOiAjN2RkM2ZjO1xufVxuXG4udXBsb2FkUm93RXJyb3Ige1xuICAgIGZvbnQtc2l6ZTogMC43cmVtO1xuICAgIGNvbG9yOiAjYjkxYzFjO1xufVxuXG5Aa2V5ZnJhbWVzIGZhZGVPdXQge1xuICAgIDAlIHtcbiAgICAgICAgb3BhY2l0eTogMDtcbiAgICB9XG4gICAgMTAlIHtcbiAgICAgICAgb3BhY2l0eTogMTtcbiAgICB9XG4gICAgNzAlIHtcbiAgICAgICAgb3BhY2l0eTogMTtcbiAgICB9XG4gICAgMTAwJSB7XG4gICAgICAgIG9wYWNpdHk6IDA7XG4gICAgfVxufVxuIl19 */";
+var styles$d = {"BookEditor":"BookEditor-module_BookEditor__s-0PU","bookEditorContainer":"BookEditor-module_bookEditorContainer__wLMwM","isVerbose":"BookEditor-module_isVerbose__VQ6iL","bookEditorWrapper":"BookEditor-module_bookEditorWrapper__twppD","isBorderRadiusDisabled":"BookEditor-module_isBorderRadiusDisabled__h1I3v","dropOverlay":"BookEditor-module_dropOverlay__xWWoX","bookEditorActionbar":"BookEditor-module_bookEditorActionbar__KW6dc","fullscreen":"BookEditor-module_fullscreen__rktsl","button":"BookEditor-module_button__hS390","savedNotification":"BookEditor-module_savedNotification__OiX9L","fadeOut":"BookEditor-module_fadeOut__q8JnR","uploadPanel":"BookEditor-module_uploadPanel__2JJtD","uploadPanelHeader":"BookEditor-module_uploadPanelHeader__pdJd2","uploadPanelTitle":"BookEditor-module_uploadPanelTitle__TJIVF","uploadPanelHeaderMeta":"BookEditor-module_uploadPanelHeaderMeta__Xw0uI","uploadPanelSummary":"BookEditor-module_uploadPanelSummary__rwSbG","uploadRowStatus":"BookEditor-module_uploadRowStatus__jsUb-","uploadRowMeta":"BookEditor-module_uploadRowMeta__1lz9h","uploadPanelProgressBar":"BookEditor-module_uploadPanelProgressBar__a6pjf","uploadPanelProgressFill":"BookEditor-module_uploadPanelProgressFill__l-TKR","uploadRowProgressBar":"BookEditor-module_uploadRowProgressBar__NoBA7","uploadPanelList":"BookEditor-module_uploadPanelList__VxEd5","uploadRow":"BookEditor-module_uploadRow__QiSFg","uploadRowHeader":"BookEditor-module_uploadRowHeader__po0j5","uploadRowName":"BookEditor-module_uploadRowName__doQRO","uploadRowProgressFill":"BookEditor-module_uploadRowProgressFill__TrP7e","uploadRowActions":"BookEditor-module_uploadRowActions__5Y1Mq","uploadActionButton":"BookEditor-module_uploadActionButton__CqJrr","uploadRowError":"BookEditor-module_uploadRowError__eEHWw"};
 styleInject(css_248z$d);
 
 /**
@@ -18928,7 +18940,7 @@ function resolveCodeBlockLanguage(language) {
     return CODE_BLOCK_LANGUAGE_ALIASES[normalizedLanguage] || 'plaintext';
 }
 
-var css_248z$c = ".CodeBlock-module_CodeBlock__6K33Z{border:1px solid #444;border-radius:5px;margin:10px 0;max-width:100%;overflow:hidden;width:100%}.CodeBlock-module_CodeBlockHeader__tfOwl{align-items:center;background-color:#2d2d2d;border-bottom:1px solid #444;color:#ccc;display:flex;font-size:.8em;justify-content:space-between;padding:5px 10px}.CodeBlock-module_CodeBlockButtons__rz1VO{display:flex;gap:8px}.CodeBlock-module_CopyButton__M07tp,.CodeBlock-module_CreateAgentButton__kUEnp,.CodeBlock-module_DownloadButton__ZTrzQ{align-items:center;background:transparent;border:none;color:#aaa;cursor:pointer;display:flex;font-size:inherit;gap:5px;padding:0;transition:color .2s}.CodeBlock-module_CopyButton__M07tp:hover,.CodeBlock-module_CreateAgentButton__kUEnp:hover,.CodeBlock-module_DownloadButton__ZTrzQ:hover{color:#fff}.CodeBlock-module_CodeBlock__6K33Z .monaco-editor,.CodeBlock-module_CodeBlock__6K33Z .monaco-editor .overflow-guard{max-width:100%}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNvZGVCbG9jay5tb2R1bGUuY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLG1DQUlJLHFCQUFzQixDQUZ0QixpQkFBa0IsQ0FEbEIsYUFBYyxDQUtkLGNBQWUsQ0FIZixlQUFnQixDQUVoQixVQUVKLENBRUEseUNBUUksa0JBQW1CLENBUG5CLHdCQUF5QixDQUl6Qiw0QkFBNkIsQ0FIN0IsVUFBVyxDQUlYLFlBQWEsQ0FGYixjQUFnQixDQUdoQiw2QkFBOEIsQ0FKOUIsZ0JBTUosQ0FFQSwwQ0FDSSxZQUFhLENBQ2IsT0FDSixDQUVBLHVIQVVJLGtCQUFtQixDQVBuQixzQkFBdUIsQ0FDdkIsV0FBWSxDQUNaLFVBQVcsQ0FDWCxjQUFlLENBR2YsWUFBYSxDQUZiLGlCQUFrQixDQUlsQixPQUFRLENBSFIsU0FBVSxDQUlWLG9CQUNKLENBRUEseUlBR0ksVUFDSixDQUVBLG9IQUVJLGNBQ0oiLCJmaWxlIjoiQ29kZUJsb2NrLm1vZHVsZS5jc3MiLCJzb3VyY2VzQ29udGVudCI6WyIuQ29kZUJsb2NrIHtcbiAgICBtYXJnaW46IDEwcHggMDtcbiAgICBib3JkZXItcmFkaXVzOiA1cHg7XG4gICAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgICBib3JkZXI6IDFweCBzb2xpZCAjNDQ0OyAvKiBEYXJrIG1vZGUgYm9yZGVyICovXG4gICAgd2lkdGg6IDEwMCU7XG4gICAgbWF4LXdpZHRoOiAxMDAlO1xufVxuXG4uQ29kZUJsb2NrSGVhZGVyIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiAjMmQyZDJkO1xuICAgIGNvbG9yOiAjY2NjO1xuICAgIHBhZGRpbmc6IDVweCAxMHB4O1xuICAgIGZvbnQtc2l6ZTogMC44ZW07XG4gICAgYm9yZGVyLWJvdHRvbTogMXB4IHNvbGlkICM0NDQ7XG4gICAgZGlzcGxheTogZmxleDtcbiAgICBqdXN0aWZ5LWNvbnRlbnQ6IHNwYWNlLWJldHdlZW47XG4gICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbn1cblxuLkNvZGVCbG9ja0J1dHRvbnMge1xuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgZ2FwOiA4cHg7XG59XG5cbi5Db3B5QnV0dG9uLFxuLkRvd25sb2FkQnV0dG9uLFxuLkNyZWF0ZUFnZW50QnV0dG9uIHtcbiAgICBiYWNrZ3JvdW5kOiB0cmFuc3BhcmVudDtcbiAgICBib3JkZXI6IG5vbmU7XG4gICAgY29sb3I6ICNhYWE7XG4gICAgY3Vyc29yOiBwb2ludGVyO1xuICAgIGZvbnQtc2l6ZTogaW5oZXJpdDtcbiAgICBwYWRkaW5nOiAwO1xuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgICBnYXA6IDVweDtcbiAgICB0cmFuc2l0aW9uOiBjb2xvciAwLjJzO1xufVxuXG4uQ29weUJ1dHRvbjpob3Zlcixcbi5Eb3dubG9hZEJ1dHRvbjpob3Zlcixcbi5DcmVhdGVBZ2VudEJ1dHRvbjpob3ZlciB7XG4gICAgY29sb3I6ICNmZmY7XG59XG5cbi5Db2RlQmxvY2sgOmdsb2JhbCgubW9uYWNvLWVkaXRvciksXG4uQ29kZUJsb2NrIDpnbG9iYWwoLm1vbmFjby1lZGl0b3IgLm92ZXJmbG93LWd1YXJkKSB7XG4gICAgbWF4LXdpZHRoOiAxMDAlO1xufVxuIl19 */";
+var css_248z$c = ".CodeBlock-module_CodeBlock__6K33Z{background:#fff;border:1px solid #d0d7e2;border-radius:5px;margin:10px 0;max-width:100%;overflow:hidden;width:100%}.CodeBlock-module_CodeBlockHeader__tfOwl{align-items:center;background-color:#f8fafc;border-bottom:1px solid #d0d7e2;color:#475569;display:flex;font-size:.8em;justify-content:space-between;padding:5px 10px}.CodeBlock-module_CodeBlockButtons__rz1VO{display:flex;gap:8px}.CodeBlock-module_CopyButton__M07tp,.CodeBlock-module_CreateAgentButton__kUEnp,.CodeBlock-module_DownloadButton__ZTrzQ{align-items:center;background:transparent;border:none;color:#64748b;cursor:pointer;display:flex;font-size:inherit;gap:5px;padding:0;transition:color .2s}.CodeBlock-module_CopyButton__M07tp:hover,.CodeBlock-module_CreateAgentButton__kUEnp:hover,.CodeBlock-module_DownloadButton__ZTrzQ:hover{color:#0f172a}.CodeBlock-module_CodeBlock__6K33Z[data-code-theme=dark]{background:#0f172a;border-color:#334155}.CodeBlock-module_CodeBlock__6K33Z[data-code-theme=dark] .CodeBlock-module_CodeBlockHeader__tfOwl{background-color:#111827;border-bottom-color:#334155;color:#cbd5e1}.CodeBlock-module_CodeBlock__6K33Z[data-code-theme=dark] .CodeBlock-module_CopyButton__M07tp,.CodeBlock-module_CodeBlock__6K33Z[data-code-theme=dark] .CodeBlock-module_CreateAgentButton__kUEnp,.CodeBlock-module_CodeBlock__6K33Z[data-code-theme=dark] .CodeBlock-module_DownloadButton__ZTrzQ{color:#94a3b8}.CodeBlock-module_CodeBlock__6K33Z[data-code-theme=dark] .CodeBlock-module_CopyButton__M07tp:hover,.CodeBlock-module_CodeBlock__6K33Z[data-code-theme=dark] .CodeBlock-module_CreateAgentButton__kUEnp:hover,.CodeBlock-module_CodeBlock__6K33Z[data-code-theme=dark] .CodeBlock-module_DownloadButton__ZTrzQ:hover{color:#f8fafc}.CodeBlock-module_CodeBlock__6K33Z .monaco-editor,.CodeBlock-module_CodeBlock__6K33Z .monaco-editor .overflow-guard{max-width:100%}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNvZGVCbG9jay5tb2R1bGUuY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLG1DQUtJLGVBQW1CLENBRG5CLHdCQUF5QixDQUZ6QixpQkFBa0IsQ0FEbEIsYUFBYyxDQU1kLGNBQWUsQ0FKZixlQUFnQixDQUdoQixVQUVKLENBRUEseUNBUUksa0JBQW1CLENBUG5CLHdCQUF5QixDQUl6QiwrQkFBZ0MsQ0FIaEMsYUFBYyxDQUlkLFlBQWEsQ0FGYixjQUFnQixDQUdoQiw2QkFBOEIsQ0FKOUIsZ0JBTUosQ0FFQSwwQ0FDSSxZQUFhLENBQ2IsT0FDSixDQUVBLHVIQVVJLGtCQUFtQixDQVBuQixzQkFBdUIsQ0FDdkIsV0FBWSxDQUNaLGFBQWMsQ0FDZCxjQUFlLENBR2YsWUFBYSxDQUZiLGlCQUFrQixDQUlsQixPQUFRLENBSFIsU0FBVSxDQUlWLG9CQUNKLENBRUEseUlBR0ksYUFDSixDQUVBLHlEQUVJLGtCQUFtQixDQURuQixvQkFFSixDQUVBLGtHQUNJLHdCQUF5QixDQUV6QiwyQkFBNEIsQ0FENUIsYUFFSixDQUVBLGtTQUdJLGFBQ0osQ0FFQSxvVEFHSSxhQUNKLENBRUEsb0hBRUksY0FDSiIsImZpbGUiOiJDb2RlQmxvY2subW9kdWxlLmNzcyIsInNvdXJjZXNDb250ZW50IjpbIi5Db2RlQmxvY2sge1xuICAgIG1hcmdpbjogMTBweCAwO1xuICAgIGJvcmRlci1yYWRpdXM6IDVweDtcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xuICAgIGJvcmRlcjogMXB4IHNvbGlkICNkMGQ3ZTI7XG4gICAgYmFja2dyb3VuZDogI2ZmZmZmZjtcbiAgICB3aWR0aDogMTAwJTtcbiAgICBtYXgtd2lkdGg6IDEwMCU7XG59XG5cbi5Db2RlQmxvY2tIZWFkZXIge1xuICAgIGJhY2tncm91bmQtY29sb3I6ICNmOGZhZmM7XG4gICAgY29sb3I6ICM0NzU1Njk7XG4gICAgcGFkZGluZzogNXB4IDEwcHg7XG4gICAgZm9udC1zaXplOiAwLjhlbTtcbiAgICBib3JkZXItYm90dG9tOiAxcHggc29saWQgI2QwZDdlMjtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGp1c3RpZnktY29udGVudDogc3BhY2UtYmV0d2VlbjtcbiAgICBhbGlnbi1pdGVtczogY2VudGVyO1xufVxuXG4uQ29kZUJsb2NrQnV0dG9ucyB7XG4gICAgZGlzcGxheTogZmxleDtcbiAgICBnYXA6IDhweDtcbn1cblxuLkNvcHlCdXR0b24sXG4uRG93bmxvYWRCdXR0b24sXG4uQ3JlYXRlQWdlbnRCdXR0b24ge1xuICAgIGJhY2tncm91bmQ6IHRyYW5zcGFyZW50O1xuICAgIGJvcmRlcjogbm9uZTtcbiAgICBjb2xvcjogIzY0NzQ4YjtcbiAgICBjdXJzb3I6IHBvaW50ZXI7XG4gICAgZm9udC1zaXplOiBpbmhlcml0O1xuICAgIHBhZGRpbmc6IDA7XG4gICAgZGlzcGxheTogZmxleDtcbiAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgIGdhcDogNXB4O1xuICAgIHRyYW5zaXRpb246IGNvbG9yIDAuMnM7XG59XG5cbi5Db3B5QnV0dG9uOmhvdmVyLFxuLkRvd25sb2FkQnV0dG9uOmhvdmVyLFxuLkNyZWF0ZUFnZW50QnV0dG9uOmhvdmVyIHtcbiAgICBjb2xvcjogIzBmMTcyYTtcbn1cblxuLkNvZGVCbG9ja1tkYXRhLWNvZGUtdGhlbWU9J2RhcmsnXSB7XG4gICAgYm9yZGVyLWNvbG9yOiAjMzM0MTU1O1xuICAgIGJhY2tncm91bmQ6ICMwZjE3MmE7XG59XG5cbi5Db2RlQmxvY2tbZGF0YS1jb2RlLXRoZW1lPSdkYXJrJ10gLkNvZGVCbG9ja0hlYWRlciB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogIzExMTgyNztcbiAgICBjb2xvcjogI2NiZDVlMTtcbiAgICBib3JkZXItYm90dG9tLWNvbG9yOiAjMzM0MTU1O1xufVxuXG4uQ29kZUJsb2NrW2RhdGEtY29kZS10aGVtZT0nZGFyayddIC5Db3B5QnV0dG9uLFxuLkNvZGVCbG9ja1tkYXRhLWNvZGUtdGhlbWU9J2RhcmsnXSAuRG93bmxvYWRCdXR0b24sXG4uQ29kZUJsb2NrW2RhdGEtY29kZS10aGVtZT0nZGFyayddIC5DcmVhdGVBZ2VudEJ1dHRvbiB7XG4gICAgY29sb3I6ICM5NGEzYjg7XG59XG5cbi5Db2RlQmxvY2tbZGF0YS1jb2RlLXRoZW1lPSdkYXJrJ10gLkNvcHlCdXR0b246aG92ZXIsXG4uQ29kZUJsb2NrW2RhdGEtY29kZS10aGVtZT0nZGFyayddIC5Eb3dubG9hZEJ1dHRvbjpob3Zlcixcbi5Db2RlQmxvY2tbZGF0YS1jb2RlLXRoZW1lPSdkYXJrJ10gLkNyZWF0ZUFnZW50QnV0dG9uOmhvdmVyIHtcbiAgICBjb2xvcjogI2Y4ZmFmYztcbn1cblxuLkNvZGVCbG9jayA6Z2xvYmFsKC5tb25hY28tZWRpdG9yKSxcbi5Db2RlQmxvY2sgOmdsb2JhbCgubW9uYWNvLWVkaXRvciAub3ZlcmZsb3ctZ3VhcmQpIHtcbiAgICBtYXgtd2lkdGg6IDEwMCU7XG59XG4iXX0= */";
 var styles$c = {"CodeBlock":"CodeBlock-module_CodeBlock__6K33Z","CodeBlockHeader":"CodeBlock-module_CodeBlockHeader__tfOwl","CodeBlockButtons":"CodeBlock-module_CodeBlockButtons__rz1VO","CopyButton":"CodeBlock-module_CopyButton__M07tp","DownloadButton":"CodeBlock-module_DownloadButton__ZTrzQ","CreateAgentButton":"CodeBlock-module_CreateAgentButton__kUEnp"};
 styleInject(css_248z$c);
 
@@ -18974,7 +18986,7 @@ function createCodeBlockMonacoModelPath(reactId, language) {
  *
  * @private Internal utility of `<ChatMessage />` component
  */
-function CodeBlock({ code, language, className, onCreateAgent }) {
+function CodeBlock({ code, language, className, onCreateAgent, theme = 'LIGHT' }) {
     const reactId = useId();
     const normalizedLanguage = resolveCodeBlockLanguage(language);
     const isBookLanguage = normalizedLanguage === 'book';
@@ -19007,9 +19019,9 @@ function CodeBlock({ code, language, className, onCreateAgent }) {
     };
     const header = language ? (jsxs("div", { className: styles$c.CodeBlockHeader, children: [jsx("span", { children: language }), jsxs("div", { className: styles$c.CodeBlockButtons, children: [jsx("button", { onClick: handleCopy, className: styles$c.CopyButton, title: "Copy to clipboard", children: copied ? 'Copied!' : 'Copy' }), jsx("button", { onClick: handleDownload, className: styles$c.DownloadButton, title: "Download code", children: "Download" }), isBookLanguage && onCreateAgent && (jsx("button", { onClick: () => onCreateAgent(code), className: styles$c.CreateAgentButton, title: "Create agent from this book", children: "Create Agent" }))] })] })) : null;
     if (isBookLanguage) {
-        return (jsxs("div", { className: classNames(styles$c.CodeBlock, className), children: [header, jsx(BookEditor, { value: code, isReadonly: true, height: lines * 25 /* <- [🧠] A bit more than 19px to accommodate BookEditor lines */ })] }));
+        return (jsxs("div", { className: classNames(styles$c.CodeBlock, className), "data-code-theme": theme.toLowerCase(), children: [header, jsx(BookEditor, { value: code, isReadonly: true, height: lines * 25 /* <- [🧠] A bit more than 19px to accommodate BookEditor lines */, theme: theme })] }));
     }
-    return (jsxs("div", { className: classNames(styles$c.CodeBlock, className), children: [header, jsx(MonacoEditorWithShadowDom, { height: `${height}px`, language: normalizedLanguage, path: modelPath, value: code, theme: "vs-dark", options: {
+    return (jsxs("div", { className: classNames(styles$c.CodeBlock, className), "data-code-theme": theme.toLowerCase(), children: [header, jsx(MonacoEditorWithShadowDom, { height: `${height}px`, language: normalizedLanguage, path: modelPath, value: code, theme: theme === 'DARK' ? 'vs-dark' : 'vs-light', options: {
                     readOnly: true,
                     minimap: { enabled: false },
                     automaticLayout: true,
@@ -20506,12 +20518,91 @@ const NOTE_LIKE_COMMITMENT_GROUPS = [
  * @private function of BookEditorMonaco
  */
 const BOOK_EDITOR_LANGUAGE_INITIALIZED_FLAG = 'promptbookBookEditorLanguageInitialized';
+/**
+ * Internal Monaco flag used to avoid re-defining the Book theme when the requested mode stays unchanged.
+ *
+ * @private function of BookEditorMonaco
+ */
+const BOOK_EDITOR_THEME_MODE_FLAG = 'promptbookBookEditorThemeMode';
 /**
  * Matches fenced code-block delimiters, including optional leading indentation.
  *
  * @private function of BookEditorMonaco
  */
 const CODE_BLOCK_FENCE_REGEX = /^\s*```.*$/;
+/**
+ * Shared token rules reused by both light and dark Book Monaco themes.
+ *
+ * @private function of BookEditorMonaco
+ */
+const BOOK_EDITOR_THEME_RULES = [
+    {
+        token: 'title',
+        foreground: PROMPTBOOK_SYNTAX_COLORS.TITLE.toHex(),
+        fontStyle: 'bold underline',
+    },
+    {
+        token: 'commitment',
+        foreground: PROMPTBOOK_SYNTAX_COLORS.COMMITMENT.toHex(),
+        fontStyle: 'bold',
+    },
+    {
+        token: 'note-commitment',
+        foreground: PROMPTBOOK_SYNTAX_COLORS.NOTE_COMMITMENT.toHex(),
+    },
+    {
+        token: 'todo-commitment',
+        foreground: PROMPTBOOK_SYNTAX_COLORS.TODO_COMMITMENT_TEXT.toHex(),
+        background: PROMPTBOOK_SYNTAX_COLORS.TODO_COMMITMENT_BACKGROUND.toHex(),
+        fontStyle: 'bold',
+    },
+    {
+        token: 'parameter',
+        foreground: PROMPTBOOK_SYNTAX_COLORS.PARAMETER.toHex(),
+        fontStyle: 'italic',
+    },
+    {
+        token: 'agent-reference',
+        foreground: PROMPTBOOK_SYNTAX_COLORS.COMMITMENT.toHex(),
+        fontStyle: 'underline',
+    },
+    {
+        token: 'code-block',
+        foreground: PROMPTBOOK_SYNTAX_COLORS.CODE_BLOCK.toHex(),
+    },
+];
+/**
+ * Re-defines the shared Book Monaco theme according to the requested light/dark mode.
+ *
+ * @private function of BookEditorMonaco
+ */
+function applyBookEditorMonacoTheme(monaco, theme) {
+    const colors = theme === 'DARK'
+        ? {
+            'editor.background': '#09111f',
+            'editor.foreground': '#e2e8f0',
+            'editorLineNumber.foreground': '#64748b',
+            'editorLineNumber.activeForeground': '#cbd5e1',
+            'editorCursor.foreground': '#7dd3fc',
+            'editor.selectionBackground': '#1d4ed866',
+            'editor.inactiveSelectionBackground': '#1e3a8a44',
+            'editor.scrollbarSlider.background': '#334155',
+            'editor.scrollbarSlider.hoverBackground': '#475569',
+            'editor.scrollbarSlider.activeBackground': '#64748b',
+        }
+        : {
+            'editor.scrollbarSlider.background': '#E0E0E0',
+            'editor.scrollbarSlider.hoverBackground': '#D0D0D0',
+            'editor.scrollbarSlider.activeBackground': '#C0C0C0',
+        };
+    monaco.editor.defineTheme(BookEditorMonacoConstants.BOOK_THEME_ID, {
+        base: theme === 'DARK' ? 'vs-dark' : 'vs',
+        inherit: true,
+        rules: [...BOOK_EDITOR_THEME_RULES],
+        colors,
+    });
+    monaco.editor.setTheme(BookEditorMonacoConstants.BOOK_THEME_ID);
+}
 /**
  * Builds a regex that matches one commitment keyword at line start.
  *
@@ -20589,13 +20680,19 @@ function createNoteLikeBodyRules(token, commitmentTransitionRules) {
  *
  * @private function of BookEditorMonaco
  */
-function ensureBookEditorMonacoLanguage(monaco) {
+function ensureBookEditorMonacoLanguage(monaco, theme = 'LIGHT') {
     const monacoWithLanguageState = monaco;
     if (monacoWithLanguageState[BOOK_EDITOR_LANGUAGE_INITIALIZED_FLAG]) {
+        if (monacoWithLanguageState[BOOK_EDITOR_THEME_MODE_FLAG] !== theme) {
+            applyBookEditorMonacoTheme(monaco, theme);
+            monacoWithLanguageState[BOOK_EDITOR_THEME_MODE_FLAG] = theme;
+            return;
+        }
         monaco.editor.setTheme(BookEditorMonacoConstants.BOOK_THEME_ID);
         return;
     }
     monacoWithLanguageState[BOOK_EDITOR_LANGUAGE_INITIALIZED_FLAG] = true;
+    monacoWithLanguageState[BOOK_EDITOR_THEME_MODE_FLAG] = theme;
     monaco.languages.register({ id: BookEditorMonacoConstants.BOOK_LANGUAGE_ID });
     const commitmentDefinitions = getAllCommitmentDefinitions();
     const commitmentTypes = [...new Set(commitmentDefinitions.map(({ type }) => type))];
@@ -20690,52 +20787,7 @@ function ensureBookEditorMonacoLanguage(monaco) {
             return { links };
         },
     });
-    monaco.editor.defineTheme(BookEditorMonacoConstants.BOOK_THEME_ID, {
-        base: 'vs',
-        inherit: true,
-        rules: [
-            {
-                token: 'title',
-                foreground: PROMPTBOOK_SYNTAX_COLORS.TITLE.toHex(),
-                fontStyle: 'bold underline',
-            },
-            {
-                token: 'commitment',
-                foreground: PROMPTBOOK_SYNTAX_COLORS.COMMITMENT.toHex(),
-                fontStyle: 'bold',
-            },
-            {
-                token: 'note-commitment',
-                foreground: PROMPTBOOK_SYNTAX_COLORS.NOTE_COMMITMENT.toHex(),
-            },
-            {
-                token: 'todo-commitment',
-                foreground: PROMPTBOOK_SYNTAX_COLORS.TODO_COMMITMENT_TEXT.toHex(),
-                background: PROMPTBOOK_SYNTAX_COLORS.TODO_COMMITMENT_BACKGROUND.toHex(),
-                fontStyle: 'bold',
-            },
-            {
-                token: 'parameter',
-                foreground: PROMPTBOOK_SYNTAX_COLORS.PARAMETER.toHex(),
-                fontStyle: 'italic',
-            },
-            {
-                token: 'agent-reference',
-                foreground: PROMPTBOOK_SYNTAX_COLORS.COMMITMENT.toHex(),
-                fontStyle: 'underline',
-            },
-            {
-                token: 'code-block',
-                foreground: PROMPTBOOK_SYNTAX_COLORS.CODE_BLOCK.toHex(),
-            },
-        ],
-        colors: {
-            'editor.scrollbarSlider.background': '#E0E0E0',
-            'editor.scrollbarSlider.hoverBackground': '#D0D0D0',
-            'editor.scrollbarSlider.activeBackground': '#C0C0C0',
-        },
-    });
-    monaco.editor.setTheme(BookEditorMonacoConstants.BOOK_THEME_ID);
+    applyBookEditorMonacoTheme(monaco, theme);
 }
 /**
  * Ensures the mounted Monaco editor model uses Book language and Book theme.
@@ -20748,8 +20800,8 @@ function ensureBookEditorMonacoLanguage(monaco) {
  * @private function of BookEditorMonaco
  */
 function ensureBookEditorMonacoLanguageForEditor(props) {
-    const { monaco, monacoEditor } = props;
-    ensureBookEditorMonacoLanguage(monaco);
+    const { monaco, monacoEditor, theme = 'LIGHT' } = props;
+    ensureBookEditorMonacoLanguage(monaco, theme);
     const model = monacoEditor.getModel();
     if (!model) {
         return;
@@ -20764,13 +20816,13 @@ function ensureBookEditorMonacoLanguageForEditor(props) {
  *
  * @private function of BookEditorMonaco
  */
-function useBookEditorMonacoLanguage({ monaco }) {
+function useBookEditorMonacoLanguage({ monaco, theme }) {
     useEffect(() => {
         if (!monaco) {
             return;
         }
-        ensureBookEditorMonacoLanguage(monaco);
-    }, [monaco]);
+        ensureBookEditorMonacoLanguage(monaco, theme);
+    }, [monaco, theme]);
 }
 
 /**
@@ -20784,9 +20836,13 @@ const BACKGROUND_POSITION_Y_MULTIPLIER = -0.1;
  *
  * @private function of BookEditorMonaco
  */
-function useBookEditorMonacoStyles({ instanceClass, scaledLineHeight, scaledContentPaddingLeft, scaledVerticalLineLeft, zoomLevel, }) {
+function useBookEditorMonacoStyles({ instanceClass, scaledLineHeight, scaledContentPaddingLeft, scaledVerticalLineLeft, zoomLevel, theme, }) {
     useEffect(() => {
         const styleId = `notebook-margin-line-style-${instanceClass}`;
+        const lineColor = theme === 'DARK' ? '#1f2937' : PROMPTBOOK_SYNTAX_COLORS.LINE.toHex();
+        const separatorColor = theme === 'DARK' ? '#334155' : PROMPTBOOK_SYNTAX_COLORS.SEPARATOR.toHex();
+        const codeBlockBackground = theme === 'DARK' ? '#0f172a99' : '#f5f5f566';
+        const codeBlockBorderColor = theme === 'DARK' ? '#38bdf8aa' : PROMPTBOOK_SYNTAX_COLORS.CODE_BLOCK.toHex();
         let style = document.getElementById(styleId);
         if (!style) {
             style = document.createElement('style');
@@ -20799,7 +20855,7 @@ function useBookEditorMonacoStyles({ instanceClass, scaledLineHeight, scaledCont
             /* <- [🚚] */
 
             .${instanceClass} .monaco-editor .view-lines {
-                background-image: linear-gradient(to bottom, transparent ${scaledLineHeight - 1}px, ${PROMPTBOOK_SYNTAX_COLORS.LINE.toHex()} ${scaledLineHeight - 1}px);
+                background-image: linear-gradient(to bottom, transparent ${scaledLineHeight - 1}px, ${lineColor} ${scaledLineHeight - 1}px);
                 background-size: calc(100% + ${scaledContentPaddingLeft}px) ${scaledLineHeight}px;
                 background-position-x: -${scaledContentPaddingLeft}px;
                 background-position-y: ${scaledLineHeight * BACKGROUND_POSITION_Y_MULTIPLIER}px;
@@ -20811,7 +20867,7 @@ function useBookEditorMonacoStyles({ instanceClass, scaledLineHeight, scaledCont
                 top: 0;
                 bottom: 0;
                 width: 1px;
-                background-color: ${PROMPTBOOK_SYNTAX_COLORS.LINE.toHex()};
+                background-color: ${lineColor};
                 z-index: 10;
             }
 
@@ -20819,8 +20875,8 @@ function useBookEditorMonacoStyles({ instanceClass, scaledLineHeight, scaledCont
                 background: linear-gradient(
                     to bottom, 
                     transparent ${scaledLineHeight * 0.9 - 2}px, 
-                    ${PROMPTBOOK_SYNTAX_COLORS.SEPARATOR.toHex()} ${scaledLineHeight * 0.9 - 2}px, 
-                    ${PROMPTBOOK_SYNTAX_COLORS.SEPARATOR.toHex()} ${scaledLineHeight * 0.9 + 1}px, 
+                    ${separatorColor} ${scaledLineHeight * 0.9 - 2}px, 
+                    ${separatorColor} ${scaledLineHeight * 0.9 + 1}px, 
                     transparent ${scaledLineHeight * 0.9 + 1}px
                 );
             }
@@ -20830,22 +20886,22 @@ function useBookEditorMonacoStyles({ instanceClass, scaledLineHeight, scaledCont
             }
             
             .${instanceClass} .monaco-editor .code-block-box {
-                background-color: #f5f5f566;
-                border-left: 1px solid ${PROMPTBOOK_SYNTAX_COLORS.CODE_BLOCK.toHex()};
-                border-right: 1px solid ${PROMPTBOOK_SYNTAX_COLORS.CODE_BLOCK.toHex()};
+                background-color: ${codeBlockBackground};
+                border-left: 1px solid ${codeBlockBorderColor};
+                border-right: 1px solid ${codeBlockBorderColor};
                 padding-left: ${Math.round(8 * zoomLevel)}px;
                 padding-right: ${Math.round(8 * zoomLevel)}px;
             }
             
             .${instanceClass} .monaco-editor .code-block-top {
-                border-top: 1px solid ${PROMPTBOOK_SYNTAX_COLORS.CODE_BLOCK.toHex()};
+                border-top: 1px solid ${codeBlockBorderColor};
                 border-top-left-radius: ${Math.round(10 * zoomLevel)}px;
                 border-top-right-radius: ${Math.round(10 * zoomLevel)}px;
                 overflow: hidden;
             }
             
             .${instanceClass} .monaco-editor .code-block-bottom {
-                border-bottom: 1px solid ${PROMPTBOOK_SYNTAX_COLORS.CODE_BLOCK.toHex()};
+                border-bottom: 1px solid ${codeBlockBorderColor};
                 border-bottom-left-radius: ${Math.round(10 * zoomLevel)}px;
                 border-bottom-right-radius: ${Math.round(10 * zoomLevel)}px;
                 overflow: hidden;
@@ -20856,7 +20912,7 @@ function useBookEditorMonacoStyles({ instanceClass, scaledLineHeight, scaledCont
                 style === null || style === void 0 ? void 0 : style.remove();
             }
         };
-    }, [instanceClass, scaledLineHeight, scaledContentPaddingLeft, scaledVerticalLineLeft, zoomLevel]);
+    }, [instanceClass, scaledLineHeight, scaledContentPaddingLeft, scaledVerticalLineLeft, theme, zoomLevel]);
 }
 
 /**
@@ -21769,7 +21825,7 @@ async function resolveClipboardUploadFiles(dataTransfer) {
  * @private Internal component used by `BookEditor`
  */
 function BookEditorMonaco(props) {
-    const { value, onChange, diagnostics, isReadonly, translations, onFileUpload, isUploadButtonShown, isCameraButtonShown, isDownloadButtonShown, isAboutButtonShown = true, isFullscreenButtonShown = true, onFullscreenClick, isFullscreen, zoom = 1, monacoModelPath, hoistedMenuItems, } = props;
+    const { value, onChange, diagnostics, isReadonly, theme = 'LIGHT', translations, onFileUpload, isUploadButtonShown, isCameraButtonShown, isDownloadButtonShown, isAboutButtonShown = true, isFullscreenButtonShown = true, onFullscreenClick, isFullscreen, zoom = 1, monacoModelPath, hoistedMenuItems, } = props;
     const zoomLevel = zoom;
     const scaledLineHeight = Math.round(BookEditorMonacoConstants.LINE_HEIGHT * zoomLevel);
     const scaledContentPaddingLeft = Math.max(8, Math.round(BookEditorMonacoConstants.CONTENT_PADDING_LEFT * zoomLevel));
@@ -21794,7 +21850,7 @@ function BookEditorMonaco(props) {
         onFileUpload,
     });
     const combinedDiagnostics = [...(diagnostics || []), ...createDeprecatedCommitmentDiagnostics(value)];
-    useBookEditorMonacoLanguage({ monaco });
+    useBookEditorMonacoLanguage({ monaco, theme });
     useBookEditorMonacoDiagnostics({ monaco, editor, diagnostics: combinedDiagnostics });
     useBookEditorMonacoDecorations({ editor, monaco });
     useBookEditorMonacoStyles({
@@ -21803,6 +21859,7 @@ function BookEditorMonaco(props) {
         scaledLineHeight,
         scaledVerticalLineLeft,
         zoomLevel,
+        theme,
     });
     /**
      * Re-applies Book language + theme to the currently mounted Monaco model.
@@ -21811,9 +21868,9 @@ function BookEditorMonaco(props) {
         if (!editor || !monaco) {
             return;
         }
-        ensureBookEditorMonacoLanguageForEditor({ monaco, monacoEditor: editor });
+        ensureBookEditorMonacoLanguageForEditor({ monaco, monacoEditor: editor, theme });
         logBookEditorMonacoDebug(`Re-applied Book Monaco language/theme (${reason}).`);
-    }, [editor, monaco]);
+    }, [editor, monaco, theme]);
     useEffect(() => {
         setIsTouchDevice(typeof window !== 'undefined' && window.matchMedia('(pointer: coarse)').matches);
     }, []);
@@ -21920,16 +21977,16 @@ function BookEditorMonaco(props) {
      * Ensures Book language/tokenizer is ready before Monaco creates the editor model.
      */
     const handleBeforeMonacoMount = useCallback((beforeMountMonaco) => {
-        ensureBookEditorMonacoLanguage(beforeMountMonaco);
-    }, []);
+        ensureBookEditorMonacoLanguage(beforeMountMonaco, theme);
+    }, [theme]);
     /**
      * Re-applies Book language/theme once Monaco editor is mounted.
      */
     const handleMonacoMount = useCallback((mountedEditor, mountedMonaco) => {
         setEditor(mountedEditor);
-        ensureBookEditorMonacoLanguageForEditor({ monaco: mountedMonaco, monacoEditor: mountedEditor });
+        ensureBookEditorMonacoLanguageForEditor({ monaco: mountedMonaco, monacoEditor: mountedEditor, theme });
         logBookEditorMonacoDebug('Mounted Monaco editor and re-applied Book language/theme.');
-    }, []);
+    }, [theme]);
     const handleDragOver = useCallback((event) => {
         event.preventDefault();
         setIsDragOver(true);
@@ -22035,7 +22092,7 @@ const DEFAULT_BOOK_EDITOR_HEIGHT = countLines(DEFAULT_BOOK) * 30 + 20;
  * @public exported from `@promptbook/components`
  */
 function BookEditor(props) {
-    const { agentSource, className, style, zoom = 1, value, onChange, diagnostics, onFileUpload, isVerbose = DEFAULT_IS_VERBOSE, isBorderRadiusDisabled = false, isReadonly = false, translations, isUploadButtonShown = true, isCameraButtonShown, isDownloadButtonShown = true, isAboutButtonShown = true, isFullscreenButtonShown = true, sync, monacoModelPath, hoistedMenuItems, } = props;
+    const { agentSource, className, style, theme = 'LIGHT', zoom = 1, value, onChange, diagnostics, onFileUpload, isVerbose = DEFAULT_IS_VERBOSE, isBorderRadiusDisabled = false, isReadonly = false, translations, isUploadButtonShown = true, isCameraButtonShown, isDownloadButtonShown = true, isAboutButtonShown = true, isFullscreenButtonShown = true, sync, monacoModelPath, hoistedMenuItems, } = props;
     const [isFullscreen, setIsFullscreen] = useState(false);
     /**
      * Toggles fullscreen mode for the editor.
@@ -22043,7 +22100,7 @@ function BookEditor(props) {
     const handleFullscreenToggle = () => {
         setIsFullscreen(!isFullscreen);
     };
-    const editorContent = (jsx("div", { "data-book-component": "BookEditor", className: classNames(styles$d.BookEditor, isVerbose && styles$d.isVerbose, styles$d.bookEditorWrapper, isBorderRadiusDisabled && styles$d.isBorderRadiusDisabled, isFullscreen && styles$d.fullscreen, className), style: isFullscreen
+    const editorContent = (jsx("div", { "data-book-component": "BookEditor", "data-book-editor-theme": theme.toLowerCase(), className: classNames(styles$d.BookEditor, isVerbose && styles$d.isVerbose, styles$d.bookEditorWrapper, isBorderRadiusDisabled && styles$d.isBorderRadiusDisabled, isFullscreen && styles$d.fullscreen, className), style: isFullscreen
             ? style
             : {
                 ...(style || {}),
@@ -22054,7 +22111,7 @@ function BookEditor(props) {
                             ? `${props.height}px`
                             : props.height || `${DEFAULT_BOOK_EDITOR_HEIGHT}px`,
                     }),
-            }, children: jsx(BookEditorMonaco, { value: agentSource || value, onChange: onChange, diagnostics: diagnostics, onFileUpload: onFileUpload, isVerbose: isVerbose, isBorderRadiusDisabled: isBorderRadiusDisabled, isReadonly: isReadonly, translations: translations, isUploadButtonShown: isUploadButtonShown, isCameraButtonShown: isCameraButtonShown, isDownloadButtonShown: isDownloadButtonShown, isAboutButtonShown: isAboutButtonShown, isFullscreenButtonShown: isFullscreenButtonShown, onFullscreenClick: handleFullscreenToggle, isFullscreen: isFullscreen, sync: sync, zoom: zoom, monacoModelPath: monacoModelPath, hoistedMenuItems: hoistedMenuItems }) }));
+            }, children: jsx(BookEditorMonaco, { value: agentSource || value, onChange: onChange, diagnostics: diagnostics, onFileUpload: onFileUpload, isVerbose: isVerbose, isBorderRadiusDisabled: isBorderRadiusDisabled, isReadonly: isReadonly, translations: translations, isUploadButtonShown: isUploadButtonShown, isCameraButtonShown: isCameraButtonShown, isDownloadButtonShown: isDownloadButtonShown, isAboutButtonShown: isAboutButtonShown, isFullscreenButtonShown: isFullscreenButtonShown, onFullscreenClick: handleFullscreenToggle, isFullscreen: isFullscreen, sync: sync, zoom: zoom, monacoModelPath: monacoModelPath, hoistedMenuItems: hoistedMenuItems, theme: theme }) }));
     return isFullscreen && typeof document !== 'undefined' ? createPortal(editorContent, document.body) : editorContent;
 }
 
@@ -26079,6 +26136,138 @@ function interpolateExponentially(currentValue, targetValue, deltaMs, smoothingW
     return currentValue + (targetValue - currentValue) * blend;
 }
 
+// Note: [💞] Ignore a discrepancy between file name and entity name
+/**
+ * Next registration id used by the shared avatar animation scheduler.
+ *
+ * @private utility of the avatar rendering system
+ */
+let nextAvatarAnimationListenerId = 1;
+/**
+ * Active avatar animation callbacks keyed by their registration id.
+ *
+ * @private utility of the avatar rendering system
+ */
+const avatarAnimationListeners = new Map();
+/**
+ * Active shared animation-frame handle.
+ *
+ * @private utility of the avatar rendering system
+ */
+let avatarAnimationFrameId = null;
+/**
+ * Registers one avatar animation callback in the shared animation loop.
+ *
+ * @param avatarAnimationListener Frame callback invoked on every animation frame.
+ * @returns Cleanup function that unregisters the callback.
+ *
+ * @private utility of the avatar rendering system
+ */
+function retainAvatarAnimationListener(avatarAnimationListener) {
+    if (typeof window === 'undefined') {
+        return () => undefined;
+    }
+    const listenerId = nextAvatarAnimationListenerId++;
+    avatarAnimationListeners.set(listenerId, avatarAnimationListener);
+    ensureAvatarAnimationLoop();
+    return () => {
+        avatarAnimationListeners.delete(listenerId);
+        if (avatarAnimationListeners.size === 0 && avatarAnimationFrameId !== null) {
+            window.cancelAnimationFrame(avatarAnimationFrameId);
+            avatarAnimationFrameId = null;
+        }
+    };
+}
+/**
+ * Ensures the shared animation loop is running while at least one avatar listener is active.
+ *
+ * @private utility of the avatar rendering system
+ */
+function ensureAvatarAnimationLoop() {
+    if (avatarAnimationFrameId !== null || avatarAnimationListeners.size === 0 || typeof window === 'undefined') {
+        return;
+    }
+    const runFrame = (now) => {
+        avatarAnimationFrameId = null;
+        for (const avatarAnimationListener of [...avatarAnimationListeners.values()]) {
+            avatarAnimationListener(now);
+        }
+        ensureAvatarAnimationLoop();
+    };
+    avatarAnimationFrameId = window.requestAnimationFrame(runFrame);
+}
+
+// Note: [💞] Ignore a discrepancy between file name and entity name
+/**
+ * Shared `IntersectionObserver` callbacks grouped by observed element.
+ *
+ * @private utility of the avatar rendering system
+ */
+const avatarVisibilityListeners = new Map();
+/**
+ * Lazily created shared `IntersectionObserver` used by avatar canvases.
+ *
+ * @private utility of the avatar rendering system
+ */
+let avatarVisibilityObserver = null;
+/**
+ * Observes one avatar element and notifies the caller when it enters or leaves the viewport.
+ *
+ * @param element Observed avatar element.
+ * @param avatarVisibilityListener Listener notified with the current visibility state.
+ * @returns Cleanup function that stops observing the element.
+ *
+ * @private utility of the avatar rendering system
+ */
+function observeAvatarVisibility(element, avatarVisibilityListener) {
+    if (typeof window === 'undefined' || typeof IntersectionObserver === 'undefined') {
+        avatarVisibilityListener(true);
+        return () => undefined;
+    }
+    const observer = getAvatarVisibilityObserver();
+    const elementListeners = avatarVisibilityListeners.get(element) || new Set();
+    elementListeners.add(avatarVisibilityListener);
+    avatarVisibilityListeners.set(element, elementListeners);
+    observer.observe(element);
+    return () => {
+        const currentElementListeners = avatarVisibilityListeners.get(element);
+        if (!currentElementListeners) {
+            return;
+        }
+        currentElementListeners.delete(avatarVisibilityListener);
+        if (currentElementListeners.size > 0) {
+            return;
+        }
+        avatarVisibilityListeners.delete(element);
+        observer.unobserve(element);
+    };
+}
+/**
+ * Creates the shared `IntersectionObserver` used by all avatar canvases.
+ *
+ * @returns Shared observer instance.
+ *
+ * @private utility of the avatar rendering system
+ */
+function getAvatarVisibilityObserver() {
+    if (avatarVisibilityObserver) {
+        return avatarVisibilityObserver;
+    }
+    avatarVisibilityObserver = new IntersectionObserver((entries) => {
+        for (const entry of entries) {
+            const elementListeners = avatarVisibilityListeners.get(entry.target);
+            if (!elementListeners) {
+                continue;
+            }
+            const isVisible = entry.isIntersecting && entry.intersectionRatio > 0;
+            for (const avatarVisibilityListener of elementListeners) {
+                avatarVisibilityListener(isVisible);
+            }
+        }
+    });
+    return avatarVisibilityObserver;
+}
+
 // Note: [💞] Ignore a discrepancy between file name and entity name
 /**
  * Active avatar instances currently consuming the shared pointer tracker.
@@ -26092,6 +26281,18 @@ let avatarPointerTrackingConsumerCount = 0;
  * @private utility of the avatar rendering system
  */
 let currentAvatarPointerSnapshot = null;
+/**
+ * Monotonic version incremented whenever the shared pointer snapshot changes.
+ *
+ * @private utility of the avatar rendering system
+ */
+let currentAvatarPointerSnapshotVersion = 0;
+/**
+ * Monotonic version incremented whenever scrolling or resizing may invalidate cached avatar bounds.
+ *
+ * @private utility of the avatar rendering system
+ */
+let currentAvatarViewportLayoutVersion = 0;
 /**
  * Cleanup function for the lazily attached global listeners.
  *
@@ -26129,6 +26330,26 @@ function retainAvatarPointerTracking() {
 function getAvatarPointerSnapshot() {
     return currentAvatarPointerSnapshot;
 }
+/**
+ * Returns the current pointer snapshot version.
+ *
+ * @returns Monotonic pointer snapshot version.
+ *
+ * @private utility of the avatar rendering system
+ */
+function getAvatarPointerSnapshotVersion() {
+    return currentAvatarPointerSnapshotVersion;
+}
+/**
+ * Returns the current viewport-layout version used to invalidate cached avatar bounds.
+ *
+ * @returns Monotonic viewport-layout version.
+ *
+ * @private utility of the avatar rendering system
+ */
+function getAvatarViewportLayoutVersion() {
+    return currentAvatarViewportLayoutVersion;
+}
 /**
  * Attaches the global pointer/touch listeners used by all live avatar canvases.
  *
@@ -26141,7 +26362,11 @@ function attachAvatarPointerTrackingListeners() {
         return () => undefined;
     }
     const clearPointerSnapshot = () => {
+        if (currentAvatarPointerSnapshot === null) {
+            return;
+        }
         currentAvatarPointerSnapshot = null;
+        currentAvatarPointerSnapshotVersion++;
     };
     const updatePointerSnapshot = (clientX, clientY, pointerType) => {
         currentAvatarPointerSnapshot = {
@@ -26150,6 +26375,10 @@ function attachAvatarPointerTrackingListeners() {
             isPointerActive: true,
             pointerType,
         };
+        currentAvatarPointerSnapshotVersion++;
+    };
+    const invalidateViewportLayout = () => {
+        currentAvatarViewportLayoutVersion++;
     };
     const handlePointerMove = (event) => {
         updatePointerSnapshot(event.clientX, event.clientY, normalizeAvatarPointerType(event.pointerType));
@@ -26185,6 +26414,8 @@ function attachAvatarPointerTrackingListeners() {
     window.addEventListener('touchmove', handleTouchEvent, { passive: true });
     window.addEventListener('touchend', clearPointerSnapshot, { passive: true });
     window.addEventListener('touchcancel', clearPointerSnapshot, { passive: true });
+    window.addEventListener('scroll', invalidateViewportLayout, { passive: true, capture: true });
+    window.addEventListener('resize', invalidateViewportLayout, { passive: true });
     return () => {
         window.removeEventListener('pointermove', handlePointerMove);
         window.removeEventListener('pointerdown', handlePointerDown);
@@ -26196,6 +26427,8 @@ function attachAvatarPointerTrackingListeners() {
         window.removeEventListener('touchmove', handleTouchEvent);
         window.removeEventListener('touchend', clearPointerSnapshot);
         window.removeEventListener('touchcancel', clearPointerSnapshot);
+        window.removeEventListener('scroll', invalidateViewportLayout, true);
+        window.removeEventListener('resize', invalidateViewportLayout);
     };
 }
 /**
@@ -26289,37 +26522,49 @@ function traceSmoothClosedPath(context, points) {
  * @private shared geometry helper of `octopus3AvatarVisual` and `asciiOctopusAvatarVisual`
  */
 function createOrganicOctopusTentacleShapes(options) {
-    const { size, centerX, centerY, bodyRadius, horizontalStretch, tentacleCount, shapePhase, createRandom, timeMs, saltPrefix, bodyPoints } = options;
+    var _a, _b, _c, _d, _e, _f, _g, _h;
+    const { size, centerX, centerY, bodyRadius, horizontalStretch, tentacleCount, shapePhase, createRandom, timeMs, saltPrefix, bodyPoints, variation, } = options;
     const baseY = centerY + bodyRadius * 0.74;
     const lowerBodyAnchorPoints = bodyPoints ? resolveTentacleBodyAnchorPoints(bodyPoints, centerY + bodyRadius * 0.04) : null;
+    const flowLengthScale = (_a = variation === null || variation === void 0 ? void 0 : variation.flowLengthScale) !== null && _a !== void 0 ? _a : 1;
+    const lateralReachScale = (_b = variation === null || variation === void 0 ? void 0 : variation.lateralReachScale) !== null && _b !== void 0 ? _b : 1;
+    const tipReachScale = (_c = variation === null || variation === void 0 ? void 0 : variation.tipReachScale) !== null && _c !== void 0 ? _c : 1;
+    const baseWidthScale = (_d = variation === null || variation === void 0 ? void 0 : variation.baseWidthScale) !== null && _d !== void 0 ? _d : 1;
+    const tipWidthScale = (_e = variation === null || variation === void 0 ? void 0 : variation.tipWidthScale) !== null && _e !== void 0 ? _e : 1;
+    const rootSpreadScale = (_f = variation === null || variation === void 0 ? void 0 : variation.rootSpreadScale) !== null && _f !== void 0 ? _f : 1;
+    const startYOffsetScale = (_g = variation === null || variation === void 0 ? void 0 : variation.startYOffsetScale) !== null && _g !== void 0 ? _g : 1;
+    const swayScale = (_h = variation === null || variation === void 0 ? void 0 : variation.swayScale) !== null && _h !== void 0 ? _h : 1;
     return Array.from({ length: tentacleCount }, (_, tentacleIndex) => {
         const tentacleRandom = createRandom(`${saltPrefix}-tentacle-${tentacleIndex}`);
         const spreadProgress = tentacleCount === 1 ? 0.5 : tentacleIndex / (tentacleCount - 1);
         const centeredProgress = spreadProgress - 0.5;
+        const spreadCenteredProgress = centeredProgress * rootSpreadScale;
+        const spreadAnchorProgress = Math.min(1, Math.max(0, 0.5 + spreadCenteredProgress));
         const temporalSway = Math.sin(timeMs / (720 + tentacleIndex * 34) + shapePhase + tentacleRandom() * Math.PI * 2) *
             size *
-            (0.014 + tentacleRandom() * 0.015);
-        const flowLength = size * (0.24 + tentacleRandom() * 0.18);
-        const curlDirection = centeredProgress === 0 ? (tentacleRandom() < 0.5 ? -1 : 1) : Math.sign(centeredProgress);
-        const lateralReach = centeredProgress * size * (0.1 + tentacleRandom() * 0.1) + temporalSway;
-        const tipReach = curlDirection * size * (0.025 + tentacleRandom() * 0.07);
-        const startYOffset = Math.abs(centeredProgress) * size * 0.012 + tentacleRandom() * size * 0.01;
+            (0.014 + tentacleRandom() * 0.015) *
+            swayScale;
+        const flowLength = size * (0.24 + tentacleRandom() * 0.18) * flowLengthScale;
+        const curlDirection = spreadCenteredProgress === 0 ? (tentacleRandom() < 0.5 ? -1 : 1) : Math.sign(spreadCenteredProgress);
+        const lateralReach = spreadCenteredProgress * size * (0.1 + tentacleRandom() * 0.1) * lateralReachScale + temporalSway;
+        const tipReach = curlDirection * size * (0.025 + tentacleRandom() * 0.07) * tipReachScale;
+        const startYOffset = (Math.abs(spreadCenteredProgress) * size * 0.012 + tentacleRandom() * size * 0.01) * startYOffsetScale;
         const startPoint = lowerBodyAnchorPoints && lowerBodyAnchorPoints.length >= 2
             ? createInsetTentacleStartPoint({
                 bodyPoints: lowerBodyAnchorPoints,
-                anchorProgress: spreadProgress,
+                anchorProgress: spreadAnchorProgress,
                 centerX,
                 centerY,
                 bodyRadius,
-                centeredProgress,
+                centeredProgress: spreadCenteredProgress,
                 startYOffset,
             })
             : {
-                x: centerX + centeredProgress * bodyRadius * horizontalStretch * 1.52,
+                x: centerX + spreadCenteredProgress * bodyRadius * horizontalStretch * 1.52,
                 y: baseY + startYOffset,
             };
         const controlPointOne = {
-            x: startPoint.x + centeredProgress * size * 0.045 + temporalSway * 0.4,
+            x: startPoint.x + spreadCenteredProgress * size * 0.045 * lateralReachScale + temporalSway * 0.4,
             y: startPoint.y + flowLength * (0.21 + tentacleRandom() * 0.08),
         };
         const controlPointTwo = {
@@ -26332,8 +26577,8 @@ function createOrganicOctopusTentacleShapes(options) {
                 flowLength * (0.9 + tentacleRandom() * 0.12) +
                 Math.cos(timeMs / (840 + tentacleIndex * 41) + shapePhase) * size * (0.008 + tentacleRandom() * 0.01),
         };
-        const baseWidth = size * (0.038 + tentacleRandom() * 0.02) * (1 - Math.abs(centeredProgress) * 0.18);
-        const tipWidth = baseWidth * (0.18 + tentacleRandom() * 0.2);
+        const baseWidth = size * (0.038 + tentacleRandom() * 0.02) * (1 - Math.abs(spreadCenteredProgress) * 0.18) * baseWidthScale;
+        const tipWidth = baseWidth * Math.min(0.52, (0.18 + tentacleRandom() * 0.2) * tipWidthScale);
         return {
             startPoint,
             controlPointOne,
@@ -27989,6 +28234,244 @@ function drawAlienEye(context, centerX, centerY, radiusX, radiusY, palette, time
 }
 
 /* eslint-disable no-magic-numbers */
+/**
+ * Builds one deterministic morphology profile for `Octopus3`.
+ *
+ * @param createRandom Seeded random factory scoped to the current avatar.
+ * @returns Stable morphology profile.
+ *
+ * @private helper of `octopus3AvatarVisual`
+ */
+function createOctopus3MorphologyProfile(createRandom) {
+    const bodyRandom = createRandom('octopus3-body-profile');
+    const faceRandom = createRandom('octopus3-face-profile');
+    const detailRandom = createRandom('octopus3-detail-profile');
+    const bodyFamilyRoll = bodyRandom();
+    let bodyFamily;
+    let body;
+    let tentacles;
+    if (bodyFamilyRoll < 0.34) {
+        bodyFamily = 'lantern';
+        body = {
+            centerXJitterRatio: resolveSeededRange(bodyRandom, -0.018, 0.018),
+            centerYRatio: resolveSeededRange(bodyRandom, 0.39, 0.435),
+            bodyRadiusRatio: resolveSeededRange(bodyRandom, 0.19, 0.23),
+            horizontalStretch: resolveSeededRange(bodyRandom, 0.94, 1.08),
+            verticalStretch: resolveSeededRange(bodyRandom, 1.02, 1.18),
+            mantleLiftRatio: resolveSeededRange(bodyRandom, 0.115, 0.148),
+            lowerDropRatio: resolveSeededRange(bodyRandom, 0.042, 0.066),
+            tentacleDepthRatio: resolveSeededRange(bodyRandom, 0.018, 0.03),
+            wobbleAmplitudeRatio: resolveSeededRange(bodyRandom, 0.009, 0.017),
+            lobeCount: resolveSeededIntegerRange(bodyRandom, 4, 6),
+            pointCount: resolveSeededIntegerRange(bodyRandom, 38, 42),
+            shadowWidthRatio: resolveSeededRange(bodyRandom, 0.18, 0.23),
+            shadowHeightRatio: resolveSeededRange(bodyRandom, 0.055, 0.075),
+            crownHighlightWidthRatio: resolveSeededRange(bodyRandom, 0.14, 0.18),
+            crownHighlightHeightRatio: resolveSeededRange(bodyRandom, 0.045, 0.062),
+            crownHighlightYOffsetRatio: resolveSeededRange(bodyRandom, -0.165, -0.135),
+        };
+        tentacles = {
+            count: resolveSeededIntegerRange(bodyRandom, 7, 10),
+            flowLengthScale: resolveSeededRange(bodyRandom, 1.08, 1.34),
+            lateralReachScale: resolveSeededRange(bodyRandom, 0.72, 0.94),
+            tipReachScale: resolveSeededRange(bodyRandom, 0.82, 1.06),
+            baseWidthScale: resolveSeededRange(bodyRandom, 0.82, 0.98),
+            tipWidthScale: resolveSeededRange(bodyRandom, 0.9, 1.08),
+            rootSpreadScale: resolveSeededRange(bodyRandom, 0.76, 0.94),
+            startYOffsetScale: resolveSeededRange(bodyRandom, 0.82, 1),
+            swayScale: resolveSeededRange(bodyRandom, 0.82, 1.02),
+        };
+    }
+    else if (bodyFamilyRoll < 0.68) {
+        bodyFamily = 'drifter';
+        body = {
+            centerXJitterRatio: resolveSeededRange(bodyRandom, -0.025, 0.025),
+            centerYRatio: resolveSeededRange(bodyRandom, 0.425, 0.46),
+            bodyRadiusRatio: resolveSeededRange(bodyRandom, 0.175, 0.215),
+            horizontalStretch: resolveSeededRange(bodyRandom, 1.22, 1.42),
+            verticalStretch: resolveSeededRange(bodyRandom, 0.82, 0.92),
+            mantleLiftRatio: resolveSeededRange(bodyRandom, 0.092, 0.115),
+            lowerDropRatio: resolveSeededRange(bodyRandom, 0.02, 0.036),
+            tentacleDepthRatio: resolveSeededRange(bodyRandom, 0.032, 0.052),
+            wobbleAmplitudeRatio: resolveSeededRange(bodyRandom, 0.013, 0.022),
+            lobeCount: resolveSeededIntegerRange(bodyRandom, 7, 9),
+            pointCount: resolveSeededIntegerRange(bodyRandom, 40, 46),
+            shadowWidthRatio: resolveSeededRange(bodyRandom, 0.24, 0.28),
+            shadowHeightRatio: resolveSeededRange(bodyRandom, 0.06, 0.082),
+            crownHighlightWidthRatio: resolveSeededRange(bodyRandom, 0.17, 0.22),
+            crownHighlightHeightRatio: resolveSeededRange(bodyRandom, 0.038, 0.055),
+            crownHighlightYOffsetRatio: resolveSeededRange(bodyRandom, -0.14, -0.11),
+        };
+        tentacles = {
+            count: resolveSeededIntegerRange(bodyRandom, 10, 13),
+            flowLengthScale: resolveSeededRange(bodyRandom, 0.88, 1.08),
+            lateralReachScale: resolveSeededRange(bodyRandom, 1.18, 1.42),
+            tipReachScale: resolveSeededRange(bodyRandom, 1.12, 1.42),
+            baseWidthScale: resolveSeededRange(bodyRandom, 0.9, 1.06),
+            tipWidthScale: resolveSeededRange(bodyRandom, 0.88, 1.08),
+            rootSpreadScale: resolveSeededRange(bodyRandom, 1.12, 1.32),
+            startYOffsetScale: resolveSeededRange(bodyRandom, 0.92, 1.14),
+            swayScale: resolveSeededRange(bodyRandom, 1.04, 1.22),
+        };
+    }
+    else {
+        bodyFamily = 'rounded';
+        body = {
+            centerXJitterRatio: resolveSeededRange(bodyRandom, -0.02, 0.02),
+            centerYRatio: resolveSeededRange(bodyRandom, 0.398, 0.442),
+            bodyRadiusRatio: resolveSeededRange(bodyRandom, 0.208, 0.248),
+            horizontalStretch: resolveSeededRange(bodyRandom, 1.06, 1.22),
+            verticalStretch: resolveSeededRange(bodyRandom, 0.9, 1.01),
+            mantleLiftRatio: resolveSeededRange(bodyRandom, 0.1, 0.128),
+            lowerDropRatio: resolveSeededRange(bodyRandom, 0.032, 0.052),
+            tentacleDepthRatio: resolveSeededRange(bodyRandom, 0.038, 0.06),
+            wobbleAmplitudeRatio: resolveSeededRange(bodyRandom, 0.014, 0.024),
+            lobeCount: resolveSeededIntegerRange(bodyRandom, 5, 8),
+            pointCount: resolveSeededIntegerRange(bodyRandom, 39, 44),
+            shadowWidthRatio: resolveSeededRange(bodyRandom, 0.2, 0.25),
+            shadowHeightRatio: resolveSeededRange(bodyRandom, 0.055, 0.08),
+            crownHighlightWidthRatio: resolveSeededRange(bodyRandom, 0.16, 0.2),
+            crownHighlightHeightRatio: resolveSeededRange(bodyRandom, 0.05, 0.07),
+            crownHighlightYOffsetRatio: resolveSeededRange(bodyRandom, -0.155, -0.122),
+        };
+        tentacles = {
+            count: resolveSeededIntegerRange(bodyRandom, 8, 12),
+            flowLengthScale: resolveSeededRange(bodyRandom, 0.94, 1.16),
+            lateralReachScale: resolveSeededRange(bodyRandom, 0.9, 1.14),
+            tipReachScale: resolveSeededRange(bodyRandom, 0.96, 1.22),
+            baseWidthScale: resolveSeededRange(bodyRandom, 1.02, 1.2),
+            tipWidthScale: resolveSeededRange(bodyRandom, 1.02, 1.22),
+            rootSpreadScale: resolveSeededRange(bodyRandom, 0.94, 1.08),
+            startYOffsetScale: resolveSeededRange(bodyRandom, 0.9, 1.08),
+            swayScale: resolveSeededRange(bodyRandom, 0.9, 1.1),
+        };
+    }
+    const faceFamilyRoll = faceRandom();
+    let faceFamily;
+    let face;
+    if (faceFamilyRoll < 0.34) {
+        faceFamily = 'watchful';
+        face = {
+            eyeSpacingRatio: resolveSeededRange(faceRandom, 0.118, 0.152),
+            eyeCenterYOffsetRatio: resolveSeededRange(faceRandom, -0.026, -0.002),
+            eyeRadiusXRatio: resolveSeededRange(faceRandom, 0.05, 0.062),
+            eyeHeightRatio: resolveSeededRange(faceRandom, 1.18, 1.38),
+            eyeRotationRange: resolveSeededRange(faceRandom, 0.16, 0.28),
+            eyeTiltBias: resolveSeededRange(faceRandom, 0.02, 0.06),
+            mouthWidthRatio: resolveSeededRange(faceRandom, 0.058, 0.074),
+            mouthYOffsetRatio: resolveSeededRange(faceRandom, 0.086, 0.104),
+            mouthCurveDepthRatio: resolveSeededRange(faceRandom, 0.126, 0.15),
+            mouthCenterOffsetRatio: resolveSeededRange(faceRandom, -0.006, 0.006),
+            mouthCornerTiltRatio: resolveSeededRange(faceRandom, -0.002, 0.002),
+            eyeStyle: {
+                irisScale: resolveSeededRange(faceRandom, 1, 1.1),
+                pupilWidthScale: resolveSeededRange(faceRandom, 0.86, 1.02),
+                pupilHeightScale: resolveSeededRange(faceRandom, 0.94, 1.08),
+                upperLidArchRatio: resolveSeededRange(faceRandom, 0.96, 1.12),
+                upperLidInsetRatio: resolveSeededRange(faceRandom, 0.08, 0.14),
+                lowerLidOpacity: resolveSeededRange(faceRandom, 0.12, 0.22),
+            },
+        };
+    }
+    else if (faceFamilyRoll < 0.68) {
+        faceFamily = 'sleepy';
+        face = {
+            eyeSpacingRatio: resolveSeededRange(faceRandom, 0.092, 0.124),
+            eyeCenterYOffsetRatio: resolveSeededRange(faceRandom, -0.002, 0.024),
+            eyeRadiusXRatio: resolveSeededRange(faceRandom, 0.058, 0.074),
+            eyeHeightRatio: resolveSeededRange(faceRandom, 0.96, 1.14),
+            eyeRotationRange: resolveSeededRange(faceRandom, 0.1, 0.22),
+            eyeTiltBias: resolveSeededRange(faceRandom, 0.01, 0.05),
+            mouthWidthRatio: resolveSeededRange(faceRandom, 0.066, 0.086),
+            mouthYOffsetRatio: resolveSeededRange(faceRandom, 0.094, 0.118),
+            mouthCurveDepthRatio: resolveSeededRange(faceRandom, 0.118, 0.145),
+            mouthCenterOffsetRatio: resolveSeededRange(faceRandom, -0.004, 0.004),
+            mouthCornerTiltRatio: resolveSeededRange(faceRandom, -0.004, 0.004),
+            eyeStyle: {
+                irisScale: resolveSeededRange(faceRandom, 0.9, 1),
+                pupilWidthScale: resolveSeededRange(faceRandom, 1, 1.18),
+                pupilHeightScale: resolveSeededRange(faceRandom, 0.78, 0.92),
+                upperLidArchRatio: resolveSeededRange(faceRandom, 0.7, 0.88),
+                upperLidInsetRatio: resolveSeededRange(faceRandom, -0.02, 0.06),
+                lowerLidOpacity: resolveSeededRange(faceRandom, 0.22, 0.34),
+            },
+        };
+    }
+    else {
+        faceFamily = 'mischief';
+        face = {
+            eyeSpacingRatio: resolveSeededRange(faceRandom, 0.086, 0.114),
+            eyeCenterYOffsetRatio: resolveSeededRange(faceRandom, -0.018, 0.01),
+            eyeRadiusXRatio: resolveSeededRange(faceRandom, 0.046, 0.06),
+            eyeHeightRatio: resolveSeededRange(faceRandom, 1.08, 1.28),
+            eyeRotationRange: resolveSeededRange(faceRandom, 0.28, 0.44),
+            eyeTiltBias: resolveSeededRange(faceRandom, 0.12, 0.22),
+            mouthWidthRatio: resolveSeededRange(faceRandom, 0.052, 0.074),
+            mouthYOffsetRatio: resolveSeededRange(faceRandom, 0.082, 0.1),
+            mouthCurveDepthRatio: resolveSeededRange(faceRandom, 0.116, 0.15),
+            mouthCenterOffsetRatio: resolveSeededRange(faceRandom, -0.018, 0.018),
+            mouthCornerTiltRatio: resolveSeededRange(faceRandom, -0.01, 0.01),
+            eyeStyle: {
+                irisScale: resolveSeededRange(faceRandom, 1.04, 1.12),
+                pupilWidthScale: resolveSeededRange(faceRandom, 0.72, 0.9),
+                pupilHeightScale: resolveSeededRange(faceRandom, 0.96, 1.14),
+                upperLidArchRatio: resolveSeededRange(faceRandom, 0.88, 1.02),
+                upperLidInsetRatio: resolveSeededRange(faceRandom, 0.04, 0.12),
+                lowerLidOpacity: resolveSeededRange(faceRandom, 0.08, 0.18),
+            },
+        };
+    }
+    return {
+        bodyFamily,
+        faceFamily,
+        body,
+        tentacles,
+        face,
+        details: {
+            mantleCurrentCount: resolveSeededIntegerRange(detailRandom, 4, 8),
+            mantleNodeCount: resolveSeededIntegerRange(detailRandom, 3, 7),
+        },
+    };
+}
+/**
+ * Resolves one seeded floating-point number inside the provided range.
+ *
+ * @param random Seeded random generator.
+ * @param minimumValue Inclusive lower bound.
+ * @param maximumValue Inclusive upper bound.
+ * @returns Seeded number within the range.
+ *
+ * @private helper of `octopus3AvatarVisual`
+ */
+function resolveSeededRange(random, minimumValue, maximumValue) {
+    return minimumValue + random() * (maximumValue - minimumValue);
+}
+/**
+ * Resolves one seeded integer inside the provided inclusive range.
+ *
+ * @param random Seeded random generator.
+ * @param minimumValue Inclusive lower bound.
+ * @param maximumValue Inclusive upper bound.
+ * @returns Seeded integer within the range.
+ *
+ * @private helper of `octopus3AvatarVisual`
+ */
+function resolveSeededIntegerRange(random, minimumValue, maximumValue) {
+    return minimumValue + Math.floor(random() * (maximumValue - minimumValue + 1));
+}
+/**
+ * Converts an opacity ratio into a two-digit hexadecimal alpha suffix.
+ *
+ * @param opacity Opacity ratio in the range `[0, 1]`.
+ * @returns Two-digit hexadecimal alpha string.
+ *
+ * @private helper of `octopus3AvatarVisual`
+ */
+function formatAlphaHex(opacity) {
+    return Math.round(Math.min(1, Math.max(0, opacity)) * 255)
+        .toString(16)
+        .padStart(2, '0');
+}
 /**
  * Octopus3 avatar visual.
  *
@@ -28001,22 +28484,24 @@ const octopus3AvatarVisual = {
     isAnimated: true,
     supportsPointerTracking: true,
     render({ context, size, palette, createRandom, timeMs, interaction }) {
-        const staticRandom = createRandom('octopus3-static');
-        const centerX = size * (0.5 + (staticRandom() - 0.5) * 0.02) + interaction.bodyOffsetX * size * 0.05;
-        const centerY = size * (0.41 + staticRandom() * 0.05) + interaction.bodyOffsetY * size * 0.035;
-        const bodyRadius = size * (0.2 + staticRandom() * 0.045);
-        const horizontalStretch = 1.08 + staticRandom() * 0.22;
-        const verticalStretch = 0.9 + staticRandom() * 0.12;
-        const mantleLift = size * (0.105 + staticRandom() * 0.03);
-        const lowerDrop = size * (0.028 + staticRandom() * 0.022);
-        const tentacleDepth = size * (0.022 + staticRandom() * 0.018);
-        const wobbleAmplitude = size * (0.01 + staticRandom() * 0.01);
-        const lobeCount = 5 + Math.floor(staticRandom() * 3);
-        const shapePhase = staticRandom() * Math.PI * 2;
-        const tentacleCount = 8 + Math.floor(staticRandom() * 5);
-        const eyeSpacing = size * (0.11 + staticRandom() * 0.04);
-        const eyeRadiusX = size * (0.056 + staticRandom() * 0.014);
-        const eyeRadiusY = eyeRadiusX * (1.18 + staticRandom() * 0.18);
+        const morphologyProfile = createOctopus3MorphologyProfile(createRandom);
+        const animationRandom = createRandom('octopus3-animation-profile');
+        const eyeRandom = createRandom('octopus3-eye-profile');
+        const centerX = size * (0.5 + morphologyProfile.body.centerXJitterRatio) + interaction.bodyOffsetX * size * 0.05;
+        const centerY = size * morphologyProfile.body.centerYRatio + interaction.bodyOffsetY * size * 0.035;
+        const bodyRadius = size * morphologyProfile.body.bodyRadiusRatio;
+        const horizontalStretch = morphologyProfile.body.horizontalStretch;
+        const verticalStretch = morphologyProfile.body.verticalStretch;
+        const mantleLift = size * morphologyProfile.body.mantleLiftRatio;
+        const lowerDrop = size * morphologyProfile.body.lowerDropRatio;
+        const tentacleDepth = size * morphologyProfile.body.tentacleDepthRatio;
+        const wobbleAmplitude = size * morphologyProfile.body.wobbleAmplitudeRatio;
+        const lobeCount = morphologyProfile.body.lobeCount;
+        const shapePhase = animationRandom() * Math.PI * 2;
+        const eyeSpacing = size * morphologyProfile.face.eyeSpacingRatio;
+        const eyeCenterY = centerY + size * morphologyProfile.face.eyeCenterYOffsetRatio;
+        const eyeRadiusX = size * morphologyProfile.face.eyeRadiusXRatio;
+        const eyeRadiusY = eyeRadiusX * morphologyProfile.face.eyeHeightRatio;
         const bodyPoints = createOrganicOctopusBodyPoints({
             centerX,
             centerY,
@@ -28030,7 +28515,7 @@ const octopus3AvatarVisual = {
             lobeCount,
             shapePhase,
             timeMs,
-            pointCount: 40,
+            pointCount: morphologyProfile.body.pointCount,
         });
         const tentacleShapes = createOrganicOctopusTentacleShapes({
             size,
@@ -28038,17 +28523,27 @@ const octopus3AvatarVisual = {
             centerY,
             bodyRadius,
             horizontalStretch,
-            tentacleCount,
+            tentacleCount: morphologyProfile.tentacles.count,
             shapePhase,
             createRandom,
             timeMs,
             saltPrefix: 'octopus3',
             bodyPoints,
+            variation: {
+                flowLengthScale: morphologyProfile.tentacles.flowLengthScale,
+                lateralReachScale: morphologyProfile.tentacles.lateralReachScale,
+                tipReachScale: morphologyProfile.tentacles.tipReachScale,
+                baseWidthScale: morphologyProfile.tentacles.baseWidthScale,
+                tipWidthScale: morphologyProfile.tentacles.tipWidthScale,
+                rootSpreadScale: morphologyProfile.tentacles.rootSpreadScale,
+                startYOffsetScale: morphologyProfile.tentacles.startYOffsetScale,
+                swayScale: morphologyProfile.tentacles.swayScale,
+            },
         });
         drawAvatarFrame(context, size, palette);
-        drawOctopus3Atmosphere(context, size, palette, centerX, centerY, timeMs, shapePhase);
+        drawOctopus3Atmosphere(context, size, palette, centerX, centerY, timeMs, shapePhase, morphologyProfile);
         context.beginPath();
-        context.ellipse(centerX, centerY + size * 0.25, size * 0.24, size * 0.08, 0, 0, Math.PI * 2);
+        context.ellipse(centerX, centerY + size * 0.25, size * morphologyProfile.body.shadowWidthRatio, size * morphologyProfile.body.shadowHeightRatio, 0, 0, Math.PI * 2);
         context.fillStyle = `${palette.shadow}33`;
         context.fill();
         for (const tentacleShape of tentacleShapes) {
@@ -28076,8 +28571,8 @@ const octopus3AvatarVisual = {
         innerGlowGradient.addColorStop(1, `${palette.shadow}00`);
         context.fillStyle = innerGlowGradient;
         context.fillRect(centerX - size * 0.36, centerY - size * 0.34, size * 0.72, size * 0.72);
-        drawMantleCurrents(context, centerX, centerY, size, palette, timeMs, shapePhase);
-        drawMantleNodes(context, centerX, centerY, size, palette, createRandom);
+        drawMantleCurrents(context, centerX, centerY, size, palette, timeMs, shapePhase, morphologyProfile);
+        drawMantleNodes(context, centerX, centerY, size, palette, createRandom, morphologyProfile);
         context.restore();
         context.save();
         traceSmoothClosedPath(context, bodyPoints);
@@ -28086,14 +28581,19 @@ const octopus3AvatarVisual = {
         context.stroke();
         context.restore();
         context.beginPath();
-        context.ellipse(centerX, centerY - size * 0.14, size * 0.18, size * 0.062, 0, Math.PI, Math.PI * 2);
+        context.ellipse(centerX, centerY + size * morphologyProfile.body.crownHighlightYOffsetRatio, size * morphologyProfile.body.crownHighlightWidthRatio, size * morphologyProfile.body.crownHighlightHeightRatio, 0, Math.PI, Math.PI * 2);
         context.fillStyle = `${palette.highlight}3d`;
         context.fill();
-        drawSeededEye(context, centerX - eyeSpacing, centerY - size * 0.01, eyeRadiusX, eyeRadiusY, (staticRandom() - 0.5) * 0.28, palette, timeMs, shapePhase, interaction);
-        drawSeededEye(context, centerX + eyeSpacing, centerY - size * 0.01, eyeRadiusX, eyeRadiusY, (staticRandom() - 0.5) * 0.28, palette, timeMs, shapePhase + Math.PI / 4, interaction);
+        drawSeededEye(context, centerX - eyeSpacing, eyeCenterY, eyeRadiusX, eyeRadiusY, -morphologyProfile.face.eyeTiltBias + (eyeRandom() - 0.5) * morphologyProfile.face.eyeRotationRange, palette, timeMs, shapePhase, interaction, morphologyProfile.face.eyeStyle);
+        drawSeededEye(context, centerX + eyeSpacing, eyeCenterY, eyeRadiusX, eyeRadiusY, morphologyProfile.face.eyeTiltBias + (eyeRandom() - 0.5) * morphologyProfile.face.eyeRotationRange, palette, timeMs, shapePhase + Math.PI / 4, interaction, morphologyProfile.face.eyeStyle);
+        const mouthHalfWidth = size * morphologyProfile.face.mouthWidthRatio;
+        const mouthY = centerY + size * morphologyProfile.face.mouthYOffsetRatio;
+        const mouthCornerTilt = size * morphologyProfile.face.mouthCornerTiltRatio;
         context.beginPath();
-        context.moveTo(centerX - size * 0.07, centerY + size * 0.09);
-        context.quadraticCurveTo(centerX, centerY + size * (0.14 + Math.sin(timeMs / 620 + shapePhase) * 0.016) + interaction.gazeY * size * 0.012, centerX + size * 0.07, centerY + size * 0.09);
+        context.moveTo(centerX - mouthHalfWidth, mouthY - mouthCornerTilt);
+        context.quadraticCurveTo(centerX + size * morphologyProfile.face.mouthCenterOffsetRatio, centerY +
+            size * (morphologyProfile.face.mouthCurveDepthRatio + Math.sin(timeMs / 620 + shapePhase) * 0.016) +
+            interaction.gazeY * size * 0.012, centerX + mouthHalfWidth, mouthY + mouthCornerTilt);
         context.strokeStyle = `${palette.ink}b3`;
         context.lineWidth = size * 0.012;
         context.lineCap = 'round';
@@ -28110,17 +28610,18 @@ const octopus3AvatarVisual = {
  * @param centerY Body center Y coordinate.
  * @param timeMs Current animation time in milliseconds.
  * @param shapePhase Seed-based phase offset.
+ * @param morphologyProfile Seeded morphology profile.
  *
  * @private helper of `octopus3AvatarVisual`
  */
-function drawOctopus3Atmosphere(context, size, palette, centerX, centerY, timeMs, shapePhase) {
-    const haloGradient = context.createRadialGradient(centerX, centerY - size * 0.08, size * 0.06, centerX, centerY, size * 0.62);
+function drawOctopus3Atmosphere(context, size, palette, centerX, centerY, timeMs, shapePhase, morphologyProfile) {
+    const haloGradient = context.createRadialGradient(centerX, centerY - size * (0.07 + (morphologyProfile.body.verticalStretch - 0.9) * 0.05), size * 0.06, centerX, centerY, size * (0.56 + morphologyProfile.body.bodyRadiusRatio * 0.45));
     haloGradient.addColorStop(0, `${palette.highlight}5c`);
     haloGradient.addColorStop(0.35, `${palette.accent}26`);
     haloGradient.addColorStop(1, `${palette.highlight}00`);
     context.fillStyle = haloGradient;
     context.fillRect(0, 0, size, size);
-    const lowerGlowGradient = context.createRadialGradient(centerX + Math.sin(timeMs / 1600 + shapePhase) * size * 0.04, centerY + size * 0.2, size * 0.04, centerX, centerY + size * 0.2, size * 0.48);
+    const lowerGlowGradient = context.createRadialGradient(centerX + Math.sin(timeMs / 1600 + shapePhase) * size * 0.04, centerY + size * (0.18 + morphologyProfile.tentacles.flowLengthScale * 0.025), size * 0.04, centerX, centerY + size * (0.18 + morphologyProfile.tentacles.flowLengthScale * 0.025), size * (0.42 + morphologyProfile.tentacles.lateralReachScale * 0.06));
     lowerGlowGradient.addColorStop(0, `${palette.secondary}1f`);
     lowerGlowGradient.addColorStop(1, `${palette.secondary}00`);
     context.fillStyle = lowerGlowGradient;
@@ -28229,18 +28730,22 @@ function drawTentacleSuckers(context, tentacleShape, palette) {
  * @param palette Derived avatar palette.
  * @param timeMs Current animation time in milliseconds.
  * @param shapePhase Seed-based phase offset.
+ * @param morphologyProfile Seeded morphology profile.
  *
  * @private helper of `octopus3AvatarVisual`
  */
-function drawMantleCurrents(context, centerX, centerY, size, palette, timeMs, shapePhase) {
-    for (let currentIndex = 0; currentIndex < 6; currentIndex++) {
-        const horizontalOffset = (currentIndex - 2.5) * size * 0.06;
+function drawMantleCurrents(context, centerX, centerY, size, palette, timeMs, shapePhase, morphologyProfile) {
+    const centeredCurrentIndex = (morphologyProfile.details.mantleCurrentCount - 1) / 2;
+    for (let currentIndex = 0; currentIndex < morphologyProfile.details.mantleCurrentCount; currentIndex++) {
+        const horizontalOffset = (currentIndex - centeredCurrentIndex) *
+            size *
+            (0.05 + (morphologyProfile.body.horizontalStretch - 0.9) * 0.025);
         const sway = Math.sin(timeMs / 680 + currentIndex * 0.78 + shapePhase) * size * 0.024;
         context.beginPath();
-        context.moveTo(centerX + horizontalOffset * 0.3, centerY - size * 0.13);
-        context.bezierCurveTo(centerX + horizontalOffset - sway * 0.25, centerY - size * 0.04, centerX + horizontalOffset + sway, centerY + size * 0.06, centerX + horizontalOffset * 0.7 + sway * 0.46, centerY + size * 0.2);
+        context.moveTo(centerX + horizontalOffset * 0.3, centerY - size * (0.11 + morphologyProfile.body.verticalStretch * 0.02));
+        context.bezierCurveTo(centerX + horizontalOffset - sway * 0.25, centerY - size * 0.04, centerX + horizontalOffset + sway, centerY + size * 0.06, centerX + horizontalOffset * 0.7 + sway * 0.46, centerY + size * (0.16 + morphologyProfile.body.verticalStretch * 0.035));
         context.strokeStyle = currentIndex % 2 === 0 ? `${palette.highlight}30` : `${palette.accent}26`;
-        context.lineWidth = size * (0.008 + currentIndex * 0.0007);
+        context.lineWidth = size * (0.0075 + currentIndex * 0.00065 + morphologyProfile.tentacles.baseWidthScale * 0.0005);
         context.lineCap = 'round';
         context.stroke();
     }
@@ -28254,14 +28759,17 @@ function drawMantleCurrents(context, centerX, centerY, size, palette, timeMs, sh
  * @param size Canvas size in CSS pixels.
  * @param palette Derived avatar palette.
  * @param createRandom Seeded random factory scoped to the avatar.
+ * @param morphologyProfile Seeded morphology profile.
  *
  * @private helper of `octopus3AvatarVisual`
  */
-function drawMantleNodes(context, centerX, centerY, size, palette, createRandom) {
-    for (let nodeIndex = 0; nodeIndex < 5; nodeIndex++) {
+function drawMantleNodes(context, centerX, centerY, size, palette, createRandom, morphologyProfile) {
+    for (let nodeIndex = 0; nodeIndex < morphologyProfile.details.mantleNodeCount; nodeIndex++) {
         const nodeRandom = createRandom(`octopus3-node-${nodeIndex}`);
-        const nodeX = centerX + (nodeRandom() - 0.5) * size * 0.28;
-        const nodeY = centerY - size * 0.03 + (nodeRandom() - 0.5) * size * 0.2;
+        const nodeX = centerX + (nodeRandom() - 0.5) * size * (0.2 + (morphologyProfile.body.horizontalStretch - 0.9) * 0.16);
+        const nodeY = centerY -
+            size * 0.03 +
+            (nodeRandom() - 0.5) * size * (0.16 + (morphologyProfile.body.verticalStretch - 0.82) * 0.1);
         const nodeRadius = size * (0.016 + nodeRandom() * 0.016);
         context.beginPath();
         context.arc(nodeX, nodeY, nodeRadius, 0, Math.PI * 2);
@@ -28282,10 +28790,11 @@ function drawMantleNodes(context, centerX, centerY, size, palette, createRandom)
  * @param timeMs Current animation time in milliseconds.
  * @param phase Seed-based animation phase.
  * @param interaction Smoothed avatar interaction state.
+ * @param eyeStyle Seeded eye-style traits.
  *
  * @private helper of `octopus3AvatarVisual`
  */
-function drawSeededEye(context, centerX, centerY, radiusX, radiusY, rotation, palette, timeMs, phase, interaction) {
+function drawSeededEye(context, centerX, centerY, radiusX, radiusY, rotation, palette, timeMs, phase, interaction, eyeStyle) {
     const { pupilOffsetX, pupilOffsetY } = resolveOrganicEyeMotion({
         radiusX,
         radiusY,
@@ -28306,11 +28815,11 @@ function drawSeededEye(context, centerX, centerY, radiusX, radiusY, rotation, pa
     irisGradient.addColorStop(0.58, palette.secondary);
     irisGradient.addColorStop(1, palette.shadow);
     context.beginPath();
-    context.ellipse(pupilOffsetX, pupilOffsetY, radiusX * 0.66, radiusY * 0.74, 0, 0, Math.PI * 2);
+    context.ellipse(pupilOffsetX, pupilOffsetY, radiusX * 0.66 * eyeStyle.irisScale, radiusY * 0.74 * eyeStyle.irisScale, 0, 0, Math.PI * 2);
     context.fillStyle = irisGradient;
     context.fill();
     context.beginPath();
-    context.ellipse(pupilOffsetX, pupilOffsetY, radiusX * 0.14, radiusY * 0.5, 0, 0, Math.PI * 2);
+    context.ellipse(pupilOffsetX, pupilOffsetY, radiusX * 0.14 * eyeStyle.pupilWidthScale, radiusY * 0.5 * eyeStyle.pupilHeightScale, 0, 0, Math.PI * 2);
     context.fillStyle = palette.ink;
     context.fill();
     context.beginPath();
@@ -28327,12 +28836,21 @@ function drawSeededEye(context, centerX, centerY, radiusX, radiusY, rotation, pa
     context.lineWidth = radiusX * 0.18;
     context.stroke();
     context.beginPath();
-    context.moveTo(-radiusX * 0.88, -radiusY * 0.08);
-    context.quadraticCurveTo(0, -radiusY * (0.9 - interaction.gazeY * 0.16 + interaction.intensity * 0.08), radiusX * 0.88, -radiusY * 0.08);
+    context.moveTo(-radiusX * 0.88, -radiusY * eyeStyle.upperLidInsetRatio);
+    context.quadraticCurveTo(0, -radiusY * (eyeStyle.upperLidArchRatio - interaction.gazeY * 0.16 + interaction.intensity * 0.08), radiusX * 0.88, -radiusY * eyeStyle.upperLidInsetRatio);
     context.strokeStyle = `${palette.shadow}73`;
     context.lineWidth = radiusX * 0.16;
     context.lineCap = 'round';
     context.stroke();
+    if (eyeStyle.lowerLidOpacity > 0) {
+        context.beginPath();
+        context.moveTo(-radiusX * 0.74, radiusY * 0.2);
+        context.quadraticCurveTo(0, radiusY * 0.38, radiusX * 0.74, radiusY * 0.2);
+        context.strokeStyle = `${palette.highlight}${formatAlphaHex(eyeStyle.lowerLidOpacity)}`;
+        context.lineWidth = radiusX * 0.08;
+        context.lineCap = 'round';
+        context.stroke();
+    }
     context.restore();
 }
 
@@ -28466,32 +28984,55 @@ function getAvatarVisualById(visualId) {
     return avatarVisual;
 }
 
+/**
+ * Resolves the stable avatar render inputs reused across multiple frames.
+ *
+ * @param options Avatar identity and visual selection.
+ * @returns Stable render data ready to be used by `renderAvatarVisual`.
+ *
+ * @private shared helper for canvas avatar rendering
+ */
+function resolveAvatarRenderDefinition(options) {
+    const avatarDefinition = normalizeAvatarDefinition(options.avatarDefinition);
+    const surface = options.surface || 'framed';
+    return {
+        avatarDefinition,
+        avatarVisual: getAvatarVisualById(options.visualId),
+        surface,
+        palette: createAvatarPalette(avatarDefinition, surface),
+        createRandom: createAvatarRandomFactory(avatarDefinition),
+    };
+}
 /**
  * Renders one deterministic avatar frame into the provided canvas.
  *
  * @param options Rendering options.
+ * @param resolvedAvatarRenderDefinition Optional stable render data reused between frames.
  *
  * @private shared helper for canvas avatar rendering
  */
-function renderAvatarVisual(options) {
-    const normalizedAvatarDefinition = normalizeAvatarDefinition(options.avatarDefinition);
-    const avatarVisual = getAvatarVisualById(options.visualId);
-    const surface = options.surface || 'framed';
+function renderAvatarVisual(options, resolvedAvatarRenderDefinition) {
+    const resolvedRenderDefinition = resolvedAvatarRenderDefinition ||
+        resolveAvatarRenderDefinition({
+            avatarDefinition: options.avatarDefinition,
+            visualId: options.visualId,
+            surface: options.surface,
+        });
     const context = options.canvas.getContext('2d');
     if (!context) {
         throw new Error('2D canvas rendering context is unavailable.');
     }
     prepareAvatarCanvas(options.canvas, context, options.size, options.devicePixelRatio || 1);
-    avatarVisual.render({
+    resolvedRenderDefinition.avatarVisual.render({
         canvas: options.canvas,
         context,
         size: options.size,
         devicePixelRatio: options.devicePixelRatio || 1,
         timeMs: options.timeMs,
-        avatarDefinition: normalizedAvatarDefinition,
-        palette: createAvatarPalette(normalizedAvatarDefinition, surface),
-        createRandom: createAvatarRandomFactory(normalizedAvatarDefinition),
-        surface,
+        avatarDefinition: resolvedRenderDefinition.avatarDefinition,
+        palette: resolvedRenderDefinition.palette,
+        createRandom: resolvedRenderDefinition.createRandom,
+        surface: resolvedRenderDefinition.surface,
         interaction: options.interaction || createIdleAvatarInteractionState(),
     });
 }
@@ -28502,6 +29043,14 @@ function renderAvatarVisual(options) {
  * @private helper of `<Avatar/>`
  */
 const AVATAR_CANVAS_RADIUS_RATIO = 0.18;
+/**
+ * Maximum time between layout-bound refreshes while pointer tracking is active.
+ *
+ * This keeps pointer-aware visuals aligned with chat/layout shifts without forcing a layout read every frame.
+ *
+ * @private helper of `<Avatar/>`
+ */
+const ACTIVE_POINTER_BOUNDS_REFRESH_MS = 120;
 /**
  * Canvas-based deterministic avatar component.
  *
@@ -28512,21 +29061,58 @@ function Avatar(props) {
     const canvasRef = useRef(null);
     const animationStartRef = useRef(null);
     const interactionRuntimeStateRef = useRef(createAvatarInteractionRuntimeState());
+    const avatarBoundsRef = useRef(null);
+    const lastResolvedPointerVersionRef = useRef(-1);
+    const lastResolvedViewportLayoutVersionRef = useRef(-1);
+    const lastAvatarBoundsRefreshAtRef = useRef(0);
     const avatarColorsKey = avatarDefinition.colors.join('|');
-    const normalizedAvatarDefinition = useMemo(() => normalizeAvatarDefinition(avatarDefinition), [avatarDefinition.agentHash, avatarDefinition.agentName, avatarColorsKey]);
-    const avatarDefinitionKey = useMemo(() => createAvatarDefinitionKey(normalizedAvatarDefinition), [normalizedAvatarDefinition.agentHash, normalizedAvatarDefinition.agentName, normalizedAvatarDefinition.colors.join('|')]);
-    const avatarVisual = useMemo(() => getAvatarVisualById(visualId), [visualId]);
+    const resolvedAvatarRenderDefinition = useMemo(() => resolveAvatarRenderDefinition({
+        avatarDefinition,
+        visualId,
+        surface,
+    }), [avatarDefinition.agentHash, avatarDefinition.agentName, avatarColorsKey, surface, visualId]);
+    const avatarDefinitionKey = useMemo(() => createAvatarDefinitionKey(resolvedAvatarRenderDefinition.avatarDefinition), [
+        resolvedAvatarRenderDefinition.avatarDefinition.agentHash,
+        resolvedAvatarRenderDefinition.avatarDefinition.agentName,
+        resolvedAvatarRenderDefinition.avatarDefinition.colors.join('|'),
+    ]);
+    const [isVisible, setIsVisible] = useState(true);
+    useEffect(() => {
+        const canvas = canvasRef.current;
+        if (!canvas) {
+            throw new Error('Avatar canvas is not mounted.');
+        }
+        return observeAvatarVisibility(canvas, setIsVisible);
+    }, []);
     useEffect(() => {
         interactionRuntimeStateRef.current = createAvatarInteractionRuntimeState();
-    }, [avatarDefinitionKey, visualId]);
+        avatarBoundsRef.current = null;
+        lastResolvedPointerVersionRef.current = -1;
+        lastResolvedViewportLayoutVersionRef.current = -1;
+        lastAvatarBoundsRefreshAtRef.current = 0;
+    }, [avatarDefinitionKey, isVisible, visualId]);
+    useEffect(() => {
+        const canvas = canvasRef.current;
+        if (!canvas || typeof ResizeObserver === 'undefined') {
+            return;
+        }
+        const resizeObserver = new ResizeObserver(() => {
+            avatarBoundsRef.current = null;
+        });
+        resizeObserver.observe(canvas);
+        return () => {
+            resizeObserver.disconnect();
+        };
+    }, []);
     useEffect(() => {
         const canvas = canvasRef.current;
         if (!canvas) {
             throw new Error('Avatar canvas is not mounted.');
         }
+        const avatarVisual = resolvedAvatarRenderDefinition.avatarVisual;
         const isDynamicAvatar = avatarVisual.isAnimated || avatarVisual.supportsPointerTracking === true;
-        const releasePointerTracking = avatarVisual.supportsPointerTracking ? retainAvatarPointerTracking() : null;
-        let animationFrameId = null;
+        const shouldTrackPointer = avatarVisual.supportsPointerTracking === true && isVisible;
+        const releasePointerTracking = shouldTrackPointer ? retainAvatarPointerTracking() : null;
         if (animationStartRef.current === null) {
             animationStartRef.current = performance.now();
         }
@@ -28534,7 +29120,18 @@ function Avatar(props) {
             const pointerSnapshot = avatarVisual.supportsPointerTracking ? getAvatarPointerSnapshot() : null;
             let interactionState = createIdleAvatarInteractionState();
             if (avatarVisual.supportsPointerTracking && pointerSnapshot) {
-                interactionRuntimeStateRef.current = stepAvatarInteractionRuntimeState(interactionRuntimeStateRef.current, resolveAvatarPointerTarget(canvas.getBoundingClientRect(), pointerSnapshot), now);
+                const pointerSnapshotVersion = getAvatarPointerSnapshotVersion();
+                const viewportLayoutVersion = getAvatarViewportLayoutVersion();
+                if (avatarBoundsRef.current === null ||
+                    lastResolvedPointerVersionRef.current !== pointerSnapshotVersion ||
+                    lastResolvedViewportLayoutVersionRef.current !== viewportLayoutVersion ||
+                    now - lastAvatarBoundsRefreshAtRef.current >= ACTIVE_POINTER_BOUNDS_REFRESH_MS) {
+                    avatarBoundsRef.current = canvas.getBoundingClientRect();
+                    lastResolvedPointerVersionRef.current = pointerSnapshotVersion;
+                    lastResolvedViewportLayoutVersionRef.current = viewportLayoutVersion;
+                    lastAvatarBoundsRefreshAtRef.current = now;
+                }
+                interactionRuntimeStateRef.current = stepAvatarInteractionRuntimeState(interactionRuntimeStateRef.current, resolveAvatarPointerTarget(avatarBoundsRef.current, pointerSnapshot), now);
                 interactionState = interactionRuntimeStateRef.current;
             }
             else if (avatarVisual.supportsPointerTracking) {
@@ -28543,35 +29140,35 @@ function Avatar(props) {
             }
             renderAvatarVisual({
                 canvas,
-                avatarDefinition: normalizedAvatarDefinition,
+                avatarDefinition: resolvedAvatarRenderDefinition.avatarDefinition,
                 visualId,
                 surface,
                 size,
                 timeMs: now - animationStartRef.current,
                 devicePixelRatio: window.devicePixelRatio || 1,
                 interaction: interactionState,
-            });
-            if (isDynamicAvatar) {
-                animationFrameId = window.requestAnimationFrame(renderFrame);
-            }
+            }, resolvedAvatarRenderDefinition);
         };
         renderFrame(performance.now());
+        if (!isDynamicAvatar || !isVisible) {
+            return () => {
+                releasePointerTracking === null || releasePointerTracking === void 0 ? void 0 : releasePointerTracking();
+            };
+        }
+        const releaseAnimationListener = retainAvatarAnimationListener(renderFrame);
         return () => {
-            if (animationFrameId !== null) {
-                window.cancelAnimationFrame(animationFrameId);
-            }
+            releaseAnimationListener();
             releasePointerTracking === null || releasePointerTracking === void 0 ? void 0 : releasePointerTracking();
         };
     }, [
         avatarDefinitionKey,
-        avatarVisual.isAnimated,
-        avatarVisual.supportsPointerTracking,
-        normalizedAvatarDefinition,
+        isVisible,
+        resolvedAvatarRenderDefinition,
         size,
         surface,
         visualId,
     ]);
-    return (jsx("canvas", { ref: canvasRef, title: title || `${normalizedAvatarDefinition.agentName} avatar`, className: className, style: {
+    return (jsx("canvas", { ref: canvasRef, title: title || `${resolvedAvatarRenderDefinition.avatarDefinition.agentName} avatar`, className: className, style: {
             width: size,
             height: size,
             display: 'block',
@@ -29980,7 +30577,7 @@ function StreamingFeaturePlaceholder({ kind }) {
  * @private internal component of `<ChatMessageItem/>`
  */
 function ChatMessageRichContent(props) {
-    const { content, contentSegments, streamingFeaturePlaceholderKind, onCreateAgent } = props;
+    const { content, contentSegments, streamingFeaturePlaceholderKind, onCreateAgent, mode } = props;
     if (content === LOADING_INTERACTIVE_IMAGE) {
         return null;
     }
@@ -29989,7 +30586,7 @@ function ChatMessageRichContent(props) {
                     return (jsx(MarkdownContent, { content: segment.content, onCreateAgent: onCreateAgent }, `text-${segmentIndex}`));
                 }
                 if (segment.type === 'code') {
-                    return (jsx(CodeBlock, { code: segment.code, language: segment.language, onCreateAgent: onCreateAgent }, `code-${segmentIndex}`));
+                    return (jsx(CodeBlock, { code: segment.code, language: segment.language, onCreateAgent: onCreateAgent, theme: mode }, `code-${segmentIndex}`));
                 }
                 if (segment.type === 'image') {
                     return (jsx(ImagePromptRenderer, { alt: segment.alt, prompt: segment.prompt }, `image-${segmentIndex}`));
@@ -46822,6 +47419,8 @@ const ChatMessageItem = memo(
     const swipeDirectionMultiplier = isMe ? -1 : 1;
     const swipeTranslation = `${isMe ? -replySwipeDistance : replySwipeDistance}px`;
     const isReplySwipeArmed = replySwipeDistance >= REPLY_SWIPE_TRIGGER_PX * 0.5;
+    const articleModeBackgroundColor = mode === 'DARK' ? 'rgba(15, 23, 42, 0.78)' : '#ffffff';
+    const articleModeTextColor = mode === 'DARK' ? '#e2e8f0' : '#0f172a';
     /**
      * Renders the optional message utility buttons used for copy/read actions.
      *
@@ -47023,10 +47622,12 @@ const ChatMessageItem = memo(
                             aspectRatio: '1 / 1',
                             borderRadius: '50%',
                         } })), isAvatarTooltipVisible && (participant === null || participant === void 0 ? void 0 : participant.agentSource) && avatarTooltipPosition && (jsx(AvatarProfileTooltip, { ref: tooltipRef, agentSource: participant.agentSource, position: avatarTooltipPosition }))] })), jsxs("div", { className: classNames(styles$5.messageStack, chatCssClassNames.messageStack), children: [shouldShowParticipantLabel && participantLabel && (jsx("div", { className: styles$5.participantLabel, children: participantLabel })), jsxs("div", { className: classNames(styles$5.messageText, isReplyActionEnabled && styles$5.replyEnabledMessageText, isReplySwipeArmed && styles$5.replySwipeActive, isAgentArticleMode && styles$5.articleModeAgentMessageText, chatCssClassNames.messageContent), style: {
-                            '--message-bg-color': isAgentArticleMode ? '#ffffff' : color.toHex(),
-                            '--message-text-color': isAgentArticleMode ? '#0f172a' : colorOfText.toHex(),
+                            '--message-bg-color': isAgentArticleMode ? articleModeBackgroundColor : color.toHex(),
+                            '--message-text-color': isAgentArticleMode
+                                ? articleModeTextColor
+                                : colorOfText.toHex(),
                             '--chat-message-swipe-offset': swipeTranslation,
-                        }, onPointerDown: handleReplyPointerDown, onPointerMove: handleReplyPointerMove, onPointerUp: handleReplyPointerEnd, onPointerCancel: resetReplySwipe, children: [isReplyActionEnabled && (jsx("div", { className: classNames(styles$5.replySwipeIndicator, isMe && styles$5.replySwipeIndicatorRight, isReplySwipeArmed && styles$5.replySwipeIndicatorActive), "aria-hidden": "true", children: jsx(Reply, { className: styles$5.replySwipeIndicatorIcon }) })), !shouldRenderArticleActionsBar && renderMessageReadAndCopyControls(), message.isVoiceCall && (jsx("div", { className: styles$5.voiceCallIndicator, children: jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", children: jsx("path", { d: "M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z" }) }) })), replyingToMessage && replyPreviewText && replySenderLabel && (jsx(ChatReplyPreview, { label: replyPreviewLabel, senderLabel: replySenderLabel, previewText: replyPreviewText, className: styles$5.replyBubblePreview })), jsx("div", { ref: contentWithoutButtonsRef, children: jsx(ChatMessageRichContent, { content: message.content, contentSegments: contentSegments, streamingFeaturePlaceholderKind: streamingFeaturePlaceholderKind, onCreateAgent: onCreateAgent }) }), message.attachments && message.attachments.length > 0 && (jsx("div", { className: styles$5.attachments, children: message.attachments.map((attachment, index) => (jsxs("a", { href: attachment.url, target: "_blank", rel: "noopener noreferrer", className: styles$5.attachment, title: attachment.name, children: [jsx("span", { className: styles$5.attachmentIcon, children: "\uD83D\uDCCE" }), jsx("span", { className: styles$5.attachmentName, children: attachment.name })] }, index))) })), jsx(ChatMessageToolCallChips, { chips: toolCallChips, onToolCallClick: onToolCallClick }), citationFootnoteRenderModel.footnotes.length > 0 && (jsx("div", { className: styles$5.citationFootnotes, children: citationFootnoteRenderModel.footnotes.map((footnote) => (jsxs("div", { className: styles$5.citationFootnoteItem, children: [jsx("span", { className: styles$5.citationFootnoteNumber, children: footnote.number }), jsx(SourceChip, { citation: footnote.citation, onClick: onCitationClick, isCitationIdVisible: false })] }, `citation-footnote-${footnote.number}-${footnote.citation.source}`))) })), transitiveCitations.length > 0 && (jsx("div", { className: styles$5.sourceCitations, children: transitiveCitations.map((citation, index) => (jsx(SourceChip, { citation: citation, suffix: `by ${citation.origin.label}`, onClick: onCitationClick }, `team-source-${citation.source}-${index}`))) })), shouldShowButtons && (jsx("div", { className: styles$5.messageButtons, children: renderableButtons.map(({ button, buttonIndex }) => (jsx("button", { type: "button", className: classNames(styles$5.messageButton, button.type === 'action' && styles$5.actionMessageButton), onClick: (event) => {
+                        }, onPointerDown: handleReplyPointerDown, onPointerMove: handleReplyPointerMove, onPointerUp: handleReplyPointerEnd, onPointerCancel: resetReplySwipe, children: [isReplyActionEnabled && (jsx("div", { className: classNames(styles$5.replySwipeIndicator, isMe && styles$5.replySwipeIndicatorRight, isReplySwipeArmed && styles$5.replySwipeIndicatorActive), "aria-hidden": "true", children: jsx(Reply, { className: styles$5.replySwipeIndicatorIcon }) })), !shouldRenderArticleActionsBar && renderMessageReadAndCopyControls(), message.isVoiceCall && (jsx("div", { className: styles$5.voiceCallIndicator, children: jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", children: jsx("path", { d: "M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z" }) }) })), replyingToMessage && replyPreviewText && replySenderLabel && (jsx(ChatReplyPreview, { label: replyPreviewLabel, senderLabel: replySenderLabel, previewText: replyPreviewText, className: styles$5.replyBubblePreview })), jsx("div", { ref: contentWithoutButtonsRef, children: jsx(ChatMessageRichContent, { content: message.content, contentSegments: contentSegments, streamingFeaturePlaceholderKind: streamingFeaturePlaceholderKind, onCreateAgent: onCreateAgent, mode: mode }) }), message.attachments && message.attachments.length > 0 && (jsx("div", { className: styles$5.attachments, children: message.attachments.map((attachment, index) => (jsxs("a", { href: attachment.url, target: "_blank", rel: "noopener noreferrer", className: styles$5.attachment, title: attachment.name, children: [jsx("span", { className: styles$5.attachmentIcon, children: "\uD83D\uDCCE" }), jsx("span", { className: styles$5.attachmentName, children: attachment.name })] }, index))) })), jsx(ChatMessageToolCallChips, { chips: toolCallChips, onToolCallClick: onToolCallClick }), citationFootnoteRenderModel.footnotes.length > 0 && (jsx("div", { className: styles$5.citationFootnotes, children: citationFootnoteRenderModel.footnotes.map((footnote) => (jsxs("div", { className: styles$5.citationFootnoteItem, children: [jsx("span", { className: styles$5.citationFootnoteNumber, children: footnote.number }), jsx(SourceChip, { citation: footnote.citation, onClick: onCitationClick, isCitationIdVisible: false })] }, `citation-footnote-${footnote.number}-${footnote.citation.source}`))) })), transitiveCitations.length > 0 && (jsx("div", { className: styles$5.sourceCitations, children: transitiveCitations.map((citation, index) => (jsx(SourceChip, { citation: citation, suffix: `by ${citation.origin.label}`, onClick: onCitationClick }, `team-source-${citation.source}-${index}`))) })), shouldShowButtons && (jsx("div", { className: styles$5.messageButtons, children: renderableButtons.map(({ button, buttonIndex }) => (jsx("button", { type: "button", className: classNames(styles$5.messageButton, button.type === 'action' && styles$5.actionMessageButton), onClick: (event) => {
                                         event.stopPropagation();
                                         if (button.type === 'message') {
                                             const quickMessageHandler = onQuickMessageButton || onMessage;
@@ -47220,7 +47821,7 @@ function ChatRatingModal(props) {
         }
         return '';
     })();
-    return (jsx("div", { className: styles$5.ratingModal, onClick: (event) => {
+    return (jsx("div", { className: styles$5.ratingModal, "data-chat-modal": "rating", "data-chat-theme": mode.toLowerCase(), onClick: (event) => {
             if (event.target === event.currentTarget && isMobile) {
                 onClose();
             }
@@ -47324,12 +47925,14 @@ const TOOL_CALL_REPORT_FILENAME_UNSAFE_CHARACTER_PATTERN = /[^a-zA-Z0-9_-]/g;
  */
 function renderAdvancedToolCallDetails(options) {
     const { toolCall } = options;
+    const mode = options.mode || 'LIGHT';
     const header = resolveAdvancedToolCallHeader(options);
     const payloadSections = createAdvancedToolCallPayloadSections(toolCall, options.availableTools);
     return (jsxs(Fragment, { children: [jsxs("header", { className: styles$5.toolCallHeader, children: [jsx("span", { className: styles$5.toolCallIcon, "aria-hidden": "true", children: header.emoji }), jsxs("div", { className: styles$5.toolCallHeaderMeta, children: [jsx("p", { className: styles$5.toolCallModalLabel, children: "Advanced" }), jsx("h3", { className: styles$5.toolCallTitle, children: header.title }), jsxs("p", { className: styles$5.toolCallSubtitle, children: [header.subtitle, " \u00B7 ", resolveToolCallState(toolCall).toLowerCase()] })] })] }), jsx("div", { className: styles$5.toolCallGrid, children: payloadSections.map((payloadSection) => (jsxs("section", { className: styles$5.toolCallPanel, children: [jsx("p", { className: styles$5.toolCallPanelTitle, children: payloadSection.title }), renderAdvancedToolCallPayload({
                             toolCall,
                             sectionId: payloadSection.id,
                             payload: payloadSection.payload,
+                            mode,
                         })] }, payloadSection.id))) })] }));
 }
 /**
@@ -47463,7 +48066,7 @@ function createAdvancedToolCallPayloadSections(toolCall, availableTools) {
  * @private function of ChatToolCallModal
  */
 function renderAdvancedToolCallPayload(options) {
-    const { toolCall, sectionId, payload } = options;
+    const { toolCall, sectionId, payload, mode } = options;
     const formattedPayload = formatToolCallPayload(payload);
     const modelPath = createToolCallPayloadMonacoPath({
         toolCall,
@@ -47471,7 +48074,7 @@ function renderAdvancedToolCallPayload(options) {
         language: formattedPayload.language,
     });
     const editorHeight = resolveToolCallPayloadEditorHeight(formattedPayload.content);
-    return (jsx("div", { className: styles$5.toolCallPayloadContainer, children: jsx("div", { className: styles$5.toolCallPayloadEditor, children: jsx(MonacoEditorWithShadowDom, { height: `${editorHeight}px`, language: formattedPayload.language, path: modelPath, value: formattedPayload.content, theme: "vs-light", options: TOOL_CALL_PAYLOAD_EDITOR_OPTIONS }) }) }));
+    return (jsx("div", { className: styles$5.toolCallPayloadContainer, children: jsx("div", { className: styles$5.toolCallPayloadEditor, children: jsx(MonacoEditorWithShadowDom, { height: `${editorHeight}px`, language: formattedPayload.language, path: modelPath, value: formattedPayload.content, theme: mode === 'DARK' ? 'vs-dark' : 'vs-light', options: TOOL_CALL_PAYLOAD_EDITOR_OPTIONS }) }) }));
 }
 /**
  * Resolves Monaco editor height from payload line count with bounded limits.
@@ -49543,12 +50146,6 @@ function TeamToolCallModalContent(options) {
             });
         }
     }
-    const staticConversationDelayConfig = {
-        ...FAST_FLOW,
-        beforeFirstMessage: 0,
-        // Show the full internal exchange immediately so the modal never opens as a blank panel.
-        showIntermediateMessages: messages.length,
-    };
     const agentName = ((_c = (_b = teamResult.conversation) === null || _b === void 0 ? void 0 : _b.find((entry) => entry.sender === 'AGENT' || entry.role === 'AGENT')) === null || _c === void 0 ? void 0 : _c.name) || 'Agent';
     const teammateConversationName = ((_e = (_d = teamResult.conversation) === null || _d === void 0 ? void 0 : _d.find((entry) => entry.sender === 'TEAMMATE' || entry.role === 'TEAMMATE')) === null || _e === void 0 ? void 0 : _e.name) || '';
     const teammateProfile = teammateUrl ? teamProfiles[teammateUrl] : undefined;
@@ -49585,7 +50182,12 @@ function TeamToolCallModalContent(options) {
             avatarSrc: resolvedTeammateAvatar || undefined,
         },
     ];
-    return (jsxs(Fragment, { children: [jsx("div", { className: classNames(styles$5.searchModalHeader, styles$5.teamModalHeader), children: jsxs("div", { className: styles$5.teamHeaderParticipants, children: [jsx(TeamHeaderProfile, { label: resolvedAgentLabel, avatarSrc: resolvedAgentAvatar, avatarDefinition: resolvedAgentAvatarDefinition, avatarVisualId: resolvedAgentAvatarVisualId, fallbackColor: resolvedAgentHeaderColor }), jsx("span", { className: styles$5.teamHeaderDivider, children: "talking with" }), jsx(TeamHeaderProfile, { label: resolvedTeammateLabel, avatarSrc: resolvedTeammateAvatar, fallbackColor: "#0ea5e9", href: teammateLink })] }) }), jsxs("div", { className: styles$5.searchModalContent, children: [messages.length > 0 ? (jsx("div", { className: styles$5.teamChatContainer, children: jsx(MockedChat, { title: `Chat between ${resolvedAgentLabel} and ${resolvedTeammateLabel}`, messages: messages, participants: participants, isResettable: false, isPausable: false, isSaveButtonEnabled: false, isCopyButtonEnabled: false, visual: "STANDALONE", delayConfig: staticConversationDelayConfig }) })) : (jsx("div", { className: styles$5.noResults, children: "No teammate conversation available." })), (hasTeamToolCalls || hasTeamCitations) && (jsxs("div", { className: styles$5.teamToolCallSection, children: [hasTeamToolCalls && (jsxs("div", { className: styles$5.teamToolCallGroup, children: [jsx("div", { className: styles$5.teamToolCallHeading, children: "Actions" }), jsx("div", { className: styles$5.teamToolCallChips, children: teamToolCalls.map((toolCallEntry, index) => {
+    return (jsxs(Fragment, { children: [jsx("div", { className: classNames(styles$5.searchModalHeader, styles$5.teamModalHeader), children: jsxs("div", { className: styles$5.teamHeaderParticipants, children: [jsx(TeamHeaderProfile, { label: resolvedAgentLabel, avatarSrc: resolvedAgentAvatar, avatarDefinition: resolvedAgentAvatarDefinition, avatarVisualId: resolvedAgentAvatarVisualId, fallbackColor: resolvedAgentHeaderColor }), jsx("span", { className: styles$5.teamHeaderDivider, children: "talking with" }), jsx(TeamHeaderProfile, { label: resolvedTeammateLabel, avatarSrc: resolvedTeammateAvatar, fallbackColor: "#0ea5e9", href: teammateLink })] }) }), jsxs("div", { className: styles$5.searchModalContent, children: [messages.length > 0 ? (jsx("div", { className: styles$5.teamChatContainer, children: jsx(MockedChat, { title: `Chat between ${resolvedAgentLabel} and ${resolvedTeammateLabel}`, messages: messages, participants: participants, isResettable: false, isPausable: false, isSaveButtonEnabled: false, isCopyButtonEnabled: false, layout: "STANDALONE", delayConfig: {
+                                // Note+TODO: For some strange reason, <MockedChat/> is not running and stays static on the initial frame, so doing this hack to force it to show the entire chat at once. Need to investigate why the animation is not running as expected and then just use `delayConfig={FAST_FLOW}`
+                                ...FAST_FLOW,
+                                beforeFirstMessage: 0,
+                                showIntermediateMessages: messages.length,
+                            }, visualMode: "BUBBLE_MODE" }) })) : (jsx("div", { className: styles$5.noResults, children: "No teammate conversation available." })), (hasTeamToolCalls || hasTeamCitations) && (jsxs("div", { className: styles$5.teamToolCallSection, children: [hasTeamToolCalls && (jsxs("div", { className: styles$5.teamToolCallGroup, children: [jsx("div", { className: styles$5.teamToolCallHeading, children: "Actions" }), jsx("div", { className: styles$5.teamToolCallChips, children: teamToolCalls.map((toolCallEntry, index) => {
                                             const chipletInfo = getToolCallChipletInfo(toolCallEntry.toolCall, undefined, toolTitles);
                                             const chipletText = buildToolCallChipText(chipletInfo);
                                             return (jsxs("button", { className: styles$5.completedToolCall, onClick: () => {
@@ -49604,12 +50206,13 @@ function TeamToolCallModalContent(options) {
  *
  * @private component of `ChatToolCallModal`
  */
-function ChatToolCallModalContent({ agentParticipant, availableTools, buttonColor, chatUiTranslations, focusedToolCall, isAdvancedView, locale, onClearSelectedTeamToolCall, onRequestAdvancedView, onSelectTeamToolCall, selectedTeamToolCall, teamProfiles, teamResult, teamToolCallSummary, toolCall, toolCallDate, toolTitles, }) {
+function ChatToolCallModalContent({ agentParticipant, availableTools, buttonColor, chatUiTranslations, focusedToolCall, isAdvancedView, locale, mode, onClearSelectedTeamToolCall, onRequestAdvancedView, onSelectTeamToolCall, selectedTeamToolCall, teamProfiles, teamResult, teamToolCallSummary, toolCall, toolCallDate, toolTitles, }) {
     if (isAdvancedView) {
         return renderAdvancedToolCallDetails({
             toolCall: focusedToolCall,
             toolTitles,
             availableTools,
+            mode,
         });
     }
     if (teamResult === null || teamResult === void 0 ? void 0 : teamResult.teammate) {
@@ -49876,7 +50479,7 @@ function handleModalBackdropClick(event, onClose) {
  * @private component of `<Chat/>`
  */
 function ChatToolCallModal(props) {
-    const { isOpen, toolCall, toolCallIdentity, onClose, toolTitles, agentParticipant, buttonColor, teamAgentProfiles, chatUiTranslations, locale, availableTools, } = props;
+    const { isOpen, toolCall, mode = 'LIGHT', toolCallIdentity, onClose, toolTitles, agentParticipant, buttonColor, teamAgentProfiles, chatUiTranslations, locale, availableTools, } = props;
     const { clearSelectedTeamToolCall, exportAdvancedToolCallReport, focusedToolCall, isAdvancedView, modalDialogRef, openAdvancedView, selectTeamToolCall, selectedTeamToolCall, teamProfiles, teamResult, teamToolCallSummary, toggleViewMode, toolCallDate, } = useChatToolCallModalState({
         isOpen,
         toolCall,
@@ -49896,9 +50499,9 @@ function ChatToolCallModal(props) {
     const modeToggleLabel = isAdvancedView
         ? (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallModalSimpleLabel) || 'Simple'
         : (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallModalAdvancedLabel) || 'Advanced';
-    return (jsx("div", { className: styles$5.ratingModal, onClick: (event) => {
+    return (jsx("div", { className: styles$5.ratingModal, "data-chat-modal": "tool-call", "data-chat-theme": mode.toLowerCase(), onClick: (event) => {
             handleModalBackdropClick(event, onClose);
-        }, children: jsxs("div", { ref: modalDialogRef, className: classNames(styles$5.ratingModalContent, styles$5.toolCallModal), role: "dialog", "aria-modal": "true", "aria-label": modalTitle, tabIndex: -1, children: [jsx("button", { type: "button", className: styles$5.modalCloseButton, onClick: onClose, "aria-label": closeButtonLabel, children: jsx(CloseIcon, {}) }), jsx(ChatToolCallModalContent, { toolCall: toolCall, focusedToolCall: resolvedFocusedToolCall, isAdvancedView: isAdvancedView, teamResult: teamResult, toolCallDate: toolCallDate, teamToolCallSummary: teamToolCallSummary, selectedTeamToolCall: selectedTeamToolCall, onSelectTeamToolCall: selectTeamToolCall, onClearSelectedTeamToolCall: clearSelectedTeamToolCall, teamProfiles: teamProfiles, toolTitles: toolTitles, agentParticipant: agentParticipant, buttonColor: buttonColor, locale: locale, chatUiTranslations: chatUiTranslations, availableTools: availableTools, onRequestAdvancedView: openAdvancedView }), jsxs("div", { className: styles$5.toolCallModeFooter, children: [isAdvancedView && (jsxs(Fragment, { children: [jsx("button", { type: "button", className: styles$5.toolCallModeButton, onClick: () => {
+        }, children: jsxs("div", { ref: modalDialogRef, className: classNames(styles$5.ratingModalContent, styles$5.toolCallModal), role: "dialog", "aria-modal": "true", "aria-label": modalTitle, tabIndex: -1, children: [jsx("button", { type: "button", className: styles$5.modalCloseButton, onClick: onClose, "aria-label": closeButtonLabel, children: jsx(CloseIcon, {}) }), jsx(ChatToolCallModalContent, { toolCall: toolCall, focusedToolCall: resolvedFocusedToolCall, isAdvancedView: isAdvancedView, teamResult: teamResult, toolCallDate: toolCallDate, teamToolCallSummary: teamToolCallSummary, selectedTeamToolCall: selectedTeamToolCall, onSelectTeamToolCall: selectTeamToolCall, onClearSelectedTeamToolCall: clearSelectedTeamToolCall, teamProfiles: teamProfiles, toolTitles: toolTitles, agentParticipant: agentParticipant, buttonColor: buttonColor, locale: locale, chatUiTranslations: chatUiTranslations, availableTools: availableTools, onRequestAdvancedView: openAdvancedView, mode: mode }), jsxs("div", { className: styles$5.toolCallModeFooter, children: [isAdvancedView && (jsxs(Fragment, { children: [jsx("button", { type: "button", className: styles$5.toolCallModeButton, onClick: () => {
                                         void exportAdvancedToolCallReport('clipboard');
                                     }, children: copyButtonLabel }), jsx("button", { type: "button", className: styles$5.toolCallModeButton, onClick: () => {
                                         void exportAdvancedToolCallReport('file');
@@ -50524,7 +51127,7 @@ function hasChatActions(postprocessedMessages, { onReset, newChatButtonHref, onU
  * @public exported from `@promptbook/components`
  */
 function Chat(props) {
-    const { title = 'Chat', messages, onChange, onMessage, onActionButton, onQuickMessageButton, onReplyToMessage, onCancelReply, onReset, resetRequiresConfirmation = true, newChatButtonHref, onFeedback, feedbackMode = 'stars', feedbackTranslations, timingTranslations, onFileUpload, chatLocale, speechRecognition, placeholderMessageContent, defaultMessage, enterBehavior, resolveEnterBehavior, children, className, style, isAiTextHumanizedAndPromptbookified = true, isVoiceCalling = false, isFocusedOnLoad, participants = [], canReplyToMessage, replyingToMessage, extraActions, actionsContainer, saveFormats, isSaveButtonEnabled = true, isCopyButtonEnabled = true, buttonColor: buttonColorRaw, onUseTemplate, onCreateAgent, toolTitles, teammates, teamAgentProfiles, visual, visualMode = 'ARTICLE_MODE', effectConfigs, soundSystem, speechRecognitionLanguage, isSpeechPlaybackEnabled = true, elevenLabsVoiceId, chatUiTranslations, } = props;
+    const { title = 'Chat', messages, onChange, onMessage, onActionButton, onQuickMessageButton, onReplyToMessage, onCancelReply, onReset, resetRequiresConfirmation = true, newChatButtonHref, onFeedback, feedbackMode = 'stars', feedbackTranslations, timingTranslations, onFileUpload, chatLocale, speechRecognition, placeholderMessageContent, defaultMessage, enterBehavior, resolveEnterBehavior, children, className, style, isAiTextHumanizedAndPromptbookified = true, isVoiceCalling = false, isFocusedOnLoad, participants = [], canReplyToMessage, replyingToMessage, extraActions, actionsContainer, saveFormats, isSaveButtonEnabled = true, isCopyButtonEnabled = true, buttonColor: buttonColorRaw, onUseTemplate, onCreateAgent, toolTitles, teammates, teamAgentProfiles, layout, visualMode = 'ARTICLE_MODE', theme = 'LIGHT', effectConfigs, soundSystem, speechRecognitionLanguage, isSpeechPlaybackEnabled = true, elevenLabsVoiceId, chatUiTranslations, } = props;
     const buttonColor = useMemo(() => Color.from(buttonColorRaw || '#0066cc'), [buttonColorRaw]);
     const agentParticipant = useMemo(() => participants.find((participant) => participant.name === 'AGENT'), [participants]);
     const postprocessedMessages = useChatPostprocessedMessages({
@@ -50544,7 +51147,7 @@ function Chat(props) {
     const { citationModalOpen, closeCitationModal, closeToolCallModal, openCitation, openToolCall, selectedCitation, selectedMessageAvailableTools, selectedToolCall, selectedToolCallIdentity, toolCallModalOpen, } = useChatToolCallState({
         messages: postprocessedMessages,
     });
-    const mode = 'LIGHT';
+    const mode = theme;
     const scrollToBottomCssClassName = getChatCssClassName('scrollToBottom');
     const handleButtonClick = useCallback((originalHandler) => {
         return (event) => {
@@ -50565,11 +51168,11 @@ function Chat(props) {
         extraActions,
         isSaveButtonEnabled,
     });
-    const isConstrainedArticleMode = visualMode === 'ARTICLE_MODE' && visual === 'FULL_PAGE';
+    const isConstrainedArticleMode = visualMode === 'ARTICLE_MODE' && layout === 'FULL_PAGE';
     useChatCompleteNotification(messages, soundSystem);
     return (jsxs(Fragment, { children: [feedbackStatus && (jsx("div", { className: classNames(styles$5.feedbackStatus, feedbackStatus.variant === 'success'
                     ? styles$5.feedbackStatusSuccess
-                    : styles$5.feedbackStatusError), "aria-live": "polite", role: "status", children: feedbackStatus.message })), effectConfigs && effectConfigs.length > 0 && (jsx(ChatEffectsSystem, { messages: postprocessedMessages, effectConfigs: effectConfigs, soundSystem: soundSystem })), jsx("div", { className: classNames(className, styles$5.Chat, visual === 'STANDALONE' && styles$5.standaloneVisual, visual === 'FULL_PAGE' && styles$5.fullPageVisual, isConstrainedArticleMode && styles$5.constrainedArticleVisual, getChatCssClassName('Chat'), chatCssClassNames.chat), style, children: jsxs("div", { className: classNames(className, styles$5.chatMainFlow, getChatCssClassName('chatMainFlow'), chatCssClassNames.chatMainFlow), children: [children && jsx("div", { className: classNames(styles$5.chatChildren), children: children }), shouldShowScrollToBottom && (jsx("div", { className: styles$5.scrollToBottomContainer, children: jsxs("div", { className: styles$5.scrollToBottomWrapper, children: [jsx(SolidArrowButton, { "data-button-type": "custom", direction: "down", iconSize: 33, className: classNames(styles$5.scrollToBottom, scrollToBottomCssClassName), onClick: handleButtonClick(() => scrollToBottom()), "aria-label": ariaLabel, title: ariaLabel }), badgeLabel && (jsx("span", { className: styles$5.scrollToBottomBadge, "aria-live": "polite", role: "status", children: badgeLabel }))] }) })), isVoiceCalling && (jsx("div", { className: styles$5.voiceCallIndicatorBar, children: jsxs("div", { className: styles$5.voiceCallIndicator, children: [jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", children: jsx("path", { d: "M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z" }) }), jsx("span", { children: "Voice call active" }), jsx("div", { className: styles$5.voiceCallPulse })] }) })), jsx(ChatActionsBar, { actionsRef: actionsRef, actionsContainer: actionsContainer, messages: postprocessedMessages, participants: participants, title: title, onReset: onReset, resetRequiresConfirmation: resetRequiresConfirmation, newChatButtonHref: newChatButtonHref, onUseTemplate: onUseTemplate, extraActions: extraActions, saveFormats: saveFormats, isSaveButtonEnabled: isSaveButtonEnabled, shouldFadeActions: shouldFadeActions, shouldDisableActions: shouldDisableActions, chatUiTranslations: chatUiTranslations, onButtonClick: handleButtonClick }), jsx(ChatMessageList, { messages: postprocessedMessages, participants: participants, expandedMessageId: expandedMessageId, messageRatings: messageRatings, setExpandedMessageId: setExpandedMessageId, handleRating: handleRating, mode: mode, isCopyButtonEnabled: isCopyButtonEnabled, isFeedbackEnabled: isFeedbackEnabled, feedbackMode: feedbackMode, feedbackTranslations: feedbackTranslations, timingTranslations: timingTranslations, chatLocale: chatLocale, onCopy: handleCopy, onMessage: onMessage, onActionButton: onActionButton, onQuickMessageButton: onQuickMessageButton, onReplyToMessage: onReplyToMessage, canReplyToMessage: canReplyToMessage, onCreateAgent: onCreateAgent, toolTitles: toolTitles, teammates: teammates, teamAgentProfiles: teamAgentProfiles, visualMode: visualMode, soundSystem: soundSystem, onToolCallClick: openToolCall, onCitationClick: openCitation, setChatMessagesElement: setChatMessagesElement, onScroll: handleChatScroll, isSpeechPlaybackEnabled: isSpeechPlaybackEnabled, elevenLabsVoiceId: elevenLabsVoiceId, chatUiTranslations: chatUiTranslations, chatMessagesClassName: classNames(isConstrainedArticleMode && styles$5.articleModeChatMessages, getChatCssClassName('chatMessages'), chatCssClassNames.chatMessages), hasActions: hasActions }), onMessage && (jsx(ChatInputArea, { onMessage: onMessage, onChange: onChange, onFileUpload: onFileUpload, speechRecognition: speechRecognition, speechRecognitionLanguage: speechRecognitionLanguage, replyingToMessage: replyingToMessage, onCancelReply: onCancelReply, defaultMessage: defaultMessage, enterBehavior: enterBehavior, resolveEnterBehavior: resolveEnterBehavior, placeholderMessageContent: placeholderMessageContent || (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.inputPlaceholder), isFocusedOnLoad: isFocusedOnLoad, isMobile: isMobile, isVoiceCalling: isVoiceCalling, participants: participants, buttonColor: buttonColor, soundSystem: soundSystem, onButtonClick: handleButtonClick, chatUiTranslations: chatUiTranslations, chatInputClassName: classNames(isConstrainedArticleMode && styles$5.articleModeChatInput, getChatCssClassName('chatInput'), chatCssClassNames.chatInput) }))] }) }), jsx(ChatToolCallModal, { isOpen: toolCallModalOpen, toolCall: selectedToolCall, toolCallIdentity: selectedToolCallIdentity, onClose: closeToolCallModal, toolTitles: toolTitles, agentParticipant: agentParticipant, buttonColor: buttonColor, teamAgentProfiles: teamAgentProfiles, chatUiTranslations: chatUiTranslations, locale: chatLocale, availableTools: selectedMessageAvailableTools }), jsx(ChatCitationModal, { isOpen: citationModalOpen, citation: selectedCitation, participants: participants, soundSystem: soundSystem, onClose: closeCitationModal }), jsx(ChatRatingModal, { isOpen: ratingModalOpen, selectedMessage: selectedMessage, postprocessedMessages: postprocessedMessages, messages: messages, hoveredRating: hoveredRating, messageRatings: messageRatings, textRating: textRating, feedbackMode: feedbackMode, feedbackTranslations: feedbackTranslations, mode: mode, isMobile: isMobile, onClose: () => setRatingModalOpen(false), setHoveredRating: setHoveredRating, setMessageRatings: setMessageRatings, setSelectedMessage: setSelectedMessage, setTextRating: setTextRating, submitRating: submitRating })] }));
+                    : styles$5.feedbackStatusError), "aria-live": "polite", role: "status", children: feedbackStatus.message })), effectConfigs && effectConfigs.length > 0 && (jsx(ChatEffectsSystem, { messages: postprocessedMessages, effectConfigs: effectConfigs, soundSystem: soundSystem })), jsx("div", { className: classNames(className, styles$5.Chat, layout === 'STANDALONE' && styles$5.standaloneVisual, layout === 'FULL_PAGE' && styles$5.fullPageVisual, isConstrainedArticleMode && styles$5.constrainedArticleVisual, getChatCssClassName('Chat'), chatCssClassNames.chat), "data-chat-theme": mode.toLowerCase(), style, children: jsxs("div", { className: classNames(className, styles$5.chatMainFlow, getChatCssClassName('chatMainFlow'), chatCssClassNames.chatMainFlow), children: [children && jsx("div", { className: classNames(styles$5.chatChildren), children: children }), shouldShowScrollToBottom && (jsx("div", { className: styles$5.scrollToBottomContainer, children: jsxs("div", { className: styles$5.scrollToBottomWrapper, children: [jsx(SolidArrowButton, { "data-button-type": "custom", direction: "down", iconSize: 33, className: classNames(styles$5.scrollToBottom, scrollToBottomCssClassName), onClick: handleButtonClick(() => scrollToBottom()), "aria-label": ariaLabel, title: ariaLabel }), badgeLabel && (jsx("span", { className: styles$5.scrollToBottomBadge, "aria-live": "polite", role: "status", children: badgeLabel }))] }) })), isVoiceCalling && (jsx("div", { className: styles$5.voiceCallIndicatorBar, children: jsxs("div", { className: styles$5.voiceCallIndicator, children: [jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", children: jsx("path", { d: "M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z" }) }), jsx("span", { children: "Voice call active" }), jsx("div", { className: styles$5.voiceCallPulse })] }) })), jsx(ChatActionsBar, { actionsRef: actionsRef, actionsContainer: actionsContainer, messages: postprocessedMessages, participants: participants, title: title, onReset: onReset, resetRequiresConfirmation: resetRequiresConfirmation, newChatButtonHref: newChatButtonHref, onUseTemplate: onUseTemplate, extraActions: extraActions, saveFormats: saveFormats, isSaveButtonEnabled: isSaveButtonEnabled, shouldFadeActions: shouldFadeActions, shouldDisableActions: shouldDisableActions, chatUiTranslations: chatUiTranslations, onButtonClick: handleButtonClick }), jsx(ChatMessageList, { messages: postprocessedMessages, participants: participants, expandedMessageId: expandedMessageId, messageRatings: messageRatings, setExpandedMessageId: setExpandedMessageId, handleRating: handleRating, mode: mode, isCopyButtonEnabled: isCopyButtonEnabled, isFeedbackEnabled: isFeedbackEnabled, feedbackMode: feedbackMode, feedbackTranslations: feedbackTranslations, timingTranslations: timingTranslations, chatLocale: chatLocale, onCopy: handleCopy, onMessage: onMessage, onActionButton: onActionButton, onQuickMessageButton: onQuickMessageButton, onReplyToMessage: onReplyToMessage, canReplyToMessage: canReplyToMessage, onCreateAgent: onCreateAgent, toolTitles: toolTitles, teammates: teammates, teamAgentProfiles: teamAgentProfiles, visualMode: visualMode, soundSystem: soundSystem, onToolCallClick: openToolCall, onCitationClick: openCitation, setChatMessagesElement: setChatMessagesElement, onScroll: handleChatScroll, isSpeechPlaybackEnabled: isSpeechPlaybackEnabled, elevenLabsVoiceId: elevenLabsVoiceId, chatUiTranslations: chatUiTranslations, chatMessagesClassName: classNames(isConstrainedArticleMode && styles$5.articleModeChatMessages, getChatCssClassName('chatMessages'), chatCssClassNames.chatMessages), hasActions: hasActions }), onMessage && (jsx(ChatInputArea, { onMessage: onMessage, onChange: onChange, onFileUpload: onFileUpload, speechRecognition: speechRecognition, speechRecognitionLanguage: speechRecognitionLanguage, replyingToMessage: replyingToMessage, onCancelReply: onCancelReply, defaultMessage: defaultMessage, enterBehavior: enterBehavior, resolveEnterBehavior: resolveEnterBehavior, placeholderMessageContent: placeholderMessageContent || (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.inputPlaceholder), isFocusedOnLoad: isFocusedOnLoad, isMobile: isMobile, isVoiceCalling: isVoiceCalling, participants: participants, buttonColor: buttonColor, soundSystem: soundSystem, onButtonClick: handleButtonClick, chatUiTranslations: chatUiTranslations, chatInputClassName: classNames(isConstrainedArticleMode && styles$5.articleModeChatInput, getChatCssClassName('chatInput'), chatCssClassNames.chatInput) }))] }) }), jsx(ChatToolCallModal, { isOpen: toolCallModalOpen, toolCall: selectedToolCall, toolCallIdentity: selectedToolCallIdentity, onClose: closeToolCallModal, toolTitles: toolTitles, agentParticipant: agentParticipant, buttonColor: buttonColor, teamAgentProfiles: teamAgentProfiles, chatUiTranslations: chatUiTranslations, locale: chatLocale, availableTools: selectedMessageAvailableTools, mode: mode }), jsx(ChatCitationModal, { isOpen: citationModalOpen, citation: selectedCitation, participants: participants, soundSystem: soundSystem, onClose: closeCitationModal }), jsx(ChatRatingModal, { isOpen: ratingModalOpen, selectedMessage: selectedMessage, postprocessedMessages: postprocessedMessages, messages: messages, hoveredRating: hoveredRating, messageRatings: messageRatings, textRating: textRating, feedbackMode: feedbackMode, feedbackTranslations: feedbackTranslations, mode: mode, isMobile: isMobile, onClose: () => setRatingModalOpen(false), setHoveredRating: setHoveredRating, setMessageRatings: setMessageRatings, setSelectedMessage: setSelectedMessage, setTextRating: setTextRating, submitRating: submitRating })] }));
 }
 
 /**
@@ -51875,7 +52478,7 @@ function PromptbookAgentSeamlessIntegration(props) {
                                 : styles.PromptbookAgentSeamlessIntegrationStatusPending) }), jsxs("div", { className: styles.PromptbookAgentSeamlessIntegrationText, children: [jsx("div", { className: styles.PromptbookAgentSeamlessIntegrationLabel, children: "Chat" }), jsx("div", { className: styles.PromptbookAgentSeamlessIntegrationHint, children: displayName })] }), jsx("span", { className: styles.PromptbookAgentSeamlessIntegrationScreenReaderOnly, children: connectionStatusText })] }), isOpen && (jsxs("div", { className: styles.PromptbookAgentSeamlessIntegrationWindow, id: windowId, children: [jsxs("div", { className: styles.PromptbookAgentSeamlessIntegrationHeader, style: { backgroundColor: color }, ref: setHeaderElement, children: [jsxs("div", { className: styles.PromptbookAgentSeamlessIntegrationTitleWrap, children: [jsx("div", { className: styles.PromptbookAgentSeamlessIntegrationTitle, children: displayName }), jsx("div", { className: styles.PromptbookAgentSeamlessIntegrationSubtitle, children: connectionStatusText })] }), isIframeUsed && (jsx("button", { className: styles.PromptbookAgentSeamlessIntegrationClose, onClick: () => setOpen(false), title: "Close", "aria-label": "Close chat", children: jsx(CloseIcon, {}) }))] }), jsx("div", { className: styles.PromptbookAgentSeamlessIntegrationContent, children: isIframeUsed ? (jsxs(Fragment, { children: [!isIframeLoaded && (jsxs("div", { className: styles.PromptbookAgentSeamlessIntegrationLoading, children: [jsx("div", { className: styles.PromptbookAgentSeamlessIntegrationLoadingShimmer }), jsx("div", { className: styles.PromptbookAgentSeamlessIntegrationLoadingSpinner }), jsx("div", { className: styles.PromptbookAgentSeamlessIntegrationLoadingTitle, children: "Preparing your chat" }), jsxs("div", { className: styles.PromptbookAgentSeamlessIntegrationLoadingText, children: ["Connecting to ", displayName, "..."] })] })), jsx("iframe", { src: agentUrl + '/chat?headless', className: styles.PromptbookAgentSeamlessIntegrationIframe, style: { opacity: isIframeLoaded ? 1 : 0 }, tabIndex: -1, onLoad: () => {
                                         setIsIframeLoaded(true);
                                         setIsChatConnected(true);
-                                    } })] })) : agent ? (jsx(AgentChat, { agent: agent, actionsContainer: headerElement, isFocusedOnLoad: isFocusedOnLoad, extraActions: jsx("button", { className: styles.PromptbookAgentSeamlessIntegrationClose, onClick: () => setOpen(false), title: "Close", "aria-label": "Close chat", children: jsx(CloseIcon, {}) }), visual: "STANDALONE" })) : error ? (jsxs("div", { className: styles.PromptbookAgentSeamlessIntegrationError, children: [jsx("div", { className: styles.PromptbookAgentSeamlessIntegrationErrorTitle, children: "Failed to connect to the agent" }), jsx("div", { className: styles.PromptbookAgentSeamlessIntegrationErrorMessage, children: error.message })] })) : (jsxs("div", { className: styles.PromptbookAgentSeamlessIntegrationLoading, children: [jsx("div", { className: styles.PromptbookAgentSeamlessIntegrationLoadingShimmer }), jsx("div", { className: styles.PromptbookAgentSeamlessIntegrationLoadingSpinner }), jsx("div", { className: styles.PromptbookAgentSeamlessIntegrationLoadingTitle, children: "Preparing your chat" }), jsxs("div", { className: styles.PromptbookAgentSeamlessIntegrationLoadingText, children: ["Connecting to ", displayName, "..."] })] })) })] }))] }));
+                                    } })] })) : agent ? (jsx(AgentChat, { agent: agent, actionsContainer: headerElement, isFocusedOnLoad: isFocusedOnLoad, extraActions: jsx("button", { className: styles.PromptbookAgentSeamlessIntegrationClose, onClick: () => setOpen(false), title: "Close", "aria-label": "Close chat", children: jsx(CloseIcon, {}) }), layout: "STANDALONE" })) : error ? (jsxs("div", { className: styles.PromptbookAgentSeamlessIntegrationError, children: [jsx("div", { className: styles.PromptbookAgentSeamlessIntegrationErrorTitle, children: "Failed to connect to the agent" }), jsx("div", { className: styles.PromptbookAgentSeamlessIntegrationErrorMessage, children: error.message })] })) : (jsxs("div", { className: styles.PromptbookAgentSeamlessIntegrationLoading, children: [jsx("div", { className: styles.PromptbookAgentSeamlessIntegrationLoadingShimmer }), jsx("div", { className: styles.PromptbookAgentSeamlessIntegrationLoadingSpinner }), jsx("div", { className: styles.PromptbookAgentSeamlessIntegrationLoadingTitle, children: "Preparing your chat" }), jsxs("div", { className: styles.PromptbookAgentSeamlessIntegrationLoadingText, children: ["Connecting to ", displayName, "..."] })] })) })] }))] }));
 }
 
 /**