body[data-account-page="login"] .login-form-card{
  position:relative;
  overflow:hidden;
  padding:0;
  border-color:#c8ddd2;
  background:linear-gradient(180deg,#ffffff 0%,#f9fcfa 100%);
  box-shadow:0 12px 28px rgba(8,55,38,.08);
}

body[data-account-page="login"] .login-form-card::before{
  content:"";
  display:block;
  height:5px;
  background:linear-gradient(90deg,#0d6848,#1a9a68);
}

body[data-account-page="login"] .login-form-card>[data-auth-panel]{
  padding:20px;
}

.login-signin-intro{
  display:flex;
  align-items:center;
  gap:13px;
  margin-bottom:17px;
  padding-bottom:16px;
  border-bottom:1px solid #dce8e1;
}

.login-signin-badge{
  display:grid;
  place-items:center;
  flex:0 0 50px;
  width:50px;
  height:50px;
  border:1px solid #bcd8ca;
  border-radius:15px;
  background:linear-gradient(145deg,#eff8f3,#ffffff);
  box-shadow:0 7px 16px rgba(9,75,50,.08);
}

.login-signin-badge img{
  width:34px;
  height:34px;
  object-fit:contain;
}

.login-signin-copy span{
  display:block;
  margin-bottom:3px;
  color:#17805a;
  font-size:.64rem;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.login-signin-copy h3{
  margin:0 0 3px;
  color:#214d3a;
  font-size:1.28rem;
  line-height:1.1;
}

.login-signin-copy p{
  margin:0;
  color:#72837a;
  font-size:.78rem;
  line-height:1.4;
}

body[data-account-page="login"] .login-field{
  display:grid;
  gap:6px;
}

.login-field-label{
  color:#345646;
  font-size:.7rem;
  font-weight:900;
  letter-spacing:.025em;
}

.login-input-shell{
  position:relative;
  display:flex;
  align-items:center;
  min-height:48px;
  border:1px solid #b9d1c5;
  border-radius:12px;
  background:#fff;
  box-shadow:inset 0 1px 2px rgba(8,55,38,.025);
  transition:border-color .16s ease,box-shadow .16s ease,background .16s ease;
}

.login-input-shell:focus-within{
  border-color:#2b9068;
  background:#fff;
  box-shadow:0 0 0 4px rgba(24,129,90,.11);
}

.login-input-icon{
  display:grid;
  place-items:center;
  flex:0 0 42px;
  width:42px;
  height:28px;
  border-right:1px solid #e0ebe5;
  color:#317558;
}

.login-input-icon svg{
  width:17px;
  height:17px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
}

body[data-account-page="login"] .login-input-shell input{
  min-width:0;
  min-height:46px;
  padding:10px 12px;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}

body[data-account-page="login"] .login-input-shell input:focus{
  box-shadow:none;
}

.login-password-toggle{
  align-self:stretch;
  min-width:72px;
  padding:0 12px;
  border:0;
  border-left:1px solid #e0ebe5;
  border-radius:0 11px 11px 0;
  color:#176b4b;
  background:#f4faf7;
  font-family:inherit;
  font-size:.67rem;
  font-weight:900;
  cursor:pointer;
}

.login-password-toggle:hover{
  background:#e9f5ef;
}

.login-form-tools{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:1px;
}

.login-protected-note{
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:#657b70;
  font-size:.69rem;
  line-height:1.35;
}

.login-protected-dot{
  display:inline-block;
  width:8px;
  height:8px;
  border-radius:50%;
  background:#1b9867;
  box-shadow:0 0 0 4px rgba(27,152,103,.1);
}

.login-reset-link{
  color:#176b4b;
  font-size:.7rem;
  font-weight:900;
  text-decoration:none;
}

.login-reset-link:hover{
  text-decoration:underline;
}

body[data-account-page="login"] .login-submit-button{
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:100%;
  min-height:48px;
  margin-top:2px;
  padding:11px 15px 11px 17px;
  border-radius:12px;
  background:linear-gradient(135deg,#0a6344,#149664);
  box-shadow:0 10px 22px rgba(8,96,63,.2);
}

body[data-account-page="login"] .login-submit-button:hover{
  transform:translateY(-1px);
  box-shadow:0 13px 26px rgba(8,96,63,.24);
}

.login-submit-arrow{
  display:grid;
  place-items:center;
  width:27px;
  height:27px;
  border-radius:9px;
  background:rgba(255,255,255,.16);
  font-size:1rem;
}

.login-create-prompt{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  margin:15px 0 0;
  padding-top:14px;
  border-top:1px solid #dce8e1;
  color:#718279;
  font-size:.72rem;
}

.login-create-prompt a{
  color:#176b4b;
  font-weight:900;
  text-decoration:none;
}

.login-create-prompt a:hover{
  text-decoration:underline;
}

@media(max-width:640px){
  body[data-account-page="login"] .login-form-card>[data-auth-panel]{padding:17px}
  .login-form-tools{align-items:flex-start;flex-direction:column;gap:7px}
  .login-password-toggle{min-width:66px;padding:0 9px}
}