.authentication-page {
  container-type: inline-size;
  display: grid;
  min-height: 50vh;
  place-items: center;

  a {
    margin-right: 1rem;
  }

  form {
    display: grid;
    gap: 1rem;
    grid-template-columns: 6rem 1fr;
    max-width: 32rem;
    width: 100%;

    > * {
      min-width: 0;
      overflow-wrap: anywhere;
    }

    .error-message {
      grid-column: 1 / -1;
    }

    label {
      align-self: center;
    }

    input[type="text"],
    input[type="email"],
    input[type="password"] {
      box-sizing: border-box;
      height: fit-content;
      width: 100%;
    }

    h1,
    input[type="submit"] {
      grid-column: 2;
      justify-self: start;
    }

    br {
      display: none;
    }

  }
}

@container (max-width: 32rem) {
  .authentication-page form {
    grid-template-columns: minmax(0, 1fr);

    h1,
    input[type="submit"] {
      grid-column: 1;
    }
  }
}
