diff --git a/.dockerignore b/.dockerignore
index caf903d478..6b6bad8a7d 100644
--- a/.dockerignore
+++ b/.dockerignore
@@ -10,5 +10,6 @@
 !/packages/test/fluent-bundle/dist
 !/packages/test/harness/dist
 !/packages/test/page-object/dist
+!/packages/test/test-assets/out
 !/packages/test/web-server/dist
 !/serve-test.json
diff --git a/.github/workflows/pull-request-validation.yml b/.github/workflows/pull-request-validation.yml
index 1971e4aee2..13163b6857 100644
--- a/.github/workflows/pull-request-validation.yml
+++ b/.github/workflows/pull-request-validation.yml
@@ -66,6 +66,7 @@ jobs:
           ./packages/fluent-theme/static/
           ./packages/test/harness/
           ./packages/test/page-object/dist/
+          ./packages/test/test-assets/out/
           ./packages/test/web-server/dist/
           ./serve-test.json
           ./testharness.dockerfile
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 45d7fadba0..0211438d6b 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -319,6 +319,7 @@ Breaking changes in this release:
    - Activity status, in PR [#5669](https://github.com/microsoft/BotFramework-WebChat/pull/5669), by [@OEvgeny](https://github.com/OEvgeny)
    - Text attachment and related components, in PR [#5670](https://github.com/microsoft/BotFramework-WebChat/pull/5670), by [@OEvgeny](https://github.com/OEvgeny)
 - (Experimental) Added custom variants support for `botframework-webchat-fluent-theme` package, in PR [#5675](https://github.com/microsoft/BotFramework-WebChat/pull/5675), by [@OEvgeny](https://github.com/OEvgeny)
+- Improved adaptive cards rendering in copilot variant, in PR [#5682](https://github.com/microsoft/BotFramework-WebChat/pull/5682), by [@OEvgeny](https://github.com/OEvgeny)
 
 ### Deprecated
 
diff --git a/__tests__/assets/custom-element/custom-element.js b/__tests__/assets/custom-element/custom-element.js
index f3ffb99f14..6fd234beb7 100644
--- a/__tests__/assets/custom-element/custom-element.js
+++ b/__tests__/assets/custom-element/custom-element.js
@@ -1,23 +1,5 @@
 /* eslint-env browser */
 
-// #region TODO: Remove me after we bump Chrome to v117+
-const customElementNames = customElements.getName instanceof Function ? null : new WeakMap();
-
-export function getCustomElementName(customElementConstructor) {
-  if (customElementNames) {
-    return customElementNames.get(customElementConstructor);
-  }
-  return customElements.getName(customElementConstructor);
-}
-
-function setCustomElementName(customElementConstructor, name) {
-  if (customElementNames) {
-    customElementNames.set(customElementConstructor, name);
-  }
-  // No need to set for browsers that support customElements.getName()
-}
-// #endregion
-
 export function customElement(elementKey, createElementClass) {
   const elementRegistration = document.querySelector(`element-registration[element-key="${elementKey}"]`);
   elementRegistration.elementConstructor = createElementClass(elementRegistration);
@@ -73,7 +55,6 @@ function initDocument(elementRegistration, currentDocument) {
       }
 
       customElements.define(elementName, constructor, constructor.options);
-      setCustomElementName(constructor, elementName);
 
       result.resolve(constructor);
     },
diff --git a/__tests__/assets/custom-element/keyboard-event.ce.html b/__tests__/assets/custom-element/keyboard-event.ce.html
index 8396000302..44cb1735a5 100644
--- a/__tests__/assets/custom-element/keyboard-event.ce.html
+++ b/__tests__/assets/custom-element/keyboard-event.ce.html
@@ -106,7 +106,7 @@
     <kbd></kbd>
   </template>
   <script type="module">
-    import { customElement, getCustomElementName } from '/assets/custom-element/custom-element.js';
+    import { customElement } from '/assets/custom-element/custom-element.js';
 
     customElement('keyboard-event', currentDocument =>
       class KeyboardEventElement extends HTMLElement {
@@ -130,8 +130,7 @@
         }
   
         static listenKeyboardEvents(scope = window) {
-          // const myTagName = customElements.getName(this)
-          const myTagName = getCustomElementName(this);
+          const myTagName = customElements.getName(this)
           const abortController = new AbortController();
           scope.addEventListener('keydown', event => {
             const element = document.createElement(myTagName);
diff --git a/__tests__/assets/custom-element/test-shell.ce.html b/__tests__/assets/custom-element/test-shell.ce.html
new file mode 100644
index 0000000000..123a386836
--- /dev/null
+++ b/__tests__/assets/custom-element/test-shell.ce.html
@@ -0,0 +1,154 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Test Shell custom element</title>
+  <style>
+    * {
+      box-sizing: border-box;
+    }
+    body {
+      margin: 0;
+    }
+    test-shell {
+      display: grid;
+      grid-template-rows: min-content auto;
+
+      #webchat {
+        height: 640px;
+        width: 380px;
+        transition: width 0.2s 0.2s ease-out;
+      }
+
+      .fui-FluentProvider {
+        display: contents;
+      }
+
+      .webchat__surface {
+        overflow: hidden;
+      }
+    }
+
+    test-shell:has(.theme.variant-copilot) > #webchat {
+      width: 680px;
+    }
+  </style>
+</head>
+<body>
+  <template>
+    <style type="text/css">
+      * {
+        box-sizing: border-box;
+      }
+
+      :host([data-theme="light"]) {
+        --body-background: linear-gradient(135deg, #e0f7ff 0%, #ffe5f0 100%);
+        --webchat-container-background: linear-gradient(160deg, #ffffff22 0%, #f8f9facc 100%);
+        --notice-color: #495057;
+        --notice-background: #f8f9fa77;
+        --notice-border: 1px solid #dee2e6;
+      }
+
+      :host([data-theme="dark"]) {
+        --body-background: linear-gradient(135deg, #0b1a2b 0%, #2c001e 100%);
+        --webchat-container-background: linear-gradient(160deg, #1a1a1acc 0%, #222222cc 100%);
+        --notice-color: #f8f9fa;
+        --notice-background: #49505777;
+        --notice-border: 1px solid #666666;
+      }
+
+      :host {
+        margin: 0;
+        min-height: 100vh;
+        padding: 30px;
+        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
+          Oxygen, Ubuntu, Cantarell, sans-serif;
+        background: var(--body-background);
+        display: grid;
+        gap: 20px;
+
+        opacity: 0;
+        transition: opacity 0.3s 0.7s ease-in-out;
+      }
+
+      :host([data-theme="dark"]), :host([data-theme="light"]) {
+        opacity: 1;
+      }
+
+      .webchat-container {
+        border-radius: 16px;
+        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
+        background: var(--webchat-container-background);
+        position: relative;
+        display: grid;
+        place-self: center;
+
+        .loader-notice {
+          opacity: 0.33;
+          place-self: center;
+        }
+      }
+
+      .notice {
+        background: var(--notice-background);
+        border: var(--notice-border);
+        color: var(--notice-color);
+        padding: 15px;
+        border-radius: 8px;
+        max-width: 440px;
+        font-size: 14px;
+        place-self: start center;
+
+        &::after {
+          content: ' (theme=' attr(data-theme)')' ' (variant=' attr(data-variant)')';
+          opacity: 0.75;
+        } 
+      }
+    </style>
+    <div class="notice">
+    </div>
+    <div class="webchat-container">
+      <slot>
+        <div class="loader-notice">
+          Web Chat root element is not provided.
+        </div>
+      </slot>
+    </div>
+  </template>
+  <script type="module">
+    import { customElement } from '/assets/custom-element/custom-element.js';
+
+    customElement('test-shell', currentDocument =>
+      class TestShellElement extends HTMLElement {
+        constructor() {
+          super();
+          const template = currentDocument.querySelector('template');
+          const fragment = template.content.cloneNode(true);
+
+          this.notice = fragment.querySelector('.notice');
+  
+          this.initDataset();
+          this.initNotice();
+
+          const shadowRoot = this.attachShadow({ mode: 'open' });
+          shadowRoot.appendChild(fragment);
+        }
+
+        initNotice() {
+          this.notice.textContent = document.title;
+
+          Object.assign(this.notice.dataset, this.dataset);
+        }
+
+        initDataset() {
+          const params = new URLSearchParams(location.search)
+          this.dataset.theme = params.get('fluent-theme') || 'light';
+          this.dataset.fluentTheme = this.dataset.theme;
+          this.dataset.variant = params.get('variant');
+        }
+      }
+    );
+  </script>
+</body>
+</html>
\ No newline at end of file
diff --git a/__tests__/assets/esm/postActivity.js b/__tests__/assets/esm/postActivity.js
new file mode 100644
index 0000000000..017e5e5599
--- /dev/null
+++ b/__tests__/assets/esm/postActivity.js
@@ -0,0 +1,18 @@
+export function postActivity(adapter, activityOrString) {
+  const activityTemplate = {
+    type: 'message',
+    from: { id: 'user', name: 'User', role: 'user' },
+    timestamp: new Date().toISOString()
+  };
+
+  return new Promise((resolve, reject) =>
+    adapter
+      .postActivity(
+        Object.assign(
+          activityTemplate,
+          typeof activityOrString === 'string' ? { text: activityOrString } : activityOrString
+        )
+      )
+      .subscribe(resolve, reject)
+  );
+}
diff --git a/__tests__/assets/esm/test.js b/__tests__/assets/esm/test.js
new file mode 100644
index 0000000000..0bbc28e06d
--- /dev/null
+++ b/__tests__/assets/esm/test.js
@@ -0,0 +1,25 @@
+/* eslint-env browser */
+import '/test-harness.mjs';
+import '/test-page-object.mjs';
+import * as WebChat from 'botframework-webchat';
+
+Object.assign(window, { WebChat });
+
+const createHostStub = (host = {}) => ({
+  ...Object.fromEntries(
+    Object.keys(host).map(methodName => [
+      methodName,
+      // eslint-disable-next-line no-console
+      (...args) => console.info(`host.${methodName}()`, ...args)
+    ])
+  ),
+  run: fn => fn()
+});
+
+const isWebDriver = !!navigator.webdriver;
+
+export const host = isWebDriver ? window.host : createHostStub(window.host);
+
+export const { pageConditions, testHelpers } = window;
+
+export const run = host.run || window.run;
diff --git a/__tests__/html2/activity/collapsible.copilot.dark.html.snap-8.png b/__tests__/html2/activity/collapsible.copilot.dark.html.snap-8.png
index b3aa781b22..eaee7c14e5 100644
Binary files a/__tests__/html2/activity/collapsible.copilot.dark.html.snap-8.png and b/__tests__/html2/activity/collapsible.copilot.dark.html.snap-8.png differ
diff --git a/__tests__/html2/activity/collapsible.copilot.html.snap-8.png b/__tests__/html2/activity/collapsible.copilot.html.snap-8.png
index 88a53ac851..97b25da0d6 100644
Binary files a/__tests__/html2/activity/collapsible.copilot.html.snap-8.png and b/__tests__/html2/activity/collapsible.copilot.html.snap-8.png differ
diff --git a/__tests__/html2/activity/collapsible.html b/__tests__/html2/activity/collapsible.html
index 8611aeda1b..8799573a37 100644
--- a/__tests__/html2/activity/collapsible.html
+++ b/__tests__/html2/activity/collapsible.html
@@ -6,11 +6,13 @@
     <script type="importmap">
       {
         "imports": {
-          "react": "https://esm.sh/react@18.3.1",
-          "react-dom": "https://esm.sh/react-dom@18.3.1",
-          "react-dom/": "https://esm.sh/react-dom@18.3.1/",
+          "@fluentui/react-provider": "/__dist__/packages/test/test-assets/out/@fluentui/react-provider.js",
+          "@fluentui/tokens": "/__dist__/packages/test/test-assets/out/@fluentui/tokens.js",
           "@testduet/wait-for": "https://unpkg.com/@testduet/wait-for@main/dist/wait-for.mjs",
-          "@fluentui/react-components": "https://esm.sh/@fluentui/react-components?deps=react@18.3.1&exports=FluentProvider,createDarkTheme,webLightTheme"
+          "react": "https://esm.sh/react@18",
+          "react-dom": "https://esm.sh/react-dom@18",
+          "react-dom/": "https://esm.sh/react-dom@18/",
+          "react-jsx-runtime": "https://esm.sh/react@18/jsx-runtime"
         }
       }
     </script>
@@ -34,10 +36,11 @@
   <body>
     <main id="webchat"></main>
     <script type="module">
+      import { FluentProvider } from '@fluentui/react-provider';
+      import { createDarkTheme, webLightTheme } from '@fluentui/tokens';
+      import { waitFor } from '@testduet/wait-for';
       import React from 'react';
       import { createRoot } from 'react-dom/client';
-      import { FluentProvider, createDarkTheme, webLightTheme } from '@fluentui/react-components';
-      import { waitFor } from '@testduet/wait-for';
 
       async function openLastActivity() {
         let summaries;
diff --git a/__tests__/html2/activity/message-status.html b/__tests__/html2/activity/message-status.html
index c2ffadc3aa..1ddffec38b 100644
--- a/__tests__/html2/activity/message-status.html
+++ b/__tests__/html2/activity/message-status.html
@@ -7,8 +7,8 @@
   <script type="importmap">
     {
       "imports": {
-        "@fluentui/react-provider": "https://esm.sh/@fluentui/react-provider?deps=react@18&exports=FluentProvider",
-        "@fluentui/tokens": "https://esm.sh/@fluentui/tokens?deps=react@18&exports=createDarkTheme,webLightTheme",
+        "@fluentui/react-provider": "/__dist__/packages/test/test-assets/out/@fluentui/react-provider.js",
+        "@fluentui/tokens": "/__dist__/packages/test/test-assets/out/@fluentui/tokens.js",
         "@testduet/wait-for": "https://unpkg.com/@testduet/wait-for@main/dist/wait-for.mjs",
         "botframework-webchat": "/__dist__/packages/bundle/static/botframework-webchat.js",
         "botframework-webchat/component": "/__dist__/packages/bundle/static/botframework-webchat/component.js",
@@ -18,7 +18,8 @@
         "botframework-webchat-fluent-theme": "/__dist__/packages/fluent-theme/static/botframework-webchat-fluent-theme.js",
         "react": "https://esm.sh/react@18",
         "react-dom": "https://esm.sh/react-dom@18",
-        "react-dom/": "https://esm.sh/react-dom@18/"
+        "react-dom/": "https://esm.sh/react-dom@18/",
+        "react-jsx-runtime": "https://esm.sh/react@18/jsx-runtime"
       }
     }
   </script>
diff --git a/__tests__/html2/attachment/adaptiveCard/custom.copilot.dark.html b/__tests__/html2/attachment/adaptiveCard/custom.copilot.dark.html
new file mode 100644
index 0000000000..0fc5a40487
--- /dev/null
+++ b/__tests__/html2/attachment/adaptiveCard/custom.copilot.dark.html
@@ -0,0 +1,10 @@
+<!doctype html>
+<html>
+  <head>
+    <title>Attachment AdaptiveCard: custom (copilot, dark)</title>
+    <script>
+      location = './custom.skip?variant=copilot&fluent-theme=dark';
+    </script>
+  </head>
+  <body></body>
+</html>
diff --git a/__tests__/html2/attachment/adaptiveCard/custom.copilot.dark.html.snap-1.png b/__tests__/html2/attachment/adaptiveCard/custom.copilot.dark.html.snap-1.png
new file mode 100644
index 0000000000..9f998c525a
Binary files /dev/null and b/__tests__/html2/attachment/adaptiveCard/custom.copilot.dark.html.snap-1.png differ
diff --git a/__tests__/html2/attachment/adaptiveCard/custom.copilot.dark.html.snap-2.png b/__tests__/html2/attachment/adaptiveCard/custom.copilot.dark.html.snap-2.png
new file mode 100644
index 0000000000..5b08dc0a24
Binary files /dev/null and b/__tests__/html2/attachment/adaptiveCard/custom.copilot.dark.html.snap-2.png differ
diff --git a/__tests__/html2/attachment/adaptiveCard/custom.copilot.dark.html.snap-3.png b/__tests__/html2/attachment/adaptiveCard/custom.copilot.dark.html.snap-3.png
new file mode 100644
index 0000000000..fd16444267
Binary files /dev/null and b/__tests__/html2/attachment/adaptiveCard/custom.copilot.dark.html.snap-3.png differ
diff --git a/__tests__/html2/attachment/adaptiveCard/custom.copilot.dark.html.snap-4.png b/__tests__/html2/attachment/adaptiveCard/custom.copilot.dark.html.snap-4.png
new file mode 100644
index 0000000000..113c1dd9f6
Binary files /dev/null and b/__tests__/html2/attachment/adaptiveCard/custom.copilot.dark.html.snap-4.png differ
diff --git a/__tests__/html2/attachment/adaptiveCard/custom.copilot.html b/__tests__/html2/attachment/adaptiveCard/custom.copilot.html
new file mode 100644
index 0000000000..6d76613f43
--- /dev/null
+++ b/__tests__/html2/attachment/adaptiveCard/custom.copilot.html
@@ -0,0 +1,10 @@
+<!doctype html>
+<html>
+  <head>
+    <title>Attachment AdaptiveCard: custom (copilot)</title>
+    <script>
+      location = './custom.skip?variant=copilot';
+    </script>
+  </head>
+  <body></body>
+</html>
diff --git a/__tests__/html2/attachment/adaptiveCard/custom.copilot.html.snap-1.png b/__tests__/html2/attachment/adaptiveCard/custom.copilot.html.snap-1.png
new file mode 100644
index 0000000000..a3ca349d7d
Binary files /dev/null and b/__tests__/html2/attachment/adaptiveCard/custom.copilot.html.snap-1.png differ
diff --git a/__tests__/html2/attachment/adaptiveCard/custom.copilot.html.snap-2.png b/__tests__/html2/attachment/adaptiveCard/custom.copilot.html.snap-2.png
new file mode 100644
index 0000000000..7e05883fdf
Binary files /dev/null and b/__tests__/html2/attachment/adaptiveCard/custom.copilot.html.snap-2.png differ
diff --git a/__tests__/html2/attachment/adaptiveCard/custom.copilot.html.snap-3.png b/__tests__/html2/attachment/adaptiveCard/custom.copilot.html.snap-3.png
new file mode 100644
index 0000000000..889270e68b
Binary files /dev/null and b/__tests__/html2/attachment/adaptiveCard/custom.copilot.html.snap-3.png differ
diff --git a/__tests__/html2/attachment/adaptiveCard/custom.copilot.html.snap-4.png b/__tests__/html2/attachment/adaptiveCard/custom.copilot.html.snap-4.png
new file mode 100644
index 0000000000..57a36489f0
Binary files /dev/null and b/__tests__/html2/attachment/adaptiveCard/custom.copilot.html.snap-4.png differ
diff --git a/__tests__/html2/attachment/adaptiveCard/custom.fluent.dark.html b/__tests__/html2/attachment/adaptiveCard/custom.fluent.dark.html
new file mode 100644
index 0000000000..3c6befd725
--- /dev/null
+++ b/__tests__/html2/attachment/adaptiveCard/custom.fluent.dark.html
@@ -0,0 +1,10 @@
+<!doctype html>
+<html>
+  <head>
+    <title>Attachment AdaptiveCard: custom (fluent, dark)</title>
+    <script>
+      location = './custom.skip?variant=fluent&fluent-theme=dark';
+    </script>
+  </head>
+  <body></body>
+</html>
diff --git a/__tests__/html2/attachment/adaptiveCard/custom.fluent.dark.html.snap-1.png b/__tests__/html2/attachment/adaptiveCard/custom.fluent.dark.html.snap-1.png
new file mode 100644
index 0000000000..abec961421
Binary files /dev/null and b/__tests__/html2/attachment/adaptiveCard/custom.fluent.dark.html.snap-1.png differ
diff --git a/__tests__/html2/attachment/adaptiveCard/custom.fluent.dark.html.snap-2.png b/__tests__/html2/attachment/adaptiveCard/custom.fluent.dark.html.snap-2.png
new file mode 100644
index 0000000000..70efa01ad8
Binary files /dev/null and b/__tests__/html2/attachment/adaptiveCard/custom.fluent.dark.html.snap-2.png differ
diff --git a/__tests__/html2/attachment/adaptiveCard/custom.fluent.dark.html.snap-3.png b/__tests__/html2/attachment/adaptiveCard/custom.fluent.dark.html.snap-3.png
new file mode 100644
index 0000000000..c8c1d9cbb4
Binary files /dev/null and b/__tests__/html2/attachment/adaptiveCard/custom.fluent.dark.html.snap-3.png differ
diff --git a/__tests__/html2/attachment/adaptiveCard/custom.fluent.dark.html.snap-4.png b/__tests__/html2/attachment/adaptiveCard/custom.fluent.dark.html.snap-4.png
new file mode 100644
index 0000000000..867d54468a
Binary files /dev/null and b/__tests__/html2/attachment/adaptiveCard/custom.fluent.dark.html.snap-4.png differ
diff --git a/__tests__/html2/attachment/adaptiveCard/custom.fluent.html b/__tests__/html2/attachment/adaptiveCard/custom.fluent.html
new file mode 100644
index 0000000000..8c4c849149
--- /dev/null
+++ b/__tests__/html2/attachment/adaptiveCard/custom.fluent.html
@@ -0,0 +1,10 @@
+<!doctype html>
+<html>
+  <head>
+    <title>Attachment AdaptiveCard: custom (fluent)</title>
+    <script>
+      location = './custom.skip?variant=fluent';
+    </script>
+  </head>
+  <body></body>
+</html>
diff --git a/__tests__/html2/attachment/adaptiveCard/custom.fluent.html.snap-1.png b/__tests__/html2/attachment/adaptiveCard/custom.fluent.html.snap-1.png
new file mode 100644
index 0000000000..c9494b3810
Binary files /dev/null and b/__tests__/html2/attachment/adaptiveCard/custom.fluent.html.snap-1.png differ
diff --git a/__tests__/html2/attachment/adaptiveCard/custom.fluent.html.snap-2.png b/__tests__/html2/attachment/adaptiveCard/custom.fluent.html.snap-2.png
new file mode 100644
index 0000000000..8cb75cb818
Binary files /dev/null and b/__tests__/html2/attachment/adaptiveCard/custom.fluent.html.snap-2.png differ
diff --git a/__tests__/html2/attachment/adaptiveCard/custom.fluent.html.snap-3.png b/__tests__/html2/attachment/adaptiveCard/custom.fluent.html.snap-3.png
new file mode 100644
index 0000000000..ecc2da5f7c
Binary files /dev/null and b/__tests__/html2/attachment/adaptiveCard/custom.fluent.html.snap-3.png differ
diff --git a/__tests__/html2/attachment/adaptiveCard/custom.fluent.html.snap-4.png b/__tests__/html2/attachment/adaptiveCard/custom.fluent.html.snap-4.png
new file mode 100644
index 0000000000..9fabe4315f
Binary files /dev/null and b/__tests__/html2/attachment/adaptiveCard/custom.fluent.html.snap-4.png differ
diff --git a/__tests__/html2/attachment/adaptiveCard/custom.skip.html b/__tests__/html2/attachment/adaptiveCard/custom.skip.html
new file mode 100644
index 0000000000..3ccbc3f4d6
--- /dev/null
+++ b/__tests__/html2/attachment/adaptiveCard/custom.skip.html
@@ -0,0 +1,186 @@
+<!doctype html>
+<html lang="en">
+
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>Attachment AdaptiveCard: custom</title>
+  <script type="importmap">
+    {
+      "imports": {
+        "@fluentui/react-provider": "/__dist__/packages/test/test-assets/out/@fluentui/react-provider.js",
+        "@fluentui/tokens": "/__dist__/packages/test/test-assets/out/@fluentui/tokens.js",
+        "@testduet/wait-for": "https://unpkg.com/@testduet/wait-for@main/dist/wait-for.mjs",
+        "bot-bundle-chat-adapter": "https://cdn.jsdelivr.net/gh/compulim/experiment-mockbot@v0.0.4/esm/bot-bundle-chat-adapter.js",
+        "botframework-webchat": "/__dist__/packages/bundle/static/botframework-webchat.js",
+        "botframework-webchat/component": "/__dist__/packages/bundle/static/botframework-webchat/component.js",
+        "botframework-webchat/decorator": "/__dist__/packages/bundle/static/botframework-webchat/decorator.js",
+        "botframework-webchat/hook": "/__dist__/packages/bundle/static/botframework-webchat/hook.js",
+        "botframework-webchat/internal": "/__dist__/packages/bundle/static/botframework-webchat/internal.js",
+        "botframework-webchat-fluent-theme": "/__dist__/packages/fluent-theme/static/botframework-webchat-fluent-theme.js",
+        "react": "/__dist__/packages/test/test-assets/out/react.js",
+        "react-dom": "/__dist__/packages/test/test-assets/out/react-dom.js",
+        "react-dom/": "/__dist__/packages/test/test-assets/out/react-dom/",
+        "react-jsx-runtime": "/__dist__/packages/test/test-assets/out/react-jsx-runtime.js"
+      }
+    }
+  </script>
+  <script type="module">
+    import { registerElements } from '/assets/custom-element/custom-element.js';
+
+    await registerElements('test-shell');
+  </script>
+</head>
+
+<body>
+  <main>
+    <test-shell>
+      <div id="webchat"></div>
+    </test-shell>
+  </main>
+</body>
+
+<script type="module">
+  import { FluentProvider } from '@fluentui/react-provider';
+  import { createDarkTheme, webLightTheme } from '@fluentui/tokens';
+  import { waitFor } from '@testduet/wait-for';
+  import { createBotAsChatAdapter } from 'bot-bundle-chat-adapter';
+  import { ReactWebChat } from 'botframework-webchat';
+  import { FluentThemeProvider } from 'botframework-webchat-fluent-theme';
+  import { createElement as h } from 'react';
+  import { createRoot } from 'react-dom/client.js';
+
+  import { postActivity } from '/assets/esm/postActivity.js';
+  import { run, host, pageConditions, testHelpers } from '/assets/esm/test.js';
+
+  const searchParams = new URLSearchParams(location.search);
+  const theme = document.querySelector('test-shell').dataset.theme;
+  let codeBlockTheme;
+  let fluentTheme;
+
+  const root = createRoot(document.getElementById('webchat'));
+
+  if (theme !== 'light') {
+    fluentTheme = {
+      ...createDarkTheme({
+        10: '#12174c',
+        20: '#1a1f5b',
+        30: '#21276a',
+        40: '#293079',
+        50: '#303788',
+        60: '#384097',
+        70: '#4049a7',
+        80: '#151e80',
+        90: '#4f59c5',
+        100: '#5661d4',
+        110: '#5e69e3',
+        120: '#7982e8',
+        130: '#949bec',
+        140: '#afb5f1',
+        150: '#c9cdf6',
+        160: '#e4e6fa'
+      }),
+      colorNeutralBackground1Disabled: '#101010',
+      colorNeutralBackground1Hover: '#101010',
+      colorNeutralForeground5: '#424242'
+    };
+    codeBlockTheme = 'github-dark-default';
+  } else {
+    fluentTheme = webLightTheme;
+  }
+
+  function renderWebChat() {
+    root.render(
+      h(
+        FluentProvider,
+        { className: 'fui-FluentProvider', theme: fluentTheme },
+        h(
+          FluentThemeProvider,
+          { variant: searchParams.get('variant') ?? 'copilot' },
+          h(ReactWebChat, {
+            dir: searchParams.get('dir'),
+            styleOptions: {
+              ...(codeBlockTheme && { codeBlockTheme }),
+              maxMessageLength: null
+            },
+            directLine: adapter,
+            store
+          })
+        )
+      )
+    );
+  }
+
+  const store = testHelpers.createStore();
+  const adapter = createBotAsChatAdapter({
+    conversationStartProperties: { locale: navigator.language }
+  });
+
+  
+  run(async () => {
+    await host.windowSize(800, 800, document.body);
+
+    renderWebChat();
+
+    await pageConditions.uiConnected();
+
+    // When: send an adaptive card with primary and secondary buttons
+    await postActivity(adapter, {
+      text: 'custom-card with 3 button types', value: {
+        "type": "AdaptiveCard",
+        "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
+        "version": "1.6",
+        "body": [
+          {
+            "type": "ActionSet",
+            "actions": [
+              {
+                "type": "Action.Submit",
+                "title": "Primary positive",
+                "style": "positive"
+              },
+              {
+                "type": "Action.Submit",
+                "title": "Primary destructive",
+                "style": "destructive"
+              },
+              {
+                "type": "Action.Submit",
+                "title": "Secondary"
+              }
+            ]
+          }
+        ],
+        "actions": []
+      }
+    });
+
+    // Then: should apply styles for buttons correctly
+    await host.snapshot('local');
+
+    let buttons;
+    await waitFor(() => (buttons = document.querySelectorAll('.ac-pushButton'), buttons.length === 3), 500);
+
+    // When: click all buttons
+    for (const button of buttons) {
+      await host.click(button);
+    }
+
+    // Then: should apply correct pressed styles
+    await host.snapshot('local');
+
+    // When: sending a layout command
+    await postActivity(adapter, { text: 'layout' });
+
+    // Then: should render multiple attachments correctly
+    await host.snapshot('local');
+
+    // When: send an adaptive card with containers
+    await postActivity(adapter, { text: 'card containerstyles' });
+
+    // Then: should render container styles correctly
+    await host.snapshot('local');
+  });
+</script>
+
+</html>
\ No newline at end of file
diff --git a/__tests__/html2/basic/customIcons.html b/__tests__/html2/basic/customIcons.html
index f875c9b113..cfd003c8be 100644
--- a/__tests__/html2/basic/customIcons.html
+++ b/__tests__/html2/basic/customIcons.html
@@ -8,8 +8,7 @@
         "imports": {
           "react": "https://esm.sh/react@18.3.1",
           "react-dom": "https://esm.sh/react-dom@18.3.1",
-          "react-dom/": "https://esm.sh/react-dom@18.3.1/",
-          "@fluentui/react-components": "https://esm.sh/@fluentui/react-components?deps=react@18.3.1&exports=FluentProvider,createDarkTheme,webLightTheme"
+          "react-dom/": "https://esm.sh/react-dom@18.3.1/"
         }
       }
     </script>
diff --git a/__tests__/html2/citation/url.html b/__tests__/html2/citation/url.html
index 780978635a..a0174a9403 100644
--- a/__tests__/html2/citation/url.html
+++ b/__tests__/html2/citation/url.html
@@ -7,8 +7,8 @@
   <script type="importmap">
     {
       "imports": {
-        "@fluentui/react-provider": "https://esm.sh/@fluentui/react-provider?deps=react@18&exports=FluentProvider",
-        "@fluentui/tokens": "https://esm.sh/@fluentui/tokens?deps=react@18&exports=createDarkTheme,webLightTheme",
+        "@fluentui/react-provider": "/__dist__/packages/test/test-assets/out/@fluentui/react-provider.js",
+        "@fluentui/tokens": "/__dist__/packages/test/test-assets/out/@fluentui/tokens.js",
         "@testduet/wait-for": "https://unpkg.com/@testduet/wait-for@main/dist/wait-for.mjs",
         "botframework-webchat": "/__dist__/packages/bundle/static/botframework-webchat.js",
         "botframework-webchat/component": "/__dist__/packages/bundle/static/botframework-webchat/component.js",
@@ -18,7 +18,8 @@
         "botframework-webchat-fluent-theme": "/__dist__/packages/fluent-theme/static/botframework-webchat-fluent-theme.js",
         "react": "https://esm.sh/react@18",
         "react-dom": "https://esm.sh/react-dom@18",
-        "react-dom/": "https://esm.sh/react-dom@18/"
+        "react-dom/": "https://esm.sh/react-dom@18/",
+        "react-jsx-runtime": "https://esm.sh/react@18/jsx-runtime"
       }
     }
   </script>
diff --git a/__tests__/html2/copyButton/layout.html b/__tests__/html2/copyButton/layout.html
index 248206fb08..79864d8d3d 100644
--- a/__tests__/html2/copyButton/layout.html
+++ b/__tests__/html2/copyButton/layout.html
@@ -6,10 +6,12 @@
     <script type="importmap">
       {
         "imports": {
-          "react": "https://esm.sh/react@18.3.1",
-          "react-dom": "https://esm.sh/react-dom@18.3.1",
-          "react-dom/": "https://esm.sh/react-dom@18.3.1/",
-          "@fluentui/react-components": "https://esm.sh/@fluentui/react-components?deps=react@18.3.1&exports=FluentProvider,createDarkTheme,webLightTheme"
+          "@fluentui/react-provider": "/__dist__/packages/test/test-assets/out/@fluentui/react-provider.js",
+          "@fluentui/tokens": "/__dist__/packages/test/test-assets/out/@fluentui/tokens.js",
+          "react": "https://esm.sh/react@18",
+          "react-dom": "https://esm.sh/react-dom@18",
+          "react-dom/": "https://esm.sh/react-dom@18/",
+          "react-jsx-runtime": "https://esm.sh/react@18/jsx-runtime"
         }
       }
     </script>
@@ -32,9 +34,10 @@
   <body>
     <main id="webchat" style="position: relative"></main>
     <script type="module">
+      import { FluentProvider } from '@fluentui/react-provider';
+      import { createDarkTheme, webLightTheme } from '@fluentui/tokens';
       import React from 'react';
       import { createRoot } from 'react-dom/client';
-      import { FluentProvider, createDarkTheme, webLightTheme } from '@fluentui/react-components';
 
       run(async function () {
         const {
diff --git a/__tests__/html2/feedbackForm/feedback.form.scroll.html b/__tests__/html2/feedbackForm/feedback.form.scroll.html
index ddac7dfbb8..4b0de2467d 100644
--- a/__tests__/html2/feedbackForm/feedback.form.scroll.html
+++ b/__tests__/html2/feedbackForm/feedback.form.scroll.html
@@ -8,8 +8,7 @@
         "imports": {
           "react": "https://esm.sh/react@18.3.1",
           "react-dom": "https://esm.sh/react-dom@18.3.1",
-          "react-dom/": "https://esm.sh/react-dom@18.3.1/",
-          "@fluentui/react-components": "https://esm.sh/@fluentui/react-components?deps=react@18.3.1&exports=FluentProvider,createDarkTheme,webLightTheme"
+          "react-dom/": "https://esm.sh/react-dom@18.3.1/"
         }
       }
     </script>
diff --git a/__tests__/html2/fluentTheme/defaultFeedback.activity.html b/__tests__/html2/fluentTheme/defaultFeedback.activity.html
index ce5a18bc20..65122d055b 100644
--- a/__tests__/html2/fluentTheme/defaultFeedback.activity.html
+++ b/__tests__/html2/fluentTheme/defaultFeedback.activity.html
@@ -7,10 +7,12 @@
   <script type="importmap">
     {
       "imports": {
-        "react": "https://esm.sh/react@18.3.1",
-        "react-dom": "https://esm.sh/react-dom@18.3.1",
-        "react-dom/": "https://esm.sh/react-dom@18.3.1/",
-        "@fluentui/react-components": "https://esm.sh/@fluentui/react-components?deps=react@18.3.1&exports=FluentProvider,createDarkTheme"
+        "@fluentui/react-provider": "/__dist__/packages/test/test-assets/out/@fluentui/react-provider.js",
+        "@fluentui/tokens": "/__dist__/packages/test/test-assets/out/@fluentui/tokens.js",
+        "react": "https://esm.sh/react@18",
+        "react-dom": "https://esm.sh/react-dom@18",
+        "react-dom/": "https://esm.sh/react-dom@18/",
+        "react-jsx-runtime": "https://esm.sh/react@18/jsx-runtime"
       }
     }
   </script>
@@ -32,9 +34,10 @@
 <body>
   <main id="webchat"></main>
   <script type="module">
+    import { FluentProvider } from '@fluentui/react-provider';
+    import { createDarkTheme } from '@fluentui/tokens';
     import React from 'react';
     import { createRoot } from 'react-dom/client';
-    import { FluentProvider, createDarkTheme } from '@fluentui/react-components';
 
     run(async function () {
       const {
diff --git a/__tests__/html2/fluentTheme/fallback.html b/__tests__/html2/fluentTheme/fallback.html
index 21b10429d9..e319c3c7bd 100644
--- a/__tests__/html2/fluentTheme/fallback.html
+++ b/__tests__/html2/fluentTheme/fallback.html
@@ -7,10 +7,12 @@
   <script type="importmap">
     {
       "imports": {
-        "react": "https://esm.sh/react@18.3.1",
-        "react-dom": "https://esm.sh/react-dom@18.3.1",
-        "react-dom/": "https://esm.sh/react-dom@18.3.1/",
-        "@fluentui/react-components": "https://esm.sh/@fluentui/react-components?deps=react@18.3.1&exports=FluentProvider,createDarkTheme,webLightTheme"
+        "@fluentui/react-provider": "/__dist__/packages/test/test-assets/out/@fluentui/react-provider.js",
+        "@fluentui/tokens": "/__dist__/packages/test/test-assets/out/@fluentui/tokens.js",
+        "react": "https://esm.sh/react@18",
+        "react-dom": "https://esm.sh/react-dom@18",
+        "react-dom/": "https://esm.sh/react-dom@18/",
+        "react-jsx-runtime": "https://esm.sh/react@18/jsx-runtime"
       }
     }
   </script>
@@ -34,9 +36,10 @@
 <body>
   <main id="webchat"></main>
   <script type="module">
+    import { FluentProvider } from '@fluentui/react-provider';
+    import { createDarkTheme, webLightTheme } from '@fluentui/tokens';
     import React from 'react';
     import { createRoot } from 'react-dom/client';
-    import { FluentProvider, createDarkTheme, webLightTheme } from '@fluentui/react-components';
 
     run(async function () {
       const {
diff --git a/__tests__/html2/fluentTheme/uiState.blueprint.nonEnglish.html b/__tests__/html2/fluentTheme/uiState.blueprint.nonEnglish.html
index 6c2df2dba1..a2d7cb50a4 100644
--- a/__tests__/html2/fluentTheme/uiState.blueprint.nonEnglish.html
+++ b/__tests__/html2/fluentTheme/uiState.blueprint.nonEnglish.html
@@ -6,10 +6,12 @@
     <script type="importmap">
       {
         "imports": {
-          "react": "https://esm.sh/react@18.3.1",
-          "react-dom": "https://esm.sh/react-dom@18.3.1",
-          "react-dom/": "https://esm.sh/react-dom@18.3.1/",
-          "@fluentui/react-components": "https://esm.sh/@fluentui/react-components?deps=react@18.3.1&exports=FluentProvider,createDarkTheme,webLightTheme"
+          "@fluentui/react-provider": "/__dist__/packages/test/test-assets/out/@fluentui/react-provider.js",
+          "@fluentui/tokens": "/__dist__/packages/test/test-assets/out/@fluentui/tokens.js",
+          "react": "https://esm.sh/react@18",
+          "react-dom": "https://esm.sh/react-dom@18",
+          "react-dom/": "https://esm.sh/react-dom@18/",
+          "react-jsx-runtime": "https://esm.sh/react@18/jsx-runtime"
         }
       }
     </script>
@@ -31,10 +33,10 @@
   <body>
     <main id="webchat"></main>
     <script type="module">
+      import { FluentProvider } from '@fluentui/react-provider';
+      import { createDarkTheme, webLightTheme } from '@fluentui/tokens';
       import React from 'react';
       import { createRoot } from 'react-dom/client';
-      import { FluentProvider, createDarkTheme, webLightTheme } from '@fluentui/react-components';
-
       run(async function () {
         const {
           WebChat: { FluentThemeProvider, ReactWebChat }
diff --git a/__tests__/html2/fluentTheme/uiState.html b/__tests__/html2/fluentTheme/uiState.html
index 06d0224490..e20d8fda48 100644
--- a/__tests__/html2/fluentTheme/uiState.html
+++ b/__tests__/html2/fluentTheme/uiState.html
@@ -6,10 +6,12 @@
     <script type="importmap">
       {
         "imports": {
-          "react": "https://esm.sh/react@18.3.1",
-          "react-dom": "https://esm.sh/react-dom@18.3.1",
-          "react-dom/": "https://esm.sh/react-dom@18.3.1/",
-          "@fluentui/react-components": "https://esm.sh/@fluentui/react-components?deps=react@18.3.1&exports=FluentProvider,createDarkTheme,webLightTheme"
+          "@fluentui/react-provider": "/__dist__/packages/test/test-assets/out/@fluentui/react-provider.js",
+          "@fluentui/tokens": "/__dist__/packages/test/test-assets/out/@fluentui/tokens.js",
+          "react": "https://esm.sh/react@18",
+          "react-dom": "https://esm.sh/react-dom@18",
+          "react-dom/": "https://esm.sh/react-dom@18/",
+          "react-jsx-runtime": "https://esm.sh/react@18/jsx-runtime"
         }
       }
     </script>
@@ -30,9 +32,10 @@
   <body>
     <main id="webchat"></main>
     <script type="module">
+      import { FluentProvider } from '@fluentui/react-provider';
+      import { createDarkTheme, webLightTheme } from '@fluentui/tokens';
       import React from 'react';
       import { createRoot } from 'react-dom/client';
-      import { FluentProvider, createDarkTheme, webLightTheme } from '@fluentui/react-components';
 
       run(async function () {
         const {
diff --git a/__tests__/html2/linkDefinition/badge.html b/__tests__/html2/linkDefinition/badge.html
index d410cf435e..1cc2aba02e 100644
--- a/__tests__/html2/linkDefinition/badge.html
+++ b/__tests__/html2/linkDefinition/badge.html
@@ -6,10 +6,12 @@
     <script type="importmap">
       {
         "imports": {
-          "react": "https://esm.sh/react@18.3.1",
-          "react-dom": "https://esm.sh/react-dom@18.3.1",
-          "react-dom/": "https://esm.sh/react-dom@18.3.1/",
-          "@fluentui/react-components": "https://esm.sh/@fluentui/react-components?deps=react@18.3.1&exports=FluentProvider,createDarkTheme,webLightTheme"
+          "@fluentui/react-provider": "/__dist__/packages/test/test-assets/out/@fluentui/react-provider.js",
+          "@fluentui/tokens": "/__dist__/packages/test/test-assets/out/@fluentui/tokens.js",
+          "react": "https://esm.sh/react@18",
+          "react-dom": "https://esm.sh/react-dom@18",
+          "react-dom/": "https://esm.sh/react-dom@18/",
+          "react-jsx-runtime": "https://esm.sh/react@18/jsx-runtime"
         }
       }
     </script>
@@ -30,9 +32,10 @@
   <body>
     <main id="webchat"></main>
     <script type="module">
+      import { FluentProvider } from '@fluentui/react-provider';
+      import { createDarkTheme, webLightTheme } from '@fluentui/tokens';
       import React from 'react';
       import { createRoot } from 'react-dom/client';
-      import { FluentProvider, createDarkTheme, webLightTheme } from '@fluentui/react-components';
 
       run(async function () {
         const {
diff --git a/__tests__/html2/markdown/codeBlockCopyButton/adaptiveCards/layout.copilot.html.snap-1.png b/__tests__/html2/markdown/codeBlockCopyButton/adaptiveCards/layout.copilot.html.snap-1.png
index fd0fa4e409..f28b1d82b4 100644
Binary files a/__tests__/html2/markdown/codeBlockCopyButton/adaptiveCards/layout.copilot.html.snap-1.png and b/__tests__/html2/markdown/codeBlockCopyButton/adaptiveCards/layout.copilot.html.snap-1.png differ
diff --git a/__tests__/html2/markdown/math/layout.scroll.html b/__tests__/html2/markdown/math/layout.scroll.html
index e4d6b18da8..3d08134200 100644
--- a/__tests__/html2/markdown/math/layout.scroll.html
+++ b/__tests__/html2/markdown/math/layout.scroll.html
@@ -6,10 +6,12 @@
     <script type="importmap">
       {
         "imports": {
-          "react": "https://esm.sh/react@18.3.1",
-          "react-dom": "https://esm.sh/react-dom@18.3.1",
-          "react-dom/": "https://esm.sh/react-dom@18.3.1/",
-          "@fluentui/react-components": "https://esm.sh/@fluentui/react-components?deps=react@18.3.1&exports=FluentProvider,createDarkTheme,webLightTheme"
+          "@fluentui/react-provider": "/__dist__/packages/test/test-assets/out/@fluentui/react-provider.js",
+          "@fluentui/tokens": "/__dist__/packages/test/test-assets/out/@fluentui/tokens.js",
+          "react": "https://esm.sh/react@18",
+          "react-dom": "https://esm.sh/react-dom@18",
+          "react-dom/": "https://esm.sh/react-dom@18/",
+          "react-jsx-runtime": "https://esm.sh/react@18/jsx-runtime"
         }
       }
     </script>
@@ -26,9 +28,10 @@
   <body>
     <main id="webchat"></main>
     <script type="module">
+      import { FluentProvider } from '@fluentui/react-provider';
+      import { createDarkTheme, webLightTheme } from '@fluentui/tokens';
       import React from 'react';
       import { createRoot } from 'react-dom/client';
-      import { FluentProvider, createDarkTheme, webLightTheme } from '@fluentui/react-components';
 
       run(async function () {
         const {
diff --git a/__tests__/html2/part-grouping/index.html b/__tests__/html2/part-grouping/index.html
index cff4ac5eb1..80cd5fc2dd 100644
--- a/__tests__/html2/part-grouping/index.html
+++ b/__tests__/html2/part-grouping/index.html
@@ -7,11 +7,13 @@
   <script type="importmap">
       {
         "imports": {
-          "react": "https://esm.sh/react@18.3.1",
-          "react-dom": "https://esm.sh/react-dom@18.3.1",
-          "react-dom/": "https://esm.sh/react-dom@18.3.1/",
+          "@fluentui/react-provider": "/__dist__/packages/test/test-assets/out/@fluentui/react-provider.js",
+          "@fluentui/tokens": "/__dist__/packages/test/test-assets/out/@fluentui/tokens.js",
           "@testduet/wait-for": "https://unpkg.com/@testduet/wait-for@main/dist/wait-for.mjs",
-          "@fluentui/react-components": "https://esm.sh/@fluentui/react-components?deps=react@18.3.1&exports=FluentProvider,createDarkTheme,webLightTheme"
+          "react": "https://esm.sh/react@18",
+          "react-dom": "https://esm.sh/react-dom@18",
+          "react-dom/": "https://esm.sh/react-dom@18/",
+          "react-jsx-runtime": "https://esm.sh/react@18/jsx-runtime"
         }
       }
     </script>
@@ -37,10 +39,11 @@
 <body>
   <main id="webchat"></main>
   <script type="module">
+    import { FluentProvider } from '@fluentui/react-provider';
+    import { createDarkTheme, webLightTheme } from '@fluentui/tokens';
+    import { waitFor } from '@testduet/wait-for';
     import React from 'react';
     import { createRoot } from 'react-dom/client';
-    import { FluentProvider, createDarkTheme, webLightTheme } from '@fluentui/react-components';
-    import { waitFor } from '@testduet/wait-for';
 
     async function openLastActivity() {
       let summaries;
diff --git a/__tests__/html2/part-grouping/keyboard.html b/__tests__/html2/part-grouping/keyboard.html
index 8cf11c7e36..01413ce51d 100644
--- a/__tests__/html2/part-grouping/keyboard.html
+++ b/__tests__/html2/part-grouping/keyboard.html
@@ -6,12 +6,13 @@
     <script type="importmap">
         {
           "imports": {
+            "@fluentui/react-provider": "/__dist__/packages/test/test-assets/out/@fluentui/react-provider.js",
+            "@fluentui/tokens": "/__dist__/packages/test/test-assets/out/@fluentui/tokens.js",
+            "@testduet/wait-for": "https://unpkg.com/@testduet/wait-for@main/dist/wait-for.mjs",
             "react": "https://esm.sh/react@18.3.1",
             "react-dom": "https://esm.sh/react-dom@18.3.1",
             "react-dom/": "https://esm.sh/react-dom@18.3.1/",
-            "@testduet/wait-for": "https://unpkg.com/@testduet/wait-for@main/dist/wait-for.mjs",
-            "@fluentui/react-provider": "https://esm.sh/@fluentui/react-provider?deps=react@18&exports=FluentProvider",
-            "@fluentui/tokens": "https://esm.sh/@fluentui/tokens?deps=react@18&exports=createDarkTheme,webLightTheme"
+            "react-jsx-runtime": "https://esm.sh/react@18.3.1/jsx-runtime"
           }
         }
       </script>
diff --git a/__tests__/html2/part-grouping/navigation.html b/__tests__/html2/part-grouping/navigation.html
index caac30fedd..10c59d409c 100644
--- a/__tests__/html2/part-grouping/navigation.html
+++ b/__tests__/html2/part-grouping/navigation.html
@@ -6,11 +6,13 @@
     <script type="importmap">
         {
           "imports": {
-            "react": "https://esm.sh/react@18.3.1",
-            "react-dom": "https://esm.sh/react-dom@18.3.1",
-            "react-dom/": "https://esm.sh/react-dom@18.3.1/",
+            "@fluentui/react-provider": "/__dist__/packages/test/test-assets/out/@fluentui/react-provider.js",
+            "@fluentui/tokens": "/__dist__/packages/test/test-assets/out/@fluentui/tokens.js",
             "@testduet/wait-for": "https://unpkg.com/@testduet/wait-for@main/dist/wait-for.mjs",
-            "@fluentui/react-components": "https://esm.sh/@fluentui/react-components?deps=react@18.3.1&exports=FluentProvider,createDarkTheme,webLightTheme"
+            "react": "https://esm.sh/react@18",
+            "react-dom": "https://esm.sh/react-dom@18",
+            "react-dom/": "https://esm.sh/react-dom@18/",
+            "react-jsx-runtime": "https://esm.sh/react@18/jsx-runtime"
           }
         }
       </script>
@@ -44,10 +46,11 @@
       KeyboardEventElement.listenKeyboardEvents();
     </script>
     <script type="module">
+      import { FluentProvider } from '@fluentui/react-provider';
+      import { createDarkTheme, webLightTheme } from '@fluentui/tokens';
+      import { waitFor } from '@testduet/wait-for';
       import React from 'react';
       import { createRoot } from 'react-dom/client';
-      import { FluentProvider, createDarkTheme, webLightTheme } from '@fluentui/react-components';
-      import { waitFor } from '@testduet/wait-for';
 
       run(async function () {
         const {
diff --git a/__tests__/html2/part-grouping/position.html b/__tests__/html2/part-grouping/position.html
index b632feaa3f..1616cbefc5 100644
--- a/__tests__/html2/part-grouping/position.html
+++ b/__tests__/html2/part-grouping/position.html
@@ -7,11 +7,12 @@
   <script type="importmap">
       {
         "imports": {
-          "react": "https://esm.sh/react@18.3.1",
-          "react-dom": "https://esm.sh/react-dom@18.3.1",
-          "react-dom/": "https://esm.sh/react-dom@18.3.1/",
-          "@testduet/wait-for": "https://unpkg.com/@testduet/wait-for@main/dist/wait-for.mjs",
-          "@fluentui/react-components": "https://esm.sh/@fluentui/react-components?deps=react@18.3.1&exports=FluentProvider,createDarkTheme,webLightTheme"
+          "@fluentui/react-provider": "/__dist__/packages/test/test-assets/out/@fluentui/react-provider.js",
+          "@fluentui/tokens": "/__dist__/packages/test/test-assets/out/@fluentui/tokens.js",
+          "react": "https://esm.sh/react@18",
+          "react-dom": "https://esm.sh/react-dom@18",
+          "react-dom/": "https://esm.sh/react-dom@18/",
+          "react-jsx-runtime": "https://esm.sh/react@18/jsx-runtime"
         }
       }
     </script>
@@ -37,10 +38,10 @@
 <body>
   <main id="webchat"></main>
   <script type="module">
+    import { FluentProvider } from '@fluentui/react-provider';
+    import { createDarkTheme, webLightTheme } from '@fluentui/tokens';
     import React from 'react';
     import { createRoot } from 'react-dom/client';
-    import { FluentProvider, createDarkTheme, webLightTheme } from '@fluentui/react-components';
-    import { waitFor } from '@testduet/wait-for';
 
     run(async function () {
       const {
diff --git a/__tests__/html2/part-grouping/status.html b/__tests__/html2/part-grouping/status.html
index 6340893376..668fd90e3f 100644
--- a/__tests__/html2/part-grouping/status.html
+++ b/__tests__/html2/part-grouping/status.html
@@ -7,11 +7,12 @@
   <script type="importmap">
       {
         "imports": {
-          "react": "https://esm.sh/react@18.3.1",
-          "react-dom": "https://esm.sh/react-dom@18.3.1",
-          "react-dom/": "https://esm.sh/react-dom@18.3.1/",
-          "@testduet/wait-for": "https://unpkg.com/@testduet/wait-for@main/dist/wait-for.mjs",
-          "@fluentui/react-components": "https://esm.sh/@fluentui/react-components?deps=react@18.3.1&exports=FluentProvider,createDarkTheme,webLightTheme"
+          "@fluentui/react-provider": "/__dist__/packages/test/test-assets/out/@fluentui/react-provider.js",
+          "@fluentui/tokens": "/__dist__/packages/test/test-assets/out/@fluentui/tokens.js",
+          "react": "https://esm.sh/react@18",
+          "react-dom": "https://esm.sh/react-dom@18",
+          "react-dom/": "https://esm.sh/react-dom@18/",
+          "react-jsx-runtime": "https://esm.sh/react@18/jsx-runtime"
         }
       }
     </script>
@@ -37,10 +38,10 @@
 <body>
   <main id="webchat"></main>
   <script type="module">
+    import { FluentProvider } from '@fluentui/react-provider';
+    import { createDarkTheme, webLightTheme } from '@fluentui/tokens';
     import React from 'react';
     import { createRoot } from 'react-dom/client';
-    import { FluentProvider, createDarkTheme, webLightTheme } from '@fluentui/react-components';
-    import { waitFor } from '@testduet/wait-for';
 
     run(async function () {
       const {
diff --git a/__tests__/html2/side-by-side/index.html b/__tests__/html2/side-by-side/index.html
index a2c9080648..b8e6a23667 100644
--- a/__tests__/html2/side-by-side/index.html
+++ b/__tests__/html2/side-by-side/index.html
@@ -8,10 +8,12 @@
   <script type="importmap">
     {
       "imports": {
-        "react": "https://esm.sh/react@18.3.1",
-        "react-dom": "https://esm.sh/react-dom@18.3.1",
-        "react-dom/": "https://esm.sh/react-dom@18.3.1/",
-        "@fluentui/react-components": "https://esm.sh/@fluentui/react-components?deps=react@18.3.1&exports=FluentProvider,createDarkTheme"
+        "@fluentui/react-provider": "/__dist__/packages/test/test-assets/out/@fluentui/react-provider.js",
+        "@fluentui/tokens": "/__dist__/packages/test/test-assets/out/@fluentui/tokens.js",
+        "react": "https://esm.sh/react@18",
+        "react-dom": "https://esm.sh/react-dom@18",
+        "react-dom/": "https://esm.sh/react-dom@18/",
+        "react-jsx-runtime": "https://esm.sh/react@18/jsx-runtime"
       }
     }
   </script>
@@ -101,10 +103,11 @@
 <body>
   <main id="webchat"></main>
   <script type="module">
+    import { FluentProvider } from '@fluentui/react-provider';
+    import { createDarkTheme } from '@fluentui/tokens';
     import React from 'react';
     import { flushSync } from 'react-dom';
     import { createRoot } from 'react-dom/client';
-    import { FluentProvider, createDarkTheme } from '@fluentui/react-components';
 
     run(async function () {
       const {
diff --git a/docker-compose-wsl2.yml b/docker-compose-wsl2.yml
index b01dd216e7..09bac6fd85 100644
--- a/docker-compose-wsl2.yml
+++ b/docker-compose-wsl2.yml
@@ -39,6 +39,7 @@ services:
       - ./packages/fluent-theme/static/:/var/web/packages/fluent-theme/static/
       - ./packages/test/harness/dist/:/var/web/packages/test/harness/dist/
       - ./packages/test/page-object/dist/:/var/web/packages/test/page-object/dist/
+      - ./packages/test/test-assets/out/:/var/web/packages/test/test-assets/out/
     ports:
       - '5081:80'
 
diff --git a/package-lock.json b/package-lock.json
index fcbc786d59..06d480c082 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -45,6 +45,7 @@
         "packages/directlinespeech",
         "packages/bundle",
         "packages/test/page-object",
+        "packages/test/test-assets",
         "packages/debug-theme",
         "packages/fluent-theme",
         "packages/vibe-grep"
@@ -335,6 +336,7 @@
       "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.28.5.tgz",
       "integrity": "sha512-e7jT4DxYvIDLk1ZHmU/m/mB19rex9sv0c2ftBtjSBv+kVM/902eh0fINUzD7UwLLNR+jU585GxUJ8/EBfAM5fw==",
       "devOptional": true,
+      "peer": true,
       "dependencies": {
         "@babel/code-frame": "^7.27.1",
         "@babel/generator": "^7.28.5",
@@ -2820,6 +2822,83 @@
         "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
       }
     },
+    "node_modules/@fluentui/keyboard-keys": {
+      "version": "9.0.8",
+      "resolved": "https://registry.npmjs.org/@fluentui/keyboard-keys/-/keyboard-keys-9.0.8.tgz",
+      "integrity": "sha512-iUSJUUHAyTosnXK8O2Ilbfxma+ZyZPMua5vB028Ys96z80v+LFwntoehlFsdH3rMuPsA8GaC1RE7LMezwPBPdw==",
+      "license": "MIT",
+      "dependencies": {
+        "@swc/helpers": "^0.5.1"
+      }
+    },
+    "node_modules/@fluentui/react-icons": {
+      "version": "2.0.317",
+      "resolved": "https://registry.npmjs.org/@fluentui/react-icons/-/react-icons-2.0.317.tgz",
+      "integrity": "sha512-yB1IYJRLoC8qKBv8zK5OWpBLkT4wWUp5qPu5XomDWp+FONu3Gt4WzEwcW1Znl9HxRvKu9SZwpdMjzK9AondqNg==",
+      "license": "MIT",
+      "dependencies": {
+        "@griffel/react": "^1.0.0",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "react": ">=16.8.0 <20.0.0"
+      }
+    },
+    "node_modules/@fluentui/react-theme": {
+      "version": "9.2.1",
+      "resolved": "https://registry.npmjs.org/@fluentui/react-theme/-/react-theme-9.2.1.tgz",
+      "integrity": "sha512-lJxfz7LmmglFz+c9C41qmMqaRRZZUPtPPl9DWQ79vH+JwZd4dkN7eA78OTRwcGCOTPEKoLTX72R+EFaWEDlX+w==",
+      "license": "MIT",
+      "dependencies": {
+        "@fluentui/tokens": "1.0.0-alpha.23",
+        "@swc/helpers": "^0.5.1"
+      }
+    },
+    "node_modules/@fluentui/tokens": {
+      "version": "1.0.0-alpha.23",
+      "resolved": "https://registry.npmjs.org/@fluentui/tokens/-/tokens-1.0.0-alpha.23.tgz",
+      "integrity": "sha512-uxrzF9Z+J10naP0pGS7zPmzSkspSS+3OJDmYIK3o1nkntQrgBXq3dBob4xSlTDm5aOQ0kw6EvB9wQgtlyy4eKQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@swc/helpers": "^0.5.1"
+      }
+    },
+    "node_modules/@griffel/core": {
+      "version": "1.19.2",
+      "resolved": "https://registry.npmjs.org/@griffel/core/-/core-1.19.2.tgz",
+      "integrity": "sha512-WkB/QQkjy9dE4vrNYGhQvRRUHFkYVOuaznVOMNTDT4pS9aTJ9XPrMTXXlkpcwaf0D3vNKoerj4zAwnU2lBzbOg==",
+      "license": "MIT",
+      "dependencies": {
+        "@emotion/hash": "^0.9.0",
+        "@griffel/style-types": "^1.3.0",
+        "csstype": "^3.1.3",
+        "rtl-css-js": "^1.16.1",
+        "stylis": "^4.2.0",
+        "tslib": "^2.1.0"
+      }
+    },
+    "node_modules/@griffel/react": {
+      "version": "1.5.32",
+      "resolved": "https://registry.npmjs.org/@griffel/react/-/react-1.5.32.tgz",
+      "integrity": "sha512-jN3SmSwAUcWFUQuQ9jlhqZ5ELtKY21foaUR0q1mJtiAeSErVgjkpKJyMLRYpvaFGWrDql0Uz23nXUogXbsS2wQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@griffel/core": "^1.19.2",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "react": ">=16.8.0 <20.0.0"
+      }
+    },
+    "node_modules/@griffel/style-types": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/@griffel/style-types/-/style-types-1.3.0.tgz",
+      "integrity": "sha512-bHwD3sUE84Xwv4dH011gOKe1jul77M1S6ZFN9Tnq8pvZ48UMdY//vtES6fv7GRS5wXYT4iqxQPBluAiYAfkpmw==",
+      "license": "MIT",
+      "dependencies": {
+        "csstype": "^3.1.3"
+      }
+    },
     "node_modules/@happy-dom/jest-environment": {
       "version": "20.0.11",
       "resolved": "https://registry.npmjs.org/@happy-dom/jest-environment/-/jest-environment-20.0.11.tgz",
@@ -3225,6 +3304,7 @@
       "version": "29.7.0",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@jest/fake-timers": "^29.7.0",
         "@jest/types": "^29.6.3",
@@ -3262,6 +3342,7 @@
       "version": "29.7.0",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@jest/types": "^29.6.3",
         "@sinonjs/fake-timers": "^10.0.2",
@@ -3551,6 +3632,7 @@
       "version": "29.6.3",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@jest/schemas": "^29.6.3",
         "@types/istanbul-lib-coverage": "^2.0.0",
@@ -3779,6 +3861,10 @@
       "resolved": "packages/repack/react@umd",
       "link": true
     },
+    "node_modules/@msinternal/test-assets": {
+      "resolved": "packages/test/test-assets",
+      "link": true
+    },
     "node_modules/@msinternal/test-harness": {
       "resolved": "packages/test/harness",
       "link": true
@@ -4799,6 +4885,15 @@
         "type-detect": "4.0.8"
       }
     },
+    "node_modules/@swc/helpers": {
+      "version": "0.5.18",
+      "resolved": "https://registry.npmjs.org/@swc/helpers/-/helpers-0.5.18.tgz",
+      "integrity": "sha512-TXTnIcNJQEKwThMMqBXsZ4VGAza6bvN4pa41Rkqoio6QBKMvo+5lexeTMScGCIxtzgQJzElcvIltani+adC5PQ==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "tslib": "^2.8.0"
+      }
+    },
     "node_modules/@testduet/given-when-then": {
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/@testduet/given-when-then/-/given-when-then-0.1.0.tgz",
@@ -5136,6 +5231,7 @@
       "version": "16.14.68",
       "resolved": "https://registry.npmjs.org/@types/react/-/react-16.14.68.tgz",
       "integrity": "sha512-GEe60JEJg7wIvnUzXBX/A++ieyum98WXF/q2oFr1RVar8OK8JxU/uEYBXgv7jF87SoaDdxtAq3KUaJFlu02ziw==",
+      "peer": true,
       "dependencies": {
         "@types/prop-types": "*",
         "@types/scheduler": "^0.16",
@@ -5146,7 +5242,7 @@
       "version": "16.9.25",
       "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-16.9.25.tgz",
       "integrity": "sha512-ZK//eAPhwft9Ul2/Zj+6O11YR6L4JX0J2sVeBC9Ft7x7HFN7xk7yUV/zDxqV6rjvqgl6r8Dq7oQImxtyf/Mzcw==",
-      "dev": true,
+      "peer": true,
       "peerDependencies": {
         "@types/react": "^16.0.0"
       }
@@ -5288,6 +5384,7 @@
       "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.50.0.tgz",
       "integrity": "sha512-6/cmF2piao+f6wSxUsJLZjck7OQsYyRtcOZS02k7XINSNlz93v6emM8WutDQSXnroG2xwYlEVHJI+cPA7CPM3Q==",
       "dev": true,
+      "peer": true,
       "dependencies": {
         "@typescript-eslint/scope-manager": "8.50.0",
         "@typescript-eslint/types": "8.50.0",
@@ -5718,6 +5815,7 @@
       "version": "8.15.0",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "bin": {
         "acorn": "bin/acorn"
       },
@@ -6112,6 +6210,7 @@
     "node_modules/asn1.js": {
       "version": "5.4.1",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "bn.js": "^4.0.0",
         "inherits": "^2.0.1",
@@ -6186,8 +6285,7 @@
     "node_modules/asynckit": {
       "version": "0.4.0",
       "dev": true,
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/available-typed-arrays": {
       "version": "1.0.7",
@@ -6216,7 +6314,6 @@
       "resolved": "https://registry.npmjs.org/axios/-/axios-1.13.2.tgz",
       "integrity": "sha512-VPk9ebNqPcy5lRGuSlKx752IlDatOjT9paPlm8A7yOuW2Fbvp4X3JznJtT4f0GzGLLiWE9W8onz51SqLYwzGaA==",
       "dev": true,
-      "peer": true,
       "dependencies": {
         "follow-redirects": "^1.15.6",
         "form-data": "^4.0.4",
@@ -6811,6 +6908,7 @@
           "url": "https://github.com/sponsors/ai"
         }
       ],
+      "peer": true,
       "dependencies": {
         "baseline-browser-mapping": "^2.9.0",
         "caniuse-lite": "^1.0.30001759",
@@ -6859,7 +6957,6 @@
       "version": "0.2.13",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": "*"
       }
@@ -7185,7 +7282,6 @@
           "url": "https://github.com/rxaviers/cldr-data-npm/blob/master/LICENSE"
         }
       ],
-      "peer": true,
       "dependencies": {
         "cldr-data-downloader": "1.1.0",
         "glob": "10.3.12"
@@ -7194,7 +7290,6 @@
     "node_modules/cldr-data-downloader": {
       "version": "1.1.0",
       "dev": true,
-      "peer": true,
       "dependencies": {
         "axios": "^1.7.2",
         "mkdirp": "^1.0.4",
@@ -7209,14 +7304,12 @@
     "node_modules/cldr-data-downloader/node_modules/abbrev": {
       "version": "1.1.1",
       "dev": true,
-      "license": "ISC",
-      "peer": true
+      "license": "ISC"
     },
     "node_modules/cldr-data-downloader/node_modules/nopt": {
       "version": "3.0.6",
       "dev": true,
       "license": "ISC",
-      "peer": true,
       "dependencies": {
         "abbrev": "1"
       },
@@ -7228,7 +7321,6 @@
       "version": "1.0.1",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">=0.6.0",
         "teleport": ">=0.2.0"
@@ -7238,7 +7330,6 @@
       "version": "10.3.12",
       "dev": true,
       "license": "ISC",
-      "peer": true,
       "dependencies": {
         "foreground-child": "^3.1.0",
         "jackspeak": "^2.3.6",
@@ -7260,7 +7351,6 @@
       "version": "2.3.6",
       "dev": true,
       "license": "BlueOak-1.0.0",
-      "peer": true,
       "dependencies": {
         "@isaacs/cliui": "^8.0.2"
       },
@@ -7279,7 +7369,6 @@
       "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
       "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
       "dev": true,
-      "peer": true,
       "dependencies": {
         "brace-expansion": "^2.0.1"
       },
@@ -7481,7 +7570,6 @@
       "version": "1.0.8",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "delayed-stream": "~1.0.0"
       },
@@ -7735,6 +7823,7 @@
       "resolved": "https://registry.npmjs.org/core-js-pure/-/core-js-pure-3.47.0.tgz",
       "integrity": "sha512-BcxeDbzUrRnXGYIVAGFtcGQVNpFcUhVjr6W7F8XktvQW2iJP9e66GP6xdKotCRFlrxBvNIBrhwKteRXqMV86Nw==",
       "hasInstallScript": true,
+      "peer": true,
       "funding": {
         "type": "opencollective",
         "url": "https://opencollective.com/core-js"
@@ -8100,7 +8189,6 @@
       "version": "1.0.0",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">=0.4.0"
       }
@@ -8649,6 +8737,7 @@
       "integrity": "sha512-HyNQImnsOC7X9PMNaCIeAm4ISCQXs5a5YasTXVliKv4uuBo1dKrG0A+uQS8M5eXjVMnLg3WgXaKvprHlFJQffw==",
       "dev": true,
       "hasInstallScript": true,
+      "peer": true,
       "bin": {
         "esbuild": "bin/esbuild"
       },
@@ -8714,6 +8803,7 @@
       "integrity": "sha512-ypowyDxpVSYpkXr9WPv2PAZCtNip1Mv5KTW0SCurXv/9iOpcrH9PaqUElksqEB6pChqHGDRCFTyrZlGhnLNGiA==",
       "deprecated": "This version is no longer supported. Please see https://eslint.org/version-support for other options.",
       "dev": true,
+      "peer": true,
       "dependencies": {
         "@eslint-community/eslint-utils": "^4.2.0",
         "@eslint-community/regexpp": "^4.6.1",
@@ -8769,6 +8859,7 @@
       "resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-10.1.8.tgz",
       "integrity": "sha512-82GZUjRS0p/jganf6q1rEO25VSoHH0hKPCTrgillPjdI/3bgBhAE1QzHrHTizjpRvy6pGAvKjDJtk2pF9NDq8w==",
       "dev": true,
+      "peer": true,
       "bin": {
         "eslint-config-prettier": "bin/cli.js"
       },
@@ -9698,7 +9789,6 @@
       "version": "1.1.0",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "pend": "~1.2.0"
       }
@@ -9875,7 +9965,6 @@
       "version": "4.0.4",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "asynckit": "^0.4.0",
         "combined-stream": "^1.0.8",
@@ -10165,6 +10254,7 @@
       "version": "1.7.1",
       "resolved": "https://registry.npmjs.org/globalize/-/globalize-1.7.1.tgz",
       "integrity": "sha512-PFymRL0PtitFOlSniuwwwNfkooi3cLQJo9Uke1+j1DsGfUkkHkwneImqVtGcqKI0TuzhAlHt7hAcgK324902HA==",
+      "peer": true,
       "dependencies": {
         "cldrjs": "^0.5.4"
       }
@@ -10406,6 +10496,7 @@
       "version": "0.1.1",
       "resolved": "https://registry.npmjs.org/handler-chain/-/handler-chain-0.1.1.tgz",
       "integrity": "sha512-5eo8F9UTUiFCMtDUF1ipva1tvOCGE+vFr33aFHSISjTqXfGywCRV2aE6TzPkMhaw1pArOv3wv2Wz3Rh+AJJ8bA==",
+      "peer": true,
       "dependencies": {
         "handler-chain": "^0.1.1"
       }
@@ -10820,7 +10911,8 @@
       "version": "2019.1.0",
       "resolved": "https://registry.npmjs.org/iana-tz-data/-/iana-tz-data-2019.1.0.tgz",
       "integrity": "sha512-T7+26Skkyxqjp4mg20/O065j9J5qP39nWVQj/2ArxQ0gSPkL+T9lwerRmiOAzFRNsNXepX45QqchqTVENwNvig==",
-      "dev": true
+      "dev": true,
+      "peer": true
     },
     "node_modules/iconv-lite": {
       "version": "0.6.3",
@@ -11677,6 +11769,7 @@
       "version": "0.3.0",
       "resolved": "https://registry.npmjs.org/iter-fest/-/iter-fest-0.3.0.tgz",
       "integrity": "sha512-t76cnHCl9MEZRaUb0VBwTXP8dWjxbcTYm91VGWfQYjSMXKkjdOAIjUsaMYuLIy9jxk9fT55XIlb4Y/HACK/zlw==",
+      "peer": true,
       "dependencies": {
         "iter-fest": "^0.3.0"
       },
@@ -12651,6 +12744,7 @@
       "version": "29.7.0",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@jest/types": "^29.6.3",
         "@types/node": "*",
@@ -13032,6 +13126,7 @@
       "version": "29.7.0",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@jest/types": "^29.6.3",
         "@types/node": "*",
@@ -13418,6 +13513,12 @@
         "changelog": "esm/bin.js"
       }
     },
+    "node_modules/keyborg": {
+      "version": "2.6.0",
+      "resolved": "https://registry.npmjs.org/keyborg/-/keyborg-2.6.0.tgz",
+      "integrity": "sha512-o5kvLbuTF+o326CMVYpjlaykxqYP9DphFQZ2ZpgrvBouyvOxyEB7oqe8nOLFpiV5VCtz0D3pt8gXQYWpLpBnmA==",
+      "license": "MIT"
+    },
     "node_modules/keyv": {
       "version": "4.5.4",
       "dev": true,
@@ -14824,6 +14925,7 @@
       "version": "1.17.0",
       "resolved": "https://registry.npmjs.org/microsoft-cognitiveservices-speech-sdk/-/microsoft-cognitiveservices-speech-sdk-1.17.0.tgz",
       "integrity": "sha512-RVUCpTeu1g+R4HB/PaLQmEfsdHzwEa6+2phgCiPA4lGIiR7ILEL7qZHHUWAG6W4zcjnWeiLnL7tVgMbyd5XGgA==",
+      "peer": true,
       "dependencies": {
         "agent-base": "^6.0.1",
         "asn1.js-rfc2560": "^5.0.1",
@@ -15026,7 +15128,6 @@
       "version": "1.0.4",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "bin": {
         "mkdirp": "bin/cmd.js"
       },
@@ -15205,6 +15306,7 @@
       "version": "8.0.2",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "growly": "^1.3.0",
         "is-wsl": "^2.2.0",
@@ -15739,8 +15841,7 @@
     "node_modules/pend": {
       "version": "1.2.0",
       "dev": true,
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/picocolors": {
       "version": "1.1.1",
@@ -15875,6 +15976,7 @@
         }
       ],
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "nanoid": "^3.3.7",
         "picocolors": "^1.1.0",
@@ -15996,6 +16098,7 @@
       "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.7.4.tgz",
       "integrity": "sha512-v6UNi1+3hSlVvv8fSaoUbggEM5VErKmmpGA7Pl3HF8V6uKY7rvClBOJlH6yNwQtfTueNkGVpOv/mtWL9L4bgRA==",
       "dev": true,
+      "peer": true,
       "bin": {
         "prettier": "bin/prettier.cjs"
       },
@@ -16104,8 +16207,7 @@
     "node_modules/proxy-from-env": {
       "version": "1.1.0",
       "dev": true,
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/prr": {
       "version": "1.0.1",
@@ -16271,6 +16373,7 @@
       "version": "16.8.6",
       "resolved": "https://registry.npmjs.org/react/-/react-16.8.6.tgz",
       "integrity": "sha512-pC0uMkhLaHm11ZSJULfOBqV4tIZkx87ZLvbbQYunNixAAvjnC+snJCg0XQXn9VIsttVsbZP/H/ewzgsd5fxKXw==",
+      "peer": true,
       "dependencies": {
         "loose-envify": "^1.1.0",
         "object-assign": "^4.1.1",
@@ -16285,6 +16388,7 @@
       "version": "0.4.2",
       "resolved": "https://registry.npmjs.org/react-chain-of-responsibility/-/react-chain-of-responsibility-0.4.2.tgz",
       "integrity": "sha512-khBaWO1rSLSUw6Ydr3lYFgONwmrx9rSOClrLCyn7cq40QxVJSh5utq1rbey+Pr24trWmQdC9qweTuKG2RptTXw==",
+      "peer": true,
       "dependencies": {
         "handler-chain": "^0.1.0",
         "react-chain-of-responsibility": "^0.4.2",
@@ -16312,6 +16416,7 @@
       "version": "16.8.6",
       "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.8.6.tgz",
       "integrity": "sha512-1nL7PIq9LTL3fthPqwkvr2zY7phIPjYrT0jp4HjyEQrEROnw4dG41VVwi/wfoCneoleqrNX7iAD+pXebJZwrwA==",
+      "peer": true,
       "dependencies": {
         "loose-envify": "^1.1.0",
         "object-assign": "^4.1.1",
@@ -16696,7 +16801,8 @@
     "node_modules/redux": {
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/redux/-/redux-5.0.1.tgz",
-      "integrity": "sha512-M9/ELqF6fy8FwmkpnF0S3YKOqMyoWJ4+CS5Efg2ct3oY9daQvd/Pc71FpGZsVsbl3Cpb+IIcjBDUnnyBdQbq4w=="
+      "integrity": "sha512-M9/ELqF6fy8FwmkpnF0S3YKOqMyoWJ4+CS5Efg2ct3oY9daQvd/Pc71FpGZsVsbl3Cpb+IIcjBDUnnyBdQbq4w==",
+      "peer": true
     },
     "node_modules/redux-saga": {
       "version": "1.4.2",
@@ -17030,6 +17136,7 @@
       "version": "4.46.2",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@types/estree": "1.0.8"
       },
@@ -17109,6 +17216,15 @@
         "node": "6.* || >= 7.*"
       }
     },
+    "node_modules/rtl-css-js": {
+      "version": "1.16.1",
+      "resolved": "https://registry.npmjs.org/rtl-css-js/-/rtl-css-js-1.16.1.tgz",
+      "integrity": "sha512-lRQgou1mu19e+Ya0LsTvKrVJ5TYUbqCVPAiImX3UfLTenarvPUl1QFdvu5Z3PYmHT9RCcwIfbjRQBntExyj3Zg==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/runtime": "^7.1.2"
+      }
+    },
     "node_modules/run-parallel": {
       "version": "1.2.0",
       "dev": true,
@@ -17324,6 +17440,7 @@
       "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.17.1.tgz",
       "integrity": "sha512-B/gBuNg5SiMTrPkC+A2+cW0RszwxYmn6VYxB/inlBStS5nx6xHIt/ehKRhIMhqusl7a8LjQoZnjCs5vhwxOQ1g==",
       "dev": true,
+      "peer": true,
       "dependencies": {
         "fast-deep-equal": "^3.1.3",
         "fast-uri": "^3.0.1",
@@ -18520,6 +18637,32 @@
         "url": "https://opencollective.com/synckit"
       }
     },
+    "node_modules/tabster": {
+      "version": "8.7.0",
+      "resolved": "https://registry.npmjs.org/tabster/-/tabster-8.7.0.tgz",
+      "integrity": "sha512-AKYquti8AdWzuqJdQo4LUMQDZrHoYQy6V+8yUq2PmgLZV10EaB+8BD0nWOfC/3TBp4mPNg4fbHkz6SFtkr0PpA==",
+      "license": "MIT",
+      "dependencies": {
+        "keyborg": "2.6.0",
+        "tslib": "^2.8.1"
+      },
+      "optionalDependencies": {
+        "@rollup/rollup-linux-x64-gnu": "4.53.3"
+      }
+    },
+    "node_modules/tabster/node_modules/@rollup/rollup-linux-x64-gnu": {
+      "version": "4.53.3",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.53.3.tgz",
+      "integrity": "sha512-3EhFi1FU6YL8HTUJZ51imGJWEX//ajQPfqWLI3BQq4TlvHy4X0MOr5q3D2Zof/ka0d5FNdPwZXm3Yyib/UEd+w==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
     "node_modules/tagged-tag": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/tagged-tag/-/tagged-tag-1.0.0.tgz",
@@ -18765,6 +18908,7 @@
       "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz",
       "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
       "dev": true,
+      "peer": true,
       "engines": {
         "node": ">=12"
       },
@@ -19182,6 +19326,7 @@
       "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.9.3.tgz",
       "integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==",
       "devOptional": true,
+      "peer": true,
       "bin": {
         "tsc": "bin/tsc",
         "tsserver": "bin/tsserver"
@@ -19603,6 +19748,7 @@
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/use-ref-from/-/use-ref-from-0.1.0.tgz",
       "integrity": "sha512-PRjmfhUGUKghhOjKV1dBU66M7CASdb4NkMsaaWLdJA81yOZFlVL7Pi3O9aD+68pRh0VrRQjZfS6Ux3vPy1VhRg==",
+      "peer": true,
       "dependencies": {
         "@babel/runtime-corejs3": "^7.24.1",
         "use-ref-from": "^0.1.0"
@@ -19637,6 +19783,7 @@
       "version": "8.3.2",
       "resolved": "https://registry.npmjs.org/uuid/-/uuid-8.3.2.tgz",
       "integrity": "sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg==",
+      "peer": true,
       "bin": {
         "uuid": "dist/bin/uuid"
       }
@@ -19658,6 +19805,7 @@
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/valibot/-/valibot-1.2.0.tgz",
       "integrity": "sha512-mm1rxUsmOxzrwnX5arGS+U4T25RdvpPjPN4yR0u9pUBov9+zGVtO84tif1eY4r6zWxVxu3KzIyknJy3rxfRZZg==",
+      "peer": true,
       "peerDependencies": {
         "typescript": ">=5"
       },
@@ -19763,6 +19911,7 @@
       "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.104.1.tgz",
       "integrity": "sha512-Qphch25abbMNtekmEGJmeRUhLDbe+QfiWTiqpKYkpCOWY64v9eyl+KRRLmqOFA2AvKPpc9DC6+u2n76tQLBoaA==",
       "dev": true,
+      "peer": true,
       "dependencies": {
         "@types/eslint-scope": "^3.7.7",
         "@types/estree": "^1.0.8",
@@ -19811,6 +19960,7 @@
       "resolved": "https://registry.npmjs.org/webpack-cli/-/webpack-cli-6.0.1.tgz",
       "integrity": "sha512-MfwFQ6SfwinsUVi0rNJm7rHZ31GyTcpVE5pgVA3hwFRb7COD4TzjUUwhGWKfO50+xdc2MQPuEBBJoqIMGt3JDw==",
       "dev": true,
+      "peer": true,
       "dependencies": {
         "@discoveryjs/json-ext": "^0.6.1",
         "@webpack-cli/configtest": "^3.0.1",
@@ -20342,7 +20492,6 @@
       "version": "2.10.0",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "buffer-crc32": "~0.2.3",
         "fd-slicer": "~1.1.0"
@@ -20364,6 +20513,7 @@
       "resolved": "https://registry.npmjs.org/zod/-/zod-4.2.1.tgz",
       "integrity": "sha512-0wZ1IRqGGhMP76gLqz8EyfBXKk0J2qo2+H3fi4mcUP/KtTocoX08nmIAHl1Z2kJIZbZee8KOpBCSNPRgauucjw==",
       "dev": true,
+      "peer": true,
       "funding": {
         "url": "https://github.com/sponsors/colinhacks"
       }
@@ -21664,6 +21814,145 @@
         }
       }
     },
+    "packages/test/test-assets": {
+      "name": "@msinternal/test-assets",
+      "version": "0.0.0-0",
+      "license": "MIT",
+      "dependencies": {
+        "@fluentui/react-provider": "^9.22.13",
+        "@fluentui/tokens": "^1.0.0-alpha.23",
+        "react": "^18.3.1",
+        "react-dom": "^18.3.1"
+      },
+      "devDependencies": {},
+      "engines": {
+        "node": ">= 14.0.0"
+      }
+    },
+    "packages/test/test-assets/node_modules/@fluentui/react-jsx-runtime": {
+      "version": "9.3.5",
+      "resolved": "https://registry.npmjs.org/@fluentui/react-jsx-runtime/-/react-jsx-runtime-9.3.5.tgz",
+      "integrity": "sha512-Zrgz35HaG1ZHAV8tvUyxHJ6nOcVWfE1iqJ86WGSns4KChda6WfSZeTap+b7tjPiAyOAcH8KCBxqobLybqExMqA==",
+      "license": "MIT",
+      "dependencies": {
+        "@fluentui/react-utilities": "^9.26.1",
+        "@swc/helpers": "^0.5.1",
+        "react-is": "^17.0.2"
+      },
+      "peerDependencies": {
+        "@types/react": ">=16.14.0 <20.0.0",
+        "react": ">=16.14.0 <20.0.0"
+      }
+    },
+    "packages/test/test-assets/node_modules/@fluentui/react-provider": {
+      "version": "9.22.13",
+      "resolved": "https://registry.npmjs.org/@fluentui/react-provider/-/react-provider-9.22.13.tgz",
+      "integrity": "sha512-ZCH6HqpFGlR6wEeHjJVanJrO23mDJn2+tAkhOmakl01DNwElJH6FoP39Fyd/+k/ArBcp9XtlO4IlpG+xybZXlA==",
+      "license": "MIT",
+      "dependencies": {
+        "@fluentui/react-icons": "^2.0.245",
+        "@fluentui/react-jsx-runtime": "^9.3.5",
+        "@fluentui/react-shared-contexts": "^9.26.1",
+        "@fluentui/react-tabster": "^9.26.12",
+        "@fluentui/react-theme": "^9.2.1",
+        "@fluentui/react-utilities": "^9.26.1",
+        "@griffel/core": "^1.16.0",
+        "@griffel/react": "^1.5.32",
+        "@swc/helpers": "^0.5.1"
+      },
+      "peerDependencies": {
+        "@types/react": ">=16.14.0 <20.0.0",
+        "@types/react-dom": ">=16.9.0 <20.0.0",
+        "react": ">=16.14.0 <20.0.0",
+        "react-dom": ">=16.14.0 <20.0.0"
+      }
+    },
+    "packages/test/test-assets/node_modules/@fluentui/react-shared-contexts": {
+      "version": "9.26.1",
+      "resolved": "https://registry.npmjs.org/@fluentui/react-shared-contexts/-/react-shared-contexts-9.26.1.tgz",
+      "integrity": "sha512-Vf/NKiqx76DC2AqbMPfqoTMPDEw6xINTxQAStq8ymT3oMaf7K79uKu9PnmtFghuXf3FVYVWzIlDWvQmR1ng9zg==",
+      "license": "MIT",
+      "dependencies": {
+        "@fluentui/react-theme": "^9.2.1",
+        "@swc/helpers": "^0.5.1"
+      },
+      "peerDependencies": {
+        "@types/react": ">=16.14.0 <20.0.0",
+        "react": ">=16.14.0 <20.0.0"
+      }
+    },
+    "packages/test/test-assets/node_modules/@fluentui/react-tabster": {
+      "version": "9.26.12",
+      "resolved": "https://registry.npmjs.org/@fluentui/react-tabster/-/react-tabster-9.26.12.tgz",
+      "integrity": "sha512-CuAZ04Vokfvo3oE2wpceGPOCH8yIeLukuukjzrs6YidOOdmOC75sbnrAWm7I6min3+xLr26XLM50Zh3KDK7row==",
+      "license": "MIT",
+      "dependencies": {
+        "@fluentui/react-shared-contexts": "^9.26.1",
+        "@fluentui/react-theme": "^9.2.1",
+        "@fluentui/react-utilities": "^9.26.1",
+        "@griffel/react": "^1.5.32",
+        "@swc/helpers": "^0.5.1",
+        "keyborg": "^2.6.0",
+        "tabster": "^8.5.5"
+      },
+      "peerDependencies": {
+        "@types/react": ">=16.14.0 <20.0.0",
+        "@types/react-dom": ">=16.9.0 <20.0.0",
+        "react": ">=16.14.0 <20.0.0",
+        "react-dom": ">=16.14.0 <20.0.0"
+      }
+    },
+    "packages/test/test-assets/node_modules/@fluentui/react-utilities": {
+      "version": "9.26.1",
+      "resolved": "https://registry.npmjs.org/@fluentui/react-utilities/-/react-utilities-9.26.1.tgz",
+      "integrity": "sha512-TCJ7TAQh4Lf4uEdbbFARhq3MqAGoGAsVKNPf/y54NCOsKnKnTHyQUvhIKFGJGxPpiqbLxqKspPEQOVZNL9am1A==",
+      "license": "MIT",
+      "dependencies": {
+        "@fluentui/keyboard-keys": "^9.0.8",
+        "@fluentui/react-shared-contexts": "^9.26.1",
+        "@swc/helpers": "^0.5.1"
+      },
+      "peerDependencies": {
+        "@types/react": ">=16.14.0 <20.0.0",
+        "react": ">=16.14.0 <20.0.0"
+      }
+    },
+    "packages/test/test-assets/node_modules/react": {
+      "version": "18.3.1",
+      "resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz",
+      "integrity": "sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==",
+      "license": "MIT",
+      "peer": true,
+      "dependencies": {
+        "loose-envify": "^1.1.0"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "packages/test/test-assets/node_modules/react-dom": {
+      "version": "18.3.1",
+      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz",
+      "integrity": "sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==",
+      "license": "MIT",
+      "peer": true,
+      "dependencies": {
+        "loose-envify": "^1.1.0",
+        "scheduler": "^0.23.2"
+      },
+      "peerDependencies": {
+        "react": "^18.3.1"
+      }
+    },
+    "packages/test/test-assets/node_modules/scheduler": {
+      "version": "0.23.2",
+      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.2.tgz",
+      "integrity": "sha512-UOShsPwz7NrMUqhR6t0hWjFduvOzbtv7toDH1/hIrfRNIDBnnBWd0CwJTGvTpngVlmwGCdP9/Zl/tVrDqcuYzQ==",
+      "license": "MIT",
+      "dependencies": {
+        "loose-envify": "^1.1.0"
+      }
+    },
     "packages/test/web-server": {
       "name": "@msinternal/test-web-server",
       "version": "0.0.0-0",
diff --git a/package.json b/package.json
index 27cd962d01..2155c265e5 100644
--- a/package.json
+++ b/package.json
@@ -51,6 +51,7 @@
     "packages/directlinespeech",
     "packages/bundle",
     "packages/test/page-object",
+    "packages/test/test-assets",
     "packages/debug-theme",
     "packages/fluent-theme",
     "packages/vibe-grep"
diff --git a/packages/fluent-theme/src/components/activity/PartGroupingDecorator.module.css b/packages/fluent-theme/src/components/activity/PartGroupingDecorator.module.css
index cc65e33258..3504c33af8 100644
--- a/packages/fluent-theme/src/components/activity/PartGroupingDecorator.module.css
+++ b/packages/fluent-theme/src/components/activity/PartGroupingDecorator.module.css
@@ -398,11 +398,7 @@
       margin: var(--webchat-part-grouping__bubble--space-block) var(--webchat-part-grouping__bubble--space-inline);
     }
 
-    :global(.stacked-layout__attachment-row) {
-      margin-block-start: var(--webchat-spacingVerticalMNudge);
-    }
-
-    &:global(.stacked-layout--no-message .stacked-layout__attachment-row) {
+    &:global(.stacked-layout--no-message .stacked-layout__attachment-row:first-child) {
       margin-block-start: 0;
     }
   }
@@ -561,6 +557,10 @@
       gap: var(--webchat-spacingVerticalXS);
     }
 
+    :global(.stacked-layout .stacked-layout__attachment-row) {
+      margin-block-start: var(--webchat-spacingVerticalMNudge);
+    }
+
     &.part-grouping-decorator--group {
       --webchat-part-grouping__bubble--min-height: 20px;
 
@@ -650,6 +650,64 @@
           font-family: var(--webchat-fontFamilyBase);
           /* Remove double padding for adaptive cards inside bubble */
           padding: unset !important;
+
+          :global(.ac-textBlock) {
+            font-family: var(--webchat-fontFamilyBase) !important;
+          }
+
+          :global(.ac-container:not([style*='background-color:']) .ac-textBlock),
+          > :global(.ac-textBlock) {
+            color: currentColor !important;
+          }
+
+          :global(.ac-pushButton) {
+            background-color: var(--webchat-colorNeutralBackground1);
+            color: var(--webchat-colorNeutralForeground1);
+            border: var(--webchat-strokeWidthThin) solid var(--webchat-colorNeutralStroke1);
+            border-radius: var(--webchat-borderRadiusLarge);
+            transition: all var(--webchat-durationNormal) var(--webchat-curveDecelerateMid);
+          }
+
+          :global(.ac-pushButton:hover) {
+            background-color: var(--webchat-colorNeutralBackground1Hover);
+            border-color: var(--webchat-colorNeutralStroke1Hover);
+            color: var(--webchat-colorNeutralForeground1Hover);
+            cursor: pointer;
+          }
+
+          :global(.ac-pushButton:active),
+          :global(.ac-pushButton[aria-pressed='true']) {
+            background-color: var(--webchat-colorNeutralBackground1Pressed);
+            border-color: var(--webchat-colorNeutralStroke1Pressed);
+            color: var(--webchat-colorNeutralForeground1Pressed);
+            outline-style: none;
+          }
+
+          :global(.ac-pushButton:focus-visible) {
+            border-color: var(--webchat-colorStrokeFocus2);
+            border-width: var(--webchat-strokeWidthThin);
+            outline: var(--webchat-strokeWidthThick) solid var(--webchat-colorTransparentStroke);
+            box-shadow: 0 0 0 var(--webchat-strokeWidthThin) var(--webchat-colorStrokeFocus2) inset;
+          }
+
+          :global(.ac-pushButton.primary) {
+            background-color: var(--webchat-colorBrandBackground);
+            border-color: transparent;
+            color: var(--webchat-colorNeutralForegroundOnBrand);
+          }
+
+          :global(.ac-pushButton.primary:hover) {
+            background-color: var(--webchat-colorBrandBackgroundHover);
+            border-color: transparent;
+            color: var(--webchat-colorNeutralForegroundOnBrand);
+          }
+
+          :global(.ac-pushButton.primary:active),
+          :global(.ac-pushButton.primary[aria-pressed='true']) {
+            background-color: var(--webchat-colorBrandBackgroundPressed);
+            border-color: transparent;
+            color: var(--webchat-colorNeutralForegroundOnBrand);
+          }
         }
       }
 
@@ -801,6 +859,7 @@
     :global(.collapsible-grouping__content) {
       anchor-name: --webchat-flair;
       background: var(--webchat-colorNeutralBackground1);
+      background-clip: padding-box;
       border-radius: var(--webchat-borderRadius2XLarge);
       height: unset;
       opacity: unset;
diff --git a/packages/fluent-theme/src/components/theme/Theme.module.css b/packages/fluent-theme/src/components/theme/Theme.module.css
index 3dadf6afd2..e5f2056795 100644
--- a/packages/fluent-theme/src/components/theme/Theme.module.css
+++ b/packages/fluent-theme/src/components/theme/Theme.module.css
@@ -219,6 +219,7 @@
 :global(.webchat-fluent).theme.variant-copilot :global(.webchat__css-custom-properties) {
   --webchat__padding--sendbox: var(--webchat-spacingVerticalNone) var(--webchat-spacingHorizontalL)
     var(--webchat-spacingVerticalL) var(--webchat-spacingHorizontalSNudge);
+  --webchat__max-height--image-bubble: max(480px, 90cqb);
 }
 
 /* Transcript surface */
diff --git a/packages/test/test-assets/.gitignore b/packages/test/test-assets/.gitignore
new file mode 100644
index 0000000000..9432945cda
--- /dev/null
+++ b/packages/test/test-assets/.gitignore
@@ -0,0 +1,3 @@
+/make.com
+/node_modules/
+/out/
diff --git a/packages/test/test-assets/Makefile b/packages/test/test-assets/Makefile
new file mode 100644
index 0000000000..72787b13c7
--- /dev/null
+++ b/packages/test/test-assets/Makefile
@@ -0,0 +1,100 @@
+export PATH := $(realpath ../../../node_modules/.bin):$(PATH)
+
+# entry points
+REACT_SRC := ./entry/react.js
+REACT_JSX_RUNTIME_SRC := ./entry/react-jsx-runtime.js
+REACT_DOM_SRC := ./entry/react-dom.js
+REACT_DOM_CLIENT_SRC := ./entry/react-dom/client.js
+
+FLUENTUI_REACT_PROVIDER_SRC := ./entry/@fluentui/react-provider.js
+FLUENTUI_TOKENS_SRC := ./entry/@fluentui/tokens.js
+
+# build targets
+
+REACT_OUT := out/react.js
+REACT_JSX_RUNTIME_OUT := out/react-jsx-runtime.js
+REACT_DOM_OUT := out/react-dom.js
+REACT_DOM_CLIENT_OUT := out/react-dom/client.js
+
+FLUENTUI_REACT_PROVIDER_OUT := out/@fluentui/react-provider.js
+FLUENTUI_TOKENS_OUT := out/@fluentui/tokens.js
+
+# build options
+SHARED_FLAGS := --sourcemap --format=esm --bundle --platform=browser
+
+# deps specific options
+REACT_FLAGS := --define:process.env.NODE_ENV=\"production\"
+
+FLUENTUI_FLAGS := --alias:out-root/react.js=react \
+		--alias:out-root/react-jsx-runtime.js=react-jsx-runtime \
+		--alias:out-root/react-dom.js=react-dom \
+		--alias:out-root/react-dom/client.js=react-dom/client.js \
+		--external:react \
+		--external:react-dom \
+		--external:react-dom/client.js \
+		--external:react-jsx-runtime
+
+# aliases
+ALIAS_JSX_RUNTIME := --alias:react/jsx-runtime=./module/react-jsx-runtime.js --alias:react-jsx-runtime=./module/react-jsx-runtime.js
+ALIAS_REACT := --alias:react=./module/react.js
+ALIAS_REACT_DOM := --alias:react-dom=./module/react-dom.js
+ALIAS_REACT_DOM_CLIENT := --alias:react-dom/client=./module/react-dom/client.js
+
+# build rules
+$(REACT_OUT): $(REACT_SRC)
+	@mkdir -p out
+	esbuild $(REACT_SRC) --outfile=$@ \
+		$(SHARED_FLAGS) \
+		$(REACT_FLAGS)
+
+$(REACT_JSX_RUNTIME_OUT): $(REACT_JSX_RUNTIME_SRC) $(REACT_OUT)
+	@mkdir -p out
+	esbuild $(REACT_JSX_RUNTIME_SRC) --outfile=$@ \
+		$(SHARED_FLAGS) \
+		$(REACT_FLAGS) \
+		$(ALIAS_REACT) \
+		--alias:out-root/react.js=react \
+		--external:react
+
+$(REACT_DOM_OUT): $(REACT_DOM_SRC) $(REACT_OUT)
+	@mkdir -p out
+	esbuild $(REACT_DOM_SRC) --outfile=$@ \
+		$(SHARED_FLAGS) \
+		$(REACT_FLAGS) \
+		$(ALIAS_REACT) \
+		--alias:out-root/react.js=react \
+		--external:react
+
+$(REACT_DOM_CLIENT_OUT): $(REACT_DOM_CLIENT_SRC) $(REACT_DOM_OUT) $(REACT_OUT)
+	@mkdir -p out out/react-dom
+	esbuild $(REACT_DOM_CLIENT_SRC) --outfile=$@ \
+		$(SHARED_FLAGS) \
+		$(REACT_FLAGS) \
+		$(ALIAS_REACT_DOM) \
+		--alias:out-root/react-dom.js=react-dom \
+		--external:react-dom
+
+$(FLUENTUI_REACT_PROVIDER_OUT): $(FLUENTUI_REACT_PROVIDER_SRC) $(REACT_OUT) $(REACT_DOM_OUT) $(REACT_JSX_RUNTIME_OUT)
+	@mkdir -p out out/@fluentui
+	esbuild $(FLUENTUI_REACT_PROVIDER_SRC) --outfile=$@ \
+		$(SHARED_FLAGS) \
+		$(ALIAS_REACT) \
+		$(ALIAS_REACT_DOM) \
+		$(ALIAS_JSX_RUNTIME) \
+		$(FLUENTUI_FLAGS)
+
+$(FLUENTUI_TOKENS_OUT): $(FLUENTUI_TOKENS_SRC) $(REACT_OUT) $(REACT_DOM_OUT) $(REACT_JSX_RUNTIME_OUT)
+	@mkdir -p out out/@fluentui
+	esbuild $(FLUENTUI_TOKENS_SRC) --outfile=$@ \
+		$(SHARED_FLAGS) \
+		$(ALIAS_REACT) \
+		$(ALIAS_REACT_DOM) \
+		$(ALIAS_JSX_RUNTIME) \
+		$(FLUENTUI_FLAGS)
+
+all: $(REACT_OUT) $(REACT_JSX_RUNTIME_OUT) $(REACT_DOM_OUT) $(REACT_DOM_CLIENT_OUT) $(FLUENTUI_REACT_PROVIDER_OUT) $(FLUENTUI_TOKENS_OUT)
+
+clean:
+	@rm -rf out/*
+
+.PHONY: all clean
\ No newline at end of file
diff --git a/packages/test/test-assets/entry/@fluentui/react-provider.js b/packages/test/test-assets/entry/@fluentui/react-provider.js
new file mode 100644
index 0000000000..7860a9f93a
--- /dev/null
+++ b/packages/test/test-assets/entry/@fluentui/react-provider.js
@@ -0,0 +1 @@
+export { FluentProvider } from '@fluentui/react-provider';
diff --git a/packages/test/test-assets/entry/@fluentui/tokens.js b/packages/test/test-assets/entry/@fluentui/tokens.js
new file mode 100644
index 0000000000..a0df7ac1e5
--- /dev/null
+++ b/packages/test/test-assets/entry/@fluentui/tokens.js
@@ -0,0 +1 @@
+export { createDarkTheme, webLightTheme } from '@fluentui/tokens';
diff --git a/packages/test/test-assets/entry/react-dom.js b/packages/test/test-assets/entry/react-dom.js
new file mode 100644
index 0000000000..86e3f25559
--- /dev/null
+++ b/packages/test/test-assets/entry/react-dom.js
@@ -0,0 +1,21 @@
+import ReactDOM from 'react-dom';
+
+export const {
+  // @ts-expect-error @types/react hid this export.
+  __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED,
+  createPortal,
+  // @ts-expect-error @types/react hid this export.
+  createRoot,
+  findDOMNode,
+  flushSync,
+  hydrate,
+  // @ts-expect-error @types/react hid this export.
+  hydrateRoot,
+  render,
+  unmountComponentAtNode,
+  unstable_batchedUpdates,
+  unstable_renderSubtreeIntoContainer,
+  version
+} = ReactDOM;
+
+export default ReactDOM;
diff --git a/packages/test/test-assets/entry/react-dom/client.js b/packages/test/test-assets/entry/react-dom/client.js
new file mode 100644
index 0000000000..8635ab936d
--- /dev/null
+++ b/packages/test/test-assets/entry/react-dom/client.js
@@ -0,0 +1,5 @@
+import ReactDOMClient from '../../node_modules/react-dom/client.js';
+
+export const { createRoot, hydrateRoot } = ReactDOMClient;
+
+export default ReactDOMClient;
diff --git a/packages/test/test-assets/entry/react-jsx-runtime.js b/packages/test/test-assets/entry/react-jsx-runtime.js
new file mode 100644
index 0000000000..cfc47c06b5
--- /dev/null
+++ b/packages/test/test-assets/entry/react-jsx-runtime.js
@@ -0,0 +1,3 @@
+import JSXRuntime from '../node_modules/react/jsx-runtime.js';
+
+export const { Fragment, jsx, jsxs } = JSXRuntime;
diff --git a/packages/test/test-assets/entry/react.js b/packages/test/test-assets/entry/react.js
new file mode 100644
index 0000000000..7c1ab101ce
--- /dev/null
+++ b/packages/test/test-assets/entry/react.js
@@ -0,0 +1,44 @@
+import React from 'react';
+
+export const {
+  Children,
+  Component,
+  Fragment,
+  Profiler,
+  PureComponent,
+  StrictMode,
+  Suspense,
+  // @ts-expect-error @types/react hid this export.
+  __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED,
+  act,
+  cloneElement,
+  createContext,
+  createElement,
+  createFactory,
+  createRef,
+  forwardRef,
+  isValidElement,
+  lazy,
+  memo,
+  startTransition,
+  // @ts-expect-error @types/react hid this export.
+  unstable_act,
+  useCallback,
+  useContext,
+  useDebugValue,
+  useDeferredValue,
+  useEffect,
+  useId,
+  useImperativeHandle,
+  useInsertionEffect,
+  useLayoutEffect,
+  useMemo,
+  useReducer,
+  useRef,
+  useState,
+  useSyncExternalStore,
+  useTransition,
+  version
+} = React;
+
+export default React;
diff --git a/packages/test/test-assets/module/react-dom.js b/packages/test/test-assets/module/react-dom.js
new file mode 100644
index 0000000000..24390b60a5
--- /dev/null
+++ b/packages/test/test-assets/module/react-dom.js
@@ -0,0 +1 @@
+export * from 'out-root/react-dom.js';
diff --git a/packages/test/test-assets/module/react-dom/client.js b/packages/test/test-assets/module/react-dom/client.js
new file mode 100644
index 0000000000..0615e49bbb
--- /dev/null
+++ b/packages/test/test-assets/module/react-dom/client.js
@@ -0,0 +1 @@
+export * from 'out-root/react-dom/client.js';
diff --git a/packages/test/test-assets/module/react-jsx-runtime.js b/packages/test/test-assets/module/react-jsx-runtime.js
new file mode 100644
index 0000000000..2efabc1822
--- /dev/null
+++ b/packages/test/test-assets/module/react-jsx-runtime.js
@@ -0,0 +1 @@
+export * from 'out-root/react-jsx-runtime.js';
diff --git a/packages/test/test-assets/module/react-scheduler.js b/packages/test/test-assets/module/react-scheduler.js
new file mode 100644
index 0000000000..8422c57cd3
--- /dev/null
+++ b/packages/test/test-assets/module/react-scheduler.js
@@ -0,0 +1 @@
+export * from 'out-root/react-scheduler.js';
diff --git a/packages/test/test-assets/module/react.js b/packages/test/test-assets/module/react.js
new file mode 100644
index 0000000000..1b9c4d1f4a
--- /dev/null
+++ b/packages/test/test-assets/module/react.js
@@ -0,0 +1 @@
+export * from 'out-root/react.js';
diff --git a/packages/test/test-assets/package.json b/packages/test/test-assets/package.json
new file mode 100644
index 0000000000..809aaa395c
--- /dev/null
+++ b/packages/test/test-assets/package.json
@@ -0,0 +1,32 @@
+{
+  "name": "@msinternal/test-assets",
+  "version": "0.0.0-0",
+  "description": "Uses make.com from Cosmopolitan Libc. Source code available at: https://github.com/jart/cosmopolitan/tree/master/third_party/make",
+  "private": true,
+  "author": "Microsoft Corporation",
+  "license": "MIT",
+  "engines": {
+    "node": ">= 14.0.0"
+  },
+  "scripts": {
+    "build": "npm run --if-present build:pre && npm run build:run && npm run --if-present build:post",
+    "build:pre": "npm run build:pre:local-dependencies && npm run build:pre:setup && npm run build:pre:watch",
+    "build:pre:local-dependencies": "../../../scripts/npm/build-local-dependencies.sh",
+    "build:pre:setup": "command -v make >/dev/null 2>&1 || { [ -x ./make.com ] || { curl -fsSL -o make.com https://cosmo.zip/pub/cosmos/bin/make && EXPECTED_SHA=7b14377fbd6fff445abbf922583112c25a678b375eea624bd1765f74756f54fb && ACTUAL_SHA=$(shasum -a 256 make.com | cut -d' ' -f1) && [ \"$EXPECTED_SHA\" = \"$ACTUAL_SHA\" ] || { echo \"ERROR: make.com SHA mismatch! Expected: $EXPECTED_SHA, Got: $ACTUAL_SHA\" >&2; rm make.com; exit 1; } && chmod +x make.com; }; }",
+    "build:pre:watch": "../../../scripts/npm/build-watch.sh",
+    "build:run": "MAKE_BIN=$(command -v make || echo ./make.com) && \"$MAKE_BIN\" clean all",
+    "bump": "vg bump prod && vg bump dev && (npm audit fix || exit 0)",
+    "eslint": "npm run precommit",
+    "postversion": "../../../scripts/npm/postversion.sh",
+    "preversion": "../../../scripts/npm/preversion.sh",
+    "start": "../../../scripts/npm/notify-build.sh \"out\""
+  },
+  "pinDependencies": {},
+  "localDependencies": {},
+  "dependencies": {
+    "@fluentui/react-provider": "^9.22.13",
+    "@fluentui/tokens": "^1.0.0-alpha.23",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1"
+  }
+}
diff --git a/serve-test.json b/serve-test.json
index e6d41d9a3b..a98d1e2013 100644
--- a/serve-test.json
+++ b/serve-test.json
@@ -103,6 +103,18 @@
       "source": "/__dist__/packages/fluent-theme/static/:dirname/:filename",
       "destination": "packages/fluent-theme/static/:dirname/:filename"
     },
+    {
+      "source": "/__dist__/packages/test/test-assets/out/:filename",
+      "destination": "packages/test/test-assets/out/:filename"
+    },
+    {
+      "source": "/__dist__/packages/test/test-assets/out/@fluentui/:filename",
+      "destination": "packages/test/test-assets/out/@fluentui/:filename"
+    },
+    {
+      "source": "/__dist__/packages/test/test-assets/out/:dirname/:filename",
+      "destination": "packages/test/test-assets/out/:dirname/:filename"
+    },
     {
       "source": "/test-harness.js",
       "destination": "packages/test/harness/dist/test-harness.js"