Just working on things. Slow progress...

src/routes/+layout.svelte

@@ -351,8 +351,23 @@ $: if ($slct_trigger == 'set_access_code_li' && !$ae_loc.ds['hub__page__access_c
 
 
     <svelte:fragment slot="footer">
-        <div class="flex justify-between space-x-2 text-slate-400 hover:text-slate-800 transition">
+        <div
+            class="flex justify-between text-slate-400 hover:text-slate-800 transition px-1"
+            class:ae_debug={$ae_loc.debug}
+            >
             {@html $ae_loc.ds['hub__site__appshell_footer']}
+
+            <button
+                on:click={() => {
+                    console.log('Debug:', $ae_loc);
+                    $ae_loc.debug = !$ae_loc.debug;
+                }}
+                id="AE-Quick-Debug"
+                class="ae_quick_debug btn btn-sm variant-glass-surface"
+                title="Turn debug content and styles off and on"
+                >
+                &pi;
+            </button>
         </div>
     </svelte:fragment>
 
@@ -375,4 +390,66 @@ $: if ($slct_trigger == 'set_access_code_li' && !$ae_loc.ds['hub__page__access_c
 
 
 <style lang="postcss">
+/* BEGIN: AE's Svelte Quick Debug component  */
+#AE-Quick-Debug {
+    /* position: absolute; */
+    position: fixed;
+    /* position: relative; */
+    /* position: static; */
+    /* position: sticky; */
+    /* top: 1em; */
+    bottom: 0rem;
+    right: 0rem;
+
+    padding: .0rem;
+
+    /* lightyellow */
+    /* background-color: hsla(60,100%,90%,.30);  */
+    /* background-color: rgba(var(--color-surface-500) / .5); */
+
+    border: none;
+
+    border-top: solid thin hsla(0,0%,0%,.25);
+    border-left: solid thin hsla(0,0%,0%,.25);
+    border-bottom: solid thin hsla(0,0%,0%,.25);
+    /* border-top-left-radius: .5em; */
+    /* border-bottom-left-radius: .5em; */
+
+    opacity: .15;
+    /* opacity: 1; */
+
+    font-size: .75rem;
+
+    z-index: 5;
+
+    /* NOTE: transition when no longer hovering */
+    transition-property: opacity, background-color;
+    transition-delay: 1.25s;
+    transition-duration: .5s;
+    transition-timing-function: ease-out;
+}
+
+#AE-Quick-Debug:hover {
+    /* lightyellow */
+    /* background-color: hsla(60,100%,90%,.95); */
+    /* background-color: rgba(var(--color-surface-500) / 1); */
+
+    border-top: solid thin hsla(0,0%,0%,.95);
+    border-left: solid thin hsla(0,0%,0%,.95);
+    border-bottom: solid thin hsla(0,0%,0%,.95);
+
+    opacity: 1;
+
+    padding: .5rem;
+
+    font-size: 1.75rem;
+    /* Need to zoom 3.5 when hovering */
+    /* transform: scale(3.5); */
+
+    /* NOTE: transition when hover starts */
+    transition-property: opacity, background-color;
+    transition-delay: .5s;
+    transition-duration: .10s;
+    transition-timing-function: ease-in;
+}
 </style>