feat(public-frontend): 公开前端 UI 视觉升级

引入统一品牌主题(色阶/字体/阴影/动效),重做首页 hero、卡片、导航与页脚,统一各页面的卡片/输入框/按钮样式。

- tailwind: 新增 brand 色阶、Inter 字体、card/glow 阴影与 fade-up 动效
- index.html: 引入 Inter 字体与 theme-color/description meta
- index.css: 双径向渐变背景 + @layer 组件类(.card/.input/.btn-primary 等)
- App/Home/ProductView/Contribute/ApiDocs/Account: 套用新设计系统

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

public-frontend/src/components/Contribute.tsx

@@ -89,38 +89,36 @@ export default function Contribute({ onDone }: { onDone: () => void }) {
 
   if (done) {
     return (
-      <div className="max-w-xl mx-auto text-center py-16">
-        <CheckCircle2 className="w-14 h-14 text-emerald-500 mx-auto" />
+      <div className="max-w-xl mx-auto text-center py-16 animate-fade-up">
+        <span className="mx-auto grid h-16 w-16 place-items-center rounded-2xl bg-brand-50">
+          <CheckCircle2 className="w-9 h-9 text-brand-600" />
+        </span>
         <h1 className="mt-4 text-xl font-semibold text-gray-800">已提交，等待审核</h1>
         <p className="mt-2 text-gray-500">
           感谢你的贡献！资料将由管理员人工审核，通过后会收录进公共商品库。
         </p>
-        <button
-          onClick={onDone}
-          className="mt-6 px-5 py-2 rounded-lg bg-emerald-600 text-white hover:bg-emerald-700"
-        >
+        <button onClick={onDone} className="btn-primary mt-6">
           返回首页
         </button>
       </div>
     );
   }
 
-  const input =
-    "w-full border rounded-md px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-emerald-400";
-  const label = "block text-xs text-gray-500 mb-1";
+  const input = "input";
+  const label = "block text-xs font-medium text-gray-500 mb-1";
 
   return (
-    <form onSubmit={submit} className="max-w-3xl mx-auto">
-      <h1 className="text-xl font-semibold text-gray-800">贡献商品档案</h1>
+    <form onSubmit={submit} className="max-w-3xl mx-auto animate-fade-up">
+      <h1 className="text-2xl font-semibold tracking-tight text-gray-900">贡献商品档案</h1>
       <p className="mt-1 text-sm text-gray-500">
         任何人都可以提交新商品资料。提交后会进入审核队列，<b>通过人工审核后才会收纳</b>。带 * 为必填。
       </p>
 
       {error && (
-        <div className="mt-4 bg-red-50 text-red-700 text-sm rounded-md px-4 py-2">{error}</div>
+        <div className="mt-4 rounded-xl bg-red-50 px-4 py-2.5 text-sm text-red-700">{error}</div>
       )}
 
-      <div className="bg-white border rounded-lg p-5 mt-4">
+      <div className="card p-5 mt-4">
         <h2 className="font-medium text-gray-700 mb-3">基础信息</h2>
         <div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
           <div className="sm:col-span-2">
@@ -167,7 +165,7 @@ export default function Contribute({ onDone }: { onDone: () => void }) {
         </div>
       </div>
 
-      <div className="bg-white border rounded-lg p-5 mt-4">
+      <div className="card p-5 mt-4">
         <h2 className="font-medium text-gray-700 mb-3">配料与营养</h2>
         <label className={label}>配料表</label>
         <textarea
@@ -201,7 +199,7 @@ export default function Contribute({ onDone }: { onDone: () => void }) {
         </div>
       </div>
 
-      <div className="bg-white border rounded-lg p-5 mt-4">
+      <div className="card p-5 mt-4">
         <h2 className="font-medium text-gray-700 mb-3">图片（仅填 URL）</h2>
         {images.length > 0 && (
           <ul className="mb-3 space-y-1">
@@ -234,14 +232,14 @@ export default function Contribute({ onDone }: { onDone: () => void }) {
                 setImageURL("");
               }
             }}
-            className="shrink-0 px-3 rounded-md border text-sm flex items-center gap-1 hover:bg-gray-50"
+            className="shrink-0 px-3 rounded-xl border border-gray-200 text-sm flex items-center gap-1 hover:bg-gray-50"
           >
             <PlusCircle className="w-4 h-4" /> 添加
           </button>
         </div>
       </div>
 
-      <div className="bg-white border rounded-lg p-5 mt-4">
+      <div className="card p-5 mt-4">
         <h2 className="font-medium text-gray-700 mb-3">联系方式（选填）</h2>
         <div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
           <div>
@@ -260,11 +258,7 @@ export default function Contribute({ onDone }: { onDone: () => void }) {
       </div>
 
       <div className="mt-5 flex items-center gap-3">
-        <button
-          type="submit"
-          disabled={submitting}
-          className="px-6 py-2.5 rounded-lg bg-emerald-600 text-white font-medium hover:bg-emerald-700 disabled:opacity-60"
-        >
+        <button type="submit" disabled={submitting} className="btn-primary px-6">
           {submitting ? "提交中…" : "提交审核"}
         </button>
         <button type="button" onClick={onDone} className="text-sm text-gray-500 hover:underline">