Narrow desktop layout margins and fix taiji icon in light mode.

Cap content width at 1152px with side margins on ultrawide screens, add stroke to taiji logo for light backgrounds, and shrink backdrop watermark.

Co-authored-by: Cursor <cursoragent@cursor.com>

components/layout/mode-workspace.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import { Sparkles } from "lucide-react";
-import { APP_CONTAINER } from "@/lib/layout";
+import { MODE_CONTAINER } from "@/lib/layout";
 
 export function ModeWorkspace({
   children,
@@ -13,7 +13,7 @@ export function ModeWorkspace({
   aiTitle?: string;
 }) {
   return (
-    <div className={`${APP_CONTAINER} py-6 lg:py-8`}>
+    <div className={`${MODE_CONTAINER} py-6 lg:py-8`}>
       <div className="grid gap-6 lg:grid-cols-2 lg:items-stretch lg:gap-8 xl:gap-10">
         <div className="grid h-full min-h-0 auto-rows-fr gap-5 lg:min-h-[calc(100vh-9rem)]">
           {children}

components/layout/taiji-backdrop.tsx

@@ -1,15 +1,15 @@
 import { TaijiWatermark } from "@/components/svg/taiji";
 
-/** 全页太极背景水印 */
+/** 全页太极背景水印（居中，不撑满超宽屏） */
 export default function TaijiBackdrop() {
   return (
     <div
       aria-hidden
-      className="pointer-events-none fixed inset-0 -z-10 overflow-hidden bg-background/80"
+      className="pointer-events-none fixed inset-0 -z-10 overflow-hidden"
     >
-      <TaijiWatermark className="absolute left-1/2 top-1/2 h-[min(95vmin,1200px)] w-[min(95vmin,1200px)] -translate-x-1/2 -translate-y-1/2 opacity-90" />
-      <TaijiWatermark className="absolute -right-[8%] top-[6%] h-[min(42vmin,520px)] w-[min(42vmin,520px)] opacity-45" />
-      <TaijiWatermark className="absolute -left-[10%] bottom-[4%] h-[min(38vmin,460px)] w-[min(38vmin,460px)] opacity-40" />
+      <TaijiWatermark className="absolute left-1/2 top-1/2 h-[min(72vmin,720px)] w-[min(72vmin,720px)] -translate-x-1/2 -translate-y-1/2" />
+      <TaijiWatermark className="absolute right-[8%] top-[10%] hidden h-[min(28vmin,320px)] w-[min(28vmin,320px)] opacity-60 lg:block" />
+      <TaijiWatermark className="absolute bottom-[8%] left-[8%] hidden h-[min(24vmin,280px)] w-[min(24vmin,280px)] opacity-50 lg:block" />
     </div>
   );
 }

components/svg/taiji.tsx

@@ -1,10 +1,7 @@
 import React from "react";
 import { cn } from "@/lib/utils";
 
-const YANG = "fill-stone-100 dark:fill-stone-200";
-const YIN = "fill-stone-800 dark:fill-stone-900";
-
-/** 太极阴阳鱼图标（页眉 Logo） */
+/** 太极阴阳鱼图标（页眉 Logo）— 亮色模式描边保证阴阳分界可见 */
 export const TaijiIcon = React.memo(function TaijiIcon({
   className,
 }: {
@@ -14,16 +11,21 @@ export const TaijiIcon = React.memo(function TaijiIcon({
     <svg
       viewBox="0 0 64 64"
       xmlns="http://www.w3.org/2000/svg"
-      className={cn("h-7 w-7 shrink-0 drop-shadow-sm", className)}
+      className={cn("h-7 w-7 shrink-0", className)}
       aria-hidden
     >
-      <circle cx="32" cy="32" r="30" className={YANG} />
+      <circle
+        cx="32"
+        cy="32"
+        r="30"
+        className="fill-white stroke-stone-600 stroke-[1.5] dark:fill-stone-200 dark:stroke-stone-400"
+      />
       <path
         d="M32 2a30 30 0 0 1 0 60 15 15 0 0 1 0-30 15 15 0 0 0 0-30z"
-        className={YIN}
+        className="fill-stone-800 dark:fill-stone-900"
       />
-      <circle cx="32" cy="17" r="5" className={YANG} />
-      <circle cx="32" cy="47" r="5" className={YIN} />
+      <circle cx="32" cy="17" r="5" className="fill-white dark:fill-stone-200" />
+      <circle cx="32" cy="47" r="5" className="fill-stone-800 dark:fill-stone-900" />
     </svg>
   );
 });
@@ -41,13 +43,24 @@ export function TaijiWatermark({
       className={className}
       aria-hidden
     >
-      <circle cx="100" cy="100" r="98" className={`${YANG} opacity-[0.35]`} />
+      <circle
+        cx="100"
+        cy="100"
+        r="98"
+        className="fill-none stroke-stone-400/30 stroke-[0.75] dark:stroke-stone-500/25"
+      />
+      <circle
+        cx="100"
+        cy="100"
+        r="98"
+        className="fill-white/40 dark:fill-stone-200/10"
+      />
       <path
         d="M100 2a98 98 0 0 1 0 196 49 49 0 0 1 0-98 49 49 0 0 0 0-98z"
-        className={`${YIN} opacity-[0.08] dark:opacity-[0.12]`}
+        className="fill-stone-600/10 dark:fill-stone-300/12"
       />
-      <circle cx="100" cy="51" r="10" className={`${YANG} opacity-50`} />
-      <circle cx="100" cy="149" r="10" className={`${YIN} opacity-20 dark:opacity-30`} />
+      <circle cx="100" cy="51" r="10" className="fill-white/60 dark:fill-stone-200/20" />
+      <circle cx="100" cy="149" r="10" className="fill-stone-600/15 dark:fill-stone-300/20" />
     </svg>
   );
 }