/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
@layer properties {
  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
    *, :before, :after, ::backdrop {
      --tw-rotate-x: initial;
      --tw-rotate-y: initial;
      --tw-rotate-z: initial;
      --tw-skew-x: initial;
      --tw-skew-y: initial;
      --tw-space-y-reverse: 0;
      --tw-divide-y-reverse: 0;
      --tw-border-style: solid;
      --tw-font-weight: initial;
      --tw-tracking: initial;
      --tw-shadow: 0 0 #0000;
      --tw-shadow-color: initial;
      --tw-shadow-alpha: 100%;
      --tw-inset-shadow: 0 0 #0000;
      --tw-inset-shadow-color: initial;
      --tw-inset-shadow-alpha: 100%;
      --tw-ring-color: initial;
      --tw-ring-shadow: 0 0 #0000;
      --tw-inset-ring-color: initial;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-inset: initial;
      --tw-ring-offset-width: 0;
      --tw-ring-offset-color: #fff;
      --tw-ring-offset-shadow: 0 0 #0000;
      --tw-outline-style: solid;
      --tw-blur: initial;
      --tw-brightness: initial;
      --tw-contrast: initial;
      --tw-grayscale: initial;
      --tw-hue-rotate: initial;
      --tw-invert: initial;
      --tw-opacity: initial;
      --tw-saturate: initial;
      --tw-sepia: initial;
      --tw-drop-shadow: initial;
      --tw-drop-shadow-color: initial;
      --tw-drop-shadow-alpha: 100%;
      --tw-drop-shadow-size: initial;
      --tw-ease: initial;
      --tw-space-x-reverse: 0;
      --tw-translate-x: 0;
      --tw-translate-y: 0;
      --tw-translate-z: 0;
      --tw-ordinal: initial;
      --tw-slashed-zero: initial;
      --tw-numeric-figure: initial;
      --tw-numeric-spacing: initial;
      --tw-numeric-fraction: initial;
      --tw-leading: initial;
      --tw-duration: initial;
      --tw-scale-x: 1;
      --tw-scale-y: 1;
      --tw-scale-z: 1;
      --tw-divide-x-reverse: 0;
      --tw-border-spacing-x: 0;
      --tw-border-spacing-y: 0;
    }
  }
}

@layer theme {
  :root, :host {
    --font-sans: var(--font-family-sans);
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    --color-red-500: oklch(63.7% .237 25.331);
    --color-black: #000;
    --color-white: #fff;
    --spacing: .25rem;
    --container-xs: 20rem;
    --container-sm: 24rem;
    --container-md: 28rem;
    --container-lg: 32rem;
    --container-xl: 36rem;
    --container-2xl: 42rem;
    --container-3xl: 48rem;
    --container-4xl: 56rem;
    --container-5xl: 64rem;
    --text-xs: .75rem;
    --text-xs--line-height: calc(1 / .75);
    --text-sm: .875rem;
    --text-sm--line-height: calc(1.25 / .875);
    --text-base: 1rem;
    --text-base--line-height: 1.5;
    --text-lg: 1.125rem;
    --text-lg--line-height: calc(1.75 / 1.125);
    --text-xl: 1.25rem;
    --text-xl--line-height: calc(1.75 / 1.25);
    --text-2xl: 1.5rem;
    --text-2xl--line-height: calc(2 / 1.5);
    --text-3xl: 1.875rem;
    --text-3xl--line-height: 1.2;
    --text-4xl: 2.25rem;
    --text-4xl--line-height: calc(2.5 / 2.25);
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --font-weight-extrabold: 800;
    --tracking-tight: -.025em;
    --tracking-wide: .025em;
    --tracking-wider: .05em;
    --tracking-widest: .1em;
    --leading-tight: 1.25;
    --leading-snug: 1.375;
    --leading-normal: 1.5;
    --leading-relaxed: 1.625;
    --radius-md: .375rem;
    --radius-lg: .5rem;
    --radius-xl: .75rem;
    --radius-2xl: 1rem;
    --ease-out: cubic-bezier(0, 0, .2, 1);
    --ease-in-out: cubic-bezier(.4, 0, .2, 1);
    --animate-spin: spin 1s linear infinite;
    --animate-ping: ping 1s cubic-bezier(0, 0, .2, 1) infinite;
    --animate-pulse: pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;
    --default-transition-duration: .15s;
    --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    --default-font-family: var(--font-family-sans);
    --default-mono-font-family: var(--font-mono);
    --color-amber-500: oklch(76.9% .188 70.08);
    --color-green-500: oklch(72.3% .219 149.579);
    --radius-sm: .25rem;
    --radius-3xl: 1.5rem;
    --color-primary-50: var(--primitive-skyblue-50);
    --color-primary-500: var(--primitive-skyblue-500);
    --color-primary-600: var(--primitive-skyblue-600);
    --color-primary-700: var(--primitive-skyblue-700);
    --color-title-50: var(--color-text-title);
    --color-text-50: var(--color-text-body);
    --color-text-100: var(--color-text-secondary-text);
    --color-white-100: var(--primitive-white);
    --color-success-500: var(--primitive-green-500);
    --color-background-50: var(--color-background-white-primary);
    --color-base-100: var(--color-border-secondary);
    --border-color-base-50: var(--color-border-primary);
    --border-color-base-100: var(--color-border-secondary);
    --border-color-base-300: var(--color-border-tertiary);
    --color-input-background: var(--primitive-white);
    --color-input-placeholder-text: var(--primitive-gray-400);
    --color-input-error-focus-border: var(--primitive-red-500);
    --color-input-success-focus-border: var(--primitive-green-500);
    --color-skeleton-gradient-100: var(--primitive-gray-200);
    --font-family-sans: "DM Sans", sans-serif;
  }
}

