/* -------------- Login layout -------------- */
/* --------------
The sign in page is one centered column. It centers inside a box shorter than
the window rather than inside the window itself, which lifts the whole group off
dead center by half the difference — the shortfall is stated as twice the lift
so the number in the file is the number on the screen. Shortening the box rather
than padding the bottom of a full height one is what keeps the page from growing
a scrollbar to hold space nobody sees.
-------------- */
.login {
  min-block-size: calc(100vh - (var(--nn-space-8x19) * 2));
}

/* -------------- Login heading -------------- */
/* --------------
The heading is the only thing on the page that changes height: it asks a
question at rest and reports a failure after a bad attempt, and the failure is
the longer sentence. It reserves the taller of the two up front so the field and
the button never move between the two states.

The reserve is stated in lh, which is the heading's own line box, so it stays
correct if the type role is retuned. Two lines is enough once the measure is
capped, and three below the compact threshold, where the same sentence needs the
extra one. The text sits at the top of the reserved box rather than centered in
it, which is what keeps the gap above the heading the same in both states.
-------------- */
.login__heading {
  min-block-size: 3lh;
  max-inline-size: var(--nn-content-max-narrow);
}

@media (min-width: 576px) {
  .login__heading {
    min-block-size: 2lh;
  }
}

/* -------------- Login field error -------------- */
/* --------------
The field is put into the system's own error state through the component's error
attribute, which is what marks the input invalid and recolors its outline and
fill. That attribute also writes a message under the field, and here the heading
is already saying it — so the message is hidden rather than dropped. Hiding it
this way keeps it in the accessible description the component wired up, so the
field still explains itself to a screen reader while a sighted reader sees the
sentence once.
-------------- */
.login .nn-field-input__error {
  display: none;
}