form {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.5lh;
  text-align: start;
}

label {
  display: grid;
  font-size: var(--sm);
}

input, textarea {
  padding: .5rem;
  padding-bottom: .3rem;
  border-width: 1px;
  border-color: var(--border-color);
  border-style: dotted dotted solid;
  border-bottom-width: 2px;
  outline: none;
}

input:autofill { filter: hue-rotate(195deg); }
input::placeholder { opacity: 0; }
input:focus, textarea:focus { border-style: solid; }
input:focus, input:hover, textarea:focus, textarea:hover {
  box-shadow: 0 8px 8px -4px lightgray;
  border-color: var(--border-color-accent);
}
