I am creating an application launcher with the Dashboard Collection.  I am using the Dashboard Collection vs the traditional "green" Reporting collection to get the resulting web pages to be responsive, but I have run into a few roadblocks - and could use some input on how best to implement things.  In some cases I have things working but feel there must be a more elegant/performant option, and in others I am stuck.  Attaching find a set of three interconnected protocols that should work as-is in imported in a folder named REPORTABLE_ISSUES under Protocols/Web Services that show what I am trying to accomplish and where I could use assistance.

Protocols and Questions/Issues:  

1. MyApp UI : main launch.  Sets up a column of clickable buttons for each menu category (L1) on the left and a replaceable div for the selected content on the right. 
   Issues:
   1. When a user selects an L1 button on the left I want to highlight it so they can visually see it was the selected option, can anyone help me achieve this in a classy way?
      1. Notes: Currently clicking on it calls a protocol link set up by the Make Clickable (HTML5) component which replaces just the center Div.  It feels like there must be an on-click-type mechanism to let me do this (and un-highlight any that were previously selected) but I am not sure how to code this, much less code it in the context where an Event Handler is already being set up for it by the Make Clickable actions. that sets up the protocol link and associated javascript.  I guess I can re-code by putting the entire page in a Div and recalculating/reloading to force the CSS to be as-desired but this feels icky.  I am not a JS/CSS expert especially when trying to work with a setup where I am trying to align with these being injected elsewhere and would love advice on how to proceed!  
2. MyApp Subcategories Sets up middle section with a row of subcategories for selected main category. On first load the links associated with the first available subcategory (L2) are preloaded.  Similar to above, I need to show which L2 was selected, and currently have it set up so that selecting a different L2 from the subcategory reloads the whole center div to get the correct link buttons for the selected subcategory plus it colors the subcategory button to indicate it is selected. Issues:
   1. I can live with this but would love to have suggestions for how it could be done in a more performant way.  For example my application likely won't every have a ton of options especially once filtered by user permissions.  Instead of a replaceable div that is filled in by a protocol via Make Clickable, should/could I be preloading all options into hidden sections and just hiding/unhiding or shall I just be happy with this and work on warmup protocols to improve performance?
   2. I didn't show it in this example but I am also going to implement a button with an icon to allow a user to select an L3 link to set as a Favorite.  When selected I will update a database table to track which users have favorited which links, and change the favorite icon button to show it's favorited/not state.  I am not sure the best way to toggle this display and it feels overkill/poor performance to reload the center div entirely to account for these selections.  Extra Credit if someone shows how they might add this (nice example on using google fonts from Andrei in a response to my last question about a week ago will make a start on getting the icon, but not the interactivity showing what was selected)
3. 3) MyApp logger - log the clicked link while the app also opens the selected hyperlink in a new tab.  Issue:
   1. The Make Clickable component REQUIRES that you set a div for the results to get loaded into and throws an error if you have no results to load.  To get around this I am creating a hidden div that loads the test "This space intentionally left blank" but it feels like there has to be a way to code this with as protocol link or something and eliminate the requirement that the calling page gets updated with a result.  Thoughts?