@layer base {
  :-moz-focusring:where(:not(iframe)) {
    outline: auto;
  }

  @supports (not ((-webkit-appearance: -apple-pay-button))) or (contain-intrinsic-size: 1px) {
    ::placeholder {
      color: currentColor;
    }

    @supports (color: color-mix(in lab, red, red)) {
      ::placeholder {
        color: color-mix(in oklab, currentcolor 50%, transparent);
      }
    }
  }

  *, :after, :before, ::backdrop {
    box-sizing: border-box;
    border: 0 solid;
    margin: 0;
    padding: 0;
  }

  ::file-selector-button {
    box-sizing: border-box;
    border: 0 solid;
    margin: 0;
    padding: 0;
  }

  html, :host {
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    line-height: 1.5;
    font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
    font-feature-settings: var(--default-font-feature-settings, normal);
    font-variation-settings: var(--default-font-variation-settings, normal);
    -webkit-tap-highlight-color: transparent;
  }

  hr {
    height: 0;
    color: inherit;
    border-top-width: 1px;
  }

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

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

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

  b, strong {
    font-weight: bolder;
  }

  code, kbd, samp, pre {
    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
    font-feature-settings: var(--default-mono-font-feature-settings, normal);
    font-variation-settings: var(--default-mono-font-variation-settings, normal);
    font-size: 1em;
  }

  small {
    font-size: 80%;
  }

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

  sub {
    bottom: -.25em;
  }

  sup {
    top: -.5em;
  }

  table {
    text-indent: 0;
    border-color: inherit;
    border-collapse: collapse;
  }

  :-moz-focusring {
    outline: auto;
  }

  progress {
    vertical-align: baseline;
  }

  summary {
    display: list-item;
  }

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

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

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

  button, input, select, optgroup, textarea {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    opacity: 1;
    background-color: #0000;
    border-radius: 0;
  }

  ::file-selector-button {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    opacity: 1;
    background-color: #0000;
    border-radius: 0;
  }

  :where(select:is([multiple], [size])) optgroup {
    font-weight: bolder;
  }

  :where(select:is([multiple], [size])) optgroup option {
    padding-inline-start: 20px;
  }

  ::file-selector-button {
    margin-inline-end: 4px;
  }

  ::placeholder {
    opacity: 1;
  }

  @supports (not ((-webkit-appearance: -apple-pay-button))) or (contain-intrinsic-size: 1px) {
    ::placeholder {
      color: currentColor;
    }

    @supports (color: color-mix(in lab,red,red)) {
      ::placeholder {
        color: color-mix(in oklab,currentcolor 50%,transparent);
      }
    }
  }

  textarea {
    resize: vertical;
  }

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

  ::-webkit-date-and-time-value {
    min-height: 1lh;
    text-align: inherit;
  }

  ::-webkit-datetime-edit {
    display: inline-flex;
  }

  ::-webkit-datetime-edit-fields-wrapper {
    padding: 0;
  }

  ::-webkit-datetime-edit {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-year-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-month-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-day-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-hour-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-minute-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-second-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-millisecond-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-meridiem-field {
    padding-block: 0;
  }

  ::-webkit-calendar-picker-indicator {
    line-height: 1;
  }

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

  button, input:where([type="button"], [type="reset"], [type="submit"]) {
    appearance: button;
  }

  ::file-selector-button {
    appearance: button;
  }

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

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

  [hidden]:where(:not([hidden="until-found"])) {
    display: none !important;
  }

  button:not(:disabled), [role="button"]:not(:disabled) {
    cursor: pointer;
  }
}

@layer components {
  .ds-btn {
    justify-content: center;
    align-items: center;
    gap: calc(var(--spacing) * 3);
    border-radius: var(--radius-lg);
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-outline-style: none;
    outline-style: none;
    display: flex;
  }

  .ds-btn:focus {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
  }

  .ds-btn:disabled {
    pointer-events: none;
  }

  .ds-btn > svg {
    color: currentColor !important;
  }

  .ds-btn-primary {
    background-color: var(--primitive-skyblue-500);
    color: var(--primitive-white);
  }

  @media (hover: hover) {
    .ds-btn-primary:hover {
      background-color: var(--primitive-skyblue-600);
    }
  }

  .ds-btn-primary:focus {
    --tw-ring-color: var(--color-focus-ring);
  }

  .ds-btn-primary:disabled {
    background-color: var(--color-button-disabled-primary-background);
    color: var(--color-button-disabled-primary-text);
  }

  .ds-btn-primary-outline {
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-button-primary-outline-stroke);
    background-color: var(--color-button-primary-outline-background);
    color: var(--color-button-primary-outline-text);
  }

  @media (hover: hover) {
    .ds-btn-primary-outline:hover {
      background-color: var(--color-button-primary-outline-hover-background);
      color: var(--color-button-primary-outline-hover-text);
    }
  }

  .ds-btn-primary-outline:focus {
    --tw-ring-color: var(--color-focus-ring);
  }

  .ds-btn-primary-outline:disabled {
    border-color: var(--color-button-disabled-outline-border);
    background-color: var(--color-button-primary-outline-disabled-bg);
    color: var(--color-button-primary-outline-disabled-text);
  }

  .ds-btn-danger {
    background-color: var(--color-button-error-primary-background);
    color: var(--primitive-white);
  }

  @media (hover: hover) {
    .ds-btn-danger:hover {
      background-color: var(--color-button-error-primary-hover-background);
    }
  }

  .ds-btn-danger:focus {
    --tw-ring-color: var(--color-focus-ring);
  }

  .ds-btn-danger:disabled {
    background-color: var(--color-button-disabled-primary-background);
    color: var(--color-button-disabled-primary-text);
  }

  .ds-btn-danger-outline {
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-button-error-outline-stroke);
    background-color: var(--primitive-red-50);
    color: var(--primitive-red-700);
  }

  @media (hover: hover) {
    .ds-btn-danger-outline:hover {
      background-color: var(--primitive-red-200);
      color: var(--primitive-red-700);
    }
  }

  .ds-btn-danger-outline:focus {
    --tw-ring-color: var(--color-focus-ring);
  }

  .ds-btn-danger-outline:disabled {
    border-color: var(--color-button-disabled-outline-border);
    background-color: var(--color-button-primary-outline-disabled-bg);
    color: var(--color-button-primary-outline-disabled-text);
  }

  .ds-btn-success {
    background-color: var(--color-button-success-primary-background);
    color: var(--primitive-white);
  }

  @media (hover: hover) {
    .ds-btn-success:hover {
      background-color: var(--color-button-success-primary-hover-background);
    }
  }

  .ds-btn-success:focus {
    --tw-ring-color: var(--color-focus-ring);
  }

  .ds-btn-success:disabled {
    background-color: var(--color-button-disabled-primary-background);
    color: var(--color-button-disabled-primary-text);
  }

  .ds-btn-success-outline {
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-button-success-outline-stroke);
    background-color: var(--primitive-green-50);
    color: var(--primitive-green-700);
  }

  @media (hover: hover) {
    .ds-btn-success-outline:hover {
      background-color: var(--primitive-green-200);
    }
  }

  .ds-btn-success-outline:focus {
    --tw-ring-color: var(--color-focus-ring);
  }

  .ds-btn-success-outline:disabled {
    border-color: var(--color-button-disabled-outline-border);
    background-color: var(--color-button-primary-outline-disabled-bg);
    color: var(--color-button-primary-outline-disabled-text);
  }

  .ds-btn-ghost {
    color: var(--color-text-tertiary-text);
  }

  @media (hover: hover) {
    .ds-btn-ghost:hover {
      background-color: var(--color-button-close-icon-primary-hover-background);
      color: var(--color-text-secondary-text);
    }
  }

  .ds-btn-ghost:focus {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    --tw-ring-color: var(--primitive-skyblue-400);
  }

  .ds-btn-xs {
    padding-inline: calc(var(--spacing) * 3.5);
    padding-block: calc(var(--spacing) * 2.5);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
  }

  .ds-btn-xs > svg {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
  }

  .ds-btn-sm {
    padding-inline: calc(var(--spacing) * 3.5);
    padding-block: calc(var(--spacing) * 2.5);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }

  .ds-btn-sm > svg {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
  }

  .ds-btn-md {
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 2.5);
  }

  .ds-btn-md > svg {
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
  }

  .ds-btn-lg {
    padding-inline: calc(var(--spacing) * 5);
    padding-block: calc(var(--spacing) * 2.5);
  }

  .ds-btn-lg > svg {
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
  }

  .ds-btn-icon-xs {
    width: calc(var(--spacing) * 8);
    height: calc(var(--spacing) * 8);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
  }

  .ds-btn-icon-xs > svg {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
  }

  .ds-btn-icon-sm {
    width: calc(var(--spacing) * 10);
    height: calc(var(--spacing) * 10);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }

  .ds-btn-icon-sm > svg {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
  }

  .ds-btn-icon-md {
    width: calc(var(--spacing) * 11);
    height: calc(var(--spacing) * 11);
  }

  .ds-btn-icon-md > svg {
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
  }

  .ds-btn-icon-lg {
    width: calc(var(--spacing) * 12);
    height: calc(var(--spacing) * 12);
  }

  .ds-btn-icon-lg > svg {
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
  }

  .ds-alert {
    align-items: flex-start;
    gap: calc(var(--spacing) * 3);
    border-radius: var(--radius-xl);
    border-style: var(--tw-border-style);
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 3);
    border-width: 1px;
    display: flex;
  }

  .ds-alert-info {
    border-color: var(--primitive-bluelight-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-alert-info {
      border-color: color-mix(in oklab,var(--primitive-bluelight-500) 25%,transparent);
    }
  }

  .ds-alert-info {
    background-color: var(--primitive-bluelight-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-alert-info {
      background-color: color-mix(in oklab,var(--primitive-bluelight-500) 10%,transparent);
    }
  }

  .ds-alert-success {
    border-color: var(--primitive-green-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-alert-success {
      border-color: color-mix(in oklab,var(--primitive-green-500) 25%,transparent);
    }
  }

  .ds-alert-success {
    background-color: var(--primitive-green-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-alert-success {
      background-color: color-mix(in oklab,var(--primitive-green-500) 10%,transparent);
    }
  }

  .ds-alert-warning {
    border-color: var(--primitive-yellow-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-alert-warning {
      border-color: color-mix(in oklab,var(--primitive-yellow-500) 25%,transparent);
    }
  }

  .ds-alert-warning {
    background-color: var(--primitive-yellow-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-alert-warning {
      background-color: color-mix(in oklab,var(--primitive-yellow-500) 10%,transparent);
    }
  }

  .ds-alert-error {
    border-color: var(--primitive-red-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-alert-error {
      border-color: color-mix(in oklab,var(--primitive-red-500) 25%,transparent);
    }
  }

  .ds-alert-error {
    background-color: var(--primitive-red-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-alert-error {
      background-color: color-mix(in oklab,var(--primitive-red-500) 10%,transparent);
    }
  }

  .ds-alert-icon-tile {
    width: calc(var(--spacing) * 8);
    height: calc(var(--spacing) * 8);
    border-radius: var(--radius-lg);
    flex-shrink: 0;
    justify-content: center;
    align-items: center;
    display: flex;
  }

  .ds-alert-icon-tile > svg {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }

  .ds-alert-icon-tile-info {
    background-color: var(--primitive-bluelight-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-alert-icon-tile-info {
      background-color: color-mix(in oklab,var(--primitive-bluelight-500) 10%,transparent);
    }
  }

  .ds-alert-icon-tile-info {
    color: var(--primitive-bluelight-500);
  }

  .ds-alert-icon-tile-success {
    background-color: var(--primitive-green-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-alert-icon-tile-success {
      background-color: color-mix(in oklab,var(--primitive-green-500) 10%,transparent);
    }
  }

  .ds-alert-icon-tile-success {
    color: var(--primitive-green-500);
  }

  .ds-alert-icon-tile-warning {
    background-color: var(--primitive-yellow-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-alert-icon-tile-warning {
      background-color: color-mix(in oklab,var(--primitive-yellow-500) 10%,transparent);
    }
  }

  .ds-alert-icon-tile-warning {
    color: var(--primitive-yellow-500);
  }

  .ds-alert-icon-tile-error {
    background-color: var(--primitive-red-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-alert-icon-tile-error {
      background-color: color-mix(in oklab,var(--primitive-red-500) 10%,transparent);
    }
  }

  .ds-alert-icon-tile-error {
    color: var(--primitive-red-500);
  }

  .ds-alert-body {
    gap: calc(var(--spacing) * .5);
    min-width: 0;
    padding-top: calc(var(--spacing) * .5);
    flex-direction: column;
    flex: 1;
    display: flex;
  }

  .ds-alert-title {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-title);
  }

  .ds-alert-content {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--color-text-body);
  }

  .ds-alert-dismiss {
    margin-top: calc(var(--spacing) * -1);
    margin-right: calc(var(--spacing) * -1);
    width: calc(var(--spacing) * 7);
    height: calc(var(--spacing) * 7);
    border-radius: var(--radius-md);
    color: var(--color-text-secondary-text);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    flex-shrink: 0;
    justify-content: center;
    align-items: center;
    display: flex;
  }

  @media (hover: hover) {
    .ds-alert-dismiss:hover {
      color: var(--color-text-body);
    }
  }

  .ds-alert-dismiss:focus {
    --tw-outline-style: none;
    outline-style: none;
  }

  .ds-alert-dismiss:focus-visible {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    --tw-ring-color: var(--primitive-skyblue-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-alert-dismiss:focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--primitive-skyblue-500) 30%, transparent);
    }
  }

  .ds-avatar-group {
    align-items: center;
    display: flex;
  }

  .ds-avatar-group-xs, .ds-avatar-group-sm {
    gap: calc(var(--spacing) * 2);
  }

  .ds-avatar-group-md, .ds-avatar-group-lg {
    gap: calc(var(--spacing) * 3);
  }

  .ds-avatar-group-xl, .ds-avatar-group-xxl {
    gap: calc(var(--spacing) * 4);
  }

  .ds-avatar {
    background-color: var(--primitive-skyblue-50);
    color: var(--primitive-skyblue-500);
    border-radius: 3.40282e38px;
    place-items: center;
    display: grid;
    position: relative;
  }

  .ds-avatar-xs {
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }

  .ds-avatar-sm {
    width: calc(var(--spacing) * 8);
    height: calc(var(--spacing) * 8);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }

  .ds-avatar-md {
    width: calc(var(--spacing) * 10);
    height: calc(var(--spacing) * 10);
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
  }

  .ds-avatar-lg {
    width: calc(var(--spacing) * 12);
    height: calc(var(--spacing) * 12);
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
  }

  .ds-avatar-xl {
    width: calc(var(--spacing) * 14);
    height: calc(var(--spacing) * 14);
    font-size: var(--text-xl);
    line-height: var(--tw-leading, var(--text-xl--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
  }

  .ds-avatar-xxl {
    width: calc(var(--spacing) * 16);
    height: calc(var(--spacing) * 16);
    font-size: var(--text-2xl);
    line-height: var(--tw-leading, var(--text-2xl--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
  }

  .ds-avatar-tint-primary {
    background-color: var(--primitive-skyblue-50);
    color: var(--primitive-skyblue-500);
  }

  .ds-avatar-tint-lilac {
    color: #5a45d6;
    background-color: #edebff;
  }

  .ds-avatar-tint-pink {
    color: #b03a6f;
    background-color: #ffe8f1;
  }

  .ds-avatar-tint-orange {
    color: #a0522a;
    background-color: #ffe7d6;
  }

  .ds-avatar-tint-yellow {
    color: #8a6d1b;
    background-color: #fff3c4;
  }

  .ds-avatar-tint-green {
    color: #2d7a3f;
    background-color: #dff5e1;
  }

  .ds-avatar-tint-sky {
    color: #0369a1;
    background-color: #dcf1fa;
  }

  .ds-avatar-tint-indigo {
    color: #3f4ebf;
    background-color: #e3e7ff;
  }

  .ds-avatar-tint-rose {
    color: #b0334a;
    background-color: #ffe3e3;
  }

  .ds-avatar-img {
    aspect-ratio: 1;
    object-fit: cover;
    border-radius: 3.40282e38px;
    width: 100%;
    height: 100%;
  }

  .ds-avatar-fallback {
    text-transform: uppercase;
  }

  .ds-avatar-indicator {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(1.5px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    --tw-ring-color: var(--color-background-white-primary);
    border-radius: 3.40282e38px;
    position: absolute;
    bottom: 0;
    right: 0;
  }

  .ds-avatar-indicator-online {
    background-color: var(--primitive-green-500);
  }

  .ds-avatar-indicator-offline {
    background-color: var(--primitive-red-500);
  }

  .ds-avatar-indicator-busy {
    background-color: var(--primitive-yellow-500);
  }

  .ds-avatar-indicator-xs {
    width: calc(var(--spacing) * 1.5);
    height: calc(var(--spacing) * 1.5);
  }

  .ds-avatar-indicator-sm {
    width: calc(var(--spacing) * 2);
    height: calc(var(--spacing) * 2);
  }

  .ds-avatar-indicator-md {
    width: calc(var(--spacing) * 2.5);
    height: calc(var(--spacing) * 2.5);
  }

  .ds-avatar-indicator-lg {
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
  }

  .ds-avatar-indicator-xl {
    width: calc(var(--spacing) * 3.5);
    height: calc(var(--spacing) * 3.5);
  }

  .ds-avatar-indicator-xxl {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }

  .ds-avatar-label-title {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--color-text-body);
  }

  .ds-avatar-label-title-xs {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
  }

  .ds-avatar-label-title-sm, .ds-avatar-label-title-md {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }

  .ds-avatar-label-title-lg {
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
  }

  .ds-avatar-label-title-xl, .ds-avatar-label-title-xxl {
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
  }

  .ds-avatar-label-subtitle {
    color: var(--color-text-secondary-text);
  }

  .ds-avatar-label-subtitle-xs, .ds-avatar-label-subtitle-sm, .ds-avatar-label-subtitle-md {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
  }

  .ds-avatar-label-subtitle-lg {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }

  .ds-avatar-label-subtitle-xl, .ds-avatar-label-subtitle-xxl {
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
  }

  .ds-avatar-stack {
    align-items: center;
    display: flex;
  }

  :where(.ds-avatar-stack > :not(:last-child)) {
    --tw-space-x-reverse: 0;
    margin-inline-start: calc(calc(var(--spacing) * -2) * var(--tw-space-x-reverse));
    margin-inline-end: calc(calc(var(--spacing) * -2) * calc(1 - var(--tw-space-x-reverse)));
  }

  .ds-avatar-stack-item {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(1.5px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    --tw-ring-color: var(--color-background-white-primary);
    border-radius: 3.40282e38px;
  }

  .ds-badge {
    align-items: center;
    gap: calc(var(--spacing) * 2);
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    border-radius: 3.40282e38px;
    display: inline-flex;
  }

  .ds-badge > svg {
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
  }

  .ds-badge {
    padding-left: var(--badge-pad);
    padding-right: var(--badge-pad);
  }

  .ds-badge:has( > svg:first-child) {
    padding-left: var(--badge-pad-icon);
  }

  .ds-badge:has( > svg:last-child) {
    padding-right: var(--badge-pad-icon);
  }

  .ds-badge-sm {
    padding-block: calc(var(--spacing) * .5);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --badge-pad: .5rem;
    --badge-pad-icon: .375rem;
  }

  .ds-badge-md {
    padding-block: calc(var(--spacing) * .5);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --badge-pad: .625rem;
    --badge-pad-icon: .5rem;
  }

  .ds-badge-lg {
    padding-block: var(--spacing);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --badge-pad: .75rem;
    --badge-pad-icon: .625rem;
  }

  .ds-badge-gray {
    background-color: var(--color-badges-gray-background);
    color: var(--color-badges-gray-text);
  }

  .ds-badge-gray > svg {
    color: var(--color-badges-gray-icon);
  }

  .ds-badge-primary {
    background-color: var(--color-badges-primary-background);
    color: var(--color-badges-primary-text);
  }

  .ds-badge-primary > svg {
    color: var(--color-badges-primary-icon);
  }

  .ds-badge-error {
    background-color: var(--color-badges-error-background);
    color: var(--color-badges-error-text);
  }

  .ds-badge-error > svg {
    color: var(--color-badges-error-icon);
  }

  .ds-badge-warning {
    background-color: var(--color-badges-warning-background);
    color: var(--color-badges-warning-text);
  }

  .ds-badge-warning > svg {
    color: var(--color-badges-warning-icon);
  }

  .ds-badge-success {
    background-color: var(--color-badges-success-background);
    color: var(--color-badges-success-text);
  }

  .ds-badge-success > svg {
    color: var(--color-badges-success-icon);
  }

  .ds-badge-cyan {
    background-color: var(--color-badges-cyan-background);
    color: var(--color-badges-cyan-text);
  }

  .ds-badge-cyan > svg {
    color: var(--color-badges-cyan-icon);
  }

  .ds-badge-sky {
    background-color: var(--color-badges-sky-background);
    color: var(--color-badges-sky-text);
  }

  .ds-badge-sky > svg {
    color: var(--color-badges-sky-icon);
  }

  .ds-badge-blue {
    background-color: var(--color-badges-blue-background);
    color: var(--color-badges-blue-text);
  }

  .ds-badge-blue > svg {
    color: var(--color-badges-blue-icon);
  }

  .ds-badge-violet {
    background-color: var(--color-badges-violet-background);
    color: var(--color-badges-violet-text);
  }

  .ds-badge-violet > svg {
    color: var(--color-badges-violet-icon);
  }

  .ds-badge-purple {
    background-color: var(--color-badges-purple-background);
    color: var(--color-badges-purple-text);
  }

  .ds-badge-purple > svg {
    color: var(--color-badges-purple-icon);
  }

  .ds-badge-pink {
    background-color: var(--color-badges-pink-background);
    color: var(--color-badges-pink-text);
  }

  .ds-badge-pink > svg {
    color: var(--color-badges-pink-icon);
  }

  .ds-badge-rose {
    background-color: var(--color-badges-rose-background);
    color: var(--color-badges-rose-text);
  }

  .ds-badge-rose > svg {
    color: var(--color-badges-rose-icon);
  }

  .ds-badge-orange {
    background-color: var(--color-badges-orange-background);
    color: var(--color-badges-orange-text);
  }

  .ds-badge-orange > svg {
    color: var(--color-badges-orange-icon);
  }

  .ds-checkbox {
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-border-secondary-alt);
    background-color: var(--primitive-white-a100);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    justify-content: center;
    align-items: center;
    display: inline-flex;
  }

  @media (hover: hover) {
    .ds-checkbox:hover {
      border-color: var(--primitive-skyblue-500);
    }
  }

  .ds-checkbox:focus-visible {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    --tw-ring-color: var(--primitive-skyblue-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-checkbox:focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--primitive-skyblue-500) 20%, transparent);
    }
  }

  .ds-checkbox:focus-visible {
    --tw-outline-style: none;
    outline-style: none;
  }

  .ds-checkbox[data-disabled] {
    pointer-events: none;
    border-color: var(--color-border-primary);
    background-color: var(--primitive-white-a100);
  }

  .ds-checkbox[data-state="checked"] {
    border-color: var(--primitive-skyblue-500);
    background-color: var(--primitive-skyblue-500);
  }

  .ds-checkbox[data-state="checked"][data-disabled] {
    border-color: var(--color-border-primary);
  }

  .ds-checkbox-sm {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
    border-radius: .25rem;
  }

  .ds-checkbox-md {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
    border-radius: var(--radius-md);
  }

  .ds-checkbox-indicator {
    color: var(--color-checkbox-checked);
    justify-content: center;
    align-items: center;
    display: flex;
  }

  .ds-checkbox-indicator[data-disabled] {
    color: var(--border-color-base-50);
  }

  .ds-checkbox-indicator-sm > svg {
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
  }

  .ds-checkbox-indicator-md > svg {
    width: calc(var(--spacing) * 3.5);
    height: calc(var(--spacing) * 3.5);
  }

  .ds-input {
    border-radius: var(--radius-lg);
    border-style: var(--tw-border-style);
    background-color: var(--primitive-white);
    max-width: 100%;
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 2.5);
    color: var(--color-text-title);
    --tw-outline-style: none;
    border-width: 1px;
    outline-style: none;
  }

  .ds-input::placeholder {
    color: var(--primitive-gray-400);
  }

  .ds-input:focus {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
  }

  .ds-input:disabled {
    border-color: var(--color-border-secondary);
    color: var(--primitive-gray-300);
  }

  .ds-input:disabled::placeholder {
    color: var(--primitive-gray-300);
  }

  .ds-input-default {
    border-color: var(--color-border-tertiary);
  }

  .ds-input-default:focus {
    border-color: var(--color-input-brand-focus-border);
    --tw-ring-color: var(--color-input-brand-focus-border);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-input-default:focus {
      --tw-ring-color: color-mix(in oklab, var(--color-input-brand-focus-border) 20%, transparent);
    }
  }

  .ds-input-error {
    border-color: var(--primitive-red-500);
  }

  .ds-input-error:focus {
    --tw-ring-color: var(--primitive-red-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-input-error:focus {
      --tw-ring-color: color-mix(in oklab, var(--primitive-red-500) 20%, transparent);
    }
  }

  .ds-input-success {
    border-color: var(--primitive-green-500);
  }

  .ds-input-success:focus {
    --tw-ring-color: var(--primitive-green-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-input-success:focus {
      --tw-ring-color: color-mix(in oklab, var(--primitive-green-500) 20%, transparent);
    }
  }

  .ds-textarea {
    min-height: calc(var(--spacing) * 24);
    resize: vertical;
    border-radius: var(--radius-lg);
    border-style: var(--tw-border-style);
    background-color: var(--primitive-white);
    width: 100%;
    max-width: 100%;
    color: var(--color-text-title);
    --tw-outline-style: none;
    border-width: 1px;
    outline-style: none;
    display: block;
  }

  .ds-textarea::placeholder {
    color: var(--primitive-gray-400);
  }

  .ds-textarea:focus {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
  }

  .ds-textarea:disabled {
    border-color: var(--color-border-secondary);
    color: var(--primitive-gray-300);
  }

  .ds-textarea:disabled::placeholder {
    color: var(--primitive-gray-300);
  }

  .ds-textarea-default {
    border-color: var(--color-border-tertiary);
  }

  .ds-textarea-default:focus {
    border-color: var(--color-input-brand-focus-border);
    --tw-ring-color: var(--color-input-brand-focus-border);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-textarea-default:focus {
      --tw-ring-color: color-mix(in oklab, var(--color-input-brand-focus-border) 20%, transparent);
    }
  }

  .ds-textarea-error {
    border-color: var(--primitive-red-500);
  }

  .ds-textarea-error:focus {
    --tw-ring-color: var(--primitive-red-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-textarea-error:focus {
      --tw-ring-color: color-mix(in oklab, var(--primitive-red-500) 20%, transparent);
    }
  }

  .ds-textarea-success {
    border-color: var(--primitive-green-500);
  }

  .ds-textarea-success:focus {
    --tw-ring-color: var(--primitive-green-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-textarea-success:focus {
      --tw-ring-color: color-mix(in oklab, var(--primitive-green-500) 20%, transparent);
    }
  }

  .ds-textarea-sm {
    padding-inline: calc(var(--spacing) * 3);
    padding-block: calc(var(--spacing) * 2);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }

  .ds-textarea-md {
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 2.5);
  }

  .ds-native-select {
    appearance: none;
    border-radius: var(--radius-lg);
    border-style: var(--tw-border-style);
    background-color: var(--primitive-white);
    width: 100%;
    max-width: 100%;
    padding-right: calc(var(--spacing) * 10);
    color: var(--color-text-title);
    --tw-outline-style: none;
    border-width: 1px;
    outline-style: none;
  }

  .ds-native-select:focus {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
  }

  .ds-native-select:disabled {
    border-color: var(--color-border-secondary);
    color: var(--primitive-gray-300);
  }

  .ds-native-select-default {
    border-color: var(--color-border-tertiary);
  }

  .ds-native-select-default:focus {
    border-color: var(--color-input-brand-focus-border);
    --tw-ring-color: var(--color-input-brand-focus-border);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-native-select-default:focus {
      --tw-ring-color: color-mix(in oklab, var(--color-input-brand-focus-border) 20%, transparent);
    }
  }

  .ds-native-select-error {
    border-color: var(--primitive-red-500);
  }

  .ds-native-select-error:focus {
    --tw-ring-color: var(--primitive-red-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-native-select-error:focus {
      --tw-ring-color: color-mix(in oklab, var(--primitive-red-500) 20%, transparent);
    }
  }

  .ds-native-select-success {
    border-color: var(--primitive-green-500);
  }

  .ds-native-select-success:focus {
    --tw-ring-color: var(--primitive-green-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-native-select-success:focus {
      --tw-ring-color: color-mix(in oklab, var(--primitive-green-500) 20%, transparent);
    }
  }

  .ds-native-select-sm {
    padding-inline: calc(var(--spacing) * 3);
    padding-block: calc(var(--spacing) * 2);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }

  .ds-native-select-md {
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 2.5);
  }

  .ds-native-select-wrapper {
    width: 100%;
    display: inline-flex;
    position: relative;
  }

  .ds-native-select-chevron {
    pointer-events: none;
    --tw-translate-y: -50%;
    translate: var(--tw-translate-x) var(--tw-translate-y);
    color: var(--color-text-secondary-text);
    position: absolute;
    top: 50%;
  }

  .ds-native-select-chevron-sm {
    right: calc(var(--spacing) * 3);
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }

  .ds-native-select-chevron-md {
    right: calc(var(--spacing) * 4);
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
  }

  .ds-link {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    align-items: center;
    display: inline-flex;
  }

  .ds-link > svg {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
    color: currentColor !important;
  }

  .ds-link-primary {
    color: var(--primitive-skyblue-500);
  }

  @media (hover: hover) {
    .ds-link-primary:hover {
      color: var(--primitive-skyblue-600);
    }
  }

  .ds-link-dark {
    color: var(--color-button-primary-outline-text);
  }

  @media (hover: hover) {
    .ds-link-dark:hover {
      color: var(--color-text-secondary-text);
    }
  }

  .ds-link-sm {
    gap: calc(var(--spacing) * 1.5);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }

  .ds-link-md {
    gap: calc(var(--spacing) * 2);
  }

  .ds-radio-label {
    cursor: pointer;
    align-items: center;
    gap: calc(var(--spacing) * 2);
    -webkit-user-select: none;
    user-select: none;
    display: flex;
  }

  .ds-radio-label-disabled {
    cursor: not-allowed;
  }

  .ds-radio-indicator {
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-border-tertiary);
    background-color: var(--primitive-white-a100);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    border-radius: 3.40282e38px;
    flex-shrink: 0;
    place-items: center;
    display: grid;
    position: relative;
  }

  @media (hover: hover) {
    .ds-radio-indicator:is(:where(.group):hover *) {
      border-color: var(--primitive-skyblue-500);
    }
  }

  .ds-radio-indicator:focus-visible {
    --tw-outline-style: none;
    outline-style: none;
  }

  .ds-radio-indicator[data-disabled] {
    pointer-events: none;
    border-color: var(--color-border-tertiary);
    background-color: #0000;
  }

  .ds-radio-indicator[data-state="checked"] {
    border-color: var(--primitive-skyblue-500);
    background-color: var(--primitive-skyblue-500);
  }

  .ds-radio-indicator-sm {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }

  .ds-radio-indicator-md {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
  }

  .ds-radio-dot {
    background-color: var(--color-checkbox-checked);
    border-radius: 3.40282e38px;
    display: none;
  }

  .ds-radio-dot:is(:where(.group)[data-disabled] *) {
    background-color: var(--border-color-base-300);
  }

  .ds-radio-dot:is(:where(.group)[data-state="checked"] *) {
    display: block;
  }

  .ds-radio-dot-sm {
    width: calc(var(--spacing) * 1.5);
    height: calc(var(--spacing) * 1.5);
  }

  .ds-radio-dot-md {
    width: 7.5px;
    height: 7.5px;
  }

  .ds-radio-text {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--color-text-body);
  }

  .ds-radio-text-disabled {
    color: var(--color-text-tertiary-text);
  }

  .ds-toggle-label {
    cursor: pointer;
    align-items: center;
    gap: calc(var(--spacing) * 2);
    -webkit-user-select: none;
    user-select: none;
    max-width: fit-content;
    display: flex;
  }

  .ds-toggle-label-disabled {
    cursor: not-allowed;
  }

  .ds-toggle-root {
    background-color: var(--color-toggle-default-bg);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    border-radius: 3.40282e38px;
    flex-shrink: 0;
    position: relative;
  }

  .ds-toggle-root:focus-visible {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    --tw-ring-color: var(--color-toggle-active-bg);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-toggle-root:focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--color-toggle-active-bg) 20%, transparent);
    }
  }

  .ds-toggle-root:focus-visible {
    --tw-outline-style: none;
    outline-style: none;
  }

  .ds-toggle-root:disabled {
    background-color: var(--color-toggle-disabled-bg);
  }

  .ds-toggle-root[data-state="checked"] {
    background-color: var(--color-toggle-active-bg);
  }

  .ds-toggle-root-sm {
    height: calc(var(--spacing) * 5);
    width: calc(var(--spacing) * 9);
  }

  .ds-toggle-root-md {
    height: calc(var(--spacing) * 6);
    width: calc(var(--spacing) * 11);
  }

  .ds-toggle-thumb {
    --tw-translate-x: calc(var(--spacing) * .5);
    translate: var(--tw-translate-x) var(--tw-translate-y);
    background-color: var(--color-white);
    --tw-shadow: 0px 1px 3px 0px var(--tw-shadow-color, #1018281a);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    border-radius: 3.40282e38px;
    display: block;
  }

  .ds-toggle-thumb:disabled {
    background-color: var(--primitive-white-a100);
  }

  .ds-toggle-thumb[data-state="checked"] {
    --tw-translate-x: calc(100% + 2px);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .ds-toggle-thumb-sm {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }

  .ds-toggle-thumb-md {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
  }

  .ds-toggle-text {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--color-text-body);
  }

  .ds-toggle-text-disabled {
    color: var(--color-text-tertiary-text);
  }

  .ds-tooltip-content {
    z-index: 50;
    max-width: var(--container-xs);
    border-radius: var(--radius-lg);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-border-secondary);
    background-color: var(--color-background-white-secondary);
    padding-inline: calc(var(--spacing) * 3);
    padding-block: calc(var(--spacing) * 2);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--primitive-gray-700);
    --tw-shadow: 0px 4px 8px -2px var(--tw-shadow-color, #1018281a), 0px 2px 4px -2px var(--tw-shadow-color, #1018280f);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
  }

  .ds-tooltip-arrow {
    fill: var(--color-background-white-secondary);
  }

  .ds-tooltip-arrow > path:last-of-type {
    stroke: var(--color-border-secondary);
  }

  .ds-social-btn {
    justify-content: center;
    align-items: center;
    gap: calc(var(--spacing) * 2.5);
    border-radius: var(--radius-lg);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-border-secondary);
    background-color: var(--color-background-white-primary);
    --tw-font-weight: var(--font-weight-medium);
    width: 100%;
    font-weight: var(--font-weight-medium);
    color: var(--color-text-title);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    display: inline-flex;
  }

  @media (hover: hover) {
    .ds-social-btn:hover {
      background-color: var(--color-background-gray-secondary);
    }
  }

  .ds-social-btn:focus {
    --tw-outline-style: none;
    outline-style: none;
  }

  .ds-social-btn:focus-visible {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    --tw-ring-color: var(--primitive-skyblue-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-social-btn:focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--primitive-skyblue-500) 20%, transparent);
    }
  }

  .ds-social-btn:disabled {
    cursor: not-allowed;
    opacity: .6;
  }

  .ds-social-btn-sm {
    padding-inline: calc(var(--spacing) * 3.5);
    padding-block: calc(var(--spacing) * 2);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }

  .ds-social-btn-sm > svg {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }

  .ds-social-btn-md {
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 2.5);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }

  .ds-social-btn-md > svg {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
  }

  .ds-social-btn-lg {
    padding-inline: calc(var(--spacing) * 5);
    padding-block: calc(var(--spacing) * 3);
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
  }

  .ds-social-btn-lg > svg {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
  }

  .ds-spinner-default {
    animation: var(--animate-spin);
  }

  .ds-spinner-primary {
    color: var(--primitive-skyblue-500);
  }

  .ds-spinner-current {
    color: currentColor;
  }

  .ds-spinner-size-xs {
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
  }

  .ds-spinner-size-sm {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }

  .ds-spinner-size-md {
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
  }

  .ds-spinner-size-lg {
    width: calc(var(--spacing) * 8);
    height: calc(var(--spacing) * 8);
  }

  .ds-spinner-size-xl {
    width: calc(var(--spacing) * 10);
    height: calc(var(--spacing) * 10);
  }

  .ds-dots-spinner {
    justify-content: center;
    align-items: center;
    display: inline-flex;
  }

  .ds-dots-dot {
    animation: var(--animate-pulse);
    background-color: currentColor;
    border-radius: 3.40282e38px;
    display: inline-block;
  }

  .ds-dots-dot-xs {
    width: var(--spacing);
    height: var(--spacing);
  }

  .ds-dots-dot-sm {
    width: calc(var(--spacing) * 1.5);
    height: calc(var(--spacing) * 1.5);
  }

  .ds-dots-dot-md {
    width: calc(var(--spacing) * 2);
    height: calc(var(--spacing) * 2);
  }

  .ds-dots-dot-lg {
    width: calc(var(--spacing) * 2.5);
    height: calc(var(--spacing) * 2.5);
  }

  .ds-dots-dot-xl {
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
  }

  .ds-dots-gap-xs, .ds-dots-gap-sm {
    gap: var(--spacing);
  }

  .ds-dots-gap-md {
    gap: calc(var(--spacing) * 1.5);
  }

  .ds-dots-gap-lg {
    gap: calc(var(--spacing) * 2);
  }

  .ds-dots-gap-xl {
    gap: calc(var(--spacing) * 2.5);
  }

  .ds-bar-spinner {
    background-color: var(--color-border-secondary);
    border-radius: 3.40282e38px;
    position: relative;
    overflow: hidden;
  }

  .ds-bar-spinner-xs {
    height: calc(var(--spacing) * .5);
    width: calc(var(--spacing) * 16);
  }

  .ds-bar-spinner-sm {
    height: var(--spacing);
    width: calc(var(--spacing) * 24);
  }

  .ds-bar-spinner-md {
    height: var(--spacing);
    width: calc(var(--spacing) * 32);
  }

  .ds-bar-spinner-lg {
    height: calc(var(--spacing) * 1.5);
    width: calc(var(--spacing) * 48);
  }

  .ds-bar-spinner-xl {
    height: calc(var(--spacing) * 2);
    width: calc(var(--spacing) * 64);
  }

  .ds-bar-segment {
    inset-block: 0;
    background-color: currentColor;
    border-radius: 3.40282e38px;
    width: 33.3333%;
    animation: 1.4s ease-in-out infinite ds-bar-indeterminate;
    position: absolute;
    left: 0;
  }

  .ds-label {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-normal);
    font-weight: var(--font-weight-normal);
    color: var(--color-text-body);
  }

  .ds-skeleton {
    height: calc(var(--spacing) * 3);
    background-color: var(--color-skeleton-gradient-100);
    border-radius: 3.40282e38px;
    animation: 2s cubic-bezier(.4, 0, .6, 1) infinite pulse;
  }

  .ds-slider-input {
    appearance: none;
    --tw-outline-style: none;
    background-color: #0000;
    outline-style: none;
    width: 100%;
    display: block;
  }

  .ds-slider-input:focus-visible {
    --tw-outline-style: none;
    outline-style: none;
  }

  .ds-slider-input:disabled {
    pointer-events: none;
    opacity: .5;
  }

  .ds-slider-input-sm {
    height: calc(var(--spacing) * 4);
  }

  .ds-slider-input-md {
    height: calc(var(--spacing) * 5);
  }

  .ds-slider-wrapper {
    align-items: center;
    gap: calc(var(--spacing) * 3);
    width: 100%;
    display: flex;
  }

  .ds-slider-value {
    text-align: right;
    min-width: 2ch;
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--color-text-body);
    --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, );
  }

  .ds-progress-wrapper {
    max-width: calc(var(--spacing) * 80);
    align-items: center;
    gap: calc(var(--spacing) * 3);
    display: flex;
  }

  .ds-progress-track {
    height: calc(var(--spacing) * 2);
    border-radius: 3.40282e38px;
    width: 100%;
    position: relative;
  }

  .ds-progress-clip {
    border-radius: 3.40282e38px;
    width: 100%;
    height: 100%;
    overflow: hidden;
  }

  .ds-progress-bar {
    text-align: center;
    border-radius: 3.40282e38px;
    width: 100%;
    height: 100%;
  }

  .ds-progress-label {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-leading: 1;
    --tw-font-weight: var(--font-weight-medium);
    line-height: 1;
    font-weight: var(--font-weight-medium);
    color: var(--color-text-body);
  }

  .ds-icon {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
    flex-shrink: 0;
  }

  .ds-icon-sm {
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
  }

  .ds-icon-xs {
    width: calc(var(--spacing) * 3.5);
    height: calc(var(--spacing) * 3.5);
  }

  .ds-icon-md {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }

  .ds-icon-badge-arrow {
    width: calc(var(--spacing) * 3.5);
    height: calc(var(--spacing) * 3.5);
  }

  .ds-checkbox-check-svg {
    stroke: var(--color-checkbox-checked);
  }

  .ds-text {
    --tw-leading: var(--leading-normal);
    line-height: var(--leading-normal);
  }

  .ds-text-xs {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
  }

  .ds-text-sm {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }

  .ds-text-md {
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
  }

  .ds-text-lg {
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
  }

  .ds-text-regular {
    --tw-font-weight: var(--font-weight-normal);
    font-weight: var(--font-weight-normal);
  }

  .ds-text-medium {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }

  .ds-text-semibold {
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
  }

  .ds-text-default {
    color: var(--color-text-body);
  }

  .ds-text-muted {
    color: var(--color-text-secondary-text);
  }

  .ds-text-title {
    color: var(--color-text-title);
  }

  .ds-heading {
    --tw-leading: var(--leading-tight);
    line-height: var(--leading-tight);
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-title);
  }

  .ds-heading-1 {
    font-size: var(--text-4xl);
    line-height: var(--tw-leading, var(--text-4xl--line-height));
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }

  .ds-heading-2 {
    font-size: var(--text-3xl);
    line-height: var(--tw-leading, var(--text-3xl--line-height));
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }

  .ds-heading-3 {
    font-size: var(--text-2xl);
    line-height: var(--tw-leading, var(--text-2xl--line-height));
  }

  .ds-heading-4 {
    font-size: var(--text-xl);
    line-height: var(--tw-leading, var(--text-xl--line-height));
  }

  .ds-heading-muted {
    color: var(--color-text-secondary-text);
  }

  .ds-heading-inherit {
    color: inherit;
  }

  .ds-card {
    border-radius: var(--radius-xl);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-border-secondary);
    background-color: var(--color-background-white-secondary);
  }

  .ds-card-p-sm {
    padding: calc(var(--spacing) * 4);
  }

  .ds-card-p-md {
    padding: calc(var(--spacing) * 6);
  }

  .ds-card-p-lg {
    padding: calc(var(--spacing) * 8);
  }

  .ds-btn-group {
    display: inline-flex;
  }

  .ds-btn-group-item {
    justify-content: center;
    align-items: center;
    gap: calc(var(--spacing) * 2);
    border-style: var(--tw-border-style);
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-outline-style: none;
    border-width: 1px;
    outline-style: none;
    display: inline-flex;
  }

  .ds-btn-group-item:focus-visible {
    z-index: 10;
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
  }

  .ds-btn-group-item:disabled {
    pointer-events: none;
    opacity: .5;
  }

  .ds-btn-group-item > svg {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
    flex-shrink: 0;
  }

  .ds-btn-group-item-sm {
    padding-inline: calc(var(--spacing) * 3);
    padding-block: calc(var(--spacing) * 1.5);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
  }

  .ds-btn-group-item-sm > svg {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }

  .ds-btn-group-item-md {
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 2);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }

  .ds-btn-group-item-md > svg {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }

  .ds-btn-group-item-lg {
    padding-inline: calc(var(--spacing) * 5);
    padding-block: calc(var(--spacing) * 2.5);
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
  }

  .ds-btn-group-item-lg > svg {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
  }

  .ds-btn-group-item-primary {
    border-color: var(--color-border-secondary);
    background-color: var(--color-background-white-primary);
    color: var(--color-text-body);
  }

  @media (hover: hover) {
    .ds-btn-group-item-primary:hover {
      background-color: var(--color-background-white-secondary);
      color: var(--color-text-title);
    }
  }

  .ds-btn-group-item-primary:focus-visible {
    --tw-ring-color: var(--primitive-skyblue-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-btn-group-item-primary:focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--primitive-skyblue-500) 30%, transparent);
    }
  }

  .ds-btn-group-item-primary[data-active="true"] {
    border-color: var(--primitive-skyblue-500);
    background-color: var(--primitive-skyblue-500);
    color: var(--primitive-white);
  }

  @media (hover: hover) {
    .ds-btn-group-item-primary[data-active="true"]:hover {
      background-color: var(--primitive-skyblue-600);
    }
  }

  .ds-btn-group-item-ghost {
    color: var(--color-text-body);
    background-color: #0000;
    border-color: #0000;
  }

  @media (hover: hover) {
    .ds-btn-group-item-ghost:hover {
      background-color: var(--color-background-white-secondary);
      color: var(--color-text-title);
    }
  }

  .ds-btn-group-item-ghost:focus-visible {
    --tw-ring-color: var(--primitive-skyblue-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-btn-group-item-ghost:focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--primitive-skyblue-500) 30%, transparent);
    }
  }

  .ds-btn-group-item-ghost[data-active="true"] {
    background-color: var(--primitive-skyblue-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-btn-group-item-ghost[data-active="true"] {
      background-color: color-mix(in oklab,var(--primitive-skyblue-500) 10%,transparent);
    }
  }

  .ds-btn-group-item-ghost[data-active="true"] {
    color: var(--primitive-skyblue-500);
  }

  .ds-form-row {
    gap: calc(var(--spacing) * 1.5);
    flex-direction: column;
    display: flex;
  }

  .ds-form-row-label {
    align-items: center;
    gap: calc(var(--spacing) * .5);
    display: flex;
  }

  .ds-form-row-required {
    margin-left: calc(var(--spacing) * .5);
    color: var(--primitive-red-500);
  }

  .ds-form-row-error {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    color: var(--primitive-red-500);
  }

  .ds-form-row-hint {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    color: var(--color-text-tertiary-text);
  }

  .ds-list {
    flex-direction: column;
    display: flex;
  }

  .ds-list-bordered {
    border-radius: var(--radius-xl);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-border-secondary);
    background-color: var(--color-background-white-secondary);
    overflow: hidden;
  }

  .ds-list-item {
    align-items: flex-start;
    gap: calc(var(--spacing) * 3);
    width: 100%;
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 3);
    text-align: left;
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-outline-style: none;
    outline-style: none;
    display: flex;
  }

  @media (hover: hover) {
    .ds-list-item-interactive:hover {
      background-color: var(--color-background-gray-secondary);
    }
  }

  .ds-list-item-interactive:focus-visible {
    background-color: var(--color-background-gray-secondary);
  }

  .ds-list-item-disabled {
    pointer-events: none;
    opacity: .6;
  }

  .ds-list-item-wrapper-divider {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    border-color: var(--color-border-secondary);
  }

  .ds-list-item-icon {
    margin-top: calc(var(--spacing) * .5);
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
    color: var(--color-text-secondary-text);
    flex-shrink: 0;
    place-items: center;
    display: grid;
  }

  .ds-list-item-icon > svg {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
  }

  .ds-list-item-body {
    gap: calc(var(--spacing) * .5);
    flex-direction: column;
    flex: 1;
    min-width: 0;
    display: flex;
  }

  .ds-list-item-title {
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--color-text-title);
    overflow: hidden;
  }

  .ds-list-item-description {
    -webkit-line-clamp: 2;
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    color: var(--color-text-secondary-text);
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden;
  }

  .ds-list-item-meta {
    margin-left: calc(var(--spacing) * 3);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    color: var(--color-text-tertiary-text);
    flex-shrink: 0;
    align-items: center;
    display: flex;
  }

  .ds-list-item-inset-divider {
    pointer-events: none;
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    border-color: var(--color-border-secondary);
    position: absolute;
    bottom: 0;
    left: 3.25rem;
    right: 0;
  }

  .ds-otp-wrapper {
    align-items: center;
    gap: calc(var(--spacing) * 2);
    color: var(--primitive-gray-400);
    display: flex;
  }

  .ds-otp-wrapper:focus-within {
    color: var(--color-text-body);
  }

  .ds-otp-cell {
    width: calc(var(--spacing) * 11);
    height: calc(var(--spacing) * 11);
    border-radius: var(--radius-lg);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-border-tertiary);
    background-color: var(--primitive-white);
    padding: calc(var(--spacing) * 2);
    text-align: center;
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
    --tw-font-weight: var(--font-weight-normal);
    font-weight: var(--font-weight-normal);
    --tw-shadow: 0px 1px 2px 0px var(--tw-shadow-color, #1018280d);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    justify-content: center;
    align-items: center;
    display: flex;
  }

  .ds-otp-cell:focus {
    border-color: var(--color-input-brand-focus-border);
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    --tw-ring-color: var(--color-input-brand-focus-border);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-otp-cell:focus {
      --tw-ring-color: color-mix(in oklab, var(--color-input-brand-focus-border) 20%, transparent);
    }
  }

  .ds-otp-cell:focus {
    --tw-outline-style: none;
    outline-style: none;
  }

  .ds-otp-cell:disabled {
    border-color: var(--color-border-secondary);
    background-color: var(--color-background-gray-primary);
    color: var(--primitive-gray-300);
  }

  .ds-otp-cell-filled {
    color: var(--color-text-body);
  }

  .ds-otp-separator {
    margin-inline: calc(var(--spacing) * 2);
    height: calc(var(--spacing) * .5);
    width: calc(var(--spacing) * 3);
    background-color: var(--color-background-gray-quaternary);
    border-radius: 3.40282e38px;
    flex-shrink: 0;
  }

  .ds-search-field {
    align-items: center;
    display: flex;
    position: relative;
  }

  .ds-search-field-icon {
    pointer-events: none;
    left: calc(var(--spacing) * 3);
    color: var(--primitive-gray-400);
    flex-shrink: 0;
    align-items: center;
    display: flex;
    position: absolute;
  }

  .ds-search-field-clear {
    right: calc(var(--spacing) * 3);
    color: var(--primitive-gray-400);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-outline-style: none;
    border-radius: .25rem;
    outline-style: none;
    flex-shrink: 0;
    justify-content: center;
    align-items: center;
    display: flex;
    position: absolute;
  }

  @media (hover: hover) {
    .ds-search-field-clear:hover {
      color: var(--color-text-body);
    }
  }

  .ds-search-field-clear:focus-visible {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    --tw-ring-color: var(--primitive-skyblue-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-search-field-clear:focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--primitive-skyblue-500) 30%, transparent);
    }
  }

  .ds-setting-row {
    align-items: flex-start;
    gap: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 3);
    display: flex;
  }

  .ds-setting-row-divider {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    border-color: var(--color-border-secondary);
  }

  .ds-setting-row-divider:last-child {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 0;
  }

  .ds-setting-row-icon {
    width: calc(var(--spacing) * 9);
    height: calc(var(--spacing) * 9);
    border-radius: var(--radius-lg);
    background-color: var(--primitive-skyblue-50);
    color: var(--primitive-skyblue-500);
    flex-shrink: 0;
    place-items: center;
    display: grid;
  }

  .ds-setting-row-icon svg {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }

  .ds-setting-row-body {
    flex: 1;
    min-width: 0;
  }

  .ds-setting-row-label {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-title);
  }

  .ds-setting-row-description {
    margin-top: calc(var(--spacing) * .5);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-leading: var(--leading-relaxed);
    line-height: var(--leading-relaxed);
    color: var(--color-text-secondary-text);
  }

  .ds-setting-row-action {
    padding-top: calc(var(--spacing) * .5);
    flex-shrink: 0;
  }

  .ds-breadcrumbs {
    align-items: center;
    gap: calc(var(--spacing) * 1.5);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    color: var(--color-text-tertiary-text);
    flex-wrap: wrap;
    display: flex;
  }

  .ds-breadcrumbs-ol {
    align-items: center;
    gap: calc(var(--spacing) * 1.5);
    flex-wrap: wrap;
    display: flex;
  }

  .ds-breadcrumbs-item-current {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--color-text-title);
    align-items: center;
    display: inline-flex;
  }

  .ds-breadcrumbs-item-link-li {
    align-items: center;
    display: inline-flex;
  }

  .ds-breadcrumbs-item-link {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    align-items: center;
    display: inline-flex;
  }

  @media (hover: hover) {
    .ds-breadcrumbs-item-link:hover {
      color: var(--primitive-skyblue-500);
    }
  }

  .ds-breadcrumbs-separator {
    color: var(--color-text-tertiary-text);
    -webkit-user-select: none;
    user-select: none;
    align-items: center;
    display: inline-flex;
  }

  .ds-breadcrumbs-ellipsis {
    padding-inline: var(--spacing);
    color: var(--color-text-tertiary-text);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    border-radius: .25rem;
    align-items: center;
    display: inline-flex;
  }

  @media (hover: hover) {
    .ds-breadcrumbs-ellipsis:hover {
      color: var(--primitive-skyblue-500);
    }
  }

  .ds-breadcrumbs-ellipsis:focus-visible {
    color: var(--primitive-skyblue-500);
    --tw-outline-style: none;
    outline-style: none;
  }

  .ds-badge-transition {
    align-items: center;
    gap: calc(var(--spacing) * 1.5);
    display: inline-flex;
  }

  .ds-badge-transition-connector {
    color: var(--color-text-tertiary-text);
    flex-shrink: 0;
  }

  .ds-menubar-root {
    align-items: center;
    gap: var(--spacing);
    border-radius: var(--radius-lg);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-border-secondary);
    background-color: var(--color-background-white-secondary);
    padding: var(--spacing);
    display: inline-flex;
  }

  .ds-menubar-trigger {
    border-radius: var(--radius-md);
    padding-inline: calc(var(--spacing) * 3);
    padding-block: calc(var(--spacing) * 1.5);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--color-text-secondary-text);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-outline-style: none;
    -webkit-user-select: none;
    user-select: none;
    outline-style: none;
    align-items: center;
    display: inline-flex;
  }

  @media (hover: hover) {
    .ds-menubar-trigger:hover {
      background-color: var(--color-background-gray-secondary);
      color: var(--color-text-title);
    }
  }

  .ds-menubar-trigger:focus-visible, .ds-menubar-trigger[data-state="open"] {
    background-color: var(--color-background-gray-secondary);
    color: var(--color-text-title);
  }

  .ds-menubar-content {
    z-index: 50;
    min-width: calc(var(--spacing) * 44);
    border-radius: var(--radius-xl);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-border-secondary);
    background-color: var(--color-background-white-secondary);
    padding: var(--spacing);
    --tw-shadow: 0px 12px 16px -4px var(--tw-shadow-color, #10182814), 0px 4px 6px -2px var(--tw-shadow-color, #10182808);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    overflow: hidden;
  }

  .ds-menubar-item {
    cursor: pointer;
    justify-content: space-between;
    align-items: center;
    gap: calc(var(--spacing) * 6);
    border-radius: var(--radius-lg);
    padding-inline: calc(var(--spacing) * 3);
    padding-block: calc(var(--spacing) * 2);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--color-text-body);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-outline-style: none;
    -webkit-user-select: none;
    user-select: none;
    outline-style: none;
    display: flex;
  }

  @media (hover: hover) {
    .ds-menubar-item:hover {
      background-color: var(--color-background-gray-secondary);
      color: var(--color-text-title);
    }
  }

  .ds-menubar-item:focus-visible {
    background-color: var(--color-background-gray-secondary);
    color: var(--color-text-title);
  }

  .ds-menubar-item[data-disabled] {
    pointer-events: none;
    opacity: .5;
  }

  .ds-menubar-item[data-highlighted] {
    background-color: var(--color-background-gray-secondary);
    color: var(--color-text-title);
  }

  .ds-menubar-shortcut {
    padding-left: calc(var(--spacing) * 4);
    --tw-tracking: var(--tracking-wider);
    letter-spacing: var(--tracking-wider);
    color: var(--color-text-tertiary-text);
    margin-left: auto;
    font-size: 11px;
  }

  .ds-menubar-separator {
    margin-block: var(--spacing);
    background-color: var(--color-border-secondary);
    height: 1px;
  }

  .ds-menubar-label {
    padding-inline: calc(var(--spacing) * 3);
    padding-block: calc(var(--spacing) * 1.5);
    --tw-font-weight: var(--font-weight-bold);
    font-size: 11px;
    font-weight: var(--font-weight-bold);
    --tw-tracking: var(--tracking-wider);
    letter-spacing: var(--tracking-wider);
    color: var(--color-text-tertiary-text);
    text-transform: uppercase;
  }

  .ds-popover-content {
    z-index: 50;
    max-width: var(--container-sm);
    border-radius: var(--radius-xl);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-border-secondary);
    background-color: var(--color-background-white-secondary);
    padding: calc(var(--spacing) * 4);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--color-text-body);
    --tw-shadow: 0px 12px 16px -4px var(--tw-shadow-color, #10182814), 0px 4px 6px -2px var(--tw-shadow-color, #10182808);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    --tw-outline-style: none;
    outline-style: none;
  }

  .ds-popover-arrow {
    fill: var(--color-background-white-secondary);
  }

  .ds-radio-group-vertical {
    gap: calc(var(--spacing) * 2);
    flex-direction: column;
    display: flex;
  }

  .ds-radio-group-horizontal {
    gap: calc(var(--spacing) * 4);
    flex-flow: wrap;
    display: flex;
  }

  .ds-time-picker-wrapper {
    align-items: center;
    width: 100%;
    display: inline-flex;
    position: relative;
  }

  .ds-time-picker-trigger-btn {
    right: calc(var(--spacing) * 3);
    z-index: 10;
    color: var(--color-text-secondary-text);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-outline-style: none;
    outline-style: none;
    justify-content: center;
    align-items: center;
    display: flex;
    position: absolute;
  }

  @media (hover: hover) {
    .ds-time-picker-trigger-btn:hover {
      color: var(--color-text-title);
    }
  }

  .ds-time-picker-trigger-btn:focus-visible {
    color: var(--primitive-skyblue-500);
  }

  .ds-time-picker-trigger-btn:disabled {
    pointer-events: none;
    opacity: .5;
  }

  .ds-time-picker-panel {
    align-items: center;
    gap: calc(var(--spacing) * 2);
    display: flex;
  }

  .ds-time-picker-field {
    gap: var(--spacing);
    flex-direction: column;
    display: flex;
  }

  .ds-time-picker-field-label {
    --tw-font-weight: var(--font-weight-medium);
    font-size: 11px;
    font-weight: var(--font-weight-medium);
    --tw-tracking: var(--tracking-wider);
    letter-spacing: var(--tracking-wider);
    color: var(--color-text-secondary-text);
    text-transform: uppercase;
  }

  .ds-time-picker-separator {
    margin-top: calc(var(--spacing) * 5);
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-title);
  }

  .ds-date-picker-wrapper {
    align-items: center;
    width: 100%;
    display: inline-flex;
    position: relative;
  }

  .ds-date-picker-trigger-btn {
    right: calc(var(--spacing) * 3);
    z-index: 10;
    color: var(--color-text-secondary-text);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-outline-style: none;
    outline-style: none;
    justify-content: center;
    align-items: center;
    display: flex;
    position: absolute;
  }

  @media (hover: hover) {
    .ds-date-picker-trigger-btn:hover {
      color: var(--color-text-title);
    }
  }

  .ds-date-picker-trigger-btn:focus-visible {
    color: var(--primitive-skyblue-500);
  }

  .ds-date-picker-trigger-btn:disabled {
    pointer-events: none;
    opacity: .5;
  }

  .ds-btn-group-only {
    border-radius: var(--radius-lg);
  }

  .ds-btn-group-first {
    border-top-left-radius: var(--radius-lg);
    border-bottom-left-radius: var(--radius-lg);
  }

  .ds-btn-group-last {
    border-top-right-radius: var(--radius-lg);
    border-bottom-right-radius: var(--radius-lg);
    margin-left: -1px;
  }

  .ds-btn-group-middle {
    border-radius: 0;
    margin-left: -1px;
  }

  .ds-btn-group-override-only {
    border-radius: 0 !important;
  }

  .ds-btn-group-override-first {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
  }

  .ds-btn-group-override-last {
    margin-left: -1px;
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
  }

  .ds-picker-input {
    cursor: pointer;
    width: 100%;
    padding-right: calc(var(--spacing) * 10);
  }

  .ds-picker-panel-sm {
    padding: calc(var(--spacing) * 2);
  }

  .ds-picker-panel-md {
    padding: calc(var(--spacing) * 3);
  }

  .ds-picker-panel-range {
    padding: calc(var(--spacing) * 3);
    width: max-content;
  }

  .ds-search-input {
    width: 100%;
    padding-right: calc(var(--spacing) * 4);
    padding-left: calc(var(--spacing) * 9);
  }

  .ds-search-input-clearable {
    width: 100%;
    padding-right: calc(var(--spacing) * 9);
    padding-left: calc(var(--spacing) * 9);
  }

  .ds-password-field {
    align-items: center;
    display: flex;
    position: relative;
  }

  .ds-password-field-input {
    width: 100%;
    padding-right: calc(var(--spacing) * 12);
  }

  .ds-password-field-toggle {
    right: calc(var(--spacing) * 3);
    position: absolute;
  }

  .ds-list-item-wrapper {
    position: relative;
  }

  .ds-menubar-item-label {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
  }

  .ds-date-range-footer {
    margin-top: var(--spacing);
    justify-content: flex-end;
    align-items: center;
    gap: calc(var(--spacing) * 2);
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
    border-color: var(--color-border-secondary);
    padding-top: calc(var(--spacing) * 3);
    display: flex;
  }

  .ds-file-card {
    overflow: hidden;
  }

  .ds-file-card-body {
    gap: calc(var(--spacing) * 3);
    padding: calc(var(--spacing) * 3);
    flex-direction: column;
    display: flex;
  }

  .ds-file-card-body-clickable {
    cursor: pointer;
  }

  @media (hover: hover) {
    .ds-file-card-body-clickable:hover {
      background-color: var(--color-background-white-primary);
    }
  }

  .ds-file-card-body-clickable:focus {
    --tw-outline-style: none;
    outline-style: none;
  }

  .ds-file-card-body-clickable:focus-visible {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    --tw-ring-color: var(--primitive-skyblue-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-file-card-body-clickable:focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--primitive-skyblue-500) 20%, transparent);
    }
  }

  .ds-file-card-row {
    align-items: center;
    gap: calc(var(--spacing) * 3);
    display: flex;
  }

  .ds-file-card-icon {
    width: calc(var(--spacing) * 10);
    height: calc(var(--spacing) * 10);
    border-radius: var(--radius-md);
    flex-shrink: 0;
    place-items: center;
    display: grid;
  }

  .ds-file-card-content {
    flex: 1;
    min-width: 0;
  }

  .ds-file-card-meta {
    align-items: center;
    gap: calc(var(--spacing) * 2);
    display: flex;
  }

  .ds-file-card-chevron {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
    color: var(--color-text-tertiary-text);
    transition-property: transform, translate, scale, rotate;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    flex-shrink: 0;
  }

  .ds-file-card-chevron-open {
    rotate: 90deg;
  }

  .ds-file-card-preview {
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
    border-color: var(--color-border-secondary);
    background-color: var(--color-background-white-secondary);
  }

  .ds-accordion-root {
    flex-direction: column;
    width: 100%;
    display: flex;
    overflow: clip;
  }

  .ds-accordion-root-style_one {
    gap: calc(var(--spacing) * 5);
  }

  .ds-accordion-root-style_two {
    gap: calc(var(--spacing) * 4);
  }

  .ds-accordion-root-style_three {
    gap: calc(var(--spacing) * 3);
  }

  .ds-accordion-root-style_four {
    gap: calc(var(--spacing) * 4);
  }

  .ds-accordion-root-style_five {
    column-gap: calc(var(--spacing) * 4);
    row-gap: calc(var(--spacing) * 3);
  }

  .ds-accordion-item {
    width: 100%;
  }

  .ds-accordion-item-style_one {
    border-radius: var(--radius-xl);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-border-secondary);
    background-color: var(--color-background-white-secondary);
    overflow: clip;
  }

  .ds-accordion-item-style_two {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    border-color: var(--color-border-primary);
  }

  .ds-accordion-item-style_three {
    border-radius: var(--radius-xl);
    background-color: var(--color-background-white-secondary);
    overflow: clip;
  }

  .ds-accordion-item-style_four, .ds-accordion-item-style_five {
    border-radius: var(--radius-xl);
    background-color: var(--color-background-gray-primary);
    overflow: clip;
  }

  .ds-accordion-trigger {
    justify-content: space-between;
    align-items: flex-start;
    gap: calc(var(--spacing) * 2);
    text-align: left;
    width: 100%;
    color: var(--color-text-title);
    display: flex;
  }

  .ds-accordion-trigger-style_one {
    padding: calc(var(--spacing) * 5);
  }

  .ds-accordion-trigger-style_one[data-state="open"] {
    padding-bottom: calc(var(--spacing) * 4);
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--primitive-skyblue-500);
  }

  @media (min-width: 40rem) {
    .ds-accordion-trigger-style_one {
      padding: calc(var(--spacing) * 6);
    }
  }

  .ds-accordion-trigger-style_two {
    padding: calc(var(--spacing) * 6);
  }

  .ds-accordion-trigger-style_two[data-state="open"] {
    padding-bottom: calc(var(--spacing) * 4);
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }

  @media not all and (min-width: 40rem) {
    .ds-accordion-trigger-style_two {
      padding-inline: 0;
      padding-block: calc(var(--spacing) * 5);
    }

    .ds-accordion-trigger-style_three {
      padding: calc(var(--spacing) * 5);
    }

    .ds-accordion-trigger-style_three[data-state="open"] {
      padding-bottom: calc(var(--spacing) * 4);
    }
  }

  @media (min-width: 40rem) {
    .ds-accordion-trigger-style_three {
      padding-inline: calc(var(--spacing) * 6);
      padding-block: calc(var(--spacing) * 5);
    }
  }

  .ds-accordion-trigger-style_four {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }

  @media not all and (min-width: 40rem) {
    .ds-accordion-trigger-style_four {
      padding: calc(var(--spacing) * 5);
    }

    .ds-accordion-trigger-style_four[data-state="open"] {
      padding-bottom: calc(var(--spacing) * 4);
    }
  }

  @media (min-width: 40rem) {
    .ds-accordion-trigger-style_four {
      padding-inline: calc(var(--spacing) * 6);
      padding-top: calc(var(--spacing) * 6);
      padding-bottom: calc(var(--spacing) * 5);
    }
  }

  .ds-accordion-trigger-style_five {
    padding: calc(var(--spacing) * 5);
  }

  .ds-accordion-trigger-style_five[data-state="open"] {
    padding-bottom: calc(var(--spacing) * 5);
  }

  @media (min-width: 40rem) {
    .ds-accordion-trigger-style_five {
      padding: calc(var(--spacing) * 6);
    }
  }

  .ds-accordion-trigger-icon {
    align-items: center;
    height: 1lh;
    display: flex;
  }

  .ds-accordion-trigger-chevron {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
    transition-property: transform, translate, scale, rotate;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: .2s;
    flex-shrink: 0;
    transition-duration: .2s;
  }

  .ds-accordion-trigger-chevron:is(:where(.group)[data-state="open"] *) {
    rotate: 180deg;
  }

  .ds-accordion-content {
    color: var(--color-text-secondary-text);
  }

  .ds-accordion-content-style_one {
    padding-inline: calc(var(--spacing) * 5);
    padding-bottom: calc(var(--spacing) * 5);
  }

  @media (min-width: 40rem) {
    .ds-accordion-content-style_one {
      padding-inline: calc(var(--spacing) * 6);
      padding-bottom: calc(var(--spacing) * 7);
    }
  }

  .ds-accordion-content-style_two {
    padding: calc(var(--spacing) * 6);
    padding-top: 0;
  }

  @media not all and (min-width: 40rem) {
    .ds-accordion-content-style_two {
      padding-inline: calc(var(--spacing) * 5);
      padding-bottom: calc(var(--spacing) * 5);
    }
  }

  .ds-accordion-content-style_three {
    margin-inline: calc(var(--spacing) * 5);
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
    border-color: var(--color-border-primary);
    padding-top: calc(var(--spacing) * 4);
    padding-bottom: calc(var(--spacing) * 5);
  }

  @media (min-width: 40rem) {
    .ds-accordion-content-style_three {
      margin-inline: calc(var(--spacing) * 6);
    }
  }

  .ds-accordion-content-style_four {
    margin-inline: calc(var(--spacing) * 5);
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
    border-color: var(--color-border-secondary-alt);
    padding-top: calc(var(--spacing) * 4);
    padding-bottom: calc(var(--spacing) * 5);
  }

  @media (min-width: 40rem) {
    .ds-accordion-content-style_four {
      margin-inline: calc(var(--spacing) * 6);
      padding-bottom: calc(var(--spacing) * 6);
    }
  }

  .ds-accordion-content-style_five {
    padding: calc(var(--spacing) * 5);
    padding-top: 0;
  }

  @media (min-width: 40rem) {
    .ds-accordion-content-style_five {
      padding: calc(var(--spacing) * 6);
      padding-top: 0;
    }
  }

  .ds-dialog-icon-tile {
    width: calc(var(--spacing) * 10);
    height: calc(var(--spacing) * 10);
    border-radius: var(--radius-lg);
    flex-shrink: 0;
    justify-content: center;
    align-items: center;
    display: flex;
  }

  .ds-dialog-icon-tile > svg {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
  }

  .ds-dialog-icon-tile-info {
    background-color: var(--primitive-bluelight-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-dialog-icon-tile-info {
      background-color: color-mix(in oklab,var(--primitive-bluelight-500) 10%,transparent);
    }
  }

  .ds-dialog-icon-tile-info {
    color: var(--primitive-bluelight-500);
  }

  .ds-dialog-icon-tile-success {
    background-color: var(--primitive-green-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-dialog-icon-tile-success {
      background-color: color-mix(in oklab,var(--primitive-green-500) 10%,transparent);
    }
  }

  .ds-dialog-icon-tile-success {
    color: var(--primitive-green-500);
  }

  .ds-dialog-icon-tile-warning {
    background-color: var(--primitive-yellow-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-dialog-icon-tile-warning {
      background-color: color-mix(in oklab,var(--primitive-yellow-500) 10%,transparent);
    }
  }

  .ds-dialog-icon-tile-warning {
    color: var(--primitive-yellow-500);
  }

  .ds-dialog-icon-tile-danger {
    background-color: var(--primitive-red-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-dialog-icon-tile-danger {
      background-color: color-mix(in oklab,var(--primitive-red-500) 10%,transparent);
    }
  }

  .ds-dialog-icon-tile-danger {
    color: var(--primitive-red-500);
  }

  .ds-dialog-overlay {
    z-index: 50;
    background-color: #0000004d;
    position: fixed;
    inset: 0;
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-dialog-overlay {
      background-color: color-mix(in oklab,var(--color-black) 30%,transparent);
    }
  }

  .ds-dialog-content {
    z-index: 50;
    --tw-translate-x: -50%;
    --tw-translate-y: -50%;
    width: 100%;
    max-height: 85vh;
    translate: var(--tw-translate-x) var(--tw-translate-y);
    border-radius: var(--radius-xl);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-border-secondary);
    background-color: var(--color-background-white-secondary);
    padding: calc(var(--spacing) * 6);
    --tw-shadow: 0px 12px 16px -4px var(--tw-shadow-color, #10182814), 0px 4px 6px -2px var(--tw-shadow-color, #10182808);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    --tw-outline-style: none;
    outline-style: none;
    position: fixed;
    top: 50%;
    left: 50%;
    overflow-y: auto;
  }

  @media not all and (min-width: 40rem) {
    .ds-dialog-content {
      max-width: 90vw;
    }
  }

  .ds-dialog-content-sm {
    max-width: var(--container-sm);
  }

  .ds-dialog-content-md {
    max-width: var(--container-lg);
  }

  .ds-dialog-content-lg {
    max-width: var(--container-2xl);
  }

  .ds-dialog-header {
    gap: calc(var(--spacing) * 1.5);
    text-align: left;
    flex-direction: column;
    display: flex;
  }

  .ds-dialog-title {
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
    --tw-leading: var(--leading-snug);
    line-height: var(--leading-snug);
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-title);
  }

  .ds-dialog-description {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--color-text-secondary-text);
  }

  .ds-dialog-footer {
    margin-top: calc(var(--spacing) * 6);
    gap: calc(var(--spacing) * 2);
    flex-direction: column-reverse;
    display: flex;
  }

  @media (min-width: 40rem) {
    .ds-dialog-footer {
      flex-direction: row;
      justify-content: flex-end;
    }
  }

  .ds-dialog-body-row {
    align-items: flex-start;
    gap: calc(var(--spacing) * 4);
    display: flex;
  }

  .ds-drawer-backdrop-wrapper {
    z-index: 50;
    position: fixed;
    inset: 0;
  }

  .ds-drawer-backdrop-wrapper-closed {
    pointer-events: none;
    visibility: hidden;
    transition: visibility 0s linear .3s;
  }

  .ds-drawer-backdrop {
    background-color: #0000004d;
    position: fixed;
    inset: 0;
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-drawer-backdrop {
      background-color: color-mix(in oklab,var(--color-black) 30%,transparent);
    }
  }

  .ds-drawer-backdrop {
    transition-property: opacity;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: .3s;
    transition-duration: .3s;
  }

  .ds-drawer-backdrop-open {
    opacity: 1;
  }

  .ds-drawer-backdrop-closed {
    opacity: 0;
  }

  .ds-drawer-panel {
    z-index: 50;
    border-color: var(--color-border-secondary);
    background-color: var(--color-background-white-secondary);
    --tw-shadow: 0px 12px 16px -4px var(--tw-shadow-color, #10182814), 0px 4px 6px -2px var(--tw-shadow-color, #10182808);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    transition-property: transform, translate, scale, rotate;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: .3s;
    --tw-ease: cubic-bezier(.32,.72,0,1);
    will-change: transform;
    --tw-outline-style: none;
    outline-style: none;
    flex-direction: column;
    transition-duration: .3s;
    transition-timing-function: cubic-bezier(.32, .72, 0, 1);
    display: flex;
    position: fixed;
  }

  .ds-drawer-panel-right {
    width: 100%;
    height: 100%;
    max-width: var(--container-sm);
    border-top-left-radius: var(--radius-xl);
    border-bottom-left-radius: var(--radius-xl);
    border-left-style: var(--tw-border-style);
    inset-block: 0;
    border-left-width: 1px;
    right: 0;
  }

  .ds-drawer-panel-right[data-open="false"] {
    --tw-translate-x: 100%;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .ds-drawer-panel-right[data-open="true"] {
    --tw-translate-x: 0;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .ds-drawer-panel-left {
    width: 100%;
    height: 100%;
    max-width: var(--container-sm);
    border-top-right-radius: var(--radius-xl);
    border-bottom-right-radius: var(--radius-xl);
    border-right-style: var(--tw-border-style);
    inset-block: 0;
    border-right-width: 1px;
    left: 0;
  }

  .ds-drawer-panel-left[data-open="false"] {
    --tw-translate-x: -100%;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .ds-drawer-panel-left[data-open="true"] {
    --tw-translate-x: 0;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .ds-drawer-panel-bottom {
    border-top-left-radius: var(--radius-xl);
    border-top-right-radius: var(--radius-xl);
    border-top-style: var(--tw-border-style);
    inset-inline: 0;
    border-top-width: 1px;
    width: 100%;
    bottom: 0;
  }

  .ds-drawer-panel-bottom[data-open="false"] {
    --tw-translate-y: 100%;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .ds-drawer-panel-bottom[data-open="true"] {
    --tw-translate-y: 0;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .ds-drawer-panel-top {
    border-bottom-right-radius: var(--radius-xl);
    border-bottom-left-radius: var(--radius-xl);
    border-bottom-style: var(--tw-border-style);
    inset-inline: 0;
    border-bottom-width: 1px;
    width: 100%;
    top: 0;
  }

  .ds-drawer-panel-top[data-open="false"] {
    --tw-translate-y: -100%;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .ds-drawer-panel-top[data-open="true"] {
    --tw-translate-y: 0;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .ds-drawer-handle {
    background-color: var(--color-foreground-gray-primary);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    border-radius: 3.40282e38px;
    flex-shrink: 0;
  }

  @media (hover: hover) {
    .ds-drawer-handle:hover {
      background-color: var(--color-border-tertiary);
    }
  }

  .ds-drawer-handle-bottom {
    margin-inline: auto;
    margin-top: calc(var(--spacing) * 3);
    margin-bottom: var(--spacing);
    height: calc(var(--spacing) * 1.5);
    width: calc(var(--spacing) * 12);
  }

  .ds-drawer-handle-top {
    margin-inline: auto;
    margin-top: var(--spacing);
    margin-bottom: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 1.5);
    width: calc(var(--spacing) * 12);
    order: 9999;
  }

  .ds-drawer-handle-right {
    top: 50%;
    left: calc(var(--spacing) * 1.5);
    height: calc(var(--spacing) * 12);
    width: calc(var(--spacing) * 1.5);
    --tw-translate-y: -50%;
    translate: var(--tw-translate-x) var(--tw-translate-y);
    position: absolute;
  }

  .ds-drawer-handle-left {
    top: 50%;
    right: calc(var(--spacing) * 1.5);
    height: calc(var(--spacing) * 12);
    width: calc(var(--spacing) * 1.5);
    --tw-translate-y: -50%;
    translate: var(--tw-translate-x) var(--tw-translate-y);
    position: absolute;
  }

  .ds-drawer-header {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    border-color: var(--color-border-secondary);
    padding-inline: calc(var(--spacing) * 5);
    padding-block: calc(var(--spacing) * 4);
    flex-shrink: 0;
    justify-content: space-between;
    align-items: center;
    display: flex;
  }

  .ds-drawer-header-title {
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
    --tw-leading: var(--leading-snug);
    line-height: var(--leading-snug);
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-title);
  }

  .ds-drawer-close-btn {
    border-radius: var(--radius-md);
    padding: var(--spacing);
    color: var(--color-text-secondary-text);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-outline-style: none;
    outline-style: none;
  }

  @media (hover: hover) {
    .ds-drawer-close-btn:hover {
      background-color: var(--color-background-gray-secondary);
    }
  }

  .ds-drawer-close-btn:focus {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
  }

  .ds-drawer-body {
    padding-inline: calc(var(--spacing) * 5);
    padding-block: calc(var(--spacing) * 5);
    flex: 1;
    overflow-y: auto;
  }

  .ds-drawer-sub-header {
    gap: calc(var(--spacing) * 1.5);
    text-align: left;
    flex-direction: column;
    display: flex;
  }

  .ds-drawer-sub-body {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--color-text-secondary-text);
    flex: 1;
    overflow-y: auto;
  }

  .ds-drawer-sub-footer {
    gap: calc(var(--spacing) * 2);
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
    border-color: var(--color-border-secondary);
    padding-inline: calc(var(--spacing) * 5);
    padding-block: calc(var(--spacing) * 4);
    flex-direction: column-reverse;
    display: flex;
  }

  @media (min-width: 40rem) {
    .ds-drawer-sub-footer {
      flex-direction: row;
      justify-content: flex-end;
    }
  }

  .ds-drawer-sub-title {
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
    --tw-leading: 1;
    --tw-font-weight: var(--font-weight-semibold);
    line-height: 1;
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-title);
  }

  .ds-drawer-sub-description {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--color-text-secondary-text);
  }

  .ds-tabs-root {
    border-radius: var(--radius-xl);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-border-secondary);
    max-width: 100%;
  }

  .ds-tabs-root-horizontal {
    gap: calc(var(--spacing) * 8);
    padding: calc(var(--spacing) * 6);
    display: flex;
  }

  @media not all and (min-width: 40rem) {
    .ds-tabs-root-horizontal {
      flex-wrap: wrap;
    }
  }

  .ds-tabs-root-minimal-vertical {
    padding-inline: calc(var(--spacing) * 6);
    padding-top: calc(var(--spacing) * 3);
  }

  @media not all and (min-width: 40rem) {
    .ds-tabs-list-wrapper {
      width: 100%;
    }
  }

  .ds-tabs-list-wrapper-vertical {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    border-color: var(--color-border-secondary);
  }

  .ds-tabs-list-wrapper-vertical > div {
    width: 100%;
  }

  .ds-tabs-list-wrapper-vertical-default {
    padding: calc(var(--spacing) * 3);
  }

  .ds-tabs-list-wrapper-vertical-default > div {
    border-radius: var(--radius-lg);
    background-color: var(--color-background-gray-secondary);
    padding: var(--spacing);
  }

  .ds-tabs-list {
    display: flex;
    overflow: auto hidden;
  }

  .ds-tabs-list-horizontal {
    gap: calc(var(--spacing) * 2);
    flex-direction: column;
  }

  @media not all and (min-width: 40rem) {
    .ds-tabs-list-horizontal {
      align-items: center;
    }
  }

  @media (min-width: 40rem) {
    .ds-tabs-list-horizontal {
      min-width: calc(var(--spacing) * 50);
    }
  }

  .ds-tabs-list-vertical-default {
    gap: var(--spacing);
  }

  .ds-tabs-list-vertical-minimal {
    gap: calc(var(--spacing) * 2);
  }

  .ds-tabs-trigger {
    align-items: center;
    gap: calc(var(--spacing) * 2);
    padding-inline: calc(var(--spacing) * 3);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    white-space: nowrap;
    color: var(--color-text-secondary-text);
    display: flex;
  }

  .ds-tabs-trigger > svg {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
    color: currentColor !important;
  }

  .ds-tabs-trigger-horizontal {
    border-radius: var(--radius-lg);
    padding: calc(var(--spacing) * 3);
  }

  @media (hover: hover) {
    .ds-tabs-trigger-horizontal:hover {
      background-color: var(--primitive-skyblue-50);
      color: var(--color-text-neutral-brand);
    }
  }

  @media not all and (min-width: 40rem) {
    .ds-tabs-trigger-horizontal {
      justify-content: center;
      width: 100%;
    }
  }

  .ds-tabs-trigger-vertical-default {
    border-radius: var(--radius-md);
    padding-block: calc(var(--spacing) * 2);
  }

  .ds-tabs-trigger-vertical-default[data-active="true"] {
    background-color: var(--primitive-white-a100);
    color: var(--color-text-title);
    --tw-shadow: 0px 1px 2px 0px var(--tw-shadow-color, #1018280d);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
  }

  .ds-tabs-trigger-vertical-minimal {
    padding-block: calc(var(--spacing) * 3.5);
  }

  .ds-tabs-trigger-vertical-minimal[data-active="true"] {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 2px;
    border-color: var(--primitive-skyblue-500);
    color: var(--color-text-neutral-brand);
  }

  .ds-tabs-trigger-horizontal-default[data-active="true"] {
    background-color: var(--primitive-skyblue-50);
    color: var(--color-text-neutral-brand);
  }

  .ds-tabs-trigger-horizontal-minimal[data-active="true"] {
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--primitive-skyblue-500);
    color: var(--color-text-neutral-brand);
  }

  .ds-tabs-trigger-badge {
    height: calc(var(--spacing) * 5);
    min-width: calc(var(--spacing) * 5);
    background-color: var(--primitive-skyblue-500);
    padding-inline: var(--spacing);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-leading: 1;
    --tw-font-weight: var(--font-weight-semibold);
    line-height: 1;
    font-weight: var(--font-weight-semibold);
    color: var(--primitive-white);
    border-radius: 3.40282e38px;
    justify-content: center;
    align-items: center;
    display: inline-flex;
  }

  .ds-tabs-content {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-normal);
    font-weight: var(--font-weight-normal);
    color: var(--color-text-secondary-text);
  }

  .ds-tabs-content-vertical {
    padding-block: calc(var(--spacing) * 6);
  }

  .ds-tabs-content-vertical-default {
    padding-inline: calc(var(--spacing) * 6);
  }

  .ds-toast-container {
    z-index: 9999;
    gap: calc(var(--spacing) * 2);
    flex-direction: column;
    display: flex;
    position: fixed;
  }

  .ds-toast-container-top-right {
    top: calc(var(--spacing) * 4);
    right: calc(var(--spacing) * 4);
  }

  .ds-toast-container-top-left {
    top: calc(var(--spacing) * 4);
    left: calc(var(--spacing) * 4);
  }

  .ds-toast-container-bottom-right {
    right: calc(var(--spacing) * 4);
    bottom: calc(var(--spacing) * 4);
  }

  .ds-toast-container-bottom-left {
    bottom: calc(var(--spacing) * 4);
    left: calc(var(--spacing) * 4);
  }

  .ds-toast-container-top-center {
    top: calc(var(--spacing) * 4);
    --tw-translate-x: -50%;
    translate: var(--tw-translate-x) var(--tw-translate-y);
    left: 50%;
  }

  .ds-toast-container-bottom-center {
    bottom: calc(var(--spacing) * 4);
    --tw-translate-x: -50%;
    translate: var(--tw-translate-x) var(--tw-translate-y);
    left: 50%;
  }

  .ds-toast-card {
    max-width: var(--container-md);
    min-width: calc(var(--spacing) * 80);
    align-items: flex-start;
    gap: calc(var(--spacing) * 3);
    border-radius: var(--radius-lg);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-border-secondary);
    background-color: var(--color-background-white-secondary);
    padding: calc(var(--spacing) * 3);
    --tw-shadow: 0px 12px 16px -4px var(--tw-shadow-color, #10182814), 0px 4px 6px -2px var(--tw-shadow-color, #10182808);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: .3s;
    --tw-ease: var(--ease-out);
    transition-duration: .3s;
    transition-timing-function: var(--ease-out);
    display: flex;
  }

  .ds-toast-card-visible {
    --tw-translate-y: 0;
    translate: var(--tw-translate-x) var(--tw-translate-y);
    opacity: 1;
  }

  .ds-toast-card-hidden {
    --tw-translate-y: calc(var(--spacing) * 2);
    translate: var(--tw-translate-x) var(--tw-translate-y);
    opacity: 0;
  }

  .ds-toast-icon-tile {
    width: calc(var(--spacing) * 9);
    height: calc(var(--spacing) * 9);
    border-radius: var(--radius-md);
    flex-shrink: 0;
    place-items: center;
    display: grid;
  }

  .ds-toast-icon-tile > svg {
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
    color: currentColor;
  }

  .ds-toast-icon-tile-success {
    background-color: var(--primitive-green-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-toast-icon-tile-success {
      background-color: color-mix(in oklab,var(--primitive-green-500) 10%,transparent);
    }
  }

  .ds-toast-icon-tile-success {
    color: var(--primitive-green-500);
  }

  .ds-toast-icon-tile-error {
    background-color: var(--primitive-red-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-toast-icon-tile-error {
      background-color: color-mix(in oklab,var(--primitive-red-500) 10%,transparent);
    }
  }

  .ds-toast-icon-tile-error {
    color: var(--primitive-red-500);
  }

  .ds-toast-icon-tile-info {
    background-color: var(--primitive-bluelight-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-toast-icon-tile-info {
      background-color: color-mix(in oklab,var(--primitive-bluelight-500) 10%,transparent);
    }
  }

  .ds-toast-icon-tile-info {
    color: var(--primitive-bluelight-500);
  }

  .ds-toast-icon-tile-warning {
    background-color: var(--primitive-yellow-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-toast-icon-tile-warning {
      background-color: color-mix(in oklab,var(--primitive-yellow-500) 10%,transparent);
    }
  }

  .ds-toast-icon-tile-warning {
    color: var(--primitive-yellow-500);
  }

  .ds-toast-icon-tile-default {
    background-color: var(--primitive-skyblue-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-toast-icon-tile-default {
      background-color: color-mix(in oklab,var(--primitive-skyblue-500) 10%,transparent);
    }
  }

  .ds-toast-icon-tile-default {
    color: var(--primitive-skyblue-500);
  }

  .ds-toast-body {
    gap: calc(var(--spacing) * .5);
    padding-top: var(--spacing);
    flex-direction: column;
    flex: 1;
    display: flex;
  }

  .ds-toast-title {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-leading: var(--leading-tight);
    line-height: var(--leading-tight);
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-title);
  }

  .ds-toast-message {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-leading: var(--leading-snug);
    line-height: var(--leading-snug);
    color: var(--color-text-secondary-text);
  }

  .ds-toast-dismiss {
    margin-top: calc(var(--spacing) * .5);
    border-radius: var(--radius-md);
    padding: var(--spacing);
    color: var(--color-text-secondary-text);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-outline-style: none;
    outline-style: none;
    flex-shrink: 0;
  }

  @media (hover: hover) {
    .ds-toast-dismiss:hover {
      background-color: var(--color-background-gray-secondary);
    }
  }

  .ds-toast-dismiss:focus {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
  }

  .ds-dropdown-root {
    display: inline-block;
    position: relative;
  }

  .ds-dropdown-trigger {
    border-radius: var(--radius-md);
    --tw-outline-style: none;
    outline-style: none;
  }

  .ds-dropdown-trigger:focus-visible {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    --tw-ring-color: var(--primitive-skyblue-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-dropdown-trigger:focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--primitive-skyblue-500) 30%, transparent);
    }
  }

  .ds-dropdown-content {
    z-index: 50;
    min-width: calc(var(--spacing) * 40);
    transform-origin: var(--transform-origin);
    border-radius: var(--radius-xl);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-border-secondary);
    background-color: var(--color-background-white-secondary);
    --tw-shadow: 0px 12px 16px -4px var(--tw-shadow-color, #10182814), 0px 4px 6px -2px var(--tw-shadow-color, #10182808);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: .15s;
    --tw-ease: var(--ease-out);
    transition-duration: .15s;
    transition-timing-function: var(--ease-out);
    --tw-outline-style: none;
    outline-style: none;
    overflow: hidden;
  }

  .ds-dropdown-content[data-open="false"] {
    --tw-scale-x: 95%;
    --tw-scale-y: 95%;
    --tw-scale-z: 95%;
    scale: var(--tw-scale-x) var(--tw-scale-y);
    opacity: 0;
  }

  .ds-dropdown-content[data-open="true"] {
    --tw-scale-x: 100%;
    --tw-scale-y: 100%;
    --tw-scale-z: 100%;
    scale: var(--tw-scale-x) var(--tw-scale-y);
    opacity: 1;
  }

  .ds-dropdown-inner {
    padding: var(--spacing);
  }

  .ds-dropdown-item {
    cursor: pointer;
    align-items: center;
    gap: calc(var(--spacing) * 3);
    border-radius: var(--radius-lg);
    width: 100%;
    padding-inline: calc(var(--spacing) * 3);
    padding-block: calc(var(--spacing) * 2);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--color-text-body);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: .1s;
    --tw-outline-style: none;
    outline-style: none;
    transition-duration: .1s;
    display: flex;
  }

  @media (hover: hover) {
    .ds-dropdown-item:hover {
      background-color: var(--color-background-gray-secondary);
      color: var(--color-text-title);
    }
  }

  .ds-dropdown-item:focus-visible {
    background-color: var(--color-background-gray-secondary);
    color: var(--color-text-title);
  }

  .ds-dropdown-item:disabled {
    pointer-events: none;
    opacity: .5;
  }

  .ds-dropdown-item > svg {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
    color: currentColor;
    flex-shrink: 0;
  }

  .ds-dropdown-separator {
    margin-block: var(--spacing);
    background-color: var(--color-border-secondary);
    height: 1px;
  }

  .ds-dropdown-label {
    padding-inline: calc(var(--spacing) * 3);
    padding-block: calc(var(--spacing) * 2);
    --tw-font-weight: var(--font-weight-bold);
    font-size: 11px;
    font-weight: var(--font-weight-bold);
    --tw-tracking: var(--tracking-wider);
    letter-spacing: var(--tracking-wider);
    color: var(--color-text-secondary-text);
    text-transform: uppercase;
  }

  .ds-modal-backdrop-wrapper {
    z-index: 50;
    position: fixed;
    inset: 0;
  }

  .ds-modal-backdrop {
    background-color: #0000004d;
    position: fixed;
    inset: 0;
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-modal-backdrop {
      background-color: color-mix(in oklab,var(--color-black) 30%,transparent);
    }
  }

  .ds-modal-backdrop {
    transition-property: opacity;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: .2s;
    transition-duration: .2s;
  }

  .ds-modal-content {
    z-index: 50;
    --tw-translate-x: -50%;
    --tw-translate-y: -50%;
    width: 100%;
    max-height: 85vh;
    translate: var(--tw-translate-x) var(--tw-translate-y);
    border-radius: var(--radius-xl);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-border-secondary);
    background-color: var(--color-background-white-secondary);
    --tw-shadow: 0px 12px 16px -4px var(--tw-shadow-color, #10182814), 0px 4px 6px -2px var(--tw-shadow-color, #10182808);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    transition-property: opacity, transform;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: .2s;
    --tw-ease: var(--ease-out);
    transition-duration: .2s;
    transition-timing-function: var(--ease-out);
    --tw-outline-style: none;
    outline-style: none;
    flex-direction: column;
    display: flex;
    position: fixed;
    top: 50%;
    left: 50%;
    overflow-y: auto;
  }

  .ds-modal-content[data-open="false"] {
    --tw-scale-x: 95%;
    --tw-scale-y: 95%;
    --tw-scale-z: 95%;
    scale: var(--tw-scale-x) var(--tw-scale-y);
    opacity: 0;
  }

  .ds-modal-content[data-open="true"] {
    --tw-scale-x: 100%;
    --tw-scale-y: 100%;
    --tw-scale-z: 100%;
    scale: var(--tw-scale-x) var(--tw-scale-y);
    opacity: 1;
  }

  @media not all and (min-width: 40rem) {
    .ds-modal-content {
      max-width: 90vw;
    }
  }

  .ds-modal-content-sm {
    max-width: var(--container-sm);
  }

  .ds-modal-content-md {
    max-width: var(--container-lg);
  }

  .ds-modal-content-lg {
    max-width: var(--container-2xl);
  }

  .ds-modal-header {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    border-color: var(--color-border-secondary);
    padding-inline: calc(var(--spacing) * 6);
    padding-block: calc(var(--spacing) * 4);
    justify-content: space-between;
    align-items: center;
    display: flex;
  }

  .ds-modal-header-title {
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
    --tw-leading: var(--leading-snug);
    line-height: var(--leading-snug);
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-title);
  }

  .ds-modal-close-btn {
    border-radius: var(--radius-md);
    padding: var(--spacing);
    color: var(--color-text-secondary-text);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-outline-style: none;
    outline-style: none;
  }

  @media (hover: hover) {
    .ds-modal-close-btn:hover {
      background-color: var(--color-background-gray-secondary);
    }
  }

  .ds-modal-close-btn:focus {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
  }

  .ds-modal-body {
    padding-inline: calc(var(--spacing) * 6);
    padding-block: calc(var(--spacing) * 5);
    flex: 1;
  }

  .ds-modal-sub-header {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    border-color: var(--color-border-secondary);
    padding-inline: calc(var(--spacing) * 6);
    padding-block: calc(var(--spacing) * 4);
  }

  .ds-modal-sub-footer {
    justify-content: flex-end;
    align-items: center;
    gap: calc(var(--spacing) * 3);
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
    border-color: var(--color-border-secondary);
    padding-inline: calc(var(--spacing) * 6);
    padding-block: calc(var(--spacing) * 4);
    display: flex;
  }

  .ds-pagination {
    width: 100%;
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--color-text-body);
  }

  .ds-pagination-list-default {
    justify-content: center;
    align-items: center;
    gap: calc(var(--spacing) * .5);
    width: 100%;
    margin-inline: auto;
    display: flex;
  }

  @media not all and (min-width: 40rem) {
    .ds-pagination-list-default {
      gap: calc(var(--spacing) * 5);
    }
  }

  .ds-pagination-list-compact {
    justify-content: center;
    align-items: center;
    width: 100%;
    max-width: fit-content;
    margin-inline: auto;
    display: flex;
  }

  @media not all and (min-width: 40rem) {
    .ds-pagination-list-compact {
      gap: calc(var(--spacing) * 5);
    }
  }

  @media (min-width: 40rem) {
    :where(.ds-pagination-list-compact > :not(:last-child)) {
      --tw-divide-x-reverse: 0;
      border-inline-style: var(--tw-border-style);
      border-inline-start-width: calc(1px * var(--tw-divide-x-reverse));
      border-inline-end-width: calc(1px * calc(1 - var(--tw-divide-x-reverse)));
      border-color: var(--border-color-base-100);
    }
  }

  @media not all and (min-width: 40rem) {
    .ds-pagination-side-btn {
      width: calc(var(--spacing) * 10);
      height: calc(var(--spacing) * 10);
    }
  }

  @media (min-width: 40rem) {
    .ds-pagination-side-btn {
      height: calc(var(--spacing) * 10);
    }
  }

  .ds-pagination-side-btn-full {
    padding-block: calc(var(--spacing) * 2);
    padding-right: calc(var(--spacing) * 4);
    padding-left: calc(var(--spacing) * 3.5);
  }

  .ds-pagination-side-btn-label {
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 2);
  }

  .ds-pagination-side-btn-icon {
    padding: calc(var(--spacing) * 2);
  }

  .ds-pagination-side-btn-compact {
    border-color: var(--color-border-secondary);
  }

  .ds-pagination-page-btn {
    width: calc(var(--spacing) * 10);
    height: calc(var(--spacing) * 10);
    border-radius: var(--radius-lg);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-outline-style: none;
    outline-style: none;
    flex-shrink: 0;
  }

  @media (hover: hover) {
    .ds-pagination-page-btn:hover {
      background-color: var(--color-background-gray-secondary);
    }
  }

  .ds-pagination-page-btn:focus-visible {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    --tw-ring-color: var(--primitive-skyblue-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-pagination-page-btn:focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--primitive-skyblue-500) 30%, transparent);
    }
  }

  .ds-pagination-page-btn[aria-current="page"] {
    background-color: var(--color-background-gray-secondary);
  }

  .ds-pagination-page-btn-compact {
    border-block-style: var(--tw-border-style);
    border-block-width: 1px;
    border-color: var(--color-border-secondary);
    background-color: var(--color-background-white-primary);
    border-radius: 0;
  }

  .ds-pagination-ellipsis {
    width: calc(var(--spacing) * 10);
    height: calc(var(--spacing) * 10);
    flex-shrink: 0;
    justify-content: center;
    align-items: center;
    display: inline-flex;
  }

  .ds-pagination-ellipsis-compact {
    border-block-style: var(--tw-border-style);
    border-block-width: 1px;
    border-color: var(--color-border-secondary);
    background-color: var(--color-background-white-primary);
  }

  .ds-table-scroll {
    overflow-x: auto;
  }

  .ds-table-root {
    border-collapse: separate;
    --tw-border-spacing-x: 0;
    --tw-border-spacing-y: 0;
    min-width: 100%;
    border-spacing: var(--tw-border-spacing-x) var(--tw-border-spacing-y);
    border-color: var(--color-border-secondary);
    text-align: left;
    overflow: clip;
  }

  .ds-table-root-default {
    border-radius: var(--radius-2xl);
    border-style: var(--tw-border-style);
    border-width: 1px;
  }

  .ds-table-root-full-bleed {
    border-block-style: var(--tw-border-style);
    border-block-width: 1px;
  }

  .ds-table-header {
    color: var(--color-text-secondary-text);
  }

  .ds-table-header th {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    border-color: var(--color-border-primary);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
  }

  .ds-table-header tr {
    background-color: var(--color-background-gray-primary);
  }

  .ds-table-head {
    padding-inline: calc(var(--spacing) * 6);
    padding-block: calc(var(--spacing) * 3);
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    white-space: nowrap;
  }

  .ds-table-row {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }

  @media (hover: hover) {
    .ds-table-row:hover {
      background-color: var(--color-background-gray-primary);
    }
  }

  .ds-table-row > td {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    border-color: var(--color-border-primary);
  }

  .ds-table-row:last-child > td {
    border-style: var(--tw-border-style);
    border-width: 0;
  }

  .ds-table-cell {
    padding-inline: calc(var(--spacing) * 6);
    padding-block: calc(var(--spacing) * 4);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--color-text-body);
  }

  .ds-table-empty {
    padding-inline: calc(var(--spacing) * 6);
    padding-block: calc(var(--spacing) * 10);
    text-align: center;
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--color-text-secondary-text);
  }

  .ds-table-avatar-cell {
    align-items: center;
    gap: calc(var(--spacing) * 3);
    display: flex;
  }

  .ds-table-avatar-cell-info {
    min-width: 0;
  }

  .ds-table-avatar-cell-name {
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--color-text-title);
    overflow: hidden;
  }

  .ds-table-avatar-cell-meta {
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--color-text-secondary-text);
    overflow: hidden;
  }

  .ds-table-sortable-header {
    align-items: center;
    gap: var(--spacing);
    padding: calc(var(--spacing) * .5);
    color: inherit;
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    border-radius: .25rem;
    display: inline-flex;
  }

  @media (hover: hover) {
    .ds-table-sortable-header:hover {
      color: var(--color-text-title);
    }
  }

  .ds-table-sortable-header:focus {
    --tw-outline-style: none;
    outline-style: none;
  }

  .ds-table-sortable-header:focus-visible {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    --tw-ring-color: var(--primitive-skyblue-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-table-sortable-header:focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--primitive-skyblue-500) 20%, transparent);
    }
  }

  .ds-table-sortable-header-active {
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-title);
  }

  .ds-table-sortable-icon {
    display: inline-flex;
  }

  .ds-timeline-root {
    flex-direction: column;
    display: flex;
    position: relative;
  }

  .ds-timeline-root-compact {
    gap: calc(var(--spacing) * 3);
  }

  .ds-timeline-root-comfortable {
    gap: calc(var(--spacing) * 4);
  }

  .ds-timeline-item {
    gap: calc(var(--spacing) * 3);
    display: flex;
    position: relative;
  }

  .ds-timeline-dot-rail {
    flex-direction: column;
    align-self: stretch;
    align-items: center;
    display: flex;
    position: relative;
  }

  .ds-timeline-dot {
    z-index: 10;
    margin-top: var(--spacing);
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
    border-style: var(--tw-border-style);
    border-width: 2px;
    border-radius: 3.40282e38px;
    flex-shrink: 0;
    place-items: center;
    display: grid;
    position: relative;
  }

  .ds-timeline-connector {
    margin-top: var(--spacing);
    background-color: var(--color-border-secondary-alt);
    flex: 1;
    width: 1px;
    display: none;
  }

  .ds-timeline-connector:is(:where(.group\/item)[data-connector] *) {
    display: block;
  }

  .ds-timeline-dot-neutral {
    border-color: var(--color-border-secondary);
    background-color: var(--color-background-white-secondary);
  }

  .ds-timeline-dot-primary {
    border-color: var(--primitive-skyblue-500);
    background-color: var(--primitive-skyblue-500);
  }

  .ds-timeline-dot-success {
    border-color: var(--primitive-green-500);
    background-color: var(--primitive-green-500);
  }

  .ds-timeline-dot-warning {
    border-color: var(--primitive-yellow-500);
    background-color: var(--primitive-yellow-500);
  }

  .ds-timeline-dot-danger {
    border-color: var(--primitive-red-500);
    background-color: var(--primitive-red-500);
  }

  .ds-timeline-dot-info {
    border-color: var(--primitive-skyblue-500);
    background-color: var(--primitive-skyblue-100);
  }

  .ds-timeline-content {
    padding-bottom: var(--spacing);
    flex: 1;
  }

  .ds-timeline-title-row {
    justify-content: space-between;
    align-items: flex-start;
    gap: calc(var(--spacing) * 3);
    display: flex;
  }

  .ds-timeline-title {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-title);
  }

  .ds-timeline-timestamp {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    color: var(--color-text-tertiary-text);
    flex-shrink: 0;
  }

  .ds-timeline-description {
    margin-top: calc(var(--spacing) * .5);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-leading: var(--leading-relaxed);
    line-height: var(--leading-relaxed);
    color: var(--color-text-secondary-text);
  }

  .ds-file-upload-root {
    gap: calc(var(--spacing) * 3);
    flex-direction: column;
    display: flex;
  }

  .ds-file-upload-list {
    gap: calc(var(--spacing) * 2);
    flex-direction: column;
    display: flex;
  }

  .ds-file-upload-dropzone {
    cursor: pointer;
    justify-content: center;
    align-items: center;
    gap: calc(var(--spacing) * 2);
    border-radius: var(--radius-xl);
    border-style: var(--tw-border-style);
    --tw-border-style: dashed;
    padding: calc(var(--spacing) * 8);
    text-align: center;
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    border-style: dashed;
    border-width: 2px;
    flex-direction: column;
    display: flex;
  }

  .ds-file-upload-dropzone:focus {
    --tw-outline-style: none;
    outline-style: none;
  }

  .ds-file-upload-dropzone:focus-visible {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    --tw-ring-color: var(--primitive-skyblue-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-file-upload-dropzone:focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--primitive-skyblue-500) 20%, transparent);
    }
  }

  .ds-file-upload-dropzone-idle {
    border-color: var(--color-border-secondary);
    background-color: var(--color-background-white-primary);
  }

  @media (hover: hover) {
    .ds-file-upload-dropzone-idle:hover {
      border-color: var(--primitive-skyblue-300);
    }
  }

  .ds-file-upload-dropzone-drag {
    border-color: var(--primitive-skyblue-500);
    background-color: var(--primitive-skyblue-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-file-upload-dropzone-drag {
      background-color: color-mix(in oklab,var(--primitive-skyblue-500) 5%,transparent);
    }
  }

  .ds-file-upload-dropzone-icon-tile {
    width: calc(var(--spacing) * 10);
    height: calc(var(--spacing) * 10);
    border-radius: var(--radius-lg);
    background-color: var(--primitive-skyblue-500);
    place-items: center;
    display: grid;
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-file-upload-dropzone-icon-tile {
      background-color: color-mix(in oklab,var(--primitive-skyblue-500) 10%,transparent);
    }
  }

  .ds-file-upload-dropzone-icon-tile {
    color: var(--primitive-skyblue-500);
  }

  .ds-file-upload-dropzone-icon-tile svg {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
  }

  .ds-file-upload-dropzone-label {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-title);
  }

  .ds-file-upload-dropzone-hint {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    color: var(--color-text-secondary-text);
  }

  .ds-file-upload-item {
    align-items: flex-start;
    gap: calc(var(--spacing) * 3);
    border-radius: var(--radius-lg);
    border-style: var(--tw-border-style);
    padding: calc(var(--spacing) * 3);
    border-width: 1px;
    display: flex;
  }

  .ds-file-upload-item-normal {
    border-color: var(--color-border-secondary);
    background-color: var(--color-background-white-primary);
  }

  .ds-file-upload-item-error {
    border-color: var(--primitive-red-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-file-upload-item-error {
      border-color: color-mix(in oklab,var(--primitive-red-500) 40%,transparent);
    }
  }

  .ds-file-upload-item-error {
    background-color: var(--primitive-red-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-file-upload-item-error {
      background-color: color-mix(in oklab,var(--primitive-red-500) 5%,transparent);
    }
  }

  .ds-file-upload-item-icon {
    margin-top: calc(var(--spacing) * .5);
    width: calc(var(--spacing) * 8);
    height: calc(var(--spacing) * 8);
    border-radius: var(--radius-md);
    background-color: var(--primitive-skyblue-500);
    flex-shrink: 0;
    place-items: center;
    display: grid;
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-file-upload-item-icon {
      background-color: color-mix(in oklab,var(--primitive-skyblue-500) 10%,transparent);
    }
  }

  .ds-file-upload-item-body {
    flex: 1;
    min-width: 0;
  }

  .ds-file-upload-item-header {
    justify-content: space-between;
    align-items: center;
    gap: calc(var(--spacing) * 3);
    display: flex;
  }

  .ds-file-upload-item-name {
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--color-text-title);
    overflow: hidden;
  }

  .ds-file-upload-item-remove {
    padding: calc(var(--spacing) * .5);
    color: var(--color-text-tertiary-text);
    border-radius: .25rem;
    flex-shrink: 0;
  }

  @media (hover: hover) {
    .ds-file-upload-item-remove:hover {
      background-color: var(--color-border-secondary);
      color: var(--color-text-title);
    }
  }

  .ds-file-upload-item-progress {
    margin-top: calc(var(--spacing) * 1.5);
    align-items: center;
    gap: calc(var(--spacing) * 2);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    color: var(--color-text-secondary-text);
    display: flex;
  }

  .ds-file-upload-item-progress-track {
    height: var(--spacing);
    background-color: var(--color-border-secondary);
    border-radius: 3.40282e38px;
    flex: 1;
    overflow: hidden;
  }

  .ds-file-upload-item-progress-bar {
    background-color: var(--primitive-skyblue-500);
    height: 100%;
  }

  .ds-file-upload-item-error-msg {
    margin-top: var(--spacing);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    color: var(--primitive-red-500);
  }

  .ds-file-upload-item-size {
    margin-top: calc(var(--spacing) * .5);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    color: var(--color-text-secondary-text);
  }

  .ds-product-brand {
    align-items: center;
    gap: calc(var(--spacing) * 3);
    padding-inline: calc(var(--spacing) * 5);
    padding-block: calc(var(--spacing) * 4);
    display: flex;
  }

  .ds-product-brand-text {
    gap: calc(var(--spacing) * .5);
    --tw-leading: var(--leading-tight);
    line-height: var(--leading-tight);
    flex-direction: column;
    display: flex;
  }

  .ds-product-brand-parent {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--primitive-skyblue-500);
  }

  .ds-product-brand-product {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    color: var(--color-text-tertiary-text);
  }

  .ds-nav-section {
    gap: var(--spacing);
    flex-direction: column;
    display: flex;
  }

  .ds-nav-section-label {
    padding-inline: calc(var(--spacing) * 2);
    padding-bottom: calc(var(--spacing) * 1.5);
    --tw-font-weight: var(--font-weight-semibold);
    font-size: 11px;
    font-weight: var(--font-weight-semibold);
    --tw-tracking: var(--tracking-widest);
    letter-spacing: var(--tracking-widest);
    color: var(--color-text-tertiary-text);
    text-transform: uppercase;
  }

  .ds-nav-section-list {
    gap: calc(var(--spacing) * .5);
    flex-direction: column;
    padding: 0;
    list-style-type: none;
    display: flex;
  }

  .ds-status-footer {
    align-items: flex-start;
    gap: calc(var(--spacing) * 3);
    border-radius: var(--radius-xl);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-border-secondary);
    background-color: var(--color-background-white-secondary);
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 3);
    display: flex;
  }

  .ds-status-footer-dot-wrapper {
    margin-top: var(--spacing);
    width: calc(var(--spacing) * 2);
    height: calc(var(--spacing) * 2);
    flex-shrink: 0;
    display: flex;
    position: relative;
  }

  .ds-status-footer-dot-ping {
    width: 100%;
    height: 100%;
    animation: var(--animate-ping);
    opacity: .6;
    border-radius: 3.40282e38px;
    display: inline-flex;
    position: absolute;
  }

  .ds-status-footer-dot-solid {
    width: calc(var(--spacing) * 2);
    height: calc(var(--spacing) * 2);
    border-radius: 3.40282e38px;
    display: inline-flex;
    position: relative;
  }

  .ds-status-footer-dot-ok {
    background-color: var(--primitive-green-500);
  }

  .ds-status-footer-dot-warn {
    background-color: var(--primitive-yellow-500);
  }

  .ds-status-footer-dot-down {
    background-color: var(--primitive-red-500);
  }

  .ds-status-footer-dot-idle {
    background-color: var(--color-border-tertiary);
  }

  .ds-status-footer-body {
    gap: calc(var(--spacing) * .5);
    --tw-leading: var(--leading-tight);
    min-width: 0;
    line-height: var(--leading-tight);
    flex-direction: column;
    display: flex;
  }

  .ds-status-footer-label {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--color-text-title);
  }

  .ds-status-footer-detail {
    text-overflow: ellipsis;
    white-space: nowrap;
    font-family: var(--font-mono);
    color: var(--color-text-tertiary-text);
    font-size: 10px;
    overflow: hidden;
  }

  .ds-kpi-grid {
    gap: calc(var(--spacing) * 4);
    grid-template-columns: repeat(1, minmax(0, 1fr));
    display: grid;
  }

  @media (min-width: 40rem) {
    .ds-kpi-grid-2, .ds-kpi-grid-3 {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }

  @media (min-width: 64rem) {
    .ds-kpi-grid-3 {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }

  @media (min-width: 40rem) {
    .ds-kpi-grid-4 {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }

  @media (min-width: 64rem) {
    .ds-kpi-grid-4 {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }
  }

  .ds-page-header {
    margin-bottom: calc(var(--spacing) * 8);
    gap: calc(var(--spacing) * 2);
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    border-color: var(--color-border-secondary);
    padding-bottom: calc(var(--spacing) * 6);
    flex-direction: column;
    display: flex;
  }

  .ds-page-header-inner {
    justify-content: space-between;
    align-items: flex-start;
    gap: calc(var(--spacing) * 4);
    display: flex;
  }

  .ds-page-header-left {
    gap: var(--spacing);
    flex-direction: column;
    min-width: 0;
    display: flex;
  }

  .ds-page-header-breadcrumb {
    align-items: center;
    gap: calc(var(--spacing) * 1.5);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    color: var(--color-text-tertiary-text);
    flex-wrap: wrap;
    display: flex;
  }

  .ds-page-header-crumb {
    align-items: center;
    gap: calc(var(--spacing) * 1.5);
    display: flex;
  }

  .ds-page-header-title {
    font-size: var(--text-2xl);
    line-height: var(--tw-leading, var(--text-2xl--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    --tw-tracking: var(--tracking-tight);
    letter-spacing: var(--tracking-tight);
    color: var(--color-text-title);
  }

  .ds-page-header-description {
    max-width: var(--container-2xl);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--color-text-secondary-text);
  }

  .ds-page-header-actions {
    align-items: center;
    gap: calc(var(--spacing) * 2);
    flex-shrink: 0;
    display: flex;
  }

  .ds-section-header {
    justify-content: space-between;
    align-items: flex-start;
    gap: calc(var(--spacing) * 4);
    display: flex;
  }

  .ds-section-header-left {
    gap: var(--spacing);
    flex-direction: column;
    display: flex;
  }

  .ds-section-header-eyebrow-row {
    align-items: center;
    gap: calc(var(--spacing) * 2);
    display: flex;
  }

  .ds-section-header-bullet {
    width: calc(var(--spacing) * 1.5);
    height: calc(var(--spacing) * 1.5);
    background-color: var(--primitive-skyblue-500);
    border-radius: 3.40282e38px;
  }

  .ds-section-header-eyebrow {
    --tw-font-weight: var(--font-weight-semibold);
    font-size: 11px;
    font-weight: var(--font-weight-semibold);
    --tw-tracking: var(--tracking-widest);
    letter-spacing: var(--tracking-widest);
    color: var(--primitive-skyblue-500);
    text-transform: uppercase;
  }

  .ds-section-header-title {
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    --tw-tracking: var(--tracking-tight);
    letter-spacing: var(--tracking-tight);
    color: var(--color-text-title);
  }

  .ds-section-header-description {
    max-width: var(--container-2xl);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--color-text-secondary-text);
  }

  .ds-section-header-actions {
    align-items: center;
    gap: calc(var(--spacing) * 2);
    flex-shrink: 0;
    display: flex;
  }

  .ds-stat-card {
    gap: calc(var(--spacing) * 1.5);
    border-radius: var(--radius-xl);
    border-style: var(--tw-border-style);
    padding: calc(var(--spacing) * 5);
    --tw-shadow: 0px 1px 3px 0px var(--tw-shadow-color, #1018281a);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    border-width: 1px;
    flex-direction: column;
    display: flex;
  }

  .ds-stat-card-primary {
    border-color: var(--primitive-skyblue-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-stat-card-primary {
      border-color: color-mix(in oklab,var(--primitive-skyblue-500) 25%,transparent);
    }
  }

  .ds-stat-card-primary {
    background-color: var(--primitive-skyblue-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-stat-card-primary {
      background-color: color-mix(in oklab,var(--primitive-skyblue-500) 4%,transparent);
    }
  }

  .ds-stat-card-success {
    border-color: var(--primitive-green-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-stat-card-success {
      border-color: color-mix(in oklab,var(--primitive-green-500) 25%,transparent);
    }
  }

  .ds-stat-card-success {
    background-color: var(--primitive-green-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-stat-card-success {
      background-color: color-mix(in oklab,var(--primitive-green-500) 4%,transparent);
    }
  }

  .ds-stat-card-warning {
    border-color: var(--primitive-yellow-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-stat-card-warning {
      border-color: color-mix(in oklab,var(--primitive-yellow-500) 25%,transparent);
    }
  }

  .ds-stat-card-warning {
    background-color: var(--primitive-yellow-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-stat-card-warning {
      background-color: color-mix(in oklab,var(--primitive-yellow-500) 4%,transparent);
    }
  }

  .ds-stat-card-error {
    border-color: var(--primitive-red-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-stat-card-error {
      border-color: color-mix(in oklab,var(--primitive-red-500) 25%,transparent);
    }
  }

  .ds-stat-card-error {
    background-color: var(--primitive-red-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-stat-card-error {
      background-color: color-mix(in oklab,var(--primitive-red-500) 4%,transparent);
    }
  }

  .ds-stat-card-neutral {
    border-color: var(--color-border-primary);
    background-color: var(--color-background-white-secondary);
  }

  .ds-stat-card-label {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--color-text-tertiary-text);
  }

  .ds-stat-card-icon {
    width: calc(var(--spacing) * 8);
    height: calc(var(--spacing) * 8);
    border-radius: var(--radius-lg);
    background-color: var(--color-background-gray-primary);
    color: var(--primitive-skyblue-500);
    flex-shrink: 0;
    place-items: center;
    display: grid;
  }

  .ds-stat-card-value-row {
    align-items: baseline;
    gap: calc(var(--spacing) * 2);
    display: flex;
  }

  .ds-stat-card-value {
    font-size: var(--text-3xl);
    line-height: var(--tw-leading, var(--text-3xl--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    --tw-tracking: var(--tracking-tight);
    letter-spacing: var(--tracking-tight);
    color: var(--color-text-title);
  }

  .ds-stat-card-delta-chip {
    align-items: center;
    gap: calc(var(--spacing) * .5);
    padding-inline: calc(var(--spacing) * 1.5);
    padding-block: calc(var(--spacing) * .5);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    border-radius: 3.40282e38px;
    display: inline-flex;
  }

  .ds-stat-card-delta-positive {
    background-color: var(--primitive-green-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-stat-card-delta-positive {
      background-color: color-mix(in oklab,var(--primitive-green-500) 10%,transparent);
    }
  }

  .ds-stat-card-delta-positive {
    color: var(--primitive-green-500);
  }

  .ds-stat-card-delta-negative {
    background-color: var(--primitive-red-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-stat-card-delta-negative {
      background-color: color-mix(in oklab,var(--primitive-red-500) 10%,transparent);
    }
  }

  .ds-stat-card-delta-negative {
    color: var(--primitive-red-500);
  }

  .ds-stat-card-delta-neutral {
    background-color: var(--color-background-gray-primary);
    color: var(--color-text-secondary-text);
  }

  .ds-stat-card-delta-hint, .ds-stat-card-hint {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    color: var(--color-text-tertiary-text);
  }

  .ds-accordion-icon {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
    flex-shrink: 0;
  }

  .ds-dialog-header-inner {
    min-width: 0;
    padding-top: var(--spacing);
    flex: 1;
  }

  .ds-close-icon {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
  }

  .ds-pagination-prev {
    margin-right: auto;
  }

  .ds-pagination-next {
    margin-left: auto;
  }

  @media (min-width: 40rem) {
    .ds-pagination-mobile-label {
      display: none;
    }
  }

  @media not all and (min-width: 40rem) {
    .ds-pagination-page-item {
      display: none;
    }
  }

  .ds-pagination-arrow {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
    flex-shrink: 0;
  }

  .ds-pagination-side-btn-compact-prev {
    border-color: var(--color-border-secondary);
  }

  @media (min-width: 40rem) {
    .ds-pagination-side-btn-compact-prev {
      border-right-style: var(--tw-border-style);
      border-right-width: 0;
      border-top-right-radius: 0;
      border-bottom-right-radius: 0;
    }
  }

  .ds-pagination-side-btn-compact-next {
    border-color: var(--color-border-secondary);
  }

  @media (min-width: 40rem) {
    .ds-pagination-side-btn-compact-next {
      border-left-style: var(--tw-border-style);
      border-left-width: 0;
      border-top-left-radius: 0;
      border-bottom-left-radius: 0;
    }

    .ds-pagination-arrow-label-hidden {
      display: none;
    }
  }

  @media not all and (min-width: 40rem) {
    .ds-pagination-label {
      display: none;
    }
  }

  .ds-table-sort-icon {
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
  }

  .ds-file-status-icon-success {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
    color: var(--primitive-green-500);
  }

  .ds-file-status-icon-error {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
    color: var(--primitive-red-500);
  }

  .ds-file-status-icon-default {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
    color: var(--primitive-skyblue-500);
  }

  .ds-file-remove-icon {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }

  .ds-file-upload-footer {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    color: var(--color-text-secondary-text);
  }

  .ds-file-upload-hidden-input {
    display: none;
  }

  .ds-file-upload-progress-pct {
    --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, );
  }

  .ds-toast-close-icon {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }

  .ds-product-brand-logo {
    flex-shrink: 0;
  }

  .ds-stat-card-delta-icon {
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
  }

  .ds-sidebar {
    border-right-style: var(--tw-border-style);
    border-right-width: 1px;
    border-color: var(--color-border-primary);
    background-color: var(--color-background-white-primary);
    flex-direction: column;
    height: 100%;
    display: flex;
    position: relative;
    overflow: hidden;
  }

  .ds-sidebar-header {
    height: calc(var(--spacing) * 16);
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    border-color: var(--color-border-primary);
    flex-shrink: 0;
    display: flex;
  }

  .ds-sidebar-header-expanded {
    padding-inline: calc(var(--spacing) * 5);
    justify-content: space-between;
    align-items: center;
  }

  .ds-sidebar-header-collapsed {
    justify-content: center;
    align-items: center;
    gap: var(--spacing);
    flex-direction: column;
  }

  .ds-sidebar-toggle {
    border-radius: var(--radius-lg);
    color: var(--color-sidebar-navigation-nav-item-icon);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    flex-shrink: 0;
  }

  @media (hover: hover) {
    .ds-sidebar-toggle:hover {
      background-color: var(--color-sidebar-navigation-nav-item-nav-hover-background);
      color: var(--color-sidebar-navigation-nav-item-nav-hover-text);
    }
  }

  .ds-sidebar-nav {
    gap: calc(var(--spacing) * 7);
    padding-inline: calc(var(--spacing) * 5);
    padding-top: calc(var(--spacing) * 8);
    padding-bottom: calc(var(--spacing) * 5);
    flex-direction: column;
    flex: 1;
    display: flex;
    overflow-y: auto;
  }

  .ds-sidebar-section-label {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    --tw-tracking: var(--tracking-widest);
    letter-spacing: var(--tracking-widest);
    white-space: nowrap;
    color: var(--color-text-tertiary-text);
    text-transform: uppercase;
    overflow: hidden;
  }

  .ds-sidebar-items {
    gap: calc(var(--spacing) * .5);
    flex-direction: column;
    padding: 0;
    list-style-type: none;
    display: flex;
  }

  .ds-sidebar-item {
    align-items: center;
    gap: calc(var(--spacing) * 3);
    border-radius: var(--radius-lg);
    width: 100%;
    padding-inline: calc(var(--spacing) * 3);
    padding-block: calc(var(--spacing) * 2);
    text-align: left;
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--color-sidebar-navigation-nav-item-default-text);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    display: flex;
    position: relative;
  }

  @media (hover: hover) {
    .ds-sidebar-item:hover {
      background-color: var(--color-sidebar-navigation-nav-item-nav-hover-background);
      color: var(--color-sidebar-navigation-nav-item-nav-hover-text);
    }
  }

  .ds-sidebar-item-active {
    background-color: var(--color-sidebar-navigation-nav-item-nav-active-background);
    color: var(--color-sidebar-navigation-nav-item-nav-active-text);
  }

  .ds-sidebar-item-icon {
    color: var(--color-sidebar-navigation-nav-item-icon);
    flex-shrink: 0;
  }

  .ds-sidebar-item-icon-active {
    color: var(--color-sidebar-navigation-nav-item-nav-active-text);
    flex-shrink: 0;
  }

  .ds-sidebar-footer {
    padding-inline: calc(var(--spacing) * 5);
    padding-bottom: calc(var(--spacing) * 5);
    flex-shrink: 0;
  }

  .ds-sidebar-promo {
    border-radius: var(--radius-2xl);
    background-color: var(--color-sidebar-navigation-footer-background);
    overflow: hidden;
  }

  .ds-sidebar-promo-inner {
    padding: calc(var(--spacing) * 4);
  }

  .ds-sidebar-promo-icon {
    margin-bottom: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 9);
    width: calc(var(--spacing) * 9);
    border-radius: var(--radius-lg);
    background-color: var(--primitive-skyblue-50);
    justify-content: center;
    align-items: center;
    display: flex;
  }

  .ds-sidebar-promo-title {
    margin-bottom: calc(var(--spacing) * .5);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--color-sidebar-navigation-footer-title);
  }

  .ds-sidebar-promo-subtitle {
    margin-bottom: calc(var(--spacing) * 3);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-leading: var(--leading-relaxed);
    line-height: var(--leading-relaxed);
    color: var(--color-sidebar-navigation-footer-sub-title);
  }

  .ds-filter-chips {
    gap: calc(var(--spacing) * 2);
    flex-wrap: wrap;
    display: flex;
  }

  .ds-filter-chip {
    align-items: center;
    gap: calc(var(--spacing) * 1.5);
    background-color: var(--primitive-skyblue-50);
    padding-inline: calc(var(--spacing) * 3);
    padding-block: var(--spacing);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--primitive-skyblue-600);
    border-radius: 3.40282e38px;
    display: inline-flex;
  }

  .ds-filter-chip-remove {
    color: var(--primitive-skyblue-400);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }

  @media (hover: hover) {
    .ds-filter-chip-remove:hover {
      color: var(--primitive-skyblue-600);
    }
  }

  .ds-filter-chips-header {
    justify-content: space-between;
    align-items: center;
    display: flex;
  }

  .ds-filter-clear {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--primitive-skyblue-500);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }

  @media (hover: hover) {
    .ds-filter-clear:hover {
      color: var(--primitive-skyblue-600);
    }
  }

  .ds-filter-section-label {
    margin-bottom: calc(var(--spacing) * 3);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    --tw-tracking: var(--tracking-wide);
    letter-spacing: var(--tracking-wide);
    color: var(--color-text-tertiary-text);
    text-transform: uppercase;
  }

  .ds-datatable {
    border-radius: var(--radius-2xl);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-border-primary);
    background-color: var(--color-background-white-secondary);
    flex-direction: column;
    gap: 0;
    display: flex;
    overflow: hidden;
  }

  .ds-datatable-toolbar {
    justify-content: space-between;
    align-items: center;
    gap: calc(var(--spacing) * 3);
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    border-color: var(--color-border-primary);
    padding-inline: calc(var(--spacing) * 6);
    padding-block: calc(var(--spacing) * 4);
    display: flex;
  }

  .ds-datatable-toolbar-left, .ds-datatable-toolbar-right {
    align-items: center;
    gap: calc(var(--spacing) * 2);
    display: flex;
  }

  .ds-datatable-footer {
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
    border-color: var(--color-border-primary);
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 3);
    justify-content: space-between;
    align-items: center;
    display: flex;
  }

  .ds-datatable-count {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--color-text-secondary-text);
  }

  .ds-datatable .ds-input {
    border-color: var(--color-border-primary);
  }

  .ds-datatable-toolbar-right {
    gap: calc(var(--spacing) * 3);
  }

  .ds-datatable-row-clickable {
    cursor: pointer;
    --tw-outline-style: none;
    outline-style: none;
  }

  .ds-datatable-row-clickable:focus-visible {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    --tw-ring-color: var(--primitive-skyblue-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .ds-datatable-row-clickable:focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--primitive-skyblue-500) 30%, transparent);
    }
  }

  .ds-datatable-row-clickable:focus-visible {
    --tw-ring-inset: inset;
  }

  .ds-tmpl-dashboard {
    background-color: var(--color-background-white-primary);
    height: 100vh;
    display: flex;
    overflow: hidden;
  }

  .ds-tmpl-dashboard-main {
    flex-direction: column;
    flex: 1;
    display: flex;
    overflow: hidden;
  }

  .ds-tmpl-dashboard-topbar {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    border-color: var(--color-border-secondary);
    background-color: var(--color-background-white-primary);
    flex-shrink: 0;
  }

  .ds-tmpl-dashboard-body {
    flex: 1;
    overflow-y: auto;
  }

  .ds-tmpl-auth {
    min-height: 100vh;
    display: flex;
  }

  .ds-tmpl-auth-form {
    width: 100%;
    padding-inline: calc(var(--spacing) * 6);
    padding-block: calc(var(--spacing) * 12);
    flex-direction: column;
    justify-content: center;
    align-items: center;
    display: flex;
  }

  @media (min-width: 48rem) {
    .ds-tmpl-auth-form {
      width: 50%;
    }
  }

  .ds-tmpl-auth-brand {
    background-color: var(--primitive-skyblue-600);
    justify-content: center;
    align-items: center;
    display: none;
  }

  @media (min-width: 48rem) {
    .ds-tmpl-auth-brand {
      width: 50%;
      display: flex;
    }
  }

  .ds-tmpl-blank {
    background-color: var(--color-background-white-primary);
    flex-direction: column;
    min-height: 100vh;
    display: flex;
  }

  .ds-tmpl-blank-sm {
    width: 100%;
    max-width: var(--container-sm);
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 8);
    margin-inline: auto;
  }

  .ds-tmpl-blank-md {
    width: 100%;
    max-width: var(--container-2xl);
    padding-inline: calc(var(--spacing) * 6);
    padding-block: calc(var(--spacing) * 8);
    margin-inline: auto;
  }

  .ds-tmpl-blank-lg {
    width: 100%;
    max-width: var(--container-5xl);
    padding-inline: calc(var(--spacing) * 8);
    padding-block: calc(var(--spacing) * 8);
    margin-inline: auto;
  }

  .ds-tmpl-blank-full {
    width: 100%;
    padding-inline: calc(var(--spacing) * 6);
    padding-block: calc(var(--spacing) * 8);
  }
}

@layer utilities {
  @media (min-width: 40rem) {
    .container {
      max-width: 40rem;
    }
  }

  @media (min-width: 48rem) {
    .container {
      max-width: 48rem;
    }
  }

  @media (min-width: 64rem) {
    .container {
      max-width: 64rem;
    }
  }

  @media (min-width: 80rem) {
    .container {
      max-width: 80rem;
    }
  }

  @media (min-width: 96rem) {
    .container {
      max-width: 96rem;
    }
  }

  .mr-1\.5 {
    margin-right: calc(var(--spacing) * 1.5);
  }

  .mr-2 {
    margin-right: calc(var(--spacing) * 2);
  }

  .h-3 {
    height: calc(var(--spacing) * 3);
  }

  .h-48 {
    height: calc(var(--spacing) * 48);
  }

  .w-44 {
    width: calc(var(--spacing) * 44);
  }

  .min-w-0 {
    min-width: 0;
  }

  .min-w-56 {
    min-width: calc(var(--spacing) * 56);
  }

  .items-baseline {
    align-items: baseline;
  }

  .gap-0\.5 {
    gap: calc(var(--spacing) * .5);
  }

  :where(.space-y-3 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));
  }

  :where(.space-y-6 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));
  }

  .border-0 {
    border-style: var(--tw-border-style);
    border-width: 0;
  }

  .bg-\[var\(--color-title-50\)\] {
    background-color: var(--color-title-50);
  }

  .py-16 {
    padding-block: calc(var(--spacing) * 16);
  }

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

  .last\:border-b-0:last-child {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 0;
  }

  @media (hover: hover) {
    .hover\:opacity-90:hover {
      opacity: .9;
    }
  }

  .collapse {
    visibility: collapse;
  }

  .visible {
    visibility: visible;
  }

  .absolute {
    position: absolute;
  }

  .fixed {
    position: fixed;
  }

  .relative {
    position: relative;
  }

  .static {
    position: static;
  }

  .container {
    width: 100%;
  }

  @media (min-width: 40rem) {
    .container {
      max-width: 40rem;
    }
  }

  @media (min-width: 48rem) {
    .container {
      max-width: 48rem;
    }
  }

  @media (min-width: 64rem) {
    .container {
      max-width: 64rem;
    }
  }

  @media (min-width: 80rem) {
    .container {
      max-width: 80rem;
    }
  }

  @media (min-width: 96rem) {
    .container {
      max-width: 96rem;
    }
  }

  .mt-1 {
    margin-top: var(--spacing);
  }

  .mt-2 {
    margin-top: calc(var(--spacing) * 2);
  }

  .mt-3 {
    margin-top: calc(var(--spacing) * 3);
  }

  .mt-4 {
    margin-top: calc(var(--spacing) * 4);
  }

  .mt-6 {
    margin-top: calc(var(--spacing) * 6);
  }

  .mb-0 {
    margin-bottom: 0;
  }

  .mb-1 {
    margin-bottom: var(--spacing);
  }

  .mb-1\.5 {
    margin-bottom: calc(var(--spacing) * 1.5);
  }

  .mb-2 {
    margin-bottom: calc(var(--spacing) * 2);
  }

  .mb-3 {
    margin-bottom: calc(var(--spacing) * 3);
  }

  .mb-4 {
    margin-bottom: calc(var(--spacing) * 4);
  }

  .mb-6 {
    margin-bottom: calc(var(--spacing) * 6);
  }

  .mb-12 {
    margin-bottom: calc(var(--spacing) * 12);
  }

  .ml-1 {
    margin-left: var(--spacing);
  }

  .ml-2 {
    margin-left: calc(var(--spacing) * 2);
  }

  .ml-auto {
    margin-left: auto;
  }

  .block {
    display: block;
  }

  .contents {
    display: contents;
  }

  .flex {
    display: flex;
  }

  .grid {
    display: grid;
  }

  .hidden {
    display: none;
  }

  .inline {
    display: inline;
  }

  .inline-block {
    display: inline-block;
  }

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

  .table {
    display: table;
  }

  .size-1\.5 {
    width: calc(var(--spacing) * 1.5);
    height: calc(var(--spacing) * 1.5);
  }

  .size-3 {
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
  }

  .size-4 {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }

  .size-5 {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
  }

  .size-6 {
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
  }

  .size-7 {
    width: calc(var(--spacing) * 7);
    height: calc(var(--spacing) * 7);
  }

  .size-8 {
    width: calc(var(--spacing) * 8);
    height: calc(var(--spacing) * 8);
  }

  .size-10 {
    width: calc(var(--spacing) * 10);
    height: calc(var(--spacing) * 10);
  }

  .size-11 {
    width: calc(var(--spacing) * 11);
    height: calc(var(--spacing) * 11);
  }

  .size-12 {
    width: calc(var(--spacing) * 12);
    height: calc(var(--spacing) * 12);
  }

  .size-16 {
    width: calc(var(--spacing) * 16);
    height: calc(var(--spacing) * 16);
  }

  .size-full {
    width: 100%;
    height: 100%;
  }

  .h-4 {
    height: calc(var(--spacing) * 4);
  }

  .h-5 {
    height: calc(var(--spacing) * 5);
  }

  .h-6 {
    height: calc(var(--spacing) * 6);
  }

  .h-7 {
    height: calc(var(--spacing) * 7);
  }

  .h-8 {
    height: calc(var(--spacing) * 8);
  }

  .h-10 {
    height: calc(var(--spacing) * 10);
  }

  .h-12 {
    height: calc(var(--spacing) * 12);
  }

  .h-14 {
    height: calc(var(--spacing) * 14);
  }

  .h-16 {
    height: calc(var(--spacing) * 16);
  }

  .h-24 {
    height: calc(var(--spacing) * 24);
  }

  .h-28 {
    height: calc(var(--spacing) * 28);
  }

  .h-32 {
    height: calc(var(--spacing) * 32);
  }

  .h-40 {
    height: calc(var(--spacing) * 40);
  }

  .h-64 {
    height: calc(var(--spacing) * 64);
  }

  .h-72 {
    height: calc(var(--spacing) * 72);
  }

  .h-\[26px\] {
    height: 26px;
  }

  .h-\[480px\] {
    height: 480px;
  }

  .h-full {
    height: 100%;
  }

  .h-screen {
    height: 100vh;
  }

  .max-h-72 {
    max-height: calc(var(--spacing) * 72);
  }

  .min-h-40 {
    min-height: calc(var(--spacing) * 40);
  }

  .min-h-64 {
    min-height: calc(var(--spacing) * 64);
  }

  .min-h-screen {
    min-height: 100vh;
  }

  .w-2\/3 {
    width: 66.6667%;
  }

  .w-3\/4 {
    width: 75%;
  }

  .w-4 {
    width: calc(var(--spacing) * 4);
  }

  .w-4\/6 {
    width: 66.6667%;
  }

  .w-5\/6 {
    width: 83.3333%;
  }

  .w-7 {
    width: calc(var(--spacing) * 7);
  }

  .w-8 {
    width: calc(var(--spacing) * 8);
  }

  .w-10 {
    width: calc(var(--spacing) * 10);
  }

  .w-16 {
    width: calc(var(--spacing) * 16);
  }

  .w-24 {
    width: calc(var(--spacing) * 24);
  }

  .w-32 {
    width: calc(var(--spacing) * 32);
  }

  .w-36 {
    width: calc(var(--spacing) * 36);
  }

  .w-40 {
    width: calc(var(--spacing) * 40);
  }

  .w-48 {
    width: calc(var(--spacing) * 48);
  }

  .w-52 {
    width: calc(var(--spacing) * 52);
  }

  .w-56 {
    width: calc(var(--spacing) * 56);
  }

  .w-64 {
    width: calc(var(--spacing) * 64);
  }

  .w-72 {
    width: calc(var(--spacing) * 72);
  }

  .w-80 {
    width: calc(var(--spacing) * 80);
  }

  .w-96 {
    width: calc(var(--spacing) * 96);
  }

  .w-\[480px\] {
    width: 480px;
  }

  .w-\[640px\] {
    width: 640px;
  }

  .w-auto {
    width: auto;
  }

  .w-full {
    width: 100%;
  }

  .max-w-2xl {
    max-width: var(--container-2xl);
  }

  .max-w-3xl {
    max-width: var(--container-3xl);
  }

  .max-w-4xl {
    max-width: var(--container-4xl);
  }

  .max-w-lg {
    max-width: var(--container-lg);
  }

  .max-w-none {
    max-width: none;
  }

  .max-w-sm {
    max-width: var(--container-sm);
  }

  .max-w-xl {
    max-width: var(--container-xl);
  }

  .max-w-xs {
    max-width: var(--container-xs);
  }

  .flex-1 {
    flex: 1;
  }

  .shrink-0 {
    flex-shrink: 0;
  }

  .grow {
    flex-grow: 1;
  }

  .transform {
    transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
  }

  .animate-pulse {
    animation: var(--animate-pulse);
  }

  .animate-spin {
    animation: var(--animate-spin);
  }

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

  .cursor-pointer {
    cursor: pointer;
  }

  .resize {
    resize: both;
  }

  .list-disc {
    list-style-type: disc;
  }

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

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

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

  .flex-col {
    flex-direction: column;
  }

  .flex-wrap {
    flex-wrap: wrap;
  }

  .place-items-center {
    place-items: center;
  }

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

  .items-end {
    align-items: flex-end;
  }

  .justify-between {
    justify-content: space-between;
  }

  .justify-center {
    justify-content: center;
  }

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

  .gap-1 {
    gap: var(--spacing);
  }

  .gap-1\.5 {
    gap: calc(var(--spacing) * 1.5);
  }

  .gap-2 {
    gap: calc(var(--spacing) * 2);
  }

  .gap-3 {
    gap: calc(var(--spacing) * 3);
  }

  .gap-4 {
    gap: calc(var(--spacing) * 4);
  }

  .gap-6 {
    gap: calc(var(--spacing) * 6);
  }

  .gap-8 {
    gap: calc(var(--spacing) * 8);
  }

  .gap-10 {
    gap: calc(var(--spacing) * 10);
  }

  .gap-12 {
    gap: calc(var(--spacing) * 12);
  }

  :where(.space-y-2 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));
  }

  :where(.space-y-4 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));
  }

  :where(.space-y-8 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 8) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 8) * calc(1 - var(--tw-space-y-reverse)));
  }

  :where(.divide-y > :not(:last-child)) {
    --tw-divide-y-reverse: 0;
    border-bottom-style: var(--tw-border-style);
    border-top-style: var(--tw-border-style);
    border-top-width: calc(1px * var(--tw-divide-y-reverse));
    border-bottom-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
  }

  :where(.divide-base-100 > :not(:last-child)) {
    border-color: var(--color-border-secondary);
  }

  .truncate {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
  }

  .overflow-auto {
    overflow: auto;
  }

  .overflow-hidden {
    overflow: hidden;
  }

  .rounded {
    border-radius: .25rem;
  }

  .rounded-2xl {
    border-radius: var(--radius-2xl);
  }

  .rounded-full {
    border-radius: 3.40282e38px;
  }

  .rounded-lg {
    border-radius: var(--radius-lg);
  }

  .rounded-md {
    border-radius: var(--radius-md);
  }

  .rounded-xl {
    border-radius: var(--radius-xl);
  }

  .border {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }

  .border-t {
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
  }

  .border-r {
    border-right-style: var(--tw-border-style);
    border-right-width: 1px;
  }

  .border-b {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
  }

  .border-dashed {
    --tw-border-style: dashed;
    border-style: dashed;
  }

  .border-base-100 {
    border-color: var(--color-border-secondary);
  }

  .border-base-200 {
    border-color: var(--color-border-secondary-alt);
  }

  .border-button-outline-border {
    border-color: var(--color-button-primary-outline-stroke);
  }

  .border-error-500 {
    border-color: var(--primitive-red-500);
  }

  .border-primary-500 {
    border-color: var(--primitive-skyblue-500);
  }

  .border-success-500 {
    border-color: var(--primitive-green-500);
  }

  .border-warning-500 {
    border-color: var(--primitive-yellow-500);
  }

  .bg-background-50 {
    background-color: var(--color-background-white-primary);
  }

  .bg-background-100 {
    background-color: var(--color-background-white-secondary);
  }

  .bg-base-50 {
    background-color: var(--color-border-primary);
  }

  .bg-base-100 {
    background-color: var(--color-border-secondary);
  }

  .bg-button-error-background {
    background-color: var(--color-button-error-primary-background);
  }

  .bg-button-primary-background {
    background-color: var(--primitive-skyblue-500);
  }

  .bg-error-500 {
    background-color: var(--primitive-red-500);
  }

  .bg-primary-50 {
    background-color: var(--primitive-skyblue-50);
  }

  .bg-primary-100 {
    background-color: var(--primitive-skyblue-100);
  }

  .bg-primary-500, .bg-primary-500\/20 {
    background-color: var(--primitive-skyblue-500);
  }

  @supports (color: color-mix(in lab,red,red)) {
    .bg-primary-500\/20 {
      background-color: color-mix(in oklab,var(--primitive-skyblue-500) 20%,transparent);
    }
  }

  .bg-success-500 {
    background-color: var(--primitive-green-500);
  }

  .bg-warning-500 {
    background-color: var(--primitive-yellow-500);
  }

  .bg-white {
    background-color: var(--color-white);
  }

  .bg-white\/20 {
    background-color: #fff3;
  }

  @supports (color: color-mix(in lab,red,red)) {
    .bg-white\/20 {
      background-color: color-mix(in oklab,var(--color-white) 20%,transparent);
    }
  }

  .bg-white\/60 {
    background-color: #fff9;
  }

  @supports (color: color-mix(in lab,red,red)) {
    .bg-white\/60 {
      background-color: color-mix(in oklab,var(--color-white) 60%,transparent);
    }
  }

  .object-contain {
    object-fit: contain;
  }

  .p-1 {
    padding: var(--spacing);
  }

  .p-1\.5 {
    padding: calc(var(--spacing) * 1.5);
  }

  .p-2 {
    padding: calc(var(--spacing) * 2);
  }

  .p-3 {
    padding: calc(var(--spacing) * 3);
  }

  .p-4 {
    padding: calc(var(--spacing) * 4);
  }

  .p-5 {
    padding: calc(var(--spacing) * 5);
  }

  .p-6 {
    padding: calc(var(--spacing) * 6);
  }

  .p-8 {
    padding: calc(var(--spacing) * 8);
  }

  .p-10 {
    padding: calc(var(--spacing) * 10);
  }

  .p-12 {
    padding: calc(var(--spacing) * 12);
  }

  .p-16 {
    padding: calc(var(--spacing) * 16);
  }

  .p-20 {
    padding: calc(var(--spacing) * 20);
  }

  .p-24 {
    padding: calc(var(--spacing) * 24);
  }

  .px-2 {
    padding-inline: calc(var(--spacing) * 2);
  }

  .px-3 {
    padding-inline: calc(var(--spacing) * 3);
  }

  .px-3\.5 {
    padding-inline: calc(var(--spacing) * 3.5);
  }

  .px-4 {
    padding-inline: calc(var(--spacing) * 4);
  }

  .px-5 {
    padding-inline: calc(var(--spacing) * 5);
  }

  .px-6 {
    padding-inline: calc(var(--spacing) * 6);
  }

  .py-0\.5 {
    padding-block: calc(var(--spacing) * .5);
  }

  .py-1 {
    padding-block: var(--spacing);
  }

  .py-1\.5 {
    padding-block: calc(var(--spacing) * 1.5);
  }

  .py-2 {
    padding-block: calc(var(--spacing) * 2);
  }

  .py-2\.5 {
    padding-block: calc(var(--spacing) * 2.5);
  }

  .py-3 {
    padding-block: calc(var(--spacing) * 3);
  }

  .py-8 {
    padding-block: calc(var(--spacing) * 8);
  }

  .py-10 {
    padding-block: calc(var(--spacing) * 10);
  }

  .pt-2 {
    padding-top: calc(var(--spacing) * 2);
  }

  .pb-2 {
    padding-bottom: calc(var(--spacing) * 2);
  }

  .pb-3 {
    padding-bottom: calc(var(--spacing) * 3);
  }

  .pl-5 {
    padding-left: calc(var(--spacing) * 5);
  }

  .text-center {
    text-align: center;
  }

  .text-right {
    text-align: right;
  }

  .font-mono {
    font-family: var(--font-mono);
  }

  .font-sans {
    font-family: var(--font-family-sans);
  }

  .text-2xl {
    font-size: var(--text-2xl);
    line-height: var(--tw-leading, var(--text-2xl--line-height));
  }

  .text-3xl {
    font-size: var(--text-3xl);
    line-height: var(--tw-leading, var(--text-3xl--line-height));
  }

  .text-base {
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
  }

  .text-lg {
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
  }

  .text-sm {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }

  .text-xl {
    font-size: var(--text-xl);
    line-height: var(--tw-leading, var(--text-xl--line-height));
  }

  .text-xs {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
  }

  .text-\[10px\] {
    font-size: 10px;
  }

  .font-bold {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }

  .font-extrabold {
    --tw-font-weight: var(--font-weight-extrabold);
    font-weight: var(--font-weight-extrabold);
  }

  .font-medium {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }

  .font-semibold {
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
  }

  .tracking-wide {
    --tw-tracking: var(--tracking-wide);
    letter-spacing: var(--tracking-wide);
  }

  .tracking-widest {
    --tw-tracking: var(--tracking-widest);
    letter-spacing: var(--tracking-widest);
  }

  .break-all {
    word-break: break-all;
  }

  .whitespace-nowrap {
    white-space: nowrap;
  }

  .text-current {
    color: currentColor;
  }

  .text-error-500 {
    color: var(--primitive-red-500);
  }

  .text-primary-500 {
    color: var(--primitive-skyblue-500);
  }

  .text-primary-700 {
    color: var(--primitive-skyblue-700);
  }

  .text-red-500 {
    color: var(--color-red-500);
  }

  .text-success-500 {
    color: var(--primitive-green-500);
  }

  .text-text-50 {
    color: var(--color-text-body);
  }

  .text-text-100 {
    color: var(--color-text-secondary-text);
  }

  .text-text-200 {
    color: var(--color-text-tertiary-text);
  }

  .text-title-50 {
    color: var(--color-text-title);
  }

  .text-warning-500 {
    color: var(--primitive-yellow-500);
  }

  .text-white {
    color: var(--color-white);
  }

  .text-white-100 {
    color: var(--primitive-white);
  }

  .text-white\/70 {
    color: #ffffffb3;
  }

  @supports (color: color-mix(in lab,red,red)) {
    .text-white\/70 {
      color: color-mix(in oklab,var(--color-white) 70%,transparent);
    }
  }

  .uppercase {
    text-transform: uppercase;
  }

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

  .underline-offset-2 {
    text-underline-offset: 2px;
  }

  .shadow-sm {
    --tw-shadow: 0px 1px 3px 0px var(--tw-shadow-color, #1018281a);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
  }

  .ring {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
  }

  .outline {
    outline-style: var(--tw-outline-style);
    outline-width: 1px;
  }

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

  .transition {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }

  .ease-in-out {
    --tw-ease: var(--ease-in-out);
    transition-timing-function: var(--ease-in-out);
  }

  .outline-none {
    --tw-outline-style: none;
    outline-style: none;
  }

  .select-none {
    -webkit-user-select: none;
    user-select: none;
  }

  @media (hover: hover) {
    .hover\:bg-background-100:hover {
      background-color: var(--color-background-white-secondary);
    }
  }

  .focus\:ring-3:focus {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
  }

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

  .disabled\:bg-button-disabled-background:disabled {
    background-color: var(--color-button-disabled-primary-background);
  }

  .disabled\:bg-button-outline-disabled-background:disabled {
    background-color: var(--color-button-primary-outline-disabled-bg);
  }

  .disabled\:text-button-disabled-text:disabled {
    color: var(--color-button-disabled-primary-text);
  }

  @media (min-width: 48rem) {
    .md\:grid-cols-4 {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }
  }

  .\[\&\>svg\]\:size-5 > svg {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
  }

  .\[\&\>svg\]\:size-6 > svg {
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
  }

  .\[\&\>svg\]\:text-current\! > svg {
    color: currentColor !important;
  }

  .animate-in {
    animation: .2s ease-out forwards enter;
  }

  .animate-out {
    animation: .15s ease-in forwards exit;
  }
}

