@opengeni/react 7.4.0 → 7.5.0-canary.36919050519001

package/styles/compiled.css

@@ -534,6 +534,8 @@
     --text-xs--line-height: calc(1 / 0.75);
     --text-sm: 0.875rem;
     --text-sm--line-height: calc(1.25 / 0.875);
+    --text-base: 1rem;
+    --text-base--line-height: calc(1.5 / 1);
     --text-lg: 1.125rem;
     --text-lg--line-height: calc(1.75 / 1.125);
     --text-xl: 1.25rem;
@@ -562,7 +564,9 @@
     --default-transition-duration: 150ms;
     --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
     --color-og-surface-1: var(--og-color-surface-1);
+    --color-bg: var(--og-color-bg);
     --color-surface-2: var(--og-color-surface-2);
+    --color-fg: var(--og-color-fg);
     --color-brand: var(--og-color-accent);
     --animate-og-row-enter: og-row-enter var(--_og-duration-slow) var(--og-ease-stream) both;
     --animate-og-markdown-settle: og-markdown-settle var(--_og-duration-markdown-crystallize)
@@ -1521,6 +1525,9 @@
 :where(.og-root).inset-y-0,:where(.og-root) .inset-y-0 {
     inset-block: calc(var(--spacing) * 0);
   }
+:where(.og-root).inset-y-\[-2px\],:where(.og-root) .inset-y-\[-2px\] {
+    inset-block: -2px;
+  }
 :where(.og-root).start,:where(.og-root) .start {
     inset-inline-start: var(--spacing);
   }
@@ -1584,9 +1591,15 @@
 :where(.og-root).right-2,:where(.og-root) .right-2 {
     right: calc(var(--spacing) * 2);
   }
+:where(.og-root).right-2\.5,:where(.og-root) .right-2\.5 {
+    right: calc(var(--spacing) * 2.5);
+  }
 :where(.og-root).right-3,:where(.og-root) .right-3 {
     right: calc(var(--spacing) * 3);
   }
+:where(.og-root).right-4,:where(.og-root) .right-4 {
+    right: calc(var(--spacing) * 4);
+  }
 :where(.og-root).bottom-0,:where(.og-root) .bottom-0 {
     bottom: calc(var(--spacing) * 0);
   }
@@ -1614,6 +1627,9 @@
 :where(.og-root).left-2,:where(.og-root) .left-2 {
     left: calc(var(--spacing) * 2);
   }
+:where(.og-root).left-4,:where(.og-root) .left-4 {
+    left: calc(var(--spacing) * 4);
+  }
 :where(.og-root).z-0,:where(.og-root) .z-0 {
     z-index: 0;
   }
@@ -1734,6 +1750,9 @@
 :where(.og-root).ms-auto,:where(.og-root) .ms-auto {
     margin-inline-start: auto;
   }
+:where(.og-root).-mt-0\.5,:where(.og-root) .-mt-0\.5 {
+    margin-top: calc(var(--spacing) * -0.5);
+  }
 :where(.og-root).-mt-5,:where(.og-root) .-mt-5 {
     margin-top: calc(var(--spacing) * -5);
   }
@@ -1776,6 +1795,9 @@
 :where(.og-root).mr-2,:where(.og-root) .mr-2 {
     margin-right: calc(var(--spacing) * 2);
   }
+:where(.og-root).mb-0,:where(.og-root) .mb-0 {
+    margin-bottom: calc(var(--spacing) * 0);
+  }
 :where(.og-root).mb-0\.5,:where(.og-root) .mb-0\.5 {
     margin-bottom: calc(var(--spacing) * 0.5);
   }
@@ -1947,12 +1969,21 @@
     width: 1px;
     height: 1px;
   }
+:where(.og-root).h-0,:where(.og-root) .h-0 {
+    height: calc(var(--spacing) * 0);
+  }
 :where(.og-root).h-1,:where(.og-root) .h-1 {
     height: calc(var(--spacing) * 1);
   }
