style.css

:root:not([data-theme="dark"]), [data-theme="light"]  {
  --primary: hsl(196deg, 100%, 25%);
  --color: hsl(205deg, 30%, 25%);
  --h1-color: hsl(191deg, 70%, 15%);
  --muted-color: hsl(205deg, 10%, 40%);
  --font-size: 15px;
  --spacing: .75rem;
}

body > header {
  padding-bottom: 1rem;
}
h1 {
  line-height: 1;
  margin-bottom: 1rem;
}

.hidden {
  visibility: hidden;
}

footer{
  text-align: center;
}
.credits,
a.github {
  display: flex;
  gap: .25em;
  align-items: center;
  justify-content: center;
}

label {
  position: relative;
}
.inputmsg {
  position: absolute;
  right: 0;
}
.inputmsg.alert {
  color: var(--form-element-invalid-border-color);
}

progress.valid {
  --progress-color: var(--form-element-valid-border-color);
}
progress.error {
  --progress-color: var(--form-element-invalid-border-color);
}