:root {
  --primitive-white: #fff;
  --primitive-white-a00: #fff0;
  --primitive-white-a01: #ffffff03;
  --primitive-white-a03: #ffffff08;
  --primitive-white-a05: #ffffff0d;
  --primitive-white-a10: #ffffff1a;
  --primitive-white-a15: #ffffff26;
  --primitive-white-a20: #fff3;
  --primitive-white-a30: #ffffff4d;
  --primitive-white-a40: #fff6;
  --primitive-white-a50: #ffffff80;
  --primitive-white-a60: #fff9;
  --primitive-white-a70: #ffffffb3;
  --primitive-white-a80: #fffc;
  --primitive-white-a90: #ffffffe6;
  --primitive-white-a100: #fff;
  --primitive-black: #000;
  --primitive-transparent: #fff0;
  --primitive-skyblue-50: #e6f4fa;
  --primitive-skyblue-100: #b2deee;
  --primitive-skyblue-200: #8dcee6;
  --primitive-skyblue-300: #5ab7da;
  --primitive-skyblue-400: #39a9d3;
  --primitive-skyblue-500: #0894c8;
  --primitive-skyblue-600: #0787b6;
  --primitive-skyblue-700: #06698e;
  --primitive-skyblue-800: #04516e;
  --primitive-skyblue-900: #033e54;
  --primitive-skyblue-a00: #0894c800;
  --primitive-skyblue-a05: #0894c80d;
  --primitive-skyblue-a10: #0894c81a;
  --primitive-skyblue-a15: #0894c826;
  --primitive-skyblue-a20: #0894c833;
  --primitive-skyblue-a30: #0894c84d;
  --primitive-skyblue-a40: #0894c866;
  --primitive-skyblue-a50: #0894c880;
  --primitive-skyblue-a60: #0894c899;
  --primitive-skyblue-a70: #0894c8b3;
  --primitive-skyblue-a80: #0894c8cc;
  --primitive-skyblue-a90: #0894c8e6;
  --primitive-bluedark-50: #e8e9ed;
  --primitive-bluedark-100: #b7bbc7;
  --primitive-bluedark-200: #959aab;
  --primitive-bluedark-300: #646c85;
  --primitive-bluedark-400: #46506d;
  --primitive-bluedark-500: #182449;
  --primitive-bluedark-600: #162142;
  --primitive-bluedark-700: #111a34;
  --primitive-bluedark-800: #0d1428;
  --primitive-bluedark-900: #0a0f1f;
  --primitive-bluedark-a05: #646c850d;
  --primitive-bluedark-a10: #646c851a;
  --primitive-bluedark-a15: #646c8526;
  --primitive-bluedark-a20: #646c8533;
  --primitive-bluedark-a30: #646c854d;
  --primitive-bluedark-a40: #646c8566;
  --primitive-bluedark-a50: #646c8580;
  --primitive-bluedark-a60: #646c8599;
  --primitive-bluedark-a70: #646c85b3;
  --primitive-bluedark-a80: #646c85cc;
  --primitive-bluedark-a90: #64748be6;
  --primitive-brand-100: #dde9ff;
  --primitive-bluelight-50: #f0f9ff;
  --primitive-bluelight-100: #e0f2fe;
  --primitive-bluelight-500: #0ba5ec;
  --primitive-gray-50: #fafafa;
  --primitive-gray-100: #f4f4f5;
  --primitive-gray-200: #a1a1aa;
  --primitive-gray-300: #71717a;
  --primitive-gray-400: #52525b;
  --primitive-gray-500: #3f3f46;
  --primitive-gray-600: #27272a;
  --primitive-gray-700: #1e1e22;
  --primitive-gray-800: #18181b;
  --primitive-gray-900: #09090b;
  --primitive-gray-950: #030712;
  --primitive-gray-a05: #71717a0d;
  --primitive-gray-a10: #71717a1a;
  --primitive-gray-a15: #71717a26;
  --primitive-gray-a20: #71717a33;
  --primitive-gray-a30: #71717a4d;
  --primitive-gray-a40: #71717a66;
  --primitive-gray-a50: #71717a80;
  --primitive-gray-a60: #71717a99;
  --primitive-gray-a70: #71717ab3;
  --primitive-gray-a80: #71717acc;
  --primitive-gray-a90: #71717ae6;
  --primitive-zinc-50: #fafafa;
  --primitive-zinc-100: #f4f4f5;
  --primitive-zinc-200: #e4e4e7;
  --primitive-zinc-300: #d4d4d8;
  --primitive-zinc-400: #a1a1aa;
  --primitive-zinc-500: #71717a;
  --primitive-zinc-600: #52525b;
  --primitive-zinc-700: #3f3f46;
  --primitive-zinc-800: #27272a;
  --primitive-zinc-900: #18181b;
  --primitive-zinc-950: #09090b;
  --primitive-zinc-a05: #71717a0d;
  --primitive-zinc-a10: #71717a1a;
  --primitive-zinc-a15: #71717a26;
  --primitive-zinc-a20: #71717a33;
  --primitive-zinc-a30: #71717a4d;
  --primitive-zinc-a40: #71717a66;
  --primitive-zinc-a50: #71717a80;
  --primitive-zinc-a60: #71717a99;
  --primitive-zinc-a70: #71717ab3;
  --primitive-zinc-a80: #71717acc;
  --primitive-zinc-a90: #71717ae6;
  --primitive-neutral-50: #f8f9fa;
  --primitive-neutral-100: #f5f5f5;
  --primitive-neutral-200: #e5e5e5;
  --primitive-neutral-300: #d4d4d4;
  --primitive-neutral-400: #a3a3a3;
  --primitive-neutral-500: #737373;
  --primitive-neutral-600: #525252;
  --primitive-neutral-700: #404040;
  --primitive-neutral-800: #262626;
  --primitive-neutral-900: #171717;
  --primitive-neutral-950: #0a0a0a;
  --primitive-neutral-a05: #7373730d;
  --primitive-neutral-a10: #7373731a;
  --primitive-neutral-a15: #73737326;
  --primitive-neutral-a20: #73737333;
  --primitive-neutral-a30: #7373734d;
  --primitive-neutral-a40: #73737366;
  --primitive-neutral-a50: #73737380;
  --primitive-neutral-a60: #73737399;
  --primitive-neutral-a70: #737373b3;
  --primitive-neutral-a80: #737373cc;
  --primitive-neutral-a90: #737373e6;
  --primitive-stone-50: #fafaf9;
  --primitive-stone-100: #f5f5f4;
  --primitive-stone-200: #e7e5e4;
  --primitive-stone-300: #d6d3d1;
  --primitive-stone-400: #a8a29e;
  --primitive-stone-500: #78716c;
  --primitive-stone-600: #57534e;
  --primitive-stone-700: #44403c;
  --primitive-stone-800: #292524;
  --primitive-stone-900: #1c1917;
  --primitive-stone-950: #0c0a09;
  --primitive-stone-a05: #78716c0d;
  --primitive-stone-a10: #78716c1a;
  --primitive-stone-a15: #78716c26;
  --primitive-stone-a20: #78716c33;
  --primitive-stone-a30: #78716c4d;
  --primitive-stone-a40: #78716c66;
  --primitive-stone-a50: #78716c80;
  --primitive-stone-a60: #78716c99;
  --primitive-stone-a70: #78716cb3;
  --primitive-stone-a80: #78716ccc;
  --primitive-stone-a90: #78716ce6;
  --primitive-red-50: #ffebed;
  --primitive-red-100: #fec1c6;
  --primitive-red-200: #fda3ab;
  --primitive-red-300: #fc7984;
  --primitive-red-400: #fc5f6d;
  --primitive-red-500: #fb3748;
  --primitive-red-600: #e43242;
  --primitive-red-700: #b22733;
  --primitive-red-800: #8a1e28;
  --primitive-red-900: #69171e;
  --primitive-red-a05: #fb37480d;
  --primitive-red-a10: #fb37481a;
  --primitive-red-a15: #fb374826;
  --primitive-red-a20: #fb374833;
  --primitive-red-a30: #fb37484d;
  --primitive-red-a40: #fb374866;
  --primitive-red-a50: #fb374880;
  --primitive-red-a60: #fb374899;
  --primitive-red-a70: #fb3748b3;
  --primitive-red-a80: #fb3748cc;
  --primitive-red-a90: #ef4444e6;
  --primitive-orange-50: #fff3e0;
  --primitive-orange-100: #ffe0b2;
  --primitive-orange-200: #ffcc80;
  --primitive-orange-300: #ffb74d;
  --primitive-orange-400: #ffa726;
  --primitive-orange-500: #ff9800;
  --primitive-orange-600: #fb8c00;
  --primitive-orange-700: #f57c00;
  --primitive-orange-800: #e65100;
  --primitive-orange-900: #bf360c;
  --primitive-orange-a05: #ff98000d;
  --primitive-orange-a10: #ff98001a;
  --primitive-orange-a15: #ff980026;
  --primitive-orange-a20: #ff980033;
  --primitive-orange-a30: #ff98004d;
  --primitive-orange-a40: #ff980066;
  --primitive-orange-a50: #ff980080;
  --primitive-orange-a60: #ff980099;
  --primitive-orange-a70: #ff9800b3;
  --primitive-orange-a80: #ff9800cc;
  --primitive-orange-a90: #ff9800e6;
  --primitive-yellow-50: #fef8e9;
  --primitive-yellow-100: #fce8b9;
  --primitive-yellow-200: #fbdd98;
  --primitive-yellow-300: #f9cd68;
  --primitive-yellow-400: #f8c44b;
  --primitive-yellow-500: #f6b51e;
  --primitive-yellow-600: #e0a51b;
  --primitive-yellow-700: #af8115;
  --primitive-yellow-800: #876411;
  --primitive-yellow-900: #674c0d;
  --primitive-yellow-a05: #f6b51e0d;
  --primitive-yellow-a10: #f6b51e1a;
  --primitive-yellow-a15: #f6b51e26;
  --primitive-yellow-a20: #f6b51e33;
  --primitive-yellow-a30: #f6b51e4d;
  --primitive-yellow-a40: #f6b51e66;
  --primitive-yellow-a50: #f6b51e80;
  --primitive-yellow-a60: #f6b51e99;
  --primitive-yellow-a70: #f6b51eb3;
  --primitive-yellow-a80: #f6b51ecc;
  --primitive-yellow-a90: #f6b51ee6;
  --primitive-yellow-accent-50: #f7fee7;
  --primitive-yellow-accent-100: #f3f9be;
  --primitive-yellow-accent-200: #eaf490;
  --primitive-yellow-accent-300: #e2ec5e;
  --primitive-yellow-accent-400: #dce63e;
  --primitive-yellow-accent-500: #d6de23;
  --primitive-yellow-accent-600: #b8bf10;
  --primitive-yellow-accent-700: #8f940c;
  --primitive-yellow-accent-800: #636709;
  --primitive-yellow-accent-900: #3c3e05;
  --primitive-yellow-accent-a05: #d6de230d;
  --primitive-yellow-accent-a10: #d6de231a;
  --primitive-yellow-accent-a15: #d6de2326;
  --primitive-yellow-accent-a20: #d6de2333;
  --primitive-yellow-accent-a30: #d6de234d;
  --primitive-yellow-accent-a40: #d6de2366;
  --primitive-yellow-accent-a50: #d6de2380;
  --primitive-yellow-accent-a60: #d6de2399;
  --primitive-yellow-accent-a70: #d6de23b3;
  --primitive-yellow-accent-a80: #d6de23cc;
  --primitive-yellow-accent-a90: #d6de23e6;
  --primitive-brown-50: #fdf4ec;
  --primitive-brown-100: #fae3c8;
  --primitive-brown-200: #f5c99a;
  --primitive-brown-300: #edab6c;
  --primitive-brown-400: #e08c42;
  --primitive-brown-500: #c8701f;
  --primitive-brown-600: #a5581a;
  --primitive-brown-700: #7e4015;
  --primitive-brown-800: #7e4015;
  --primitive-brown-900: #5a2d0e;
  --primitive-brown-a05: #c8701f0d;
  --primitive-brown-a10: #c8701f1a;
  --primitive-brown-a15: #c8701f26;
  --primitive-brown-a20: #c8701f33;
  --primitive-brown-a30: #c8701f4d;
  --primitive-brown-a40: #c8701f66;
  --primitive-brown-a50: #c8701f80;
  --primitive-brown-a60: #c8701f99;
  --primitive-brown-a70: #c8701fb3;
  --primitive-brown-a80: #c8701fcc;
  --primitive-brown-a90: #eab308e6;
  --primitive-green-50: #f0fdf4;
  --primitive-green-100: #dcfce7;
  --primitive-green-200: #bbf7d0;
  --primitive-green-300: #86efac;
  --primitive-green-400: #4ade80;
  --primitive-green-500: #22c55e;
  --primitive-green-600: #16a34a;
  --primitive-green-700: #15803d;
  --primitive-green-800: #166534;
  --primitive-green-900: #14532d;
  --primitive-green-950: #052e16;
  --primitive-green-a05: #22c55e0d;
  --primitive-green-a10: #22c55e1a;
  --primitive-green-a15: #22c55e26;
  --primitive-green-a20: #22c55e33;
  --primitive-green-a30: #22c55e4d;
  --primitive-green-a40: #22c55e66;
  --primitive-green-a50: #22c55e80;
  --primitive-green-a60: #22c55e99;
  --primitive-green-a70: #22c55eb3;
  --primitive-green-a80: #22c55ecc;
  --primitive-green-a90: #22c55ee6;
  --primitive-emerald-50: #ecfdf5;
  --primitive-emerald-100: #d1fae5;
  --primitive-emerald-200: #a7f3d0;
  --primitive-emerald-300: #6ee7b7;
  --primitive-emerald-400: #34d399;
  --primitive-emerald-500: #10b981;
  --primitive-emerald-600: #059669;
  --primitive-emerald-700: #047857;
  --primitive-emerald-800: #065f46;
  --primitive-emerald-900: #064e3b;
  --primitive-emerald-950: #022c22;
  --primitive-emerald-a05: #10b9810d;
  --primitive-emerald-a10: #10b9811a;
  --primitive-emerald-a15: #10b98126;
  --primitive-emerald-a20: #10b98133;
  --primitive-emerald-a30: #10b9814d;
  --primitive-emerald-a40: #10b98166;
  --primitive-emerald-a50: #10b98180;
  --primitive-emerald-a60: #10b98199;
  --primitive-emerald-a70: #10b981b3;
  --primitive-emerald-a80: #10b981cc;
  --primitive-emerald-a90: #10b981e6;
  --primitive-teal-50: #f0fdfa;
  --primitive-teal-100: #ccfbf1;
  --primitive-teal-200: #99f6e4;
  --primitive-teal-300: #5eead4;
  --primitive-teal-400: #2dd4bf;
  --primitive-teal-500: #14b8a6;
  --primitive-teal-600: #0d9488;
  --primitive-teal-700: #0f766e;
  --primitive-teal-800: #115e59;
  --primitive-teal-900: #134e4a;
  --primitive-teal-950: #042f2e;
  --primitive-teal-a05: #14b8a60d;
  --primitive-teal-a10: #14b8a61a;
  --primitive-teal-a15: #14b8a626;
  --primitive-teal-a20: #14b8a633;
  --primitive-teal-a30: #14b8a64d;
  --primitive-teal-a40: #14b8a666;
  --primitive-teal-a50: #14b8a680;
  --primitive-teal-a60: #14b8a699;
  --primitive-teal-a70: #14b8a6b3;
  --primitive-teal-a80: #14b8a6cc;
  --primitive-teal-a90: #14b8a6e6;
  --primitive-cyan-50: #ecfeff;
  --primitive-cyan-100: #cffafe;
  --primitive-cyan-200: #a5f3fc;
  --primitive-cyan-300: #67e8f9;
  --primitive-cyan-400: #22d3ee;
  --primitive-cyan-500: #06b6d4;
  --primitive-cyan-600: #0891b2;
  --primitive-cyan-700: #0e7490;
  --primitive-cyan-800: #155e75;
  --primitive-cyan-900: #164e63;
  --primitive-cyan-950: #083344;
  --primitive-cyan-a05: #06b6d40d;
  --primitive-cyan-a10: #06b6d41a;
  --primitive-cyan-a15: #06b6d426;
  --primitive-cyan-a20: #06b6d433;
  --primitive-cyan-a30: #06b6d44d;
  --primitive-cyan-a40: #06b6d466;
  --primitive-cyan-a50: #06b6d480;
  --primitive-cyan-a60: #06b6d499;
  --primitive-cyan-a70: #06b6d4b3;
  --primitive-cyan-a80: #06b6d4cc;
  --primitive-cyan-a90: #06b6d4e6;
  --primitive-sky-50: #f0f9ff;
  --primitive-sky-100: #e0f2fe;
  --primitive-sky-200: #bae6fd;
  --primitive-sky-300: #7dd3fc;
  --primitive-sky-400: #38bdf8;
  --primitive-sky-500: #0ea5e9;
  --primitive-sky-600: #0284c7;
  --primitive-sky-700: #0369a1;
  --primitive-sky-800: #075985;
  --primitive-sky-900: #0c4a6e;
  --primitive-sky-950: #082f49;
  --primitive-sky-a05: #0ea5e90d;
  --primitive-sky-a10: #0ea5e91a;
  --primitive-sky-a15: #0ea5e926;
  --primitive-sky-a20: #0ea5e933;
  --primitive-sky-a30: #0ea5e94d;
  --primitive-sky-a40: #0ea5e966;
  --primitive-sky-a50: #0ea5e980;
  --primitive-sky-a60: #0ea5e999;
  --primitive-sky-a70: #0ea5e9b3;
  --primitive-sky-a80: #0ea5e9cc;
  --primitive-sky-a90: #0ea5e9e6;
  --primitive-blue-50: #eff6ff;
  --primitive-blue-100: #dbeafe;
  --primitive-blue-200: #bfdbfe;
  --primitive-blue-300: #93c5fd;
  --primitive-blue-400: #60a5fa;
  --primitive-blue-500: #3b82f6;
  --primitive-blue-600: #2563eb;
  --primitive-blue-700: #1d4ed8;
  --primitive-blue-800: #1e40af;
  --primitive-blue-900: #1e3a8a;
  --primitive-blue-950: #172554;
  --primitive-blue-a05: #3b82f60d;
  --primitive-blue-a10: #3b82f61a;
  --primitive-blue-a15: #3b82f626;
  --primitive-blue-a20: #3b82f633;
  --primitive-blue-a30: #3b82f64d;
  --primitive-blue-a40: #3b82f666;
  --primitive-blue-a50: #3b82f680;
  --primitive-blue-a60: #3b82f699;
  --primitive-blue-a70: #3b82f6b3;
  --primitive-blue-a80: #3b82f6cc;
  --primitive-blue-a90: #3b82f6e6;
  --primitive-indigo-50: #eef2ff;
  --primitive-indigo-100: #e0e7ff;
  --primitive-indigo-200: #c7d2fe;
  --primitive-indigo-300: #a5b4fc;
  --primitive-indigo-400: #818cf8;
  --primitive-indigo-500: #6366f1;
  --primitive-indigo-600: #4f46e5;
  --primitive-indigo-700: #4338ca;
  --primitive-indigo-800: #3730a3;
  --primitive-indigo-900: #312e81;
  --primitive-indigo-950: #1e1b4b;
  --primitive-indigo-a05: #6366f10d;
  --primitive-indigo-a10: #6366f11a;
  --primitive-indigo-a15: #6366f126;
  --primitive-indigo-a20: #6366f133;
  --primitive-indigo-a30: #6366f14d;
  --primitive-indigo-a40: #6366f166;
  --primitive-indigo-a50: #6366f180;
  --primitive-indigo-a60: #6366f199;
  --primitive-indigo-a70: #6366f1b3;
  --primitive-indigo-a80: #6366f1cc;
  --primitive-indigo-a90: #6366f1e6;
  --primitive-violet-50: #f5f3ff;
  --primitive-violet-100: #ede9fe;
  --primitive-violet-200: #ddd6fe;
  --primitive-violet-300: #c4b5fd;
  --primitive-violet-400: #a78bfa;
  --primitive-violet-500: #8b5cf6;
  --primitive-violet-600: #7c3aed;
  --primitive-violet-700: #6d28d9;
  --primitive-violet-800: #5b21b6;
  --primitive-violet-900: #4c1d95;
  --primitive-violet-950: #2e1065;
  --primitive-violet-a05: #8b5cf60d;
  --primitive-violet-a10: #8b5cf61a;
  --primitive-violet-a15: #8b5cf626;
  --primitive-violet-a20: #8b5cf633;
  --primitive-violet-a30: #8b5cf64d;
  --primitive-violet-a40: #8b5cf666;
  --primitive-violet-a50: #8b5cf680;
  --primitive-violet-a60: #8b5cf699;
  --primitive-violet-a70: #8b5cf6b3;
  --primitive-violet-a80: #8b5cf6cc;
  --primitive-violet-a90: #8b5cf6e6;
  --primitive-purple-50: #faf5ff;
  --primitive-purple-100: #f3e8ff;
  --primitive-purple-200: #e9d5ff;
  --primitive-purple-300: #d8b4fe;
  --primitive-purple-400: #c084fc;
  --primitive-purple-500: #a855f7;
  --primitive-purple-600: #9333ea;
  --primitive-purple-700: #7e22ce;
  --primitive-purple-800: #6b21a8;
  --primitive-purple-900: #581c87;
  --primitive-purple-950: #3b0764;
  --primitive-purple-a05: #a855f70d;
  --primitive-purple-a10: #a855f71a;
  --primitive-purple-a15: #a855f726;
  --primitive-purple-a20: #a855f733;
  --primitive-purple-a30: #a855f74d;
  --primitive-purple-a40: #a855f766;
  --primitive-purple-a50: #a855f780;
  --primitive-purple-a60: #a855f799;
  --primitive-purple-a70: #a855f7b3;
  --primitive-purple-a80: #a855f7cc;
  --primitive-purple-a90: #a855f7e6;
  --primitive-fuchsia-50: #fdf4ff;
  --primitive-fuchsia-100: #fae8ff;
  --primitive-fuchsia-200: #f5d0fe;
  --primitive-fuchsia-300: #f0abfc;
  --primitive-fuchsia-400: #e879f9;
  --primitive-fuchsia-500: #d946ef;
  --primitive-fuchsia-600: #c026d3;
  --primitive-fuchsia-700: #a21caf;
  --primitive-fuchsia-800: #86198f;
  --primitive-fuchsia-900: #701a75;
  --primitive-fuchsia-950: #4a044e;
  --primitive-fuchsia-a05: #d946ef0d;
  --primitive-fuchsia-a10: #d946ef1a;
  --primitive-fuchsia-a15: #d946ef26;
  --primitive-fuchsia-a20: #d946ef33;
  --primitive-fuchsia-a30: #d946ef4d;
  --primitive-fuchsia-a40: #d946ef66;
  --primitive-fuchsia-a50: #d946ef80;
  --primitive-fuchsia-a60: #d946ef99;
  --primitive-fuchsia-a70: #d946efb3;
  --primitive-fuchsia-a80: #d946efcc;
  --primitive-fuchsia-a90: #d946efe6;
  --primitive-pink-50: #fdf2f8;
  --primitive-pink-100: #fce7f3;
  --primitive-pink-200: #fbcfe8;
  --primitive-pink-300: #f9a8d4;
  --primitive-pink-400: #f472b6;
  --primitive-pink-500: #ec4899;
  --primitive-pink-600: #db2777;
  --primitive-pink-700: #be185d;
  --primitive-pink-800: #9d174d;
  --primitive-pink-900: #831843;
  --primitive-pink-950: #500724;
  --primitive-pink-a05: #ec48990d;
  --primitive-pink-a10: #ec48991a;
  --primitive-pink-a15: #ec489926;
  --primitive-pink-a20: #ec489933;
  --primitive-pink-a30: #ec48994d;
  --primitive-pink-a40: #ec489966;
  --primitive-pink-a50: #ec489980;
  --primitive-pink-a60: #ec489999;
  --primitive-pink-a70: #ec4899b3;
  --primitive-pink-a80: #ec4899cc;
  --primitive-pink-a90: #ec4899e6;
  --primitive-rose-50: #fff1f2;
  --primitive-rose-100: #ffe4e6;
  --primitive-rose-200: #fecdd3;
  --primitive-rose-300: #fda4af;
  --primitive-rose-400: #fb7185;
  --primitive-rose-500: #f43f5e;
  --primitive-rose-600: #e11d48;
  --primitive-rose-700: #be123c;
  --primitive-rose-800: #9f1239;
  --primitive-rose-900: #881337;
  --primitive-rose-950: #4c0519;
  --primitive-rose-a05: #f43f5e0d;
  --primitive-rose-a10: #f43f5e1a;
  --primitive-rose-a15: #f43f5e26;
  --primitive-rose-a20: #f43f5e33;
  --primitive-rose-a30: #f43f5e4d;
  --primitive-rose-a40: #f43f5e66;
  --primitive-rose-a50: #f43f5e80;
  --primitive-rose-a60: #f43f5e99;
  --primitive-rose-a70: #f43f5eb3;
  --primitive-rose-a80: #f43f5ecc;
  --primitive-rose-a90: #f43f5ee6;
  --primitive-dark-gray: #1a2231;
  --space-0: 0px;
  --space-0-5: 2px;
  --space-1: 4px;
  --space-1-5: 6px;
  --space-2: 8px;
  --space-2-5: 10px;
  --space-3: 12px;
  --space-3-5: 14px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 28px;
  --space-8: 32px;
  --space-9: 36px;
  --space-10: 40px;
  --space-11: 44px;
  --space-12: 48px;
  --space-14: 56px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;
  --space-28: 112px;
  --space-32: 128px;
  --space-36: 144px;
  --space-40: 160px;
  --space-44: 176px;
  --space-48: 192px;
  --space-52: 208px;
  --space-56: 224px;
  --space-60: 240px;
  --space-64: 256px;
  --space-72: 288px;
  --space-80: 320px;
  --space-96: 384px;
  --radius-none: 0px;
  --radius-sm: 2px;
  --radius-default: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --radius-xl: 12px;
  --radius-2xl: 16px;
  --radius-3xl: 24px;
  --radius-4xl: 32px;
  --radius-full: 9999px;
}

