@fluentui/web-components 3.0.0-rc.23 → 3.0.0-rc.24

package/CHANGELOG.md

@@ -1,12 +1,21 @@
 # Change Log - @fluentui/web-components
 
-This log was last generated on Wed, 03 Jun 2026 04:07:43 GMT and should not be manually modified.
+This log was last generated on Mon, 08 Jun 2026 04:10:10 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [3.0.0-rc.24](https://github.com/microsoft/fluentui/tree/@fluentui/web-components_v3.0.0-rc.24)
+
+Mon, 08 Jun 2026 04:10:10 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/web-components_v3.0.0-rc.23..@fluentui/web-components_v3.0.0-rc.24)
+
+### Changes
+
+- make anchor position target fixed position ([PR #36258](https://github.com/microsoft/fluentui/pull/36258) by machi@microsoft.com)
+
 ## [3.0.0-rc.23](https://github.com/microsoft/fluentui/tree/@fluentui/web-components_v3.0.0-rc.23)
 
-Wed, 03 Jun 2026 04:07:43 GMT 
+Wed, 03 Jun 2026 04:07:54 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/web-components_v3.0.0-rc.22..@fluentui/web-components_v3.0.0-rc.23)
 
 ### Changes

package/custom-elements.json

@@ -28218,7 +28218,7 @@
     },
     {
       "kind": "javascript-module",
-      "path": "src/badge/badge.definition-async.ts",
+      "path": "src/anchor-button/anchor-button.definition-async.ts",
       "declarations": [
         {
           "kind": "variable",
@@ -28227,7 +28227,7 @@
             "text": "PartialFASTElementDefinition"
           },
           "default": "{ name: tagName, templateOptions: 'defer-and-hydrate', }",
-          "description": "The async definition configuration for the fluent-badge element.",
+          "description": "The async definition configuration for the fluent-anchor-button element.",
           "privacy": "public"
         }
       ],
@@ -28237,20 +28237,20 @@
           "name": "definition",
           "declaration": {
             "name": "definition",
-            "module": "src/badge/badge.definition-async.ts"
+            "module": "src/anchor-button/anchor-button.definition-async.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/badge/define-async.ts",
+      "path": "src/anchor-button/define-async.ts",
       "declarations": [],
       "exports": []
     },
     {
       "kind": "javascript-module",
-      "path": "src/anchor-button/anchor-button.definition-async.ts",
+      "path": "src/avatar/avatar.definition-async.ts",
       "declarations": [
         {
           "kind": "variable",
@@ -28259,7 +28259,7 @@
             "text": "PartialFASTElementDefinition"
           },
           "default": "{ name: tagName, templateOptions: 'defer-and-hydrate', }",
-          "description": "The async definition configuration for the fluent-anchor-button element.",
+          "description": "The async definition configuration for the fluent-avatar element.",
           "privacy": "public"
         }
       ],
@@ -28269,20 +28269,20 @@
           "name": "definition",
           "declaration": {
             "name": "definition",
-            "module": "src/anchor-button/anchor-button.definition-async.ts"
+            "module": "src/avatar/avatar.definition-async.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/anchor-button/define-async.ts",
+      "path": "src/avatar/define-async.ts",
       "declarations": [],
       "exports": []
     },
     {
       "kind": "javascript-module",
-      "path": "src/button/button.definition-async.ts",
+      "path": "src/badge/badge.definition-async.ts",
       "declarations": [
         {
           "kind": "variable",
@@ -28291,7 +28291,7 @@
             "text": "PartialFASTElementDefinition"
           },
           "default": "{ name: tagName, templateOptions: 'defer-and-hydrate', }",
-          "description": "The async definition configuration for the fluent-button element.",
+          "description": "The async definition configuration for the fluent-badge element.",
           "privacy": "public"
         }
       ],
@@ -28301,20 +28301,20 @@
           "name": "definition",
           "declaration": {
             "name": "definition",
-            "module": "src/button/button.definition-async.ts"
+            "module": "src/badge/badge.definition-async.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/button/define-async.ts",
+      "path": "src/badge/define-async.ts",
       "declarations": [],
       "exports": []
     },
     {
       "kind": "javascript-module",
-      "path": "src/avatar/avatar.definition-async.ts",
+      "path": "src/button/button.definition-async.ts",
       "declarations": [
         {
           "kind": "variable",
@@ -28323,7 +28323,7 @@
             "text": "PartialFASTElementDefinition"
           },
           "default": "{ name: tagName, templateOptions: 'defer-and-hydrate', }",
-          "description": "The async definition configuration for the fluent-avatar element.",
+          "description": "The async definition configuration for the fluent-button element.",
           "privacy": "public"
         }
       ],
@@ -28333,14 +28333,14 @@
           "name": "definition",
           "declaration": {
             "name": "definition",
-            "module": "src/avatar/avatar.definition-async.ts"
+            "module": "src/button/button.definition-async.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/avatar/define-async.ts",
+      "path": "src/button/define-async.ts",
       "declarations": [],
       "exports": []
     },

package/dist/esm/dialog/dialog.styles.css

@@ -23,7 +23,6 @@
 
     :host([type='non-modal']) dialog {
       inset: 0;
-      position: fixed;
       z-index: 2;
       overflow: auto;
     }

package/dist/esm/dialog/dialog.styles.js

