/* V268 login polish: a consistent creator signature and a calm, premium form. */
.login-stage { width: min(100%, 480px); gap: 23px; }
.login-brand { gap: 15px; }
.brand-copy { gap: 5px; }
.brand-copy b { font-size: 17px; letter-spacing: .13em; }
.brand-copy small { line-height: 1.5; }
.brand-copy .brand-credit {
  color: #829bb3;
  font-size: 9px;
  font-weight: 600;
  letter-spacing: .045em;
  margin-top: 3px;
}
.login-card {
  border-color: rgba(111, 190, 240, .23);
  background:
    radial-gradient(ellipse at 50% 0%, rgba(80, 154, 255, .12), transparent 58%),
    linear-gradient(150deg, rgba(14, 31, 51, .985), rgba(6, 16, 29, .99));
  box-shadow: 0 34px 110px rgba(0,0,0,.48), inset 0 1px rgba(255,255,255,.06);
}
.login-card-header > p:last-child { line-height: 1.7; }
.field-shell { transition: border-color .16s ease, box-shadow .16s ease, background-color .16s ease; }
.field-shell:focus-within { background-color: #0a1a2a; }
.login-submit { transition: transform .16s ease, filter .16s ease, box-shadow .16s ease; }
.login-submit:hover { box-shadow: 0 18px 46px rgba(52,178,255,.28); }
.login-footer { flex-wrap: wrap; text-align: center; }
@media (max-width: 600px) {
  .login-stage { gap: 20px; padding-top: max(22px, env(safe-area-inset-top)); }
  .login-brand { max-width: 100%; }
  .brand-copy b { font-size: 14px; }
  .brand-copy small { font-size: 6.5px; }
  .brand-copy .brand-credit { font-size: 8px; }
  .login-card { padding-top: 28px; }
}
@media (prefers-reduced-motion: reduce) {
  .field-shell, .login-submit { transition: none; }
}

/* V2687: elevated sign-in surface with clearer hierarchy and tactile controls. */
.login-stage {
  width: min(100%, 492px);
  gap: 25px;
}
.login-brand {
  width: min(100%, 420px);
  padding: 0 7px;
}
.brand-logo {
  box-shadow: 0 0 0 1px rgba(108, 220, 255, .12), 0 12px 34px rgba(0, 0, 0, .32), 0 0 28px rgba(46, 199, 222, .1);
}
.brand-copy b {
  text-shadow: 0 2px 18px rgba(175, 222, 255, .12);
}
.brand-copy .brand-credit {
  color: #9db3c9;
  letter-spacing: .065em;
}
.login-card {
  padding: 34px 32px 27px;
  border-radius: 27px;
  border-color: rgba(121, 193, 236, .25);
  background:
    radial-gradient(ellipse at 50% -5%, rgba(77, 171, 255, .17), transparent 54%),
    radial-gradient(ellipse at 100% 100%, rgba(127, 91, 238, .08), transparent 43%),
    linear-gradient(148deg, rgba(14, 31, 51, .985), rgba(7, 17, 31, .995) 68%);
  box-shadow: 0 38px 100px rgba(0, 0, 0, .48), 0 10px 32px rgba(17, 112, 173, .1), inset 0 1px rgba(255, 255, 255, .075);
}
.card-accent { height: 2px; opacity: .95; }
.login-card-header { margin-bottom: 23px; }
.login-symbol {
  border-color: rgba(114, 190, 255, .23);
  background: linear-gradient(145deg, rgba(26, 58, 92, .78), rgba(9, 26, 46, .9));
  box-shadow: 0 8px 28px rgba(26, 132, 226, .16), inset 0 1px rgba(255, 255, 255, .08);
}
.login-card-header h1 { letter-spacing: -.035em; }
.login-card-header > p:last-child { max-width: 34ch; color: #a8b9cc; }
.security-chip {
  border-color: rgba(61, 205, 163, .2);
  background: linear-gradient(100deg, rgba(31, 142, 117, .14), rgba(19, 73, 75, .2));
  box-shadow: inset 0 1px rgba(255, 255, 255, .035);
}
.field-label { display: block; }
.field-label > span {
  color: #9eb1c5;
  font-size: 9px;
  letter-spacing: .12em;
}
.field-shell {
  min-height: 60px;
  border-color: rgba(123, 163, 199, .19);
  border-radius: 15px;
  background: linear-gradient(135deg, rgba(4, 15, 28, .82), rgba(9, 23, 39, .92));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025), 0 5px 16px rgba(0, 0, 0, .08);
}
.field-shell:focus-within {
  border-color: rgba(72, 207, 235, .72);
  box-shadow: 0 0 0 3px rgba(51, 191, 220, .11), inset 0 1px 0 rgba(255, 255, 255, .04);
}
.field-shell input { font-size: 15px; }
.field-shell input::placeholder { color: #d0d9e5; opacity: .88; }
.field-shell button:focus-visible,
.login-submit:focus-visible,
.remember input:focus-visible + span {
  outline: 2px solid #68d7f0;
  outline-offset: 3px;
}
.login-options { margin: 19px 0 20px; }
.login-submit {
  min-height: 58px;
  border: 1px solid rgba(255, 255, 255, .17);
  background: linear-gradient(105deg, #42d0e7 0%, #5c9eff 52%, #9a72f4 100%);
  box-shadow: 0 12px 30px rgba(71, 137, 255, .2), inset 0 1px rgba(255, 255, 255, .28);
  letter-spacing: .01em;
}
.login-submit:hover { filter: saturate(1.08) brightness(1.045); }
.login-submit:active { transform: translateY(0) scale(.99); }
.login-status {
  margin-top: 21px;
  padding-top: 17px;
  border-color: rgba(133, 171, 204, .13);
}
.login-status > span { color: #a5b8c9; }
.login-footer { color: #71869c; letter-spacing: .025em; }
@media (max-width: 600px) {
  .login-stage { gap: 21px; }
  .login-brand { padding-inline: 2px; }
  .login-card { padding: 29px 21px 23px; border-radius: 24px; }
  .login-card-header { margin-bottom: 20px; }
  .field-shell { min-height: 58px; }
}
@media (max-width: 380px) {
  .login-stage { padding-inline: 12px; }
  .login-card { padding-inline: 17px; }
  .brand-copy b { letter-spacing: .09em; }
  .brand-copy .brand-credit { letter-spacing: .025em; }
}
@media (prefers-reduced-motion: reduce) {
  .field-shell, .login-submit { transition: none; }
}