+:where(.og-root).h-1\.5,:where(.og-root) .h-1\.5 {
+    height: calc(var(--spacing) * 1.5);
+  }
 :where(.og-root).h-2\.5,:where(.og-root) .h-2\.5 {
     height: calc(var(--spacing) * 2.5);
   }
+:where(.og-root).h-3\.5,:where(.og-root) .h-3\.5 {
+    height: calc(var(--spacing) * 3.5);
+  }
 :where(.og-root).h-4,:where(.og-root) .h-4 {
     height: calc(var(--spacing) * 4);
   }
@@ -1989,12 +2020,21 @@
 :where(.og-root).h-\[1em\],:where(.og-root) .h-\[1em\] {
     height: 1em;
   }
+:where(.og-root).h-\[22px\],:where(.og-root) .h-\[22px\] {
+    height: 22px;
+  }
+:where(.og-root).h-\[clamp\(30rem\,62vh\,48rem\)\],:where(.og-root) .h-\[clamp\(30rem\,62vh\,48rem\)\] {
+    height: clamp(30rem, 62vh, 48rem);
+  }
 :where(.og-root).h-\[min\(28rem\,50dvh\)\],:where(.og-root) .h-\[min\(28rem\,50dvh\)\] {
     height: min(28rem, 50dvh);
   }
 :where(.og-root).h-\[var\(--og-model-picker-trigger-height\)\],:where(.og-root) .h-\[var\(--og-model-picker-trigger-height\)\] {
     height: var(--og-model-picker-trigger-height);
   }
+:where(.og-root).h-dvh,:where(.og-root) .h-dvh {
+    height: 100dvh;
+  }
 :where(.og-root).h-full,:where(.og-root) .h-full {
     height: 100%;
   }
@@ -2064,6 +2104,9 @@
 :where(.og-root).max-h-full,:where(.og-root) .max-h-full {
     max-height: 100%;
   }
+:where(.og-root).max-h-none,:where(.og-root) .max-h-none {
+    max-height: none;
+  }
 :where(.og-root).min-h-0,:where(.og-root) .min-h-0 {
     min-height: calc(var(--spacing) * 0);
   }
@@ -2085,6 +2128,9 @@
 :where(.og-root).min-h-11,:where(.og-root) .min-h-11 {
     min-height: calc(var(--spacing) * 11);
   }
+:where(.og-root).min-h-12,:where(.og-root) .min-h-12 {
+    min-height: calc(var(--spacing) * 12);
+  }
 :where(.og-root).min-h-14,:where(.og-root) .min-h-14 {
     min-height: calc(var(--spacing) * 14);
   }
@@ -2130,6 +2176,12 @@
 :where(.og-root).w-12,:where(.og-root) .w-12 {
     width: calc(var(--spacing) * 12);
   }
+:where(.og-root).w-16,:where(.og-root) .w-16 {
+    width: calc(var(--spacing) * 16);
+  }
+:where(.og-root).w-28,:where(.og-root) .w-28 {
+    width: calc(var(--spacing) * 28);
+  }
 :where(.og-root).w-32,:where(.og-root) .w-32 {
     width: calc(var(--spacing) * 32);
   }
@@ -2178,6 +2230,9 @@
 :where(.og-root).w-auto,:where(.og-root) .w-auto {
     width: auto;
   }
+:where(.og-root).w-dvw,:where(.og-root) .w-dvw {
+    width: 100dvw;
+  }
 :where(.og-root).w-fit,:where(.og-root) .w-fit {
     width: fit-content;
   }
@@ -2262,6 +2317,9 @@
 :where(.og-root).max-w-md,:where(.og-root) .max-w-md {
     max-width: var(--container-md);
   }
+:where(.og-root).max-w-none,:where(.og-root) .max-w-none {
+    max-width: none;
+  }
 :where(.og-root).max-w-prose,:where(.og-root) .max-w-prose {
     max-width: 65ch;
   }
