*, ::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: Space Grotesk, General Sans, system-ui, -apple-system, sans-serif; /* 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: Geist Mono, JetBrains Mono, Fira Code, 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 {
    --radius: 0.75rem;
    /* Light mode - softer cosmic theme */
    --background: 0.08 0.02 240;
    --foreground: 0.95 0.03 195;
    --card: 0.11 0.03 240;
    --card-foreground: 0.95 0.03 195;
    --popover: 0.1 0.03 240;
    --popover-foreground: 0.95 0.03 195;
    /* Neon cyan primary (from logo) */
    --primary: 0.85 0.22 195;
    --primary-foreground: 0.05 0.02 240;
    /* Purple accent (from logo gradient) */
    --secondary: 0.55 0.22 300;
    --secondary-foreground: 0.95 0.03 195;
    --muted: 0.15 0.04 240;
    --muted-foreground: 0.58 0.08 220;
    /* Magenta accent */
    --accent: 0.82 0.18 85;
    --accent-foreground: 0.05 0.02 240;
    --destructive: 0.6 0.24 25;
    --destructive-foreground: 0.95 0.03 195;
    --border: 0.2 0.06 240;
    --input: 0.18 0.05 240;
    --ring: 0.85 0.22 195;
    --chart-1: 0.85 0.22 195;
    --chart-2: 0.55 0.22 300;
    --chart-3: 0.82 0.18 85;
    --chart-4: 0.7 0.2 140;
    --chart-5: 0.65 0.18 210;
    /* DEX aggregator tokens — light mode */
    --dex-best: 0.86 0.2 165;
    --dex-best-foreground: 0.05 0.02 240;
    --dex-row-border: 0.32 0.08 195;
    --dex-selected: 0.85 0.22 195;
    --dex-selected-foreground: 0.05 0.02 240;
    --dex-disabled: 0.42 0.04 240;
    --dex-surface: 0.13 0.04 240;
  }

  .dark {
    /* Deep space background */
    --background: 0.06 0.025 240;
    --foreground: 0.95 0.04 195;
    /* Slightly lighter cards with subtle glow */
    --card: 0.1 0.035 240;
    --card-foreground: 0.95 0.04 195;
    --popover: 0.09 0.03 240;
    --popover-foreground: 0.95 0.04 195;
    /* Bright neon cyan primary */
    --primary: 0.88 0.24 195;
    --primary-foreground: 0.04 0.02 240;
    /* Deep purple secondary */
    --secondary: 0.45 0.24 300;
    --secondary-foreground: 0.95 0.04 195;
    --muted: 0.14 0.04 240;
    --muted-foreground: 0.6 0.1 220;
    /* Vibrant magenta accent */
    --accent: 0.84 0.2 85;
    --accent-foreground: 0.04 0.02 240;
    --destructive: 0.62 0.26 25;
    --destructive-foreground: 0.95 0.04 195;
    /* Subtle borders with cyan tint */
    --border: 0.22 0.07 240;
    --input: 0.2 0.06 240;
    /* Bright cyan ring */
    --ring: 0.88 0.24 195;
    --chart-1: 0.88 0.24 195;
    --chart-2: 0.55 0.24 300;
    --chart-3: 0.84 0.2 85;
    --chart-4: 0.72 0.22 140;
    --chart-5: 0.68 0.2 210;
    /* DEX aggregator tokens — dark mode */
    --dex-best: 0.9 0.22 165;
    --dex-best-foreground: 0.04 0.02 240;
    --dex-row-border: 0.34 0.1 195;
    --dex-selected: 0.88 0.24 195;
    --dex-selected-foreground: 0.04 0.02 240;
    --dex-disabled: 0.44 0.04 240;
    --dex-surface: 0.12 0.045 240;
  }

  * {
  border-color: oklch(var(--border));
}

  body {
  background-color: oklch(var(--background));
  color: oklch(var(--foreground));
    font-family: "Space Grotesk", system-ui, sans-serif;
    font-feature-settings: "rlig" 1, "calt" 1;
    font-size: 14px;
    background-image: radial-gradient(
        ellipse at 20% 15%,
        oklch(0.25 0.18 195 / 0.12) 0%,
        transparent 50%
      ),
      radial-gradient(
        ellipse at 80% 80%,
        oklch(0.25 0.18 300 / 0.1) 0%,
        transparent 50%
      ),
      radial-gradient(
        ellipse at 60% 40%,
        oklch(0.2 0.14 85 / 0.06) 0%,
        transparent 40%
      );
    background-attachment: fixed;
}

  /* Neon glow utilities - reduced intensity for medium size */
  .glow-cyan {
    box-shadow: 0 0 16px oklch(0.88 0.24 195 / 0.45), 0 0 40px
      oklch(0.88 0.24 195 / 0.2), 0 0 80px oklch(0.88 0.24 195 / 0.08);
  }

  .glow-purple {
    box-shadow: 0 0 16px oklch(0.55 0.24 300 / 0.45), 0 0 40px
      oklch(0.55 0.24 300 / 0.2), 0 0 80px oklch(0.55 0.24 300 / 0.08);
  }

  .glow-yellow {
    box-shadow: 0 0 16px oklch(0.84 0.2 85 / 0.45), 0 0 40px
      oklch(0.84 0.2 85 / 0.2), 0 0 80px oklch(0.84 0.2 85 / 0.08);
  }

  /* Enhanced focus states with neon glow */
  *:focus-visible {
    outline: none;
    box-shadow: 0 0 0 2px oklch(var(--background)), 0 0 0 3px oklch(var(--ring)),
      0 0 12px oklch(var(--ring) / 0.4);
  }
