@womp/kookie-ui 0.13.2 → 0.13.3

package/src/components/kbd.css

@@ -20,7 +20,7 @@
   min-width: 1.75em;
   box-sizing: border-box;
   word-spacing: var(--classic-word-spacing);
-  border-radius: max(var(--radius-2), var(--radius-full));
+  border-radius: var(--radius-pill-2);
   
   /* Default sizing (size 2) */
   font-size: var(--font-size-1);
@@ -145,63 +145,63 @@
       line-height: var(--line-height-0);
       letter-spacing: var(--letter-spacing-0);
       padding: calc(var(--space-1) * 0.5) calc(var(--space-1) * 1.5);
-      border-radius: max(var(--radius-1), var(--radius-full));
+      border-radius: var(--radius-pill-1);
     }
     &:where(.rt-r-size-2) {
       font-size: var(--font-size-1);
       line-height: var(--line-height-1);
       letter-spacing: var(--letter-spacing-1);
       padding: var(--space-1) var(--space-2);
-      border-radius: max(var(--radius-2), var(--radius-full));
+      border-radius: var(--radius-pill-2);
     }
     &:where(.rt-r-size-3) {
       font-size: var(--font-size-2);
       line-height: var(--line-height-2);
       letter-spacing: var(--letter-spacing-2);
       padding: var(--space-1) calc(var(--space-2) * 1.25);
-      border-radius: max(var(--radius-2), var(--radius-full));
+      border-radius: var(--radius-pill-2);
     }
     &:where(.rt-r-size-4) {
       font-size: var(--font-size-3);
       line-height: var(--line-height-3);
       letter-spacing: var(--letter-spacing-3);
       padding: calc(var(--space-1) * 1.25) calc(var(--space-2) * 1.5);
-      border-radius: max(var(--radius-3), var(--radius-full));
+      border-radius: var(--radius-pill-3);
     }
     &:where(.rt-r-size-5) {
       font-size: var(--font-size-4);
       line-height: var(--line-height-4);
       letter-spacing: var(--letter-spacing-4);
       padding: calc(var(--space-1) * 1.5) var(--space-3);
-      border-radius: max(var(--radius-3), var(--radius-full));
+      border-radius: var(--radius-pill-3);
     }
     &:where(.rt-r-size-6) {
       font-size: var(--font-size-5);
       line-height: var(--line-height-5);
       letter-spacing: var(--letter-spacing-5);
       padding: calc(var(--space-1) * 1.75) calc(var(--space-3) * 1.25);
-      border-radius: max(var(--radius-4), var(--radius-full));
+      border-radius: var(--radius-pill-4);
     }
     &:where(.rt-r-size-7) {
       font-size: var(--font-size-6);
       line-height: var(--line-height-6);
       letter-spacing: var(--letter-spacing-6);
       padding: var(--space-2) calc(var(--space-3) * 1.5);
-      border-radius: max(var(--radius-4), var(--radius-full));
+      border-radius: var(--radius-pill-4);
     }
     &:where(.rt-r-size-8) {
       font-size: var(--font-size-7);
       line-height: var(--line-height-7);
       letter-spacing: var(--letter-spacing-7);
       padding: calc(var(--space-2) * 1.25) var(--space-4);
-      border-radius: max(var(--radius-5), var(--radius-full));
+      border-radius: var(--radius-pill-5);
     }
     &:where(.rt-r-size-9) {
       font-size: var(--font-size-8);
       line-height: var(--line-height-8);
       letter-spacing: var(--letter-spacing-8);
       padding: calc(var(--space-2) * 1.5) calc(var(--space-4) * 1.25);
-      border-radius: max(var(--radius-5), var(--radius-full));
+      border-radius: var(--radius-pill-5);
     }
   }
 }

package/src/components/progress.css

@@ -36,7 +36,6 @@
   }
 }
 
-
 .rt-ProgressIndicator {
   display: block;
   height: var(--position-full);
@@ -85,8 +84,6 @@
   }
 }
 