@@ -28,7 +28,6 @@ export const styles = css `
 
     :host([type='non-modal']) dialog {
       inset: 0;
-      position: fixed;
       z-index: 2;
       overflow: auto;
     }

package/dist/esm/dialog/dialog.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"dialog.styles.js","sourceRoot":"","sources":["../../../src/dialog/dialog.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EACL,kBAAkB,EAClB,sBAAsB,EACtB,uBAAuB,EACvB,uBAAuB,EACvB,sBAAsB,EACtB,kBAAkB,EAClB,kBAAkB,EAClB,WAAW,EACX,cAAc,EACd,QAAQ,EACR,eAAe,GAChB,MAAM,2BAA2B,CAAC;AAEnC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;2BAGE,sBAAsB;;;;;;;;;oBAS7B,uBAAuB;uBACpB,kBAAkB;;oBAErB,QAAQ;eACb,uBAAuB;;;;;;;;;;;;;;;;;;;;;;;;;;;+BA2BP,cAAc;sCACP,kBAAkB;;;;;sCAKlB,WAAW;;;;;;;;;;;;;;sCAcX,kBAAkB;;;;;;;;;;;;;;;;;;;kBAmBtC,eAAe,UAAU,sBAAsB;;;;CAIhE,CAAC"}
+{"version":3,"file":"dialog.styles.js","sourceRoot":"","sources":["../../../src/dialog/dialog.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EACL,kBAAkB,EAClB,sBAAsB,EACtB,uBAAuB,EACvB,uBAAuB,EACvB,sBAAsB,EACtB,kBAAkB,EAClB,kBAAkB,EAClB,WAAW,EACX,cAAc,EACd,QAAQ,EACR,eAAe,GAChB,MAAM,2BAA2B,CAAC;AAEnC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;2BAGE,sBAAsB;;;;;;;;;oBAS7B,uBAAuB;uBACpB,kBAAkB;;oBAErB,QAAQ;eACb,uBAAuB;;;;;;;;;;;;;;;;;;;;;;;;;;+BA0BP,cAAc;sCACP,kBAAkB;;;;;sCAKlB,WAAW;;;;;;;;;;;;;;sCAcX,kBAAkB;;;;;;;;;;;;;;;;;;;kBAmBtC,eAAe,UAAU,sBAAsB;;;;CAIhE,CAAC"}

package/dist/esm/dropdown/dropdown.styles.css

@@ -2,7 +2,6 @@
   :host([hidden]){display:none}:host{display:inline-flex}
 
   :host {
-    anchor-name: --dropdown-trigger;
     box-sizing: border-box;
     color: var(--colorNeutralForeground1);
     cursor: pointer;

package/dist/esm/dropdown/dropdown.styles.js

@@ -12,7 +12,6 @@ export const styles = css `
   ${display('inline-flex')}
 
   :host {
-    anchor-name: --dropdown-trigger;
     box-sizing: border-box;
     color: ${colorNeutralForeground1};
     cursor: pointer;

package/dist/esm/dropdown/dropdown.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown.styles.js","sourceRoot":"","sources":["../../../src/dropdown/dropdown.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EACL,qBAAqB,EACrB,qBAAqB,EACrB,wBAAwB,GACzB,MAAM,2CAA2C,CAAC;AACnD,OAAO,EAAE,SAAS,EAAE,qBAAqB,EAAE,MAAM,2BAA2B,CAAC;AAC7E,OAAO,EACL,kBAAkB,EAClB,gBAAgB,EAChB,iCAAiC,EACjC,mCAAmC,EACnC,wBAAwB,EACxB,uBAAuB,EACvB,uBAAuB,EACvB,8BAA8B,EAC9B,uBAAuB,EACvB,uBAAuB,EACvB,uBAAuB,EACvB,8BAA8B,EAC9B,mBAAmB,EACnB,wBAAwB,EACxB,0BAA0B,EAC1B,4BAA4B,EAC5B,iCAAiC,EACjC,mCAAmC,EACnC,0BAA0B,EAC1B,iBAAiB,EACjB,iBAAiB,EACjB,0BAA0B,EAC1B,sBAAsB,EACtB,iCAAiC,EACjC,kBAAkB,EAClB,kBAAkB,EAClB,cAAc,EACd,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,kBAAkB,EAClB,uBAAuB,EACvB,kBAAkB,EAClB,uBAAuB,EACvB,oBAAoB,EACpB,gBAAgB,EAChB,qBAAqB,EACrB,iBAAiB,EACjB,gBAAgB,EAChB,eAAe,GAChB,MAAM,2BAA2B,CAAC;AACnC,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAE9C;;;;GAIG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;IACrB,OAAO,CAAC,aAAa,CAAC;;;;;aAKb,uBAAuB;;;;UAI1B,qBAAqB;aAClB,uBAAuB;;;;;wBAKZ,uBAAuB;qBAC1B,kBAAkB;cACzB,eAAe,UAAU,sBAAsB;8BAC/B,eAAe;;;kBAG3B,oBAAoB;;;;;eAKvB,qBAAqB,IAAI,uBAAuB;;;;;;MAMzD,qBAAqB;;;;kBAIT,oBAAoB;eACvB,iBAAiB,IAAI,uBAAuB;MACrD,wBAAwB;;;;kBAIZ,kBAAkB;eACrB,gBAAgB,IAAI,kBAAkB;MAC/C,qBAAqB;;;;;;;;;;;;;;;;;;;;;aAqBd,uBAAuB;;;;;;;;;;;;;;;;;;;;;;;cAuBtB,eAAe;;;;wBAIL,wBAAwB;cAClC,gBAAgB;;wBAEN,iBAAiB,IAAI,kBAAkB;;;;;;;;;qBAS1C,kBAAkB;kCACL,iBAAiB;eACpC,gBAAgB,UAAU,iBAAiB;;;iBAGzC,SAAS;;2BAEC,cAAc;kCACP,kBAAkB;;;;wBAI5B,4BAA4B;;;;8BAItB,iCAAiC;wBACvC,0BAA0B;qBAC7B,gBAAgB;;;;8BAIP,mBAAmB;;;;8BAInB,wBAAwB;;;;wBAI9B,iCAAiC;;;;wBAIjC,iCAAiC;;;;8BAI3B,0BAA0B;;;;wBAIhC,mCAAmC;;;;wBAInC,mCAAmC;;;;wBAInC,uBAAuB;;;;8BAIjB,sBAAsB;;;;;;;;;;;;;;;8BAetB,0BAA0B;wBAChC,8BAA8B;aACzC,8BAA8B;;;;;;;;;;;8BAWb,iBAAiB,OAAO,qBAAqB,WAAW,eAAe;;;;8BAIvE,iBAAiB,OAAO,iBAAiB,WAAW,eAAe;;;;8BAInE,iBAAiB,OAAO,gBAAgB,WAAW,eAAe;;;;;;;;;;;CAW/F,CAAC"}
+{"version":3,"file":"dropdown.styles.js","sourceRoot":"","sources":["../../../src/dropdown/dropdown.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EACL,qBAAqB,EACrB,qBAAqB,EACrB,wBAAwB,GACzB,MAAM,2CAA2C,CAAC;AACnD,OAAO,EAAE,SAAS,EAAE,qBAAqB,EAAE,MAAM,2BAA2B,CAAC;AAC7E,OAAO,EACL,kBAAkB,EAClB,gBAAgB,EAChB,iCAAiC,EACjC,mCAAmC,EACnC,wBAAwB,EACxB,uBAAuB,EACvB,uBAAuB,EACvB,8BAA8B,EAC9B,uBAAuB,EACvB,uBAAuB,EACvB,uBAAuB,EACvB,8BAA8B,EAC9B,mBAAmB,EACnB,wBAAwB,EACxB,0BAA0B,EAC1B,4BAA4B,EAC5B,iCAAiC,EACjC,mCAAmC,EACnC,0BAA0B,EAC1B,iBAAiB,EACjB,iBAAiB,EACjB,0BAA0B,EAC1B,sBAAsB,EACtB,iCAAiC,EACjC,kBAAkB,EAClB,kBAAkB,EAClB,cAAc,EACd,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,kBAAkB,EAClB,uBAAuB,EACvB,kBAAkB,EAClB,uBAAuB,EACvB,oBAAoB,EACpB,gBAAgB,EAChB,qBAAqB,EACrB,iBAAiB,EACjB,gBAAgB,EAChB,eAAe,GAChB,MAAM,2BAA2B,CAAC;AACnC,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAE9C;;;;GAIG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;IACrB,OAAO,CAAC,aAAa,CAAC;;;;aAIb,uBAAuB;;;;UAI1B,qBAAqB;aAClB,uBAAuB;;;;;wBAKZ,uBAAuB;qBAC1B,kBAAkB;cACzB,eAAe,UAAU,sBAAsB;8BAC/B,eAAe;;;kBAG3B,oBAAoB;;;;;eAKvB,qBAAqB,IAAI,uBAAuB;;;;;;MAMzD,qBAAqB;;;;kBAIT,oBAAoB;eACvB,iBAAiB,IAAI,uBAAuB;MACrD,wBAAwB;;;;kBAIZ,kBAAkB;eACrB,gBAAgB,IAAI,kBAAkB;MAC/C,qBAAqB;;;;;;;;;;;;;;;;;;;;;aAqBd,uBAAuB;;;;;;;;;;;;;;;;;;;;;;;cAuBtB,eAAe;;;;wBAIL,wBAAwB;cAClC,gBAAgB;;wBAEN,iBAAiB,IAAI,kBAAkB;;;;;;;;;qBAS1C,kBAAkB;kCACL,iBAAiB;eACpC,gBAAgB,UAAU,iBAAiB;;;iBAGzC,SAAS;;2BAEC,cAAc;kCACP,kBAAkB;;;;wBAI5B,4BAA4B;;;;8BAItB,iCAAiC;wBACvC,0BAA0B;qBAC7B,gBAAgB;;;;8BAIP,mBAAmB;;;;8BAInB,wBAAwB;;;;wBAI9B,iCAAiC;;;;wBAIjC,iCAAiC;;;;8BAI3B,0BAA0B;;;;wBAIhC,mCAAmC;;;;wBAInC,mCAAmC;;;;wBAInC,uBAAuB;;;;8BAIjB,sBAAsB;;;;;;;;;;;;;;;8BAetB,0BAA0B;wBAChC,8BAA8B;aACzC,8BAA8B;;;;;;;;;;;8BAWb,iBAAiB,OAAO,qBAAqB,WAAW,eAAe;;;;8BAIvE,iBAAiB,OAAO,iBAAiB,WAAW,eAAe;;;;8BAInE,iBAAiB,OAAO,gBAAgB,WAAW,eAAe;;;;;;;;;;;CAW/F,CAAC"}

package/dist/esm/listbox/listbox.styles.css

@@ -9,7 +9,7 @@
     box-sizing: border-box;
     flex-direction: column;
     margin: 0;
-    min-width: 160px;
+    min-inline-size: 160px;
     padding: var(--spacingHorizontalXS);
     row-gap: var(--spacingHorizontalXXS);
     width: auto;
@@ -22,26 +22,20 @@
 
   @supports (anchor-name: --anchor) {
     :host([popover]) {
-      position: absolute;
-      margin-block-start: 0;
-      max-height: var(--listbox-max-height, calc(50vh - anchor-size(self-block)));
-      min-width: anchor-size(width);
-      position-anchor: --dropdown;
-      position-area: block-end span-inline-end;
-      position-try-fallbacks: flip-inline, flip-block, --flip-block, block-start;
-    }
-
-    @position-try --flip-block {
-      bottom: anchor(top);
-      top: unset;
+      position: fixed;
+      max-block-size: var(--listbox-max-height, calc(50vh - anchor-size(self-block)));
+      min-inline-size: anchor-size(inline);
+      inset-block-start: anchor(end);
+      inset-inline-start: anchor(start);
+      position-try-fallbacks: flip-block, flip-inline, flip-inline flip-block;
     }
   }
 
   @supports not (anchor-name: --anchor) {
     :host([popover]) {
       margin-block-start: var(--margin-offset, 0);
-      max-height: var(--listbox-max-height, 50vh);
-      position: fixed;
+      max-block-size: var(--listbox-max-height, 50vh);
+      position: absolute;
     }
 
     :host([popover]:state(flip-block)) {

package/dist/esm/listbox/listbox.styles.js

@@ -18,7 +18,7 @@ export const styles = css `
     box-sizing: border-box;
     flex-direction: column;
     margin: 0;
-    min-width: 160px;
+    min-inline-size: 160px;
     padding: ${spacingHorizontalXS};
     row-gap: ${spacingHorizontalXXS};
     width: auto;
@@ -31,26 +31,20 @@ export const styles = css `
 
   @supports (anchor-name: --anchor) {
     :host([popover]) {
-      position: absolute;
-      margin-block-start: 0;
-      max-height: var(--listbox-max-height, calc(50vh - anchor-size(self-block)));
-      min-width: anchor-size(width);
-      position-anchor: --dropdown;
-      position-area: block-end span-inline-end;
-      position-try-fallbacks: flip-inline, flip-block, --flip-block, block-start;
-    }
-
-    @position-try --flip-block {
-      bottom: anchor(top);
-      top: unset;
+      position: fixed;
+      max-block-size: var(--listbox-max-height, calc(50vh - anchor-size(self-block)));
+      min-inline-size: anchor-size(inline);
+      inset-block-start: anchor(end);
+      inset-inline-start: anchor(start);
+      position-try-fallbacks: flip-block, flip-inline, flip-inline flip-block;
     }
   }
 
   @supports not (anchor-name: --anchor) {
     :host([popover]) {
       margin-block-start: var(--margin-offset, 0);
-      max-height: var(--listbox-max-height, 50vh);
-      position: fixed;
+      max-block-size: var(--listbox-max-height, 50vh);
+      position: absolute;
     }
 
     :host([popover]${flipBlockState}) {

package/dist/esm/listbox/listbox.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"listbox.styles.js","sourceRoot":"","sources":["../../../src/listbox/listbox.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAC3D,OAAO,EACL,kBAAkB,EAClB,uBAAuB,EACvB,sBAAsB,EACtB,QAAQ,EACR,mBAAmB,EACnB,oBAAoB,EACpB,eAAe,GAChB,MAAM,2BAA2B,CAAC;AACnC,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAE9C;;;;GAIG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;IACrB,OAAO,CAAC,aAAa,CAAC;;;wBAGF,uBAAuB;qBAC1B,kBAAkB;cACzB,eAAe,UAAU,sBAAsB;kBAC3C,QAAQ;;;;;eAKX,mBAAmB;eACnB,oBAAoB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBAiCd,cAAc;;;;;CAKlC,CAAC"}
+{"version":3,"file":"listbox.styles.js","sourceRoot":"","sources":["../../../src/listbox/listbox.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAC3D,OAAO,EACL,kBAAkB,EAClB,uBAAuB,EACvB,sBAAsB,EACtB,QAAQ,EACR,mBAAmB,EACnB,oBAAoB,EACpB,eAAe,GAChB,MAAM,2BAA2B,CAAC;AACnC,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAE9C;;;;GAIG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;IACrB,OAAO,CAAC,aAAa,CAAC;;;wBAGF,uBAAuB;qBAC1B,kBAAkB;cACzB,eAAe,UAAU,sBAAsB;kBAC3C,QAAQ;;;;;eAKX,mBAAmB;eACnB,oBAAoB;;;;;;;;;;;;;;;;;;;;;;;;;;;qBA2Bd,cAAc;;;;;CAKlC,CAAC"}

package/dist/esm/menu/menu.styles.css

@@ -9,18 +9,17 @@
     margin: 0;
     max-height: var(--menu-max-height, auto);
     position-anchor: --menu-trigger;
-    position-area: block-end span-inline-end;
+    inset: unset;
+    inset-block-start: anchor(end);
+    inset-inline-start: anchor(start);
     position-try-fallbacks: flip-block;
-    position: absolute;
+    position: fixed;
     z-index: 1;
   }
 
   :host([split]) ::slotted([popover]) {
-    position-area: block-end span-inline-start;
-  }
-
-  ::slotted([popover]:popover-open) {
-    inset: unset;
+    inset-inline-start: auto;
+    inset-inline-end: anchor(end);
   }
 
   ::slotted([popover]:not(:popover-open)) {

package/dist/esm/menu/menu.styles.js

@@ -15,18 +15,17 @@ export const styles = css `
     margin: 0;
     max-height: var(--menu-max-height, auto);
     position-anchor: --menu-trigger;
-    position-area: block-end span-inline-end;
+    inset: unset;
+    inset-block-start: anchor(end);
+    inset-inline-start: anchor(start);
     position-try-fallbacks: flip-block;
-    position: absolute;
+    position: fixed;
     z-index: 1;
   }
 
   :host([split]) ::slotted([popover]) {
-    position-area: block-end span-inline-start;
-  }
-
-  ::slotted([popover]:popover-open) {
-    inset: unset;
+    inset-inline-start: auto;
+    inset-inline-end: anchor(end);
   }
 
   ::slotted([popover]:not(:popover-open)) {

package/dist/esm/menu/menu.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"menu.styles.js","sourceRoot":"","sources":["../../../src/menu/menu.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EAAE,mBAAmB,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAEjF;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;IACrB,OAAO,CAAC,cAAc,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;yBAiCF,eAAe,UAAU,mBAAmB;;;;;;;;;;;yBAW5C,eAAe;;;;;;;;CAQvC,CAAC"}
+{"version":3,"file":"menu.styles.js","sourceRoot":"","sources":["../../../src/menu/menu.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EAAE,mBAAmB,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAEjF;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;IACrB,OAAO,CAAC,cAAc,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;yBAgCF,eAAe,UAAU,mBAAmB;;;;;;;;;;;yBAW5C,eAAe;;;;;;;;CAQvC,CAAC"}

package/dist/esm/menu-item/menu-item.styles.css

@@ -120,9 +120,11 @@
     ::slotted([popover]) {
       margin: 0;
       max-height: var(--menu-max-height, auto);
-      position: absolute;
+      position: fixed;
       position-anchor: --menu-trigger;
-      position-area: inline-end span-block-end;
+      inset: unset;
+      inset-block-start: anchor(start);
+      inset-inline-start: anchor(end);
       position-try-fallbacks: flip-inline, block-start, block-end;
       z-index: 1;
     }
@@ -131,10 +133,6 @@
       display: none;
     }
 
-    ::slotted([popover]:popover-open) {
-      inset: unset;
-    }
-
     /* Fallback for no anchor-positioning */
     @supports not (anchor-name: --menu-trigger) {
       ::slotted([popover]) {

package/dist/esm/menu-item/menu-item.styles.js

@@ -127,9 +127,11 @@ export const styles = css `
     ::slotted([popover]) {
       margin: 0;
       max-height: var(--menu-max-height, auto);
-      position: absolute;
+      position: fixed;
       position-anchor: --menu-trigger;
-      position-area: inline-end span-block-end;
+      inset: unset;
+      inset-block-start: anchor(start);
+      inset-inline-start: anchor(end);
       position-try-fallbacks: flip-inline, block-start, block-end;
       z-index: 1;
     }
@@ -138,10 +140,6 @@ export const styles = css `
       display: none;
     }
 
-    ::slotted([popover]:popover-open) {
-      inset: unset;
-    }
-
     /* Fallback for no anchor-positioning */
     @supports not (anchor-name: --menu-trigger) {
       ::slotted([popover]) {

package/dist/esm/menu-item/menu-item.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"menu-item.styles.js","sourceRoot":"","sources":["../../../src/menu-item/menu-item.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EACL,kBAAkB,EAClB,oCAAoC,EACpC,uBAAuB,EACvB,4BAA4B,EAC5B,+BAA+B,EAC/B,8BAA8B,EAC9B,uBAAuB,EACvB,4BAA4B,EAC5B,8BAA8B,EAC9B,uBAAuB,EACvB,8BAA8B,EAC9B,iBAAiB,EACjB,cAAc,EACd,eAAe,EACf,eAAe,EACf,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,GAClB,MAAM,2BAA2B,CAAC;AACnC,OAAO,EAAE,YAAY,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAEtF;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;IACrB,OAAO,CAAC,MAAM,CAAC;;;;;kBAKD,uBAAuB;qBACpB,kBAAkB;aAC1B,uBAAuB;;;;;YAKxB,iBAAiB,IAAI,eAAe,MAAM,iBAAiB,IAAI,cAAc;;;;;;;;;kBASvE,4BAA4B;aACjC,4BAA4B;;;;wBAIjB,+BAA+B;aAC1C,8BAA8B;;;;aAI9B,oCAAoC;;;UAGvC,aAAa;wBACC,8BAA8B;aACzC,8BAA8B;;;UAGjC,aAAa;UACb,aAAa;aACV,8BAA8B;;;;qBAItB,kBAAkB;yBACd,iBAAiB;;;;;;;;;;eAU3B,YAAY;eACZ,YAAY;eACZ,YAAY;eACZ,YAAY;;;;;aAKd,uBAAuB;YACxB,iBAAiB,IAAI,eAAe,MAAM,iBAAiB,IAAI,cAAc;;;;;;;;;;;;;UAa/E,YAAY;;;;2BAIK,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;YA+D3B,aAAa;YACb,aAAa;YACb,aAAa;;;;CAIxB,CAAC"}
+{"version":3,"file":"menu-item.styles.js","sourceRoot":"","sources":["../../../src/menu-item/menu-item.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EACL,kBAAkB,EAClB,oCAAoC,EACpC,uBAAuB,EACvB,4BAA4B,EAC5B,+BAA+B,EAC/B,8BAA8B,EAC9B,uBAAuB,EACvB,4BAA4B,EAC5B,8BAA8B,EAC9B,uBAAuB,EACvB,8BAA8B,EAC9B,iBAAiB,EACjB,cAAc,EACd,eAAe,EACf,eAAe,EACf,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,GAClB,MAAM,2BAA2B,CAAC;AACnC,OAAO,EAAE,YAAY,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAEtF;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;IACrB,OAAO,CAAC,MAAM,CAAC;;;;;kBAKD,uBAAuB;qBACpB,kBAAkB;aAC1B,uBAAuB;;;;;YAKxB,iBAAiB,IAAI,eAAe,MAAM,iBAAiB,IAAI,cAAc;;;;;;;;;kBASvE,4BAA4B;aACjC,4BAA4B;;;;wBAIjB,+BAA+B;aAC1C,8BAA8B;;;;aAI9B,oCAAoC;;;UAGvC,aAAa;wBACC,8BAA8B;aACzC,8BAA8B;;;UAGjC,aAAa;UACb,aAAa;aACV,8BAA8B;;;;qBAItB,kBAAkB;yBACd,iBAAiB;;;;;;;;;;eAU3B,YAAY;eACZ,YAAY;eACZ,YAAY;eACZ,YAAY;;;;;aAKd,uBAAuB;YACxB,iBAAiB,IAAI,eAAe,MAAM,iBAAiB,IAAI,cAAc;;;;;;;;;;;;;UAa/E,YAAY;;;;2BAIK,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;YA6D3B,aAAa;YACb,aAAa;YACb,aAAa;;;;CAIxB,CAAC"}

package/dist/esm/tablist/tablist.styles.css

@@ -169,7 +169,7 @@
       content: '';
       inline-size: 100%;
       inset: auto auto anchor(end) anchor(center);
-      position: absolute;
+      position: fixed;
       position-anchor: --tab;
       transform: translateX(-50%);
       transition-property: inset-inline, width;

package/dist/esm/tablist/tablist.styles.js

@@ -175,7 +175,7 @@ export const styles = css `
       content: '';
       inline-size: 100%;
       inset: auto auto anchor(end) anchor(center);
-      position: absolute;
+      position: fixed;
       position-anchor: --tab;
       transform: translateX(-50%);
       transition-property: inset-inline, width;

package/dist/esm/tooltip/tooltip.js

@@ -208,7 +208,7 @@ export class Tooltip extends FASTElement {
       #${this.id} {
         inset: unset;
         position-anchor: ${anchorName};
-        position: absolute;
+        position: fixed;
         ${directionCSS}
         ${alignmentCSS}
       }

package/dist/esm/tooltip/tooltip.styles.css

@@ -27,7 +27,7 @@
     padding: 4px var(--spacingHorizontalMNudge) 6px;
     position: absolute;
     position-area: var(--position-area);
-    position-try-options: var(--position-try-options);
+    position-try-fallbacks: var(--position-try-options);
     width: auto;
     z-index: 1;
   }

package/dist/esm/tooltip/tooltip.styles.js

@@ -35,7 +35,7 @@ export const styles = css `
     padding: 4px ${spacingHorizontalMNudge} 6px;
     position: absolute;
     position-area: var(--position-area);
-    position-try-options: var(--position-try-options);
+    position-try-fallbacks: var(--position-try-options);
     width: auto;
     z-index: 1;
   }

package/dist/web-components-all.js

@@ -7388,7 +7388,7 @@ __decorateClass$B([
 
 const template$w = html`<dialog class=dialog part=dialog aria-modal=${(x) => x.dialogModal} aria-describedby=${(x) => x.dialogDescribedby} aria-labelledby=${(x) => x.dialogLabelledby} aria-label=${(x) => x.dialogLabel} role=${(x) => x.dialogRole} @click=${(x, c) => x.clickHandler(c.event)} @cancel=${(x) => x.hide()} ${ref("dialog")}><slot></slot></dialog>`;
 
-const styles$w = css`@layer base{:host{--dialog-backdrop:${colorBackgroundOverlay};--dialog-starting-scale:0.85}::backdrop{background:var(--dialog-backdrop,rgba(0,0,0,0.4))}dialog{background:${colorNeutralBackground1};border-radius:${borderRadiusXLarge};border:none;box-shadow:${shadow64};color:${colorNeutralForeground1};max-height:100vh;padding:0;width:100%;max-width:600px}:host([type='non-modal']) dialog{inset:0;position:fixed;z-index:2;overflow:auto}@supports (max-height:1dvh){dialog{max-height:100dvh}}}@layer animations{@media (prefers-reduced-motion:no-preference){dialog,::backdrop{transition:display allow-discrete,opacity,overlay allow-discrete,scale;transition-duration:${durationGentle};transition-timing-function:${curveDecelerateMid};opacity:0}::backdrop{transition-timing-function:${curveLinear}}[open],[open]::backdrop{opacity:1}dialog:not([open]){scale:var(--dialog-starting-scale);transition-timing-function:${curveAccelerateMid}}}@starting-style{[open],[open]::backdrop{opacity:0}dialog{scale:var(--dialog-starting-scale)}}}@media (forced-colors:active){@layer base{dialog{border:${strokeWidthThin} solid ${colorTransparentStroke}}}}`;
+const styles$w = css`@layer base{:host{--dialog-backdrop:${colorBackgroundOverlay};--dialog-starting-scale:0.85}::backdrop{background:var(--dialog-backdrop,rgba(0,0,0,0.4))}dialog{background:${colorNeutralBackground1};border-radius:${borderRadiusXLarge};border:none;box-shadow:${shadow64};color:${colorNeutralForeground1};max-height:100vh;padding:0;width:100%;max-width:600px}:host([type='non-modal']) dialog{inset:0;z-index:2;overflow:auto}@supports (max-height:1dvh){dialog{max-height:100dvh}}}@layer animations{@media (prefers-reduced-motion:no-preference){dialog,::backdrop{transition:display allow-discrete,opacity,overlay allow-discrete,scale;transition-duration:${durationGentle};transition-timing-function:${curveDecelerateMid};opacity:0}::backdrop{transition-timing-function:${curveLinear}}[open],[open]::backdrop{opacity:1}dialog:not([open]){scale:var(--dialog-starting-scale);transition-timing-function:${curveAccelerateMid}}}@starting-style{[open],[open]::backdrop{opacity:0}dialog{scale:var(--dialog-starting-scale)}}}@media (forced-colors:active){@layer base{dialog{border:${strokeWidthThin} solid ${colorTransparentStroke}}}}`;
 
 const definition$w = Dialog.compose({
   name: tagName$w,
@@ -8731,7 +8731,7 @@ __decorateClass$w([
   attr
 ], Dropdown.prototype, "size", 2);
 
-const styles$r = css`${display("inline-flex")} :host{anchor-name:--dropdown-trigger;box-sizing:border-box;color:${colorNeutralForeground1};cursor:pointer}:host(${placeholderShownState}){color:${colorNeutralForeground4}}.control{appearance:none;background-color:${colorNeutralBackground1};border-radius:${borderRadiusMedium};border:${strokeWidthThin} solid ${colorTransparentStroke};box-shadow:inset 0 0 0 ${strokeWidthThin} var(--control-border-color);box-sizing:border-box;color:inherit;column-gap:${spacingHorizontalXXS};display:inline-flex;justify-content:space-between;min-width:160px;overflow:hidden;padding:${spacingVerticalSNudge} ${spacingHorizontalMNudge};white-space:normal;position:relative;text-align:start;width:100%;z-index:1;${typographyBody1Styles}}:host([size='small']) .control{column-gap:${spacingHorizontalXXS};padding:${spacingVerticalXS} ${spacingHorizontalSNudge};${typographyCaption1Styles}}:host([size='large']) .control{column-gap:${spacingHorizontalS};padding:${spacingVerticalS} ${spacingHorizontalM};${typographyBody2Styles}}::slotted(:is(input,button)){all:unset;flex:1 1 auto}::slotted(button){cursor:pointer}::slotted(input){cursor:text}:where(slot[name='indicator']>*,::slotted([slot='indicator'])){all:unset;align-items:center;appearance:none;aspect-ratio:1;color:${colorNeutralForeground3};display:inline-flex;justify-content:center;width:20px}:host([size='small']) :where(slot[name='indicator']>*,::slotted([slot='indicator'])){width:16px}:host([size='large']) :where(slot[name='indicator']>*,::slotted([slot='indicator'])){width:24px}.control::after,.control::before{content:''/'';inset:auto 0 0;pointer-events:none;position:absolute}.control::before{height:${strokeWidthThin}}.control::after{background-color:${colorCompoundBrandStroke};height:${strokeWidthThick};scale:0 1;transition:scale ${durationUltraFast} ${curveDecelerateMid}}:host(:where(:focus-within)) .control{border-radius:${borderRadiusMedium};box-shadow:inset 0 0 0 1px ${colorStrokeFocus1};outline:${strokeWidthThick} solid ${colorStrokeFocus2}}:host(:where(${openState},:focus-within)) .control::after{scale:1 1;transition-duration:${durationNormal};transition-timing-function:${curveAccelerateMid}}:host(:where([appearance='outline'],[appearance='transparent'])) .control::before{background-color:${colorNeutralStrokeAccessible}}:host([appearance='transparent']) .control{--control-border-color:${colorTransparentStrokeInteractive};background-color:${colorTransparentBackground};border-radius:${borderRadiusNone}}:host([appearance='outline']) .control{--control-border-color:${colorNeutralStroke1}}:host([appearance='outline']) .control:hover{--control-border-color:${colorNeutralStroke1Hover}}:host(:where([appearance='outline'],[appearance='transparent'])) .control:hover::before{background-color:${colorNeutralStrokeAccessibleHover}}:host([appearance='outline']) .control:hover::after{background-color:${colorCompoundBrandBackgroundHover}}:host([appearance='outline']) .control:active{--control-border-color:${colorNeutralStroke1Pressed}}:host(:where([appearance='outline'],[appearance='transparent'])) .control:active::before{background-color:${colorNeutralStrokeAccessiblePressed}}:host(:where([appearance='outline'],[appearance='transparent'])) .control:active::after{background-color:${colorCompoundBrandBackgroundPressed}}:host([appearance='filled-darker']) .control{background-color:${colorNeutralBackground3}}:host(:where([appearance='filled-lighter'],[appearance='filled-darker'])) .control{--control-border-color:${colorTransparentStroke}}:host(:disabled),:host(:disabled) ::slotted(:where(button,input)){cursor:not-allowed}:host(:disabled) .control::before,:host(:disabled) .control::after{content:none}:host(:disabled) .control:is(*,:active,:hover),:host(:disabled) :where(slot[name='indicator']>*,::slotted([slot='indicator'])){--control-border-color:${colorNeutralStrokeDisabled};background-color:${colorNeutralBackgroundDisabled};color:${colorNeutralForegroundDisabled}}::slotted(:not([slot]):not([popover])),::slotted([popover]:not(:popover-open)){display:none}@supports not (anchor-name:--anchor){:host{--listbox-max-height:50vh;--margin-offset:calc(${lineHeightBase300} + (${spacingVerticalSNudge} * 2) + ${strokeWidthThin})}:host([size='small']){--margin-offset:calc(${lineHeightBase200} + (${spacingVerticalXS} * 2) + ${strokeWidthThin})}:host([size='large']){--margin-offset:calc(${lineHeightBase400} + (${spacingVerticalS} * 2) + ${strokeWidthThin})}}@media (forced-colors:active){:host(:disabled) .control{border-color:GrayText}:host(:disabled) :where(slot[name='indicator']>*,::slotted([slot='indicator'])){color:GrayText}`;
+const styles$r = css`${display("inline-flex")} :host{box-sizing:border-box;color:${colorNeutralForeground1};cursor:pointer}:host(${placeholderShownState}){color:${colorNeutralForeground4}}.control{appearance:none;background-color:${colorNeutralBackground1};border-radius:${borderRadiusMedium};border:${strokeWidthThin} solid ${colorTransparentStroke};box-shadow:inset 0 0 0 ${strokeWidthThin} var(--control-border-color);box-sizing:border-box;color:inherit;column-gap:${spacingHorizontalXXS};display:inline-flex;justify-content:space-between;min-width:160px;overflow:hidden;padding:${spacingVerticalSNudge} ${spacingHorizontalMNudge};white-space:normal;position:relative;text-align:start;width:100%;z-index:1;${typographyBody1Styles}}:host([size='small']) .control{column-gap:${spacingHorizontalXXS};padding:${spacingVerticalXS} ${spacingHorizontalSNudge};${typographyCaption1Styles}}:host([size='large']) .control{column-gap:${spacingHorizontalS};padding:${spacingVerticalS} ${spacingHorizontalM};${typographyBody2Styles}}::slotted(:is(input,button)){all:unset;flex:1 1 auto}::slotted(button){cursor:pointer}::slotted(input){cursor:text}:where(slot[name='indicator']>*,::slotted([slot='indicator'])){all:unset;align-items:center;appearance:none;aspect-ratio:1;color:${colorNeutralForeground3};display:inline-flex;justify-content:center;width:20px}:host([size='small']) :where(slot[name='indicator']>*,::slotted([slot='indicator'])){width:16px}:host([size='large']) :where(slot[name='indicator']>*,::slotted([slot='indicator'])){width:24px}.control::after,.control::before{content:''/'';inset:auto 0 0;pointer-events:none;position:absolute}.control::before{height:${strokeWidthThin}}.control::after{background-color:${colorCompoundBrandStroke};height:${strokeWidthThick};scale:0 1;transition:scale ${durationUltraFast} ${curveDecelerateMid}}:host(:where(:focus-within)) .control{border-radius:${borderRadiusMedium};box-shadow:inset 0 0 0 1px ${colorStrokeFocus1};outline:${strokeWidthThick} solid ${colorStrokeFocus2}}:host(:where(${openState},:focus-within)) .control::after{scale:1 1;transition-duration:${durationNormal};transition-timing-function:${curveAccelerateMid}}:host(:where([appearance='outline'],[appearance='transparent'])) .control::before{background-color:${colorNeutralStrokeAccessible}}:host([appearance='transparent']) .control{--control-border-color:${colorTransparentStrokeInteractive};background-color:${colorTransparentBackground};border-radius:${borderRadiusNone}}:host([appearance='outline']) .control{--control-border-color:${colorNeutralStroke1}}:host([appearance='outline']) .control:hover{--control-border-color:${colorNeutralStroke1Hover}}:host(:where([appearance='outline'],[appearance='transparent'])) .control:hover::before{background-color:${colorNeutralStrokeAccessibleHover}}:host([appearance='outline']) .control:hover::after{background-color:${colorCompoundBrandBackgroundHover}}:host([appearance='outline']) .control:active{--control-border-color:${colorNeutralStroke1Pressed}}:host(:where([appearance='outline'],[appearance='transparent'])) .control:active::before{background-color:${colorNeutralStrokeAccessiblePressed}}:host(:where([appearance='outline'],[appearance='transparent'])) .control:active::after{background-color:${colorCompoundBrandBackgroundPressed}}:host([appearance='filled-darker']) .control{background-color:${colorNeutralBackground3}}:host(:where([appearance='filled-lighter'],[appearance='filled-darker'])) .control{--control-border-color:${colorTransparentStroke}}:host(:disabled),:host(:disabled) ::slotted(:where(button,input)){cursor:not-allowed}:host(:disabled) .control::before,:host(:disabled) .control::after{content:none}:host(:disabled) .control:is(*,:active,:hover),:host(:disabled) :where(slot[name='indicator']>*,::slotted([slot='indicator'])){--control-border-color:${colorNeutralStrokeDisabled};background-color:${colorNeutralBackgroundDisabled};color:${colorNeutralForegroundDisabled}}::slotted(:not([slot]):not([popover])),::slotted([popover]:not(:popover-open)){display:none}@supports not (anchor-name:--anchor){:host{--listbox-max-height:50vh;--margin-offset:calc(${lineHeightBase300} + (${spacingVerticalSNudge} * 2) + ${strokeWidthThin})}:host([size='small']){--margin-offset:calc(${lineHeightBase200} + (${spacingVerticalXS} * 2) + ${strokeWidthThin})}:host([size='large']){--margin-offset:calc(${lineHeightBase400} + (${spacingVerticalS} * 2) + ${strokeWidthThin})}}@media (forced-colors:active){:host(:disabled) .control{border-color:GrayText}:host(:disabled) :where(slot[name='indicator']>*,::slotted([slot='indicator'])){color:GrayText}`;
 
 const definition$r = Dropdown.compose({
   name: tagName$r,
@@ -9334,7 +9334,7 @@ __decorateClass$q([
   observable
 ], Listbox.prototype, "dropdown", 2);
 
-const styles$m = css`${display("inline-flex")} :host{background-color:${colorNeutralBackground1};border-radius:${borderRadiusMedium};border:${strokeWidthThin} solid ${colorTransparentStroke};box-shadow:${shadow16};box-sizing:border-box;flex-direction:column;margin:0;min-width:160px;padding:${spacingHorizontalXS};row-gap:${spacingHorizontalXXS};width:auto}:host([popover]){inset:unset;overflow:auto}@supports (anchor-name:--anchor){:host([popover]){position:absolute;margin-block-start:0;max-height:var(--listbox-max-height,calc(50vh - anchor-size(self-block)));min-width:anchor-size(width);position-anchor:--dropdown;position-area:block-end span-inline-end;position-try-fallbacks:flip-inline,flip-block,--flip-block,block-start}@position-try --flip-block{bottom:anchor(top);top:unset}}@supports not (anchor-name:--anchor){:host([popover]){margin-block-start:var(--margin-offset,0);max-height:var(--listbox-max-height,50vh);position:fixed}:host([popover]${flipBlockState}){margin-block-start:revert;translate:0 -100%}}`;
+const styles$m = css`${display("inline-flex")} :host{background-color:${colorNeutralBackground1};border-radius:${borderRadiusMedium};border:${strokeWidthThin} solid ${colorTransparentStroke};box-shadow:${shadow16};box-sizing:border-box;flex-direction:column;margin:0;min-inline-size:160px;padding:${spacingHorizontalXS};row-gap:${spacingHorizontalXXS};width:auto}:host([popover]){inset:unset;overflow:auto}@supports (anchor-name:--anchor){:host([popover]){position:fixed;max-block-size:var(--listbox-max-height,calc(50vh - anchor-size(self-block)));min-inline-size:anchor-size(inline);inset-block-start:anchor(end);inset-inline-start:anchor(start);position-try-fallbacks:flip-block,flip-inline,flip-inline flip-block}}@supports not (anchor-name:--anchor){:host([popover]){margin-block-start:var(--margin-offset,0);max-block-size:var(--listbox-max-height,50vh);position:absolute}:host([popover]${flipBlockState}){margin-block-start:revert;translate:0 -100%}}`;
 
 function listboxTemplate() {
   return html`<template @beforetoggle=${(x, c) => x.beforetoggleHandler(c.event)} @click=${(x, c) => x.clickHandler(c.event)}><slot ${ref("defaultSlot")} @slotchange=${(x, c) => x.slotchangeHandler(c.event)}></slot></template>`;
@@ -9627,7 +9627,7 @@ __decorateClass$p([
 ], MenuItem.prototype, "submenu", 2);
 applyMixins(MenuItem, StartEnd);
 
-const styles$k = css`${display("grid")} :host{--indent:0;align-items:center;background:${colorNeutralBackground1};border-radius:${borderRadiusMedium};color:${colorNeutralForeground2};contain:layout;cursor:pointer;flex-shrink:0;font:${fontWeightRegular} ${fontSizeBase300}/${lineHeightBase300} ${fontFamilyBase};grid-gap:4px;grid-template-columns:20px 20px auto 20px;height:32px;overflow:visible;padding:0 10px}:host(:hover){background:${colorNeutralBackground1Hover};color:${colorNeutralForeground2Hover}}:host(:active){background-color:${colorNeutralBackground1Selected};color:${colorNeutralForeground2Pressed}}:host(:active) ::slotted([slot='start']){color:${colorCompoundBrandForeground1Pressed}}:host(${disabledState}){background-color:${colorNeutralBackgroundDisabled};color:${colorNeutralForegroundDisabled}}:host(${disabledState}) ::slotted([slot='start']),:host(${disabledState}) ::slotted([slot='end']){color:${colorNeutralForegroundDisabled}}:host(:focus-visible){border-radius:${borderRadiusMedium};outline:2px solid ${colorStrokeFocus2}}.content{white-space:nowrap;flex-grow:1;grid-column:auto/span 2;padding:0 2px}:host(:not(${checkedState})) .indicator,:host(:not(${checkedState})) ::slotted([slot='indicator']),:host(:not(${submenuState})) .submenu-glyph,:host(:not(${submenuState})) ::slotted([slot='submenu-glyph']){display:none}::slotted([slot='end']){color:${colorNeutralForeground3};font:${fontWeightRegular} ${fontSizeBase200}/${lineHeightBase200} ${fontFamilyBase};white-space:nowrap}:host([data-indent='1']){--indent:1}:host([data-indent='2']){--indent:2;grid-template-columns:20px 20px auto auto}:host(${submenuState}){grid-template-columns:20px auto auto 20px}:host([data-indent='2']${submenuState}){grid-template-columns:20px 20px auto auto 20px}.indicator,::slotted([slot='indicator']){grid-column:1/span 1;width:20px}::slotted([slot='start']){display:inline-flex;grid-column:calc(var(--indent))/span 1}.content{grid-column:calc(var(--indent) + 1)/span 1}::slotted([slot='end']){grid-column:calc(var(--indent) + 2)/span 1;justify-self:end}.submenu-glyph,::slotted([slot='submenu-glyph']){grid-column:-2/span 1;justify-self:end}@layer popover{:host{anchor-name:--menu-trigger;position:relative}::slotted([popover]){margin:0;max-height:var(--menu-max-height,auto);position:absolute;position-anchor:--menu-trigger;position-area:inline-end span-block-end;position-try-fallbacks:flip-inline,block-start,block-end;z-index:1}::slotted([popover]:not(:popover-open)){display:none}::slotted([popover]:popover-open){inset:unset}@supports not (anchor-name:--menu-trigger){::slotted([popover]){align-self:start}}}@media (forced-colors:active){:host(${disabledState}),:host(${disabledState}) ::slotted([slot='start']),:host(${disabledState}) ::slotted([slot='end']){color:GrayText}}`;
+const styles$k = css`${display("grid")} :host{--indent:0;align-items:center;background:${colorNeutralBackground1};border-radius:${borderRadiusMedium};color:${colorNeutralForeground2};contain:layout;cursor:pointer;flex-shrink:0;font:${fontWeightRegular} ${fontSizeBase300}/${lineHeightBase300} ${fontFamilyBase};grid-gap:4px;grid-template-columns:20px 20px auto 20px;height:32px;overflow:visible;padding:0 10px}:host(:hover){background:${colorNeutralBackground1Hover};color:${colorNeutralForeground2Hover}}:host(:active){background-color:${colorNeutralBackground1Selected};color:${colorNeutralForeground2Pressed}}:host(:active) ::slotted([slot='start']){color:${colorCompoundBrandForeground1Pressed}}:host(${disabledState}){background-color:${colorNeutralBackgroundDisabled};color:${colorNeutralForegroundDisabled}}:host(${disabledState}) ::slotted([slot='start']),:host(${disabledState}) ::slotted([slot='end']){color:${colorNeutralForegroundDisabled}}:host(:focus-visible){border-radius:${borderRadiusMedium};outline:2px solid ${colorStrokeFocus2}}.content{white-space:nowrap;flex-grow:1;grid-column:auto/span 2;padding:0 2px}:host(:not(${checkedState})) .indicator,:host(:not(${checkedState})) ::slotted([slot='indicator']),:host(:not(${submenuState})) .submenu-glyph,:host(:not(${submenuState})) ::slotted([slot='submenu-glyph']){display:none}::slotted([slot='end']){color:${colorNeutralForeground3};font:${fontWeightRegular} ${fontSizeBase200}/${lineHeightBase200} ${fontFamilyBase};white-space:nowrap}:host([data-indent='1']){--indent:1}:host([data-indent='2']){--indent:2;grid-template-columns:20px 20px auto auto}:host(${submenuState}){grid-template-columns:20px auto auto 20px}:host([data-indent='2']${submenuState}){grid-template-columns:20px 20px auto auto 20px}.indicator,::slotted([slot='indicator']){grid-column:1/span 1;width:20px}::slotted([slot='start']){display:inline-flex;grid-column:calc(var(--indent))/span 1}.content{grid-column:calc(var(--indent) + 1)/span 1}::slotted([slot='end']){grid-column:calc(var(--indent) + 2)/span 1;justify-self:end}.submenu-glyph,::slotted([slot='submenu-glyph']){grid-column:-2/span 1;justify-self:end}@layer popover{:host{anchor-name:--menu-trigger;position:relative}::slotted([popover]){margin:0;max-height:var(--menu-max-height,auto);position:fixed;position-anchor:--menu-trigger;inset:unset;inset-block-start:anchor(start);inset-inline-start:anchor(end);position-try-fallbacks:flip-inline,block-start,block-end;z-index:1}::slotted([popover]:not(:popover-open)){display:none}@supports not (anchor-name:--menu-trigger){::slotted([popover]){align-self:start}}}@media (forced-colors:active){:host(${disabledState}),:host(${disabledState}) ::slotted([slot='start']),:host(${disabledState}) ::slotted([slot='end']){color:GrayText}}`;
 
 const Checkmark16Filled = html.partial(
   `<svg class=indicator fill=currentColor aria-hidden=true width=16 height=16 viewBox="0 0 16 16" xmlns=http://www.w3.org/2000/svg><path d="M14.05 3.49c.28.3.27.77-.04 1.06l-7.93 7.47A.85.85 0 014.9 12L2.22 9.28a.75.75 0 111.06-1.06l2.24 2.27 7.47-7.04a.75.75 0 011.06.04z" fill=currentColor></path></svg>`
@@ -10627,7 +10627,7 @@ __decorateClass$n([
   observable
 ], Menu.prototype, "primaryAction", 2);
 
-const styles$i = css`${display("inline-block")} ::slotted([slot='trigger']){anchor-name:--menu-trigger}::slotted([popover]){margin:0;max-height:var(--menu-max-height,auto);position-anchor:--menu-trigger;position-area:block-end span-inline-end;position-try-fallbacks:flip-block;position:absolute;z-index:1}:host([split]) ::slotted([popover]){position-area:block-end span-inline-start}::slotted([popover]:popover-open){inset:unset}::slotted([popover]:not(:popover-open)){display:none}:host([split]){display:inline-flex}:host([split]) ::slotted([slot='primary-action']){border-inline-end:${strokeWidthThin} solid ${colorNeutralStroke1};border-start-end-radius:0;border-end-end-radius:0}:host([split]) ::slotted([slot='primary-action']:focus-visible){z-index:1}:host([split]) ::slotted([slot='primary-action'][appearance='primary']){border-inline-end:${strokeWidthThin} solid white}:host([split]) ::slotted([slot='trigger']){border-inline-start:0;border-start-start-radius:0;border-end-start-radius:0}`;
+const styles$i = css`${display("inline-block")} ::slotted([slot='trigger']){anchor-name:--menu-trigger}::slotted([popover]){margin:0;max-height:var(--menu-max-height,auto);position-anchor:--menu-trigger;inset:unset;inset-block-start:anchor(end);inset-inline-start:anchor(start);position-try-fallbacks:flip-block;position:fixed;z-index:1}:host([split]) ::slotted([popover]){inset-inline-start:auto;inset-inline-end:anchor(end)}::slotted([popover]:not(:popover-open)){display:none}:host([split]){display:inline-flex}:host([split]) ::slotted([slot='primary-action']){border-inline-end:${strokeWidthThin} solid ${colorNeutralStroke1};border-start-end-radius:0;border-end-end-radius:0}:host([split]) ::slotted([slot='primary-action']:focus-visible){z-index:1}:host([split]) ::slotted([slot='primary-action'][appearance='primary']){border-inline-end:${strokeWidthThin} solid white}:host([split]) ::slotted([slot='trigger']){border-inline-start:0;border-start-start-radius:0;border-end-start-radius:0}`;
 
 function menuTemplate() {
   return html`<template @keydown=${(x, c) => x.menuKeydownHandler(c.event)}><slot name=primary-action ${ref("primaryAction")}></slot><slot name=trigger ${slotted({ property: "slottedTriggers", filter: elements() })}></slot><slot ${slotted({ property: "slottedMenuList", filter: elements() })}></slot></template>`;
@@ -12936,7 +12936,7 @@ __decorateClass$b([
 
 const template$7 = html`<template role=tablist focusgroup="tablist inline block" @focusin=${(x, c) => x.handleFocusIn(c.event)}><slot name=tab ${slotted("slottedTabs")}></slot></template>`;
 
-const styles$7 = css`${display("flex")} :host{--tabPaddingInline:${spacingHorizontalMNudge};--tabPaddingBlock:${spacingHorizontalM};--tabIndicatorInsetInline:var(--tabPaddingInline);--tabIndicatorInsetBlock:0;box-sizing:border-box;color:${colorNeutralForeground2};flex-direction:row;position:relative}:host([size='small']){--tabPaddingBlock:${spacingVerticalSNudge};--tabPaddingInline:${spacingHorizontalSNudge}}:host([size='large']){--tabPaddingBlock:${spacingVerticalL};--tabPaddingInline:${spacingHorizontalMNudge}}:host([orientation='vertical']){--tabPaddingBlock:${spacingVerticalS};--tabIndicatorInsetBlock:${spacingVerticalS};flex-direction:column}:host([orientation='vertical'][size='small']){--tabPaddingBlock:${spacingVerticalXXS};--tabIndicatorInsetBlock:${spacingVerticalSNudge}}:host([orientation='vertical'][size='large']){--tabPaddingBlock:${spacingVerticalS};--tabIndicatorInsetBlock:${spacingVerticalMNudge}}::slotted([slot='tab']){padding-inline:var(--tabPaddingInline);padding-block:var(--tabPaddingBlock)}:host([orientation='vertical']) ::slotted([role='tab']){justify-content:flex-start}:host ::slotted([slot='tab'])::after{height:${strokeWidthThicker};margin-block-start:auto}:host([orientation='vertical']) ::slotted([slot='tab'])::after{width:${strokeWidthThicker};height:unset;margin-block-start:unset}:host ::slotted([slot='tab'])::before{height:${strokeWidthThicker};border-radius:${borderRadiusCircular};content:'';inset-inline:var(--tabIndicatorInsetInline);inset-block:var(--tabIndicatorInsetBlock);position:absolute;margin-top:auto}:host ::slotted([slot='tab'])::before{inset-inline:var(--tabIndicatorInsetInline);inset-block:var(--tabIndicatorInsetBlock)}:host ::slotted([slot='tab'][aria-selected='true'])::before{background-color:${colorNeutralForegroundDisabled}}:host ::slotted([slot='tab'][aria-selected='false']:hover)::after{height:${strokeWidthThicker};margin-block-start:auto;transform-origin:left}:host([orientation='vertical']) ::slotted([slot='tab'])::before,:host([orientation='vertical']) ::slotted([slot='tab'][aria-selected='false']:hover)::after{height:unset;width:${strokeWidthThicker};margin-inline-end:auto;transform-origin:top}:host([size='small']) ::slotted([slot='tab']){font-size:${fontSizeBase300};line-height:${lineHeightBase300}}:host([size='large']) ::slotted([slot='tab']){font-size:${fontSizeBase400};line-height:${lineHeightBase400}}:host ::slotted([slot='tab'])::after,:host ::slotted([slot='tab'])::before,:host ::slotted([slot='tab']:hover)::after{inset-inline:var(--tabIndicatorInsetInline)}:host([orientation='vertical']) ::slotted([slot='tab'])::after,:host([orientation='vertical']) ::slotted([slot='tab'])::before,:host([orientation='vertical']) ::slotted([slot='tab']:hover)::after{inset-inline:0;inset-block:var(--tabIndicatorInsetBlock)}:host([disabled]){cursor:not-allowed;color:${colorNeutralForegroundDisabled}}:host([disabled]) ::slotted([slot='tab']){pointer-events:none;cursor:not-allowed;color:${colorNeutralForegroundDisabled}}:host([disabled]) ::slotted([slot='tab']:after){background-color:${colorNeutralForegroundDisabled}}:host([disabled]) ::slotted([slot='tab'][aria-selected='true'])::after{background-color:${colorNeutralForegroundDisabled}}:host([disabled]) ::slotted([slot='tab']:hover):before{content:unset}:host([appearance='subtle']) ::slotted([slot='tab']:hover){background-color:${colorSubtleBackgroundHover};color:${colorNeutralForeground1Hover};fill:${colorCompoundBrandForeground1Hover}}:host([appearance='subtle']) ::slotted([slot='tab']:active){background-color:${colorSubtleBackgroundPressed};fill:${colorSubtleBackgroundPressed};color:${colorNeutralForeground1}}@supports (anchor-name:--a) and (text-size-adjust:auto){::slotted([slot='tab'][aria-selected='true']){anchor-name:--tab}:host::after{background-color:${colorCompoundBrandStroke};content:'';inline-size:100%;inset:auto auto anchor(end) anchor(center);position:absolute;position-anchor:--tab;transform:translateX(-50%);transition-property:inset-inline,width;transition-duration:${durationSlow};transition-timing-function:${curveDecelerateMax};z-index:3;border-radius:${borderRadiusCircular};width:calc(anchor-size() - var(--tabIndicatorInsetInline) * 2);height:${strokeWidthThicker}}:host([orientation='vertical'])::after{inset:anchor(center) anchor(end) auto 0;transform:translateY(-50%);transition-property:inset-block,height;width:${strokeWidthThicker};height:calc(anchor-size() - var(--tabIndicatorInsetBlock) * 2)}:host(:dir(rtl)[orientation='vertical'])::after{inset:anchor(center) anchor(start) auto 0}:host([disabled])::after{background-color:${colorNeutralForegroundDisabled}}}`;
+const styles$7 = css`${display("flex")} :host{--tabPaddingInline:${spacingHorizontalMNudge};--tabPaddingBlock:${spacingHorizontalM};--tabIndicatorInsetInline:var(--tabPaddingInline);--tabIndicatorInsetBlock:0;box-sizing:border-box;color:${colorNeutralForeground2};flex-direction:row;position:relative}:host([size='small']){--tabPaddingBlock:${spacingVerticalSNudge};--tabPaddingInline:${spacingHorizontalSNudge}}:host([size='large']){--tabPaddingBlock:${spacingVerticalL};--tabPaddingInline:${spacingHorizontalMNudge}}:host([orientation='vertical']){--tabPaddingBlock:${spacingVerticalS};--tabIndicatorInsetBlock:${spacingVerticalS};flex-direction:column}:host([orientation='vertical'][size='small']){--tabPaddingBlock:${spacingVerticalXXS};--tabIndicatorInsetBlock:${spacingVerticalSNudge}}:host([orientation='vertical'][size='large']){--tabPaddingBlock:${spacingVerticalS};--tabIndicatorInsetBlock:${spacingVerticalMNudge}}::slotted([slot='tab']){padding-inline:var(--tabPaddingInline);padding-block:var(--tabPaddingBlock)}:host([orientation='vertical']) ::slotted([role='tab']){justify-content:flex-start}:host ::slotted([slot='tab'])::after{height:${strokeWidthThicker};margin-block-start:auto}:host([orientation='vertical']) ::slotted([slot='tab'])::after{width:${strokeWidthThicker};height:unset;margin-block-start:unset}:host ::slotted([slot='tab'])::before{height:${strokeWidthThicker};border-radius:${borderRadiusCircular};content:'';inset-inline:var(--tabIndicatorInsetInline);inset-block:var(--tabIndicatorInsetBlock);position:absolute;margin-top:auto}:host ::slotted([slot='tab'])::before{inset-inline:var(--tabIndicatorInsetInline);inset-block:var(--tabIndicatorInsetBlock)}:host ::slotted([slot='tab'][aria-selected='true'])::before{background-color:${colorNeutralForegroundDisabled}}:host ::slotted([slot='tab'][aria-selected='false']:hover)::after{height:${strokeWidthThicker};margin-block-start:auto;transform-origin:left}:host([orientation='vertical']) ::slotted([slot='tab'])::before,:host([orientation='vertical']) ::slotted([slot='tab'][aria-selected='false']:hover)::after{height:unset;width:${strokeWidthThicker};margin-inline-end:auto;transform-origin:top}:host([size='small']) ::slotted([slot='tab']){font-size:${fontSizeBase300};line-height:${lineHeightBase300}}:host([size='large']) ::slotted([slot='tab']){font-size:${fontSizeBase400};line-height:${lineHeightBase400}}:host ::slotted([slot='tab'])::after,:host ::slotted([slot='tab'])::before,:host ::slotted([slot='tab']:hover)::after{inset-inline:var(--tabIndicatorInsetInline)}:host([orientation='vertical']) ::slotted([slot='tab'])::after,:host([orientation='vertical']) ::slotted([slot='tab'])::before,:host([orientation='vertical']) ::slotted([slot='tab']:hover)::after{inset-inline:0;inset-block:var(--tabIndicatorInsetBlock)}:host([disabled]){cursor:not-allowed;color:${colorNeutralForegroundDisabled}}:host([disabled]) ::slotted([slot='tab']){pointer-events:none;cursor:not-allowed;color:${colorNeutralForegroundDisabled}}:host([disabled]) ::slotted([slot='tab']:after){background-color:${colorNeutralForegroundDisabled}}:host([disabled]) ::slotted([slot='tab'][aria-selected='true'])::after{background-color:${colorNeutralForegroundDisabled}}:host([disabled]) ::slotted([slot='tab']:hover):before{content:unset}:host([appearance='subtle']) ::slotted([slot='tab']:hover){background-color:${colorSubtleBackgroundHover};color:${colorNeutralForeground1Hover};fill:${colorCompoundBrandForeground1Hover}}:host([appearance='subtle']) ::slotted([slot='tab']:active){background-color:${colorSubtleBackgroundPressed};fill:${colorSubtleBackgroundPressed};color:${colorNeutralForeground1}}@supports (anchor-name:--a) and (text-size-adjust:auto){::slotted([slot='tab'][aria-selected='true']){anchor-name:--tab}:host::after{background-color:${colorCompoundBrandStroke};content:'';inline-size:100%;inset:auto auto anchor(end) anchor(center);position:fixed;position-anchor:--tab;transform:translateX(-50%);transition-property:inset-inline,width;transition-duration:${durationSlow};transition-timing-function:${curveDecelerateMax};z-index:3;border-radius:${borderRadiusCircular};width:calc(anchor-size() - var(--tabIndicatorInsetInline) * 2);height:${strokeWidthThicker}}:host([orientation='vertical'])::after{inset:anchor(center) anchor(end) auto 0;transform:translateY(-50%);transition-property:inset-block,height;width:${strokeWidthThicker};height:calc(anchor-size() - var(--tabIndicatorInsetBlock) * 2)}:host(:dir(rtl)[orientation='vertical'])::after{inset:anchor(center) anchor(start) auto 0}:host([disabled])::after{background-color:${colorNeutralForegroundDisabled}}}`;
 
 const definition$7 = Tablist.compose({
   name: tagName$7,
@@ -14364,7 +14364,7 @@ class Tooltip extends FASTElement {
       #${this.id} {
         inset: unset;
         position-anchor: ${anchorName};
-        position: absolute;
+        position: fixed;
         ${directionCSS}
         ${alignmentCSS}
       }
@@ -14388,7 +14388,7 @@ __decorateClass$4([
   attr
 ], Tooltip.prototype, "anchor", 2);
 
-const styles$2 = css`${display("inline-flex")} :host(:not(:popover-open)){display:none}:host{--position-area:block-start;--position-try-options:flip-block;--block-offset:${spacingVerticalXS};--inline-offset:${spacingHorizontalXS};background:${colorNeutralBackground1};border-radius:${borderRadiusMedium};border:1px solid ${colorTransparentStroke};box-sizing:border-box;color:${colorNeutralForeground1};display:inline-flex;filter:drop-shadow(0 0 2px ${colorNeutralShadowAmbient}) drop-shadow(0 4px 8px ${colorNeutralShadowKey});font-family:${fontFamilyBase};font-size:${fontSizeBase200};inset:unset;line-height:${lineHeightBase200};margin:unset;max-width:240px;overflow:visible;padding:4px ${spacingHorizontalMNudge} 6px;position:absolute;position-area:var(--position-area);position-try-options:var(--position-try-options);width:auto;z-index:1}@supports (inset-area:block-start){:host{inset-area:var(--position-area);position-try-fallbacks:var(--position-try-options)}}:host(:is([positioning^='above'],[positioning^='below'],:not([positioning]))){margin-block:var(--block-offset)}:host(:is([positioning^='before'],[positioning^='after'])){margin-inline:var(--inline-offset);--position-try-options:flip-inline}:host([positioning='above-start']){--position-area:${TooltipPositioningOption["above-start"]}}:host([positioning='above']){--position-area:${TooltipPositioningOption.above}}:host([positioning='above-end']){--position-area:${TooltipPositioningOption["above-end"]}}:host([positioning='below-start']){--position-area:${TooltipPositioningOption["below-start"]}}:host([positioning='below']){--position-area:${TooltipPositioningOption.below}}:host([positioning='below-end']){--position-area:${TooltipPositioningOption["below-end"]}}:host([positioning='before-top']){--position-area:${TooltipPositioningOption["before-top"]}}:host([positioning='before']){--position-area:${TooltipPositioningOption.before}}:host([positioning='before-bottom']){--position-area:${TooltipPositioningOption["before-bottom"]}}:host([positioning='after-top']){--position-area:${TooltipPositioningOption["after-top"]}}:host([positioning='after']){--position-area:${TooltipPositioningOption.after}}:host([positioning='after-bottom']){--position-area:${TooltipPositioningOption["after-bottom"]}}`;
+const styles$2 = css`${display("inline-flex")} :host(:not(:popover-open)){display:none}:host{--position-area:block-start;--position-try-options:flip-block;--block-offset:${spacingVerticalXS};--inline-offset:${spacingHorizontalXS};background:${colorNeutralBackground1};border-radius:${borderRadiusMedium};border:1px solid ${colorTransparentStroke};box-sizing:border-box;color:${colorNeutralForeground1};display:inline-flex;filter:drop-shadow(0 0 2px ${colorNeutralShadowAmbient}) drop-shadow(0 4px 8px ${colorNeutralShadowKey});font-family:${fontFamilyBase};font-size:${fontSizeBase200};inset:unset;line-height:${lineHeightBase200};margin:unset;max-width:240px;overflow:visible;padding:4px ${spacingHorizontalMNudge} 6px;position:absolute;position-area:var(--position-area);position-try-fallbacks:var(--position-try-options);width:auto;z-index:1}@supports (inset-area:block-start){:host{inset-area:var(--position-area);position-try-fallbacks:var(--position-try-options)}}:host(:is([positioning^='above'],[positioning^='below'],:not([positioning]))){margin-block:var(--block-offset)}:host(:is([positioning^='before'],[positioning^='after'])){margin-inline:var(--inline-offset);--position-try-options:flip-inline}:host([positioning='above-start']){--position-area:${TooltipPositioningOption["above-start"]}}:host([positioning='above']){--position-area:${TooltipPositioningOption.above}}:host([positioning='above-end']){--position-area:${TooltipPositioningOption["above-end"]}}:host([positioning='below-start']){--position-area:${TooltipPositioningOption["below-start"]}}:host([positioning='below']){--position-area:${TooltipPositioningOption.below}}:host([positioning='below-end']){--position-area:${TooltipPositioningOption["below-end"]}}:host([positioning='before-top']){--position-area:${TooltipPositioningOption["before-top"]}}:host([positioning='before']){--position-area:${TooltipPositioningOption.before}}:host([positioning='before-bottom']){--position-area:${TooltipPositioningOption["before-bottom"]}}:host([positioning='after-top']){--position-area:${TooltipPositioningOption["after-top"]}}:host([positioning='after']){--position-area:${TooltipPositioningOption.after}}:host([positioning='after-bottom']){--position-area:${TooltipPositioningOption["after-bottom"]}}`;
 
 const template$2 = html`<template popover aria-hidden=true><slot></slot></template>`;