@kushagradhawan/kookie-ui 0.1.33 → 0.1.35

package/styles.css

@@ -90,42 +90,64 @@
   --duration-3: 100ms;
   --duration-4: 150ms;
   --duration-5: 200ms;
-  --duration-spring-1: 200ms;
-  --duration-spring-2: 250ms;
-  --duration-spring-3: 300ms;
-  --ease-1: ease-out;
-  --ease-2: ease-in-out;
-  --ease-3: cubic-bezier(0.4, 0, 0.2, 1);
-  --ease-4: cubic-bezier(0.25, 0.46, 0.45, 0.94);
-  --ease-5: cubic-bezier(0.68, -0.55, 0.265, 1.55);
+  --duration-spring-1: 100ms;
+  --duration-spring-2: 150ms;
+  --duration-spring-3: 200ms;
+  --ease-1: var(--ease-spring-1);
+  --ease-2: var(--ease-spring-2);
+  --ease-3: var(--ease-spring-3);
+  --ease-4: var(--ease-spring-1);
+  --ease-5: var(--ease-spring-2);
   --ease-spring-1: cubic-bezier(0.25, 0.46, 0.45, 0.94);
   --ease-spring-2: cubic-bezier(0.68, -0.55, 0.265, 1.55);
   --ease-spring-3: cubic-bezier(0.175, 0.885, 0.32, 1.275);
-  --transition-fast: var(--duration-2) var(--ease-1);
-  --transition-standard: var(--duration-3) var(--ease-2);
-  --transition-slow: var(--duration-4) var(--ease-3);
-  --transition-spring-fast: var(--duration-spring-1) var(--ease-spring-1);
-  --transition-spring-standard: var(--duration-spring-2) var(--ease-spring-1);
-  --transition-spring-slow: var(--duration-spring-3) var(--ease-spring-1);
-  --transition-spring-bounce: var(--duration-spring-2) var(--ease-spring-2);
-  --transition-spring-elastic: var(--duration-spring-3) var(--ease-spring-3);
-  --transition-button: background var(--duration-2) var(--ease-1), box-shadow var(--duration-2) var(--ease-1), backdrop-filter var(--duration-2) var(--ease-1), transform var(--duration-1) var(--ease-1), padding var(--duration-1) var(--ease-1);
-  --transition-text-field: background var(--duration-2) var(--ease-1), box-shadow var(--duration-2) var(--ease-1);
-  --transition-select: background var(--duration-2) var(--ease-1), box-shadow var(--duration-2) var(--ease-1);
-  --transition-badge: background var(--duration-2) var(--ease-1), box-shadow var(--duration-2) var(--ease-1), padding var(--duration-1) var(--ease-1);
-  --transition-card: background-color var(--duration-2) var(--ease-1), box-shadow var(--duration-2) var(--ease-1), top var(--duration-2) var(--ease-1);
-  --transition-tabs: color var(--duration-1) var(--ease-1), background-color var(--duration-1) var(--ease-1), font-weight var(--duration-2) var(--ease-2), letter-spacing var(--duration-2) var(--ease-2), word-spacing var(--duration-2) var(--ease-2), transform var(--duration-1) var(--ease-1);
-  --transition-segmented-control: opacity var(--duration-2) var(--ease-1), transform var(--duration-2) var(--ease-3), background-color var(--duration-2) var(--ease-1);
-  --transition-menu: background var(--duration-1) var(--ease-1), color var(--duration-2) var(--ease-1);
-  --transition-checkbox: background-color var(--duration-2) var(--ease-1), box-shadow var(--duration-2) var(--ease-1), color var(--duration-1) var(--ease-1);
-  --transition-radio: background-color var(--duration-2) var(--ease-1), box-shadow var(--duration-2) var(--ease-1), color var(--duration-1) var(--ease-1);
-  --transition-focus: outline var(--duration-2) var(--ease-1), outline-offset var(--duration-2) var(--ease-1);
-  --transition-progress: transform var(--duration-2) var(--ease-1);
-  --transition-accordion-content: height var(--duration-spring-2) var(--ease-spring-1), opacity var(--duration-spring-2) var(--ease-spring-1), transform var(--duration-spring-2) var(--ease-spring-1);
-  --transition-accordion-trigger: background-color var(--duration-spring-1) var(--ease-spring-1), transform var(--duration-spring-1) var(--ease-spring-1);
-  --transition-accordion-trigger-active: transform var(--duration-1) var(--ease-spring-2);
-  --transition-spring-gpu: transform var(--duration-spring-2) var(--ease-spring-1), opacity var(--duration-spring-2) var(--ease-spring-1);
-  --transition-spring-gpu-fast: transform var(--duration-spring-1) var(--ease-spring-1), opacity var(--duration-spring-1) var(--ease-spring-1);
+  --transition-fast: var(--motion-duration-micro) var(--motion-ease-standard);
+  --transition-standard: var(--motion-duration-small) var(--motion-ease-standard);
+  --transition-slow: var(--motion-duration-medium) var(--motion-ease-smooth);
+  --transition-spring-fast: var(--motion-duration-micro) var(--motion-spring-snappy);
+  --transition-spring-standard: var(--motion-duration-small) var(--motion-spring-snappy);
+  --transition-spring-slow: var(--motion-duration-medium) var(--motion-spring-snappy);
+  --transition-spring-bounce: var(--motion-duration-small) var(--motion-spring-bounce);
+  --transition-spring-elastic: var(--motion-duration-medium) var(--motion-spring-elastic);
+  --motion-duration-micro: 75ms;
+  --motion-duration-small: 150ms;
+  --motion-duration-medium: 250ms;
+  --motion-duration-large: 350ms;
+  --motion-ease-standard: ease-in-out;
+  --motion-ease-smooth: cubic-bezier(0.4, 0, 0.2, 1);
+  --motion-ease-anticipate: cubic-bezier(0.36, 0, 0.66, -0.56);
+  --motion-ease-follow: cubic-bezier(0.34, 1.56, 0.64, 1);
+  --motion-spring-snappy: var(--ease-spring-1);
+  --motion-spring-bounce: var(--ease-spring-2);
+  --motion-spring-elastic: var(--ease-spring-3);
+  --motion-stagger-1: 15ms;
+  --motion-stagger-2: 30ms;
+  --motion-stagger-3: 45ms;
+  --spring-snappy-mass: 1;
+  --spring-snappy-stiffness: 280;
+  --spring-snappy-damping: 24;
+  --spring-snappy-initial-velocity: 0;
+  --spring-smooth-mass: 1;
+  --spring-smooth-stiffness: 200;
+  --spring-smooth-damping: 30;
+  --spring-smooth-initial-velocity: 0;
+  --transition-button: background var(--motion-duration-small) var(--motion-ease-standard), box-shadow var(--motion-duration-small) var(--motion-ease-standard), backdrop-filter var(--motion-duration-small) var(--motion-ease-standard), transform var(--motion-duration-micro) var(--motion-spring-snappy), padding var(--motion-duration-micro) var(--motion-ease-standard);
+  --transition-text-field: background var(--motion-duration-small) var(--motion-ease-standard), box-shadow var(--motion-duration-small) var(--motion-ease-standard);
+  --transition-select: background var(--motion-duration-small) var(--motion-ease-standard), box-shadow var(--motion-duration-small) var(--motion-ease-standard);
+  --transition-badge: background var(--motion-duration-small) var(--motion-ease-standard), box-shadow var(--motion-duration-small) var(--motion-ease-standard), padding var(--motion-duration-micro) var(--motion-ease-standard);
+  --transition-card: background-color var(--motion-duration-small) var(--motion-ease-standard), box-shadow var(--motion-duration-small) var(--motion-ease-standard), top var(--motion-duration-small) var(--motion-ease-standard);
+  --transition-tabs: color var(--motion-duration-micro) var(--motion-ease-standard), background-color var(--motion-duration-micro) var(--motion-ease-standard), font-weight var(--motion-duration-small) var(--motion-ease-standard), letter-spacing var(--motion-duration-small) var(--motion-ease-standard), word-spacing var(--motion-duration-small) var(--motion-ease-standard), transform var(--motion-duration-micro) var(--motion-spring-snappy);
+  --transition-segmented-control: opacity var(--motion-duration-small) var(--motion-ease-standard), transform var(--motion-duration-small) var(--motion-spring-snappy), background-color var(--motion-duration-small) var(--motion-ease-standard);
+  --transition-menu: background var(--motion-duration-micro) var(--motion-ease-standard), color var(--motion-duration-small) var(--motion-ease-standard);
+  --transition-checkbox: background-color var(--motion-duration-small) var(--motion-ease-standard), box-shadow var(--motion-duration-small) var(--motion-ease-standard), color var(--motion-duration-micro) var(--motion-ease-standard);
+  --transition-radio: background-color var(--motion-duration-small) var(--motion-ease-standard), box-shadow var(--motion-duration-small) var(--motion-ease-standard), color var(--motion-duration-micro) var(--motion-ease-standard);
+  --transition-focus: outline var(--motion-duration-small) var(--motion-ease-standard), outline-offset var(--motion-duration-small) var(--motion-ease-standard);
+  --transition-progress: transform var(--motion-duration-small) var(--motion-ease-standard);
+  --transition-accordion-content: height var(--motion-duration-small) var(--motion-spring-snappy), opacity var(--motion-duration-small) var(--motion-spring-snappy), transform var(--motion-duration-small) var(--motion-spring-snappy);
+  --transition-accordion-trigger: background-color var(--motion-duration-small) var(--motion-spring-snappy), transform var(--motion-duration-micro) var(--motion-spring-snappy);
+  --transition-accordion-trigger-active: transform var(--motion-duration-micro) var(--motion-spring-bounce);
+  --transition-spring-gpu: transform var(--motion-duration-small) var(--motion-spring-snappy), opacity var(--motion-duration-small) var(--motion-spring-snappy);
+  --transition-spring-gpu-fast: transform var(--motion-duration-micro) var(--motion-spring-snappy), opacity var(--motion-duration-micro) var(--motion-spring-snappy);
   --font-size-0: calc(10px * var(--scaling));
   --font-size-1: calc(12px * var(--scaling));
   --font-size-2: calc(14px * var(--scaling));
