@layer components {
  @keyframes _rotate_10gj0_1 {
    to {
      rotate: 90deg;
    }
  }
  ._root_10gj0_8 {
    background-color: var(--color-wild-sand);
    border-radius: var(--border-radius);
    padding: .75rem;
  }
  @media (any-hover: hover) and (prefers-reduced-motion: no-preference) {
    @media (any-hover: hover) {
      ._root_10gj0_8:where(:hover) svg {
        animation: .2s forwards _rotate_10gj0_1;
      }
    }
  }
  ._root_10gj0_8 :where(svg) {
    inline-size: 1rem;
  }
  ._overlay_zruho_6,
  ._content_zruho_7 {
    z-index: 1;
    view-transition-class: drawer;
    position: fixed;
    inset: 0;
  }
  @keyframes _fade-in_zruho_1 {
    0% {
      opacity: 0;
    }
    60% {
      opacity: 1;
    }
    to {
      opacity: 1;
    }
  }
  @keyframes _fade-out_zruho_1 {
    0% {
      opacity: 1;
    }
    60% {
      opacity: 0;
    }
    to {
      opacity: 0;
    }
  }
  ._overlay_zruho_6 {
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    background-color: #00000080;
    animation-duration: .5s;
    animation-timing-function: linear;
    animation-fill-mode: both;
  }
  ._overlay_zruho_6:where([data-state=open]) {
    animation-name: _fade-in_zruho_1;
  }
  ._overlay_zruho_6:where([data-state=closed]) {
    animation-name: _fade-out_zruho_1;
  }
  @keyframes _slide-in_zruho_1 {
    0% {
      translate: var(--x) var(--y);
    }
    to {
      translate: none;
    }
  }
  @keyframes _slide-out_zruho_1 {
    0% {
      translate: none;
    }
    to {
      translate: var(--x) var(--y);
    }
  }
  ._content_zruho_7,
  ._container_zruho_79 {
    grid-auto-columns: 100%;
    display: grid;
  }
  ._content_zruho_7 {
    --width:100%;
    --offset:0rem;
    inline-size: min(100%, calc(var(--width) + var(--offset) * 2));
    isolation: isolate;
    animation-duration: .5s;
    animation-timing-function: linear;
    animation-fill-mode: both;
  }
  @media (width >= 64rem) {
    ._content_zruho_7 {
      --width:28.125rem;
      --offset:1rem;
    }
  }
  @media (prefers-reduced-motion: no-preference) {
    ._content_zruho_7 {
      animation-timing-function: cubic-bezier(.32, .72, 0, 1);
    }
  }
  ._content_zruho_7:where([data-state=open]) {
    animation-name: _fade-in_zruho_1;
  }
  @media (prefers-reduced-motion: no-preference) {
    ._content_zruho_7:where([data-state=open]) {
      animation-name: _slide-in_zruho_1;
    }
  }
  ._content_zruho_7:where([data-state=closed]) {
    animation-name: _fade-in_zruho_1;
  }
  @media (prefers-reduced-motion: no-preference) {
    ._content_zruho_7:where([data-state=closed]) {
      animation-name: _slide-out_zruho_1;
    }
  }
  ._content_zruho_7:where([data-animation-origin=top]) {
    --x:0;
    --y:-100%;
    inset-block-end: auto;
  }
  ._content_zruho_7:where([data-animation-origin=right]) {
    --x:100%;
    --y:0;
    inset-inline-start: auto;
  }
  ._content_zruho_7:where([data-animation-origin=bottom]) {
    --x:0;
    --y:100%;
    inset-block-start: auto;
  }
  ._content_zruho_7:where([data-animation-origin=left]) {
    --x:-100%;
    --y:0;
    inset-inline-end: auto;
  }
  ._content_zruho_7:before {
    z-index: 2;
    pointer-events: none;
    content: "";
    opacity: 0;
    background-color: #fff;
    transition: opacity .2s linear;
    position: absolute;
    inset: 0;
  }
  @media (width >= 64rem) {
    ._content_zruho_7:before {
      border-radius: var(--border-radius);
      margin: 1rem;
    }
  }
  ._content_zruho_7:where([aria-busy=true]):before {
    pointer-events: auto;
    opacity: .5;
  }
  ._container_zruho_79 {
    margin: var(--offset);
    scrollbar-color: var(--color-scrollbar) transparent;
    scrollbar-width: thin;
    background-color: #fff;
    grid-template-rows: min-content 1fr min-content;
    display: grid;
    overflow-y: auto;
    translate: 0;
  }
  @media (width >= 64rem) {
    ._container_zruho_79 {
      border-radius: var(--border-radius);
    }
  }
  ._container_zruho_79::-webkit-scrollbar {
    inline-size: .625rem;
  }
  ._container_zruho_79::-webkit-scrollbar-thumb {
    background-color: var(--color-scrollbar);
    border-radius: var(--border-radius);
    border: .125rem solid #fff;
  }
  ._header_zruho_194,
  ._body_zruho_195,
  ._footer_zruho_196 {
    padding-inline: var(--drawer-gutter);
  }
  ._header_zruho_194 {
    z-index: 1;
    border-block-end: 1px solid var(--color-border);
    background-color: #fff;
    align-items: center;
    min-block-size: 4rem;
    padding-block: .75rem;
    padding-inline-end: .75rem;
    display: flex;
    position: sticky;
    inset-block-start: 0;
  }
  ._title_zruho_213 {
    font-size: var(--font-size-sm);
    font-weight: 600;
    line-height: var(--line-height-sm);
  }
  ._body_zruho_195 {
    padding-block: 1.5rem;
  }
  ._footer_zruho_196 {
    border-block-start: 1px solid var(--color-border);
    background-color: #fff;
    justify-content: space-between;
    align-items: center;
    column-gap: .5rem;
    padding-block: 1.25rem;
    display: flex;
    position: sticky;
    inset-block-end: 0;
  }
  ._footer_zruho_196 > :only-child {
    flex: 1;
    max-inline-size: none;
  }
  ._close_zruho_240 {
    margin-inline-start: auto;
  }
}
::view-transition-group(.drawer) {
  z-index: 1;
}