@womp/kookie-ui 0.35.1 → 0.35.3

package/styles.css

@@ -3370,8 +3370,8 @@
   --component-gap-ghost-2: calc(var(--space-2) * 1.5);
   --component-gap-ghost-3: calc(var(--space-2) * 1.5);
   --component-gap-ghost-4: var(--space-3);
-  --focus-outline-width: 2px;
-  --focus-outline-offset: 2px;
+  --focus-outline-width: var(--focus-ring-width);
+  --focus-outline-offset: var(--focus-ring-offset);
   --focus-outline-offset-inset: -1px;
   --padding-ratio-horizontal: 1.5;
   --color-page: white;
@@ -6117,7 +6117,7 @@
   }
 }
 :where(.kui-AccordionTrigger:focus-visible) {
-  outline: var(--focus-outline-width) solid var(--focus-8);
+  outline: var(--focus-ring-width) solid var(--focus-8);
   outline-offset: var(--focus-outline-offset-inset);
 }
 .kui-AccordionContent {
@@ -6247,7 +6247,7 @@
     border: 1px solid CanvasText;
   }
   :where(.kui-AccordionTrigger:focus-visible) {
-    outline: 2px solid CanvasText;
+    outline: var(--focus-ring-width) solid CanvasText;
     outline-offset: 2px;
   }
   :where(.kui-AccordionItem:not(:last-child)) {
@@ -6559,8 +6559,8 @@
   cursor: pointer;
 }
 :is(.kui-AvatarRoot:where(button),.kui-AvatarRoot:where(a),.kui-AvatarRoot:where([role='button'])):where(:focus-visible) {
-  outline: var(--focus-outline-width) solid var(--focus-8);
-  outline-offset: var(--focus-outline-offset);
+  outline: var(--focus-ring-width) solid var(--focus-8);
+  outline-offset: var(--focus-ring-offset);
 }
 :is(.kui-AvatarRoot:where(button),.kui-AvatarRoot:where(a),.kui-AvatarRoot:where([role='button'])):where(:disabled),:is(.kui-AvatarRoot:where(button),.kui-AvatarRoot:where(a),.kui-AvatarRoot:where([role='button'])):where([data-disabled]) {
   cursor: default;
@@ -8644,7 +8644,7 @@
   background-color: var(--v-bg);
 }
 .kui-BaseCard:where(.kui-variant-outline,.kui-variant-soft,.kui-variant-surface):where(:focus-visible) {
-  outline: 2px solid var(--v-focus-color);
+  outline: var(--focus-ring-width) solid var(--v-focus-color);
   outline-offset: var(--v-focus-offset);
 }
 .kui-BaseCard:where(.kui-variant-outline,.kui-variant-soft,.kui-variant-surface):where(:focus-visible)::after {
@@ -8742,7 +8742,7 @@
   --v-focus-offset: -1px;
 }
 .kui-BaseCard:where(.kui-variant-ghost):where(:focus-visible) {
-  outline: 2px solid var(--v-focus-color);
+  outline: var(--focus-ring-width) solid var(--v-focus-color);
   outline-offset: var(--v-focus-offset);
 }
 @media (hover: hover) {
@@ -8807,7 +8807,7 @@
           box-shadow: none;
 }
 .kui-BaseCard:where(.kui-variant-raised):where(:focus-visible) {
-  outline: 2px solid var(--focus-8);
+  outline: var(--focus-ring-width) solid var(--focus-8);
   outline-offset: 2px;
 }
 @media (hover: hover) {
@@ -8889,7 +8889,7 @@
   --base-card-border-radius: var(--kui-sf-r);
 }
 .kui-Card:where(:focus-visible) {
-  outline: 2px solid var(--focus-8);
+  outline: var(--focus-ring-width) solid var(--focus-8);
   outline-offset: -1px;
 }
 .kui-Card:where(:focus-visible)::after {
@@ -10144,7 +10144,7 @@
 }
 @media (forced-colors: active) {
   .kui-BaseMenuItem:where(:focus-visible) {
-    outline: 2px solid Highlight;
+    outline: var(--focus-ring-width) solid Highlight;
     outline-offset: 2px;
   }
   .kui-BaseMenuContent:not(:where(.kui-SidebarContent)) {
@@ -10354,7 +10354,7 @@
 }
 @media (forced-colors: active) {
   .kui-CommandItem:where([data-selected='true']) {
-    outline: 2px solid Highlight;
+    outline: var(--focus-ring-width) solid Highlight;
     outline-offset: -2px;
   }
   .kui-CommandSearch {
@@ -10514,13 +10514,13 @@
 }
 @supports selector(:has(*)) {
   .kui-TextFieldRoot:where(:has(.kui-TextFieldInput:focus)) {
-    outline: 2px solid var(--text-field-focus-color);
+    outline: var(--focus-ring-width) solid var(--text-field-focus-color);
     outline-offset: -1px;
   }
 }
 @supports not selector(:has(*)) {
   .kui-TextFieldRoot:where(:focus-within) {
-    outline: 2px solid var(--text-field-focus-color);
+    outline: var(--focus-ring-width) solid var(--text-field-focus-color);
     outline-offset: -1px;
   }
 }
@@ -10583,7 +10583,7 @@
   }
 }
 .kui-TextFieldInput::-webkit-calendar-picker-indicator:where(:focus-visible) {
-  outline: 2px solid var(--text-field-focus-color);
+  outline: var(--focus-ring-width) solid var(--text-field-focus-color);
 }
 :is(.kui-TextFieldInput::-webkit-datetime-edit-ampm-field,.kui-TextFieldInput::-webkit-datetime-edit-day-field,.kui-TextFieldInput::-webkit-datetime-edit-hour-field,.kui-TextFieldInput::-webkit-datetime-edit-millisecond-field,.kui-TextFieldInput::-webkit-datetime-edit-minute-field,.kui-TextFieldInput::-webkit-datetime-edit-month-field,.kui-TextFieldInput::-webkit-datetime-edit-second-field,.kui-TextFieldInput::-webkit-datetime-edit-week-field,.kui-TextFieldInput::-webkit-datetime-edit-year-field):where(:focus) {
   background-color: var(--text-field-selection-color);
@@ -11884,7 +11884,7 @@
 }
 @media (forced-colors: active) {
   .kui-ComboboxItem:where([data-selected='true']) {
-    outline: 2px solid Highlight;
+    outline: var(--focus-ring-width) solid Highlight;
     outline-offset: -2px;
   }
 }