-
-
 /***************************************************************************************************
  *                                                                                                 *
  * SIZES                                                                                           *
@@ -115,31 +112,6 @@
       --progress-radius: var(--progress-slider-radius-4);
       --progress-indicator-radius: var(--progress-slider-radius-4);
     }
-    &:where(.rt-r-size-5) {
-      --progress-height: var(--progress-slider-height-5);
-      --progress-radius: var(--progress-slider-radius-5);
-      --progress-indicator-radius: var(--progress-slider-radius-5);
-    }
-    &:where(.rt-r-size-6) {
-      --progress-height: var(--progress-slider-height-6);
-      --progress-radius: var(--progress-slider-radius-6);
-      --progress-indicator-radius: var(--progress-slider-radius-6);
-    }
-    &:where(.rt-r-size-7) {
-      --progress-height: var(--progress-slider-height-7);
-      --progress-radius: var(--progress-slider-radius-7);
-      --progress-indicator-radius: var(--progress-slider-radius-7);
-    }
-    &:where(.rt-r-size-8) {
-      --progress-height: var(--progress-slider-height-8);
-      --progress-radius: var(--progress-slider-radius-8);
-      --progress-indicator-radius: var(--progress-slider-radius-8);
-    }
-    &:where(.rt-r-size-9) {
-      --progress-height: var(--progress-slider-height-9);
-      --progress-radius: var(--progress-slider-radius-9);
-      --progress-indicator-radius: var(--progress-slider-radius-9);
-    }
   }
 }
 
@@ -177,12 +149,6 @@
   }
 }
 
-
-
-
-
-
-
 /* soft */
 
 .rt-ProgressRoot:where(.rt-variant-soft) {
@@ -232,7 +198,3 @@
   }
 }
 
-
-
-
-

package/src/components/scroll-area.css

@@ -88,15 +88,15 @@
   .rt-ScrollAreaScrollbar {
     &:where(.rt-r-size-1) {
       --scrollarea-scrollbar-size: var(--space-1);
-      --scrollarea-scrollbar-border-radius: max(var(--radius-1), var(--radius-full));
+      --scrollarea-scrollbar-border-radius: var(--radius-pill-1);
     }
     &:where(.rt-r-size-2) {
       --scrollarea-scrollbar-size: var(--space-2);
-      --scrollarea-scrollbar-border-radius: max(var(--radius-1), var(--radius-full));
+      --scrollarea-scrollbar-border-radius: var(--radius-pill-1);
     }
     &:where(.rt-r-size-3) {
       --scrollarea-scrollbar-size: var(--space-3);
-      --scrollarea-scrollbar-border-radius: max(var(--radius-1), var(--radius-full));
+      --scrollarea-scrollbar-border-radius: var(--radius-pill-1);
     }
   }
 }

package/src/components/segmented-control.css

