@cardenelabs/cdl 0.75.0 → 0.76.0

package/CHANGELOG.md

@@ -5,6 +5,52 @@ CDL (Chainome Diagram Language) の主要変更履歴。
 
 ## [Unreleased]
 
+## [0.76.0] - 2026-09-26
+
+### Changed
+
+- **絵の中の字が読める大きさに届くようになった** (#888 / #892)
+
+  箱の中に描く絵 (`shape-*.tsx` の図案) の字を、絵が 1 つも縮まない箱で実効 world 11 以上に
+  した。 変更前は 13 種別 54 件が 11 を割っており、最小は相場の板の 5.5 だった。
+
+  **指定だけを見ても実際の大きさは判らない**。 絵は箱に合わせて丸ごと縮むので、
+  実効 world (指定 x 包みの倍率) が実際に描かれる大きさになる。 画面 px は図の大きさと器で
+  変わるため種別単体では測れず、同じ指定 5.5 が単体の見本で 8.3px、3 段の場面で 2.9px、
+  4 列の流れで 3.2px になっていた。
+
+  読む内容と通し番号の 35 件を指定 11 以上へ上げ、字が入らない入れ物を広げた。
+
+  | 種別 | 広げた入れ物 | 変更前 | 変更後 |
+  |---|---|---|---|
+  | `shape-brokerage` | 電光掲示板 (内側 / 外側) | 8 / 12 | 14 / 18 |
+  | `shape-atm` | 操作面の幅 (本体の上限も揃える) | 140 | 152 |
+  | `shape-exchange` | 中央の六角形の半径 | 45 | 52 |
+  | `shape-storefront` | 扉の営業札 | 40x12 | 50x16 |
+  | `shape-kanban-card` | 状態の札 | 54 | 70 |
+
+  **相場の字は 1 銘柄に絞った** (`brokerage.ticker` の英語と日本語)。 指定 11 の 2 銘柄は
+  幅 181 で、板の内側 136 に収めるにはビルを 190 まで広げることになり、窓の格子 124 の
+  左右に空き壁が残る。
+
+  **連鎖の番号は 3 桁に揃えた** (`shape-ethereum-chain` が `#21400` から `#214`)。
+  6 桁は幅 56.8 で帯 42 に入らず #887 で打ち消しから外していたが、3 桁なら 37.8 で収まる
+  ので他の 2 つの連鎖と同じ扱いに戻した。
+
+  入れ物に余白が無い 19 件は据え置いた。 鍵盤の鍵 10 (18x10 の鍵)、行番号 4、担当者の
+  頭文字 2、判子と硬貨の記号 3 で、理由は `test/art-text-declarations.ts` が 1 件ずつ持つ。
+
+### Removed
+
+- **死んでいた下限の定数を消した** (#888 / #892)
+
+  `visual-validate.ts` の `MIN_FONT_SIZE` (12) は `void` されていて 1 度も効かず、
+  comment の「cdl は 12px 以下を描かない」 は実物と違っていた。
+
+  残る 4 つの下限は座標系ごとに名前が分かれている。 world 側が `MIN_TEXT_SIZE` (11) /
+  `TITLE_MIN` (9) / `絵の中の字の下限` (11、本版で命名)、画面側が
+  `RESPONSIVE_MIN_ON_SCREEN_FONT_PX` (12)。
+
 ## [0.75.0] - 2026-09-26
 
 ### Changed
@@ -3125,7 +3171,8 @@ Initial OSS release.
 使わない = annotated tag を push しても GitHub Release は作られず、 Release を作っていない版で
 行き止まりになる。
 
-[Unreleased]: https://github.com/cardene777/cdl/compare/v0.75.0...HEAD
+[Unreleased]: https://github.com/cardene777/cdl/compare/v0.76.0...HEAD
+[0.76.0]: https://github.com/cardene777/cdl/compare/v0.75.0...v0.76.0
 [0.75.0]: https://github.com/cardene777/cdl/compare/v0.74.0...v0.75.0
 [0.74.0]: https://github.com/cardene777/cdl/compare/v0.73.0...v0.74.0
 [0.73.0]: https://github.com/cardene777/cdl/compare/v0.72.0...v0.73.0

package/dist/index.cjs

@@ -394,8 +394,14 @@ var en = {
   "paymentProvider.sign": "PAY",
   /** `shape-payment-provider` の状態の札 */
   "paymentProvider.status": "PROCESSING",
-  /** `shape-brokerage` の株価の帯 */
-  "brokerage.ticker": "\u25B2NKY 38,240 \u25B2AAPL 194",
+  /**
+   * `shape-brokerage` の株価の帯。
+   *
+   * **1 銘柄に絞る** (#888)。 電光掲示板の内側は幅 136 しか無く、2 銘柄を指定 11 で描くと
+   * 幅 181 になってビルの外へ出る。 板が流れている雰囲気は帯そのもの (黒地に緑の等幅) が
+   * 担うので、銘柄を減らしても絵は変わらない。
+   */
+  "brokerage.ticker": "\u25B2NKY 38,240",
   /** `shape-brokerage` の看板 */
   "brokerage.sign": "$ SECURITIES",
   /** `shape-exchange` の看板 */
@@ -598,7 +604,7 @@ var ja = {
   "trustBank.sign": "\u4FE1\u8A17",
   "paymentProvider.sign": "\u6C7A\u6E08",
   "paymentProvider.status": "\u51E6\u7406\u4E2D",
-  "brokerage.ticker": "\u25B2\u65E5\u7D4C 38,240 \u25B2\u6771\u8A3C 2,710",
+  "brokerage.ticker": "\u25B2\u65E5\u7D4C 38,240",
   "brokerage.sign": "\xA5 \u8A3C\u5238",
   "exchange.sign": "\u53D6\u5F15\u6240",
   "exchange.sub": "\u6E05\u7B97",
@@ -28741,9 +28747,9 @@ function ShapeKanbanCardNode({ node, active, lang }) {
   const ID\u5B57 = 11;
   const ID\u5B57\u9593 = 1;
   const PILL\u4E0A = 20;
-  const PILL\u5E45 = 54;
+  const PILL\u5E45 = 70;
   const PILL\u9AD8 = 16;
-  const PILL\u5B57 = 9;
+  const PILL\u5B57 = 11;
   const FOOTER\u4E0B = 22;
   const AVATAR\u4E2D\u5FC3Y = 4;
   const AVATAR\u534A\u5F84 = 9;
@@ -29876,7 +29882,7 @@ var SMART_CONTRACT_H = 220;
 var BLOCK_W = 240;
 var BLOCK_H = 220;
 var \u898B\u51FA\u3057\u306E\u5B57 = 13;
-var \u540D\u306E\u5B57 = 10.5;
+var \u540D\u306E\u5B57 = 11;
 var \u5024\u306E\u5B57 = 11;
 var \u884C\u306E\u9593\u9694 = 22;
 var \u898B\u51FA\u3057\u306E\u5E2F = 32;
@@ -29893,12 +29899,12 @@ var CHAIN_BLOCK_SW = 2.5;
 var CHAIN_HEAD_H = 16;
 var CHAIN_TEXT_W = CHAIN_BLOCK_W - 8;
 var CHAIN_ROW_GAP = 14;
-var CHAIN_NO_SIZE = 10;
+var CHAIN_NO_SIZE = 11;
 var CONTRACT_CALL_SIZE = 11;
 var NFT_ID_SIZE = 15;
-var CHAIN_HASH_SIZE = 7;
-var BTC_NO_SIZE = 9;
-var ETH_NO_SIZE = 9;
+var CHAIN_HASH_SIZE = 11;
+var BTC_NO_SIZE = 11;
+var ETH_NO_SIZE = 11;
 var NODE_HEX_R = 44;
 var NODE_PEER_R = 12;
 var NODE_PEER_GAP = 22;
@@ -30227,34 +30233,40 @@ function ShapeEthereumChainNode({ node, active }) {
   const linkW = CHAIN_LINK_W;
   const totalW = blockCount * blockW + (blockCount - 1) * linkW;
   const startX = cx - totalW / 2;
-  const art = /* @__PURE__ */ jsxRuntime.jsx("g", { children: Array.from({ length: blockCount }, (_, i) => i).map((i) => {
-    const bx = startX + i * (blockW + linkW);
-    const isCurrent = i === blockCount - 1;
-    const iconColors = isCurrent ? { light: "#ffffff", medium: "#e5e5f5", dark: "#c9c9e0", darker: "#a4a4c9", stroke: "#ffffff" } : { light: "#8a92b2", medium: "#62688f", dark: "#454a75", darker: "#3c3c3b", stroke: ethPurple };
-    return /* @__PURE__ */ jsxRuntime.jsxs("g", { children: [
-      i > 0 && /* @__PURE__ */ jsxRuntime.jsx("line", { x1: bx - linkW, y1: cy, x2: bx, y2: cy, stroke: ethPurple, strokeWidth: 3.5, strokeLinecap: "round" }),
-      /* @__PURE__ */ jsxRuntime.jsx("rect", { x: bx + 3, y: cy - blockH / 2 + 3, width: blockW, height: blockH, rx: 4, fill: frame.stroke, opacity: 0.18, stroke: "none" }),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        "rect",
-        {
-          "data-cdl-role": i === 0 ? "node-body" : void 0,
-          x: bx,
-          y: cy - blockH / 2,
-          width: blockW,
-          height: blockH,
-          rx: 4,
-          fill: isCurrent ? ethPurple : "var(--cdl-node-fill, #ffffff)",
-          stroke: ethPurple,
-          strokeWidth: isCurrent ? 2.5 : 1.5
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsx(EthereumDiamond, { cx: bx + blockW / 2, cy: cy - 6, h: 16, colors: iconColors }),
-      /* @__PURE__ */ jsxRuntime.jsxs("text", { "data-cdl-counter-scaled": "0", x: bx + blockW / 2, y: cy + 22, fontSize: ETH_NO_SIZE, fontFamily: "ui-monospace, SFMono-Regular, Menlo, monospace", fontWeight: 700, textAnchor: "middle", fill: isCurrent ? "#ffffff" : "var(--cdl-text-dim, #5a6270)", children: [
-        "#",
-        21400 + i
-      ] })
-    ] }, i);
-  }) });
+  const \u6253\u3061\u6D88\u3059\u5B57\u3089 = [
+    { text: "#214", size: ETH_NO_SIZE, \u5E2F: { \u5E45: CHAIN_TEXT_W, \u9AD8\u3055: 20 } }
+  ];
+  const art = (\u500D\u7387) => {
+    const \u500D = \u6253\u3061\u6D88\u3057\u306E\u500D\u7387(\u500D\u7387, \u6253\u3061\u6D88\u3059\u5B57\u3089);
+    return /* @__PURE__ */ jsxRuntime.jsx("g", { children: Array.from({ length: blockCount }, (_, i) => i).map((i) => {
+      const bx = startX + i * (blockW + linkW);
+      const isCurrent = i === blockCount - 1;
+      const iconColors = isCurrent ? { light: "#ffffff", medium: "#e5e5f5", dark: "#c9c9e0", darker: "#a4a4c9", stroke: "#ffffff" } : { light: "#8a92b2", medium: "#62688f", dark: "#454a75", darker: "#3c3c3b", stroke: ethPurple };
+      return /* @__PURE__ */ jsxRuntime.jsxs("g", { children: [
+        i > 0 && /* @__PURE__ */ jsxRuntime.jsx("line", { x1: bx - linkW, y1: cy, x2: bx, y2: cy, stroke: ethPurple, strokeWidth: 3.5, strokeLinecap: "round" }),
+        /* @__PURE__ */ jsxRuntime.jsx("rect", { x: bx + 3, y: cy - blockH / 2 + 3, width: blockW, height: blockH, rx: 4, fill: frame.stroke, opacity: 0.18, stroke: "none" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "rect",
+          {
+            "data-cdl-role": i === 0 ? "node-body" : void 0,
+            x: bx,
+            y: cy - blockH / 2,
+            width: blockW,
+            height: blockH,
+            rx: 4,
+            fill: isCurrent ? ethPurple : "var(--cdl-node-fill, #ffffff)",
+            stroke: ethPurple,
+            strokeWidth: isCurrent ? 2.5 : 1.5
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(EthereumDiamond, { cx: bx + blockW / 2, cy: cy - 6, h: 16, colors: iconColors }),
+        /* @__PURE__ */ jsxRuntime.jsxs("text", { "data-cdl-counter-scaled": "1", x: bx + blockW / 2, y: cy + 22, fontSize: ETH_NO_SIZE * \u500D, fontFamily: "ui-monospace, SFMono-Regular, Menlo, monospace", fontWeight: 700, textAnchor: "middle", fill: isCurrent ? "#ffffff" : "var(--cdl-text-dim, #5a6270)", children: [
+          "#",
+          214 + i
+        ] })
+      ] }, i);
+    }) });
+  };
   return /* @__PURE__ */ jsxRuntime.jsxs("g", { children: [
     fitArt(r, chainExtent(), art),
     bottomLabel2(node, r.cx, r.label)
@@ -30705,7 +30717,7 @@ function ShapePaymentProviderNode({ node, active, lang }) {
       /* @__PURE__ */ jsxRuntime.jsx("circle", { cx, cy: cy + 4, r: 10, fill: "#e5c07b", stroke: accentDarker, strokeWidth: 1.5 }),
       /* @__PURE__ */ jsxRuntime.jsx("text", { x: cx, y: cy + 9, fontSize: 13, fontWeight: 700, textAnchor: "middle", fill: accentDarker, fontFamily: "Georgia, serif", children: "$" })
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsx("text", { x: cx, y: y + boxH - 16, fontSize: 9, fontWeight: 700, letterSpacing: 2, textAnchor: "middle", fill: "#a4b5f2", children: \u5B57\u5F15("paymentProvider.status") }),
+    /* @__PURE__ */ jsxRuntime.jsx("text", { x: cx, y: y + boxH - 16, fontSize: 11, fontWeight: 700, letterSpacing: 2, textAnchor: "middle", fill: "#a4b5f2", children: \u5B57\u5F15("paymentProvider.status") }),
     bottomLabel3(node, r.cx, r.label)
   ] });
 }
@@ -30734,12 +30746,12 @@ function ShapeCreditCardNode({ node, active }) {
     bottomLabel3(node, r.cx, r.label)
   ] });
 }
-var BROKERAGE_TICK_H = 12;
+var BROKERAGE_TICK_H = 18;
 var BROKERAGE_LOGO_H = 26;
-var BROKERAGE_TICK_INNER_H = 8;
-var BROKERAGE_TICKER_SIZE = 5.5;
+var BROKERAGE_TICKER_SIZE = 11;
+var BROKERAGE_TICK_INNER_H = 14;
 var BROKERAGE_SIGN_SIZE = 12;
-var BROKERAGE_GRID_TOP = 62;
+var BROKERAGE_GRID_TOP = 68;
 var BROKERAGE_CELL_W = 14;
 var BROKERAGE_CELL_H = 18;
 var BROKERAGE_GAP_X = 8;
@@ -30801,10 +30813,10 @@ function ShapeBrokerageNode({ node, active, lang }) {
       /* @__PURE__ */ jsxRuntime.jsx("rect", { "data-cdl-role": "node-body", x, y, width: w, height: h, fill: "#255a7a", stroke: accentDarker, strokeWidth: frame.strokeWidth }),
       /* @__PURE__ */ jsxRuntime.jsx("rect", { x: x - BROKERAGE_SHADE_OUT, y, width: BROKERAGE_SHADE_OUT * 2, height: h, fill: accentDarker }),
       /* @__PURE__ */ jsxRuntime.jsx("rect", { x, y, width: w, height: BROKERAGE_TICK_H, fill: "#0f1830", stroke: "none" }),
-      /* @__PURE__ */ jsxRuntime.jsx("rect", { x: x + 2, y: y + 2, width: w - 4, height: 8, fill: "#1a2340", stroke: "none" }),
-      /* @__PURE__ */ jsxRuntime.jsx("text", { "data-cdl-counter-scaled": "1", x: cx, y: y + 9, fontSize: BROKERAGE_TICKER_SIZE * \u500D, fontWeight: 700, textAnchor: "middle", fill: "#4ea36a", fontFamily: "ui-monospace, SFMono-Regular, Menlo, monospace", children: \u5B57\u5F15("brokerage.ticker") }),
+      /* @__PURE__ */ jsxRuntime.jsx("rect", { x: x + 2, y: y + 2, width: w - 4, height: BROKERAGE_TICK_INNER_H, fill: "#1a2340", stroke: "none" }),
+      /* @__PURE__ */ jsxRuntime.jsx("text", { "data-cdl-counter-scaled": "1", x: cx, y: y + 12, fontSize: BROKERAGE_TICKER_SIZE * \u500D, fontWeight: 700, textAnchor: "middle", fill: "#4ea36a", fontFamily: "ui-monospace, SFMono-Regular, Menlo, monospace", children: \u5B57\u5F15("brokerage.ticker") }),
       /* @__PURE__ */ jsxRuntime.jsx("rect", { x, y: y + BROKERAGE_TICK_H, width: w, height: BROKERAGE_LOGO_H, fill: "#e5c07b", stroke: "none" }),
-      /* @__PURE__ */ jsxRuntime.jsx("text", { "data-cdl-counter-scaled": "0", x: cx, y: y + 30, fontSize: BROKERAGE_SIGN_SIZE, fontWeight: 700, letterSpacing: 2.5, textAnchor: "middle", fill: "#0f1830", children: \u5B57\u5F15("brokerage.sign") }),
+      /* @__PURE__ */ jsxRuntime.jsx("text", { "data-cdl-counter-scaled": "0", x: cx, y: y + BROKERAGE_TICK_H + 18, fontSize: BROKERAGE_SIGN_SIZE, fontWeight: 700, letterSpacing: 2.5, textAnchor: "middle", fill: "#0f1830", children: \u5B57\u5F15("brokerage.sign") }),
       Array.from({ length: rows }).map(
         (_, ri) => Array.from({ length: cols }).map((_2, ci) => {
           const wx = gridStartX + ci * (cellW + gapX);
@@ -30826,7 +30838,8 @@ function ShapeBrokerageNode({ node, active, lang }) {
     bottomLabel3(node, r.cx, r.label)
   ] });
 }
-var EXCHANGE_SUB_SIZE = 8;
+var EXCHANGE_SUB_SIZE = 11;
+var EXCHANGE_HEX_R = 52;
 function ShapeExchangeNode({ node, active, lang }) {
   const \u5B57\u5F15 = \u5B57\u5F15\u304D\u3092\u4F5C\u308B(lang);
   const frame = commonFrame5(active);
@@ -30846,7 +30859,8 @@ function ShapeExchangeNode({ node, active, lang }) {
       idx: i
     };
   });
-  const hexR = 45;
+  const hexR = EXCHANGE_HEX_R;
+  const \u516D\u89D2\u306E\u6A2A\u5E45 = (d) => hexR * Math.sqrt(3) * Math.min(1, Math.max(0, (hexR - Math.abs(d)) / (hexR / 2)));
   const hexPoints = [-90, -30, 30, 90, 150, 210].map((deg) => {
     const rad = deg * Math.PI / 180;
     return { x: cx + Math.cos(rad) * hexR, y: cy + Math.sin(rad) * hexR };
@@ -30854,7 +30868,7 @@ function ShapeExchangeNode({ node, active, lang }) {
   const hexPath = hexPoints.map((p, i) => `${i === 0 ? "M" : "L"} ${p.x} ${p.y}`).join(" ") + " Z";
   const \u7BC0\u70B9 = Math.max(0, nodeR) + 8 + 1.5 / 2;
   const \u516D\u89D2 = hexR + frame.strokeWidth / 2;
-  const \u5B57\u4E0B = 26 + EXCHANGE_SUB_SIZE * 0.25;
+  const \u5B57\u4E0B = 28 + EXCHANGE_SUB_SIZE * 0.25;
   const \u5916 = Math.max(\u7BC0\u70B9, \u516D\u89D2);
   const \u305A\u308C = cy - r.cy;
   const \u5E83\u304C\u308A = {
@@ -30864,7 +30878,11 @@ function ShapeExchangeNode({ node, active, lang }) {
     \u53F3: \u5916
   };
   const \u6253\u3061\u6D88\u3059\u5B57\u3089 = [
-    { text: \u5B57\u5F15("exchange.sub"), size: EXCHANGE_SUB_SIZE, \u5E2F: { \u5E45: \u5916 * 2, \u9AD8\u3055: 14 } }
+    {
+      text: \u5B57\u5F15("exchange.sub"),
+      size: EXCHANGE_SUB_SIZE,
+      \u5E2F: { \u5E45: \u516D\u89D2\u306E\u6A2A\u5E45(\u5B57\u4E0B), \u9AD8\u3055: 14 }
+    }
   ];
   const \u7D75 = (\u500D\u7387) => {
     const \u500D = \u6253\u3061\u6D88\u3057\u306E\u500D\u7387(\u500D\u7387, \u6253\u3061\u6D88\u3059\u5B57\u3089);
@@ -30878,9 +30896,9 @@ function ShapeExchangeNode({ node, active, lang }) {
         ] }, `d${i}`);
       }),
       /* @__PURE__ */ jsxRuntime.jsx("path", { d: hexPath, fill: "#255a7a", stroke: accentDarker, strokeWidth: frame.strokeWidth, strokeLinejoin: "round" }),
-      /* @__PURE__ */ jsxRuntime.jsx("text", { "data-cdl-counter-scaled": "0", x: cx, y: cy - 8, fontSize: 10, fontWeight: 700, letterSpacing: 2, textAnchor: "middle", fill: "#e5c07b", children: \u5B57\u5F15("exchange.sign") }),
+      /* @__PURE__ */ jsxRuntime.jsx("text", { "data-cdl-counter-scaled": "0", x: cx, y: cy - 10, fontSize: 11, fontWeight: 700, letterSpacing: 1, textAnchor: "middle", fill: "#e5c07b", children: \u5B57\u5F15("exchange.sign") }),
       /* @__PURE__ */ jsxRuntime.jsx("text", { "data-cdl-counter-scaled": "0", "data-cdl-role": "node-body", x: cx, y: cy + 12, fontSize: 22, fontWeight: 700, textAnchor: "middle", fill: "#e5c07b", children: "\u21C4" }),
-      /* @__PURE__ */ jsxRuntime.jsx("text", { "data-cdl-counter-scaled": "1", x: cx, y: cy + 26, fontSize: EXCHANGE_SUB_SIZE * \u500D, fontWeight: 700, textAnchor: "middle", fill: "#a4b5f2", children: \u5B57\u5F15("exchange.sub") }),
+      /* @__PURE__ */ jsxRuntime.jsx("text", { "data-cdl-counter-scaled": "1", x: cx, y: cy + 28, fontSize: EXCHANGE_SUB_SIZE * \u500D, fontWeight: 700, textAnchor: "middle", fill: "#a4b5f2", children: \u5B57\u5F15("exchange.sub") }),
       nodes.map((n, i) => /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: n.cx, cy: n.cy, r: 8, fill: n.fill, stroke: accentDarker, strokeWidth: 1.5 }, `n${i}`))
     ] });
   };
@@ -30898,10 +30916,10 @@ var ATM_SHADOW_RX_RATIO = 0.6;
 var ATM_FLOOR_UP = 6;
 var ATM_FLOOR_H = 10;
 var ATM_FLOOR_RESERVE = 12;
-var ATM_PANEL_W = 140;
+var ATM_PANEL_W = 152;
 var ATM_PANEL_H = 146;
 var ATM_W_MIN = 100;
-var ATM_W_MAX = 140;
+var ATM_W_MAX = ATM_PANEL_W;
 var ATM_H_MIN = ATM_SIGN_H + ATM_SIGN_GAP + 30 + ATM_FLOOR_RESERVE;
 function ShapeAtmNode({ node, active, lang }) {
   const \u5B57\u5F15 = \u5B57\u5F15\u304D\u3092\u4F5C\u308B(lang);
@@ -30942,9 +30960,9 @@ function ShapeAtmNode({ node, active, lang }) {
     /* @__PURE__ */ jsxRuntime.jsx("rect", { "data-cdl-role": "node-body", x: atmX, y: atmY, width: atmW, height: atmH, rx: 6, fill: "#255a7a", stroke: accentDarker, strokeWidth: frame.strokeWidth }),
     /* @__PURE__ */ jsxRuntime.jsxs("g", { transform: `translate(${centerX} ${atmY}) scale(${\u9762})`, children: [
       /* @__PURE__ */ jsxRuntime.jsx("rect", { x: \u9762\u5DE6 + 8, y: 10, width: ATM_PANEL_W - 16, height: 52, rx: 3, fill: "#0f1830", stroke: "#000", strokeWidth: 1.5 }),
-      /* @__PURE__ */ jsxRuntime.jsx("text", { "data-cdl-counter-scaled": "0", x: 0, y: 30, fontSize: 10, fontWeight: 700, letterSpacing: 1, textAnchor: "middle", fill: "#e5c07b", children: "\u304A\u5F15\u51FA\u3057" }),
-      /* @__PURE__ */ jsxRuntime.jsx("text", { "data-cdl-counter-scaled": "0", x: 0, y: 44, fontSize: 8, fontWeight: 700, textAnchor: "middle", fill: "#a4b5f2", children: \u5B57\u5F15("atm.screen") }),
-      /* @__PURE__ */ jsxRuntime.jsx("text", { "data-cdl-counter-scaled": "0", x: 0, y: 56, fontSize: 10, fontWeight: 700, textAnchor: "middle", fill: "#4ea36a", children: "\xA5 20,000" }),
+      /* @__PURE__ */ jsxRuntime.jsx("text", { "data-cdl-counter-scaled": "0", x: 0, y: 28, fontSize: 11, fontWeight: 700, letterSpacing: 1, textAnchor: "middle", fill: "#e5c07b", children: "\u304A\u5F15\u51FA\u3057" }),
+      /* @__PURE__ */ jsxRuntime.jsx("text", { "data-cdl-counter-scaled": "0", x: 0, y: 42, fontSize: 11, fontWeight: 700, textAnchor: "middle", fill: "#a4b5f2", children: \u5B57\u5F15("atm.screen") }),
+      /* @__PURE__ */ jsxRuntime.jsx("text", { "data-cdl-counter-scaled": "0", x: 0, y: 56, fontSize: 11, fontWeight: 700, textAnchor: "middle", fill: "#4ea36a", children: "\xA5 20,000" }),
       /* @__PURE__ */ jsxRuntime.jsx("rect", { x: \u9762\u5DE6 + 8, y: 68, width: ATM_PANEL_W - 16, height: 42, rx: 2, fill: "#8b949e", stroke: "#5a6270", strokeWidth: 1 }),
       (() => {
         const keys = [
@@ -30962,7 +30980,7 @@ function ShapeAtmNode({ node, active, lang }) {
         const keyW = 18;
         const keyH = 10;
         const keyGap = 4;
-        const startX = \u9762\u5DE6 + 14;
+        const startX = \u9762\u5DE6 + (ATM_PANEL_W - (5 * keyW + 4 * keyGap)) / 2;
         return keys.map((k, i) => {
           const row = Math.floor(i / 5);
           const col = i % 5;
@@ -30979,7 +30997,7 @@ function ShapeAtmNode({ node, active, lang }) {
       })(),
       /* @__PURE__ */ jsxRuntime.jsx("rect", { x: \u9762\u5DE6 + 12, y: 116, width: ATM_PANEL_W - 24, height: 8, rx: 1.5, fill: "#0f1830", stroke: accentDarker, strokeWidth: 1 }),
       /* @__PURE__ */ jsxRuntime.jsx("rect", { x: \u9762\u5DE6 + 15, y: 118, width: ATM_PANEL_W - 30, height: 4, rx: 0.5, fill: "#e5c07b" }),
-      /* @__PURE__ */ jsxRuntime.jsx("text", { "data-cdl-counter-scaled": "0", x: 0, y: 132, fontSize: 6, fontWeight: 700, letterSpacing: 1, textAnchor: "middle", fill: "#e5c07b", children: \u5B57\u5F15("atm.cardSlot") }),
+      /* @__PURE__ */ jsxRuntime.jsx("text", { "data-cdl-counter-scaled": "0", x: 0, y: 132, fontSize: 11, fontWeight: 700, letterSpacing: 1, textAnchor: "middle", fill: "#e5c07b", children: \u5B57\u5F15("atm.cardSlot") }),
       /* @__PURE__ */ jsxRuntime.jsx("rect", { x: \u9762\u5DE6 + 12, y: 136, width: ATM_PANEL_W - 24, height: 4, rx: 1, fill: "#0f1830" })
     ] }),
     /* @__PURE__ */ jsxRuntime.jsx("rect", { x: centerX - totalW / 2, y: floorY, width: totalW, height: 6, fill: "#8b949e", stroke: "none" }),
@@ -31088,6 +31106,7 @@ function ShapeStorefrontNode({ node, active, lang }) {
   const doorH = facadeH - 30;
   const doorX = x + bw - doorW - 12;
   const doorY = facadeY + 20;
+  const \u672D\u5E45 = Math.min(doorW - 6, 50);
   return /* @__PURE__ */ jsxRuntime.jsxs("g", { children: [
     /* @__PURE__ */ jsxRuntime.jsx("ellipse", { cx, cy: y + bh + 8, rx: bw * 0.5, ry: 5, fill: frame.stroke, opacity: 0.2, stroke: "none" }),
     /* @__PURE__ */ jsxRuntime.jsx("rect", { x, y, width: bw, height: signH, fill: accent, stroke: accentDark, strokeWidth: 2 }),
@@ -31104,8 +31123,8 @@ function ShapeStorefrontNode({ node, active, lang }) {
     /* @__PURE__ */ jsxRuntime.jsx("rect", { x: doorX + 4, y: doorY + 4, width: doorW - 8, height: doorH - 8, fill: "#8b949e", stroke: accentDarker, strokeWidth: 1.5 }),
     /* @__PURE__ */ jsxRuntime.jsx("line", { x1: doorX + 4, y1: doorY + doorH * 0.38, x2: doorX + doorW - 4, y2: doorY + doorH * 0.38, stroke: accentDarker, strokeWidth: 1 }),
     /* @__PURE__ */ jsxRuntime.jsx("line", { x1: doorX + 4, y1: doorY + doorH * 0.72, x2: doorX + doorW - 4, y2: doorY + doorH * 0.72, stroke: accentDarker, strokeWidth: 1 }),
-    /* @__PURE__ */ jsxRuntime.jsx("rect", { x: doorX + doorW / 2 - 20, y: doorY + doorH * 0.85, width: 40, height: 12, fill: "#e5c07b", stroke: "#a67c00", strokeWidth: 1.5 }),
-    /* @__PURE__ */ jsxRuntime.jsx("text", { x: doorX + doorW / 2, y: doorY + doorH * 0.85 + 9, fontSize: 8, fontWeight: 700, letterSpacing: 1, textAnchor: "middle", fill: "#5a3a10", children: \u5B57\u5F15("storefront.open") }),
+    /* @__PURE__ */ jsxRuntime.jsx("rect", { x: doorX + doorW / 2 - \u672D\u5E45 / 2, y: doorY + doorH * 0.85, width: \u672D\u5E45, height: 16, fill: "#e5c07b", stroke: "#a67c00", strokeWidth: 1.5 }),
+    /* @__PURE__ */ jsxRuntime.jsx("text", { x: doorX + doorW / 2, y: doorY + doorH * 0.85 + 11, fontSize: 11, fontWeight: 700, letterSpacing: 1, textAnchor: "middle", fill: "#5a3a10", children: \u5B57\u5F15("storefront.open") }),
     /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: doorX + 6, cy: doorY + doorH * 0.55, r: 1.5, fill: "#c15a4a" }),
     /* @__PURE__ */ jsxRuntime.jsx("rect", { x: x - 6, y: y + bh - 6, width: bw + 12, height: 8, fill: "#5a6270", stroke: "none" }),
     bottomLabel4(node, r.cx, r.label)