/* Страница входа: бумага, один лист по центру, знак Fin360 над ним. Токены из styles.css. */

.login {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 24px;
  min-height: 100vh;
  padding: 32px 16px;
}

.login__brand { display: flex; align-items: center; gap: 12px; color: var(--ink); }
.login__mark {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 3px;
  width: 40px;
  height: 40px;
  padding: 9px 8px;
  border-radius: 11px;
  background: #162324;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);
}
.login__mark i { width: 5px; border-radius: 2px; }
.login__mark i:nth-child(1) { height: 9px; background: #c8862e; }
.login__mark i:nth-child(2) { height: 15px; background: #e0ad6a; }
.login__mark i:nth-child(3) { height: 22px; background: #97c3b9; }
.login__word { font-size: 24px; font-weight: 700; letter-spacing: -0.6px; }
.login__word span { color: var(--gold); }

.login__card { width: min(400px, 100%); padding: 32px 32px 28px; }
.login__card h1 { margin-top: 6px; font-size: 28px; font-weight: 600; letter-spacing: -0.7px; }
.login__lead { margin: 6px 0 24px; color: var(--ink-muted); }

.field { display: grid; gap: 6px; margin-bottom: 14px; }
.field span { color: var(--ink-soft); font-size: 13px; font-weight: 600; }
.field input {
  height: 44px;
  padding: 0 14px;
  border: 0;
  border-radius: 10px;
  background: var(--sheet-sunk);
  box-shadow: inset 0 0 0 1px var(--rule-strong);
  color: var(--ink);
  font: 500 15px Manrope, system-ui, sans-serif;
  transition: box-shadow 150ms var(--ease-out);
}
.field input:focus { outline: none; box-shadow: inset 0 0 0 2px var(--sapphire); }

.login__error { margin: 4px 0 14px; padding: 10px 12px; border-radius: 9px; background: var(--critical-wash); color: var(--critical); font-size: 13px; font-weight: 600; }

.login__submit {
  width: 100%;
  height: 46px;
  margin-top: 6px;
  border: 0;
  border-radius: 10px;
  /* Чернила на листе: в светлой теме тёмная кнопка, в тёмной светлая */
  background: var(--ink);
  color: var(--sheet);
  font: 700 15px Manrope, system-ui, sans-serif;
  cursor: pointer;
  transition: opacity 150ms var(--ease-out), transform 100ms var(--ease-out);
}
.login__submit:hover { opacity: 0.88; }
.login__submit:active { transform: scale(0.98); }
.login__submit:disabled { opacity: 0.6; cursor: progress; }
/* Ссылка в виде той же кнопки (страница подтверждения адреса) */
.login__link { display: block; line-height: 46px; text-align: center; text-decoration: none; }
.login__link[hidden], .login__submit[hidden] { display: none; }

.login__foot { margin: 0; color: var(--ink-faint); font-size: 12px; }