@@ -240,7 +262,7 @@
   --scrollarea-scrollbar-vertical-margin-bottom: var(--space-1);
   --scrollarea-scrollbar-vertical-margin-left: var(--space-1);
   --scrollarea-scrollbar-vertical-margin-right: var(--space-1);
-  --segmented-control-transition-duration: var(--duration-1);
+  --segmented-control-transition-duration: var(--motion-duration-micro);
   --spinner-animation-duration: 800ms;
   --spinner-opacity: 0.65;
   color: var(--gray-12);
@@ -3509,11 +3531,11 @@
   --surface-opacity-light: var(--opacity-5);
   --surface-opacity-heavy: var(--opacity-6);
   --surface-opacity-dark: var(--opacity-7);
-  --dialog-opacity: var(--opacity-7);
+  --dialog-opacity: var(--opacity-9);
   --dialog-opacity-percentage: calc(var(--dialog-opacity) * 100%);
-  --panel-opacity: var(--opacity-6);
+  --panel-opacity: var(--opacity-8);
   --panel-opacity-percentage: calc(var(--panel-opacity) * 100%);
-  --surface-opacity: var(--opacity-5);
+  --surface-opacity: var(--opacity-7);
   --surface-opacity-percentage: calc(var(--surface-opacity) * 100%);
   --border-width-standard: 1px;
   --classic-elevation-offset: -0.02em;
@@ -3588,6 +3610,7 @@
   --position-negative-full: -100%;
   --position-zero: 0%;
   --transition-background-blur: background-color var(--duration-2) var(--ease-1);
+  --sheet-slide-distance: 50%;
   --spacing-multiplier-small: 0.5;
   --spacing-multiplier-medium: 0.75;
   --spacing-multiplier-large: 1.25;
@@ -3642,8 +3665,6 @@
   --avatar-image-active-filter: brightness(0.9) saturate(1.1);
   --base-button-solid-high-contrast-hover-filter: contrast(0.88) saturate(1.1) brightness(1.1);
   --segmented-control-indicator-background-color: var(--color-background);