@@ -2463,6 +2521,9 @@
 :where(.og-root).grid-cols-\[auto_minmax\(0\,1fr\)\],:where(.og-root) .grid-cols-\[auto_minmax\(0\,1fr\)\] {
     grid-template-columns: auto minmax(0,1fr);
   }
+:where(.og-root).grid-cols-\[minmax\(0\,1fr\)\],:where(.og-root) .grid-cols-\[minmax\(0\,1fr\)\] {
+    grid-template-columns: minmax(0,1fr);
+  }
 :where(.og-root).grid-cols-\[minmax\(0\,1fr\)_minmax\(0\,1fr\)\],:where(.og-root) .grid-cols-\[minmax\(0\,1fr\)_minmax\(0\,1fr\)\] {
     grid-template-columns: minmax(0,1fr) minmax(0,1fr);
   }
@@ -2598,6 +2659,9 @@
 :where(.og-root).gap-y-0\.5,:where(.og-root) .gap-y-0\.5 {
     row-gap: calc(var(--spacing) * 0.5);
   }
+:where(.og-root).gap-y-1,:where(.og-root) .gap-y-1 {
+    row-gap: calc(var(--spacing) * 1);
+  }
 :where(.og-root).gap-y-1\.5,:where(.og-root) .gap-y-1\.5 {
     row-gap: calc(var(--spacing) * 1.5);
   }
@@ -2624,6 +2688,11 @@
       border-color: var(--og-color-border);
     }
   }
+:where(.og-root).divide-og-border,:where(.og-root) .divide-og-border {
+    :where(& > :not(:last-child)) {
+      border-color: var(--og-color-border);
+    }
+  }
 :where(.og-root).divide-og-border\/40,:where(.og-root) .divide-og-border\/40 {
     :where(& > :not(:last-child)) {
       border-color: var(--og-color-border);
@@ -2676,6 +2745,9 @@
 :where(.og-root).rounded-\[2px\],:where(.og-root) .rounded-\[2px\] {
     border-radius: 2px;
   }
+:where(.og-root).rounded-\[5px\],:where(.og-root) .rounded-\[5px\] {
+    border-radius: 5px;
+  }
 :where(.og-root).rounded-full,:where(.og-root) .rounded-full {
     border-radius: calc(infinity * 1px);
   }
@@ -2783,6 +2855,12 @@
 :where(.og-root).border-border,:where(.og-root) .border-border {
     border-color: var(--og-color-border);
   }
+:where(.og-root).border-border\/80,:where(.og-root) .border-border\/80 {
+    border-color: var(--og-color-border);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--og-color-border) 80%, transparent);
+    }
+  }
 :where(.og-root).border-brand\/40,:where(.og-root) .border-brand\/40 {
     border-color: var(--og-color-accent);
     @supports (color: color-mix(in lab, red, red)) {
@@ -2867,6 +2945,12 @@
       border-color: color-mix(in oklab, var(--og-color-border) 90%, transparent);
     }
   }
+:where(.og-root).border-og-danger\/30,:where(.og-root) .border-og-danger\/30 {
+    border-color: var(--og-color-danger);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--og-color-danger) 30%, transparent);
+    }
+  }
 :where(.og-root).border-og-primary-border,:where(.og-root) .border-og-primary-border {
     border-color: var(--og-color-primary-border);
   }
@@ -2999,6 +3083,15 @@
       border-color: color-mix(in oklab, var(--color-white) 15%, transparent);
     }
   }
+:where(.og-root).bg-accent,:where(.og-root) .bg-accent {
+    background-color: var(--color-surface-2);
+  }
+:where(.og-root).bg-background,:where(.og-root) .bg-background {
+    background-color: var(--color-bg);
+  }
+:where(.og-root).bg-bg,:where(.og-root) .bg-bg {
+    background-color: var(--og-color-bg);
+  }
 :where(.og-root).bg-black,:where(.og-root) .bg-black {
     background-color: var(--color-black);
   }
