dialog {
  max-width: min(calc(100% - 4rem), 640px);
  height: fit-content;
  max-height: calc(100% - 4rem);
  padding: 1rem;
  border: var(--bd-muted);
  border-radius: calc(2 * var(--bd-radius));
  background: var(--bg-default);
  box-shadow: var(--shadow);
  color: inherit;
}

dialog > header:first-child {
  padding: 0 1rem 1rem;
  border-bottom: 1px solid var(--bd-muted);
  margin-right: -1rem;
  margin-left: -1rem;
}

dialog > header:first-child > :is(h1, h2) {
  font-size: 1.25rem;
}

dialog > footer:last-child {
  padding: 1rem 1rem 0;
  border-top: 1px solid var(--bd-muted);
  margin: 0 -1rem;
}

dialog > footer:last-child > form[method="dialog"] {
  padding: 0;
  margin: 0;
  background: none;
}

dialog::backdrop {
  background: var(--backdrop);
}