diff --git a/website/client/src/components/admin-panel/user-support/cronAndAuth.vue b/website/client/src/components/admin-panel/user-support/cronAndAuth.vue
index 260bc46177..8b107ebf21 100644
--- a/website/client/src/components/admin-panel/user-support/cronAndAuth.vue
+++ b/website/client/src/components/admin-panel/user-support/cronAndAuth.vue
@@ -22,11 +22,6 @@
         Account created:
         <strong>{{ hero.auth.timestamps.created | formatDate }}</strong>
       </div>
-      <div>
-        Most recent cron:
-        <strong>{{ hero.auth.timestamps.loggedin | formatDate }}</strong>
-        ("auth.timestamps.loggedin")
-      </div>
       <div v-if="cronError">
         "lastCron" value:
         <strong>{{ hero.lastCron | formatDate }}</strong>
@@ -36,12 +31,19 @@
           ("auth.timestamps.loggedin" and "lastCron" dates are different).
         </span>
       </div>
-      <button
-        class="btn btn-primary"
-        @click="resetCron()"
-      >
-        Reset Cron to Yesterday
-      </button>
+      <div class="form-inline">
+        <div>
+          Most recent cron:
+          <strong>{{ hero.auth.timestamps.loggedin | formatDate }}</strong>
+          ("auth.timestamps.loggedin")
+        </div>
+        <button
+          class="btn btn-primary ml-2"
+          @click="resetCron()"
+        >
+          Reset Cron to Yesterday
+        </button>
+      </div>
       <div class="subsection-start">
         Time zone:
         <strong>{{ hero.preferences.timezoneOffset | formatTimeZone }}</strong>
diff --git a/website/client/src/components/admin-panel/user-support/subscriptionAndPerks.vue b/website/client/src/components/admin-panel/user-support/subscriptionAndPerks.vue
index 61abb08294..05856a31c5 100644
--- a/website/client/src/components/admin-panel/user-support/subscriptionAndPerks.vue
+++ b/website/client/src/components/admin-panel/user-support/subscriptionAndPerks.vue
@@ -8,7 +8,7 @@
       Subscription, Monthly Perks
     </h3>
     <div v-if="expand">
-      <form @submit.prevent="saveHero({hero, msg: 'Subscription Perks'})">
+      <form @submit.prevent="saveSubscriptionData()">
         <div v-if="hero.purchased.plan.paymentMethod">
           Payment method:
           <strong>{{ hero.purchased.plan.paymentMethod }}</strong>
@@ -30,9 +30,20 @@
           </strong>
           <strong v-else> None </strong>
         </div>
-        <div>
-          Consecutive months:
-          <strong>{{ hero.purchased.plan.consecutive.count }}</strong>
+        <div class="form-inline">
+          <label>
+            Consecutive months:
+            <input
+              v-model="consecutiveMonths"
+              class="form-control"
+              type="number"
+              min="0"
+              step="1"
+            >
+          </label>
+          <span class="small">
+            Updates Hourglasses and Gem cap automatically. Next Mystic Hourglass updates on save.
+          </span>
         </div>
         <div>
           Months until renewal:
@@ -59,16 +70,16 @@
             <strong>{{ hero.purchased.plan.consecutive.gemCapExtra + 25 }}</strong>
           </div>
           <div class="form-inline">
-          <label>
-            Gems bought this month:
-            <input
-              v-model="hero.purchased.plan.gemsBought"
-              class="form-control"
-              type="number"
-              min="0"
-              :max="hero.purchased.plan.consecutive.gemCapExtra + 25"
-              step="1"
-            >
+            <label>
+              Gems bought this month:
+              <input
+                v-model="hero.purchased.plan.gemsBought"
+                class="form-control"
+                type="number"
+                min="0"
+                :max="hero.purchased.plan.consecutive.gemCapExtra + 25"
+                step="1"
+              >
             </label>
           </div>
         <div
@@ -107,6 +118,7 @@
 </template>
 
 <script>
+import clone from 'lodash/clone';
 import moment from 'moment';
 import saveHero from '../mixins/saveHero';
 import { getPlanContext } from '@/../../common/script/cron';
@@ -121,6 +133,8 @@ export default {
   },
   data () {
     return {
+      consecutiveMonths: 0,
+      startingHourglasses: 0,
       expand: false,
     };
   },
@@ -131,10 +145,37 @@ export default {
       return currentPlanContext.nextHourglassDate.format('MMMM');
     },
   },
+  watch: {
+    consecutiveMonths () {
+      const startingMonths = this.hero.purchased.plan.consecutive.count;
+      const monthsAdded = Math.max(0, this.consecutiveMonths - startingMonths);
+      this.hero.purchased.plan.consecutive.gemCapExtra = Math.min(
+        Math.floor(this.consecutiveMonths / 3) * 5, 25,
+      );
+      if (monthsAdded >= 0) {
+        this.hero.purchased.plan.consecutive.trinkets = this.startingHourglasses
+          + Math.floor(monthsAdded / 3);
+      }
+      if (this.hero.purchased.plan.gemsBought
+        > this.hero.purchased.plan.consecutive.gemCapExtra + 25) {
+        this.hero.purchased.plan.gemsBought = this.hero.purchased.plan.consecutive.gemCapExtra + 25;
+      }
+    },
+  },
+  mounted () {
+    this.consecutiveMonths = clone(this.hero.purchased.plan.consecutive.count);
+    this.startingHourglasses = clone(this.hero.purchased.plan.consecutive.trinkets);
+  },
   methods: {
     dateFormat (date) {
       return moment(date).format('YYYY/MM/DD');
     },
+    saveSubscriptionData () {
+      if (this.consecutiveMonths !== this.hero.purchased.plan.consecutive.count) {
+        this.hero.purchased.plan.consecutive.count = this.consecutiveMonths;
+      }
+      this.saveHero({ hero: this.hero, msg: 'Subscription Perks' });
+    },
   },
 };
 </script>
diff --git a/website/server/controllers/api-v3/hall.js b/website/server/controllers/api-v3/hall.js
index e3f950b08a..6473f30ab0 100644
--- a/website/server/controllers/api-v3/hall.js
+++ b/website/server/controllers/api-v3/hall.js
@@ -277,8 +277,13 @@ api.updateHero = {
       if (updateData.purchased.plan.gemsBought) {
         hero.purchased.plan.gemsBought = updateData.purchased.plan.gemsBought;
       }
-      if (updateData.purchased.plan.consecutive && updateData.purchased.plan.consecutive.trinkets) {
-        hero.purchased.plan.consecutive.trinkets = updateData.purchased.plan.consecutive.trinkets;
+      if (updateData.purchased.plan.consecutive) {
+        if (updateData.purchased.plan.consecutive.trinkets) {
+          hero.purchased.plan.consecutive.trinkets = updateData.purchased.plan.consecutive.trinkets;
+        }
+        if (updateData.purchased.plan.consecutive.gemCapExtra) {
+          hero.purchased.plan.consecutive.gemCapExtra = updateData.purchased.plan.consecutive.gemCapExtra; // eslint-disable-line max-len
+        }
       }
     }