/* A focused sign-in surface; shared workspace and invitation styling is untouched. */
.login-screen {
  min-height: 100svh;
  display: grid;
  place-items: center;
  padding: 40px 24px;
  background: #f7f8fa;
  color: #18283f;
}
.login-card {
  width: min(100%, 440px);
  padding: 40px;
  background: #fff;
  border: 1px solid #e3e8ef;
  border-radius: 18px;
  box-shadow: 0 8px 32px rgb(24 40 63 / 5%);
}
.login-card .form-container { max-width: none; }
.login-card h1 { font-size: 32px; font-weight: 700; line-height: 1.25; letter-spacing: -1.2px; }
.login-card .form-intro { margin: 12px 0 30px; color: #64728a; font-size: 14px; line-height: 1.65; }
.login-card .form-field { margin-bottom: 22px; }
.login-card .form-field label { margin: 0 0 9px; color: #25364e; font-size: 13px; font-weight: 600; }
.login-card .input-well {
  min-height: 52px;
  gap: 12px;
  padding: 0 14px;
  background: #fff;
  border: 1px solid #dbe2ec;
  border-radius: 12px;
  box-shadow: none;
}
.login-card .input-well:focus-within { border-color: #ce2533; box-shadow: 0 0 0 3px rgb(206 37 51 / 8%); }
.login-card .input-well input { height: 50px; color: #18283f; font-size: 14px; font-weight: 400; background: #fff; }
.login-card .input-well input::placeholder { color: #8792a4; }
.login-card .input-well input:autofill {
  box-shadow: 0 0 0 1000px #fff inset;
  color: #18283f;
  caret-color: #18283f;
}
.login-card .input-well input:-webkit-autofill,
.login-card .input-well input:-webkit-autofill:hover,
.login-card .input-well input:-webkit-autofill:focus,
.login-card .input-well input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 1000px #fff inset;
  -webkit-text-fill-color: #18283f;
  caret-color: #18283f;
}
.login-card .visibility-toggle { width: 36px; height: 44px; }
.login-card .form-options { margin: -4px 0 22px; }
.login-card .remember-label, .login-card .text-button { min-height: 44px; font-size: 12px; font-weight: 500; }
.login-card .checkbox-face { background: #fff; box-shadow: none; border-color: #cbd4e1; }
.login-card .sign-in-button { min-height: 52px; border: 0; border-radius: 12px; box-shadow: none; font-size: 14px; font-weight: 600; }
.login-card .sign-in-button:hover { box-shadow: none; transform: none; background: #b71f2c; }
.login-card .sign-in-button:disabled { opacity: .55; cursor: wait; }
.login-card .form-notice { background: #fff5f6; border-color: #f2d8dc; }
.login-card .field-error { font-size: 12px; line-height: 1.6; }
.login-card .input-well.invalid { border-color: #ce2533; }
.login-card .login-access-row {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 6px;
  margin: 20px 0 0;
  color: #64728a;
  font-size: 12px;
  line-height: 1.6;
}
.login-card .login-contact-button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 44px;
  padding: 0 4px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #ce2533;
  font-size: 12px;
  font-weight: 600;
}
.login-card .login-contact-button:hover { color: #b71f2c; text-decoration: underline; text-underline-offset: 4px; }
.login-screen .support-dialog { background: #fff; border-color: #e3e8ef; border-radius: 18px; }
@media (max-width: 480px) {
  .login-screen { padding: 24px 20px; background: #fff; }
  .login-card { padding: 16px 0; border: 0; box-shadow: none; }
  .login-card h1 { font-size: 30px; }
  .login-card .input-well input { font-size: 16px; }
}