Merge branch 'fix/issue-134-140' into main (fixes #134, fixes #135, fixes #136, fixes #137, fixes #138, fixes #139, fixes #140)

.gitignore

@@ -23,11 +23,22 @@ samples/*
 reference/
 Diablo II*/
 
-# 临时调试产物
+# 临时调试产物与测试截图
 .tmp/
 scratch/
 __pycache__/
 .DS_Store
+.agents/
+tests/*.png
+*audit*.png
+public/*audit*.png
+public/ui/*audit*.png
+BRIEFING.md
+ORIGINAL_REQUEST.md
+PROJECT.md
+TEST_INFRA.md
+TEST_READY.md
 
 # 覆盖率报告由 `npm run test:coverage` 生成，可随时重建
 coverage/
+

acts.html

@@ -18,16 +18,17 @@
       h1 { font-size: 13px; margin: 0; color: #c8a15a; letter-spacing: .06em; }
       a { color: #c8a15a; }
       #hud { color: #9c8d78; }
-      #controls { left: 12px; bottom: 12px; padding: 8px 12px; display: flex; gap: 12px;
-        align-items: center; flex-wrap: wrap; max-width: calc(100vw - 24px); }
+      /* 状态与地图选择控件紧凑停靠在顶部，把屏幕底部完整让给暗黑2原版 800CtrlPnl7 控制栏与血蓝球 */
+      #controls { top: 4px; right: 12px; padding: 3px 8px; display: flex; gap: 8px;
+        align-items: center; flex-wrap: wrap; max-width: 72vw; font-size: 12px; z-index: 4; }
       #controls label { color: #9c8d78; }
       select { background: #1c1813; color: #e8dcc8; border: 1px solid #33291f;
-        border-radius: 4px; padding: 3px 6px; font: inherit; max-width: 28vw; }
+        border-radius: 4px; padding: 2px 5px; font: inherit; max-width: 22vw; }
       optgroup { background: #1c1813; color: #c8a15a; }
       option { background: #1c1813; }
-      /* 状态面板放在控件行上方：贴在右下角会压住"细分场景"那个下拉框 */
-      #status { right: 12px; bottom: 58px; padding: 6px 10px; max-width: 60vw; color: #9c8d78; }
-      #dialog { right: 12px; top: 36px; padding: 8px 12px; min-width: 240px; color: #e8dcc8; white-space: pre-wrap; font-size: 14px; background: rgba(30, 26, 21, .9); border-color: #c8a15a; }
+      #status { left: 12px; top: 34px; padding: 3px 8px; max-width: 55vw; color: #9c8d78; font-size: 11px; opacity: 0.85; pointer-events: none; z-index: 3; }
+      #dialog { right: 12px; top: 42px; padding: 8px 12px; min-width: 240px; color: #e8dcc8; white-space: pre-wrap; font-size: 14px; background: rgba(30, 26, 21, .9); border-color: #c8a15a; z-index: 5; }
+      #d2-hud-canvas { position: fixed; inset: 0; width: 100%; height: 100%; display: block; z-index: 6; pointer-events: none; image-rendering: pixelated; }
       .hint { color: #6d5a34; }
     </style>
   </head>
@@ -46,12 +47,13 @@
       </select></label>
       <label>场景 <select id="scene" disabled><option>正在读取场景列表…</option></select></label>
       <label>细分场景 <select id="variant" disabled></select></label>
-      <span class="hint" style="margin:0">WASD / 方向键移动 · 滚轮或 +/− 缩放 · 三个下拉框都会换图并更新地址栏</span>
+      <span class="hint" style="margin:0">I背包 · A角色 · T技能 · Q任务 · V小站 · ~腰带 · R奔跑 · W换手</span>
     </div>
     <div id="status" class="overlay">正在加载地图…</div>
     <div id="dialog" class="overlay" hidden></div>
-    <div id="labels" style="position: fixed; inset: 0; pointer-events: none;"></div>
+    <div id="labels" style="position: fixed; inset: 0; pointer-events: none; z-index: 2;"></div>
     <canvas id="view" width="960" height="560"></canvas>
+    <canvas id="d2-hud-canvas" width="800" height="600"></canvas>
     <script type="module" src="/src/scene/act-scene.ts"></script>
   </body>
 </html>

boss.html

@@ -604,11 +604,12 @@
       }
 
       /* Card Quality Border Themes */
-      .d2-item-card.quality-unique { border-color: rgba(200, 161, 90, 0.5); background: linear-gradient(180deg, #161009 0%, #0a0704 100%); }
-      .d2-item-card.quality-set { border-color: rgba(0, 230, 0, 0.4); background: linear-gradient(180deg, #091609 0%, #040a04 100%); }
-      .d2-item-card.quality-rare { border-color: rgba(255, 255, 96, 0.4); background: linear-gradient(180deg, #161609 0%, #0a0a04 100%); }
-      .d2-item-card.quality-magic { border-color: rgba(72, 128, 255, 0.4); background: linear-gradient(180deg, #09101c 0%, #04070c 100%); }
-      .d2-item-card.quality-rune { border-color: rgba(255, 140, 0, 0.5); background: linear-gradient(180deg, #180f07 0%, #0a0603 100%); }
+      .d2-item-card.quality-unique, .d2-item-card.quality-暗金 { border-color: rgba(200, 161, 90, 0.5); background: linear-gradient(180deg, #161009 0%, #0a0704 100%); }
+      .d2-item-card.quality-set, .d2-item-card.quality-套装 { border-color: rgba(0, 230, 0, 0.4); background: linear-gradient(180deg, #091609 0%, #040a04 100%); }
+      .d2-item-card.quality-rare, .d2-item-card.quality-亮金 { border-color: rgba(255, 255, 96, 0.4); background: linear-gradient(180deg, #161609 0%, #0a0a04 100%); }
+      .d2-item-card.quality-magic, .d2-item-card.quality-魔法 { border-color: rgba(72, 128, 255, 0.4); background: linear-gradient(180deg, #09101c 0%, #04070c 100%); }
+      .d2-item-card.quality-rune, .d2-item-card.quality-符文 { border-color: rgba(255, 140, 0, 0.5); background: linear-gradient(180deg, #180f07 0%, #0a0603 100%); }
+      .d2-item-card.quality-gem, .d2-item-card.quality-宝石 { border-color: rgba(220, 220, 220, 0.4); background: linear-gradient(180deg, #141416 0%, #08080a 100%); }
 
       /* Item Card Header */
       .item-card-header {
@@ -705,6 +706,21 @@
         color: #ff8c00;
         font-weight: 700;
       }
+      .tooltip-stat-line.line-red {
+        color: #d03a3a;
+        font-weight: 700;
+        margin-top: 6px;
+      }
+      .tooltip-stat-line.line-instruction {
+        color: #e0d5c1;
+        margin-bottom: 6px;
+      }
+      .tooltip-stat-line.line-gray {
+        color: #999999;
+      }
+      .tooltip-stat-line.line-yellow {
+        color: #ffff00;
+      }
     </style>
   </head>
   <body>

package.json

@@ -27,6 +27,7 @@
     "verify:world-walk": "tsx scripts/verify-world-walk.ts",
     "build:game": "vite build --base=/diablo2/ --outDir dist-game",
     "pack:data": "tsx scripts/pack-act-assets.ts",
+    "pack:ui": "tsx scripts/pack-ui.ts",
     "verify:packs": "tsx scripts/verify-packs.ts",
     "verify:deploy": "tsx scripts/verify-deploy.ts",
     "verify:listfile": "tsx scripts/verify-listfile.ts",