*, ::before, ::after {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}

::backdrop {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}/*
! tailwindcss v3.4.19 | MIT License | https://tailwindcss.com
*//*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
*/

*,
::before,
::after {
  box-sizing: border-box; /* 1 */
  border-width: 0; /* 2 */
  border-style: solid; /* 2 */
  border-color: #e5e7eb; /* 2 */
}

::before,
::after {
  --tw-content: '';
}

/*
1. Use a consistent sensible line-height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
3. Use a more readable tab size.
4. Use the user's configured `sans` font-family by default.
5. Use the user's configured `sans` font-feature-settings by default.
6. Use the user's configured `sans` font-variation-settings by default.
7. Disable tap highlights on iOS
*/

html,
:host {
  line-height: 1.5; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
  -moz-tab-size: 4; /* 3 */
  -o-tab-size: 4;
     tab-size: 4; /* 3 */
  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 4 */
  font-feature-settings: normal; /* 5 */
  font-variation-settings: normal; /* 6 */
  -webkit-tap-highlight-color: transparent; /* 7 */
}

/*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
*/

body {
  margin: 0; /* 1 */
  line-height: inherit; /* 2 */
}

/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Ensure horizontal rules are visible by default.
*/

hr {
  height: 0; /* 1 */
  color: inherit; /* 2 */
  border-top-width: 1px; /* 3 */
}

/*
Add the correct text decoration in Chrome, Edge, and Safari.
*/

abbr:where([title]) {
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
}

/*
Remove the default font size and weight for headings.
*/

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
}

/*
Reset links to optimize for opt-in styling instead of opt-out.
*/

a {
  color: inherit;
  text-decoration: inherit;
}

/*
Add the correct font weight in Edge and Safari.
*/

b,
strong {
  font-weight: bolder;
}

/*
1. Use the user's configured `mono` font-family by default.
2. Use the user's configured `mono` font-feature-settings by default.
3. Use the user's configured `mono` font-variation-settings by default.
4. Correct the odd `em` font sizing in all browsers.
*/

code,
kbd,
samp,
pre {
  font-family: var(--font-mono), monospace; /* 1 */
  font-feature-settings: normal; /* 2 */
  font-variation-settings: normal; /* 3 */
  font-size: 1em; /* 4 */
}

/*
Add the correct font size in all browsers.
*/

small {
  font-size: 80%;
}

/*
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/

table {
  text-indent: 0; /* 1 */
  border-color: inherit; /* 2 */
  border-collapse: collapse; /* 3 */
}

/*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-feature-settings: inherit; /* 1 */
  font-variation-settings: inherit; /* 1 */
  font-size: 100%; /* 1 */
  font-weight: inherit; /* 1 */
  line-height: inherit; /* 1 */
  letter-spacing: inherit; /* 1 */
  color: inherit; /* 1 */
  margin: 0; /* 2 */
  padding: 0; /* 3 */
}

/*
Remove the inheritance of text transform in Edge and Firefox.
*/

button,
select {
  text-transform: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/

button,
input:where([type='button']),
input:where([type='reset']),
input:where([type='submit']) {
  -webkit-appearance: button; /* 1 */
  background-color: transparent; /* 2 */
  background-image: none; /* 2 */
}

/*
Use the modern Firefox focus style for all focusable elements.
*/

:-moz-focusring {
  outline: auto;
}

/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/

:-moz-ui-invalid {
  box-shadow: none;
}

/*
Add the correct vertical alignment in Chrome and Firefox.
*/

progress {
  vertical-align: baseline;
}

/*
Correct the cursor style of increment and decrement buttons in Safari.
*/

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto;
}

/*
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/

[type='search'] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/*
Remove the inner padding in Chrome and Safari on macOS.
*/

::-webkit-search-decoration {
  -webkit-appearance: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to `inherit` in Safari.
*/

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/*
Add the correct display in Chrome and Safari.
*/

summary {
  display: list-item;
}

/*
Removes the default spacing and border for appropriate elements.
*/

blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
  margin: 0;
}

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

ol,
ul,
menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

/*
Reset default styling for dialogs.
*/
dialog {
  padding: 0;
}

/*
Prevent resizing textareas horizontally by default.
*/

textarea {
  resize: vertical;
}

/*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color.
*/

input::-moz-placeholder, textarea::-moz-placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}

input::placeholder,
textarea::placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}

/*
Set the default cursor for buttons.
*/

button,
[role="button"] {
  cursor: pointer;
}

/*
Make sure disabled buttons don't get the pointer cursor.
*/
:disabled {
  cursor: default;
}

/*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
   This can trigger a poorly considered lint error in some tools but is included by design.
*/

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  display: block; /* 1 */
  vertical-align: middle; /* 2 */
}