.container {
  width: 100%;
  margin-right: auto;
  margin-left: auto;
  padding-right: 1.5rem;
  padding-left: 1.5rem;
}
@media (min-width: 1200px) {

  .container {
    max-width: 1200px;
  }
}
.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;
}
.pointer-events-auto {
  pointer-events: auto;
}
.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-1 {
  bottom: -0.2rem;
}
.-bottom-12 {
  bottom: -2.4rem;
}
.-left-12 {
  left: -2.4rem;
}
.-right-1 {
  right: -0.2rem;
}
.-right-12 {
  right: -2.4rem;
}
.-top-12 {
  top: -2.4rem;
}
.bottom-0 {
  bottom: 0px;
}
.bottom-24 {
  bottom: 6rem;
}
.left-0 {
  left: 0px;
}
.left-1\/2 {
  left: 50%;
}
.left-2 {
  left: 0.4rem;
}
.left-\[50\%\] {
  left: 50%;
}
.right-0 {
  right: 0px;
}
.right-1 {
  right: 0.2rem;
}
.right-2 {
  right: 0.4rem;
}
.right-3 {
  right: 0.6rem;
}
.right-4 {
  right: 0.8rem;
}
.top-0 {
  top: 0px;
}
.top-1\.5 {
  top: 0.3rem;
}
.top-1\/2 {
  top: 50%;
}
.top-3\.5 {
  top: 0.7rem;
}
.top-4 {
  top: 0.8rem;
}
.top-\[1px\] {
  top: 1px;
}
.top-\[50\%\] {
  top: 50%;
}
.top-\[60\%\] {
  top: 60%;
}
.top-full {
  top: 100%;
}
.isolate {
  isolation: isolate;
}
.z-10 {
  z-index: 10;
}
.z-20 {
  z-index: 20;
}
.z-50 {
  z-index: 50;
}
.z-\[1\] {
  z-index: 1;
}
.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.2rem;
  margin-right: -0.2rem;
}
.mx-2 {
  margin-left: 0.4rem;
  margin-right: 0.4rem;
}
.mx-3\.5 {
  margin-left: 0.7rem;
  margin-right: 0.7rem;
}
.mx-auto {
  margin-left: auto;
  margin-right: auto;
}
.my-0\.5 {
  margin-top: 0.1rem;
  margin-bottom: 0.1rem;
}
.my-1 {
  margin-top: 0.2rem;
  margin-bottom: 0.2rem;
}
.-mb-1 {
  margin-bottom: -0.2rem;
}
.-ml-1 {
  margin-left: -0.2rem;
}
.-ml-4 {
  margin-left: -0.8rem;
}
.-mr-1 {
  margin-right: -0.2rem;
}
.-mt-1 {
  margin-top: -0.2rem;
}
.-mt-4 {
  margin-top: -0.8rem;
}
.mb-1 {
  margin-bottom: 0.2rem;
}
.mb-2 {
  margin-bottom: 0.4rem;
}
.mb-3 {
  margin-bottom: 0.6rem;
}
.mb-4 {
  margin-bottom: 0.8rem;
}
.mb-6 {
  margin-bottom: 1.2rem;
}
.ml-1 {
  margin-left: 0.2rem;
}
.ml-auto {
  margin-left: auto;
}
.mr-1 {
  margin-right: 0.2rem;
}
.mr-1\.5 {
  margin-right: 0.3rem;
}
.mr-2 {
  margin-right: 0.4rem;
}
.mt-0\.5 {
  margin-top: 0.1rem;
}
.mt-1 {
  margin-top: 0.2rem;
}
.mt-1\.5 {
  margin-top: 0.3rem;
}
.mt-2 {
  margin-top: 0.4rem;
}
.mt-4 {
  margin-top: 0.8rem;
}
.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 {
  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.4rem;
  height: 0.4rem;
}
.size-2\.5 {
  width: 0.5rem;
  height: 0.5rem;
}
.size-3 {
  width: 0.6rem;
  height: 0.6rem;
}
.size-3\.5 {
  width: 0.7rem;
  height: 0.7rem;
}
.size-4 {
  width: 0.8rem;
  height: 0.8rem;
}
.size-7 {
  width: 1.4rem;
  height: 1.4rem;
}
.size-8 {
  width: 1.6rem;
  height: 1.6rem;
}
.size-9 {
  width: 2.25rem;
  height: 2.25rem;
}
.size-auto {
  width: auto;
  height: auto;
}
.size-full {
  width: 100%;
  height: 100%;
}
.h-0\.5 {
  height: 0.1rem;
}
.h-1\.5 {
  height: 0.3rem;
}
.h-10 {
  height: 2rem;
}
.h-12 {
  height: 2.4rem;
}
.h-14 {
  height: 3.5rem;
}
.h-16 {
  height: 3.2rem;
}
.h-2 {
  height: 0.4rem;
}
.h-2\.5 {
  height: 0.5rem;
}
.h-3 {
  height: 0.6rem;
}
.h-3\.5 {
  height: 0.7rem;
}
.h-4 {
  height: 0.8rem;
}
.h-5 {
  height: 1rem;
}
.h-6 {
  height: 1.2rem;
}
.h-64 {
  height: 16rem;
}
.h-7 {
  height: 1.4rem;
}
.h-8 {
  height: 1.6rem;
}
.h-9 {
  height: 2.25rem;
}
.h-\[1\.15rem\] {
  height: 1.15rem;
}
.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-full {
  height: 100%;
}
.h-px {
  height: 1px;
}
.h-screen {
  height: 100vh;
}
.h-svh {
  height: 100svh;
}
.max-h-32 {
  max-height: 8rem;
}
.max-h-\[300px\] {
  max-height: 300px;
}
.max-h-\[42vh\] {
  max-height: 42vh;
}
.max-h-\[50vh\] {
  max-height: 50vh;
}
.max-h-\[calc\(100vh-2rem\)\] {
  max-height: calc(100vh - 2rem);
}
.min-h-0 {
  min-height: 0px;
}
.min-h-16 {
  min-height: 3.2rem;
}
.min-h-4 {
  min-height: 0.8rem;
}
.min-h-\[100px\] {
  min-height: 100px;
}
.min-h-\[36px\] {
  min-height: 36px;
}
.min-h-\[44px\] {
  min-height: 44px;
}
.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.2rem;
}
.w-1\.5 {
  width: 0.3rem;
}
.w-10 {
  width: 2rem;
}
.w-12 {
  width: 2.4rem;
}
.w-16 {
  width: 3.2rem;
}
.w-2 {
  width: 0.4rem;
}
.w-2\.5 {
  width: 0.5rem;
}
.w-24 {
  width: 6rem;
}
.w-3 {
  width: 0.6rem;
}
.w-3\.5 {
  width: 0.7rem;
}
.w-3\/4 {
  width: 75%;
}
.w-32 {
  width: 8rem;
}
.w-36 {
  width: 9rem;
}
.w-4 {
  width: 0.8rem;
}
.w-48 {
  width: 12rem;
}
.w-5 {
  width: 1rem;
}
.w-6 {
  width: 1.2rem;
}
.w-64 {
  width: 16rem;
}
.w-7 {
  width: 1.4rem;
}
.w-72 {
  width: 18rem;
}
.w-8 {
  width: 1.6rem;
}
.w-9 {
  width: 2.25rem;
}
.w-\[100px\] {
  width: 100px;
}
.w-\[300px\] {
  width: 300px;
}
.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: 2rem;
}
.min-w-2 {
  min-width: 0.4rem;
}
.min-w-5 {
  min-width: 1rem;
}
.min-w-8 {
  min-width: 1.6rem;
}
.min-w-9 {
  min-width: 2.25rem;
}
.min-w-\[12rem\] {
  min-width: 12rem;
}
.min-w-\[6rem\] {
  min-width: 6rem;
}
.min-w-\[8rem\] {
  min-width: 8rem;
}
.min-w-\[var\(--radix-select-trigger-width\)\] {
  min-width: var(--radix-select-trigger-width);
}
.max-w-2xl {
  max-width: 42rem;
}
.max-w-3xl {
  max-width: 48rem;
}
.max-w-48 {
  max-width: 12rem;
}
.max-w-4xl {
  max-width: 56rem;
}
.max-w-\[calc\(100\%-2rem\)\] {
  max-width: calc(100% - 2rem);
}
.max-w-max {
  max-width: -moz-max-content;
  max-width: max-content;
}
.max-w-md {
  max-width: 28rem;
}
.max-w-xs {
  max-width: 20rem;
}
.flex-1 {
  flex: 1 1 0%;
}
.flex-shrink-0 {
  flex-shrink: 0;
}
.shrink {
  flex-shrink: 1;
}
.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.1rem;
  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));
}
.scale-110 {
  --tw-scale-x: 1.1;
  --tw-scale-y: 1.1;
  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));
}
.scale-125 {
  --tw-scale-x: 1.25;
  --tw-scale-y: 1.25;
  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;
}
.touch-manipulation {
  touch-action: manipulation;
}
.select-none {
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.resize {
  resize: both;
}
.scroll-my-1 {
  scroll-margin-top: 0.2rem;
  scroll-margin-bottom: 0.2rem;
}
.scroll-py-1 {
  scroll-padding-top: 0.2rem;
  scroll-padding-bottom: 0.2rem;
}
.list-none {
  list-style-type: none;
}
.auto-rows-min {
  grid-auto-rows: min-content;
}
.grid-cols-5 {
  grid-template-columns: repeat(5, 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-end {
  justify-content: flex-end;
}
.justify-center {
  justify-content: center;
}
.justify-between {
  justify-content: space-between;
}
.justify-items-start {
  justify-items: start;
}
.gap-0\.5 {
  gap: 0.1rem;
}
.gap-1 {
  gap: 0.2rem;
}
.gap-1\.5 {
  gap: 0.3rem;
}
.gap-2 {
  gap: 0.4rem;
}
.gap-2\.5 {
  gap: 0.5rem;
}
.gap-3 {
  gap: 0.6rem;
}
.gap-4 {
  gap: 0.8rem;
}
.gap-6 {
  gap: 1.2rem;
}
.gap-y-0\.5 {
  row-gap: 0.1rem;
}
.space-x-2 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-x-reverse: 0;
  margin-right: calc(0.4rem * var(--tw-space-x-reverse));
  margin-left: calc(0.4rem * calc(1 - var(--tw-space-x-reverse)));
}
.space-y-0\.5 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.1rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.1rem * var(--tw-space-y-reverse));
}
.space-y-1 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.2rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.2rem * var(--tw-space-y-reverse));
}
.space-y-1\.5 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.3rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.3rem * var(--tw-space-y-reverse));
}
.space-y-2 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.4rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.4rem * var(--tw-space-y-reverse));
}
.space-y-3 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.6rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.6rem * var(--tw-space-y-reverse));
}
.space-y-4 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.8rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.8rem * var(--tw-space-y-reverse));
}
.space-y-5 > :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-6 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(1.2rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(1.2rem * var(--tw-space-y-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;
}
.overscroll-contain {
  overscroll-behavior: contain;
}
.truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.whitespace-nowrap {
  white-space: nowrap;
}
.whitespace-pre-wrap {
  white-space: pre-wrap;
}
.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-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-b-2 {
  border-bottom-width: 2px;
}
.border-l {
  border-left-width: 1px;
}
.border-l-2 {
  border-left-width: 2px;
}
.border-r {
  border-right-width: 1px;
}
.border-r-2 {
  border-right-width: 2px;
}
.border-t {
  border-top-width: 1px;
}
.border-t-2 {
  border-top-width: 2px;
}
.border-dashed {
  border-style: dashed;
}
.border-accent\/30 {
  border-color: oklch(var(--accent) / 0.3);
}
.border-amber-500\/20 {
  border-color: rgb(245 158 11 / 0.2);
}
.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-amber-600\/30 {
  border-color: rgb(217 119 6 / 0.3);
}
.border-blue-500\/30 {
  border-color: rgb(59 130 246 / 0.3);
}
.border-blue-600\/30 {
  border-color: rgb(37 99 235 / 0.3);
}
.border-border {
  border-color: oklch(var(--border));
}
.border-cyan-500\/30 {
  border-color: rgb(6 182 212 / 0.3);
}
.border-destructive\/20 {
  border-color: oklch(var(--destructive) / 0.2);
}
.border-destructive\/30 {
  border-color: oklch(var(--destructive) / 0.3);
}
.border-destructive\/40 {
  border-color: oklch(var(--destructive) / 0.4);
}
.border-destructive\/50 {
  border-color: oklch(var(--destructive) / 0.5);
}
.border-emerald-500\/20 {
  border-color: rgb(16 185 129 / 0.2);
}
.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-green-500\/20 {
  border-color: rgb(34 197 94 / 0.2);
}
.border-green-500\/30 {
  border-color: rgb(34 197 94 / 0.3);
}
.border-indigo-500\/30 {
  border-color: rgb(99 102 241 / 0.3);
}
.border-input {
  border-color: oklch(var(--input));
}
.border-lime-500\/30 {
  border-color: rgb(132 204 22 / 0.3);
}
.border-orange-500\/30 {
  border-color: rgb(249 115 22 / 0.3);
}
.border-pink-500\/30 {
  border-color: rgb(236 72 153 / 0.3);
}
.border-primary {
  --tw-border-opacity: 1;
  border-color: oklch(var(--primary) / var(--tw-border-opacity, 1));
}
.border-primary\/15 {
  border-color: oklch(var(--primary) / 0.15);
}
.border-primary\/20 {
  border-color: oklch(var(--primary) / 0.2);
}
.border-primary\/25 {
  border-color: oklch(var(--primary) / 0.25);
}
.border-primary\/30 {
  border-color: oklch(var(--primary) / 0.3);
}
.border-primary\/40 {
  border-color: oklch(var(--primary) / 0.4);
}
.border-primary\/45 {
  border-color: oklch(var(--primary) / 0.45);
}
.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-purple-500\/40 {
  border-color: rgb(168 85 247 / 0.4);
}
.border-rose-500\/30 {
  border-color: rgb(244 63 94 / 0.3);
}
.border-secondary\/20 {
  border-color: oklch(var(--secondary) / 0.2);
}
.border-secondary\/30 {
  border-color: oklch(var(--secondary) / 0.3);
}
.border-secondary\/40 {
  border-color: oklch(var(--secondary) / 0.4);
}
.border-slate-500\/30 {
  border-color: rgb(100 116 139 / 0.3);
}
.border-transparent {
  border-color: transparent;
}
.border-white\/20 {
  border-color: rgb(255 255 255 / 0.2);
}
.border-yellow-500\/20 {
  border-color: rgb(234 179 8 / 0.2);
}
.border-yellow-500\/30 {
  border-color: rgb(234 179 8 / 0.3);
}
.border-yellow-600\/30 {
  border-color: rgb(202 138 4 / 0.3);
}
.border-l-transparent {
  border-left-color: transparent;
}
.border-t-transparent {
  border-top-color: transparent;
}
.bg-accent {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--accent) / var(--tw-bg-opacity, 1));
}
.bg-accent\/5 {
  background-color: oklch(var(--accent) / 0.05);
}
.bg-amber-500\/10 {
  background-color: rgb(245 158 11 / 0.1);
}
.bg-amber-500\/15 {
  background-color: rgb(245 158 11 / 0.15);
}
.bg-amber-500\/20 {
  background-color: rgb(245 158 11 / 0.2);
}
.bg-amber-500\/5 {
  background-color: rgb(245 158 11 / 0.05);
}
.bg-amber-600\/10 {
  background-color: rgb(217 119 6 / 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\/40 {
  background-color: rgb(0 0 0 / 0.4);
}
.bg-black\/50 {
  background-color: rgb(0 0 0 / 0.5);
}
.bg-black\/70 {
  background-color: rgb(0 0 0 / 0.7);
}
.bg-black\/80 {
  background-color: rgb(0 0 0 / 0.8);
}
.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-blue-600\/10 {
  background-color: rgb(37 99 235 / 0.1);
}
.bg-blue-600\/20 {
  background-color: rgb(37 99 235 / 0.2);
}
.bg-border {
  background-color: oklch(var(--border));
}
.bg-card {
  background-color: oklch(var(--card));
}
.bg-current {
  background-color: currentColor;
}
.bg-cyan-500\/10 {
  background-color: rgb(6 182 212 / 0.1);
}
.bg-cyan-500\/20 {
  background-color: rgb(6 182 212 / 0.2);
}
.bg-destructive {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--destructive) / var(--tw-bg-opacity, 1));
}
.bg-destructive\/10 {
  background-color: oklch(var(--destructive) / 0.1);
}
.bg-destructive\/15 {
  background-color: oklch(var(--destructive) / 0.15);
}
.bg-destructive\/20 {
  background-color: oklch(var(--destructive) / 0.2);
}
.bg-emerald-500\/10 {
  background-color: rgb(16 185 129 / 0.1);
}
.bg-emerald-500\/15 {
  background-color: rgb(16 185 129 / 0.15);
}
.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\/60 {
  background-color: rgb(74 222 128 / 0.6);
}
.bg-green-500\/10 {
  background-color: rgb(34 197 94 / 0.1);
}
.bg-green-500\/20 {
  background-color: rgb(34 197 94 / 0.2);
}
.bg-green-500\/5 {
  background-color: rgb(34 197 94 / 0.05);
}
.bg-indigo-500\/10 {
  background-color: rgb(99 102 241 / 0.1);
}
.bg-indigo-500\/20 {
  background-color: rgb(99 102 241 / 0.2);
}
.bg-lime-500\/10 {
  background-color: rgb(132 204 22 / 0.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\/40 {
  background-color: oklch(var(--muted) / 0.4);
}
.bg-muted\/50 {
  background-color: oklch(var(--muted) / 0.5);
}
.bg-muted\/60 {
  background-color: oklch(var(--muted) / 0.6);
}
.bg-orange-500\/10 {
  background-color: rgb(249 115 22 / 0.1);
}
.bg-orange-500\/20 {
  background-color: rgb(249 115 22 / 0.2);
}
.bg-orange-500\/5 {
  background-color: rgb(249 115 22 / 0.05);
}
.bg-pink-500\/10 {
  background-color: rgb(236 72 153 / 0.1);
}
.bg-pink-500\/20 {
  background-color: rgb(236 72 153 / 0.2);
}
.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\/20 {
  background-color: oklch(var(--primary) / 0.2);
}
.bg-primary\/5 {
  background-color: oklch(var(--primary) / 0.05);
}
.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-purple-500\/5 {
  background-color: rgb(168 85 247 / 0.05);
}
.bg-rose-500\/10 {
  background-color: rgb(244 63 94 / 0.1);
}
.bg-secondary {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--secondary) / var(--tw-bg-opacity, 1));
}
.bg-secondary\/20 {
  background-color: oklch(var(--secondary) / 0.2);
}
.bg-secondary\/5 {
  background-color: oklch(var(--secondary) / 0.05);
}
.bg-slate-500\/10 {
  background-color: rgb(100 116 139 / 0.1);
}
.bg-slate-500\/20 {
  background-color: rgb(100 116 139 / 0.2);
}
.bg-transparent {
  background-color: transparent;
}
.bg-yellow-500\/10 {
  background-color: rgb(234 179 8 / 0.1);
}
.bg-yellow-500\/20 {
  background-color: rgb(234 179 8 / 0.2);
}
.bg-yellow-500\/5 {
  background-color: rgb(234 179 8 / 0.05);
}
.bg-yellow-600\/10 {
  background-color: rgb(202 138 4 / 0.1);
}
.bg-yellow-600\/20 {
  background-color: rgb(202 138 4 / 0.2);
}
.bg-gradient-to-br {
  background-image: linear-gradient(to bottom right, var(--tw-gradient-stops));
}
.bg-gradient-to-r {
  background-image: linear-gradient(to right, var(--tw-gradient-stops));
}
.from-amber-500\/80 {
  --tw-gradient-from: rgb(245 158 11 / 0.8) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(245 158 11 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-emerald-400 {
  --tw-gradient-from: #34d399 var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(52 211 153 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-emerald-500\/80 {
  --tw-gradient-from: rgb(16 185 129 / 0.8) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(16 185 129 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-green-500\/20 {
  --tw-gradient-from: rgb(34 197 94 / 0.2) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(34 197 94 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-primary {
  --tw-gradient-from: oklch(var(--primary) / 1) var(--tw-gradient-from-position);
  --tw-gradient-to: oklch(var(--primary) / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-primary\/20 {
  --tw-gradient-from: oklch(var(--primary) / 0.2) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-purple-500\/80 {
  --tw-gradient-from: rgb(168 85 247 / 0.8) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(168 85 247 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-secondary {
  --tw-gradient-from: oklch(var(--secondary) / 1) var(--tw-gradient-from-position);
  --tw-gradient-to: oklch(var(--secondary) / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-transparent {
  --tw-gradient-from: transparent var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-yellow-400\/80 {
  --tw-gradient-from: rgb(250 204 21 / 0.8) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(250 204 21 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-yellow-500\/80 {
  --tw-gradient-from: rgb(234 179 8 / 0.8) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(234 179 8 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.via-primary {
  --tw-gradient-to: oklch(var(--primary) / 0)  var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), oklch(var(--primary) / 1) var(--tw-gradient-via-position), var(--tw-gradient-to);
}
.via-primary\/30 {
  --tw-gradient-to: rgb(255 255 255 / 0)  var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), oklch(var(--primary) / 0.3) var(--tw-gradient-via-position), var(--tw-gradient-to);
}
.via-primary\/60 {
  --tw-gradient-to: rgb(255 255 255 / 0)  var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), oklch(var(--primary) / 0.6) var(--tw-gradient-via-position), var(--tw-gradient-to);
}
.via-secondary {
  --tw-gradient-to: oklch(var(--secondary) / 0)  var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), oklch(var(--secondary) / 1) var(--tw-gradient-via-position), var(--tw-gradient-to);
}
.to-accent {
  --tw-gradient-to: oklch(var(--accent) / 1) var(--tw-gradient-to-position);
}
.to-amber-500\/80 {
  --tw-gradient-to: rgb(245 158 11 / 0.8) var(--tw-gradient-to-position);
}
.to-green-600\/20 {
  --tw-gradient-to: rgb(22 163 74 / 0.2) var(--tw-gradient-to-position);
}
.to-indigo-500\/80 {
  --tw-gradient-to: rgb(99 102 241 / 0.8) var(--tw-gradient-to-position);
}
.to-orange-500\/80 {
  --tw-gradient-to: rgb(249 115 22 / 0.8) var(--tw-gradient-to-position);
}
.to-secondary {
  --tw-gradient-to: oklch(var(--secondary) / 1) var(--tw-gradient-to-position);
}
.to-secondary\/20 {
  --tw-gradient-to: oklch(var(--secondary) / 0.2) var(--tw-gradient-to-position);
}
.to-teal-500 {
  --tw-gradient-to: #14b8a6 var(--tw-gradient-to-position);
}
.to-teal-500\/80 {
  --tw-gradient-to: rgb(20 184 166 / 0.8) var(--tw-gradient-to-position);
}
.to-transparent {
  --tw-gradient-to: transparent var(--tw-gradient-to-position);
}
.to-yellow-500\/80 {
  --tw-gradient-to: rgb(234 179 8 / 0.8) var(--tw-gradient-to-position);
}
.bg-clip-text {
  -webkit-background-clip: text;
          background-clip: text;
}
.fill-current {
  fill: currentColor;
}
.fill-primary {
  fill: oklch(var(--primary) / 1);
}
.object-contain {
  -o-object-fit: contain;
     object-fit: contain;
}
.object-cover {
  -o-object-fit: cover;
     object-fit: cover;
}
.p-0 {
  padding: 0px;
}
.p-1 {
  padding: 0.2rem;
}
.p-1\.5 {
  padding: 0.3rem;
}
.p-2 {
  padding: 0.4rem;
}
.p-2\.5 {
  padding: 0.5rem;
}
.p-3 {
  padding: 0.6rem;
}
.p-4 {
  padding: 0.8rem;
}
.p-5 {
  padding: 1rem;
}
.p-6 {
  padding: 1.2rem;
}
.p-\[3px\] {
  padding: 3px;
}
.p-px {
  padding: 1px;
}
.px-0 {
  padding-left: 0px;
  padding-right: 0px;
}
.px-1 {
  padding-left: 0.2rem;
  padding-right: 0.2rem;
}
.px-1\.5 {
  padding-left: 0.3rem;
  padding-right: 0.3rem;
}
.px-2 {
  padding-left: 0.4rem;
  padding-right: 0.4rem;
}
.px-2\.5 {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}
.px-3 {
  padding-left: 0.6rem;
  padding-right: 0.6rem;
}
.px-4 {
  padding-left: 0.8rem;
  padding-right: 0.8rem;
}
.px-6 {
  padding-left: 1.2rem;
  padding-right: 1.2rem;
}
.py-0 {
  padding-top: 0px;
  padding-bottom: 0px;
}
.py-0\.5 {
  padding-top: 0.1rem;
  padding-bottom: 0.1rem;
}
.py-1 {
  padding-top: 0.2rem;
  padding-bottom: 0.2rem;
}
.py-1\.5 {
  padding-top: 0.3rem;
  padding-bottom: 0.3rem;
}
.py-12 {
  padding-top: 2.4rem;
  padding-bottom: 2.4rem;
}
.py-2 {
  padding-top: 0.4rem;
  padding-bottom: 0.4rem;
}
.py-3 {
  padding-top: 0.6rem;
  padding-bottom: 0.6rem;
}
.py-4 {
  padding-top: 0.8rem;
  padding-bottom: 0.8rem;
}
.py-6 {
  padding-top: 1.2rem;
  padding-bottom: 1.2rem;
}
.pb-0\.5 {
  padding-bottom: 0.1rem;
}
.pb-1\.5 {
  padding-bottom: 0.3rem;
}
.pb-2 {
  padding-bottom: 0.4rem;
}
.pb-3 {
  padding-bottom: 0.6rem;
}
.pb-4 {
  padding-bottom: 0.8rem;
}
.pb-5 {
  padding-bottom: 1rem;
}
.pl-2 {
  padding-left: 0.4rem;
}
.pl-4 {
  padding-left: 0.8rem;
}
.pl-7 {
  padding-left: 1.4rem;
}
.pl-8 {
  padding-left: 1.6rem;
}
.pr-1 {
  padding-right: 0.2rem;
}
.pr-2 {
  padding-right: 0.4rem;
}
.pr-2\.5 {
  padding-right: 0.5rem;
}
.pr-6 {
  padding-right: 1.2rem;
}
.pr-8 {
  padding-right: 1.6rem;
}
.pt-0 {
  padding-top: 0px;
}
.pt-1 {
  padding-top: 0.2rem;
}
.pt-1\.5 {
  padding-top: 0.3rem;
}
.pt-2 {
  padding-top: 0.4rem;
}
.pt-3 {
  padding-top: 0.6rem;
}
.pt-4 {
  padding-top: 0.8rem;
}
.pt-6 {
  padding-top: 1.2rem;
}
.text-left {
  text-align: left;
}
.text-center {
  text-align: center;
}
.text-right {
  text-align: right;
}
.align-middle {
  vertical-align: middle;
}
.font-mono {
  font-family: Geist Mono, JetBrains Mono, Fira Code, monospace;
}
.text-2xl {
  font-size: 1.375rem;
  line-height: 2rem;
}
.text-3xl {
  font-size: 1.75rem;
  line-height: 2.25rem;
}
.text-4xl {
  font-size: 2rem;
  line-height: 2.5rem;
}
.text-\[0\.65rem\] {
  font-size: 0.65rem;
}
.text-\[0\.6rem\] {
  font-size: 0.6rem;
}
.text-\[0\.8rem\] {
  font-size: 0.8rem;
}
.text-\[10px\] {
  font-size: 10px;
}
.text-\[11px\] {
  font-size: 11px;
}
.text-\[9px\] {
  font-size: 9px;
}
.text-base {
  font-size: 0.875rem;
  line-height: 1.5rem;
}
.text-lg {
  font-size: 1rem;
  line-height: 1.5rem;
}
.text-sm {
  font-size: 0.8125rem;
  line-height: 1.25rem;
}
.text-xl {
  font-size: 1.125rem;
  line-height: 1.75rem;
}
.text-xs {
  font-size: 0.7rem;
  line-height: 1rem;
}
.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;
}
.capitalize {
  text-transform: capitalize;
}
.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-tight {
  line-height: 1.25;
}
.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 {
  --tw-text-opacity: 1;
  color: oklch(var(--accent) / var(--tw-text-opacity, 1));
}
.text-accent-foreground {
  color: oklch(var(--accent-foreground));
}
.text-amber-200 {
  --tw-text-opacity: 1;
  color: rgb(253 230 138 / var(--tw-text-opacity, 1));
}
.text-amber-200\/90 {
  color: rgb(253 230 138 / 0.9);
}
.text-amber-300 {
  --tw-text-opacity: 1;
  color: rgb(252 211 77 / var(--tw-text-opacity, 1));
}
.text-amber-400 {
  --tw-text-opacity: 1;
  color: rgb(251 191 36 / var(--tw-text-opacity, 1));
}
.text-amber-500 {
  --tw-text-opacity: 1;
  color: rgb(245 158 11 / var(--tw-text-opacity, 1));
}
.text-blue-300 {
  --tw-text-opacity: 1;
  color: rgb(147 197 253 / 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-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-destructive\/90 {
  color: oklch(var(--destructive) / 0.9);
}
.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-emerald-500 {
  --tw-text-opacity: 1;
  color: rgb(16 185 129 / var(--tw-text-opacity, 1));
}
.text-foreground {
  color: oklch(var(--foreground));
}
.text-green-300 {
  --tw-text-opacity: 1;
  color: rgb(134 239 172 / var(--tw-text-opacity, 1));
}
.text-green-400 {
  --tw-text-opacity: 1;
  color: rgb(74 222 128 / var(--tw-text-opacity, 1));
}
.text-green-400\/80 {
  color: rgb(74 222 128 / 0.8);
}
.text-green-400\/90 {
  color: rgb(74 222 128 / 0.9);
}
.text-green-500 {
  --tw-text-opacity: 1;
  color: rgb(34 197 94 / var(--tw-text-opacity, 1));
}
.text-indigo-300 {
  --tw-text-opacity: 1;
  color: rgb(165 180 252 / var(--tw-text-opacity, 1));
}
.text-muted-foreground {
  --tw-text-opacity: 1;
  color: oklch(var(--muted-foreground) / var(--tw-text-opacity, 1));
}
.text-muted-foreground\/50 {
  color: oklch(var(--muted-foreground) / 0.5);
}
.text-muted-foreground\/60 {
  color: oklch(var(--muted-foreground) / 0.6);
}
.text-muted-foreground\/70 {
  color: oklch(var(--muted-foreground) / 0.7);
}
.text-muted-foreground\/80 {
  color: oklch(var(--muted-foreground) / 0.8);
}
.text-muted-foreground\/90 {
  color: oklch(var(--muted-foreground) / 0.9);
}
.text-orange-300 {
  --tw-text-opacity: 1;
  color: rgb(253 186 116 / var(--tw-text-opacity, 1));
}
.text-orange-500 {
  --tw-text-opacity: 1;
  color: rgb(249 115 22 / var(--tw-text-opacity, 1));
}
.text-pink-300 {
  --tw-text-opacity: 1;
  color: rgb(249 168 212 / 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-primary\/90 {
  color: oklch(var(--primary) / 0.9);
}
.text-purple-300 {
  --tw-text-opacity: 1;
  color: rgb(216 180 254 / var(--tw-text-opacity, 1));
}
.text-purple-400 {
  --tw-text-opacity: 1;
  color: rgb(192 132 252 / var(--tw-text-opacity, 1));
}
.text-purple-500 {
  --tw-text-opacity: 1;
  color: rgb(168 85 247 / var(--tw-text-opacity, 1));
}
.text-secondary {
  --tw-text-opacity: 1;
  color: oklch(var(--secondary) / var(--tw-text-opacity, 1));
}
.text-secondary-foreground {
  color: oklch(var(--secondary-foreground));
}
.text-slate-300 {
  --tw-text-opacity: 1;
  color: rgb(203 213 225 / var(--tw-text-opacity, 1));
}
.text-transparent {
  color: transparent;
}
.text-white {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.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-yellow-300 {
  --tw-text-opacity: 1;
  color: rgb(253 224 71 / var(--tw-text-opacity, 1));
}
.text-yellow-400 {
  --tw-text-opacity: 1;
  color: rgb(250 204 21 / var(--tw-text-opacity, 1));
}
.text-yellow-400\/90 {
  color: rgb(250 204 21 / 0.9);
}
.text-yellow-500 {
  --tw-text-opacity: 1;
  color: rgb(234 179 8 / var(--tw-text-opacity, 1));
}
.underline {
  text-decoration-line: underline;
}
.underline-offset-4 {
  text-underline-offset: 4px;
}
.opacity-0 {
  opacity: 0;
}
.opacity-10 {
  opacity: 0.1;
}
.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-\[0_0_12px_oklch\(0\.55_0\.24_300\/0\.25\)\] {
  --tw-shadow: 0 0 12px oklch(0.55 0.24 300/0.25);
  --tw-shadow-colored: 0 0 12px 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_20px_oklch\(0\.55_0\.24_300\/0\.25\)\] {
  --tw-shadow: 0 0 20px oklch(0.55 0.24 300/0.25);
  --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);
}
.shadow-\[0_0_20px_rgba\(0\2c 240\2c 255\2c 0\.25\)\] {
  --tw-shadow: 0 0 20px rgba(0,240,255,0.25);
  --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);
}
.shadow-\[0_0_20px_rgba\(16\2c 185\2c 129\2c 0\.25\)\] {
  --tw-shadow: 0 0 20px rgba(16,185,129,0.25);
  --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);
}
.shadow-\[0_0_20px_rgba\(168\2c 85\2c 247\2c 0\.25\)\] {
  --tw-shadow: 0 0 20px rgba(168,85,247,0.25);
  --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);
}
.shadow-\[0_0_20px_rgba\(220\2c 38\2c 38\2c 0\.15\)\] {
  --tw-shadow: 0 0 20px rgba(220,38,38,0.15);
  --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);
}
.shadow-\[0_0_20px_rgba\(245\2c 158\2c 11\2c 0\.25\)\] {
  --tw-shadow: 0 0 20px rgba(245,158,11,0.25);
  --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);
}
.shadow-\[0_0_20px_rgba\(251\2c 191\2c 36\2c 0\.25\)\] {
  --tw-shadow: 0 0 20px rgba(251,191,36,0.25);
  --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);
}
.shadow-\[0_0_30px_rgba\(0\2c 240\2c 255\2c 0\.1\)\] {
  --tw-shadow: 0 0 30px rgba(0,240,255,0.1);
  --tw-shadow-colored: 0 0 30px 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_30px_rgba\(0\2c 240\2c 255\2c 0\.12\)\] {
  --tw-shadow: 0 0 30px rgba(0,240,255,0.12);
  --tw-shadow-colored: 0 0 30px 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_30px_rgba\(0\2c 240\2c 255\2c 0\.15\)\] {
  --tw-shadow: 0 0 30px rgba(0,240,255,0.15);
  --tw-shadow-colored: 0 0 30px 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_30px_rgba\(100\2c 116\2c 139\2c 0\.1\)\] {
  --tw-shadow: 0 0 30px rgba(100,116,139,0.1);
  --tw-shadow-colored: 0 0 30px 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_30px_rgba\(132\2c 204\2c 22\2c 0\.1\)\] {
  --tw-shadow: 0 0 30px rgba(132,204,22,0.1);
  --tw-shadow-colored: 0 0 30px 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_30px_rgba\(16\2c 185\2c 129\2c 0\.1\)\] {
  --tw-shadow: 0 0 30px rgba(16,185,129,0.1);
  --tw-shadow-colored: 0 0 30px 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_30px_rgba\(217\2c 119\2c 6\2c 0\.1\)\] {
  --tw-shadow: 0 0 30px rgba(217,119,6,0.1);
  --tw-shadow-colored: 0 0 30px 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_30px_rgba\(236\2c 72\2c 153\2c 0\.1\)\] {
  --tw-shadow: 0 0 30px rgba(236,72,153,0.1);
  --tw-shadow-colored: 0 0 30px 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_30px_rgba\(244\2c 63\2c 94\2c 0\.1\)\] {
  --tw-shadow: 0 0 30px rgba(244,63,94,0.1);
  --tw-shadow-colored: 0 0 30px 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_30px_rgba\(245\2c 158\2c 11\2c 0\.1\)\] {
  --tw-shadow: 0 0 30px rgba(245,158,11,0.1);
  --tw-shadow-colored: 0 0 30px 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_30px_rgba\(249\2c 115\2c 22\2c 0\.1\)\] {
  --tw-shadow: 0 0 30px rgba(249,115,22,0.1);
  --tw-shadow-colored: 0 0 30px 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_30px_rgba\(251\2c 191\2c 36\2c 0\.1\)\] {
  --tw-shadow: 0 0 30px rgba(251,191,36,0.1);
  --tw-shadow-colored: 0 0 30px 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_30px_rgba\(59\2c 130\2c 246\2c 0\.1\)\] {
  --tw-shadow: 0 0 30px rgba(59,130,246,0.1);
  --tw-shadow-colored: 0 0 30px 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_30px_rgba\(6\2c 182\2c 212\2c 0\.1\)\] {
  --tw-shadow: 0 0 30px rgba(6,182,212,0.1);
  --tw-shadow-colored: 0 0 30px 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_30px_rgba\(99\2c 102\2c 241\2c 0\.1\)\] {
  --tw-shadow: 0 0 30px rgba(99,102,241,0.1);
  --tw-shadow-colored: 0 0 30px 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_40px_rgba\(0\2c 240\2c 255\2c 0\.2\)\] {
  --tw-shadow: 0 0 40px rgba(0,240,255,0.2);
  --tw-shadow-colored: 0 0 40px 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_8px_oklch\(var\(--primary\)\)\] {
  --tw-shadow: 0 0 8px oklch(var(--primary));
  --tw-shadow-colored: 0 0 8px 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-glow {
  --tw-shadow: 0 0 16px oklch(var(--primary) / 0.45), 0 0 40px oklch(var(--primary) / 0.20);
  --tw-shadow-colored: 0 0 16px var(--tw-shadow-color), 0 0 40px 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-glow-sm {
  --tw-shadow: 0 0 10px oklch(var(--primary) / 0.35), 0 0 20px oklch(var(--primary) / 0.15);
  --tw-shadow-colored: 0 0 10px var(--tw-shadow-color), 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);
}
.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.1);
  --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);
}
.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-1 {
  --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);
}
.ring-primary\/20 {
  --tw-ring-color: oklch(var(--primary) / 0.2);
}
.ring-primary\/50 {
  --tw-ring-color: oklch(var(--primary) / 0.5);
}
.ring-ring\/50 {
  --tw-ring-color: oklch(var(--ring) / 0.5);
}
.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-md {
  --tw-blur: blur(12px);
  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;
}
.ease-in-out {
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}
.ease-linear {
  transition-timing-function: linear;
}
.\@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;
}
.ease-in-out {
  animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}
.ease-linear {
  animation-timing-function: linear;
}
.running {
  animation-play-state: running;
}
.paused {
  animation-play-state: paused;
}
.\[--cell-size\:--spacing\(8\)\] {
  --cell-size: var(--spacing(8));
}

@font-face {
  font-family: "Space Grotesk";
  src: url("https://fonts.gstatic.com/s/spacegrotesk/v16/V8mQoQDjQSkFtoMM3T6r8E7mF71Q-gozuPTPDg.woff2")
    format("woff2");
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Geist Mono";
  src: url("https://fonts.gstatic.com/s/geistmono/v1/or3yQ6H4GMpCRVz0RQfENaP2wY0YHnWaYm0AEPQ.woff2")
    format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

.glass-card {
  background: oklch(0.1 0.035 240 / 0.7);
  backdrop-filter: blur(16px) saturate(180%);
  -webkit-backdrop-filter: blur(16px) saturate(180%);
  border: 1px solid oklch(0.3 0.1 195 / 0.25);
}

.neon-text-cyan {
  color: oklch(0.88 0.24 195);
  text-shadow: 0 0 8px oklch(0.88 0.24 195 / 0.6), 0 0 20px
    oklch(0.88 0.24 195 / 0.3);
}

/* Glow applied ONLY to the per-coin unit price text on Dashboard asset rows.
   Preserves the existing muted-foreground color; adds a neon cyan-teal
   text-shadow matching the Featured badge. */
.per-coin-price-glow {
  text-shadow: 0 0 8px oklch(0.88 0.24 195 / 0.6), 0 0 20px
    oklch(0.88 0.24 195 / 0.3);
}

.neon-border {
  border: 1px solid oklch(0.88 0.24 195 / 0.4);
  box-shadow: inset 0 0 20px oklch(0.88 0.24 195 / 0.05), 0 0 10px
    oklch(0.88 0.24 195 / 0.15);
}

@keyframes scan-line {
  0% {
    top: 0%;
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  90% {
    opacity: 1;
  }
  100% {
    top: 100%;
    opacity: 0;
  }
}

.animate-scan-line {
  animation: scan-line 2.5s linear infinite;
}

/* DEX aggregator utilities */
.dex-row {
  border: 1px solid oklch(var(--dex-row-border) / 0.25);
  background: oklch(var(--card) / 0.4);
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.dex-row:hover:not(.dex-disabled) {
  border-color: oklch(var(--dex-row-border) / 0.5);
  background: oklch(var(--card) / 0.6);
}

.dex-row-selected {
  border-color: oklch(var(--dex-selected) / 0.55);
  background: oklch(var(--dex-selected) / 0.08);
  box-shadow: inset 0 0 24px oklch(var(--dex-selected) / 0.06), 0 0 12px
    oklch(var(--dex-selected) / 0.15);
}

.dex-disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.dex-best-badge {
  background: oklch(var(--dex-best) / 0.18);
  border: 1px solid oklch(var(--dex-best) / 0.45);
  color: oklch(var(--dex-best));
  box-shadow: 0 0 10px oklch(var(--dex-best) / 0.25);
}

.dex-no-pool-pill {
  background: oklch(var(--muted) / 0.4);
  border: 1px solid oklch(var(--border) / 0.5);
  color: oklch(var(--dex-disabled));
}

.dex-surface {
  background: oklch(var(--dex-surface) / 0.5);
  border: 1px solid oklch(var(--dex-row-border) / 0.2);
}

/* ============================================================
   iOS Safari auto-zoom fix
   ------------------------------------------------------------
   iOS Safari auto-zooms the page when an input/textarea/select
   has a font-size below 16px (e.g. the swap modal's From/To
   fields use text-sm = 13px). Forcing 16px on mobile viewports
   stops the auto-zoom-on-focus behavior. This is purely
   additive CSS — no component JSX, className, swap logic, fee,
   ICPSwap adapter, deposit, or withdrawal code is touched.
   ============================================================ */
@media (max-width: 768px) {
  input,
  textarea,
  select {
    font-size: 16px !important;
  }
}

/* ============================================================
   OISY-style Left Sidebar (desktop md+)
   ------------------------------------------------------------
   Additive only — reuses existing glass-card / neon-border /
   glow utilities. New tokens: --sidebar-* for surface + active
   pill. Sidebar is fixed left, hidden below md breakpoint.
   ============================================================ */
:root {
  /* Sidebar surface — one step above card, cyan-tinted glass */
  --sidebar-bg: 0.09 0.04 240;
  --sidebar-border: 0.3 0.1 195;
  --sidebar-active-bg: 0.88 0.24 195;
  --sidebar-active-fg: 0.04 0.02 240;
  --sidebar-accent-line: 0.88 0.24 195;
}

.dark {
  --sidebar-bg: 0.08 0.035 240;
  --sidebar-border: 0.3 0.1 195;
  --sidebar-active-bg: 0.88 0.24 195;
  --sidebar-active-fg: 0.04 0.02 240;
  --sidebar-accent-line: 0.88 0.24 195;
}

.app-sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  width: 16rem;
  display: flex;
  flex-direction: column;
  background: oklch(var(--sidebar-bg) / 0.72);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  border-right: 1px solid oklch(var(--sidebar-border) / 0.35);
  box-shadow: inset -1px 0 0 oklch(0.88 0.24 195 / 0.08), 0 0 24px
    oklch(0.88 0.24 195 / 0.06);
  z-index: 40;
}

/* Neon right-edge glow line on the sidebar */
.app-sidebar::after {
  content: "";
  position: absolute;
  top: 0;
  right: -1px;
  bottom: 0;
  width: 1px;
  background: linear-gradient(
    to bottom,
    transparent 0%,
    oklch(0.88 0.24 195 / 0.55) 20%,
    oklch(0.55 0.24 300 / 0.45) 55%,
    oklch(0.84 0.2 85 / 0.35) 85%,
    transparent 100%
  );
  pointer-events: none;
}

.app-sidebar-header {
  padding: 1.4rem 1.2rem 1.2rem;
  display: flex;
  align-items: center;
  gap: 0.6rem;
  border-bottom: 1px solid oklch(var(--border) / 0.25);
}

.app-sidebar-nav {
  flex: 1 1 auto;
  overflow-y: auto;
  padding: 0.8rem 0.6rem;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.app-sidebar-footer {
  padding: 0.8rem 0.6rem 1rem;
  border-top: 1px solid oklch(var(--border) / 0.25);
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

/* Nav item — default ghost, active = neon pill + left accent line */
.sidebar-nav-item {
  position: relative;
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.5rem 0.7rem;
  border-radius: 0.6rem;
  color: oklch(var(--muted-foreground));
  font-size: 0.875rem;
  font-weight: 500;
  transition: color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
  cursor: pointer;
}

.sidebar-nav-item:hover {
  color: oklch(var(--foreground));
  background: oklch(var(--primary) / 0.06);
}

.sidebar-nav-item[data-active="true"] {
  color: oklch(0.88 0.24 195);
  text-shadow: 0 0 6px oklch(0.88 0.24 195 / 0.6);
  background: oklch(var(--sidebar-active-bg) / 0.16);
  box-shadow: inset 0 0 18px oklch(var(--sidebar-active-bg) / 0.12), 0 0 12px
    oklch(var(--sidebar-active-bg) / 0.18);
}

/* Left gradient accent line (OISY-style indicator) */
.sidebar-nav-item[data-active="true"]::before {
  content: "";
  position: absolute;
  left: -0.6rem;
  top: 50%;
  transform: translateY(-50%);
  width: 3px;
  height: 1.4rem;
  border-radius: 0 2px 2px 0;
  background: linear-gradient(
    to bottom,
    oklch(0.88 0.24 195),
    oklch(0.55 0.24 300)
  );
  box-shadow: 0 0 8px oklch(0.88 0.24 195 / 0.7), 0 0 16px
    oklch(0.88 0.24 195 / 0.4);
}

.sidebar-nav-item[data-active="true"] .sidebar-nav-icon {
  color: oklch(0.88 0.24 195);
  filter: drop-shadow(0 0 6px oklch(0.88 0.24 195 / 0.6));
}

/* "NEW" / coming-soon badge inside sidebar */
.sidebar-nav-badge {
  margin-left: auto;
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  padding: 0.1rem 0.35rem;
  border-radius: 0.3rem;
  color: oklch(0.84 0.2 85);
  background: oklch(0.84 0.2 85 / 0.14);
  border: 1px solid oklch(0.84 0.2 85 / 0.4);
  text-transform: uppercase;
}

/* Main content inset to clear the fixed sidebar (desktop).
   The 16rem left margin is reserved ONLY for authenticated views
   (where the fixed Sidebar is rendered). The unauthenticated
   landing page renders the same .app-main-inset div but with
   data-auth="false", so it gets margin-left:0 and stays
   full-width / centered with no leftover sidebar gap. */
.app-main-inset {
  margin-left: 0;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

.app-main-inset[data-auth="true"] {
  margin-left: 16rem;
}

/* ============================================================
   Mobile Bottom Tab Bar (below md breakpoint)
   ------------------------------------------------------------
   Fixed bottom, 5 icon+label items, active tab neon glow.
   Hidden on md+ where the sidebar takes over.
   ============================================================ */
.app-bottom-bar {
  position: fixed;
  /* The bar's bottom edge sits flush with the bottom of the viewport
     (bottom: 0). The bar GROWS UPWARD by env(safe-area-inset-bottom) so
     its total height = 3.6rem + safe-area-inset-bottom. This keeps the
     dark background ending exactly at the home indicator line (no dark
     strip past the buttons — per AGENTS.md learning, do NOT apply
     safe-area as padding-bottom on the bar's background box). The
     .bottom-tab buttons use align-items:center within the taller bar, so
     the icon+label cluster shifts upward and sits comfortably above the
     home indicator instead of crowding the bottom edge. env() resolves to
     0 on desktop/non-notched devices, so Android/Desktop are unchanged. */
  inset: auto 0 0 0;
  height: calc(3.6rem + env(safe-area-inset-bottom, 0px));
  display: flex;
  align-items: stretch;
  justify-content: space-around;
  background: oklch(var(--sidebar-bg) / 0.82);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  border-top: 1px solid oklch(0.88 0.24 195 / 0.3);
  box-shadow: 0 -8px 24px rgba(0, 0, 0, 0.4), inset 0 1px 0
    oklch(0.88 0.24 195 / 0.12);
  z-index: 40;
}

.bottom-tab {
  position: relative;
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.2rem;
  color: oklch(var(--muted-foreground));
  font-size: 0.65rem;
  font-weight: 500;
  transition: color 0.2s ease, box-shadow 0.2s ease;
  cursor: pointer;
}

.bottom-tab[data-active="true"] {
  color: oklch(0.88 0.24 195);
}

.bottom-tab[data-active="true"] .bottom-tab-icon {
  filter: drop-shadow(0 0 6px oklch(0.88 0.24 195 / 0.7));
}

.bottom-tab[data-active="true"]::before {
  content: "";
  position: absolute;
  top: -1px;
  left: 50%;
  transform: translateX(-50%);
  width: 2rem;
  height: 2px;
  border-radius: 0 0 2px 2px;
  background: linear-gradient(
    to right,
    oklch(0.88 0.24 195),
    oklch(0.55 0.24 300)
  );
  box-shadow: 0 0 8px oklch(0.88 0.24 195 / 0.8), 0 2px 12px
    oklch(0.88 0.24 195 / 0.4);
}

/* Push main content above the bottom bar on mobile. Matches the bar's
   total footprint (3.6rem base height + env(safe-area-inset-bottom) grown
   upward), so page content clears the bar on notched devices. */
.app-main-inset.has-bottom-bar {
  padding-bottom: calc(3.6rem + env(safe-area-inset-bottom, 0px));
}

/* ============================================================
   Coming Soon page card
   ------------------------------------------------------------
   Centered neon glass-card with glowing badge + title +
   description. Used by Earn / Explore / Settings pages.
   ============================================================ */
.coming-soon-wrap {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem 1.2rem;
}

.coming-soon-card {
  position: relative;
  max-width: 28rem;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 1rem;
  padding: 2.4rem 2rem;
  border-radius: 1.2rem;
  background: oklch(0.1 0.035 240 / 0.7);
  backdrop-filter: blur(18px) saturate(180%);
  -webkit-backdrop-filter: blur(18px) saturate(180%);
  border: 1px solid oklch(0.3 0.1 195 / 0.3);
  box-shadow: inset 0 0 32px oklch(0.88 0.24 195 / 0.06), 0 0 24px
    oklch(0.88 0.24 195 / 0.12), 0 8px 40px rgba(0, 0, 0, 0.45);
  overflow: hidden;
}

/* Subtle top neon gradient hairline on the card */
.coming-soon-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 10%;
  right: 10%;
  height: 1px;
  background: linear-gradient(
    to right,
    transparent,
    oklch(0.88 0.24 195 / 0.7),
    oklch(0.55 0.24 300 / 0.6),
    transparent
  );
}

.coming-soon-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.3rem 0.8rem;
  border-radius: 999px;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: oklch(0.88 0.24 195);
  background: oklch(0.88 0.24 195 / 0.1);
  border: 1px solid oklch(0.88 0.24 195 / 0.45);
  box-shadow: 0 0 12px oklch(0.88 0.24 195 / 0.3), inset 0 0 12px
    oklch(0.88 0.24 195 / 0.1);
  animation: coming-soon-pulse 2.8s ease-in-out infinite;
}

.coming-soon-title {
  font-size: 1.75rem;
  font-weight: 600;
  line-height: 2.1rem;
  color: oklch(var(--foreground));
  text-shadow: 0 0 16px oklch(0.88 0.24 195 / 0.25);
}

.coming-soon-description {
  font-size: 0.9rem;
  line-height: 1.5rem;
  color: oklch(var(--muted-foreground));
  max-width: 22rem;
}

.coming-soon-glow-orb {
  position: absolute;
  width: 12rem;
  height: 12rem;
  border-radius: 999px;
  filter: blur(48px);
  opacity: 0.35;
  pointer-events: none;
  z-index: 0;
}

.coming-soon-glow-orb.cyan {
  top: -3rem;
  left: -3rem;
  background: oklch(0.88 0.24 195 / 0.5);
}

.coming-soon-glow-orb.purple {
  bottom: -3rem;
  right: -3rem;
  background: oklch(0.55 0.24 300 / 0.5);
}

.coming-soon-card > * {
  position: relative;
  z-index: 1;
}

@keyframes coming-soon-pulse {
  0%,
  100% {
    box-shadow: 0 0 12px oklch(0.88 0.24 195 / 0.3), inset 0 0 12px
      oklch(0.88 0.24 195 / 0.1);
  }
  50% {
    box-shadow: 0 0 20px oklch(0.88 0.24 195 / 0.5), inset 0 0 18px
      oklch(0.88 0.24 195 / 0.18);
  }
}

@keyframes sidebar-slide-in {
  from {
    transform: translateX(-100%);
    opacity: 0;
  }
  to {
    transform: translateX(0);
    opacity: 1;
  }
}

.animate-sidebar-in {
  animation: sidebar-slide-in 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes bottom-bar-rise {
  from {
    transform: translateY(100%);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

.animate-bottom-bar-in {
  animation: bottom-bar-rise 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ============================================================
   Top Header Bar (mobile + desktop)
   ------------------------------------------------------------
   Mobile (<768px): shows Infinity logo + name on the left and
   the Profile button on the right. Sticky at the top.
   Desktop (>=768px): shows ONLY the Profile button on the
   right — the sidebar already carries the logo on the left,
   so the logo block is hidden via .app-mobile-logo.
   ============================================================ */
.app-top-header {
  position: sticky;
  top: 0;
  z-index: 30;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  /* padding-top carries env(safe-area-inset-top) in the BASE rule (not a
     media-query override) so it resolves reliably in iOS PWA standalone
     mode, where the web view extends under the status bar
     (apple-mobile-web-app-status-bar-style=black-translucent). The env()
     term resolves to 0 on desktop and on non-notched devices, so this is
     a no-op everywhere except notched iPhones — Android/Desktop unchanged.
     The header background (set below) extends up under the status bar so
     there is no white gap, while the content is pushed down below the notch. */
  padding: calc(0.6rem + env(safe-area-inset-top, 0px)) 1rem 0.6rem;
  background: oklch(var(--card) / 0.5);
  backdrop-filter: blur(16px) saturate(180%);
  -webkit-backdrop-filter: blur(16px) saturate(180%);
  border-bottom: 1px solid oklch(0.88 0.24 195 / 0.18);
  box-shadow: 0 1px 0 oklch(0.88 0.24 195 / 0.06);
}

/* Mobile-only reinforcement of the safe-area-inset-top padding. Kept as a
   belt-and-suspenders rule so that if a future cascade change ever strips
   the env() term from the base rule, the mobile media query still pushes
   the header content below the notch. Identical to the base padding-top,
   so it produces no visual change on its own. */
@media (max-width: 767px) {
  .app-top-header {
    padding-top: calc(0.6rem + env(safe-area-inset-top, 0px));
  }
}

/* Subtle bottom neon hairline on the top header */
.app-top-header::after {
  content: "";
  position: absolute;
  left: 10%;
  right: 10%;
  bottom: -1px;
  height: 1px;
  background: linear-gradient(
    to right,
    transparent,
    oklch(0.88 0.24 195 / 0.45),
    oklch(0.55 0.24 300 / 0.35),
    transparent
  );
  pointer-events: none;
}

/* Mobile: logo+name visible, desktop spacer collapses */
.app-mobile-logo {
  display: flex;
  align-items: center;
}
.app-desktop-spacer {
  display: none;
}

@media (min-width: 768px) {
  /* Desktop: hide the logo block (sidebar already shows it), keep spacer
     so the profile button floats to the right. */
  .app-mobile-logo {
    display: none;
  }
  .app-desktop-spacer {
    display: block;
  }
}

/* ============================================================
   Dashboard content centering (desktop only)
   ------------------------------------------------------------
   The fixed 16rem sidebar shifts `.app-main-inset` right via
   margin-left:16rem, so the Dashboard's `container mx-auto
   max-w-3xl` wrapper centers naturally WITHIN the content area
   (the space to the right of the sidebar) — exactly like OISY
   wallet. No transform compensation is needed: `mx-auto` alone
   centers the content within `.app-main-inset`, and the inset's
   margin-left:16rem simply clears the fixed sidebar.

   The earlier `transform: translateX(-8rem)` rule
   overcorrected: it shifted the dashboard content LEFT by half
   the sidebar width to center it over the FULL window. That is
   NOT the desired behavior — the content should center within
   the content area (right of the sidebar), not over the full
   viewport.

   Below 768px the sidebar is hidden and `.app-main-inset`
   resets to margin-left:0, so content centers normally across
   the full mobile viewport.

   Additive only — does NOT touch the sidebar, its width, its
   position, or any wallet functionality. The
   `.dashboard-center-compensate` class is retained on the
   DashboardPage root wrapper as a no-op hook for future
   adjustments; it currently carries no desktop styles.
   ============================================================ */

/* Responsive: sidebar desktop only, bottom bar mobile only */
@media (max-width: 767px) {
  .app-sidebar {
    display: none;
  }
  /* On mobile the fixed sidebar is hidden, so even authenticated
     views collapse to full-width (no 16rem left margin). */
  .app-main-inset,
  .app-main-inset[data-auth="true"] {
    margin-left: 0;
  }
}

@media (min-width: 768px) {
  .app-bottom-bar {
    display: none;
  }
  .app-main-inset.has-bottom-bar {
    padding-bottom: 0;
  }
}

/* ============================================================
   App-wide Ambient Glow Background
   ------------------------------------------------------------
   Fixed full-viewport layer of soft neon orbs that sits behind
   ALL app pages (z-index:-1, pointer-events:none). Uses the
   existing neon Infinity Coin palette only: cyan/teal
   oklch(0.88 0.24 195), deep purple oklch(0.55 0.24 300), and
   a sparing touch of accent magenta oklch(0.84 0.2 85). Heavy
   blur + low opacity = smoky, atmospheric, no hard edges.
   Subtle drift + breathing animations are staggered so the
   background feels alive but never distracting. Honors
   prefers-reduced-motion. Additive only — does NOT touch the
   body radial-gradient, sidebar, header, footer, or any wallet
   functionality.
   ============================================================ */
.app-ambient-glow {
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  overflow: hidden;
}

.ambient-orb {
  position: absolute;
  border-radius: 999px;
  filter: blur(90px);
  opacity: 0.3;
  will-change: transform, opacity;
  mix-blend-mode: screen;
}

.ambient-orb--cyan-tl {
  top: -10%;
  left: -8%;
  width: 32rem;
  height: 32rem;
  background: oklch(0.88 0.24 195 / 0.45);
  animation: orb-drift-1 28s ease-in-out infinite;
}

.ambient-orb--purple-br {
  bottom: -12%;
  right: -10%;
  width: 36rem;
  height: 36rem;
  background: oklch(0.55 0.24 300 / 0.4);
  animation: orb-drift-2 34s ease-in-out infinite;
}

.ambient-orb--cyan-c {
  top: 38%;
  left: 42%;
  width: 24rem;
  height: 24rem;
  background: oklch(0.82 0.22 195 / 0.3);
  animation: orb-breathe 22s ease-in-out infinite;
}

.ambient-orb--purple-tr {
  top: -6%;
  right: 12%;
  width: 22rem;
  height: 22rem;
  background: oklch(0.5 0.24 300 / 0.35);
  animation: orb-drift-3 30s ease-in-out infinite;
}

.ambient-orb--accent-bl {
  bottom: 8%;
  left: 18%;
  width: 20rem;
  height: 20rem;
  background: oklch(0.84 0.2 85 / 0.22);
  animation: orb-breathe 26s ease-in-out infinite reverse;
}

.ambient-orb--cyan-ml {
  top: 55%;
  left: -6%;
  width: 26rem;
  height: 26rem;
  background: oklch(0.85 0.23 195 / 0.32);
  animation: orb-drift-1 36s ease-in-out infinite reverse;
}

.ambient-orb--purple-mr {
  top: 30%;
  right: -8%;
  width: 28rem;
  height: 28rem;
  background: oklch(0.52 0.24 300 / 0.3);
  animation: orb-drift-2 32s ease-in-out infinite reverse;
}

@keyframes orb-drift-1 {
  0%,
  100% {
    transform: translate(0, 0) scale(1);
    opacity: 0.3;
  }
  50% {
    transform: translate(30px, 24px) scale(1.06);
    opacity: 0.38;
  }
}

@keyframes orb-drift-2 {
  0%,
  100% {
    transform: translate(0, 0) scale(1);
    opacity: 0.3;
  }
  50% {
    transform: translate(-28px, -22px) scale(1.05);
    opacity: 0.36;
  }
}

@keyframes orb-drift-3 {
  0%,
  100% {
    transform: translate(0, 0) scale(1.02);
    opacity: 0.32;
  }
  50% {
    transform: translate(22px, -26px) scale(1);
    opacity: 0.26;
  }
}

@keyframes orb-breathe {
  0%,
  100% {
    transform: scale(1);
    opacity: 0.28;
  }
  50% {
    transform: scale(1.08);
    opacity: 0.36;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ambient-orb {
    animation: none !important;
  }
}

/* ============================================================
   Unauthenticated Landing / Sign-in Page
   ------------------------------------------------------------
   Additive only — reuses existing glass-card / glow-* / neon-*
   utilities and the existing OKLCH token palette. New classes
   prefixed `.lp-` (landing page) to avoid collisions. Does NOT
   modify any existing token, class, or component.
   ============================================================ */

/* ---- Top nav bar (first block of landing content) ---- */
.lp-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  width: 100%;
  max-width: 72rem;
  margin: 0 auto;
  padding: 0.75rem 0.25rem 1.25rem;
}

.lp-nav-links {
  display: none;
  align-items: center;
  gap: 1.75rem;
}

.lp-nav-link {
  font-size: 0.875rem;
  font-weight: 500;
  color: oklch(var(--muted-foreground));
  text-decoration: none;
  transition: color 0.2s ease, text-shadow 0.2s ease;
  cursor: pointer;
}

.lp-nav-link:hover {
  color: oklch(var(--foreground));
  text-shadow: 0 0 8px oklch(0.88 0.24 195 / 0.4);
}

.lp-nav-user {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 999px;
  color: oklch(var(--muted-foreground));
  background: oklch(var(--card) / 0.5);
  border: 1px solid oklch(0.3 0.1 195 / 0.3);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  transition: color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.lp-nav-user:hover {
  color: oklch(0.88 0.24 195);
  border-color: oklch(0.88 0.24 195 / 0.5);
  box-shadow: 0 0 12px oklch(0.88 0.24 195 / 0.3);
}

@media (min-width: 768px) {
  .lp-nav-links {
    display: flex;
  }
}

/* Mobile: hide the landing page's own .lp-nav so only the sticky
   .app-top-header (with .app-mobile-logo) shows the brand once. The
   .app-top-header is display:none on >=768px, so desktop .lp-nav stays
   fully visible and unchanged. This removes the duplicate "Infinity Coin
   Wallet" header that appeared just below the sticky bar on phones. */
@media (max-width: 767px) {
  .lp-nav {
    display: none;
  }
}

/* ---- Hero section ---- */
.lp-hero {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 1.25rem;
  padding: 1.5rem 1rem 2.5rem;
  max-width: 48rem;
  margin: 0 auto;
}

.lp-hero-title {
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-size: clamp(2rem, 5vw, 3.25rem);
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: oklch(var(--foreground));
  text-shadow: 0 0 24px oklch(0.88 0.24 195 / 0.25);
}

.lp-hero-subtitle {
  font-size: clamp(0.95rem, 2vw, 1.125rem);
  font-weight: 400;
  line-height: 1.5;
  color: oklch(var(--muted-foreground));
  max-width: 32rem;
}

/* ---- Sign-in buttons row ---- */
.lp-auth-row {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  margin-top: 0.5rem;
}

/* Social buttons row — sits below the primary button */
.lp-auth-socials {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
}

/* Primary Internet Identity button — neon cyan border + glow */
.lp-auth-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  height: 3rem;
  padding: 0 1.75rem;
  border-radius: 1rem;
  font-size: 0.95rem;
  font-weight: 600;
  color: oklch(0.95 0.06 195);
  background: oklch(0.88 0.24 195 / 0.08);
  border: 1px solid oklch(0.88 0.24 195 / 0.55);
  box-shadow: 0 0 16px oklch(0.88 0.24 195 / 0.35), inset 0 0 18px
    oklch(0.88 0.24 195 / 0.08);
  cursor: pointer;
  transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease,
    transform 0.15s ease;
}

.lp-auth-primary:hover {
  background: oklch(0.88 0.24 195 / 0.14);
  border-color: oklch(0.88 0.24 195 / 0.8);
  box-shadow: 0 0 24px oklch(0.88 0.24 195 / 0.5), inset 0 0 24px
    oklch(0.88 0.24 195 / 0.12);
  transform: translateY(-1px);
}

.lp-auth-primary:active {
  transform: translateY(0);
}

.lp-auth-primary:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px oklch(var(--background)), 0 0 0 3px oklch(0.88 0.24 195),
    0 0 24px oklch(0.88 0.24 195 / 0.5);
}

/* Secondary social login icon buttons — white rounded squares */
.lp-auth-social {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  border-radius: 0.85rem;
  background: oklch(0.98 0.005 250 / 0.95);
  border: 1px solid oklch(0.85 0.02 250 / 0.4);
  color: oklch(0.2 0.02 250);
  cursor: pointer;
  transition: background 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease;
}

.lp-auth-social:hover {
  background: oklch(1 0 0);
  box-shadow: 0 0 14px oklch(0.88 0.24 195 / 0.25);
  transform: translateY(-1px);
}

.lp-auth-social:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px oklch(var(--background)), 0 0 0 3px oklch(0.88 0.24 195);
}

/* ---- Terms line ---- */
.lp-terms {
  margin-top: 0.75rem;
  font-size: 0.8rem;
  color: oklch(var(--muted-foreground));
}

.lp-terms-link {
  color: oklch(0.88 0.24 195 / 0.9);
  text-decoration: underline;
  text-underline-offset: 2px;
  transition: color 0.2s ease, text-shadow 0.2s ease;
  cursor: pointer;
  background: none;
  border: none;
  padding: 0;
  font: inherit;
}

.lp-terms-link:hover {
  color: oklch(0.88 0.24 195);
  text-shadow: 0 0 8px oklch(0.88 0.24 195 / 0.5);
}

/* ============================================================
   Device mockup preview (desktop monitor + phone)
   ------------------------------------------------------------
   Draws a desktop monitor (bezel + screen + stand) and a phone
   (rounded frame + screen) overlapping the bottom-left of the
   monitor, matching the reference mockup. Each device frame
   contains a real screenshot of the Infinity Coin Wallet app
   rendered as a static <img> with object-fit:cover so the
   screenshot's native aspect ratio is preserved inside the
   frame (no stretching/distortion). New classes are prefixed
   .lp-device-* to avoid collisions. Reuses the existing OKLCH
   neon cyan/purple/magenta palette and glow utilities.
   ============================================================ */

/* Outer wrap — centers the device cluster, adds ambient glow */
.lp-preview-wrap {
  display: flex;
  justify-content: center;
  padding: 1.5rem 1rem 3rem;
  max-width: 95.76rem;
  margin: 0 auto;
}

.lp-device-stage {
  position: relative;
  width: 100%;
  max-width: 79.8rem;
  display: flex;
  justify-content: center;
  /* Extra bottom room for the phone overlap + monitor stand */
  padding-bottom: 2.5rem;
}

/* Soft neon halo behind both devices */
.lp-device-stage::before {
  content: "";
  position: absolute;
  inset: -8% -6% -12% -6%;
  background: radial-gradient(
      ellipse at 30% 35%,
      oklch(0.88 0.24 195 / 0.22) 0%,
      transparent 55%
    ),
    radial-gradient(
      ellipse at 75% 70%,
      oklch(0.55 0.24 300 / 0.2) 0%,
      transparent 55%
    ),
    radial-gradient(
      ellipse at 55% 50%,
      oklch(0.84 0.2 85 / 0.1) 0%,
      transparent 45%
    );
  filter: blur(20px);
  pointer-events: none;
  z-index: 0;
}

/* ---- Desktop monitor ---- */
.lp-device-monitor {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 69.16rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* Monitor bezel / body — dark frame with neon cyan glow border */
.lp-device-bezel {
  position: relative;
  width: 100%;
  box-sizing: border-box;
  border-radius: 1.463rem;
  padding: 0.7315rem 0.7315rem 0.532rem;
  background: linear-gradient(
    160deg,
    oklch(0.14 0.03 240 / 0.95),
    oklch(0.07 0.02 240 / 0.98)
  );
  border: 1px solid oklch(0.88 0.24 195 / 0.45);
  box-shadow: 0 0 22px oklch(0.88 0.24 195 / 0.3), 0 0 60px
    oklch(0.55 0.24 300 / 0.18), 0 18px 50px rgba(0, 0, 0, 0.55), inset 0 0 24px
    oklch(0.88 0.24 195 / 0.05);
}

/* Top neon hairline on the bezel */
.lp-device-bezel::before {
  content: "";
  position: absolute;
  top: 0;
  left: 14%;
  right: 14%;
  height: 1px;
  background: linear-gradient(
    to right,
    transparent,
    oklch(0.88 0.24 195 / 0.75),
    oklch(0.55 0.24 300 / 0.6),
    transparent
  );
  pointer-events: none;
}

/* Tiny webcam dot centered on the top bezel edge */
.lp-device-bezel::after {
  content: "";
  position: absolute;
  top: 0.22rem;
  left: 50%;
  transform: translateX(-50%);
  width: 0.28rem;
  height: 0.28rem;
  border-radius: 999px;
  background: oklch(0.3 0.05 240);
  box-shadow: inset 0 0 2px oklch(0.88 0.24 195 / 0.5);
}

/* Screen area inside the bezel — matches the dashboard-desktop.png aspect
   ratio (1919x1031 ≈ 1.861:1, wider than 16:9) so object-fit:cover no longer
   crops the screenshot's left and right edges. The bezel frames the screenshot
   instead of clipping its sides. */
.lp-device-screen {
  position: relative;
  width: 100%;
  box-sizing: border-box;
  border-radius: 0.7315rem;
  overflow: hidden;
  background: oklch(0.06 0.025 240);
  border: 1px solid oklch(0.25 0.06 240 / 0.6);
  box-shadow: inset 0 0 18px oklch(0.88 0.24 195 / 0.06);
  aspect-ratio: 1919 / 1031;
  /* Small floor so the screen never collapses below a usable size on narrow widths.
     At max-width 69.16rem the natural height is ~37.16rem (69.16 * 1031/1919),
     slightly shorter than the prior 16:9 height (~38.9rem); 15.0rem preserves a
     floor without forcing extra height. */
  min-height: 15.0rem;
}

/* Desktop dashboard screenshot — fills the monitor screen, preserving 16:9 */
.lp-device-screen-img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
  /* Subtle inner glow so the screenshot blends with the neon frame */
  filter: saturate(1.05);
}

/* Monitor stand — neck + foot */
.lp-device-stand {
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 0.1rem;
}

.lp-device-stand-neck {
  width: 3.458rem;
  height: 1.463rem;
  background: linear-gradient(
    to bottom,
    oklch(0.16 0.03 240 / 0.95),
    oklch(0.1 0.02 240 / 0.98)
  );
  border-left: 1px solid oklch(0.3 0.08 240 / 0.6);
  border-right: 1px solid oklch(0.3 0.08 240 / 0.6);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4);
}

.lp-device-stand-foot {
  width: 11.97rem;
  height: 0.7315rem;
  border-radius: 0 0 1.064rem 1.064rem;
  background: linear-gradient(
    to bottom,
    oklch(0.14 0.03 240 / 0.95),
    oklch(0.08 0.02 240 / 0.98)
  );
  border: 1px solid oklch(0.3 0.08 240 / 0.6);
  border-top: none;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.5), 0 0 14px
    oklch(0.55 0.24 300 / 0.12);
}

/* ---- Phone mockup (foreground, overlapping the LEFT edge of the monitor) ---- */
.lp-device-phone {
  position: absolute;
  z-index: 2;
  /* Sit to the LEFT of the monitor and overlap its left edge.
     Phone is intentionally SMALLER than the monitor so it reads
     as a small phone overlapping the monitor's bottom-left corner. */
  left: -2.793rem;
  bottom: 1.995rem;
  width: 17.0107rem;
  /* Tall portrait smartphone proportions (matches the 9:19.5 mobile screenshot) */
  aspect-ratio: 9 / 19.5;
  /* Phone body — rounded rectangle frame with neon glow */
  border-radius: 1.862rem;
  padding: 0.4655rem 0.399rem 0.532rem;
  background: linear-gradient(
    160deg,
    oklch(0.14 0.03 240 / 0.96),
    oklch(0.07 0.02 240 / 0.98)
  );
  border: 1px solid oklch(0.88 0.24 195 / 0.5);
  box-shadow: 0 0 18px oklch(0.88 0.24 195 / 0.35), 0 0 40px
    oklch(0.55 0.24 300 / 0.2), 0 14px 36px rgba(0, 0, 0, 0.6), inset 0 0 14px
    oklch(0.88 0.24 195 / 0.06);
}

/* Notch at the top of the phone */
.lp-device-phone::before {
  content: "";
  position: absolute;
  top: 0.4rem;
  left: 50%;
  transform: translateX(-50%);
  width: 1.3rem;
  height: 0.18rem;
  border-radius: 999px;
  background: oklch(0.25 0.05 240);
  z-index: 3;
}

/* Phone screen — height follows the phone's 9:19.5 aspect ratio.
   The screenshot <img> fills this area with object-fit:cover so the
   9:19.5 mobile screenshot is preserved without distortion. */
.lp-device-phone-screen {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 1.33rem;
  overflow: hidden;
  background: oklch(0.06 0.025 240);
  border: 1px solid oklch(0.25 0.06 240 / 0.6);
  box-shadow: inset 0 0 12px oklch(0.88 0.24 195 / 0.06);
}

/* Mobile app screenshot — fills the phone screen, preserving 9:19.5 */
.lp-device-phone-screen-img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center top;
     object-position: center top;
  filter: saturate(1.05);
}

/* ---- Responsive scaling ---- */
/* Tablet/narrow desktop: shrink the phone so it stays a small overlap on the
   monitor. Use a non-negative left offset so the phone never overflows the
   viewport's left edge. The base rule's left:-2.793rem would overflow once the
   stage (max-width:79.8rem) is constrained by the viewport (below ~1310px), so
   this breakpoint catches every width where that happens. The monitor is
   centered within the stage, so a small positive left value still overlaps the
   monitor's bottom-left corner while keeping the phone fully on-screen. */
@media (max-width: 1310px) {
  .lp-device-phone {
    width: 13.167rem;
    left: 0.5rem;
    bottom: 1.995rem;
  }
}

/* Mobile: stack — shrink both devices so the monitor never overflows the
   left/right edges and the phone stays fully visible (no bottom cutoff).
   The phone overlaps the monitor's bottom-LEFT corner, matching the desktop
   reference mockup. The stage is a column flex; the phone uses align-self
   flex-start + a small left offset + a negative margin-top to pull it up
   over the monitor's bottom-left. Total stacked height is bounded by the
   monitor's natural aspect-ratio height plus the (smaller) phone overlap. */
@media (max-width: 640px) {
  .lp-device-stage {
    flex-direction: column;
    align-items: center;
    /* Bottom padding so the phone's bottom edge is never clipped by the
       stage. The phone is pulled up by -3.5rem but its tall portrait body
       (8rem wide -> ~17.3rem tall) can still extend past the monitor's bottom;
       1rem of padding guarantees it stays fully on-screen. */
    padding-bottom: 1rem;
  }
  .lp-device-monitor {
    /* Keep a small gutter on both sides so the monitor never touches the
       viewport edges. 92vw leaves 4vw on each side. */
    max-width: 92vw;
    width: 100%;
    /* Monitor sits behind the phone. */
    z-index: 1;
  }
  .lp-device-screen {
    /* Shorter floor so the monitor is not too tall on small phones. */
    min-height: 9rem;
  }
  .lp-device-phone {
    position: relative;
    left: auto;
    bottom: auto;
    /* Pull the phone up over the monitor's bottom edge. Wider phone needs
       a slightly larger pull-up so it still overlaps the monitor's
       bottom-left corner. */
    margin-top: -4rem;
    /* Sit at the bottom-LEFT of the monitor (matches desktop reference).
       Reduced from 1.5rem to 1rem so the wider phone stays within the
       mobile viewport. */
    align-self: flex-start;
    margin-left: 1rem;
    /* Widened from 8rem to 10.5rem so the dashboard-mobile.png screenshot
       inside is NOT clipped on the left and right sides. Still narrow
       enough that phone + left offset never exceeds the monitor/viewport. */
    width: 10.5rem;
    /* Narrower horizontal padding than the base 0.399rem gives the inner
       screen more width, further reducing screenshot edge clipping. */
    padding: 0.4655rem 0.2rem 0.532rem;
    /* Phone renders IN FRONT of the monitor (overlaps its bottom-left
       corner). Base rule already sets z-index:2; restate here so the
       mobile override is unambiguous. */
    z-index: 2;
  }
  /* Reduce the phone screen's corner radius on mobile so the rounded
     curves clip less of the screenshot. At width:8rem the base
     border-radius:1.33rem is proportionally large; 1rem keeps the curve
     while preserving more of the screenshot's corners. */
  .lp-device-phone-screen {
    border-radius: 1rem;
  }
}

/* ---- Feature cards ---- */
.lp-features {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
  padding: 0 1rem 3rem;
  max-width: 72rem;
  margin: 0 auto;
}

@media (min-width: 768px) {
  .lp-features {
    grid-template-columns: repeat(3, 1fr);
  }
}

.lp-feature {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: 1.5rem 1.25rem;
  border-radius: 1.25rem;
  background: oklch(0.1 0.035 240 / 0.6);
  backdrop-filter: blur(16px) saturate(180%);
  -webkit-backdrop-filter: blur(16px) saturate(180%);
  border: 1px solid oklch(0.3 0.1 195 / 0.3);
  box-shadow: 0 0 16px oklch(0.88 0.24 195 / 0.12), 0 8px 32px
    rgba(0, 0, 0, 0.35);
  transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.2s
    ease;
}

.lp-feature:hover {
  border-color: oklch(0.88 0.24 195 / 0.5);
  box-shadow: 0 0 24px oklch(0.88 0.24 195 / 0.25), 0 12px 40px
    rgba(0, 0, 0, 0.4);
  transform: translateY(-2px);
}

.lp-feature-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  border-radius: 0.85rem;
  color: oklch(0.88 0.24 195);
  background: oklch(0.88 0.24 195 / 0.1);
  border: 1px solid oklch(0.88 0.24 195 / 0.45);
  box-shadow: 0 0 14px oklch(0.88 0.24 195 / 0.3), inset 0 0 14px
    oklch(0.88 0.24 195 / 0.08);
}

.lp-feature-text {
  font-size: 0.92rem;
  font-weight: 500;
  line-height: 1.45;
  color: oklch(var(--foreground));
}

/* ---- Landing page wrapper ---- */
.lp-root {
  display: flex;
  flex-direction: column;
  width: 100%;
}

@media (prefers-reduced-motion: reduce) {
  .lp-auth-primary,
  .lp-auth-social,
  .lp-feature,
  .lp-nav-link,
  .lp-nav-user,
  .lp-terms-link {
    transition: none !important;
  }
}

.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.4rem;
}

.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.8125rem;
  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));
}

.placeholder\:text-muted-foreground\/60::-moz-placeholder {
  color: oklch(var(--muted-foreground) / 0.6);
}

.placeholder\:text-muted-foreground\/60::placeholder {
  color: oklch(var(--muted-foreground) / 0.6);
}

.after\:absolute::after {
  content: var(--tw-content);
  position: absolute;
}

.after\:-inset-2::after {
  content: var(--tw-content);
  inset: -0.4rem;
}

.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.2rem;
}

.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-b-0:last-child {
  border-bottom-width: 0px;
}

.hover\:border-primary\/35:hover {
  border-color: oklch(var(--primary) / 0.35);
}

.hover\:border-primary\/40:hover {
  border-color: oklch(var(--primary) / 0.4);
}

.hover\:border-primary\/50:hover {
  border-color: oklch(var(--primary) / 0.5);
}

.hover\:border-primary\/60:hover {
  border-color: oklch(var(--primary) / 0.6);
}

.hover\:border-primary\/70:hover {
  border-color: oklch(var(--primary) / 0.7);
}

.hover\:bg-accent:hover {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--accent) / var(--tw-bg-opacity, 1));
}

.hover\:bg-accent\/40:hover {
  background-color: oklch(var(--accent) / 0.4);
}

.hover\:bg-amber-500\/10:hover {
  background-color: rgb(245 158 11 / 0.1);
}

.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\/10:hover {
  background-color: rgb(16 185 129 / 0.1);
}

.hover\:bg-muted:hover {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--muted) / var(--tw-bg-opacity, 1));
}

