Lock page scroll while a modal dialog is open

Pure CSS: html:has(<dialog>:modal) gets overflow: hidden. A scroll
timeline sets scrollbar-gutter: stable only when the page can scroll,
so the layout doesn't shift.

CHANGELOG.md

@@ -1,6 +1,12 @@
 # Changelog
 
-## Unreleased
+## [Unreleased]
+
+### Fixed
+
+- Prevented Escape from dismissing an enclosing dialog while closing an open Combobox popup.
+- Fixed long Tooltip text clipping instead of showing an ellipsis across all style packs.
+- Locked page scroll while a modal Dialog, Alert Dialog, Command Dialog or Drawer is open.
 
 ## [1.0.2] - 2026-07-06
 

site/src/docs/components/combobox.mdx

@@ -85,6 +85,8 @@ Combobox is input-first. The visible input filters the list; the hidden input st
   </Step>
 </Steps>
 
+Pressing Escape in the input closes an open suggestions popup without dismissing an enclosing dialog. Once the popup is closed, press Escape again to dismiss the dialog.
+
 ### HTML structure
 
 <dl>

site/src/docs/components/tooltip.mdx

@@ -53,6 +53,14 @@ Basecoat tooltips are CSS-only and text-only. This intentionally differs from sh
 <button class="btn" data-variant="outline" data-tooltip="Default tooltip">Default</button>
 </Preview>
 
+### Long text
+
+Tooltips stay on one line and truncate with an ellipsis when the text exceeds the maximum width. This intentionally differs from shadcn/ui's multiline tooltip content.
+
+<Preview>
+<button class="btn" data-variant="outline" data-tooltip="A tooltip with enough text to exceed the default maximum width and demonstrate truncation">Hover</button>
+</Preview>
+
 ### Sides
 
 <Preview>

src/css/components/dialog.css

@@ -1,5 +1,19 @@
 /* Dialog */