/*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/

img,
video {
  max-width: 100%;
  height: auto;
}

/* Make elements with the HTML hidden attribute stay hidden by default */
[hidden]:where(:not([hidden="until-found"])) {
  display: none;
}
  :root {
    --font-display: "Syne", "Space Grotesk", sans-serif;
    --font-body: "DM Sans", sans-serif;
    --font-mono: "IBM Plex Mono", monospace;
    --radius: 0.5rem;

    --bg-grid: linear-gradient(rgba(255,255,255,0.022) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255,255,255,0.022) 1px, transparent 1px);
    --bg-grid-size: 40px 40px;

    --background: 0.05 0.002 265;
    --foreground: 0.95 0.008 270;
    /* Antes 0.1 (casi negro, mucho más oscuro que el gunmetal real de la
       app) — CdpPage.tsx y otros consumidores de shadcn <Card bg-card/80>
       se veían "toda negra" comparados con el resto, que usa --color-bg-3
       inline. Subido para que quede a la altura del gunmetal (pedido
       founder 2026-08-04: "mint vusd page esta toda negra, masterizala"). */
    --card: 0.17 0.008 265;
    --card-foreground: 0.95 0.008 270;
    --popover: 0.17 0.008 265;
    --popover-foreground: 0.95 0.008 270;
    --primary: 0.62 0.24 185;
    --primary-foreground: 0.98 0 0;
    --secondary: 0.7 0.18 50;
    --secondary-foreground: 0.1 0.02 50;
    --muted: 0.18 0.02 265;
    --muted-foreground: 0.65 0.01 265;
    --accent: 0.65 0.18 177;
    --accent-foreground: 0.98 0 0;
    --destructive: 0.55 0.22 25;
    --destructive-foreground: 0.98 0 0;
    --border: 0.18 0.02 265;
    --input: 0.18 0.02 265;
    --ring: 0.62 0.24 185;
    --chart-1: 0.7 0.18 50;
    --chart-2: 0.62 0.24 185;
    --chart-3: 0.6 0.2 137;
    --chart-4: 0.65 0.18 137;
    --chart-5: 0.55 0.22 25;
    --sidebar: 0.08 0.01 265;
    --sidebar-foreground: 0.95 0.008 270;
    --sidebar-primary: 0.62 0.24 185;
    --sidebar-primary-foreground: 0.98 0 0;
    --sidebar-accent: 0.15 0.02 265;
    --sidebar-accent-foreground: 0.95 0.008 270;
    --sidebar-border: 0.18 0.02 265;
    --sidebar-ring: 0.62 0.24 185;
    --defi-bg: #050d1a;
    --defi-surface: #0a1628;
    --defi-cyan: #38bdf8;
    --defi-teal: #2dd4bf;
    --defi-white: #f0f9ff;
    --defi-slate: #94a3b8;
    --defi-border: rgba(56, 189, 248, 0.15);
    --clp-cobalt: #1d4ed8;
    --clp-blue: #3b82f6;
    --clp-crimson: #dc2626;
    --clp-rose: #f43f5e;

    /* DARK METEOR PLATINUM (default) — más oscuro que el gris meteoro
       anterior (pedido founder 2026-08-04: "debe verse algo mas oscuro"),
       mismo lenguaje "platinum" que el modo claro. El body real (línea
       ~285) le agrega el degradé metálico diagonal, mismo criterio que
       `.light body`. */
    /* FIX (reporte real founder: "no parece que oscureciste el fondo 50%"):
       el degradé oscurecido de `.dark body` (más abajo) nunca se veía —
       Layout.tsx pinta un wrapper OPACO encima con background:
       var(--color-bg), y esta variable seguía con el tono viejo sin
       oscurecer. El fix real es acá, no en el degradé de body. */
    --color-bg: #09090a;
    --color-bg-2: #0b0b0d;
    --color-bg-3: #0e0e10;
    --color-surface: rgba(255,255,255,0.065);
    --color-overlay: rgba(8,8,11,0.92);
    --color-border: rgba(255,255,255,0.07);
    --color-border-light: rgba(255,255,255,0.04);
    --color-border-med: rgba(255,255,255,0.12);
    --color-text-primary: #fafafa;
    --color-text: var(--color-text-primary);
    /* Texto de SatellitePage/KYC — el drawer lateral es siempre oscuro; la página
       /sat lo redefine inline según theme */
    --sat-text: #f0f0f5;
    --color-text-secondary: #9d9da5;
    --color-text-muted: #7d8494;
    --color-text-dim: #4a4a68;
    --color-amber: #facc15;
    --color-emerald: #34d399;
    --color-violet: #a78bfa;
    --color-blue: #60a5fa;
    --color-teal: #2a9d8f;
    --color-orange: #fb923c;
    --color-cyan: #38bdf8;
    /* Tono propio de OdlVaelixPage.tsx (#f59e0b), distinto de
       --color-amber (#facc15) — token dedicado para no drift dark mode en
       ningún lado que ya usa --color-amber. */
    --color-amber-warm: #f59e0b;
    --color-danger: #f87171;
    --color-warning: #fbbf24;
    --layer-0: #F7931A; --layer-0-dim: rgba(247,147,26,0.08);
    --layer-1: #627EEA; --layer-1-dim: rgba(98,126,234,0.08);
    --layer-2: #7B2FBE; --layer-2-dim: rgba(123,47,190,0.08);
    --layer-3: #FF6B35; --layer-3-dim: rgba(255,107,53,0.08);
    --layer-4: #375BD2; --layer-4-dim: rgba(55,91,210,0.10);
    --layer-5: #36A18B; --layer-5-dim: rgba(54,161,139,0.08);
    --layer-6: #9945FF; --layer-6-dim: rgba(153,69,255,0.08);

    /* PLATINUM BUTTON — brillo metálico negro profundo en dark mode (pedido
       founder 2026-08-04: el botón platinum de Vaults ya no debe reusar el
       mismo gradiente plateado claro que en light mode). lib/platinumButton.ts
       consume estas vars, así que cualquier botón que ya las use hereda el
       look dark-metal automáticamente sin tocar cada call site. */
    --platinum-bg: linear-gradient(155deg, #2c2c30 0%, #131315 35%, #232327 55%, #0a0a0c 80%, #1e1e21 100%);
    --platinum-text: #f2f2f0;
    --platinum-shadow: 0 6px 20px rgba(0,0,0,0.55), inset 0 1px 0 rgba(255,255,255,0.14), inset 0 -1px 0 rgba(0,0,0,0.45);
    --platinum-border: 1px solid rgba(255,255,255,0.14);
  }

  * {
  border-color: oklch(var(--border));
}
  /* El zoom global real vive más abajo en este archivo (regla `html { zoom }`
     fuera de @layer, cerca de línea 1300) — CUALQUIER regla acá adentro de
     @layer base pierde contra esa por las reglas de cascada de Tailwind,
     aunque tenga más especificidad aparente. Había dos reglas `zoom`
     duplicadas y en conflicto (bug encontrado 2026-08-02): esta de acá nunca
     tuvo efecto real pese al historial de comentarios de ajuste 1.2→1.09.
     Consolidado en una sola — ver esa regla para el valor y el historial. */

  /* Accesibilidad: foco visible por teclado en toda la app (los estilos inline
     no definen outline; sin esto la navegación con Tab es invisible). */
  a:focus-visible,
  button:focus-visible,
  input:focus-visible,
  select:focus-visible,
  textarea:focus-visible,
  [role="tab"]:focus-visible,
  [role="menuitem"]:focus-visible {
    outline: 2px solid var(--color-amber);
    outline-offset: 2px;
    border-radius: 6px;
  }
  body {
  background-color: oklch(var(--background));
  font-family: var(--font-body), sans-serif;
  color: oklch(var(--foreground));
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}
.pointer-events-none {
  pointer-events: none;
}
.visible {
  visibility: visible;
}
.invisible {
  visibility: hidden;
}
.collapse {
  visibility: collapse;
}
.static {
  position: static;
}
.fixed {
  position: fixed;
}
.absolute {
  position: absolute;
}
.relative {
  position: relative;
}
.sticky {
  position: sticky;
}
.inset-0 {
  inset: 0px;
}
.inset-x-0 {
  left: 0px;
  right: 0px;
}
.inset-y-0 {
  top: 0px;
  bottom: 0px;
}
.-bottom-12 {
  bottom: -3rem;
}
.-left-12 {
  left: -3rem;
}
.-left-6 {
  left: -1.5rem;
}
.-right-12 {
  right: -3rem;
}
.-top-12 {
  top: -3rem;
}
.-top-6 {
  top: -1.5rem;
}
.bottom-0 {
  bottom: 0px;
}
.left-0 {
  left: 0px;
}
.left-1\/2 {
  left: 50%;
}
.left-2 {
  left: 0.5rem;
}
.left-\[50\%\] {
  left: 50%;
}
.right-0 {
  right: 0px;
}
.right-1 {
  right: 0.25rem;
}
.right-2 {
  right: 0.5rem;
}
.right-3 {
  right: 0.75rem;
}
.right-4 {
  right: 1rem;
}
.top-0 {
  top: 0px;
}
.top-1\.5 {
  top: 0.375rem;
}
.top-1\/2 {
  top: 50%;
}
.top-3\.5 {
  top: 0.875rem;
}
.top-4 {
  top: 1rem;
}
.top-8 {
  top: 2rem;
}
.top-\[1px\] {
  top: 1px;
}
.top-\[50\%\] {
  top: 50%;
}
.top-\[60\%\] {
  top: 60%;
}
.top-full {
  top: 100%;
}
.isolate {
  isolation: isolate;
}
.z-0 {
  z-index: 0;
}
.z-10 {
  z-index: 10;
}
.z-20 {
  z-index: 20;
}
.z-30 {
  z-index: 30;
}
.z-40 {
  z-index: 40;
}
.z-50 {
  z-index: 50;
}
.z-\[1\] {
  z-index: 1;
}
.col-span-3 {
  grid-column: span 3 / span 3;
}
.col-start-2 {
  grid-column-start: 2;
}
.row-span-2 {
  grid-row: span 2 / span 2;
}
.row-start-1 {
  grid-row-start: 1;
}
.-mx-1 {
  margin-left: -0.25rem;
  margin-right: -0.25rem;
}
.mx-2 {
  margin-left: 0.5rem;
  margin-right: 0.5rem;
}
.mx-3 {
  margin-left: 0.75rem;
  margin-right: 0.75rem;
}
.mx-3\.5 {
  margin-left: 0.875rem;
  margin-right: 0.875rem;
}
.mx-6 {
  margin-left: 1.5rem;
  margin-right: 1.5rem;
}
.mx-auto {
  margin-left: auto;
  margin-right: auto;
}
.my-0\.5 {
  margin-top: 0.125rem;
  margin-bottom: 0.125rem;
}
.my-1 {
  margin-top: 0.25rem;
  margin-bottom: 0.25rem;
}
.my-4 {
  margin-top: 1rem;
  margin-bottom: 1rem;
}
.-ml-4 {
  margin-left: -1rem;
}
.-mt-4 {
  margin-top: -1rem;
}
.mb-0\.5 {
  margin-bottom: 0.125rem;
}
.mb-1 {
  margin-bottom: 0.25rem;
}
.mb-1\.5 {
  margin-bottom: 0.375rem;
}
.mb-12 {
  margin-bottom: 3rem;
}
.mb-2 {
  margin-bottom: 0.5rem;
}
.mb-3 {
  margin-bottom: 0.75rem;
}
.mb-4 {
  margin-bottom: 1rem;
}
.mb-5 {
  margin-bottom: 1.25rem;
}
.mb-6 {
  margin-bottom: 1.5rem;
}
.mb-8 {
  margin-bottom: 2rem;
}
.ml-1 {
  margin-left: 0.25rem;
}
.ml-2 {
  margin-left: 0.5rem;
}
.ml-auto {
  margin-left: auto;
}
.mr-1 {
  margin-right: 0.25rem;
}
.mr-1\.5 {
  margin-right: 0.375rem;
}
.mr-2 {
  margin-right: 0.5rem;
}
.mt-0\.5 {
  margin-top: 0.125rem;
}
.mt-1 {
  margin-top: 0.25rem;
}
.mt-1\.5 {
  margin-top: 0.375rem;
}
.mt-2 {
  margin-top: 0.5rem;
}
.mt-3 {
  margin-top: 0.75rem;
}
.mt-4 {
  margin-top: 1rem;
}
.mt-6 {
  margin-top: 1.5rem;
}
.mt-8 {
  margin-top: 2rem;
}
.mt-auto {
  margin-top: auto;
}
.line-clamp-1 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}
.block {
  display: block;
}
.inline-block {
  display: inline-block;
}
.inline {
  display: inline;
}
.flex {
  display: flex;
}
.inline-flex {
  display: inline-flex;
}
.table {
  display: table;
}
.table-caption {
  display: table-caption;
}
.table-cell {
  display: table-cell;
}
.table-row {
  display: table-row;
}
.grid {
  display: grid;
}
.hidden {
  display: none;
}
.aspect-square {
  aspect-ratio: 1 / 1;
}
.aspect-video {
  aspect-ratio: 16 / 9;
}
.size-2 {
  width: 0.5rem;
  height: 0.5rem;
}
.size-2\.5 {
  width: 0.625rem;
  height: 0.625rem;
}
.size-3 {
  width: 0.75rem;
  height: 0.75rem;
}
.size-3\.5 {
  width: 0.875rem;
  height: 0.875rem;
}
.size-4 {
  width: 1rem;
  height: 1rem;
}
.size-7 {
  width: 1.75rem;
  height: 1.75rem;
}
.size-8 {
  width: 2rem;
  height: 2rem;
}
.size-9 {
  width: 2.25rem;
  height: 2.25rem;
}
.size-auto {
  width: auto;
  height: auto;
}
.size-full {
  width: 100%;
  height: 100%;
}
.h-1\.5 {
  height: 0.375rem;
}
.h-10 {
  height: 2.5rem;
}
.h-12 {
  height: 3rem;
}
.h-16 {
  height: 4rem;
}
.h-2 {
  height: 0.5rem;
}
.h-2\.5 {
  height: 0.625rem;
}
.h-3 {
  height: 0.75rem;
}
.h-3\.5 {
  height: 0.875rem;
}
.h-32 {
  height: 8rem;
}
.h-4 {
  height: 1rem;
}
.h-48 {
  height: 12rem;
}
.h-5 {
  height: 1.25rem;
}
.h-6 {
  height: 1.5rem;
}
.h-7 {
  height: 1.75rem;
}
.h-8 {
  height: 2rem;
}
.h-9 {
  height: 2.25rem;
}
.h-\[1\.15rem\] {
  height: 1.15rem;
}
.h-\[18px\] {
  height: 18px;
}
.h-\[calc\(100\%-1px\)\] {
  height: calc(100% - 1px);
}
.h-\[var\(--radix-navigation-menu-viewport-height\)\] {
  height: var(--radix-navigation-menu-viewport-height);
}
.h-\[var\(--radix-select-trigger-height\)\] {
  height: var(--radix-select-trigger-height);
}
.h-auto {
  height: auto;
}
.h-fit {
  height: -moz-fit-content;
  height: fit-content;
}
.h-full {
  height: 100%;
}
.h-px {
  height: 1px;
}
.h-svh {
  height: 100svh;
}
.max-h-48 {
  max-height: 12rem;
}
.max-h-\[300px\] {
  max-height: 300px;
}
.max-h-\[55vh\] {
  max-height: 55vh;
}
.min-h-0 {
  min-height: 0px;
}
.min-h-16 {
  min-height: 4rem;
}
.min-h-4 {
  min-height: 1rem;
}
.min-h-\[60vh\] {
  min-height: 60vh;
}
.min-h-screen {
  min-height: 100vh;
}
.min-h-svh {
  min-height: 100svh;
}
.w-0 {
  width: 0px;
}
.w-1 {
  width: 0.25rem;
}
.w-1\.5 {
  width: 0.375rem;
}
.w-10 {
  width: 2.5rem;
}
.w-2 {
  width: 0.5rem;
}
.w-2\.5 {
  width: 0.625rem;
}
.w-20 {
  width: 5rem;
}
.w-24 {
  width: 6rem;
}
.w-3 {
  width: 0.75rem;
}
.w-3\.5 {
  width: 0.875rem;
}
.w-3\/4 {
  width: 75%;
}
.w-32 {
  width: 8rem;
}
.w-4 {
  width: 1rem;
}
.w-40 {
  width: 10rem;
}
.w-44 {
  width: 11rem;
}
.w-5 {
  width: 1.25rem;
}
.w-6 {
  width: 1.5rem;
}
.w-64 {
  width: 16rem;
}
.w-7 {
  width: 1.75rem;
}
.w-72 {
  width: 18rem;
}
.w-8 {
  width: 2rem;
}
.w-9 {
  width: 2.25rem;
}
.w-\[100px\] {
  width: 100px;
}
.w-auto {
  width: auto;
}
.w-fit {
  width: -moz-fit-content;
  width: fit-content;
}
.w-full {
  width: 100%;
}
.w-max {
  width: -moz-max-content;
  width: max-content;
}
.w-px {
  width: 1px;
}
.min-w-0 {
  min-width: 0px;
}
.min-w-10 {
  min-width: 2.5rem;
}
.min-w-5 {
  min-width: 1.25rem;
}
.min-w-8 {
  min-width: 2rem;
}
.min-w-9 {
  min-width: 2.25rem;
}
.min-w-\[12rem\] {
  min-width: 12rem;
}
.min-w-\[18px\] {
  min-width: 18px;
}
.min-w-\[8rem\] {
  min-width: 8rem;
}
.min-w-\[var\(--radix-select-trigger-width\)\] {
  min-width: var(--radix-select-trigger-width);
}
.max-w-5xl {
  max-width: 64rem;
}
.max-w-7xl {
  max-width: 80rem;
}
.max-w-\[calc\(100\%-2rem\)\] {
  max-width: calc(100% - 2rem);
}
.max-w-max {
  max-width: -moz-max-content;
  max-width: max-content;
}
.max-w-sm {
  max-width: 24rem;
}
.max-w-xl {
  max-width: 36rem;
}
.flex-1 {
  flex: 1 1 0%;
}
.flex-shrink {
  flex-shrink: 1;
}
.flex-shrink-0 {
  flex-shrink: 0;
}
.shrink-0 {
  flex-shrink: 0;
}
.grow {
  flex-grow: 1;
}
.grow-0 {
  flex-grow: 0;
}
.basis-full {
  flex-basis: 100%;
}
.caption-bottom {
  caption-side: bottom;
}
.border-collapse {
  border-collapse: collapse;
}
.-translate-x-1\/2 {
  --tw-translate-x: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.-translate-x-px {
  --tw-translate-x: -1px;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.-translate-y-1\/2 {
  --tw-translate-y: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-x-\[-50\%\] {
  --tw-translate-x: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-x-px {
  --tw-translate-x: 1px;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-y-0\.5 {
  --tw-translate-y: 0.125rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-y-\[-50\%\] {
  --tw-translate-y: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-y-\[calc\(-50\%_-_2px\)\] {
  --tw-translate-y: calc(-50% - 2px);
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.rotate-45 {
  --tw-rotate: 45deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.rotate-90 {
  --tw-rotate: 90deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.transform {
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
@keyframes pulse {

  50% {
    opacity: .5;
  }
}
.animate-pulse {
  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}
@keyframes spin {

  to {
    transform: rotate(360deg);
  }
}
.animate-spin {
  animation: spin 1s linear infinite;
}
.cursor-default {
  cursor: default;
}
.cursor-help {
  cursor: help;
}
.cursor-not-allowed {
  cursor: not-allowed;
}
.cursor-pointer {
  cursor: pointer;
}
.touch-none {
  touch-action: none;
}
.select-none {
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.resize {
  resize: both;
}
.scroll-my-1 {
  scroll-margin-top: 0.25rem;
  scroll-margin-bottom: 0.25rem;
}
.scroll-mt-8 {
  scroll-margin-top: 2rem;
}
.scroll-py-1 {
  scroll-padding-top: 0.25rem;
  scroll-padding-bottom: 0.25rem;
}
.list-none {
  list-style-type: none;
}
.auto-rows-min {
  grid-auto-rows: min-content;
}
.grid-cols-1 {
  grid-template-columns: repeat(1, minmax(0, 1fr));
}
.grid-cols-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.grid-cols-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.grid-cols-4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.grid-cols-\[0_1fr\] {
  grid-template-columns: 0 1fr;
}
.grid-rows-\[auto_auto\] {
  grid-template-rows: auto auto;
}
.flex-row {
  flex-direction: row;
}
.flex-col {
  flex-direction: column;
}
.flex-col-reverse {
  flex-direction: column-reverse;
}
.flex-wrap {
  flex-wrap: wrap;
}
.items-start {
  align-items: flex-start;
}
.items-end {
  align-items: flex-end;
}
.items-center {
  align-items: center;
}
.items-stretch {
  align-items: stretch;
}
.justify-center {
  justify-content: center;
}
.justify-between {
  justify-content: space-between;
}
.justify-items-start {
  justify-items: start;
}
.gap-0\.5 {
  gap: 0.125rem;
}
.gap-1 {
  gap: 0.25rem;
}
.gap-1\.5 {
  gap: 0.375rem;
}
.gap-16 {
  gap: 4rem;
}
.gap-2 {
  gap: 0.5rem;
}
.gap-3 {
  gap: 0.75rem;
}
.gap-4 {
  gap: 1rem;
}
.gap-6 {
  gap: 1.5rem;
}
.gap-y-0\.5 {
  row-gap: 0.125rem;
}
.space-y-1 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.25rem * var(--tw-space-y-reverse));
}
.space-y-2 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
}
.space-y-3 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));
}
.space-y-4 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(1rem * var(--tw-space-y-reverse));
}
.space-y-5 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(1.25rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(1.25rem * var(--tw-space-y-reverse));
}
.space-y-6 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(1.5rem * var(--tw-space-y-reverse));
}
.divide-x > :not([hidden]) ~ :not([hidden]) {
  --tw-divide-x-reverse: 0;
  border-right-width: calc(1px * var(--tw-divide-x-reverse));
  border-left-width: calc(1px * calc(1 - var(--tw-divide-x-reverse)));
}
.self-start {
  align-self: flex-start;
}
.justify-self-end {
  justify-self: end;
}
.overflow-auto {
  overflow: auto;
}
.overflow-hidden {
  overflow: hidden;
}
.overflow-x-auto {
  overflow-x: auto;
}
.overflow-y-auto {
  overflow-y: auto;
}
.overflow-x-hidden {
  overflow-x: hidden;
}
.truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.whitespace-nowrap {
  white-space: nowrap;
}
.text-balance {
  text-wrap: balance;
}
.break-words {
  overflow-wrap: break-word;
}
.break-all {
  word-break: break-all;
}
.rounded {
  border-radius: 0.25rem;
}
.rounded-2xl {
  border-radius: 1rem;
}
.rounded-\[2px\] {
  border-radius: 2px;
}
.rounded-\[4px\] {
  border-radius: 4px;
}
.rounded-\[inherit\] {
  border-radius: inherit;
}
.rounded-full {
  border-radius: 9999px;
}
.rounded-lg {
  border-radius: var(--radius);
}
.rounded-md {
  border-radius: calc(var(--radius) - 2px);
}
.rounded-none {
  border-radius: 0px;
}
.rounded-sm {
  border-radius: calc(var(--radius) - 4px);
}
.rounded-xl {
  border-radius: 0.75rem;
}
.rounded-l-md {
  border-top-left-radius: calc(var(--radius) - 2px);
  border-bottom-left-radius: calc(var(--radius) - 2px);
}
.rounded-r-md {
  border-top-right-radius: calc(var(--radius) - 2px);
  border-bottom-right-radius: calc(var(--radius) - 2px);
}
.rounded-tl-sm {
  border-top-left-radius: calc(var(--radius) - 4px);
}
.border {
  border-width: 1px;
}
.border-0 {
  border-width: 0px;
}
.border-2 {
  border-width: 2px;
}
.border-\[1\.5px\] {
  border-width: 1.5px;
}
.border-y {
  border-top-width: 1px;
  border-bottom-width: 1px;
}
.border-b {
  border-bottom-width: 1px;
}
.border-l {
  border-left-width: 1px;
}
.border-r {
  border-right-width: 1px;
}
.border-t {
  border-top-width: 1px;
}
.border-dashed {
  border-style: dashed;
}
.border-amber-500\/30 {
  border-color: rgb(245 158 11 / 0.3);
}
.border-amber-500\/40 {
  border-color: rgb(245 158 11 / 0.4);
}
.border-blue-500\/20 {
  border-color: rgb(59 130 246 / 0.2);
}
.border-blue-500\/30 {
  border-color: rgb(59 130 246 / 0.3);
}
.border-destructive\/30 {
  border-color: oklch(var(--destructive) / 0.3);
}
.border-emerald-500\/30 {
  border-color: rgb(16 185 129 / 0.3);
}
.border-emerald-500\/40 {
  border-color: rgb(16 185 129 / 0.4);
}
.border-input {
  border-color: oklch(var(--input));
}
.border-pink-500\/20 {
  border-color: rgb(236 72 153 / 0.2);
}
.border-primary {
  --tw-border-opacity: 1;
  border-color: oklch(var(--primary) / var(--tw-border-opacity, 1));
}
.border-primary\/30 {
  border-color: oklch(var(--primary) / 0.3);
}
.border-purple-500\/20 {
  border-color: rgb(168 85 247 / 0.2);
}
.border-purple-500\/30 {
  border-color: rgb(168 85 247 / 0.3);
}
.border-red-500\/20 {
  border-color: rgb(239 68 68 / 0.2);
}
.border-red-500\/30 {
  border-color: rgb(239 68 68 / 0.3);
}
.border-red-500\/40 {
  border-color: rgb(239 68 68 / 0.4);
}
.border-sidebar-border {
  border-color: oklch(var(--sidebar-border));
}
.border-sky-500\/30 {
  border-color: rgb(14 165 233 / 0.3);
}
.border-transparent {
  border-color: transparent;
}
.border-violet-500\/20 {
  border-color: rgb(139 92 246 / 0.2);
}
.border-violet-500\/30 {
  border-color: rgb(139 92 246 / 0.3);
}
.border-white {
  --tw-border-opacity: 1;
  border-color: rgb(255 255 255 / var(--tw-border-opacity, 1));
}
.border-white\/10 {
  border-color: rgb(255 255 255 / 0.1);
}
.border-white\/20 {
  border-color: rgb(255 255 255 / 0.2);
}
.border-l-transparent {
  border-left-color: transparent;
}
.border-t-transparent {
  border-top-color: transparent;
}
.border-t-violet-400 {
  --tw-border-opacity: 1;
  border-top-color: rgb(167 139 250 / var(--tw-border-opacity, 1));
}
.bg-\[rgba\(10\2c 10\2c 30\2c 0\.75\)\] {
  background-color: rgba(10,10,30,0.75);
}
.bg-\[rgba\(10\2c 10\2c 30\2c 0\.85\)\] {
  background-color: rgba(10,10,30,0.85);
}
.bg-\[rgba\(10\2c 10\2c 30\2c 0\.95\)\] {
  background-color: rgba(10,10,30,0.95);
}
.bg-accent {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--accent) / var(--tw-bg-opacity, 1));
}
.bg-amber-500 {
  --tw-bg-opacity: 1;
  background-color: rgb(245 158 11 / var(--tw-bg-opacity, 1));
}
.bg-amber-500\/10 {
  background-color: rgb(245 158 11 / 0.1);
}
.bg-background {
  background-color: oklch(var(--background));
}
.bg-black {
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1));
}
.bg-black\/50 {
  background-color: rgb(0 0 0 / 0.5);
}
.bg-black\/60 {
  background-color: rgb(0 0 0 / 0.6);
}
.bg-blue-500\/10 {
  background-color: rgb(59 130 246 / 0.1);
}
.bg-blue-500\/20 {
  background-color: rgb(59 130 246 / 0.2);
}
.bg-border {
  background-color: oklch(var(--border));
}
.bg-card {
  background-color: oklch(var(--card));
}
.bg-destructive {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--destructive) / var(--tw-bg-opacity, 1));
}
.bg-emerald-500 {
  --tw-bg-opacity: 1;
  background-color: rgb(16 185 129 / var(--tw-bg-opacity, 1));
}
.bg-emerald-500\/10 {
  background-color: rgb(16 185 129 / 0.1);
}
.bg-emerald-500\/20 {
  background-color: rgb(16 185 129 / 0.2);
}
.bg-emerald-500\/5 {
  background-color: rgb(16 185 129 / 0.05);
}
.bg-foreground {
  background-color: oklch(var(--foreground));
}
.bg-green-400 {
  --tw-bg-opacity: 1;
  background-color: rgb(74 222 128 / var(--tw-bg-opacity, 1));
}
.bg-muted {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--muted) / var(--tw-bg-opacity, 1));
}
.bg-muted\/20 {
  background-color: oklch(var(--muted) / 0.2);
}
.bg-muted\/30 {
  background-color: oklch(var(--muted) / 0.3);
}
.bg-muted\/50 {
  background-color: oklch(var(--muted) / 0.5);
}
.bg-muted\/60 {
  background-color: oklch(var(--muted) / 0.6);
}
.bg-pink-500\/10 {
  background-color: rgb(236 72 153 / 0.1);
}
.bg-popover {
  background-color: oklch(var(--popover));
}
.bg-primary {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--primary) / var(--tw-bg-opacity, 1));
}
.bg-primary\/10 {
  background-color: oklch(var(--primary) / 0.1);
}
.bg-primary\/15 {
  background-color: oklch(var(--primary) / 0.15);
}
.bg-primary\/20 {
  background-color: oklch(var(--primary) / 0.2);
}
.bg-purple-500\/10 {
  background-color: rgb(168 85 247 / 0.1);
}
.bg-purple-500\/20 {
  background-color: rgb(168 85 247 / 0.2);
}
.bg-red-500 {
  --tw-bg-opacity: 1;
  background-color: rgb(239 68 68 / var(--tw-bg-opacity, 1));
}
.bg-red-500\/10 {
  background-color: rgb(239 68 68 / 0.1);
}
.bg-red-500\/5 {
  background-color: rgb(239 68 68 / 0.05);
}
.bg-secondary {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--secondary) / var(--tw-bg-opacity, 1));
}
.bg-sidebar {
  background-color: oklch(var(--sidebar));
}
.bg-sidebar-border {
  background-color: oklch(var(--sidebar-border));
}
.bg-sky-500\/10 {
  background-color: rgb(14 165 233 / 0.1);
}
.bg-transparent {
  background-color: transparent;
}
.bg-violet-500\/10 {
  background-color: rgb(139 92 246 / 0.1);
}
.bg-violet-500\/20 {
  background-color: rgb(139 92 246 / 0.2);
}
.bg-violet-500\/30 {
  background-color: rgb(139 92 246 / 0.3);
}
.bg-white {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}
.bg-white\/10 {
  background-color: rgb(255 255 255 / 0.1);
}
.bg-white\/5 {
  background-color: rgb(255 255 255 / 0.05);
}
.fill-current {
  fill: currentColor;
}
.fill-primary {
  fill: oklch(var(--primary) / 1);
}
.object-contain {
  -o-object-fit: contain;
     object-fit: contain;
}
.p-0 {
  padding: 0px;
}
.p-1 {
  padding: 0.25rem;
}
.p-1\.5 {
  padding: 0.375rem;
}
.p-2 {
  padding: 0.5rem;
}
.p-2\.5 {
  padding: 0.625rem;
}
.p-3 {
  padding: 0.75rem;
}
.p-4 {
  padding: 1rem;
}
.p-5 {
  padding: 1.25rem;
}
.p-6 {
  padding: 1.5rem;
}
.p-\[3px\] {
  padding: 3px;
}
.p-px {
  padding: 1px;
}
.px-1 {
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}
.px-1\.5 {
  padding-left: 0.375rem;
  padding-right: 0.375rem;
}
.px-2 {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}
.px-2\.5 {
  padding-left: 0.625rem;
  padding-right: 0.625rem;
}
.px-3 {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}
.px-3\.5 {
  padding-left: 0.875rem;
  padding-right: 0.875rem;
}
.px-4 {
  padding-left: 1rem;
  padding-right: 1rem;
}
.px-5 {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}
.px-6 {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}
.py-0\.5 {
  padding-top: 0.125rem;
  padding-bottom: 0.125rem;
}
.py-1 {
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}
.py-1\.5 {
  padding-top: 0.375rem;
  padding-bottom: 0.375rem;
}
.py-10 {
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
}
.py-12 {
  padding-top: 3rem;
  padding-bottom: 3rem;
}
.py-16 {
  padding-top: 4rem;
  padding-bottom: 4rem;
}
.py-2 {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
.py-2\.5 {
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
}
.py-3 {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}
.py-4 {
  padding-top: 1rem;
  padding-bottom: 1rem;
}
.py-6 {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}
.py-8 {
  padding-top: 2rem;
  padding-bottom: 2rem;
}
.pb-1 {
  padding-bottom: 0.25rem;
}
.pb-1\.5 {
  padding-bottom: 0.375rem;
}
.pb-2 {
  padding-bottom: 0.5rem;
}
.pb-20 {
  padding-bottom: 5rem;
}
.pb-3 {
  padding-bottom: 0.75rem;
}
.pb-4 {
  padding-bottom: 1rem;
}
.pb-6 {
  padding-bottom: 1.5rem;
}
.pl-2 {
  padding-left: 0.5rem;
}
.pl-4 {
  padding-left: 1rem;
}
.pl-8 {
  padding-left: 2rem;
}
.pr-1 {
  padding-right: 0.25rem;
}
.pr-2 {
  padding-right: 0.5rem;
}
.pr-2\.5 {
  padding-right: 0.625rem;
}
.pr-3 {
  padding-right: 0.75rem;
}
.pr-8 {
  padding-right: 2rem;
}
.pt-0 {
  padding-top: 0px;
}
.pt-2 {
  padding-top: 0.5rem;
}
.pt-3 {
  padding-top: 0.75rem;
}
.pt-4 {
  padding-top: 1rem;
}
.pt-5 {
  padding-top: 1.25rem;
}
.pt-6 {
  padding-top: 1.5rem;
}
.text-left {
  text-align: left;
}
.text-center {
  text-align: center;
}
.text-right {
  text-align: right;
}
.align-middle {
  vertical-align: middle;
}
.font-body {
  font-family: var(--font-body), sans-serif;
}
.font-display {
  font-family: var(--font-display), serif;
}
.font-mono {
  font-family: var(--font-mono), monospace;
}
.font-sans {
  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}
.text-2xl {
  font-size: 1.5rem;
  line-height: 2rem;
}
.text-3xl {
  font-size: 1.875rem;
  line-height: 2.25rem;
}
.text-\[0\.8rem\] {
  font-size: 0.8rem;
}
.text-\[10px\] {
  font-size: 10px;
}
.text-\[11px\] {
  font-size: 11px;
}
.text-\[13px\] {
  font-size: 13px;
}
.text-base {
  font-size: 1rem;
  line-height: 1.5rem;
}
.text-lg {
  font-size: 1.125rem;
  line-height: 1.75rem;
}
.text-sm {
  font-size: 0.875rem;
  line-height: 1.25rem;
}
.text-xl {
  font-size: 1.25rem;
  line-height: 1.75rem;
}
.text-xs {
  font-size: 0.75rem;
  line-height: 1rem;
}
.font-black {
  font-weight: 900;
}
.font-bold {
  font-weight: 700;
}
.font-medium {
  font-weight: 500;
}
.font-normal {
  font-weight: 400;
}
.font-semibold {
  font-weight: 600;
}
.uppercase {
  text-transform: uppercase;
}
.lowercase {
  text-transform: lowercase;
}
.normal-case {
  text-transform: none;
}
.italic {
  font-style: italic;
}
.tabular-nums {
  --tw-numeric-spacing: tabular-nums;
  font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction);
}
.leading-none {
  line-height: 1;
}
.leading-relaxed {
  line-height: 1.625;
}
.leading-snug {
  line-height: 1.375;
}
.leading-tight {
  line-height: 1.25;
}
.tracking-normal {
  letter-spacing: 0em;
}
.tracking-tight {
  letter-spacing: -0.025em;
}
.tracking-wide {
  letter-spacing: 0.025em;
}
.tracking-wider {
  letter-spacing: 0.05em;
}
.tracking-widest {
  letter-spacing: 0.1em;
}
.text-accent-foreground {
  color: oklch(var(--accent-foreground));
}
.text-amber-300 {
  --tw-text-opacity: 1;
  color: rgb(252 211 77 / var(--tw-text-opacity, 1));
}
.text-amber-300\/80 {
  color: rgb(252 211 77 / 0.8);
}
.text-amber-300\/90 {
  color: rgb(252 211 77 / 0.9);
}
.text-amber-400 {
  --tw-text-opacity: 1;
  color: rgb(251 191 36 / var(--tw-text-opacity, 1));
}
.text-amber-400\/70 {
  color: rgb(251 191 36 / 0.7);
}
.text-amber-400\/80 {
  color: rgb(251 191 36 / 0.8);
}
.text-amber-400\/90 {
  color: rgb(251 191 36 / 0.9);
}
.text-blue-300 {
  --tw-text-opacity: 1;
  color: rgb(147 197 253 / var(--tw-text-opacity, 1));
}
.text-blue-400 {
  --tw-text-opacity: 1;
  color: rgb(96 165 250 / var(--tw-text-opacity, 1));
}
.text-card-foreground {
  color: oklch(var(--card-foreground));
}
.text-current {
  color: currentColor;
}
.text-cyan-300 {
  --tw-text-opacity: 1;
  color: rgb(103 232 249 / var(--tw-text-opacity, 1));
}
.text-cyan-300\/70 {
  color: rgb(103 232 249 / 0.7);
}
.text-cyan-300\/90 {
  color: rgb(103 232 249 / 0.9);
}
.text-cyan-400 {
  --tw-text-opacity: 1;
  color: rgb(34 211 238 / var(--tw-text-opacity, 1));
}
.text-cyan-400\/80 {
  color: rgb(34 211 238 / 0.8);
}
.text-destructive {
  --tw-text-opacity: 1;
  color: oklch(var(--destructive) / var(--tw-text-opacity, 1));
}
.text-destructive-foreground {
  color: oklch(var(--destructive-foreground));
}
.text-destructive\/80 {
  color: oklch(var(--destructive) / 0.8);
}
.text-emerald-300 {
  --tw-text-opacity: 1;
  color: rgb(110 231 183 / var(--tw-text-opacity, 1));
}
.text-emerald-400 {
  --tw-text-opacity: 1;
  color: rgb(52 211 153 / var(--tw-text-opacity, 1));
}
.text-foreground {
  color: oklch(var(--foreground));
}
.text-green-400 {
  --tw-text-opacity: 1;
  color: rgb(74 222 128 / var(--tw-text-opacity, 1));
}
.text-green-400\/60 {
  color: rgb(74 222 128 / 0.6);
}
.text-indigo-400 {
  --tw-text-opacity: 1;
  color: rgb(129 140 248 / var(--tw-text-opacity, 1));
}
.text-muted-foreground {
  --tw-text-opacity: 1;
  color: oklch(var(--muted-foreground) / var(--tw-text-opacity, 1));
}
.text-popover-foreground {
  color: oklch(var(--popover-foreground));
}
.text-primary {
  --tw-text-opacity: 1;
  color: oklch(var(--primary) / var(--tw-text-opacity, 1));
}
.text-primary-foreground {
  color: oklch(var(--primary-foreground));
}
.text-purple-300 {
  --tw-text-opacity: 1;
  color: rgb(216 180 254 / var(--tw-text-opacity, 1));
}
.text-purple-300\/70 {
  color: rgb(216 180 254 / 0.7);
}
.text-purple-400 {
  --tw-text-opacity: 1;
  color: rgb(192 132 252 / var(--tw-text-opacity, 1));
}
.text-red-300 {
  --tw-text-opacity: 1;
  color: rgb(252 165 165 / var(--tw-text-opacity, 1));
}
.text-red-400 {
  --tw-text-opacity: 1;
  color: rgb(248 113 113 / var(--tw-text-opacity, 1));
}
.text-red-400\/80 {
  color: rgb(248 113 113 / 0.8);
}
.text-secondary-foreground {
  color: oklch(var(--secondary-foreground));
}
.text-sidebar-foreground {
  color: oklch(var(--sidebar-foreground));
}
.text-sky-300 {
  --tw-text-opacity: 1;
  color: rgb(125 211 252 / var(--tw-text-opacity, 1));
}
.text-violet-300 {
  --tw-text-opacity: 1;
  color: rgb(196 181 253 / var(--tw-text-opacity, 1));
}
.text-violet-300\/70 {
  color: rgb(196 181 253 / 0.7);
}
.text-white {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.text-white\/20 {
  color: rgb(255 255 255 / 0.2);
}
.text-white\/30 {
  color: rgb(255 255 255 / 0.3);
}
.text-white\/35 {
  color: rgb(255 255 255 / 0.35);
}
.text-white\/40 {
  color: rgb(255 255 255 / 0.4);
}
.text-white\/50 {
  color: rgb(255 255 255 / 0.5);
}
.text-white\/60 {
  color: rgb(255 255 255 / 0.6);
}
.text-white\/70 {
  color: rgb(255 255 255 / 0.7);
}
.text-white\/80 {
  color: rgb(255 255 255 / 0.8);
}
.text-white\/85 {
  color: rgb(255 255 255 / 0.85);
}
.text-white\/90 {
  color: rgb(255 255 255 / 0.9);
}
.underline {
  text-decoration-line: underline;
}
.line-through {
  text-decoration-line: line-through;
}
.underline-offset-4 {
  text-underline-offset: 4px;
}
.antialiased {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.opacity-0 {
  opacity: 0;
}
.opacity-20 {
  opacity: 0.2;
}
.opacity-40 {
  opacity: 0.4;
}
.opacity-50 {
  opacity: 0.5;
}
.opacity-70 {
  opacity: 0.7;
}
.shadow {
  --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0_0_0_1px_hsl\(var\(--sidebar-border\)\)\] {
  --tw-shadow: 0 0 0 1px hsl(var(--sidebar-border));
  --tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-lg {
  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-md {
  --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-none {
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-sm {
  --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-xl {
  --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-xs {
  --tw-shadow: 0 1px 2px 0 rgba(0,0,0,0.05);
  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-card {
  --tw-shadow-color: oklch(var(--card));
  --tw-shadow: var(--tw-shadow-colored);
}
.outline-none {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.outline {
  outline-style: solid;
}
.ring {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.ring-0 {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.ring-ring\/50 {
  --tw-ring-color: oklch(var(--ring) / 0.5);
}
.ring-sidebar-ring {
  --tw-ring-color: oklch(var(--sidebar-ring));
}
.ring-offset-background {
  --tw-ring-offset-color: oklch(var(--background));
}
.blur {
  --tw-blur: blur(8px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.blur-2xl {
  --tw-blur: blur(40px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.drop-shadow {
  --tw-drop-shadow: drop-shadow(0 1px 2px rgb(0 0 0 / 0.1)) drop-shadow(0 1px 1px rgb(0 0 0 / 0.06));
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.filter {
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.backdrop-blur-sm {
  --tw-backdrop-blur: blur(4px);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.backdrop-blur-xl {
  --tw-backdrop-blur: blur(24px);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.backdrop-filter {
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.transition {
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[color\2c box-shadow\] {
  transition-property: color,box-shadow;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[left\2c right\2c width\] {
  transition-property: left,right,width;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[margin\2c opacity\] {
  transition-property: margin,opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[width\2c height\2c padding\] {
  transition-property: width,height,padding;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[width\] {
  transition-property: width;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-all {
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-colors {
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-none {
  transition-property: none;
}
.transition-opacity {
  transition-property: opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-shadow {
  transition-property: box-shadow;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-transform {
  transition-property: transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.duration-1000 {
  transition-duration: 1000ms;
}
.duration-200 {
  transition-duration: 200ms;
}
.duration-300 {
  transition-duration: 300ms;
}
.duration-500 {
  transition-duration: 500ms;
}
.ease-in-out {
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}
.ease-linear {
  transition-timing-function: linear;
}
.ease-out {
  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
}
.\@container\/card-header {
  container-type: inline-size;
  container-name: card-header;
}
@keyframes enter {

  from {
    opacity: var(--tw-enter-opacity, 1);
    transform: translate3d(var(--tw-enter-translate-x, 0), var(--tw-enter-translate-y, 0), 0) scale3d(var(--tw-enter-scale, 1), var(--tw-enter-scale, 1), var(--tw-enter-scale, 1)) rotate(var(--tw-enter-rotate, 0));
  }
}
@keyframes exit {

  to {
    opacity: var(--tw-exit-opacity, 1);
    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));
  }
}
.animate-in {
  animation-name: enter;
  animation-duration: 150ms;
  --tw-enter-opacity: initial;
  --tw-enter-scale: initial;
  --tw-enter-rotate: initial;
  --tw-enter-translate-x: initial;
  --tw-enter-translate-y: initial;
}
.fade-in-0 {
  --tw-enter-opacity: 0;
}
.zoom-in-95 {
  --tw-enter-scale: .95;
}
.duration-1000 {
  animation-duration: 1000ms;
}
.duration-200 {
  animation-duration: 200ms;
}
.duration-300 {
  animation-duration: 300ms;
}
.duration-500 {
  animation-duration: 500ms;
}
.ease-in-out {
  animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}
.ease-linear {
  animation-timing-function: linear;
}
.ease-out {
  animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
}
.paused {
  animation-play-state: paused;
}
.app-grid-bg {
    background-image: var(--bg-grid);
    background-size: var(--bg-grid-size);
  }
/* Brand text selection + keyboard focus ring */
::-moz-selection {
    background: color-mix(in srgb, var(--color-amber) 30%, transparent);
    color: var(--color-text-primary);
  }
::selection {
    background: color-mix(in srgb, var(--color-amber) 30%, transparent);
    color: var(--color-text-primary);
  }
:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--color-amber) 60%, transparent);
    outline-offset: 2px;
    border-radius: 4px;
  }
/* Landing path cards — lift + glow por acento */
.vx-lift-amber, .vx-lift-violet {
    transition: transform 0.22s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.22s ease, border-color 0.22s ease;
    will-change: transform;
  }
.vx-lift-violet:hover {
    transform: translateY(-4px);
    border-color: rgba(124,58,237,0.55) !important;
    box-shadow: 0 18px 44px rgba(0,0,0,0.4), 0 0 0 1px rgba(124,58,237,0.2);
  }
/* 3D depth — layered shadows + top highlight + lift on hover */
.depth-card {
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.06),
      0 2px 6px rgba(0, 0, 0, 0.3),
      0 12px 32px rgba(0, 0, 0, 0.38);
    transition:
      transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1),
      box-shadow 0.25s ease;
    will-change: transform;
  }
.depth-card:hover {
    transform: translateY(-4px);
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.1),
      0 4px 10px rgba(0, 0, 0, 0.35),
      0 22px 50px rgba(0, 0, 0, 0.48);
  }
.depth-soft {
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.05),
      0 2px 8px rgba(0, 0, 0, 0.28),
      0 10px 26px rgba(0, 0, 0, 0.32);
  }
.transition-smooth {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  }
.transition-colors-fast {
    transition: color 0.15s ease, background-color 0.15s ease, border-color
      0.15s ease;
  }
.glow-primary {
    box-shadow: 0 0 20px oklch(0.58 0.22 264 / 0.3);
  }
.glow-secondary {
    box-shadow: 0 0 20px oklch(0.75 0.18 58 / 0.3);
  }
.shadow-subtle {
    box-shadow: 0 1px 3px oklch(0 0 0 / 0.4), 0 1px 2px oklch(0 0 0 / 0.3);
  }
.shadow-card {
    box-shadow: 0 4px 16px oklch(0 0 0 / 0.5);
  }
.bg-grid-pattern {
    background-image: linear-gradient(
        oklch(0.58 0.22 264 / 0.05) 1px,
        transparent 1px
      ),
      linear-gradient(90deg, oklch(0.58 0.22 264 / 0.05) 1px, transparent 1px);
    background-size: 32px 32px;
  }
/* Custom scrollbar for dark theme */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
  }
::-webkit-scrollbar-track {
    background: oklch(0.08 0.01 265);
  }
::-webkit-scrollbar-thumb {
    background: oklch(0.28 0.04 265);
    border-radius: 3px;
  }
::-webkit-scrollbar-thumb:hover {
    background: oklch(0.58 0.22 264 / 0.6);
  }
.\[--cell-size\:--spacing\(8\)\] {
  --cell-size: var(--spacing(8));
}

@font-face {
  font-family: "IBM Plex Mono";
  src: url("/assets/fonts/IBMPlexMono.woff2") format("woff2");
  font-display: swap;
}

@font-face {
  font-family: "Space Grotesk";
  src: url("/assets/fonts/SpaceGrotesk.woff2") format("woff2");
  font-display: swap;
}

@font-face {
  font-family: "DM Sans";
  src: url("/assets/fonts/DMSans.woff2") format("woff2");
  font-display: swap;
}

/* ── LIGHT MODE: OS preference ── */
@media (prefers-color-scheme: light) {
  :root {
    /* PLATINUM LIGHT MODE — tarjeta platinum, acentos cyan oscuro (pedido founder) */
    --color-bg-rgb: 201, 205, 209;
    --color-bg: #c9cdd1;
    --color-bg-2: #bec2c8;
    --color-bg-3: #d2d6da;
    --color-surface: rgba(13,35,48,0.11);
    --color-overlay: rgba(244,246,248,0.96);
    --color-border: rgba(13,35,48,0.14);
    --color-border-light: rgba(13,35,48,0.07);
    --color-border-med: rgba(13,35,48,0.22);
    --color-text-primary: #0d1f28;
    --color-text-secondary: #33474f;
    --color-text-muted: #5c707a;
    --color-text-dim: #93a4ad;
    --color-amber: #92610a;
    --color-emerald: #0b6e4f;
    --color-violet: #5b21b6;
    --color-danger: #b91c3c;
    --color-warning: #b45309;
    /* FIX (pedido real founder 2026-08-30, "letras verdes, amarillas y
       naranjas se pierden con el fondo light mode"): blue/teal/orange/cyan
       nunca tuvieron variante light — se quedaban con el mismo tono
       brillante pensado para fondo oscuro, casi invisible sobre el
       platinum claro. Mismo criterio que amber/emerald/violet arriba:
       oscurecer, no solo reusar. */
    --color-blue: #1d4ed8;
    --color-teal: #0f6b62;
    --color-orange: #b5480f;
    --color-cyan: #0369a1;
    --color-amber-warm: #92400e;
    --layer-0: #D87817; --layer-0-dim: rgba(216,120,23,0.08);
    --layer-1: #4c63c4; --layer-1-dim: rgba(76,99,196,0.08);
    --layer-2: #5d1fa8; --layer-2-dim: rgba(93,31,168,0.08);
    --layer-3: #d94d1f; --layer-3-dim: rgba(217,77,31,0.08);
    --layer-4: #2a4ba8; --layer-4-dim: rgba(42,75,168,0.10);
    --layer-5: #1a8566; --layer-5-dim: rgba(26,133,102,0.08);
    --layer-6: #7c3aed; --layer-6-dim: rgba(124,58,237,0.08);

    --bg-grid: linear-gradient(rgba(8,8,11,0.04) 1px, transparent 1px),
      linear-gradient(90deg, rgba(8,8,11,0.04) 1px, transparent 1px);

    --platinum-bg: linear-gradient(155deg, #f4f6f8 0%, #d8dde3 35%, #eef1f4 55%, #c3cad2 80%, #e6eaed 100%);
    --platinum-text: #1a2530;
    --platinum-shadow: 0 6px 20px rgba(90,105,120,0.32), inset 0 1px 0 rgba(255,255,255,0.85), inset 0 -1px 0 rgba(0,0,0,0.12);
    --platinum-border: 1px solid rgba(255,255,255,0.55);
  }
}

/* ── LIGHT MODE: .light class (ThemeProvider — overrides OS preference) ── */
.light {
  /* Tailwind OKLCH base vars — overrides :root dark defaults */
  --background: 0.99 0.002 265;
  --foreground: 0.12 0.008 270;
  --card: 0.97 0.002 265;
  --card-foreground: 0.12 0.008 270;
  --popover: 0.97 0.002 265;
  --popover-foreground: 0.12 0.008 270;
  --primary: 0.48 0.18 200;
  --primary-foreground: 0.99 0 0;
  --secondary: 0.55 0.14 50;
  --secondary-foreground: 0.99 0 0;
  --muted: 0.92 0.005 265;
  --muted-foreground: 0.48 0.01 265;
  --accent: 0.5 0.14 177;
  --accent-foreground: 0.99 0 0;
  --destructive: 0.5 0.22 25;
  --destructive-foreground: 0.99 0 0;
  --border: 0.84 0.008 265;
  --input: 0.84 0.008 265;
  --ring: 0.48 0.18 200;

  /* defi-* aliases (used in inline JSX styles via var()) */
  --defi-bg: #e8ebef;
  --defi-surface: #f2f4f6;
  --defi-cyan: #0e7490;
  --defi-teal: #0f766e;
  --defi-white: #0d1f28;
  --defi-slate: #33474f;
  --defi-border: rgba(13,35,48,0.14);

  /* Vaelix color vars — PLATINUM: tarjeta platinum, acentos cyan oscuro */
  --color-bg-rgb: 201, 205, 209; /* header translúcido en light */
  --color-bg: #c9cdd1;
  --color-bg-2: #bec2c8;
  --color-bg-3: #d2d6da;
  --color-surface: rgba(13,35,48,0.11);
  --color-overlay: rgba(244,246,248,0.96);
  --color-border: rgba(13,35,48,0.14);
  --color-border-light: rgba(13,35,48,0.07);
  --color-border-med: rgba(13,35,48,0.22);
  --color-text-primary: #0d1f28;
  --color-text-secondary: #33474f;
  --color-text-muted: #5c707a;
  --color-text-dim: #93a4ad;
  --color-amber: #92610a;
  --color-emerald: #0b6e4f;
  --color-violet: #5b21b6;
  --color-danger: #b91c3c;
  --color-warning: #b45309;
  --color-blue: #1d4ed8;
  --color-teal: #0f6b62;
  --color-orange: #b5480f;
  --color-cyan: #0369a1;
  --color-amber-warm: #92400e;
  --layer-0: #D87817; --layer-0-dim: rgba(216,120,23,0.08);
  --layer-1: #4c63c4; --layer-1-dim: rgba(76,99,196,0.08);
  --layer-2: #5d1fa8; --layer-2-dim: rgba(93,31,168,0.08);
  --layer-3: #d94d1f; --layer-3-dim: rgba(217,77,31,0.08);
  --layer-4: #2a4ba8; --layer-4-dim: rgba(42,75,168,0.10);
  --layer-5: #1a8566; --layer-5-dim: rgba(26,133,102,0.08);
  --layer-6: #7c3aed; --layer-6-dim: rgba(124,58,237,0.08);
  --bg-grid: linear-gradient(rgba(13,35,48,0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(13,35,48,0.05) 1px, transparent 1px);
  color-scheme: light;

  --platinum-bg: linear-gradient(155deg, #f4f6f8 0%, #d8dde3 35%, #eef1f4 55%, #c3cad2 80%, #e6eaed 100%);
  --platinum-text: #1a2530;
  --platinum-shadow: 0 6px 20px rgba(90,105,120,0.32), inset 0 1px 0 rgba(255,255,255,0.85), inset 0 -1px 0 rgba(0,0,0,0.12);
  --platinum-border: 1px solid rgba(255,255,255,0.55);
}

/* Light mode: base body/html reset so inherited color is dark by default.
   Fondo platinum — brillo metálico diagonal tipo tarjeta de crédito platinum. */
.light body {
  background: linear-gradient(155deg, #f2f4f6 0%, #e2e6ea 32%, #edf0f3 52%, #d5dbe1 78%, #e3e7eb 100%) fixed;
  color: var(--color-text-primary);
}

/* ── PLATINUM CARDS & BANNERS (light only) — superficie metálica pulida,
     highlight superior tipo lámina, sombra fría cyan-slate ── */
.light .depth-card,
.light .vx-card {
  /* FIX (pedido real founder 2026-08-29, "en light mode no aplicaste los
     cambios color cards"): este !important pisaba CUALQUIER background
     inline (el tinte real por bóveda/pool que le agregamos a VaultCard,
     PuraniumVaultCard, etc), forzando siempre el mismo gradiente plateado
     plano. Ahora usa --card-tint-bg si el elemento la define inline (el
     tinte real), con el gradiente plateado de siempre como fallback para
     las cards que no la setean. */
  background: var(--card-tint-bg, linear-gradient(150deg, #f7f9fb 0%, #e9edf1 55%, #dfe4e9 100%)) !important;
  border-color: rgba(13,35,48,0.13) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.9), 0 10px 28px rgba(13,35,48,0.10) !important;
}
.light .plat-banner {
  background: linear-gradient(140deg, #f4f6f8 0%, #e4e9ed 60%, #d9dfe5 100%);
  border: 1px solid rgba(14,116,144,0.22);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.85), 0 8px 22px rgba(13,35,48,0.08);
}
/* Acento cyan oscuro para chips/links de énfasis en platinum */
.light .plat-accent { color: #0e7490; }

/* Light mode: neutralize the most common hardcoded dark-mode Tailwind utilities */
.light .text-white { color: var(--color-text-primary) !important; }
.light .text-white\/40 { color: color-mix(in srgb, var(--color-text-primary) 40%, transparent) !important; }
.light .text-white\/50 { color: color-mix(in srgb, var(--color-text-primary) 50%, transparent) !important; }
.light .text-white\/60 { color: color-mix(in srgb, var(--color-text-primary) 60%, transparent) !important; }
.light .text-white\/70 { color: color-mix(in srgb, var(--color-text-primary) 70%, transparent) !important; }
.light .text-white\/30 { color: color-mix(in srgb, var(--color-text-primary) 30%, transparent) !important; }
.light .text-white\/20 { color: color-mix(in srgb, var(--color-text-primary) 20%, transparent) !important; }
/* FIX (pedido real founder 2026-08-22, contraste en light mode de las
   pool cards AMM — "0.00007906 ryjl3" casi invisible, blanco puro sobre
   fondo claro): faltaban estas 4 variantes en el override — se usan en
   AmmPoolStats.tsx y otros componentes, quedaban blanco puro sin pasar
   por color-mix. */
.light .text-white\/35 { color: color-mix(in srgb, var(--color-text-primary) 35%, transparent) !important; }
.light .text-white\/80 { color: color-mix(in srgb, var(--color-text-primary) 80%, transparent) !important; }
.light .text-white\/85 { color: color-mix(in srgb, var(--color-text-primary) 85%, transparent) !important; }
.light .text-white\/90 { color: color-mix(in srgb, var(--color-text-primary) 90%, transparent) !important; }
.light .bg-white\/5  { background-color: rgba(13,35,48,0.05) !important; }
.light .bg-white\/\[0\.02\] { background-color: rgba(13,35,48,0.03) !important; }
.light .bg-white\/\[0\.08\] { background-color: rgba(13,35,48,0.07) !important; }
.light .bg-white\/10 { background-color: rgba(13,35,48,0.08) !important; }
.light .bg-black\/20 { background-color: rgba(13,35,48,0.06) !important; }
.light .border-white\/10 { border-color: rgba(13,35,48,0.13) !important; }
.light .border-white\/20 { border-color: rgba(13,35,48,0.20) !important; }
.light .border-white\/5  { border-color: rgba(13,35,48,0.08) !important; }

/* ── DARK MODE: .dark class (ThemeProvider — overrides prefers-color-scheme) ── */
/* Force dark vars when .dark class is set (overrides prefers-color-scheme).
   Dark meteor platinum — mismo pedido que arriba, esta es la regla que
   realmente gana la cascada (fuera de @layer) cuando ThemeProvider setea
   .dark. */
.dark {
  /* FIX (reporte real founder: "no parece que oscureciste el fondo 50%"):
     esta regla `.dark` (ThemeProvider) es la que realmente gana la cascada
     — el otro fix en `:root` (línea ~88) quedaba sin efecto tapado por
     esta. Mismos valores oscurecidos acá, la fuente de verdad real. */
  --color-bg: #09090a;
  --color-bg-2: #0b0b0d;
  --color-bg-3: #0e0e10;
  --color-surface: rgba(255,255,255,0.065);
  --color-overlay: rgba(8,8,11,0.92);
  --color-border: rgba(255,255,255,0.07);
  --color-border-light: rgba(255,255,255,0.04);
  --color-border-med: rgba(255,255,255,0.12);
  --color-text-primary: #fafafa;
  --color-text-secondary: #9d9da5;
  --color-text-muted: #7d8494;
  --color-text-dim: #4a4a68;
  --color-amber: #facc15;
  --color-emerald: #34d399;
  --color-violet: #a78bfa;
  --color-danger: #f87171;
  --color-warning: #fbbf24;
  --bg-grid: linear-gradient(rgba(255,255,255,0.022) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.022) 1px, transparent 1px);
  color-scheme: dark;

  --platinum-bg: linear-gradient(155deg, #2c2c30 0%, #131315 35%, #232327 55%, #0a0a0c 80%, #1e1e21 100%);
  --platinum-text: #f2f2f0;
  --platinum-shadow: 0 6px 20px rgba(0,0,0,0.55), inset 0 1px 0 rgba(255,255,255,0.14), inset 0 -1px 0 rgba(0,0,0,0.45);
  --platinum-border: 1px solid rgba(255,255,255,0.14);
}

/* Dark mode: brillo metálico diagonal gunmetal — mismo criterio que
   `.light body` (misma estructura de degradé, tonos oscuros en vez de
   claros). Pedido founder 2026-08-02: "todos los fondos gris oscuro,
   brillo plateado, aparte de las imágenes" — esto es la capa base, no
   toca ninguna imagen de fondo (vortex/chainfusion/nebula/etc, esas
   siguen aparte encima en Layout.tsx). Recalibrado 2026-08-04 ("dark
   meteor platinum", más oscuro que antes) para que coincida con los
   --color-bg/-2/-3 nuevos — antes este degradé estaba hardcodeado y no
   se movía aunque esas vars cambiaran. */
/* FIX (pedido real founder 2026-08-19, "arregla todo el background de la
   pagina en general 50% mas oscuro, mismo color"): mismos tonos de arriba,
   cada canal RGB a la mitad — mismo matiz/degradé, solo más oscuro. */
.dark body {
  background: linear-gradient(155deg, #0d0d0f 0%, #09090a 32%, #0e0e10 52%, #060607 78%, #0b0b0d 100%) fixed;
  color: var(--color-text-primary);
}

[data-theme="portfolio"] {
  --portfolio-bg: 0.035 0.01 60;
  --portfolio-surface: 0.085 0.008 60;
  --portfolio-border: 0.64 0.12 60;
  --portfolio-gold: 0.65 0.21 60;
  --portfolio-gold-muted: 0.52 0.08 60;
  --portfolio-gold-dim: 0.22 0.04 60;
  --portfolio-text: 0.88 0.02 60;
  --portfolio-text-muted: 0.52 0.02 60;
  --portfolio-mono: "IBM Plex Mono", monospace;
  --portfolio-serif: "Cormorant Garamond", Georgia, serif;
}

.glass-defi {
  border: 1px solid rgba(56, 189, 248, 0.15);
  background: rgba(10, 22, 40, 0.7);
  backdrop-filter: blur(12px);
  box-shadow: 0 0 20px rgba(56, 189, 248, 0.08);
  border-radius: 12px;
}

.glass-clp {
  border: 1px solid rgba(59, 130, 246, 0.2);
  background: rgba(10, 15, 40, 0.7);
  backdrop-filter: blur(12px);
  box-shadow: 0 0 20px rgba(220, 38, 38, 0.12), 0 0 40px
    rgba(59, 130, 246, 0.08);
  border-radius: 12px;
}

.aurora-bg {
  background: radial-gradient(
      ellipse at top left,
      rgba(56, 189, 248, 0.15) 0%,
      transparent 50%
    ),
    radial-gradient(
      ellipse at bottom right,
      rgba(45, 212, 191, 0.1) 0%,
      transparent 50%
    ), var(--defi-bg, #050d1a);
}

@keyframes aurora-shift {
  0%,
  100% {
    opacity: 0.6;
    transform: scale(1);
  }
  50% {
    opacity: 1;
    transform: scale(1.05);
  }
}

.animate-aurora {
  animation: aurora-shift 8s ease-in-out infinite;
}

.clp-theme {
  --primary: var(--clp-cobalt);
  --primary-foreground: white;
}

.clp-btn {
  background: var(--clp-cobalt);
  color: white;
  border: none;
  border-radius: 8px;
  padding: 8px 16px;
  cursor: pointer;
  transition: background 0.2s;
}
.clp-btn:hover {
  background: var(--clp-blue);
}

.glass-defi-elevated {
  border: 1px solid rgba(56, 189, 248, 0.2);
  background: rgba(10, 22, 40, 0.6);
  backdrop-filter: blur(20px);
  box-shadow: 0 0 30px rgba(56, 189, 248, 0.12), 0 8px 32px
    rgba(56, 189, 248, 0.08);
  border-radius: 16px;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.glass-clp-elevated {
  border: 1px solid rgba(59, 130, 246, 0.25);
  background: rgba(10, 15, 40, 0.6);
  backdrop-filter: blur(20px);
  box-shadow: 0 0 30px rgba(220, 38, 38, 0.15), 0 0 50px rgba(59, 130, 246, 0.1),
    0 8px 32px rgba(59, 130, 246, 0.08);
  border-radius: 16px;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.token-pxrm {
  color: var(--pxrm-color);
  text-shadow: 0 0 12px rgba(167, 139, 250, 0.3);
}

.token-lunx {
  color: var(--lunx-color);
  text-shadow: 0 0 12px rgba(34, 211, 238, 0.4);
}

.token-vusd {
  color: var(--vusd-color);
  text-shadow: 0 0 12px rgba(52, 211, 153, 0.3);
}

.token-sclp {
  color: var(--sclp-color);
  text-shadow: 0 0 12px rgba(59, 130, 246, 0.3);
}

/* ─── VAELIX DESIGN SYSTEM ───────────────────────────────────────────────── */
:root {
  --font-display: 'Syne', 'Space Grotesk', sans-serif;
  --radius-card: 16px;
  --radius-sm: 10px;
}

/* Aurora background */
.aurora {
  position: fixed; inset: 0; z-index: 0; pointer-events: none; overflow: hidden;
}
.aurora-blob {
  position: absolute; border-radius: 50%; filter: blur(120px); opacity: 0.18;
  animation: drift 20s ease-in-out infinite alternate;
}
.aurora-blob:nth-child(1) {
  width: 700px; height: 700px;
  background: radial-gradient(circle, #0ea5e9, transparent);
  top: -200px; left: -150px; animation-delay: 0s;
}
.aurora-blob:nth-child(2) {
  width: 500px; height: 500px;
  background: radial-gradient(circle, #2dd4bf, transparent);
  top: 30%; right: -100px; animation-delay: -7s;
}
.aurora-blob:nth-child(3) {
  width: 400px; height: 400px;
  background: radial-gradient(circle, #1d4ed8, transparent);
  bottom: -100px; left: 40%; animation-delay: -14s;
}
@keyframes drift {
  from { transform: translate(0, 0) scale(1); }
  to   { transform: translate(40px, 30px) scale(1.1); }
}

/* Status dot */
.status-dot {
  display: inline-block;
  width: 6px; height: 6px; border-radius: 50%;
  background: #22d3ee; box-shadow: 0 0 6px #22d3ee;
  animation: status-pulse 2s infinite;
}
@keyframes status-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.4; }
}

/* Glass cards */
.glass-card {
  background: rgba(10, 22, 40, 0.7);
  backdrop-filter: blur(20px);
  border: 1px solid rgba(56, 189, 248, 0.15);
  border-radius: var(--radius-card);
  transition: all 0.25s;
  position: relative; overflow: hidden;
}
.glass-card::before {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(135deg, rgba(56, 189, 248, 0.04), transparent 60%);
  pointer-events: none;
}
.glass-card:hover {
  border-color: rgba(56, 189, 248, 0.28);
  transform: translateY(-2px);
  box-shadow: 0 12px 40px rgba(56, 189, 248, 0.08);
}
.glass-card-clp {
  background: rgba(10, 18, 40, 0.75);
  backdrop-filter: blur(20px);
  border: 1px solid rgba(59, 130, 246, 0.2);
  border-radius: var(--radius-card);
  transition: all 0.25s; position: relative; overflow: hidden;
}
.glass-card-clp::before {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(135deg, rgba(29, 78, 216, 0.08), rgba(220, 38, 38, 0.04) 60%, transparent);
  pointer-events: none;
}
.glass-card-clp:hover {
  border-color: rgba(59, 130, 246, 0.4);
  transform: translateY(-2px);
  box-shadow: 0 12px 40px rgba(29, 78, 216, 0.12);
}

/* Buttons */
.btn-primary {
  padding: 12px 24px; border-radius: 12px; border: none; cursor: pointer;
  background: linear-gradient(135deg, #38bdf8, #2dd4bf);
  color: #050d1a; font-family: var(--font-body);
  font-size: 15px; font-weight: 600; transition: all 0.2s;
}
.btn-primary:hover { transform: translateY(-2px); box-shadow: 0 8px 25px rgba(56, 189, 248, 0.3); }

.btn-secondary {
  padding: 12px 24px; border-radius: 12px; cursor: pointer;
  background: transparent; border: 1px solid rgba(56, 189, 248, 0.25);
  color: #38bdf8; font-family: var(--font-body);
  font-size: 15px; font-weight: 500; transition: all 0.2s;
}
.btn-secondary:hover { background: rgba(56, 189, 248, 0.08); }

.btn-clp-cta {
  padding: 12px 24px; border-radius: 12px; cursor: pointer;
  background: linear-gradient(135deg, #1d4ed8, #dc2626);
  border: none; color: white; font-family: var(--font-body);
  font-size: 15px; font-weight: 600; transition: all 0.2s;
}
.btn-clp-cta:hover { transform: translateY(-2px); box-shadow: 0 8px 25px rgba(29, 78, 216, 0.4); }

.btn-deposit {
  width: 100%; padding: 12px; border-radius: 10px; cursor: pointer;
  background: linear-gradient(135deg, rgba(56, 189, 248, 0.15), rgba(45, 212, 191, 0.1));
  border: 1px solid rgba(56, 189, 248, 0.25); color: #38bdf8;
  font-family: var(--font-body); font-size: 14px; font-weight: 600;
  transition: all 0.2s; margin-top: 16px;
}
.btn-deposit:hover {
  background: linear-gradient(135deg, rgba(56, 189, 248, 0.25), rgba(45, 212, 191, 0.2));
  transform: translateY(-1px);
}

.btn-bridge {
  width: 100%; padding: 13px; border-radius: 10px; border: none; cursor: pointer;
  background: linear-gradient(135deg, #1d4ed8, #dc2626);
  color: white; font-family: var(--font-body); font-size: 14px; font-weight: 600;
  margin-top: 16px; transition: all 0.2s;
}
.btn-bridge:hover { transform: translateY(-1px); box-shadow: 0 8px 25px rgba(29, 78, 216, 0.4); }
.btn-bridge:disabled { opacity: 0.6; cursor: not-allowed; transform: none; box-shadow: none; }

/* Section layout */
.vx-section { padding: 40px; max-width: 1200px; margin: 0 auto; }
.vx-section-clp { padding: 40px; max-width: 1200px; margin: 0 auto; }
.vx-section-header {
  display: flex; align-items: baseline; justify-content: space-between;
  margin-bottom: 24px;
}
.vx-section-title {
  font-family: var(--font-display); font-size: 24px; font-weight: 700;
  color: #f0f9ff; letter-spacing: -0.5px;
}
.vx-section-title-clp { color: #93c5fd; }

/* Hero */
.vx-hero {
  padding: 60px 40px 40px;
  max-width: 1200px; margin: 0 auto;
  display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center;
}
.vx-hero-eyebrow {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 5px 12px; border-radius: 20px;
  background: rgba(56, 189, 248, 0.08); border: 1px solid rgba(56, 189, 248, 0.2);
  color: #38bdf8; font-size: 12px; font-weight: 600;
  letter-spacing: 0.5px; margin-bottom: 20px; text-transform: uppercase;
}
.vx-hero-title {
  font-family: var(--font-display); font-size: 52px; font-weight: 800;
  line-height: 1.05; letter-spacing: -1.5px; color: #f0f9ff; margin-bottom: 16px;
}
.vx-hero-title span { color: #38bdf8; }
.vx-hero-sub {
  font-size: 16px; color: #94a3b8; line-height: 1.6;
  max-width: 440px; margin-bottom: 32px;
}
.vx-hero-ctas { display: flex; gap: 12px; flex-wrap: wrap; }

/* Stats strip */
.vx-stats-strip {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 2px; background: rgba(56, 189, 248, 0.05);
  border: 1px solid rgba(56, 189, 248, 0.08);
  border-radius: var(--radius-card); overflow: hidden;
}
.vx-stat-cell { padding: 16px 20px; background: rgba(10, 22, 40, 0.8); }
.vx-stat-val {
  /* masterización fonts: texto pequeño → font de la navbar (body) */
  font-family: var(--font-body); font-size: 20px; font-weight: 700;
  color: #f0f9ff; line-height: 1;
}
.vx-stat-label { font-size: 11px; color: #94a3b8; margin-top: 4px; text-transform: uppercase; letter-spacing: 0.5px; }

/* Vault cards */
.vx-vaults-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.vx-vault-card { padding: 28px; }
.vx-vault-header {
  display: flex; align-items: flex-start; justify-content: space-between;
  margin-bottom: 20px;
}
.vx-vault-icon {
  width: 44px; height: 44px; border-radius: 12px;
  display: flex; align-items: center; justify-content: center; font-size: 20px;
  background: linear-gradient(135deg, rgba(56, 189, 248, 0.15), rgba(45, 212, 191, 0.1));
  border: 1px solid rgba(56, 189, 248, 0.2);
}
.vx-vault-apr-badge {
  padding: 4px 10px; border-radius: 20px;
  background: rgba(45, 212, 191, 0.1); border: 1px solid rgba(45, 212, 191, 0.25);
  color: #2dd4bf; font-size: 12px; font-weight: 600; white-space: nowrap;
}
.vx-vault-name {
  font-family: var(--font-body); font-size: 20px; font-weight: 700;
  color: #f0f9ff; margin-bottom: 4px;
}
.vx-vault-tokens { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 20px; }
.vx-token-chip {
  padding: 3px 10px; border-radius: 20px;
  background: rgba(56, 189, 248, 0.06); border: 1px solid rgba(56, 189, 248, 0.15);
  color: #38bdf8; font-size: 12px; font-weight: 500;
}
.vx-vault-apr-row {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-bottom: 20px;
}
.vx-apr-cell {
  padding: 10px 8px; border-radius: 10px; text-align: center;
  background: rgba(56, 189, 248, 0.04); border: 1px solid rgba(56, 189, 248, 0.08);
}
.vx-apr-period { font-size: 10px; color: #94a3b8; text-transform: uppercase; letter-spacing: 0.5px; }
.vx-apr-val { font-family: var(--font-body); font-size: 16px; font-weight: 700; color: #2dd4bf; margin-top: 3px; }
.vx-vault-tvl {
  display: flex; justify-content: space-between; align-items: center;
  padding-top: 16px; border-top: 1px solid rgba(56, 189, 248, 0.08);
}
.vx-tvl-label { font-size: 12px; color: #94a3b8; }
.vx-tvl-val { font-family: var(--font-body); font-size: 16px; font-weight: 700; color: #f0f9ff; }

/* CLP Bridge */
.vx-clp-pill {
  display: flex; align-items: center; gap: 8px;
  padding: 5px 14px; border-radius: 20px;
  background: linear-gradient(135deg, rgba(29, 78, 216, 0.15), rgba(220, 38, 38, 0.1));
  border: 1px solid rgba(59, 130, 246, 0.3);
  color: #93c5fd; font-size: 12px; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.5px;
}
.vx-clp-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 20px; }
.vx-clp-title {
  font-family: var(--font-display); font-size: 22px; font-weight: 700;
  background: linear-gradient(135deg, #93c5fd, #f87171);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text; margin-bottom: 6px;
}
.vx-corridor-row {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 16px; border-radius: 10px;
  background: rgba(29, 78, 216, 0.06); border: 1px solid rgba(59, 130, 246, 0.12);
  transition: all 0.2s; margin-bottom: 10px;
}
.vx-corridor-row:hover { background: rgba(29, 78, 216, 0.1); border-color: rgba(59, 130, 246, 0.25); }
.vx-corridor-fee {
  padding: 3px 8px; border-radius: 20px; font-size: 11px;
  background: rgba(220, 38, 38, 0.1); border: 1px solid rgba(220, 38, 38, 0.2);
  color: #fca5a5; white-space: nowrap;
}
.vx-fee-bar-row { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.vx-fee-bar-track { flex: 1; height: 6px; border-radius: 3px; background: rgba(59, 130, 246, 0.1); }
.vx-fee-bar-fill { height: 100%; border-radius: 3px; }

/* ─── FULL-WIDTH HERO ────────────────────────────────────────────────────── */
.vx-hero-full {
  position: relative;
  width: 100vw;
  margin-left: calc(-50vw + 50%);
  height: 100vh;
  min-height: 600px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.vx-hero-canvas-wrap {
  position: absolute; inset: 0;
}
.vx-hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(
    to bottom,
    rgba(5,13,26,0.15) 0%,
    rgba(5,13,26,0.05) 35%,
    rgba(5,13,26,0.65) 85%,
    rgba(5,13,26,1) 100%
  );
  pointer-events: none;
}
.vx-hero-center {
  position: relative; z-index: 2;
  text-align: center;
  max-width: 720px;
  padding: 0 24px;
}
.vx-hero-title-xl {
  font-family: var(--font-display);
  font-size: clamp(56px, 9vw, 108px);
  font-weight: 800;
  color: #f0f9ff;
  letter-spacing: -4px;
  line-height: 0.9;
  margin-bottom: 28px;
}
.vx-hero-title-xl span {
  background: linear-gradient(135deg, #a78bfa, #38bdf8);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.vx-hero-claim {
  font-size: clamp(15px, 2vw, 18px);
  color: #94a3b8;
  line-height: 1.65;
  margin-bottom: 48px;
  max-width: 520px;
  margin-left: auto;
  margin-right: auto;
}
/* Path bifurcation cards */
.vx-paths-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  max-width: 540px;
  margin: 0 auto;
}
.vx-path-card {
  padding: 24px 20px;
  border-radius: 20px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  backdrop-filter: blur(20px);
  cursor: pointer;
  transition: all 0.25s;
  text-align: center;
  text-decoration: none;
  display: block;
}
.vx-path-card:hover {
  background: rgba(167,139,250,0.08);
  border-color: rgba(167,139,250,0.3);
  transform: translateY(-3px);
  box-shadow: 0 16px 40px rgba(139,92,246,0.15);
}
.vx-path-card-clp {
  padding: 24px 20px;
  border-radius: 20px;
  background: rgba(29,78,216,0.06);
  border: 1px solid rgba(59,130,246,0.15);
  backdrop-filter: blur(20px);
  cursor: pointer;
  transition: all 0.25s;
  text-align: center;
  text-decoration: none;
  display: block;
}
.vx-path-card-clp:hover {
  background: rgba(29,78,216,0.12);
  border-color: rgba(59,130,246,0.35);
  transform: translateY(-3px);
  box-shadow: 0 16px 40px rgba(29,78,216,0.18);
}
.vx-path-icon { font-size: 36px; margin-bottom: 10px; }
.vx-path-title {
  font-family: var(--font-display);
  font-size: 17px; font-weight: 700;
  color: #f0f9ff; margin-bottom: 6px;
}
.vx-path-sub { font-size: 12px; color: #64748b; line-height: 1.4; }
/* Scroll hint */
.vx-scroll-hint {
  position: absolute; bottom: 28px; left: 50%;
  transform: translateX(-50%);
  text-align: center; z-index: 2;
}
.vx-scroll-hint span {
  display: block; font-size: 10px; font-weight: 600;
  color: #475569; letter-spacing: 1.5px; text-transform: uppercase; margin-bottom: 6px;
}
.vx-scroll-hint div {
  color: #475569; font-size: 18px;
  animation: bounce-hint 2s ease-in-out infinite;
}
@keyframes bounce-hint {
  0%, 100% { transform: translateY(0); opacity: 0.5; }
  50%       { transform: translateY(6px); opacity: 1; }
}

/* Stats bar below hero fold */
.vx-stats-bar {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  background: rgba(10,22,40,0.9);
  border-top: 1px solid rgba(56,189,248,0.08);
  border-bottom: 1px solid rgba(56,189,248,0.08);
}
.vx-stats-bar-cell {
  padding: 20px 24px;
  border-right: 1px solid rgba(56,189,248,0.06);
  text-align: center;
}
.vx-stats-bar-cell:last-child { border-right: none; }
.vx-stats-bar-val {
  font-family: var(--font-display);
  font-size: 22px; font-weight: 800;
  color: #f0f9ff;
}
.vx-stats-bar-label {
  font-size: 11px; color: #475569;
  text-transform: uppercase; letter-spacing: 0.6px; margin-top: 3px;
}

/* Docs page */
.docs-section { padding: 48px 40px; max-width: 1100px; margin: 0 auto; }
.docs-section + .docs-section { padding-top: 0; }
.docs-h2 {
  font-family: var(--font-display); font-size: 26px; font-weight: 700;
  color: #f0f9ff; margin-bottom: 6px; letter-spacing: -0.5px;
}
.docs-lead { font-size: 14px; color: #64748b; margin-bottom: 28px; line-height: 1.6; }
.docs-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.docs-grid-3 { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.docs-card {
  padding: 22px; border-radius: 16px;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.07);
}
.docs-tag {
  display: inline-block; padding: 2px 8px; border-radius: 20px;
  font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px;
  margin-bottom: 10px;
}
.docs-canister-row {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 16px; border-radius: 10px;
  border: 1px solid rgba(255,255,255,0.05);
  margin-bottom: 8px; transition: all 0.2s;
}
.docs-canister-row:hover { background: rgba(255,255,255,0.03); }
.docs-live-dot {
  width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0;
}

/* Portfolio tracker */
.port-input {
  width: 72px; padding: 4px 8px; border-radius: 8px;
  background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.08);
  color: #f0f9ff; font-size: 13px; text-align: right;
  font-family: var(--font-mono);
  outline: none; transition: border-color 0.2s;
}
.port-input:focus { border-color: rgba(167,139,250,0.4); }
/* Sacar las flechitas nativas del input number — rompían la UX al editar % */
.port-input::-webkit-outer-spin-button,
.port-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.port-input[type="number"] { -moz-appearance: textfield; }
.port-deviation-pos { color: #34d399; font-size: 11px; }
.port-deviation-neg { color: #f87171; font-size: 11px; }
.port-deviation-neu { color: #64748b; font-size: 11px; }

/* ─── PURPLE VORTEX HERO ─────────────────────────────────────────────────── */
.vx-vortex-wrap {
  position: absolute; inset: 0; z-index: 0;
  overflow: hidden; pointer-events: none;
  display: flex; align-items: center; justify-content: center;
}
.vx-vortex-rings {
  position: absolute; right: -60px; top: 50%; transform: translateY(-50%);
  width: 560px; height: 560px;
}
.vx-vortex-rings .ring {
  position: absolute; border-radius: 50%;
  border: 1px solid;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
}
.vx-vortex-rings .ring:nth-child(1)  { width: 80px;  height: 56px;  border-color: rgba(167,139,250,0.80); animation: vortex-pulse 3s ease-in-out infinite 0s; }
.vx-vortex-rings .ring:nth-child(2)  { width: 120px; height: 84px;  border-color: rgba(139,92,246,0.65);  animation: vortex-pulse 3s ease-in-out infinite 0.2s; }
.vx-vortex-rings .ring:nth-child(3)  { width: 170px; height: 120px; border-color: rgba(124,58,237,0.52);  animation: vortex-pulse 3s ease-in-out infinite 0.4s; }
.vx-vortex-rings .ring:nth-child(4)  { width: 230px; height: 162px; border-color: rgba(109,40,217,0.40);  animation: vortex-pulse 3s ease-in-out infinite 0.6s; }
.vx-vortex-rings .ring:nth-child(5)  { width: 296px; height: 208px; border-color: rgba(91,33,182,0.30);   animation: vortex-pulse 3s ease-in-out infinite 0.8s; }
.vx-vortex-rings .ring:nth-child(6)  { width: 368px; height: 258px; border-color: rgba(76,29,149,0.22);   animation: vortex-pulse 3s ease-in-out infinite 1.0s; }
.vx-vortex-rings .ring:nth-child(7)  { width: 446px; height: 313px; border-color: rgba(76,29,149,0.15);   animation: vortex-pulse 3s ease-in-out infinite 1.2s; }
.vx-vortex-rings .ring:nth-child(8)  { width: 530px; height: 372px; border-color: rgba(76,29,149,0.08);   animation: vortex-pulse 3s ease-in-out infinite 1.4s; }
/* grid lines across the rings */
.vx-vortex-rings .ring::before,
.vx-vortex-rings .ring::after {
  content: ''; position: absolute; background: rgba(139,92,246,0.12);
}
.vx-vortex-rings .ring:nth-child(1)::before { width: 1px; height: 480px; left: 50%; top: 50%; transform: translate(-50%,-50%); }
.vx-vortex-rings .ring:nth-child(1)::after  { width: 480px; height: 1px; left: 50%; top: 50%; transform: translate(-50%,-50%); }
/* glow blob behind rings */
.vx-vortex-glow {
  position: absolute; right: 40px; top: 50%; transform: translateY(-50%);
  width: 400px; height: 400px; border-radius: 50%;
  background: radial-gradient(circle at center, rgba(139,92,246,0.18) 0%, rgba(91,33,182,0.08) 40%, transparent 70%);
  filter: blur(40px);
}

@keyframes vortex-pulse {
  0%, 100% { opacity: 1; transform: translate(-50%, -50%) scale(1); }
  50%       { opacity: 0.6; transform: translate(-50%, -50%) scale(1.03); }
}

/* ─── APPLE-STYLE GLASS CARDS ────────────────────────────────────────────── */
.glass-apple {
  background: rgba(255, 255, 255, 0.04);
  backdrop-filter: blur(32px) saturate(180%);
  -webkit-backdrop-filter: blur(32px) saturate(180%);
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 20px;
  box-shadow:
    0 0 0 0.5px rgba(255,255,255,0.05) inset,
    0 2px 8px rgba(0,0,0,0.4),
    0 16px 48px rgba(0,0,0,0.3);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative; overflow: hidden;
}
.glass-apple::before {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(135deg, rgba(255,255,255,0.06) 0%, transparent 50%);
  pointer-events: none; border-radius: inherit;
}
.glass-apple:hover {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.14);
  box-shadow:
    0 0 0 0.5px rgba(255,255,255,0.08) inset,
    0 4px 16px rgba(0,0,0,0.5),
    0 24px 64px rgba(139,92,246,0.08);
  transform: translateY(-2px);
}

/* purple variant for hero price cards */
.glass-apple-violet {
  background: rgba(139, 92, 246, 0.05);
  backdrop-filter: blur(28px) saturate(160%);
  -webkit-backdrop-filter: blur(28px) saturate(160%);
  border: 1px solid rgba(167, 139, 250, 0.15);
  border-radius: 18px;
  box-shadow: 0 0 0 0.5px rgba(167,139,250,0.08) inset, 0 8px 32px rgba(0,0,0,0.4);
  transition: all 0.25s;
  position: relative; overflow: hidden;
}
.glass-apple-violet::before {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(135deg, rgba(167,139,250,0.08) 0%, transparent 55%);
  pointer-events: none; border-radius: inherit;
}
.glass-apple-violet:hover {
  border-color: rgba(167,139,250,0.28);
  transform: translateY(-2px);
  box-shadow: 0 12px 40px rgba(139,92,246,0.12);
}

/* ─── PORTFOLIO TABLE ────────────────────────────────────────────────────── */
.vx-portfolio-table {
  width: 100%; border-collapse: collapse; font-size: 13px;
}
.vx-portfolio-table th {
  text-align: left; padding: 8px 12px;
  color: #64748b; font-size: 10px; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.6px;
  border-bottom: 1px solid rgba(139,92,246,0.1);
}
.vx-portfolio-table td {
  padding: 10px 12px; border-bottom: 1px solid rgba(56,189,248,0.04);
  vertical-align: middle;
}
.vx-portfolio-table tr:last-child td { border-bottom: none; }
.vx-portfolio-table tr:hover td { background: rgba(139,92,246,0.04); }
.vx-layer-badge {
  display: inline-block; padding: 2px 8px; border-radius: 20px;
  font-size: 10px; font-weight: 700;
  background: rgba(56,189,248,0.08); border: 1px solid rgba(56,189,248,0.15);
  color: #38bdf8;
}
.vx-alloc-bar-wrap { width: 80px; height: 4px; border-radius: 2px; background: rgba(255,255,255,0.06); overflow: hidden; }
.vx-alloc-bar { height: 100%; border-radius: 2px; }

/* ─── AGENTIC SECTION ────────────────────────────────────────────────────── */
.vx-agent-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 24px;
}
.vx-agent-card {
  padding: 24px; border-radius: 20px;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(139,92,246,0.12);
  backdrop-filter: blur(20px);
  transition: all 0.25s;
  position: relative; overflow: hidden;
}
.vx-agent-card::before {
  content: ''; position: absolute;
  top: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(139,92,246,0.4), transparent);
}
.vx-agent-card:hover {
  border-color: rgba(139,92,246,0.28);
  background: rgba(139,92,246,0.05);
  transform: translateY(-2px);
}
.vx-agent-icon {
  width: 44px; height: 44px; border-radius: 12px;
  background: linear-gradient(135deg, rgba(139,92,246,0.2), rgba(91,33,182,0.1));
  border: 1px solid rgba(139,92,246,0.25);
  display: flex; align-items: center; justify-content: center;
  font-size: 20px; margin-bottom: 14px;
}
.vx-agent-title {
  font-family: var(--font-display); font-size: 15px; font-weight: 700;
  color: #f0f9ff; margin-bottom: 8px;
}
.vx-agent-desc { font-size: 13px; color: #64748b; line-height: 1.5; }
.vx-agent-badge {
  display: inline-flex; align-items: center; gap: 4px;
  margin-top: 12px; padding: 3px 10px; border-radius: 20px;
  font-size: 11px; font-weight: 600;
  background: rgba(139,92,246,0.1); border: 1px solid rgba(139,92,246,0.2);
  color: #a78bfa;
}

/* Responsive */
@media (max-width: 768px) {
  .vx-hero { grid-template-columns: 1fr; padding: 30px 20px; }
  .vx-stats-strip { grid-template-columns: repeat(2, 1fr); }
  .vx-vaults-grid { grid-template-columns: 1fr; }
  .vx-clp-grid { grid-template-columns: 1fr; }
  .vx-section { padding: 20px; }
  .vx-section-clp { padding: 20px; }
  .vx-hero-title { font-size: 36px; }
  .vx-vortex-rings { display: none; }
  .vx-agent-grid { grid-template-columns: 1fr; }
}

/* ── Master type scale — Vaelix design system ── */
:root {
  --fs-hero: clamp(2.52rem, 7.2vw, 4.95rem);
  --fs-4xl: 32px;   /* section titles */
  --fs-3xl: 27px;   /* card headers */
  --fs-2xl: 22px;   /* stats/numbers */
  --fs-xl: 18px;    /* sub-heads */
  --fs-lg: 16px;    /* large body */
  --fs-md: 14px;    /* body default */
  --fs-base: 13px;  /* secondary */
  --fs-sm: 12px;    /* captions */
  --fs-xs: 11px;    /* micro */
  --fs-2xs: 10px;   /* tags */
}

/* ── Shared page width constraint (70% centered, 15% each side) ── */
.vx-page {
  width: 77%; /* +10% — pedido: ensanchar el body dentro del mismo diseño que los heros */
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}
/* Nested vx-page must not double-constrain */
.vx-page .vx-page {
  width: 100%;
  margin-left: 0;
  margin-right: 0;
}
@media (max-width: 900px) {
  .vx-page { width: 92%; }
  .vx-page .vx-page { width: 100%; }
}

/* Re-centra contenido dentro de una banda full-bleed (100vw) que rompió .vx-page
   — usada por heros con imagen de fondo (Landing). No hereda la regla de arriba
   porque NO está anidada dentro de otro .vx-page (el padre es full-bleed). */
.vx-hero-band-inner {
  width: 70%;
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}
@media (max-width: 900px) {
  .vx-hero-band-inner { width: 92%; }
}

/* Globo decorativo del hero (Landing) — se oculta en viewports angostos donde
   se solaparía con el título. */
@media (max-width: 900px) {
  .vx-hero-globe { display: none; }
}

/* ── vx-card — Universe/chain-card glass style (applied to all Vaelix cards) ──
   Usage: className="vx-card" + CSS var --vx-card-color for accent.
   Automatically renders: gradient bg, colored top-bar, glass shadow.
   Set --vx-card-color in a parent or inline:  style={{ "--vx-card-color": "#38bdf8" }}  */
.vx-card {
  border-radius: 20px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--vx-card-color, rgba(255,255,255,0.3)) 28%, transparent);
  background: linear-gradient(135deg,
    color-mix(in srgb, var(--vx-card-color, rgba(255,255,255,0.2)) 12%, transparent) 0%,
    var(--color-bg-2, #0d0d14) 100%
  );
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow:
    0 6px 24px color-mix(in srgb, var(--vx-card-color, transparent) 15%, transparent),
    inset 0 1px 0 rgba(255,255,255,0.055);
  position: relative;
  transition: box-shadow 0.2s, border-color 0.2s;
}
.vx-card:hover {
  box-shadow:
    0 10px 36px color-mix(in srgb, var(--vx-card-color, transparent) 22%, transparent),
    inset 0 1px 0 rgba(255,255,255,0.08);
  border-color: color-mix(in srgb, var(--vx-card-color, rgba(255,255,255,0.3)) 42%, transparent);
}
/* Colored top-bar: add class vx-card-bar to get the gradient stripe */
.vx-card-bar::before {
  content: "";
  display: block;
  height: 3px;
  background: linear-gradient(90deg,
    var(--vx-card-color, #38bdf8),
    color-mix(in srgb, var(--vx-card-color, #38bdf8) 50%, transparent)
  );
  position: absolute;
  top: 0; left: 0; right: 0;
}

/* ── Ecosystem iOS token icon — hover/press effect ── */
.eco-token-icon {
  transition: transform 0.12s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.12s;
  cursor: pointer;
}
.eco-token-icon:hover {
  transform: scale(1.08);
  box-shadow: 0 6px 18px var(--tok-color, rgba(56,189,248,0.3));
}
.eco-token-icon:active {
  transform: scale(0.93);
  transition-duration: 0.06s;
}

/* ── Ecosystem glass card — subtle lift on hover ── */
.eco-chain-card {
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.eco-chain-card:hover {
  transform: translateY(-2px);
}

/* ═══════════════════════════════════════════
   APP CHROME — makes it feel like a native app
   ═══════════════════════════════════════════ */

/* Thin custom scrollbar — web apps, not websites */
::-webkit-scrollbar { width: 4px; height: 4px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--color-border-med); border-radius: 99px; }
::-webkit-scrollbar-thumb:hover { background: var(--color-text-dim); }
* { scrollbar-width: thin; scrollbar-color: var(--color-border-med) transparent; }

/* Prevent text selection on interactive elements */
button, a, nav, [role="button"] { -moz-user-select: none; user-select: none; -webkit-user-select: none; }

/* Touch feel — no tap highlight on mobile */
* { -webkit-tap-highlight-color: transparent; }

/* Prevent overscroll bounce on body (app feel) */
html, body {
  overscroll-behavior: none;
  height: 100%;
}

/* Zoom global — texto, íconos, paddings, todo escala parejo (`zoom` también
   escala los px inline, a diferencia de font-size).
   Historial: arrancó en 1.2 (pedido founder — letras ilegibles a 100%).
   Bajado a 1.09 (pedido founder: "achica todas las pages en general en 9%")
   — pero esa regla vivía en @layer base y NUNCA tuvo efecto real, esta de
   acá (fuera de @layer) le seguía ganando la cascada — bug encontrado y
   consolidado 2026-08-02, quedaba una sola fuente de verdad.
   Actualizado 2026-08-02: pedido founder de densidad tipo "browser al 80%"
   (banners más bajos, más contenido visible). Bajado a 1.0 — más chico que
   el 1.2 real que estaba corriendo, pero sin bajar del piso de legibilidad
   original. El pedido de "letras +1.5pt independiente del spacing" NO está
   en este cambio — `zoom` no puede separar texto de spacing; hacerlo de
   verdad necesita migrar los ~100+ `fontSize: N` inline a una escala
   tipográfica en rem, un refactor grande aparte. */
html {
  zoom: 1.0;
}

/* Safe area for iOS bottom tab bar */
@supports (padding-bottom: env(safe-area-inset-bottom)) {
  .pb-safe { padding-bottom: env(safe-area-inset-bottom); }
}

/* Bottom tab bar active indicator dot */
.tab-active-dot {
  position: absolute;
  bottom: 6px;
  left: 50%;
  transform: translateX(-50%);
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: currentColor;
}

/* Desktop nav pill active state (filled segment) */
.nav-pill-active {
  background: rgba(255,255,255,0.08);
  border-radius: 8px;
}

/* Card press effect — app-native feel */
.app-card {
  transition: transform 0.12s cubic-bezier(0.34,1.56,0.64,1), box-shadow 0.12s;
  cursor: pointer;
}
.app-card:active { transform: scale(0.975); }

/* Page enter animation — snappier than before */
.page-enter {
  animation: pageEnter 0.18s ease-out both;
}
@keyframes pageEnter {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Frosted glass for modals and drawers */
.glass-frosted {
  background: rgba(8,8,11,0.82);
  backdrop-filter: blur(24px) saturate(1.6);
  -webkit-backdrop-filter: blur(24px) saturate(1.6);
}

/* Status indicator pulse */
@keyframes pulse-dot {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%       { opacity: 0.6; transform: scale(0.85); }
}
.pulse-dot { animation: pulse-dot 2s ease-in-out infinite; }

@keyframes spin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

/* ══════════════════════════════════════════════════════════════════════════
   PRISM NAVBAR SYSTEM — ported from "vaelix_-the-beyond" (Caffeine)
   OKLCH palette · real glass blur · border-image edges
   ══════════════════════════════════════════════════════════════════════════ */
:root {
  --prism-cyan: oklch(0.85 0.18 195);
  --prism-violet: oklch(0.65 0.25 290);
  --prism-magenta: oklch(0.7 0.28 350);
  --prism-edge-gradient: linear-gradient(
    to right, transparent, var(--prism-cyan), var(--prism-violet), var(--prism-magenta), transparent
  );
  --prism-divider-gradient: linear-gradient(
    to right, transparent, rgba(255,255,255,0.15), transparent
  );
  --prism-glass-bg: rgba(0,0,0,0.6);
  --prism-glass-bg-subtle: rgba(0,0,0,0.4);
}
.light {
  /* Glass platinum — lámina esmerilada sobre el fondo metálico */
  --prism-glass-bg: rgba(0,0,0,0.5);
  --prism-glass-bg-subtle: rgba(0,0,0,0.3);
  --prism-divider-gradient: linear-gradient(
    to right, transparent, rgba(13,35,48,0.14), transparent
  );
}

.prism-glass {
  background: var(--prism-glass-bg);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
/* FIX (pedido real founder 2026-08-29, "la navbar siga siendo el look de
   dark mode en light mode (negra pero más transparente)"): --prism-glass-bg
   ya quedó negro en ambos temas, pero el TEXTO del navbar seguía leyendo
   las variables globales --color-text-* (claras en light mode) — casi
   invisible sobre fondo negro. Este scope fuerza los mismos valores de
   texto que dark mode, solo dentro del navbar, sin tocar el resto de la
   app ni el sistema de overrides .light ya existente. */
.navbar-dark-scope {
  --color-text-primary: #fafafa;
  --color-text-secondary: #9d9da5;
  --color-text-muted: #7d8494;
  --color-text-dim: #4a4a68;
}
.prism-glass-subtle {
  background: var(--prism-glass-bg-subtle);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.prism-edge {
  border-bottom: 1px solid transparent;
  -o-border-image: var(--prism-edge-gradient) 1;
     border-image: var(--prism-edge-gradient) 1;
}
/* Mismo gradiente que .prism-edge, pero en el borde de ARRIBA — para barras
   fijas al pie de pantalla (pedido real founder 2026-08-25, "la sub var
   mobile tb tiene que tener el look prism de la navbar de arriba": bottom
   tab bar mobile) donde el borde que "mira" hacia el contenido es el de
   arriba, no el de abajo. */
.prism-edge-top {
  border-top: 1px solid transparent;
  -o-border-image: var(--prism-edge-gradient) 1;
     border-image: var(--prism-edge-gradient) 1;
}
.prism-divider-b {
  border-top: 1px solid transparent;
  -o-border-image: var(--prism-divider-gradient) 1;
     border-image: var(--prism-divider-gradient) 1;
}
.prism-gradient-text {
  background: linear-gradient(to right, var(--prism-cyan), var(--prism-violet), var(--prism-magenta));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.platinum-gradient-text {
  /* Degradé propio para texto — el --platinum-bg de los botones es oscuro
     en dark mode (pensado para superficie con sombra/relieve, no para
     letras finas sobre fondo negro). Relleno casi plano (leve variación
     top→bottom, sin banda brillante cruzando el centro) + glow suave
     detrás vía drop-shadow, en vez de brillo dentro del propio relleno. */
  background: linear-gradient(180deg, #d8d8dc 0%, #b4b4ba 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  filter: drop-shadow(0 0 6px rgba(210,210,220,0.25));
}
.prism-wallet-btn {
  /* FIX (pedido real founder 2026-08-27, "modifica botones wallet fund y
     conectar wallet (el general de la app, verde) con un nuevo look como
     el de depositar en vaults"): antes verde plano (#34d399, igual al CTA
     "Ir a Vaults →"). Ahora el mismo metálico platinum/silver que usa
     "Depositar →" en VaultsPage.tsx — theme-aware (oscuro/claro vía las
     mismas custom properties --platinum-*). */
  background: var(--platinum-bg);
  color: var(--platinum-text);
  border: var(--platinum-border);
  border-radius: 0.5rem;
  box-shadow: var(--platinum-shadow);
  transition: opacity 0.2s ease;
}
.prism-wallet-btn:hover { opacity: 0.9; }
.prism-active-indicator {
  background: linear-gradient(to right, var(--prism-cyan), var(--prism-violet));
  height: 2px;
  border-radius: 1px;
  box-shadow: 0 0 8px var(--prism-cyan);
}
.prism-item-hover { transition: color 0.2s ease, text-shadow 0.2s ease; }
.prism-item-hover:hover { text-shadow: 0 0 8px rgba(56,189,248,0.5); }

/* FIX (pedido real founder 2026-08-22, "el borde de las glass cards
   'grandes' dejalos... brillo prism, el mismo de la linea prism de la
   navbar, en cada page glass card (solo la grande, no bovedas)"): mismo
   gradiente que .prism-edge (navbar), pero en las 4 caras — reservado para
   el contenedor grande de cada página (PageBody), no para cards chicas
   internas (bóvedas/depth-card siguen con su borde propio). */
.prism-card-edge {
  border: 1px solid transparent;
  -o-border-image: var(--prism-edge-gradient) 1;
     border-image: var(--prism-edge-gradient) 1;
}

/* Subvar — color base vía custom prop (--sub-color, seteada por React) para
   que el hover pueda pisarlo sin !important, igual que --nb-color en los
   botones del navbar de arriba. En dark mode el hover pasa a mostrar el
   color propio del item (--item-accent) en vez del glow cyan genérico —
   en light mode se queda con el .prism-item-hover normal (sin este bloque). */
.subvar-link { color: var(--sub-color); }
.dark .subvar-link:hover {
  color: var(--item-accent);
  text-shadow: 0 0 8px var(--item-accent);
}

/* Asset-card hover — mismo patrón de custom prop que .subvar-link arriba
   (pedido real founder 2026-08-25, "color de vault position cards que
   match con lp cards colors dependiendo del activo"): --pos-color la
   setea React por card (DepositCard.tsx) según el token real depositado
   (mismo mapa de colores que usan las LP cards del AMM), así cada card se
   resalta con SU color al pasar el mouse en vez del primary genérico. */
.asset-card-hover {
  border-color: color-mix(in srgb, var(--pos-color, var(--color-border)) 30%, transparent);
  transition: border-color 0.2s ease, background-color 0.2s ease;
}
.asset-card-hover:hover {
  border-color: var(--pos-color, var(--color-primary));
  background: color-mix(in srgb, var(--pos-color, var(--color-primary)) 4%, transparent);
}

/* Hover unificado "prism" — mismo criterio que .prism-item-hover, para que
   Bar 1 (nav top) y Bar 2 (subvar) se sientan iguales al pasar el mouse.
   Ya NO fuerza un color fijo (el #dde6f0 viejo quedaba casi invisible en
   light mode) — solo agrega el glow, el color lo sigue decidiendo React
   vía --nb-color (gris platinium neutro, ya theme-aware). */
.nav-glass-btn {
  /* Lee color y glow desde custom props puestas por React */
  color: var(--nb-color, rgba(255,255,255,0.55));
  text-shadow: var(--nb-glow, none);
  border: 1px solid transparent;
  transition: color 0.18s ease, text-shadow 0.18s ease;
}
.nav-glass-btn:hover {
  text-shadow: 0 0 8px rgba(56,189,248,0.5);
}
.selection\:bg-primary *::-moz-selection {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--primary) / var(--tw-bg-opacity, 1));
}
.selection\:bg-primary *::selection {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--primary) / var(--tw-bg-opacity, 1));
}
.selection\:text-primary-foreground *::-moz-selection {
  color: oklch(var(--primary-foreground));
}
.selection\:text-primary-foreground *::selection {
  color: oklch(var(--primary-foreground));
}
.selection\:bg-primary::-moz-selection {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--primary) / var(--tw-bg-opacity, 1));
}
.selection\:bg-primary::selection {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--primary) / var(--tw-bg-opacity, 1));
}
.selection\:text-primary-foreground::-moz-selection {
  color: oklch(var(--primary-foreground));
}
.selection\:text-primary-foreground::selection {
  color: oklch(var(--primary-foreground));
}
.file\:inline-flex::file-selector-button {
  display: inline-flex;
}
.file\:h-7::file-selector-button {
  height: 1.75rem;
}
.file\:border-0::file-selector-button {
  border-width: 0px;
}
.file\:bg-transparent::file-selector-button {
  background-color: transparent;
}
.file\:text-sm::file-selector-button {
  font-size: 0.875rem;
  line-height: 1.25rem;
}
.file\:font-medium::file-selector-button {
  font-weight: 500;
}
.file\:text-foreground::file-selector-button {
  color: oklch(var(--foreground));
}
.placeholder\:text-muted-foreground::-moz-placeholder {
  --tw-text-opacity: 1;
  color: oklch(var(--muted-foreground) / var(--tw-text-opacity, 1));
}
.placeholder\:text-muted-foreground::placeholder {
  --tw-text-opacity: 1;
  color: oklch(var(--muted-foreground) / var(--tw-text-opacity, 1));
}
.after\:absolute::after {
  content: var(--tw-content);
  position: absolute;
}
.after\:-inset-2::after {
  content: var(--tw-content);
  inset: -0.5rem;
}
.after\:inset-y-0::after {
  content: var(--tw-content);
  top: 0px;
  bottom: 0px;
}
.after\:left-1\/2::after {
  content: var(--tw-content);
  left: 50%;
}
.after\:w-1::after {
  content: var(--tw-content);
  width: 0.25rem;
}
.after\:w-\[2px\]::after {
  content: var(--tw-content);
  width: 2px;
}
.after\:-translate-x-1\/2::after {
  content: var(--tw-content);
  --tw-translate-x: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.first\:rounded-l-md:first-child {
  border-top-left-radius: calc(var(--radius) - 2px);
  border-bottom-left-radius: calc(var(--radius) - 2px);
}
.first\:border-l:first-child {
  border-left-width: 1px;
}
.last\:rounded-r-md:last-child {
  border-top-right-radius: calc(var(--radius) - 2px);
  border-bottom-right-radius: calc(var(--radius) - 2px);
}
.last\:border-0:last-child {
  border-width: 0px;
}
.last\:border-b-0:last-child {
  border-bottom-width: 0px;
}
.hover\:bg-accent:hover {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--accent) / var(--tw-bg-opacity, 1));
}
.hover\:bg-amber-500\/10:hover {
  background-color: rgb(245 158 11 / 0.1);
}
.hover\:bg-amber-500\/20:hover {
  background-color: rgb(245 158 11 / 0.2);
}
.hover\:bg-destructive\/10:hover {
  background-color: oklch(var(--destructive) / 0.1);
}
.hover\:bg-destructive\/90:hover {
  background-color: oklch(var(--destructive) / 0.9);
}
.hover\:bg-emerald-500\/20:hover {
  background-color: rgb(16 185 129 / 0.2);
}
.hover\:bg-emerald-500\/30:hover {
  background-color: rgb(16 185 129 / 0.3);
}
.hover\:bg-muted:hover {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--muted) / var(--tw-bg-opacity, 1));
}
.hover\:bg-muted\/20:hover {
  background-color: oklch(var(--muted) / 0.2);
}
.hover\:bg-muted\/50:hover {
  background-color: oklch(var(--muted) / 0.5);
}
.hover\:bg-primary\/10:hover {
  background-color: oklch(var(--primary) / 0.1);
}
.hover\:bg-primary\/90:hover {
  background-color: oklch(var(--primary) / 0.9);
}
.hover\:bg-red-500\/10:hover {
  background-color: rgb(239 68 68 / 0.1);
}
.hover\:bg-red-500\/20:hover {
  background-color: rgb(239 68 68 / 0.2);
}
.hover\:bg-secondary\/80:hover {
  background-color: oklch(var(--secondary) / 0.8);
}
.hover\:bg-sidebar-accent:hover {
  background-color: oklch(var(--sidebar-accent));
}
.hover\:bg-white\/10:hover {
  background-color: rgb(255 255 255 / 0.1);
}
.hover\:bg-white\/5:hover {
  background-color: rgb(255 255 255 / 0.05);
}
.hover\:text-accent-foreground:hover {
  color: oklch(var(--accent-foreground));
}
.hover\:text-amber-300:hover {
  --tw-text-opacity: 1;
  color: rgb(252 211 77 / var(--tw-text-opacity, 1));
}
.hover\:text-cyan-200:hover {
  --tw-text-opacity: 1;
  color: rgb(165 243 252 / var(--tw-text-opacity, 1));
}
.hover\:text-foreground:hover {
  color: oklch(var(--foreground));
}
.hover\:text-muted-foreground:hover {
  --tw-text-opacity: 1;
  color: oklch(var(--muted-foreground) / var(--tw-text-opacity, 1));
}
.hover\:text-purple-300:hover {
  --tw-text-opacity: 1;
  color: rgb(216 180 254 / var(--tw-text-opacity, 1));
}
.hover\:text-red-400:hover {
  --tw-text-opacity: 1;
  color: rgb(248 113 113 / var(--tw-text-opacity, 1));
}
.hover\:text-sidebar-accent-foreground:hover {
  color: oklch(var(--sidebar-accent-foreground));
}
.hover\:text-white:hover {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.hover\:text-white\/70:hover {
  color: rgb(255 255 255 / 0.7);
}
.hover\:text-white\/80:hover {
  color: rgb(255 255 255 / 0.8);
}
.hover\:text-white\/90:hover {
  color: rgb(255 255 255 / 0.9);
}
.hover\:underline:hover {
  text-decoration-line: underline;
}
.hover\:opacity-100:hover {
  opacity: 1;
}
.hover\:opacity-80:hover {
  opacity: 0.8;
}
.hover\:shadow-\[0_0_0_1px_hsl\(var\(--sidebar-accent\)\)\]:hover {
  --tw-shadow: 0 0 0 1px hsl(var(--sidebar-accent));
  --tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.hover\:shadow-\[0_0_20px_rgba\(139\2c 92\2c 246\2c 0\.3\)\]:hover {
  --tw-shadow: 0 0 20px rgba(139,92,246,0.3);
  --tw-shadow-colored: 0 0 20px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.hover\:ring-4:hover {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.hover\:after\:bg-sidebar-border:hover::after {
  content: var(--tw-content);
  background-color: oklch(var(--sidebar-border));
}
.focus\:z-10:focus {
  z-index: 10;
}
.focus\:bg-accent:focus {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--accent) / var(--tw-bg-opacity, 1));
}
.focus\:text-accent-foreground:focus {
  color: oklch(var(--accent-foreground));
}
.focus\:ring-2:focus {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.focus\:ring-ring:focus {
  --tw-ring-opacity: 1;
  --tw-ring-color: oklch(var(--ring) / var(--tw-ring-opacity, 1));
}
.focus\:ring-offset-2:focus {
  --tw-ring-offset-width: 2px;
}
.focus-visible\:z-10:focus-visible {
  z-index: 10;
}
.focus-visible\:border-ring:focus-visible {
  --tw-border-opacity: 1;
  border-color: oklch(var(--ring) / var(--tw-border-opacity, 1));
}
.focus-visible\:outline-1:focus-visible {
  outline-width: 1px;
}
.focus-visible\:outline-ring:focus-visible {
  outline-color: oklch(var(--ring) / 1);
}
.focus-visible\:ring-1:focus-visible {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.focus-visible\:ring-2:focus-visible {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.focus-visible\:ring-4:focus-visible {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.focus-visible\:ring-\[3px\]:focus-visible {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.focus-visible\:ring-destructive\/20:focus-visible {
  --tw-ring-color: oklch(var(--destructive) / 0.2);
}
.focus-visible\:ring-ring:focus-visible {
  --tw-ring-opacity: 1;
  --tw-ring-color: oklch(var(--ring) / var(--tw-ring-opacity, 1));
}
.focus-visible\:ring-ring\/50:focus-visible {
  --tw-ring-color: oklch(var(--ring) / 0.5);
}
.focus-visible\:ring-offset-1:focus-visible {
  --tw-ring-offset-width: 1px;
}
.active\:bg-sidebar-accent:active {
  background-color: oklch(var(--sidebar-accent));
}
.active\:text-sidebar-accent-foreground:active {
  color: oklch(var(--sidebar-accent-foreground));
}
.disabled\:pointer-events-none:disabled {
  pointer-events: none;
}
.disabled\:cursor-not-allowed:disabled {
  cursor: not-allowed;
}
.disabled\:opacity-40:disabled {
  opacity: 0.4;
}
.disabled\:opacity-50:disabled {
  opacity: 0.5;
}
.group\/menu-item:focus-within .group-focus-within\/menu-item\:opacity-100 {
  opacity: 1;
}
.group:hover .group-hover\:block {
  display: block;
}
.group:hover .group-hover\:border-white\/20 {
  border-color: rgb(255 255 255 / 0.2);
}
.group\/menu-item:hover .group-hover\/menu-item\:opacity-100 {
  opacity: 1;
}
.peer\/menu-button:hover ~ .peer-hover\/menu-button\:text-sidebar-accent-foreground {
  color: oklch(var(--sidebar-accent-foreground));
}
.peer:disabled ~ .peer-disabled\:cursor-not-allowed {
  cursor: not-allowed;
}
.peer:disabled ~ .peer-disabled\:opacity-50 {
  opacity: 0.5;
}
.has-\[\>svg\]\:grid-cols-\[calc\(var\(--spacing\)\*4\)_1fr\]:has(>svg) {
  grid-template-columns: calc(var(--spacing) * 4) 1fr;
}
.has-\[\>svg\]\:gap-x-3:has(>svg) {
  -moz-column-gap: 0.75rem;
       column-gap: 0.75rem;
}
.has-\[\>svg\]\:px-2\.5:has(>svg) {
  padding-left: 0.625rem;
  padding-right: 0.625rem;
}
.has-\[\>svg\]\:px-3:has(>svg) {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}
.has-\[\>svg\]\:px-4:has(>svg) {
  padding-left: 1rem;
  padding-right: 1rem;
}
.aria-disabled\:pointer-events-none[aria-disabled="true"] {
  pointer-events: none;
}
.aria-disabled\:opacity-50[aria-disabled="true"] {
  opacity: 0.5;
}
.aria-selected\:text-muted-foreground[aria-selected="true"] {
  --tw-text-opacity: 1;
  color: oklch(var(--muted-foreground) / var(--tw-text-opacity, 1));
}
.data-\[disabled\=true\]\:pointer-events-none[data-disabled="true"] {
  pointer-events: none;
}
.data-\[disabled\]\:pointer-events-none[data-disabled] {
  pointer-events: none;
}
.data-\[vaul-drawer-direction\=bottom\]\:inset-x-0[data-vaul-drawer-direction="bottom"] {
  left: 0px;
  right: 0px;
}
.data-\[vaul-drawer-direction\=left\]\:inset-y-0[data-vaul-drawer-direction="left"] {
  top: 0px;
  bottom: 0px;
}
.data-\[vaul-drawer-direction\=right\]\:inset-y-0[data-vaul-drawer-direction="right"] {
  top: 0px;
  bottom: 0px;
}
.data-\[vaul-drawer-direction\=top\]\:inset-x-0[data-vaul-drawer-direction="top"] {
  left: 0px;
  right: 0px;
}
.data-\[vaul-drawer-direction\=bottom\]\:bottom-0[data-vaul-drawer-direction="bottom"] {
  bottom: 0px;
}
.data-\[vaul-drawer-direction\=left\]\:left-0[data-vaul-drawer-direction="left"] {
  left: 0px;
}
.data-\[vaul-drawer-direction\=right\]\:right-0[data-vaul-drawer-direction="right"] {
  right: 0px;
}
.data-\[vaul-drawer-direction\=top\]\:top-0[data-vaul-drawer-direction="top"] {
  top: 0px;
}
.data-\[active\=true\]\:z-10[data-active="true"] {
  z-index: 10;
}
.data-\[vaul-drawer-direction\=bottom\]\:mt-24[data-vaul-drawer-direction="bottom"] {
  margin-top: 6rem;
}
.data-\[vaul-drawer-direction\=top\]\:mb-24[data-vaul-drawer-direction="top"] {
  margin-bottom: 6rem;
}
.data-\[orientation\=horizontal\]\:h-1\.5[data-orientation="horizontal"] {
  height: 0.375rem;
}
.data-\[orientation\=horizontal\]\:h-full[data-orientation="horizontal"] {
  height: 100%;
}
.data-\[orientation\=horizontal\]\:h-px[data-orientation="horizontal"] {
  height: 1px;
}
.data-\[orientation\=vertical\]\:h-full[data-orientation="vertical"] {
  height: 100%;
}
.data-\[panel-group-direction\=vertical\]\:h-px[data-panel-group-direction="vertical"] {
  height: 1px;
}
.data-\[size\=default\]\:h-9[data-size="default"] {
  height: 2.25rem;
}
.data-\[size\=sm\]\:h-8[data-size="sm"] {
  height: 2rem;
}
.data-\[vaul-drawer-direction\=bottom\]\:max-h-\[80vh\][data-vaul-drawer-direction="bottom"] {
  max-height: 80vh;
}
.data-\[vaul-drawer-direction\=top\]\:max-h-\[80vh\][data-vaul-drawer-direction="top"] {
  max-height: 80vh;
}
.data-\[orientation\=vertical\]\:min-h-44[data-orientation="vertical"] {
  min-height: 11rem;
}
.data-\[orientation\=horizontal\]\:w-full[data-orientation="horizontal"] {
  width: 100%;
}
.data-\[orientation\=vertical\]\:w-1\.5[data-orientation="vertical"] {
  width: 0.375rem;
}
.data-\[orientation\=vertical\]\:w-auto[data-orientation="vertical"] {
  width: auto;
}
.data-\[orientation\=vertical\]\:w-full[data-orientation="vertical"] {
  width: 100%;
}
.data-\[orientation\=vertical\]\:w-px[data-orientation="vertical"] {
  width: 1px;
}
.data-\[panel-group-direction\=vertical\]\:w-full[data-panel-group-direction="vertical"] {
  width: 100%;
}
.data-\[vaul-drawer-direction\=left\]\:w-3\/4[data-vaul-drawer-direction="left"] {
  width: 75%;
}
.data-\[vaul-drawer-direction\=right\]\:w-3\/4[data-vaul-drawer-direction="right"] {
  width: 75%;
}
.data-\[side\=bottom\]\:translate-y-1[data-side="bottom"] {
  --tw-translate-y: 0.25rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.data-\[side\=left\]\:-translate-x-1[data-side="left"] {
  --tw-translate-x: -0.25rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.data-\[side\=right\]\:translate-x-1[data-side="right"] {
  --tw-translate-x: 0.25rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.data-\[side\=top\]\:-translate-y-1[data-side="top"] {
  --tw-translate-y: -0.25rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.data-\[state\=checked\]\:translate-x-\[calc\(100\%-2px\)\][data-state="checked"] {
  --tw-translate-x: calc(100% - 2px);
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.data-\[state\=unchecked\]\:translate-x-0[data-state="unchecked"] {
  --tw-translate-x: 0px;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
@keyframes accordion-up {

  from {
    height: var(--radix-accordion-content-height);
  }

  to {
    height: 0;
  }
}
.data-\[state\=closed\]\:animate-accordion-up[data-state="closed"] {
  animation: accordion-up 0.2s ease-out;
}
@keyframes accordion-down {

  from {
    height: 0;
  }

  to {
    height: var(--radix-accordion-content-height);
  }
}
.data-\[state\=open\]\:animate-accordion-down[data-state="open"] {
  animation: accordion-down 0.2s ease-out;
}
.data-\[orientation\=vertical\]\:flex-col[data-orientation="vertical"] {
  flex-direction: column;
}
.data-\[panel-group-direction\=vertical\]\:flex-col[data-panel-group-direction="vertical"] {
  flex-direction: column;
}
.data-\[range-end\=true\]\:rounded-md[data-range-end="true"] {
  border-radius: calc(var(--radius) - 2px);
}
.data-\[range-middle\=true\]\:rounded-none[data-range-middle="true"] {
  border-radius: 0px;
}
.data-\[range-start\=true\]\:rounded-md[data-range-start="true"] {
  border-radius: calc(var(--radius) - 2px);
}
.data-\[selected\=true\]\:rounded-none[data-selected="true"] {
  border-radius: 0px;
}
.data-\[range-end\=true\]\:rounded-r-md[data-range-end="true"] {
  border-top-right-radius: calc(var(--radius) - 2px);
  border-bottom-right-radius: calc(var(--radius) - 2px);
}
.data-\[range-start\=true\]\:rounded-l-md[data-range-start="true"] {
  border-top-left-radius: calc(var(--radius) - 2px);
  border-bottom-left-radius: calc(var(--radius) - 2px);
}
.data-\[vaul-drawer-direction\=bottom\]\:rounded-t-lg[data-vaul-drawer-direction="bottom"] {
  border-top-left-radius: var(--radius);
  border-top-right-radius: var(--radius);
}
.data-\[vaul-drawer-direction\=top\]\:rounded-b-lg[data-vaul-drawer-direction="top"] {
  border-bottom-right-radius: var(--radius);
  border-bottom-left-radius: var(--radius);
}
.data-\[variant\=outline\]\:border-l-0[data-variant="outline"] {
  border-left-width: 0px;
}
.data-\[vaul-drawer-direction\=bottom\]\:border-t[data-vaul-drawer-direction="bottom"] {
  border-top-width: 1px;
}
.data-\[vaul-drawer-direction\=left\]\:border-r[data-vaul-drawer-direction="left"] {
  border-right-width: 1px;
}
.data-\[vaul-drawer-direction\=right\]\:border-l[data-vaul-drawer-direction="right"] {
  border-left-width: 1px;
}
.data-\[vaul-drawer-direction\=top\]\:border-b[data-vaul-drawer-direction="top"] {
  border-bottom-width: 1px;
}
.data-\[active\=true\]\:border-ring[data-active="true"] {
  --tw-border-opacity: 1;
  border-color: oklch(var(--ring) / var(--tw-border-opacity, 1));
}
.data-\[state\=checked\]\:border-primary[data-state="checked"] {
  --tw-border-opacity: 1;
  border-color: oklch(var(--primary) / var(--tw-border-opacity, 1));
}
.data-\[active\=true\]\:bg-accent\/50[data-active="true"] {
  background-color: oklch(var(--accent) / 0.5);
}
.data-\[active\=true\]\:bg-sidebar-accent[data-active="true"] {
  background-color: oklch(var(--sidebar-accent));
}
.data-\[range-end\=true\]\:bg-primary[data-range-end="true"] {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--primary) / var(--tw-bg-opacity, 1));
}
.data-\[range-middle\=true\]\:bg-accent[data-range-middle="true"] {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--accent) / var(--tw-bg-opacity, 1));
}
.data-\[range-start\=true\]\:bg-primary[data-range-start="true"] {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--primary) / var(--tw-bg-opacity, 1));
}
.data-\[selected-single\=true\]\:bg-primary[data-selected-single="true"] {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--primary) / var(--tw-bg-opacity, 1));
}
.data-\[selected\=true\]\:bg-accent[data-selected="true"] {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--accent) / var(--tw-bg-opacity, 1));
}
.data-\[state\=active\]\:bg-background[data-state="active"] {
  background-color: oklch(var(--background));
}
.data-\[state\=checked\]\:bg-primary[data-state="checked"] {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--primary) / var(--tw-bg-opacity, 1));
}
.data-\[state\=on\]\:bg-accent[data-state="on"] {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--accent) / var(--tw-bg-opacity, 1));
}
.data-\[state\=open\]\:bg-accent[data-state="open"] {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--accent) / var(--tw-bg-opacity, 1));
}
.data-\[state\=open\]\:bg-accent\/50[data-state="open"] {
  background-color: oklch(var(--accent) / 0.5);
}
.data-\[state\=open\]\:bg-secondary[data-state="open"] {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--secondary) / var(--tw-bg-opacity, 1));
}
.data-\[state\=selected\]\:bg-muted[data-state="selected"] {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--muted) / var(--tw-bg-opacity, 1));
}
.data-\[state\=unchecked\]\:bg-input[data-state="unchecked"] {
  background-color: oklch(var(--input));
}
.data-\[inset\]\:pl-8[data-inset] {
  padding-left: 2rem;
}
.data-\[active\=true\]\:font-medium[data-active="true"] {
  font-weight: 500;
}
.data-\[active\=true\]\:text-accent-foreground[data-active="true"] {
  color: oklch(var(--accent-foreground));
}
.data-\[active\=true\]\:text-sidebar-accent-foreground[data-active="true"] {
  color: oklch(var(--sidebar-accent-foreground));
}
.data-\[error\=true\]\:text-destructive[data-error="true"] {
  --tw-text-opacity: 1;
  color: oklch(var(--destructive) / var(--tw-text-opacity, 1));
}
.data-\[placeholder\]\:text-muted-foreground[data-placeholder] {
  --tw-text-opacity: 1;
  color: oklch(var(--muted-foreground) / var(--tw-text-opacity, 1));
}
.data-\[range-end\=true\]\:text-primary-foreground[data-range-end="true"] {
  color: oklch(var(--primary-foreground));
}
.data-\[range-middle\=true\]\:text-accent-foreground[data-range-middle="true"] {
  color: oklch(var(--accent-foreground));
}
.data-\[range-start\=true\]\:text-primary-foreground[data-range-start="true"] {
  color: oklch(var(--primary-foreground));
}
.data-\[selected-single\=true\]\:text-primary-foreground[data-selected-single="true"] {
  color: oklch(var(--primary-foreground));
}
.data-\[selected\=true\]\:text-accent-foreground[data-selected="true"] {
  color: oklch(var(--accent-foreground));
}
.data-\[state\=checked\]\:text-primary-foreground[data-state="checked"] {
  color: oklch(var(--primary-foreground));
}
.data-\[state\=on\]\:text-accent-foreground[data-state="on"] {
  color: oklch(var(--accent-foreground));
}
.data-\[state\=open\]\:text-accent-foreground[data-state="open"] {
  color: oklch(var(--accent-foreground));
}
.data-\[state\=open\]\:text-muted-foreground[data-state="open"] {
  --tw-text-opacity: 1;
  color: oklch(var(--muted-foreground) / var(--tw-text-opacity, 1));
}
.data-\[variant\=destructive\]\:text-destructive[data-variant="destructive"] {
  --tw-text-opacity: 1;
  color: oklch(var(--destructive) / var(--tw-text-opacity, 1));
}
.data-\[disabled\=true\]\:opacity-50[data-disabled="true"] {
  opacity: 0.5;
}
.data-\[disabled\]\:opacity-50[data-disabled] {
  opacity: 0.5;
}
.data-\[state\=open\]\:opacity-100[data-state="open"] {
  opacity: 1;
}
.data-\[state\=active\]\:shadow-sm[data-state="active"] {
  --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.data-\[variant\=outline\]\:shadow-xs[data-variant="outline"] {
  --tw-shadow: 0 1px 2px 0 rgba(0,0,0,0.05);
  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.data-\[active\=true\]\:ring-\[3px\][data-active="true"] {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.data-\[active\=true\]\:ring-ring\/50[data-active="true"] {
  --tw-ring-color: oklch(var(--ring) / 0.5);
}
.data-\[state\=closed\]\:duration-300[data-state="closed"] {
  transition-duration: 300ms;
}
.data-\[state\=open\]\:duration-500[data-state="open"] {
  transition-duration: 500ms;
}
.data-\[motion\^\=from-\]\:animate-in[data-motion^="from-"] {
  animation-name: enter;
  animation-duration: 150ms;
  --tw-enter-opacity: initial;
  --tw-enter-scale: initial;
  --tw-enter-rotate: initial;
  --tw-enter-translate-x: initial;
  --tw-enter-translate-y: initial;
}
.data-\[state\=open\]\:animate-in[data-state="open"] {
  animation-name: enter;
  animation-duration: 150ms;
  --tw-enter-opacity: initial;
  --tw-enter-scale: initial;
  --tw-enter-rotate: initial;
  --tw-enter-translate-x: initial;
  --tw-enter-translate-y: initial;
}
.data-\[state\=visible\]\:animate-in[data-state="visible"] {
  animation-name: enter;
  animation-duration: 150ms;
  --tw-enter-opacity: initial;
  --tw-enter-scale: initial;
  --tw-enter-rotate: initial;
  --tw-enter-translate-x: initial;
  --tw-enter-translate-y: initial;
}
.data-\[motion\^\=to-\]\:animate-out[data-motion^="to-"] {
  animation-name: exit;
  animation-duration: 150ms;
  --tw-exit-opacity: initial;
  --tw-exit-scale: initial;
  --tw-exit-rotate: initial;
  --tw-exit-translate-x: initial;
  --tw-exit-translate-y: initial;
}
.data-\[state\=closed\]\:animate-out[data-state="closed"] {
  animation-name: exit;
  animation-duration: 150ms;
  --tw-exit-opacity: initial;
  --tw-exit-scale: initial;
  --tw-exit-rotate: initial;
  --tw-exit-translate-x: initial;
  --tw-exit-translate-y: initial;
}
.data-\[state\=hidden\]\:animate-out[data-state="hidden"] {
  animation-name: exit;
  animation-duration: 150ms;
  --tw-exit-opacity: initial;
  --tw-exit-scale: initial;
  --tw-exit-rotate: initial;
  --tw-exit-translate-x: initial;
  --tw-exit-translate-y: initial;
}
.data-\[motion\^\=from-\]\:fade-in[data-motion^="from-"] {
  --tw-enter-opacity: 0;
}
.data-\[motion\^\=to-\]\:fade-out[data-motion^="to-"] {
  --tw-exit-opacity: 0;
}
.data-\[state\=closed\]\:fade-out-0[data-state="closed"] {
  --tw-exit-opacity: 0;
}
.data-\[state\=hidden\]\:fade-out[data-state="hidden"] {
  --tw-exit-opacity: 0;
}
.data-\[state\=open\]\:fade-in-0[data-state="open"] {
  --tw-enter-opacity: 0;
}
.data-\[state\=visible\]\:fade-in[data-state="visible"] {
  --tw-enter-opacity: 0;
}
.data-\[state\=closed\]\:zoom-out-95[data-state="closed"] {
  --tw-exit-scale: .95;
}
.data-\[state\=open\]\:zoom-in-90[data-state="open"] {
  --tw-enter-scale: .9;
}
.data-\[state\=open\]\:zoom-in-95[data-state="open"] {
  --tw-enter-scale: .95;
}
.data-\[motion\=from-end\]\:slide-in-from-right-52[data-motion="from-end"] {
  --tw-enter-translate-x: 13rem;
}
.data-\[motion\=from-start\]\:slide-in-from-left-52[data-motion="from-start"] {
  --tw-enter-translate-x: -13rem;
}
.data-\[motion\=to-end\]\:slide-out-to-right-52[data-motion="to-end"] {
  --tw-exit-translate-x: 13rem;
}
.data-\[motion\=to-start\]\:slide-out-to-left-52[data-motion="to-start"] {
  --tw-exit-translate-x: -13rem;
}
.data-\[side\=bottom\]\:slide-in-from-top-2[data-side="bottom"] {
  --tw-enter-translate-y: -0.5rem;
}
.data-\[side\=left\]\:slide-in-from-right-2[data-side="left"] {
  --tw-enter-translate-x: 0.5rem;
}
.data-\[side\=right\]\:slide-in-from-left-2[data-side="right"] {
  --tw-enter-translate-x: -0.5rem;
}
.data-\[side\=top\]\:slide-in-from-bottom-2[data-side="top"] {
  --tw-enter-translate-y: 0.5rem;
}
.data-\[state\=closed\]\:slide-out-to-bottom[data-state="closed"] {
  --tw-exit-translate-y: 100%;
}
.data-\[state\=closed\]\:slide-out-to-left[data-state="closed"] {
  --tw-exit-translate-x: -100%;
}
.data-\[state\=closed\]\:slide-out-to-right[data-state="closed"] {
  --tw-exit-translate-x: 100%;
}
.data-\[state\=closed\]\:slide-out-to-top[data-state="closed"] {
  --tw-exit-translate-y: -100%;
}
.data-\[state\=open\]\:slide-in-from-bottom[data-state="open"] {
  --tw-enter-translate-y: 100%;
}
.data-\[state\=open\]\:slide-in-from-left[data-state="open"] {
  --tw-enter-translate-x: -100%;
}
.data-\[state\=open\]\:slide-in-from-right[data-state="open"] {
  --tw-enter-translate-x: 100%;
}
.data-\[state\=open\]\:slide-in-from-top[data-state="open"] {
  --tw-enter-translate-y: -100%;
}
.data-\[state\=closed\]\:duration-300[data-state="closed"] {
  animation-duration: 300ms;
}
.data-\[state\=open\]\:duration-500[data-state="open"] {
  animation-duration: 500ms;
}
.\*\:data-\[slot\=select-value\]\:line-clamp-1[data-slot="select-value"] > * {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}
.\*\:data-\[slot\=select-value\]\:flex[data-slot="select-value"] > * {
  display: flex;
}
.\*\:data-\[slot\=select-value\]\:items-center[data-slot="select-value"] > * {
  align-items: center;
}
.\*\:data-\[slot\=select-value\]\:gap-2[data-slot="select-value"] > * {
  gap: 0.5rem;
}
.\*\:data-\[slot\=alert-description\]\:text-destructive\/90[data-slot="alert-description"] > * {
  color: oklch(var(--destructive) / 0.9);
}
.data-\[panel-group-direction\=vertical\]\:after\:left-0[data-panel-group-direction="vertical"]::after {
  content: var(--tw-content);
  left: 0px;
}
.data-\[panel-group-direction\=vertical\]\:after\:h-1[data-panel-group-direction="vertical"]::after {
  content: var(--tw-content);
  height: 0.25rem;
}
.data-\[panel-group-direction\=vertical\]\:after\:w-full[data-panel-group-direction="vertical"]::after {
  content: var(--tw-content);
  width: 100%;
}
.data-\[panel-group-direction\=vertical\]\:after\:-translate-y-1\/2[data-panel-group-direction="vertical"]::after {
  content: var(--tw-content);
  --tw-translate-y: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.data-\[panel-group-direction\=vertical\]\:after\:translate-x-0[data-panel-group-direction="vertical"]::after {
  content: var(--tw-content);
  --tw-translate-x: 0px;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.data-\[variant\=outline\]\:first\:border-l:first-child[data-variant="outline"] {
  border-left-width: 1px;
}
.data-\[active\=true\]\:hover\:bg-accent:hover[data-active="true"] {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--accent) / var(--tw-bg-opacity, 1));
}
.data-\[state\=open\]\:hover\:bg-accent:hover[data-state="open"] {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--accent) / var(--tw-bg-opacity, 1));
}
.data-\[state\=open\]\:hover\:bg-sidebar-accent:hover[data-state="open"] {
  background-color: oklch(var(--sidebar-accent));
}
.data-\[state\=open\]\:hover\:text-sidebar-accent-foreground:hover[data-state="open"] {
  color: oklch(var(--sidebar-accent-foreground));
}
.data-\[active\=true\]\:focus\:bg-accent:focus[data-active="true"] {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--accent) / var(--tw-bg-opacity, 1));
}
.data-\[state\=open\]\:focus\:bg-accent:focus[data-state="open"] {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--accent) / var(--tw-bg-opacity, 1));
}
.data-\[variant\=destructive\]\:focus\:bg-destructive\/10:focus[data-variant="destructive"] {
  background-color: oklch(var(--destructive) / 0.1);
}
.data-\[variant\=destructive\]\:focus\:text-destructive:focus[data-variant="destructive"] {
  --tw-text-opacity: 1;
  color: oklch(var(--destructive) / var(--tw-text-opacity, 1));
}
.group[data-disabled="true"] .group-data-\[disabled\=true\]\:pointer-events-none {
  pointer-events: none;
}
.group\/day[data-focused="true"] .group-data-\[focused\=true\]\/day\:relative {
  position: relative;
}
.group[data-collapsible="offcanvas"] .group-data-\[collapsible\=offcanvas\]\:left-\[calc\(var\(--sidebar-width\)\*-1\)\] {
  left: calc(var(--sidebar-width) * -1);
}
.group[data-collapsible="offcanvas"] .group-data-\[collapsible\=offcanvas\]\:right-\[calc\(var\(--sidebar-width\)\*-1\)\] {
  right: calc(var(--sidebar-width) * -1);
}
.group[data-side="left"] .group-data-\[side\=left\]\:-right-4 {
  right: -1rem;
}
.group[data-side="right"] .group-data-\[side\=right\]\:left-0 {
  left: 0px;
}
.group\/navigation-menu[data-viewport="false"] .group-data-\[viewport\=false\]\/navigation-menu\:top-full {
  top: 100%;
}
.group\/day[data-focused="true"] .group-data-\[focused\=true\]\/day\:z-10 {
  z-index: 10;
}
.group[data-collapsible="icon"] .group-data-\[collapsible\=icon\]\:-mt-8 {
  margin-top: -2rem;
}
.group\/navigation-menu[data-viewport="false"] .group-data-\[viewport\=false\]\/navigation-menu\:mt-1\.5 {
  margin-top: 0.375rem;
}
.group\/drawer-content[data-vaul-drawer-direction="bottom"] .group-data-\[vaul-drawer-direction\=bottom\]\/drawer-content\:block {
  display: block;
}
.group[data-collapsible="icon"] .group-data-\[collapsible\=icon\]\:hidden {
  display: none;
}
.group[data-collapsible="icon"] .group-data-\[collapsible\=icon\]\:w-\[calc\(var\(--sidebar-width-icon\)\+\(--spacing\(4\)\)\)\] {
  width: calc(var(--sidebar-width-icon) + (--spacing(4)));
}
.group[data-collapsible="icon"] .group-data-\[collapsible\=icon\]\:w-\[calc\(var\(--sidebar-width-icon\)\+\(--spacing\(4\)\)\+2px\)\] {
  width: calc(var(--sidebar-width-icon) + (--spacing(4)) + 2px);
}
.group[data-collapsible="offcanvas"] .group-data-\[collapsible\=offcanvas\]\:w-0 {
  width: 0px;
}
.group[data-collapsible="offcanvas"] .group-data-\[collapsible\=offcanvas\]\:translate-x-0 {
  --tw-translate-x: 0px;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.group[data-side="right"] .group-data-\[side\=right\]\:rotate-180 {
  --tw-rotate: 180deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.group[data-state="open"] .group-data-\[state\=open\]\:rotate-180 {
  --tw-rotate: 180deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.group[data-collapsible="icon"] .group-data-\[collapsible\=icon\]\:overflow-hidden {
  overflow: hidden;
}
.group\/navigation-menu[data-viewport="false"] .group-data-\[viewport\=false\]\/navigation-menu\:overflow-hidden {
  overflow: hidden;
}
.group[data-variant="floating"] .group-data-\[variant\=floating\]\:rounded-lg {
  border-radius: var(--radius);
}
.group\/navigation-menu[data-viewport="false"] .group-data-\[viewport\=false\]\/navigation-menu\:rounded-md {
  border-radius: calc(var(--radius) - 2px);
}
.group[data-variant="floating"] .group-data-\[variant\=floating\]\:border {
  border-width: 1px;
}
.group\/navigation-menu[data-viewport="false"] .group-data-\[viewport\=false\]\/navigation-menu\:border {
  border-width: 1px;
}
.group[data-side="left"] .group-data-\[side\=left\]\:border-r {
  border-right-width: 1px;
}
.group[data-side="right"] .group-data-\[side\=right\]\:border-l {
  border-left-width: 1px;
}
.group\/day[data-focused="true"] .group-data-\[focused\=true\]\/day\:border-ring {
  --tw-border-opacity: 1;
  border-color: oklch(var(--ring) / var(--tw-border-opacity, 1));
}
.group[data-variant="floating"] .group-data-\[variant\=floating\]\:border-sidebar-border {
  border-color: oklch(var(--sidebar-border));
}
.group\/navigation-menu[data-viewport="false"] .group-data-\[viewport\=false\]\/navigation-menu\:bg-popover {
  background-color: oklch(var(--popover));
}
.group\/drawer-content[data-vaul-drawer-direction="bottom"] .group-data-\[vaul-drawer-direction\=bottom\]\/drawer-content\:text-center {
  text-align: center;
}
.group\/drawer-content[data-vaul-drawer-direction="top"] .group-data-\[vaul-drawer-direction\=top\]\/drawer-content\:text-center {
  text-align: center;
}
.group\/navigation-menu[data-viewport="false"] .group-data-\[viewport\=false\]\/navigation-menu\:text-popover-foreground {
  color: oklch(var(--popover-foreground));
}
.group[data-collapsible="icon"] .group-data-\[collapsible\=icon\]\:opacity-0 {
  opacity: 0;
}
.group[data-disabled="true"] .group-data-\[disabled\=true\]\:opacity-50 {
  opacity: 0.5;
}
.group[data-variant="floating"] .group-data-\[variant\=floating\]\:shadow-sm {
  --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.group\/navigation-menu[data-viewport="false"] .group-data-\[viewport\=false\]\/navigation-menu\:shadow {
  --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.group\/day[data-focused="true"] .group-data-\[focused\=true\]\/day\:ring-\[3px\] {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.group\/day[data-focused="true"] .group-data-\[focused\=true\]\/day\:ring-ring\/50 {
  --tw-ring-color: oklch(var(--ring) / 0.5);
}
.group\/navigation-menu[data-viewport="false"] .group-data-\[viewport\=false\]\/navigation-menu\:duration-200 {
  transition-duration: 200ms;
  animation-duration: 200ms;
}
.group[data-collapsible="offcanvas"] .group-data-\[collapsible\=offcanvas\]\:after\:left-full::after {
  content: var(--tw-content);
  left: 100%;
}
.group[data-collapsible="offcanvas"] .hover\:group-data-\[collapsible\=offcanvas\]\:bg-sidebar:hover {
  background-color: oklch(var(--sidebar));
}
.group\/navigation-menu[data-viewport="false"] .group-data-\[viewport\=false\]\/navigation-menu\:data-\[state\=open\]\:animate-in[data-state="open"] {
  animation-name: enter;
  animation-duration: 150ms;
  --tw-enter-opacity: initial;
  --tw-enter-scale: initial;
  --tw-enter-rotate: initial;
  --tw-enter-translate-x: initial;
  --tw-enter-translate-y: initial;
}
.group\/navigation-menu[data-viewport="false"] .group-data-\[viewport\=false\]\/navigation-menu\:data-\[state\=closed\]\:animate-out[data-state="closed"] {
  animation-name: exit;
  animation-duration: 150ms;
  --tw-exit-opacity: initial;
  --tw-exit-scale: initial;
  --tw-exit-rotate: initial;
  --tw-exit-translate-x: initial;
  --tw-exit-translate-y: initial;
}
.group\/navigation-menu[data-viewport="false"] .group-data-\[viewport\=false\]\/navigation-menu\:data-\[state\=closed\]\:fade-out-0[data-state="closed"] {
  --tw-exit-opacity: 0;
}
.group\/navigation-menu[data-viewport="false"] .group-data-\[viewport\=false\]\/navigation-menu\:data-\[state\=open\]\:fade-in-0[data-state="open"] {
  --tw-enter-opacity: 0;
}
.group\/navigation-menu[data-viewport="false"] .group-data-\[viewport\=false\]\/navigation-menu\:data-\[state\=closed\]\:zoom-out-95[data-state="closed"] {
  --tw-exit-scale: .95;
}
.group\/navigation-menu[data-viewport="false"] .group-data-\[viewport\=false\]\/navigation-menu\:data-\[state\=open\]\:zoom-in-95[data-state="open"] {
  --tw-enter-scale: .95;
}
.peer\/menu-button[data-size="default"] ~ .peer-data-\[size\=default\]\/menu-button\:top-1\.5 {
  top: 0.375rem;
}
.peer\/menu-button[data-size="lg"] ~ .peer-data-\[size\=lg\]\/menu-button\:top-2\.5 {
  top: 0.625rem;
}
.peer\/menu-button[data-size="sm"] ~ .peer-data-\[size\=sm\]\/menu-button\:top-1 {
  top: 0.25rem;
}
.peer\/menu-button[data-active="true"] ~ .peer-data-\[active\=true\]\/menu-button\:text-sidebar-accent-foreground {
  color: oklch(var(--sidebar-accent-foreground));
}
.dark\:border-input:is(.dark *) {
  border-color: oklch(var(--input));
}
.dark\:bg-destructive\/60:is(.dark *) {
  background-color: oklch(var(--destructive) / 0.6);
}
.dark\:text-muted-foreground:is(.dark *) {
  --tw-text-opacity: 1;
  color: oklch(var(--muted-foreground) / var(--tw-text-opacity, 1));
}
.dark\:hover\:bg-accent\/50:hover:is(.dark *) {
  background-color: oklch(var(--accent) / 0.5);
}
.dark\:hover\:text-accent-foreground:hover:is(.dark *) {
  color: oklch(var(--accent-foreground));
}
.dark\:focus-visible\:ring-destructive\/40:focus-visible:is(.dark *) {
  --tw-ring-color: oklch(var(--destructive) / 0.4);
}
.dark\:data-\[state\=active\]\:border-input[data-state="active"]:is(.dark *) {
  border-color: oklch(var(--input));
}
.dark\:data-\[state\=checked\]\:bg-primary[data-state="checked"]:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--primary) / var(--tw-bg-opacity, 1));
}
.dark\:data-\[state\=checked\]\:bg-primary-foreground[data-state="checked"]:is(.dark *) {
  background-color: oklch(var(--primary-foreground));
}
.dark\:data-\[state\=unchecked\]\:bg-foreground[data-state="unchecked"]:is(.dark *) {
  background-color: oklch(var(--foreground));
}
.dark\:data-\[state\=active\]\:text-foreground[data-state="active"]:is(.dark *) {
  color: oklch(var(--foreground));
}
.dark\:data-\[variant\=destructive\]\:focus\:bg-destructive\/20:focus[data-variant="destructive"]:is(.dark *) {
  background-color: oklch(var(--destructive) / 0.2);
}
@media (min-width: 640px) {

  .sm\:block {
    display: block;
  }

  .sm\:inline {
    display: inline;
  }

  .sm\:flex {
    display: flex;
  }

  .sm\:max-w-lg {
    max-width: 32rem;
  }

  .sm\:max-w-sm {
    max-width: 24rem;
  }

  .sm\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .sm\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .sm\:grid-cols-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  .sm\:flex-row {
    flex-direction: row;
  }

  .sm\:justify-end {
    justify-content: flex-end;
  }

  .sm\:gap-2\.5 {
    gap: 0.625rem;
  }

  .sm\:px-6 {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }

  .sm\:pl-2\.5 {
    padding-left: 0.625rem;
  }

  .sm\:pr-2\.5 {
    padding-right: 0.625rem;
  }

  .sm\:text-left {
    text-align: left;
  }

  .data-\[vaul-drawer-direction\=left\]\:sm\:max-w-sm[data-vaul-drawer-direction="left"] {
    max-width: 24rem;
  }

  .data-\[vaul-drawer-direction\=right\]\:sm\:max-w-sm[data-vaul-drawer-direction="right"] {
    max-width: 24rem;
  }
}
@media (min-width: 768px) {

  .md\:absolute {
    position: absolute;
  }

  .md\:mx-4 {
    margin-left: 1rem;
    margin-right: 1rem;
  }

  .md\:mt-20 {
    margin-top: 5rem;
  }

  .md\:block {
    display: block;
  }

  .md\:flex {
    display: flex;
  }

  .md\:hidden {
    display: none;
  }

  .md\:h-auto {
    height: auto;
  }

  .md\:max-h-\[50vh\] {
    max-height: 50vh;
  }

  .md\:w-\[var\(--radix-navigation-menu-viewport-width\)\] {
    width: var(--radix-navigation-menu-viewport-width);
  }

  .md\:w-auto {
    width: auto;
  }

  .md\:max-w-md {
    max-width: 28rem;
  }

  .md\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .md\:grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .md\:flex-row {
    flex-direction: row;
  }

  .md\:gap-1\.5 {
    gap: 0.375rem;
  }

  .md\:rounded-2xl {
    border-radius: 1rem;
  }

  .md\:p-10 {
    padding: 2.5rem;
  }

  .md\:pb-0 {
    padding-bottom: 0px;
  }

  .md\:text-left {
    text-align: left;
  }

  .md\:text-3xl {
    font-size: 1.875rem;
    line-height: 2.25rem;
  }

  .md\:text-5xl {
    font-size: 3rem;
    line-height: 1;
  }

  .md\:text-base {
    font-size: 1rem;
    line-height: 1.5rem;
  }

  .md\:text-lg {
    font-size: 1.125rem;
    line-height: 1.75rem;
  }

  .md\:text-sm {
    font-size: 0.875rem;
    line-height: 1.25rem;
  }

  .md\:opacity-0 {
    opacity: 0;
  }

  .md\:after\:hidden::after {
    content: var(--tw-content);
    display: none;
  }

  .peer[data-variant="inset"] ~ .md\:peer-data-\[variant\=inset\]\:m-2 {
    margin: 0.5rem;
  }

  .peer[data-variant="inset"] ~ .md\:peer-data-\[variant\=inset\]\:ml-0 {
    margin-left: 0px;
  }

  .peer[data-variant="inset"][data-state="collapsed"] ~ .md\:peer-data-\[variant\=inset\]\:peer-data-\[state\=collapsed\]\:ml-2 {
    margin-left: 0.5rem;
  }

  .peer[data-variant="inset"] ~ .md\:peer-data-\[variant\=inset\]\:rounded-xl {
    border-radius: 0.75rem;
  }

  .peer[data-variant="inset"] ~ .md\:peer-data-\[variant\=inset\]\:shadow-sm {
    --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
    --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  }
}
@media (min-width: 1024px) {

  .lg\:col-span-2 {
    grid-column: span 2 / span 2;
  }

  .lg\:flex {
    display: flex;
  }

  .lg\:hidden {
    display: none;
  }

  .lg\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .lg\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .lg\:grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .lg\:grid-cols-\[minmax\(260px\2c 340px\)_1fr\] {
    grid-template-columns: minmax(260px,340px) 1fr;
  }

  .lg\:px-8 {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-width: 1280px) {

  .xl\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
.\[\&\:first-child\[data-selected\=true\]_button\]\:rounded-l-md:first-child[data-selected=true] button {
  border-top-left-radius: calc(var(--radius) - 2px);
  border-bottom-left-radius: calc(var(--radius) - 2px);
}
.\[\&\:has\(\[role\=checkbox\]\)\]\:pr-0:has([role=checkbox]) {
  padding-right: 0px;
}
.\[\&\:last-child\[data-selected\=true\]_button\]\:rounded-r-md:last-child[data-selected=true] button {
  border-top-right-radius: calc(var(--radius) - 2px);
  border-bottom-right-radius: calc(var(--radius) - 2px);
}
.\[\&\>\[role\=checkbox\]\]\:translate-y-\[2px\]>[role=checkbox] {
  --tw-translate-y: 2px;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.\[\&\>button\]\:hidden>button {
  display: none;
}
.\[\&\>span\:last-child\]\:truncate>span:last-child {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.\[\&\>span\]\:text-xs>span {
  font-size: 0.75rem;
  line-height: 1rem;
}
.\[\&\>span\]\:opacity-70>span {
  opacity: 0.7;
}
.\[\&\>svg\]\:pointer-events-none>svg {
  pointer-events: none;
}
.\[\&\>svg\]\:size-3>svg {
  width: 0.75rem;
  height: 0.75rem;
}
.\[\&\>svg\]\:size-3\.5>svg {
  width: 0.875rem;
  height: 0.875rem;
}
.\[\&\>svg\]\:size-4>svg {
  width: 1rem;
  height: 1rem;
}
.\[\&\>svg\]\:h-2\.5>svg {
  height: 0.625rem;
}
.\[\&\>svg\]\:h-3>svg {
  height: 0.75rem;
}
.\[\&\>svg\]\:w-2\.5>svg {
  width: 0.625rem;
}
.\[\&\>svg\]\:w-3>svg {
  width: 0.75rem;
}
.\[\&\>svg\]\:shrink-0>svg {
  flex-shrink: 0;
}
.\[\&\>svg\]\:translate-y-0\.5>svg {
  --tw-translate-y: 0.125rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.\[\&\>svg\]\:text-current>svg {
  color: currentColor;
}
.\[\&\>svg\]\:text-muted-foreground>svg {
  --tw-text-opacity: 1;
  color: oklch(var(--muted-foreground) / var(--tw-text-opacity, 1));
}
.\[\&\>svg\]\:text-sidebar-accent-foreground>svg {
  color: oklch(var(--sidebar-accent-foreground));
}
.\[\&\>tr\]\:last\:border-b-0:last-child>tr {
  border-bottom-width: 0px;
}
.\[\&\[data-panel-group-direction\=vertical\]\>div\]\:rotate-90[data-panel-group-direction=vertical]>div {
  --tw-rotate: 90deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.\[\&\[data-state\=open\]\>svg\]\:rotate-180[data-state=open]>svg {
  --tw-rotate: 180deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.\[\&_\.recharts-cartesian-axis-tick_text\]\:fill-muted-foreground .recharts-cartesian-axis-tick text {
  fill: oklch(var(--muted-foreground) / 1);
}
.\[\&_\.recharts-curve\.recharts-tooltip-cursor\]\:stroke-border .recharts-curve.recharts-tooltip-cursor {
  stroke: oklch(var(--border));
}
.\[\&_\.recharts-dot\[stroke\=\'\#fff\'\]\]\:stroke-transparent .recharts-dot[stroke='#fff'] {
  stroke: transparent;
}
.\[\&_\.recharts-polar-grid_\[stroke\=\'\#ccc\'\]\]\:stroke-border .recharts-polar-grid [stroke='#ccc'] {
  stroke: oklch(var(--border));
}
.\[\&_\.recharts-radial-bar-background-sector\]\:fill-muted .recharts-radial-bar-background-sector {
  fill: oklch(var(--muted) / 1);
}
.\[\&_\.recharts-rectangle\.recharts-tooltip-cursor\]\:fill-muted .recharts-rectangle.recharts-tooltip-cursor {
  fill: oklch(var(--muted) / 1);
}
.\[\&_\.recharts-reference-line_\[stroke\=\'\#ccc\'\]\]\:stroke-border .recharts-reference-line [stroke='#ccc'] {
  stroke: oklch(var(--border));
}
.\[\&_\.recharts-sector\[stroke\=\'\#fff\'\]\]\:stroke-transparent .recharts-sector[stroke='#fff'] {
  stroke: transparent;
}
.\[\&_\[cmdk-group-heading\]\]\:px-2 [cmdk-group-heading] {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}
.\[\&_\[cmdk-group-heading\]\]\:py-1\.5 [cmdk-group-heading] {
  padding-top: 0.375rem;
  padding-bottom: 0.375rem;
}
.\[\&_\[cmdk-group-heading\]\]\:text-xs [cmdk-group-heading] {
  font-size: 0.75rem;
  line-height: 1rem;
}
.\[\&_\[cmdk-group-heading\]\]\:font-medium [cmdk-group-heading] {
  font-weight: 500;
}
.\[\&_\[cmdk-group-heading\]\]\:text-muted-foreground [cmdk-group-heading] {
  --tw-text-opacity: 1;
  color: oklch(var(--muted-foreground) / var(--tw-text-opacity, 1));
}
.\[\&_\[cmdk-group\]\:not\(\[hidden\]\)_\~\[cmdk-group\]\]\:pt-0 [cmdk-group]:not([hidden]) ~[cmdk-group] {
  padding-top: 0px;
}
.\[\&_\[cmdk-group\]\]\:px-2 [cmdk-group] {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}
.\[\&_\[cmdk-input-wrapper\]_svg\]\:h-5 [cmdk-input-wrapper] svg {
  height: 1.25rem;
}
.\[\&_\[cmdk-input-wrapper\]_svg\]\:w-5 [cmdk-input-wrapper] svg {
  width: 1.25rem;
}
.\[\&_\[cmdk-input\]\]\:h-12 [cmdk-input] {
  height: 3rem;
}
.\[\&_\[cmdk-item\]\]\:px-2 [cmdk-item] {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}
.\[\&_\[cmdk-item\]\]\:py-3 [cmdk-item] {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}
.\[\&_\[cmdk-item\]_svg\]\:h-5 [cmdk-item] svg {
  height: 1.25rem;
}
.\[\&_\[cmdk-item\]_svg\]\:w-5 [cmdk-item] svg {
  width: 1.25rem;
}
.\[\&_p\]\:leading-relaxed p {
  line-height: 1.625;
}
.\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-4 svg:not([class*='size-']) {
  width: 1rem;
  height: 1rem;
}
.\[\&_svg\:not\(\[class\*\=\'text-\'\]\)\]\:text-muted-foreground svg:not([class*='text-']) {
  --tw-text-opacity: 1;
  color: oklch(var(--muted-foreground) / var(--tw-text-opacity, 1));
}
.\[\&_svg\]\:pointer-events-none svg {
  pointer-events: none;
}
.\[\&_svg\]\:shrink-0 svg {
  flex-shrink: 0;
}
.\[\&_tr\:last-child\]\:border-0 tr:last-child {
  border-width: 0px;
}
.\[\&_tr\]\:border-b tr {
  border-bottom-width: 1px;
}
[data-side=left][data-collapsible=offcanvas] .\[\[data-side\=left\]\[data-collapsible\=offcanvas\]_\&\]\:-right-2 {
  right: -0.5rem;
}
[data-side=left][data-state=collapsed] .\[\[data-side\=left\]\[data-state\=collapsed\]_\&\]\:cursor-e-resize {
  cursor: e-resize;
}
[data-side=right][data-collapsible=offcanvas] .\[\[data-side\=right\]\[data-collapsible\=offcanvas\]_\&\]\:-left-2 {
  left: -0.5rem;
}
[data-side=right][data-state=collapsed] .\[\[data-side\=right\]\[data-state\=collapsed\]_\&\]\:cursor-w-resize {
  cursor: w-resize;
}
[data-slot=card-content] .\[\[data-slot\=card-content\]_\&\]\:bg-transparent {
  background-color: transparent;
}
[data-slot=popover-content] .\[\[data-slot\=popover-content\]_\&\]\:bg-transparent {
  background-color: transparent;
}
a.\[a\&\]\:hover\:bg-accent:hover {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--accent) / var(--tw-bg-opacity, 1));
}
a.\[a\&\]\:hover\:bg-destructive\/90:hover {
  background-color: oklch(var(--destructive) / 0.9);
}
a.\[a\&\]\:hover\:bg-primary\/90:hover {
  background-color: oklch(var(--primary) / 0.9);
}
a.\[a\&\]\:hover\:bg-secondary\/90:hover {
  background-color: oklch(var(--secondary) / 0.9);
}
a.\[a\&\]\:hover\:text-accent-foreground:hover {
  color: oklch(var(--accent-foreground));
}
*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }:where(.ik-component,.ik-component *),:where(.ik-component,.ik-component *):after,:where(.ik-component,.ik-component *):before{border:0 solid #e5e7eb;box-sizing:border-box}:where(.ik-component,.ik-component *):after,:where(.ik-component,.ik-component *):before{--tw-content:""}.ik-component{-webkit-text-size-adjust:100%;font-feature-settings:normal;-webkit-tap-highlight-color:transparent;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-variation-settings:normal;line-height:1.5;line-height:inherit;margin:0;-moz-tab-size:4;-o-tab-size:4;tab-size:4}hr:where(.ik-component,.ik-component *){border-top-width:1px;color:inherit;height:0}abbr:where([title]):where(.ik-component,.ik-component *){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1:where(.ik-component,.ik-component *),h2:where(.ik-component,.ik-component *),h3:where(.ik-component,.ik-component *),h4:where(.ik-component,.ik-component *),h5:where(.ik-component,.ik-component *),h6:where(.ik-component,.ik-component *){font-size:inherit;font-weight:inherit}a:where(.ik-component,.ik-component *){color:inherit;text-decoration:inherit}b:where(.ik-component,.ik-component *),strong:where(.ik-component,.ik-component *){font-weight:bolder}code:where(.ik-component,.ik-component *),kbd:where(.ik-component,.ik-component *),pre:where(.ik-component,.ik-component *),samp:where(.ik-component,.ik-component *){font-feature-settings:normal;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em;font-variation-settings:normal}small:where(.ik-component,.ik-component *){font-size:80%}sub:where(.ik-component,.ik-component *),sup:where(.ik-component,.ik-component *){font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub:where(.ik-component,.ik-component *){bottom:-.25em}sup:where(.ik-component,.ik-component *){top:-.5em}table:where(.ik-component,.ik-component *){border-collapse:collapse;border-color:inherit;text-indent:0}button:where(.ik-component,.ik-component *),input:where(.ik-component,.ik-component *),optgroup:where(.ik-component,.ik-component *),select:where(.ik-component,.ik-component *),textarea:where(.ik-component,.ik-component *){font-feature-settings:inherit;color:inherit;font-family:inherit;font-size:100%;font-variation-settings:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;margin:0;padding:0}button:where(.ik-component,.ik-component *),select:where(.ik-component,.ik-component *){text-transform:none}button:where(.ik-component,.ik-component *),input:where([type=button]):where(.ik-component,.ik-component *),input:where([type=reset]):where(.ik-component,.ik-component *),input:where([type=submit]):where(.ik-component,.ik-component *){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring:where(.ik-component,.ik-component *){outline:auto}:-moz-ui-invalid:where(.ik-component,.ik-component *){box-shadow:none}progress:where(.ik-component,.ik-component *){vertical-align:baseline}:where(.ik-component,.ik-component *) ::-webkit-inner-spin-button,:where(.ik-component,.ik-component *) ::-webkit-outer-spin-button{height:auto}[type=search]:where(.ik-component,.ik-component *){-webkit-appearance:textfield;outline-offset:-2px}:where(.ik-component,.ik-component *) ::-webkit-search-decoration{-webkit-appearance:none}:where(.ik-component,.ik-component *) ::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary:where(.ik-component,.ik-component *){display:list-item}blockquote:where(.ik-component,.ik-component *),dd:where(.ik-component,.ik-component *),dl:where(.ik-component,.ik-component *),figure:where(.ik-component,.ik-component *),h1:where(.ik-component,.ik-component *),h2:where(.ik-component,.ik-component *),h3:where(.ik-component,.ik-component *),h4:where(.ik-component,.ik-component *),h5:where(.ik-component,.ik-component *),h6:where(.ik-component,.ik-component *),hr:where(.ik-component,.ik-component *),p:where(.ik-component,.ik-component *),pre:where(.ik-component,.ik-component *){margin:0}fieldset:where(.ik-component,.ik-component *){margin:0;padding:0}legend:where(.ik-component,.ik-component *){padding:0}menu:where(.ik-component,.ik-component *),ol:where(.ik-component,.ik-component *),ul:where(.ik-component,.ik-component *){list-style:none;margin:0;padding:0}dialog:where(.ik-component,.ik-component *){padding:0}textarea:where(.ik-component,.ik-component *){resize:vertical}:where(.ik-component,.ik-component *) input::-moz-placeholder,:where(.ik-component,.ik-component *) textarea::-moz-placeholder{color:#9ca3af;opacity:1}:where(.ik-component,.ik-component *) input::-moz-placeholder, :where(.ik-component,.ik-component *) textarea::-moz-placeholder{color:#9ca3af;opacity:1}:where(.ik-component,.ik-component *) input::placeholder,:where(.ik-component,.ik-component *) textarea::placeholder{color:#9ca3af;opacity:1}[role=button]:where(.ik-component,.ik-component *),button:where(.ik-component,.ik-component *){cursor:pointer}:disabled:where(.ik-component,.ik-component *){cursor:default}audio:where(.ik-component,.ik-component *),canvas:where(.ik-component,.ik-component *),embed:where(.ik-component,.ik-component *),iframe:where(.ik-component,.ik-component *),img:where(.ik-component,.ik-component *),object:where(.ik-component,.ik-component *),svg:where(.ik-component,.ik-component *),video:where(.ik-component,.ik-component *){display:block;vertical-align:middle}img:where(.ik-component,.ik-component *),video:where(.ik-component,.ik-component *){height:auto;max-width:100%}[hidden]:where(:not([hidden=until-found])):where(.ik-component,.ik-component *){display:none}.ik-fixed{position:fixed}.ik-relative{position:relative}.ik-inset-0{inset:0}.ik-left-\[50\%\]{left:50%}.ik-top-\[50\%\]{top:50%}.ik-z-\[1009\]{z-index:1009}.ik-z-\[1010\]{z-index:1010}.ik-z-\[1011\]{z-index:1011}.ik-z-\[999\]{z-index:999}.ik-mx-2{margin-left:.5rem;margin-right:.5rem}.ik-mx-auto{margin-left:auto;margin-right:auto}.ik-my-2{margin-bottom:.5rem;margin-top:.5rem}.ik-my-\[20px\]{margin-bottom:20px;margin-top:20px}.ik-ml-2{margin-left:.5rem}.ik-mr-2{margin-right:.5rem}.ik-mt-1{margin-top:.25rem}.ik-mt-2{margin-top:.5rem}.ik-mt-\[12px\]{margin-top:12px}.ik-block{display:block}.ik-inline-block{display:inline-block}.ik-flex{display:flex}.ik-hidden{display:none}.ik-h-5{height:1.25rem}.ik-h-6{height:1.5rem}.ik-h-8{height:2rem}.ik-h-\[40px\]{height:40px}.ik-h-\[48px\]{height:48px}.ik-h-full{height:100%}.ik-max-h-\[420px\]{max-height:420px}.ik-max-h-\[85vh\]{max-height:85vh}.ik-w-5{width:1.25rem}.ik-w-6{width:1.5rem}.ik-w-8{width:2rem}.ik-w-\[110px\]{width:110px}.ik-w-\[320px\]{width:320px}.ik-w-\[90vw\]{width:90vw}.ik-w-full{width:100%}.ik-min-w-\[140px\]{min-width:140px}.ik-min-w-\[320px\]{min-width:320px}.ik-max-w-\[490px\]{max-width:490px}.ik-flex-1{flex:1 1 0%}.ik-flex-shrink{flex-shrink:1}.ik-translate-x-\[-50\%\]{--tw-translate-x:-50%}.ik-translate-x-\[-50\%\],.ik-translate-y-\[-50\%\]{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.ik-translate-y-\[-50\%\]{--tw-translate-y:-50%}.ik-cursor-pointer{cursor:pointer}.ik-flex-col{flex-direction:column}.\!ik-items-start{align-items:flex-start!important}.ik-items-center{align-items:center}.ik-justify-center{justify-content:center}.ik-justify-between{justify-content:space-between}.ik-gap-2{gap:.5rem}.ik-gap-\[10px\]{gap:10px}.ik-gap-\[12px\]{gap:12px}.ik-space-x-2>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-left:calc(.5rem*(1 - var(--tw-space-x-reverse)));margin-right:calc(.5rem*var(--tw-space-x-reverse))}.ik-space-x-3>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-left:calc(.75rem*(1 - var(--tw-space-x-reverse)));margin-right:calc(.75rem*var(--tw-space-x-reverse))}.ik-overflow-auto{overflow:auto}.ik-rounded{border-radius:.25rem}.ik-rounded-3xl{border-radius:1.5rem}.ik-rounded-\[12px\]{border-radius:12px}.ik-rounded-\[13px\]{border-radius:13px}.ik-rounded-md{border-radius:.375rem}.ik-rounded-xl{border-radius:.75rem}.ik-border{border-width:1px}.ik-border-black\/5{border-color:rgba(0,0,0,.05)}.ik-border-gray-400{--tw-border-opacity:1;border-color:rgb(156 163 175/var(--tw-border-opacity,1))}.ik-border-teal-600{--tw-border-opacity:1;border-color:rgb(13 148 136/var(--tw-border-opacity,1))}.ik-border-transparent{border-color:transparent}.ik-border-zinc-700{--tw-border-opacity:1;border-color:rgb(63 63 70/var(--tw-border-opacity,1))}.ik-bg-\[\#FAFAFA\]{--tw-bg-opacity:1;background-color:rgb(250 250 250/var(--tw-bg-opacity,1))}.ik-bg-black{--tw-bg-opacity:1;background-color:rgb(0 0 0/var(--tw-bg-opacity,1))}.ik-bg-gray-200{--tw-bg-opacity:1;background-color:rgb(229 231 235/var(--tw-bg-opacity,1))}.ik-bg-primary{--tw-bg-opacity:1;background-color:rgb(20 111 104/var(--tw-bg-opacity,1))}.ik-bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.ik-bg-opacity-25{--tw-bg-opacity:0.25}.ik-fill-current{fill:currentColor}.ik-p-0{padding:0}.ik-p-2\.5{padding:.625rem}.ik-p-5{padding:1.25rem}.ik-p-\[20px\]{padding:20px}.ik-px-3{padding-left:.75rem;padding-right:.75rem}.ik-px-6{padding-left:1.5rem;padding-right:1.5rem}.ik-px-\[10px\]{padding-left:10px;padding-right:10px}.ik-px-\[15px\]{padding-left:15px;padding-right:15px}.ik-px-\[5px\]{padding-left:5px;padding-right:5px}.ik-py-1{padding-bottom:.25rem;padding-top:.25rem}.ik-py-2{padding-bottom:.5rem;padding-top:.5rem}.ik-py-3\.5{padding-bottom:.875rem;padding-top:.875rem}.ik-text-left{text-align:left}.ik-text-center{text-align:center}.ik-text-sm{font-size:.875rem;line-height:1.25rem}.ik-text-xs{font-size:.75rem;line-height:1rem}.ik-font-bold{font-weight:700}.ik-font-light{font-weight:300}.ik-font-normal{font-weight:400}.ik-font-semibold{font-weight:600}.ik-leading-\[16px\]{line-height:16px}.ik-leading-\[20px\]{line-height:20px}.ik-leading-\[25px\]{line-height:25px}.ik-text-black{--tw-text-opacity:1;color:rgb(0 0 0/var(--tw-text-opacity,1))}.ik-text-gray-400{--tw-text-opacity:1;color:rgb(156 163 175/var(--tw-text-opacity,1))}.ik-text-primary{--tw-text-opacity:1;color:rgb(20 111 104/var(--tw-text-opacity,1))}.ik-text-red-500{--tw-text-opacity:1;color:rgb(239 68 68/var(--tw-text-opacity,1))}.ik-text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.ik-shadow-\[0px_2px_10px_rgba\(0\,0\,0\,0\.03\)\]{--tw-shadow:0px 2px 10px rgba(0,0,0,.03);--tw-shadow-colored:0px 2px 10px var(--tw-shadow-color)}.ik-shadow-\[0px_2px_10px_rgba\(0\,0\,0\,0\.03\)\],.ik-shadow-lg{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.ik-shadow-lg{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color)}.ik-outline-none{outline:2px solid transparent;outline-offset:2px}.ik-backdrop-blur-\[2px\]{--tw-backdrop-blur:blur(2px);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.ik-transition{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1)}.\[--anchor-gap\:8px\]{--anchor-gap:8px}.hover\:ik-bg-gray-100:hover{--tw-bg-opacity:1;background-color:rgb(243 244 246/var(--tw-bg-opacity,1))}.hover\:ik-bg-gray-50:hover{--tw-bg-opacity:1;background-color:rgb(249 250 251/var(--tw-bg-opacity,1))}.hover\:ik-bg-teal-600:hover{--tw-bg-opacity:1;background-color:rgb(13 148 136/var(--tw-bg-opacity,1))}.hover\:ik-shadow-md:hover{--tw-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.focus\:ik-border-gray-400:focus{--tw-border-opacity:1;border-color:rgb(156 163 175/var(--tw-border-opacity,1))}.focus\:ik-outline-none:focus{outline:2px solid transparent;outline-offset:2px}.active\:ik-border-gray-200:active{--tw-border-opacity:1;border-color:rgb(229 231 235/var(--tw-border-opacity,1))}.active\:ik-border-primary:active{--tw-border-opacity:1;border-color:rgb(20 111 104/var(--tw-border-opacity,1))}.active\:ik-bg-gray-300:active{--tw-bg-opacity:1;background-color:rgb(209 213 219/var(--tw-bg-opacity,1))}.active\:ik-bg-teal-700:active{--tw-bg-opacity:1;background-color:rgb(15 118 110/var(--tw-bg-opacity,1))}.disabled\:ik-border-gray-300:disabled{--tw-border-opacity:1;border-color:rgb(209 213 219/var(--tw-border-opacity,1))}.disabled\:ik-bg-gray-300:disabled{--tw-bg-opacity:1;background-color:rgb(209 213 219/var(--tw-bg-opacity,1))}.disabled\:ik-shadow-none:disabled{--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.data-\[closed\]\:ik-scale-95[data-closed]{--tw-scale-x:.95;--tw-scale-y:.95}.data-\[closed\]\:ik-scale-95[data-closed],.data-\[closed\]\:ik-transform[data-closed]{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.data-\[closed\]\:ik-opacity-0[data-closed]{opacity:0}.data-\[enter\]\:ik-duration-100[data-enter]{transition-duration:.1s}.data-\[leave\]\:ik-duration-75[data-leave]{transition-duration:75ms}.data-\[enter\]\:ik-ease-out[data-enter]{transition-timing-function:cubic-bezier(0,0,.2,1)}.data-\[leave\]\:ik-ease-in[data-leave]{transition-timing-function:cubic-bezier(.4,0,1,1)}.dark\:ik-border-white\/5:where([data-identity-kit-theme*=dark],[data-identity-kit-theme*=dark] *){border-color:hsla(0,0%,100%,.05)}.dark\:ik-bg-black:where([data-identity-kit-theme*=dark],[data-identity-kit-theme*=dark] *){--tw-bg-opacity:1;background-color:rgb(0 0 0/var(--tw-bg-opacity,1))}.dark\:ik-bg-zinc-800:where([data-identity-kit-theme*=dark],[data-identity-kit-theme*=dark] *){--tw-bg-opacity:1;background-color:rgb(39 39 42/var(--tw-bg-opacity,1))}.dark\:ik-bg-zinc-900:where([data-identity-kit-theme*=dark],[data-identity-kit-theme*=dark] *){--tw-bg-opacity:1;background-color:rgb(24 24 27/var(--tw-bg-opacity,1))}.dark\:ik-text-teal-500:where([data-identity-kit-theme*=dark],[data-identity-kit-theme*=dark] *){--tw-text-opacity:1;color:rgb(20 184 166/var(--tw-text-opacity,1))}.dark\:ik-text-white:where([data-identity-kit-theme*=dark],[data-identity-kit-theme*=dark] *){--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.dark\:ik-text-zinc-400:where([data-identity-kit-theme*=dark],[data-identity-kit-theme*=dark] *){--tw-text-opacity:1;color:rgb(161 161 170/var(--tw-text-opacity,1))}.dark\:hover\:ik-bg-signerDarkHoverBg:hover:where([data-identity-kit-theme*=dark],[data-identity-kit-theme*=dark] *){--tw-bg-opacity:1;background-color:rgb(52 52 58/var(--tw-bg-opacity,1))}.dark\:disabled\:ik-border-zinc-700:disabled:where([data-identity-kit-theme*=dark],[data-identity-kit-theme*=dark] *){--tw-border-opacity:1;border-color:rgb(63 63 70/var(--tw-border-opacity,1))}.dark\:disabled\:ik-bg-zinc-700:disabled:where([data-identity-kit-theme*=dark],[data-identity-kit-theme*=dark] *){--tw-bg-opacity:1;background-color:rgb(63 63 70/var(--tw-bg-opacity,1))}