.purchase-dialog {
  margin: auto;
  padding: var(--space-2xl);
  max-width: min(calc(100% - var(--space-2xl)), var(--layout-reading-inline-size-max));
  max-height: calc(100% - var(--space-2xl));
  overflow: auto;
  border: var(--line-width-default) solid rgb(var(--color-gray-500));
  border-radius: var(--radius-lg);
  color: rgb(var(--color-gray-900));
  background: rgb(var(--color-white));
}

.purchase-dialog[open] {
  display: grid;
  gap: var(--space-md);
}

.purchase-dialog p {
  overflow-wrap: anywhere;
}

.purchase-dialog::backdrop {
  background: rgb(var(--color-gray-500));
}