@@ -3071,6 +3164,12 @@
       background-color: color-mix(in oklab, var(--og-color-accent) 55%, transparent);
     }
   }
+:where(.og-root).bg-og-accent\/70,:where(.og-root) .bg-og-accent\/70 {
+    background-color: var(--og-color-accent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--og-color-accent) 70%, transparent);
+    }
+  }
 :where(.og-root).bg-og-bg,:where(.og-root) .bg-og-bg {
     background-color: var(--og-color-bg);
   }
@@ -3101,6 +3200,9 @@
 :where(.og-root).bg-og-border,:where(.og-root) .bg-og-border {
     background-color: var(--og-color-border);
   }
+:where(.og-root).bg-og-danger,:where(.og-root) .bg-og-danger {
+    background-color: var(--og-color-danger);
+  }
 :where(.og-root).bg-og-danger-fill,:where(.og-root) .bg-og-danger-fill {
     background-color: var(--og-color-danger-fill);
   }
@@ -3110,6 +3212,15 @@
       background-color: color-mix(in oklab, var(--og-color-danger) 8%, transparent);
     }
   }
+:where(.og-root).bg-og-danger\/15,:where(.og-root) .bg-og-danger\/15 {
+    background-color: var(--og-color-danger);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--og-color-danger) 15%, transparent);
+    }
+  }
+:where(.og-root).bg-og-fg,:where(.og-root) .bg-og-fg {
+    background-color: var(--og-color-fg);
+  }
 :where(.og-root).bg-og-fg-muted,:where(.og-root) .bg-og-fg-muted {
     background-color: var(--og-color-fg-muted);
   }
@@ -3215,6 +3326,12 @@
       background-color: color-mix(in oklab, var(--og-color-status-waiting) 5%, transparent);
     }
   }
+:where(.og-root).bg-og-status-waiting\/8,:where(.og-root) .bg-og-status-waiting\/8 {
+    background-color: var(--og-color-status-waiting);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--og-color-status-waiting) 8%, transparent);
+    }
+  }
 :where(.og-root).bg-og-status-waiting\/10,:where(.og-root) .bg-og-status-waiting\/10 {
     background-color: var(--og-color-status-waiting);
     @supports (color: color-mix(in lab, red, red)) {
@@ -3350,6 +3467,9 @@
       background-color: color-mix(in oklab, var(--og-color-status-failed) 10%, transparent);
     }
   }
+:where(.og-root).bg-status-success,:where(.og-root) .bg-status-success {
+    background-color: var(--og-color-status-idle);
+  }
 :where(.og-root).bg-status-waiting\/10,:where(.og-root) .bg-status-waiting\/10 {
     background-color: var(--og-color-status-waiting);
     @supports (color: color-mix(in lab, red, red)) {
@@ -3365,6 +3485,9 @@
 :where(.og-root).bg-surface,:where(.og-root) .bg-surface {
     background-color: var(--og-color-surface-1);
   }
+:where(.og-root).bg-surface-2,:where(.og-root) .bg-surface-2 {
+    background-color: var(--og-color-surface-2);
+  }
 :where(.og-root).bg-surface-2\/60,:where(.og-root) .bg-surface-2\/60 {
     background-color: var(--og-color-surface-2);
     @supports (color: color-mix(in lab, red, red)) {
@@ -3377,6 +3500,12 @@
       background-color: color-mix(in oklab, var(--og-color-surface-1) 80%, transparent);
     }
   }
+:where(.og-root).bg-surface\/95,:where(.og-root) .bg-surface\/95 {
+    background-color: var(--og-color-surface-1);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--og-color-surface-1) 95%, transparent);
+    }
+  }
 :where(.og-root).bg-transparent,:where(.og-root) .bg-transparent {
     background-color: transparent;
   }
@@ -3433,6 +3562,9 @@
 :where(.og-root).object-cover,:where(.og-root) .object-cover {
     object-fit: cover;
   }
