refactor(ui): 去 AI 味,重做为报刊赛程版视觉

- 色板收敛为纸白/暖墨/印报红三色,移除默认 Tailwind 蓝
- 队名彩色哈希块、shimmer/ping/fade-up 动效、圆角卡片阵全部移除
- 报头改为双线+居中宋体刊名+报眉日期行
- 赛程列表表格化:细线分行,联赛改为文字版面切换
- 预测版:方正墨线框,大号宋体比分,胜平负改文字行,专家意见改汉字编号折叠行,终裁改红竖线引文
- 修复:桌面状态列 sm:contents 错位;移动端对阵未同行

frontend/src/App.tsx

@@ -1,64 +1,53 @@
 import { ErrorBoundary } from './components/ErrorBoundary'
 import Matches from './pages/Matches'
 
-function Logo() {
-  // 纯 SVG 队徽/足球图形,替代 emoji ⚽(跨平台渲染不一致)
-  return (
-    <span className="flex h-9 w-9 items-center justify-center rounded-xl bg-brand-600 shadow-sm">
-      <svg viewBox="0 0 24 24" className="h-5 w-5" fill="none" aria-hidden="true">
-        <circle cx="12" cy="12" r="9" stroke="white" strokeWidth="1.6" />
-        <path
-          d="M12 6.2l3.1 2.2-1.2 3.6h-3.8L8.9 8.4 12 6.2z"
-          fill="white"
-          fillOpacity="0.95"
-        />
-        <path
-          d="M12 3v3.2M4.2 9.6l4.7-1.2M7.1 19.4l2.9-4.6M16.9 19.4l-2.9-4.6M19.8 9.6l-4.7-1.2"
-          stroke="white"
-          strokeWidth="1.4"
-          strokeLinecap="round"
-          strokeOpacity="0.85"
-        />
-      </svg>
-    </span>
-  )
+/** 报眉日期行:2026年9月15日 星期二 */
+function dateLine(): string {
+  return new Date().toLocaleDateString('zh-CN', {
+    year: 'numeric',
+    month: 'long',
+    day: 'numeric',
+    weekday: 'long',
+  })
 }
 
 export default function App() {
   return (
     <ErrorBoundary>
-      <div className="min-h-screen bg-ink-100">
-        <header className="sticky top-0 z-20 border-b border-ink-200 bg-white/85 backdrop-blur-sm">
-          <div className="mx-auto flex max-w-6xl items-center justify-between gap-4 px-6 py-3">
-            <div className="flex items-center gap-3">
-              <Logo />
-              <div className="leading-tight">
-                <h1 className="text-[15px] font-semibold tracking-tight text-ink-900">
-                  先知 <span className="font-normal text-ink-400">Profeto</span>
-                </h1>
-                <p className="text-2xs text-ink-500">
-                  LLM 多专家协作 · 足球比分预测
-                </p>
-              </div>
+      <div className="min-h-screen bg-paper-50">
+        {/* ── 报头:粗线 + 居中刊名 + 报眉 ── */}
+        <header className="masthead-rule">
+          <div className="mx-auto max-w-5xl px-5 sm:px-8">
+            <div className="border-b border-ink-900 py-5 text-center sm:py-6">
+              <h1 className="font-serif text-4xl font-bold tracking-widest text-ink-900">
+                先知
+                <span className="ml-3 align-baseline font-serif text-base font-normal italic tracking-normal text-ink-500">
+                  Profeto
+                </span>
+              </h1>
+              <p className="mt-2 text-2xs tracking-[0.4em] text-ink-500">
+                足球比分预测 · 五路专家 · 终裁汇总
+              </p>
             </div>
-            <span className="hidden items-center gap-1.5 sm:inline-flex">
-              <span className="relative flex h-2 w-2">
-                <span className="absolute inline-flex h-full w-full animate-ping rounded-full bg-emerald-400 opacity-60" />
-                <span className="relative inline-flex h-2 w-2 rounded-full bg-emerald-500" />
+            <div className="flex items-center justify-between border-b border-ink-200 py-2 text-2xs text-ink-500">
+              <span>{dateLine()}</span>
+              <span className="flex items-center gap-1.5">
+                <span className="inline-block h-1.5 w-1.5 bg-emerald-600" aria-hidden="true" />
+                服务运行中
               </span>
-              <span className="text-2xs font-medium text-ink-500">服务运行中</span>
-            </span>
+            </div>
           </div>
         </header>
 
-        <main className="mx-auto max-w-6xl px-6 py-6">
+        <main className="mx-auto max-w-5xl px-5 py-6 sm:px-8 sm:py-8">
           <Matches />
         </main>
 
-        <footer className="mx-auto max-w-6xl px-6 pb-8 pt-2">
-          <p className="text-center text-2xs text-ink-400">
-            预测结果由大语言模型生成,仅供研究参考,不构成任何投注建议
-          </p>
+        {/* ── 版底 ── */}
+        <footer className="mx-auto max-w-5xl px-5 pb-10 sm:px-8">
+          <div className="border-t border-ink-200 pt-3 text-center text-2xs leading-relaxed text-ink-400">
+            预测结果由大语言模型生成 · 仅供研究参考 · 不构成任何投注建议
+          </div>
         </footer>
       </div>
     </ErrorBoundary>