Fix SkillWindow button label visibility and color contrast

- Add the fill graphics to the container before the label so it paints behind the text instead of covering it at 0.8 alpha
- Use C.dim instead of C.faint for inert labels and borders, which were too dark on the panel fill
- Swap tag/text colors so inert tags stay readable while active tags dim appropriately
- Refresh dev screenshots to match the corrected rendering

js/ui/SkillWindow.js

@@ -405,28 +405,33 @@ export class SkillWindow extends Phaser.GameObjects.Container {
    *  door answers with the refusal copy — the same honest wall as the bar). */
   button(x, y, w, h, label, accent, onPress, { inert = false, tag = '', kind = null, rowId = null, align = 0.5 } = {}) {
     const g = this.scene.add.graphics().setDepth(DEPTH);
+    // The fill joins the container FIRST, before the label below is added: container
+    // children paint in add-order, so a fill added after the text would cover it with
+    // its 0.8-alpha panel and leave the label at ~20% brightness (dark-on-dark).
+    this.add(g);
     const paint = (hot) => {
       g.clear();
       g.fillStyle(C.panel, hot && !inert ? 0.95 : 0.8);
-      g.lineStyle(1, inert ? C.faint : accent, inert ? 0.7 : hot ? 1 : 0.85);
+      g.lineStyle(1, inert ? C.dim : accent, inert ? 0.6 : hot ? 1 : 0.85);
       g.strokeRoundedRect(x, y, w, h, 3);
       g.fillRect(x, y, w, h);
       if (!inert) {
         // The lit base-line: a button that can act reads lit even without the cursor.
-        g.fillStyle(inert ? C.faint : accent, hot ? 1 : 0.75);
+        g.fillStyle(accent, hot ? 1 : 0.75);
         g.fillRect(x + 1, y + h - 2, w - 2, 2);
       }
     };
     paint(false);
+    // Inert labels read C.dim (never C.faint): faint is too dark on the panel fill.
     this.txt(align === 0.5 ? x + w / 2 : x + 10, y + h / 2, label, {
       size: 11,
-      color: inert ? C.faint : accent,
+      color: inert ? C.dim : accent,
       origin: align === 0.5 ? 0.5 : 0,
       ls: 2,
       header: true,
     });
     if (tag) {
-      this.txt(x + w - 6, y + h / 2, tag, { size: 9, color: inert ? C.faint : C.dim, origin: 1, ls: 1 });
+      this.txt(x + w - 6, y + h / 2, tag, { size: 9, color: inert ? C.dim : C.faint, origin: 1, ls: 1 });
     }
     const hit = this.scene.add
       .rectangle(x, y, w, h, 0x000000, 0.001)
@@ -442,7 +447,6 @@ export class SkillWindow extends Phaser.GameObjects.Container {
     // The action map (kind + skill id + the rect it lives in) — debugging aid and
     // what a browser test clicks on.
     (this._hits ??= []).push({ kind, id: rowId ?? null, x, y, w, h });
-    this.add(g);
     this.add(hit);
     this._body.push(g, hit);
     return { setInert: (v) => { inert = v; paint(false); } };