:root, [data-theme="light"] {
  --color-text-brand: var(--primitive-skyblue-500);
  --color-text-neutral-brand: var(--primitive-skyblue-500);
  --color-text-title: var(--primitive-gray-800);
  --color-text-body: var(--primitive-gray-700);
  --color-text-secondary-text: var(--primitive-gray-500);
  --color-text-tertiary-text: var(--primitive-gray-400);
  --color-border-primary: var(--primitive-gray-50);
  --color-border-secondary: var(--primitive-gray-100);
  --color-border-secondary-alt: var(--primitive-gray-200);
  --color-border-tertiary: var(--primitive-gray-300);
  --color-foreground-dark-primary: var(--primitive-gray-900);
  --color-foreground-dark-secondary: var(--primitive-gray-900);
  --color-foreground-gray-primary: var(--primitive-gray-900);
  --color-foreground-gray-secondary: var(--primitive-gray-900);
  --color-foreground-gray-secondary-alt: var(--primitive-gray-800);
  --color-foreground-gray-secondary-alt-2: var(--primitive-gray-900);
  --color-foreground-gray-tertiary: var(--primitive-gray-800);
  --color-foreground-gray-quaternary: var(--primitive-gray-700);
  --color-background-white-primary: var(--primitive-white-a100);
  --color-background-white-secondary: var(--primitive-white-a100);
  --color-background-gray-primary: var(--primitive-gray-50);
  --color-background-gray-secondary: var(--primitive-gray-100);
  --color-background-gray-secondary-alt: var(--primitive-gray-100);
  --color-background-gray-secondary-alt-2: var(--primitive-gray-100);
  --color-background-gray-tertiary: var(--primitive-gray-200);
  --color-background-gray-quaternary: var(--primitive-gray-300);
  --color-button-primary-background: var(--primitive-skyblue-500);
  --color-button-primary-hover-background: var(--primitive-skyblue-600);
  --color-button-primary-text: var(--primitive-white);
  --color-button-primary-outline-background: var(--primitive-white-a100);
  --color-button-primary-outline-stroke: var(--primitive-gray-200);
  --color-button-primary-outline-hover-background: var(--primitive-gray-100);
  --color-button-primary-outline-text: var(--primitive-gray-800);
  --color-button-primary-outline-hover-text: var(--primitive-gray-900);
  --color-button-primary-outline-disabled-bg: var(--primitive-gray-100);
  --color-button-primary-outline-disabled-text: var(--primitive-gray-400);
  --color-button-disabled-primary-background: var(--primitive-gray-100);
  --color-button-disabled-primary-border: var(--primitive-gray-100);
  --color-button-disabled-primary-text: var(--primitive-gray-400);
  --color-button-error-primary-background: var(--primitive-red-600);
  --color-button-error-primary-stroke: var(--primitive-red-500);
  --color-button-error-primary-hover-background: var(--primitive-red-700);
  --color-button-error-primary-text: var(--primitive-white);
  --color-button-error-outline-background: var(--primitive-red-50);
  --color-button-error-outline-stroke: var(--primitive-red-500);
  --color-button-error-outline-focused-stroke: var(--primitive-red-600);
  --color-button-error-outline-hover-background: var(--primitive-red-200);
  --color-button-error-outline-text: var(--primitive-red-700);
  --color-button-error-outline-hover-text: var(--primitive-red-700);
  --color-button-success-primary-background: var(--primitive-green-600);
  --color-button-success-primary-stroke: var(--primitive-green-500);
  --color-button-success-primary-hover-background: var(--primitive-green-700);
  --color-button-success-primary-text: var(--primitive-white);
  --color-button-success-outline-background: var(--primitive-green-50);
  --color-button-success-outline-stroke: var(--primitive-green-500);
  --color-button-success-outline-focused-stroke: var(--primitive-green-600);
  --color-button-success-outline-hover-background: var(--primitive-green-200);
  --color-button-success-outline-text: var(--primitive-green-700);
  --color-button-success-outline-hover-text: var(--primitive-green-700);
  --color-button-close-icon-primary-hover-background: var(--primitive-gray-100);
  --color-button-close-icon-primary: var(--color-text-tertiary-text);
  --color-button-close-icon-primary-hover: var(--color-text-secondary-text);
  --color-button-primary-button-group-primary-background: var(--primitive-white);
  --color-button-primary-button-group-primary-text: var(--primitive-skyblue-500);
  --color-button-primary-button-group-primary-hover-background: var(--primitive-skyblue-500);
  --color-button-primary-button-group-primary-hover-text: var(--primitive-white);
  --color-button-primary-button-group-secondary-background: var(--primitive-white);
  --color-button-primary-button-group-secondary-text: var(--color-text-body);
  --color-button-disabled-outline-background: var(--primitive-white);
  --color-button-disabled-outline-border: var(--primitive-gray-100);
  --color-button-disabled-outline-text: var(--primitive-gray-400);
  --color-badges-gray-background: var(--primitive-gray-100);
  --color-badges-gray-text: var(--primitive-gray-700);
  --color-badges-gray-icon: var(--primitive-gray-500);
  --color-badges-primary-background: var(--primitive-skyblue-50);
  --color-badges-primary-text: var(--primitive-skyblue-500);
  --color-badges-primary-icon: var(--primitive-skyblue-500);
  --color-badges-error-background: var(--primitive-red-50);
  --color-badges-error-text: var(--primitive-red-700);
  --color-badges-error-icon: var(--primitive-red-500);
  --color-badges-warning-background: var(--primitive-yellow-50);
  --color-badges-warning-text: var(--primitive-yellow-700);
  --color-badges-warning-icon: var(--primitive-yellow-500);
  --color-badges-success-background: var(--primitive-green-50);
  --color-badges-success-text: var(--primitive-green-700);
  --color-badges-success-icon: var(--primitive-green-500);
  --color-badges-info-background: var(--primitive-bluelight-50);
  --color-badges-info-text: var(--primitive-bluelight-500);
  --color-badges-info-icon: var(--primitive-bluelight-500);
  --color-badges-cyan-background: var(--primitive-cyan-50);
  --color-badges-cyan-text: var(--primitive-cyan-700);
  --color-badges-cyan-icon: var(--primitive-cyan-500);
  --color-badges-sky-background: var(--primitive-sky-50);
  --color-badges-sky-text: var(--primitive-sky-700);
  --color-badges-sky-icon: var(--primitive-sky-500);
  --color-badges-blue-background: var(--primitive-blue-50);
  --color-badges-blue-text: var(--primitive-blue-700);
  --color-badges-blue-icon: var(--primitive-blue-500);
  --color-badges-violet-background: var(--primitive-violet-50);
  --color-badges-violet-text: var(--primitive-violet-700);
  --color-badges-violet-icon: var(--primitive-violet-500);
  --color-badges-purple-background: var(--primitive-purple-50);
  --color-badges-purple-text: var(--primitive-purple-700);
  --color-badges-purple-icon: var(--primitive-purple-500);
  --color-badges-pink-background: var(--primitive-pink-50);
  --color-badges-pink-text: var(--primitive-pink-700);
  --color-badges-pink-icon: var(--primitive-pink-500);
  --color-badges-rose-background: var(--primitive-rose-50);
  --color-badges-rose-text: var(--primitive-rose-700);
  --color-badges-rose-icon: var(--primitive-rose-500);
  --color-badges-orange-background: var(--primitive-orange-50);
  --color-badges-orange-text: var(--primitive-orange-700);
  --color-badges-orange-icon: var(--primitive-orange-500);
  --color-status-gray-light-background: var(--primitive-gray-100);
  --color-status-gray-light-text: var(--primitive-gray-700);
  --color-status-primary-light-background: var(--primitive-skyblue-50);
  --color-status-gray-solid-background: var(--primitive-gray-400);
  --color-status-primary-light-secondary-background: var(--primitive-skyblue-100);
  --color-status-gray-solid-text: var(--primitive-white-a100);
  --color-status-primary-light-text: var(--primitive-skyblue-700);
  --color-status-primary-solid-background: var(--primitive-skyblue-500);
  --color-status-error-light-background: var(--primitive-red-50);
  --color-status-error-light-text: var(--primitive-red-700);
  --color-status-primary-solid-text: var(--primitive-white-a100);
  --color-status-error-light-icon: var(--primitive-red-500);
  --color-status-warning-light-background: var(--primitive-brown-50);
  --color-status-error-solid-background: var(--primitive-red-500);
  --color-status-warning-light-text: var(--primitive-brown-600);
  --color-status-error-solid-text: var(--primitive-white);
  --color-status-success-light-background: var(--primitive-green-50);
  --color-status-warning-solid-background: var(--primitive-brown-500);
  --color-status-success-light-text: var(--primitive-green-600);
  --color-status-warning-solid-text: var(--primitive-white);
  --color-status-success-solid-background: var(--primitive-green-500);
  --color-status-success-solid-text: var(--primitive-white);
  --color-status-info-light-background: var(--primitive-bluelight-50);
  --color-status-info-light-text: var(--primitive-bluelight-500);
  --color-status-dark-light-background: var(--primitive-gray-500);
  --color-status-info-solid-background: var(--primitive-bluelight-500);
  --color-status-info-solid-text: var(--primitive-white);
  --color-status-dark-light-text: var(--primitive-white-a100);
  --color-status-dark-light-secondary-text: var(--primitive-gray-700);
  --color-status-dark-solid-background: var(--primitive-gray-800);
  --color-status-dark-solid-text: var(--primitive-white);
  --color-alerts-success-background: var(--primitive-green-50);
  --color-alerts-success-icon-background: var(--primitive-green-600);
  --color-alerts-success-border: var(--primitive-green-200);
  --color-alerts-success-close-icon: var(--primitive-green-600);
  --color-alerts-success-title: var(--primitive-green-800);
  --color-alerts-success-description: var(--primitive-green-700);
  --color-alerts-success-button-bg: var(--primitive-green-600);
  --color-alerts-success-button-hover-bg: var(--primitive-green-700);
  --color-alerts-success-button: var(--primitive-green-700);
  --color-alerts-danger-background: var(--primitive-red-50);
  --color-alerts-danger-icon-background: var(--primitive-red-600);
  --color-alerts-danger-border: var(--primitive-red-200);
  --color-alerts-danger-close-icon: var(--primitive-red-700);
  --color-alerts-danger-title: var(--primitive-red-800);
  --color-alerts-danger-description: var(--primitive-red-700);
  --color-alerts-danger-button-bg: var(--primitive-red-600);
  --color-alerts-danger-button-hover-bg: var(--primitive-red-700);
  --color-alerts-danger-button: var(--primitive-red-700);
  --color-alerts-info-background: var(--primitive-sky-50);
  --color-alerts-warning-background: var(--primitive-yellow-50);
  --color-alerts-warning-icon-background: var(--primitive-yellow-500);
  --color-alerts-warning-border: var(--primitive-yellow-200);
  --color-alerts-warning-close-icon: var(--primitive-yellow-600);
  --color-alerts-warning-title: var(--primitive-yellow-800);
  --color-alerts-warning-description: var(--primitive-yellow-700);
  --color-alerts-warning-button-bg: var(--primitive-yellow-600);
  --color-alerts-warning-button-hover-bg: var(--primitive-yellow-700);
  --color-alerts-warning-button: var(--primitive-yellow-600);
  --color-alerts-info-icon-background: var(--primitive-sky-500);
  --color-alerts-info-border: var(--primitive-sky-200);
  --color-alerts-info-close-icon: var(--primitive-sky-600);
  --color-alerts-info-title: var(--primitive-sky-800);
  --color-alerts-info-description: var(--primitive-sky-700);
  --color-alerts-info-button-bg: var(--primitive-sky-600);
  --color-alerts-info-button-hover-bg: var(--primitive-sky-700);
  --color-alerts-info-button: var(--primitive-sky-700);
  --color-alerts-default-background: var(--primitive-gray-50);
  --color-alerts-default-icon-background: var(--primitive-gray-500);
  --color-alerts-default-border: var(--primitive-gray-200);
  --color-alerts-default-close-icon: var(--primitive-gray-600);
  --color-alerts-default-title: var(--primitive-gray-800);
  --color-alerts-default-description: var(--primitive-gray-700);
  --color-alerts-default-button-bg: var(--primitive-gray-600);
  --color-alerts-default-button-hover-bg: var(--primitive-gray-700);
  --color-alerts-default-button: var(--primitive-gray-700);
  --color-input-background: var(--primitive-white);
  --color-input-label-text: var(--color-text-body);
  --color-input-disabled-text: var(--primitive-gray-300);
  --color-input-placeholder-text: var(--primitive-gray-400);
  --color-input-brand-focus-border: var(--primitive-skyblue-300);
  --color-input-error-focus-border: var(--primitive-red-500);
  --color-input-success-focus-border: var(--primitive-green-500);
  --color-input-error: var(--primitive-red-500);
  --color-input-success: var(--primitive-green-500);
  --color-tab-background: var(--primitive-gray-100);
  --color-tab-active-background: var(--primitive-white-a100);
  --color-tab-secondary-active-background: var(--primitive-skyblue-50);
  --color-checkbox-background: var(--primitive-white-a100);
  --color-checkbox-checked-border: var(--color-text-brand);
  --color-checkbox-checked-background: var(--color-text-brand);
  --color-checkbox-checked: var(--primitive-white-a100);
  --color-switch-default-bg: var(--color-border-primary);
  --color-switch-custom-bg: var(--color-text-title);
  --color-scrollbar: var(--primitive-gray-200);
  --color-datepicker-background: var(--primitive-white-a100);
  --color-datepicker-selected-date-background: var(--primitive-gray-50);
  --color-dropdowns-background: var(--primitive-white-a100);
  --color-dropdowns-hover-background: var(--primitive-gray-100);
  --color-dropdowns-secondary-background: var(--primitive-white-a100);
  --color-dropdowns-divider: var(--color-border-primary);
  --color-calendar-disabled-date: var(--color-text-tertiary-text);
  --color-calendar-calendar-selected-date-primary-badge: var(--color-text-brand);
  --color-calendar-calendar-selected-date-primary-bg: var(--primitive-skyblue-50);
  --color-calendar-calendar-selected-date-success-badge: var(--primitive-green-500);
  --color-calendar-calendar-selected-date-success-bg: var(--primitive-green-50);
  --color-calendar-calendar-selected-date-warning-badge: var(--primitive-orange-500);
  --color-calendar-calendar-selected-date-warning-bg: var(--primitive-orange-50);
  --color-calendar-calendar-selected-date-danger-badge: var(--primitive-red-500);
  --color-calendar-calendar-selected-date-danger-bg: var(--primitive-red-50);
  --color-calendar-calendar-selected-date-info-badge: var(--primitive-bluelight-500);
  --color-calendar-calendar-selected-date-info-bg: var(--primitive-bluelight-50);
  --color-calendar-calendar-selected-date-text: var(--color-text-body);
  --color-calendar-calendar-selected-date-more-menu: var(--color-text-tertiary-text);
  --color-calendar-calendar-selected-date-dropdown-bg: var(--primitive-white-a100);
  --color-card-background: var(--primitive-white-a100);
  --color-card-solid-background: var(--primitive-white-a100);
  --color-card-secondary-background: var(--primitive-gray-100);
  --color-card-card-bg: var(--color-background-gray-primary);
  --color-popovers-title-bg: var(--primitive-gray-100);
  --color-popovers-border: var(--color-border-secondary);
  --color-tooltip-text: var(--color-text-body);
  --color-sidebar-navigation-nav-item-nav-default-background: var(--color-background-white-primary);
  --color-sidebar-navigation-nav-item-nav-hover-background: var(--primitive-gray-50);
  --color-sidebar-navigation-nav-item-nav-secondary-hover-background: var(--primitive-gray-100);
  --color-sidebar-navigation-nav-item-nav-hover-text: var(--primitive-gray-700);
  --color-sidebar-navigation-nav-item-nav-active-text: var(--primitive-skyblue-500);
  --color-sidebar-navigation-nav-item-nav-active-background: var(--primitive-skyblue-50);
  --color-sidebar-navigation-nav-item-nav-focused-background: var(--primitive-skyblue-50);
  --color-sidebar-navigation-nav-item-default-text: var(--primitive-gray-700);
  --color-sidebar-navigation-nav-item-icon: var(--primitive-gray-500);
  --color-sidebar-navigation-nav-item-badge-background: var(--primitive-skyblue-500);
  --color-sidebar-navigation-nav-item-badge-text: var(--primitive-white-a100);
  --color-sidebar-navigation-footer-background: var(--primitive-gray-50);
  --color-sidebar-navigation-footer-title: var(--primitive-gray-900);
  --color-sidebar-navigation-footer-sub-title: var(--primitive-gray-500);
  --color-sidebar-navigation-footer-button-text: var(--primitive-white-a100);
  --color-schedule-list-background: var(--primitive-white-a100);
  --color-schedule-list-active-background: var(--primitive-gray-50);
  --color-kanban-task-card-bg: var(--primitive-white-a100);
  --color-kanban-task-dropdown-bg: var(--primitive-white-a100);
  --color-file-manager-icon-bg-1: #12b76a14;
  --color-file-manager-icon-bg-2: #ee46bc14;
  --color-file-manager-icon-bg-3: #0ba5ec14;
  --color-file-manager-icon-bg-4: #fb651414;
  --color-file-manager-icon-bg-5: #f7900914;
  --color-file-manager-icon-bg-6: #7a5af814;
  --color-pricing-table-active-switcher-bg: var(--primitive-white-a100);
  --color-pricing-table-active-pricing-card: var(--color-text-title);
  --color-pricing-table-button-bg: var(--color-text-title);
  --color-pricing-table-table-2-icon: var(--color-text-brand);
  --color-pricing-table-table-2-icon-bg: var(--primitive-skyblue-50);
  --color-faq-s-first-faq-active-title-bg: var(--primitive-gray-50);
  --color-faq-s-second-faq-active-bg: var(--primitive-skyblue-50);
  --color-faq-s-second-faq-active-border: var(--primitive-skyblue-100);
  --color-faq-s-second-faq-active-title: var(--color-text-title);
  --color-faq-s-second-faq-active-text-color-2: var(--color-text-body);
  --color-chat-list-chat-list-bg-primary: var(--primitive-gray-700);
  --color-chat-list-chat-list-bg-primary-alt: var(--primitive-gray-100);
  --color-chat-list-chat-list-bg-secondary: var(--primitive-skyblue-500);
  --color-chat-list-chat-list-bg-secondary-alt: var(--primitive-skyblue-100);
  --color-invoice-total-amount-bg: var(--primitive-gray-50);
  --color-logo-light: #fff;
  --color-logo-dark: #1f2937;
  --color-skeleton-gradient-100: var(--primitive-gray-200);
  --color-skeleton-gradient-200: var(--primitive-gray-50);
  --color-skeleton-gradient-300: var(--primitive-gray-200);
  --color-404-page-blur-bg: #fff6;
  --color-404-page-shape: #e5e7eb;
  --color-blogs-shape: #e5e7eb;
  --color-modal-success-button-bg: var(--primitive-green-600);
  --color-modal-info-button-bg: var(--primitive-sky-600);
  --color-modal-warning-button-bg: var(--primitive-brown-600);
  --color-modal-error-button-bg: var(--primitive-red-600);
  --color-section-title-badge: var(--primitive-skyblue-500);
  --color-section-title-badge-background: var(--primitive-skyblue-a05);
  --color-mobile-nav-menu-button-icon: var(--color-text-body);
  --color-mobile-nav-menu-button-background: var(--primitive-white);
  --color-mobile-nav-menu-button-hover-background: var(--primitive-gray-100);
  --color-footer-card-bg: var(--color-background-gray-primary);
  --color-footer-background: var(--color-background-white-primary);
  --color-bento-card-bg: var(--primitive-gray-100);
  --color-bento-gradient-shade-1: var(--primitive-white-a00);
  --color-bento-gradient-shade-2: var(--primitive-white-a50);
  --color-bento-gradient-shade-3: var(--primitive-white-a100);
  --color-cta-icon-bg: var(--color-background-white-primary);
  --color-cta-background: var(--color-background-white-primary);
  --color-hero-background: var(--primitive-gray-100);
  --color-hero-card: var(--primitive-white);
  --color-hero-card-2: var(--primitive-gray-100);
  --color-hero-gradient-shade-1: #fff9;
  --color-hero-gradient-shade-2: var(--primitive-white-a100);
  --color-toggle-default-bg: var(--primitive-gray-200);
  --color-toggle-disabled-foreground: var(--primitive-white-a100);
  --color-toggle-disabled-bg: var(--primitive-gray-100);
  --color-toggle-active-bg: var(--primitive-skyblue-500);
  --color-map-map: var(--primitive-gray-300);
  --color-ai-component-sidebar-menu-primary-gradient-shade-1: var(--primitive-white-a100);
  --color-ai-component-sidebar-menu-primary-gradient-shade-2: var(--primitive-white-a00);
  --color-ai-component-sidebar-menu-secondary-gradient-shade-1: var(--primitive-gray-100);
  --color-ai-component-sidebar-menu-secondary-gradient-shade-2: #f3f4f600;
  --color-ai-component-sidebar-menu-hover-effect-hover-primary-shade-1: var(--primitive-gray-100);
  --color-ai-component-sidebar-menu-hover-effect-hover-primary-shade-2: #f3f4f600;
  --color-ai-component-sidebar-menu-hover-effect-hover-secondary-shade-1: var(--primitive-gray-200);
  --color-ai-component-sidebar-menu-hover-effect-hover-secondary-shade-2: #e5e7eb00;
  --color-ai-component-sidebar-menu-hover-effect-hover-primary-bg: var(--primitive-gray-100);
  --color-ai-component-sidebar-menu-hover-effect-hover-secondary-bg: var(--primitive-gray-200);
  --color-ai-component-title-gradient-shade-1: var(--primitive-gray-800);
  --color-ai-component-title-gradient-shade-2: var(--primitive-gray-400);
  --color-ai-hero-blend-1: var(--primitive-gray-100);
  --color-ai-hero-blend-2: #f3f4f600;
  --color-focus-ring: var(--primitive-skyblue-300);
}

