@cardenelabs/cdl 0.75.0 → 0.77.0

package/dist/react.js

@@ -362,7 +362,14 @@ function resolveLang(value) {
 }
 var en = {
   /** `shape-terminal` の 2 行目 (命令の出力) */
-  "terminal.output": "\u2192 12 chunks in 1.8s",
+  /*
+   * `shape-terminal` の出力の行。
+   *
+   * **いちばん長い行が絵の倍率を決める** (#891)。 端末の中身は自分の座標で組んでから箱へ
+   * 収めるので、この行が長いほど全部の字が小さくなる。 120x110 の箱では 20 字の版で
+   * 7.71 world まで落ちていた。
+   */
+  "terminal.output": "\u2192 12 chunks",
   /** `shape-code-block` の札の file 名 */
   "codeBlock.fileName": "utils.ts",
   /** `shape-kanban-card` の課題の番号 */
@@ -397,8 +404,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` の看板 */
@@ -583,7 +596,7 @@ var en = {
   "readout.trafficLight.green": "green"
 };
 var ja = {
-  "terminal.output": "\u2192 1.8 \u79D2\u3067\u5B8C\u4E86",
+  "terminal.output": "\u2192 12 \u500B\u3092\u7D50\u5408",
   "codeBlock.fileName": "\u5171\u901A.ts",
   "kanbanCard.id": "#1111",
   "kanbanCard.status": "\u9032\u884C\u4E2D",
@@ -601,7 +614,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",
@@ -2870,6 +2883,7 @@ function textWidth(s, size, \u5B57\u9001\u308A = 0) {
   }
   return \u5E45 * size + \u5B57\u9001\u308A * \u5B57\u6570;
 }
+var \u7E2E\u3093\u3060\u7D75\u306E\u5B57\u306E\u4E0B\u9650 = 8;
 
 // src/kinds/row-align.ts
 var GENERIC_ROW_LEFT_SIZE_PX = 18;
@@ -12714,6 +12728,11 @@ function \u5272\u5408\u8868\u8A18(frac) {
   const v = Math.round(frac * 1e3) / 10;
   return `${Number.isInteger(v) ? v : v.toFixed(1)}%`;
 }
+var \u7A74\u306B\u5BFE\u3059\u308B\u4E0A\u9650 = 0.8;
+function \u4E2D\u592E\u306E\u5B57(\u6BD4\u4F8B\u3057\u305F\u5927\u304D\u3055, \u7A74\u306E\u534A\u5F84, \u6587) {
+  const \u5165\u308B\u5927\u304D\u3055 = \u7A74\u306E\u534A\u5F84 * 2 * \u7A74\u306B\u5BFE\u3059\u308B\u4E0A\u9650 / Math.max(textWidth(\u6587, 1), 1e-6);
+  return Math.min(Math.max(\u6BD4\u4F8B\u3057\u305F\u5927\u304D\u3055, \u7E2E\u3093\u3060\u7D75\u306E\u5B57\u306E\u4E0B\u9650), \u5165\u308B\u5927\u304D\u3055);
+}
 function ChartPieNode({
   node,
   active,
@@ -12771,6 +12790,11 @@ function ChartPieNode({
   const cx = node.w / 2;
   const cy = PAD_TOP2 + chartAreaH / 2;
   const \u524D\u306Eslices = \u524D\u3042\u308A ? \u8F2A\u3092\u7D44\u3080(data, cx, cy, \u524D\u306E\u5916\u534A\u5F84, \u524D\u306E\u5185\u534A\u5F84, \u524D\u306E\u5272\u5408) : [];
+  const \u7A74 = \u524D\u3042\u308A ? \u524D\u306E\u5185\u534A\u5F84 : \u5916\u306E\u5185\u534A\u5F84;
+  const \u5408\u8A08\u306E\u6587 = \u5B9F\u5024\u8868\u8A18(Math.round(\u524D\u3042\u308A ? \u4ECA\u306E\u5408\u8A08 : total));
+  const \u5408\u8A08\u306E\u5B57 = \u4E2D\u592E\u306E\u5B57(Math.round(radius * 0.26), \u7A74, \u5408\u8A08\u306E\u6587);
+  const \u898B\u51FA\u3057\u306E\u5B572 = \u4E2D\u592E\u306E\u5B57(Math.round(radius * 0.12), \u7A74, "\u5408\u8A08");
+  const \u5408\u8A08\u306E\u4E0B = Math.max(Math.round(radius * 0.2), \u5408\u8A08\u306E\u5B57 * 0.25 + \u898B\u51FA\u3057\u306E\u5B572 * 0.8);
   const slices = \u8F2A\u3092\u7D44\u3080(data, cx, cy, radius, \u5916\u306E\u5185\u534A\u5F84, \u4ECA\u306E\u5272\u5408);
   const \u958B\u304D = \u9032\u307F\u3092\u7573\u3080(drawing, progress);
   const \u5207\u308A\u629C\u304Did = `cdl-pie-draw-${instanceId}`;
@@ -12849,19 +12873,19 @@ function ChartPieNode({
         x: cx,
         y: cy - 2,
         textAnchor: "middle",
-        fontSize: Math.round(radius * 0.26),
+        fontSize: \u5408\u8A08\u306E\u5B57,
         fontWeight: 600,
         fill: "var(--cdl-text, #1a1f2a)",
-        children: \u5B9F\u5024\u8868\u8A18(Math.round(\u524D\u3042\u308A ? \u4ECA\u306E\u5408\u8A08 : total))
+        children: \u5408\u8A08\u306E\u6587
       }
     ),
     /* @__PURE__ */ jsx(
       "text",
       {
         x: cx,
-        y: cy + Math.round(radius * 0.2),
+        y: cy + \u5408\u8A08\u306E\u4E0B,
         textAnchor: "middle",
-        fontSize: Math.round(radius * 0.12),
+        fontSize: \u898B\u51FA\u3057\u306E\u5B572,
         fill: "var(--cdl-text-dim, #5a6270)",
         children: "\u5408\u8A08"
       }
@@ -13064,6 +13088,10 @@ function \u8868\u306E\u5F62({ node, active, data, \u5272\u5408, x0, y0, drawing,
   const \u5185\u534A\u5F84 = R * 0.58;
   const cx = PAD + R;
   const cy = node.h / 2;
+  const \u5408\u8A08\u306E\u6587 = \u5B9F\u5024\u8868\u8A18(Math.round(data.reduce((acc, d) => acc + d.value, 0)));
+  const \u5408\u8A08\u306E\u5B57 = \u4E2D\u592E\u306E\u5B57(Math.round(R * 0.26), \u5185\u534A\u5F84, \u5408\u8A08\u306E\u6587);
+  const \u898B\u51FA\u3057\u306E\u5B572 = \u4E2D\u592E\u306E\u5B57(Math.round(R * 0.12), \u5185\u534A\u5F84, "\u5408\u8A08");
+  const \u5408\u8A08\u306E\u4E0B = Math.max(Math.round(R * 0.2), \u5408\u8A08\u306E\u5B57 * 0.25 + \u898B\u51FA\u3057\u306E\u5B572 * 0.8);
   const \u8868\u5DE6 = node.w - PAD - \u8868\u5E45;
   const \u53F3\u7AEF = node.w - PAD;
   const \u5272\u5408\u53F3 = \u53F3\u7AEF - \u5B9F\u6570\u5E45 - 24;
@@ -13105,19 +13133,19 @@ function \u8868\u306E\u5F62({ node, active, data, \u5272\u5408, x0, y0, drawing,
         x: cx,
         y: cy - 2,
         textAnchor: "middle",
-        fontSize: Math.round(R * 0.26),
+        fontSize: \u5408\u8A08\u306E\u5B57,
         fontWeight: 600,
         fill: "var(--cdl-text, #1a1f2a)",
-        children: \u5B9F\u5024\u8868\u8A18(Math.round(data.reduce((acc, d) => acc + d.value, 0)))
+        children: \u5408\u8A08\u306E\u6587
       }
     ),
     /* @__PURE__ */ jsx(
       "text",
       {
         x: cx,
-        y: cy + Math.round(R * 0.2),
+        y: cy + \u5408\u8A08\u306E\u4E0B,
         textAnchor: "middle",
-        fontSize: Math.round(R * 0.12),
+        fontSize: \u898B\u51FA\u3057\u306E\u5B572,
         fill: "var(--cdl-text-dim, #5a6270)",
         children: "\u5408\u8A08"
       }
@@ -15894,6 +15922,7 @@ function ShapeTerminalNode({ node, active, lang }) {
   const lineFont = "ui-monospace, SFMono-Regular, Menlo, monospace";
   const \u4F59\u767D = 16;
   const \u5E2F = 28;
+  const \u5E2F\u306E\u5B57 = 12.5;
   const \u89D2 = 10;
   const \u5148\u982D = 26;
   const \u884C\u9593 = 22;
@@ -15903,7 +15932,7 @@ function ShapeTerminalNode({ node, active, lang }) {
       { \u5DE6: 16, \u5B57: 12.5, \u8272: "#7cd88f", \u6587: "$" },
       { \u5DE6: 30, \u5B57: 12.5, \u8272: "#e6edf3", \u6587: "pnpm build" }
     ],
-    [{ \u5DE6: 16, \u5B57: 12, \u8272: "#8b95a5", \u6587: \u5B57\u5F15("terminal.output") }],
+    [{ \u5DE6: 16, \u5B57: 12.5, \u8272: "#8b95a5", \u6587: \u5B57\u5F15("terminal.output") }],
     [{ \u5DE6: 16, \u5B57: 12.5, \u8272: "#7cd88f", \u6587: "$" }]
   ];
   const \u81EA\u7136\u5E45 = Math.max(...\u884C.flat().map((c) => c.\u5DE6 + \u7B49\u5E45\u306E\u6841(c.\u6587) * MONO_ADVANCE * c.\u5B57)) + \u4F59\u767D;
@@ -15945,7 +15974,7 @@ function ShapeTerminalNode({ node, active, lang }) {
         {
           x: x + w / 2,
           y: y + barH / 2 + 4 * \u500D,
-          fontSize: 11 * \u500D,
+          fontSize: \u5E2F\u306E\u5B57 * \u500D,
           fontFamily: lineFont,
           textAnchor: "middle",
           fill: "#7a8290",
@@ -16036,6 +16065,7 @@ function ShapeCodeBlockNode({ node, active, lang }) {
   const \u592A\u3055 = 9;
   const \u9699\u9593 = 6;
   const \u6301\u3061\u4E0A\u3052 = 8;
+  const \u884C\u756A\u53F7\u306E\u5B57 = 11;
   const lines = [
     [
       { c: "#c678dd", w: 40 },
@@ -16058,14 +16088,13 @@ function ShapeCodeBlockNode({ node, active, lang }) {
       { c: "#e6edf3", w: 40 }
     ]
   ];
-  const \u6700\u9577 = Math.max(
-    ...lines.map(
-      (tokens) => tokens.reduce((sum, token) => sum + token.w, 0) + \u9699\u9593 * (tokens.length - 1)
-    )
-  );
-  const \u81EA\u7136\u5E45 = \u6E9D + \u5B57\u4E0B\u3052 + \u6700\u9577 + \u4F59\u767D;
-  const \u81EA\u7136\u9AD8 = \u30BF\u30D6\u9AD8 + \u884C\u982D + \u884C\u9593 * (lines.length - 1) + Math.max(\u592A\u3055 - \u6301\u3061\u4E0A\u3052, 10.5 * DESCENT3);
-  const \u500D = Math.min(1, w / \u81EA\u7136\u5E45, bodyH / \u81EA\u7136\u9AD8);
+  const \u81EA\u7136\u9AD8 = \u30BF\u30D6\u9AD8 + \u884C\u982D + \u884C\u9593 * (lines.length - 1) + Math.max(\u592A\u3055 - \u6301\u3061\u4E0A\u3052, \u884C\u756A\u53F7\u306E\u5B57 * DESCENT3);
+  const \u500D = Math.min(1, bodyH / \u81EA\u7136\u9AD8);
+  const \u6253\u3061\u6D88\u3059\u5B57\u3089 = [
+    { text: \u5B57\u5F15("codeBlock.fileName"), size: 11, \u5E2F: { \u5E45: \u30BF\u30D6\u5E45, \u9AD8\u3055: \u30BF\u30D6\u9AD8 } },
+    { text: "1", size: \u884C\u756A\u53F7\u306E\u5B57, \u5E2F: { \u5E45: \u6E9D - \u6301\u3061\u4E0A\u3052, \u9AD8\u3055: \u884C\u9593 } }
+  ];
+  const \u500D\u8FD4\u3057 = \u6253\u3061\u6D88\u3057\u306E\u500D\u7387(\u500D, \u6253\u3061\u6D88\u3059\u5B57\u3089);
   const tabW = \u30BF\u30D6\u5E45 * \u500D;
   const tabH = \u30BF\u30D6\u9AD8 * \u500D;
   const \u4E38 = \u89D2 * \u500D;
@@ -16101,9 +16130,10 @@ function ShapeCodeBlockNode({ node, active, lang }) {
       /* @__PURE__ */ jsx(
         "text",
         {
+          "data-cdl-counter-scaled": "1",
           x: x + tabW / 2,
           y: y + tabH / 2 + 4 * \u500D,
-          fontSize: 11 * \u500D,
+          fontSize: 11 * \u500D * \u500D\u8FD4\u3057,
           fontFamily: lineFont,
           textAnchor: "middle",
           fill: "#e6edf3",
@@ -16125,9 +16155,10 @@ function ShapeCodeBlockNode({ node, active, lang }) {
           /* @__PURE__ */ jsx(
             "text",
             {
+              "data-cdl-counter-scaled": "1",
               x: x + gutterW - \u6301\u3061\u4E0A\u3052 * \u500D,
               y: codeY0 + i * lineH,
-              fontSize: 10.5 * \u500D,
+              fontSize: \u884C\u756A\u53F7\u306E\u5B57 * \u500D * \u500D\u8FD4\u3057,
               fontFamily: lineFont,
               textAnchor: "end",
               fill: "#4a5266",
@@ -16135,12 +16166,13 @@ function ShapeCodeBlockNode({ node, active, lang }) {
             }
           ),
           toks.map((t, j) => {
-            const rect = /* @__PURE__ */ jsx(
+            const \u63CF\u304F\u5E45 = Math.min(t.w * \u500D, x + w - \u4F59\u767D * \u500D - cursor);
+            const rect = \u63CF\u304F\u5E45 > 0 ? /* @__PURE__ */ jsx(
               "rect",
               {
                 x: cursor,
                 y: codeY0 + i * lineH - \u6301\u3061\u4E0A\u3052 * \u500D,
-                width: t.w * \u500D,
+                width: \u63CF\u304F\u5E45,
                 height: \u592A\u3055 * \u500D,
                 rx: 2 * \u500D,
                 fill: t.c,
@@ -16148,7 +16180,7 @@ function ShapeCodeBlockNode({ node, active, lang }) {
                 stroke: "none"
               },
               j
-            );
+            ) : null;
             cursor += (t.w + \u9699\u9593) * \u500D;
             return rect;
           })
@@ -16193,21 +16225,23 @@ function ShapeKanbanCardNode({ node, active, lang }) {
   const w = Math.max(0, node.w - \u7DDA * 2 - \u5F71);
   const h = Math.max(0, node.h - \u7DDA * 2 - \u5F71);
   const \u5E2F\u9593\u4F59\u767D = 4;
-  const \u5DE6\u53F3\u4F59\u767D = 14;
-  const \u4E0A\u6BB5\u9699\u9593 = 8;
+  const \u5DE6\u53F3\u4F59\u767D = 12;
+  const \u4E0A\u6BB5\u9699\u9593 = 6;
   const \u512A\u5148\u5E2F\u9AD8 = 10;
   const ID\u6587 = \u5B57\u5F15("kanbanCard.id");
   const ID\u57FA\u6E96 = 30;
   const ID\u5B57 = 11;
   const ID\u5B57\u9593 = 1;
   const PILL\u4E0A = 20;
-  const PILL\u5E45 = 54;
+  const PILL\u5E45 = 62;
   const PILL\u9AD8 = 16;
-  const PILL\u5B57 = 9;
+  const PILL\u5B57 = 11;
+  const PILL\u5B57\u9593 = 0;
   const FOOTER\u4E0B = 22;
   const AVATAR\u4E2D\u5FC3Y = 4;
   const AVATAR\u534A\u5F84 = 9;
   const AVATAR\u67A0 = 1.5;
+  const AVATAR\u5B57 = 11;
   const \u540D\u524D\u5B57 = 17;
   const \u8AAC\u660E\u57FA\u6E96\u6BD4 = 20 / 17;
   const \u8AAC\u660E\u5B57\u6BD4 = 12 / 17;
@@ -16290,7 +16324,7 @@ function ShapeKanbanCardNode({ node, active, lang }) {
           y: pillY + 12 * \u500D,
           fontSize: PILL\u5B57 * \u500D,
           fontWeight: 700,
-          letterSpacing: 1 * \u500D,
+          letterSpacing: PILL\u5B57\u9593 * \u500D,
           textAnchor: "middle",
           fill: "#5a4a1a",
           fontFamily: "ui-monospace, SFMono-Regular, Menlo, monospace",
@@ -16338,7 +16372,7 @@ function ShapeKanbanCardNode({ node, active, lang }) {
           {
             x: 9 * \u500D,
             y: 8 * \u500D,
-            fontSize: 10 * \u500D,
+            fontSize: AVATAR\u5B57 * \u500D,
             fontWeight: 700,
             textAnchor: "middle",
             fill: "#ffffff",
@@ -16362,7 +16396,7 @@ function ShapeKanbanCardNode({ node, active, lang }) {
           {
             x: 23 * \u500D,
             y: 8 * \u500D,
-            fontSize: 10 * \u500D,
+            fontSize: AVATAR\u5B57 * \u500D,
             fontWeight: 700,
             textAnchor: "middle",
             fill: "#ffffff",
@@ -17336,7 +17370,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;
@@ -17353,12 +17387,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;
@@ -17687,34 +17721,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__ */ 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__ */ jsxs("g", { children: [
-      i > 0 && /* @__PURE__ */ jsx("line", { x1: bx - linkW, y1: cy, x2: bx, y2: cy, stroke: ethPurple, strokeWidth: 3.5, strokeLinecap: "round" }),
-      /* @__PURE__ */ 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__ */ 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__ */ jsx(EthereumDiamond, { cx: bx + blockW / 2, cy: cy - 6, h: 16, colors: iconColors }),
-      /* @__PURE__ */ 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__ */ 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__ */ jsxs("g", { children: [
+        i > 0 && /* @__PURE__ */ jsx("line", { x1: bx - linkW, y1: cy, x2: bx, y2: cy, stroke: ethPurple, strokeWidth: 3.5, strokeLinecap: "round" }),
+        /* @__PURE__ */ 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__ */ 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__ */ jsx(EthereumDiamond, { cx: bx + blockW / 2, cy: cy - 6, h: 16, colors: iconColors }),
+        /* @__PURE__ */ 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__ */ jsxs("g", { children: [
     fitArt(r, chainExtent(), art),
     bottomLabel2(node, r.cx, r.label)
@@ -18165,7 +18205,7 @@ function ShapePaymentProviderNode({ node, active, lang }) {
       /* @__PURE__ */ jsx("circle", { cx, cy: cy + 4, r: 10, fill: "#e5c07b", stroke: accentDarker, strokeWidth: 1.5 }),
       /* @__PURE__ */ jsx("text", { x: cx, y: cy + 9, fontSize: 13, fontWeight: 700, textAnchor: "middle", fill: accentDarker, fontFamily: "Georgia, serif", children: "$" })
     ] }),
-    /* @__PURE__ */ jsx("text", { x: cx, y: y + boxH - 16, fontSize: 9, fontWeight: 700, letterSpacing: 2, textAnchor: "middle", fill: "#a4b5f2", children: \u5B57\u5F15("paymentProvider.status") }),
+    /* @__PURE__ */ 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)
   ] });
 }
@@ -18194,12 +18234,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;
@@ -18261,10 +18301,10 @@ function ShapeBrokerageNode({ node, active, lang }) {
       /* @__PURE__ */ jsx("rect", { "data-cdl-role": "node-body", x, y, width: w, height: h, fill: "#255a7a", stroke: accentDarker, strokeWidth: frame.strokeWidth }),
       /* @__PURE__ */ jsx("rect", { x: x - BROKERAGE_SHADE_OUT, y, width: BROKERAGE_SHADE_OUT * 2, height: h, fill: accentDarker }),
       /* @__PURE__ */ jsx("rect", { x, y, width: w, height: BROKERAGE_TICK_H, fill: "#0f1830", stroke: "none" }),
-      /* @__PURE__ */ jsx("rect", { x: x + 2, y: y + 2, width: w - 4, height: 8, fill: "#1a2340", stroke: "none" }),
-      /* @__PURE__ */ 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__ */ jsx("rect", { x: x + 2, y: y + 2, width: w - 4, height: BROKERAGE_TICK_INNER_H, fill: "#1a2340", stroke: "none" }),
+      /* @__PURE__ */ 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__ */ jsx("rect", { x, y: y + BROKERAGE_TICK_H, width: w, height: BROKERAGE_LOGO_H, fill: "#e5c07b", stroke: "none" }),
-      /* @__PURE__ */ 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__ */ 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);
@@ -18286,7 +18326,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);
@@ -18306,7 +18347,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 };
@@ -18314,7 +18356,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 = {
@@ -18324,7 +18366,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);
@@ -18338,9 +18384,9 @@ function ShapeExchangeNode({ node, active, lang }) {
         ] }, `d${i}`);
       }),
       /* @__PURE__ */ jsx("path", { d: hexPath, fill: "#255a7a", stroke: accentDarker, strokeWidth: frame.strokeWidth, strokeLinejoin: "round" }),
-      /* @__PURE__ */ 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__ */ 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__ */ 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__ */ 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__ */ 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__ */ jsx("circle", { cx: n.cx, cy: n.cy, r: 8, fill: n.fill, stroke: accentDarker, strokeWidth: 1.5 }, `n${i}`))
     ] });
   };
@@ -18358,10 +18404,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);
@@ -18402,9 +18448,9 @@ function ShapeAtmNode({ node, active, lang }) {
     /* @__PURE__ */ 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__ */ jsxs("g", { transform: `translate(${centerX} ${atmY}) scale(${\u9762})`, children: [
       /* @__PURE__ */ 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__ */ 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__ */ 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__ */ jsx("text", { "data-cdl-counter-scaled": "0", x: 0, y: 56, fontSize: 10, fontWeight: 700, textAnchor: "middle", fill: "#4ea36a", children: "\xA5 20,000" }),
+      /* @__PURE__ */ 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__ */ 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__ */ jsx("text", { "data-cdl-counter-scaled": "0", x: 0, y: 56, fontSize: 11, fontWeight: 700, textAnchor: "middle", fill: "#4ea36a", children: "\xA5 20,000" }),
       /* @__PURE__ */ 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 = [
@@ -18422,7 +18468,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;
@@ -18439,7 +18485,7 @@ function ShapeAtmNode({ node, active, lang }) {
       })(),
       /* @__PURE__ */ 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__ */ jsx("rect", { x: \u9762\u5DE6 + 15, y: 118, width: ATM_PANEL_W - 30, height: 4, rx: 0.5, fill: "#e5c07b" }),
-      /* @__PURE__ */ 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__ */ 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__ */ jsx("rect", { x: \u9762\u5DE6 + 12, y: 136, width: ATM_PANEL_W - 24, height: 4, rx: 1, fill: "#0f1830" })
     ] }),
     /* @__PURE__ */ jsx("rect", { x: centerX - totalW / 2, y: floorY, width: totalW, height: 6, fill: "#8b949e", stroke: "none" }),
@@ -18548,6 +18594,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__ */ jsxs("g", { children: [
     /* @__PURE__ */ jsx("ellipse", { cx, cy: y + bh + 8, rx: bw * 0.5, ry: 5, fill: frame.stroke, opacity: 0.2, stroke: "none" }),
     /* @__PURE__ */ jsx("rect", { x, y, width: bw, height: signH, fill: accent, stroke: accentDark, strokeWidth: 2 }),
@@ -18564,8 +18611,8 @@ function ShapeStorefrontNode({ node, active, lang }) {
     /* @__PURE__ */ jsx("rect", { x: doorX + 4, y: doorY + 4, width: doorW - 8, height: doorH - 8, fill: "#8b949e", stroke: accentDarker, strokeWidth: 1.5 }),
     /* @__PURE__ */ jsx("line", { x1: doorX + 4, y1: doorY + doorH * 0.38, x2: doorX + doorW - 4, y2: doorY + doorH * 0.38, stroke: accentDarker, strokeWidth: 1 }),
     /* @__PURE__ */ jsx("line", { x1: doorX + 4, y1: doorY + doorH * 0.72, x2: doorX + doorW - 4, y2: doorY + doorH * 0.72, stroke: accentDarker, strokeWidth: 1 }),
-    /* @__PURE__ */ jsx("rect", { x: doorX + doorW / 2 - 20, y: doorY + doorH * 0.85, width: 40, height: 12, fill: "#e5c07b", stroke: "#a67c00", strokeWidth: 1.5 }),
-    /* @__PURE__ */ 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__ */ 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__ */ 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__ */ jsx("circle", { cx: doorX + 6, cy: doorY + doorH * 0.55, r: 1.5, fill: "#c15a4a" }),
     /* @__PURE__ */ jsx("rect", { x: x - 6, y: y + bh - 6, width: bw + 12, height: 8, fill: "#5a6270", stroke: "none" }),
     bottomLabel4(node, r.cx, r.label)