diff --git a/package-lock.json b/package-lock.json
index a3b21b0..4d41fea 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "client",
-  "version": "0.0.0",
+  "version": "0.3.0-alpha",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "client",
-      "version": "0.0.0",
+      "version": "0.3.0-alpha",
       "dependencies": {
         "@mantine/core": "^8.3.13",
         "@mantine/dates": "^8.3.13",
@@ -21,7 +21,10 @@
         "postcss-simple-vars": "^7.0.1",
         "react": "^19.2.0",
         "react-dom": "^19.2.0",
+        "react-markdown": "^10.1.0",
         "react-router-dom": "^7.13.0",
+        "rehype-sanitize": "^6.0.0",
+        "remark-gfm": "^4.0.1",
         "zustand": "^5.0.10"
       },
       "devDependencies": {
@@ -1661,13 +1664,39 @@
         "@babel/types": "^7.28.2"
       }
     },
+    "node_modules/@types/debug": {
+      "version": "4.1.12",
+      "resolved": "https://registry.npmmirror.com/@types/debug/-/debug-4.1.12.tgz",
+      "integrity": "sha512-vIChWdVG3LG1SMxEvI/AK+FWJthlrqlTu7fbrlywTkkaONwk/UAGaULXRlf8vkzFBLVm0zkMdCquhL5aOjhXPQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/ms": "*"
+      }
+    },
     "node_modules/@types/estree": {
       "version": "1.0.8",
       "resolved": "https://registry.npmmirror.com/@types/estree/-/estree-1.0.8.tgz",
       "integrity": "sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==",
-      "dev": true,
       "license": "MIT"
     },
+    "node_modules/@types/estree-jsx": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmmirror.com/@types/estree-jsx/-/estree-jsx-1.0.5.tgz",
+      "integrity": "sha512-52CcUVNFyfb1A2ALocQw/Dd1BQFNmSdkuC3BkZ6iqhdMfQz7JWOFRuJFloOzjk+6WijU56m9oKXFAXc7o3Towg==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/estree": "*"
+      }
+    },
+    "node_modules/@types/hast": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmmirror.com/@types/hast/-/hast-3.0.4.tgz",
+      "integrity": "sha512-WPs+bbQw5aCj+x6laNGWLH3wviHtoCv/P3+otBhbOhJgG8qtpdAMlTCxLtsTWA7LH1Oh/bFCHsBn0TPS5m30EQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/unist": "*"
+      }
+    },
     "node_modules/@types/json-schema": {
       "version": "7.0.15",
       "resolved": "https://registry.npmmirror.com/@types/json-schema/-/json-schema-7.0.15.tgz",
@@ -1675,6 +1704,21 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/@types/mdast": {
+      "version": "4.0.4",
+      "resolved": "https://registry.npmmirror.com/@types/mdast/-/mdast-4.0.4.tgz",
+      "integrity": "sha512-kGaNbPh1k7AFzgpud/gMdvIm5xuECykRR+JnWKQno9TAXVa6WIVCGTPvYGekIDL4uwCZQSYbUxNBSb1aUo79oA==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/unist": "*"
+      }
+    },
+    "node_modules/@types/ms": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmmirror.com/@types/ms/-/ms-2.1.0.tgz",
+      "integrity": "sha512-GsCCIZDE/p3i96vtEqx+7dBUGXrc7zeSK3wwPHIaRThS+9OhWIXRqzs4d6k1SVU8g91DrNRWxWUGhp5KXQb2VA==",
+      "license": "MIT"
+    },
     "node_modules/@types/node": {
       "version": "24.10.9",
       "resolved": "https://registry.npmmirror.com/@types/node/-/node-24.10.9.tgz",
@@ -1694,7 +1738,6 @@
       "version": "19.2.10",
       "resolved": "https://registry.npmmirror.com/@types/react/-/react-19.2.10.tgz",
       "integrity": "sha512-WPigyYuGhgZ/cTPRXB2EwUw+XvsRA3GqHlsP4qteqrnnjDrApbS7MxcGr/hke5iUoeB7E/gQtrs9I37zAJ0Vjw==",
-      "devOptional": true,
       "license": "MIT",
       "dependencies": {
         "csstype": "^3.2.2"
@@ -1710,6 +1753,12 @@
         "@types/react": "^19.2.0"
       }
     },
+    "node_modules/@types/unist": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmmirror.com/@types/unist/-/unist-3.0.3.tgz",
+      "integrity": "sha512-ko/gIFJRv177XgZsZcBwnqJN5x/Gien8qNOn0D5bQU/zAzVf9Zt3BlcUiLqhV9y4ARk0GbT3tnUiPNgnTXzc/Q==",
+      "license": "MIT"
+    },
     "node_modules/@types/ws": {
       "version": "8.18.1",
       "resolved": "https://registry.npmmirror.com/@types/ws/-/ws-8.18.1.tgz",
@@ -1988,6 +2037,12 @@
         "url": "https://opencollective.com/typescript-eslint"
       }
     },
+    "node_modules/@ungap/structured-clone": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmmirror.com/@ungap/structured-clone/-/structured-clone-1.3.0.tgz",
+      "integrity": "sha512-WmoN8qaIAo7WTYWbAZuG8PYEhn5fkz7dZrqTBZ7dtt//lL2Gwms1IcnQ5yHqjDfX8Ft5j4YzDM23f87zBfDe9g==",
+      "license": "ISC"
+    },
     "node_modules/@vitejs/plugin-react": {
       "version": "5.1.2",
       "resolved": "https://registry.npmmirror.com/@vitejs/plugin-react/-/plugin-react-5.1.2.tgz",
@@ -2072,6 +2127,16 @@
       "dev": true,
       "license": "Python-2.0"
     },
+    "node_modules/bail": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmmirror.com/bail/-/bail-2.0.2.tgz",
+      "integrity": "sha512-0xO6mYd7JB2YesxDKplafRpsiOzPt9V02ddPCLbY1xYGPOX24NTyN50qnUxgCPcSoYMhKpAuBTjQoRZCAkUDRw==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
     "node_modules/balanced-match": {
       "version": "1.0.2",
       "resolved": "https://registry.npmmirror.com/balanced-match/-/balanced-match-1.0.2.tgz",
@@ -2174,6 +2239,16 @@
       ],
       "license": "CC-BY-4.0"
     },
+    "node_modules/ccount": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmmirror.com/ccount/-/ccount-2.0.1.tgz",
+      "integrity": "sha512-eyrF0jiFpY+3drT6383f1qhkbGsLSifNAjA61IUjZjmLCWjItY6LB9ft9YhoDgwfmclB2zhu51Lc7+95b8NRAg==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
     "node_modules/chalk": {
       "version": "4.1.2",
       "resolved": "https://registry.npmmirror.com/chalk/-/chalk-4.1.2.tgz",
@@ -2191,6 +2266,46 @@
         "url": "https://github.com/chalk/chalk?sponsor=1"
       }
     },
+    "node_modules/character-entities": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmmirror.com/character-entities/-/character-entities-2.0.2.tgz",
+      "integrity": "sha512-shx7oQ0Awen/BRIdkjkvz54PnEEI/EjwXDSIZp86/KKdbafHh1Df/RYGBhn4hbe2+uKC9FnT5UCEdyPz3ai9hQ==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/character-entities-html4": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmmirror.com/character-entities-html4/-/character-entities-html4-2.1.0.tgz",
+      "integrity": "sha512-1v7fgQRj6hnSwFpq1Eu0ynr/CDEw0rXo2B61qXrLNdHZmPKgb7fqS1a2JwF0rISo9q77jDI8VMEHoApn8qDoZA==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/character-entities-legacy": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmmirror.com/character-entities-legacy/-/character-entities-legacy-3.0.0.tgz",
+      "integrity": "sha512-RpPp0asT/6ufRm//AJVwpViZbGM/MkjQFxJccQRHmISF/22NBtsHqAWmL+/pmkPWoIUJdWyeVleTl1wydHATVQ==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/character-reference-invalid": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmmirror.com/character-reference-invalid/-/character-reference-invalid-2.0.1.tgz",
+      "integrity": "sha512-iBZ4F4wRbyORVsu0jPV7gXkOsGYjGHPmAyv+HiHG8gi5PtC9KI2j1+v8/tlibRvjoWX027ypmG/n0HtO5t7unw==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
     "node_modules/clsx": {
       "version": "2.1.1",
       "resolved": "https://registry.npmmirror.com/clsx/-/clsx-2.1.1.tgz",
@@ -2220,6 +2335,16 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/comma-separated-tokens": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmmirror.com/comma-separated-tokens/-/comma-separated-tokens-2.0.3.tgz",
+      "integrity": "sha512-Fu4hJdvzeylCfQPp9SGWidpzrMs7tTrlu6Vb8XGaRGck8QSNZJJp538Wrb60Lax4fPwR64ViY468OIUTbRlGZg==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
     "node_modules/concat-map": {
       "version": "0.0.1",
       "resolved": "https://registry.npmmirror.com/concat-map/-/concat-map-0.0.1.tgz",
@@ -2301,7 +2426,6 @@
       "version": "4.4.3",
       "resolved": "https://registry.npmmirror.com/debug/-/debug-4.4.3.tgz",
       "integrity": "sha512-RGwwWnwQvkVfavKVt22FGLw+xYSdzARwm0ru6DhTVA3umU5hZc28V3kO4stgYryrTlLpuvgI9GiijltAjNbcqA==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "ms": "^2.1.3"
@@ -2315,6 +2439,19 @@
         }
       }
     },