[data-theme="dark"] {
  --color-text-brand: var(--primitive-skyblue-500);
  --color-text-neutral-brand: var(--primitive-skyblue-400);
  --color-text-title: var(--primitive-white-a90);
  --color-text-body: var(--primitive-gray-400);
  --color-text-secondary-text: var(--primitive-gray-400);
  --color-text-tertiary-text: var(--primitive-gray-500);
  --color-border-primary: var(--primitive-gray-800);
  --color-border-secondary: var(--primitive-gray-900);
  --color-border-secondary-alt: var(--primitive-gray-700);
  --color-border-tertiary: var(--primitive-gray-800);
  --color-foreground-dark-primary: var(--primitive-white-a100);
  --color-foreground-dark-secondary: var(--primitive-white-a100);
  --color-foreground-gray-primary: var(--primitive-gray-50);
  --color-foreground-gray-secondary: var(--primitive-gray-100);
  --color-foreground-gray-secondary-alt: var(--primitive-gray-100);
  --color-foreground-gray-secondary-alt-2: var(--primitive-gray-100);
  --color-foreground-gray-tertiary: var(--primitive-gray-200);
  --color-foreground-gray-quaternary: var(--primitive-gray-300);
  --color-background-white-primary: var(--primitive-gray-950);
  --color-background-white-secondary: var(--primitive-gray-900);
  --color-background-gray-primary: var(--primitive-gray-900);
  --color-background-gray-secondary: var(--primitive-gray-900);
  --color-background-gray-secondary-alt: var(--primitive-gray-800);
  --color-background-gray-secondary-alt-2: var(--primitive-gray-950);
  --color-background-gray-tertiary: var(--primitive-gray-800);
  --color-background-gray-quaternary: var(--primitive-gray-700);
  --color-button-primary-background: var(--primitive-skyblue-500);
  --color-button-primary-hover-background: var(--primitive-skyblue-600);
  --color-button-primary-text: var(--primitive-white);
  --color-button-primary-outline-background: var(--primitive-gray-900);
  --color-button-primary-outline-stroke: var(--primitive-gray-800);
  --color-button-primary-outline-hover-background: var(--primitive-gray-900);
  --color-button-primary-outline-text: var(--primitive-gray-200);
  --color-button-primary-outline-hover-text: var(--primitive-gray-100);
  --color-button-primary-outline-disabled-bg: var(--primitive-gray-800);
  --color-button-primary-outline-disabled-text: var(--primitive-gray-600);
  --color-button-disabled-primary-background: var(--primitive-gray-800);
  --color-button-disabled-primary-border: var(--primitive-gray-800);
  --color-button-disabled-primary-text: var(--primitive-gray-600);
  --color-button-error-primary-background: var(--primitive-red-600);
  --color-button-error-primary-stroke: var(--primitive-red-500);
  --color-button-error-primary-hover-background: var(--primitive-red-700);
  --color-button-error-primary-text: var(--primitive-white);
  --color-button-error-outline-background: var(--primitive-red-a05);
  --color-button-error-outline-stroke: var(--primitive-red-900);
  --color-button-error-outline-focused-stroke: var(--primitive-red-800);
  --color-button-error-outline-hover-background: var(--primitive-red-a15);
  --color-button-error-outline-text: var(--primitive-red-500);
  --color-button-error-outline-hover-text: var(--primitive-red-400);
  --color-button-success-primary-background: var(--primitive-green-600);
  --color-button-success-primary-stroke: var(--primitive-green-500);
  --color-button-success-primary-hover-background: var(--primitive-green-700);
  --color-button-success-primary-text: var(--primitive-white);
  --color-button-success-outline-background: var(--primitive-green-a05);
  --color-button-success-outline-stroke: var(--primitive-green-900);
  --color-button-success-outline-focused-stroke: var(--primitive-green-800);
  --color-button-success-outline-hover-background: var(--primitive-green-a15);
  --color-button-success-outline-text: var(--primitive-green-500);
  --color-button-success-outline-hover-text: var(--primitive-green-400);
  --color-button-close-icon-primary-hover-background: var(--primitive-gray-900);
  --color-button-close-icon-primary: var(--color-text-tertiary-text);
  --color-button-close-icon-primary-hover: var(--primitive-gray-300);
  --color-button-primary-button-group-primary-background: #fff0;
  --color-button-primary-button-group-primary-text: var(--primitive-skyblue-500);
  --color-button-primary-button-group-primary-hover-background: var(--primitive-skyblue-500);
  --color-button-primary-button-group-primary-hover-text: var(--primitive-white);
  --color-button-primary-button-group-secondary-background: var(--primitive-white-a01);
  --color-button-primary-button-group-secondary-text: var(--color-text-body);
  --color-button-disabled-outline-background: var(--primitive-gray-800);
  --color-button-disabled-outline-border: var(--primitive-gray-800);
  --color-button-disabled-outline-text: var(--primitive-gray-600);
  --color-badges-gray-background: var(--primitive-gray-600);
  --color-badges-gray-text: var(--primitive-gray-200);
  --color-badges-gray-icon: var(--primitive-gray-200);
  --color-badges-primary-background: var(--primitive-skyblue-a15);
  --color-badges-primary-text: var(--primitive-skyblue-400);
  --color-badges-primary-icon: var(--primitive-skyblue-400);
  --color-badges-error-background: var(--primitive-red-a15);
  --color-badges-error-text: var(--primitive-red-500);
  --color-badges-error-icon: var(--primitive-red-400);
  --color-badges-warning-background: var(--primitive-yellow-a15);
  --color-badges-warning-text: var(--primitive-yellow-500);
  --color-badges-warning-icon: var(--primitive-yellow-400);
  --color-badges-success-background: var(--primitive-green-a15);
  --color-badges-success-text: var(--primitive-green-500);
  --color-badges-success-icon: var(--primitive-green-400);
  --color-badges-info-background: #0ba5ec26;
  --color-badges-info-text: var(--primitive-bluelight-500);
  --color-badges-info-icon: var(--primitive-bluelight-500);
  --color-badges-cyan-background: var(--primitive-cyan-a15);
  --color-badges-cyan-text: var(--primitive-cyan-500);
  --color-badges-cyan-icon: var(--primitive-cyan-400);
  --color-badges-sky-background: var(--primitive-sky-a15);
  --color-badges-sky-text: var(--primitive-sky-500);
  --color-badges-sky-icon: var(--primitive-sky-400);
  --color-badges-blue-background: var(--primitive-blue-a15);
  --color-badges-blue-text: var(--primitive-blue-500);
  --color-badges-blue-icon: var(--primitive-blue-400);
  --color-badges-violet-background: var(--primitive-violet-a15);
  --color-badges-violet-text: var(--primitive-violet-500);
  --color-badges-violet-icon: var(--primitive-violet-400);
  --color-badges-purple-background: var(--primitive-purple-a15);
  --color-badges-purple-text: var(--primitive-purple-500);
  --color-badges-purple-icon: var(--primitive-purple-400);
  --color-badges-pink-background: var(--primitive-pink-a15);
  --color-badges-pink-text: var(--primitive-pink-500);
  --color-badges-pink-icon: var(--primitive-pink-400);
  --color-badges-rose-background: var(--primitive-rose-a15);
  --color-badges-rose-text: var(--primitive-rose-500);
  --color-badges-rose-icon: var(--primitive-rose-400);
  --color-badges-orange-background: var(--primitive-orange-a15);
  --color-badges-orange-text: var(--primitive-orange-500);
  --color-badges-orange-icon: var(--primitive-orange-400);
  --color-status-gray-light-background: var(--primitive-white-a05);
  --color-status-gray-light-text: var(--primitive-white-a80);
  --color-status-primary-light-background: #465fff26;
  --color-status-gray-solid-background: var(--primitive-white-a05);
  --color-status-primary-light-secondary-background: #465fff33;
  --color-status-gray-solid-text: var(--primitive-white-a80);
  --color-status-primary-light-text: var(--primitive-skyblue-400);
  --color-status-primary-solid-background: var(--primitive-skyblue-500);
  --color-status-error-light-background: #f0443826;
  --color-status-error-light-text: var(--primitive-red-500);
  --color-status-primary-solid-text: var(--primitive-white-a100);
  --color-status-error-light-icon: var(--primitive-red-500);
  --color-status-warning-light-background: #f7900926;
  --color-status-error-solid-background: var(--primitive-red-500);
  --color-status-warning-light-text: var(--primitive-orange-400);
  --color-status-error-solid-text: var(--primitive-white);
  --color-status-success-light-background: #12b76a26;
  --color-status-warning-solid-background: var(--primitive-brown-500);
  --color-status-success-light-text: var(--primitive-green-500);
  --color-status-warning-solid-text: var(--primitive-white);
  --color-status-success-solid-background: var(--primitive-green-500);
  --color-status-success-solid-text: var(--primitive-white);
  --color-status-info-light-background: #0ba5ec26;
  --color-status-info-light-text: var(--primitive-bluelight-500);
  --color-status-dark-light-background: var(--primitive-white-a05);
  --color-status-info-solid-background: var(--primitive-bluelight-500);
  --color-status-info-solid-text: var(--primitive-white);
  --color-status-dark-light-text: var(--primitive-white-a100);
  --color-status-dark-light-secondary-text: var(--primitive-white-a100);
  --color-status-dark-solid-background: var(--primitive-white-a15);
  --color-status-dark-solid-text: var(--primitive-white);
  --color-alerts-success-background: #22c55e0d;
  --color-alerts-success-icon-background: var(--primitive-green-600);
  --color-alerts-success-border: var(--primitive-green-900);
  --color-alerts-success-close-icon: var(--primitive-green-600);
  --color-alerts-success-title: var(--primitive-green-600);
  --color-alerts-success-description: var(--primitive-green-600);
  --color-alerts-success-button-bg: var(--primitive-green-500);
  --color-alerts-success-button-hover-bg: var(--primitive-green-600);
  --color-alerts-success-button: var(--primitive-green-500);
  --color-alerts-danger-background: #ef44440d;
  --color-alerts-danger-icon-background: var(--primitive-red-600);
  --color-alerts-danger-border: var(--primitive-red-900);
  --color-alerts-danger-close-icon: var(--primitive-red-700);
  --color-alerts-danger-title: var(--primitive-red-500);
  --color-alerts-danger-description: var(--primitive-red-500);
  --color-alerts-danger-button-bg: var(--primitive-red-500);
  --color-alerts-danger-button-hover-bg: var(--primitive-red-600);
  --color-alerts-danger-button: var(--primitive-red-500);
  --color-alerts-info-background: #0ea5e90d;
  --color-alerts-warning-background: #eab3080d;
  --color-alerts-warning-icon-background: var(--primitive-yellow-600);
  --color-alerts-warning-border: var(--primitive-yellow-900);
  --color-alerts-warning-close-icon: var(--primitive-yellow-600);
  --color-alerts-warning-title: var(--primitive-yellow-500);
  --color-alerts-warning-description: var(--primitive-yellow-500);
  --color-alerts-warning-button-bg: var(--primitive-yellow-500);
  --color-alerts-warning-button-hover-bg: var(--primitive-yellow-600);
  --color-alerts-warning-button: var(--primitive-yellow-500);
  --color-alerts-info-icon-background: var(--primitive-sky-600);
  --color-alerts-info-border: var(--primitive-sky-900);
  --color-alerts-info-close-icon: var(--primitive-sky-600);
  --color-alerts-info-title: var(--primitive-sky-500);
  --color-alerts-info-description: var(--primitive-sky-500);
  --color-alerts-info-button-bg: var(--primitive-sky-500);
  --color-alerts-info-button-hover-bg: var(--primitive-sky-600);
  --color-alerts-info-button: var(--primitive-sky-500);
  --color-alerts-default-background: #6b72801a;
  --color-alerts-default-icon-background: var(--primitive-gray-500);
  --color-alerts-default-border: var(--primitive-gray-900);
  --color-alerts-default-close-icon: var(--primitive-gray-600);
  --color-alerts-default-title: var(--primitive-gray-300);
  --color-alerts-default-description: var(--primitive-gray-400);
  --color-alerts-default-button-bg: var(--primitive-gray-500);
  --color-alerts-default-button-hover-bg: var(--primitive-gray-600);
  --color-alerts-default-button: var(--primitive-gray-500);
  --color-input-background: var(--primitive-white-a05);
  --color-input-label-text: var(--primitive-gray-400);
  --color-input-disabled-text: var(--primitive-white-a15);
  --color-input-placeholder-text: var(--primitive-gray-500);
  --color-input-brand-focus-border: var(--primitive-skyblue-300);
  --color-input-error-focus-border: var(--primitive-red-700);
  --color-input-success-focus-border: var(--primitive-green-700);
  --color-input-error: var(--primitive-red-600);
  --color-input-success: var(--primitive-green-600);
  --color-tab-background: var(--primitive-gray-900);
  --color-tab-active-background: var(--primitive-gray-800);
  --color-tab-secondary-active-background: #7592ff33;
  --color-checkbox-background: #fff0;
  --color-checkbox-checked-border: var(--color-text-brand);
  --color-checkbox-checked-background: var(--color-text-brand);
  --color-checkbox-checked: var(--primitive-white-a100);
  --color-switch-default-bg: var(--primitive-white-a10);
  --color-switch-custom-bg: var(--primitive-white-a10);
  --color-scrollbar: var(--primitive-gray-700);
  --color-datepicker-background: var(--primitive-dark-gray);
  --color-datepicker-selected-date-background: var(--primitive-white-a05);
  --color-dropdowns-background: var(--primitive-gray-800);
  --color-dropdowns-hover-background: var(--primitive-gray-700);
  --color-dropdowns-secondary-background: #1e2635;
  --color-dropdowns-divider: #353c49;
  --color-calendar-disabled-date: var(--primitive-white-a30);
  --color-calendar-calendar-selected-date-primary-badge: var(--color-text-brand);
  --color-calendar-calendar-selected-date-primary-bg: var(--primitive-brand-100);
  --color-calendar-calendar-selected-date-success-badge: var(--primitive-green-500);
  --color-calendar-calendar-selected-date-success-bg: var(--primitive-green-100);
  --color-calendar-calendar-selected-date-warning-badge: var(--primitive-orange-500);
  --color-calendar-calendar-selected-date-warning-bg: var(--primitive-orange-100);
  --color-calendar-calendar-selected-date-danger-badge: var(--primitive-red-500);
  --color-calendar-calendar-selected-date-danger-bg: var(--primitive-red-100);
  --color-calendar-calendar-selected-date-info-badge: var(--primitive-bluelight-500);
  --color-calendar-calendar-selected-date-info-bg: var(--primitive-bluelight-100);
  --color-calendar-calendar-selected-date-text: var(--primitive-gray-700);
  --color-calendar-calendar-selected-date-more-menu: var(--color-text-tertiary-text);
  --color-calendar-calendar-selected-date-dropdown-bg: #232b39;
  --color-card-background: var(--primitive-gray-950);
  --color-card-solid-background: #1e2634;
  --color-card-secondary-background: var(--primitive-white-a03);
  --color-card-card-bg: var(--primitive-gray-900);
  --color-popovers-title-bg: var(--primitive-gray-800);
  --color-popovers-border: var(--primitive-gray-700);
  --color-tooltip-text: var(--primitive-white-a100);
  --color-sidebar-navigation-nav-item-nav-default-background: var(--color-background-white-primary);
  --color-sidebar-navigation-nav-item-nav-hover-background: var(--primitive-white-a00);
  --color-sidebar-navigation-nav-item-nav-secondary-hover-background: var(--primitive-white-a05);
  --color-sidebar-navigation-nav-item-nav-hover-text: var(--primitive-gray-300);
  --color-sidebar-navigation-nav-item-nav-active-text: var(--primitive-skyblue-400);
  --color-sidebar-navigation-nav-item-nav-active-background: #3758f91f;
  --color-sidebar-navigation-nav-item-nav-focused-background: #3758f91f;
  --color-sidebar-navigation-nav-item-default-text: var(--primitive-gray-300);
  --color-sidebar-navigation-nav-item-icon: var(--primitive-gray-400);
  --color-sidebar-navigation-nav-item-badge-background: var(--primitive-skyblue-500);
  --color-sidebar-navigation-nav-item-badge-text: var(--primitive-white-a100);
  --color-sidebar-navigation-footer-background: var(--primitive-white-a03);
  --color-sidebar-navigation-footer-title: var(--primitive-white-a100);
  --color-sidebar-navigation-footer-sub-title: var(--primitive-gray-400);
  --color-sidebar-navigation-footer-button-text: var(--primitive-white-a100);
  --color-schedule-list-background: #10182800;
  --color-schedule-list-active-background: var(--primitive-white-a03);
  --color-kanban-task-card-bg: var(--primitive-white-a05);
  --color-kanban-task-dropdown-bg: #272f3d;
  --color-file-manager-icon-bg-1: #12b76a14;
  --color-file-manager-icon-bg-2: #ee46bc14;
  --color-file-manager-icon-bg-3: #0ba5ec14;
  --color-file-manager-icon-bg-4: #fb651414;
  --color-file-manager-icon-bg-5: #f7900914;
  --color-file-manager-icon-bg-6: #7a5af814;
  --color-pricing-table-active-switcher-bg: var(--primitive-white-a10);
  --color-pricing-table-active-pricing-card: var(--primitive-white-a10);
  --color-pricing-table-button-bg: var(--primitive-white-a10);
  --color-pricing-table-table-2-icon: var(--primitive-skyblue-500);
  --color-pricing-table-table-2-icon-bg: #465fff1a;
  --color-faq-s-first-faq-active-title-bg: var(--primitive-white-a03);
  --color-faq-s-second-faq-active-bg: var(--primitive-skyblue-100);
  --color-faq-s-second-faq-active-border: var(--primitive-skyblue-200);
  --color-faq-s-second-faq-active-title: var(--primitive-gray-800);
  --color-faq-s-second-faq-active-text-color-2: var(--primitive-gray-600);
  --color-chat-list-chat-list-bg-primary: var(--primitive-white-a05);
  --color-chat-list-chat-list-bg-primary-alt: var(--primitive-white-a05);
  --color-chat-list-chat-list-bg-secondary: var(--primitive-skyblue-500);
  --color-chat-list-chat-list-bg-secondary-alt: var(--primitive-skyblue-a20);
  --color-invoice-total-amount-bg: var(--primitive-white-a03);
  --color-logo-light: #1f2937;
  --color-logo-dark: #fff;
  --color-skeleton-gradient-100: var(--primitive-white-a15);
  --color-skeleton-gradient-200: var(--primitive-white-a05);
  --color-skeleton-gradient-300: var(--primitive-white-a15);
  --color-404-page-blur-bg: #11182766;
  --color-404-page-shape: #ffffff26;
  --color-blogs-shape: var(--primitive-white-a15);
  --color-modal-success-button-bg: var(--primitive-green-500);
  --color-modal-info-button-bg: var(--primitive-sky-500);
  --color-modal-warning-button-bg: var(--primitive-brown-500);
  --color-modal-error-button-bg: var(--primitive-red-500);
  --color-section-title-badge: var(--primitive-skyblue-500);
  --color-section-title-badge-background: var(--primitive-skyblue-a15);
  --color-mobile-nav-menu-button-icon: var(--primitive-gray-300);
  --color-mobile-nav-menu-button-background: var(--primitive-gray-950);
  --color-mobile-nav-menu-button-hover-background: var(--primitive-gray-900);
  --color-footer-card-bg: var(--primitive-gray-900);
  --color-footer-background: var(--primitive-gray-950);
  --color-bento-card-bg: var(--primitive-gray-800);
  --color-bento-gradient-shade-1: #11182700;
  --color-bento-gradient-shade-2: var(--primitive-white-a10);
  --color-bento-gradient-shade-3: var(--primitive-white-a10);
  --color-cta-icon-bg: var(--primitive-gray-800);
  --color-cta-background: var(--primitive-gray-950);
  --color-hero-background: var(--primitive-gray-900);
  --color-hero-card: var(--primitive-gray-800);
  --color-hero-card-2: var(--primitive-gray-700);
  --color-hero-gradient-shade-1: #11182700;
  --color-hero-gradient-shade-2: #111827;
  --color-toggle-default-bg: var(--primitive-gray-600);
  --color-toggle-disabled-foreground: var(--primitive-white-a40);
  --color-toggle-disabled-bg: var(--primitive-gray-800);
  --color-toggle-active-bg: var(--primitive-skyblue-500);
  --color-map-map: var(--primitive-gray-500);
  --color-ai-component-sidebar-menu-primary-gradient-shade-1: var(--primitive-gray-950);
  --color-ai-component-sidebar-menu-primary-gradient-shade-2: #03071200;
  --color-ai-component-sidebar-menu-secondary-gradient-shade-1: var(--primitive-gray-950);
  --color-ai-component-sidebar-menu-secondary-gradient-shade-2: #03071200;
  --color-ai-component-sidebar-menu-hover-effect-hover-primary-shade-1: var(--primitive-gray-900);
  --color-ai-component-sidebar-menu-hover-effect-hover-primary-shade-2: #11182700;
  --color-ai-component-sidebar-menu-hover-effect-hover-secondary-shade-1: var(--primitive-gray-900);
  --color-ai-component-sidebar-menu-hover-effect-hover-secondary-shade-2: #11182700;
  --color-ai-component-sidebar-menu-hover-effect-hover-primary-bg: var(--primitive-gray-900);
  --color-ai-component-sidebar-menu-hover-effect-hover-secondary-bg: var(--primitive-gray-900);
  --color-ai-component-title-gradient-shade-1: var(--primitive-white-a100);
  --color-ai-component-title-gradient-shade-2: var(--primitive-white-a30);
  --color-ai-hero-blend-1: var(--primitive-gray-900);
  --color-ai-hero-blend-2: #11182700;
  --color-focus-ring: var(--primitive-skyblue-300);
}