+@keyframes dialog-scroll-lock {
+  from, to {
+    scrollbar-gutter: stable;
+  }
+}
+
 @layer components {
+  /* Lock page scroll while a modal dialog is open. The scroll timeline only
+     reserves the scrollbar gutter if the page can scroll, so nothing shifts. */
+  html:has(:is(.dialog, .alert-dialog, .command-dialog, .drawer):modal) {
+    overflow: hidden;
+    animation: dialog-scroll-lock linear both;
+    animation-timeline: scroll(self);
+  }
+
   .dialog,
   .alert-dialog {
     @apply bg-transparent p-0 text-inherit opacity-0 transition-all transition-discrete backdrop:opacity-0 backdrop:transition-all backdrop:transition-discrete;

src/css/components/sidebar.css

@@ -8,7 +8,7 @@
     &[aria-hidden=false] {
       @apply max-md:bg-black/50 max-md:fixed max-md:inset-0 max-md:z-40;
     }
-    > nav {
+    nav {
       @apply fixed inset-y-0 z-50 flex w-(--sidebar-mobile-width) flex-col transition-transform duration-300 ease-in-out md:w-(--sidebar-width);
     }
     & + * {
@@ -16,14 +16,14 @@
     }
     &:not([data-side]),
     &[data-side=left] {
-      > nav {
+      nav {
         @apply left-0 border-r;
       }
       & + * {
         @apply relative md:ml-(--sidebar-width);
       }
       &[aria-hidden=true] {
-        > nav {
+        nav {
           @apply -translate-x-full;
         }
         & + * {
@@ -32,14 +32,14 @@
       }
     }
     &[data-side=right] {
-      > nav {
+      nav {
         @apply right-0 border-l;
       }
       & + * {
         @apply relative md:mr-(--sidebar-width);
       }
       &[aria-hidden=true] {
-        > nav {
+        nav {
           @apply translate-x-full;
         }
         & + * {
@@ -47,7 +47,7 @@
         }
       }
     }
-    > nav {
+    nav {
       > header,
       > footer {
         @apply flex flex-col;

src/css/components/tooltip.css

@@ -4,7 +4,7 @@
     @apply relative;
 
     &:before {
-      @apply absolute z-[60] w-fit max-w-xs origin-(--transform-origin) scale-95 truncate invisible opacity-0 transition-all pointer-events-none content-[attr(data-tooltip)];
+      @apply absolute block z-[60] w-fit max-w-xs origin-(--transform-origin) scale-95 truncate invisible opacity-0 transition-all pointer-events-none content-[attr(data-tooltip)];
     }
 
     &:hover:before {

src/css/styles/luma.css

@@ -1182,92 +1182,92 @@
   }
 
   /* Sidebar */
-  .sidebar > nav {
+  .sidebar nav {
     @apply bg-sidebar text-sidebar-foreground;
   }
 
-  .sidebar > nav > header,
-  .sidebar > nav > footer {
+  .sidebar nav > header,
+  .sidebar nav > footer {
     @apply gap-2 p-2 [--radius:var(--radius-xl)];
   }
 
-  .sidebar > nav > section {
+  .sidebar nav > section {
     @apply gap-2 [--radius:var(--radius-xl)];
   }
 
-  .sidebar > nav [role=separator] {
+  .sidebar nav [role=separator] {
     @apply border-sidebar-border mx-2;
   }
 
-  .sidebar > nav > section > [role=group] {
+  .sidebar nav > section > [role=group] {
     @apply p-2;
   }
 
-  .sidebar > nav h3 {
+  .sidebar nav h3 {
     @apply text-sidebar-foreground/70 ring-sidebar-ring h-8 rounded-xl px-3 text-xs font-medium focus-visible:ring-2 [&>svg]:size-4 transition-[margin,opacity] duration-200 ease-linear;
   }
 
-  .sidebar > nav > section > [role=group] > ul {
+  .sidebar nav > section > [role=group] > ul {
     @apply gap-0.5;
   }
 
-  .sidebar > nav > section > [role=group] {
+  .sidebar nav > section > [role=group] {
     @apply text-sm;
   }
 
-  .sidebar > nav li > :is(a, button),
-  .sidebar > nav li > details > summary {
+  .sidebar nav li > :is(a, button),
+  .sidebar nav li > details > summary {
     @apply ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground gap-2 rounded-xl px-3 py-2 text-sm focus-visible:ring-2 text-left focus-visible:outline-hidden data-[open]:hover:bg-sidebar-accent data-[open]:hover:text-sidebar-accent-foreground [&>svg]:shrink-0 [&>svg]:size-4;
   }
 
-  .sidebar > nav li > :is(a, button):is([aria-current=page], [data-active=true]),
-  .sidebar > nav li > details > summary:is([aria-current=page], [data-active=true]) {
+  .sidebar nav li > :is(a, button):is([aria-current=page], [data-active=true]),
+  .sidebar nav li > details > summary:is([aria-current=page], [data-active=true]) {
     @apply bg-sidebar-accent text-sidebar-accent-foreground font-medium;
   }
 
-  .sidebar > nav li > :is(a, button):not([data-variant]),
-  .sidebar > nav li > details > summary:not([data-variant]),
-  .sidebar > nav li > :is(a, button)[data-variant=default],
-  .sidebar > nav li > details > summary[data-variant=default] {
+  .sidebar nav li > :is(a, button):not([data-variant]),
+  .sidebar nav li > details > summary:not([data-variant]),
+  .sidebar nav li > :is(a, button)[data-variant=default],
+  .sidebar nav li > details > summary[data-variant=default] {
     @apply hover:bg-sidebar-accent hover:text-sidebar-accent-foreground;
   }
 
-  .sidebar > nav li > :is(a, button)[data-variant=outline],
-  .sidebar > nav li > details > summary[data-variant=outline] {
+  .sidebar nav li > :is(a, button)[data-variant=outline],
+  .sidebar nav li > details > summary[data-variant=outline] {
     @apply bg-background shadow-[0_0_0_1px_var(--sidebar-border)] hover:shadow-[0_0_0_1px_var(--sidebar-accent)] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground;
   }
 
-  .sidebar > nav li > :is(a, button):not([data-size]),
-  .sidebar > nav li > details > summary:not([data-size]),
-  .sidebar > nav li > :is(a, button)[data-size=default],
-  .sidebar > nav li > details > summary[data-size=default] {
+  .sidebar nav li > :is(a, button):not([data-size]),
+  .sidebar nav li > details > summary:not([data-size]),
+  .sidebar nav li > :is(a, button)[data-size=default],
+  .sidebar nav li > details > summary[data-size=default] {
     @apply h-9 text-sm;
   }
 
-  .sidebar > nav li > :is(a, button)[data-size=sm],
-  .sidebar > nav li > details > summary[data-size=sm] {
+  .sidebar nav li > :is(a, button)[data-size=sm],
+  .sidebar nav li > details > summary[data-size=sm] {
     @apply h-8 text-xs;
   }
 
-  .sidebar > nav li > :is(a, button)[data-size=lg],
-  .sidebar > nav li > details > summary[data-size=lg] {
+  .sidebar nav li > :is(a, button)[data-size=lg],
+  .sidebar nav li > details > summary[data-size=lg] {
     @apply h-14 px-3 text-sm;
   }
 
-  .sidebar > nav li > details > summary::after {
+  .sidebar nav li > details > summary::after {
     @apply size-4;
   }
 
-  .sidebar > nav li > details::details-content {
+  .sidebar nav li > details::details-content {
     @apply px-3.5;
   }
 
-  .sidebar > nav ul ul {
+  .sidebar nav ul ul {
     @apply border-sidebar-border translate-x-px gap-1 border-s px-2.5 py-0.5 rtl:-translate-x-px;
   }
 
-  .sidebar > nav ul ul > li > :is(a, button),
-  .sidebar > nav ul ul > li > details > summary {
+  .sidebar nav ul ul > li > :is(a, button),
+  .sidebar nav ul ul > li > details > summary {
     @apply text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground h-7 gap-2 rounded-xl px-3 text-sm focus-visible:ring-2 [&>svg]:size-4;
   }
   /* Progress */
@@ -1324,7 +1324,7 @@
 
   /* Tooltip */
   [data-tooltip]::before {
-    @apply bg-foreground text-background inline-flex items-center gap-1.5 rounded-xl px-3 py-1.5 text-xs has-[.kbd]:pe-1.5 [&_.kbd]:relative [&_.kbd]:isolate [&_.kbd]:z-50 [&_.kbd]:rounded-lg;
+    @apply bg-foreground text-background rounded-xl px-3 py-1.5 text-xs;
   }
 
   [data-tooltip][data-arrow]::after {

src/css/styles/lyra.css

@@ -1185,92 +1185,92 @@
   }
 
   /* Sidebar */
-  .sidebar > nav {
+  .sidebar nav {
     @apply bg-sidebar text-sidebar-foreground;
   }
 
-  .sidebar > nav > header,
-  .sidebar > nav > footer {
+  .sidebar nav > header,
+  .sidebar nav > footer {
     @apply gap-2 p-2;
   }
 
-  .sidebar > nav > section {
+  .sidebar nav > section {
     @apply gap-0;
   }
 
-  .sidebar > nav [role=separator] {
+  .sidebar nav [role=separator] {
     @apply border-sidebar-border mx-2;
   }
 
-  .sidebar > nav > section > [role=group] {
+  .sidebar nav > section > [role=group] {
     @apply p-2;
   }
 
-  .sidebar > nav h3 {
+  .sidebar nav h3 {
     @apply text-sidebar-foreground/70 ring-sidebar-ring h-8 rounded-none px-2 text-xs focus-visible:ring-2 [&>svg]:size-4 transition-[margin,opacity] duration-200 ease-linear;
   }
 
-  .sidebar > nav > section > [role=group] > ul {
+  .sidebar nav > section > [role=group] > ul {
     @apply gap-0;
   }
 
-  .sidebar > nav > section > [role=group] {
+  .sidebar nav > section > [role=group] {
     @apply text-xs;
   }
 
-  .sidebar > nav li > :is(a, button),
-  .sidebar > nav li > details > summary {
+  .sidebar nav li > :is(a, button),
+  .sidebar nav li > details > summary {
     @apply ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground gap-2 rounded-none p-2 text-xs focus-visible:ring-2 text-left focus-visible:outline-hidden data-[open]:hover:bg-sidebar-accent data-[open]:hover:text-sidebar-accent-foreground [&>svg]:shrink-0 [&>svg]:size-4;
   }
 
-  .sidebar > nav li > :is(a, button):is([aria-current=page], [data-active=true]),
-  .sidebar > nav li > details > summary:is([aria-current=page], [data-active=true]) {
+  .sidebar nav li > :is(a, button):is([aria-current=page], [data-active=true]),
+  .sidebar nav li > details > summary:is([aria-current=page], [data-active=true]) {
     @apply bg-sidebar-accent text-sidebar-accent-foreground font-medium;
   }
 
-  .sidebar > nav li > :is(a, button):not([data-variant]),
-  .sidebar > nav li > details > summary:not([data-variant]),
-  .sidebar > nav li > :is(a, button)[data-variant=default],
-  .sidebar > nav li > details > summary[data-variant=default] {
+  .sidebar nav li > :is(a, button):not([data-variant]),
+  .sidebar nav li > details > summary:not([data-variant]),
+  .sidebar nav li > :is(a, button)[data-variant=default],
+  .sidebar nav li > details > summary[data-variant=default] {
     @apply hover:bg-sidebar-accent hover:text-sidebar-accent-foreground;
   }
 
-  .sidebar > nav li > :is(a, button)[data-variant=outline],
-  .sidebar > nav li > details > summary[data-variant=outline] {
+  .sidebar nav li > :is(a, button)[data-variant=outline],
+  .sidebar nav li > details > summary[data-variant=outline] {
     @apply bg-background shadow-[0_0_0_1px_var(--sidebar-border)] hover:shadow-[0_0_0_1px_var(--sidebar-accent)] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground;
   }
 
-  .sidebar > nav li > :is(a, button):not([data-size]),
-  .sidebar > nav li > details > summary:not([data-size]),
-  .sidebar > nav li > :is(a, button)[data-size=default],
-  .sidebar > nav li > details > summary[data-size=default] {
+  .sidebar nav li > :is(a, button):not([data-size]),
+  .sidebar nav li > details > summary:not([data-size]),
+  .sidebar nav li > :is(a, button)[data-size=default],
+  .sidebar nav li > details > summary[data-size=default] {
     @apply h-8 text-xs;
   }
 
-  .sidebar > nav li > :is(a, button)[data-size=sm],
-  .sidebar > nav li > details > summary[data-size=sm] {
+  .sidebar nav li > :is(a, button)[data-size=sm],
+  .sidebar nav li > details > summary[data-size=sm] {
     @apply h-7 text-xs;
   }
 
-  .sidebar > nav li > :is(a, button)[data-size=lg],
-  .sidebar > nav li > details > summary[data-size=lg] {
+  .sidebar nav li > :is(a, button)[data-size=lg],
+  .sidebar nav li > details > summary[data-size=lg] {
     @apply h-12 text-xs;
   }
 
-  .sidebar > nav li > details > summary::after {
+  .sidebar nav li > details > summary::after {
     @apply size-4;
   }
 
-  .sidebar > nav li > details::details-content {
+  .sidebar nav li > details::details-content {
     @apply px-3.5;
   }
 
-  .sidebar > nav ul ul {
+  .sidebar nav ul ul {
     @apply border-sidebar-border translate-x-px gap-1 border-s px-2.5 py-0.5 rtl:-translate-x-px;
   }
 
-  .sidebar > nav ul ul > li > :is(a, button),
-  .sidebar > nav ul ul > li > details > summary {
+  .sidebar nav ul ul > li > :is(a, button),
+  .sidebar nav ul ul > li > details > summary {
     @apply text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground h-7 gap-2 rounded-none px-2 text-xs focus-visible:ring-2 [&>svg]:size-4;
   }
   /* Progress */
@@ -1327,7 +1327,7 @@
 
   /* Tooltip */
   [data-tooltip]::before {
-    @apply bg-foreground text-background inline-flex items-center gap-1.5 rounded-none px-3 py-1.5 text-xs has-[.kbd]:pe-1.5 [&_.kbd]:relative [&_.kbd]:isolate [&_.kbd]:z-50 [&_.kbd]:rounded-none;
+    @apply bg-foreground text-background rounded-none px-3 py-1.5 text-xs;
   }
 
   [data-tooltip][data-arrow]::after {

src/css/styles/maia.css

@@ -1170,92 +1170,92 @@
   }
 
   /* Sidebar */
-  .sidebar > nav {
+  .sidebar nav {
     @apply bg-sidebar text-sidebar-foreground;
   }
 
-  .sidebar > nav > header,
-  .sidebar > nav > footer {
+  .sidebar nav > header,
+  .sidebar nav > footer {
     @apply gap-2 p-2 [--radius:var(--radius-xl)];
   }
 
-  .sidebar > nav > section {
+  .sidebar nav > section {
     @apply gap-2 [--radius:var(--radius-xl)];
   }
 
-  .sidebar > nav [role=separator] {
+  .sidebar nav [role=separator] {
     @apply border-sidebar-border mx-2;
   }
 
-  .sidebar > nav > section > [role=group] {
+  .sidebar nav > section > [role=group] {
     @apply p-2;
   }
 
-  .sidebar > nav h3 {
+  .sidebar nav h3 {
     @apply text-sidebar-foreground/70 ring-sidebar-ring h-8 rounded-md px-3 text-xs font-medium focus-visible:ring-2 [&>svg]:size-4 transition-[margin,opacity] duration-200 ease-linear;
   }
 
-  .sidebar > nav > section > [role=group] > ul {
+  .sidebar nav > section > [role=group] > ul {
     @apply gap-1;
   }
 
-  .sidebar > nav > section > [role=group] {
+  .sidebar nav > section > [role=group] {
     @apply text-sm;
   }
 
-  .sidebar > nav li > :is(a, button),
-  .sidebar > nav li > details > summary {
+  .sidebar nav li > :is(a, button),
+  .sidebar nav li > details > summary {
     @apply ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground gap-2 rounded-lg px-3 py-2 text-sm focus-visible:ring-2 text-left focus-visible:outline-hidden data-[open]:hover:bg-sidebar-accent data-[open]:hover:text-sidebar-accent-foreground [&>svg]:shrink-0 [&>svg]:size-4;
   }
 
-  .sidebar > nav li > :is(a, button):is([aria-current=page], [data-active=true]),
-  .sidebar > nav li > details > summary:is([aria-current=page], [data-active=true]) {
+  .sidebar nav li > :is(a, button):is([aria-current=page], [data-active=true]),
+  .sidebar nav li > details > summary:is([aria-current=page], [data-active=true]) {
     @apply bg-sidebar-accent text-sidebar-accent-foreground font-medium;
   }
 
-  .sidebar > nav li > :is(a, button):not([data-variant]),
-  .sidebar > nav li > details > summary:not([data-variant]),
-  .sidebar > nav li > :is(a, button)[data-variant=default],
-  .sidebar > nav li > details > summary[data-variant=default] {
+  .sidebar nav li > :is(a, button):not([data-variant]),
+  .sidebar nav li > details > summary:not([data-variant]),
+  .sidebar nav li > :is(a, button)[data-variant=default],
+  .sidebar nav li > details > summary[data-variant=default] {
     @apply hover:bg-sidebar-accent hover:text-sidebar-accent-foreground;
   }
 
-  .sidebar > nav li > :is(a, button)[data-variant=outline],
-  .sidebar > nav li > details > summary[data-variant=outline] {
+  .sidebar nav li > :is(a, button)[data-variant=outline],
+  .sidebar nav li > details > summary[data-variant=outline] {
     @apply bg-background shadow-[0_0_0_1px_var(--sidebar-border)] hover:shadow-[0_0_0_1px_var(--sidebar-accent)] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground;
   }
 
-  .sidebar > nav li > :is(a, button):not([data-size]),
-  .sidebar > nav li > details > summary:not([data-size]),
-  .sidebar > nav li > :is(a, button)[data-size=default],
-  .sidebar > nav li > details > summary[data-size=default] {
+  .sidebar nav li > :is(a, button):not([data-size]),
+  .sidebar nav li > details > summary:not([data-size]),
+  .sidebar nav li > :is(a, button)[data-size=default],
+  .sidebar nav li > details > summary[data-size=default] {
     @apply h-9 text-sm;
   }
 
-  .sidebar > nav li > :is(a, button)[data-size=sm],
-  .sidebar > nav li > details > summary[data-size=sm] {
+  .sidebar nav li > :is(a, button)[data-size=sm],
+  .sidebar nav li > details > summary[data-size=sm] {
     @apply h-8 text-xs;
   }
 
-  .sidebar > nav li > :is(a, button)[data-size=lg],
-  .sidebar > nav li > details > summary[data-size=lg] {
+  .sidebar nav li > :is(a, button)[data-size=lg],
+  .sidebar nav li > details > summary[data-size=lg] {
     @apply h-14 px-3 text-sm;
   }
 
-  .sidebar > nav li > details > summary::after {
+  .sidebar nav li > details > summary::after {
     @apply size-4;
   }
 
-  .sidebar > nav li > details::details-content {
+  .sidebar nav li > details::details-content {
     @apply px-3.5;
   }
 
-  .sidebar > nav ul ul {
+  .sidebar nav ul ul {
     @apply border-sidebar-border translate-x-px gap-1 border-s px-2.5 py-0.5 rtl:-translate-x-px;
   }
 
-  .sidebar > nav ul ul > li > :is(a, button),
-  .sidebar > nav ul ul > li > details > summary {
+  .sidebar nav ul ul > li > :is(a, button),
+  .sidebar nav ul ul > li > details > summary {
     @apply text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground h-7 gap-2 rounded-md px-2 text-sm focus-visible:ring-2 [&>svg]:size-4;
   }
   /* Progress */
@@ -1312,7 +1312,7 @@
 
   /* Tooltip */
   [data-tooltip]::before {
-    @apply bg-foreground text-background inline-flex items-center gap-1.5 rounded-2xl px-3 py-1.5 text-xs has-[.kbd]:pe-1.5 [&_.kbd]:relative [&_.kbd]:isolate [&_.kbd]:z-50 [&_.kbd]:rounded-4xl;
+    @apply bg-foreground text-background rounded-2xl px-3 py-1.5 text-xs;
   }
 
   [data-tooltip][data-arrow]::after {

src/css/styles/mira.css

@@ -1179,92 +1179,92 @@
   }
 
   /* Sidebar */
-  .sidebar > nav {
+  .sidebar nav {
     @apply bg-sidebar text-sidebar-foreground;
   }
 
-  .sidebar > nav > header,
-  .sidebar > nav > footer {
+  .sidebar nav > header,
+  .sidebar nav > footer {
     @apply gap-2 p-2;
   }
 
-  .sidebar > nav > section {
+  .sidebar nav > section {
     @apply gap-0;
   }
 
-  .sidebar > nav [role=separator] {
+  .sidebar nav [role=separator] {
     @apply border-sidebar-border mx-2;
   }
 
-  .sidebar > nav > section > [role=group] {
+  .sidebar nav > section > [role=group] {
     @apply px-2 py-1;
   }
 
-  .sidebar > nav h3 {
+  .sidebar nav h3 {
     @apply text-sidebar-foreground/70 ring-sidebar-ring h-8 rounded-md px-2 text-xs focus-visible:ring-2 [&>svg]:size-4 transition-[margin,opacity] duration-200 ease-linear;
   }
 
-  .sidebar > nav > section > [role=group] > ul {
+  .sidebar nav > section > [role=group] > ul {
     @apply gap-px;
   }
 
-  .sidebar > nav > section > [role=group] {
+  .sidebar nav > section > [role=group] {
     @apply text-xs;
   }
 
-  .sidebar > nav li > :is(a, button),
-  .sidebar > nav li > details > summary {
+  .sidebar nav li > :is(a, button),
+  .sidebar nav li > details > summary {
     @apply ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground gap-2 rounded-[calc(var(--radius-sm)+2px)] p-2 text-xs focus-visible:ring-2 text-left focus-visible:outline-hidden data-[open]:hover:bg-sidebar-accent data-[open]:hover:text-sidebar-accent-foreground [&>svg]:shrink-0 [&>svg]:size-4;
   }
 
-  .sidebar > nav li > :is(a, button):is([aria-current=page], [data-active=true]),
-  .sidebar > nav li > details > summary:is([aria-current=page], [data-active=true]) {
+  .sidebar nav li > :is(a, button):is([aria-current=page], [data-active=true]),
+  .sidebar nav li > details > summary:is([aria-current=page], [data-active=true]) {
     @apply bg-sidebar-accent text-sidebar-accent-foreground font-medium;
   }
 
-  .sidebar > nav li > :is(a, button):not([data-variant]),
-  .sidebar > nav li > details > summary:not([data-variant]),
-  .sidebar > nav li > :is(a, button)[data-variant=default],
-  .sidebar > nav li > details > summary[data-variant=default] {
+  .sidebar nav li > :is(a, button):not([data-variant]),
+  .sidebar nav li > details > summary:not([data-variant]),
+  .sidebar nav li > :is(a, button)[data-variant=default],
+  .sidebar nav li > details > summary[data-variant=default] {
     @apply hover:bg-sidebar-accent hover:text-sidebar-accent-foreground;
   }
 
-  .sidebar > nav li > :is(a, button)[data-variant=outline],
-  .sidebar > nav li > details > summary[data-variant=outline] {
+  .sidebar nav li > :is(a, button)[data-variant=outline],
+  .sidebar nav li > details > summary[data-variant=outline] {
     @apply bg-muted/20 dark:bg-muted/30 border-input shadow-[0_0_0_1px_var(--sidebar-border)] hover:shadow-[0_0_0_1px_var(--sidebar-accent)] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground;
   }
 
-  .sidebar > nav li > :is(a, button):not([data-size]),
-  .sidebar > nav li > details > summary:not([data-size]),
-  .sidebar > nav li > :is(a, button)[data-size=default],
-  .sidebar > nav li > details > summary[data-size=default] {
+  .sidebar nav li > :is(a, button):not([data-size]),
+  .sidebar nav li > details > summary:not([data-size]),
+  .sidebar nav li > :is(a, button)[data-size=default],
+  .sidebar nav li > details > summary[data-size=default] {
     @apply h-8 text-xs;
   }
 
-  .sidebar > nav li > :is(a, button)[data-size=sm],
-  .sidebar > nav li > details > summary[data-size=sm] {
+  .sidebar nav li > :is(a, button)[data-size=sm],
+  .sidebar nav li > details > summary[data-size=sm] {
     @apply h-7 text-xs;
   }
 
-  .sidebar > nav li > :is(a, button)[data-size=lg],
-  .sidebar > nav li > details > summary[data-size=lg] {
+  .sidebar nav li > :is(a, button)[data-size=lg],
+  .sidebar nav li > details > summary[data-size=lg] {
     @apply h-12 text-xs;
   }
 
-  .sidebar > nav li > details > summary::after {
+  .sidebar nav li > details > summary::after {
     @apply size-4;
   }
 
-  .sidebar > nav li > details::details-content {
+  .sidebar nav li > details::details-content {
     @apply px-3.5;
   }
 
-  .sidebar > nav ul ul {
+  .sidebar nav ul ul {
     @apply border-sidebar-border translate-x-px gap-1 border-s px-2.5 py-0.5 rtl:-translate-x-px;
   }
 
-  .sidebar > nav ul ul > li > :is(a, button),
-  .sidebar > nav ul ul > li > details > summary {
+  .sidebar nav ul ul > li > :is(a, button),
+  .sidebar nav ul ul > li > details > summary {
     @apply text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground h-7 gap-2 rounded-md px-2 text-xs focus-visible:ring-2 [&>svg]:size-4;
   }
   /* Progress */
@@ -1321,7 +1321,7 @@
 
   /* Tooltip */
   [data-tooltip]::before {
-    @apply bg-foreground text-background inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 text-xs has-[.kbd]:pe-1.5 [&_.kbd]:relative [&_.kbd]:isolate [&_.kbd]:z-50 [&_.kbd]:rounded-sm;
+    @apply bg-foreground text-background rounded-md px-3 py-1.5 text-xs;
   }
 
   [data-tooltip][data-arrow]::after {

src/css/styles/nova.css

@@ -1193,92 +1193,92 @@
   }
 
   /* Sidebar */
-  .sidebar > nav {
+  .sidebar nav {
     @apply bg-sidebar text-sidebar-foreground;
   }
 
-  .sidebar > nav > header,
-  .sidebar > nav > footer {
+  .sidebar nav > header,
+  .sidebar nav > footer {
     @apply gap-2 p-2;
   }
 
-  .sidebar > nav > section {
+  .sidebar nav > section {
     @apply gap-0;
   }
 
-  .sidebar > nav [role=separator] {
+  .sidebar nav [role=separator] {
     @apply border-sidebar-border mx-2;
   }
 
-  .sidebar > nav > section > [role=group] {
+  .sidebar nav > section > [role=group] {
     @apply p-2;
   }
 
-  .sidebar > nav h3 {
+  .sidebar nav h3 {
     @apply text-sidebar-foreground/70 ring-sidebar-ring h-8 rounded-md px-2 text-xs font-medium focus-visible:ring-2 [&>svg]:size-4 transition-[margin,opacity] duration-200 ease-linear;
   }
 
-  .sidebar > nav > section > [role=group] > ul {
+  .sidebar nav > section > [role=group] > ul {
     @apply gap-0;
   }
 
-  .sidebar > nav > section > [role=group] {
+  .sidebar nav > section > [role=group] {
     @apply text-sm;
   }
 
-  .sidebar > nav li > :is(a, button),
-  .sidebar > nav li > details > summary {
+  .sidebar nav li > :is(a, button),
+  .sidebar nav li > details > summary {
     @apply ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground gap-2 rounded-md p-2 text-sm focus-visible:ring-2 text-left focus-visible:outline-hidden data-[open]:hover:bg-sidebar-accent data-[open]:hover:text-sidebar-accent-foreground [&>svg]:shrink-0 [&>svg]:size-4;
   }
 
-  .sidebar > nav li > :is(a, button):is([aria-current=page], [data-active=true]),
-  .sidebar > nav li > details > summary:is([aria-current=page], [data-active=true]) {
+  .sidebar nav li > :is(a, button):is([aria-current=page], [data-active=true]),
+  .sidebar nav li > details > summary:is([aria-current=page], [data-active=true]) {
     @apply bg-sidebar-accent text-sidebar-accent-foreground font-medium;
   }
 
-  .sidebar > nav li > :is(a, button):not([data-variant]),
-  .sidebar > nav li > details > summary:not([data-variant]),
-  .sidebar > nav li > :is(a, button)[data-variant=default],
-  .sidebar > nav li > details > summary[data-variant=default] {
+  .sidebar nav li > :is(a, button):not([data-variant]),
+  .sidebar nav li > details > summary:not([data-variant]),
+  .sidebar nav li > :is(a, button)[data-variant=default],
+  .sidebar nav li > details > summary[data-variant=default] {
     @apply hover:bg-sidebar-accent hover:text-sidebar-accent-foreground;
   }
 
-  .sidebar > nav li > :is(a, button)[data-variant=outline],
-  .sidebar > nav li > details > summary[data-variant=outline] {
+  .sidebar nav li > :is(a, button)[data-variant=outline],
+  .sidebar nav li > details > summary[data-variant=outline] {
     @apply bg-background shadow-[0_0_0_1px_var(--sidebar-border)] hover:shadow-[0_0_0_1px_var(--sidebar-accent)] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground;
   }
 
-  .sidebar > nav li > :is(a, button):not([data-size]),
-  .sidebar > nav li > details > summary:not([data-size]),
-  .sidebar > nav li > :is(a, button)[data-size=default],
-  .sidebar > nav li > details > summary[data-size=default] {
+  .sidebar nav li > :is(a, button):not([data-size]),
+  .sidebar nav li > details > summary:not([data-size]),
+  .sidebar nav li > :is(a, button)[data-size=default],
+  .sidebar nav li > details > summary[data-size=default] {
     @apply h-8 text-sm;
   }
 
-  .sidebar > nav li > :is(a, button)[data-size=sm],
-  .sidebar > nav li > details > summary[data-size=sm] {
+  .sidebar nav li > :is(a, button)[data-size=sm],
+  .sidebar nav li > details > summary[data-size=sm] {
     @apply h-7 text-xs;
   }
 
-  .sidebar > nav li > :is(a, button)[data-size=lg],
-  .sidebar > nav li > details > summary[data-size=lg] {
+  .sidebar nav li > :is(a, button)[data-size=lg],
+  .sidebar nav li > details > summary[data-size=lg] {
     @apply h-12 text-sm;
   }
 
-  .sidebar > nav li > details > summary::after {
+  .sidebar nav li > details > summary::after {
     @apply size-4;
   }
 
-  .sidebar > nav li > details::details-content {
+  .sidebar nav li > details::details-content {
     @apply px-3.5;
   }
 
-  .sidebar > nav ul ul {
+  .sidebar nav ul ul {
     @apply border-sidebar-border translate-x-px gap-1 border-s px-2.5 py-0.5 rtl:-translate-x-px;
   }
 
-  .sidebar > nav ul ul > li > :is(a, button),
-  .sidebar > nav ul ul > li > details > summary {
+  .sidebar nav ul ul > li > :is(a, button),
+  .sidebar nav ul ul > li > details > summary {
     @apply text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground h-7 gap-2 rounded-md px-2 text-sm focus-visible:ring-2 [&>svg]:size-4;
   }
   /* Progress */
@@ -1335,7 +1335,7 @@
 
   /* Tooltip */
   [data-tooltip]::before {
-    @apply bg-foreground text-background inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 text-xs has-[.kbd]:pe-1.5 [&_.kbd]:relative [&_.kbd]:isolate [&_.kbd]:z-50 [&_.kbd]:rounded-sm;
+    @apply bg-foreground text-background rounded-md px-3 py-1.5 text-xs;
   }
 
   [data-tooltip][data-arrow]::after {

src/css/styles/rhea.css

@@ -1187,92 +1187,92 @@
   }
 
   /* Sidebar */
-  .sidebar > nav {
+  .sidebar nav {
     @apply bg-sidebar text-sidebar-foreground;
   }
 
-  .sidebar > nav > header,
-  .sidebar > nav > footer {
+  .sidebar nav > header,
+  .sidebar nav > footer {
     @apply gap-2 p-2 [--radius:var(--radius-xl)];
   }
 
-  .sidebar > nav > section {
+  .sidebar nav > section {
     @apply gap-2 [--radius:var(--radius-xl)];
   }
 
-  .sidebar > nav [role=separator] {
+  .sidebar nav [role=separator] {
     @apply border-sidebar-border mx-2;
   }
 
-  .sidebar > nav > section > [role=group] {
+  .sidebar nav > section > [role=group] {
     @apply p-2;
   }
 
-  .sidebar > nav h3 {
+  .sidebar nav h3 {
     @apply text-sidebar-foreground/70 ring-sidebar-ring h-8 rounded-xl px-3 text-xs font-medium focus-visible:ring-3 [&>svg]:size-4 transition-[margin,opacity] duration-200 ease-linear;
   }
 
-  .sidebar > nav > section > [role=group] > ul {
+  .sidebar nav > section > [role=group] > ul {
     @apply gap-0.5;
   }
 
-  .sidebar > nav > section > [role=group] {
+  .sidebar nav > section > [role=group] {
     @apply text-sm;
   }
 
-  .sidebar > nav li > :is(a, button),
-  .sidebar > nav li > details > summary {
+  .sidebar nav li > :is(a, button),
+  .sidebar nav li > details > summary {
     @apply ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground gap-2 rounded-xl px-3 py-2 text-sm duration-200 focus-visible:ring-3 whitespace-nowrap has-[>svg:first-child]:ps-2.5 has-[>svg:last-child]:pe-2.5 text-left focus-visible:outline-hidden data-[open]:hover:bg-sidebar-accent data-[open]:hover:text-sidebar-accent-foreground [&>svg]:shrink-0 [&>svg]:size-4;
   }
 
-  .sidebar > nav li > :is(a, button):is([aria-current=page], [data-active=true]),
-  .sidebar > nav li > details > summary:is([aria-current=page], [data-active=true]) {
+  .sidebar nav li > :is(a, button):is([aria-current=page], [data-active=true]),
+  .sidebar nav li > details > summary:is([aria-current=page], [data-active=true]) {
     @apply bg-sidebar-accent text-sidebar-accent-foreground font-medium;
   }
 
-  .sidebar > nav li > :is(a, button):not([data-variant]),
-  .sidebar > nav li > details > summary:not([data-variant]),
-  .sidebar > nav li > :is(a, button)[data-variant=default],
-  .sidebar > nav li > details > summary[data-variant=default] {
+  .sidebar nav li > :is(a, button):not([data-variant]),
+  .sidebar nav li > details > summary:not([data-variant]),
+  .sidebar nav li > :is(a, button)[data-variant=default],
+  .sidebar nav li > details > summary[data-variant=default] {
     @apply hover:bg-sidebar-accent hover:text-sidebar-accent-foreground;
   }
 
-  .sidebar > nav li > :is(a, button)[data-variant=outline],
-  .sidebar > nav li > details > summary[data-variant=outline] {
+  .sidebar nav li > :is(a, button)[data-variant=outline],
+  .sidebar nav li > details > summary[data-variant=outline] {
     @apply bg-background shadow-[0_0_0_1px_var(--sidebar-border)] hover:shadow-[0_0_0_1px_var(--sidebar-accent)] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground;
   }
 
-  .sidebar > nav li > :is(a, button):not([data-size]),
-  .sidebar > nav li > details > summary:not([data-size]),
-  .sidebar > nav li > :is(a, button)[data-size=default],
-  .sidebar > nav li > details > summary[data-size=default] {
+  .sidebar nav li > :is(a, button):not([data-size]),
+  .sidebar nav li > details > summary:not([data-size]),
+  .sidebar nav li > :is(a, button)[data-size=default],
+  .sidebar nav li > details > summary[data-size=default] {
     @apply h-8 text-sm;
   }
 
-  .sidebar > nav li > :is(a, button)[data-size=sm],
-  .sidebar > nav li > details > summary[data-size=sm] {
+  .sidebar nav li > :is(a, button)[data-size=sm],
+  .sidebar nav li > details > summary[data-size=sm] {
     @apply h-7 text-xs;
   }
 
-  .sidebar > nav li > :is(a, button)[data-size=lg],
-  .sidebar > nav li > details > summary[data-size=lg] {
+  .sidebar nav li > :is(a, button)[data-size=lg],
+  .sidebar nav li > details > summary[data-size=lg] {
     @apply h-12 px-3 text-sm;
   }
 
-  .sidebar > nav li > details > summary::after {
+  .sidebar nav li > details > summary::after {
     @apply size-4;
   }
 
-  .sidebar > nav li > details::details-content {
+  .sidebar nav li > details::details-content {
     @apply px-3.5;
   }
 
-  .sidebar > nav ul ul {
+  .sidebar nav ul ul {
     @apply border-sidebar-border translate-x-px gap-1 border-s px-2.5 py-0.5 rtl:-translate-x-px;
   }
 
-  .sidebar > nav ul ul > li > :is(a, button),
-  .sidebar > nav ul ul > li > details > summary {
+  .sidebar nav ul ul > li > :is(a, button),
+  .sidebar nav ul ul > li > details > summary {
     @apply text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground h-7 gap-2 rounded-xl px-3 text-sm focus-visible:ring-3 [&>svg]:size-4;
   }
   /* Progress */
@@ -1329,7 +1329,7 @@
 
   /* Tooltip */
   [data-tooltip]::before {
-    @apply bg-foreground text-background inline-flex items-center gap-1.5 rounded-xl px-3 py-1.5 text-xs has-[.kbd]:pe-1.5 [&_.kbd]:relative [&_.kbd]:isolate [&_.kbd]:z-50 [&_.kbd]:rounded-lg;
+    @apply bg-foreground text-background rounded-xl px-3 py-1.5 text-xs;
   }
 
   [data-tooltip][data-arrow]::after {

src/css/styles/sera.css

@@ -1203,92 +1203,92 @@
   }
 
   /* Sidebar */
-  .sidebar > nav {
+  .sidebar nav {
     @apply bg-sidebar text-sidebar-foreground;
   }
 
-  .sidebar > nav > header,
-  .sidebar > nav > footer {
+  .sidebar nav > header,
+  .sidebar nav > footer {
     @apply gap-2 p-2 [--radius:0];
   }
 
-  .sidebar > nav > section {
+  .sidebar nav > section {
     @apply gap-2 [--radius:0];
   }
 
-  .sidebar > nav [role=separator] {
+  .sidebar nav [role=separator] {
     @apply border-sidebar-border mx-2;
   }
 
-  .sidebar > nav > section > [role=group] {
+  .sidebar nav > section > [role=group] {
     @apply p-2;
   }
 
-  .sidebar > nav h3 {
+  .sidebar nav h3 {
     @apply text-sidebar-foreground/70 ring-sidebar-ring h-8 rounded-none px-3 text-xs font-semibold uppercase tracking-wider focus-visible:ring-2 [&>svg]:size-3.5 transition-[margin,opacity] duration-200 ease-linear;
   }
 
-  .sidebar > nav > section > [role=group] > ul {
+  .sidebar nav > section > [role=group] > ul {
     @apply gap-0.5;
   }
 
-  .sidebar > nav > section > [role=group] {
+  .sidebar nav > section > [role=group] {
     @apply text-sm;
   }
 
-  .sidebar > nav li > :is(a, button),
-  .sidebar > nav li > details > summary {
+  .sidebar nav li > :is(a, button),
+  .sidebar nav li > details > summary {
     @apply ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground gap-2 rounded-none px-3 py-2 text-sm focus-visible:ring-2 text-left focus-visible:outline-hidden data-[open]:hover:bg-sidebar-accent data-[open]:hover:text-sidebar-accent-foreground [&>svg]:shrink-0 [&>svg]:size-3.5;
   }
 
-  .sidebar > nav li > :is(a, button):is([aria-current=page], [data-active=true]),
-  .sidebar > nav li > details > summary:is([aria-current=page], [data-active=true]) {
+  .sidebar nav li > :is(a, button):is([aria-current=page], [data-active=true]),
+  .sidebar nav li > details > summary:is([aria-current=page], [data-active=true]) {
     @apply bg-sidebar-accent text-sidebar-accent-foreground font-medium;
   }
 
-  .sidebar > nav li > :is(a, button):not([data-variant]),
-  .sidebar > nav li > details > summary:not([data-variant]),
-  .sidebar > nav li > :is(a, button)[data-variant=default],
-  .sidebar > nav li > details > summary[data-variant=default] {
+  .sidebar nav li > :is(a, button):not([data-variant]),
+  .sidebar nav li > details > summary:not([data-variant]),
+  .sidebar nav li > :is(a, button)[data-variant=default],
+  .sidebar nav li > details > summary[data-variant=default] {
     @apply hover:bg-sidebar-accent hover:text-sidebar-accent-foreground;
   }
 
-  .sidebar > nav li > :is(a, button)[data-variant=outline],
-  .sidebar > nav li > details > summary[data-variant=outline] {
+  .sidebar nav li > :is(a, button)[data-variant=outline],
+  .sidebar nav li > details > summary[data-variant=outline] {
     @apply bg-background shadow-[0_0_0_1px_var(--sidebar-border)] hover:shadow-[0_0_0_1px_var(--sidebar-accent)] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground;
   }
 
-  .sidebar > nav li > :is(a, button):not([data-size]),
-  .sidebar > nav li > details > summary:not([data-size]),
-  .sidebar > nav li > :is(a, button)[data-size=default],
-  .sidebar > nav li > details > summary[data-size=default] {
+  .sidebar nav li > :is(a, button):not([data-size]),
+  .sidebar nav li > details > summary:not([data-size]),
+  .sidebar nav li > :is(a, button)[data-size=default],
+  .sidebar nav li > details > summary[data-size=default] {
     @apply h-9 text-sm;
   }
 
-  .sidebar > nav li > :is(a, button)[data-size=sm],
-  .sidebar > nav li > details > summary[data-size=sm] {
+  .sidebar nav li > :is(a, button)[data-size=sm],
+  .sidebar nav li > details > summary[data-size=sm] {
     @apply h-8 text-xs;
   }
 
-  .sidebar > nav li > :is(a, button)[data-size=lg],
-  .sidebar > nav li > details > summary[data-size=lg] {
+  .sidebar nav li > :is(a, button)[data-size=lg],
+  .sidebar nav li > details > summary[data-size=lg] {
     @apply h-14 px-3 text-sm;
   }
 
-  .sidebar > nav li > details > summary::after {
+  .sidebar nav li > details > summary::after {
     @apply size-3.5;
   }
 
-  .sidebar > nav li > details::details-content {
+  .sidebar nav li > details::details-content {
     @apply px-3.5;
   }
 
-  .sidebar > nav ul ul {
+  .sidebar nav ul ul {
     @apply border-sidebar-border translate-x-px gap-1 border-s px-2.5 py-0.5 rtl:-translate-x-px;
   }
 
-  .sidebar > nav ul ul > li > :is(a, button),
-  .sidebar > nav ul ul > li > details > summary {
+  .sidebar nav ul ul > li > :is(a, button),
+  .sidebar nav ul ul > li > details > summary {
     @apply text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground h-7 gap-2 rounded-none px-3 text-sm focus-visible:ring-2 [&>svg]:size-3.5;
   }
   /* Progress */
@@ -1345,7 +1345,7 @@
 
   /* Tooltip */
   [data-tooltip]::before {
-    @apply bg-foreground text-background inline-flex items-center gap-1.5 rounded-none px-3 py-1.5 text-xs has-[.kbd]:pe-1.5 [&_.kbd]:relative [&_.kbd]:isolate [&_.kbd]:z-50 [&_.kbd]:rounded-none;
+    @apply bg-foreground text-background rounded-none px-3 py-1.5 text-xs;
   }
 
   [data-tooltip][data-arrow]::after {

src/css/styles/vega.css

@@ -1192,92 +1192,92 @@
   }
 
   /* Sidebar */
-  .sidebar > nav {
+  .sidebar nav {
     @apply bg-sidebar text-sidebar-foreground;
   }
 
-  .sidebar > nav > header,
-  .sidebar > nav > footer {
+  .sidebar nav > header,
+  .sidebar nav > footer {
     @apply gap-2 p-2;
   }
 
-  .sidebar > nav > section {
+  .sidebar nav > section {
     @apply gap-2;
   }
 
-  .sidebar > nav [role=separator] {
+  .sidebar nav [role=separator] {
     @apply border-sidebar-border mx-2;
   }
 
-  .sidebar > nav > section > [role=group] {
+  .sidebar nav > section > [role=group] {
     @apply p-2;
   }
 
-  .sidebar > nav h3 {
+  .sidebar nav h3 {
     @apply text-sidebar-foreground/70 ring-sidebar-ring h-8 rounded-md px-2 text-xs font-medium focus-visible:ring-2 [&>svg]:size-4 transition-[margin,opacity] duration-200 ease-linear;
   }
 
-  .sidebar > nav > section > [role=group] > ul {
+  .sidebar nav > section > [role=group] > ul {
     @apply gap-1;
   }
 
-  .sidebar > nav > section > [role=group] {
+  .sidebar nav > section > [role=group] {
     @apply text-sm;
   }
 
-  .sidebar > nav li > :is(a, button),
-  .sidebar > nav li > details > summary {
+  .sidebar nav li > :is(a, button),
+  .sidebar nav li > details > summary {
     @apply ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground gap-2 rounded-md p-2 text-sm focus-visible:ring-2 text-left focus-visible:outline-hidden data-[open]:hover:bg-sidebar-accent data-[open]:hover:text-sidebar-accent-foreground [&>svg]:shrink-0 [&>svg]:size-4;
   }
 
-  .sidebar > nav li > :is(a, button):is([aria-current=page], [data-active=true]),
-  .sidebar > nav li > details > summary:is([aria-current=page], [data-active=true]) {
+  .sidebar nav li > :is(a, button):is([aria-current=page], [data-active=true]),
+  .sidebar nav li > details > summary:is([aria-current=page], [data-active=true]) {
     @apply bg-sidebar-accent text-sidebar-accent-foreground font-medium;
   }
 
-  .sidebar > nav li > :is(a, button):not([data-variant]),
-  .sidebar > nav li > details > summary:not([data-variant]),
-  .sidebar > nav li > :is(a, button)[data-variant=default],
-  .sidebar > nav li > details > summary[data-variant=default] {
+  .sidebar nav li > :is(a, button):not([data-variant]),
+  .sidebar nav li > details > summary:not([data-variant]),
+  .sidebar nav li > :is(a, button)[data-variant=default],
+  .sidebar nav li > details > summary[data-variant=default] {
     @apply hover:bg-sidebar-accent hover:text-sidebar-accent-foreground;
   }
 
-  .sidebar > nav li > :is(a, button)[data-variant=outline],
-  .sidebar > nav li > details > summary[data-variant=outline] {
+  .sidebar nav li > :is(a, button)[data-variant=outline],
+  .sidebar nav li > details > summary[data-variant=outline] {
     @apply bg-background shadow-[0_0_0_1px_var(--sidebar-border)] hover:shadow-[0_0_0_1px_var(--sidebar-accent)] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground;
   }
 
-  .sidebar > nav li > :is(a, button):not([data-size]),
-  .sidebar > nav li > details > summary:not([data-size]),
-  .sidebar > nav li > :is(a, button)[data-size=default],
-  .sidebar > nav li > details > summary[data-size=default] {
+  .sidebar nav li > :is(a, button):not([data-size]),
+  .sidebar nav li > details > summary:not([data-size]),
+  .sidebar nav li > :is(a, button)[data-size=default],
+  .sidebar nav li > details > summary[data-size=default] {
     @apply h-8 text-sm;
   }
 
-  .sidebar > nav li > :is(a, button)[data-size=sm],
-  .sidebar > nav li > details > summary[data-size=sm] {
+  .sidebar nav li > :is(a, button)[data-size=sm],
+  .sidebar nav li > details > summary[data-size=sm] {
     @apply h-7 text-xs;
   }
 
-  .sidebar > nav li > :is(a, button)[data-size=lg],
-  .sidebar > nav li > details > summary[data-size=lg] {
+  .sidebar nav li > :is(a, button)[data-size=lg],
+  .sidebar nav li > details > summary[data-size=lg] {
     @apply h-12 text-sm;
   }
 
-  .sidebar > nav li > details > summary::after {
+  .sidebar nav li > details > summary::after {
     @apply size-4;
   }
 
-  .sidebar > nav li > details::details-content {
+  .sidebar nav li > details::details-content {
     @apply px-3.5;
   }
 
-  .sidebar > nav ul ul {
+  .sidebar nav ul ul {
     @apply border-sidebar-border translate-x-px gap-1 border-s px-2.5 py-0.5 rtl:-translate-x-px;
   }
 
-  .sidebar > nav ul ul > li > :is(a, button),
-  .sidebar > nav ul ul > li > details > summary {
+  .sidebar nav ul ul > li > :is(a, button),
+  .sidebar nav ul ul > li > details > summary {
     @apply text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground h-7 gap-2 rounded-md px-2 text-sm focus-visible:ring-2 [&>svg]:size-4;
   }
   /* Progress */
@@ -1334,7 +1334,7 @@
 
   /* Tooltip */
   [data-tooltip]::before {
-    @apply bg-foreground text-background inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 text-xs has-[.kbd]:pe-1.5 [&_.kbd]:relative [&_.kbd]:isolate [&_.kbd]:z-50 [&_.kbd]:rounded-sm;
+    @apply bg-foreground text-background rounded-md px-3 py-1.5 text-xs;
   }
 
   [data-tooltip][data-arrow]::after {

src/js/combobox.js

@@ -390,7 +390,11 @@
     }
 
     if (event.key === 'Escape') {
-      root.close(true);
+      if (isOpen) {
+        event.preventDefault();
+        event.stopPropagation();
+        root.close(true);
+      }
       return;
     }
 

src/js/sidebar.js

@@ -30,7 +30,7 @@
 
     const handleClick = (event) => {
       const target = event.target;
-      const nav = sidebarComponent.querySelector(':scope > nav');
+      const nav = sidebarComponent.querySelector('nav');
       const isMobile = window.innerWidth < breakpoint;
 
       if (isMobile && target.closest('a, button') && !target.closest('[data-keep-mobile-sidebar-open]')) {