.hover\:bg-muted\/50:hover {
  background-color: oklch(var(--muted) / 0.5);
}

.hover\:bg-orange-500\/10:hover {
  background-color: rgb(249 115 22 / 0.1);
}

.hover\:bg-primary\/10:hover {
  background-color: oklch(var(--primary) / 0.1);
}

.hover\:bg-primary\/30:hover {
  background-color: oklch(var(--primary) / 0.3);
}

.hover\:bg-primary\/5:hover {
  background-color: oklch(var(--primary) / 0.05);
}

.hover\:bg-primary\/90:hover {
  background-color: oklch(var(--primary) / 0.9);
}

.hover\:bg-purple-500\/10:hover {
  background-color: rgb(168 85 247 / 0.1);
}

.hover\:bg-purple-500\/5:hover {
  background-color: rgb(168 85 247 / 0.05);
}

.hover\:bg-secondary\/10:hover {
  background-color: oklch(var(--secondary) / 0.1);
}

.hover\:bg-secondary\/30:hover {
  background-color: oklch(var(--secondary) / 0.3);
}

.hover\:bg-secondary\/80:hover {
  background-color: oklch(var(--secondary) / 0.8);
}

.hover\:bg-white\/10:hover {
  background-color: rgb(255 255 255 / 0.1);
}

