body {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  height: 100vh;
  width: 100vw;
  overflow: hidden;
}

.U24LD1BZhLU43oZBqnQm {
  position: absolute;
  display: flex;
  width: 100%;
  height: 70px;
  padding: var(--nc-p-lg) var(--nc-p-md);
  align-items: center;
  gap: var(--nc-p-lg);
  border-bottom: 1px solid var(--nc-color-border-subtle);
  background: #fff;
  box-shadow: 0 4px 8px 0 rgb(14 22 37 / 8%);
  z-index: 11;

  .kBvhke0GH_Z5GEBeo6JI {
    height: 100%;
  }

  .Ja9T3WLznKdgJCrSiSeL {
    color: var(--nc-color-foreground-default);
    font: var(--nc-type-500-regular);
  }
}

.GyWIBt0szkve9QGRNZ6Q {
  display: flex;
  position: absolute;
  bottom: var(--nc-p-xl);
  width: 100%;
  padding: 0 var(--nc-p-lg);
  gap: var(--nc-p-xs);
  align-items: flex-end;
  pointer-events: none;

  & * {
    pointer-events: all;
  }

  .zsRWVipnIYVGqrzv5Qrx {
    display: flex;
    place-self: end center;
    flex: 1 1 100%;
    justify-content: center;
    gap: var(--nc-p-xs);
    pointer-events: none;
    align-items: end;

    & * {
      pointer-events: all;
    }
  }

  .TuVgy9JKDixs4EjpTYME {
    align-self: flex-end;
    border: 1px solid var(--nc-color-light-pressed);
    border-radius: var(--nc-border-radius-sm);
    display: none;
  }

  @media screen and (width >= 54rem) {
    .TuVgy9JKDixs4EjpTYME {
      display: flex;
    }
  }
}