:root {
  --font-family-sans: "DM Sans", system-ui, -apple-system, sans-serif;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --font-size-xs: 12px;
  --font-size-sm: 14px;
  --font-size-md: 16px;
  --font-size-lg: 18px;
  --font-size-xl: 20px;
  --font-size-2xl: 24px;
  --font-size-3xl: 30px;
  --font-size-4xl: 36px;
  --font-size-5xl: 48px;
  --font-size-6xl: 60px;
  --font-size-7xl: 72px;
  --font-size-8xl: 96px;
  --font-size-9xl: 128px;
  --font-line-height-xs: 16px;
  --font-line-height-sm: 20px;
  --font-line-height-md: 24px;
  --font-line-height-lg: 28px;
  --font-line-height-xl: 28px;
  --font-line-height-2xl: 32px;
  --font-line-height-3xl: 36px;
  --font-line-height-4xl: 40px;
  --font-line-height-5xl: 52px;
  --font-line-height-6xl: 64px;
  --font-line-height-7xl: 72px;
  --font-line-height-8xl: 96px;
  --font-line-height-9xl: 128px;
}

@keyframes pulse {
  50% {
    opacity: .5;
  }
}

.recharts-wrapper :focus {
  outline: none;
}

@keyframes ds-bar-indeterminate {
  0% {
    transform: translate(-100%);
  }

  50% {
    transform: translate(200%);
  }

  to {
    transform: translate(-100%);
  }
}