+:where(.og-root).p-0,:where(.og-root) .p-0 {
+    padding: calc(var(--spacing) * 0);
+  }
 :where(.og-root).p-0\.5,:where(.og-root) .p-0\.5 {
     padding: calc(var(--spacing) * 0.5);
   }
@@ -3562,6 +3694,9 @@
 :where(.og-root).pt-2,:where(.og-root) .pt-2 {
     padding-top: calc(var(--spacing) * 2);
   }
+:where(.og-root).pt-2\.5,:where(.og-root) .pt-2\.5 {
+    padding-top: calc(var(--spacing) * 2.5);
+  }
 :where(.og-root).pt-3,:where(.og-root) .pt-3 {
     padding-top: calc(var(--spacing) * 3);
   }
@@ -3580,6 +3715,9 @@
 :where(.og-root).pr-6,:where(.og-root) .pr-6 {
     padding-right: calc(var(--spacing) * 6);
   }
+:where(.og-root).pr-8,:where(.og-root) .pr-8 {
+    padding-right: calc(var(--spacing) * 8);
+  }
 :where(.og-root).pr-12,:where(.og-root) .pr-12 {
     padding-right: calc(var(--spacing) * 12);
   }
@@ -3665,6 +3803,14 @@
     font-size: var(--text-2xl);
     line-height: var(--tw-leading, var(--text-2xl--line-height));
   }
+:where(.og-root).text-2xs,:where(.og-root) .text-2xs {
+    font-size: 0.6875rem;
+    line-height: var(--tw-leading, 1rem);
+  }
+:where(.og-root).text-base,:where(.og-root) .text-base {
+    font-size: var(--text-base);
+    line-height: var(--tw-leading, var(--text-base--line-height));
+  }
 :where(.og-root).text-lg,:where(.og-root) .text-lg {
     font-size: var(--text-lg);
     line-height: var(--tw-leading, var(--text-lg--line-height));
@@ -3737,6 +3883,10 @@
     --tw-leading: calc(var(--spacing) * 7);
     line-height: calc(var(--spacing) * 7);
   }
+:where(.og-root).leading-8,:where(.og-root) .leading-8 {
+    --tw-leading: calc(var(--spacing) * 8);
+    line-height: calc(var(--spacing) * 8);
+  }
 :where(.og-root).leading-none,:where(.og-root) .leading-none {
     --tw-leading: 1;
     line-height: 1;
@@ -3765,6 +3915,10 @@
     --tw-font-weight: var(--font-weight-semibold);
     font-weight: var(--font-weight-semibold);
   }
+:where(.og-root).tracking-\[-0\.5px\],:where(.og-root) .tracking-\[-0\.5px\] {
+    --tw-tracking: -0.5px;
+    letter-spacing: -0.5px;
+  }
 :where(.og-root).tracking-\[0\.1em\],:where(.og-root) .tracking-\[0\.1em\] {
     --tw-tracking: 0.1em;
     letter-spacing: 0.1em;
@@ -3835,6 +3989,9 @@
 :where(.og-root).whitespace-pre-wrap,:where(.og-root) .whitespace-pre-wrap {
     white-space: pre-wrap;
   }
+:where(.og-root).text-accent-foreground,:where(.og-root) .text-accent-foreground {
+    color: var(--color-fg);
+  }
 :where(.og-root).text-destructive,:where(.og-root) .text-destructive {
     color: var(--og-color-danger);
   }
@@ -3847,6 +4004,9 @@
 :where(.og-root).text-fg-subtle,:where(.og-root) .text-fg-subtle {
     color: var(--og-color-fg-subtle);
   }
+:where(.og-root).text-foreground,:where(.og-root) .text-foreground {
+    color: var(--color-fg);
+  }
 :where(.og-root).text-muted,:where(.og-root) .text-muted {
     color: var(--color-surface-2);
   }
@@ -4061,6 +4221,10 @@
     --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
     box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
   }
