From e2b1e21153eb51b9b1a41a41dd425299789b5d0d Mon Sep 17 00:00:00 2001
From: Rhen Cloud <i@rhen.cloud>
Date: Sat, 27 Dec 2025 19:35:39 +0800
Subject: [PATCH] update

---
 .nvmrc                                        |   2 +-
 app/app.vue                                   |   4 +-
 app/assets/css/main.css                       |  20 ++
 app/assets/css/tailwind.css                   |  15 -
 app/components/main/TechInfo.vue              |  13 +-
 app/pages/about.vue                           |  33 +--
 app/pages/archive/index.vue                   |  44 ++-
 app/pages/blogs/[blog].vue                    |   1 -
 app/types/blog.ts                             |  11 +-
 app/utils/helper.ts                           |  13 +
 content.config.ts                             |  16 +-
 content/about.md                              |  19 +-
 .../configure-fish-on-windows copy/index.md   |  82 ++++++
 .../blogs/configure-fish-on-windows/index.md  |   4 +-
 nuxt.config.ts                                |  14 +-
 package.json                                  |   9 +-
 pnpm-lock.yaml                                | 260 +++++++++++++++++-
 postcss.config.cjs                            |   6 +
 18 files changed, 470 insertions(+), 96 deletions(-)
 create mode 100644 app/assets/css/main.css
 delete mode 100644 app/assets/css/tailwind.css
 create mode 100644 content/blogs/configure-fish-on-windows copy/index.md
 create mode 100644 postcss.config.cjs