.hover\:bg-yellow-500\/10:hover {
  background-color: rgb(234 179 8 / 0.1);
}

.hover\:text-accent-foreground:hover {
  color: oklch(var(--accent-foreground));
}

.hover\:text-destructive:hover {
  --tw-text-opacity: 1;
  color: oklch(var(--destructive) / 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-primary:hover {
  --tw-text-opacity: 1;
  color: oklch(var(--primary) / var(--tw-text-opacity, 1));
}

.hover\:text-secondary-foreground:hover {
  color: oklch(var(--secondary-foreground));
}

.hover\:text-white:hover {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.hover\:underline:hover {
  text-decoration-line: underline;
}

.hover\:opacity-100:hover {
  opacity: 1;
}

.hover\:opacity-90:hover {
  opacity: 0.9;
}

.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-glow:hover {
  --tw-shadow: 0 0 16px oklch(var(--primary) / 0.45), 0 0 40px oklch(var(--primary) / 0.20);
  --tw-shadow-colored: 0 0 16px var(--tw-shadow-color), 0 0 40px 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-glow-lg:hover {
  --tw-shadow: 0 0 24px oklch(var(--primary) / 0.55), 0 0 60px oklch(var(--primary) / 0.28), 0 0 120px oklch(var(--primary) / 0.10);
  --tw-shadow-colored: 0 0 24px var(--tw-shadow-color), 0 0 60px var(--tw-shadow-color), 0 0 120px 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-glow-sm:hover {
  --tw-shadow: 0 0 10px oklch(var(--primary) / 0.35), 0 0 20px oklch(var(--primary) / 0.15);
  --tw-shadow-colored: 0 0 10px var(--tw-shadow-color), 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);
}

.focus\:z-10:focus {
  z-index: 10;
}

.focus\:border-primary\/40:focus {
  border-color: oklch(var(--primary) / 0.4);
}

.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\:outline-none:focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
}

.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-none:focus-visible {
  outline: 2px solid transparent;
  outline-offset: 2px;
}

.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\:scale-95:active {
  --tw-scale-x: .95;
  --tw-scale-y: .95;
  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));
}

.active\:scale-\[0\.98\]:active {
  --tw-scale-x: 0.98;
  --tw-scale-y: 0.98;
  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));
}