.ds-slider {
  --ds-slider-track: 4px;
  --ds-slider-thumb: 16px;
  --ds-slider-fill: 0%;
}

.ds-slider.ds-slider--sm {
  --ds-slider-track: 3px;
  --ds-slider-thumb: 12px;
}

.ds-slider::-webkit-slider-runnable-track {
  height: var(--ds-slider-track);
  background: linear-gradient(to right,var(--color-primary-500) 0%,var(--color-primary-500) var(--ds-slider-fill),var(--color-base-100) var(--ds-slider-fill),var(--color-base-100) 100%);
  border-radius: 9999px;
}

.ds-slider::-webkit-slider-thumb {
  appearance: none;
  width: var(--ds-slider-thumb);
  height: var(--ds-slider-thumb);
  background: var(--color-primary-500);
  border: 2px solid var(--color-background-50, #fff);
  margin-top: calc((var(--ds-slider-track) - var(--ds-slider-thumb)) / 2);
  cursor: pointer;
  border-radius: 9999px;
  transition: transform .1s ease-out;
  box-shadow: 0 1px 2px #10182833;
}

.ds-slider:focus-visible::-webkit-slider-thumb {
  box-shadow: 0 0 0 4px #0894c833;
}

.ds-slider:active::-webkit-slider-thumb {
  transform: scale(1.08);
}

.ds-slider::-moz-range-track {
  height: var(--ds-slider-track);
  background: var(--color-base-100);
  border-radius: 9999px;
}

.ds-slider::-moz-range-progress {
  height: var(--ds-slider-track);
  background: var(--color-primary-500);
  border-radius: 9999px;
}

.ds-slider::-moz-range-thumb {
  width: var(--ds-slider-thumb);
  height: var(--ds-slider-thumb);
  background: var(--color-primary-500);
  border: 2px solid var(--color-background-50, #fff);
  cursor: pointer;
  border-radius: 9999px;
  transition: transform .1s ease-out;
  box-shadow: 0 1px 2px #10182833;
}

.ds-slider:focus-visible::-moz-range-thumb {
  box-shadow: 0 0 0 4px #0894c833;
}

.ds-slider:active::-moz-range-thumb {
  transform: scale(1.08);
}

.ds-daypicker {
  --rdp-accent-color: var(--color-primary-500);
  --rdp-accent-background-color: var(--color-primary-50);
  --rdp-day_button-height: 34px;
  --rdp-day_button-width: 34px;
  --rdp-day-height: 34px;
  --rdp-day-width: 34px;
  --rdp-day_button-border-radius: 8px;
  --rdp-selected-border: none;
  --rdp-outside-opacity: .4;
  color: var(--color-text-50);
  padding: 4px;
  font-family: inherit;
}

.ds-daypicker .rdp-caption_label, .ds-daypicker .rdp-nav_button, .ds-daypicker .rdp-month_caption {
  color: var(--color-title-50);
  font-weight: 600;
}

.ds-daypicker .rdp-weekday {
  color: var(--color-text-100);
  text-transform: uppercase;
  font-size: 12px;
  font-weight: 500;
}

.ds-daypicker .rdp-day_button {
  border-radius: var(--rdp-day_button-border-radius);
  color: var(--color-text-50);
  font-size: 14px;
  transition: background .1s ease-out;
}

.ds-daypicker .rdp-day_button:hover {
  background: var(--color-base-100);
}

.ds-daypicker .rdp-selected .rdp-day_button, .ds-daypicker .rdp-day_selected .rdp-day_button {
  background: var(--color-primary-500);
  color: var(--color-white-100);
  font-weight: 600;
}

.ds-daypicker .rdp-today:not(.rdp-selected) .rdp-day_button {
  color: var(--color-primary-500);
  font-weight: 600;
}

.ds-daypicker .rdp-outside .rdp-day_button {
  opacity: var(--rdp-outside-opacity);
}

.ds-daypicker .rdp-disabled .rdp-day_button {
  opacity: .35;
  cursor: not-allowed;
}

.ds-daypicker .rdp-chevron {
  fill: var(--color-text-100);
}

.ds-daypicker .rdp-range_start .rdp-day_button, .ds-daypicker .rdp-range_end .rdp-day_button {
  background: var(--color-primary-500);
  color: var(--color-white-100);
  border-radius: var(--rdp-day_button-border-radius);
  font-weight: 600;
}

.ds-daypicker .rdp-range_middle .rdp-day_button {
  background: var(--color-primary-50);
  color: var(--color-primary-700);
  border-radius: var(--rdp-day_button-border-radius);
}

@property --tw-rotate-x {
  syntax: "*";
  inherits: false
}

@property --tw-rotate-y {
  syntax: "*";
  inherits: false
}

@property --tw-rotate-z {
  syntax: "*";
  inherits: false
}

@property --tw-skew-x {
  syntax: "*";
  inherits: false
}

@property --tw-skew-y {
  syntax: "*";
  inherits: false
}

@property --tw-divide-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-tracking {
  syntax: "*";
  inherits: false
}

@property --tw-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-inset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-inset-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-inset-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-ring-color {
  syntax: "*";
  inherits: false
}

@property --tw-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-inset-ring-color {
  syntax: "*";
  inherits: false
}

@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-ring-inset {
  syntax: "*";
  inherits: false
}

@property --tw-ring-offset-width {
  syntax: "<length>";
  inherits: false;
  initial-value: 0;
}

@property --tw-ring-offset-color {
  syntax: "*";
  inherits: false;
  initial-value: #fff;
}

@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-outline-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}

@property --tw-ease {
  syntax: "*";
  inherits: false
}

@property --tw-space-x-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-translate-x {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-translate-y {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-translate-z {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-leading {
  syntax: "*";
  inherits: false
}

@property --tw-duration {
  syntax: "*";
  inherits: false
}

@property --tw-scale-x {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}

@property --tw-scale-y {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}

@property --tw-scale-z {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}

@property --tw-divide-x-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-border-spacing-x {
  syntax: "<length>";
  inherits: false;
  initial-value: 0;
}

@property --tw-border-spacing-y {
  syntax: "<length>";
  inherits: false;
  initial-value: 0;
}

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

@keyframes ping {
  75%, 100% {
    opacity: 0;
    transform: scale(2);
  }
}

@keyframes enter {
  0% {
    opacity: 0;
    transform: scale(.95) translateY(-10px);
  }

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

@keyframes exit {
  0% {
    opacity: 1;
    transform: scale(1) translateY(0);
  }

  to {
    opacity: 0;
    transform: scale(.95) translateY(-10px);
  }
}

.rdp-root {
  --rdp-accent-color: blue;
  --rdp-accent-background-color: #f0f0ff;
  --rdp-day-height: 44px;
  --rdp-day-width: 44px;
  --rdp-day_button-border-radius: 100%;
  --rdp-day_button-border: 2px solid transparent;
  --rdp-day_button-height: 42px;
  --rdp-day_button-width: 42px;
  --rdp-selected-border: 2px solid var(--rdp-accent-color);
  --rdp-disabled-opacity: .5;
  --rdp-outside-opacity: .75;
  --rdp-today-color: var(--rdp-accent-color);
  --rdp-dropdown-gap: .5rem;
  --rdp-months-gap: 2rem;
  --rdp-nav_button-disabled-opacity: .5;
  --rdp-nav_button-height: 2.25rem;
  --rdp-nav_button-width: 2.25rem;
  --rdp-nav-height: 2.75rem;
  --rdp-range_middle-background-color: var(--rdp-accent-background-color);
  --rdp-range_middle-color: inherit;
  --rdp-range_start-color: white;
  --rdp-range_start-background: linear-gradient(var(--rdp-gradient-direction), transparent 50%, var(--rdp-range_middle-background-color) 50%);
  --rdp-range_start-date-background-color: var(--rdp-accent-color);
  --rdp-range_end-background: linear-gradient(var(--rdp-gradient-direction), var(--rdp-range_middle-background-color) 50%, transparent 50%);
  --rdp-range_end-color: white;
  --rdp-range_end-date-background-color: var(--rdp-accent-color);
  --rdp-week_number-border-radius: 100%;
  --rdp-week_number-border: 2px solid transparent;
  --rdp-week_number-height: var(--rdp-day-height);
  --rdp-week_number-opacity: .75;
  --rdp-week_number-width: var(--rdp-day-width);
  --rdp-weeknumber-text-align: center;
  --rdp-weekday-opacity: .75;
  --rdp-weekday-padding: .5rem 0rem;
  --rdp-weekday-text-align: center;
  --rdp-gradient-direction: 90deg;
  --rdp-animation_duration: .3s;
  --rdp-animation_timing: cubic-bezier(.4, 0, .2, 1);
}

.rdp-root[dir="rtl"] {
  --rdp-gradient-direction: -90deg;
}

.rdp-root[data-broadcast-calendar="true"] {
  --rdp-outside-opacity: unset;
}

.rdp-root {
  box-sizing: border-box;
  position: relative;
}

.rdp-root * {
  box-sizing: border-box;
}

.rdp-day {
  width: var(--rdp-day-width);
  height: var(--rdp-day-height);
  text-align: center;
}

.rdp-day_button {
  cursor: pointer;
  font: inherit;
  color: inherit;
  width: var(--rdp-day_button-width);
  height: var(--rdp-day_button-height);
  border: var(--rdp-day_button-border);
  border-radius: var(--rdp-day_button-border-radius);
  background: none;
  justify-content: center;
  align-items: center;
  margin: 0;
  padding: 0;
  display: flex;
}

.rdp-day_button:disabled {
  cursor: revert;
}

.rdp-caption_label {
  z-index: 1;
  white-space: nowrap;
  border: 0;
  align-items: center;
  display: inline-flex;
  position: relative;
}

.rdp-dropdown:focus-visible ~ .rdp-caption_label {
  outline: 5px auto highlight;
  outline: 5px auto -webkit-focus-ring-color;
}

.rdp-button_next, .rdp-button_previous {
  cursor: pointer;
  font: inherit;
  color: inherit;
  appearance: none;
  width: var(--rdp-nav_button-width);
  height: var(--rdp-nav_button-height);
  background: none;
  border: none;
  justify-content: center;
  align-items: center;
  margin: 0;
  padding: 0;
  display: inline-flex;
  position: relative;
}

.rdp-button_next:disabled, .rdp-button_next[aria-disabled="true"], .rdp-button_previous:disabled, .rdp-button_previous[aria-disabled="true"] {
  cursor: revert;
  opacity: var(--rdp-nav_button-disabled-opacity);
}

.rdp-chevron {
  fill: var(--rdp-accent-color);
  display: inline-block;
}

.rdp-root[dir="rtl"] .rdp-nav .rdp-chevron {
  transform-origin: 50%;
  transform: rotate(180deg);
}

.rdp-dropdowns {
  align-items: center;
  gap: var(--rdp-dropdown-gap);
  display: inline-flex;
  position: relative;
}

.rdp-dropdown {
  z-index: 2;
  opacity: 0;
  appearance: none;
  width: 100%;
  cursor: inherit;
  line-height: inherit;
  border: none;
  margin: 0;
  padding: 0;
  position: absolute;
  inset-block: 0;
  inset-inline-start: 0;
}

.rdp-dropdown_root {
  align-items: center;
  display: inline-flex;
  position: relative;
}

.rdp-dropdown_root[data-disabled="true"] .rdp-chevron {
  opacity: var(--rdp-disabled-opacity);
}

.rdp-month_caption {
  height: var(--rdp-nav-height);
  align-content: center;
  font-size: large;
  font-weight: 700;
  display: flex;
}

.rdp-root[data-nav-layout="around"] .rdp-month, .rdp-root[data-nav-layout="after"] .rdp-month {
  position: relative;
}

.rdp-root[data-nav-layout="around"] .rdp-month_caption {
  justify-content: center;
  margin-inline-start: var(--rdp-nav_button-width);
  margin-inline-end: var(--rdp-nav_button-width);
  position: relative;
}

.rdp-root[data-nav-layout="around"] .rdp-button_previous {
  height: var(--rdp-nav-height);
  inset-inline-start: 0;
  display: inline-flex;
  position: absolute;
  top: 0;
}

.rdp-root[data-nav-layout="around"] .rdp-button_next {
  height: var(--rdp-nav-height);
  inset-inline-end: 0;
  justify-content: center;
  display: inline-flex;
  position: absolute;
  top: 0;
}

.rdp-months {
  gap: var(--rdp-months-gap);
  flex-wrap: wrap;
  max-width: fit-content;
  display: flex;
  position: relative;
}

.rdp-month_grid {
  border-collapse: collapse;
}

.rdp-nav {
  height: var(--rdp-nav-height);
  align-items: center;
  display: flex;
  position: absolute;
  inset-block-start: 0;
  inset-inline-end: 0;
}

.rdp-weekday {
  opacity: var(--rdp-weekday-opacity);
  padding: var(--rdp-weekday-padding);
  text-align: var(--rdp-weekday-text-align);
  text-transform: var(--rdp-weekday-text-transform);
  font-size: smaller;
  font-weight: 500;
}

.rdp-week_number {
  opacity: var(--rdp-week_number-opacity);
  height: var(--rdp-week_number-height);
  width: var(--rdp-week_number-width);
  border: var(--rdp-week_number-border);
  border-radius: var(--rdp-week_number-border-radius);
  text-align: var(--rdp-weeknumber-text-align);
  font-size: small;
  font-weight: 400;
}

.rdp-today:not(.rdp-outside) {
  color: var(--rdp-today-color);
}

.rdp-selected {
  font-size: large;
  font-weight: 700;
}

.rdp-selected .rdp-day_button {
  border: var(--rdp-selected-border);
}

.rdp-outside {
  opacity: var(--rdp-outside-opacity);
}

.rdp-disabled:not(.rdp-selected) {
  opacity: var(--rdp-disabled-opacity);
}

.rdp-hidden {
  visibility: hidden;
  color: var(--rdp-range_start-color);
}

.rdp-range_start {
  background: var(--rdp-range_start-background);
}

.rdp-range_start .rdp-day_button {
  background-color: var(--rdp-range_start-date-background-color);
  color: var(--rdp-range_start-color);
}

.rdp-range_middle {
  background-color: var(--rdp-range_middle-background-color);
}

.rdp-range_middle .rdp-day_button {
  border: unset;
  border-radius: unset;
  color: var(--rdp-range_middle-color);
}

.rdp-range_end {
  background: var(--rdp-range_end-background);
  color: var(--rdp-range_end-color);
}

.rdp-range_end .rdp-day_button {
  color: var(--rdp-range_start-color);
  background-color: var(--rdp-range_end-date-background-color);
}

.rdp-range_start.rdp-range_end {
  background: revert;
}

.rdp-focusable {
  cursor: pointer;
}

@keyframes rdp-slide_in_left {
  0% {
    transform: translate(-100%);
  }

  to {
    transform: translate(0);
  }
}

@keyframes rdp-slide_in_right {
  0% {
    transform: translate(100%);
  }

  to {
    transform: translate(0);
  }
}

@keyframes rdp-slide_out_left {
  0% {
    transform: translate(0);
  }

  to {
    transform: translate(-100%);
  }
}

@keyframes rdp-slide_out_right {
  0% {
    transform: translate(0);
  }

  to {
    transform: translate(100%);
  }
}

.rdp-weeks_before_enter {
  animation: rdp-slide_in_left var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
}

.rdp-weeks_before_exit {
  animation: rdp-slide_out_left var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
}

.rdp-weeks_after_enter {
  animation: rdp-slide_in_right var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
}

.rdp-weeks_after_exit {
  animation: rdp-slide_out_right var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
}

.rdp-root[dir="rtl"] .rdp-weeks_after_enter {
  animation: rdp-slide_in_left var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
}

.rdp-root[dir="rtl"] .rdp-weeks_before_exit {
  animation: rdp-slide_out_right var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
}

.rdp-root[dir="rtl"] .rdp-weeks_before_enter {
  animation: rdp-slide_in_right var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
}

.rdp-root[dir="rtl"] .rdp-weeks_after_exit {
  animation: rdp-slide_out_left var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
}

@keyframes rdp-fade_in {
  0% {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes rdp-fade_out {
  0% {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

.rdp-caption_after_enter {
  animation: rdp-fade_in var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
}

.rdp-caption_after_exit {
  animation: rdp-fade_out var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
}

.rdp-caption_before_enter {
  animation: rdp-fade_in var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
}

.rdp-caption_before_exit {
  animation: rdp-fade_out var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
}

.clp-root {
  --color-text-title: #334e68;
  --color-text-body: #486581;
  --color-text-secondary-text: #829ab1;
  --color-text-tertiary-text: #9fb3c8;
  --color-border-primary: #f8fafc;
  --color-border-secondary: #f0f4f8;
  --color-border-secondary-alt: #d9e2ec;
  --color-background-gray-primary: #f8fafc;
}

@property --tw-space-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}

@property --tw-font-weight {
  syntax: "*";
  inherits: false
}

@property --tw-ordinal {
  syntax: "*";
  inherits: false
}

@property --tw-slashed-zero {
  syntax: "*";
  inherits: false
}

@property --tw-numeric-figure {
  syntax: "*";
  inherits: false
}

@property --tw-numeric-spacing {
  syntax: "*";
  inherits: false
}

@property --tw-numeric-fraction {
  syntax: "*";
  inherits: false
}

@property --tw-blur {
  syntax: "*";
  inherits: false
}

@property --tw-brightness {
  syntax: "*";
  inherits: false
}

@property --tw-contrast {
  syntax: "*";
  inherits: false
}

@property --tw-grayscale {
  syntax: "*";
  inherits: false
}

@property --tw-hue-rotate {
  syntax: "*";
  inherits: false
}

@property --tw-invert {
  syntax: "*";
  inherits: false
}

@property --tw-opacity {
  syntax: "*";
  inherits: false
}

@property --tw-saturate {
  syntax: "*";
  inherits: false
}

@property --tw-sepia {
  syntax: "*";
  inherits: false
}

@property --tw-drop-shadow {
  syntax: "*";
  inherits: false
}

@property --tw-drop-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-drop-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-drop-shadow-size {
  syntax: "*";
  inherits: false
}