body.login {
  background: #111214;
  color: #f2f0e9;
  font: 16px/1.8 system-ui,"Microsoft YaHei","PingFang SC",sans-serif;
}
#login { width: min(400px, calc(100% - 24px)); padding: 6vh 0 30px; }
.login h1 a { background-size: 72px; background-position: center; width: 100%; height: 80px; }
.login form { background: #1b1d21; border: 1px solid #34363b; border-radius: 10px; box-shadow: none; padding: 24px; }
.login label { font-size: 15px; color: #d0cfce; }
.login input[type=text], .login input[type=password], .login input[type=email] {
  font-size: 18px;
  background: #121315;
  border-color: #55565c;
  color: #f2f0e9;
  min-height: 46px;
  border-radius: 5px;
}
.login form .input { margin-top: 7px; }
.login form .cf-turnstile, .login form .h-captcha { clear: both; margin: 16px 0 20px; max-width: 100%; }
.login .button-primary { background: #dfb76a; border-color: #dfb76a; color: #151515; min-height: 44px; padding: 5px 22px; font-size: 15px; font-weight: 600; text-shadow: none; }
.login .button-primary:hover { background: #f1d198; border-color: #f1d198; color: #151515; }
.login .button-secondary { color: #dfb76a; }
.login #nav a, .login #backtoblog a, .login .privacy-policy-link { color: #dfb76a; font-size: 14px; }
.login #login_error, .login .message, .login .success { background: #24211b; border-color: #dfb76a; color: #e1d1b4; font-size: 14px; }
.login .language-switcher select { background: #1b1d21; color: #f2f0e9; border-color: #55565c; font-size: 14px; }
.login :focus-visible { outline: 3px solid #dfb76a; outline-offset: 3px; }
.login .wp-pwd button { min-width: 44px; min-height: 44px; }
.login input[type=checkbox] { background: #111214; border-color: #77715e; }
.login input[type=checkbox]:checked:before { filter: grayscale(1) brightness(1.8); }
.login-action-register #reg_passmail { display: none; }
/* Flexible Turnstile is at least 300px wide; never squash its iframe. */
@media (max-width: 480px) {
  #login { padding-top: 4vh; }
  .login form { padding: 22px 14px; }
}
@media (max-width: 359px) {
  #login { width: calc(100% - 8px); }
  .login form { padding-inline: 3px; }
  .login #nav, .login #backtoblog { padding-inline: 8px; }
}