.active\:text-primary:active {
  --tw-text-opacity: 1;
  color: oklch(var(--primary) / var(--tw-text-opacity, 1));
}

.active\:shadow-glow:active {
  --tw-shadow: 0 0 16px oklch(var(--primary) / 0.45), 0 0 40px oklch(var(--primary) / 0.20);
  --tw-shadow-colored: 0 0 16px var(--tw-shadow-color), 0 0 40px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.disabled\:pointer-events-none:disabled {
  pointer-events: none;
}

.disabled\:cursor-not-allowed:disabled {
  cursor: not-allowed;
}

.disabled\:opacity-50:disabled {
  opacity: 0.5;
}

.group[open] .group-open\: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));
}

.group\/menu-item:focus-within .group-focus-within\/menu-item\:opacity-100 {
  opacity: 1;
}

.group:hover .group-hover\:text-amber-400 {
  --tw-text-opacity: 1;
  color: rgb(251 191 36 / var(--tw-text-opacity, 1));
}

.group:hover .group-hover\:text-amber-500 {
  --tw-text-opacity: 1;
  color: rgb(245 158 11 / var(--tw-text-opacity, 1));
}

.group:hover .group-hover\:text-blue-400 {
  --tw-text-opacity: 1;
  color: rgb(96 165 250 / var(--tw-text-opacity, 1));
}