-  --sidebar-icon-width-1: calc(var(--space-9) + var(--space-1));
-  --sidebar-icon-width-2: calc(var(--space-9) + var(--space-3));
   --slider-range-high-contrast-background-image: linear-gradient(var(--black-a8), var(--black-a8));
 }
 @supports (color: color(display-p3 1 1 1)) {
@@ -5188,65 +5209,81 @@
 @keyframes rt-slide-from-top {
   from{
     transform: translateY(4px) scale(0.97);
+    opacity: 0.5;
   }
   to{
     transform: translateY(0) scale(1);
+    opacity: 1;
   }
 }
 @keyframes rt-slide-to-top {
   from{
     transform: translateY(0) scale(1);
+    opacity: 1;
   }
   to{
     transform: translateY(4px) scale(0.97);
+    opacity: 0.5;
   }
 }
 @keyframes rt-slide-from-bottom {
   from{
     transform: translateY(-4px) scale(0.97);
+    opacity: 0.5;
   }
   to{
     transform: translateY(0) scale(1);
+    opacity: 1;
   }
 }
 @keyframes rt-slide-to-bottom {
   from{
     transform: translateY(0) scale(1);
+    opacity: 1;
   }
   to{
     transform: translateY(-4px) scale(0.97);
+    opacity: 0.5;
   }
 }
 @keyframes rt-slide-from-left {
   from{
     transform: translateX(4px) scale(0.97);
+    opacity: 0.5;
   }
   to{
     transform: translateX(0) scale(1);
+    opacity: 1;
   }
 }
 @keyframes rt-slide-to-left {
   from{
     transform: translateX(0) scale(1);
+    opacity: 1;
   }
   to{
     transform: translateX(4px) scale(0.97);
+    opacity: 0.5;
   }
 }
 @keyframes rt-slide-from-right {
   from{
     transform: translateX(-4px) scale(0.97);
+    opacity: 0.5;
   }
   to{
     transform: translateX(0) scale(1);
+    opacity: 1;
   }
 }
 @keyframes rt-slide-to-right {
   from{
     transform: translateX(0) scale(1);
+    opacity: 1;
   }
   to{
     transform: translateX(-4px) scale(0.97);
+    opacity: 0.5;
   }
 }
 @keyframes rt-tab-indicator-appear {
@@ -5264,10 +5301,10 @@
 }
 @media (prefers-reduced-motion: no-preference) {
   .rt-PopperContent{
-    animation-timing-function: var(--ease-3);
+    animation-timing-function: var(--motion-spring-snappy);
   }
   .rt-PopperContent:where([data-state='open']){
-    animation-duration: var(--duration-2);
+    animation-duration: var(--motion-duration-small);
   }
   .rt-PopperContent:where([data-state='open']):where([data-side='top']){
     animation-name: rt-slide-from-top, rt-fade-in;
@@ -5285,7 +5322,7 @@
     animation-name: rt-slide-from-bottom, rt-fade-in;
   }
   .rt-PopperContent:where([data-state='closed']){
-    animation-duration: var(--duration-1);
+    animation-duration: var(--motion-duration-small);
   }
   .rt-PopperContent:where([data-state='closed']):where([data-side='top']){
     animation-name: rt-slide-to-top, rt-fade-out;
@@ -5303,7 +5340,99 @@
     animation-name: rt-slide-to-bottom, rt-fade-out;
   }
   .rt-BaseTabListTrigger:where([data-state='active'], [data-active])::before{
-    animation: rt-tab-indicator-appear var(--duration-2) var(--ease-3);
+    animation: rt-tab-indicator-appear var(--motion-duration-small) var(--motion-spring-snappy);
+  }
+}
+@keyframes rt-dialog-overlay-no-op {
+  from{
+    opacity: 1;
+  }
+  to{
+    opacity: 1;
+  }
+}
+@keyframes rt-dialog-content-show {
+  from{
+    opacity: 0;
+    transform: translateY(5px) scale(0.97);
+  }
+  to{
+    opacity: 1;
+    transform: translateY(0px) scale(1);
+  }
+}
+@keyframes rt-dialog-content-hide {
+  from{
+    opacity: 1;
+    transform: translateY(0px) scale(1);
+  }
+  to{
+    opacity: 0;
+    transform: translateY(5px) scale(0.99);
+  }
+}
+@keyframes rt-sheet-open-from-start {
+  from{
+    transform: translate3d(calc(-1 * var(--sheet-slide-distance)), 0, 0);
+  }
+  to{
+    transform: translate3d(0, 0, 0);
+  }
+}
+@keyframes rt-sheet-close-to-start {
+  from{
+    transform: translate3d(0, 0, 0);
+  }
+  to{
+    transform: translate3d(calc(-1 * var(--sheet-slide-distance)), 0, 0);
+  }
+}
+@keyframes rt-sheet-open-from-end {
+  from{
+    transform: translate3d(var(--sheet-slide-distance), 0, 0);
+  }
+  to{
+    transform: translate3d(0, 0, 0);
+  }
+}
+@keyframes rt-sheet-close-to-end {
+  from{
+    transform: translate3d(0, 0, 0);
+  }
+  to{
+    transform: translate3d(var(--sheet-slide-distance), 0, 0);
+  }
+}
+@keyframes rt-sheet-open-from-top {
+  from{
+    transform: translate3d(0, calc(-1 * var(--sheet-slide-distance)), 0);
+  }
+  to{
+    transform: translate3d(0, 0, 0);
+  }
+}
+@keyframes rt-sheet-close-to-top {
+  from{
+    transform: translate3d(0, 0, 0);
+  }
+  to{
+    transform: translate3d(0, calc(-1 * var(--sheet-slide-distance)), 0);
+  }
+}
+@keyframes rt-sheet-open-from-bottom {
+  from{
+    transform: translate3d(0, var(--sheet-slide-distance), 0);
+  }
+  to{
+    transform: translate3d(0, 0, 0);
+  }
+}
+@keyframes rt-sheet-close-to-bottom {
+  from{
+    transform: translate3d(0, 0, 0);
+  }
+  to{
+    transform: translate3d(0, var(--sheet-slide-distance), 0);
   }
 }
 .rt-Box{
@@ -6324,10 +6453,10 @@
   font-size: var(--font-size-4);
 }
 :where(.rt-AccordionContent[data-state="open"]){
-  animation: rt-slide-down var(--duration-spring-2) var(--ease-spring-1);
+  animation: rt-slide-down var(--motion-duration-small) var(--motion-spring-snappy);
 }
 :where(.rt-AccordionContent[data-state="closed"]){
-  animation: rt-slide-up var(--duration-spring-1) var(--ease-spring-1);
+  animation: rt-slide-up var(--motion-duration-micro) var(--motion-spring-snappy);
 }
 @keyframes rt-slide-down {
   0%{
@@ -6674,36 +6803,8 @@
   }
 }
 @media (prefers-reduced-motion: no-preference) {
-  @keyframes rt-dialog-overlay-no-op {
-    from{
-      opacity: 1;
-    }
-    to{
-      opacity: 1;
-    }
-  }
-  @keyframes rt-dialog-content-show {
-    from{
-      opacity: 0;
-      transform: translateY(5px) scale(0.97);
-    }
-    to{
-      opacity: 1;
-      transform: translateY(0px) scale(1);
-    }
-  }
-  @keyframes rt-dialog-content-hide {
-    from{
-      opacity: 1;
-      transform: translateY(0px) scale(1);
-    }
-    to{
-      opacity: 0;
-      transform: translateY(5px) scale(0.99);
-    }
-  }
   .rt-BaseDialogOverlay:where([data-state='closed']){
-    animation: rt-dialog-overlay-no-op var(--duration-4) var(--ease-spring-1);
+    animation: rt-dialog-overlay-no-op var(--motion-duration-small) var(--motion-spring-snappy);
   }
   .rt-BaseDialogOverlay:where([data-state='open'])::before{
     animation: rt-fade-in var(--duration-5) var(--ease-spring-1);
@@ -6713,11 +6814,11 @@
     animation: rt-fade-out var(--duration-4) var(--ease-spring-1);
   }
   .rt-BaseDialogContent:where([data-state='open']){
-    animation: rt-dialog-content-show var(--duration-5) var(--ease-spring-1);
+    animation: rt-dialog-content-show var(--motion-duration-medium) var(--motion-spring-snappy);
   }
   .rt-BaseDialogContent:where([data-state='closed']){
     opacity: 0;
-    animation: rt-dialog-content-hide var(--duration-3) var(--ease-spring-1);
+    animation: rt-dialog-content-hide var(--motion-duration-small) var(--motion-spring-snappy);
   }
 }
 @supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
@@ -10343,16 +10444,16 @@
 }
 .rt-BaseCard:where(.rt-variant-soft){
   --card-border-width: 0px;
-  --card-background-color: var(--gray-2);
+  --card-background-color: var(--gray-3);
 }
 :where([data-panel-background='translucent'], [data-material='translucent']) .rt-BaseCard:where(.rt-variant-soft){
-  --card-background-color: color-mix(in srgb, var(--gray-a2), var(--gray-2) 60%);
+  --card-background-color: color-mix(in srgb, var(--gray-a3), var(--gray-3) 60%);
 }
 .rt-BaseCard:where(.rt-variant-soft):where([data-panel-background='solid'], [data-material='solid']){
-  --card-background-color: var(--gray-2);
+  --card-background-color: var(--gray-3);
 }
 .rt-BaseCard:where(.rt-variant-soft):where([data-panel-background='translucent'], [data-material='translucent']){
-  --card-background-color: color-mix(in srgb, var(--gray-a2), var(--gray-2) 60%);
+  --card-background-color: color-mix(in srgb, var(--gray-a3), var(--gray-3) 60%);
 }
 .rt-BaseCard:where(.rt-variant-soft)::before{
   background-color: var(--card-background-color);
@@ -12411,10 +12512,10 @@
   }
 }
 :where([data-panel-background='translucent']) :is(.rt-BaseMenuContent:where(.rt-variant-solid, .rt-variant-soft) :where(.rt-BaseMenuSubTrigger)){
-  transition: background var(--duration-1) var(--ease-1), color var(--duration-2) var(--ease-1);
+  transition: background var(--motion-duration-micro) var(--motion-ease-standard), color var(--motion-duration-small) var(--motion-ease-standard);
 }
 :where([data-panel-background='translucent']) :is(.rt-BaseMenuContent:where(.rt-variant-solid, .rt-variant-soft) :where(.rt-BaseMenuItem)){
-  transition: background var(--duration-1) var(--ease-1), color var(--duration-2) var(--ease-1);
+  transition: background var(--motion-duration-micro) var(--motion-ease-standard), color var(--motion-duration-small) var(--motion-ease-standard);
 }
 .rt-BaseMenuContent:where(.rt-variant-solid) :where(.rt-BaseMenuSubTrigger[data-state='open']){
   background-color: var(--gray-3);
@@ -14024,7 +14125,7 @@
 }
 .rt-Image:where(:any-link, button, label){
   cursor: pointer;
-  transition: var(--transition-card), filter var(--duration-2) var(--ease-1);
+  transition: var(--transition-card), filter var(--motion-duration-small) var(--motion-ease-standard);
 }
 @media (hover: hover) {
   .rt-Image:where(:any-link, button, label):where(:hover){
@@ -14041,7 +14142,7 @@
 }
 :where(:any-link, button, label){
   cursor: pointer;
-  transition: var(--transition-card), filter var(--duration-2) var(--ease-1);
+  transition: var(--transition-card), filter var(--motion-duration-small) var(--motion-ease-standard);
 }
 @media (hover: hover) {
   :where(:any-link, button, label):where(:hover){
@@ -15082,6 +15183,7 @@
   --inset-padding-right: var(--popover-content-padding);
   --inset-padding-bottom: var(--popover-content-padding);
   --inset-padding-left: var(--popover-content-padding);
+  --popover-toolbar-padding: var(--popover-content-padding);
   padding: var(--popover-content-padding);
   box-sizing: border-box;
   transform-origin: var(--radix-popover-content-transform-origin);
@@ -15101,109 +15203,172 @@
   -webkit-backdrop-filter: var(--backdrop-filter-panel);
           backdrop-filter: var(--backdrop-filter-panel);
 }
+.rt-PopoverContent:where([data-has-toolbar]){
+  padding-top: var(--popover-toolbar-offset, var(--popover-content-padding));
+}
+.rt-PopoverToolbar{
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  z-index: 1;
+  display: grid;
+  grid-template-columns: 1fr auto 1fr;
+  align-items: center;
+  column-gap: var(--space-1);
+  padding: var(--popover-toolbar-padding);
+  background-color: var(--color-panel);
+}
+.rt-PopoverToolbarSection{
+  display: flex;
+  align-items: center;
+  gap: var(--space-2);
+}
+.rt-PopoverToolbarLeft{
+  justify-self: start;
+}
+.rt-PopoverToolbarCenter{
+  grid-column: 2;
+  justify-self: center;
+  min-width: 0;
+  text-align: center;
+}
+.rt-PopoverToolbarRight{
+  justify-self: end;
+}
+.rt-PopoverToolbarTitle{
+  display: inline-block;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
 .rt-PopoverContent:where(.rt-r-size-1){
   --popover-content-padding: var(--space-5);
+  --popover-toolbar-padding: var(--space-2);
   border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-2)));
 }
 .rt-PopoverContent:where(.rt-r-size-2){
   --popover-content-padding: var(--space-6);
+  --popover-toolbar-padding: var(--space-2);
   border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-3)));
 }
 .rt-PopoverContent:where(.rt-r-size-3){
   --popover-content-padding: var(--space-7);
+  --popover-toolbar-padding: var(--space-3);
   border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-4)));
 }
 .rt-PopoverContent:where(.rt-r-size-4){
   --popover-content-padding: var(--space-8);
+  --popover-toolbar-padding: var(--space-4);
   border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-5)));
 }
 @media (min-width: 520px){
   .rt-PopoverContent:where(.xs\:rt-r-size-1){
     --popover-content-padding: var(--space-5);
+    --popover-toolbar-padding: var(--space-2);
     border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-2)));
   }
   .rt-PopoverContent:where(.xs\:rt-r-size-2){
     --popover-content-padding: var(--space-6);
+    --popover-toolbar-padding: var(--space-2);
     border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-3)));
   }
   .rt-PopoverContent:where(.xs\:rt-r-size-3){
     --popover-content-padding: var(--space-7);
+    --popover-toolbar-padding: var(--space-3);
     border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-4)));
   }
   .rt-PopoverContent:where(.xs\:rt-r-size-4){
     --popover-content-padding: var(--space-8);
+    --popover-toolbar-padding: var(--space-4);
     border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-5)));
   }
 }
 @media (min-width: 768px){
   .rt-PopoverContent:where(.sm\:rt-r-size-1){
     --popover-content-padding: var(--space-5);
+    --popover-toolbar-padding: var(--space-2);
     border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-2)));
   }
   .rt-PopoverContent:where(.sm\:rt-r-size-2){
     --popover-content-padding: var(--space-6);
+    --popover-toolbar-padding: var(--space-2);
     border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-3)));
   }
   .rt-PopoverContent:where(.sm\:rt-r-size-3){
     --popover-content-padding: var(--space-7);
+    --popover-toolbar-padding: var(--space-3);
     border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-4)));
   }
   .rt-PopoverContent:where(.sm\:rt-r-size-4){
     --popover-content-padding: var(--space-8);
+    --popover-toolbar-padding: var(--space-4);
     border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-5)));
   }
 }
 @media (min-width: 1024px){
   .rt-PopoverContent:where(.md\:rt-r-size-1){
     --popover-content-padding: var(--space-5);
+    --popover-toolbar-padding: var(--space-2);
     border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-2)));
   }
   .rt-PopoverContent:where(.md\:rt-r-size-2){
     --popover-content-padding: var(--space-6);
+    --popover-toolbar-padding: var(--space-2);
     border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-3)));
   }
   .rt-PopoverContent:where(.md\:rt-r-size-3){
     --popover-content-padding: var(--space-7);
+    --popover-toolbar-padding: var(--space-3);
     border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-4)));
   }
   .rt-PopoverContent:where(.md\:rt-r-size-4){
     --popover-content-padding: var(--space-8);
+    --popover-toolbar-padding: var(--space-4);
     border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-5)));
   }
 }
 @media (min-width: 1280px){
   .rt-PopoverContent:where(.lg\:rt-r-size-1){
     --popover-content-padding: var(--space-5);
+    --popover-toolbar-padding: var(--space-2);
     border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-2)));
   }
   .rt-PopoverContent:where(.lg\:rt-r-size-2){
     --popover-content-padding: var(--space-6);
+    --popover-toolbar-padding: var(--space-2);
     border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-3)));
   }
   .rt-PopoverContent:where(.lg\:rt-r-size-3){
     --popover-content-padding: var(--space-7);
+    --popover-toolbar-padding: var(--space-3);
     border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-4)));
   }
   .rt-PopoverContent:where(.lg\:rt-r-size-4){
     --popover-content-padding: var(--space-8);
+    --popover-toolbar-padding: var(--space-4);
     border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-5)));
   }
 }
 @media (min-width: 1640px){
   .rt-PopoverContent:where(.xl\:rt-r-size-1){
     --popover-content-padding: var(--space-5);
+    --popover-toolbar-padding: var(--space-2);
     border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-2)));
   }
   .rt-PopoverContent:where(.xl\:rt-r-size-2){
     --popover-content-padding: var(--space-6);
+    --popover-toolbar-padding: var(--space-2);
     border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-3)));
   }
   .rt-PopoverContent:where(.xl\:rt-r-size-3){
     --popover-content-padding: var(--space-7);
+    --popover-toolbar-padding: var(--space-3);
     border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-4)));
   }
   .rt-PopoverContent:where(.xl\:rt-r-size-4){
     --popover-content-padding: var(--space-8);
+    --popover-toolbar-padding: var(--space-4);
     border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-5)));
   }
 }