@@ -12337,10 +12337,10 @@
           box-shadow: inset 0 var(--raised-border-width) var(--black-a3), 0 0 0 var(--raised-border-width) var(--neutral-a7);
 }
 .kui-Kbd:where(.kui-variant-raised):where(:-moz-any-link,button):where(:focus-visible) {
-  outline: 2px solid var(--focus-8);
+  outline: var(--focus-ring-width) solid var(--focus-8);
 }
 .kui-Kbd:where(.kui-variant-raised):where(:any-link,button):where(:focus-visible) {
-  outline: 2px solid var(--focus-8);
+  outline: var(--focus-ring-width) solid var(--focus-8);
 }
 .kui-Kbd:where(.kui-variant-soft) {
   background-color: var(--neutral-a3);
@@ -12366,10 +12366,10 @@
   background-color: var(--neutral-a5);
 }
 .kui-Kbd:where(.kui-variant-soft):where(:-moz-any-link,button):where(:focus-visible) {
-  outline: 2px solid var(--focus-8);
+  outline: var(--focus-ring-width) solid var(--focus-8);
 }
 .kui-Kbd:where(.kui-variant-soft):where(:any-link,button):where(:focus-visible) {
-  outline: 2px solid var(--focus-8);
+  outline: var(--focus-ring-width) solid var(--focus-8);
 }
 .kui-Kbd:where(.kui-r-size-1) {
   font-size: var(--font-size-1);
@@ -13493,7 +13493,7 @@
   position: absolute;
   inset: 0;
   pointer-events: none;
-  outline: 2px solid var(--focus-8);
+  outline: var(--focus-ring-width) solid var(--focus-8);
   outline-offset: -2px;
 }
 :where(.kui-ScrollAreaRoot:has(> .kui-ScrollAreaScrollbar[data-orientation='horizontal'])) > .kui-ScrollAreaViewport {
@@ -14902,7 +14902,7 @@
   font-weight: var(--font-weight-medium);
 }
 .kui-SelectTrigger:where(:focus-visible) {
-  outline: var(--focus-outline-width) solid var(--focus-8);
+  outline: var(--focus-ring-width) solid var(--focus-8);
   outline-offset: var(--focus-outline-offset-inset);
 }
 .kui-SelectTriggerInner {
@@ -15361,7 +15361,7 @@
           box-shadow: var(--field-chrome);
 }
 .kui-SelectTrigger:where(.kui-variant-raised):where(:focus-visible) {
-  outline: 2px solid var(--focus-8);
+  outline: var(--focus-ring-width) solid var(--focus-8);
   outline-offset: 2px;
 }
 @media (hover: hover) {
@@ -15388,7 +15388,7 @@
   color: var(--accent-ink);
 }
 .kui-SelectTrigger:where(.kui-variant-soft):where(:focus-visible) {
-  outline: 2px solid var(--accent-8);
+  outline: var(--focus-ring-width) solid var(--accent-8);
   outline-offset: -1px;
 }
 @media (hover: hover) {
@@ -15426,7 +15426,7 @@
   }
 }
 .kui-SelectTrigger:where(.kui-variant-ghost):where(:focus-visible) {
-  outline: 2px solid var(--focus-8);
+  outline: var(--focus-ring-width) solid var(--focus-8);
   outline-offset: -1px;
 }
 .kui-SelectTrigger:where(.kui-variant-ghost):where([data-state='open']) {
@@ -15463,7 +15463,7 @@
           box-shadow: inset 0 0 0 1px var(--accent-8);
 }
 .kui-SelectTrigger:where(.kui-variant-outline):where(:focus-visible) {
-  outline: 2px solid var(--focus-8);
+  outline: var(--focus-ring-width) solid var(--focus-8);
   outline-offset: -1px;
 }
 .kui-SelectTrigger:where(.kui-variant-outline):where(:disabled) {
@@ -15501,7 +15501,7 @@
           box-shadow: inset 0 0 0 1px var(--accent-8);
 }
 .kui-SelectTrigger:where(.kui-variant-surface):where(:focus-visible) {
-  outline: 2px solid var(--focus-8);
+  outline: var(--focus-ring-width) solid var(--focus-8);
   outline-offset: -1px;
 }
 .kui-SelectTrigger:where(.kui-variant-surface):where(:disabled) {
@@ -15825,7 +15825,7 @@
   color: var(--accent-a12);
 }
 .kui-SidebarMenuButton:where(:focus-visible) {
-  outline: 2px solid var(--focus-8);
+  outline: var(--focus-ring-width) solid var(--focus-8);
   outline-offset: 2px;
 }
 .kui-SidebarMenuButton:where([data-accent-color]) {
@@ -15965,117 +15965,31 @@
   margin-top: 1px;
   margin-bottom: 1px;
 }