.group:hover .group-hover\:text-cyan-400 {
  --tw-text-opacity: 1;
  color: rgb(34 211 238 / var(--tw-text-opacity, 1));
}

.group:hover .group-hover\:text-emerald-400 {
  --tw-text-opacity: 1;
  color: rgb(52 211 153 / var(--tw-text-opacity, 1));
}

.group:hover .group-hover\:text-indigo-400 {
  --tw-text-opacity: 1;
  color: rgb(129 140 248 / var(--tw-text-opacity, 1));
}

.group:hover .group-hover\:text-lime-400 {
  --tw-text-opacity: 1;
  color: rgb(163 230 53 / var(--tw-text-opacity, 1));
}

.group:hover .group-hover\:text-orange-400 {
  --tw-text-opacity: 1;
  color: rgb(251 146 60 / var(--tw-text-opacity, 1));
}

.group:hover .group-hover\:text-pink-400 {
  --tw-text-opacity: 1;
  color: rgb(244 114 182 / var(--tw-text-opacity, 1));
}

.group:hover .group-hover\:text-primary {
  --tw-text-opacity: 1;
  color: oklch(var(--primary) / var(--tw-text-opacity, 1));
}

.group:hover .group-hover\:text-rose-400 {
  --tw-text-opacity: 1;
  color: rgb(251 113 133 / var(--tw-text-opacity, 1));
}