+:where(.og-root).shadow-xs,:where(.og-root) .shadow-xs {
+    --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));
+    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+  }
 :where(.og-root).ring,:where(.og-root) .ring {
     --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
     box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -4073,6 +4237,10 @@
     --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
     box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
   }
+:where(.og-root).ring-4,:where(.og-root) .ring-4 {
+    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
+    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+  }
 :where(.og-root).ring-brand\/40,:where(.og-root) .ring-brand\/40 {
     --tw-ring-color: var(--og-color-accent);
     @supports (color: color-mix(in lab, red, red)) {
@@ -4112,6 +4280,12 @@
       --tw-ring-color: color-mix(in oklab, var(--og-color-status-waiting) 45%, transparent);
     }
   }
+:where(.og-root).ring-status-success\/10,:where(.og-root) .ring-status-success\/10 {
+    --tw-ring-color: var(--og-color-status-idle);
+    @supports (color: color-mix(in lab, red, red)) {
+      --tw-ring-color: color-mix(in oklab, var(--og-color-status-idle) 10%, transparent);
+    }
+  }
 :where(.og-root).outline-hidden,:where(.og-root) .outline-hidden {
     --tw-outline-style: none;
     outline-style: none;
@@ -4716,6 +4890,13 @@
       }
     }
   }
+:where(.og-root).hover\:border-border-strong,:where(.og-root) .hover\:border-border-strong {
+    &:hover {
+      @media (hover: hover) {
+        border-color: var(--og-color-border-strong);
+      }
+    }
+  }
 :where(.og-root).hover\:border-og-accent,:where(.og-root) .hover\:border-og-accent {
     &:hover {
       @media (hover: hover) {
@@ -4784,6 +4965,13 @@
       }
     }
   }
+:where(.og-root).hover\:bg-accent,:where(.og-root) .hover\:bg-accent {
+    &:hover {
+      @media (hover: hover) {
+        background-color: var(--color-surface-2);
+      }
+    }
+  }
 :where(.og-root).hover\:bg-current\/10,:where(.og-root) .hover\:bg-current\/10 {
     &:hover {
       @media (hover: hover) {
@@ -4967,6 +5155,13 @@
       }
     }
   }
+:where(.og-root).hover\:text-accent-foreground,:where(.og-root) .hover\:text-accent-foreground {
+    &:hover {
+      @media (hover: hover) {
+        color: var(--color-fg);
+      }
+    }
+  }
 :where(.og-root).hover\:text-fg,:where(.og-root) .hover\:text-fg {
     &:hover {
       @media (hover: hover) {
@@ -5130,6 +5325,11 @@
       }
     }
   }
+:where(.og-root).focus-visible\:border-ring,:where(.og-root) .focus-visible\:border-ring {
+    &:focus-visible {
+      border-color: var(--color-brand);
+    }
+  }
 :where(.og-root).focus-visible\:bg-og-accent,:where(.og-root) .focus-visible\:bg-og-accent {
     &:focus-visible {
       background-color: var(--og-color-accent);
@@ -5235,6 +5435,11 @@
       --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
     }
   }
+:where(.og-root).focus-visible\:ring-offset-bg,:where(.og-root) .focus-visible\:ring-offset-bg {
+    &:focus-visible {
+      --tw-ring-offset-color: var(--og-color-bg);
+    }
+  }
 :where(.og-root).focus-visible\:ring-offset-og-bg,:where(.og-root) .focus-visible\:ring-offset-og-bg {
     &:focus-visible {
       --tw-ring-offset-color: var(--og-color-bg);
@@ -5279,6 +5484,11 @@
       }
     }
   }
+:where(.og-root).focus-visible\:outline-ring,:where(.og-root) .focus-visible\:outline-ring {
+    &:focus-visible {
+      outline-color: var(--color-brand);
+    }
+  }
 :where(.og-root).focus-visible\:ring-inset,:where(.og-root) .focus-visible\:ring-inset {
     &:focus-visible {
       --tw-ring-inset: inset;
@@ -5365,6 +5575,32 @@
       }
     }
   }