@@ -16159,6 +16324,103 @@
 .rt-RadioGroupItemInner{
   min-width: 0;
 }
+:where(.rt-SheetContent){
+  position: fixed !important;
+  width: var(--width, 90vw) !important;
+  max-width: var(--max-width, 100vw) !important;
+  height: 100vh !important;
+  max-height: 100vh !important;
+  margin: 0 !important;
+  border-radius: 0 !important;
+  will-change: transform;
+}
+:where(.rt-SheetContent[data-side='start']){
+  top: 0 !important;
+  bottom: 0 !important;
+  left: 0 !important;
+  right: auto !important;
+  margin: 0 !important;
+  border-start-start-radius: 0;
+  border-end-start-radius: 0;
+}
+:where(.rt-SheetContent[data-side='end']){
+  top: 0 !important;
+  bottom: 0 !important;
+  right: 0 !important;
+  left: auto !important;
+  margin: 0 !important;
+  border-start-end-radius: 0;
+  border-end-end-radius: 0;
+}
+:where(.rt-SheetContent[data-side='top']){
+  top: 0 !important;
+  left: 0 !important;
+  right: 0 !important;
+  bottom: auto !important;
+  width: auto !important;
+  max-width: none !important;
+  height: var(--height, 75vh) !important;
+  margin: 0 !important;
+  border-start-start-radius: 0;
+  border-start-end-radius: 0;
+}
+:where(.rt-SheetContent[data-side='bottom']){
+  bottom: 0 !important;
+  left: 0 !important;
+  right: 0 !important;
+  top: auto !important;
+  width: auto !important;
+  max-width: none !important;
+  height: var(--height, 75vh) !important;
+  margin: 0 !important;
+  border-end-start-radius: 0;
+  border-end-end-radius: 0;
+}
+:where(.rt-SheetOverlay)::before{
+  opacity: 1;
+}
+@media (prefers-reduced-motion: no-preference) {
+  .rt-SheetContent:where([data-state='open']){
+    animation-duration: var(--motion-duration-medium);
+    animation-timing-function: var(--motion-spring-snappy);
+    animation-fill-mode: both;
+  }
+  .rt-SheetContent:where([data-state='closed']){
+    opacity: 1;
+    animation-duration: var(--motion-duration-small);
+    animation-timing-function: var(--motion-spring-snappy);
+    animation-fill-mode: both;
+  }
+  .rt-SheetContent:where([data-state='open'][data-side='start']){
+    animation-name: rt-sheet-open-from-start, rt-fade-in !important;
+  }
+  .rt-SheetContent:where([data-state='closed'][data-side='start']){
+    animation-name: rt-sheet-close-to-start, rt-fade-out !important;
+  }
+  .rt-SheetContent:where([data-state='open'][data-side='end']){
+    animation-name: rt-sheet-open-from-end, rt-fade-in !important;
+  }
+  .rt-SheetContent:where([data-state='closed'][data-side='end']){
+    animation-name: rt-sheet-close-to-end, rt-fade-out !important;
+  }
+  .rt-SheetContent:where([data-state='open'][data-side='top']){
+    animation-name: rt-sheet-open-from-top, rt-fade-in !important;
+  }
+  .rt-SheetContent:where([data-state='closed'][data-side='top']){
+    animation-name: rt-sheet-close-to-top, rt-fade-out !important;
+  }
+  .rt-SheetContent:where([data-state='open'][data-side='bottom']){
+    animation-name: rt-sheet-open-from-bottom, rt-fade-in !important;
+  }
+  .rt-SheetContent:where([data-state='closed'][data-side='bottom']){
+    animation-name: rt-sheet-close-to-bottom, rt-fade-out !important;
+  }
+}
+@media (prefers-reduced-motion: reduce) {
+  .rt-SheetContent{
+    animation: none !important;
+  }
+}
 .rt-ScrollAreaRoot{
   display: flex;
   flex-direction: column;
@@ -16194,8 +16456,8 @@
   touch-action: none;
   background-color: var(--gray-a3);
   border-radius: var(--scrollarea-scrollbar-border-radius);
-  animation-duration: 120ms;
-  animation-timing-function: ease-out;
+  animation-duration: var(--motion-duration-micro);
+  animation-timing-function: var(--motion-ease-standard);
 }
 .rt-ScrollAreaScrollbar:where([data-orientation='vertical']){
   flex-direction: column;
@@ -16217,7 +16479,7 @@
   position: relative;
   background-color: var(--gray-a8);
   border-radius: inherit;
-  transition: background-color 100ms;
+  transition: background-color var(--motion-duration-micro) var(--motion-ease-standard);
 }
 .rt-ScrollAreaThumb::before{
   content: '';
@@ -16413,7 +16675,7 @@
   margin-right: calc(-1 * var(--border-width-standard) * 0.5);
   width: var(--border-width-standard);
   background-color: var(--gray-a4);
-  transition: opacity calc(0.8 * var(--segmented-control-transition-duration)) var(--ease-1);
+  transition: opacity calc(0.8 * var(--segmented-control-transition-duration)) var(--motion-ease-standard);
 }
 :where(.rt-SegmentedControlItem:first-child) .rt-SegmentedControlItemSeparator,
   :where(.rt-SegmentedControlItem:where([data-state='on'], :focus-visible)) .rt-SegmentedControlItemSeparator,
