@media (max-width: 900px) {
  html, body { overflow-x: clip; }
  body { background-color: #0d0d14; }

  .auth-page {
    flex-direction: column;
    min-height: 100vh;
    min-height: 100dvh;
    background-color: #0d0d14;
    background-image:
      radial-gradient(circle at 15% 0%, rgba(var(--kv-accent-rgb, 108,71,255), .16), transparent 45%),
      radial-gradient(circle at 90% 100%, rgba(76,110,245,.10), transparent 50%);
  }

  .auth-left {
    display: flex !important;
    flex: 0 0 auto;
    max-width: none;
    padding: calc(env(safe-area-inset-top, 0px) + 28px) 20px 0;
    align-items: center;
  }
  .auth-left > *:not(.logo) { display: none !important; }
  .auth-left .logo { margin: 0; font-size: calc(21px * var(--kv-text, 1)); }

  .auth-right {
    flex: 1 0 auto;
    background: transparent;
    padding: 22px 16px calc(env(safe-area-inset-bottom, 0px) + 28px);
    align-items: flex-start;
  }
  .auth-form-box {
    max-width: 440px;
    margin: 0 auto;
    padding: 26px 20px !important;
    border-radius: 16px !important;
  }
  .auth-form-box h2 { font-size: calc(24px * var(--kv-text, 1)) !important; }
  .auth-form-box .subtitle { margin-bottom: 22px; line-height: 1.5; }

  label { font-size: calc(13.5px * var(--kv-text, 1)); }
  .input-wrap { margin-bottom: 16px; }
  .input-wrap input,
  .input-wrap select {
    height: 50px;
    padding-top: 0;
    padding-bottom: 0;
    font-size: 16px !important;
    border-radius: 10px;
  }
  .input-wrap input.has-icon { padding-left: 44px; }
  .input-wrap .input-icon { left: 14px; }
  .input-wrap input.has-icon[id="password"] { padding-right: 52px; }
  .toggle-password {
    right: 4px;
    width: 44px;
    height: 44px;
    justify-content: center;
    padding: 0;
  }
  .toggle-password i { width: 20px; height: 20px; }

  .remember-row {
    flex-wrap: wrap;
    gap: 6px 12px;
    margin-bottom: 14px;
  }
  .remember-label { min-height: 44px; font-size: calc(14px * var(--kv-text, 1)); }
  .remember-label input[type="checkbox"],
  .terms-checkbox-row input[type="checkbox"] { width: 20px; height: 20px; }
  .remember-row a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    font-size: calc(14px * var(--kv-text, 1));
  }

  .terms-checkbox-row { gap: 12px; margin-bottom: 14px; align-items: flex-start; }
  .terms-checkbox-row input[type="checkbox"] { margin-top: 1px; }
  .terms-checkbox-row label { margin-bottom: 0; line-height: 1.55; font-size: calc(13.5px * var(--kv-text, 1)); }
  .terms-checkbox-row label a { text-decoration: underline; text-underline-offset: 2px; }

  .error { min-height: 20px; line-height: 1.45; font-size: calc(13.5px * var(--kv-text, 1)); }
  button.submit-btn {
    min-height: 52px;
    border-radius: 10px;
    font-size: calc(16px * var(--kv-text, 1));
  }
  .switch-auth { margin-top: 18px; line-height: 1.6; }
}

@media (max-width: 900px) and (max-height: 560px) {
  .auth-left { padding-top: 14px; }
  .auth-right { padding-top: 14px; }
}