fix(website): improve TUI preview readability

Author: claude

website/theme/components/HomeLayout.tsx

@@ -320,12 +320,55 @@ const tuiMascot = [
   '  |  |___| \\#/',
   '     /   \\',
 ].join('\n');
-const tuiWordmark = String.raw` █████╗ ██████╗ ███████╗     ██████╗ ██████╗ ██████╗ ███████╗
-██╔══██╗╚════██╗██╔════╝    ██╔════╝██╔═══██╗██╔══██╗██╔════╝
-███████║ █████╔╝███████╗    ██║     ██║   ██║██║  ██║█████╗
-██╔══██║ ╚═══██╗╚════██║    ██║     ██║   ██║██║  ██║██╔══╝
-██║  ██║██████╔╝███████║    ╚██████╗╚██████╔╝██████╔╝███████╗
-╚═╝  ╚═╝╚═════╝ ╚══════╝     ╚═════╝ ╚═════╝ ╚═════╝ ╚══════╝`;
+const tuiWordmarkGlyphs = {
+  A: ['01110', '10001', '10001', '11111', '10001', '10001', '10001'],
+  '3': ['11110', '00001', '00001', '01110', '00001', '00001', '11110'],
+  S: ['01111', '10000', '10000', '01110', '00001', '00001', '11110'],
+  C: ['01111', '10000', '10000', '10000', '10000', '10000', '01111'],
+  O: ['01110', '10001', '10001', '10001', '10001', '10001', '01110'],
+  D: ['11110', '10001', '10001', '10001', '10001', '10001', '11110'],
+  E: ['11111', '10000', '10000', '11110', '10000', '10000', '11111'],
+} as const;
+
+const tuiWordmarkVector = (() => {
+  const commands: string[] = [];
+  let offset = 0;
+
+  for (const character of 'A3S CODE') {
+    if (character === ' ') {
+      offset += 3;
+      continue;
+    }
+
+    const glyph =
+      tuiWordmarkGlyphs[character as keyof typeof tuiWordmarkGlyphs];
+    glyph.forEach((row, y) => {
+      [...row].forEach((cell, x) => {
+        if (cell === '1') commands.push(`M${offset + x} ${y}h1v1h-1z`);
+      });
+    });
+    offset += 6;
+  }
+
+  return {
+    path: commands.join(''),
+    width: Math.max(offset - 1, 1),
+  };
+})();
+
+function TuiWordmark() {
+  return (
+    <svg
+      aria-hidden="true"
+      className="a3s-tui-wordmark"
+      focusable="false"
+      preserveAspectRatio="xMinYMid meet"
+      viewBox={`0 0 ${tuiWordmarkVector.width} 7`}
+    >
+      <path d={tuiWordmarkVector.path} />
+    </svg>
+  );
+}
 
 const copy = {
   zh: {
@@ -706,9 +749,7 @@ function RuntimeExecutionFlow({ labels }: { labels: (typeof copy)[Locale] }) {
           <pre aria-hidden="true" className="a3s-tui-mascot">
             {tuiMascot}
           </pre>
-          <pre aria-hidden="true" className="a3s-tui-wordmark">
-            {tuiWordmark}
-          </pre>
+          <TuiWordmark />
         </div>
         <p className="a3s-tui-meta">
           <span>a3s-code v0.10.9</span>