@@ -16432,7 +16694,7 @@
   left: 0;
   height: 100%;
   pointer-events: none;
-  transition: transform var(--segmented-control-transition-duration) var(--ease-3);
+  transition: transform var(--segmented-control-transition-duration) var(--motion-spring-snappy);
 }
 .rt-SegmentedControlIndicator::before{
   inset: var(--border-width-standard);
@@ -18547,7 +18809,7 @@
   justify-content: space-between;
 }
 .rt-SidebarMenuSubTrigger :where(.rt-SidebarMenuSubTriggerIcon){
-  transition: transform 0.2s ease;
+  transition: transform var(--motion-duration-micro) var(--motion-ease-standard);
 }
 .rt-SidebarMenuSubTrigger:where([data-state="open"]) :where(.rt-SidebarMenuSubTriggerIcon){
   transform: rotate(90deg);
@@ -18559,10 +18821,10 @@
   overflow: visible;
 }
 .rt-SidebarMenuSubContent:where([data-state="open"]){
-  animation: rt-sidebar-slide-down 200ms ease-out;
+  animation: rt-sidebar-slide-down var(--motion-duration-small) var(--motion-ease-standard);
 }
 .rt-SidebarMenuSubContent:where([data-state="closed"]){
-  animation: rt-sidebar-slide-up 200ms ease-out;
+  animation: rt-sidebar-slide-up var(--motion-duration-small) var(--motion-ease-standard);
 }
 @keyframes rt-sidebar-slide-down {
   from{
@@ -18639,6 +18901,43 @@
   margin-top: calc(var(--space-1) / 2);
   margin-bottom: calc(var(--space-1) / 2);
 }
+.rt-ShellSidebarRail :where(.rt-SidebarContent),
+:where(.rt-ShellSidebar[data-state='rail'] .rt-SidebarContent){
+  padding: var(--space-2);
+}
+.rt-ShellSidebarRail :where(.rt-SidebarMenuButton),
+:where(.rt-ShellSidebar[data-state='rail'] .rt-SidebarMenuButton){
+  justify-content: center;
+  align-items: center;
+  flex-direction: column;
+  gap: var(--space-1);
+  padding: var(--space-2) var(--space-1);
+}
+.rt-ShellSidebarRail :where(.rt-SidebarMenuBadge),
+.rt-ShellSidebarRail :where(.rt-SidebarMenuShortcut),
+:where(.rt-ShellSidebar[data-state='rail'] .rt-SidebarMenuBadge),
+:where(.rt-ShellSidebar[data-state='rail'] .rt-SidebarMenuShortcut){
+  display: none;
+}
+.rt-ShellSidebarRail :where(.rt-SidebarGroupLabel),
+:where(.rt-ShellSidebar[data-state='rail'] .rt-SidebarGroupLabel){
+  display: block;
+  text-align: center;
+  font-size: var(--font-size-0);
+  line-height: var(--line-height-0);
+  color: var(--gray-a9);
+  font-weight: var(--font-weight-medium);
+}
+.rt-ShellSidebarRail :where(.rt-SidebarMenuSubTriggerIcon),
+:where(.rt-ShellSidebar[data-state='rail'] .rt-SidebarMenuSubTriggerIcon){
+  display: none;
+}
+.rt-ShellSidebarRail :where(.rt-SidebarMenuSubList),
+:where(.rt-ShellSidebar[data-state='rail'] .rt-SidebarMenuSubList){
+  padding-left: 0;
+  border-left: none;
+  margin-left: 0;
+}
 .rt-SidebarContainer:where(.rt-variant-outline){
   background-color: var(--color-panel);
   -webkit-backdrop-filter: var(--backdrop-filter-panel);
@@ -18855,7 +19154,7 @@
   -webkit-user-select: none;
           user-select: none;
   justify-content: flex-start;
-  transition: background var(--duration-2) var(--ease-1), box-shadow var(--duration-2) var(--ease-1), filter var(--duration-2) var(--ease-1);
+  transition: background var(--motion-duration-small) var(--motion-ease-standard), box-shadow var(--motion-duration-small) var(--motion-ease-standard), filter var(--motion-duration-small) var(--motion-ease-standard);
 }
 .rt-SidebarHeader :where(.rt-SidebarMenuButton):where(:focus-visible), .rt-SidebarFooter :where(.rt-SidebarMenuButton):where(:focus-visible){
   outline: 2px solid var(--focus-8);
@@ -19419,172 +19718,100 @@
 .rt-SidebarHeader:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-active]) :where(.rt-Text[data-accent-color='gray'], [data-accent-color='gray']:not(.rt-Badge)), .rt-SidebarContent:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-active]) :where(.rt-Text[data-accent-color='gray'], [data-accent-color='gray']:not(.rt-Badge)), .rt-SidebarFooter:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-active]) :where(.rt-Text[data-accent-color='gray'], [data-accent-color='gray']:not(.rt-Badge)){
   color: var(--gray-11) !important;
 }
