diff --git a/app/assets/javascripts/preferences/panes/account/offlineSubscription.tsx b/app/assets/javascripts/preferences/panes/account/offlineSubscription.tsx
index 360aa40d0..b9d8b80b3 100644
--- a/app/assets/javascripts/preferences/panes/account/offlineSubscription.tsx
+++ b/app/assets/javascripts/preferences/panes/account/offlineSubscription.tsx
@@ -23,7 +23,7 @@ export const OfflineSubscription: FunctionalComponent<IProps> = observer(({ appl
   const [hasUserPreviouslyStoredCode, setHasUserPreviouslyStoredCode] = useState(false);
 
   useEffect(() => {
-    if (application.getIsOfflineActivationCodeStoredPreviously()) {
+    if (application.hasOfflineRepo()) {
       setHasUserPreviouslyStoredCode(true);
     }
   }, [application]);
@@ -35,7 +35,7 @@ export const OfflineSubscription: FunctionalComponent<IProps> = observer(({ appl
   const handleSubscriptionCodeSubmit = async (event: TargetedEvent<HTMLFormElement, Event>) => {
     event.preventDefault();
 
-    const result = await application.setOfflineFeatures(activationCode);
+    const result = await application.setOfflineFeaturesCode(activationCode);
 
     if (result?.error) {
       await application.alertService.alert(result.error);
@@ -47,7 +47,7 @@ export const OfflineSubscription: FunctionalComponent<IProps> = observer(({ appl
   };
 
   const handleRemoveOfflineKey = async () => {
-    await application.removeOfflineActivationCode();
+    await application.deleteOfflineFeatureRepo();
 
     setIsSuccessfullyActivated(false);
     setHasUserPreviouslyStoredCode(false);
diff --git a/app/assets/javascripts/purchaseFlow/PurchaseFlowView.tsx b/app/assets/javascripts/purchaseFlow/PurchaseFlowView.tsx
index d412e871d..e843af206 100644
--- a/app/assets/javascripts/purchaseFlow/PurchaseFlowView.tsx
+++ b/app/assets/javascripts/purchaseFlow/PurchaseFlowView.tsx
@@ -34,9 +34,9 @@ export const PurchaseFlowView: FunctionComponent<PurchaseFlowViewProps> =
     const { currentPane } = appState.purchaseFlow;
 
     return (
-      <div className="flex items-center justify-center h-full w-full absolute top-left-0 z-index-purchase-flow bg-grey-2">
-        <div style={{maxWidth: '100%', overflow: 'scroll'}} className="relative fit-content">
-          <div style={{overflow: 'scroll'}} className="relative p-12 mb-4 bg-default border-1 border-solid border-main rounded">
+      <div className="flex items-center justify-center overflow-hidden h-full w-full absolute top-left-0 z-index-purchase-flow bg-grey-2">
+        <div className="relative fit-content">
+          <div className="relative p-12 xs:px-8 mb-4 bg-default border-1 border-solid border-main rounded xs:rounded-0">
             <SNLogoFull className="mb-5" />
             <PurchaseFlowPaneSelector
               currentPane={currentPane}
@@ -44,7 +44,7 @@ export const PurchaseFlowView: FunctionComponent<PurchaseFlowViewProps> =
               application={application}
             />
           </div>
-          <div className="flex justify-end">
+          <div className="flex justify-end xs:px-4">
             <a
               className="mr-3 font-medium color-grey-1"
               href="https://standardnotes.com/privacy"
diff --git a/app/assets/javascripts/purchaseFlow/panes/CreateAccount.tsx b/app/assets/javascripts/purchaseFlow/panes/CreateAccount.tsx
index 39842ba35..32be3d6aa 100644
--- a/app/assets/javascripts/purchaseFlow/panes/CreateAccount.tsx
+++ b/app/assets/javascripts/purchaseFlow/panes/CreateAccount.tsx
@@ -33,7 +33,7 @@ export const CreateAccount: FunctionComponent<Props> = observer(
     const confirmPasswordInputRef = useRef<HTMLInputElement>(null);
 
     useEffect(() => {
-      if (emailInputRef.current) emailInputRef.current!.focus();
+      if (emailInputRef.current) emailInputRef.current?.focus();
     }, []);
 
     const handleEmailChange = (e: Event) => {
@@ -69,30 +69,30 @@ export const CreateAccount: FunctionComponent<Props> = observer(
 
     const handleCreateAccount = async () => {
       if (!email) {
-        emailInputRef?.current!.focus();
+        emailInputRef?.current?.focus();
         return;
       }
 
       if (!isEmailValid(email)) {
         setIsEmailInvalid(true);
-        emailInputRef?.current!.focus();
+        emailInputRef?.current?.focus();
         return;
       }
 
       if (!password) {
-        passwordInputRef?.current!.focus();
+        passwordInputRef?.current?.focus();
         return;
       }
 
       if (!confirmPassword) {
-        confirmPasswordInputRef?.current!.focus();
+        confirmPasswordInputRef?.current?.focus();
         return;
       }
 
       if (password !== confirmPassword) {
         setConfirmPassword('');
         setIsPasswordNotMatching(true);
-        confirmPasswordInputRef?.current!.focus();
+        confirmPasswordInputRef?.current?.focus();
         return;
       }
 
@@ -128,7 +128,7 @@ export const CreateAccount: FunctionComponent<Props> = observer(
         <BlueDot className="absolute w-4 h-4 bottom-25% -right-10" />
         <Diamond className="absolute w-18 h-18 top-0 -right-2 translate-x-1/2 -z-index-1" />
 
-        <div className="mr-12">
+        <div className="mr-12 md:mr-0">
           <h1 className="mt-0 mb-2 text-2xl">Create your free account</h1>
           <div className="mb-4 font-medium text-sm">
             to continue to Standard Notes.
@@ -136,7 +136,9 @@ export const CreateAccount: FunctionComponent<Props> = observer(
           <form onSubmit={handleCreateAccount}>
             <div className="flex flex-col">
               <FloatingLabelInput
-                className={`min-w-90 ${isEmailInvalid ? 'mb-2' : 'mb-4'}`}
+                className={`min-w-90 xs:min-w-auto ${
+                  isEmailInvalid ? 'mb-2' : 'mb-4'
+                }`}
                 id="purchase-sign-in-email"
                 type="email"
                 label="Email"
@@ -152,7 +154,7 @@ export const CreateAccount: FunctionComponent<Props> = observer(
                 </div>
               ) : null}
               <FloatingLabelInput
-                className="min-w-90 mb-4"
+                className="min-w-90 xs:min-w-auto mb-4"
                 id="purchase-create-account-password"
                 type="password"
                 label="Password"
@@ -162,7 +164,7 @@ export const CreateAccount: FunctionComponent<Props> = observer(
                 disabled={isCreatingAccount}
               />
               <FloatingLabelInput
-                className={`min-w-90 ${
+                className={`min-w-90 xs:min-w-auto ${
                   isPasswordNotMatching ? 'mb-2' : 'mb-4'
                 }`}
                 id="create-account-confirm"
@@ -181,16 +183,25 @@ export const CreateAccount: FunctionComponent<Props> = observer(
               ) : null}
             </div>
           </form>
-          <div className="flex justify-between">
-            <button
-              onClick={handleSignInInstead}
-              disabled={isCreatingAccount}
-              className="p-0 bg-default border-0 font-medium color-info cursor-pointer hover:underline"
-            >
-              Sign in instead
-            </button>
+          <div className="flex xs:flex-col-reverse xs:items-start items-center justify-between">
+            <div className="flex flex-col">
+              <button
+                onClick={handleSignInInstead}
+                disabled={isCreatingAccount}
+                className="flex items-start p-0 mb-2 bg-default border-0 font-medium color-info cursor-pointer hover:underline"
+              >
+                Sign in instead
+              </button>
+              <button
+                onClick={subscribeWithoutAccount}
+                disabled={isCreatingAccount}
+                className="flex items-start p-0 bg-default border-0 font-medium color-info cursor-pointer hover:underline"
+              >
+                Subscribe without account
+              </button>
+            </div>
             <Button
-              className="py-2.5"
+              className="py-2.5 xs:mb-4"
               type="primary"
               label={
                 isCreatingAccount ? 'Creating account...' : 'Create account'
@@ -199,15 +210,8 @@ export const CreateAccount: FunctionComponent<Props> = observer(
               disabled={isCreatingAccount}
             />
           </div>
-          <button
-              onClick={subscribeWithoutAccount}
-              disabled={isCreatingAccount}
-              className="p-0 bg-default border-0 font-medium color-info cursor-pointer hover:underline"
-            >
-              Subscribe without account
-            </button>
         </div>
-        <Illustration />
+        <Illustration className="md:hidden" />
       </div>
     );
   }
diff --git a/app/assets/javascripts/purchaseFlow/panes/SignIn.tsx b/app/assets/javascripts/purchaseFlow/panes/SignIn.tsx
index d35e7ec97..c2e2c5a90 100644
--- a/app/assets/javascripts/purchaseFlow/panes/SignIn.tsx
+++ b/app/assets/javascripts/purchaseFlow/panes/SignIn.tsx
@@ -31,7 +31,7 @@ export const SignIn: FunctionComponent<Props> = observer(
     const passwordInputRef = useRef<HTMLInputElement>(null);
 
     useEffect(() => {
-      if (emailInputRef.current) emailInputRef.current!.focus();
+      if (emailInputRef.current) emailInputRef.current?.focus();
     }, []);
 
     const handleEmailChange = (e: Event) => {
@@ -56,18 +56,18 @@ export const SignIn: FunctionComponent<Props> = observer(
 
     const handleSignIn = async () => {
       if (!email) {
-        emailInputRef?.current!.focus();
+        emailInputRef?.current?.focus();
         return;
       }
 
       if (!isEmailValid(email)) {
         setIsEmailInvalid(true);
-        emailInputRef?.current!.focus();
+        emailInputRef?.current?.focus();
         return;
       }
 
       if (!password) {
-        passwordInputRef?.current!.focus();
+        passwordInputRef?.current?.focus();
         return;
       }
 
@@ -117,7 +117,7 @@ export const SignIn: FunctionComponent<Props> = observer(
           <form onSubmit={handleSignIn}>
             <div className="flex flex-col">
               <FloatingLabelInput
-                className={`min-w-90 ${
+                className={`min-w-90 xs:min-w-auto ${
                   isEmailInvalid && !otherErrorMessage ? 'mb-2' : 'mb-4'
                 }`}
                 id="purchase-sign-in-email"
@@ -135,7 +135,9 @@ export const SignIn: FunctionComponent<Props> = observer(
                 </div>
               ) : null}
               <FloatingLabelInput
-                className={`min-w-90 ${otherErrorMessage ? 'mb-2' : 'mb-4'}`}
+                className={`min-w-90 xs:min-w-auto ${
+                  otherErrorMessage ? 'mb-2' : 'mb-4'
+                }`}
                 id="purchase-sign-in-password"
                 type="password"
                 label="Password"
diff --git a/app/assets/stylesheets/_sn.scss b/app/assets/stylesheets/_sn.scss
index 321bf78d9..86134d453 100644
--- a/app/assets/stylesheets/_sn.scss
+++ b/app/assets/stylesheets/_sn.scss
@@ -683,3 +683,49 @@
 .rounded-0\.5 {
   border-radius: 0.125rem;
 }
+
+@media screen and (max-width: 480px) {
+  .sn-component {
+    .xs\:items-start {
+      align-items: flex-start;
+    }
+
+    .xs\:px-4 {
+      padding-left: 1rem;
+      padding-right: 1rem;
+    }
+
+    .xs\:px-8 {
+      padding-left: 2rem;
+      padding-right: 2rem;
+    }
+
+    .xs\:mb-4 {
+      margin-bottom: 1rem;
+    }
+
+    .xs\:min-w-auto {
+      min-width: auto;
+    }
+
+    .xs\:flex-col-reverse {
+      flex-flow: column-reverse;
+    }
+
+    .xs\:rounded-0 {
+      border-radius: 0;
+    }
+  }
+}
+
+@media screen and (max-width: $screen-md-min) {
+  .sn-component {
+    .md\:hidden {
+      display: none;
+    }
+
+    .md\:mr-0 {
+      margin-right: 0;
+    }
+  }
+}
diff --git a/package.json b/package.json
index 7e9cf75b2..8c337ba67 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "standard-notes-web",
-  "version": "3.9.1",
+  "version": "3.9.2",
   "license": "AGPL-3.0-or-later",
   "repository": {
     "type": "git",
@@ -72,7 +72,7 @@
     "@reach/listbox": "^0.16.2",
     "@standardnotes/features": "1.8.1",
     "@standardnotes/sncrypto-web": "1.5.3",
-    "@standardnotes/snjs": "2.17.4",
+    "@standardnotes/snjs": "2.17.5",
     "mobx": "^6.3.5",
     "mobx-react-lite": "^3.2.1",
     "preact": "^10.5.15",
diff --git a/yarn.lock b/yarn.lock
index d75a5023c..2ec5f062b 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2166,13 +2166,20 @@
   dependencies:
     "@standardnotes/auth" "^3.8.1"
 
-"@standardnotes/features@1.8.1", "@standardnotes/features@^1.8.1":
+"@standardnotes/features@1.8.1":
   version "1.8.1"
   resolved "https://registry.yarnpkg.com/@standardnotes/features/-/features-1.8.1.tgz#addea86a8a4288a0046bc674a8e76f1bac3c2f89"
   integrity sha512-yDbMLu9SnwR4cmjsIMgpxBOK9kIbWVQ7WezfJ5MN0FAwD2IbfKCMaWBMUJStCtSqkKE4dkL3BC+sIxik/4RwdQ==
   dependencies:
     "@standardnotes/common" "^1.2.1"
 
+"@standardnotes/features@^1.8.2":
+  version "1.8.2"
+  resolved "https://registry.yarnpkg.com/@standardnotes/features/-/features-1.8.2.tgz#ecc8162ca80ee3740468aa55a64c23b519c13505"
+  integrity sha512-EYeYYT/WBIh7fMVTVhsy0INjVdyHVtnH90pbZQHNPpsUkLdj05DzuyxUKjsc0oxiskmZjPOVSfXt8l3RL5Av4g==
+  dependencies:
+    "@standardnotes/common" "^1.2.1"
+
 "@standardnotes/settings@^1.2.1":
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/@standardnotes/settings/-/settings-1.2.1.tgz#4c7656ea86d784a2f77c70acc89face5d28da024"
@@ -2192,15 +2199,15 @@
     buffer "^6.0.3"
     libsodium-wrappers "^0.7.9"
 
-"@standardnotes/snjs@2.17.4":
-  version "2.17.4"
-  resolved "https://registry.yarnpkg.com/@standardnotes/snjs/-/snjs-2.17.4.tgz#ebf9d59a297ee7d87db1631e8850ba53dd9e7bea"
-  integrity sha512-ucxhSG8scDZd+JguK0bPLNwSg99w+jpYnCM+RZpd6GTkVjHBy3DEFnM06KrDzubLAtbKE8b7I50DOI+5C4p2rg==
+"@standardnotes/snjs@2.17.5":
+  version "2.17.5"
+  resolved "https://registry.yarnpkg.com/@standardnotes/snjs/-/snjs-2.17.5.tgz#19382b6d29947d896d543c7824a6129547196540"
+  integrity sha512-sdqcavG5C46VybOq2aQ8bEDEGvXE3sjjcwJJBVsTWCANQkFFh0k7gTA3y3n9ZiWncjoYpBOpuvwr6wpBwJE8EA==
   dependencies:
     "@standardnotes/auth" "^3.8.1"
     "@standardnotes/common" "^1.2.1"
     "@standardnotes/domain-events" "^2.5.1"
-    "@standardnotes/features" "^1.8.1"
+    "@standardnotes/features" "^1.8.2"
     "@standardnotes/settings" "^1.2.1"
     "@standardnotes/sncrypto-common" "^1.5.2"