@signiphi/page-assembly 0.2.0-beta.2 → 0.2.0-beta.20

package/dist/styles/index.css

@@ -15,7 +15,6 @@
   --color-red-700: rgb(191, 0, 15);
   --color-blue-50: rgb(239, 246, 255);
   --color-blue-500: rgb(50, 128, 255);
-  --color-gray-50: rgb(249, 250, 251);
   --color-gray-100: rgb(243, 244, 246);
   --color-gray-200: rgb(229, 231, 235);
   --color-gray-300: rgb(209, 213, 220);
@@ -49,26 +48,6 @@
   --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
   --default-font-family: var(--font-sans);
   --default-mono-font-family: var(--font-mono);
-  --color-primary: #0099cd;
-  --color-primary-foreground: #ffffff;
-  --color-secondary: #f1f5f9;
-  --color-secondary-foreground: #0f172a;
-  --color-destructive: #ef4444;
-  --color-destructive-foreground: #ffffff;
-  --color-muted: #f1f5f9;
-  --color-muted-foreground: #64748b;
-  --color-accent: #f1f5f9;
-  --color-accent-foreground: #0f172a;
-  --color-popover: #ffffff;
-  --color-popover-foreground: #0f172a;
-  --color-card: #ffffff;
-  --color-card-foreground: #0f172a;
-  --color-border: #e2e8f0;
-  --color-input: #e2e8f0;
-  --color-ring: #0099cd;
-  --color-background: #ffffff;
-  --color-foreground: #0f172a;
-  --xpa-border: 214.3 31.8% 91.4%;
 }
 @supports (color: color(display-p3 0 0 0%)) {
 :root:not(#\#), .signiphi-page-assembly:not(#\#) :host {
@@ -190,16 +169,10 @@
   background-color: transparent;
   opacity: 1;
 }
-.signiphi-page-assembly:not(#\#):not(#\#) :where(select[multiple]) optgroup {
-  font-weight: bolder;
-}
-.signiphi-page-assembly:not(#\#):not(#\#) :where(select[size]) optgroup {
+.signiphi-page-assembly:not(#\#):not(#\#) :where(select:is([multiple], [size])) optgroup {
   font-weight: bolder;
 }
-.signiphi-page-assembly:not(#\#):not(#\#) :where(select[multiple]) optgroup option {
-  padding-left: 20px;
-}
-.signiphi-page-assembly:not(#\#):not(#\#) :where(select[size]) optgroup option {
+.signiphi-page-assembly:not(#\#):not(#\#) :where(select:is([multiple], [size])) optgroup option {
   padding-left: 20px;
 }
 .signiphi-page-assembly:not(#\#):not(#\#) ::file-selector-button {
@@ -264,6 +237,12 @@
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#) [hidden]:where(:not([hidden="until-found"])) {
   display: none !important;
 }
+.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .invisible {
+  visibility: hidden;
+}
+.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .visible {
+  visibility: visible;
+}
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .sr-only {
   position: absolute;
   width: 1px;
@@ -309,9 +288,6 @@
   top: calc(0.25rem * 4);
   top: calc(var(--spacing) * 4);
 }
-.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .top-\[50\%\] {
-  top: 50%;
-}
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .right-1 {
   right: calc(0.25rem * 1);
   right: calc(var(--spacing) * 1);
@@ -416,6 +392,12 @@
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .ml-auto {
   margin-left: auto;
 }
+.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .block {
+  display: block;
+}
+.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .contents {
+  display: contents;
+}
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .flex {
   display: flex;
 }
@@ -425,6 +407,9 @@
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .hidden {
   display: none;
 }
+.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .inline {
+  display: inline;
+}
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .inline-flex {
   display: inline-flex;
 }
@@ -536,16 +521,14 @@
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .min-w-\[var\(--radix-select-trigger-width\)\] {
   min-width: var(--radix-select-trigger-width);
 }
+.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .flex-shrink-0 {
+  flex-shrink: 0;
+}
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .translate-x-\[-50\%\] {
   --tw-translate-x: -50%;
   translate: -50% var(--tw-translate-y);
   translate: var(--tw-translate-x) var(--tw-translate-y);
 }
-.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .translate-y-\[-50\%\] {
-  --tw-translate-y: -50%;
-  translate: var(--tw-translate-x) -50%;
-  translate: var(--tw-translate-x) var(--tw-translate-y);
-}
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .scale-95 {
   --tw-scale-x: 95%;
   --tw-scale-y: 95%;
@@ -580,6 +563,9 @@
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .cursor-pointer {
   cursor: pointer;
 }
+.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .resize {
+  resize: both;
+}
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .grid-cols-2 {
   grid-template-columns: repeat(2, minmax(0, 1fr));
 }
@@ -613,7 +599,7 @@
   gap: calc(0.25rem * 4);
   gap: calc(var(--spacing) * 4);
 }
-.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :where(.signiphi-page-assembly .space-y-1\.5 > :not(:last-child)) {
+.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :where(:is(.signiphi-page-assembly .space-y-1\.5) > :not(:last-child)) {
   --tw-space-y-reverse: 0;
   margin-top: calc((0.25rem * 1.5) * 0);
   margin-top: calc((var(--spacing) * 1.5) * var(--tw-space-y-reverse));
@@ -624,7 +610,7 @@
   margin-bottom: calc(calc(0.25rem * 1.5) * calc(1 - 0));
   margin-bottom: calc(calc(var(--spacing) * 1.5) * calc(1 - var(--tw-space-y-reverse)));
 }
-.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :where(.signiphi-page-assembly .space-y-2 > :not(:last-child)) {
+.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :where(:is(.signiphi-page-assembly .space-y-2) > :not(:last-child)) {
   --tw-space-y-reverse: 0;
   margin-top: calc((0.25rem * 2) * 0);
   margin-top: calc((var(--spacing) * 2) * var(--tw-space-y-reverse));
@@ -635,7 +621,7 @@
   margin-bottom: calc(calc(0.25rem * 2) * calc(1 - 0));
   margin-bottom: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));
 }
-.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :where(.signiphi-page-assembly .space-y-3 > :not(:last-child)) {
+.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :where(:is(.signiphi-page-assembly .space-y-3) > :not(:last-child)) {
   --tw-space-y-reverse: 0;
   margin-top: calc((0.25rem * 3) * 0);
   margin-top: calc((var(--spacing) * 3) * var(--tw-space-y-reverse));
@@ -654,6 +640,12 @@
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .overflow-hidden {
   overflow: hidden;
 }
+.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .overflow-x-hidden {
+  overflow-x: hidden;
+}
+.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .overflow-y-auto {
+  overflow-y: auto;
+}
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .rounded {
   border-radius: 0.25rem;
 }
@@ -689,36 +681,48 @@
   border-style: dashed;
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .border-border {
-  border-color: #e2e8f0;
-  border-color: var(--color-border);
+  border-color: hsl(214, 32%, 91%);
+  border-color: hsl(var(--xpa-border));
+}
+.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .border-destructive\/50 {
+  border-color: hsl(0, 84%, 60%);
+  border-color: hsl(var(--xpa-destructive));
+}
+@supports (color: color-mix(in lab, red, red)) {
+  .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .border-destructive\/50 {
+    border-color: color-mix(in oklab, hsl(0, 84%, 60%) 50%, transparent);
+  }
+
+@supports (color: color-mix(in lch, red, blue)) {
+.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .border-destructive\/50 {
+      border-color: color-mix(in oklab, hsl(var(--xpa-destructive)) 50%, transparent);
+    }
+}
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .border-gray-200 {
   border-color: rgb(229, 231, 235);
   border-color: var(--color-gray-200);
 }
-.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .border-gray-300 {
-  border-color: rgb(209, 213, 220);
-  border-color: var(--color-gray-300);
-}
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .border-input {
-  border-color: #e2e8f0;
-  border-color: var(--color-input);
+  border-color: hsl(214, 32%, 91%);
+  border-color: hsl(var(--xpa-input));
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .border-primary {
-  border-color: #0099cd;
-  border-color: var(--color-primary);
+  border-color: hsl(198, 100%, 40%);
+  border-color: hsl(var(--xpa-primary));
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .border-primary\/20 {
-  border-color: rgba(0, 153, 205, 0.2);
+  border-color: hsl(198, 100%, 40%);
+  border-color: hsl(var(--xpa-primary));
 }
 @supports (color: color-mix(in lab, red, red)) {
   .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .border-primary\/20 {
-    border-color: color-mix(in oklab, #0099cd 20%, transparent);
+    border-color: color-mix(in oklab, hsl(198, 100%, 40%) 20%, transparent);
   }
 
 @supports (color: color-mix(in lch, red, blue)) {
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .border-primary\/20 {
-      border-color: color-mix(in oklab, var(--color-primary) 20%, transparent);
+      border-color: color-mix(in oklab, hsl(var(--xpa-primary)) 20%, transparent);
     }
 }
 }
@@ -726,8 +730,8 @@
   border-color: transparent;
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .bg-background {
-  background-color: #ffffff;
-  background-color: var(--color-background);
+  background-color: hsl(0, 0%, 100%);
+  background-color: hsl(var(--xpa-background));
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .bg-black\/50 {
   background-color: rgba(0, 0, 0, 0.5);
@@ -762,61 +766,74 @@
   background-color: var(--color-blue-50);
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .bg-card {
-  background-color: #ffffff;
-  background-color: var(--color-card);
+  background-color: hsl(0, 0%, 100%);
+  background-color: hsl(var(--xpa-card));
 }
-.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .bg-destructive {
-  background-color: #ef4444;
-  background-color: var(--color-destructive);
+.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .bg-card\/90 {
+  background-color: hsl(0, 0%, 100%);
+  background-color: hsl(var(--xpa-card));
 }
-.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .bg-muted {
-  background-color: #f1f5f9;
-  background-color: var(--color-muted);
+@supports (color: color-mix(in lab, red, red)) {
+  .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .bg-card\/90 {
+    background-color: color-mix(in oklab, hsl(0, 0%, 100%) 90%, transparent);
+  }
+
+@supports (color: color-mix(in lch, red, blue)) {
+.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .bg-card\/90 {
+      background-color: color-mix(in oklab, hsl(var(--xpa-card)) 90%, transparent);
+    }
 }
-.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .bg-popover {
-  background-color: #ffffff;
-  background-color: var(--color-popover);
 }
-.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .bg-primary {
-  background-color: #0099cd;
-  background-color: var(--color-primary);
+.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .bg-destructive {
+  background-color: hsl(0, 84%, 60%);
+  background-color: hsl(var(--xpa-destructive));
 }
-.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .bg-primary\/20 {
-  background-color: rgba(0, 153, 205, 0.2);
+.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .bg-destructive\/5 {
+  background-color: hsl(0, 84%, 60%);
+  background-color: hsl(var(--xpa-destructive));
 }
 @supports (color: color-mix(in lab, red, red)) {
-  .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .bg-primary\/20 {
-    background-color: color-mix(in oklab, #0099cd 20%, transparent);
+  .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .bg-destructive\/5 {
+    background-color: color-mix(in oklab, hsl(0, 84%, 60%) 5%, transparent);
   }
 
 @supports (color: color-mix(in lch, red, blue)) {
-.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .bg-primary\/20 {
-      background-color: color-mix(in oklab, var(--color-primary) 20%, transparent);
+.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .bg-destructive\/5 {
+      background-color: color-mix(in oklab, hsl(var(--xpa-destructive)) 5%, transparent);
     }
 }
 }
-.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .bg-secondary {
-  background-color: #f1f5f9;
-  background-color: var(--color-secondary);
+.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .bg-muted {
+  background-color: hsl(210, 40%, 96%);
+  background-color: hsl(var(--xpa-muted));
 }
-.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .bg-white {
-  background-color: #fff;
-  background-color: var(--color-white);
+.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .bg-popover {
+  background-color: hsl(0, 0%, 100%);
+  background-color: hsl(var(--xpa-popover));
+}
+.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .bg-primary {
+  background-color: hsl(198, 100%, 40%);
+  background-color: hsl(var(--xpa-primary));
 }
-.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .bg-white\/90 {
-  background-color: rgba(255, 255, 255, 0.9);
+.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .bg-primary\/20 {
+  background-color: hsl(198, 100%, 40%);
+  background-color: hsl(var(--xpa-primary));
 }
 @supports (color: color-mix(in lab, red, red)) {
-  .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .bg-white\/90 {
-    background-color: color-mix(in oklab, #fff 90%, transparent);
+  .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .bg-primary\/20 {
+    background-color: color-mix(in oklab, hsl(198, 100%, 40%) 20%, transparent);
   }
 
 @supports (color: color-mix(in lch, red, blue)) {
-.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .bg-white\/90 {
-      background-color: color-mix(in oklab, var(--color-white) 90%, transparent);
+.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .bg-primary\/20 {
+      background-color: color-mix(in oklab, hsl(var(--xpa-primary)) 20%, transparent);
     }
 }
 }
+.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .bg-secondary {
+  background-color: hsl(210, 40%, 96%);
+  background-color: hsl(var(--xpa-secondary));
+}
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .fill-current {
   fill: currentcolor;
 }
@@ -988,16 +1005,20 @@
   color: var(--color-blue-500);
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .text-card-foreground {
-  color: #0f172a;
-  color: var(--color-card-foreground);
+  color: hsl(222, 84%, 5%);
+  color: hsl(var(--xpa-card-foreground));
+}
+.signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .text-destructive {
+  color: hsl(0, 84%, 60%);
+  color: hsl(var(--xpa-destructive));
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .text-destructive-foreground {
-  color: #ffffff;
-  color: var(--color-destructive-foreground);
+  color: hsl(0, 0%, 100%);
+  color: hsl(var(--xpa-destructive-foreground));
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .text-foreground {
-  color: #0f172a;
-  color: var(--color-foreground);
+  color: hsl(222, 84%, 5%);
+  color: hsl(var(--xpa-foreground));
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .text-gray-400 {
   color: rgb(153, 161, 175);
@@ -1016,20 +1037,20 @@
   color: var(--color-gray-900);
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .text-muted-foreground {
-  color: #64748b;
-  color: var(--color-muted-foreground);
+  color: hsl(215, 16%, 47%);
+  color: hsl(var(--xpa-muted-foreground));
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .text-popover-foreground {
-  color: #0f172a;
-  color: var(--color-popover-foreground);
+  color: hsl(222, 84%, 5%);
+  color: hsl(var(--xpa-popover-foreground));
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .text-primary {
-  color: #0099cd;
-  color: var(--color-primary);
+  color: hsl(198, 100%, 40%);
+  color: hsl(var(--xpa-primary));
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .text-primary-foreground {
-  color: #ffffff;
-  color: var(--color-primary-foreground);
+  color: hsl(0, 0%, 100%);
+  color: hsl(var(--xpa-primary-foreground));
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .text-red-500 {
   color: rgb(251, 44, 54);
@@ -1041,8 +1062,8 @@
   color: var(--color-red-600);
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .text-secondary-foreground {
-  color: #0f172a;
-  color: var(--color-secondary-foreground);
+  color: hsl(222, 47%, 11%);
+  color: hsl(var(--xpa-secondary-foreground));
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .text-white {
   color: #fff;
@@ -1087,7 +1108,7 @@
   box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .ring-offset-background {
-  --tw-ring-offset-color: var(--color-background);
+  --tw-ring-offset-color: hsl(var(--xpa-background));
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .outline {
   outline-style: var(--tw-outline-style);
@@ -1157,12 +1178,12 @@
   font-weight: var(--font-weight-medium);
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .placeholder\:text-muted-foreground)::-moz-placeholder {
-  color: #64748b;
-  color: var(--color-muted-foreground);
+  color: hsl(215, 16%, 47%);
+  color: hsl(var(--xpa-muted-foreground));
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .placeholder\:text-muted-foreground)::placeholder {
-  color: #64748b;
-  color: var(--color-muted-foreground);
+  color: hsl(215, 16%, 47%);
+  color: hsl(var(--xpa-muted-foreground));
 }
 @media (hover: hover) {
   .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .hover\:border-gray-300):hover {
@@ -1172,54 +1193,57 @@
 }
 @media (hover: hover) {
   .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .hover\:border-primary\/60):hover {
-    border-color: rgba(0, 153, 205, 0.6);
+    border-color: hsl(198, 100%, 40%);
+    border-color: hsl(var(--xpa-primary));
   }
   @supports (color: color-mix(in lab, red, red)) {
     .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .hover\:border-primary\/60):hover {
-      border-color: color-mix(in oklab, #0099cd 60%, transparent);
+      border-color: color-mix(in oklab, hsl(198, 100%, 40%) 60%, transparent);
     }
 
 @supports (color: color-mix(in lch, red, blue)) {
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .hover\:border-primary\/60):hover {
-        border-color: color-mix(in oklab, var(--color-primary) 60%, transparent);
+        border-color: color-mix(in oklab, hsl(var(--xpa-primary)) 60%, transparent);
       }
 }
   }
 }
 @media (hover: hover) {
   .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .hover\:bg-accent):hover {
-    background-color: #f1f5f9;
-    background-color: var(--color-accent);
+    background-color: hsl(210, 40%, 96%);
+    background-color: hsl(var(--xpa-accent));
   }
 }
 @media (hover: hover) {
   .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .hover\:bg-destructive\/80):hover {
-    background-color: rgba(239, 68, 68, 0.8);
+    background-color: hsl(0, 84%, 60%);
+    background-color: hsl(var(--xpa-destructive));
   }
   @supports (color: color-mix(in lab, red, red)) {
     .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .hover\:bg-destructive\/80):hover {
-      background-color: color-mix(in oklab, #ef4444 80%, transparent);
+      background-color: color-mix(in oklab, hsl(0, 84%, 60%) 80%, transparent);
     }
 
 @supports (color: color-mix(in lch, red, blue)) {
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .hover\:bg-destructive\/80):hover {
-        background-color: color-mix(in oklab, var(--color-destructive) 80%, transparent);
+        background-color: color-mix(in oklab, hsl(var(--xpa-destructive)) 80%, transparent);
       }
 }
   }
 }
 @media (hover: hover) {
   .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .hover\:bg-destructive\/90):hover {
-    background-color: rgba(239, 68, 68, 0.9);
+    background-color: hsl(0, 84%, 60%);
+    background-color: hsl(var(--xpa-destructive));
   }
   @supports (color: color-mix(in lab, red, red)) {
     .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .hover\:bg-destructive\/90):hover {
-      background-color: color-mix(in oklab, #ef4444 90%, transparent);
+      background-color: color-mix(in oklab, hsl(0, 84%, 60%) 90%, transparent);
     }
 
 @supports (color: color-mix(in lch, red, blue)) {
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .hover\:bg-destructive\/90):hover {
-        background-color: color-mix(in oklab, var(--color-destructive) 90%, transparent);
+        background-color: color-mix(in oklab, hsl(var(--xpa-destructive)) 90%, transparent);
       }
 }
   }
@@ -1232,48 +1256,51 @@
 }
 @media (hover: hover) {
   .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .hover\:bg-primary\/10):hover {
-    background-color: rgba(0, 153, 205, 0.1);
+    background-color: hsl(198, 100%, 40%);
+    background-color: hsl(var(--xpa-primary));
   }
   @supports (color: color-mix(in lab, red, red)) {
     .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .hover\:bg-primary\/10):hover {
-      background-color: color-mix(in oklab, #0099cd 10%, transparent);
+      background-color: color-mix(in oklab, hsl(198, 100%, 40%) 10%, transparent);
     }
 
 @supports (color: color-mix(in lch, red, blue)) {
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .hover\:bg-primary\/10):hover {
-        background-color: color-mix(in oklab, var(--color-primary) 10%, transparent);
+        background-color: color-mix(in oklab, hsl(var(--xpa-primary)) 10%, transparent);
       }
 }
   }
 }
 @media (hover: hover) {
   .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .hover\:bg-primary\/80):hover {
-    background-color: rgba(0, 153, 205, 0.8);
+    background-color: hsl(198, 100%, 40%);
+    background-color: hsl(var(--xpa-primary));
   }
   @supports (color: color-mix(in lab, red, red)) {
     .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .hover\:bg-primary\/80):hover {
-      background-color: color-mix(in oklab, #0099cd 80%, transparent);
+      background-color: color-mix(in oklab, hsl(198, 100%, 40%) 80%, transparent);
     }
 
 @supports (color: color-mix(in lch, red, blue)) {
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .hover\:bg-primary\/80):hover {
-        background-color: color-mix(in oklab, var(--color-primary) 80%, transparent);
+        background-color: color-mix(in oklab, hsl(var(--xpa-primary)) 80%, transparent);
       }
 }
   }
 }
 @media (hover: hover) {
   .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .hover\:bg-primary\/90):hover {
-    background-color: rgba(0, 153, 205, 0.9);
+    background-color: hsl(198, 100%, 40%);
+    background-color: hsl(var(--xpa-primary));
   }
   @supports (color: color-mix(in lab, red, red)) {
     .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .hover\:bg-primary\/90):hover {
-      background-color: color-mix(in oklab, #0099cd 90%, transparent);
+      background-color: color-mix(in oklab, hsl(198, 100%, 40%) 90%, transparent);
     }
 
 @supports (color: color-mix(in lch, red, blue)) {
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .hover\:bg-primary\/90):hover {
-        background-color: color-mix(in oklab, var(--color-primary) 90%, transparent);
+        background-color: color-mix(in oklab, hsl(var(--xpa-primary)) 90%, transparent);
       }
 }
   }
@@ -1286,24 +1313,25 @@
 }
 @media (hover: hover) {
   .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .hover\:bg-secondary\/80):hover {
-    background-color: rgba(241, 245, 249, 0.8);
+    background-color: hsl(210, 40%, 96%);
+    background-color: hsl(var(--xpa-secondary));
   }
   @supports (color: color-mix(in lab, red, red)) {
     .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .hover\:bg-secondary\/80):hover {
-      background-color: color-mix(in oklab, #f1f5f9 80%, transparent);
+      background-color: color-mix(in oklab, hsl(210, 40%, 96%) 80%, transparent);
     }
 
 @supports (color: color-mix(in lch, red, blue)) {
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .hover\:bg-secondary\/80):hover {
-        background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);
+        background-color: color-mix(in oklab, hsl(var(--xpa-secondary)) 80%, transparent);
       }
 }
   }
 }
 @media (hover: hover) {
   .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .hover\:text-accent-foreground):hover {
-    color: #0f172a;
-    color: var(--color-accent-foreground);
+    color: hsl(222, 47%, 11%);
+    color: hsl(var(--xpa-accent-foreground));
   }
 }
 @media (hover: hover) {
@@ -1324,20 +1352,20 @@
   }
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .focus\:border-primary):focus {
-  border-color: #0099cd;
-  border-color: var(--color-primary);
+  border-color: hsl(198, 100%, 40%);
+  border-color: hsl(var(--xpa-primary));
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .focus\:bg-accent):focus {
-  background-color: #f1f5f9;
-  background-color: var(--color-accent);
+  background-color: hsl(210, 40%, 96%);
+  background-color: hsl(var(--xpa-accent));
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .focus\:bg-red-50):focus {
   background-color: rgb(254, 242, 242);
   background-color: var(--color-red-50);
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .focus\:text-accent-foreground):focus {
-  color: #0f172a;
-  color: var(--color-accent-foreground);
+  color: hsl(222, 47%, 11%);
+  color: hsl(var(--xpa-accent-foreground));
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .focus\:text-red-700):focus {
   color: rgb(191, 0, 15);
@@ -1358,10 +1386,10 @@
   box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .focus\:ring-primary):focus {
-  --tw-ring-color: var(--color-primary);
+  --tw-ring-color: hsl(var(--xpa-primary));
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .focus\:ring-ring):focus {
-  --tw-ring-color: var(--color-ring);
+  --tw-ring-color: hsl(var(--xpa-ring));
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .focus\:ring-offset-2):focus {
   --tw-ring-offset-width: 2px;
@@ -1372,8 +1400,8 @@
   outline-style: none;
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .focus-visible\:border-primary):focus-visible {
-  border-color: #0099cd;
-  border-color: var(--color-primary);
+  border-color: hsl(198, 100%, 40%);
+  border-color: hsl(var(--xpa-primary));
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .focus-visible\:shadow-\[0_0_0_3px_rgba\(0\,153\,205\,0\.15\)\]):focus-visible {
   --tw-shadow: 0 0 0 3px var(--tw-shadow-color, rgba(0,153,205,0.15));
@@ -1389,7 +1417,7 @@
   box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .focus-visible\:ring-ring):focus-visible {
-  --tw-ring-color: var(--color-ring);
+  --tw-ring-color: hsl(var(--xpa-ring));
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .focus-visible\:ring-offset-2):focus-visible {
   --tw-ring-offset-width: 2px;
@@ -1435,8 +1463,8 @@
   translate: var(--tw-translate-x) var(--tw-translate-y);
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) [data-state="open"]:is(.signiphi-page-assembly .data-\[state\=open\]\:bg-accent) {
-  background-color: #f1f5f9;
-  background-color: var(--color-accent);
+  background-color: hsl(210, 40%, 96%);
+  background-color: hsl(var(--xpa-accent));
 }
 @media (min-width: 40rem) {
   .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .sm\:mt-0 {
@@ -1460,7 +1488,7 @@
   }
 }
 @media (min-width: 40rem) {
-  .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :where(.signiphi-page-assembly .sm\:space-x-2 > :not(:last-child)) {
+  .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :where(:is(.signiphi-page-assembly .sm\:space-x-2) > :not(:last-child)) {
     --tw-space-x-reverse: 0;
     margin-left: calc((0.25rem * 2) * 0);
     margin-left: calc((var(--spacing) * 2) * var(--tw-space-x-reverse));
@@ -1526,15 +1554,59 @@
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .\[\&\>svg\]\:shrink-0) > svg {
   flex-shrink: 0;
 }
+:root:not(#\#):not(#\#) {
+  --xpa-background: 0 0% 100%;
+  --xpa-foreground: 222.2 84% 4.9%;
+  --xpa-card: 0 0% 100%;
+  --xpa-card-foreground: 222.2 84% 4.9%;
+  --xpa-popover: 0 0% 100%;
+  --xpa-popover-foreground: 222.2 84% 4.9%;
+  --xpa-primary: 198 100% 40%;
+  --xpa-primary-foreground: 0 0% 100%;
+  --xpa-secondary: 210 40% 96.1%;
+  --xpa-secondary-foreground: 222.2 47.4% 11.2%;
+  --xpa-muted: 210 40% 96.1%;
+  --xpa-muted-foreground: 215.4 16.3% 46.9%;
+  --xpa-accent: 210 40% 96.1%;
+  --xpa-accent-foreground: 222.2 47.4% 11.2%;
+  --xpa-destructive: 0 84.2% 60.2%;
+  --xpa-destructive-foreground: 0 0% 100%;
+  --xpa-border: 214.3 31.8% 91.4%;
+  --xpa-input: 214.3 31.8% 91.4%;
+  --xpa-ring: 198 100% 40%;
+  --xpa-radius: 0.5rem;
+}
+:root[data-theme="dark"]:not(#\#):not(#\#),
+  :root.dark:not(#\#):not(#\#) {
+  --xpa-background: 222.2 47.4% 11.2%;
+  --xpa-foreground: 210 40% 98%;
+  --xpa-card: 222.2 47.4% 11.2%;
+  --xpa-card-foreground: 210 40% 98%;
+  --xpa-popover: 222.2 47.4% 11.2%;
+  --xpa-popover-foreground: 210 40% 98%;
+  --xpa-primary: 198 100% 40%;
+  --xpa-primary-foreground: 210 40% 98%;
+  --xpa-secondary: 217.2 32.6% 17.5%;
+  --xpa-secondary-foreground: 210 40% 98%;
+  --xpa-muted: 217.2 32.6% 17.5%;
+  --xpa-muted-foreground: 215 20.2% 65.1%;
+  --xpa-accent: 217.2 32.6% 17.5%;
+  --xpa-accent-foreground: 210 40% 98%;
+  --xpa-destructive: 0 62.8% 30.6%;
+  --xpa-destructive-foreground: 210 40% 98%;
+  --xpa-border: 217.2 32.6% 17.5%;
+  --xpa-input: 217.2 32.6% 17.5%;
+  --xpa-ring: 198 100% 40%;
+}
 .signiphi-page-assembly:not(#\#):not(#\#) * {
-  border-color: #e2e8f0;
-  border-color: var(--color-border);
+  border-color: hsl(214, 32%, 91%);
+  border-color: hsl(var(--xpa-border));
 }
 .signiphi-page-assembly:not(#\#):not(#\#) body {
-  background-color: #ffffff;
-  background-color: var(--color-background);
-  color: #0f172a;
-  color: var(--color-foreground);
+  background-color: hsl(0, 0%, 100%);
+  background-color: hsl(var(--xpa-background));
+  color: hsl(222, 84%, 5%);
+  color: hsl(var(--xpa-foreground));
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#) .animate-spin {
   animation: spin 1s linear infinite;
@@ -1569,10 +1641,10 @@
   transition-duration: var(--tw-duration, var(--default-transition-duration));
 }
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .tab-button-active {
-  background-color: #0099cd;
-  background-color: var(--color-primary);
-  color: #ffffff;
-  color: var(--color-primary-foreground);
+  background-color: hsl(198, 100%, 40%);
+  background-color: hsl(var(--xpa-primary));
+  color: hsl(0, 0%, 100%);
+  color: hsl(var(--xpa-primary-foreground));
   --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgba(0, 0, 0, 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgba(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), 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(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);
@@ -1580,17 +1652,17 @@
 .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .tab-button-inactive {
   border-style: var(--tw-border-style);
   border-width: 1px;
-  border-color: rgb(209, 213, 220);
-  border-color: var(--color-gray-300);
-  background-color: #fff;
-  background-color: var(--color-white);
-  color: rgb(54, 65, 83);
-  color: var(--color-gray-700);
+  border-color: hsl(214, 32%, 91%);
+  border-color: hsl(var(--xpa-border));
+  background-color: hsl(0, 0%, 100%);
+  background-color: hsl(var(--xpa-card));
+  color: hsl(222, 84%, 5%);
+  color: hsl(var(--xpa-foreground));
 }
 @media (hover: hover) {
   .signiphi-page-assembly:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) :is(.signiphi-page-assembly .tab-button-inactive):hover {
-    background-color: rgb(249, 250, 251);
-    background-color: var(--color-gray-50);
+    background-color: hsl(210, 40%, 96%);
+    background-color: hsl(var(--xpa-muted));
   }
 }
 @property --tw-translate-x {
@@ -1785,4 +1857,4 @@
     --tw-duration: initial;
     --tw-space-x-reverse: 0;
   }
-}
+}