diff --git a/.nvmrc b/.nvmrc
index 517f386..248216a 100644
--- a/.nvmrc
+++ b/.nvmrc
@@ -1 +1 @@
-v22.14.0
+24.12.0
diff --git a/app/app.vue b/app/app.vue
index dd398d4..1f2b208 100644
--- a/app/app.vue
+++ b/app/app.vue
@@ -26,9 +26,9 @@ const bgStyle = computed(() =>
 </script>
 
 <template>
-  <link
+  <!-- <link
     rel="stylesheet"
-    href="https://chinese-fonts-cdn.deno.dev/packages/maple-mono-cn/dist/MapleMono-CN-Regular/result.css" />
+    href="https://chinese-fonts-cdn.deno.dev/packages/maple-mono-cn/dist/MapleMono-CN-Regular/result.css" /> -->
   <div class="relative">
     <div
       v-if="currentBg"
diff --git a/app/assets/css/main.css b/app/assets/css/main.css
new file mode 100644
index 0000000..24538d4
--- /dev/null
+++ b/app/assets/css/main.css
@@ -0,0 +1,20 @@
+@import "tailwindcss";
+/* @import "tailwindcss/preflight";
+@tailwind utilities; */
+/* @import url("https://fonts.rhen.cloud/maplemono-cn-regular/result.css"); */
+/* @import url("https://chinese-fonts-cdn.deno.dev/packages/maple-mono-cn/dist/MapleMono-CN-Regular/result.css"); */
+/* @import "tailwindcss/preflight"; */
+/* @imoprt "utilities"; */
+/* @import url("https://fontsapi.zeoseven.com/292/main/result.css"); */
+
+/* @theme {
+  --font-roboto: "LXGW WenKai", sans-serif;
+}
+body {
+  font-familt: var(--font-roboto);
+} */
+
+/* @theme {
+  --font-roboto: "Maple Mono CN", sans-serif;
+  --font-display--font-feature-settings: "zero", "cv03", "ss03", "ss05", "cv97", "cv98";
+} */
diff --git a/app/assets/css/tailwind.css b/app/assets/css/tailwind.css
deleted file mode 100644
index a0424c3..0000000
--- a/app/assets/css/tailwind.css
+++ /dev/null
@@ -1,15 +0,0 @@
-@import url("https://chinese-fonts-cdn.deno.dev/packages/maple-mono-cn/dist/MapleMono-CN-Regular/result.css");
-
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
-
-@theme {
-  --font-roboto: "Maple Mono CN", sans-serif;
-  --font-display--font-feature-settings: "zero", "cv03", "ss03", "ss05", "cv97", "cv98";
-}
-
-/* @import url("https://fontsapi.zeoseven.com/292/main/result.css"); */
-/* @theme {
-  --font-roboto: "LXGW WenKai", sans-serif;
-} */
diff --git a/app/components/main/TechInfo.vue b/app/components/main/TechInfo.vue
index ad5a6e9..1b8b6d4 100644
--- a/app/components/main/TechInfo.vue
+++ b/app/components/main/TechInfo.vue
@@ -13,7 +13,7 @@ const techStack = computed(() => {
   };
   return [
     { label: "构建平台", value: platform.name, icon: platform.icon },
-    { label: "图片存储", value: "去图图床", icon: "heroicons:photo" },
+    { label: "图片存储", value: "Cloudflare R2", icon: "heroicons:photo" },
     { label: "软件协议", value: "MIT", icon: "heroicons:document-text" },
     { label: "文章许可", value: "CC BY-NC-SA 4.0", icon: "fa-brands:creative-commons" },
     {
@@ -74,19 +74,8 @@ const versions = computed(() => {
           </div>
         </div>
 
-        <!-- 展开/收起按钮 -->
-        <button
-          class="w-full mt-8 py-2 flex items-center justify-center gap-2 text-xs font-bold text-zinc-400 hover:text-violet-500 transition-colors border-t border-white/10 dark:border-white/5 pt-6"
-          @click="showMore = !showMore">
-          <Icon
-            :name="showMore ? 'heroicons:chevron-double-up' : 'heroicons:chevron-double-down'"
-            class="w-3 h-3" />
-          {{ showMore ? "收起构建信息" : "展开构建信息" }}
-        </button>
-
         <!-- 详细版本信息网格 -->
         <div
-          v-show="showMore"
           class="grid grid-cols-2 sm:grid-cols-4 gap-6 mt-6 animate-in fade-in slide-in-from-top-2 duration-500">
           <div v-for="v in versions" :key="v.label" class="text-center">
             <div
diff --git a/app/pages/about.vue b/app/pages/about.vue
index 305c59e..bd0d240 100644
--- a/app/pages/about.vue
+++ b/app/pages/about.vue
@@ -1,24 +1,25 @@
 <script setup>
-import { ref, onMounted } from "vue";
 import { useRoute } from "vue-router";
+import TechInfo from "~/components/main/TechInfo.vue";
 
-const content = ref(null);
-
-onMounted(async () => {
-  const route = useRoute();
-
-  const { data: pageData } = await useAsyncData(route.path, () =>
-    queryCollection("content").path(route.path).first(),
-  );
-
-  if (pageData.value) {
-    content.value = pageData.value;
-  }
-});
+const route = useRoute();
+const { data: content } = await useAsyncData(route.path, () => queryCollection("about").first());
 </script>
 
 <template>
-  <div class="prose prose-lg dark:prose-invert mx-auto px-6 max-w-4xl mt-0 text-left">
-    <ContentRenderer v-if="content" :value="content" />
+  <div class="container mx-auto mt-10 px-6 max-w-6xl">
+    <div class="flex gap-8">
+      <!-- Main content -->
+      <main class="prose prose-zinc dark:prose-invert mx-auto mt-10 px-6 w-half h-full text-left">
+        <ContentRenderer v-if="content" :value="content" />
+      </main>
+
+      <!-- Sidebar tech/build info -->
+      <aside class="w-1/3 hidden lg:block">
+        <div class="sticky top-24">
+          <TechInfo />
+        </div>
+      </aside>
+    </div>
   </div>
 </template>
diff --git a/app/pages/archive/index.vue b/app/pages/archive/index.vue
index c3b9897..97b3da6 100644
--- a/app/pages/archive/index.vue
+++ b/app/pages/archive/index.vue
@@ -1,28 +1,26 @@
 <script lang="ts" setup>
 import type { BlogPost } from "~/types/blog";
+import { formatDate } from "~/utils/helper";
 
-const { data } = await useAsyncData("all-archive-post", () => queryCollection("content").all());
+const { data } = await useAsyncData("all-archive-post", () =>
+  queryCollection("content").order("date", "DESC").all(),
+);
 
-const sortedData = computed(() => {
-  return (
-    data.value
-      ?.map((articles) => {
-        const meta = articles.meta as unknown as BlogPost;
-        return {
-          path: articles.path,
-          title: articles.title || "no-title available",
-          description: articles.description || "no-description available",
-          image: meta.image || "/not-found.jpg",
-          alt: meta.alt || "no alter data available",
-          ogImage: meta.ogImage || "/not-found.jpg",
-          date: meta.date || "not-date-available",
-          tags: meta.tags || [],
-          published: meta.published || false,
-        };
-      })
-      .filter((post) => post.published) // Filter out unpublished posts
-      .sort((a, b) => new Date(a.date).getTime() - new Date(b.date).getTime()) || [] // Reverse the order
-  );
+// const sortedData = computed(() => {
+const posts = computed(() => {
+  return data.value?.map((articles) => {
+    const meta = articles.meta as unknown as BlogPost;
+    return {
+      path: articles.path,
+      title: articles.title || "no-title available",
+      description: articles.description || "no-description available",
+      image: meta.image || "/not-found.jpg",
+      alt: meta.alt || "no alter data available",
+      date: formatDate(articles.date) || "not-date-available",
+      tags: meta.tags || [],
+      published: meta.published || false,
+    };
+  });
 });
 </script>
 
@@ -31,7 +29,7 @@ const sortedData = computed(() => {
     <h1 class="text-3xl font-bold my-6">Archive</h1>
 
     <div v-auto-animate class="space-y-5 my-5 px-4">
-      <template v-for="post in sortedData" :key="post.title">
+      <template v-for="post in posts" :key="post.title">
         <ArchiveCard
           :path="post.path"
           :title="post.title"
@@ -41,8 +39,6 @@ const sortedData = computed(() => {
           :tags="post.tags"
           :published="post.published" />
       </template>
-
-      <ArchiveCard v-if="sortedData.length <= 0" title="No Post Found" image="/not-found.jpg" />
     </div>
   </main>
 </template>
diff --git a/app/pages/blogs/[blog].vue b/app/pages/blogs/[blog].vue
index 2dc9ffb..fbb6fb3 100644
--- a/app/pages/blogs/[blog].vue
+++ b/app/pages/blogs/[blog].vue
@@ -17,7 +17,6 @@ const data = computed<BlogPost>(() => {
     description: articles.value?.description || "no-description available",
     image: meta?.image || "/not-found.jpg",
     alt: meta?.alt || "no alter data available",
-    ogImage: (articles?.value?.ogImage as unknown as string) || "/not-found.jpg",
     date: meta?.date || "not-date-available",
     tags: meta?.tags || [],
     published: meta?.published || false,
diff --git a/app/types/blog.ts b/app/types/blog.ts
index 7d100df..935b061 100644
--- a/app/types/blog.ts
+++ b/app/types/blog.ts
@@ -4,10 +4,17 @@ export interface BlogPost {
   description: string;
   image: string;
   alt: string;
-  ogImage: string;
   tags: string[];
   categories: string[];
   published: boolean;
-  meta: Record<string, unknown>; // 添加 meta 属性
+  meta: BlogPostMeta; // 添加 meta 属性
   path: string; // 添加 path 属性
 }
+
+interface BlogPostMeta {
+  image?: string;
+  alt?: string;
+  date?: string;
+  tags?: string[];
+  // 根据实际情况添加其他可能的属性
+}
diff --git a/app/utils/helper.ts b/app/utils/helper.ts
index bfb8c46..e8fcadf 100644
--- a/app/utils/helper.ts
+++ b/app/utils/helper.ts
@@ -9,3 +9,16 @@ export function makeFirstCharUpper(str: string): string {
   if (!str) return "";
   return str.charAt(0).toUpperCase() + str.slice(1);
 }
+
+/**
+ * Formats a date string into a more readable format.
+ * @param dateString - The date string to format.
+ * @returns The formatted date string.
+ */
+export function formatDate(dateString: string): string {
+  const date = new Date(dateString);
+  const year = date.getFullYear();
+  const month = date.getMonth() + 1;
+  const day = date.getDate();
+  return `${year}年${month}月${day}日`;
+}
diff --git a/content.config.ts b/content.config.ts
index 7388ad2..c992541 100644
--- a/content.config.ts
+++ b/content.config.ts
@@ -1,23 +1,27 @@
 import { defineCollection, defineContentConfig } from "@nuxt/content";
 import { asRobotsCollection } from "@nuxtjs/robots/content";
 import { asSitemapCollection } from "@nuxtjs/sitemap/content";
-import { asOgImageCollection } from "nuxt-og-image/content";
+import { z } from "zod";
 
 export default defineContentConfig({
   collections: {
     content: defineCollection({
       ...asRobotsCollection({
         type: "page",
-        source: "**/*.md",
+        source: "blogs/**/*.md",
       }),
       ...asSitemapCollection({
         type: "page",
-        source: "**/*.md",
+        source: "blogs/**/*.md",
       }),
-      ...asOgImageCollection({
-        type: "page",
-        source: "**/*.md",
+      schema: z.object({
+        date: z.date(),
       }),
+      indexes: [{ columns: ["date"] }],
+    }),
+    about: defineCollection({
+      type: "page",
+      source: "about.md",
     }),
   },
 });
diff --git a/content/about.md b/content/about.md
index 5514919..fdd73ec 100644
--- a/content/about.md
+++ b/content/about.md
@@ -1,5 +1,14 @@
-# 关于我
-
-一名普通高中生，现居中国天津
-
-# 关于本站
+# 关于我
+
+一名普通高中生，现居中国天津
+
+# 关于本站
+
+本站基于以下技术构建：
+
+- Nuxt.js
+- Vue.js
+- Tailwind CSS
+- Vercel
+- Netlify
+- Cloudflare
diff --git a/content/blogs/configure-fish-on-windows copy/index.md b/content/blogs/configure-fish-on-windows copy/index.md
new file mode 100644
index 0000000..eda63bb
--- /dev/null
+++ b/content/blogs/configure-fish-on-windows copy/index.md	
@@ -0,0 +1,82 @@
+---
+title: "在Windows下配置Fish"
+published: true
+date: 2025-10-03
+updatedDate: 2025-10-03
+description: "在Windows下配置Fish"
+image: https://img.rhen.cloud/file/Blog/1761401028478_PixPin_2025-10-03_15-44-52.png
+alt: "在Windows下配置Fish"
+tags: ["Development", "Windows", "Fish"]
+categories: ["Technology"]
+---
+
+## 前言
+
+在经历了 Linux 下一系列的生态折磨后，我最终回归了 Windows 的怀抱。
+
+但是 Powershell 实在是太难用了。所以，Fish，启动！
+
+## 安装 Fish
+
+依据[Fish 官网](https://fishshell.com/)，我们有三种方式在 Windows 上安装 Fish：
+
+- 通过 Cygwin 安装
+- 通过 MSYS2 安装
+- 通过 WSL 安装
+
+~~作为一个Arch用户，肯定是秒选用pacman做包管理的MSYS2。~~
+
+### 安装MSYS2
+
+```bash
+scoop install msys2
+```
+
+安装完后会提示`Please run 'msys2' now for the MSYS2 setup to complete!`
+
+依照提示运行`msys2`
+
+这样就成功进入MSYS2的环境了。
+
+![PixPin_2025-10-03_15-29-07.png](https://img.rhen.cloud/file/Blog/1761401002178_PixPin_2025-10-03_15-29-07.png)
+
+### 配置MSYS2
+
+#### 更换软件源
+
+在MSYS2环境下运行：
+
+```bash
+sed -i "s#mirror.msys2.org/#mirrors.ustc.edu.cn/msys2/#g" /etc/pacman.d/mirrorlist*
+pacman -Syy
+```
+
+#### 更改home 目录
+
+修改`/etc/nsswitch.conf`文档
+
+```bash
+# Begin /etc/nsswitch.conf
+
+passwd: files db
+group: files db
+
+db_enum: cache builtin
+
+# db_home: cygwin desc # 修改此行
+db_home: /c/Users/%U
+db_shell: cygwin desc
+db_gecos: cygwin desc
+
+# End /etc/nsswitch.conf
+```
+
+### 安装Fish
+
+```bash
+pacman -S fish
+```
+
+完成，可以愉快的使用Fish了！
+
+![PixPin_2025-10-03_15-44-52.png](https://img.rhen.cloud/file/Blog/1761401028478_PixPin_2025-10-03_15-44-52.png)
diff --git a/content/blogs/configure-fish-on-windows/index.md b/content/blogs/configure-fish-on-windows/index.md
index eda63bb..f1869f3 100644
--- a/content/blogs/configure-fish-on-windows/index.md
+++ b/content/blogs/configure-fish-on-windows/index.md
@@ -1,7 +1,7 @@
 ---
-title: "在Windows下配置Fish"
+title: "在Windows下配置Fish1"
 published: true
-date: 2025-10-03
+date: 2025-10-05
 updatedDate: 2025-10-03
 description: "在Windows下配置Fish"
 image: https://img.rhen.cloud/file/Blog/1761401028478_PixPin_2025-10-03_15-44-52.png
diff --git a/nuxt.config.ts b/nuxt.config.ts
index ff67d65..9ec5512 100644
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@@ -1,10 +1,14 @@
 import siteConfig from "./app/config";
-// import tailwindcss from "@tailwindcss/vite";
+import tailwindcss from "@tailwindcss/vite";
 // https://nuxt.com/docs/api/configuration/nuxt-config
 export default defineNuxtConfig({
   compatibilityDate: "2025-12-20",
   srcDir: "app",
-  css: ["~/assets/css/tailwind.css"],
+  css: ["./app/assets/css/main.css"],
+
+  future: {
+    compatibilityVersion: 4,
+  },
 
   // plugins: [tailwindcss()],
 
@@ -19,11 +23,15 @@ export default defineNuxtConfig({
     "nuxt-og-image",
     "@nuxt/content",
     "@nuxtjs/color-mode",
-    "@nuxtjs/tailwindcss",
+    // "@nuxtjs/tailwindcss",
     "@formkit/auto-animate",
     // '@stefanobartoletti/nuxt-social-share',
   ],
 
+  vite: {
+    plugins: [tailwindcss()],
+  },
+
   app: {
     head: {
       charset: "utf-16",
diff --git a/package.json b/package.json
index eabc8ec..6c96685 100644
--- a/package.json
+++ b/package.json
@@ -17,6 +17,11 @@
     "@formkit/auto-animate": "^0.9.0",
     "@iconify-json/bi": "^1.2.7",
     "@iconify-json/fa": "^1.2.2",
+    "@iconify-json/fa-brands": "^1.2.2",
+    "@iconify-json/fa-solid": "^1.2.2",
+    "@iconify-json/heroicons": "^1.2.3",
+    "@iconify-json/heroicons-outline": "^1.2.1",
+    "@iconify-json/heroicons-solid": "^1.2.1",
     "@iconify-json/mdi": "^1.2.3",
     "@iconify-json/noto": "^1.2.7",
     "@iconify-json/svg-spinners": "^1.2.4",
@@ -28,9 +33,10 @@
     "@nuxtjs/color-mode": "^4.0.0",
     "@nuxtjs/robots": "^5.6.7",
     "@nuxtjs/sitemap": "^7.5.0",
-    "@nuxtjs/tailwindcss": "^6.14.0",
     "@tailwindcss/forms": "^0.5.11",
+    "@tailwindcss/postcss": "^4.1.18",
     "@tailwindcss/typography": "^0.5.19",
+    "@tailwindcss/vite": "^4.1.18",
     "@typescript-eslint/parser": "^8.50.0",
     "@vueuse/core": "^14.1.0",
     "@vueuse/nuxt": "^14.1.0",
@@ -44,6 +50,7 @@
     "prettier": "^3.7.4",
     "prettier-eslint": "^16.4.2",
     "remark-github": "^12.0.0",
+    "tailwindcss": "^4.1.18",
     "typescript": "^5.9.3",
     "unenv": "^1.10.0",
     "vue": "^3.5.26"
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index c170b45..3186045 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -17,6 +17,21 @@ importers:
       '@iconify-json/fa':
         specifier: ^1.2.2
         version: 1.2.2
+      '@iconify-json/fa-brands':
+        specifier: ^1.2.2
+        version: 1.2.2
+      '@iconify-json/fa-solid':
+        specifier: ^1.2.2
+        version: 1.2.2
+      '@iconify-json/heroicons':
+        specifier: ^1.2.3
+        version: 1.2.3
+      '@iconify-json/heroicons-outline':
+        specifier: ^1.2.1
+        version: 1.2.1
+      '@iconify-json/heroicons-solid':
+        specifier: ^1.2.1
+        version: 1.2.1
       '@iconify-json/mdi':
         specifier: ^1.2.3
         version: 1.2.3
@@ -55,10 +70,16 @@ importers:
         version: 6.14.0(magicast@0.5.1)(yaml@2.8.2)
       '@tailwindcss/forms':
         specifier: ^0.5.11
-        version: 0.5.11(tailwindcss@3.4.19(yaml@2.8.2))
+        version: 0.5.11(tailwindcss@4.1.18)
+      '@tailwindcss/postcss':
+        specifier: ^4.1.18
+        version: 4.1.18
       '@tailwindcss/typography':
         specifier: ^0.5.19
-        version: 0.5.19(tailwindcss@3.4.19(yaml@2.8.2))
+        version: 0.5.19(tailwindcss@4.1.18)
+      '@tailwindcss/vite':
+        specifier: ^4.1.18
+        version: 4.1.18(vite@7.3.0(@types/node@25.0.3)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.1)(yaml@2.8.2))
       '@typescript-eslint/parser':
         specifier: ^8.50.0
         version: 8.50.0(eslint@8.57.1)(typescript@5.9.3)
@@ -98,6 +119,9 @@ importers:
       remark-github:
         specifier: ^12.0.0
         version: 12.0.0
+      tailwindcss:
+        specifier: ^4.1.18
+        version: 4.1.18
       typescript:
         specifier: ^5.9.3
         version: 5.9.3
@@ -696,9 +720,24 @@ packages:
   '@iconify-json/bi@1.2.7':
     resolution: {integrity: sha512-IPz8WNxmLkH1I9msl+0Q4OnmjjvP4uU0Z61a4i4sqonB6vKSbMGUWuGn8/YuuszlReVj8rf+3gNv5JU8Xoljyg==, tarball: https://registry.npmjs.org/@iconify-json/bi/-/bi-1.2.7.tgz}
 
+  '@iconify-json/fa-brands@1.2.2':
+    resolution: {integrity: sha512-Aze0j7l95gmOLdeC4L+8MvvpN3+QmAVk9IuTJN170zYH5I7jS0jGSIMFsf0KE8vGbG8jPpXkmmDq7qQU8Rymnw==, tarball: https://registry.npmjs.org/@iconify-json/fa-brands/-/fa-brands-1.2.2.tgz}
+
+  '@iconify-json/fa-solid@1.2.2':
+    resolution: {integrity: sha512-V8TDk62dGswAwbWwoSTnaoiTVEfQyjLCq4/TPmI29evFb9GwPyU0OGX4+BdQMGsDDzk8ByR81RjR618FtELSaw==, tarball: https://registry.npmjs.org/@iconify-json/fa-solid/-/fa-solid-1.2.2.tgz}
+
   '@iconify-json/fa@1.2.2':
     resolution: {integrity: sha512-Rw0L97uO3W0Gy2rq4cM/TH3QjzuPuRca1F2steumZ57zOeheGQdiqo50O6KHjm+WgImmV92IFPUTU6eiaJsrTw==, tarball: https://registry.npmjs.org/@iconify-json/fa/-/fa-1.2.2.tgz}
 
+  '@iconify-json/heroicons-outline@1.2.1':
+    resolution: {integrity: sha512-QNYV4/KsW8Ww9a3B+hxDntS5BwLLbErKpL1V3MkvB8X+ZVTX5VLxjlj8rAEih+GCDWzaiZJOrdO/pagvsuBkXg==, tarball: https://registry.npmjs.org/@iconify-json/heroicons-outline/-/heroicons-outline-1.2.1.tgz}
+
+  '@iconify-json/heroicons-solid@1.2.1':
+    resolution: {integrity: sha512-sRZ6U1FT1lkxtIuL+iQ9Fpm5IZxvJCDaKdLpP5elgZ6OkQn6j8HVJpxgFIcuJbHC/EeoNp3tHldMEELqN9pZDQ==, tarball: https://registry.npmjs.org/@iconify-json/heroicons-solid/-/heroicons-solid-1.2.1.tgz}
+
+  '@iconify-json/heroicons@1.2.3':
+    resolution: {integrity: sha512-n+vmCEgTesRsOpp5AB5ILB6srsgsYK+bieoQBNlafvoEhjVXLq8nIGN4B0v/s4DUfa0dOrjwE/cKJgIKdJXOEg==, tarball: https://registry.npmjs.org/@iconify-json/heroicons/-/heroicons-1.2.3.tgz}
+
   '@iconify-json/mdi@1.2.3':
     resolution: {integrity: sha512-O3cLwbDOK7NNDf2ihaQOH5F9JglnulNDFV7WprU2dSoZu3h3cWH//h74uQAB87brHmvFVxIOkuBX2sZSzYhScg==, tarball: https://registry.npmjs.org/@iconify-json/mdi/-/mdi-1.2.3.tgz}
 
@@ -1809,11 +1848,104 @@ packages:
     peerDependencies:
       tailwindcss: '>=3.0.0 || >= 3.0.0-alpha.1 || >= 4.0.0-alpha.20 || >= 4.0.0-beta.1'
 
+  '@tailwindcss/node@4.1.18':
+    resolution: {integrity: sha512-DoR7U1P7iYhw16qJ49fgXUlry1t4CpXeErJHnQ44JgTSKMaZUdf17cfn5mHchfJ4KRBZRFA/Coo+MUF5+gOaCQ==, tarball: https://registry.npmjs.org/@tailwindcss/node/-/node-4.1.18.tgz}
+
+  '@tailwindcss/oxide-android-arm64@4.1.18':
+    resolution: {integrity: sha512-dJHz7+Ugr9U/diKJA0W6N/6/cjI+ZTAoxPf9Iz9BFRF2GzEX8IvXxFIi/dZBloVJX/MZGvRuFA9rqwdiIEZQ0Q==, tarball: https://registry.npmjs.org/@tailwindcss/oxide-android-arm64/-/oxide-android-arm64-4.1.18.tgz}
+    engines: {node: '>= 10'}
+    cpu: [arm64]
+    os: [android]
+
+  '@tailwindcss/oxide-darwin-arm64@4.1.18':
+    resolution: {integrity: sha512-Gc2q4Qhs660bhjyBSKgq6BYvwDz4G+BuyJ5H1xfhmDR3D8HnHCmT/BSkvSL0vQLy/nkMLY20PQ2OoYMO15Jd0A==, tarball: https://registry.npmjs.org/@tailwindcss/oxide-darwin-arm64/-/oxide-darwin-arm64-4.1.18.tgz}
+    engines: {node: '>= 10'}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@tailwindcss/oxide-darwin-x64@4.1.18':
+    resolution: {integrity: sha512-FL5oxr2xQsFrc3X9o1fjHKBYBMD1QZNyc1Xzw/h5Qu4XnEBi3dZn96HcHm41c/euGV+GRiXFfh2hUCyKi/e+yw==, tarball: https://registry.npmjs.org/@tailwindcss/oxide-darwin-x64/-/oxide-darwin-x64-4.1.18.tgz}
+    engines: {node: '>= 10'}
+    cpu: [x64]
+    os: [darwin]
+
+  '@tailwindcss/oxide-freebsd-x64@4.1.18':
+    resolution: {integrity: sha512-Fj+RHgu5bDodmV1dM9yAxlfJwkkWvLiRjbhuO2LEtwtlYlBgiAT4x/j5wQr1tC3SANAgD+0YcmWVrj8R9trVMA==, tarball: https://registry.npmjs.org/@tailwindcss/oxide-freebsd-x64/-/oxide-freebsd-x64-4.1.18.tgz}
+    engines: {node: '>= 10'}
+    cpu: [x64]
+    os: [freebsd]
+
+  '@tailwindcss/oxide-linux-arm-gnueabihf@4.1.18':
+    resolution: {integrity: sha512-Fp+Wzk/Ws4dZn+LV2Nqx3IilnhH51YZoRaYHQsVq3RQvEl+71VGKFpkfHrLM/Li+kt5c0DJe/bHXK1eHgDmdiA==, tarball: https://registry.npmjs.org/@tailwindcss/oxide-linux-arm-gnueabihf/-/oxide-linux-arm-gnueabihf-4.1.18.tgz}
+    engines: {node: '>= 10'}
+    cpu: [arm]
+    os: [linux]
+
+  '@tailwindcss/oxide-linux-arm64-gnu@4.1.18':
+    resolution: {integrity: sha512-S0n3jboLysNbh55Vrt7pk9wgpyTTPD0fdQeh7wQfMqLPM/Hrxi+dVsLsPrycQjGKEQk85Kgbx+6+QnYNiHalnw==, tarball: https://registry.npmjs.org/@tailwindcss/oxide-linux-arm64-gnu/-/oxide-linux-arm64-gnu-4.1.18.tgz}
+    engines: {node: '>= 10'}
+    cpu: [arm64]
+    os: [linux]
+
+  '@tailwindcss/oxide-linux-arm64-musl@4.1.18':
+    resolution: {integrity: sha512-1px92582HkPQlaaCkdRcio71p8bc8i/ap5807tPRDK/uw953cauQBT8c5tVGkOwrHMfc2Yh6UuxaH4vtTjGvHg==, tarball: https://registry.npmjs.org/@tailwindcss/oxide-linux-arm64-musl/-/oxide-linux-arm64-musl-4.1.18.tgz}
+    engines: {node: '>= 10'}
+    cpu: [arm64]
+    os: [linux]
+
+  '@tailwindcss/oxide-linux-x64-gnu@4.1.18':
+    resolution: {integrity: sha512-v3gyT0ivkfBLoZGF9LyHmts0Isc8jHZyVcbzio6Wpzifg/+5ZJpDiRiUhDLkcr7f/r38SWNe7ucxmGW3j3Kb/g==, tarball: https://registry.npmjs.org/@tailwindcss/oxide-linux-x64-gnu/-/oxide-linux-x64-gnu-4.1.18.tgz}
+    engines: {node: '>= 10'}
+    cpu: [x64]
+    os: [linux]
+
+  '@tailwindcss/oxide-linux-x64-musl@4.1.18':
+    resolution: {integrity: sha512-bhJ2y2OQNlcRwwgOAGMY0xTFStt4/wyU6pvI6LSuZpRgKQwxTec0/3Scu91O8ir7qCR3AuepQKLU/kX99FouqQ==, tarball: https://registry.npmjs.org/@tailwindcss/oxide-linux-x64-musl/-/oxide-linux-x64-musl-4.1.18.tgz}
+    engines: {node: '>= 10'}
+    cpu: [x64]
+    os: [linux]
+
+  '@tailwindcss/oxide-wasm32-wasi@4.1.18':
+    resolution: {integrity: sha512-LffYTvPjODiP6PT16oNeUQJzNVyJl1cjIebq/rWWBF+3eDst5JGEFSc5cWxyRCJ0Mxl+KyIkqRxk1XPEs9x8TA==, tarball: https://registry.npmjs.org/@tailwindcss/oxide-wasm32-wasi/-/oxide-wasm32-wasi-4.1.18.tgz}
+    engines: {node: '>=14.0.0'}
+    cpu: [wasm32]
+    bundledDependencies:
+      - '@napi-rs/wasm-runtime'
+      - '@emnapi/core'
+      - '@emnapi/runtime'
+      - '@tybys/wasm-util'
+      - '@emnapi/wasi-threads'
+      - tslib
+
+  '@tailwindcss/oxide-win32-arm64-msvc@4.1.18':
+    resolution: {integrity: sha512-HjSA7mr9HmC8fu6bdsZvZ+dhjyGCLdotjVOgLA2vEqxEBZaQo9YTX4kwgEvPCpRh8o4uWc4J/wEoFzhEmjvPbA==, tarball: https://registry.npmjs.org/@tailwindcss/oxide-win32-arm64-msvc/-/oxide-win32-arm64-msvc-4.1.18.tgz}
+    engines: {node: '>= 10'}
+    cpu: [arm64]
+    os: [win32]
+
+  '@tailwindcss/oxide-win32-x64-msvc@4.1.18':
+    resolution: {integrity: sha512-bJWbyYpUlqamC8dpR7pfjA0I7vdF6t5VpUGMWRkXVE3AXgIZjYUYAK7II1GNaxR8J1SSrSrppRar8G++JekE3Q==, tarball: https://registry.npmjs.org/@tailwindcss/oxide-win32-x64-msvc/-/oxide-win32-x64-msvc-4.1.18.tgz}
+    engines: {node: '>= 10'}
+    cpu: [x64]
+    os: [win32]
+
+  '@tailwindcss/oxide@4.1.18':
+    resolution: {integrity: sha512-EgCR5tTS5bUSKQgzeMClT6iCY3ToqE1y+ZB0AKldj809QXk1Y+3jB0upOYZrn9aGIzPtUsP7sX4QQ4XtjBB95A==, tarball: https://registry.npmjs.org/@tailwindcss/oxide/-/oxide-4.1.18.tgz}
+    engines: {node: '>= 10'}
+
+  '@tailwindcss/postcss@4.1.18':
+    resolution: {integrity: sha512-Ce0GFnzAOuPyfV5SxjXGn0CubwGcuDB0zcdaPuCSzAa/2vII24JTkH+I6jcbXLb1ctjZMZZI6OjDaLPJQL1S0g==, tarball: https://registry.npmjs.org/@tailwindcss/postcss/-/postcss-4.1.18.tgz}
+
   '@tailwindcss/typography@0.5.19':
     resolution: {integrity: sha512-w31dd8HOx3k9vPtcQh5QHP9GwKcgbMp87j58qi6xgiBnFFtKEAgCWnDw4qUT8aHwkCp8bKvb/KGKWWHedP0AAg==, tarball: https://registry.npmjs.org/@tailwindcss/typography/-/typography-0.5.19.tgz}
     peerDependencies:
       tailwindcss: '>=3.0.0 || insiders || >=4.0.0-alpha.20 || >=4.0.0-beta.1'
 
+  '@tailwindcss/vite@4.1.18':
+    resolution: {integrity: sha512-jVA+/UpKL1vRLg6Hkao5jldawNmRo7mQYrZtNHMIVpLfLhDml5nMRUo/8MwoX2vNXvnaXNNMedrMfMugAVX1nA==, tarball: https://registry.npmjs.org/@tailwindcss/vite/-/vite-4.1.18.tgz}
+    peerDependencies:
+      vite: ^5.2.0 || ^6 || ^7
+
   '@tybys/wasm-util@0.10.1':
     resolution: {integrity: sha512-9tTaPJLSiejZKx+Bmog4uSubteqTvFrVrURwkmHixBo0G4seD0zUxp98E1DzUBJxLQ3NPwXrGKDiVjwx/DpPsg==, tarball: https://registry.npmjs.org/@tybys/wasm-util/-/wasm-util-0.10.1.tgz}
 
@@ -2956,6 +3088,10 @@ packages:
     resolution: {integrity: sha512-HqD3yTBfnBxIrbnM1DoD6Pcq8NECnh8d4As1Qgh0z5Gg3jRRIqijury0CL3ghu/edArpUYiYqQiDUQBIs4np3Q==, tarball: https://registry.npmjs.org/engine.io-parser/-/engine.io-parser-5.2.3.tgz}
     engines: {node: '>=10.0.0'}
 
+  enhanced-resolve@5.18.4:
+    resolution: {integrity: sha512-LgQMM4WXU3QI+SYgEc2liRgznaD5ojbmY3sb8LxyguVkIg5FxdpTkvk72te2R38/TGKxH634oLxXRGY6d7AP+Q==, tarball: https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.18.4.tgz}
+    engines: {node: '>=10.13.0'}
+
   entities@4.5.0:
     resolution: {integrity: sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==, tarball: https://registry.npmjs.org/entities/-/entities-4.5.0.tgz}
     engines: {node: '>=0.12'}
@@ -5469,6 +5605,13 @@ packages:
     engines: {node: '>=14.0.0'}
     hasBin: true
 
+  tailwindcss@4.1.18:
+    resolution: {integrity: sha512-4+Z+0yiYyEtUVCScyfHCxOYP06L5Ne+JiHhY2IjR2KWMIWhJOYZKLSGZaP5HkZ8+bY0cxfzwDE5uOmzFXyIwxw==, tarball: https://registry.npmjs.org/tailwindcss/-/tailwindcss-4.1.18.tgz}
+
+  tapable@2.3.0:
+    resolution: {integrity: sha512-g9ljZiwki/LfxmQADO3dEY1CbpmXT5Hm2fJ+QaGKwSXUylMybePR7/67YW7jOrrvjEgL1Fmz5kzyAjWVWLlucg==, tarball: https://registry.npmjs.org/tapable/-/tapable-2.3.0.tgz}
+    engines: {node: '>=6'}
+
   tar-fs@2.1.4:
     resolution: {integrity: sha512-mDAjwmZdh7LTT6pNleZ05Yt65HC3E+NiQzl672vQG38jIrehtJk/J3mNwIg+vShQPcLF/LV7CMnDW6vjj6sfYQ==, tarball: https://registry.npmjs.org/tar-fs/-/tar-fs-2.1.4.tgz}
 
@@ -6597,10 +6740,30 @@ snapshots:
     dependencies:
       '@iconify/types': 2.0.0
 
+  '@iconify-json/fa-brands@1.2.2':
+    dependencies:
+      '@iconify/types': 2.0.0
+
+  '@iconify-json/fa-solid@1.2.2':
+    dependencies:
+      '@iconify/types': 2.0.0
+
   '@iconify-json/fa@1.2.2':
     dependencies:
       '@iconify/types': 2.0.0
 
+  '@iconify-json/heroicons-outline@1.2.1':
+    dependencies:
+      '@iconify/types': 2.0.0
+
+  '@iconify-json/heroicons-solid@1.2.1':
+    dependencies:
+      '@iconify/types': 2.0.0
+
+  '@iconify-json/heroicons@1.2.3':
+    dependencies:
+      '@iconify/types': 2.0.0
+
   '@iconify-json/mdi@1.2.3':
     dependencies:
       '@iconify/types': 2.0.0
@@ -7980,15 +8143,91 @@ snapshots:
     dependencies:
       tslib: 2.8.1
 
-  '@tailwindcss/forms@0.5.11(tailwindcss@3.4.19(yaml@2.8.2))':
+  '@tailwindcss/forms@0.5.11(tailwindcss@4.1.18)':
     dependencies:
       mini-svg-data-uri: 1.4.4
-      tailwindcss: 3.4.19(yaml@2.8.2)
+      tailwindcss: 4.1.18
 
-  '@tailwindcss/typography@0.5.19(tailwindcss@3.4.19(yaml@2.8.2))':
+  '@tailwindcss/node@4.1.18':
+    dependencies:
+      '@jridgewell/remapping': 2.3.5
+      enhanced-resolve: 5.18.4
+      jiti: 2.6.1
+      lightningcss: 1.30.2
+      magic-string: 0.30.21
+      source-map-js: 1.2.1
+      tailwindcss: 4.1.18
+
+  '@tailwindcss/oxide-android-arm64@4.1.18':
+    optional: true
+
+  '@tailwindcss/oxide-darwin-arm64@4.1.18':
+    optional: true
+
+  '@tailwindcss/oxide-darwin-x64@4.1.18':
+    optional: true
+
+  '@tailwindcss/oxide-freebsd-x64@4.1.18':
+    optional: true
+
+  '@tailwindcss/oxide-linux-arm-gnueabihf@4.1.18':
+    optional: true
+
+  '@tailwindcss/oxide-linux-arm64-gnu@4.1.18':
+    optional: true
+
+  '@tailwindcss/oxide-linux-arm64-musl@4.1.18':
+    optional: true
+
+  '@tailwindcss/oxide-linux-x64-gnu@4.1.18':
+    optional: true
+
+  '@tailwindcss/oxide-linux-x64-musl@4.1.18':
+    optional: true
+
+  '@tailwindcss/oxide-wasm32-wasi@4.1.18':
+    optional: true
+
+  '@tailwindcss/oxide-win32-arm64-msvc@4.1.18':
+    optional: true
+
+  '@tailwindcss/oxide-win32-x64-msvc@4.1.18':
+    optional: true
+
+  '@tailwindcss/oxide@4.1.18':
+    optionalDependencies:
+      '@tailwindcss/oxide-android-arm64': 4.1.18
+      '@tailwindcss/oxide-darwin-arm64': 4.1.18
+      '@tailwindcss/oxide-darwin-x64': 4.1.18
+      '@tailwindcss/oxide-freebsd-x64': 4.1.18
+      '@tailwindcss/oxide-linux-arm-gnueabihf': 4.1.18
+      '@tailwindcss/oxide-linux-arm64-gnu': 4.1.18
+      '@tailwindcss/oxide-linux-arm64-musl': 4.1.18
+      '@tailwindcss/oxide-linux-x64-gnu': 4.1.18
+      '@tailwindcss/oxide-linux-x64-musl': 4.1.18
+      '@tailwindcss/oxide-wasm32-wasi': 4.1.18
+      '@tailwindcss/oxide-win32-arm64-msvc': 4.1.18
+      '@tailwindcss/oxide-win32-x64-msvc': 4.1.18
+
+  '@tailwindcss/postcss@4.1.18':
+    dependencies:
+      '@alloc/quick-lru': 5.2.0
+      '@tailwindcss/node': 4.1.18
+      '@tailwindcss/oxide': 4.1.18
+      postcss: 8.5.6
+      tailwindcss: 4.1.18
+
+  '@tailwindcss/typography@0.5.19(tailwindcss@4.1.18)':
     dependencies:
       postcss-selector-parser: 6.0.10
-      tailwindcss: 3.4.19(yaml@2.8.2)
+      tailwindcss: 4.1.18
+
+  '@tailwindcss/vite@4.1.18(vite@7.3.0(@types/node@25.0.3)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.1)(yaml@2.8.2))':
+    dependencies:
+      '@tailwindcss/node': 4.1.18
+      '@tailwindcss/oxide': 4.1.18
+      tailwindcss: 4.1.18
+      vite: 7.3.0(@types/node@25.0.3)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.1)(yaml@2.8.2)
 
   '@tybys/wasm-util@0.10.1':
     dependencies:
@@ -9148,6 +9387,11 @@ snapshots:
 
   engine.io-parser@5.2.3: {}
 
+  enhanced-resolve@5.18.4:
+    dependencies:
+      graceful-fs: 4.2.11
+      tapable: 2.3.0
+
   entities@4.5.0: {}
 
   entities@6.0.1: {}
@@ -12531,6 +12775,10 @@ snapshots:
       - tsx
       - yaml
 
+  tailwindcss@4.1.18: {}
+
+  tapable@2.3.0: {}
+
   tar-fs@2.1.4:
     dependencies:
       chownr: 1.1.4
diff --git a/postcss.config.cjs b/postcss.config.cjs
new file mode 100644
index 0000000..5a71ab5
--- /dev/null
+++ b/postcss.config.cjs
@@ -0,0 +1,6 @@
+module.exports = {
+  plugins: {
+    "@tailwindcss/postcss": {},
+    autoprefixer: {},
+  },
+};