Replace dynamic i18n keys with static lookups; use data-wn-card for pacman graph

- Replace all t.ui() template-string keys with static key lookups so keys
  are statically analyzable (whatsNew, accountData.insights, talents, v2Weights)
- Add missing i18n keys: whatsNew.features/fixes, v2Weights.sands/goblet/circlet
- Use data-wn-card attribute instead of fragile CSS class selector for pacman
  graph card detection, preventing repeated regressions
- Center pacman on horizontal gap paths (0.5)
- 10x pacman speed in dev mode for easier debugging

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Author: Anyrainel

src/components/account-data/ActionRecommendationCard.tsx

@@ -135,7 +135,17 @@ function ActionRecommendationCardComponent({
         <div className="flex items-center gap-1 mt-0.5">
           <Icon className={cn("w-3.5 h-3.5 shrink-0", color)} />
           <span className={cn("text-xs font-medium", color)}>
-            {t.ui(`accountData.insights.${rec.actionType}`)}
+            {rec.actionType === "swap"
+              ? t.ui("accountData.insights.swap")
+              : rec.actionType === "upgrade"
+                ? t.ui("accountData.insights.upgrade")
+                : rec.actionType === "reroll"
+                  ? t.ui("accountData.insights.reroll")
+                  : rec.actionType === "farm"
+                    ? t.ui("accountData.insights.farm")
+                    : rec.actionType === "equip"
+                      ? t.ui("accountData.insights.equip")
+                      : rec.actionType}
           </span>
           {subtitle && (
             <span className="text-xs text-muted-foreground">· {subtitle}</span>

src/components/account-data/CharacterEditDialog.tsx

@@ -522,7 +522,13 @@ function OverviewPanel({
               className="flex items-center gap-1.5 sm:gap-2 shrink-0"
             >
               <div className="min-w-[28px] sm:min-w-[40px]">
-                <FieldLabel>{t.ui(`accountData.talents.${key}`)}</FieldLabel>
+                <FieldLabel>
+                  {key === "auto"
+                    ? t.ui("accountData.talents.auto")
+                    : key === "skill"
+                      ? t.ui("accountData.talents.skill")
+                      : t.ui("accountData.talents.burst")}
+                </FieldLabel>
               </div>
               <NumberInput
                 value={talents[key]}

src/components/artifact-builds/V2WeightsView.tsx

@@ -314,7 +314,11 @@ function V2CharacterCard({
                 >
                   <Icon className="w-3.5 h-3.5 text-foreground/50 shrink-0" />
                   <span className="text-foreground/60">
-                    {t.ui(`v2Weights.${slot}`)}
+                    {slot === "sands"
+                      ? t.ui("v2Weights.sands")
+                      : slot === "goblet"
+                        ? t.ui("v2Weights.goblet")
+                        : t.ui("v2Weights.circlet")}
                   </span>
                   {options.map((ms, i) => (
                     <span

src/components/shared/WhatsNew.tsx

@@ -103,7 +103,7 @@ interface GEdge {
 
 const S = 28;
 const OFF = S / 2 + 4;
-const SPEED = 60;
+const SPEED = import.meta.env.DEV ? 600 : 60;
 
 // ── Graph builder ──────────────────────────────────────────────────────
 
@@ -115,8 +115,9 @@ function buildGraph(
   const H = container.offsetHeight;
   const cRect = container.getBoundingClientRect();
 
-  // Collect card rects relative to container
-  const cardEls = container.querySelectorAll('[class*="rounded-2xl"]');
+  // Collect card rects relative to container.
+  // Cards must have data-wn-card to be detected — never use fragile CSS selectors.
+  const cardEls = container.querySelectorAll("[data-wn-card]");
   const cards: { x: number; y: number; r: number; b: number }[] = [];
   for (const el of cardEls) {
     if (el === skipEl || el.contains(skipEl) || skipEl.contains(el)) continue;
@@ -146,7 +147,7 @@ function buildGraph(
     const bot = Math.max(...rows[i].map((c) => c.b));
     const top = Math.min(...rows[i + 1].map((c) => c.y));
     hGaps.push({
-      y: bot + (top - bot) * 0.38,
+      y: bot + (top - bot) * 0.5,
       wide: top - bot >= MIN_INTERIOR_GAP,
     });
   }
@@ -550,7 +551,13 @@ export function WhatsNew({ children }: { children: React.ReactNode }) {
                               "text-foreground"
                           )}
                         >
-                          {t.ui(`whatsNew.${section.category}`)}
+                          {section.category === "features"
+                            ? t.ui("whatsNew.features")
+                            : section.category === "fixes"
+                              ? t.ui("whatsNew.fixes")
+                              : section.category === "roadmap"
+                                ? t.ui("whatsNew.roadmap")
+                                : section.category}
                         </h3>
                         <ul className="space-y-1">
                           {section.items.map((item, i) => (

src/data/i18n-ui.ts

@@ -399,12 +399,16 @@ export const i18nUiData = {
   scoreExplanation: {
     title: { en: "Artifact Score Calculation", zh: "圣遗物评分计算逻辑" },
     description: {
-      en: "How we derive the score for each artifact.",
-      zh: "圣遗物评分是如何计算的？",
+      en: "How we derive the artifact score (out of 300) for each character.",
+      zh: "角色的圣遗物评分（满分 300）是如何计算的？",
     },
     formula: {
-      en: "Final Score = Σ( Stat Value × Normalization Factor × (Weight / 100) × [Punishment Factor] )",
-      zh: "最终评分 = Σ( 属性数值 × 折算系数 × (权重 / 100) × [惩罚系数] )",
+      en: "Score = ( Main Stat Score + Substat Score ) × Normalizer",
+      zh: "评分 = ( 主属性分 + 副属性分 ) × 归一化系数",
+    },
+    subFormula: {
+      en: "Substat Score = Σ( Value × CD-Equiv Factor × Weight/100 × [Punishment] )",
+      zh: "副属性分 = Σ( 数值 × 暴伤折算系数 × 权重/100 × [惩罚系数] )",
     },
     normalization: {
       title: { en: "Normalization Factor", zh: "折算系数" },
@@ -427,6 +431,20 @@ export const i18nUiData = {
         zh: "仅适用于固定数值属性（小攻击、小生命、小防御），以反映其相对于百分比属性较低的有效性。对于 90-100 级角色，通常设置为 30% 到 40%。",
       },
     },
+    mainStat: {
+      title: { en: "Main Stat Scoring", zh: "主属性评分" },
+      description: {
+        en: "The sands, goblet, and circlet main stats are scored when they match the build's recommendation. A correct 5★ main stat is worth 62.1 CD-equivalent points (46.4 for 4★). Wrong main stats contribute 0.",
+        zh: "当沙漏、杯子和头冠的主属性与配装推荐一致时，会计入评分。正确的 5★ 主属性等效 62.1 暴伤点（4★ 为 46.4）。错误的主属性贡献为 0。",
+      },
+    },
+    scale300: {
+      title: { en: "300-Point Scale", zh: "300 分制" },
+      description: {
+        en: "The total score (main stats + substats) is normalized to a 300-point scale. 300 represents a theoretically perfect artifact set — correct main stats on all 3 slots, plus ideal substat rolls distributed across your top weighted stats.",
+        zh: "总分（主属性 + 副属性）被归一化为 300 分制。300 分代表理论上的完美圣遗物套装 — 3 个位置的主属性全部正确，且副属性词条完美分配到最高权重的属性上。",
+      },
+    },
     factors: {
       cr: { en: "Crit Rate: ×2", zh: "暴击率: ×2" },
       cd: { en: "Crit DMG: ×1", zh: "暴击伤害: ×1" },
@@ -1291,9 +1309,14 @@ export const i18nUiData = {
     },
     idealScore: { en: "Ideal", zh: "理想分" },
     normalizer: { en: "Norm.", zh: "归一化" },
+    sands: { en: "Sands", zh: "时之沙" },
+    goblet: { en: "Goblet", zh: "空之杯" },
+    circlet: { en: "Circlet", zh: "理之冠" },
   },
   whatsNew: {
     title: { en: "What's New", zh: "更新日志" },
     roadmap: { en: "Roadmap", zh: "计划" },
+    features: { en: "Features", zh: "新功能" },
+    fixes: { en: "Fixes", zh: "修复" },
   },
 };

src/pages/Home.tsx

@@ -388,14 +388,20 @@ const FeatureCard = ({
         rel="noreferrer"
         className={sharedClassName}
         style={animationStyle}
+        data-wn-card
       >
         {content}
       </a>
     );
   }
 
   return (
-    <Link to={link} className={sharedClassName} style={animationStyle}>
+    <Link
+      to={link}
+      className={sharedClassName}
+      style={animationStyle}
+      data-wn-card
+    >
       {content}
     </Link>
   );