.group:hover .group-hover\:text-slate-400 {
  --tw-text-opacity: 1;
  color: rgb(148 163 184 / var(--tw-text-opacity, 1));
}

.group:hover .group-hover\:text-yellow-400 {
  --tw-text-opacity: 1;
  color: rgb(250 204 21 / var(--tw-text-opacity, 1));
}

.group\/menu-item:hover .group-hover\/menu-item\:opacity-100 {
  opacity: 1;
}

.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.6rem;
       column-gap: 0.6rem;
}

.has-\[\>svg\]\:px-2\.5:has(>svg) {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

.has-\[\>svg\]\:px-3:has(>svg) {
  padding-left: 0.6rem;
  padding-right: 0.6rem;
}

.has-\[\>svg\]\:px-4:has(>svg) {
  padding-left: 0.8rem;
  padding-right: 0.8rem;
}

.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.3rem;
}

.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: 1.6rem;
}

.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.3rem;
}

.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.2rem;
  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.2rem;
  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.2rem;
  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.2rem;
  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-\[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: 1.6rem;
}

.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-\[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.1);
  --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.4rem;
}

.data-\[side\=left\]\:slide-in-from-right-2[data-side="left"] {
  --tw-enter-translate-x: 0.4rem;
}

.data-\[side\=right\]\:slide-in-from-left-2[data-side="right"] {
  --tw-enter-translate-x: -0.4rem;
}

