@kushagradhawan/kookie-ui 0.3.21 → 0.3.23

package/styles.css

@@ -3548,6 +3548,9 @@
   --backdrop-blur-components: var(--blur-4);
   --backdrop-blur-panel: var(--blur-5);
   --backdrop-blur-dialog: var(--blur-6);
+  --backdrop-filter-components-enabled: blur(var(--backdrop-blur-components));
+  --backdrop-filter-panel-enabled: blur(var(--backdrop-blur-panel));
+  --backdrop-filter-dialog-enabled: blur(var(--backdrop-blur-dialog));
   --surface-opacity-light: var(--opacity-5);
   --surface-opacity-heavy: var(--opacity-6);
   --surface-opacity-dark: var(--opacity-7);
@@ -3814,9 +3817,9 @@
   --color-panel: var(--color-panel-translucent);
   --color-surface: var(--color-surface-translucent);
   --color-dialog: var(--color-dialog-translucent);
-  --backdrop-filter-panel: blur(var(--backdrop-blur-panel));
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
-  --backdrop-filter-dialog: blur(var(--backdrop-blur-dialog));
+  --backdrop-filter-panel: var(--backdrop-filter-panel-enabled);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
+  --backdrop-filter-dialog: var(--backdrop-filter-dialog-enabled);
   --material-blend: 60%;
   --material-alpha: 1;
 }