+:where(.og-root).has-\[\:focus-visible\]\:outline-2,:where(.og-root) .has-\[\:focus-visible\]\:outline-2 {
+    &:has(*:is(:focus-visible)) {
+      outline-style: var(--tw-outline-style);
+      outline-width: 2px;
+    }
+  }
+:where(.og-root).has-\[\:focus-visible\]\:outline-og-accent,:where(.og-root) .has-\[\:focus-visible\]\:outline-og-accent {
+    &:has(*:is(:focus-visible)) {
+      outline-color: var(--og-color-accent);
+    }
+  }
+:where(.og-root).has-\[\>svg\]\:px-2\.5,:where(.og-root) .has-\[\>svg\]\:px-2\.5 {
+    &:has(>svg) {
+      padding-inline: calc(var(--spacing) * 2.5);
+    }
+  }
+:where(.og-root).aria-disabled\:cursor-wait,:where(.og-root) .aria-disabled\:cursor-wait {
+    &[aria-disabled="true"] {
+      cursor: wait;
+    }
+  }
+:where(.og-root).aria-disabled\:opacity-70,:where(.og-root) .aria-disabled\:opacity-70 {
+    &[aria-disabled="true"] {
+      opacity: 70%;
+    }
+  }
 :where(.og-root).data-\[disabled\]\:pointer-events-none,:where(.og-root) .data-\[disabled\]\:pointer-events-none {
     &[data-disabled] {
       pointer-events: none;
@@ -5579,6 +5815,16 @@
       display: inline;
     }
   }
+:where(.og-root).sm\:right-6,:where(.og-root) .sm\:right-6 {
+    @media (width >= 40rem) {
+      right: calc(var(--spacing) * 6);
+    }
+  }
+:where(.og-root).sm\:left-6,:where(.og-root) .sm\:left-6 {
+    @media (width >= 40rem) {
+      left: calc(var(--spacing) * 6);
+    }
+  }
 :where(.og-root).sm\:col-span-1,:where(.og-root) .sm\:col-span-1 {
     @media (width >= 40rem) {
       grid-column: span 1 / span 1;
@@ -5707,6 +5953,11 @@
       grid-template-columns: auto auto minmax(0,1fr) auto;
     }
   }
+:where(.og-root).sm\:grid-cols-\[minmax\(0\,1\.2fr\)_minmax\(0\,1fr\)_11rem\],:where(.og-root) .sm\:grid-cols-\[minmax\(0\,1\.2fr\)_minmax\(0\,1fr\)_11rem\] {
+    @media (width >= 40rem) {
+      grid-template-columns: minmax(0,1.2fr) minmax(0,1fr) 11rem;
+    }
+  }
 :where(.og-root).sm\:flex-row,:where(.og-root) .sm\:flex-row {
     @media (width >= 40rem) {
       flex-direction: row;
@@ -5769,6 +6020,11 @@
       padding-inline: calc(var(--spacing) * 3);
     }
   }
+:where(.og-root).sm\:px-4,:where(.og-root) .sm\:px-4 {
+    @media (width >= 40rem) {
+      padding-inline: calc(var(--spacing) * 4);
+    }
+  }
 :where(.og-root).sm\:px-6,:where(.og-root) .sm\:px-6 {
     @media (width >= 40rem) {
       padding-inline: calc(var(--spacing) * 6);
@@ -5816,6 +6072,11 @@
       grid-template-columns: repeat(5, minmax(0, 1fr));
     }
   }
+:where(.og-root).xl\:inline,:where(.og-root) .xl\:inline {
+    @media (width >= 80rem) {
+      display: inline;
+    }
+  }
 :where(.og-root).xl\:grid-cols-3,:where(.og-root) .xl\:grid-cols-3 {
     @media (width >= 80rem) {
       grid-template-columns: repeat(3, minmax(0, 1fr));
@@ -5831,6 +6092,43 @@
       display: none;
     }
   }