-.rt-SidebarRoot:where([data-collapsible="icon"]){
-  transition: none;
-  overflow: visible;
-  flex-shrink: 0;
-}
-.rt-SidebarRoot:where([data-collapsible="icon"][data-state="collapsed"]){
-  opacity: 1;
-  pointer-events: auto;
-}
-.rt-SidebarRoot:where([data-collapsible="icon"][data-state="collapsed"]):where(.rt-r-size-1){
-  width: var(--sidebar-icon-width-1);
-  min-width: var(--sidebar-icon-width-1);
-  --sidebar-group-label-width: calc(var(--sidebar-icon-width-1) - (var(--space-2) * 2));
-  --sidebar-button-label-width: calc(var(--sidebar-group-label-width) - (var(--space-1) * 2));
+.rt-ShellRoot{
+  inline-size: 100%;
+  display: flex;
+  flex-direction: column;
+  block-size: 100vh;
+  --shell-sidebar-rail-width: var(--space-9, 64px);
+  --shell-sidebar-panel-width: 288px;
+  --shell-sidebar-combined-width: calc(var(--shell-sidebar-rail-width) + var(--shell-sidebar-panel-width));
+  --shell-overlay-width: auto;
 }
-.rt-SidebarRoot:where([data-collapsible="icon"][data-state="collapsed"]):where(.rt-r-size-2){
-  width: var(--sidebar-icon-width-2);
-  min-width: var(--sidebar-icon-width-2);
-  --sidebar-group-label-width: calc(var(--sidebar-icon-width-2) - (var(--space-2) * 2));
-  --sidebar-button-label-width: calc(var(--sidebar-group-label-width) - (var(--space-1) * 2));
+@supports (height: 100dvh) {
+  .rt-ShellRoot{
+    block-size: 100dvh;
+  }
 }
-.rt-SidebarRoot:where([data-collapsible="icon"][data-state="expanded"]){
-  width: var(--sidebar-width);
-  min-width: var(--sidebar-width);
-  opacity: 1;
-  pointer-events: auto;
+.rt-ShellHeader{
+  position: sticky;
+  top: 0;
+  inset-inline: 0;
+  z-index: var(--shell-z-header, 10);
+  block-size: var(--shell-header-height, 64px);
+  display: flex;
+  align-items: center;
+  background-color: var(--color-panel);
 }
-.rt-SidebarContainer:where([data-collapsible="icon"]){
-  width: 100%;
-  min-width: 0;
-  flex-shrink: 0;
+.rt-ShellBody{
+  display: flex;
+  flex-direction: row;
+  align-items: stretch;
+  inline-size: 100%;
+  flex: 1 1 auto;
+  block-size: auto;
+  min-block-size: 0;
+  min-inline-size: 0;
+  overflow: hidden;
 }
-.rt-SidebarContent:where([data-collapsible="icon"]){
-  width: 100%;
-  min-width: 0;
-  flex-shrink: 0;
+.rt-ShellSidebar{
+  display: flex;
+  flex-direction: row;
+  align-items: stretch;
+  block-size: 100%;
+  min-block-size: 0;
 }
-.rt-SidebarRoot:where([data-collapsible="icon"][data-state="collapsed"]) :where(.rt-SidebarMenuButton){
-  justify-content: center;
+.rt-ShellSidebarRail{
+  display: flex;
   flex-direction: column;
-  padding: var(--space-2) var(--space-1);
-  gap: var(--space-1);
-  min-height: auto;
-}
-.rt-SidebarRoot:where([data-collapsible="icon"][data-state="collapsed"]) :where(.rt-SidebarMenuButton) :where(span){
-  display: block;
-  font-size: var(--font-size-0);
-  line-height: var(--line-height-0);
-  color: var(--gray-a10);
-  text-align: center;
-  font-weight: var(--font-weight-medium);
-  max-width: 100%;
+  align-items: center;
+  gap: var(--space-2);
+  padding-block: var(--space-2);
+  block-size: 100%;
+  min-block-size: 0;
   overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
+  opacity: 0;
+  transition: inline-size var(--motion-duration-small) var(--motion-ease-standard), opacity var(--motion-duration-small) var(--motion-ease-standard) var(--motion-duration-small);
 }
-.rt-SidebarRoot:where([data-collapsible="icon"][data-state="collapsed"]) :where(.rt-SidebarGroupLabel){
-  max-width: var(--sidebar-group-label-width);
+.rt-ShellSidebarPanel{
   display: block;
-  text-align: center;
-  min-width: 0;
-  min-height: auto;
-  max-width: var(--sidebar-group-label-width);
-  font-size: var(--font-size-0);
-  line-height: var(--line-height-0);
-  color: var(--gray-a9);
-  font-weight: var(--font-weight-medium);
-  padding: var(--space-1) var(--space-1);
-  margin: var(--space-2) 0 var(--space-1) 0;
+  opacity: 0;
+  transition: inline-size var(--motion-duration-small) var(--motion-ease-standard), opacity var(--motion-duration-small) var(--motion-ease-standard) var(--motion-duration-small);
+  block-size: 100%;
+  min-block-size: 0;
   overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
 }
-.rt-SidebarRoot:where([data-collapsible="icon"][data-state="collapsed"]) :where(.rt-SidebarMenuButton span){
-  max-width: var(--sidebar-button-label-width);
-  min-width: 0;
+.rt-ShellSidebarSingle{
+  opacity: 0;
+  transition: inline-size var(--motion-duration-small) var(--motion-ease-standard), opacity var(--motion-duration-small) var(--motion-ease-standard) var(--motion-duration-small);
+  block-size: 100%;
   overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  color: var(--gray-a12);
-  font-weight: var(--font-weight-medium);
-}
-.rt-SidebarRoot.rt-menu-variant-solid:where([data-collapsible="icon"][data-state="collapsed"]) :where(.rt-SidebarMenuButton[data-highlighted] span),
-  .rt-SidebarRoot.rt-menu-variant-solid:where([data-collapsible="icon"][data-state="collapsed"]) :where(.rt-SidebarMenuButton[data-active] span){
-  color: var(--accent-contrast) !important;
 }
-:where(.rt-SidebarGroup:first-child) :is(.rt-SidebarRoot:where([data-collapsible="icon"][data-state="collapsed"]) :where(.rt-SidebarGroupLabel)){
-  margin-top: 0;
-}
-.rt-SidebarRoot:where([data-collapsible="icon"][data-state="collapsed"]) :where(.rt-SidebarMenuBadge),
-  .rt-SidebarRoot:where([data-collapsible="icon"][data-state="collapsed"]) :where(.rt-SidebarMenuShortcut){
-  display: none;
-}
-.rt-SidebarRoot:where([data-collapsible="icon"][data-state="collapsed"]) :where(.rt-SidebarMenuSubTriggerIcon){
-  display: none;
-}
-.rt-SidebarRoot:where([data-collapsible="icon"][data-state="collapsed"]) :where(.rt-SidebarMenuSubList){
-  padding-left: 0;
-  border-left: none;
-  margin-left: 0;
-}
-.rt-SidebarRoot:where([data-collapsible="icon"][data-state="collapsed"]) :where(.rt-SidebarMenu){
-  padding: var(--space-2);
-}
-.rt-SidebarRoot:where([data-collapsible="icon"][data-state="collapsed"]):where(.rt-r-size-1) :where(.rt-SidebarMenuButton svg){
-  width: var(--content-icon-size-2) !important;
-  height: var(--content-icon-size-2) !important;
-  color: currentColor !important;
-}
-.rt-SidebarRoot:where([data-collapsible="icon"][data-state="collapsed"]):where(.rt-r-size-2) :where(.rt-SidebarMenuButton svg){
-  width: var(--content-icon-size-3) !important;
-  height: var(--content-icon-size-3) !important;
-  color: currentColor !important;
-}
-.rt-SidebarRoot:where([data-collapsible="icon"][data-type="floating"]){
-  transition: none;
-  overflow: visible;
-  flex-shrink: 0;
+:where(.rt-ShellSidebarRail):not([data-visible]),
+:where(.rt-ShellSidebarPanel):not([data-visible]),
+:where(.rt-ShellSidebarSingle):not([data-visible]){
+  opacity: 0;
+  transition: opacity var(--motion-duration-small) var(--motion-ease-standard), inline-size var(--motion-duration-small) var(--motion-ease-standard) var(--motion-duration-small);
 }
-.rt-SidebarRoot:where([data-collapsible="icon"][data-type="floating"][data-state="collapsed"]){
+[data-visible]{
   opacity: 1;
-  pointer-events: auto;
-  margin: var(--space-2);
-}
-.rt-SidebarRoot:where([data-collapsible="icon"][data-type="floating"][data-state="collapsed"]):where(.rt-r-size-1){
-  width: var(--sidebar-icon-width-1);
-  min-width: var(--sidebar-icon-width-1);
-}
-.rt-SidebarRoot:where([data-collapsible="icon"][data-type="floating"][data-state="collapsed"]):where(.rt-r-size-2){
-  width: var(--sidebar-icon-width-2);
-  min-width: var(--sidebar-icon-width-2);
-}
-.rt-SidebarRoot:where([data-collapsible="icon"][data-type="floating"][data-state="expanded"]){
-  width: var(--sidebar-width);
-  min-width: var(--sidebar-width);
-  opacity: 1;
-  pointer-events: auto;
-  margin: var(--space-2);
-}
-@media (max-width: 768px) {
-  .rt-SidebarRoot:where([data-collapsible="icon"]){
-    display: none;
-  }
-  .rt-SidebarRoot:where([data-collapsible="icon"][data-state="expanded"]){
-    display: flex;
-    position: fixed;
-    top: 0;
-    left: 0;
-    height: 100vh;
-    width: var(--sidebar-width);
-    z-index: 50;
-    box-shadow: var(--shadow-6);
-  }
 }
 @media (prefers-reduced-motion: reduce) {
-  .rt-SidebarRoot:where([data-collapsible="icon"]){
+  .rt-ShellSidebarRail,
+  .rt-ShellSidebarPanel,
+  .rt-ShellSidebarSingle{
     transition: none;
   }
 }
-@media (forced-colors: active) {
-  :where(.rt-SidebarMenuButton):focus-visible{
-    outline: 2px solid CanvasText;
-  }
-  :where(.rt-SidebarTrigger):focus-visible{
-    outline: 2px solid CanvasText;
-  }
+.rt-ShellContent{
+  flex: 1 1 auto;
+  block-size: 100%;
+  min-block-size: 0;
+  min-inline-size: 0;
+  overflow: auto;
+}
+:where(.rt-SheetContent) :where(.rt-ShellSidebarPanel){
+  transition: none !important;
 }
 .rt-SliderRoot{
   --slider-thumb-width: var(--space-3);
@@ -20990,6 +21217,7 @@
   padding: var(--text-area-padding-y) var(--text-area-padding-x);
   border-radius: inherit;
   resize: none;
+  min-width: 0;
   display: block;
   width: 100%;
   flex-grow: 1;
@@ -22531,8 +22759,8 @@
   background-color: var(--gray-12);
   border-radius: var(--radius-1);
   transform-origin: var(--radix-tooltip-content-transform-origin);
-  animation-duration: var(--duration-2);
-  animation-timing-function: var(--ease-3);
+  animation-duration: var(--motion-duration-small);
+  animation-timing-function: var(--motion-spring-snappy);
 }
 @media (prefers-reduced-motion: no-preference) {
   .rt-TooltipContent:where([data-state='delayed-open']):where([data-side='top']){
@@ -22569,6 +22797,280 @@
 .rt-UserCard:where(.rt-r-size-4) :where(.rt-Flex){
   gap: var(--space-5);
 }
+.rt-ChatbarField{
+  position: relative;
+  width: 100%;
+  min-width: 0;
+}
+.rt-ChatbarRoot{
+  --chatbar-attachment-thumb: var(--space-8);
+  transition: outline var(--motion-duration-small) var(--motion-spring-snappy);
+}
+.rt-ChatbarInput{
+  display: block;
+  width: 100%;
+  min-width: 0;
+  resize: none;
+  border: 0;
+  outline: 0;
+  background: transparent;
+  padding: 0;
+  margin: 0;
+  color: inherit;
+  font: inherit;
+  line-height: inherit;
+  text-align: start;
+  transition: height 150ms ease-out;
+}
+.rt-ChatbarCard :where(.rt-ChatbarGrid){
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-4);
+  width: 100%;
+}
+.rt-ChatbarRoot:where([data-state="closed"]) :where(.rt-ChatbarGrid){
+  flex-direction: row;
+  align-items: center;
+  flex-wrap: wrap;
+}
+.rt-ChatbarRoot:where([data-state="closed"]) :where(.rt-ChatbarAttachmentsRow){
+  flex-basis: 100%;
+  order: -1;
+}
+.rt-ChatbarTextarea{
+  flex: 1;
+  min-width: 0;
+}
+.rt-ChatbarSend{
+  transition: opacity 150ms ease-in-out;
+}
+.rt-ChatbarRoot:where([data-state="closed"]) :where(.rt-ChatbarRow){
+  display: none;
+}
+.rt-ChatbarRoot:where([data-state="open"]) :where(.rt-ChatbarRow){
+  display: block;
+  width: 100%;
+}
+.rt-ChatbarAttachmentsRow{
+  width: 100%;
+}
+.rt-ChatbarScrollArea{
+  border-radius: var(--chatbar-attachments-radius);
+}
+.rt-ChatbarScrollArea :where(.rt-ScrollAreaScrollbar){
+  display: none;
+}
+.rt-ChatbarAttachmentPreview{
+  height: var(--chatbar-attachment-thumb);
+  width: var(--chatbar-attachment-thumb);
+  min-width: var(--chatbar-attachment-thumb);
+  flex-shrink: 0;
+  border-radius: var(--radius-1);
+  overflow: hidden;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  background: var(--gray-a3);
+}
+.rt-ChatbarAttachmentImage{
+  height: 100%;
+  width: auto;
+  object-fit: contain;
+  max-width: none;
+}
+.rt-ChatbarAttachment{
+  position: relative;
+}
+.rt-ChatbarAttachmentRemove{
+  position: absolute;
+  top: var(--chatbar-remove-offset);
+  right: var(--chatbar-remove-offset);
+}
+.rt-ChatbarCard{
+  width: 100%;
+  transition: all var(--motion-duration-small) var(--motion-spring-snappy);
+}
+.rt-ChatbarDropOverlay{
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: var(--gray-a3);
+  border-radius: inherit;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 10;
+  animation: rt-fade-in var(--motion-duration-small) var(--motion-spring-snappy);
+}
+.rt-ChatbarDropContent{
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: var(--space-2);
+  color: var(--accent-11);
+}
+.rt-ChatbarDropIcon{
+  width: var(--space-6);
+  height: var(--space-6);
+}
+.rt-ChatbarInlineStart,
+.rt-ChatbarInlineEnd{
+  flex-shrink: 0;
+  display: inline-flex;
+  align-items: center;
+  gap: var(--space-2);
+}
+.rt-ChatbarRowStart{
+  display: inline-flex;
+  align-items: center;
+  gap: var(--space-2);
+  flex-shrink: 0;
+}
+.rt-ChatbarRowEnd{
+  display: inline-flex;
+  align-items: center;
+  gap: var(--space-2);
+  flex-shrink: 0;
+  margin-left: auto;
+}
+.rt-ChatbarRoot:where(.rt-r-size-1){
+  font-size: var(--font-size-1);
+  line-height: var(--line-height-1);
+  --chatbar-attachment-thumb: var(--space-8);
+  --chatbar-remove-offset: var(--space-1);
+  --chatbar-attachments-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
+}
+.rt-ChatbarRoot:where(.rt-r-size-2){
+  font-size: var(--font-size-2);
+  line-height: var(--line-height-2);
+  --chatbar-attachment-thumb: var(--space-9);
+  --chatbar-remove-offset: var(--space-2);
+  --chatbar-attachments-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
+}
+.rt-ChatbarRoot:where(.rt-r-size-3){
+  font-size: var(--font-size-3);
+  line-height: var(--line-height-3);
+  --chatbar-attachment-thumb: var(--space-9);
+  --chatbar-remove-offset: var(--space-3);
+  --chatbar-attachments-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
+}
+@media (min-width: 520px){
+  .rt-ChatbarRoot:where(.xs\:rt-r-size-1){
+    font-size: var(--font-size-1);
+    line-height: var(--line-height-1);
+    --chatbar-attachment-thumb: var(--space-8);
+    --chatbar-remove-offset: var(--space-1);
+    --chatbar-attachments-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
+  }
+  .rt-ChatbarRoot:where(.xs\:rt-r-size-2){
+    font-size: var(--font-size-2);
+    line-height: var(--line-height-2);
+    --chatbar-attachment-thumb: var(--space-9);
+    --chatbar-remove-offset: var(--space-2);
+    --chatbar-attachments-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
+  }
+  .rt-ChatbarRoot:where(.xs\:rt-r-size-3){
+    font-size: var(--font-size-3);
+    line-height: var(--line-height-3);
+    --chatbar-attachment-thumb: var(--space-9);
+    --chatbar-remove-offset: var(--space-3);
+    --chatbar-attachments-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
+  }
+}
+@media (min-width: 768px){
+  .rt-ChatbarRoot:where(.sm\:rt-r-size-1){
+    font-size: var(--font-size-1);
+    line-height: var(--line-height-1);
+    --chatbar-attachment-thumb: var(--space-8);
+    --chatbar-remove-offset: var(--space-1);
+    --chatbar-attachments-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
+  }
+  .rt-ChatbarRoot:where(.sm\:rt-r-size-2){
+    font-size: var(--font-size-2);
+    line-height: var(--line-height-2);
+    --chatbar-attachment-thumb: var(--space-9);
+    --chatbar-remove-offset: var(--space-2);
+    --chatbar-attachments-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
+  }
+  .rt-ChatbarRoot:where(.sm\:rt-r-size-3){
+    font-size: var(--font-size-3);
+    line-height: var(--line-height-3);
+    --chatbar-attachment-thumb: var(--space-9);
+    --chatbar-remove-offset: var(--space-3);
+    --chatbar-attachments-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
+  }
+}
+@media (min-width: 1024px){
+  .rt-ChatbarRoot:where(.md\:rt-r-size-1){
+    font-size: var(--font-size-1);
+    line-height: var(--line-height-1);
+    --chatbar-attachment-thumb: var(--space-8);
+    --chatbar-remove-offset: var(--space-1);
+    --chatbar-attachments-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
+  }
+  .rt-ChatbarRoot:where(.md\:rt-r-size-2){
+    font-size: var(--font-size-2);
+    line-height: var(--line-height-2);
+    --chatbar-attachment-thumb: var(--space-9);
+    --chatbar-remove-offset: var(--space-2);
+    --chatbar-attachments-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
+  }
+  .rt-ChatbarRoot:where(.md\:rt-r-size-3){
+    font-size: var(--font-size-3);
+    line-height: var(--line-height-3);
+    --chatbar-attachment-thumb: var(--space-9);
+    --chatbar-remove-offset: var(--space-3);
+    --chatbar-attachments-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
+  }
+}
+@media (min-width: 1280px){
+  .rt-ChatbarRoot:where(.lg\:rt-r-size-1){
+    font-size: var(--font-size-1);
+    line-height: var(--line-height-1);
+    --chatbar-attachment-thumb: var(--space-8);
+    --chatbar-remove-offset: var(--space-1);
+    --chatbar-attachments-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
+  }
+  .rt-ChatbarRoot:where(.lg\:rt-r-size-2){
+    font-size: var(--font-size-2);
+    line-height: var(--line-height-2);
+    --chatbar-attachment-thumb: var(--space-9);
+    --chatbar-remove-offset: var(--space-2);
+    --chatbar-attachments-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
+  }
+  .rt-ChatbarRoot:where(.lg\:rt-r-size-3){
+    font-size: var(--font-size-3);
+    line-height: var(--line-height-3);
+    --chatbar-attachment-thumb: var(--space-9);
+    --chatbar-remove-offset: var(--space-3);
+    --chatbar-attachments-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
+  }
+}
+@media (min-width: 1640px){
+  .rt-ChatbarRoot:where(.xl\:rt-r-size-1){
+    font-size: var(--font-size-1);
+    line-height: var(--line-height-1);
+    --chatbar-attachment-thumb: var(--space-8);
+    --chatbar-remove-offset: var(--space-1);
+    --chatbar-attachments-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
+  }
+  .rt-ChatbarRoot:where(.xl\:rt-r-size-2){
+    font-size: var(--font-size-2);
+    line-height: var(--line-height-2);
+    --chatbar-attachment-thumb: var(--space-9);
+    --chatbar-remove-offset: var(--space-2);
+    --chatbar-attachments-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
+  }
+  .rt-ChatbarRoot:where(.xl\:rt-r-size-3){
+    font-size: var(--font-size-3);
+    line-height: var(--line-height-3);
+    --chatbar-attachment-thumb: var(--space-9);
+    --chatbar-remove-offset: var(--space-3);
+    --chatbar-attachments-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
+  }
+}
 .radix-themes:where([data-is-root-theme='true']){
   position: relative;
   z-index: 0;