@@ -5031,6 +5034,16 @@
 }
 [data-blur='none']{
   --blur-factor: 0;
+  --backdrop-filter-components-enabled: none;
+  --backdrop-filter-panel-enabled: none;
+  --backdrop-filter-dialog-enabled: none;
+}
+@media (prefers-reduced-transparency: reduce) {
+  .radix-themes{
+    --backdrop-filter-components-enabled: none;
+    --backdrop-filter-panel-enabled: none;
+    --backdrop-filter-dialog-enabled: none;
+  }
 }
 [data-blur='small']{
   --blur-factor: 0.75;
@@ -6585,19 +6598,16 @@
   isolation: isolate;
 }
 :where([data-panel-background='translucent'],[data-material='translucent']) .rt-AccordionRoot{
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 .rt-AccordionRoot:where([data-panel-background='solid'],[data-material='solid']){
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
   --backdrop-filter-components: none;
 }
 .rt-AccordionRoot:where([data-panel-background='translucent'],[data-material='translucent']){
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 .rt-AccordionRoot:where(.rt-r-size-1){
   border-radius: var(--radius-1);
@@ -6692,24 +6702,21 @@
   background-color: color-mix(in srgb, var(--accent-a2), var(--accent-2) 60%);
   -webkit-box-shadow: inset 0 0 0 1px var(--accent-a6);
           box-shadow: inset 0 0 0 1px var(--accent-a6);
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
+  backdrop-filter: var(--backdrop-filter-components);
 }
 :where(.rt-AccordionRoot:where(.rt-variant-surface)):where([data-panel-background='solid'],[data-material='solid']){
   background-color: var(--accent-2);
   -webkit-box-shadow: inset 0 0 0 1px var(--accent-6);
           box-shadow: inset 0 0 0 1px var(--accent-6);
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
   --backdrop-filter-components: none;
 }
 :where(.rt-AccordionRoot:where(.rt-variant-surface)):where([data-panel-background='translucent'],[data-material='translucent']){
   background-color: color-mix(in srgb, var(--accent-a2), var(--accent-2) 60%);
   -webkit-box-shadow: inset 0 0 0 1px var(--accent-a6);
           box-shadow: inset 0 0 0 1px var(--accent-a6);
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 :where(.rt-AccordionRoot:where(.rt-variant-classic)){
   background-color: var(--color-surface-solid);
@@ -6720,20 +6727,17 @@
 }
 :where([data-panel-background='translucent'],[data-material='translucent']) :where(.rt-AccordionRoot:where(.rt-variant-classic)){
   background-color: var(--color-surface-translucent);
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
+  backdrop-filter: var(--backdrop-filter-components);
 }
 :where(.rt-AccordionRoot:where(.rt-variant-classic)):where([data-panel-background='solid'],[data-material='solid']){
   background-color: var(--color-surface-solid);
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
   --backdrop-filter-components: none;
 }
 :where(.rt-AccordionRoot:where(.rt-variant-classic)):where([data-panel-background='translucent'],[data-material='translucent']){
   background-color: var(--color-surface-translucent);
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 :where(.rt-AccordionRoot:where(.rt-variant-soft)){
   background-color: var(--accent-2);
@@ -6742,20 +6746,17 @@
 }
 :where([data-panel-background='translucent'],[data-material='translucent']) :where(.rt-AccordionRoot:where(.rt-variant-soft)){
   background-color: color-mix(in srgb, var(--accent-a2), var(--accent-2) 60%);
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
+  backdrop-filter: var(--backdrop-filter-components);
 }
 :where(.rt-AccordionRoot:where(.rt-variant-soft)):where([data-panel-background='solid'],[data-material='solid']){
   background-color: var(--accent-2);
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
   --backdrop-filter-components: none;
 }
 :where(.rt-AccordionRoot:where(.rt-variant-soft)):where([data-panel-background='translucent'],[data-material='translucent']){
   background-color: color-mix(in srgb, var(--accent-a2), var(--accent-2) 60%);
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 :where(.rt-AccordionRoot:where(.rt-variant-outline)){
   -webkit-box-shadow: inset 0 0 0 1px var(--accent-6);
@@ -6770,16 +6771,14 @@
 :where(.rt-AccordionRoot:where(.rt-variant-outline)):where([data-panel-background='solid'],[data-material='solid']){
   -webkit-box-shadow: inset 0 0 0 1px var(--accent-6);
           box-shadow: inset 0 0 0 1px var(--accent-6);
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
   --backdrop-filter-components: none;
 }
 :where(.rt-AccordionRoot:where(.rt-variant-outline)):where([data-panel-background='translucent'],[data-material='translucent']){
   -webkit-box-shadow: inset 0 0 0 1px var(--accent-a6);
           box-shadow: inset 0 0 0 1px var(--accent-a6);
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 :where(.rt-AccordionRoot:where(.rt-variant-ghost)){
   background-color: transparent;
@@ -7119,7 +7118,7 @@
             animation: none;
   }
 }
-@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
+@supports not (backdrop-filter: blur(1px)) {
   :where(.rt-AccordionRoot[data-material='translucent']){
     background-color: var(--accent-2);
   }
@@ -7143,8 +7142,7 @@
   }
   :where(.rt-AccordionRoot[data-material='translucent']){
     background-color: Canvas;
-    -webkit-backdrop-filter: none;
-            backdrop-filter: none;
+    backdrop-filter: none;
   }
 }
 @media (hover: hover) {
@@ -7238,15 +7236,6 @@
   position: absolute;
   inset: 0;
 }
-.rt-BaseDialogScroll--detached{
-  position: fixed;
-  inset: 0;
-  z-index: 100;
-}
-.rt-BaseDialogScroll--detached:where(:has([data-state='closed'])){
-  pointer-events: none;
-  visibility: hidden;
-}
 .rt-BaseDialogScrollPadding{
   -webkit-box-flex: 1;
       -ms-flex-positive: 1;
@@ -7304,6 +7293,7 @@
   }
 }
 .rt-BaseDialogContent{
+  --backdrop-filter-components-enabled: none;
   margin: auto;
   width: 100%;
   z-index: 1;
@@ -7323,18 +7313,15 @@
   outline: none;
 }
 :where([data-panel-background='translucent'],[data-material='translucent']) .rt-BaseDialogContent{
-  -webkit-backdrop-filter: var(--backdrop-filter-dialog);
-          backdrop-filter: var(--backdrop-filter-dialog);
+  backdrop-filter: var(--backdrop-filter-dialog);
 }
 .rt-BaseDialogContent:where([data-panel-background='solid'],[data-material='solid']){
   background-color: var(--color-dialog-solid);
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
 }
 .rt-BaseDialogContent:where([data-panel-background='translucent'],[data-material='translucent']){
   background-color: var(--color-dialog-translucent);
-  -webkit-backdrop-filter: var(--backdrop-filter-dialog);
-          backdrop-filter: var(--backdrop-filter-dialog);
+  backdrop-filter: var(--backdrop-filter-dialog);
 }
 .rt-BaseDialogContent:where(.rt-r-size-1){
   --dialog-content-padding: var(--space-5);
@@ -7466,7 +7453,7 @@
             animation: rt-dialog-content-hide var(--motion-duration-small) var(--motion-spring-snappy);
   }
 }
-@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
+@supports not (backdrop-filter: blur(1px)) {
   :where(.rt-BaseDialogContent[data-material='translucent']),
   :where(.rt-BaseDialogContent[data-panel-background='translucent']){
     background-color: var(--color-dialog-solid);
@@ -7531,19 +7518,16 @@
   isolation: isolate;
 }
 :where([data-panel-background='translucent'],[data-material='translucent']) .rt-AvatarRoot{
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 .rt-AvatarRoot:where([data-panel-background='solid'],[data-material='solid']){
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
   --backdrop-filter-components: none;
 }
 .rt-AvatarRoot:where([data-panel-background='translucent'],[data-material='translucent']){
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 .rt-AvatarRoot:where(button),
 .rt-AvatarRoot:where(a),
@@ -8436,23 +8420,20 @@
 :where([data-panel-background='translucent'],[data-material='translucent']) .rt-Badge{
   --material-blend: 60%;
   --material-alpha: 1;
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 .rt-Badge:where([data-panel-background='solid'],[data-material='solid']){
   --material-blend: 100%;
   --material-alpha: 0;
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
   --backdrop-filter-components: none;
 }
 .rt-Badge:where([data-panel-background='translucent'],[data-material='translucent']){
   --material-blend: 60%;
   --material-alpha: 1;
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 @media (prefers-reduced-motion: reduce) {
   .rt-Badge{
@@ -8905,19 +8886,16 @@
           flex-direction: row-reverse;
 }
 :where([data-panel-background='translucent'],[data-material='translucent']) .rt-BaseButton{
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 .rt-BaseButton:where([data-panel-background='solid'],[data-material='solid']){
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
   --backdrop-filter-components: none;
 }
 .rt-BaseButton:where([data-panel-background='translucent'],[data-material='translucent']){
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 @media (forced-colors: active) {
   .rt-BaseButton{
@@ -8946,8 +8924,7 @@
   .rt-BaseButton{
     -webkit-transition: none;
     transition: none;
-    -webkit-backdrop-filter: none;
-            backdrop-filter: none;
+    backdrop-filter: none;
     -webkit-animation: none;
             animation: none;
   }
@@ -10046,23 +10023,20 @@
 :where([data-panel-background='translucent'],[data-material='translucent']) .rt-CalloutRoot{
   --material-blend: 60%;
   --material-alpha: 1;
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 .rt-CalloutRoot:where([data-panel-background='solid'],[data-material='solid']){
   --material-blend: 100%;
   --material-alpha: 0;
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
   --backdrop-filter-components: none;
 }
 .rt-CalloutRoot:where([data-panel-background='translucent'],[data-material='translucent']){
   --material-blend: 60%;
   --material-alpha: 1;
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 .rt-CalloutRoot:where(.rt-high-contrast){
   color: var(--accent-12);
@@ -10504,18 +10478,15 @@
   z-index: -1;
 }
 :where([data-panel-background='translucent'],[data-material='translucent']) .rt-BaseCard::before{
-  -webkit-backdrop-filter: var(--backdrop-filter-panel);
-          backdrop-filter: var(--backdrop-filter-panel);
-  --backdrop-filter-panel: blur(var(--backdrop-blur-panel));
+  backdrop-filter: var(--backdrop-filter-panel);
+  --backdrop-filter-panel: var(--backdrop-filter-panel-enabled);
 }
 .rt-BaseCard:where([data-material='solid'],[data-panel-background='solid'])::before{
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
 }
 .rt-BaseCard:where([data-material='translucent'],[data-panel-background='translucent'])::before{
-  -webkit-backdrop-filter: var(--backdrop-filter-panel);
-          backdrop-filter: var(--backdrop-filter-panel);
-  --backdrop-filter-panel: blur(var(--backdrop-blur-panel));
+  backdrop-filter: var(--backdrop-filter-panel);
+  --backdrop-filter-panel: var(--backdrop-filter-panel-enabled);
 }
 .rt-BaseCard:where(:-moz-any-link,button,label){
   cursor: pointer;
@@ -10921,6 +10892,7 @@
           box-shadow: inset 0 0 0 var(--base-card-border-width) color-mix(in srgb, var(--v-border-active-a) calc(var(--material-alpha) * 40%), var(--v-border-active) var(--material-blend));
 }
 .rt-BaseCard:where(.rt-variant-ghost){
+  --backdrop-filter-components-enabled: none;
   --card-border-width: 0px;
   --v-bg-hover: var(--gray-3);
   --v-bg-hover-a: var(--gray-a3);
@@ -10954,18 +10926,15 @@
   outline-offset: var(--v-focus-offset);
 }
 :where([data-panel-background='translucent'],[data-material='translucent']) .rt-BaseCard:where(.rt-variant-ghost){
-  -webkit-backdrop-filter: var(--backdrop-filter-panel);
-          backdrop-filter: var(--backdrop-filter-panel);
-  --backdrop-filter-panel: blur(var(--backdrop-blur-panel));
+  backdrop-filter: var(--backdrop-filter-panel);
+  --backdrop-filter-panel: var(--backdrop-filter-panel-enabled);
 }
 .rt-BaseCard:where(.rt-variant-ghost):where([data-panel-background='solid'],[data-material='solid']){
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
 }
 .rt-BaseCard:where(.rt-variant-ghost):where([data-panel-background='translucent'],[data-material='translucent']){
-  -webkit-backdrop-filter: var(--backdrop-filter-panel);
-          backdrop-filter: var(--backdrop-filter-panel);
-  --backdrop-filter-panel: blur(var(--backdrop-blur-panel));
+  backdrop-filter: var(--backdrop-filter-panel);
+  --backdrop-filter-panel: var(--backdrop-filter-panel-enabled);
 }
 @media (hover: hover) {
   .rt-BaseCard:where(.rt-variant-ghost):where(:-moz-any-link,button,label):where(:hover){
@@ -11015,8 +10984,7 @@
   }
 }
 :where(.rt-PopoverContent,.rt-BaseDialogContent,.rt-BaseMenuContent,.rt-DropdownMenuContent,.rt-ContextMenuContent,.rt-AlertDialogContent,.rt-HoverCardContent,.rt-TooltipContent,.rt-Card) .rt-BaseCard:where(.rt-variant-ghost){
-  -webkit-backdrop-filter: none !important;
-          backdrop-filter: none !important;
+  backdrop-filter: none !important;
 }
 .rt-BaseCard:where(.rt-variant-classic){
   --card-border-width: 1px;
@@ -11148,19 +11116,16 @@
   isolation: isolate;
 }
 :where([data-panel-background='translucent'],[data-material='translucent']) .rt-BaseCheckboxRoot{
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 .rt-BaseCheckboxRoot:where([data-panel-background='solid'],[data-material='solid']){
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
   --backdrop-filter-components: none;
 }
 .rt-BaseCheckboxRoot:where([data-panel-background='translucent'],[data-material='translucent']){
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 .rt-BaseCheckboxRoot::before{
   content: '';
@@ -12221,6 +12186,7 @@
   }
 }
 .rt-BaseMenuContent{
+  --backdrop-filter-components-enabled: none;
   --scrollarea-scrollbar-vertical-margin-top: var(--base-menu-content-padding);
   --scrollarea-scrollbar-vertical-margin-bottom: var(--base-menu-content-padding);
   --scrollarea-scrollbar-horizontal-margin-left: var(--base-menu-content-padding);
@@ -12237,8 +12203,7 @@
   overflow: hidden;
   z-index: 200;
   background-color: var(--color-panel);
-  -webkit-backdrop-filter: var(--backdrop-filter-panel);
-          backdrop-filter: var(--backdrop-filter-panel);
+  backdrop-filter: var(--backdrop-filter-panel);
   -webkit-box-shadow: var(--shadow-5);
           box-shadow: var(--shadow-5);
   -webkit-transition: var(--transition-background-blur);
@@ -12254,19 +12219,16 @@
     -webkit-transition: none;
     transition: none;
     will-change: auto;
-    -webkit-backdrop-filter: none;
-            backdrop-filter: none;
+    backdrop-filter: none;
   }
 }
 .rt-BaseMenuContent:where([data-panel-background='solid']){
   background-color: var(--color-panel-solid);
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
 }
 .rt-BaseMenuContent:where([data-panel-background='translucent']){
   background-color: var(--color-panel-translucent);
-  -webkit-backdrop-filter: var(--backdrop-filter-panel);
-          backdrop-filter: var(--backdrop-filter-panel);
+  backdrop-filter: var(--backdrop-filter-panel);
 }
 .rt-BaseMenuViewport{
   -webkit-box-flex: 1;
@@ -12324,8 +12286,7 @@
   .rt-BaseMenuItem{
     -webkit-transition: none;
     transition: none;
-    -webkit-backdrop-filter: none;
-            backdrop-filter: none;
+    backdrop-filter: none;
   }
 }
 .rt-BaseMenuShortcut{
@@ -13110,8 +13071,7 @@
   .rt-BaseMenuContent:where(.rt-variant-solid,.rt-variant-soft) :where(.rt-BaseMenuSubTrigger){
     -webkit-transition: none;
     transition: none;
-    -webkit-backdrop-filter: none;
-            backdrop-filter: none;
+    backdrop-filter: none;
   }
 }
 :where([data-panel-background='translucent']) :is(.rt-BaseMenuContent:where(.rt-variant-solid,.rt-variant-soft) :where(.rt-BaseMenuSubTrigger)){
@@ -13130,8 +13090,7 @@
 }
 :is(.rt-BaseMenuContent:where(.rt-variant-solid) :where(.rt-BaseMenuSubTrigger[data-state='open'])):where([data-panel-background='solid']){
   background-color: var(--gray-3);
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
   --backdrop-filter-components: none;
 }
 :is(.rt-BaseMenuContent:where(.rt-variant-solid) :where(.rt-BaseMenuSubTrigger[data-state='open'])):where([data-panel-background='translucent']){
@@ -13181,8 +13140,7 @@
 }
 :is(.rt-BaseMenuContent:where(.rt-variant-soft) :where(.rt-BaseMenuSubTrigger[data-state='open'])):where([data-panel-background='solid']){
   background-color: var(--accent-3);
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
   --backdrop-filter-components: none;
 }
 :is(.rt-BaseMenuContent:where(.rt-variant-soft) :where(.rt-BaseMenuSubTrigger[data-state='open'])):where([data-panel-background='translucent']){
@@ -13196,8 +13154,7 @@
 }
 :is(.rt-BaseMenuContent:where(.rt-variant-soft) :where(.rt-BaseMenuItem[data-highlighted])):where([data-panel-background='solid']){
   background-color: var(--accent-4);
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
   --backdrop-filter-components: none;
 }
 :is(.rt-BaseMenuContent:where(.rt-variant-soft) :where(.rt-BaseMenuItem[data-highlighted])):where([data-panel-background='translucent']){
@@ -13934,13 +13891,11 @@
   }
 }
 .rt-DialogOverlay::before{
-  -webkit-backdrop-filter: var(--backdrop-filter-components) !important;
-          backdrop-filter: var(--backdrop-filter-components) !important;
+  backdrop-filter: var(--backdrop-filter-components) !important;
 }
-@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
+@supports not (backdrop-filter: blur(1px)) {
   .rt-DialogOverlay::before{
-    -webkit-backdrop-filter: none !important;
-            backdrop-filter: none !important;
+    backdrop-filter: none !important;
   }
 }
 .rt-DropdownMenuContent{
@@ -14171,19 +14126,16 @@
   }
 }
 :where([data-panel-background='translucent'],[data-material='translucent']) .rt-TextFieldRoot{
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 .rt-TextFieldRoot:where([data-panel-background='solid'],[data-material='solid']){
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
   --backdrop-filter-components: none;
 }
 .rt-TextFieldRoot:where([data-panel-background='translucent'],[data-material='translucent']){
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 @supports selector(:has(*)) {
   .rt-TextFieldRoot:where(:has(.rt-TextFieldInput:focus)){
@@ -17630,9 +17582,9 @@
   }
 }
 .rt-PopoverContent{
+  --backdrop-filter-components-enabled: none;
   background-color: var(--color-panel);
-  -webkit-backdrop-filter: var(--backdrop-filter-panel);
-          backdrop-filter: var(--backdrop-filter-panel);
+  backdrop-filter: var(--backdrop-filter-panel);
   -webkit-box-shadow: var(--shadow-5);
           box-shadow: var(--shadow-5);
   min-width: var(--radix-popover-trigger-width);
@@ -17661,13 +17613,11 @@
 }
 .rt-PopoverContent:where([data-panel-background='solid']){
   background-color: var(--color-panel-solid);
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
 }
 .rt-PopoverContent:where([data-panel-background='translucent']){
   background-color: var(--color-panel-translucent);
-  -webkit-backdrop-filter: var(--backdrop-filter-panel);
-          backdrop-filter: var(--backdrop-filter-panel);
+  backdrop-filter: var(--backdrop-filter-panel);
 }
 .rt-PopoverContent:where([data-has-toolbar]){
   padding-top: var(--popover-toolbar-offset, var(--popover-content-padding));
@@ -17861,25 +17811,24 @@
   isolation: isolate;
 }
 :where([data-panel-background='translucent'],[data-material='translucent']) .rt-ProgressRoot{
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 .rt-ProgressRoot:where([data-panel-background='solid'],[data-material='solid']){
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
   --backdrop-filter-components: none;
 }
 .rt-ProgressRoot:where([data-panel-background='translucent'],[data-material='translucent']){
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 .rt-ProgressIndicator{
   display: block;
   height: var(--position-full);
-  width: max(calc(var(--progress-value) / var(--progress-max) * 100%), var(--progress-height));
+  width: var(--position-full);
   border-radius: var(--progress-indicator-radius);
+  -webkit-transform: translateX(calc(-100% + max(calc(var(--progress-value) / var(--progress-max) * 100%), var(--progress-height))));
+          transform: translateX(calc(-100% + max(calc(var(--progress-value) / var(--progress-max) * 100%), var(--progress-height))));
   -webkit-transition: var(--transition-progress);
   transition: var(--transition-progress);
 }
@@ -17897,38 +17846,48 @@
 }
 @-webkit-keyframes rt-progress-indicator-indeterminate-grow {
   0%{
-    width: calc(var(--progress-scale-initial) * 100%);
+    -webkit-transform: translateX(calc(-100% + var(--progress-scale-initial) * 100%));
+            transform: translateX(calc(-100% + var(--progress-scale-initial) * 100%));
   }
   20%{
-    width: calc(var(--progress-scale-step-1) * 100%);
+    -webkit-transform: translateX(calc(-100% + var(--progress-scale-step-1) * 100%));
+            transform: translateX(calc(-100% + var(--progress-scale-step-1) * 100%));
   }
   30%{
-    width: calc(var(--progress-scale-step-2) * 100%);
+    -webkit-transform: translateX(calc(-100% + var(--progress-scale-step-2) * 100%));
+            transform: translateX(calc(-100% + var(--progress-scale-step-2) * 100%));
   }
   40%,
   50%{
-    width: calc(var(--progress-scale-step-3) * 100%);
+    -webkit-transform: translateX(calc(-100% + var(--progress-scale-step-3) * 100%));
+            transform: translateX(calc(-100% + var(--progress-scale-step-3) * 100%));
   }
   100%{
-    width: calc(var(--progress-scale-final) * 100%);
+    -webkit-transform: translateX(calc(-100% + var(--progress-scale-final) * 100%));
+            transform: translateX(calc(-100% + var(--progress-scale-final) * 100%));
   }
 }
 @keyframes rt-progress-indicator-indeterminate-grow {
   0%{
-    width: calc(var(--progress-scale-initial) * 100%);
+    -webkit-transform: translateX(calc(-100% + var(--progress-scale-initial) * 100%));
+            transform: translateX(calc(-100% + var(--progress-scale-initial) * 100%));
   }
   20%{
-    width: calc(var(--progress-scale-step-1) * 100%);
+    -webkit-transform: translateX(calc(-100% + var(--progress-scale-step-1) * 100%));
+            transform: translateX(calc(-100% + var(--progress-scale-step-1) * 100%));
   }
   30%{
-    width: calc(var(--progress-scale-step-2) * 100%);
+    -webkit-transform: translateX(calc(-100% + var(--progress-scale-step-2) * 100%));
+            transform: translateX(calc(-100% + var(--progress-scale-step-2) * 100%));
   }
   40%,
   50%{
-    width: calc(var(--progress-scale-step-3) * 100%);
+    -webkit-transform: translateX(calc(-100% + var(--progress-scale-step-3) * 100%));
+            transform: translateX(calc(-100% + var(--progress-scale-step-3) * 100%));
   }
   100%{
-    width: calc(var(--progress-scale-final) * 100%);
+    -webkit-transform: translateX(calc(-100% + var(--progress-scale-final) * 100%));
+            transform: translateX(calc(-100% + var(--progress-scale-final) * 100%));
   }
 }
 .rt-ProgressRoot:where(.rt-r-size-1){
@@ -18307,19 +18266,16 @@
   isolation: isolate;
 }
 :where([data-panel-background='translucent'],[data-material='translucent']) .rt-BaseRadioRoot{
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 .rt-BaseRadioRoot:where([data-panel-background='solid'],[data-material='solid']){
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
   --backdrop-filter-components: none;
 }
 .rt-BaseRadioRoot:where([data-panel-background='translucent'],[data-material='translucent']){
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 .rt-BaseRadioRoot:where(:disabled,[data-disabled]){
   cursor: var(--cursor-disabled);
@@ -18940,13 +18896,11 @@
   border-end-end-radius: 0;
 }
 .rt-SheetOverlay::before{
-  -webkit-backdrop-filter: var(--backdrop-filter-components) !important;
-          backdrop-filter: var(--backdrop-filter-components) !important;
+  backdrop-filter: var(--backdrop-filter-components) !important;
 }
-@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
+@supports not (backdrop-filter: blur(1px)) {
   .rt-SheetOverlay::before{
-    -webkit-backdrop-filter: none !important;
-            backdrop-filter: none !important;
+    backdrop-filter: none !important;
   }
 }
 @media (prefers-reduced-motion: no-preference) {
@@ -19227,23 +19181,19 @@
   grid-auto-columns: minmax(var(--segmented-control-height), 1fr);
 }
 :where([data-panel-background='translucent'],[data-material='translucent']) .rt-SegmentedControlRoot{
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 .rt-SegmentedControlRoot:where([data-panel-background='solid'],[data-material='solid']){
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
   --backdrop-filter-components: none;
 }
 .rt-SegmentedControlRoot:where([data-panel-background='translucent'],[data-material='translucent']){
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 :where(.rt-PopoverContent,.rt-BaseDialogContent,.rt-BaseMenuContent,.rt-DropdownMenuContent,.rt-ContextMenuContent,.rt-AlertDialogContent,.rt-HoverCardContent,.rt-TooltipContent,.rt-Card) .rt-SegmentedControlRoot{
-  -webkit-backdrop-filter: none !important;
-          backdrop-filter: none !important;
+  backdrop-filter: none !important;
 }
 .rt-SegmentedControlRoot:where([data-disabled]){
   color: var(--gray-a8);
@@ -20308,19 +20258,16 @@
   color: var(--gray-12);
 }
 :where([data-panel-background='translucent'],[data-material='translucent']) .rt-SelectTrigger{
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 .rt-SelectTrigger:where([data-panel-background='solid'],[data-material='solid']){
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
   --backdrop-filter-components: none;
 }
 .rt-SelectTrigger:where([data-panel-background='translucent'],[data-material='translucent']){
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 .rt-SelectTrigger:where(.rt-high-contrast) :where(.rt-SelectTriggerInner){
   color: var(--accent-12);
@@ -20351,6 +20298,7 @@
   height: var(--trigger-icon-size-default);
 }
 .rt-SelectContent{
+  --backdrop-filter-components-enabled: none;
   --scrollarea-scrollbar-vertical-margin-top: var(--select-content-padding);
   --scrollarea-scrollbar-vertical-margin-bottom: var(--select-content-padding);
   --scrollarea-scrollbar-horizontal-margin-left: var(--select-content-padding);
@@ -20358,8 +20306,7 @@
   overflow: hidden;
   z-index: 200;
   background-color: var(--color-panel);
-  -webkit-backdrop-filter: var(--backdrop-filter-panel);
-          backdrop-filter: var(--backdrop-filter-panel);
+  backdrop-filter: var(--backdrop-filter-panel);
   -webkit-box-shadow: var(--shadow-5);
           box-shadow: var(--shadow-5);
 }
@@ -21885,6 +21832,7 @@
   height: 100%;
 }
 .rt-SidebarContainer{
+  --backdrop-filter-components-enabled: none;
   --sidebar-base-border-radius: 0;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -21896,8 +21844,7 @@
   height: 100%;
   width: 100%;
   background-color: var(--color-panel);
-  -webkit-backdrop-filter: var(--backdrop-filter-panel);
-          backdrop-filter: var(--backdrop-filter-panel);
+  backdrop-filter: var(--backdrop-filter-panel);
   border-radius: inherit;
   -webkit-box-flex: 1;
       -ms-flex: 1;
@@ -21943,8 +21890,7 @@
           box-sizing: border-box;
   min-height: 0;
   background-color: transparent !important;
-  -webkit-backdrop-filter: none !important;
-          backdrop-filter: none !important;
+  backdrop-filter: none !important;
   -webkit-box-shadow: none !important;
           box-shadow: none !important;
   border-radius: 0 !important;
@@ -22570,12 +22516,10 @@
 }
 :where([data-panel-background='translucent']) .rt-SidebarContainer{
   --sidebar-border-color: var(--gray-a6);
-  -webkit-backdrop-filter: var(--backdrop-filter-panel);
-          backdrop-filter: var(--backdrop-filter-panel);
+  backdrop-filter: var(--backdrop-filter-panel);
 }
 .rt-SidebarContainer:where([data-panel-background='solid']){
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
   --backdrop-filter-panel: none;
 }
 .rt-SidebarContainer:where(.rt-variant-outline){
@@ -23620,8 +23564,7 @@
 }
 :is(:is(.rt-SidebarHeader:where(.rt-menu-variant-solid),.rt-SidebarContent:where(.rt-menu-variant-solid),.rt-SidebarFooter:where(.rt-menu-variant-solid)) :where(.rt-SidebarMenuSubTrigger[data-state='open'])):where([data-panel-background='solid']){
   background-color: var(--gray-3);
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
   --backdrop-filter-components: none;
 }
 :is(:is(.rt-SidebarHeader:where(.rt-menu-variant-solid),.rt-SidebarContent:where(.rt-menu-variant-solid),.rt-SidebarFooter:where(.rt-menu-variant-solid)) :where(.rt-SidebarMenuSubTrigger[data-state='open'])):where([data-panel-background='translucent']){
@@ -23745,8 +23688,7 @@
 }
 :is(:is(.rt-SidebarHeader:where(.rt-menu-variant-soft),.rt-SidebarContent:where(.rt-menu-variant-soft),.rt-SidebarFooter:where(.rt-menu-variant-soft)) :where(.rt-SidebarMenuSubTrigger[data-state='open'])):where([data-panel-background='solid']){
   background-color: var(--accent-3);
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
   --backdrop-filter-components: none;
 }
 :is(:is(.rt-SidebarHeader:where(.rt-menu-variant-soft),.rt-SidebarContent:where(.rt-menu-variant-soft),.rt-SidebarFooter:where(.rt-menu-variant-soft)) :where(.rt-SidebarMenuSubTrigger[data-state='open'])):where([data-panel-background='translucent']){
@@ -23764,8 +23706,7 @@
 }
 :is(:is(.rt-SidebarHeader:where(.rt-menu-variant-soft),.rt-SidebarContent:where(.rt-menu-variant-soft),.rt-SidebarFooter:where(.rt-menu-variant-soft)) :where(.rt-SidebarMenuButton:where([data-highlighted],:hover):not([data-disabled]))):where([data-panel-background='solid']){
   background-color: var(--accent-4);
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
   --backdrop-filter-components: none;
 }
 :is(:is(.rt-SidebarHeader:where(.rt-menu-variant-soft),.rt-SidebarContent:where(.rt-menu-variant-soft),.rt-SidebarFooter:where(.rt-menu-variant-soft)) :where(.rt-SidebarMenuButton:where([data-highlighted],:hover):not([data-disabled]))):where([data-panel-background='translucent']){
@@ -23786,8 +23727,7 @@
 :is(:is(.rt-SidebarHeader:where(.rt-menu-variant-soft),.rt-SidebarContent:where(.rt-menu-variant-soft),.rt-SidebarFooter:where(.rt-menu-variant-soft)) :where(.rt-SidebarMenuButton[data-active])):where([data-panel-background='solid']){
   background-color: var(--accent-3);
   color: var(--accent-12);
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
   --backdrop-filter-components: none;
 }
 :is(:is(.rt-SidebarHeader:where(.rt-menu-variant-soft),.rt-SidebarContent:where(.rt-menu-variant-soft),.rt-SidebarFooter:where(.rt-menu-variant-soft)) :where(.rt-SidebarMenuButton[data-active])):where([data-panel-background='translucent']){
@@ -24146,18 +24086,21 @@
           flex-direction: column;
   height: 100%;
   overflow: hidden;
-  -webkit-transition: width var(--motion-duration-small) var(--motion-ease-standard);
-  transition: width var(--motion-duration-small) var(--motion-ease-standard);
+  position: relative;
+  z-index: 2;
 }
 .rt-ShellRail[data-mode='expanded']{
   width: var(--rail-size, 64px);
 }
 .rt-ShellRail[data-mode='collapsed']{
   width: 0px;
-  -webkit-transition-delay: var(--motion-duration-small);
-          transition-delay: var(--motion-duration-small);
+  -webkit-transition: width 0s var(--motion-duration-small);
+  transition: width 0s var(--motion-duration-small);
 }
 .rt-ShellRailContent{
+  position: absolute;
+  inset-block: 0;
+  inset-inline-start: 0;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
@@ -24165,24 +24108,27 @@
   -webkit-box-direction: normal;
       -ms-flex-direction: column;
           flex-direction: column;
-  width: var(--rail-size, 64px);
+  width: 100%;
   height: 100%;
   gap: var(--space-2);
   opacity: 0;
   pointer-events: none;
-  -webkit-transition: opacity var(--motion-duration-small) var(--motion-ease-standard) var(--motion-duration-small);
-  transition: opacity var(--motion-duration-small) var(--motion-ease-standard) var(--motion-duration-small);
+  -webkit-transform: translateX(-100%);
+          transform: translateX(-100%);
+  -webkit-transition: opacity var(--motion-duration-small) var(--motion-ease-standard), -webkit-transform var(--motion-duration-small) var(--motion-ease-standard);
+  transition: opacity var(--motion-duration-small) var(--motion-ease-standard), -webkit-transform var(--motion-duration-small) var(--motion-ease-standard);
+  transition: transform var(--motion-duration-small) var(--motion-ease-standard), opacity var(--motion-duration-small) var(--motion-ease-standard);
+  transition: transform var(--motion-duration-small) var(--motion-ease-standard), opacity var(--motion-duration-small) var(--motion-ease-standard), -webkit-transform var(--motion-duration-small) var(--motion-ease-standard);
+}
+:where([dir='rtl']) .rt-ShellRailContent{
+  -webkit-transform: translateX(100%);
+          transform: translateX(100%);
 }
 .rt-ShellRailContent[data-visible]{
   opacity: 1;
   pointer-events: auto;
-}
-.rt-ShellRail[data-mode='collapsed'] .rt-ShellRailContent{
-  opacity: 0;
-  width: 0;
-  visibility: hidden;
-  -webkit-transition: opacity var(--motion-duration-small) var(--motion-ease-standard);
-  transition: opacity var(--motion-duration-small) var(--motion-ease-standard);
+  -webkit-transform: translateX(0);
+          transform: translateX(0);
 }
 .rt-ShellPanel{
   display: -webkit-box;
@@ -24196,18 +24142,19 @@
   overflow: visible;
   position: relative;
   z-index: 1;
-  -webkit-transition: width var(--motion-duration-small) var(--motion-ease-standard);
-  transition: width var(--motion-duration-small) var(--motion-ease-standard);
 }
 .rt-ShellPanel[data-visible]{
   width: var(--panel-size, 288px);
 }
 .rt-ShellPanel:not([data-visible]){
   width: 0px;
-  -webkit-transition-delay: var(--motion-duration-small);
-          transition-delay: var(--motion-duration-small);
+  -webkit-transition: width 0s var(--motion-duration-small);
+  transition: width 0s var(--motion-duration-small);
 }
 .rt-ShellPanelContent{
+  position: absolute;
+  inset-block: 0;
+  inset-inline-start: 0;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
@@ -24215,24 +24162,31 @@
   -webkit-box-direction: normal;
       -ms-flex-direction: column;
           flex-direction: column;
-  width: var(--panel-size, 288px);
+  width: 100%;
   height: 100%;
   overflow: hidden;
   opacity: 0;
   pointer-events: none;
-  -webkit-transition: opacity var(--motion-duration-small) var(--motion-ease-standard) var(--motion-duration-small);
-  transition: opacity var(--motion-duration-small) var(--motion-ease-standard) var(--motion-duration-small);
+  -webkit-transform: translateX(-100%);
+          transform: translateX(-100%);
+  -webkit-transition: opacity var(--motion-duration-small) var(--motion-ease-standard), -webkit-transform var(--motion-duration-small) var(--motion-ease-standard);
+  transition: opacity var(--motion-duration-small) var(--motion-ease-standard), -webkit-transform var(--motion-duration-small) var(--motion-ease-standard);
+  transition: transform var(--motion-duration-small) var(--motion-ease-standard), opacity var(--motion-duration-small) var(--motion-ease-standard);
+  transition: transform var(--motion-duration-small) var(--motion-ease-standard), opacity var(--motion-duration-small) var(--motion-ease-standard), -webkit-transform var(--motion-duration-small) var(--motion-ease-standard);
+}
+:where([dir='rtl']) .rt-ShellPanelContent{
+  -webkit-transform: translateX(100%);
+          transform: translateX(100%);
 }
 .rt-ShellPanelContent[data-visible]{
   opacity: 1;
   pointer-events: auto;
+  -webkit-transform: translateX(0);
+          transform: translateX(0);
 }
-.rt-ShellPanel:not([data-visible]) .rt-ShellPanelContent{
-  opacity: 0;
-  width: 0;
-  visibility: hidden;
-  -webkit-transition: opacity var(--motion-duration-small) var(--motion-ease-standard);
-  transition: opacity var(--motion-duration-small) var(--motion-ease-standard);
+:where([dir='rtl']) .rt-ShellPanelContent[data-visible]{
+  -webkit-transform: translateX(0);
+          transform: translateX(0);
 }
 .rt-ShellSidebar{
   display: -webkit-box;
@@ -24246,8 +24200,6 @@
   overflow: visible;
   position: relative;
   z-index: 1;
-  -webkit-transition: width var(--motion-duration-small) var(--motion-ease-standard);
-  transition: width var(--motion-duration-small) var(--motion-ease-standard);
 }
 .rt-ShellSidebar[data-mode='expanded']{
   width: var(--sidebar-size, 288px);
@@ -24255,15 +24207,15 @@
 .rt-ShellSidebar[data-mode='thin']{
   width: var(--sidebar-thin-size, 64px);
 }
-.rt-ShellSidebar[data-mode='thin'] .rt-ShellSidebarContent{
-  width: var(--sidebar-thin-size, 64px);
-}
 .rt-ShellSidebar[data-mode='collapsed']{
   width: 0px;
-  -webkit-transition-delay: var(--motion-duration-small);
-          transition-delay: var(--motion-duration-small);
+  -webkit-transition: width 0s var(--motion-duration-small);
+  transition: width 0s var(--motion-duration-small);
 }
 .rt-ShellSidebarContent{
+  position: absolute;
+  inset-block: 0;
+  inset-inline-start: 0;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
@@ -24276,8 +24228,16 @@
   overflow: hidden;
   opacity: 0;
   pointer-events: none;
-  -webkit-transition: opacity var(--motion-duration-small) var(--motion-ease-standard) var(--motion-duration-small);
-  transition: opacity var(--motion-duration-small) var(--motion-ease-standard) var(--motion-duration-small);
+  -webkit-transform: translateX(-100%);
+          transform: translateX(-100%);
+  -webkit-transition: opacity var(--motion-duration-small) var(--motion-ease-standard), -webkit-transform var(--motion-duration-small) var(--motion-ease-standard);
+  transition: opacity var(--motion-duration-small) var(--motion-ease-standard), -webkit-transform var(--motion-duration-small) var(--motion-ease-standard);
+  transition: transform var(--motion-duration-small) var(--motion-ease-standard), opacity var(--motion-duration-small) var(--motion-ease-standard);
+  transition: transform var(--motion-duration-small) var(--motion-ease-standard), opacity var(--motion-duration-small) var(--motion-ease-standard), -webkit-transform var(--motion-duration-small) var(--motion-ease-standard);
+}
+:where([dir='rtl']) .rt-ShellSidebarContent{
+  -webkit-transform: translateX(100%);
+          transform: translateX(100%);
 }
 .rt-ShellSidebar[data-mode='thin'] .rt-ShellResizer{
   display: none;
@@ -24285,6 +24245,8 @@
 .rt-ShellSidebarContent[data-visible]{
   opacity: 1;
   pointer-events: auto;
+  -webkit-transform: translateX(0);
+          transform: translateX(0);
 }
 .rt-ShellSidebarContent[data-phase='hiding']{
   opacity: 0;
@@ -24299,13 +24261,6 @@
   -webkit-transition: opacity var(--motion-duration-small) var(--motion-ease-standard);
   transition: opacity var(--motion-duration-small) var(--motion-ease-standard);
 }
-.rt-ShellSidebar[data-mode='collapsed'] .rt-ShellSidebarContent{
-  opacity: 0;
-  width: 0;
-  visibility: hidden;
-  -webkit-transition: opacity var(--motion-duration-small) var(--motion-ease-standard);
-  transition: opacity var(--motion-duration-small) var(--motion-ease-standard);
-}
 .rt-ShellSidebar[data-presentation='stacked']{
   position: absolute;
   inset-block: 0;
@@ -24353,18 +24308,19 @@
   overflow: visible;
   position: relative;
   z-index: 1;
-  -webkit-transition: width var(--motion-duration-small) var(--motion-ease-standard);
-  transition: width var(--motion-duration-small) var(--motion-ease-standard);
 }
 .rt-ShellInspector[data-mode='expanded']{
   width: var(--inspector-size, 320px);
 }
 .rt-ShellInspector[data-mode='collapsed']{
   width: 0px;
-  -webkit-transition-delay: var(--motion-duration-small);
-          transition-delay: var(--motion-duration-small);
+  -webkit-transition: width 0s var(--motion-duration-small);
+  transition: width 0s var(--motion-duration-small);
 }
 .rt-ShellInspectorContent{
+  position: absolute;
+  inset-block: 0;
+  inset-inline-end: 0;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
@@ -24372,24 +24328,27 @@
   -webkit-box-direction: normal;
       -ms-flex-direction: column;
           flex-direction: column;
-  width: var(--inspector-size, 320px);
+  width: 100%;
   height: 100%;
   overflow: hidden;
   opacity: 0;
   pointer-events: none;
-  -webkit-transition: opacity var(--motion-duration-small) var(--motion-ease-standard) var(--motion-duration-small);
-  transition: opacity var(--motion-duration-small) var(--motion-ease-standard) var(--motion-duration-small);
+  -webkit-transform: translateX(100%);
+          transform: translateX(100%);
+  -webkit-transition: opacity var(--motion-duration-small) var(--motion-ease-standard), -webkit-transform var(--motion-duration-small) var(--motion-ease-standard);
+  transition: opacity var(--motion-duration-small) var(--motion-ease-standard), -webkit-transform var(--motion-duration-small) var(--motion-ease-standard);
+  transition: transform var(--motion-duration-small) var(--motion-ease-standard), opacity var(--motion-duration-small) var(--motion-ease-standard);
+  transition: transform var(--motion-duration-small) var(--motion-ease-standard), opacity var(--motion-duration-small) var(--motion-ease-standard), -webkit-transform var(--motion-duration-small) var(--motion-ease-standard);
+}
+:where([dir='rtl']) .rt-ShellInspectorContent{
+  -webkit-transform: translateX(-100%);
+          transform: translateX(-100%);
 }
 .rt-ShellInspectorContent[data-visible]{
   opacity: 1;
   pointer-events: auto;
-}
-.rt-ShellInspector[data-mode='collapsed'] .rt-ShellInspectorContent{
-  opacity: 0;
-  width: 0;
-  visibility: hidden;
-  -webkit-transition: opacity var(--motion-duration-small) var(--motion-ease-standard);
-  transition: opacity var(--motion-duration-small) var(--motion-ease-standard);
+  -webkit-transform: translateX(0);
+          transform: translateX(0);
 }
 .rt-ShellBottom{
   display: -webkit-box;
@@ -24404,18 +24363,19 @@
   -ms-flex-negative: 0;
       flex-shrink: 0;
   position: relative;
-  -webkit-transition: height var(--motion-duration-small) var(--motion-ease-standard);
-  transition: height var(--motion-duration-small) var(--motion-ease-standard);
 }
 .rt-ShellBottom[data-mode='expanded']{
   height: var(--bottom-size, 200px);
 }
 .rt-ShellBottom[data-mode='collapsed']{
   height: 0px;
-  -webkit-transition-delay: var(--motion-duration-small);
-          transition-delay: var(--motion-duration-small);
+  -webkit-transition: height 0s var(--motion-duration-small);
+  transition: height 0s var(--motion-duration-small);
 }
 .rt-ShellBottomContent{
+  position: absolute;
+  inset-inline: 0;
+  inset-block-end: 0;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
@@ -24424,16 +24384,22 @@
       -ms-flex-direction: column;
           flex-direction: column;
   width: 100%;
-  height: var(--bottom-size, 200px);
+  height: 100%;
   overflow: hidden;
   opacity: 0;
   pointer-events: none;
-  -webkit-transition: opacity var(--motion-duration-small) var(--motion-ease-standard) var(--motion-duration-small);
-  transition: opacity var(--motion-duration-small) var(--motion-ease-standard) var(--motion-duration-small);
+  -webkit-transform: translateY(100%);
+          transform: translateY(100%);
+  -webkit-transition: opacity var(--motion-duration-small) var(--motion-ease-standard), -webkit-transform var(--motion-duration-small) var(--motion-ease-standard);
+  transition: opacity var(--motion-duration-small) var(--motion-ease-standard), -webkit-transform var(--motion-duration-small) var(--motion-ease-standard);
+  transition: transform var(--motion-duration-small) var(--motion-ease-standard), opacity var(--motion-duration-small) var(--motion-ease-standard);
+  transition: transform var(--motion-duration-small) var(--motion-ease-standard), opacity var(--motion-duration-small) var(--motion-ease-standard), -webkit-transform var(--motion-duration-small) var(--motion-ease-standard);
 }
 .rt-ShellBottomContent[data-visible]{
   opacity: 1;
   pointer-events: auto;
+  -webkit-transform: translateY(0);
+          transform: translateY(0);
 }
 .rt-ShellPanel[data-resizing],
 .rt-ShellSidebar[data-resizing],
@@ -24693,19 +24659,16 @@
   isolation: isolate;
 }
 :where([data-panel-background='translucent'],[data-material='translucent']) .rt-SliderRoot{
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 .rt-SliderRoot:where([data-panel-background='solid'],[data-material='solid']){
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
   --backdrop-filter-components: none;
 }
 .rt-SliderRoot:where([data-panel-background='translucent'],[data-material='translucent']){
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 .rt-SliderRoot:where([data-orientation='horizontal']){
   width: -webkit-fill-available;
@@ -25326,19 +25289,16 @@
   isolation: isolate;
 }
 :where([data-panel-background='translucent'],[data-material='translucent']) .rt-SwitchRoot{
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 .rt-SwitchRoot:where([data-panel-background='solid'],[data-material='solid']){
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
   --backdrop-filter-components: none;
 }
 .rt-SwitchRoot:where([data-panel-background='translucent'],[data-material='translucent']){
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 .rt-SwitchRoot::before{
   content: '';
@@ -25858,44 +25818,37 @@
   }
   :where([data-panel-background='translucent']) :is(.rt-BaseTabListTrigger:where(:hover) :where(.rt-BaseTabListTriggerInner)){
     background-color: var(--gray-a3);
-    -webkit-backdrop-filter: var(--backdrop-filter-components);
-            backdrop-filter: var(--backdrop-filter-components);
+    backdrop-filter: var(--backdrop-filter-components);
   }
   :where(.rt-BaseTabList[data-panel-background='solid']) :is(.rt-BaseTabListTrigger:where(:hover) :where(.rt-BaseTabListTriggerInner)){
     background-color: var(--gray-a3);
-    -webkit-backdrop-filter: none;
-            backdrop-filter: none;
+    backdrop-filter: none;
     --backdrop-filter-components: none;
   }
   :where(.rt-BaseTabList[data-panel-background='translucent']) :is(.rt-BaseTabListTrigger:where(:hover) :where(.rt-BaseTabListTriggerInner)){
     background-color: var(--gray-a3);
-    -webkit-backdrop-filter: var(--backdrop-filter-components);
-            backdrop-filter: var(--backdrop-filter-components);
-    --backdrop-filter-components: blur(var(--backdrop-blur-components));
+    backdrop-filter: var(--backdrop-filter-components);
+    --backdrop-filter-components: var(--backdrop-filter-components-enabled);
   }
   :where(.rt-PopoverContent,.rt-BaseDialogContent,.rt-BaseMenuContent,.rt-DropdownMenuContent,.rt-ContextMenuContent,.rt-AlertDialogContent,.rt-HoverCardContent,.rt-TooltipContent,.rt-Card) :is(.rt-BaseTabListTrigger:where(:hover) :where(.rt-BaseTabListTriggerInner)){
-    -webkit-backdrop-filter: none !important;
-            backdrop-filter: none !important;
+    backdrop-filter: none !important;
   }
   .rt-BaseTabListTrigger:where(:focus-visible:hover) :where(.rt-BaseTabListTriggerInner){
     background-color: var(--accent-a3);
   }
   :where([data-panel-background='translucent']) :is(.rt-BaseTabListTrigger:where(:focus-visible:hover) :where(.rt-BaseTabListTriggerInner)){
     background-color: var(--accent-a3);
-    -webkit-backdrop-filter: var(--backdrop-filter-components);
-            backdrop-filter: var(--backdrop-filter-components);
+    backdrop-filter: var(--backdrop-filter-components);
   }
   :where(.rt-BaseTabList[data-panel-background='solid']) :is(.rt-BaseTabListTrigger:where(:focus-visible:hover) :where(.rt-BaseTabListTriggerInner)){
     background-color: var(--accent-a3);
-    -webkit-backdrop-filter: none;
-            backdrop-filter: none;
+    backdrop-filter: none;
     --backdrop-filter-components: none;
   }
   :where(.rt-BaseTabList[data-panel-background='translucent']) :is(.rt-BaseTabListTrigger:where(:focus-visible:hover) :where(.rt-BaseTabListTriggerInner)){
     background-color: var(--accent-a3);
-    -webkit-backdrop-filter: var(--backdrop-filter-components);
-            backdrop-filter: var(--backdrop-filter-components);
-    --backdrop-filter-components: blur(var(--backdrop-blur-components));
+    backdrop-filter: var(--backdrop-filter-components);
+    --backdrop-filter-components: var(--backdrop-filter-components-enabled);
   }
 }
 .rt-BaseTabListTrigger:where([data-state='active'],[data-active]){
@@ -26267,13 +26220,13 @@
   }
 }
 .rt-TableRoot:where(.rt-variant-surface){
+  --backdrop-filter-components-enabled: none;
   -webkit-box-sizing: border-box;
           box-sizing: border-box;
   border: 1px solid var(--gray-a5);
   border-radius: var(--table-border-radius);
   background-color: var(--color-panel);
-  -webkit-backdrop-filter: var(--backdrop-filter-panel);
-          backdrop-filter: var(--backdrop-filter-panel);
+  backdrop-filter: var(--backdrop-filter-panel);
   background-clip: padding-box;
   position: relative;
 }
@@ -26318,19 +26271,16 @@
   --material-alpha: 1;
 }
 :where([data-panel-background='translucent'],[data-material='translucent']) .rt-TextAreaRoot{
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 .rt-TextAreaRoot:where([data-panel-background='solid'],[data-material='solid']){
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
   --backdrop-filter-components: none;
 }
 .rt-TextAreaRoot:where([data-panel-background='translucent'],[data-material='translucent']){
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 .rt-TextAreaRoot:where(:focus-within){
   outline: 2px solid var(--v-focus-color, var(--focus-8));
@@ -27464,13 +27414,11 @@
   isolation: isolate;
 }
 .rt-ChatbarRoot:where([data-panel-background='translucent'], [data-material='translucent']) .rt-ChatbarBox{
-  -webkit-backdrop-filter: var(--backdrop-filter-components);
-          backdrop-filter: var(--backdrop-filter-components);
-  --backdrop-filter-components: blur(var(--backdrop-blur-components));
+  backdrop-filter: var(--backdrop-filter-components);
+  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
 }
 .rt-ChatbarRoot:where([data-panel-background='solid'], [data-material='solid']) .rt-ChatbarBox{
-  -webkit-backdrop-filter: none;
-          backdrop-filter: none;
+  backdrop-filter: none;
   --backdrop-filter-components: none;
 }
 .rt-ChatbarRoot:where(.rt-r-size-1) .rt-ChatbarBox{