+:where(.og-root).dark\:border-border,:where(.og-root) .dark\:border-border {
+    @media (prefers-color-scheme: dark) {
+      border-color: var(--og-color-border);
+    }
+  }
+:where(.og-root).dark\:bg-input\/30,:where(.og-root) .dark\:bg-input\/30 {
+    @media (prefers-color-scheme: dark) {
+      background-color: var(--color-surface-2);
+      @supports (color: color-mix(in lab, red, red)) {
+        background-color: color-mix(in oklab, var(--color-surface-2) 30%, transparent);
+      }
+    }
+  }
+:where(.og-root).dark\:hover\:bg-accent\/50,:where(.og-root) .dark\:hover\:bg-accent\/50 {
+    @media (prefers-color-scheme: dark) {
+      &:hover {
+        @media (hover: hover) {
+          background-color: var(--color-surface-2);
+          @supports (color: color-mix(in lab, red, red)) {
+            background-color: color-mix(in oklab, var(--color-surface-2) 50%, transparent);
+          }
+        }
+      }
+    }
+  }
+:where(.og-root).dark\:hover\:bg-input\/50,:where(.og-root) .dark\:hover\:bg-input\/50 {
+    @media (prefers-color-scheme: dark) {
+      &:hover {
+        @media (hover: hover) {
+          background-color: var(--color-surface-2);
+          @supports (color: color-mix(in lab, red, red)) {
+            background-color: color-mix(in oklab, var(--color-surface-2) 50%, transparent);
+          }
+        }
+      }
+    }
+  }
 :where(.og-root).pointer-coarse\:top-14,:where(.og-root) .pointer-coarse\:top-14 {
     @media (pointer: coarse) {
       top: calc(var(--spacing) * 14);
@@ -5841,6 +6139,12 @@
       margin-inline: calc(19px * -1);
     }
   }
+:where(.og-root).pointer-coarse\:size-6,:where(.og-root) .pointer-coarse\:size-6 {
+    @media (pointer: coarse) {
+      width: calc(var(--spacing) * 6);
+      height: calc(var(--spacing) * 6);
+    }
+  }
 :where(.og-root).pointer-coarse\:size-9,:where(.og-root) .pointer-coarse\:size-9 {
     @media (pointer: coarse) {
       width: calc(var(--spacing) * 9);
@@ -5865,6 +6169,16 @@
       height: 44px;
     }
   }
+:where(.og-root).pointer-coarse\:h-9,:where(.og-root) .pointer-coarse\:h-9 {
+    @media (pointer: coarse) {
+      height: calc(var(--spacing) * 9);
+    }
+  }
+:where(.og-root).pointer-coarse\:h-10,:where(.og-root) .pointer-coarse\:h-10 {
+    @media (pointer: coarse) {
+      height: calc(var(--spacing) * 10);
+    }
+  }
 :where(.og-root).pointer-coarse\:h-11,:where(.og-root) .pointer-coarse\:h-11 {
     @media (pointer: coarse) {
       height: calc(var(--spacing) * 11);
@@ -6067,6 +6381,17 @@
       margin-block: calc(var(--spacing) * 1.5);
     }
   }
+:where(.og-root).\[\&\>svg\]\:pointer-events-none,:where(.og-root) .\[\&\>svg\]\:pointer-events-none {
+    &>svg {
+      pointer-events: none;
+    }
+  }
+:where(.og-root).\[\&\>svg\]\:size-3,:where(.og-root) .\[\&\>svg\]\:size-3 {
+    &>svg {
+      width: calc(var(--spacing) * 3);
+      height: calc(var(--spacing) * 3);
+    }
+  }
 :where(.og-root).\[\&\>svg\]\:size-3\.5,:where(.og-root) .\[\&\>svg\]\:size-3\.5 {
     &>svg {
       width: calc(var(--spacing) * 3.5);