@@ -404,7 +404,7 @@
     }
 
     &:where(.rt-r-size-1) {
-      --segmented-control-border-radius: max(var(--radius-1), var(--radius-full));
+      --segmented-control-border-radius: var(--radius-pill-1);
       --segmented-control-height: var(--control-height-1);
       height: var(--segmented-control-height);
 
@@ -435,7 +435,7 @@
       }
     }
     &:where(.rt-r-size-2) {
-      --segmented-control-border-radius: max(var(--radius-2), var(--radius-full));
+      --segmented-control-border-radius: var(--radius-pill-2);
       --segmented-control-height: var(--control-height-2);
       height: var(--segmented-control-height);
 
@@ -466,7 +466,7 @@
       }
     }
     &:where(.rt-r-size-3) {
-      --segmented-control-border-radius: max(var(--radius-3), var(--radius-full));
+      --segmented-control-border-radius: var(--radius-pill-3);
       --segmented-control-height: var(--control-height-3);
       height: var(--segmented-control-height);
 
@@ -497,7 +497,7 @@
       }
     }
     &:where(.rt-r-size-4) {
-      --segmented-control-border-radius: max(var(--radius-4), var(--radius-full));
+      --segmented-control-border-radius: var(--radius-pill-4);
       --segmented-control-height: var(--control-height-4);
       height: var(--segmented-control-height);
 

package/src/components/select.css

@@ -191,7 +191,7 @@
       font-size: var(--font-size-1);
       line-height: var(--line-height-1);
       letter-spacing: var(--letter-spacing-1);
-      border-radius: max(var(--radius-1), var(--radius-full));
+      border-radius: var(--radius-pill-1);
 
       &:where(:not(.rt-variant-ghost)) {
         padding-left: var(--space-2);
@@ -212,7 +212,7 @@
       font-size: var(--font-size-2);
       line-height: var(--line-height-2);
       letter-spacing: var(--letter-spacing-2);
-      border-radius: max(var(--radius-2), var(--radius-full));
+      border-radius: var(--radius-pill-2);
 
       &:where(:not(.rt-variant-ghost)) {
         padding-left: var(--space-3);
@@ -233,7 +233,7 @@
       font-size: var(--font-size-3);
       line-height: var(--line-height-3);
       letter-spacing: var(--letter-spacing-3);
-      border-radius: max(var(--radius-3), var(--radius-full));
+      border-radius: var(--radius-pill-3);
 
       &:where(:not(.rt-variant-ghost)) {
         padding-left: var(--space-4);

package/src/components/shell.css

@@ -802,11 +802,16 @@
   block-size: 2px;
 }
 
-.rt-ShellResizer:hover::before,
 .rt-ShellResizer[data-dragging]::before {
   background-color: var(--gray-a6);
 }
 
+@media (hover: hover) {
+  .rt-ShellResizer:hover::before {
+    background-color: var(--gray-a6);
+  }
+}
+
 .rt-ShellResizer:focus-visible {
   outline: none;
 }

package/src/components/sidebar.css

@@ -230,19 +230,19 @@
 /* stylelint-disable-next-line selector-max-specificity */
 .rt-SidebarContainer[data-presentation='thin'] .rt-SidebarContent.rt-r-size-1 .rt-SidebarMenuIconWrapper {
   padding: var(--space-2) var(--space-2);
-  border-radius: max(var(--radius-1), var(--radius-full));
+  border-radius: var(--radius-pill-1);
 }
 
 /* stylelint-disable-next-line selector-max-specificity */
 .rt-SidebarContainer[data-presentation='thin'] .rt-SidebarContent.rt-r-size-2 .rt-SidebarMenuIconWrapper {
   padding: var(--space-2);
-  border-radius: max(var(--radius-2), var(--radius-full));
+  border-radius: var(--radius-pill-2);
 }
 
 /* stylelint-disable-next-line selector-max-specificity */
 .rt-SidebarContainer[data-presentation='thin'] .rt-SidebarContent.rt-r-size-3 .rt-SidebarMenuIconWrapper {
   padding: var(--space-3);
-  border-radius: max(var(--radius-3), var(--radius-full));
+  border-radius: var(--radius-pill-3);
 }
 
 /* Label styling in thin mode - outside the background area */
@@ -266,40 +266,70 @@
 }
 
 /* Highlighted label gets slightly darker color */
-:where(.rt-SidebarContainer[data-presentation='thin'] .rt-SidebarMenuButton:where([data-highlighted], :hover):not([data-disabled]) .rt-SidebarMenuLabel) {
+:where(.rt-SidebarContainer[data-presentation='thin'] .rt-SidebarMenuButton:where([data-highlighted]):not([data-disabled]) .rt-SidebarMenuLabel) {
   color: var(--accent-ink);
 }
 
+@media (hover: hover) {
+  :where(.rt-SidebarContainer[data-presentation='thin'] .rt-SidebarMenuButton:where(:hover):not([data-disabled]) .rt-SidebarMenuLabel) {
+    color: var(--accent-ink);
+  }
+}
+
 /* Remove background from button itself in thin mode - styles are on icon wrapper */
-:where(.rt-SidebarContainer[data-presentation='thin'] .rt-SidebarMenuButton:where([data-highlighted], :hover):not([data-disabled])),
-:where(.rt-SidebarContainer[data-presentation='thin'] .rt-SidebarMenuButton[data-active]) {
+:where(.rt-SidebarContainer[data-presentation='thin'] .rt-SidebarMenuButton:where([data-highlighted]):not([data-disabled])), :where(.rt-SidebarContainer[data-presentation='thin'] .rt-SidebarMenuButton[data-active]) {
   background-color: transparent !important;
 }
 
+@media (hover: hover) {
+  :where(.rt-SidebarContainer[data-presentation='thin'] .rt-SidebarMenuButton:where(:hover):not([data-disabled])) {
+    background-color: transparent !important;
+  }
+}
+
 /* Soft variant icon wrapper states in thin mode */
-:where(.rt-SidebarContainer[data-presentation='thin'] .rt-SidebarContent.rt-menu-variant-soft .rt-SidebarMenuButton:where([data-highlighted], :hover):not([data-disabled]) .rt-SidebarMenuIconWrapper) {
+:where(.rt-SidebarContainer[data-presentation='thin'] .rt-SidebarContent.rt-menu-variant-soft .rt-SidebarMenuButton:where([data-highlighted]):not([data-disabled]) .rt-SidebarMenuIconWrapper) {
   background-color: var(--accent-4);
 }
 
+@media (hover: hover) {
+  :where(.rt-SidebarContainer[data-presentation='thin'] .rt-SidebarContent.rt-menu-variant-soft .rt-SidebarMenuButton:where(:hover):not([data-disabled]) .rt-SidebarMenuIconWrapper) {
+    background-color: var(--accent-4);
+  }
+}
+
 :where(.rt-SidebarContainer[data-presentation='thin'] .rt-SidebarContent.rt-menu-variant-soft .rt-SidebarMenuButton[data-active] .rt-SidebarMenuIconWrapper) {
   background-color: var(--accent-3);
 }
 
 /* Translucent panel support for soft variant */
-:where([data-panel-background='translucent']) :where(.rt-SidebarContainer[data-presentation='thin'] .rt-SidebarContent.rt-menu-variant-soft .rt-SidebarMenuButton:where([data-highlighted], :hover):not([data-disabled]) .rt-SidebarMenuIconWrapper) {
+:where([data-panel-background='translucent']) :where(.rt-SidebarContainer[data-presentation='thin'] .rt-SidebarContent.rt-menu-variant-soft .rt-SidebarMenuButton:where([data-highlighted]):not([data-disabled]) .rt-SidebarMenuIconWrapper) {
   background-color: var(--accent-a4);
 }
 
+@media (hover: hover) {
+  :where([data-panel-background='translucent']) :where(.rt-SidebarContainer[data-presentation='thin'] .rt-SidebarContent.rt-menu-variant-soft .rt-SidebarMenuButton:where(:hover):not([data-disabled]) .rt-SidebarMenuIconWrapper) {
+    background-color: var(--accent-a4);
+  }
+}
+
 :where([data-panel-background='translucent']) :where(.rt-SidebarContainer[data-presentation='thin'] .rt-SidebarContent.rt-menu-variant-soft .rt-SidebarMenuButton[data-active] .rt-SidebarMenuIconWrapper) {
   background-color: var(--accent-a3);
 }
 
 /* Solid variant icon wrapper states in thin mode */
-:where(.rt-SidebarContainer[data-presentation='thin'] .rt-SidebarContent.rt-menu-variant-solid .rt-SidebarMenuButton:where([data-highlighted], :hover):not([data-disabled]) .rt-SidebarMenuIconWrapper) {
+:where(.rt-SidebarContainer[data-presentation='thin'] .rt-SidebarContent.rt-menu-variant-solid .rt-SidebarMenuButton:where([data-highlighted]):not([data-disabled]) .rt-SidebarMenuIconWrapper) {
   background-color: var(--accent-solid);
   color: var(--accent-solid-contrast);
 }
 
+@media (hover: hover) {
+  :where(.rt-SidebarContainer[data-presentation='thin'] .rt-SidebarContent.rt-menu-variant-solid .rt-SidebarMenuButton:where(:hover):not([data-disabled]) .rt-SidebarMenuIconWrapper) {
+    background-color: var(--accent-solid);
+    color: var(--accent-solid-contrast);
+  }
+}
+
 :where(.rt-SidebarContainer[data-presentation='thin'] .rt-SidebarContent.rt-menu-variant-solid .rt-SidebarMenuButton[data-active] .rt-SidebarMenuIconWrapper) {
   background-color: var(--accent-solid);
   color: var(--accent-solid-contrast);
@@ -786,7 +816,7 @@
   }
 
   /* Hover/highlighted state for solid variant - EXACT match to base menu */
-  & :where(.rt-SidebarMenuButton:where([data-highlighted], :hover):not([data-disabled])) {
+  & :where(.rt-SidebarMenuButton:where([data-highlighted]):not([data-disabled])) {
     background-color: var(--accent-solid);
     color: var(--accent-solid-contrast);
 
@@ -811,6 +841,33 @@
     }
   }
 
+  @media (hover: hover) {
+    & :where(.rt-SidebarMenuButton:where(:hover):not([data-disabled])) {
+      background-color: var(--accent-solid);
+      color: var(--accent-solid-contrast);
+  
+      & :where(.rt-BaseMenuSubTriggerIcon) {
+        color: var(--accent-solid-contrast);
+      }
+  
+      /* Force all text elements to inherit hover color, including those with color="gray" */
+      & :where(.rt-Text) {
+        color: inherit !important;
+      }
+  
+      /* Also target any element with data-accent-color="gray" */
+      & :where([data-accent-color='gray']:not(.rt-Badge)) {
+        color: inherit !important;
+      }
+  
+      /* FIX: Ensure badges maintain their own styling and don't inherit hover colors */
+      & :where(.rt-Badge) {
+        color: var(--accent-solid-badge-contrast) !important;
+        background-color: var(--accent-solid-badge) !important;
+      }
+    }
+  }
+
   /* Active navigation state for solid variant - same as highlighted */
   & :where(.rt-SidebarMenuButton[data-active]) {
     background-color: var(--accent-solid);
@@ -888,7 +945,7 @@
   }
 
   /* Hover/highlighted state for soft variant - EXACT match to base menu */
-  & :where(.rt-SidebarMenuButton:where([data-highlighted], :hover):not([data-disabled])) {
+  & :where(.rt-SidebarMenuButton:where([data-highlighted]):not([data-disabled])) {
     /* Base state: solid accent for solid panels */
     background-color: var(--accent-4);
 
@@ -914,6 +971,34 @@
     }
   }
 
+  @media (hover: hover) {
+    & :where(.rt-SidebarMenuButton:where(:hover):not([data-disabled])) {
+      /* Base state: solid accent for solid panels */
+      background-color: var(--accent-4);
+  
+      /* Theme-level translucent override */
+      :where([data-panel-background='translucent']) & {
+        background-color: var(--accent-a4);
+      }
+  
+      /* Component-level overrides (higher specificity) */
+      &:where([data-panel-background='solid']) {
+        background-color: var(--accent-4);
+        backdrop-filter: none;
+        --backdrop-filter-components: none;
+      }
+  
+      &:where([data-panel-background='translucent']) {
+        background-color: var(--accent-a4);
+      }
+  
+      /* In soft variant, lift muted text a step while keeping the hierarchy */
+      & :where(.rt-Text.rt-emphasis-medium:where(:not([data-accent-color]), [data-accent-color='gray'])) {
+        color: var(--gray-11) !important;
+      }
+    }
+  }
+
   /* Active navigation state for soft variant - use accent-3 like sub-trigger */
   & :where(.rt-SidebarMenuButton[data-active]) {
     /* Base state: solid accent for solid panels */
@@ -1038,42 +1123,54 @@
 }
 
 /* Remove hover background from thin trigger button itself (styles live on icon wrapper) */
-:where(.rt-SidebarContainer[data-presentation='thin']) :where(.rt-SidebarSearchTrigger:where(:hover, [data-state='open'])) {
+:where(.rt-SidebarContainer[data-presentation='thin']) :where(.rt-SidebarSearchTrigger:where([data-state='open'])) {
   background-color: transparent !important;
 }
 
+@media (hover: hover) {
+  :where(.rt-SidebarContainer[data-presentation='thin']) :where(.rt-SidebarSearchTrigger:where(:hover)) {
+    background-color: transparent !important;
+  }
+}
+
 /* Search trigger icon wrapper - size-specific padding (mirrors Content-scoped rules) */
 /* stylelint-disable-next-line selector-max-specificity */
 .rt-SidebarContainer[data-presentation='thin'].rt-r-size-1 .rt-SidebarSearchTrigger .rt-SidebarMenuIconWrapper {
   padding: var(--space-2) var(--space-2);
-  border-radius: max(var(--radius-1), var(--radius-full));
+  border-radius: var(--radius-pill-1);
 }
 
 /* stylelint-disable-next-line selector-max-specificity */
 .rt-SidebarContainer[data-presentation='thin'].rt-r-size-2 .rt-SidebarSearchTrigger .rt-SidebarMenuIconWrapper {
   padding: var(--space-2);
-  border-radius: max(var(--radius-2), var(--radius-full));
+  border-radius: var(--radius-pill-2);
 }
 
 /* stylelint-disable-next-line selector-max-specificity */
 .rt-SidebarContainer[data-presentation='thin'].rt-r-size-3 .rt-SidebarSearchTrigger .rt-SidebarMenuIconWrapper {
   padding: var(--space-3);
-  border-radius: max(var(--radius-3), var(--radius-full));
+  border-radius: var(--radius-pill-3);
 }
 
 /* Search trigger icon wrapper hover (soft variant) */
-:where(.rt-SidebarContainer[data-presentation='thin'].rt-menu-variant-soft) :where(.rt-SidebarSearchTrigger:where(:hover):not([data-disabled]) .rt-SidebarMenuIconWrapper) {
-  background-color: var(--accent-4);
+@media (hover: hover) {
+  :where(.rt-SidebarContainer[data-presentation='thin'].rt-menu-variant-soft) :where(.rt-SidebarSearchTrigger:where(:hover):not([data-disabled]) .rt-SidebarMenuIconWrapper) {
+    background-color: var(--accent-4);
+  }
 }
 
-:where([data-panel-background='translucent']) :where(.rt-SidebarContainer[data-presentation='thin'].rt-menu-variant-soft) :where(.rt-SidebarSearchTrigger:where(:hover):not([data-disabled]) .rt-SidebarMenuIconWrapper) {
-  background-color: var(--accent-a4);
+@media (hover: hover) {
+  :where([data-panel-background='translucent']) :where(.rt-SidebarContainer[data-presentation='thin'].rt-menu-variant-soft) :where(.rt-SidebarSearchTrigger:where(:hover):not([data-disabled]) .rt-SidebarMenuIconWrapper) {
+    background-color: var(--accent-a4);
+  }
 }
 
 /* Search trigger icon wrapper hover (solid variant) */
-:where(.rt-SidebarContainer[data-presentation='thin'].rt-menu-variant-solid) :where(.rt-SidebarSearchTrigger:where(:hover):not([data-disabled]) .rt-SidebarMenuIconWrapper) {
-  background-color: var(--accent-solid);
-  color: var(--accent-solid-contrast);
+@media (hover: hover) {
+  :where(.rt-SidebarContainer[data-presentation='thin'].rt-menu-variant-solid) :where(.rt-SidebarSearchTrigger:where(:hover):not([data-disabled]) .rt-SidebarMenuIconWrapper) {
+    background-color: var(--accent-solid);
+    color: var(--accent-solid-contrast);
+  }
 }
 
 /* Popover inner wrapper - provide base menu tokens for portal-rendered items */
@@ -1139,9 +1236,11 @@
 }
 
 /* Popover menu button hover (soft variant) */
-/* stylelint-disable-next-line selector-max-specificity */
-.rt-SidebarSearchPopover .rt-SidebarMenuButton:where(:hover):not([data-disabled]) {
-  background-color: var(--accent-a4);
+@media (hover: hover) {
+  /* stylelint-disable-next-line selector-max-specificity */
+  .rt-SidebarSearchPopover .rt-SidebarMenuButton:where(:hover):not([data-disabled]) {
+    background-color: var(--accent-a4);
+  }
 }
 
 /* Popover menu button focus (arrow-key navigation) */
@@ -1213,9 +1312,11 @@
   transition: color 100ms;
 }
 
-/* stylelint-disable-next-line selector-max-specificity */
-.rt-SidebarSearchClear:hover {
-  color: var(--gray-a11);
+@media (hover: hover) {
+  /* stylelint-disable-next-line selector-max-specificity */
+  .rt-SidebarSearchClear:hover {
+    color: var(--gray-a11);
+  }
 }
 
 /* Size-specific overrides (need real selectors to beat base .rt-SidebarSearchIcon / .rt-SidebarSearchInput) */

package/src/components/slider.css

@@ -321,14 +321,16 @@
   pointer-events: auto;
 }
 
-.rt-SliderTick:where(:hover) {
-  :where(.rt-SliderTickMark) {
-    background-color: var(--gray-12) !important;
-  }
-  
-  :where(.rt-SliderTickLabel) {
-    color: var(--gray-12) !important;
-    font-weight: var(--font-weight-medium);
+@media (hover: hover) {
+  .rt-SliderTick:where(:hover) {
+    :where(.rt-SliderTickMark) {
+      background-color: var(--gray-12) !important;
+    }
+    
+    :where(.rt-SliderTickLabel) {
+      color: var(--gray-12) !important;
+      font-weight: var(--font-weight-medium);
+    }
   }
 }
 

package/src/components/table.css

@@ -89,26 +89,6 @@
         line-height: var(--line-height-3);
       }
     }
-    &:where(.rt-r-size-4) {
-      --table-border-radius: min(var(--radius-surface-8), calc(var(--radius-surface-4) + var(--space-4)));
-      --table-cell-padding: var(--space-5);
-      --table-cell-min-height: var(--space-9);
-
-      & :where(.rt-TableRootTable) {
-        font-size: var(--font-size-3);
-        line-height: var(--line-height-3);
-      }
-    }
-    &:where(.rt-r-size-5) {
-      --table-border-radius: min(var(--radius-surface-9), calc(var(--radius-surface-5) + var(--space-5)));
-      --table-cell-padding: var(--space-6);
-      --table-cell-min-height: var(--space-10);
-
-      & :where(.rt-TableRootTable) {
-        font-size: var(--font-size-4);
-        line-height: var(--line-height-4);
-      }
-    }
   }
 }
 

package/src/components/text-field.css

@@ -106,8 +106,10 @@
   &:where(:not([type='time']))::-webkit-calendar-picker-indicator {
     margin-left: var(--space-1);
   }
-  &::-webkit-calendar-picker-indicator:where(:hover) {
-    background-color: var(--gray-a3);
+  @media (hover: hover) {
+    &::-webkit-calendar-picker-indicator:where(:hover) {
+      background-color: var(--gray-a3);
+    }
   }
   &::-webkit-calendar-picker-indicator:where(:focus-visible) {
     outline: 2px solid var(--text-field-focus-color);
@@ -216,7 +218,7 @@
     &:where(.rt-r-size-1) {
       --text-field-height: var(--control-height-1);
       --text-field-padding: calc(var(--space-1) * 1.5 - var(--text-field-border-width));
-      --text-field-border-radius: max(var(--radius-1), var(--radius-full));
+      --text-field-border-radius: var(--radius-pill-1);
       --text-field-native-icon-size: var(--space-3);
       font-size: var(--font-size-1);
       letter-spacing: var(--letter-spacing-1);
@@ -249,7 +251,7 @@
     &:where(.rt-r-size-2) {
       --text-field-height: var(--control-height-2);
       --text-field-padding: calc(var(--space-2) - var(--text-field-border-width));
-      --text-field-border-radius: max(var(--radius-2), var(--radius-full));
+      --text-field-border-radius: var(--radius-pill-2);
       --text-field-native-icon-size: var(--space-4);
       font-size: var(--font-size-2);
       letter-spacing: var(--letter-spacing-2);
@@ -283,7 +285,7 @@
     &:where(.rt-r-size-3) {
       --text-field-height: var(--control-height-3);
       --text-field-padding: calc(var(--space-3) - var(--text-field-border-width));
-      --text-field-border-radius: max(var(--radius-3), var(--radius-full));
+      --text-field-border-radius: var(--radius-pill-3);
       --text-field-native-icon-size: var(--space-4);
       font-size: var(--font-size-3);
       letter-spacing: var(--letter-spacing-3);

package/src/components/theme.tsx

@@ -85,11 +85,14 @@ function useThemeContext() {
 interface ThemeProps extends ThemeImplPublicProps {}
 const Theme = React.forwardRef<ThemeImplElement, ThemeProps>((props, forwardedRef) => {
   const context = React.useContext(ThemeContext);
+  // Direction is inherited: a Radix DirectionProvider above the Theme (for a right-to-left app)
+  // wins, and left-to-right stays the default when there is none.
+  const dir = Direction.useDirection();
   const isRoot = context === undefined;
   if (isRoot) {
     return (
       <TooltipPrimitive.Provider delayDuration={200}>
-        <Direction.Provider dir="ltr">
+        <Direction.Provider dir={dir}>
           <ThemeRoot {...props} ref={forwardedRef} />
         </Direction.Provider>
       </TooltipPrimitive.Provider>