.data-\[side\=top\]\:slide-in-from-bottom-2[data-side="top"] {
  --tw-enter-translate-y: 0.4rem;
}

.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.4rem;
}

.\*\: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.2rem;
}

.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-\[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: -0.8rem;
}

.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: -1.6rem;
}

.group\/navigation-menu[data-viewport="false"] .group-data-\[viewport\=false\]\/navigation-menu\:mt-1\.5 {
  margin-top: 0.3rem;
}

.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\/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\/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.3rem;
}

.peer\/menu-button[data-size="lg"] ~ .peer-data-\[size\=lg\]\/menu-button\:top-2\.5 {
  top: 0.5rem;
}

.peer\/menu-button[data-size="sm"] ~ .peer-data-\[size\=sm\]\/menu-button\:top-1 {
  top: 0.2rem;
}

.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-amber-400:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(251 191 36 / var(--tw-text-opacity, 1));
}

.dark\:text-emerald-400:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(52 211 153 / var(--tw-text-opacity, 1));
}

.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\:mr-1 {
    margin-right: 0.2rem;
  }

  .sm\:block {
    display: block;
  }

  .sm\:inline {
    display: inline;
  }

  .sm\:flex {
    display: flex;
  }

  .sm\:h-16 {
    height: 3.2rem;
  }

  .sm\:max-h-\[52vh\] {
    max-height: 52vh;
  }

  .sm\:max-h-\[60vh\] {
    max-height: 60vh;
  }

  .sm\:min-h-0 {
    min-height: 0px;
  }

  .sm\:w-11 {
    width: 2.75rem;
  }

  .sm\:max-w-2xl {
    max-width: 42rem;
  }

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

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

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

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

  .sm\:items-center {
    align-items: center;
  }

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

  .sm\:gap-2 {
    gap: 0.4rem;
  }

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

  .sm\:gap-3 {
    gap: 0.6rem;
  }

  .sm\:p-4 {
    padding: 0.8rem;
  }

  .sm\:p-5 {
    padding: 1rem;
  }

  .sm\:p-6 {
    padding: 1.2rem;
  }

  .sm\:px-4 {
    padding-left: 0.8rem;
    padding-right: 0.8rem;
  }

  .sm\:py-3 {
    padding-top: 0.6rem;
    padding-bottom: 0.6rem;
  }

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

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

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

  .sm\:text-base {
    font-size: 0.875rem;
    line-height: 1.5rem;
  }

  .sm\:text-lg {
    font-size: 1rem;
    line-height: 1.5rem;
  }

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

  .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\:block {
    display: block;
  }

  .md\:flex {
    display: flex;
  }

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

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

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

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

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

  .md\:text-sm {
    font-size: 0.8125rem;
    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.4rem;
  }

  .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.4rem;
  }

  .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);
  }
}

.\[\&\: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.7rem;
  line-height: 1rem;
}

.\[\&\>span\]\:opacity-70>span {
  opacity: 0.7;
}

.\[\&\>svg\]\:pointer-events-none>svg {
  pointer-events: none;
}

.\[\&\>svg\]\:size-3>svg {
  width: 0.6rem;
  height: 0.6rem;
}

.\[\&\>svg\]\:size-3\.5>svg {
  width: 0.7rem;
  height: 0.7rem;
}

.\[\&\>svg\]\:size-4>svg {
  width: 0.8rem;
  height: 0.8rem;
}

.\[\&\>svg\]\:h-2\.5>svg {
  height: 0.5rem;
}

.\[\&\>svg\]\:h-3>svg {
  height: 0.6rem;
}

.\[\&\>svg\]\:w-2\.5>svg {
  width: 0.5rem;
}

.\[\&\>svg\]\:w-3>svg {
  width: 0.6rem;
}

.\[\&\>svg\]\:shrink-0>svg {
  flex-shrink: 0;
}

.\[\&\>svg\]\:translate-y-0\.5>svg {
  --tw-translate-y: 0.1rem;
  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));
}

.\[\&\>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.4rem;
  padding-right: 0.4rem;
}

.\[\&_\[cmdk-group-heading\]\]\:py-1\.5 [cmdk-group-heading] {
  padding-top: 0.3rem;
  padding-bottom: 0.3rem;
}

.\[\&_\[cmdk-group-heading\]\]\:text-xs [cmdk-group-heading] {
  font-size: 0.7rem;
  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.4rem;
  padding-right: 0.4rem;
}

.\[\&_\[cmdk-input-wrapper\]_svg\]\:h-5 [cmdk-input-wrapper] svg {
  height: 1rem;
}

.\[\&_\[cmdk-input-wrapper\]_svg\]\:w-5 [cmdk-input-wrapper] svg {
  width: 1rem;
}

.\[\&_\[cmdk-input\]\]\:h-12 [cmdk-input] {
  height: 2.4rem;
}

.\[\&_\[cmdk-item\]\]\:px-2 [cmdk-item] {
  padding-left: 0.4rem;
  padding-right: 0.4rem;
}

.\[\&_\[cmdk-item\]\]\:py-3 [cmdk-item] {
  padding-top: 0.6rem;
  padding-bottom: 0.6rem;
}

.\[\&_\[cmdk-item\]_svg\]\:h-5 [cmdk-item] svg {
  height: 1rem;
}

.\[\&_\[cmdk-item\]_svg\]\:w-5 [cmdk-item] svg {
  width: 1rem;
}

.\[\&_p\]\:leading-relaxed p {
  line-height: 1.625;
}

.\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-4 svg:not([class*='size-']) {
  width: 0.8rem;
  height: 0.8rem;
}

.\[\&_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.4rem;
}

[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.4rem;
}

[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));
}