body > #grid .form {
  /** Required arguments with purportedly ridiculous defaults */
  --element-gap: 200px;
  --element-gap-small: 100px;

  /** Optional arguments with sensible defaults */
  --element-pseudolink-underline-style: none;
  --element-pseudolink-underline-width: 0;
  --element-pseudolink-underline-offset: 0;

  & details.form {
    --element-gap: var(--element-gap-small);
  }

  &:not(details),
  &:is(details)::details-content {
    display: flex;
    gap: var(--element-gap);
    flex-wrap: wrap;
    align-items: baseline;
    text-align: start;

    > *,
    > :is(fieldset, details) > *:not(input[type='datetime-local']) {
      width: 100%;
      min-width: 0;
      max-width: 100%;
    }

    > input[type='submit'],
    > label {
      white-space: nowrap;
      width: min-content;
    }

    & ul[data-errors-of]:empty {
      display: none;
    }

    > details {
      > summary {
        text-decoration-line: underline;
        text-decoration-style: var(--element-pseudolink-underline-style);
        text-decoration-thickness: var(--element-pseudolink-underline-width);
        text-underline-offset: var(--element-pseudolink-underline-offset);
      }
    }

    > fieldset {
      > dl {
        display: grid;
        gap: var(--element-gap-small);
        grid-template-columns: min-content 1fr;
        align-items: start;
        word-wrap: break-word;
        word-break: break-word;
      }
    }

    > fieldset:has(input[name='username']) {
      display: none;
    }
  }
}