+    "node_modules/decode-named-character-reference": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmmirror.com/decode-named-character-reference/-/decode-named-character-reference-1.3.0.tgz",
+      "integrity": "sha512-GtpQYB283KrPp6nRw50q3U9/VfOutZOe103qlN7BPP6Ad27xYnOIWv4lPzo8HCAL+mMZofJ9KEy30fq6MfaK6Q==",
+      "license": "MIT",
+      "dependencies": {
+        "character-entities": "^2.0.0"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
     "node_modules/deep-is": {
       "version": "0.1.4",
       "resolved": "https://registry.npmmirror.com/deep-is/-/deep-is-0.1.4.tgz",
@@ -2322,12 +2459,34 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/dequal": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmmirror.com/dequal/-/dequal-2.0.3.tgz",
+      "integrity": "sha512-0je+qPKHEMohvfRTCEo3CrPG6cAzAYgmzKyxRiYSSDkS6eGJdyVJm7WaYA5ECaAD9wLB2T4EEeymA5aFVcYXCA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
     "node_modules/detect-node-es": {
       "version": "1.1.0",
       "resolved": "https://registry.npmmirror.com/detect-node-es/-/detect-node-es-1.1.0.tgz",
       "integrity": "sha512-ypdmJU/TbBby2Dxibuv7ZLW3Bs1QEmM7nHjEANfohJLvE0XVujisn1qPJcZxg+qDucsr+bP6fLD1rPS3AhJ7EQ==",
       "license": "MIT"
     },
+    "node_modules/devlop": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmmirror.com/devlop/-/devlop-1.1.0.tgz",
+      "integrity": "sha512-RWmIqhcFf1lRYBvNmr7qTNuyCt/7/ns2jbpp1+PalgE/rDQcBT0fioSMUpJ93irlUhC5hrg4cYqe6U+0ImW0rA==",
+      "license": "MIT",
+      "dependencies": {
+        "dequal": "^2.0.0"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
     "node_modules/dom-helpers": {
       "version": "5.2.1",
       "resolved": "https://registry.npmmirror.com/dom-helpers/-/dom-helpers-5.2.1.tgz",
@@ -2584,6 +2743,16 @@
         "node": ">=4.0"
       }
     },
+    "node_modules/estree-util-is-identifier-name": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmmirror.com/estree-util-is-identifier-name/-/estree-util-is-identifier-name-3.0.0.tgz",
+      "integrity": "sha512-hFtqIDZTIUZ9BXLb8y4pYGyk6+wekIivNVTcmvk8NoOh+VeRn5y6cEHzbURrWbfp1fIqdVipilzj+lfaadNZmg==",
+      "license": "MIT",
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
     "node_modules/esutils": {
       "version": "2.0.3",
       "resolved": "https://registry.npmmirror.com/esutils/-/esutils-2.0.3.tgz",
@@ -2594,6 +2763,12 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/extend": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmmirror.com/extend/-/extend-3.0.2.tgz",
+      "integrity": "sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g==",
+      "license": "MIT"
+    },
     "node_modules/fast-deep-equal": {
       "version": "3.1.3",
       "resolved": "https://registry.npmmirror.com/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
@@ -2753,6 +2928,61 @@
         "node": ">=8"
       }
     },
+    "node_modules/hast-util-sanitize": {
+      "version": "5.0.2",
+      "resolved": "https://registry.npmmirror.com/hast-util-sanitize/-/hast-util-sanitize-5.0.2.tgz",
+      "integrity": "sha512-3yTWghByc50aGS7JlGhk61SPenfE/p1oaFeNwkOOyrscaOkMGrcW9+Cy/QAIOBpZxP1yqDIzFMR0+Np0i0+usg==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/hast": "^3.0.0",
+        "@ungap/structured-clone": "^1.0.0",
+        "unist-util-position": "^5.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/hast-util-to-jsx-runtime": {
+      "version": "2.3.6",
+      "resolved": "https://registry.npmmirror.com/hast-util-to-jsx-runtime/-/hast-util-to-jsx-runtime-2.3.6.tgz",
+      "integrity": "sha512-zl6s8LwNyo1P9uw+XJGvZtdFF1GdAkOg8ujOw+4Pyb76874fLps4ueHXDhXWdk6YHQ6OgUtinliG7RsYvCbbBg==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/estree": "^1.0.0",
+        "@types/hast": "^3.0.0",
+        "@types/unist": "^3.0.0",
+        "comma-separated-tokens": "^2.0.0",
+        "devlop": "^1.0.0",
+        "estree-util-is-identifier-name": "^3.0.0",
+        "hast-util-whitespace": "^3.0.0",
+        "mdast-util-mdx-expression": "^2.0.0",
+        "mdast-util-mdx-jsx": "^3.0.0",
+        "mdast-util-mdxjs-esm": "^2.0.0",
+        "property-information": "^7.0.0",
+        "space-separated-tokens": "^2.0.0",
+        "style-to-js": "^1.0.0",
+        "unist-util-position": "^5.0.0",
+        "vfile-message": "^4.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/hast-util-whitespace": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmmirror.com/hast-util-whitespace/-/hast-util-whitespace-3.0.0.tgz",
+      "integrity": "sha512-88JUN06ipLwsnv+dVn+OIYOvAuvBMy/Qoi6O7mQHxdPXpjy+Cd6xRkWwux7DKO+4sYILtLBRIKgsdpS2gQc7qw==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/hast": "^3.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
     "node_modules/hermes-estree": {
       "version": "0.25.1",
       "resolved": "https://registry.npmmirror.com/hermes-estree/-/hermes-estree-0.25.1.tgz",
@@ -2770,6 +3000,16 @@
         "hermes-estree": "0.25.1"
       }
     },
+    "node_modules/html-url-attributes": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmmirror.com/html-url-attributes/-/html-url-attributes-3.0.1.tgz",
+      "integrity": "sha512-ol6UPyBWqsrO6EJySPz2O7ZSr856WDrEzM5zMqp+FJJLGMW35cLYmmZnl0vztAZxRUoNZJFTCohfjuIJ8I4QBQ==",
+      "license": "MIT",
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
     "node_modules/iceberg-js": {
       "version": "0.8.1",
       "resolved": "https://registry.npmmirror.com/iceberg-js/-/iceberg-js-0.8.1.tgz",
@@ -2816,6 +3056,46 @@
         "node": ">=0.8.19"
       }
     },
+    "node_modules/inline-style-parser": {
+      "version": "0.2.7",
+      "resolved": "https://registry.npmmirror.com/inline-style-parser/-/inline-style-parser-0.2.7.tgz",
+      "integrity": "sha512-Nb2ctOyNR8DqQoR0OwRG95uNWIC0C1lCgf5Naz5H6Ji72KZ8OcFZLz2P5sNgwlyoJ8Yif11oMuYs5pBQa86csA==",
+      "license": "MIT"
+    },
+    "node_modules/is-alphabetical": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmmirror.com/is-alphabetical/-/is-alphabetical-2.0.1.tgz",
+      "integrity": "sha512-FWyyY60MeTNyeSRpkM2Iry0G9hpr7/9kD40mD/cGQEuilcZYS4okz8SN2Q6rLCJ8gbCt6fN+rC+6tMGS99LaxQ==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/is-alphanumerical": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmmirror.com/is-alphanumerical/-/is-alphanumerical-2.0.1.tgz",
+      "integrity": "sha512-hmbYhX/9MUMF5uh7tOXyK/n0ZvWpad5caBA17GsC6vyuCqaWliRG5K1qS9inmUhEMaOBIW7/whAnSwveW/LtZw==",
+      "license": "MIT",
+      "dependencies": {
+        "is-alphabetical": "^2.0.0",
+        "is-decimal": "^2.0.0"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/is-decimal": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmmirror.com/is-decimal/-/is-decimal-2.0.1.tgz",
+      "integrity": "sha512-AAB9hiomQs5DXWcRB1rqsxGUstbRroFOPPVAomNk/3XHR5JyEZChOyTWe2oayKnsSsr/kcGqF+z6yuH6HHpN0A==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
     "node_modules/is-extglob": {
       "version": "2.1.1",
       "resolved": "https://registry.npmmirror.com/is-extglob/-/is-extglob-2.1.1.tgz",
@@ -2839,6 +3119,28 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/is-hexadecimal": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmmirror.com/is-hexadecimal/-/is-hexadecimal-2.0.1.tgz",
+      "integrity": "sha512-DgZQp241c8oO6cA1SbTEWiXeoxV42vlcJxgH+B3hi1AiqqKruZR3ZGF8In3fj4+/y/7rHvlOZLZtgJ/4ttYGZg==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/is-plain-obj": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmmirror.com/is-plain-obj/-/is-plain-obj-4.1.0.tgz",
+      "integrity": "sha512-+Pgi+vMuUNkJyExiMBt5IlFoMyKnr5zhJ4Uspz58WOhBF5QoIZkFyNHIbBAtHwzVAgk5RtndVNsDRN61/mmDqg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/isexe": {
       "version": "2.0.0",
       "resolved": "https://registry.npmmirror.com/isexe/-/isexe-2.0.0.tgz",
@@ -2959,6 +3261,16 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/longest-streak": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmmirror.com/longest-streak/-/longest-streak-3.1.0.tgz",
+      "integrity": "sha512-9Ri+o0JYgehTaVBBDoMqIl8GXtbWg711O3srftcHhZ0dqnETqLaoIK0x17fUw9rFSlK/0NlsKe0Ahhyl5pXE2g==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
     "node_modules/loose-envify": {
       "version": "1.4.0",
       "resolved": "https://registry.npmmirror.com/loose-envify/-/loose-envify-1.4.0.tgz",
@@ -2987,6 +3299,861 @@
       "integrity": "sha512-u/KYiwPIBo/0bT+WWfU7qO1d+aqeB90Tuy4ErXenr2Gam0QcWeezUvtiOIyXR7HbVnW2I1DKfU0NBvzMZhbVQw==",
       "license": "MIT"
     },
+    "node_modules/markdown-table": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmmirror.com/markdown-table/-/markdown-table-3.0.4.tgz",
+      "integrity": "sha512-wiYz4+JrLyb/DqW2hkFJxP7Vd7JuTDm77fvbM8VfEQdmSMqcImWeeRbHwZjBjIFki/VaMK2BhFi7oUUZeM5bqw==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/mdast-util-find-and-replace": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmmirror.com/mdast-util-find-and-replace/-/mdast-util-find-and-replace-3.0.2.tgz",
+      "integrity": "sha512-Tmd1Vg/m3Xz43afeNxDIhWRtFZgM2VLyaf4vSTYwudTyeuTneoL3qtWMA5jeLyz/O1vDJmmV4QuScFCA2tBPwg==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/mdast": "^4.0.0",
+        "escape-string-regexp": "^5.0.0",
+        "unist-util-is": "^6.0.0",
+        "unist-util-visit-parents": "^6.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/mdast-util-find-and-replace/node_modules/escape-string-regexp": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmmirror.com/escape-string-regexp/-/escape-string-regexp-5.0.0.tgz",
+      "integrity": "sha512-/veY75JbMK4j1yjvuUxuVsiS/hr/4iHs9FTT6cgTexxdE0Ly/glccBAkloH/DofkjRbZU3bnoj38mOmhkZ0lHw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/mdast-util-from-markdown": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmmirror.com/mdast-util-from-markdown/-/mdast-util-from-markdown-2.0.2.tgz",
+      "integrity": "sha512-uZhTV/8NBuw0WHkPTrCqDOl0zVe1BIng5ZtHoDk49ME1qqcjYmmLmOf0gELgcRMxN4w2iuIeVso5/6QymSrgmA==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/mdast": "^4.0.0",
+        "@types/unist": "^3.0.0",
+        "decode-named-character-reference": "^1.0.0",
+        "devlop": "^1.0.0",
+        "mdast-util-to-string": "^4.0.0",
+        "micromark": "^4.0.0",
+        "micromark-util-decode-numeric-character-reference": "^2.0.0",
+        "micromark-util-decode-string": "^2.0.0",
+        "micromark-util-normalize-identifier": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0",
+        "micromark-util-types": "^2.0.0",
+        "unist-util-stringify-position": "^4.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/mdast-util-gfm": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmmirror.com/mdast-util-gfm/-/mdast-util-gfm-3.1.0.tgz",
+      "integrity": "sha512-0ulfdQOM3ysHhCJ1p06l0b0VKlhU0wuQs3thxZQagjcjPrlFRqY215uZGHHJan9GEAXd9MbfPjFJz+qMkVR6zQ==",
+      "license": "MIT",
+      "dependencies": {
+        "mdast-util-from-markdown": "^2.0.0",
+        "mdast-util-gfm-autolink-literal": "^2.0.0",
+        "mdast-util-gfm-footnote": "^2.0.0",
+        "mdast-util-gfm-strikethrough": "^2.0.0",
+        "mdast-util-gfm-table": "^2.0.0",
+        "mdast-util-gfm-task-list-item": "^2.0.0",
+        "mdast-util-to-markdown": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/mdast-util-gfm-autolink-literal": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmmirror.com/mdast-util-gfm-autolink-literal/-/mdast-util-gfm-autolink-literal-2.0.1.tgz",
+      "integrity": "sha512-5HVP2MKaP6L+G6YaxPNjuL0BPrq9orG3TsrZ9YXbA3vDw/ACI4MEsnoDpn6ZNm7GnZgtAcONJyPhOP8tNJQavQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/mdast": "^4.0.0",
+        "ccount": "^2.0.0",
+        "devlop": "^1.0.0",
+        "mdast-util-find-and-replace": "^3.0.0",
+        "micromark-util-character": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/mdast-util-gfm-footnote": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmmirror.com/mdast-util-gfm-footnote/-/mdast-util-gfm-footnote-2.1.0.tgz",
+      "integrity": "sha512-sqpDWlsHn7Ac9GNZQMeUzPQSMzR6Wv0WKRNvQRg0KqHh02fpTz69Qc1QSseNX29bhz1ROIyNyxExfawVKTm1GQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/mdast": "^4.0.0",
+        "devlop": "^1.1.0",
+        "mdast-util-from-markdown": "^2.0.0",
+        "mdast-util-to-markdown": "^2.0.0",
+        "micromark-util-normalize-identifier": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/mdast-util-gfm-strikethrough": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmmirror.com/mdast-util-gfm-strikethrough/-/mdast-util-gfm-strikethrough-2.0.0.tgz",
+      "integrity": "sha512-mKKb915TF+OC5ptj5bJ7WFRPdYtuHv0yTRxK2tJvi+BDqbkiG7h7u/9SI89nRAYcmap2xHQL9D+QG/6wSrTtXg==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/mdast": "^4.0.0",
+        "mdast-util-from-markdown": "^2.0.0",
+        "mdast-util-to-markdown": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/mdast-util-gfm-table": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmmirror.com/mdast-util-gfm-table/-/mdast-util-gfm-table-2.0.0.tgz",
+      "integrity": "sha512-78UEvebzz/rJIxLvE7ZtDd/vIQ0RHv+3Mh5DR96p7cS7HsBhYIICDBCu8csTNWNO6tBWfqXPWekRuj2FNOGOZg==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/mdast": "^4.0.0",
+        "devlop": "^1.0.0",
+        "markdown-table": "^3.0.0",
+        "mdast-util-from-markdown": "^2.0.0",
+        "mdast-util-to-markdown": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/mdast-util-gfm-task-list-item": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmmirror.com/mdast-util-gfm-task-list-item/-/mdast-util-gfm-task-list-item-2.0.0.tgz",
+      "integrity": "sha512-IrtvNvjxC1o06taBAVJznEnkiHxLFTzgonUdy8hzFVeDun0uTjxxrRGVaNFqkU1wJR3RBPEfsxmU6jDWPofrTQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/mdast": "^4.0.0",
+        "devlop": "^1.0.0",
+        "mdast-util-from-markdown": "^2.0.0",
+        "mdast-util-to-markdown": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/mdast-util-mdx-expression": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmmirror.com/mdast-util-mdx-expression/-/mdast-util-mdx-expression-2.0.1.tgz",
+      "integrity": "sha512-J6f+9hUp+ldTZqKRSg7Vw5V6MqjATc+3E4gf3CFNcuZNWD8XdyI6zQ8GqH7f8169MM6P7hMBRDVGnn7oHB9kXQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/estree-jsx": "^1.0.0",
+        "@types/hast": "^3.0.0",
+        "@types/mdast": "^4.0.0",
+        "devlop": "^1.0.0",
+        "mdast-util-from-markdown": "^2.0.0",
+        "mdast-util-to-markdown": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/mdast-util-mdx-jsx": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmmirror.com/mdast-util-mdx-jsx/-/mdast-util-mdx-jsx-3.2.0.tgz",
+      "integrity": "sha512-lj/z8v0r6ZtsN/cGNNtemmmfoLAFZnjMbNyLzBafjzikOM+glrjNHPlf6lQDOTccj9n5b0PPihEBbhneMyGs1Q==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/estree-jsx": "^1.0.0",
+        "@types/hast": "^3.0.0",
+        "@types/mdast": "^4.0.0",
+        "@types/unist": "^3.0.0",
+        "ccount": "^2.0.0",
+        "devlop": "^1.1.0",
+        "mdast-util-from-markdown": "^2.0.0",
+        "mdast-util-to-markdown": "^2.0.0",
+        "parse-entities": "^4.0.0",
+        "stringify-entities": "^4.0.0",
+        "unist-util-stringify-position": "^4.0.0",
+        "vfile-message": "^4.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/mdast-util-mdxjs-esm": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmmirror.com/mdast-util-mdxjs-esm/-/mdast-util-mdxjs-esm-2.0.1.tgz",
+      "integrity": "sha512-EcmOpxsZ96CvlP03NghtH1EsLtr0n9Tm4lPUJUBccV9RwUOneqSycg19n5HGzCf+10LozMRSObtVr3ee1WoHtg==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/estree-jsx": "^1.0.0",
+        "@types/hast": "^3.0.0",
+        "@types/mdast": "^4.0.0",
+        "devlop": "^1.0.0",
+        "mdast-util-from-markdown": "^2.0.0",
+        "mdast-util-to-markdown": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/mdast-util-phrasing": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmmirror.com/mdast-util-phrasing/-/mdast-util-phrasing-4.1.0.tgz",
+      "integrity": "sha512-TqICwyvJJpBwvGAMZjj4J2n0X8QWp21b9l0o7eXyVJ25YNWYbJDVIyD1bZXE6WtV6RmKJVYmQAKWa0zWOABz2w==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/mdast": "^4.0.0",
+        "unist-util-is": "^6.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/mdast-util-to-hast": {
+      "version": "13.2.1",
+      "resolved": "https://registry.npmmirror.com/mdast-util-to-hast/-/mdast-util-to-hast-13.2.1.tgz",
+      "integrity": "sha512-cctsq2wp5vTsLIcaymblUriiTcZd0CwWtCbLvrOzYCDZoWyMNV8sZ7krj09FSnsiJi3WVsHLM4k6Dq/yaPyCXA==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/hast": "^3.0.0",
+        "@types/mdast": "^4.0.0",
+        "@ungap/structured-clone": "^1.0.0",
+        "devlop": "^1.0.0",
+        "micromark-util-sanitize-uri": "^2.0.0",
+        "trim-lines": "^3.0.0",
+        "unist-util-position": "^5.0.0",
+        "unist-util-visit": "^5.0.0",
+        "vfile": "^6.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/mdast-util-to-markdown": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmmirror.com/mdast-util-to-markdown/-/mdast-util-to-markdown-2.1.2.tgz",
+      "integrity": "sha512-xj68wMTvGXVOKonmog6LwyJKrYXZPvlwabaryTjLh9LuvovB/KAH+kvi8Gjj+7rJjsFi23nkUxRQv1KqSroMqA==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/mdast": "^4.0.0",
+        "@types/unist": "^3.0.0",
+        "longest-streak": "^3.0.0",
+        "mdast-util-phrasing": "^4.0.0",
+        "mdast-util-to-string": "^4.0.0",
+        "micromark-util-classify-character": "^2.0.0",
+        "micromark-util-decode-string": "^2.0.0",
+        "unist-util-visit": "^5.0.0",
+        "zwitch": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/mdast-util-to-string": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmmirror.com/mdast-util-to-string/-/mdast-util-to-string-4.0.0.tgz",
+      "integrity": "sha512-0H44vDimn51F0YwvxSJSm0eCDOJTRlmN0R1yBh4HLj9wiV1Dn0QoXGbvFAWj2hSItVTlCmBF1hqKlIyUBVFLPg==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/mdast": "^4.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/micromark": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmmirror.com/micromark/-/micromark-4.0.2.tgz",
+      "integrity": "sha512-zpe98Q6kvavpCr1NPVSCMebCKfD7CA2NqZ+rykeNhONIJBpc1tFKt9hucLGwha3jNTNI8lHpctWJWoimVF4PfA==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "@types/debug": "^4.0.0",
+        "debug": "^4.0.0",
+        "decode-named-character-reference": "^1.0.0",
+        "devlop": "^1.0.0",
+        "micromark-core-commonmark": "^2.0.0",
+        "micromark-factory-space": "^2.0.0",
+        "micromark-util-character": "^2.0.0",
+        "micromark-util-chunked": "^2.0.0",
+        "micromark-util-combine-extensions": "^2.0.0",
+        "micromark-util-decode-numeric-character-reference": "^2.0.0",
+        "micromark-util-encode": "^2.0.0",
+        "micromark-util-normalize-identifier": "^2.0.0",
+        "micromark-util-resolve-all": "^2.0.0",
+        "micromark-util-sanitize-uri": "^2.0.0",
+        "micromark-util-subtokenize": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-core-commonmark": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmmirror.com/micromark-core-commonmark/-/micromark-core-commonmark-2.0.3.tgz",
+      "integrity": "sha512-RDBrHEMSxVFLg6xvnXmb1Ayr2WzLAWjeSATAoxwKYJV94TeNavgoIdA0a9ytzDSVzBy2YKFK+emCPOEibLeCrg==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "decode-named-character-reference": "^1.0.0",
+        "devlop": "^1.0.0",
+        "micromark-factory-destination": "^2.0.0",
+        "micromark-factory-label": "^2.0.0",
+        "micromark-factory-space": "^2.0.0",
+        "micromark-factory-title": "^2.0.0",
+        "micromark-factory-whitespace": "^2.0.0",
+        "micromark-util-character": "^2.0.0",
+        "micromark-util-chunked": "^2.0.0",
+        "micromark-util-classify-character": "^2.0.0",
+        "micromark-util-html-tag-name": "^2.0.0",
+        "micromark-util-normalize-identifier": "^2.0.0",
+        "micromark-util-resolve-all": "^2.0.0",
+        "micromark-util-subtokenize": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-extension-gfm": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmmirror.com/micromark-extension-gfm/-/micromark-extension-gfm-3.0.0.tgz",
+      "integrity": "sha512-vsKArQsicm7t0z2GugkCKtZehqUm31oeGBV/KVSorWSy8ZlNAv7ytjFhvaryUiCUJYqs+NoE6AFhpQvBTM6Q4w==",
+      "license": "MIT",
+      "dependencies": {
+        "micromark-extension-gfm-autolink-literal": "^2.0.0",
+        "micromark-extension-gfm-footnote": "^2.0.0",
+        "micromark-extension-gfm-strikethrough": "^2.0.0",
+        "micromark-extension-gfm-table": "^2.0.0",
+        "micromark-extension-gfm-tagfilter": "^2.0.0",
+        "micromark-extension-gfm-task-list-item": "^2.0.0",
+        "micromark-util-combine-extensions": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/micromark-extension-gfm-autolink-literal": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmmirror.com/micromark-extension-gfm-autolink-literal/-/micromark-extension-gfm-autolink-literal-2.1.0.tgz",
+      "integrity": "sha512-oOg7knzhicgQ3t4QCjCWgTmfNhvQbDDnJeVu9v81r7NltNCVmhPy1fJRX27pISafdjL+SVc4d3l48Gb6pbRypw==",
+      "license": "MIT",
+      "dependencies": {
+        "micromark-util-character": "^2.0.0",
+        "micromark-util-sanitize-uri": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/micromark-extension-gfm-footnote": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmmirror.com/micromark-extension-gfm-footnote/-/micromark-extension-gfm-footnote-2.1.0.tgz",
+      "integrity": "sha512-/yPhxI1ntnDNsiHtzLKYnE3vf9JZ6cAisqVDauhp4CEHxlb4uoOTxOCJ+9s51bIB8U1N1FJ1RXOKTIlD5B/gqw==",
+      "license": "MIT",
+      "dependencies": {
+        "devlop": "^1.0.0",
+        "micromark-core-commonmark": "^2.0.0",
+        "micromark-factory-space": "^2.0.0",
+        "micromark-util-character": "^2.0.0",
+        "micromark-util-normalize-identifier": "^2.0.0",
+        "micromark-util-sanitize-uri": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/micromark-extension-gfm-strikethrough": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmmirror.com/micromark-extension-gfm-strikethrough/-/micromark-extension-gfm-strikethrough-2.1.0.tgz",
+      "integrity": "sha512-ADVjpOOkjz1hhkZLlBiYA9cR2Anf8F4HqZUO6e5eDcPQd0Txw5fxLzzxnEkSkfnD0wziSGiv7sYhk/ktvbf1uw==",
+      "license": "MIT",
+      "dependencies": {
+        "devlop": "^1.0.0",
+        "micromark-util-chunked": "^2.0.0",
+        "micromark-util-classify-character": "^2.0.0",
+        "micromark-util-resolve-all": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/micromark-extension-gfm-table": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmmirror.com/micromark-extension-gfm-table/-/micromark-extension-gfm-table-2.1.1.tgz",
+      "integrity": "sha512-t2OU/dXXioARrC6yWfJ4hqB7rct14e8f7m0cbI5hUmDyyIlwv5vEtooptH8INkbLzOatzKuVbQmAYcbWoyz6Dg==",
+      "license": "MIT",
+      "dependencies": {
+        "devlop": "^1.0.0",
+        "micromark-factory-space": "^2.0.0",
+        "micromark-util-character": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/micromark-extension-gfm-tagfilter": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmmirror.com/micromark-extension-gfm-tagfilter/-/micromark-extension-gfm-tagfilter-2.0.0.tgz",
+      "integrity": "sha512-xHlTOmuCSotIA8TW1mDIM6X2O1SiX5P9IuDtqGonFhEK0qgRI4yeC6vMxEV2dgyr2TiD+2PQ10o+cOhdVAcwfg==",
+      "license": "MIT",
+      "dependencies": {
+        "micromark-util-types": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/micromark-extension-gfm-task-list-item": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmmirror.com/micromark-extension-gfm-task-list-item/-/micromark-extension-gfm-task-list-item-2.1.0.tgz",
+      "integrity": "sha512-qIBZhqxqI6fjLDYFTBIa4eivDMnP+OZqsNwmQ3xNLE4Cxwc+zfQEfbs6tzAo2Hjq+bh6q5F+Z8/cksrLFYWQQw==",
+      "license": "MIT",
+      "dependencies": {
+        "devlop": "^1.0.0",
+        "micromark-factory-space": "^2.0.0",
+        "micromark-util-character": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/micromark-factory-destination": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmmirror.com/micromark-factory-destination/-/micromark-factory-destination-2.0.1.tgz",
+      "integrity": "sha512-Xe6rDdJlkmbFRExpTOmRj9N3MaWmbAgdpSrBQvCFqhezUn4AHqJHbaEnfbVYYiexVSs//tqOdY/DxhjdCiJnIA==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "micromark-util-character": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-factory-label": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmmirror.com/micromark-factory-label/-/micromark-factory-label-2.0.1.tgz",
+      "integrity": "sha512-VFMekyQExqIW7xIChcXn4ok29YE3rnuyveW3wZQWWqF4Nv9Wk5rgJ99KzPvHjkmPXF93FXIbBp6YdW3t71/7Vg==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "devlop": "^1.0.0",
+        "micromark-util-character": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-factory-space": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmmirror.com/micromark-factory-space/-/micromark-factory-space-2.0.1.tgz",
+      "integrity": "sha512-zRkxjtBxxLd2Sc0d+fbnEunsTj46SWXgXciZmHq0kDYGnck/ZSGj9/wULTV95uoeYiK5hRXP2mJ98Uo4cq/LQg==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "micromark-util-character": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-factory-title": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmmirror.com/micromark-factory-title/-/micromark-factory-title-2.0.1.tgz",
+      "integrity": "sha512-5bZ+3CjhAd9eChYTHsjy6TGxpOFSKgKKJPJxr293jTbfry2KDoWkhBb6TcPVB4NmzaPhMs1Frm9AZH7OD4Cjzw==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "micromark-factory-space": "^2.0.0",
+        "micromark-util-character": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-factory-whitespace": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmmirror.com/micromark-factory-whitespace/-/micromark-factory-whitespace-2.0.1.tgz",
+      "integrity": "sha512-Ob0nuZ3PKt/n0hORHyvoD9uZhr+Za8sFoP+OnMcnWK5lngSzALgQYKMr9RJVOWLqQYuyn6ulqGWSXdwf6F80lQ==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "micromark-factory-space": "^2.0.0",
+        "micromark-util-character": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-util-character": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmmirror.com/micromark-util-character/-/micromark-util-character-2.1.1.tgz",
+      "integrity": "sha512-wv8tdUTJ3thSFFFJKtpYKOYiGP2+v96Hvk4Tu8KpCAsTMs6yi+nVmGh1syvSCsaxz45J6Jbw+9DD6g97+NV67Q==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "micromark-util-symbol": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-util-chunked": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmmirror.com/micromark-util-chunked/-/micromark-util-chunked-2.0.1.tgz",
+      "integrity": "sha512-QUNFEOPELfmvv+4xiNg2sRYeS/P84pTW0TCgP5zc9FpXetHY0ab7SxKyAQCNCc1eK0459uoLI1y5oO5Vc1dbhA==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "micromark-util-symbol": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-util-classify-character": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmmirror.com/micromark-util-classify-character/-/micromark-util-classify-character-2.0.1.tgz",
+      "integrity": "sha512-K0kHzM6afW/MbeWYWLjoHQv1sgg2Q9EccHEDzSkxiP/EaagNzCm7T/WMKZ3rjMbvIpvBiZgwR3dKMygtA4mG1Q==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "micromark-util-character": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-util-combine-extensions": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmmirror.com/micromark-util-combine-extensions/-/micromark-util-combine-extensions-2.0.1.tgz",
+      "integrity": "sha512-OnAnH8Ujmy59JcyZw8JSbK9cGpdVY44NKgSM7E9Eh7DiLS2E9RNQf0dONaGDzEG9yjEl5hcqeIsj4hfRkLH/Bg==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "micromark-util-chunked": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-util-decode-numeric-character-reference": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmmirror.com/micromark-util-decode-numeric-character-reference/-/micromark-util-decode-numeric-character-reference-2.0.2.tgz",
+      "integrity": "sha512-ccUbYk6CwVdkmCQMyr64dXz42EfHGkPQlBj5p7YVGzq8I7CtjXZJrubAYezf7Rp+bjPseiROqe7G6foFd+lEuw==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "micromark-util-symbol": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-util-decode-string": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmmirror.com/micromark-util-decode-string/-/micromark-util-decode-string-2.0.1.tgz",
+      "integrity": "sha512-nDV/77Fj6eH1ynwscYTOsbK7rR//Uj0bZXBwJZRfaLEJ1iGBR6kIfNmlNqaqJf649EP0F3NWNdeJi03elllNUQ==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "decode-named-character-reference": "^1.0.0",
+        "micromark-util-character": "^2.0.0",
+        "micromark-util-decode-numeric-character-reference": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-util-encode": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmmirror.com/micromark-util-encode/-/micromark-util-encode-2.0.1.tgz",
+      "integrity": "sha512-c3cVx2y4KqUnwopcO9b/SCdo2O67LwJJ/UyqGfbigahfegL9myoEFoDYZgkT7f36T0bLrM9hZTAaAyH+PCAXjw==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT"
+    },
+    "node_modules/micromark-util-html-tag-name": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmmirror.com/micromark-util-html-tag-name/-/micromark-util-html-tag-name-2.0.1.tgz",
+      "integrity": "sha512-2cNEiYDhCWKI+Gs9T0Tiysk136SnR13hhO8yW6BGNyhOC4qYFnwF1nKfD3HFAIXA5c45RrIG1ub11GiXeYd1xA==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT"
+    },
+    "node_modules/micromark-util-normalize-identifier": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmmirror.com/micromark-util-normalize-identifier/-/micromark-util-normalize-identifier-2.0.1.tgz",
+      "integrity": "sha512-sxPqmo70LyARJs0w2UclACPUUEqltCkJ6PhKdMIDuJ3gSf/Q+/GIe3WKl0Ijb/GyH9lOpUkRAO2wp0GVkLvS9Q==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "micromark-util-symbol": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-util-resolve-all": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmmirror.com/micromark-util-resolve-all/-/micromark-util-resolve-all-2.0.1.tgz",
+      "integrity": "sha512-VdQyxFWFT2/FGJgwQnJYbe1jjQoNTS4RjglmSjTUlpUMa95Htx9NHeYW4rGDJzbjvCsl9eLjMQwGeElsqmzcHg==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "micromark-util-types": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-util-sanitize-uri": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmmirror.com/micromark-util-sanitize-uri/-/micromark-util-sanitize-uri-2.0.1.tgz",
+      "integrity": "sha512-9N9IomZ/YuGGZZmQec1MbgxtlgougxTodVwDzzEouPKo3qFWvymFHWcnDi2vzV1ff6kas9ucW+o3yzJK9YB1AQ==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "micromark-util-character": "^2.0.0",
+        "micromark-util-encode": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-util-subtokenize": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmmirror.com/micromark-util-subtokenize/-/micromark-util-subtokenize-2.1.0.tgz",
+      "integrity": "sha512-XQLu552iSctvnEcgXw6+Sx75GflAPNED1qx7eBJ+wydBb2KCbRZe+NwvIEEMM83uml1+2WSXpBAcp9IUCgCYWA==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "devlop": "^1.0.0",
+        "micromark-util-chunked": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-util-symbol": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmmirror.com/micromark-util-symbol/-/micromark-util-symbol-2.0.1.tgz",
+      "integrity": "sha512-vs5t8Apaud9N28kgCrRUdEed4UJ+wWNvicHLPxCa9ENlYuAY31M0ETy5y1vA33YoNPDFTghEbnh6efaE8h4x0Q==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT"
+    },
+    "node_modules/micromark-util-types": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmmirror.com/micromark-util-types/-/micromark-util-types-2.0.2.tgz",
+      "integrity": "sha512-Yw0ECSpJoViF1qTU4DC6NwtC4aWGt1EkzaQB8KPPyCRR8z9TWeV0HbEFGTO+ZY1wB22zmxnJqhPyTpOVCpeHTA==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT"
+    },
     "node_modules/minimatch": {
       "version": "3.1.2",
       "resolved": "https://registry.npmmirror.com/minimatch/-/minimatch-3.1.2.tgz",
@@ -3004,7 +4171,6 @@
       "version": "2.1.3",
       "resolved": "https://registry.npmmirror.com/ms/-/ms-2.1.3.tgz",
       "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/nanoid": {
@@ -3111,6 +4277,31 @@
         "node": ">=6"
       }
     },
+    "node_modules/parse-entities": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmmirror.com/parse-entities/-/parse-entities-4.0.2.tgz",
+      "integrity": "sha512-GG2AQYWoLgL877gQIKeRPGO1xF9+eG1ujIb5soS5gPvLQ1y2o8FL90w2QWNdf9I361Mpp7726c+lj3U0qK1uGw==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/unist": "^2.0.0",
+        "character-entities-legacy": "^3.0.0",
+        "character-reference-invalid": "^2.0.0",
+        "decode-named-character-reference": "^1.0.0",
+        "is-alphanumerical": "^2.0.0",
+        "is-decimal": "^2.0.0",
+        "is-hexadecimal": "^2.0.0"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/parse-entities/node_modules/@types/unist": {
+      "version": "2.0.11",
+      "resolved": "https://registry.npmmirror.com/@types/unist/-/unist-2.0.11.tgz",
+      "integrity": "sha512-CmBKiL6NNo/OqgmMn95Fk9Whlp2mtvIv+KNpQKN2F4SjvrEesubTRWGYSg+BnWZOnlCaSTU1sMpsBOzgbYhnsA==",
+      "license": "MIT"
+    },
     "node_modules/path-exists": {
       "version": "4.0.0",
       "resolved": "https://registry.npmmirror.com/path-exists/-/path-exists-4.0.0.tgz",
@@ -3318,6 +4509,16 @@
         "react-is": "^16.13.1"
       }
     },
+    "node_modules/property-information": {
+      "version": "7.1.0",
+      "resolved": "https://registry.npmmirror.com/property-information/-/property-information-7.1.0.tgz",
+      "integrity": "sha512-TwEZ+X+yCJmYfL7TPUOcvBZ4QfoT5YenQiJuX//0th53DE6w0xxLEtfK3iyryQFddXuvkIk51EEgrJQ0WJkOmQ==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
     "node_modules/punycode": {
       "version": "2.3.1",
       "resolved": "https://registry.npmmirror.com/punycode/-/punycode-2.3.1.tgz",
@@ -3355,6 +4556,33 @@
       "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==",
       "license": "MIT"
     },
+    "node_modules/react-markdown": {
+      "version": "10.1.0",
+      "resolved": "https://registry.npmmirror.com/react-markdown/-/react-markdown-10.1.0.tgz",
+      "integrity": "sha512-qKxVopLT/TyA6BX3Ue5NwabOsAzm0Q7kAPwq6L+wWDwisYs7R8vZ0nRXqq6rkueboxpkjvLGU9fWifiX/ZZFxQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/hast": "^3.0.0",
+        "@types/mdast": "^4.0.0",
+        "devlop": "^1.0.0",
+        "hast-util-to-jsx-runtime": "^2.0.0",
+        "html-url-attributes": "^3.0.0",
+        "mdast-util-to-hast": "^13.0.0",
+        "remark-parse": "^11.0.0",
+        "remark-rehype": "^11.0.0",
+        "unified": "^11.0.0",
+        "unist-util-visit": "^5.0.0",
+        "vfile": "^6.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      },
+      "peerDependencies": {
+        "@types/react": ">=18",
+        "react": ">=18"
+      }
+    },
     "node_modules/react-number-format": {
       "version": "5.4.4",
       "resolved": "https://registry.npmmirror.com/react-number-format/-/react-number-format-5.4.4.tgz",
@@ -3515,6 +4743,86 @@
         "react-dom": ">=16.6.0"
       }
     },
+    "node_modules/rehype-sanitize": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmmirror.com/rehype-sanitize/-/rehype-sanitize-6.0.0.tgz",
+      "integrity": "sha512-CsnhKNsyI8Tub6L4sm5ZFsme4puGfc6pYylvXo1AeqaGbjOYyzNv3qZPwvs0oMJ39eryyeOdmxwUIo94IpEhqg==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/hast": "^3.0.0",
+        "hast-util-sanitize": "^5.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/remark-gfm": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmmirror.com/remark-gfm/-/remark-gfm-4.0.1.tgz",
+      "integrity": "sha512-1quofZ2RQ9EWdeN34S79+KExV1764+wCUGop5CPL1WGdD0ocPpu91lzPGbwWMECpEpd42kJGQwzRfyov9j4yNg==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/mdast": "^4.0.0",
+        "mdast-util-gfm": "^3.0.0",
+        "micromark-extension-gfm": "^3.0.0",
+        "remark-parse": "^11.0.0",
+        "remark-stringify": "^11.0.0",
+        "unified": "^11.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/remark-parse": {
+      "version": "11.0.0",
+      "resolved": "https://registry.npmmirror.com/remark-parse/-/remark-parse-11.0.0.tgz",
+      "integrity": "sha512-FCxlKLNGknS5ba/1lmpYijMUzX2esxW5xQqjWxw2eHFfS2MSdaHVINFmhjo+qN1WhZhNimq0dZATN9pH0IDrpA==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/mdast": "^4.0.0",
+        "mdast-util-from-markdown": "^2.0.0",
+        "micromark-util-types": "^2.0.0",
+        "unified": "^11.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/remark-rehype": {
+      "version": "11.1.2",
+      "resolved": "https://registry.npmmirror.com/remark-rehype/-/remark-rehype-11.1.2.tgz",
+      "integrity": "sha512-Dh7l57ianaEoIpzbp0PC9UKAdCSVklD8E5Rpw7ETfbTl3FqcOOgq5q2LVDhgGCkaBv7p24JXikPdvhhmHvKMsw==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/hast": "^3.0.0",
+        "@types/mdast": "^4.0.0",
+        "mdast-util-to-hast": "^13.0.0",
+        "unified": "^11.0.0",
+        "vfile": "^6.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/remark-stringify": {
+      "version": "11.0.0",
+      "resolved": "https://registry.npmmirror.com/remark-stringify/-/remark-stringify-11.0.0.tgz",
+      "integrity": "sha512-1OSmLd3awB/t8qdoEOMazZkNsfVTeY4fTsgzcQFdXNq8ToTN4ZGwrMnlda4K6smTFKD+GRV6O48i6Z4iKgPPpw==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/mdast": "^4.0.0",
+        "mdast-util-to-markdown": "^2.0.0",
+        "unified": "^11.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
     "node_modules/resolve-from": {
       "version": "4.0.0",
       "resolved": "https://registry.npmmirror.com/resolve-from/-/resolve-from-4.0.0.tgz",
@@ -3624,6 +4932,30 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/space-separated-tokens": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmmirror.com/space-separated-tokens/-/space-separated-tokens-2.0.2.tgz",
+      "integrity": "sha512-PEGlAwrG8yXGXRjW32fGbg66JAlOAwbObuqVoJpv/mRgoWDQfgH1wDPvtzWyUSNAXBGSk8h755YDbbcEy3SH2Q==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/stringify-entities": {
+      "version": "4.0.4",
+      "resolved": "https://registry.npmmirror.com/stringify-entities/-/stringify-entities-4.0.4.tgz",
+      "integrity": "sha512-IwfBptatlO+QCJUo19AqvrPNqlVMpW9YEL2LIVY+Rpv2qsjCGxaDLNRgeGsQWJhfItebuJhsGSLjaBbNSQ+ieg==",
+      "license": "MIT",
+      "dependencies": {
+        "character-entities-html4": "^2.0.0",
+        "character-entities-legacy": "^3.0.0"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
     "node_modules/strip-json-comments": {
       "version": "3.1.1",
       "resolved": "https://registry.npmmirror.com/strip-json-comments/-/strip-json-comments-3.1.1.tgz",
@@ -3637,6 +4969,24 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/style-to-js": {
+      "version": "1.1.21",
+      "resolved": "https://registry.npmmirror.com/style-to-js/-/style-to-js-1.1.21.tgz",
+      "integrity": "sha512-RjQetxJrrUJLQPHbLku6U/ocGtzyjbJMP9lCNK7Ag0CNh690nSH8woqWH9u16nMjYBAok+i7JO1NP2pOy8IsPQ==",
+      "license": "MIT",
+      "dependencies": {
+        "style-to-object": "1.0.14"
+      }
+    },
+    "node_modules/style-to-object": {
+      "version": "1.0.14",
+      "resolved": "https://registry.npmmirror.com/style-to-object/-/style-to-object-1.0.14.tgz",
+      "integrity": "sha512-LIN7rULI0jBscWQYaSswptyderlarFkjQ+t79nzty8tcIAceVomEVlLzH5VP4Cmsv6MtKhs7qaAiwlcp+Mgaxw==",
+      "license": "MIT",
+      "dependencies": {
+        "inline-style-parser": "0.2.7"
+      }
+    },
     "node_modules/sugarss": {
       "version": "5.0.1",
       "resolved": "https://registry.npmmirror.com/sugarss/-/sugarss-5.0.1.tgz",
@@ -3694,6 +5044,26 @@
         "url": "https://github.com/sponsors/SuperchupuDev"
       }
     },
+    "node_modules/trim-lines": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmmirror.com/trim-lines/-/trim-lines-3.0.1.tgz",
+      "integrity": "sha512-kRj8B+YHZCc9kQYdWfJB2/oUl9rA99qbowYYBtr4ui4mZyAQ2JpvVBd/6U2YloATfqBhBTSMhTpgBHtU0Mf3Rg==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/trough": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmmirror.com/trough/-/trough-2.2.0.tgz",
+      "integrity": "sha512-tmMpK00BjZiUyVyvrBK7knerNgmgvcV/KLVyuma/SC+TQN167GrMRciANTz09+k3zW8L8t60jWO1GpfkZdjTaw==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
     "node_modules/ts-api-utils": {
       "version": "2.4.0",
       "resolved": "https://registry.npmmirror.com/ts-api-utils/-/ts-api-utils-2.4.0.tgz",
@@ -3782,6 +5152,93 @@
       "integrity": "sha512-Zz+aZWSj8LE6zoxD+xrjh4VfkIG8Ya6LvYkZqtUQGJPZjYl53ypCaUwWqo7eI0x66KBGeRo+mlBEkMSeSZ38Nw==",
       "license": "MIT"
     },
+    "node_modules/unified": {
+      "version": "11.0.5",
+      "resolved": "https://registry.npmmirror.com/unified/-/unified-11.0.5.tgz",
+      "integrity": "sha512-xKvGhPWw3k84Qjh8bI3ZeJjqnyadK+GEFtazSfZv/rKeTkTjOJho6mFqh2SM96iIcZokxiOpg78GazTSg8+KHA==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/unist": "^3.0.0",
+        "bail": "^2.0.0",
+        "devlop": "^1.0.0",
+        "extend": "^3.0.0",
+        "is-plain-obj": "^4.0.0",
+        "trough": "^2.0.0",
+        "vfile": "^6.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/unist-util-is": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmmirror.com/unist-util-is/-/unist-util-is-6.0.1.tgz",
+      "integrity": "sha512-LsiILbtBETkDz8I9p1dQ0uyRUWuaQzd/cuEeS1hoRSyW5E5XGmTzlwY1OrNzzakGowI9Dr/I8HVaw4hTtnxy8g==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/unist": "^3.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/unist-util-position": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmmirror.com/unist-util-position/-/unist-util-position-5.0.0.tgz",
+      "integrity": "sha512-fucsC7HjXvkB5R3kTCO7kUjRdrS0BJt3M/FPxmHMBOm8JQi2BsHAHFsy27E0EolP8rp0NzXsJ+jNPyDWvOJZPA==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/unist": "^3.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/unist-util-stringify-position": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmmirror.com/unist-util-stringify-position/-/unist-util-stringify-position-4.0.0.tgz",
+      "integrity": "sha512-0ASV06AAoKCDkS2+xw5RXJywruurpbC4JZSm7nr7MOt1ojAzvyyaO+UxZf18j8FCF6kmzCZKcAgN/yu2gm2XgQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/unist": "^3.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/unist-util-visit": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmmirror.com/unist-util-visit/-/unist-util-visit-5.1.0.tgz",
+      "integrity": "sha512-m+vIdyeCOpdr/QeQCu2EzxX/ohgS8KbnPDgFni4dQsfSCtpz8UqDyY5GjRru8PDKuYn7Fq19j1CQ+nJSsGKOzg==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/unist": "^3.0.0",
+        "unist-util-is": "^6.0.0",
+        "unist-util-visit-parents": "^6.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/unist-util-visit-parents": {
+      "version": "6.0.2",
+      "resolved": "https://registry.npmmirror.com/unist-util-visit-parents/-/unist-util-visit-parents-6.0.2.tgz",
+      "integrity": "sha512-goh1s1TBrqSqukSc8wrjwWhL0hiJxgA8m4kFxGlQ+8FYQ3C/m11FcTs4YYem7V664AhHVvgoQLk890Ssdsr2IQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/unist": "^3.0.0",
+        "unist-util-is": "^6.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
     "node_modules/update-browserslist-db": {
       "version": "1.2.3",
       "resolved": "https://registry.npmmirror.com/update-browserslist-db/-/update-browserslist-db-1.2.3.tgz",
@@ -3917,6 +5374,34 @@
       "integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==",
       "license": "MIT"
     },
+    "node_modules/vfile": {
+      "version": "6.0.3",
+      "resolved": "https://registry.npmmirror.com/vfile/-/vfile-6.0.3.tgz",
+      "integrity": "sha512-KzIbH/9tXat2u30jf+smMwFCsno4wHVdNmzFyL+T/L3UGqqk6JKfVqOFOZEpZSHADH1k40ab6NUIXZq422ov3Q==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/unist": "^3.0.0",
+        "vfile-message": "^4.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/vfile-message": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmmirror.com/vfile-message/-/vfile-message-4.0.3.tgz",
+      "integrity": "sha512-QTHzsGd1EhbZs4AsQ20JX1rC3cOlt/IWJruk893DfLRr57lcnOeMaWG4K0JrRta4mIJZKth2Au3mM3u03/JWKw==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/unist": "^3.0.0",
+        "unist-util-stringify-position": "^4.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
     "node_modules/vite": {
       "version": "7.3.1",
       "resolved": "https://registry.npmmirror.com/vite/-/vite-7.3.1.tgz",
@@ -4110,6 +5595,16 @@
           "optional": true
         }
       }
+    },
+    "node_modules/zwitch": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmmirror.com/zwitch/-/zwitch-2.0.4.tgz",
+      "integrity": "sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
     }
   }
 }
diff --git a/package.json b/package.json
index 6c7d246..11375f9 100644
--- a/package.json
+++ b/package.json
@@ -23,7 +23,10 @@
     "postcss-simple-vars": "^7.0.1",
     "react": "^19.2.0",
     "react-dom": "^19.2.0",
+    "react-markdown": "^10.1.0",
     "react-router-dom": "^7.13.0",
+    "rehype-sanitize": "^6.0.0",
+    "remark-gfm": "^4.0.1",
     "zustand": "^5.0.10"
   },
   "devDependencies": {
diff --git a/src/assets/icon.png b/src/assets/icon.png
new file mode 100644
index 0000000..e09a651
Binary files /dev/null and b/src/assets/icon.png differ
diff --git a/src/components/ai/AIChatBox.tsx b/src/components/ai/AIChatBox.tsx
index 67c0704..5d8189d 100644
--- a/src/components/ai/AIChatBox.tsx
+++ b/src/components/ai/AIChatBox.tsx
@@ -8,9 +8,7 @@ import {
   ActionIcon,
   Loader,
   Box,
-  Button,
   Card,
-  Badge,
 } from '@mantine/core';
 import { IconSend, IconSparkles } from '@tabler/icons-react';
 import { api } from '../../services/api';
@@ -24,7 +22,6 @@ interface AIChatBoxProps {
 export function AIChatBox({ onEventCreated }: AIChatBoxProps) {
   const [message, setMessage] = useState('');
   const [loading, setLoading] = useState(false);
-  const [conversation, setConversation] = useState<AIConversation | null>(null);
   const [history, setHistory] = useState<AIConversation[]>([]);
   const addConversation = useAppStore((state) => state.addConversation);
   const scrollRef = useRef<HTMLDivElement>(null);
@@ -55,7 +52,6 @@ export function AIChatBox({ onEventCreated }: AIChatBoxProps) {
         created_at: new Date().toISOString(),
       };
 
-      setConversation(newConversation);
       setHistory((prev) => [...prev, newConversation]);
       addConversation(newConversation);
 
diff --git a/src/components/ai/FloatingAIChat.tsx b/src/components/ai/FloatingAIChat.tsx
new file mode 100644
index 0000000..16ec212
--- /dev/null
+++ b/src/components/ai/FloatingAIChat.tsx
@@ -0,0 +1,262 @@
+import { useState, useRef, useEffect } from 'react';
+import {
+  Paper,
+  Text,
+  Stack,
+  Group,
+  TextInput,
+  ActionIcon,
+  Loader,
+  Box,
+  Transition,
+} from '@mantine/core';
+import { IconSparkles, IconX, IconSend, IconMessage } from '@tabler/icons-react';
+import { api } from '../../services/api';
+import { useAppStore } from '../../stores';
+import type { AIConversation } from '../../types';
+
+interface FloatingAIChatProps {
+  onEventCreated?: () => void;
+}
+
+export function FloatingAIChat({ onEventCreated }: FloatingAIChatProps) {
+  const [isOpen, setIsOpen] = useState(false);
+  const [message, setMessage] = useState('');
+  const [loading, setLoading] = useState(false);
+  const [history, setHistory] = useState<AIConversation[]>([]);
+  const addConversation = useAppStore((state) => state.addConversation);
+  const scrollRef = useRef<HTMLDivElement>(null);
+
+  const scrollToBottom = () => {
+    scrollRef.current?.scrollIntoView({ behavior: 'smooth' });
+  };
+
+  useEffect(() => {
+    scrollToBottom();
+  }, [history]);
+
+  const handleSend = async () => {
+    if (!message.trim() || loading) return;
+
+    const userMessage = message.trim();
+    setMessage('');
+    setLoading(true);
+
+    try {
+      const result = await api.ai.parse(userMessage);
+
+      const newConversation: AIConversation = {
+        id: Date.now().toString(),
+        user_id: '',
+        message: userMessage,
+        response: result.response,
+        created_at: new Date().toISOString(),
+      };
+
+      setHistory((prev) => [...prev, newConversation]);
+      addConversation(newConversation);
+
+      if (onEventCreated) {
+        onEventCreated();
+      }
+    } catch (error) {
+      console.error('AI parse error:', error);
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  const handleKeyPress = (e: React.KeyboardEvent) => {
+    if (e.key === 'Enter' && !e.shiftKey) {
+      e.preventDefault();
+      handleSend();
+    }
+  };
+
+  return (
+    <>
+      {/* Floating button */}
+      <ActionIcon
+        size="xl"
+        radius="xl"
+        variant="filled"
+        onClick={() => setIsOpen(!isOpen)}
+        style={{
+          position: 'fixed',
+          bottom: 24,
+          right: 24,
+          zIndex: 1000,
+          background: '#1a1a1a',
+          boxShadow: '0 4px 12px rgba(0, 0, 0, 0.2)',
+        }}
+      >
+        {isOpen ? <IconX size={24} /> : <IconMessage size={24} />}
+      </ActionIcon>
+
+      {/* Chat window */}
+      <Transition mounted={isOpen} transition="slide-up" duration={300}>
+        {(styles) => (
+          <Paper
+            shadow="lg"
+            radius={4}
+            style={{
+              ...styles,
+              position: 'fixed',
+              bottom: 90,
+              right: 24,
+              width: 360,
+              maxHeight: 'calc(100vh - 150px)',
+              zIndex: 1000,
+              display: 'flex',
+              flexDirection: 'column',
+              background: '#faf9f7',
+              border: '1px solid rgba(0, 0, 0, 0.06)',
+            }}
+          >
+            {/* Header */}
+            <Group
+              p="md"
+              style={{
+                borderBottom: '1px solid rgba(0, 0, 0, 0.06)',
+                background: '#1a1a1a',
+                borderRadius: '4px 4px 0 0',
+              }}
+            >
+              <Group gap={8}>
+                <IconSparkles size={16} color="#faf9f7" />
+                <Text
+                  fw={400}
+                  size="sm"
+                  c="#faf9f7"
+                  style={{ letterSpacing: '0.1em' }}
+                >
+                  AI 助手
+                </Text>
+              </Group>
+            </Group>
+
+            {/* Chat history */}
+            <Box
+              p="md"
+              style={{
+                flex: 1,
+                overflowY: 'auto',
+                display: 'flex',
+                flexDirection: 'column',
+                gap: '12px',
+                minHeight: 280,
+                maxHeight: 380,
+              }}
+            >
+              {history.length === 0 ? (
+                <Stack align="center" justify="center" h="100%" gap="sm">
+                  <IconSparkles size={32} color="rgba(0, 0, 0, 0.2)" />
+                  <Text size="xs" c="#888" ta="center" style={{ letterSpacing: '0.05em' }}>
+                    告诉我你想记住的事情
+                    <br />
+                    <Text span size="xs" c="#aaa">
+                      例如：下周三见客户、每月15号还房贷
+                    </Text>
+                  </Text>
+                </Stack>
+              ) : (
+                history.map((conv) => (
+                  <Box key={conv.id}>
+                    <Group gap={8} mb={6}>
+                      <Text size="xs" c="#666" fw={400} style={{ letterSpacing: '0.05em' }}>
+                        你
+                      </Text>
+                    </Group>
+                    <Paper
+                      withBorder
+                      p="sm"
+                      radius={2}
+                      mb="sm"
+                      style={{
+                        background: 'rgba(0, 0, 0, 0.02)',
+                        borderColor: 'rgba(0, 0, 0, 0.08)',
+                      }}
+                    >
+                      <Text size="xs" style={{ whiteSpace: 'pre-wrap', lineHeight: 1.6 }}>
+                        {conv.message}
+                      </Text>
+                    </Paper>
+
+                    <Group gap={8} mb={6}>
+                      <IconSparkles size={10} color="#1a1a1a" />
+                      <Text size="xs" c="#1a1a1a" fw={400} style={{ letterSpacing: '0.05em' }}>
+                        AI
+                      </Text>
+                    </Group>
+                    <Paper
+                      withBorder
+                      p="sm"
+                      radius={2}
+                      style={{
+                        background: 'rgba(0, 0, 0, 0.03)',
+                        borderColor: 'rgba(0, 0, 0, 0.08)',
+                      }}
+                    >
+                      <Text size="xs" style={{ whiteSpace: 'pre-wrap', lineHeight: 1.6 }}>
+                        {conv.response}
+                      </Text>
+                    </Paper>
+                  </Box>
+                ))
+              )}
+
+              {loading && (
+                <Group gap={8}>
+                  <Loader size="xs" color="#1a1a1a" />
+                  <Text size="xs" c="#888" style={{ letterSpacing: '0.05em' }}>
+                    AI 正在思考...
+                  </Text>
+                </Group>
+              )}
+
+              <div ref={scrollRef} />
+            </Box>
+
+            {/* Input */}
+            <Group
+              p="md"
+              style={{
+                borderTop: '1px solid rgba(0, 0, 0, 0.06)',
+                borderRadius: '0 0 4px 4px',
+              }}
+            >
+              <TextInput
+                value={message}
+                onChange={(e) => setMessage(e.target.value)}
+                onKeyPress={handleKeyPress}
+                placeholder="输入你的提醒事项..."
+                size="sm"
+                style={{ flex: 1 }}
+                disabled={loading}
+                styles={{
+                  input: {
+                    borderRadius: 2,
+                    borderColor: 'rgba(0, 0, 0, 0.1)',
+                    background: '#faf9f7',
+                  },
+                }}
+              />
+              <ActionIcon
+                size="lg"
+                radius={2}
+                variant="filled"
+                onClick={handleSend}
+                disabled={!message.trim() || loading}
+                style={{
+                  background: '#1a1a1a',
+                }}
+              >
+                <IconSend size={14} />
+              </ActionIcon>
+            </Group>
+          </Paper>
+        )}
+      </Transition>
+    </>
+  );
+}
diff --git a/src/components/anniversary/AnniversaryCard.tsx b/src/components/anniversary/AnniversaryCard.tsx
index 1739d4d..d2b161a 100644
--- a/src/components/anniversary/AnniversaryCard.tsx
+++ b/src/components/anniversary/AnniversaryCard.tsx
@@ -1,5 +1,4 @@
-import { Card, Text, Badge, Group, Stack, ThemeIcon } from '@mantine/core';
-import { IconHeart, IconRepeat, IconCalendar } from '@tabler/icons-react';
+import { Paper, Text, Group, Stack } from '@mantine/core';
 import type { Event } from '../../types';
 import { calculateCountdown, formatCountdown } from '../../utils/countdown';
 import { getHolidayById } from '../../constants/holidays';
@@ -17,37 +16,40 @@ export function AnniversaryCard({ event, onClick }: AnniversaryCardProps) {
   const holiday = event.is_holiday ? getHolidayById(event.title) || event.is_holiday : false;
 
   return (
-    <Card
-      shadow="sm"
-      padding="sm"
-      radius="md"
+    <Paper
+      p="sm"
+      radius={2}
       onClick={onClick}
-      style={{ cursor: 'pointer', transition: 'transform 0.2s' }}
-      onMouseEnter={(e) => (e.currentTarget.style.transform = 'translateY(-2px)')}
+      style={{
+        cursor: 'pointer',
+        transition: 'transform 0.2s',
+        background: 'rgba(0, 0, 0, 0.02)',
+        border: '1px solid rgba(0, 0, 0, 0.04)',
+      }}
+      onMouseEnter={(e) => (e.currentTarget.style.transform = 'translateY(-1px)')}
       onMouseLeave={(e) => (e.currentTarget.style.transform = 'translateY(0)')}
     >
       <Group justify="space-between" wrap="nowrap">
         <Stack gap={4} style={{ flex: 1 }}>
           <Group gap={6}>
-            <IconHeart size={14} color="pink" />
-            <Text fw={500} size="sm" lineClamp={1} style={{ flex: 1 }}>
-              {event.title}
-            </Text>
+            <Text size="xs" c="#c41c1c">{event.title}</Text>
           </Group>
 
           <Group gap="xs">
-            {/* Countdown badge */}
-            <Badge
-              size="sm"
-              variant="filled"
-              color={countdown.isPast ? 'gray' : countdown.isToday ? 'red' : 'blue'}
-              leftSection={<IconCalendar size={10} />}
+            {/* Countdown */}
+            <Text
+              size="xs"
+              fw={400}
+              style={{
+                letterSpacing: '0.05em',
+                color: countdown.isToday ? '#c41c1c' : '#666',
+              }}
             >
               {formattedCountdown}
-            </Badge>
+            </Text>
 
             {/* Date display */}
-            <Text size="xs" c="dimmed">
+            <Text size="xs" c="#999">
               {countdown.isPast
                 ? '已过'
                 : `${countdown.nextDate.getMonth() + 1}月${countdown.nextDate.getDate()}日`}
@@ -58,22 +60,17 @@ export function AnniversaryCard({ event, onClick }: AnniversaryCardProps) {
 
         <Group gap={6}>
           {repeatType !== 'none' && (
-            <Badge
-              size="xs"
-              variant="light"
-              color="blue"
-              leftSection={<IconRepeat size={10} />}
-            >
+            <Text size="xs" c="#888">
               {repeatType === 'yearly' ? '每年' : '每月'}
-            </Badge>
+            </Text>
           )}
           {(event.is_holiday || holiday) && (
-            <Badge size="xs" variant="light" color="green">
+            <Text size="xs" c="#888">
               节假日
-            </Badge>
+            </Text>
           )}
         </Group>
       </Group>
-    </Card>
+    </Paper>
   );
 }
diff --git a/src/components/anniversary/AnniversaryList.tsx b/src/components/anniversary/AnniversaryList.tsx
index 9b9e924..ec8c6af 100644
--- a/src/components/anniversary/AnniversaryList.tsx
+++ b/src/components/anniversary/AnniversaryList.tsx
@@ -1,11 +1,10 @@
 import { useMemo } from 'react';
-import { Stack, Text, Paper, Group, Button, Badge, ThemeIcon, Card } from '@mantine/core';
-import { IconPlus, IconHeart, IconCalendar } from '@tabler/icons-react';
+import { Stack, Text, Paper, Group, Button } from '@mantine/core';
+import { IconPlus } from '@tabler/icons-react';
 import { AnniversaryCard } from './AnniversaryCard';
-import { getHolidaysForYear, getUpcomingHolidays } from '../../constants/holidays';
+import { getHolidaysForYear } from '../../constants/holidays';
 import { calculateCountdown, formatCountdown } from '../../utils/countdown';
 import type { Event } from '../../types';
-import { Lunar, Solar } from 'lunar-javascript';
 
 interface AnniversaryListProps {
   events: Event[];
@@ -85,16 +84,21 @@ export function AnniversaryList({ events, onEventClick, onAddClick }: Anniversar
   // 空状态
   if (allAnniversaries.total === 0) {
     return (
-      <Paper p="md" withBorder radius="md" h="100%">
+      <Paper p="md" withBorder radius={4} h="100%">
         <Stack align="center" justify="center" h="100%">
-          <Text c="dimmed" size="sm">
+          <Text c="#999" size="sm" style={{ letterSpacing: '0.05em' }}>
             暂无纪念日
           </Text>
           <Button
-            variant="light"
+            variant="outline"
             size="xs"
-            leftSection={<IconPlus size={14} />}
+            leftSection={<IconPlus size={12} />}
             onClick={onAddClick}
+            style={{
+              borderColor: '#ccc',
+              color: '#1a1a1a',
+              borderRadius: 2,
+            }}
           >
             添加纪念日
           </Button>
@@ -104,21 +108,25 @@ export function AnniversaryList({ events, onEventClick, onAddClick }: Anniversar
   }
 
   return (
-    <Paper p="md" withBorder radius="md" h="100%">
+    <Paper p="md" withBorder radius={4} h="100%">
       <Group justify="space-between" mb="sm">
         <Group gap={8}>
-          <Text fw={500} size="sm">
+          <Text fw={500} size="sm" style={{ letterSpacing: '0.1em', color: '#1a1a1a' }}>
             纪念日
           </Text>
-          <Badge size="xs" variant="light" color="gray">
+          <Text size="xs" c="#999">
             {anniversaries.length}
-          </Badge>
+          </Text>
         </Group>
         <Button
           variant="subtle"
           size="xs"
-          leftSection={<IconPlus size={14} />}
+          leftSection={<IconPlus size={12} />}
           onClick={onAddClick}
+          style={{
+            color: '#666',
+            borderRadius: 2,
+          }}
         >
           添加
         </Button>
@@ -128,37 +136,37 @@ export function AnniversaryList({ events, onEventClick, onAddClick }: Anniversar
         {/* 内置节假日 */}
         {allAnniversaries.builtIn.length > 0 && (
           <>
-            <Text size="xs" c="dimmed" fw={500} tt="uppercase">
+            <Text size="xs" c="#888" fw={400} style={{ letterSpacing: '0.05em' }}>
               即将到来
             </Text>
             {allAnniversaries.builtIn.map((holiday) => {
               const countdown = calculateCountdown(holiday.date, holiday.repeat_type, holiday.is_lunar);
               return (
-                <Card
+                <Paper
                   key={holiday.id}
-                  shadow="sm"
-                  padding="sm"
-                  radius="md"
-                  style={{ cursor: 'pointer', opacity: 0.8, backgroundColor: '#f8f9fa' }}
+                  p="sm"
+                  radius={2}
+                  style={{
+                    cursor: 'pointer',
+                    opacity: 0.7,
+                    background: 'rgba(0, 0, 0, 0.02)',
+                    border: '1px solid rgba(0, 0, 0, 0.04)',
+                  }}
+                  onClick={() => onEventClick(holiday as unknown as Event)}
                 >
                   <Group justify="space-between" wrap="nowrap">
                     <Group gap={6}>
-                      <ThemeIcon size="xs" variant="light" color="green">
-                        <IconCalendar size={10} />
-                      </ThemeIcon>
-                      <Text fw={500} size="sm">
-                        {holiday.title}
-                      </Text>
+                      <Text size="xs" c="#666">{holiday.title}</Text>
                     </Group>
-                    <Badge
+                    <Text
                       size="xs"
-                      variant="filled"
-                      color={countdown.isToday ? 'red' : 'green'}
+                      c={countdown.isToday ? '#c41c1c' : '#888'}
+                      style={{ letterSpacing: '0.05em' }}
                     >
                       {formatCountdown(countdown)}
-                    </Badge>
+                    </Text>
                   </Group>
-                </Card>
+                </Paper>
               );
             })}
           </>
@@ -168,7 +176,7 @@ export function AnniversaryList({ events, onEventClick, onAddClick }: Anniversar
         {allAnniversaries.user.length > 0 && (
           <>
             {allAnniversaries.builtIn.length > 0 && (
-              <Text size="xs" c="dimmed" fw={500} tt="uppercase" mt="xs">
+              <Text size="xs" c="#666" fw={500} style={{ letterSpacing: '0.05em' }} mt="xs">
                 我的纪念日
               </Text>
             )}
diff --git a/src/components/note/NoteEditor.tsx b/src/components/note/NoteEditor.tsx
index b78b3e2..f093c39 100644
--- a/src/components/note/NoteEditor.tsx
+++ b/src/components/note/NoteEditor.tsx
@@ -1,12 +1,26 @@
 import { useState, useEffect, useCallback } from 'react';
-import { Paper, Textarea, Group, Text, Stack } from '@mantine/core';
+import {
+  Paper,
+  Textarea,
+  Group,
+  Text,
+  Stack,
+  Button,
+  Box,
+} from '@mantine/core';
 import { useDebouncedValue } from '@mantine/hooks';
+import ReactMarkdown from 'react-markdown';
+import remarkGfm from 'remark-gfm';
+import rehypeSanitize from 'rehype-sanitize';
+import { IconDeviceFloppy } from '@tabler/icons-react';
 import { useAppStore } from '../../stores';
 
 interface NoteEditorProps {
   onSave?: () => void;
 }
 
+type ViewMode = 'edit' | 'preview';
+
 export function NoteEditor({ onSave }: NoteEditorProps) {
   const notes = useAppStore((state) => state.notes);
   const updateNotesContent = useAppStore((state) => state.updateNotesContent);
@@ -16,6 +30,7 @@ export function NoteEditor({ onSave }: NoteEditorProps) {
   const [content, setContent] = useState('');
   const [saving, setSaving] = useState(false);
   const [lastSaved, setLastSaved] = useState<Date | null>(null);
+  const [viewMode] = useState<ViewMode>('edit');
 
   // Initialize content from notes
   useEffect(() => {
@@ -29,11 +44,11 @@ export function NoteEditor({ onSave }: NoteEditorProps) {
     fetchNotes();
   }, [fetchNotes]);
 
-  // Auto-save with debounce
-  const [debouncedContent] = useDebouncedValue(content, 1000);
+  // Auto-save with 3 second debounce
+  const [debouncedContent] = useDebouncedValue(content, 3000);
 
   useEffect(() => {
-    if (debouncedContent !== undefined && notes) {
+    if (debouncedContent !== undefined && notes && debouncedContent !== content) {
       handleSave(debouncedContent);
     }
   }, [debouncedContent]);
@@ -47,13 +62,14 @@ export function NoteEditor({ onSave }: NoteEditorProps) {
         updateNotesContent(value);
         await saveNotes(value);
         setLastSaved(new Date());
+        onSave?.();
       } catch (error) {
         console.error('Failed to save note:', error);
       } finally {
         setSaving(false);
       }
     },
-    [notes, updateNotesContent, saveNotes]
+    [notes, updateNotesContent, saveNotes, onSave]
   );
 
   const formatLastSaved = () => {
@@ -65,34 +81,140 @@ export function NoteEditor({ onSave }: NoteEditorProps) {
     return lastSaved.toLocaleTimeString('zh-CN');
   };
 
+  const handleManualSave = () => {
+    if (content && notes) {
+      handleSave(content);
+    }
+  };
+
   return (
-    <Paper p="md" withBorder radius="md" h="100%">
-      <Stack gap="sm" h="100%">
-        <Group justify="space-between">
-          <Text fw={500} size="sm">
-            便签
-          </Text>
-          <Text size="xs" c={saving ? 'yellow' : lastSaved ? 'dimmed' : 'gray'}>
-            {saving ? '保存中...' : formatLastSaved()}
-          </Text>
+    <Paper p="md" withBorder radius={4} h="100%" style={{ display: 'flex', flexDirection: 'column' }}>
+      <Stack gap="sm" style={{ flex: 1, display: 'flex', flexDirection: 'column' }}>
+        {/* Header */}
+        <Group justify="space-between" style={{ flexShrink: 0 }}>
+          <Group gap="sm">
+            <Text fw={400} size="sm" style={{ letterSpacing: '0.1em', color: '#1a1a1a' }}>
+              便签
+            </Text>
+          </Group>
+          <Group gap="sm">
+            <Button
+              size="xs"
+              variant="outline"
+              leftSection={<IconDeviceFloppy size={12} />}
+              onClick={handleManualSave}
+              loading={saving}
+              style={{
+                borderColor: '#ccc',
+                color: '#1a1a1a',
+                borderRadius: 2,
+              }}
+            >
+              保存
+            </Button>
+            <Text size="xs" c={saving ? '#666' : lastSaved ? '#999' : '#bbb'}>
+              {saving ? '保存中...' : formatLastSaved()}
+            </Text>
+          </Group>
         </Group>
 
-        <Textarea
-          value={content}
-          onChange={(e) => setContent(e.target.value)}
-          placeholder="在这里记录你的想法..."
-          autosize
-          minRows={8}
-          maxRows={20}
-          styles={{
-            input: {
-              border: 'none',
-              resize: 'none',
-              fontFamily: 'inherit',
-              '&:focus': { outline: 'none' },
-            },
-          }}
-        />
+        {/* Editor/Preview Area */}
+        <Box style={{ flex: 1, minHeight: 0, display: 'flex' }}>
+          {viewMode === 'edit' && (
+            <Textarea
+              value={content}
+              onChange={(e) => setContent(e.target.value)}
+              placeholder="在这里记录你的想法...&#10;&#10;支持 Markdown 语法：&#10;- # 一级标题&#10;- **粗体**&#10;- *斜体*&#10;- [链接](url)"
+              autosize
+              minRows={8}
+              styles={{
+                input: {
+                  border: 'none',
+                  resize: 'none',
+                  fontFamily: 'Monaco, Menlo, Ubuntu Mono, monospace',
+                  fontSize: '13px',
+                  lineHeight: '1.6',
+                  background: 'transparent',
+                  '&:focus': { outline: 'none' },
+                },
+              }}
+              style={{ flex: 1, width: '100%' }}
+            />
+          )}
+
+          {viewMode === 'preview' && (
+            <Box
+              style={{
+                flex: 1,
+                overflowY: 'auto',
+                padding: '8px',
+                fontSize: '13px',
+                lineHeight: '1.6',
+              }}
+            >
+              {content ? (
+                <Box
+                  style={{
+                    '& h1, & h2, & h3': {
+                      marginTop: '1em',
+                      marginBottom: '0.5em',
+                      fontWeight: 500,
+                    },
+                    '& h1': { fontSize: '1.25em', borderBottom: '1px solid rgba(0,0,0,0.08)', paddingBottom: '0.3em' },
+                    '& h2': { fontSize: '1.1em', borderBottom: '1px solid rgba(0,0,0,0.06)', paddingBottom: '0.3em' },
+                    '& p': { marginBottom: '0.8em', color: '#333' },
+                    '& ul, & ol': { paddingLeft: '1.5em', marginBottom: '0.8em' },
+                    '& li': { marginBottom: '0.3em', color: '#333' },
+                    '& blockquote': {
+                      borderLeft: '3px solid rgba(0,0,0,0.1)',
+                      paddingLeft: '1em',
+                      marginLeft: 0,
+                      color: '#888',
+                    },
+                    '& code': {
+                      backgroundColor: 'rgba(0,0,0,0.04)',
+                      padding: '0.2em 0.4em',
+                      borderRadius: '2px',
+                      fontSize: '0.9em',
+                    },
+                    '& pre': {
+                      backgroundColor: 'rgba(0,0,0,0.03)',
+                      padding: '1em',
+                      borderRadius: '2px',
+                      overflow: 'auto',
+                    },
+                    '& pre code': {
+                      backgroundColor: 'transparent',
+                      padding: 0,
+                    },
+                    '& a': {
+                      color: '#1a1a1a',
+                      textDecoration: 'underline',
+                      textUnderlineOffset: 2,
+                    },
+                    '& hr': {
+                      border: 'none',
+                      borderTop: '1px solid rgba(0,0,0,0.06)',
+                      margin: '1em 0',
+                    },
+                  } as any}
+                >
+                  <ReactMarkdown remarkPlugins={[remarkGfm]} rehypePlugins={[rehypeSanitize]}>
+                    {content}
+                  </ReactMarkdown>
+                </Box>
+              ) : (
+                <Text c="#999" ta="center" py="xl" size="sm" style={{ letterSpacing: '0.05em' }}>
+                  暂无内容
+                  <br />
+                  <Text size="xs" c="#bbb" mt={4}>
+                    使用 Markdown 格式记录你的想法
+                  </Text>
+                </Text>
+              )}
+            </Box>
+          )}
+        </Box>
       </Stack>
     </Paper>
   );
diff --git a/src/components/reminder/ArchiveReminderModal.tsx b/src/components/reminder/ArchiveReminderModal.tsx
new file mode 100644
index 0000000..4c01767
--- /dev/null
+++ b/src/components/reminder/ArchiveReminderModal.tsx
@@ -0,0 +1,140 @@
+import { useMemo } from 'react';
+import {
+  Modal,
+  Stack,
+  Text,
+  Group,
+  Button,
+  Paper,
+  ActionIcon,
+} from '@mantine/core';
+import { IconRotateClockwise, IconTrash } from '@tabler/icons-react';
+import type { Event } from '../../types';
+
+interface ArchiveReminderModalProps {
+  opened: boolean;
+  onClose: () => void;
+  completedReminders: Event[];
+  onRestore: (event: Event) => void;
+  onDelete: (event: Event) => void;
+}
+
+export function ArchiveReminderModal({
+  opened,
+  onClose,
+  completedReminders,
+  onRestore,
+  onDelete,
+}: ArchiveReminderModalProps) {
+  const sortedReminders = useMemo(() => {
+    return [...completedReminders].sort(
+      (a, b) => new Date(b.date).getTime() - new Date(a.date).getTime()
+    );
+  }, [completedReminders]);
+
+  return (
+    <Modal
+      opened={opened}
+      onClose={onClose}
+      title={
+        <Text
+          fw={400}
+          style={{
+            letterSpacing: '0.1em',
+            fontSize: '1rem',
+          }}
+        >
+          已归档提醒
+        </Text>
+      }
+      size="md"
+      styles={{
+        header: {
+          borderBottom: '1px solid rgba(0,0,0,0.06)',
+        },
+      }}
+    >
+      {completedReminders.length === 0 ? (
+        <Paper p="xl" withBorder radius={4} ta="center">
+          <Text c="#999" size="sm" style={{ letterSpacing: '0.05em' }}>
+            暂无已归档的提醒
+          </Text>
+          <Text size="xs" c="#bbb" mt={4}>
+            完成的提醒会自动归档到这里
+          </Text>
+        </Paper>
+      ) : (
+        <Stack gap="sm">
+          {sortedReminders.map((event) => (
+            <Paper
+              key={event.id}
+              p="sm"
+              radius={2}
+              withBorder
+              style={{
+                background: 'rgba(0, 0, 0, 0.02)',
+                borderColor: 'rgba(0, 0, 0, 0.06)',
+              }}
+            >
+              <Group justify="space-between" wrap="nowrap">
+                <Stack gap={4} style={{ flex: 1 }}>
+                  <Text
+                    size="sm"
+                    fw={400}
+                    lineClamp={1}
+                    style={{
+                      textDecoration: 'line-through',
+                      color: '#999',
+                      letterSpacing: '0.03em',
+                    }}
+                  >
+                    {event.title}
+                  </Text>
+                  <Text size="xs" c="#bbb">
+                    {new Date(event.date).toLocaleString('zh-CN', {
+                      month: 'numeric',
+                      day: 'numeric',
+                      hour: '2-digit',
+                      minute: '2-digit',
+                    })}
+                  </Text>
+                </Stack>
+                <Group gap={4}>
+                  <ActionIcon
+                    size="sm"
+                    variant="subtle"
+                    onClick={() => onRestore(event)}
+                    style={{ color: '#666' }}
+                  >
+                    <IconRotateClockwise size={12} />
+                  </ActionIcon>
+                  <ActionIcon
+                    size="sm"
+                    variant="subtle"
+                    onClick={() => onDelete(event)}
+                    style={{ color: '#999' }}
+                  >
+                    <IconTrash size={12} />
+                  </ActionIcon>
+                </Group>
+              </Group>
+            </Paper>
+          ))}
+        </Stack>
+      )}
+
+      <Group justify="flex-end" mt="md">
+        <Button
+          variant="subtle"
+          onClick={onClose}
+          style={{
+            color: '#666',
+            borderRadius: 2,
+          }}
+        >
+          关闭
+        </Button>
+      </Group>
+    </Modal>
+  );
+}
diff --git a/src/components/reminder/ReminderCard.tsx b/src/components/reminder/ReminderCard.tsx
index 59e935f..05075fa 100644
--- a/src/components/reminder/ReminderCard.tsx
+++ b/src/components/reminder/ReminderCard.tsx
@@ -1,29 +1,13 @@
 import { useMemo, useState } from 'react';
-import {
-  Card,
-  Text,
-  Checkbox,
-  Group,
-  Stack,
-  ThemeIcon,
-  Tooltip,
-  ActionIcon,
-  Menu,
-} from '@mantine/core';
-import {
-  IconBell,
-  IconCheck,
-  IconDots,
-  IconTrash,
-  IconEdit,
-  IconClock,
-} from '@tabler/icons-react';
+import { Paper, Text, Checkbox, Group, Stack, ActionIcon } from '@mantine/core';
+import { IconCheck, IconDots } from '@tabler/icons-react';
 import type { Event } from '../../types';
 
 interface ReminderCardProps {
   event: Event;
   onToggle: () => void;
   onClick: () => void;
+  onDelete?: () => void;
 }
 
 export function ReminderCard({ event, onToggle, onClick }: ReminderCardProps) {
@@ -40,7 +24,7 @@ export function ReminderCard({ event, onToggle, onClick }: ReminderCardProps) {
 
     // 格式化时间显示
     const timeStr = eventDate.toLocaleString('zh-CN', {
-      month: 'short',
+      month: 'numeric',
       day: 'numeric',
       hour: '2-digit',
       minute: '2-digit',
@@ -51,31 +35,32 @@ export function ReminderCard({ event, onToggle, onClick }: ReminderCardProps) {
 
   // 颜色主题
   const getThemeColor = () => {
-    if (isCompleted) return 'gray';
-    if (timeInfo.isPast) return 'red';
-    if (timeInfo.isToday) return 'orange';
-    return 'blue';
+    if (isCompleted) return '#999';
+    if (timeInfo.isPast) return '#c41c1c';
+    if (timeInfo.isToday) return '#666';
+    return '#888';
   };
 
   return (
-    <Card
-      shadow="sm"
-      padding="sm"
-      radius="md"
+    <Paper
+      p="sm"
+      radius={2}
       onClick={onClick}
       onMouseEnter={() => setIsHovered(true)}
       onMouseLeave={() => setIsHovered(false)}
       style={{
         cursor: 'pointer',
-        opacity: isCompleted ? 0.5 : 1,
+        opacity: isCompleted ? 0.4 : 1,
         transition: 'all 0.2s ease',
-        transform: isHovered ? 'translateY(-2px)' : 'translateY(0)',
-        borderLeft: `3px solid var(--mantine-color-${getThemeColor()}-6)`,
+        transform: isHovered ? 'translateY(-1px)' : 'translateY(0)',
+        borderLeft: `2px solid ${getThemeColor()}`,
+        background: 'rgba(0, 0, 0, 0.02)',
+        border: '1px solid rgba(0, 0, 0, 0.04)',
       }}
     >
       <Group justify="space-between" wrap="nowrap">
         <Group gap="sm" style={{ flex: 1, minWidth: 0 }}>
-          {/* Checkbox */}
+          {/* Checkbox - 点击切换完成状态 */}
           <Checkbox
             checked={isCompleted}
             onChange={(e) => {
@@ -83,19 +68,20 @@ export function ReminderCard({ event, onToggle, onClick }: ReminderCardProps) {
               onToggle();
             }}
             onClick={(e) => e.stopPropagation()}
-            color="green"
-            size="sm"
+            size="xs"
+            color="#1a1a1a"
           />
 
           <Stack gap={2} style={{ flex: 1, minWidth: 0 }}>
             {/* Title */}
             <Text
-              fw={500}
-              size="sm"
+              fw={400}
+              size="xs"
               lineClamp={1}
               style={{
                 textDecoration: isCompleted ? 'line-through' : 'none',
-                color: isCompleted ? 'dimmed' : undefined,
+                color: isCompleted ? '#bbb' : '#1a1a1a',
+                letterSpacing: '0.03em',
               }}
             >
               {event.title}
@@ -103,9 +89,6 @@ export function ReminderCard({ event, onToggle, onClick }: ReminderCardProps) {
 
             {/* Time and content */}
             <Group gap="xs">
-              <ThemeIcon size="xs" variant="light" color={getThemeColor()}>
-                <IconClock size={10} />
-              </ThemeIcon>
               <Text size="xs" c={getThemeColor()}>
                 {timeInfo.timeStr}
               </Text>
@@ -113,7 +96,7 @@ export function ReminderCard({ event, onToggle, onClick }: ReminderCardProps) {
 
             {/* Content preview */}
             {event.content && !isCompleted && (
-              <Text size="xs" c="dimmed" lineClamp={1}>
+              <Text size="xs" c="#999" lineClamp={1}>
                 {event.content}
               </Text>
             )}
@@ -123,51 +106,30 @@ export function ReminderCard({ event, onToggle, onClick }: ReminderCardProps) {
         {/* Quick actions */}
         <Group gap={4}>
           {isHovered && !isCompleted && (
-            <Tooltip label="完成">
-              <ActionIcon
-                size="sm"
-                variant="light"
-                color="green"
-                onClick={(e) => {
-                  e.stopPropagation();
-                  onToggle();
-                }}
-              >
-                <IconCheck size={14} />
-              </ActionIcon>
-            </Tooltip>
+            <ActionIcon
+              size="sm"
+              variant="subtle"
+              onClick={(e) => {
+                e.stopPropagation();
+                onToggle();
+              }}
+              style={{ color: '#666' }}
+            >
+              <IconCheck size={12} />
+            </ActionIcon>
           )}
 
-          <Menu shadow="md" width={120}>
-            <Menu.Target>
-              <ActionIcon
-                size="sm"
-                variant="subtle"
-                color="gray"
-                onClick={(e) => e.stopPropagation()}
-              >
-                <IconDots size={14} />
-              </ActionIcon>
-            </Menu.Target>
-
-            <Menu.Dropdown onClick={(e) => e.stopPropagation()}>
-              <Menu.Item
-                leftSection={<IconEdit size={14} />}
-                onClick={onClick}
-              >
-                编辑
-              </Menu.Item>
-              <Menu.Item
-                leftSection={<IconTrash size={14} />}
-                color="red"
-                onClick={onToggle}
-              >
-                {isCompleted ? '恢复' : '删除'}
-              </Menu.Item>
-            </Menu.Dropdown>
-          </Menu>
+          <ActionIcon
+            size="sm"
+            variant="subtle"
+            color="gray"
+            onClick={(e) => e.stopPropagation()}
+            style={{ color: '#999' }}
+          >
+            <IconDots size={12} />
+          </ActionIcon>
         </Group>
       </Group>
-    </Card>
+    </Paper>
   );
 }
diff --git a/src/components/reminder/ReminderList.tsx b/src/components/reminder/ReminderList.tsx
index 1696b5b..fcb69f3 100644
--- a/src/components/reminder/ReminderList.tsx
+++ b/src/components/reminder/ReminderList.tsx
@@ -1,7 +1,21 @@
-import { useMemo } from 'react';
-import { Stack, Text, Paper, Group, Button, Badge, ThemeIcon, Alert } from '@mantine/core';
-import { IconPlus, IconBell, IconAlertCircle } from '@tabler/icons-react';
+import { useMemo, useState } from 'react';
+import {
+  Stack,
+  Text,
+  Paper,
+  Group,
+  Button,
+  Alert,
+  ActionIcon,
+  Tooltip,
+} from '@mantine/core';
+import {
+  IconPlus,
+  IconAlertCircle,
+  IconArchive,
+} from '@tabler/icons-react';
 import { ReminderCard } from './ReminderCard';
+import { ArchiveReminderModal } from './ArchiveReminderModal';
 import type { Event } from '../../types';
 
 interface ReminderListProps {
@@ -9,6 +23,8 @@ interface ReminderListProps {
   onEventClick: (event: Event) => void;
   onToggleComplete: (event: Event) => void;
   onAddClick: () => void;
+  onDelete?: (event: Event) => void;
+  onRestore?: (event: Event) => void;
 }
 
 export function ReminderList({
@@ -16,7 +32,11 @@ export function ReminderList({
   onEventClick,
   onToggleComplete,
   onAddClick,
+  onDelete,
+  onRestore,
 }: ReminderListProps) {
+  const [archiveOpened, setArchiveOpened] = useState(false);
+
   const grouped = useMemo(() => {
     const now = new Date();
     const today = new Date(now.getFullYear(), now.getMonth(), now.getDate());
@@ -81,23 +101,25 @@ export function ReminderList({
   // 空状态
   if (!hasActiveReminders) {
     return (
-      <Paper p="md" withBorder radius="md" h="100%">
+      <Paper p="md" withBorder radius={4} h="100%">
         <Stack align="center" justify="center" h="100%">
-          <ThemeIcon size={40} variant="light" color="gray" radius="xl">
-            <IconBell size={20} />
-          </ThemeIcon>
-          <Text c="dimmed" size="sm" ta="center">
+          <Text c="#999" size="sm" ta="center" style={{ letterSpacing: '0.05em' }}>
             暂无提醒
-            <br />
-            <Text size="xs" c="dimmed" mt={4}>
-              记得添加提醒事项哦
-            </Text>
+          </Text>
+          <Text size="xs" c="#bbb" ta="center" mt={4}>
+            记得添加提醒事项哦
           </Text>
           <Button
-            variant="light"
+            variant="outline"
             size="xs"
-            leftSection={<IconPlus size={14} />}
+            leftSection={<IconPlus size={12} />}
             onClick={onAddClick}
+            style={{
+              borderColor: '#ccc',
+              color: '#1a1a1a',
+              borderRadius: 2,
+              marginTop: 8,
+            }}
           >
             添加提醒
           </Button>
@@ -110,149 +132,169 @@ export function ReminderList({
   const missedCount = grouped.missed.length;
 
   return (
-    <Paper p="md" withBorder radius="md" h="100%" style={{ display: 'flex', flexDirection: 'column' }}>
-      {/* Header */}
-      <Group justify="space-between" mb="sm" style={{ flexShrink: 0 }}>
-        <Group gap={8}>
-          <ThemeIcon size="sm" variant="light" color="orange">
-            <IconBell size={12} />
-          </ThemeIcon>
-          <Text fw={500} size="sm">
-            提醒
-          </Text>
-          {missedCount > 0 && (
-            <Badge size="xs" variant="filled" color="red">
-              {missedCount}个逾期
-            </Badge>
-          )}
+    <>
+      <Paper p="md" withBorder radius={4} h="100%" style={{ display: 'flex', flexDirection: 'column' }}>
+        {/* Header */}
+        <Group justify="space-between" mb="sm" style={{ flexShrink: 0 }}>
+          <Group gap={8}>
+            <Text fw={500} size="sm" style={{ letterSpacing: '0.1em', color: '#1a1a1a' }}>
+              提醒
+            </Text>
+            {missedCount > 0 && (
+              <Text size="xs" c="#c41c1c" fw={500}>
+                {missedCount}个逾期
+              </Text>
+            )}
+          </Group>
+          <Group gap={4}>
+            {grouped.completed.length > 0 && (
+              <Tooltip label="查看已归档">
+                <ActionIcon
+                  size="sm"
+                  variant="subtle"
+                  color="gray"
+                  onClick={() => setArchiveOpened(true)}
+                  style={{ color: '#999' }}
+                >
+                  <IconArchive size={12} />
+                </ActionIcon>
+              </Tooltip>
+            )}
+            <Button
+              variant="subtle"
+              size="xs"
+              leftSection={<IconPlus size={12} />}
+              onClick={onAddClick}
+              style={{
+                color: '#666',
+                borderRadius: 2,
+              }}
+            >
+              添加
+            </Button>
+          </Group>
         </Group>
-        <Button
-          variant="subtle"
-          size="xs"
-          leftSection={<IconPlus size={14} />}
-          onClick={onAddClick}
-        >
-          添加
-        </Button>
-      </Group>
 
-      {/* Content */}
-      <Stack gap="xs" style={{ flex: 1, overflowY: 'auto', minHeight: 0 }}>
-        {/* 逾期提醒 */}
-        {grouped.missed.length > 0 && (
-          <Alert
-            icon={<IconAlertCircle size={14} />}
-            color="red"
-            variant="light"
-            p="xs"
-            title={<Text size="xs" fw={500}>已错过 {grouped.missed.length}个</Text>}
-          >
-            <Stack gap={4}>
-              {grouped.missed.slice(0, 3).map((event) => (
+        {/* Content */}
+        <Stack gap="xs" style={{ flex: 1, overflowY: 'auto', minHeight: 0 }}>
+          {/* 逾期提醒 */}
+          {grouped.missed.length > 0 && (
+            <Alert
+              icon={<IconAlertCircle size={14} />}
+              color="dark"
+              variant="light"
+              p="xs"
+              title={<Text size="xs" fw={500} c="#c41c1c">已错过 {grouped.missed.length}个</Text>}
+            >
+              <Stack gap={4}>
+                {grouped.missed.slice(0, 3).map((event) => (
+                  <ReminderCard
+                    key={event.id}
+                    event={event}
+                    onClick={() => onEventClick(event)}
+                    onToggle={() => onToggleComplete(event)}
+                    onDelete={onDelete ? () => onDelete(event) : undefined}
+                  />
+                ))}
+                {grouped.missed.length > 3 && (
+                  <Text size="xs" c="#999" ta="center">
+                    还有 {grouped.missed.length - 3} 个逾期提醒...
+                  </Text>
+                )}
+              </Stack>
+            </Alert>
+          )}
+
+          {/* 今天 */}
+          {grouped.today.length > 0 && (
+            <>
+              <Group gap={4}>
+                <Text size="xs" c="#c41c1c" fw={400} style={{ letterSpacing: '0.05em' }}>
+                  今天
+                </Text>
+              </Group>
+              {grouped.today.map((event) => (
                 <ReminderCard
                   key={event.id}
                   event={event}
                   onClick={() => onEventClick(event)}
                   onToggle={() => onToggleComplete(event)}
+                  onDelete={onDelete ? () => onDelete(event) : undefined}
                 />
               ))}
-              {grouped.missed.length > 3 && (
-                <Text size="xs" c="dimmed" ta="center">
-                  还有 {grouped.missed.length - 3} 个逾期提醒...
+            </>
+          )}
+
+          {/* 明天 */}
+          {grouped.tomorrow.length > 0 && (
+            <>
+              <Group gap={4}>
+                <Text size="xs" c="#666" fw={400} style={{ letterSpacing: '0.05em' }}>
+                  明天
                 </Text>
-              )}
-            </Stack>
-          </Alert>
-        )}
+              </Group>
+              {grouped.tomorrow.map((event) => (
+                <ReminderCard
+                  key={event.id}
+                  event={event}
+                  onClick={() => onEventClick(event)}
+                  onToggle={() => onToggleComplete(event)}
+                  onDelete={onDelete ? () => onDelete(event) : undefined}
+                />
+              ))}
+            </>
+          )}
 
-        {/* 今天 */}
-        {grouped.today.length > 0 && (
-          <>
-            <Group gap={4}>
-              <Text size="xs" c="red" fw={600}>
-                今天
-              </Text>
-              <Badge size="xs" variant="light" color="red">
-                {grouped.today.length}
-              </Badge>
-            </Group>
-            {grouped.today.map((event) => (
-              <ReminderCard
-                key={event.id}
-                event={event}
-                onClick={() => onEventClick(event)}
-                onToggle={() => onToggleComplete(event)}
-              />
-            ))}
-          </>
-        )}
+          {/* 本周 */}
+          {grouped.thisWeek.length > 0 && (
+            <>
+              <Group gap={4}>
+                <Text size="xs" c="#888" fw={400} style={{ letterSpacing: '0.05em' }}>
+                  本周
+                </Text>
+              </Group>
+              {grouped.thisWeek.map((event) => (
+                <ReminderCard
+                  key={event.id}
+                  event={event}
+                  onClick={() => onEventClick(event)}
+                  onToggle={() => onToggleComplete(event)}
+                  onDelete={onDelete ? () => onDelete(event) : undefined}
+                />
+              ))}
+            </>
+          )}
 
-        {/* 明天 */}
-        {grouped.tomorrow.length > 0 && (
-          <>
-            <Group gap={4}>
-              <Text size="xs" c="teal" fw={600}>
-                明天
-              </Text>
-              <Badge size="xs" variant="light" color="teal">
-                {grouped.tomorrow.length}
-              </Badge>
-            </Group>
-            {grouped.tomorrow.map((event) => (
-              <ReminderCard
-                key={event.id}
-                event={event}
-                onClick={() => onEventClick(event)}
-                onToggle={() => onToggleComplete(event)}
-              />
-            ))}
-          </>
-        )}
+          {/* 更久 */}
+          {grouped.later.length > 0 && (
+            <>
+              <Group gap={4}>
+                <Text size="xs" c="#999" fw={400} style={{ letterSpacing: '0.05em' }}>
+                  以后
+                </Text>
+              </Group>
+              {grouped.later.map((event) => (
+                <ReminderCard
+                  key={event.id}
+                  event={event}
+                  onClick={() => onEventClick(event)}
+                  onToggle={() => onToggleComplete(event)}
+                  onDelete={onDelete ? () => onDelete(event) : undefined}
+                />
+              ))}
+            </>
+          )}
+        </Stack>
+      </Paper>
 
-        {/* 本周 */}
-        {grouped.thisWeek.length > 0 && (
-          <>
-            <Group gap={4}>
-              <Text size="xs" c="blue" fw={600}>
-                本周
-              </Text>
-              <Badge size="xs" variant="light" color="blue">
-                {grouped.thisWeek.length}
-              </Badge>
-            </Group>
-            {grouped.thisWeek.map((event) => (
-              <ReminderCard
-                key={event.id}
-                event={event}
-                onClick={() => onEventClick(event)}
-                onToggle={() => onToggleComplete(event)}
-              />
-            ))}
-          </>
-        )}
-
-        {/* 更久 */}
-        {grouped.later.length > 0 && (
-          <>
-            <Group gap={4}>
-              <Text size="xs" c="gray" fw={600}>
-                以后
-              </Text>
-              <Badge size="xs" variant="light" color="gray">
-                {grouped.later.length}
-              </Badge>
-            </Group>
-            {grouped.later.map((event) => (
-              <ReminderCard
-                key={event.id}
-                event={event}
-                onClick={() => onEventClick(event)}
-                onToggle={() => onToggleComplete(event)}
-              />
-            ))}
-          </>
-        )}
-      </Stack>
-    </Paper>
+      {/* Archive Modal */}
+      <ArchiveReminderModal
+        opened={archiveOpened}
+        onClose={() => setArchiveOpened(false)}
+        completedReminders={grouped.completed}
+        onRestore={onRestore || (() => {})}
+        onDelete={onDelete || (() => {})}
+      />
+    </>
   );
 }
diff --git a/src/constants/holidays.ts b/src/constants/holidays.ts
index ed4972a..be3e29b 100644
--- a/src/constants/holidays.ts
+++ b/src/constants/holidays.ts
@@ -3,12 +3,13 @@
  * 基于2024年节假日安排
  * 每个节日包含：名称、日期（公历/农历）、是否放假日
  */
+import { Lunar } from 'lunar-javascript';
 
 export interface Holiday {
   id: string;
   name: string;
-  month: number;      // 公历月份
-  day: number;        // 公历日期
+  month?: number;      // 公历月份（非农历时使用）
+  day?: number;        // 公历日期（非农历时使用）
   isLunar: boolean;   // 是否为农历日期
   lunarMonth?: number; // 农历月份（农历日期时使用）
   lunarDay?: number;   // 农历日期（农历日期时使用）
@@ -168,9 +169,10 @@ export function isHoliday(
       // 农历日期需要转换
       try {
         const lunar = Lunar.fromYmd(year, month, day);
+        const solar = lunar.getSolar();
         if (
-          lunar.getMonth() === holiday.lunarMonth &&
-          lunar.getDay() === holiday.lunarDay
+          solar.getMonth() === holiday.lunarMonth &&
+          solar.getDay() === holiday.lunarDay
         ) {
           return holiday;
         }
diff --git a/src/pages/HomePage.tsx b/src/pages/HomePage.tsx
index 8fe08f0..b797173 100644
--- a/src/pages/HomePage.tsx
+++ b/src/pages/HomePage.tsx
@@ -13,14 +13,14 @@ import {
   Select,
   Stack,
 } from '@mantine/core';
-import { DateInput, TimeInput } from '@mantine/dates';
-import { IconLogout, IconPlus } from '@tabler/icons-react';
+import { DatePickerInput, TimeInput } from '@mantine/dates';
+import { IconLogout } from '@tabler/icons-react';
 import { useDisclosure } from '@mantine/hooks';
 import { useAppStore } from '../stores';
 import { AnniversaryList } from '../components/anniversary/AnniversaryList';
 import { ReminderList } from '../components/reminder/ReminderList';
 import { NoteEditor } from '../components/note/NoteEditor';
-import { AIChatBox } from '../components/ai/AIChatBox';
+import { FloatingAIChat } from '../components/ai/FloatingAIChat';
 import type { Event, EventType, RepeatType } from '../types';
 
 export function HomePage() {
@@ -115,7 +115,7 @@ export function HomePage() {
     fetchEvents();
   };
 
-  const handleDelete = async () => {
+  const handleDeleteFromModal = async () => {
     if (!selectedEvent) return;
     await deleteEventById(selectedEvent.id);
     close();
@@ -130,6 +130,20 @@ export function HomePage() {
     fetchEvents();
   };
 
+  const handleDelete = async (event: Event) => {
+    if (event.type !== 'reminder') return;
+    await deleteEventById(event.id);
+    fetchEvents();
+  };
+
+  const handleRestore = async (event: Event) => {
+    if (event.type !== 'reminder') return;
+    await updateEventById(event.id, {
+      is_completed: false,
+    });
+    fetchEvents();
+  };
+
   const resetForm = () => {
     setFormType('anniversary');
     setFormTitle('');
@@ -148,180 +162,302 @@ export function HomePage() {
   };
 
   return (
-    <Container size="xl" py="md" h="100vh" style={{ display: 'flex', flexDirection: 'column' }}>
-      {/* Header */}
-      <Group justify="space-between" mb="md" style={{ flexShrink: 0 }}>
-        <Title order={2} c="blue">
-          掐日子
-        </Title>
-        <Group>
-          <Text size="sm" c="dimmed">
-            {user?.nickname || user?.email}
-          </Text>
-          <Button
-            variant="subtle"
-            color="gray"
-            size="xs"
-            leftSection={<IconLogout size={14} />}
-            onClick={handleLogout}
+    <div
+      style={{
+        minHeight: '100vh',
+        background: '#faf9f7',
+      }}
+    >
+      <Container size="xl" py="md" h="100vh" style={{ display: 'flex', flexDirection: 'column' }}>
+        {/* Header */}
+        <Group justify="space-between" mb="md" style={{ flexShrink: 0 }}>
+          <Title
+            order={2}
+            style={{
+              fontWeight: 300,
+              fontSize: '1.25rem',
+              letterSpacing: '0.15em',
+              color: '#1a1a1a',
+            }}
           >
-            退出
-          </Button>
+            掐日子
+          </Title>
+          <Group>
+            <Text
+              size="xs"
+              c="#888"
+              style={{ letterSpacing: '0.05em' }}
+            >
+              {user?.nickname || user?.email}
+            </Text>
+            <Button
+              variant="subtle"
+              color="gray"
+              size="xs"
+              leftSection={<IconLogout size={12} />}
+              onClick={handleLogout}
+              style={{
+                letterSpacing: '0.1em',
+                borderRadius: 2,
+              }}
+            >
+              退出
+            </Button>
+          </Group>
         </Group>
-      </Group>
 
-      {/* Main Content - 4 panel layout */}
-      <Grid grow style={{ flex: 1, minHeight: 0 }}>
-        {/* Left column - 40% */}
-        <Grid.Col span={4}>
-          <Stack gap="md" h="100%">
-            {/* Anniversary list */}
-            <div style={{ flex: 1, minHeight: 0 }}>
+        {/* Main Content - 3 column horizontal layout */}
+        <Grid grow style={{ flex: 1, minHeight: 0 }} gutter="md">
+          {/* Left column - Anniversary */}
+          <Grid.Col span={4}>
+            <div style={{ height: '100%', minHeight: 0 }}>
               <AnniversaryList
                 events={events}
                 onEventClick={handleEventClick}
                 onAddClick={() => handleAddClick('anniversary')}
               />
             </div>
+          </Grid.Col>
 
-            {/* Reminder list */}
-            <div style={{ flex: 1, minHeight: 0 }}>
+          {/* Middle column - Reminder */}
+          <Grid.Col span={4}>
+            <div style={{ height: '100%', minHeight: 0 }}>
               <ReminderList
                 events={events}
                 onEventClick={handleEventClick}
                 onToggleComplete={handleToggleComplete}
                 onAddClick={() => handleAddClick('reminder')}
+                onDelete={handleDelete}
+                onRestore={handleRestore}
               />
             </div>
-          </Stack>
-        </Grid.Col>
+          </Grid.Col>
 
-        {/* Right column - 60% */}
-        <Grid.Col span={8}>
-          <Stack gap="md" h="100%">
-            {/* Note editor */}
-            <div style={{ flex: 1, minHeight: 0 }}>
+          {/* Right column - Note */}
+          <Grid.Col span={4}>
+            <div style={{ height: '100%', minHeight: 0 }}>
               <NoteEditor />
             </div>
+          </Grid.Col>
+        </Grid>
 
-            {/* AI Chat */}
-            <div style={{ flex: 1, minHeight: 0 }}>
-              <AIChatBox onEventCreated={handleAIEventCreated} />
-            </div>
-          </Stack>
-        </Grid.Col>
-      </Grid>
+        {/* AI Chat - Floating */}
+        <FloatingAIChat onEventCreated={handleAIEventCreated} />
 
-      {/* Add/Edit Event Modal */}
-      <Modal
-        opened={opened}
-        onClose={close}
-        title={
-          <Group gap={8}>
-            <IconPlus size={18} />
-            <Text fw={500}>{isEdit ? '编辑事件' : '添加事件'}</Text>
-          </Group>
-        }
-        size="md"
-      >
-        <Stack gap="md">
-          {/* Event type */}
-          <Select
-            label="类型"
-            data={[
-              { value: 'anniversary', label: '纪念日' },
-              { value: 'reminder', label: '提醒' },
-            ]}
-            value={formType}
-            onChange={(value) => value && setFormType(value as EventType)}
-            disabled={isEdit}
-          />
-
-          {/* Title */}
-          <TextInput
-            label="标题"
-            placeholder="输入标题"
-            value={formTitle}
-            onChange={(e) => setFormTitle(e.target.value)}
-            required
-          />
-
-          {/* Content (only for reminders) */}
-          {formType === 'reminder' && (
-            <Textarea
-              label="内容"
-              placeholder="输入详细内容"
-              value={formContent}
-              onChange={(e) => setFormContent(e.target.value)}
-              rows={3}
+        {/* Add/Edit Event Modal */}
+        <Modal
+          opened={opened}
+          onClose={close}
+          title={
+            <Text
+              fw={400}
+              style={{
+                letterSpacing: '0.1em',
+                fontSize: '1rem',
+              }}
+            >
+              {isEdit ? '编辑事件' : '添加事件'}
+            </Text>
+          }
+          size="md"
+          styles={{
+            header: {
+              borderBottom: '1px solid rgba(0,0,0,0.06)',
+            },
+            body: {
+              paddingTop: 20,
+            },
+          }}
+        >
+          <Stack gap="md">
+            {/* Event type */}
+            <Select
+              label={
+                <Text size="xs" c="#666" style={{ letterSpacing: '0.05em', marginBottom: 4 }}>
+                  类型
+                </Text>
+              }
+              data={[
+                { value: 'anniversary', label: '纪念日' },
+                { value: 'reminder', label: '提醒' },
+              ]}
+              value={formType}
+              onChange={(value) => value && setFormType(value as EventType)}
+              disabled={isEdit}
+              styles={{
+                input: {
+                  borderRadius: 2,
+                  background: '#faf9f7',
+                },
+              }}
             />
-          )}
 
-          {/* Date */}
-          <DateInput
-            label="日期"
-            placeholder="选择日期"
-            value={formDate}
-            onChange={setFormDate}
-            required
-          />
-
-          {/* Time (only for reminders) */}
-          {formType === 'reminder' && (
-            <TimeInput
-              label="时间"
-              placeholder="选择时间"
-              value={formTime}
-              onChange={(e) => setFormTime(e.target.value)}
+            {/* Title */}
+            <TextInput
+              label={
+                <Text size="xs" c="#666" style={{ letterSpacing: '0.05em', marginBottom: 4 }}>
+                  标题
+                </Text>
+              }
+              placeholder="输入标题"
+              value={formTitle}
+              onChange={(e) => setFormTitle(e.target.value)}
+              required
+              styles={{
+                input: {
+                  borderRadius: 2,
+                  background: '#faf9f7',
+                },
+              }}
             />
-          )}
 
-          {/* Lunar switch */}
-          <Switch
-            label="农历日期"
-            checked={formIsLunar}
-            onChange={(e) => setFormIsLunar(e.currentTarget.checked)}
-          />
-
-          {/* Repeat type */}
-          <Select
-            label="重复"
-            data={[
-              { value: 'none', label: '不重复' },
-              { value: 'yearly', label: '每年' },
-              { value: 'monthly', label: '每月' },
-            ]}
-            value={formRepeatType}
-            onChange={(value) => value && setFormRepeatType(value as RepeatType)}
-          />
-
-          {/* Holiday switch (only for anniversaries) */}
-          {formType === 'anniversary' && (
-            <Switch
-              label="节假日"
-              checked={formIsHoliday}
-              onChange={(e) => setFormIsHoliday(e.currentTarget.checked)}
-            />
-          )}
-
-          {/* Actions */}
-          <Group justify="space-between" mt="md">
-            {isEdit && (
-              <Button color="red" variant="light" onClick={handleDelete}>
-                删除
-              </Button>
+            {/* Content (only for reminders) */}
+            {formType === 'reminder' && (
+              <Textarea
+                label={
+                  <Text size="xs" c="#666" style={{ letterSpacing: '0.05em', marginBottom: 4 }}>
+                    内容
+                  </Text>
+                }
+                placeholder="输入详细内容"
+                value={formContent}
+                onChange={(e) => setFormContent(e.target.value)}
+                rows={3}
+                styles={{
+                  input: {
+                    borderRadius: 2,
+                    background: '#faf9f7',
+                  },
+                }}
+              />
             )}
-            <Group ml="auto">
-              <Button variant="subtle" onClick={close}>
-                取消
-              </Button>
-              <Button onClick={handleSubmit} disabled={!formTitle.trim() || !formDate}>
-                {isEdit ? '保存' : '添加'}
-              </Button>
+
+            {/* Date */}
+            <DatePickerInput
+              label={
+                <Text size="xs" c="#666" style={{ letterSpacing: '0.05em', marginBottom: 4 }}>
+                  日期
+                </Text>
+              }
+              placeholder="选择日期"
+              value={formDate}
+              onChange={(value) => setFormDate(value as Date | null)}
+              required
+              styles={{
+                input: {
+                  borderRadius: 2,
+                  background: '#faf9f7',
+                },
+              }}
+            />
+
+            {/* Time (only for reminders) */}
+            {formType === 'reminder' && (
+              <TimeInput
+                label={
+                  <Text size="xs" c="#666" style={{ letterSpacing: '0.05em', marginBottom: 4 }}>
+                    时间
+                  </Text>
+                }
+                placeholder="选择时间"
+                value={formTime}
+                onChange={(e) => setFormTime(e.target.value)}
+                styles={{
+                  input: {
+                    borderRadius: 2,
+                    background: '#faf9f7',
+                  },
+                }}
+              />
+            )}
+
+            {/* Lunar switch */}
+            <Switch
+              label={
+                <Text size="xs" c="#666" style={{ letterSpacing: '0.05em' }}>
+                  农历日期
+                </Text>
+              }
+              checked={formIsLunar}
+              onChange={(e) => setFormIsLunar(e.currentTarget.checked)}
+            />
+
+            {/* Repeat type */}
+            <Select
+              label={
+                <Text size="xs" c="#666" style={{ letterSpacing: '0.05em', marginBottom: 4 }}>
+                  重复
+                </Text>
+              }
+              data={[
+                { value: 'none', label: '不重复' },
+                { value: 'yearly', label: '每年' },
+                { value: 'monthly', label: '每月' },
+              ]}
+              value={formRepeatType}
+              onChange={(value) => value && setFormRepeatType(value as RepeatType)}
+              styles={{
+                input: {
+                  borderRadius: 2,
+                  background: '#faf9f7',
+                },
+              }}
+            />
+
+            {/* Holiday switch (only for anniversaries) */}
+            {formType === 'anniversary' && (
+              <Switch
+                label={
+                  <Text size="xs" c="#666" style={{ letterSpacing: '0.05em' }}>
+                    节假日
+                  </Text>
+                }
+                checked={formIsHoliday}
+                onChange={(e) => setFormIsHoliday(e.currentTarget.checked)}
+              />
+            )}
+
+            {/* Actions */}
+            <Group justify="space-between" mt="md">
+              {isEdit && (
+                <Button
+                  color="dark"
+                  variant="light"
+                  onClick={handleDeleteFromModal}
+                  style={{
+                    borderRadius: 2,
+                  }}
+                >
+                  删除
+                </Button>
+              )}
+              <Group ml="auto">
+                <Button
+                  variant="subtle"
+                  onClick={close}
+                  style={{
+                    borderRadius: 2,
+                    color: '#666',
+                  }}
+                >
+                  取消
+                </Button>
+                <Button
+                  onClick={handleSubmit}
+                  disabled={!formTitle.trim() || !formDate}
+                  style={{
+                    background: '#1a1a1a',
+                    border: '1px solid #1a1a1a',
+                    borderRadius: 2,
+                  }}
+                >
+                  {isEdit ? '保存' : '添加'}
+                </Button>
+              </Group>
             </Group>
-          </Group>
-        </Stack>
-      </Modal>
-    </Container>
+          </Stack>
+        </Modal>
+      </Container>
+    </div>
   );
 }
diff --git a/src/pages/LandingPage.tsx b/src/pages/LandingPage.tsx
index 8c74c14..bca98c9 100644
--- a/src/pages/LandingPage.tsx
+++ b/src/pages/LandingPage.tsx
@@ -1,25 +1,418 @@
-import { Button, Container, Title, Text, Paper } from '@mantine/core';
+import { useEffect, useRef } from 'react';
+import { Button, Container, Title, Text, Group, Stack } from '@mantine/core';
 import { useNavigate } from 'react-router-dom';
+import iconUrl from '../assets/icon.png';
+
+// 禅意算法背景 - 手印静寂（循环墨晕效果）
+function ZenBackground() {
+  const canvasRef = useRef<HTMLCanvasElement>(null);
+  const animationRef = useRef<number | null>(null);
+
+  useEffect(() => {
+    const canvas = canvasRef.current;
+    if (!canvas) return;
+
+    const ctx = canvas.getContext('2d');
+    if (!ctx) return;
+
+    const resize = () => {
+      canvas.width = window.innerWidth;
+      canvas.height = window.innerHeight;
+    };
+    resize();
+    window.addEventListener('resize', resize);
+
+    // 简化的伪随机
+    const random = (min = 0, max = 1) => {
+      return min + Math.random() * (max - min);
+    };
+
+    // 简化的噪声函数
+    const noise = (x: number, y: number, t: number) => {
+      return (Math.sin(x * 0.01 + t) * Math.cos(y * 0.01 + t * 0.7) + 1) * 0.5;
+    };
+
+    interface InkStroke {
+      points: { x: number; y: number; weight: number }[];
+      x: number;
+      y: number;
+      angle: number;
+      speed: number;
+      inkAlpha: number;
+      baseWeight: number;
+      maxLength: number;
+      currentLength: number;
+      complete: boolean;
+    }
+
+    let strokes: InkStroke[] = [];
+    let time = 0;
+    let lastStrokeTime = 0;
+    const strokeInterval = 30; // 每隔一段时间生成新笔触
+
+    // 生成随机笔触
+    const createStroke = (): InkStroke | null => {
+      const angle = random(0, Math.PI * 2);
+      const radius = random(canvas.width * 0.1, canvas.width * 0.4);
+      const x = canvas.width / 2 + Math.cos(angle) * radius;
+      const y = canvas.height / 2 + Math.sin(angle) * radius;
+
+      return {
+        points: [{ x, y, weight: random(0.3, 1.5) }],
+        x,
+        y,
+        angle: random(0, Math.PI * 2),
+        speed: random(0.4, 1.0),
+        inkAlpha: random(10, 30),
+        baseWeight: random(0.3, 1.5),
+        maxLength: random(30, 90),  // 缩短笔触长度，加快消失
+        currentLength: 0,
+        complete: false,
+      };
+    };
+
+    // 初始化一些笔触
+    const initStrokes = () => {
+      strokes = [];
+      for (let i = 0; i < 8; i++) {
+        const stroke = createStroke();
+        if (stroke) {
+          // 随机偏移起始位置
+          stroke.currentLength = random(0, stroke.maxLength * 0.5);
+          strokes.push(stroke);
+        }
+      }
+    };
+
+    initStrokes();
+
+    // 清空画布
+    ctx.fillStyle = '#faf9f7';
+    ctx.fillRect(0, 0, canvas.width, canvas.height);
+
+    const animate = () => {
+      time += 0.008;
+
+      // 快速淡出背景 - 让水墨痕迹更快消失
+      if (Math.floor(time * 125) % 3 === 0) {
+        ctx.fillStyle = 'rgba(250, 249, 247, 0.12)';
+        ctx.fillRect(0, 0, canvas.width, canvas.height);
+      }
+
+      // 定期生成新笔触
+      if (time - lastStrokeTime > strokeInterval * 0.01) {
+        lastStrokeTime = time;
+        // 移除已完成太久的笔触
+        strokes = strokes.filter(s => !s.complete || s.currentLength < s.maxLength);
+        // 添加新笔触（随机数量）
+        const newCount = Math.floor(random(0, 2));
+        for (let i = 0; i < newCount; i++) {
+          const stroke = createStroke();
+          if (stroke) strokes.push(stroke!);
+        }
+      }
+
+      // 更新和绘制笔触
+      for (const stroke of strokes) {
+        if (stroke.complete) continue;
+
+        // 噪声驱动
+        const n = noise(stroke.x, stroke.y, time);
+        stroke.angle += (n - 0.5) * 0.12;
+
+        // 呼吸感 - 更柔和
+        const breath = Math.sin(time * 1.5 + stroke.x * 0.01) * 0.25;
+        const currentSpeed = stroke.speed * (1 + breath * 0.2);
+
+        stroke.x += Math.cos(stroke.angle) * currentSpeed;
+        stroke.y += Math.sin(stroke.angle) * currentSpeed;
+
+        // 笔触粗细 - 模拟提按
+        const progress = stroke.currentLength / stroke.maxLength;
+        const weightVar = Math.sin(progress * Math.PI) * 1.0;
+        const weight = Math.max(0.2, stroke.baseWeight + weightVar);
+
+        stroke.points.push({ x: stroke.x, y: stroke.y, weight });
+        stroke.currentLength++;
+
+        if (
+          stroke.currentLength >= stroke.maxLength ||
+          stroke.x < -50 || stroke.x > canvas.width + 50 ||
+          stroke.y < -50 || stroke.y > canvas.height + 50
+        ) {
+          stroke.complete = true;
+        }
+
+        // 绘制 - 水墨晕染效果
+        if (stroke.points.length > 1) {
+          for (let i = 1; i < stroke.points.length; i++) {
+            const p1 = stroke.points[i - 1];
+            const p2 = stroke.points[i];
+            // 渐变透明度
+            const alpha = stroke.inkAlpha * (1 - i / stroke.points.length * 0.4) / 100;
+            const size = p2.weight * random(0.8, 1.2);
+
+            // 绘制柔和的笔触
+            ctx.beginPath();
+            ctx.moveTo(p1.x, p1.y);
+            ctx.lineTo(p2.x, p2.y);
+            ctx.strokeStyle = `rgba(25, 25, 25, ${alpha})`;
+            ctx.lineWidth = size;
+            ctx.lineCap = 'round';
+            ctx.stroke();
+
+            // 添加淡淡的墨点晕染
+            if (random(0, 1) < 0.3) {
+              ctx.beginPath();
+              ctx.arc(p2.x, p2.y, size * random(0.5, 1.5), 0, Math.PI * 2);
+              ctx.fillStyle = `rgba(25, 25, 25, ${alpha * 0.3})`;
+              ctx.fill();
+            }
+          }
+        }
+      }
+
+      // 绘制圆相（Ensō）- 缓慢呼吸
+      const centerX = canvas.width / 2;
+      const centerY = canvas.height / 2;
+      const breathScale = 1 + Math.sin(time * 0.3) * 0.015;
+      const radius = Math.min(canvas.width, canvas.height) * 0.18 * breathScale;
+      const gap = Math.PI * 0.18; // 开口
+      const startAngle = -Math.PI / 2 + time * 0.05;
+
+      ctx.beginPath();
+      for (let a = startAngle; a < startAngle + Math.PI * 2 - gap; a += 0.04) {
+        const noiseOffset = noise(Math.cos(a) * 2, Math.sin(a) * 2, time * 0.2) * 5 - 2.5;
+        const r = radius + noiseOffset;
+        const x = centerX + Math.cos(a) * r;
+        const y = centerY + Math.sin(a) * r;
+        if (a === startAngle) {
+          ctx.moveTo(x, y);
+        } else {
+          ctx.lineTo(x, y);
+        }
+      }
+      ctx.strokeStyle = 'rgba(25, 25, 25, 0.06)';
+      ctx.lineWidth = 0.8;
+      ctx.stroke();
+
+      animationRef.current = requestAnimationFrame(animate);
+    };
+
+    animate();
+
+    return () => {
+      window.removeEventListener('resize', resize);
+      if (animationRef.current) {
+        cancelAnimationFrame(animationRef.current);
+      }
+    };
+  }, []);
+
+  return (
+    <canvas
+      ref={canvasRef}
+      style={{
+        position: 'fixed',
+        top: 0,
+        left: 0,
+        width: '100%',
+        height: '100%',
+        zIndex: 0,
+      }}
+    />
+  );
+}
 
 export function LandingPage() {
   const navigate = useNavigate();
 
   return (
-    <Container size="sm" style={{ height: '100vh', display: 'flex', flexDirection: 'column', justifyContent: 'center' }}>
-      <Paper p="xl" style={{ textAlign: 'center' }}>
-        <Title order={1} mb="md" c="blue">
-          掐日子
-        </Title>
-        <Text size="lg" c="dimmed" mb="xl">
-          AI 纪念日 · 提醒
-        </Text>
-        <Text size="sm" c="gray.6" mb="xl">
-          轻便、灵活的倒数日和提醒App，专注提醒功能
-        </Text>
-        <Button size="lg" variant="filled" onClick={() => navigate('/login')}>
-          开始使用
-        </Button>
-      </Paper>
-    </Container>
+    <div
+      style={{
+        minHeight: '100vh',
+        background: '#faf9f7',
+        position: 'relative',
+        overflow: 'hidden',
+      }}
+    >
+      <ZenBackground />
+
+      {/* 装饰性圆相 */}
+      <svg
+        style={{
+          position: 'fixed',
+          top: '8%',
+          right: '12%',
+          width: 200,
+          height: 200,
+          opacity: 0.05,
+          pointerEvents: 'none',
+        }}
+        viewBox="0 0 100 100"
+      >
+        <circle
+          cx="50"
+          cy="50"
+          r="45"
+          fill="none"
+          stroke="#1a1a1a"
+          strokeWidth="1"
+          strokeDasharray="250 30"
+        />
+      </svg>
+      <svg
+        style={{
+          position: 'fixed',
+          bottom: '12%',
+          left: '10%',
+          width: 160,
+          height: 160,
+          opacity: 0.04,
+          pointerEvents: 'none',
+        }}
+        viewBox="0 0 100 100"
+      >
+        <circle
+          cx="50"
+          cy="50"
+          r="40"
+          fill="none"
+          stroke="#1a1a1a"
+          strokeWidth="0.8"
+          strokeDasharray="200 50"
+        />
+      </svg>
+
+      <Container
+        size="sm"
+        style={{
+          position: 'relative',
+          zIndex: 1,
+          minHeight: '100vh',
+          display: 'flex',
+          flexDirection: 'column',
+          justifyContent: 'center',
+          alignItems: 'center',
+          textAlign: 'center',
+          padding: '2rem',
+        }}
+      >
+        <Stack align="center" gap="lg">
+          {/* 产品图标 */}
+          <div
+            style={{
+              width: 90,
+              height: 90,
+              borderRadius: '50%',
+              background: 'rgba(26, 26, 26, 0.03)',
+              display: 'flex',
+              alignItems: 'center',
+              justifyContent: 'center',
+              marginBottom: '0.5rem',
+            }}
+          >
+            <img
+              src={iconUrl}
+              alt="掐日子"
+              style={{
+                width: 60,
+                height: 60,
+                borderRadius: '50%',
+              }}
+            />
+          </div>
+
+          <Title
+            order={1}
+            style={{
+              fontWeight: 300,
+              fontSize: 'clamp(2.2rem, 7vw, 3.2rem)',
+              letterSpacing: '0.25em',
+              color: '#1a1a1a',
+              fontFamily: 'Noto Serif SC, serif',
+            }}
+          >
+            掐日子
+          </Title>
+
+          <Text
+            size="sm"
+            style={{
+              letterSpacing: '0.35em',
+              color: '#888',
+              fontWeight: 300,
+            }}
+          >
+            AI 纪念日 · 提醒
+          </Text>
+
+          <Text
+            size="xs"
+            style={{
+              color: '#999',
+              maxWidth: 300,
+              lineHeight: 1.9,
+              fontWeight: 300,
+            }}
+          >
+            轻便、灵活的倒数日和提醒应用
+            <br />
+            让每一个重要的日子都被铭记
+          </Text>
+
+          <Group gap="md" mt="lg">
+            <Button
+              size="sm"
+              onClick={() => navigate('/login')}
+              style={{
+                background: '#1a1a1a',
+                border: '1px solid #1a1a1a',
+                padding: '0 2rem',
+                fontWeight: 400,
+                letterSpacing: '0.15em',
+                borderRadius: 2,
+              }}
+            >
+              登录
+            </Button>
+            <Button
+              size="sm"
+              variant="outline"
+              onClick={() => navigate('/register')}
+              style={{
+                borderColor: '#ccc',
+                color: '#1a1a1a',
+                padding: '0 2rem',
+                fontWeight: 400,
+                letterSpacing: '0.15em',
+                borderRadius: 2,
+              }}
+            >
+              注册
+            </Button>
+          </Group>
+
+          <Group gap={40} mt={50} style={{ opacity: 0.7 }}>
+            <Stack gap={3} align="center">
+              <Text size="xs" fw={300} c="#444">◯</Text>
+              <Text size="xs" c="#666" style={{ letterSpacing: '0.1em' }}>纪念日</Text>
+            </Stack>
+            <Stack gap={3} align="center">
+              <Text size="xs" fw={300} c="#444">◎</Text>
+              <Text size="xs" c="#666" style={{ letterSpacing: '0.1em' }}>提醒</Text>
+            </Stack>
+            <Stack gap={3} align="center">
+              <Text size="xs" fw={300} c="#444">◇</Text>
+              <Text size="xs" c="#666" style={{ letterSpacing: '0.1em' }}>AI</Text>
+            </Stack>
+            <Stack gap={3} align="center">
+              <Text size="xs" fw={300} c="#444">▫</Text>
+              <Text size="xs" c="#666" style={{ letterSpacing: '0.1em' }}>便签</Text>
+            </Stack>
+          </Group>
+        </Stack>
+      </Container>
+    </div>
   );
 }
diff --git a/src/pages/LoginPage.tsx b/src/pages/LoginPage.tsx
index 9b7d28a..66d5942 100644
--- a/src/pages/LoginPage.tsx
+++ b/src/pages/LoginPage.tsx
@@ -26,43 +26,122 @@ export function LoginPage() {
   };
 
   return (
-    <Container size="sm" style={{ height: '100vh', display: 'flex', flexDirection: 'column', justifyContent: 'center' }}>
-      <Paper p="xl" shadow="md" radius="lg">
-        <Title order={2} ta="center" mb="xl">
-          登录
-        </Title>
+    <div
+      style={{
+        minHeight: '100vh',
+        background: '#faf9f7',
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center',
+      }}
+    >
+      <Container size="sm" style={{ width: '100%', maxWidth: 360 }}>
+        <Paper
+          p={40}
+          radius={4}
+          style={{
+            background: '#fff',
+            border: '1px solid rgba(0, 0, 0, 0.08)',
+          }}
+        >
+          <Title
+            order={2}
+            ta="center"
+            mb={32}
+            style={{
+              fontWeight: 300,
+              fontSize: '1.5rem',
+              letterSpacing: '0.2em',
+              color: '#1a1a1a',
+            }}
+          >
+            登录
+          </Title>
 
-        <form onSubmit={handleSubmit}>
-          <Stack gap="md">
-            <TextInput
-              label="邮箱"
-              placeholder="your@email.com"
-              value={email}
-              onChange={(e) => setEmail(e.target.value)}
-              required
-            />
-            <TextInput
-              label="密码"
-              type="password"
-              placeholder="Your password"
-              value={password}
-              onChange={(e) => setPassword(e.target.value)}
-              required
-            />
-            {error && <Text c="red" size="sm">{error}</Text>}
-            <Button type="submit" loading={loading} fullWidth>
-              登录
-            </Button>
-          </Stack>
-        </form>
+          <form onSubmit={handleSubmit}>
+            <Stack gap="md">
+              <TextInput
+                label={
+                  <Text size="xs" c="#666" style={{ letterSpacing: '0.1em', marginBottom: 4 }}>
+                    邮箱
+                  </Text>
+                }
+                placeholder="your@email.com"
+                value={email}
+                onChange={(e) => setEmail(e.target.value)}
+                required
+                styles={{
+                  input: {
+                    borderRadius: 2,
+                    borderColor: '#e0e0e0',
+                    background: '#faf9f7',
+                  },
+                }}
+              />
+              <TextInput
+                label={
+                  <Text size="xs" c="#666" style={{ letterSpacing: '0.1em', marginBottom: 4 }}>
+                    密码
+                  </Text>
+                }
+                type="password"
+                placeholder="Your password"
+                value={password}
+                onChange={(e) => setPassword(e.target.value)}
+                required
+                styles={{
+                  input: {
+                    borderRadius: 2,
+                    borderColor: '#e0e0e0',
+                    background: '#faf9f7',
+                  },
+                }}
+              />
+              {error && (
+                <Text c="#c41c1c" size="xs" style={{ letterSpacing: '0.05em' }}>
+                  {error}
+                </Text>
+              )}
+              <Button
+                type="submit"
+                loading={loading}
+                fullWidth
+                mt="sm"
+                style={{
+                  background: '#1a1a1a',
+                  border: '1px solid #1a1a1a',
+                  borderRadius: 2,
+                  fontWeight: 400,
+                  letterSpacing: '0.15em',
+                }}
+              >
+                登录
+              </Button>
+            </Stack>
+          </form>
 
-        <Text ta="center" mt="md" size="sm" c="dimmed">
-          还没有账号？{' '}
-          <Anchor component="button" onClick={() => navigate('/register')}>
-            立即注册
-          </Anchor>
-        </Text>
-      </Paper>
-    </Container>
+          <Text
+            ta="center"
+            mt="lg"
+            size="xs"
+            c="#888"
+            style={{ letterSpacing: '0.05em' }}
+          >
+            还没有账号？{' '}
+            <Anchor
+              component="button"
+              onClick={() => navigate('/register')}
+              style={{
+                color: '#1a1a1a',
+                textDecoration: 'underline',
+                textUnderlineOffset: 3,
+              }}
+            >
+              立即注册
+            </Anchor>
+          </Text>
+        </Paper>
+      </Container>
+    </div>
   );
 }
diff --git a/src/pages/RegisterPage.tsx b/src/pages/RegisterPage.tsx
index 0063213..555e121 100644
--- a/src/pages/RegisterPage.tsx
+++ b/src/pages/RegisterPage.tsx
@@ -37,71 +37,175 @@ export function RegisterPage() {
     if (error) {
       setError(error);
     } else {
-      // 注册成功后直接跳转到首页（已登录状态）
       navigate('/');
     }
     setLoading(false);
   };
 
   return (
-    <Container size="sm" style={{ height: '100vh', display: 'flex', flexDirection: 'column', justifyContent: 'center' }}>
-      <Paper p="xl" shadow="md" radius="lg">
-        <Title order={2} ta="center" mb="xl">
-          注册
-        </Title>
+    <div
+      style={{
+        minHeight: '100vh',
+        background: '#faf9f7',
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center',
+      }}
+    >
+      <Container size="sm" style={{ width: '100%', maxWidth: 360 }}>
+        <Paper
+          p={40}
+          radius={4}
+          style={{
+            background: '#fff',
+            border: '1px solid rgba(0, 0, 0, 0.08)',
+          }}
+        >
+          <Title
+            order={2}
+            ta="center"
+            mb={32}
+            style={{
+              fontWeight: 300,
+              fontSize: '1.5rem',
+              letterSpacing: '0.2em',
+              color: '#1a1a1a',
+            }}
+          >
+            注册
+          </Title>
 
-        <form onSubmit={handleSubmit}>
-          <Stack gap="md">
-            <TextInput
-              label="昵称"
-              placeholder="Your nickname"
-              value={nickname}
-              onChange={(e) => setNickname(e.target.value)}
-            />
-            <TextInput
-              label="邮箱"
-              placeholder="your@email.com"
-              value={email}
-              onChange={(e) => setEmail(e.target.value)}
-              required
-            />
-            <div>
+          <form onSubmit={handleSubmit}>
+            <Stack gap="md">
               <TextInput
-                label="密码"
-                type="password"
-                placeholder="Create password"
-                value={password}
-                onChange={(e) => setPassword(e.target.value)}
-                required
-              />
-              {/* 密码要求提示 */}
-              <Stack gap={4} mt={6}>
-                {passwordRequirements.map((req, index) => (
-                  <Text
-                    key={index}
-                    size="xs"
-                    c={req.met ? 'green' : 'dimmed'}
-                    style={{ display: 'flex', alignItems: 'center', gap: 4 }}
-                  >
-                    {req.met ? '✓' : '○'} {req.label}
+                label={
+                  <Text size="xs" c="#666" style={{ letterSpacing: '0.1em', marginBottom: 4 }}>
+                    昵称
                   </Text>
-                ))}
-              </Stack>
-            </div>
-            {error && <Text c="red" size="sm">{error}</Text>}
-            <Button type="submit" loading={loading} fullWidth disabled={!meetsAllRequirements && password.length > 0}>
-              注册
-            </Button>
-          </Stack>
-        </form>
+                }
+                placeholder="Your nickname"
+                value={nickname}
+                onChange={(e) => setNickname(e.target.value)}
+                styles={{
+                  input: {
+                    borderRadius: 2,
+                    borderColor: '#e0e0e0',
+                    background: '#faf9f7',
+                  },
+                }}
+              />
+              <TextInput
+                label={
+                  <Text size="xs" c="#666" style={{ letterSpacing: '0.1em', marginBottom: 4 }}>
+                    邮箱
+                  </Text>
+                }
+                placeholder="your@email.com"
+                value={email}
+                onChange={(e) => setEmail(e.target.value)}
+                required
+                styles={{
+                  input: {
+                    borderRadius: 2,
+                    borderColor: '#e0e0e0',
+                    background: '#faf9f7',
+                  },
+                }}
+              />
+              <div>
+                <TextInput
+                  label={
+                    <Text size="xs" c="#666" style={{ letterSpacing: '0.1em', marginBottom: 4 }}>
+                      密码
+                    </Text>
+                  }
+                  type="password"
+                  placeholder="Create password"
+                  value={password}
+                  onChange={(e) => setPassword(e.target.value)}
+                  required
+                  styles={{
+                    input: {
+                      borderRadius: 2,
+                      borderColor: '#e0e0e0',
+                      background: '#faf9f7',
+                    },
+                  }}
+                />
+                {/* 密码要求提示 */}
+                <Stack gap={4} mt={8}>
+                  {passwordRequirements.map((req, index) => (
+                    <Text
+                      key={index}
+                      size="xs"
+                      c={req.met ? '#4a9c6d' : '#999'}
+                      style={{
+                        display: 'flex',
+                        alignItems: 'center',
+                        gap: 6,
+                        letterSpacing: '0.05em',
+                      }}
+                    >
+                      <span
+                        style={{
+                          width: 10,
+                          display: 'inline-block',
+                          textAlign: 'center',
+                        }}
+                      >
+                        {req.met ? '●' : '○'}
+                      </span>
+                      {req.label}
+                    </Text>
+                  ))}
+                </Stack>
+              </div>
+              {error && (
+                <Text c="#c41c1c" size="xs" style={{ letterSpacing: '0.05em' }}>
+                  {error}
+                </Text>
+              )}
+              <Button
+                type="submit"
+                loading={loading}
+                fullWidth
+                mt="sm"
+                disabled={!meetsAllRequirements && password.length > 0}
+                style={{
+                  background: '#1a1a1a',
+                  border: '1px solid #1a1a1a',
+                  borderRadius: 2,
+                  fontWeight: 400,
+                  letterSpacing: '0.15em',
+                }}
+              >
+                注册
+              </Button>
+            </Stack>
+          </form>
 
-        <Text ta="center" mt="md" size="sm" c="dimmed">
-          已有账号？{' '}
-          <Anchor component="button" onClick={() => navigate('/login')}>
-            立即登录
-          </Anchor>
-        </Text>
-      </Paper>
-    </Container>
+          <Text
+            ta="center"
+            mt="lg"
+            size="xs"
+            c="#888"
+            style={{ letterSpacing: '0.05em' }}
+          >
+            已有账号？{' '}
+            <Anchor
+              component="button"
+              onClick={() => navigate('/login')}
+              style={{
+                color: '#1a1a1a',
+                textDecoration: 'underline',
+                textUnderlineOffset: 3,
+              }}
+            >
+              立即登录
+            </Anchor>
+          </Text>
+        </Paper>
+      </Container>
+    </div>
   );
 }
diff --git a/src/routes.tsx b/src/routes.tsx
index 6932975..ac8343a 100644
--- a/src/routes.tsx
+++ b/src/routes.tsx
@@ -4,7 +4,7 @@ import { LoginPage } from './pages/LoginPage';
 import { RegisterPage } from './pages/RegisterPage';
 import { HomePage } from './pages/HomePage';
 import { useAppStore } from './stores';
-import { useState, useEffect, useRef } from 'react';
+import { useEffect, useRef } from 'react';
 
 // Loading spinner component
 function AuthLoading() {
@@ -91,10 +91,25 @@ function PublicRoute({ children }: { children: React.ReactNode }) {
   return <>{children}</>;
 }
 
+// Root redirect - 根据登录状态重定向
+function RootRedirect() {
+  const { isAuthenticated, isLoading } = useAuthLoader();
+
+  if (isLoading) {
+    return <AuthLoading />;
+  }
+
+  if (isAuthenticated) {
+    return <Navigate to="/home" replace />;
+  }
+
+  return <Navigate to="/landing" replace />;
+}
+
 export const router = createBrowserRouter([
   {
     path: '/',
-    element: <Navigate to="/home" replace />,
+    element: <RootRedirect />,
   },
   {
     path: '/landing',
diff --git a/src/services/api.ts b/src/services/api.ts
index 5d8f570..2fa8ccf 100644
--- a/src/services/api.ts
+++ b/src/services/api.ts
@@ -1,4 +1,4 @@
-import type { User, Event, Note, AIConversation, EventType } from '../types';
+import type { User, Event, Note, EventType } from '../types';
 
 // API Base URL - from environment variable
 const API_URL = import.meta.env.VITE_API_URL || 'http://localhost:3000/api';
@@ -33,6 +33,7 @@ export const api = {
     const response = await fetch(`${API_URL}${endpoint}`, {
       ...options,
       headers,
+      credentials: 'include', // 确保跨域请求时发送凭证（cookie）
     });
 
     const data = await response.json();
diff --git a/src/types/index.ts b/src/types/index.ts
index 9068974..41aebae 100644
--- a/src/types/index.ts
+++ b/src/types/index.ts
@@ -80,11 +80,3 @@ export interface ApiResponse<T> {
 
 // Loading state types
 export type LoadingState = 'idle' | 'loading' | 'success' | 'error';
-
-// Grouped reminder types
-export interface GroupedReminders {
-  today: Reminder[];
-  tomorrow: Reminder[];
-  later: Reminder[];
-  missed: Reminder[];
-}
diff --git a/src/types/lunar-javascript.d.ts b/src/types/lunar-javascript.d.ts
new file mode 100644
index 0000000..13003f4
--- /dev/null
+++ b/src/types/lunar-javascript.d.ts
@@ -0,0 +1,16 @@
+declare module 'lunar-javascript' {
+  export class Lunar {
+    static fromYmd(year: number, month: number, day: number): Lunar;
+    getSolar(): Solar;
+    getMonth(): number;
+    getDay(): number;
+    getMonthInChinese(): string;
+    getDayInChinese(): string;
+  }
+
+  export class Solar {
+    getYear(): number;
+    getMonth(): number;
+    getDay(): number;
+  }
+}
diff --git a/src/utils/countdown.ts b/src/utils/countdown.ts
index df7fb00..3c59361 100644
--- a/src/utils/countdown.ts
+++ b/src/utils/countdown.ts
@@ -1,4 +1,4 @@
-import { Lunar, Solar } from 'lunar-javascript';
+import { Lunar } from 'lunar-javascript';
 
 export interface CountdownResult {
   days: number;
@@ -12,6 +12,7 @@ export interface CountdownResult {
 
 /**
  * 安全地创建日期，处理月末边界情况
+ * 某些月份只有28/29/30/31天
  */
 function safeCreateDate(year: number, month: number, day: number): Date {
   const date = new Date(year, month, day);
@@ -22,6 +23,32 @@ function safeCreateDate(year: number, month: number, day: number): Date {
   return date;
 }
 
+/**
+ * 安全地创建农历日期，处理月末边界情况
+ * 某些农历月份只有29或30天，需要检查并调整
+ */
+function safeCreateLunarDate(year: number, month: number, day: number): { lunar: Lunar; solar: Solar } | null {
+  try {
+    const lunar = Lunar.fromYmd(year, month, day);
+    return { lunar, solar: lunar.getSolar() };
+  } catch {
+    // 如果日期不存在（如农历12月30日在只有29天的月份），
+    // 尝试获取该月的最后一天
+    try {
+      // 获取下个月的农历日期，然后往前推一天
+      const nextMonthLunar = Lunar.fromYmd(year, month + 1, 1);
+      const lastDayOfMonth = nextMonthLunar.getLunar().getDay() - 1;
+      if (lastDayOfMonth > 0) {
+        const lunar = Lunar.fromYmd(year, month, lastDayOfMonth);
+        return { lunar, solar: lunar.getSolar() };
+      }
+    } catch {
+      // 仍然失败，返回null
+    }
+    return null;
+  }
+}
+
 /**
  * 计算纪念日的倒计时
  * 考虑重复规则，计算下一个 occurrence 的倒计时
@@ -44,10 +71,14 @@ export function calculateCountdown(
   const originalDay = dateParts[2];
 
   if (isLunar) {
-    // 农历日期：直接用原始农历年/月/日创建农历对象
-    const lunarDate = Lunar.fromYmd(originalYear, originalMonth + 1, originalDay);
-    const solar = lunarDate.getSolar();
-    targetDate = new Date(solar.getYear(), solar.getMonth() - 1, solar.getDay());
+    // 农历日期：使用安全方法创建，处理月末边界
+    const result = safeCreateLunarDate(originalYear, originalMonth + 1, originalDay);
+    if (result) {
+      targetDate = new Date(result.solar.getYear(), result.solar.getMonth() - 1, result.solar.getDay());
+    } else {
+      // 无法解析农历日期，使用原始公历日期作为后备
+      targetDate = new Date(originalYear, originalMonth, originalDay);
+    }
   } else {
     // 公历日期
     targetDate = new Date(originalYear, originalMonth, originalDay);
@@ -158,13 +189,11 @@ export function getFriendlyDateDescription(
 
   if (isLunar) {
     // 显示农历
-    try {
-      const solar = Solar.fromYmd(targetDate.getFullYear(), month, day);
-      const lunar = solar.getLunar();
-      return `${lunar.getMonthInChinese()}月${lunar.getDayInChinese()}`;
-    } catch {
-      return `${month}月${day}日`;
+    const result = safeCreateLunarDate(targetDate.getFullYear(), month, day);
+    if (result) {
+      return `${result.lunar.getMonthInChinese()}月${result.lunar.getDayInChinese()}`;
     }
+    return `${month}月${day}日`;
   }
 
   return `${month}月${day}日`;
@@ -184,8 +213,7 @@ export function getSolarFromLunar(lunarMonth: number, lunarDay: number, year?: n
  * 获取公历日期的农历日期
  */
 export function getLunarFromSolar(solarDate: Date): { month: number; day: number; monthInChinese: string; dayInChinese: string } {
-  const solar = Solar.fromYmd(solarDate.getFullYear(), solarDate.getMonth() + 1, solarDate.getDate());
-  const lunar = solar.getLunar();
+  const lunar = Lunar.fromYmd(solarDate.getFullYear(), solarDate.getMonth() + 1, solarDate.getDate());
   return {
     month: lunar.getMonth(),
     day: lunar.getDay(),
diff --git a/tmpclaude-1682-cwd b/tmpclaude-1682-cwd
new file mode 100644
index 0000000..094e142
--- /dev/null
+++ b/tmpclaude-1682-cwd
@@ -0,0 +1 @@
+/e/qia/client
diff --git a/tmpclaude-51ef-cwd b/tmpclaude-51ef-cwd
new file mode 100644
index 0000000..094e142
--- /dev/null
+++ b/tmpclaude-51ef-cwd
@@ -0,0 +1 @@
+/e/qia/client
diff --git a/tmpclaude-53b7-cwd b/tmpclaude-53b7-cwd
new file mode 100644
index 0000000..094e142
--- /dev/null
+++ b/tmpclaude-53b7-cwd
@@ -0,0 +1 @@
+/e/qia/client
diff --git a/tmpclaude-5843-cwd b/tmpclaude-5843-cwd
new file mode 100644
index 0000000..094e142
--- /dev/null
+++ b/tmpclaude-5843-cwd
@@ -0,0 +1 @@
+/e/qia/client
diff --git a/tmpclaude-7db7-cwd b/tmpclaude-7db7-cwd
new file mode 100644
index 0000000..094e142
--- /dev/null
+++ b/tmpclaude-7db7-cwd
@@ -0,0 +1 @@
+/e/qia/client
diff --git a/tmpclaude-8b3b-cwd b/tmpclaude-8b3b-cwd
new file mode 100644
index 0000000..094e142
--- /dev/null
+++ b/tmpclaude-8b3b-cwd
@@ -0,0 +1 @@
+/e/qia/client
diff --git a/tmpclaude-90be-cwd b/tmpclaude-90be-cwd
new file mode 100644
index 0000000..094e142
--- /dev/null
+++ b/tmpclaude-90be-cwd
@@ -0,0 +1 @@
+/e/qia/client
diff --git a/tmpclaude-90fc-cwd b/tmpclaude-90fc-cwd
new file mode 100644
index 0000000..094e142
--- /dev/null
+++ b/tmpclaude-90fc-cwd
@@ -0,0 +1 @@
+/e/qia/client
diff --git a/tmpclaude-c0a2-cwd b/tmpclaude-c0a2-cwd
new file mode 100644
index 0000000..094e142
--- /dev/null
+++ b/tmpclaude-c0a2-cwd
@@ -0,0 +1 @@
+/e/qia/client
diff --git a/tmpclaude-ca71-cwd b/tmpclaude-ca71-cwd
new file mode 100644
index 0000000..094e142
--- /dev/null
+++ b/tmpclaude-ca71-cwd
@@ -0,0 +1 @@
+/e/qia/client
diff --git a/tmpclaude-d261-cwd b/tmpclaude-d261-cwd
new file mode 100644
index 0000000..094e142
--- /dev/null
+++ b/tmpclaude-d261-cwd
@@ -0,0 +1 @@
+/e/qia/client
diff --git a/tmpclaude-d732-cwd b/tmpclaude-d732-cwd
new file mode 100644
index 0000000..094e142
--- /dev/null
+++ b/tmpclaude-d732-cwd
@@ -0,0 +1 @@
+/e/qia/client
diff --git a/tmpclaude-ea09-cwd b/tmpclaude-ea09-cwd
new file mode 100644
index 0000000..094e142
--- /dev/null
+++ b/tmpclaude-ea09-cwd
@@ -0,0 +1 @@
+/e/qia/client
diff --git a/tmpclaude-f30f-cwd b/tmpclaude-f30f-cwd
new file mode 100644
index 0000000..094e142
--- /dev/null
+++ b/tmpclaude-f30f-cwd
@@ -0,0 +1 @@
+/e/qia/client
diff --git a/tmpclaude-f858-cwd b/tmpclaude-f858-cwd
new file mode 100644
index 0000000..094e142
--- /dev/null
+++ b/tmpclaude-f858-cwd
@@ -0,0 +1 @@
+/e/qia/client
diff --git a/tmpclaude-fec8-cwd b/tmpclaude-fec8-cwd
new file mode 100644
index 0000000..094e142
--- /dev/null
+++ b/tmpclaude-fec8-cwd
@@ -0,0 +1 @@
+/e/qia/client