theme browse steps the displayed list, favourites block out of the rotation

src/apps/officer-web/Screens/Dashboard/Layout/Header/ThemeSwitcher.tsx

@@ -35,8 +35,6 @@ export const ThemeSwitcher = () => {
   const { theme, themeId, setTheme, themes } = useTheme();
   const { t } = useTranslation();
   const { favorites, isFavorite, toggle } = useThemeFavorites();
-  // Declared before the key hook, which needs the toggle: `f` in the list and `ctrl+shift+f` from anywhere.
-  const { open, setOpen, focused, setFocused } = useThemeKeys({ onToggleFavorite: toggle });
   const [onlyFavorites, setOnlyFavorites] = useState(false);
 
   /*
@@ -57,6 +55,17 @@ export const ThemeSwitcher = () => {
     // `favorites` is a fresh Set each render; its CONTENTS are what matter, so key on those.
   }, [themes, themeId, onlyFavorites, [...favorites].sort().join(',')]);
 
+  // What `j`/`k` walk in the overlay: the displayed list MINUS the pinned favourites block. The block is
+  // a shortlist sitting outside the rotation — stepping through it and the main list as one ring made the
+  // focus hop up and back on every starred registry-neighbour. With the favourites filter on, the
+  // favourites ARE the list, so then they are what gets browsed.
+  const browseOrder = useMemo(
+    () => (onlyFavorites ? ordered : ordered.filter((entry) => !favorites.has(entry.id))).map((entry) => entry.id),
+    [ordered, onlyFavorites, [...favorites].sort().join(',')],
+  );
+
+  const { open, setOpen, focused, setFocused } = useThemeKeys({ onToggleFavorite: toggle, browseOrder });
+
   const families = useMemo(() => groupByFamily(ordered), [ordered]);
 
   return (