-:where(.kui-ShellRailContent :is(.kui-SidebarContent, .kui-ShellPaneHeader, .kui-ShellPaneFooter).kui-r-size-1) :where(.kui-SidebarMenuButton, .kui-SidebarMenuSubTrigger) {
+:where(.kui-ShellRailContent :is(.kui-SidebarContent, .kui-ShellPaneHeader, .kui-ShellPaneFooter):is(.kui-r-size-1, .kui-r-size-2)) :where(.kui-SidebarMenuButton, .kui-SidebarMenuSubTrigger) {
   padding-top: var(--space-2) !important;
   padding-bottom: var(--space-2) !important;
-  -webkit-box-pack: center;
-      -ms-flex-pack: center;
-          justify-content: center;
-  -webkit-box-align: center;
-      -ms-flex-align: center;
-          align-items: center;
-  -webkit-box-orient: vertical;
-  -webkit-box-direction: normal;
-      -ms-flex-direction: column;
-          flex-direction: column;
-  gap: var(--space-2);
-  text-align: center;
-  font-size: var(--font-size-1);
-  line-height: var(--line-height-1);
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  max-width: 100%;
-  min-width: 0;
-}
-:where(.kui-ShellRailContent :is(.kui-SidebarContent, .kui-ShellPaneHeader, .kui-ShellPaneFooter).kui-r-size-2) :where(.kui-SidebarMenuButton, .kui-SidebarMenuSubTrigger) {
-  padding-top: var(--space-2) !important;
-  padding-bottom: var(--space-2) !important;
-  -webkit-box-pack: center;
-      -ms-flex-pack: center;
-          justify-content: center;
-  -webkit-box-align: center;
-      -ms-flex-align: center;
-          align-items: center;
-  -webkit-box-orient: vertical;
-  -webkit-box-direction: normal;
-      -ms-flex-direction: column;
-          flex-direction: column;
-  gap: var(--space-2);
-  text-align: center;
-  font-size: var(--font-size-1);
-  line-height: var(--line-height-1);
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  max-width: 100%;
-  min-width: 0;
 }
 :where(.kui-ShellRailContent :is(.kui-SidebarContent, .kui-ShellPaneHeader, .kui-ShellPaneFooter).kui-r-size-3) :where(.kui-SidebarMenuButton, .kui-SidebarMenuSubTrigger) {
   padding-top: var(--space-3) !important;
   padding-bottom: var(--space-3) !important;
-  -webkit-box-pack: center;
-      -ms-flex-pack: center;
-          justify-content: center;
-  -webkit-box-align: center;
-      -ms-flex-align: center;
-          align-items: center;
-  -webkit-box-orient: vertical;
-  -webkit-box-direction: normal;
-      -ms-flex-direction: column;
-          flex-direction: column;
-  gap: var(--space-2);
-  text-align: center;
-  font-size: var(--font-size-1);
-  line-height: var(--line-height-1);
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  max-width: 100%;
-  min-width: 0;
 }
-:where(.kui-ShellRailContent :is(.kui-SidebarContent, .kui-ShellPaneHeader, .kui-ShellPaneFooter).kui-r-size-1) {
+:where(.kui-ShellRailContent :is(.kui-SidebarContent, .kui-ShellPaneHeader, .kui-ShellPaneFooter):is(.kui-r-size-1, .kui-r-size-2, .kui-r-size-3)) {
   --base-menu-item-padding-left: var(--space-2) !important;
   --base-menu-item-padding-right: var(--space-2) !important;
   --base-menu-item-padding-y: var(--space-3) !important;
 }
-:where(.kui-ShellRailContent :is(.kui-SidebarContent,.kui-ShellPaneHeader,.kui-ShellPaneFooter).kui-r-size-1):where(:not(:has(.kui-BaseMenuCheckboxItem,.kui-BaseMenuRadioItem))) {
-  --base-menu-item-padding-left: var(--space-2) !important;
-}
-:where(.kui-ShellRailContent :is(.kui-SidebarContent,.kui-ShellPaneHeader,.kui-ShellPaneFooter).kui-r-size-1):where(:has(.kui-BaseMenuCheckboxItem,.kui-BaseMenuRadioItem)) {
-  --base-menu-item-padding-left: var(--space-2) !important;
+:where(.kui-ShellRailContent :is(.kui-SidebarContent,.kui-ShellPaneHeader,.kui-ShellPaneFooter):is(.kui-r-size-1,.kui-r-size-2,.kui-r-size-3)) :where(.kui-SidebarMenuButton,.kui-SidebarMenuSubTrigger) {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 100%;
+  min-width: 0;
 }
-:where(.kui-ShellRailContent :is(.kui-SidebarContent,.kui-ShellPaneHeader,.kui-ShellPaneFooter).kui-r-size-1) :where(.kui-SidebarMenuButton,.kui-SidebarMenuSubTrigger) :where(svg) {
+:where(.kui-ShellRailContent :is(.kui-SidebarContent, .kui-ShellPaneHeader, .kui-ShellPaneFooter).kui-r-size-1) :where(.kui-SidebarMenuButton, .kui-SidebarMenuSubTrigger) :where(svg) {
   width: var(--content-icon-size-3);
   height: var(--content-icon-size-3);
 }
-:where(.kui-ShellRailContent :is(.kui-SidebarContent, .kui-ShellPaneHeader, .kui-ShellPaneFooter).kui-r-size-2) {
-  --base-menu-item-padding-left: var(--space-2) !important;
-  --base-menu-item-padding-right: var(--space-2) !important;
-  --base-menu-item-padding-y: var(--space-3) !important;
-}
-:where(.kui-ShellRailContent :is(.kui-SidebarContent,.kui-ShellPaneHeader,.kui-ShellPaneFooter).kui-r-size-2):where(:not(:has(.kui-BaseMenuCheckboxItem,.kui-BaseMenuRadioItem))) {
-  --base-menu-item-padding-left: var(--space-2) !important;
-}
-:where(.kui-ShellRailContent :is(.kui-SidebarContent,.kui-ShellPaneHeader,.kui-ShellPaneFooter).kui-r-size-2):where(:has(.kui-BaseMenuCheckboxItem,.kui-BaseMenuRadioItem)) {
-  --base-menu-item-padding-left: var(--space-2) !important;
-}
-:where(.kui-ShellRailContent :is(.kui-SidebarContent,.kui-ShellPaneHeader,.kui-ShellPaneFooter).kui-r-size-2) :where(.kui-SidebarMenuButton,.kui-SidebarMenuSubTrigger) :where(svg) {
-  width: var(--content-icon-size-4);
-  height: var(--content-icon-size-4);
-}
-:where(.kui-ShellRailContent :is(.kui-SidebarContent, .kui-ShellPaneHeader, .kui-ShellPaneFooter).kui-r-size-3) {
-  --base-menu-item-padding-left: var(--space-2) !important;
-  --base-menu-item-padding-right: var(--space-2) !important;
-  --base-menu-item-padding-y: var(--space-3) !important;
-}
-:where(.kui-ShellRailContent :is(.kui-SidebarContent,.kui-ShellPaneHeader,.kui-ShellPaneFooter).kui-r-size-3):where(:not(:has(.kui-BaseMenuCheckboxItem,.kui-BaseMenuRadioItem))) {
-  --base-menu-item-padding-left: var(--space-2) !important;
-}
-:where(.kui-ShellRailContent :is(.kui-SidebarContent,.kui-ShellPaneHeader,.kui-ShellPaneFooter).kui-r-size-3):where(:has(.kui-BaseMenuCheckboxItem,.kui-BaseMenuRadioItem)) {
-  --base-menu-item-padding-left: var(--space-2) !important;
-}
-:where(.kui-ShellRailContent :is(.kui-SidebarContent,.kui-ShellPaneHeader,.kui-ShellPaneFooter).kui-r-size-3) :where(.kui-SidebarMenuButton,.kui-SidebarMenuSubTrigger) :where(svg) {
+:where(.kui-ShellRailContent :is(.kui-SidebarContent, .kui-ShellPaneHeader, .kui-ShellPaneFooter):is(.kui-r-size-2, .kui-r-size-3)) :where(.kui-SidebarMenuButton, .kui-SidebarMenuSubTrigger) :where(svg) {
   width: var(--content-icon-size-4);
   height: var(--content-icon-size-4);
 }
@@ -16186,17 +16100,7 @@
 :where(.kui-ShellRailContent :is(.kui-SidebarContent, .kui-ShellPaneHeader, .kui-ShellPaneFooter).kui-menu-variant-soft .kui-SidebarMenuButton[data-active] .kui-SidebarMenuIconWrapper) {
   background-color: var(--accent-3);
 }
-:where(.kui-ShellRailContent .kui-SidebarMenuBadge),
-:where(.kui-ShellRailContent .kui-SidebarMenuShortcut),
-:where(.kui-ShellRailContent .kui-Chip),
-:where(.kui-ShellRailContent .kui-Kbd) {
-  display: none !important;
-}
-:where(.kui-ShellRailContent .kui-SidebarGroupLabel) {
-  display: none !important;
-}
-:where(.kui-ShellRailContent .kui-SidebarMenuSubTriggerIcon),
-:where(.kui-ShellRailContent .kui-BaseMenuSubTriggerIcon) {
+:where(.kui-ShellRailContent) :where(.kui-SidebarMenuBadge, .kui-SidebarMenuShortcut, .kui-Chip, .kui-Kbd, .kui-SidebarGroupLabel, .kui-SidebarMenuSubTriggerIcon, .kui-BaseMenuSubTriggerIcon) {
   display: none !important;
 }
 .kui-SidebarMenuLabel {
@@ -16205,7 +16109,8 @@
   text-overflow: ellipsis;
   white-space: nowrap;
 }
-.kui-SidebarHeader:where(.kui-SidebarHeader--container) {
+.kui-SidebarHeader:where(.kui-SidebarHeader--container),
+.kui-SidebarFooter:where(.kui-SidebarFooter--container) {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
@@ -16220,12 +16125,12 @@
   padding: var(--sidebar-base-padding);
   min-height: var(--sidebar-item-height);
 }
-.kui-SidebarHeader:where(.kui-SidebarHeader--container) :where(.kui-SidebarMenuButton) {
+:is(.kui-SidebarHeader:where(.kui-SidebarHeader--container),.kui-SidebarFooter:where(.kui-SidebarFooter--container)) :where(.kui-SidebarMenuButton) {
   -webkit-box-flex: 1;
       -ms-flex: 1;
           flex: 1;
 }
-.kui-SidebarHeader:where(.kui-SidebarHeader--container) > :where(.kui-Toolbar) {
+:is(.kui-SidebarHeader:where(.kui-SidebarHeader--container),.kui-SidebarFooter:where(.kui-SidebarFooter--container)) > :where(.kui-Toolbar) {
   -webkit-box-flex: 1;
       -ms-flex: 1;
           flex: 1;
@@ -16233,31 +16138,6 @@
 .kui-SidebarHeader:where(.kui-SidebarHeader--container:not([data-float]):has(+ .kui-ShellScroll)) {
   padding-bottom: 0;
 }
-.kui-SidebarFooter:where(.kui-SidebarFooter--container) {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-orient: horizontal;
-  -webkit-box-direction: normal;
-      -ms-flex-direction: row;
-          flex-direction: row;
-  -webkit-box-align: center;
-      -ms-flex-align: center;
-          align-items: center;
-  gap: var(--space-3);
-  padding: var(--sidebar-base-padding);
-  min-height: var(--sidebar-item-height);
-}
-.kui-SidebarFooter:where(.kui-SidebarFooter--container) :where(.kui-SidebarMenuButton) {
-  -webkit-box-flex: 1;
-      -ms-flex: 1;
-          flex: 1;
-}
-.kui-SidebarFooter:where(.kui-SidebarFooter--container) > :where(.kui-Toolbar) {
-  -webkit-box-flex: 1;
-      -ms-flex: 1;
-          flex: 1;
-}
 :where(.kui-ShellScroll) + .kui-SidebarFooter:where(.kui-SidebarFooter--container:not([data-float])) {
   padding-top: 0;
 }
@@ -16295,7 +16175,7 @@
           justify-content: flex-start;
 }
 :is(.kui-SidebarHeader :where(.kui-SidebarMenuButton),.kui-SidebarFooter :where(.kui-SidebarMenuButton)):where(:focus-visible) {
-  outline: 2px solid var(--focus-8);
+  outline: var(--focus-ring-width) solid var(--focus-8);
   outline-offset: 2px;
 }
 .kui-SidebarMenuSubTriggerIcon {
@@ -16873,7 +16753,7 @@
 :where(.kui-ShellRailContent) .kui-SidebarSearch {
   padding: var(--space-3);
 }
-.kui-SidebarSearch--expanded .kui-SidebarSearchInputWrapper {
+:is(.kui-SidebarSearch--expanded, .kui-SidebarSearchPopover) .kui-SidebarSearchInputWrapper {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
@@ -16889,7 +16769,7 @@
   border-radius: var(--radius-2);
   padding: var(--space-2) var(--space-3);
 }
-.kui-SidebarSearch--expanded .kui-SidebarSearchInputWrapper:focus-within {
+:is(.kui-SidebarSearch--expanded, .kui-SidebarSearchPopover) .kui-SidebarSearchInputWrapper:focus-within {
   -webkit-box-shadow: inset 0 0 0 1px var(--accent-a7);
           box-shadow: inset 0 0 0 1px var(--accent-a7);
 }
@@ -16923,11 +16803,7 @@
   margin-top: 1px;
   margin-bottom: 1px;
 }
-:where(.kui-ShellRailContent.kui-r-size-1) :where(.kui-SidebarSearchTrigger) {
-  padding-top: var(--space-2) !important;
-  padding-bottom: var(--space-2) !important;
-}
-:where(.kui-ShellRailContent.kui-r-size-2) :where(.kui-SidebarSearchTrigger) {
+:where(.kui-ShellRailContent:is(.kui-r-size-1, .kui-r-size-2)) :where(.kui-SidebarSearchTrigger) {
   padding-top: var(--space-2) !important;
   padding-bottom: var(--space-2) !important;
 }
@@ -16939,11 +16815,7 @@
   width: var(--content-icon-size-2);
   height: var(--content-icon-size-2);
 }
-.kui-ShellRailContent.kui-r-size-2 .kui-SidebarSearchTrigger svg {
-  width: var(--content-icon-size-3);
-  height: var(--content-icon-size-3);
-}
-.kui-ShellRailContent.kui-r-size-3 .kui-SidebarSearchTrigger svg {
+.kui-ShellRailContent:is(.kui-r-size-2, .kui-r-size-3) .kui-SidebarSearchTrigger svg {
   width: var(--content-icon-size-3);
   height: var(--content-icon-size-3);
 }
@@ -16993,26 +16865,6 @@
   --base-menu-line-height: var(--line-height-2);
   --base-menu-letter-spacing: var(--letter-spacing-2);
 }
-.kui-SidebarSearchPopover .kui-SidebarSearchInputWrapper {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-orient: horizontal;
-  -webkit-box-direction: normal;
-      -ms-flex-direction: row;
-          flex-direction: row;
-  -webkit-box-align: center;
-      -ms-flex-align: center;
-          align-items: center;
-  gap: var(--space-3);
-  background-color: var(--neutral-a3);
-  border-radius: var(--radius-2);
-  padding: var(--space-2) var(--space-3);
-}
-.kui-SidebarSearchPopover .kui-SidebarSearchInputWrapper:focus-within {
-  -webkit-box-shadow: inset 0 0 0 1px var(--accent-a7);
-          box-shadow: inset 0 0 0 1px var(--accent-a7);
-}
 .kui-SidebarSearchPopover .kui-SidebarMenu {
   list-style: none;
   margin: 0;
@@ -17032,7 +16884,7 @@
   }
 }
 .kui-SidebarSearchPopover .kui-SidebarMenuButton:where(:focus-visible) {
-  outline: 2px solid var(--focus-8);
+  outline: var(--focus-ring-width) solid var(--focus-8);
   outline-offset: -2px;
 }
 .kui-SidebarSearchPopover .kui-SidebarMenuButton[data-active] {
@@ -17040,12 +16892,6 @@
   color: var(--accent-a12);
   font-weight: var(--font-weight-medium);
 }
-.kui-SidebarSearchPopover .kui-SidebarMenuLabel {
-  min-width: 0;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
 .kui-SidebarSearchIcon {
   -ms-flex-negative: 0;
       flex-shrink: 0;
@@ -19858,7 +19704,7 @@
     background-color: Highlight;
   }
   .kui-BaseTabListTrigger:where(:focus-visible) :where(.kui-BaseTabListTriggerInner) {
-    outline: 2px solid Highlight;
+    outline: var(--focus-ring-width) solid Highlight;
     outline-offset: 2px;
   }
 }
@@ -19913,7 +19759,7 @@
   height: auto;
 }
 .kui-TextAreaRoot:where(:focus-within) {
-  outline: 2px solid var(--v-focus-color, var(--focus-8));
+  outline: var(--focus-ring-width) solid var(--v-focus-color, var(--focus-8));
   outline-offset: -1px;
 }
 .kui-TextAreaRoot::-moz-selection {
@@ -20815,7 +20661,7 @@
   background-color: var(--neutral-a4);
 }
 .kui-NavigatorLink:where(:focus-visible) {
-  outline: 2px solid var(--focus-8);
+  outline: var(--focus-ring-width) solid var(--focus-8);
   outline-offset: -2px;
 }
 .kui-Page {
@@ -20891,7 +20737,7 @@
   outline: none;
 }
 .kui-VirtualMenuRoot:where(:focus-visible) {
-  outline: 2px solid var(--focus-8);
+  outline: var(--focus-ring-width) solid var(--focus-8);
   outline-offset: -2px;
 }
 .kui-VirtualMenuViewport {
@@ -21651,7 +21497,7 @@
   }
 }
 .kui-ChatbarBox:where(.kui-variant-soft,.kui-variant-ghost,.kui-variant-outline,.kui-variant-surface):where(:focus-within) {
-  outline: 2px solid var(--v-focus-color, var(--focus-8));
+  outline: var(--focus-ring-width) solid var(--v-focus-color, var(--focus-8));
   outline-offset: -1px;
 }
 .kui-ChatbarBox:where(.kui-variant-outline, .kui-variant-surface) {
@@ -21696,7 +21542,7 @@
     border: 1px solid CanvasText;
   }
   .kui-ChatbarBox:where(.kui-variant-raised):where(:focus-within) {
-    outline: 2px solid Highlight;
+    outline: var(--focus-ring-width) solid Highlight;
     outline-offset: -1px;
   }
   .kui-ChatbarRoot:where([data-disabled]) .kui-ChatbarBox {
@@ -21854,7 +21700,7 @@
   outline: none;
 }
 .kui-MessageScrollerViewport:where(:focus-visible) {
-  outline: 2px solid var(--focus-8);
+  outline: var(--focus-ring-width) solid var(--focus-8);
   outline-offset: -2px;
 }
 .kui-MessageScrollerContent {

package/tokens.css

@@ -3370,8 +3370,8 @@
   --component-gap-ghost-2: calc(var(--space-2) * 1.5);
   --component-gap-ghost-3: calc(var(--space-2) * 1.5);
   --component-gap-ghost-4: var(--space-3);
-  --focus-outline-width: 2px;
-  --focus-outline-offset: 2px;
+  --focus-outline-width: var(--focus-ring-width);
+  --focus-outline-offset: var(--focus-ring-offset);
   --focus-outline-offset-inset: -1px;
   --padding-ratio-horizontal: 1.5;
   --color-page: white;