Several fixes to CSS, better responsive overall, improved security and error page

components/base/Tree.vue

@@ -1,6 +1,6 @@
 <template>
-    <TreeRoot v-slot="{ flattenItems }" class="list-none select-none text-light-100 dark:text-dark-100 p-2 font-medium xl:text-base text-sm cursor-pointer" :items="model" :get-key="(item) => item.link ?? item.label">
-        <TreeItem v-for="item in flattenItems" v-slot="{ isExpanded }" :key="item._id" :style="{ 'padding-left': `${item.level - 0.5}em` }" v-bind="item.bind" class="flex items-center px-2 outline-none relative">
+    <TreeRoot v-slot="{ flattenItems }" class="list-none select-none text-light-100 dark:text-dark-100 p-2 font-medium xl:text-base text-sm" :items="model" :get-key="(item) => item.link ?? item.label">
+        <TreeItem v-for="item in flattenItems" v-slot="{ isExpanded }" :key="item._id" :style="{ 'padding-left': `${item.level - 0.5}em` }" v-bind="item.bind" class="flex items-center px-2 outline-none relative cursor-pointer">
             <NuxtLink :href="item.value.link && !item.hasChildren ? { name: 'explore-path', params: { path: item.value.link } } : undefined" no-prefetch class="flex flex-1 items-center" active-class="text-accent-blue">
                 <Icon v-if="item.hasChildren" icon="radix-icons:chevron-right" :class="{ 'rotate-90': isExpanded }" class="h-4 w-4 transition-transform absolute" :style="{ 'left': `${item.level - 1}em` }" />
                 <div class="pl-3 py-1 flex-1 truncate border-light-35 dark:border-dark-35 hover:border-accent-blue" :class="{ 'border-s': !item.hasChildren }" :data-tag="item.value.tag">

components/prose/ProseA.vue

@@ -1,5 +1,5 @@
 <template>
-    <slot v-bind="$attrs"></slot>
+    <span class="text-accent-blue inline-flex items-center cursor-pointer hover:text-opacity-85"><slot v-bind="$attrs"></slot></span>
     <!-- <Suspense suspensible>
         <NuxtLink no-prefetch class="text-accent-blue inline-flex items-center" v-if="data && data[0]"
         :to="{ path: `/explorer/${project}/${data[0].path}`, hash: hash }" :class="class">

components/prose/ProseH1.vue

@@ -1,5 +1,5 @@
 <template>
-  <h1 :id="parseId(id)" class="text-5xl font-thin mt-3 mb-8 first:pt-0 pt-2 relative sm:right-8 right-4">
+  <h1 :id="parseId(id)" class="text-5xl font-thin mt-3 mb-8 first:pt-0 pt-2 relative lg:right-8 sm:right-4 right-2">
     <slot />
   </h1>
 </template>

components/prose/ProseTag.vue

@@ -28,7 +28,9 @@
             </span>
         </template>
     </HoverPopup> -->
-    <slot />
+    <span class="before:content-['#'] cursor-default bg-accent-blue bg-opacity-10 hover:bg-opacity-20 text-accent-blue text-sm px-1 ms-1 pb-0.5 rounded-full rounded-se-none border border-accent-blue border-opacity-30">
+        <slot></slot>
+    </span>
 </template>
 
 <!-- <script setup lang="ts">