diff --git a/public/script.js b/public/script.js
index 9dcc30431..7611c4340 100644
--- a/public/script.js
+++ b/public/script.js
@@ -762,8 +762,8 @@ function printCharacters() {
 
     printTags();
     printGroups();
-    favsToHotswap();
     sortCharactersList();
+    favsToHotswap();
 }
 
 async function getCharacters() {
diff --git a/public/scripts/RossAscends-mods.js b/public/scripts/RossAscends-mods.js
index 9170f407f..b17729753 100644
--- a/public/scripts/RossAscends-mods.js
+++ b/public/scripts/RossAscends-mods.js
@@ -27,6 +27,7 @@ import {
     SECRET_KEYS,
     secret_state,
 } from "./secrets.js";
+import { sortByCssOrder } from "./utils.js";
 
 var NavToggle = document.getElementById("nav-toggle");
 var RPanelPin = document.getElementById("rm_button_panel_pin");
@@ -275,7 +276,7 @@ export async function favsToHotswap() {
     const maxCount = 6;
     let count = 0;
 
-    $(selector).each(function () {
+    $(selector).sort(sortByCssOrder).each(function () {
         if ($(this).hasClass('is_fav') && count < maxCount) {
             const isCharacter = $(this).hasClass('character_select');
             const isGroup = $(this).hasClass('group_select');
diff --git a/public/scripts/power-user.js b/public/scripts/power-user.js
index 19931c12b..bf83867c1 100644
--- a/public/scripts/power-user.js
+++ b/public/scripts/power-user.js
@@ -9,6 +9,7 @@ import {
     getRequestHeaders,
     substituteParams,
 } from "../script.js";
+import { favsToHotswap } from "./RossAscends-mods.js";
 import {
     groups,
     selected_group,
@@ -986,6 +987,7 @@ $(document).ready(() => {
         power_user.sort_order = $(this).find(":selected").data('order');
         power_user.sort_rule = $(this).find(":selected").data('rule');
         sortCharactersList();
+        favsToHotswap();
         saveSettingsDebounced();
     });
 
diff --git a/public/scripts/utils.js b/public/scripts/utils.js
index 82c7c6131..6213f4506 100644
--- a/public/scripts/utils.js
+++ b/public/scripts/utils.js
@@ -182,4 +182,10 @@ export async function initScrollHeight(element) {
     $(element).css("height", "");
     $(element).css("height", `${newHeight}px`);
     //resetScrollHeight(element);
+}
+
+export function sortByCssOrder(a, b) {
+    const _a = Number($(a).css('order'));
+    const _b = Number($(b).css('order'));
+    return _a - _b;
 }
\ No newline at end of file