@marigold/theme-rui 0.3.0 → 0.3.2

package/dist/styles.css

@@ -2,7 +2,7 @@
 @layer theme, base, components, utilities;
 @layer theme {
   [data-theme="rui"], [data-theme="rui"] :host {
-    --font-sans: 'Inter', system-ui, sans-serif;
+    --font-sans: Inter, system-ui, sans-serif;
     --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
       "Courier New", monospace;
     --color-red-100: oklch(0.936 0.032 17.717);
@@ -64,6 +64,7 @@
     --color-black: #000;
     --color-white: #fff;
     --spacing: 0.25rem;
+    --container-lg: 32rem;
     --text-xs: 0.75rem;
     --text-xs--line-height: calc(1 / 0.75);
     --text-sm: 0.875rem;
@@ -320,6 +321,9 @@
   [data-theme="rui"] .top-2 {
     top: calc(var(--spacing) * 2);
   }
+  [data-theme="rui"] .top-3 {
+    top: calc(var(--spacing) * 3);
+  }
   [data-theme="rui"] .top-4 {
     top: calc(var(--spacing) * 4);
   }
@@ -338,8 +342,8 @@
   [data-theme="rui"] .right-2 {
     right: calc(var(--spacing) * 2);
   }
-  [data-theme="rui"] .right-4 {
-    right: calc(var(--spacing) * 4);
+  [data-theme="rui"] .right-3 {
+    right: calc(var(--spacing) * 3);
   }
   [data-theme="rui"] .bottom-0\! {
     bottom: calc(var(--spacing) * 0) !important;
@@ -350,9 +354,6 @@
   [data-theme="rui"] .left-1 {
     left: calc(var(--spacing) * 1);
   }
-  [data-theme="rui"] .left-1\/2 {
-    left: calc(1/2 * 100%);
-  }
   [data-theme="rui"] .z-10 {
     z-index: 10;
   }
@@ -395,12 +396,18 @@
   [data-theme="rui"] .m-2 {
     margin: calc(var(--spacing) * 2);
   }
+  [data-theme="rui"] .-my-1\.5 {
+    margin-block: calc(var(--spacing) * -1.5);
+  }
   [data-theme="rui"] .ms-\[auto\] {
     margin-inline-start: auto;
   }
   [data-theme="rui"] .ms-auto {
     margin-inline-start: auto;
   }
+  [data-theme="rui"] .-me-2 {
+    margin-inline-end: calc(var(--spacing) * -2);
+  }
   [data-theme="rui"] .me-\[auto\] {
     margin-inline-end: auto;
   }
@@ -428,9 +435,6 @@
   [data-theme="rui"] .mb-\[10px\] {
     margin-bottom: 10px;
   }
-  [data-theme="rui"] .ml-4 {
-    margin-left: calc(var(--spacing) * 4);
-  }
   [data-theme="rui"] .ml-6 {
     margin-left: calc(var(--spacing) * 6);
   }
@@ -507,6 +511,10 @@
     width: calc(var(--spacing) * 7);
     height: calc(var(--spacing) * 7);
   }
+  [data-theme="rui"] .size-8 {
+    width: calc(var(--spacing) * 8);
+    height: calc(var(--spacing) * 8);
+  }
   [data-theme="rui"] .size-9 {
     width: calc(var(--spacing) * 9);
     height: calc(var(--spacing) * 9);
@@ -531,6 +539,10 @@
     width: calc(var(--spacing) * 44);
     height: calc(var(--spacing) * 44);
   }
+  [data-theme="rui"] .size-96 {
+    width: calc(var(--spacing) * 96);
+    height: calc(var(--spacing) * 96);
+  }
   [data-theme="rui"] .size-\[40px\] {
     width: 40px;
     height: 40px;
@@ -731,9 +743,6 @@
   [data-theme="rui"] .h-400 {
     height: calc(var(--spacing) * 400);
   }
-  [data-theme="rui"] .h-\[9\.98px\] {
-    height: 9.98px;
-  }
   [data-theme="rui"] .h-\[30px\] {
     height: 30px;
   }
@@ -998,9 +1007,6 @@
   [data-theme="rui"] .w-96 {
     width: calc(var(--spacing) * 96);
   }
-  [data-theme="rui"] .w-\[9\.98px\] {
-    width: 9.98px;
-  }
   [data-theme="rui"] .w-\[24px\] {
     width: 24px;
   }
@@ -1022,15 +1028,6 @@
   [data-theme="rui"] .w-\[1000px\] {
     width: 1000px;
   }
-  [data-theme="rui"] .w-\[min\(100\%\,640px\)\] {
-    width: min(100%, 640px);
-  }
-  [data-theme="rui"] .w-\[min\(100\%\,768px\)\] {
-    width: min(100%, 768px);
-  }
-  [data-theme="rui"] .w-\[min\(100\%\,1024px\)\] {
-    width: min(100%, 1024px);
-  }
   [data-theme="rui"] .w-\[min\(100\%_-_3rem\,60ch\)\] {
     width: min(100% - 3rem, 60ch);
   }
@@ -1082,9 +1079,6 @@
   [data-theme="rui"] .max-w-\[400px\] {
     max-width: 400px;
   }
-  [data-theme="rui"] .max-w-\[601px\] {
-    max-width: 601px;
-  }
   [data-theme="rui"] .max-w-\[calc\(100\%-2rem\)\] {
     max-width: calc(100% - 2rem);
   }
@@ -1136,21 +1130,21 @@
   [data-theme="rui"] .border-collapse {
     border-collapse: collapse;
   }
+  [data-theme="rui"] .border-separate {
+    border-collapse: separate;
+  }
+  [data-theme="rui"] .border-spacing-0 {
+    --tw-border-spacing-x: calc(var(--spacing) * 0);
+    --tw-border-spacing-y: calc(var(--spacing) * 0);
+    border-spacing: var(--tw-border-spacing-x) var(--tw-border-spacing-y);
+  }
   [data-theme="rui"] .origin-center {
     transform-origin: center;
   }
-  [data-theme="rui"] .-translate-x-1\/2 {
-    --tw-translate-x: calc(calc(1/2 * 100%) * -1);
-    translate: var(--tw-translate-x) var(--tw-translate-y);
-  }
   [data-theme="rui"] .translate-x-0 {
     --tw-translate-x: calc(var(--spacing) * 0);
     translate: var(--tw-translate-x) var(--tw-translate-y);
   }
-  [data-theme="rui"] .-translate-y-1\/2 {
-    --tw-translate-y: calc(calc(1/2 * 100%) * -1);
-    translate: var(--tw-translate-x) var(--tw-translate-y);
-  }
   [data-theme="rui"] .translate-y-\[-50\%\] {
     --tw-translate-y: -50%;
     translate: var(--tw-translate-x) var(--tw-translate-y);
@@ -1478,8 +1472,8 @@
   [data-theme="rui"] .gap-x-2 {
     column-gap: calc(var(--spacing) * 2);
   }
-  [data-theme="rui"] .gap-x-4 {
-    column-gap: calc(var(--spacing) * 4);
+  [data-theme="rui"] .gap-x-3 {
+    column-gap: calc(var(--spacing) * 3);
   }
   [data-theme="rui"] .space-x-2 {
     [data-theme="rui"] :where(& > :not(:last-child)) {
@@ -1491,9 +1485,6 @@
   [data-theme="rui"] .gap-y-1 {
     row-gap: calc(var(--spacing) * 1);
   }
-  [data-theme="rui"] .gap-y-2 {
-    row-gap: calc(var(--spacing) * 2);
-  }
   [data-theme="rui"] .gap-y-10 {
     row-gap: calc(var(--spacing) * 10);
   }
@@ -1622,6 +1613,9 @@
   [data-theme="rui"] .border-input {
     border-color: var(--color-stone-300);
   }
+  [data-theme="rui"] .border-input\! {
+    border-color: var(--color-stone-300) !important;
+  }
   [data-theme="rui"] .border-lime-400 {
     border-color: var(--color-lime-400);
   }
@@ -1667,8 +1661,8 @@
   [data-theme="rui"] .bg-black {
     background-color: var(--color-black);
   }
-  [data-theme="rui"] .bg-black\/25 {
-    background-color: color-mix(in oklab, var(--color-black) 25%, transparent);
+  [data-theme="rui"] .bg-black\/80 {
+    background-color: color-mix(in oklab, var(--color-black) 80%, transparent);
   }
   [data-theme="rui"] .bg-blue-100 {
     background-color: var(--color-blue-100);
@@ -1793,15 +1787,15 @@
   [data-theme="rui"] .fill-white {
     fill: var(--color-white);
   }
-  [data-theme="rui"] .stroke-background {
-    stroke: var(--color-white);
-  }
   [data-theme="rui"] .stroke-border {
     stroke: var(--color-stone-200);
   }
   [data-theme="rui"] .stroke-brand {
     stroke: var(--color-stone-950);
   }
+  [data-theme="rui"] .stroke-foreground {
+    stroke: var(--color-stone-950);
+  }
   [data-theme="rui"] .stroke-gray-800 {
     stroke: var(--color-gray-800);
   }
@@ -2885,6 +2879,10 @@
     --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px 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);
   }
+  [data-theme="rui"] .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);
+  }
   [data-theme="rui"] .ring-0 {
     --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + 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);
@@ -3134,12 +3132,28 @@
       background-color: var(--color-stone-100);
     }
   }
-  [data-theme="rui"] .group-disabled\/checkbox\:border-disabled {
+  [data-theme="rui"] .group-disabled\/checkbox\:cursor-not-allowed {
     [data-theme="rui"] &:is(:where(.group\/checkbox):where([data-rac])[data-disabled] *) {
-      border-color: var(--color-stone-200);
+      cursor: not-allowed;
     }
     [data-theme="rui"] &:is(:where(.group\/checkbox):where(:not([data-rac])):disabled *) {
-      border-color: var(--color-stone-200);
+      cursor: not-allowed;
+    }
+  }
+  [data-theme="rui"] .group-disabled\/checkbox\:border-disabled\! {
+    [data-theme="rui"] &:is(:where(.group\/checkbox):where([data-rac])[data-disabled] *) {
+      border-color: var(--color-stone-200) !important;
+    }
+    [data-theme="rui"] &:is(:where(.group\/checkbox):where(:not([data-rac])):disabled *) {
+      border-color: var(--color-stone-200) !important;
+    }
+  }
+  [data-theme="rui"] .group-disabled\/checkbox\:bg-disabled\! {
+    [data-theme="rui"] &:is(:where(.group\/checkbox):where([data-rac])[data-disabled] *) {
+      background-color: var(--color-stone-200) !important;
+    }
+    [data-theme="rui"] &:is(:where(.group\/checkbox):where(:not([data-rac])):disabled *) {
+      background-color: var(--color-stone-200) !important;
     }
   }
   [data-theme="rui"] .group-disabled\/checkbox\:text-disabled-foreground {
@@ -3304,28 +3318,6 @@
       border-width: 0px;
     }
   }
-  [data-theme="rui"] .group-\[focus-visible\]\/radio\:outline-2 {
-    [data-theme="rui"] &:is(:where(.group\/radio):is(focus-visible) *) {
-      outline-style: var(--tw-outline-style);
-      outline-width: 2px;
-    }
-  }
-  [data-theme="rui"] .group-\[focus-visible\]\/radio\:outline-ring\/70 {
-    [data-theme="rui"] &:is(:where(.group\/radio):is(focus-visible) *) {
-      outline-color: color-mix(in oklab, var(--color-stone-400) 70%, transparent);
-    }
-  }
-  [data-theme="rui"] .group-\[focus-visible\]\/switch\:outline-2 {
-    [data-theme="rui"] &:is(:where(.group\/switch):is(focus-visible) *) {
-      outline-style: var(--tw-outline-style);
-      outline-width: 2px;
-    }
-  }
-  [data-theme="rui"] .group-\[focus-visible\]\/switch\:outline-ring\/70 {
-    [data-theme="rui"] &:is(:where(.group\/switch):is(focus-visible) *) {
-      outline-color: color-mix(in oklab, var(--color-stone-400) 70%, transparent);
-    }
-  }
   [data-theme="rui"] .group-\[group\=\"checkbox\"\]\/checkboxgroup\:font-normal {
     [data-theme="rui"] &:is(:where(.group\/checkboxgroup):is(group="checkbox") *) {
       --tw-font-weight: var(--font-weight-normal);
@@ -3368,6 +3360,11 @@
       height: 100%;
     }
   }
+  [data-theme="rui"] .file\:cursor-pointer {
+    [data-theme="rui"] &::file-selector-button {
+      cursor: pointer;
+    }
+  }
   [data-theme="rui"] .file\:border-0 {
     [data-theme="rui"] &::file-selector-button {
       border-style: var(--tw-border-style);
@@ -3512,16 +3509,16 @@
       text-align: right;
     }
   }
-  [data-theme="rui"] .first-of-type\:border-r {
+  [data-theme="rui"] .first-of-type\:border-r\! {
     [data-theme="rui"] &:first-of-type {
-      border-right-style: var(--tw-border-style);
-      border-right-width: 1px;
+      border-right-style: var(--tw-border-style) !important;
+      border-right-width: 1px !important;
     }
   }
-  [data-theme="rui"] .last-of-type\:border-l {
+  [data-theme="rui"] .last-of-type\:border-l\! {
     [data-theme="rui"] &:last-of-type {
-      border-left-style: var(--tw-border-style);
-      border-left-width: 1px;
+      border-left-style: var(--tw-border-style) !important;
+      border-left-width: 1px !important;
     }
   }
   [data-theme="rui"] .checked\:text-blue-700 {
@@ -3549,6 +3546,14 @@
       }
     }
   }
+  [data-theme="rui"] .read-only\:cursor-default {
+    [data-theme="rui"] &:where([data-rac])[data-readonly] {
+      cursor: default;
+    }
+    [data-theme="rui"] &:where(:not([data-rac])):read-only {
+      cursor: default;
+    }
+  }
   [data-theme="rui"] .invalid\:focus-within\:border-destructive {
     [data-theme="rui"] &:where([data-rac])[data-invalid] {
       [data-theme="rui"] &:where([data-rac])[data-focus-within] {
@@ -3717,16 +3722,6 @@
       }
     }
   }
-  [data-theme="rui"] .focus\:outline-0 {
-    [data-theme="rui"] &:where([data-rac])[data-focused] {
-      outline-style: var(--tw-outline-style);
-      outline-width: 0px;
-    }
-    [data-theme="rui"] &:where(:not([data-rac])):focus {
-      outline-style: var(--tw-outline-style);
-      outline-width: 0px;
-    }
-  }
   [data-theme="rui"] .group-invalid\/field\:focus\:border-destructive {
     [data-theme="rui"] &:is(:where(.group\/field):where([data-rac])[data-invalid] *) {
       [data-theme="rui"] &:where([data-rac])[data-focused] {
@@ -3763,14 +3758,6 @@
       }
     }
   }
-  [data-theme="rui"] .focus-visible\:border-ring {
-    [data-theme="rui"] &:where([data-rac])[data-focus-visible] {
-      border-color: var(--color-stone-400);
-    }
-    [data-theme="rui"] &:where(:not([data-rac])):focus-visible {
-      border-color: var(--color-stone-400);
-    }
-  }
   [data-theme="rui"] .focus-visible\:ring-0 {
     [data-theme="rui"] &:where([data-rac])[data-focus-visible] {
       --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentColor);
@@ -3781,24 +3768,6 @@
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
     }
   }
-  [data-theme="rui"] .focus-visible\:ring-\[3px\] {
-    [data-theme="rui"] &:where([data-rac])[data-focus-visible] {
-      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + 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);
-    }
-    [data-theme="rui"] &:where(:not([data-rac])):focus-visible {
-      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + 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);
-    }
-  }
-  [data-theme="rui"] .focus-visible\:ring-ring\/50 {
-    [data-theme="rui"] &:where([data-rac])[data-focus-visible] {
-      --tw-ring-color: color-mix(in oklab, var(--color-stone-400) 50%, transparent);
-    }
-    [data-theme="rui"] &:where(:not([data-rac])):focus-visible {
-      --tw-ring-color: color-mix(in oklab, var(--color-stone-400) 50%, transparent);
-    }
-  }
   [data-theme="rui"] .focus-visible\:outline {
     [data-theme="rui"] &:where([data-rac])[data-focus-visible] {
       outline-style: var(--tw-outline-style);
@@ -3819,32 +3788,6 @@
       outline-width: 2px;
     }
   }
-  [data-theme="rui"] .focus-visible\:outline-\[3px\] {
-    [data-theme="rui"] &:where([data-rac])[data-focus-visible] {
-      outline-style: var(--tw-outline-style);
-      outline-width: 3px;
-    }
-    [data-theme="rui"] &:where(:not([data-rac])):focus-visible {
-      outline-style: var(--tw-outline-style);
-      outline-width: 3px;
-    }
-  }
-  [data-theme="rui"] .focus-visible\:outline-ring\/40 {
-    [data-theme="rui"] &:where([data-rac])[data-focus-visible] {
-      outline-color: color-mix(in oklab, var(--color-stone-400) 40%, transparent);
-    }
-    [data-theme="rui"] &:where(:not([data-rac])):focus-visible {
-      outline-color: color-mix(in oklab, var(--color-stone-400) 40%, transparent);
-    }
-  }
-  [data-theme="rui"] .focus-visible\:outline-ring\/70 {
-    [data-theme="rui"] &:where([data-rac])[data-focus-visible] {
-      outline-color: color-mix(in oklab, var(--color-stone-400) 70%, transparent);
-    }
-    [data-theme="rui"] &:where(:not([data-rac])):focus-visible {
-      outline-color: color-mix(in oklab, var(--color-stone-400) 70%, transparent);
-    }
-  }
   [data-theme="rui"] .disabled\:pointer-events-none {
     [data-theme="rui"] &:where([data-rac])[data-disabled] {
       pointer-events: none;
@@ -4066,17 +4009,6 @@
       opacity: 50%;
     }
   }
-  [data-theme="rui"] .data-\[focus-visible\]\:outline-2 {
-    [data-theme="rui"] &[data-focus-visible] {
-      outline-style: var(--tw-outline-style);
-      outline-width: 2px;
-    }
-  }
-  [data-theme="rui"] .data-\[focus-visible\]\:outline-ring\/70 {
-    [data-theme="rui"] &[data-focus-visible] {
-      outline-color: color-mix(in oklab, var(--color-stone-400) 70%, transparent);
-    }
-  }
   [data-theme="rui"] .data-invalid\:data-\[focus-within\]\:border-destructive {
     [data-theme="rui"] &[data-invalid] {
       [data-theme="rui"] &[data-focus-within] {
@@ -4101,12 +4033,6 @@
       color: var(--color-stone-950);
     }
   }
-  [data-theme="rui"] .data-\[focused\]\:outline-none {
-    [data-theme="rui"] &[data-focused] {
-      --tw-outline-style: none;
-      outline-style: none;
-    }
-  }
   [data-theme="rui"] .invalid\:data-\[focused\]\:bg-destructive {
     [data-theme="rui"] &:where([data-rac])[data-invalid] {
       [data-theme="rui"] &[data-focused] {
@@ -4293,6 +4219,11 @@
       max-height: 75vh;
     }
   }
+  [data-theme="rui"] .sm\:max-h-\[min\(640px\,80vh\)\] {
+    @media (width >= 40rem) {
+      max-height: min(640px, 80vh);
+    }
+  }
   [data-theme="rui"] .sm\:w-\[32px\] {
     @media (width >= 40rem) {
       width: 32px;
@@ -4303,6 +4234,11 @@
       max-width: calc(var(--spacing) * 100);
     }
   }
+  [data-theme="rui"] .sm\:max-w-lg {
+    @media (width >= 40rem) {
+      max-width: var(--container-lg);
+    }
+  }
   [data-theme="rui"] .sm\:flex-row {
     @media (width >= 40rem) {
       flex-direction: row;
@@ -4356,6 +4292,46 @@
       }
     }
   }
+  [data-theme="rui"] .placement-left\:mr-1 {
+    [data-theme="rui"] &[data-placement="left"] {
+      margin-right: calc(var(--spacing) * 1);
+    }
+  }
+  [data-theme="rui"] .placement-left\:mr-2 {
+    [data-theme="rui"] &[data-placement="left"] {
+      margin-right: calc(var(--spacing) * 2);
+    }
+  }
+  [data-theme="rui"] .placement-right\:ml-1 {
+    [data-theme="rui"] &[data-placement="right"] {
+      margin-left: calc(var(--spacing) * 1);
+    }
+  }
+  [data-theme="rui"] .placement-right\:ml-2 {
+    [data-theme="rui"] &[data-placement="right"] {
+      margin-left: calc(var(--spacing) * 2);
+    }
+  }
+  [data-theme="rui"] .placement-top\:mb-1 {
+    [data-theme="rui"] &[data-placement="top"] {
+      margin-bottom: calc(var(--spacing) * 1);
+    }
+  }
+  [data-theme="rui"] .placement-top\:mb-2 {
+    [data-theme="rui"] &[data-placement="top"] {
+      margin-bottom: calc(var(--spacing) * 2);
+    }
+  }
+  [data-theme="rui"] .placement-bottom\:mt-1 {
+    [data-theme="rui"] &[data-placement="bottom"] {
+      margin-top: calc(var(--spacing) * 1);
+    }
+  }
+  [data-theme="rui"] .placement-bottom\:mt-2 {
+    [data-theme="rui"] &[data-placement="bottom"] {
+      margin-top: calc(var(--spacing) * 2);
+    }
+  }
   [data-theme="rui"] .pending\:cursor-not-allowed {
     [data-theme="rui"] &[data-pending] {
       cursor: not-allowed;
@@ -4456,11 +4432,43 @@
       pointer-events: none;
     }
   }
+  [data-theme="rui"] .\[\&_svg\]\:size-4 {
+    [data-theme="rui"] & svg {
+      width: calc(var(--spacing) * 4);
+      height: calc(var(--spacing) * 4);
+    }
+  }
   [data-theme="rui"] .\[\&_svg\]\:shrink-0 {
     [data-theme="rui"] & svg {
       flex-shrink: 0;
     }
   }
+  [data-theme="rui"] .\[\&_svg\]\:opacity-60 {
+    [data-theme="rui"] & svg {
+      opacity: 60%;
+    }
+  }
+  [data-theme="rui"] .\[\&_svg\]\:transition-opacity {
+    [data-theme="rui"] & svg {
+      transition-property: opacity;
+      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
+      transition-duration: var(--tw-duration, var(--default-transition-duration));
+    }
+  }
+  [data-theme="rui"] .hover\:\[\&_svg\]\:opacity-100 {
+    [data-theme="rui"] &:where([data-rac])[data-hovered] {
+      [data-theme="rui"] & svg {
+        opacity: 100%;
+      }
+    }
+    @media (hover: hover) {
+      [data-theme="rui"] &:where(:not([data-rac])):hover {
+        [data-theme="rui"] & svg {
+          opacity: 100%;
+        }
+      }
+    }
+  }
   [data-theme="rui"] .data-\[placement\=bottom\]\:\[\&_svg\]\:rotate-180 {
     [data-theme="rui"] &[data-placement="bottom"] {
       [data-theme="rui"] & svg {
@@ -4482,6 +4490,11 @@
       }
     }
   }
+  [data-theme="rui"] .\[\&_td\]\:border-border {
+    [data-theme="rui"] & td {
+      border-color: var(--color-stone-200);
+    }
+  }
   [data-theme="rui"] .\[\&_td\]\:p-2 {
     [data-theme="rui"] & td {
       padding: calc(var(--spacing) * 2);
@@ -4497,12 +4510,35 @@
       top: calc(var(--spacing) * 0);
     }
   }
+  [data-theme="rui"] .\[\&_th\]\:border-b {
+    [data-theme="rui"] & th {
+      border-bottom-style: var(--tw-border-style);
+      border-bottom-width: 1px;
+    }
+  }
+  [data-theme="rui"] .\[\&_th\]\:border-border {
+    [data-theme="rui"] & th {
+      border-color: var(--color-stone-200);
+    }
+  }
+  [data-theme="rui"] .\[\&_tr\]\:border-none {
+    [data-theme="rui"] & tr {
+      --tw-border-style: none;
+      border-style: none;
+    }
+  }
   [data-theme="rui"] .\[\&_tr\:last-child\]\:border-0 {
     [data-theme="rui"] & tr:last-child {
       border-style: var(--tw-border-style);
       border-width: 0px;
     }
   }
+  [data-theme="rui"] .\[\&_tr\:not\(\:last-child\)_td\]\:border-b {
+    [data-theme="rui"] & tr:not(:last-child) td {
+      border-bottom-style: var(--tw-border-style);
+      border-bottom-width: 1px;
+    }
+  }
   [data-theme="rui"] .\[\&\:\:-webkit-search-cancel-button\]\:hidden {
     [data-theme="rui"] &::-webkit-search-cancel-button {
       display: none;
@@ -4534,6 +4570,11 @@
       display: none;
     }
   }
+  [data-theme="rui"] .\[\&\>button\:last-child\]\:hidden {
+    [data-theme="rui"] &>button:last-child {
+      display: none;
+    }
+  }
   [data-theme="rui"] .\[\&\[type\=color\]\]\:ml-0 {
     [data-theme="rui"] &[type=color] {
       margin-left: calc(var(--spacing) * 0);
@@ -4555,6 +4596,11 @@
       padding: calc(var(--spacing) * 0);
     }
   }
+  [data-theme="rui"] .\[\&\[type\=file\]\]\:cursor-pointer {
+    [data-theme="rui"] &[type=file] {
+      cursor: pointer;
+    }
+  }
   [data-theme="rui"] .\[\&\[type\=file\]\]\:border-none {
     [data-theme="rui"] &[type=file] {
       --tw-border-style: none;
@@ -4656,45 +4702,53 @@
       --tw-ring-color: color-mix(in oklab, var(--color-stone-400) 50%, transparent);
     }
   }
-  [data-theme="rui"] .mixin-ring-focus-visible-borderless {
-    --tw-outline-style: none;
-    outline-style: none;
-    [data-theme="rui"] &:where([data-rac])[data-focus-visible] {
+  [data-theme="rui"] .mixin-ring-focus-visible-radio {
+    [data-theme="rui"] &:is(:where(.group\/radio):where([data-rac])[data-focus-visible] *) {
       --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + 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);
     }
-    [data-theme="rui"] &:where(:not([data-rac])):focus-visible {
+    [data-theme="rui"] &:is(:where(.group\/radio):where(:not([data-rac])):focus-visible *) {
       --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + 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);
     }
-    [data-theme="rui"] &:where([data-rac])[data-focus-visible] {
+    [data-theme="rui"] &:is(:where(.group\/radio):where([data-rac])[data-focus-visible] *) {
       --tw-ring-color: color-mix(in oklab, var(--color-stone-400) 50%, transparent);
     }
-    [data-theme="rui"] &:where(:not([data-rac])):focus-visible {
+    [data-theme="rui"] &:is(:where(.group\/radio):where(:not([data-rac])):focus-visible *) {
       --tw-ring-color: color-mix(in oklab, var(--color-stone-400) 50%, transparent);
     }
   }
-  [data-theme="rui"] .mixin-ring-focus-within {
-    --tw-outline-style: none;
-    outline-style: none;
-    [data-theme="rui"] &:where([data-rac])[data-focus-within] {
-      border-color: var(--color-stone-400);
+  [data-theme="rui"] .mixin-ring-focus-visible-switch {
+    [data-theme="rui"] &:is(:where(.group\/switch):where([data-rac])[data-focus-visible] *) {
+      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + 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);
     }
-    [data-theme="rui"] &:where(:not([data-rac])):focus-within {
-      border-color: var(--color-stone-400);
+    [data-theme="rui"] &:is(:where(.group\/switch):where(:not([data-rac])):focus-visible *) {
+      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + 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);
+    }
+    [data-theme="rui"] &:is(:where(.group\/switch):where([data-rac])[data-focus-visible] *) {
+      --tw-ring-color: color-mix(in oklab, var(--color-stone-400) 50%, transparent);
     }
-    [data-theme="rui"] &:where([data-rac])[data-focus-within] {
+    [data-theme="rui"] &:is(:where(.group\/switch):where(:not([data-rac])):focus-visible *) {
+      --tw-ring-color: color-mix(in oklab, var(--color-stone-400) 50%, transparent);
+    }
+  }
+  [data-theme="rui"] .mixin-ring-focus-visible-borderless {
+    --tw-outline-style: none;
+    outline-style: none;
+    [data-theme="rui"] &:where([data-rac])[data-focus-visible] {
       --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + 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);
     }
-    [data-theme="rui"] &:where(:not([data-rac])):focus-within {
+    [data-theme="rui"] &:where(:not([data-rac])):focus-visible {
       --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + 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);
     }
-    [data-theme="rui"] &:where([data-rac])[data-focus-within] {
+    [data-theme="rui"] &:where([data-rac])[data-focus-visible] {
       --tw-ring-color: color-mix(in oklab, var(--color-stone-400) 50%, transparent);
     }
-    [data-theme="rui"] &:where(:not([data-rac])):focus-within {
+    [data-theme="rui"] &:where(:not([data-rac])):focus-visible {
       --tw-ring-color: color-mix(in oklab, var(--color-stone-400) 50%, transparent);
     }
   }
@@ -4740,10 +4794,10 @@
     font-optical-sizing: auto;
     font-style: normal;
     background-color: var(--color-white);
-    font-family: 'Inter', system-ui, sans-serif;
+    font-family: Inter, system-ui, sans-serif;
     color: var(--color-stone-950);
     @supports (font-variation-settings:normal) {
-      font-family: InterVariable, system-ui, sans-serif;
+      font-family: InterVariable, Inter, system-ui, sans-serif;
     }
   }
 }
@@ -4759,6 +4813,16 @@
     transform: translate3d(var(--tw-exit-translate-x, 0), var(--tw-exit-translate-y, 0), 0) scale3d(var(--tw-exit-scale, 1), var(--tw-exit-scale, 1), var(--tw-exit-scale, 1)) rotate(var(--tw-exit-rotate, 0));
   }
 }
+@property --tw-border-spacing-x {
+  syntax: "<length>";
+  inherits: false;
+  initial-value: 0;
+}
+@property --tw-border-spacing-y {
+  syntax: "<length>";
+  inherits: false;
+  initial-value: 0;
+}
 @property --tw-translate-x {
   syntax: "*";
   inherits: false;