/* Allow tablet keyboards, browser chrome, and zoom without clipping forms. */
body {
  box-sizing: border-box;
  height: auto;
  min-height: 100dvh;
  padding: max(20px, env(safe-area-inset-top, 0px)) max(16px, env(safe-area-inset-right, 0px)) max(20px, env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px));
}
.login-container, .signup-container { box-sizing: border-box; max-width: 100%; }
.login-container { width: 360px; margin: auto; }
.signup-container { max-width: 800px; }
.form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.form-section { min-width: 0; }
input, select, textarea, button { box-sizing: border-box; font-size: 16px; min-height: 44px; }
button, a { touch-action: manipulation; }
input[type="checkbox"], input[type="radio"] { min-height: 20px; width: 20px; height: 20px; }
@media (max-width: 768px) {
  .signup-container { max-width: 100%; padding: 20px; margin: 0; }
  .form-grid { grid-template-columns: minmax(0, 1fr); }
}