
      html {
        text-size-adjust: 100%;
        -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
      }

      body {
        margin: 0px;
      }

      input::-webkit-search-cancel-button,
      input::-webkit-search-decoration,
      input::-webkit-search-results-button,
      input::-webkit-search-results-decoration {
        display: none;
      }

      [stylesheet-group="1"] {}

      .css-175oi2r {
        align-items: stretch;
        background-color: rgba(0, 0, 0, 0);
        border: 0px solid black;
        box-sizing: border-box;
        display: flex;
        flex-basis: auto;
        flex-direction: column;
        flex-shrink: 0;
        list-style: none;
        margin: 0px;
        min-height: 0px;
        min-width: 0px;
        padding: 0px;
        position: relative;
        text-decoration: none;
        z-index: 0;
      }

      .css-9pa8cd {
        inset: 0px;
        height: 100%;
        opacity: 0;
        position: absolute;
        width: 100%;
        z-index: -1;
      }

      [stylesheet-group="2"] {}

      .r-xoduu5 {
        display: inline-flex;
      }

      .r-1udh08x {
        overflow: hidden;
      }

      [stylesheet-group="3"] {}

      .r-1p0dtai {
        bottom: 0px;
      }

      .r-1d2f490 {
        left: 0px;
      }

      .r-u8s1d {
        position: absolute;
      }

      .r-zchlnj {
        right: 0px;
      }

      .r-ipm5af {
        top: 0px;
      }

      .r-105ug2t {
        pointer-events: auto !important;
      }

      .r-12vffkv>* {
        pointer-events: auto;
      }

      .r-12vffkv {
        pointer-events: none !important;
      }

      .r-ah5dr5>* {
        pointer-events: none;
      }

      .r-ah5dr5 {
        pointer-events: auto !important;
      }

      .r-633pao {
        pointer-events: none !important;
      }

      .r-1mlwlqe {
        flex-basis: auto;
      }

      .r-417010 {
        z-index: 0;
      }

      .r-1niwhzg {
        background-color: rgba(0, 0, 0, 0);
      }

      .r-vvn4in {
        background-position: center center;
      }

      .r-u6sd8q {
        background-repeat: no-repeat;
      }

      .r-4gszlv {
        background-size: cover;
      }

      .r-1pi2tsx {
        height: 100%;
      }

      .r-13qz1uu {
        width: 100%;
      }

      .r-1wyyakw {
        z-index: -1;
      }

      .r-1sxrcry {
        background-size: auto;
      }

      .r-ehq7j7 {
        background-size: contain;
      }

      .r-1mrlafo {
        background-position: 0px center;
      }

      .r-17leim2 {
        background-repeat: repeat;
      }

      .r-x3cy2q {
        background-size: 100% 100%;
      }

      .r-1loqt21 {
        cursor: pointer;
      }

      .r-1otgn73 {
        touch-action: manipulation;
      }
      * {
        font-family: 'Basel', sans-serif;
        box-sizing: border-box;
      }

      /**
        Explicitly load Basel var from public/ so it does not block LCP's critical path.
      */
      @font-face {
        font-family: 'Basel';
        font-weight: 535;
        font-style: normal;
        font-display: block;
        src:
          url("Basel-Grotesk-Medium.woff2") format('woff2'),
          url("Basel-Grotesk-Medium.woff") format('woff');
      }

      @font-face {
        font-family: 'Basel';
        font-weight: 485;
        font-style: normal;
        font-display: block;
        src:
          url("Basel-Grotesk-Book.woff2") format('woff2'),
          url("Basel-Grotesk-Book.woff") format('woff');
      }

      /* Subsetted Inter Regular, fetched lazily only when the Privy watermark renders (PrivyWatermark.tsx). */
      @font-face {
        font-family: 'Inter';
        font-weight: 400;
        font-style: normal;
        font-display: swap;
        unicode-range: U+0020-007E, U+00A0-024F, U+1E00-1EFF;
        src: url("") format('woff2');
      }

      @supports (font-variation-settings: normal) {
        * {
          font-family: 'Basel', sans-serif;
        }
      }

      html,
      body {
        margin: 0;
        padding: 0;
      }

      /* Only apply overflow-x: hidden on desktop */
      @media (min-width: 768px) {
        html {
          overflow-x: hidden;
        }
      }

      button {
        user-select: none;
      }

      html {
        font-size: 16px;
        font-weight: 485;
        font-variant: none;
        font-smooth: always;
        text-rendering: optimizeLegibility !important;
        -webkit-font-smoothing: antialiased !important;
        -moz-osx-font-smoothing: grayscale;
        -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
      }

      html,
      body,
      #root {
        min-height: 100%;
      }

      @media (prefers-color-scheme: dark) {
        html {
          background: linear-gradient(rgb(19, 19, 19) 0%, rgb(19, 19, 19) 100%);
        }
      }

      @media (prefers-color-scheme: light) {
        html {
          background: radial-gradient(100% 100% at 50% 0%, rgba(255, 184, 226, 0) 0%, rgba(255, 255, 255, 0) 100%), rgb(255, 255, 255);
        }
      }
      @keyframes uw-modal-fade-in {
        from {
          opacity: 0;
        }
      }

      @keyframes uw-modal-fade-out {
        to {
          opacity: 0;
        }
      }

      @keyframes uw-modal-enter-from-below {
        from {
          opacity: 0;
          transform: translateY(12px);
        }
      }

      @keyframes uw-modal-enter-from-above {
        from {
          opacity: 0;
          transform: translateY(-12px);
        }
      }

      @keyframes uw-modal-exit-down {
        to {
          opacity: 0;
          transform: translateY(10px);
        }
      }

      @keyframes uw-modal-exit-up {
        to {
          opacity: 0;
          transform: translateY(-10px);
        }
      }

      @keyframes uw-attachment-enter-from-below {
        from {
          opacity: 0;
          transform: translateY(20px);
        }
      }

      @keyframes uw-attachment-enter-from-above {
        from {
          opacity: 0;
          transform: translateY(-20px);
        }
      }

      @keyframes uw-sheet-enter {
        from {
          transform: translateY(100%);
        }
      }

      @keyframes uw-presence-hold {
        from {
          opacity: 1;
        }

        to {
          opacity: 1;
        }
      }

      /* Radix Presence gates each direct portal child on its own animationName: the positioner needs a
   closed-state animation at least as long as the longest content exit (100ms attachment legs) or
   the exiting content unmounts instantly with it. Visually inert (opacity 1 -> 1). */
      .uw-modal-positioner[data-state='closed'] {
        animation: uw-presence-hold 100ms linear forwards;
      }

      .uw-modal-overlay[data-state='open'] {
        animation: uw-modal-fade-in 300ms ease-in-out;
      }

      .uw-modal-overlay[data-state='closed'] {
        animation: uw-modal-fade-out 300ms ease-in-out forwards;
      }

      .uw-modal-content-center[data-state='open'] {
        animation: uw-modal-enter-from-below 100ms cubic-bezier(0.17, 0.67, 0.45, 1);
      }

      .uw-modal-content-center[data-state='closed'] {
        animation: uw-modal-exit-down 80ms cubic-bezier(0.17, 0.67, 0.45, 1) forwards;
      }

      .uw-modal-content-top[data-state='open'] {
        animation: uw-modal-enter-from-above 100ms cubic-bezier(0.17, 0.67, 0.45, 1);
      }

      .uw-modal-content-top[data-state='closed'] {
        animation: uw-modal-exit-up 80ms cubic-bezier(0.17, 0.67, 0.45, 1) forwards;
      }

      .uw-attachment-content-center[data-state='open'] {
        animation: uw-attachment-enter-from-below 120ms cubic-bezier(0.17, 0.67, 0.45, 1);
      }

      .uw-attachment-content-center[data-state='closed'] {
        animation: uw-modal-exit-down 100ms cubic-bezier(0.17, 0.67, 0.45, 1) forwards;
      }

      .uw-attachment-content-top[data-state='open'] {
        animation: uw-attachment-enter-from-above 120ms cubic-bezier(0.17, 0.67, 0.45, 1);
      }

      .uw-attachment-content-top[data-state='closed'] {
        animation: uw-modal-exit-up 100ms cubic-bezier(0.17, 0.67, 0.45, 1) forwards;
      }

      .uw-modal-content-center:focus-visible,
      .uw-modal-content-top:focus-visible,
      .uw-attachment-content-center:focus-visible,
      .uw-attachment-content-top:focus-visible,
      .uw-sheet-frame:focus-visible {
        outline: none;
      }

      .uw-sheet-overlay[data-state='open'] {
        animation: uw-modal-fade-in 500ms cubic-bezier(0.25, 0.1, 0.25, 1);
      }

      .uw-sheet-frame[data-state='open'] {
        animation: uw-sheet-enter 200ms ease-in-out;
      }

      /* The sheet is force-mounted while closed (Tamagui Sheet parity), so 'closed' is a static hidden
   state — transform/opacity here, transitions handle the exit leg — rather than an exit keyframe,
   which would visibly play on every initial closed mount. visibility flips after the exit
   transition so closed chrome is untabbable without cutting the slide-out short. */
      .uw-sheet-overlay[data-state='closed'] {
        opacity: 0;
        pointer-events: none;
        visibility: hidden;
        transition: opacity 500ms cubic-bezier(0.25, 0.1, 0.25, 1), visibility 0s linear 500ms;
      }

      .uw-sheet-frame[data-state='closed'] {
        transform: translateY(100%);
        pointer-events: none;
        visibility: hidden;
        transition: transform 200ms ease-in-out, visibility 0s linear 200ms;
      }
      @keyframes uniswap-cloud-item-enter {
        from {
          transform: translateY(30px);
        }

        to {
          transform: translateY(0);
        }
      }

      @keyframes uniswap-cloud-icon-enter {
        from {
          transform: translateY(30px) scale(0) rotate(-15deg);
          opacity: 0;
        }

        to {
          transform: translateY(0) scale(1) rotate(15deg);
          opacity: 1;
        }
      }
      :root {
        --privy-color-background: #FFFFFF;
        --privy-color-background-2: #F1F2F9;
        --privy-color-background-3: #5B4FFF;
        --privy-color-foreground: #040217;
        --privy-color-foreground-2: #64668B;
        --privy-color-foreground-3: #9498B8;
        --privy-color-foreground-4: #E2E3F0;
        --privy-color-foreground-accent: hsl(246, 84%, 5%);
        --privy-color-accent: hsl(299, 100%, 72%);
        --privy-color-accent-light: hsl(299, 100%, 87%);
        --privy-color-accent-hover: hsl(0, 0%, 100%);
        --privy-color-accent-dark: hsl(299, 100%, 66%);
        --privy-color-accent-darkest: hsl(299, 100%, 12%);
        --privy-color-success: #DCFCE7;
        --privy-color-success-dark: #135638;
        --privy-color-success-light: #DCFCE7;
        --privy-color-success-bg: #DCFCE7;
        --privy-color-error: #991B1B;
        --privy-color-error-light: #FEE2E2;
        --privy-color-error-bg: #FEE2E2;
        --privy-color-error-bg-hover: #FECACA;
        --privy-color-warn: #FEF3C7;
        --privy-color-warn-light: #FEF3C7;
        --privy-color-warn-bg: #FEF3C7;
        --privy-color-warning-dark: #906218;
        --privy-color-error-dark: #991B1B;
        --privy-color-info-bg: #E0E7FF;
        --privy-color-info-bg-hover: #EEF2FF;
        --privy-color-border-default: #E2E3F0;
        --privy-color-border-hover: #E2E3F0;
        --privy-color-border-focus: #949DF9;
        --privy-color-border-error: #F69393;
        --privy-color-border-success: #87D7B7;
        --privy-color-border-warning: #FACD63;
        --privy-color-border-info: #F1F2F9;
        --privy-color-border-interactive: #5B4FFF;
        --privy-color-border-interactive-hover: #5B4FFF;
        --privy-color-background-hover: #F8F9FC;
        --privy-color-background-clicked: #F1F2F9;
        --privy-color-background-disabled: #FFFFFF;
        --privy-color-background-interactive: #5B4FFF;
        --privy-color-background-interactive-hover: #4F46E5;
        --privy-color-background-interactive-clicked: #4338CA;
        --privy-color-background-interactive-disabled: #F1F2F9;
        --privy-color-foreground-hover: #040217;
        --privy-color-foreground-clicked: #040217;
        --privy-color-foreground-disabled: #CBCDE1;
        --privy-color-foreground-interactive: #5B4FFF;
        --privy-color-foreground-interactive-hover: #5B4FFF;
        --privy-link-navigation-color: #040217;
        --privy-link-navigation-decoration: underline;
        --privy-accent-has-good-contrast: 0;
        --privy-color-icon-default: #110F2A;
        --privy-color-icon-muted: #64668B;
        --privy-color-icon-subtle: #9498B8;
        --privy-color-icon-inverse: #FFFFFF;
        --privy-color-icon-success: #33B287;
        --privy-color-icon-warning: #F59E0B;
        --privy-color-icon-error: #EF4444;
        --privy-color-icon-interactive: #564FFF;
        --privy-color-icon-default-hover: #1D1B35;
        --privy-color-icon-muted-hover: #64668B;
        --privy-color-icon-subtle-hover: #888AAE;
        --privy-color-icon-default-clicked: #060C23;
        --privy-color-icon-muted-clicked: #64668B;
        --privy-color-icon-subtle-clicked: #788804;
        --privy-color-icon-default-disabled: #CBCDE1;
        --privy-color-icon-muted-disabled: #CBCDE1;
        --privy-color-icon-subtle-disabled: #CBCDE1;
        --privy-color-icon-error-hover: #F06060;
        --privy-color-icon-interactive-hover: #4F46E5;
        --privy-color-icon-error-clicked: #DC3838;
        --privy-color-icon-interactive-clicked: #2BA482;
        --privy-color-icon-muted-disabled-alt: #CBCDE1;
        --privy-color-icon-subtle-disabled-alt: #CBCDE1;
        --privy-border-radius-xs: 6px;
        --privy-border-radius-sm: 8px;
        --privy-border-radius-md: 12px;
        --privy-border-radius-mdlg: 16px;
        --privy-border-radius-lg: 24px;
        --privy-border-radius-full: 9999px;
        --privy-height-modal-full: 620px;
        --privy-height-modal-compact: 480px;
      }
      @keyframes uniswap-refetch-pulse-animation {

        0%,
        100% {
          opacity: 1;
        }

        50% {
          opacity: 0.4;
        }
      }
      @keyframes uniswap-shake-animation {

        0%,
        100% {
          transform: translateX(0);
        }

        16.67% {
          transform: translateX(5px);
        }

        33.33% {
          transform: translateX(-5px);
        }

        50% {
          transform: translateX(5px);
        }

        66.67% {
          transform: translateX(-5px);
        }

        83.33% {
          transform: translateX(5px);
        }
      }
      [data-uds-placeholder]::placeholder {
        color: var(--uds-input-placeholder);
        opacity: 1;
      }

      [data-uds-selection]::selection {
        background-color: var(--uds-input-selection);
      }
      html {
        ::-webkit-scrollbar-thumb {
          background-color: rgba(255, 255, 255, 0.12);
        }

        scrollbar-color: rgba(255, 255, 255, 0.12) #131313;
      }
  
      :where(html[dir="ltr"]),
      :where([data-sonner-toaster][dir="ltr"]) {
        --toast-icon-margin-start: -3px;
        --toast-icon-margin-end: 4px;
        --toast-svg-margin-start: -1px;
        --toast-svg-margin-end: 0px;
        --toast-button-margin-start: auto;
        --toast-button-margin-end: 0;
        --toast-close-button-start: 0;
        --toast-close-button-end: unset;
        --toast-close-button-transform: translate(-35%, -35%)
      }

      :where(html[dir="rtl"]),
      :where([data-sonner-toaster][dir="rtl"]) {
        --toast-icon-margin-start: 4px;
        --toast-icon-margin-end: -3px;
        --toast-svg-margin-start: 0px;
        --toast-svg-margin-end: -1px;
        --toast-button-margin-start: 0;
        --toast-button-margin-end: auto;
        --toast-close-button-start: unset;
        --toast-close-button-end: 0;
        --toast-close-button-transform: translate(35%, -35%)
      }

      :where([data-sonner-toaster]) {
        position: fixed;
        width: var(--width);
        font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
        --gray1: hsl(0, 0%, 99%);
        --gray2: hsl(0, 0%, 97.3%);
        --gray3: hsl(0, 0%, 95.1%);
        --gray4: hsl(0, 0%, 93%);
        --gray5: hsl(0, 0%, 90.9%);
        --gray6: hsl(0, 0%, 88.7%);
        --gray7: hsl(0, 0%, 85.8%);
        --gray8: hsl(0, 0%, 78%);
        --gray9: hsl(0, 0%, 56.1%);
        --gray10: hsl(0, 0%, 52.3%);
        --gray11: hsl(0, 0%, 43.5%);
        --gray12: hsl(0, 0%, 9%);
        --border-radius: 8px;
        box-sizing: border-box;
        padding: 0;
        margin: 0;
        list-style: none;
        outline: none;
        z-index: 999999999;
        transition: transform .4s ease
      }

      :where([data-sonner-toaster][data-lifted="true"]) {
        transform: translateY(-10px)
      }

      @media (hover: none) and (pointer: coarse) {
        :where([data-sonner-toaster][data-lifted="true"]) {
          transform: none
        }
      }

      :where([data-sonner-toaster][data-x-position="right"]) {
        right: var(--offset-right)
      }

      :where([data-sonner-toaster][data-x-position="left"]) {
        left: var(--offset-left)
      }

      :where([data-sonner-toaster][data-x-position="center"]) {
        left: 50%;
        transform: translate(-50%)
      }

      :where([data-sonner-toaster][data-y-position="top"]) {
        top: var(--offset-top)
      }

      :where([data-sonner-toaster][data-y-position="bottom"]) {
        bottom: var(--offset-bottom)
      }

      :where([data-sonner-toast]) {
        --y: translateY(100%);
        --lift-amount: calc(var(--lift) * var(--gap));
        z-index: var(--z-index);
        position: absolute;
        opacity: 0;
        transform: var(--y);
        filter: blur(0);
        touch-action: none;
        transition: transform .4s, opacity .4s, height .4s, box-shadow .2s;
        box-sizing: border-box;
        outline: none;
        overflow-wrap: anywhere
      }

      :where([data-sonner-toast][data-styled="true"]) {
        padding: 16px;
        background: var(--normal-bg);
        border: 1px solid var(--normal-border);
        color: var(--normal-text);
        border-radius: var(--border-radius);
        box-shadow: 0 4px 12px #0000001a;
        width: var(--width);
        font-size: 13px;
        display: flex;
        align-items: center;
        gap: 6px
      }

      :where([data-sonner-toast]:focus-visible) {
        box-shadow: 0 4px 12px #0000001a, 0 0 0 2px #0003
      }

      :where([data-sonner-toast][data-y-position="top"]) {
        top: 0;
        --y: translateY(-100%);
        --lift: 1;
        --lift-amount: calc(1 * var(--gap))
      }

      :where([data-sonner-toast][data-y-position="bottom"]) {
        bottom: 0;
        --y: translateY(100%);
        --lift: -1;
        --lift-amount: calc(var(--lift) * var(--gap))
      }

      :where([data-sonner-toast]) :where([data-description]) {
        font-weight: 400;
        line-height: 1.4;
        color: inherit
      }

      :where([data-sonner-toast]) :where([data-title]) {
        font-weight: 500;
        line-height: 1.5;
        color: inherit
      }

      :where([data-sonner-toast]) :where([data-icon]) {
        display: flex;
        height: 16px;
        width: 16px;
        position: relative;
        justify-content: flex-start;
        align-items: center;
        flex-shrink: 0;
        margin-left: var(--toast-icon-margin-start);
        margin-right: var(--toast-icon-margin-end)
      }

      :where([data-sonner-toast][data-promise="true"]) :where([data-icon])>svg {
        opacity: 0;
        transform: scale(.8);
        transform-origin: center;
        animation: sonner-fade-in .3s ease forwards
      }

      :where([data-sonner-toast]) :where([data-icon])>* {
        flex-shrink: 0
      }

      :where([data-sonner-toast]) :where([data-icon]) svg {
        margin-left: var(--toast-svg-margin-start);
        margin-right: var(--toast-svg-margin-end)
      }

      :where([data-sonner-toast]) :where([data-content]) {
        display: flex;
        flex-direction: column;
        gap: 2px
      }

      [data-sonner-toast][data-styled=true] [data-button] {
        border-radius: 4px;
        padding-left: 8px;
        padding-right: 8px;
        height: 24px;
        font-size: 12px;
        color: var(--normal-bg);
        background: var(--normal-text);
        margin-left: var(--toast-button-margin-start);
        margin-right: var(--toast-button-margin-end);
        border: none;
        cursor: pointer;
        outline: none;
        display: flex;
        align-items: center;
        flex-shrink: 0;
        transition: opacity .4s, box-shadow .2s
      }

      :where([data-sonner-toast]) :where([data-button]):focus-visible {
        box-shadow: 0 0 0 2px #0006
      }

      :where([data-sonner-toast]) :where([data-button]):first-of-type {
        margin-left: var(--toast-button-margin-start);
        margin-right: var(--toast-button-margin-end)
      }

      :where([data-sonner-toast]) :where([data-cancel]) {
        color: var(--normal-text);
        background: rgba(0, 0, 0, .08)
      }

      :where([data-sonner-toast][data-theme="dark"]) :where([data-cancel]) {
        background: rgba(255, 255, 255, .3)
      }

      :where([data-sonner-toast]) :where([data-close-button]) {
        position: absolute;
        left: var(--toast-close-button-start);
        right: var(--toast-close-button-end);
        top: 0;
        height: 20px;
        width: 20px;
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 0;
        color: var(--gray12);
        border: 1px solid var(--gray4);
        transform: var(--toast-close-button-transform);
        border-radius: 50%;
        cursor: pointer;
        z-index: 1;
        transition: opacity .1s, background .2s, border-color .2s
      }

      [data-sonner-toast] [data-close-button] {
        background: var(--gray1)
      }

      :where([data-sonner-toast]) :where([data-close-button]):focus-visible {
        box-shadow: 0 4px 12px #0000001a, 0 0 0 2px #0003
      }

      :where([data-sonner-toast]) :where([data-disabled="true"]) {
        cursor: not-allowed
      }

      :where([data-sonner-toast]):hover :where([data-close-button]):hover {
        background: var(--gray2);
        border-color: var(--gray5)
      }

      :where([data-sonner-toast][data-swiping="true"]):before {
        content: "";
        position: absolute;
        left: -50%;
        right: -50%;
        height: 100%;
        z-index: -1
      }

      :where([data-sonner-toast][data-y-position="top"][data-swiping="true"]):before {
        bottom: 50%;
        transform: scaleY(3) translateY(50%)
      }

      :where([data-sonner-toast][data-y-position="bottom"][data-swiping="true"]):before {
        top: 50%;
        transform: scaleY(3) translateY(-50%)
      }

      :where([data-sonner-toast][data-swiping="false"][data-removed="true"]):before {
        content: "";
        position: absolute;
        inset: 0;
        transform: scaleY(2)
      }

      :where([data-sonner-toast]):after {
        content: "";
        position: absolute;
        left: 0;
        height: calc(var(--gap) + 1px);
        bottom: 100%;
        width: 100%
      }

      :where([data-sonner-toast][data-mounted="true"]) {
        --y: translateY(0);
        opacity: 1
      }

      :where([data-sonner-toast][data-expanded="false"][data-front="false"]) {
        --scale: var(--toasts-before) * .05 + 1;
        --y: translateY(calc(var(--lift-amount) * var(--toasts-before))) scale(calc(-1 * var(--scale)));
        height: var(--front-toast-height)
      }

      :where([data-sonner-toast])>* {
        transition: opacity .4s
      }

      :where([data-sonner-toast][data-expanded="false"][data-front="false"][data-styled="true"])>* {
        opacity: 0
      }

      :where([data-sonner-toast][data-visible="false"]) {
        opacity: 0;
        pointer-events: none
      }

      :where([data-sonner-toast][data-mounted="true"][data-expanded="true"]) {
        --y: translateY(calc(var(--lift) * var(--offset)));
        height: var(--initial-height)
      }

      :where([data-sonner-toast][data-removed="true"][data-front="true"][data-swipe-out="false"]) {
        --y: translateY(calc(var(--lift) * -100%));
        opacity: 0
      }

      :where([data-sonner-toast][data-removed="true"][data-front="false"][data-swipe-out="false"][data-expanded="true"]) {
        --y: translateY(calc(var(--lift) * var(--offset) + var(--lift) * -100%));
        opacity: 0
      }

      :where([data-sonner-toast][data-removed="true"][data-front="false"][data-swipe-out="false"][data-expanded="false"]) {
        --y: translateY(40%);
        opacity: 0;
        transition: transform .5s, opacity .2s
      }

      :where([data-sonner-toast][data-removed="true"][data-front="false"]):before {
        height: calc(var(--initial-height) + 20%)
      }

      [data-sonner-toast][data-swiping=true] {
        transform: var(--y) translateY(var(--swipe-amount-y, 0px)) translate(var(--swipe-amount-x, 0px));
        transition: none
      }

      [data-sonner-toast][data-swiped=true] {
        user-select: none
      }

      [data-sonner-toast][data-swipe-out=true][data-y-position=bottom],
      [data-sonner-toast][data-swipe-out=true][data-y-position=top] {
        animation-duration: .2s;
        animation-timing-function: ease-out;
        animation-fill-mode: forwards
      }

      [data-sonner-toast][data-swipe-out=true][data-swipe-direction=left] {
        animation-name: swipe-out-left
      }

      [data-sonner-toast][data-swipe-out=true][data-swipe-direction=right] {
        animation-name: swipe-out-right
      }

      [data-sonner-toast][data-swipe-out=true][data-swipe-direction=up] {
        animation-name: swipe-out-up
      }

      [data-sonner-toast][data-swipe-out=true][data-swipe-direction=down] {
        animation-name: swipe-out-down
      }

      @keyframes swipe-out-left {
        0% {
          transform: var(--y) translate(var(--swipe-amount-x));
          opacity: 1
        }

        to {
          transform: var(--y) translate(calc(var(--swipe-amount-x) - 100%));
          opacity: 0
        }
      }

      @keyframes swipe-out-right {
        0% {
          transform: var(--y) translate(var(--swipe-amount-x));
          opacity: 1
        }

        to {
          transform: var(--y) translate(calc(var(--swipe-amount-x) + 100%));
          opacity: 0
        }
      }

      @keyframes swipe-out-up {
        0% {
          transform: var(--y) translateY(var(--swipe-amount-y));
          opacity: 1
        }

        to {
          transform: var(--y) translateY(calc(var(--swipe-amount-y) - 100%));
          opacity: 0
        }
      }

      @keyframes swipe-out-down {
        0% {
          transform: var(--y) translateY(var(--swipe-amount-y));
          opacity: 1
        }

        to {
          transform: var(--y) translateY(calc(var(--swipe-amount-y) + 100%));
          opacity: 0
        }
      }

      @media (max-width: 600px) {
        [data-sonner-toaster] {
          position: fixed;
          right: var(--mobile-offset-right);
          left: var(--mobile-offset-left);
          width: 100%
        }

        [data-sonner-toaster][dir=rtl] {
          left: calc(var(--mobile-offset-left) * -1)
        }

        [data-sonner-toaster] [data-sonner-toast] {
          left: 0;
          right: 0;
          width: calc(100% - var(--mobile-offset-left) * 2)
        }

        [data-sonner-toaster][data-x-position=left] {
          left: var(--mobile-offset-left)
        }

        [data-sonner-toaster][data-y-position=bottom] {
          bottom: var(--mobile-offset-bottom)
        }

        [data-sonner-toaster][data-y-position=top] {
          top: var(--mobile-offset-top)
        }

        [data-sonner-toaster][data-x-position=center] {
          left: var(--mobile-offset-left);
          right: var(--mobile-offset-right);
          transform: none
        }
      }

      [data-sonner-toaster][data-theme=light] {
        --normal-bg: #fff;
        --normal-border: var(--gray4);
        --normal-text: var(--gray12);
        --success-bg: hsl(143, 85%, 96%);
        --success-border: hsl(145, 92%, 91%);
        --success-text: hsl(140, 100%, 27%);
        --info-bg: hsl(208, 100%, 97%);
        --info-border: hsl(221, 91%, 91%);
        --info-text: hsl(210, 92%, 45%);
        --warning-bg: hsl(49, 100%, 97%);
        --warning-border: hsl(49, 91%, 91%);
        --warning-text: hsl(31, 92%, 45%);
        --error-bg: hsl(359, 100%, 97%);
        --error-border: hsl(359, 100%, 94%);
        --error-text: hsl(360, 100%, 45%)
      }

      [data-sonner-toaster][data-theme=light] [data-sonner-toast][data-invert=true] {
        --normal-bg: #000;
        --normal-border: hsl(0, 0%, 20%);
        --normal-text: var(--gray1)
      }

      [data-sonner-toaster][data-theme=dark] [data-sonner-toast][data-invert=true] {
        --normal-bg: #fff;
        --normal-border: var(--gray3);
        --normal-text: var(--gray12)
      }

      [data-sonner-toaster][data-theme=dark] {
        --normal-bg: #000;
        --normal-bg-hover: hsl(0, 0%, 12%);
        --normal-border: hsl(0, 0%, 20%);
        --normal-border-hover: hsl(0, 0%, 25%);
        --normal-text: var(--gray1);
        --success-bg: hsl(150, 100%, 6%);
        --success-border: hsl(147, 100%, 12%);
        --success-text: hsl(150, 86%, 65%);
        --info-bg: hsl(215, 100%, 6%);
        --info-border: hsl(223, 100%, 12%);
        --info-text: hsl(216, 87%, 65%);
        --warning-bg: hsl(64, 100%, 6%);
        --warning-border: hsl(60, 100%, 12%);
        --warning-text: hsl(46, 87%, 65%);
        --error-bg: hsl(358, 76%, 10%);
        --error-border: hsl(357, 89%, 16%);
        --error-text: hsl(358, 100%, 81%)
      }

      [data-sonner-toaster][data-theme=dark] [data-sonner-toast] [data-close-button] {
        background: var(--normal-bg);
        border-color: var(--normal-border);
        color: var(--normal-text)
      }

      [data-sonner-toaster][data-theme=dark] [data-sonner-toast] [data-close-button]:hover {
        background: var(--normal-bg-hover);
        border-color: var(--normal-border-hover)
      }

      [data-rich-colors=true][data-sonner-toast][data-type=success],
      [data-rich-colors=true][data-sonner-toast][data-type=success] [data-close-button] {
        background: var(--success-bg);
        border-color: var(--success-border);
        color: var(--success-text)
      }

      [data-rich-colors=true][data-sonner-toast][data-type=info],
      [data-rich-colors=true][data-sonner-toast][data-type=info] [data-close-button] {
        background: var(--info-bg);
        border-color: var(--info-border);
        color: var(--info-text)
      }

      [data-rich-colors=true][data-sonner-toast][data-type=warning],
      [data-rich-colors=true][data-sonner-toast][data-type=warning] [data-close-button] {
        background: var(--warning-bg);
        border-color: var(--warning-border);
        color: var(--warning-text)
      }

      [data-rich-colors=true][data-sonner-toast][data-type=error],
      [data-rich-colors=true][data-sonner-toast][data-type=error] [data-close-button] {
        background: var(--error-bg);
        border-color: var(--error-border);
        color: var(--error-text)
      }

      .sonner-loading-wrapper {
        --size: 16px;
        height: var(--size);
        width: var(--size);
        position: absolute;
        inset: 0;
        z-index: 10
      }

      .sonner-loading-wrapper[data-visible=false] {
        transform-origin: center;
        animation: sonner-fade-out .2s ease forwards
      }

      .sonner-spinner {
        position: relative;
        top: 50%;
        left: 50%;
        height: var(--size);
        width: var(--size)
      }

      .sonner-loading-bar {
        animation: sonner-spin 1.2s linear infinite;
        background: var(--gray11);
        border-radius: 6px;
        height: 8%;
        left: -10%;
        position: absolute;
        top: -3.9%;
        width: 24%
      }

      .sonner-loading-bar:nth-child(1) {
        animation-delay: -1.2s;
        transform: rotate(.0001deg) translate(146%)
      }

      .sonner-loading-bar:nth-child(2) {
        animation-delay: -1.1s;
        transform: rotate(30deg) translate(146%)
      }

      .sonner-loading-bar:nth-child(3) {
        animation-delay: -1s;
        transform: rotate(60deg) translate(146%)
      }

      .sonner-loading-bar:nth-child(4) {
        animation-delay: -.9s;
        transform: rotate(90deg) translate(146%)
      }

      .sonner-loading-bar:nth-child(5) {
        animation-delay: -.8s;
        transform: rotate(120deg) translate(146%)
      }

      .sonner-loading-bar:nth-child(6) {
        animation-delay: -.7s;
        transform: rotate(150deg) translate(146%)
      }

      .sonner-loading-bar:nth-child(7) {
        animation-delay: -.6s;
        transform: rotate(180deg) translate(146%)
      }

      .sonner-loading-bar:nth-child(8) {
        animation-delay: -.5s;
        transform: rotate(210deg) translate(146%)
      }

      .sonner-loading-bar:nth-child(9) {
        animation-delay: -.4s;
        transform: rotate(240deg) translate(146%)
      }

      .sonner-loading-bar:nth-child(10) {
        animation-delay: -.3s;
        transform: rotate(270deg) translate(146%)
      }

      .sonner-loading-bar:nth-child(11) {
        animation-delay: -.2s;
        transform: rotate(300deg) translate(146%)
      }

      .sonner-loading-bar:nth-child(12) {
        animation-delay: -.1s;
        transform: rotate(330deg) translate(146%)
      }

      @keyframes sonner-fade-in {
        0% {
          opacity: 0;
          transform: scale(.8)
        }

        to {
          opacity: 1;
          transform: scale(1)
        }
      }

      @keyframes sonner-fade-out {
        0% {
          opacity: 1;
          transform: scale(1)
        }

        to {
          opacity: 0;
          transform: scale(.8)
        }
      }

      @keyframes sonner-spin {
        0% {
          opacity: 1
        }

        to {
          opacity: .15
        }
      }

      @media (prefers-reduced-motion) {

        [data-sonner-toast],
        [data-sonner-toast]>*,
        .sonner-loading-bar {
          transition: none !important;
          animation: none !important
        }
      }

      .sonner-loader {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        transform-origin: center;
        transition: opacity .2s, transform .2s
      }

      .sonner-loader[data-visible=false] {
        opacity: 0;
        transform: scale(.8) translate(-50%, -50%)
      }