@media (max-width: 700px), (pointer: coarse) {
  body[data-sx-page="login"] {
    place-items: start center;
    padding: 18px 12px 24px;
    background:
      radial-gradient(circle at 12% 0%, rgba(168, 85, 247, 0.18), transparent 34%),
      radial-gradient(circle at 90% 100%, rgba(232, 121, 249, 0.12), transparent 32%),
      var(--bg-0);
  }

  body[data-sx-page="login"],
  body[data-sx-page="login"] * {
    scroll-behavior: auto !important;
  }

  body[data-sx-page="login"] .aurora,
  body[data-sx-page="login"] .aurora-blob,
  body[data-sx-page="login"] .aurora-grid,
  body[data-sx-page="login"] .login-showcase::before,
  body[data-sx-page="login"] .login-showcase::after,
  body[data-sx-page="login"] .auth-card::after,
  body[data-sx-page="login"] .auth-logo::after,
  body[data-sx-page="login"] .login-shell .input-wrap::after,
  body[data-sx-page="login"] .btn-submit::before {
    display: none !important;
  }

  body[data-sx-page="login"] .login-shell,
  body[data-sx-page="login"] .login-showcase,
  body[data-sx-page="login"] .auth-card,
  body[data-sx-page="login"] .auth-logo,
  body[data-sx-page="login"] .auth-brand .x,
  body[data-sx-page="login"] .auth-panel.active,
  body[data-sx-page="login"] .auth-panel.active .form-group,
  body[data-sx-page="login"] .auth-panel.active .form-row,
  body[data-sx-page="login"] .auth-panel.active .btn-submit,
  body[data-sx-page="login"] .auth-tab.active i,
  body[data-sx-page="login"] .showcase-preview,
  body[data-sx-page="login"] .preview-bars i {
    animation: none !important;
    transition-duration: 80ms !important;
    transform: none !important;
    will-change: auto !important;
  }

  body[data-sx-page="login"] .back-home,
  body[data-sx-page="login"] .auth-card,
  body[data-sx-page="login"] .message-toast,
  body[data-sx-page="login"] .modal-overlay,
  body[data-sx-page="login"] .verify-modal {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  body[data-sx-page="login"] .auth-card {
    background: rgba(19, 16, 32, 0.97);
    box-shadow: 0 18px 44px rgba(0, 0, 0, 0.42);
    contain: layout paint;
  }

  body[data-sx-page="login"] .login-showcase {
    background: linear-gradient(145deg, rgba(25, 18, 44, 0.94), rgba(9, 7, 20, 0.95));
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.3);
    contain: layout paint;
  }

  body[data-sx-page="login"] .input-wrap,
  body[data-sx-page="login"] .input-wrapper {
    transform: none !important;
    contain: layout paint;
  }

  body[data-sx-page="login"] input,
  body[data-sx-page="login"] button {
    touch-action: manipulation;
  }

  body[data-sx-page="login"] input {
    font-size: 16px;
    -webkit-user-select: text;
    user-select: text;
  }

  body[data-sx-page="login"] .login-shell .input-wrap:focus-within {
    transform: none !important;
    box-shadow: 0 0 0 2px rgba(168, 85, 247, 0.2) !important;
  }

  body[data-sx-page="login"] .auth-tab:hover:not(.active),
  body[data-sx-page="login"] .btn-submit:hover:not(:disabled),
  body[data-sx-page="login"] .login-shell .auth-card:hover {
    transform: none !important;
  }
}