.EonotDttQTEcZOh0yuep {
  width: 52px;
  height: 52px;
  display: flex;
  padding: var(--nc-p-lg);
  flex-direction: column;
  align-items: center;
  border: 1px solid var(--nc-color-light-pressed);
  background: var(--nc-color-background-default, #fff);
  border-radius: var(--nc-border-radius-lg);
  box-shadow: 0.2px 0.6px 0.7px 0 rgb(153 152 152 / 36%),
    0.6px 2px 2.3px -0.8px rgb(153 152 152 / 36%),
    1.4px 5px 5.8px -1.7px rgb(153 152 152 / 36%),
    3.5px 12.2px 14.3px -2.5px rgb(153 152 152 / 36%);
  transition: background 0.3s ease-in-out, transform 0.3s ease-in-out;
  font-size: var(--nc-p-lg);
  color: var(--nc-color-gray-800);
  cursor: pointer;

  &:hover {
    background: var(--nc-color-light-hover);
  }

  &.yOv2f5glLhk5JhEDkcXa {
    background: var(--nc-color-light-pressed);
  }
}

.VmoeilLL62Ugu5MixAnr {
  display: flex;
  flex-direction: column;
  width: 100%;
  position: absolute;
  gap: var(--nc-p-xs);
  bottom: calc(52px + var(--nc-size-40));

  .XBO2Op3PuhgPZS2gSIKM {
    border-width: 0;
    width: 100%;
    display: flex;
    background: var(--nc-color-background-default);
    color: var(--nc-color-foreground-default);
    font: var(--nc-type-300-regular);
    border-radius: var(--nc-p-sm);
    padding: var(--nc-p-md) var(--nc-p-lg);
    gap: var(--nc-p-lg);
    align-items: center;
    box-shadow: 0.2px 0.6px 0.7px 0 rgb(153 152 152 / 36%),
      0.6px 2px 2.3px -0.8px rgb(153 152 152 / 36%),
      1.4px 5px 5.8px -1.7px rgb(153 152 152 / 36%),
      3.5px 12.2px 14.3px -2.5px rgb(153 152 152 / 36%);
    cursor: pointer;

    &:hover {
      color: var(--nc-color-primary-default);
      background: var(--nc-color-primary-subtle);
    }
  }

  .dYa45ISSfM2fwztIYiVb {
    max-width: max-content;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }

  .fafRf_4u3rtJTgbiDVjE {
    color: var(--nc-color-danger-default);
  }
}

.JLwcYYEcKJ4v16YrJjf8 {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;

  @media screen and (width >= 54rem) {
    max-width: 32rem;
  }

  .CoaQmyi9T0hrcyTtNw3w {
    position: absolute;
    left: var(--nc-p-lg);
  }

  .oVb6iljp8YtpwUp_GHtN {
    all: unset;
    position: absolute;
    right: var(--nc-p-lg);
    cursor: pointer;
  }

  .bLBOkDVIcV8JzTmXCL_l {
    padding: var(--nc-p-sm) 44px;
    height: 52px;
    border: 1px solid var(--nc-color-light-pressed);
    background: var(--nc-color-background-default, #fff);
    border-radius: var(--nc-border-radius-lg);
    box-shadow: 0.2px 0.6px 0.7px 0 rgb(153 152 152 / 36%),
      0.6px 2px 2.3px -0.8px rgb(153 152 152 / 36%),
      1.4px 5px 5.8px -1.7px rgb(153 152 152 / 36%),
      3.5px 12.2px 14.3px -2.5px rgb(153 152 152 / 36%);
    width: 100%;
    font: var(--nc-type-400-regular);

    &::-webkit-search-cancel-button {
      appearance: none;
    }

    &::placeholder {
      font: var(--nc-type-400-regular);
      color: var(--nc-color-foreground-subtle);
    }

    &:disabled {
      cursor: not-allowed;
      background: var(--nc-color-background-disabled);
      color: var(--nc-color-foreground-disabled);
    }

    &:focus-visible {
      border: 2px solid var(--nc-color-primary-default);
      outline: none;
    }
  }
}

.LXrx_BWcjKiYHfjKLSYw {
  display: flex;
  flex-direction: column;
  gap: var(--nc-p-sm);
  margin-right: auto;

  .sM_YgIauiNynQq6OS9V2 {
    position: absolute;
    width: 52px;
    height: 52px;
    display: flex;
    padding: var(--nc-p-lg);
    flex-direction: column;
    align-items: center;
    border: 1px solid var(--nc-color-light-pressed);
    background: var(--nc-color-background-default, #fff);
    border-radius: var(--nc-border-radius-lg);
    box-shadow: 0.2px 0.6px 0.7px 0 rgb(153 152 152 / 36%),
      0.6px 2px 2.3px -0.8px rgb(153 152 152 / 36%),
      1.4px 5px 5.8px -1.7px rgb(153 152 152 / 36%),
      3.5px 12.2px 14.3px -2.5px rgb(153 152 152 / 36%);
    transition: background 0.3s ease-in-out, transform 0.3s ease-in-out;

    .eRcIpP9A7fz6gKZIChh1 {
      font-size: var(--nc-p-lg);
      color: var(--nc-color-gray-800);
    }

    &.DUz982QhlftopU23Y0Fj {
      background: var(--nc-color-light-pressed);
    }
  }

  .NOlRTNCnRMAIYzYsNWUs {
    position: absolute;
    display: flex;
    flex-direction: column;
    gap: var(--nc-p-sm);
    bottom: 64px;
  }

  @media screen and (width >= 54rem) {
    .NOlRTNCnRMAIYzYsNWUs {
      bottom: 0;
      position: relative;
    }
  }

  .m9nmbOQjNQAylKosEwoE {
    border-radius: var(--nc-border-radius-lg);
    border: 1px solid var(--nc-color-border-default, #e5e7eb);
    background: var(--nc-color-background-default, #fff);
    flex-direction: column;
    align-items: center;
    gap: var(--nc-p-lg);
    width: 300px;
    box-shadow: 0.2px 0.6px 0.7px 0 rgb(153 152 152 / 36%),
      0.6px 2px 2.3px -0.8px rgb(153 152 152 / 36%),
      1.4px 5px 5.8px -1.7px rgb(153 152 152 / 36%),
      3.5px 12.2px 14.3px -2.5px rgb(153 152 152 / 36%);
    overflow: hidden;
  }

  .cscc4nB7OBOIy6pJKO5j {
    all: unset;
    box-sizing: border-box;
    padding: var(--nc-p-lg);
    display: flex;
    justify-content: space-between;
    width: 100%;
    font: var(--nc-type-500-bold);
    cursor: pointer;

    .pN019GB2O5QSoD0slyu5 {
      transition: transform 500ms cubic-bezier(1, 0, 0.1, 1);
    }

    &[data-state="open"] > .pN019GB2O5QSoD0slyu5 {
      transform: rotate(180deg);
    }
  }

  .s7Ll6ZddqI2N4u35s9xF {
    overflow: hidden;
    color: var(--nc-color-foreground-default);

    &[data-state="open"] {
      animation: rqKUUhDFmNUAuQLe8nUa 500ms cubic-bezier(1, 0, 0.1, 1);
    }

    &[data-state="closed"] {
      animation: Gn2WcFpxJzNBz0nSHe3K 500ms cubic-bezier(1, 0, 0.1, 1) forwards;
    }

    &[hidden] {
      display: block;
      max-height: 0;
      visibility: hidden;
    }
  }
}

@keyframes rqKUUhDFmNUAuQLe8nUa {
  from {
    height: 0;
  }

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

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

  to {
    height: 0;
    visibility: hidden;
  }
}

.qQDTTsnNO414UhpfnG2w {
  overflow: hidden;
  display: flex;
  border-top: 1px solid var(--nc-color-gray-300);
  padding: var(--nc-p-lg) var(--nc-p-lg) 26px;
  font: var(--nc-type-400-regular);
  gap: var(--nc-p-sm);
}

._e05UqKD71WepICQOwxH {
  display: flex;
  flex-direction: column;
  padding: 18px;
  align-items: flex-start;
  gap: var(--nc-p-sm);
  flex: 1 0 0;
  color: var(--nc-color-foreground-subtle);
  background: var(--nc-color-background-subtle);
  border: 1px solid var(--nc-color-border-default);
  border-radius: var(--nc-p-xs);

  .yzn1gQmIGsmCzW6AKX07 {
    font: var(--nc-type-200-regular);
  }

  .nKnGxyIrU_wgQZ99dgcF {
    font: var(--nc-type-600-medium);
  }
}

.GiEBqd9KStSOKzesSWNW {
  overflow: hidden;
  display: flex;
  flex-direction: column;
  border-top: 1px solid var(--nc-color-gray-300);
  padding: var(--nc-p-lg) var(--nc-p-xl) 26px;
  font: var(--nc-type-400-regular);
  gap: var(--nc-p-sm);

  .IMilN5rUNy07e9BFVyvC {
    font: var(--nc-type-400-bold);
  }

  .zP34rzzaC41aeFUo7W1w {
    display: flex;
    flex-direction: column;
    gap: var(--nc-p-sm);

    .nKVFakYm9cOq5AxxtCyi {
      display: flex;
      gap: var(--nc-p-lg);
      align-items: center;

      &:first-of-type {
        --background: var(--nc-color-red-600);
      }

      &:nth-of-type(2) {
        --background: var(--nc-color-orange-600);
      }

      &:nth-of-type(3) {
        --background: var(--nc-color-purple-600);
      }

      &:last-of-type {
        --background: var(--nc-color-lime-600);
      }

      .fMOPL5Ky3ur_pzmGbAKC {
        width: var(--nc-p-xxl);
        height: var(--nc-p-xxl);
        border-radius: var(--nc-border-radius-sm);
        background: var(--background);
      }
    }
  }
}

.JPrIvswI8m4wIPnuLjRY {
  padding-top: var(--nc-p-lg);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  height: 100%;
  max-height: 100%;

  .MNR_W6hRPAIgVccQX1fa {
    display: flex;
    align-items: center;
    gap: var(--nc-p-lg);
    font: var(--nc-type-500-bold);
    padding: 0 var(--nc-p-lg);
    padding-bottom: var(--nc-p-lg);
    border-bottom: 1px solid var(--nc-color-border-default);
    color: var(--nc-color-foreground-default);
    flex-shrink: 0;

    .CU6w_uyzmBqoIFkx0sKQ {
      height: var(--nc-p-xl);
    }
  }

  .jI8gEYkk666vzZFT8Xfl {
    all: unset;
    cursor: pointer;
    margin-left: auto;
  }

  .VQ4uK940AmDGh1sCwogJ {
    gap: var(--nc-p-lg);
    display: flex;
    flex-direction: column;
    overflow: hidden auto;
    padding: var(--nc-p-lg) 0;
    flex: 1;
  }

  .KavWTbNiRccMoBv2slVT {
    display: flex;
    padding: var(--nc-p-md);
    flex-direction: column;
    align-items: flex-start;
    gap: var(--nc-p-sm);
    margin: 0 var(--nc-p-lg);
    align-self: stretch;
    border-radius: var(--nc-p-sm);
    border: 1px solid var(--nc-color-border-default);
    color: var(--nc-color-gray-700);
    flex-shrink: 0;

    .HHfPl6YvG9AK1ZeXEWQh {
      font: var(--nc-type-300-medium);
    }

    .ZY31B6ovxHWIlrAGwNHq {
      font: var(--nc-type-400-regular);
    }

    .k_ofntF0PjK2TP3Nk2Mr {
      font: var(--nc-type-700-regular);
    }
  }

  .Xtg17J1g0HE_D4N073VA {
    display: flex;
    flex-direction: column;
    margin: 0 var(--nc-p-lg);
    gap: var(--nc-p-sm);
    overflow: hidden;
    flex-shrink: 0;

    .z4Uud8BNtSh3kkA6ohwd {
      font: var(--nc-type-300-medium);
      color: var(--nc-color-foreground-default);
    }

    .AMQ67YfHKlzsO7BqxmR5 {
      display: flex;
      flex-direction: column;
      gap: var(--nc-p-sm);
    }

    .w6asb28L_2cZvbvJgwkG {
      display: flex;
      padding: var(--nc-p-md);
      flex-direction: column;
      gap: var(--nc-p-lg);
      border-radius: var(--nc-border-radius-sm);
      background: var(--nc-color-background-subtle);
      color: var(--nc-color-gray-700);
      font: var(--nc-type-300-regular);

      &.Kme0GVrMfBcYfRhGkD0a {
        color: var(--nc-color-foreground-subtle);
        text-align: center;

        .oZ0gfLLHNY2L75BOvBDN {
          font: var(--nc-type-300-medium);
        }
      }
    }

    .mGAr1eCXvV6AD7cGY3bK {
      display: flex;
      gap: var(--nc-p-xs);
    }

    .Hho9Q3gTc_fiR7TZSqVC {
      display: flex;
      font: var(--nc-type-300-medium);
      gap: var(--nc-p-xs);
      align-items: center;

      .rjYNqpWz3ohfDM1MMMus {
        font-size: var(--nc-font-size-200);
      }
    }
  }
}

.KvLHS2GNdJaMrhxkUQGG {
  position: absolute;
  background: var(--nc-color-background-default);
  height: calc(100% - 70px);
  width: 100vw;
  top: 100%;
  z-index: 2000;
  transition: top 0.3s ease-in-out;
  overflow: hidden;

  &[data-state="open"] {
    top: 70px;
  }
}

@media screen and (width >= 54rem) {
  .KvLHS2GNdJaMrhxkUQGG {
    right: -432px;
    transition: right 0.3s ease-in-out;
    margin: var(--nc-p-lg);
    border-radius: var(--nc-p-sm);
    box-shadow: 0.2px 0.6px 0.7px 0 rgb(153 152 152 / 36%),
      0.6px 2px 2.3px -0.8px rgb(153 152 152 / 36%),
      1.4px 5px 5.8px -1.7px rgb(153 152 152 / 36%),
      3.5px 12.2px 14.3px -2.5px rgb(153 152 152 / 36%);
    top: 70px;
    width: 400px;
    height: calc(100% - 70px - var(--nc-size-40));

    &[data-state="open"] {
      right: 0;
    }
  }
}

