feat: complete UI/UX improvements, vuesax icons, media server, and section management

apps/web/app/components/ui/ImagePlaceholder.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ImageOff } from "lucide-vue-next";
+import VuesaxIcon from "~/components/ui/VuesaxIcon.vue";
 
 withDefaults(
   defineProps<{
@@ -17,7 +17,7 @@ withDefaults(
   <div
     :class="`flex flex-col items-center justify-center border border-dashed border-line bg-panel ${aspectClass}`"
   >
-    <ImageOff class="size-10 text-muted/30" />
+    <VuesaxIcon name="gallery-slash" class="size-10 text-muted/30" />
     <span class="mt-2 font-mono text-[10px] tracking-wider text-muted/40">{{ label }}</span>
   </div>
 </template>