.overlay {
  position: fixed;
  inset: 0;
  z-index: 5;
  background: color-mix(in srgb, var(--color-neutral-1) 80%, transparent);
}

.content {
  position: fixed;
  inset-inline: 0;
  bottom: 0;
  z-index: 5;
  margin-top: 192px;
  display: flex;
  height: auto;
  flex-direction: column;
  border-radius: var(--radius-3) var(--radius-3) 0 0;
  border: var(--border-size-1) solid var(--color-neutral-6);
  background: var(--color-neutral-3);
  color: var(--color-neutral-11);
}

.handle {
  margin: var(--space-2) auto;
  height: 8px;
  width: 96px;
  border-radius: var(--radius-round);
  background: var(--color-neutral-7);
  cursor: row-resize;
}

.handle:hover {
  background: var(--color-neutral-8);
}

.header {
  display: grid;
  gap: var(--space-1);
  padding: var(--space-4) 0;
  text-align: left;
}

.footer {
  margin-top: auto;
  display: flex;
  justify-content: flex-end;
  gap: var(--space-2);
  padding-block-end: var(--space-6);
  padding-block-start: var(--space-4);
}

.title {
}

.description {
}