diff --git a/tools/deck/gen-slaydeck.mjs b/tools/deck/gen-slaydeck.mjs
index 58cdd18..8ecc54b 100644
--- a/tools/deck/gen-slaydeck.mjs
+++ b/tools/deck/gen-slaydeck.mjs
@@ -423,12 +423,13 @@ function upsertUi() {
     card.jsonString.visible = true;
 
     const children = [
-      ['Cost', { size: { x: 50, y: 50 }, pos: { x: -60, y: 95 }, value: cards[i - 1].cost, fontSize: 34, bold: true }],
-      ['Name', { size: { x: 160, y: 50 }, pos: { x: 0, y: 50 }, value: cards[i - 1].name, fontSize: 26, bold: true }],
-      ['Desc', { size: { x: 160, y: 82 }, pos: { x: 0, y: -80 }, value: cards[i - 1].desc, fontSize: 20, bold: false }],
+      ['Cost', { size: { x: 44, y: 44 }, pos: { x: -68, y: 103 }, value: cards[i - 1].cost, fontSize: 26, bold: true }],
+      ['Name', { size: { x: 168, y: 30 }, pos: { x: 0, y: -8 }, value: cards[i - 1].name, fontSize: 20, bold: true }],
+      ['Desc', { size: { x: 164, y: 70 }, pos: { x: 0, y: -62 }, value: cards[i - 1].desc, fontSize: 18, bold: false }],
     ];
     for (const [suffix, cfg] of children) {
       const path = `/ui/DefaultGroup/CardHand/Card${i}/${suffix}`;
+      const dOrder = suffix === 'Cost' ? 7 : suffix === 'Name' ? 6 : 8;
       let child = byPath.get(path);
       if (!child) {
         child = entity({
@@ -437,7 +438,7 @@ function upsertUi() {
           modelId: 'uitext',
           entryId: 'UIText',
           componentNames: 'MOD.Core.UITransformComponent,MOD.Core.SpriteGUIRendererComponent,MOD.Core.TextComponent',
-          displayOrder: suffix === 'Cost' ? 0 : suffix === 'Name' ? 1 : 2,
+          displayOrder: dOrder,
           components: [
             transform({ parentW: CARD_W, parentH: CARD_H, anchor: { x: 0.5, y: 0.5 }, pivot: { x: 0.5, y: 0.5 }, size: cfg.size, pos: cfg.pos }),
             sprite({ color: TRANSPARENT }),
@@ -450,11 +451,45 @@ function upsertUi() {
         child.id = guid('dck', i * 10 + children.findIndex(([s]) => s === suffix));
         child.jsonString.enable = true;
         child.jsonString.visible = true;
+        child.jsonString.displayOrder = dOrder;
+        const ctr = child.jsonString['@components'].find((c) => c['@type'] === 'MOD.Core.UITransformComponent');
+        if (ctr) {
+          const pivot = { x: 0.5, y: 0.5 };
+          ctr.RectSize = cfg.size;
+          ctr.anchoredPosition = cfg.pos;
+          ctr.OffsetMin = { x: cfg.pos.x - pivot.x * cfg.size.x, y: cfg.pos.y - pivot.y * cfg.size.y };
+          ctr.OffsetMax = { x: cfg.pos.x + (1 - pivot.x) * cfg.size.x, y: cfg.pos.y + (1 - pivot.y) * cfg.size.y };
+        }
         child.jsonString['@components'][2].Text = cfg.value;
         child.jsonString['@components'][2].FontSize = cfg.fontSize;
         child.jsonString['@components'][2].MaxSize = cfg.fontSize;
       }
     }
+
+    const frameKids = [
+      ['NamePlate', 3, { size: { x: 168, y: 34 }, pos: { x: 0, y: -8 } }, { r: 0.07, g: 0.08, b: 0.1, a: 0.92 }, 1],
+      ['CostPlate', 4, { size: { x: 44, y: 44 }, pos: { x: -68, y: 103 } }, { r: 0.07, g: 0.08, b: 0.1, a: 0.95 }, 1],
+      ['Art', 5, { size: { x: 96, y: 96 }, pos: { x: 0, y: 52 } }, { r: 1, g: 1, b: 1, a: 1 }, 0],
+    ];
+    for (const [suffix, dOrder, cfg, color, spriteType] of frameKids) {
+      const fPath = `/ui/DefaultGroup/CardHand/Card${i}/${suffix}`;
+      if (!byPath.get(fPath)) {
+        const fe = entity({
+          id: guid('dck', 200 + i * 10 + dOrder),
+          path: fPath,
+          modelId: 'uisprite',
+          entryId: 'UISprite',
+          componentNames: 'MOD.Core.UITransformComponent,MOD.Core.SpriteGUIRendererComponent',
+          displayOrder: dOrder,
+          components: [
+            transform({ parentW: CARD_W, parentH: CARD_H, anchor: { x: 0.5, y: 0.5 }, pivot: { x: 0.5, y: 0.5 }, size: cfg.size, pos: cfg.pos }),
+            sprite({ color, type: spriteType, raycast: false }),
+          ],
+        });
+        ui.ContentProto.Entities.push(fe);
+        byPath.set(fPath, fe);
+      }
+    }
   }
 
   const hud = [];