/* Экран входа. Единственный экран, который видит незнакомый человек, поэтому
   он нарочно короткий: одно поле и одна кнопка. Поле крупное — набирают его
   пальцем, часто в кабине и часто на ходу. */

header.top h1.wordmark {
  font-size: clamp(20px, 6.4vw, 26px);
  letter-spacing: -0.02em;
  white-space: nowrap;
  margin: 0;
}

#form { padding: 14px 16px 4px; display: grid; gap: 14px; }

.auth-field { display: grid; gap: 6px; }
.auth-field label { font-size: 14px; font-weight: 600; color: var(--ink-2); }
.auth-field input {
  min-height: var(--tap);
  padding: 0 12px;
  font: inherit;
  font-size: 17px;
  color: var(--ink);
  background: var(--page);
  border: 1.5px solid var(--line);
  border-radius: 8px;
  width: 100%;
}
.auth-field input:focus { border-color: var(--sign); }
.auth-hint { margin: 0; font-size: 13px; color: var(--ink-3); }

.auth-submit {
  min-height: var(--tap);
  width: 100%;
  background: var(--sign);
  border-color: var(--sign);
  color: var(--sign-ink);
  font-size: 17px;
}
.auth-submit[disabled] { opacity: 0.6; }

.inline-error[hidden] { display: none; }