@cardenelabs/cdl 0.58.0 → 0.59.1

package/dist/index.cjs

@@ -425,7 +425,147 @@ var en = {
   /** `shape-api-gateway` の 2 行目の宛先 */
   "apiGateway.orders": "/orders",
   /** `shape-api-gateway` の 3 行目の宛先 */
-  "apiGateway.session": "/session"
+  "apiGateway.session": "/session",
+  // 読み出し (`readout.*`) と入力欄の固定の字 (#849)。
+  // `{名前}` は描く時に値を差し込む位置 (`字を差し込む`)。 語順が言語で変わるので、位置ごと辞書に持つ
+  /** 配列を描く読み出しで、値が空の時の字 */
+  "readout.empty": "empty",
+  /** `sparkline` で点がまだ無い時の字 */
+  "readout.sparkline.waiting": "waiting",
+  /** 時の流れの入力欄の速さ */
+  "input.timeline.speed": "{speed}x",
+  /** 時の流れの入力欄の経過と長さ (秒) */
+  "input.timeline.time": "{t}s / {d}s",
+  /** `sequence-timeline` の点の見出し */
+  "readout.sequenceTimeline.title": "{name}: t={t}",
+  /** `bubble-chart` の泡の見出し */
+  "readout.bubbleChart.title": "({x}, {y}) r={r}",
+  /** `calendar-heatmap` の升目の見出し (`i` は 0 から) */
+  "readout.calendarHeatmap.title": "day {i}: {v}",
+  /** `candlestick` の足の見出し (始値 / 高値 / 安値 / 終値) */
+  "readout.candlestick.title": "O:{o} H:{h} L:{l} C:{c}",
+  /** `slope` の左の目盛 */
+  "readout.slope.before": "before",
+  /** `slope` の右の目盛 */
+  "readout.slope.after": "after",
+  /** `bullet-chart` の実績の見出し */
+  "readout.bulletChart.actual": "actual: {v}",
+  /** `bullet-chart` の目標の見出し */
+  "readout.bulletChart.target": "target: {v}",
+  /** `rating` の塗った星の見出し */
+  "readout.rating.full": "full",
+  /** `rating` の半分塗った星の見出し */
+  "readout.rating.half": "half",
+  /** `rating` の塗っていない星の見出し */
+  "readout.rating.empty": "empty",
+  /** `price-tag` の割引額 */
+  "readout.priceTag.save": "You save {amount}",
+  /** `confidence-meter` の低い帯の名前 */
+  "readout.confidence.low": "low",
+  /** `confidence-meter` の中ほどの帯の名前 */
+  "readout.confidence.mid": "mid",
+  /** `confidence-meter` の高い帯の名前 */
+  "readout.confidence.high": "high",
+  /** 並べきれなかった件数 (`user-stack` / `kanban-board` / `user-presence`) */
+  "readout.more": "+{n} more",
+  /** `video-card` の再生数 */
+  "readout.videoCard.views": "{v} views",
+  /** `attendance-grid` の角の見出し */
+  "readout.attendance.corner": "day",
+  /** `calendar-month` の曜日 (日曜) */
+  "readout.weekday.0": "Sun",
+  /** `calendar-month` の曜日 (月曜) */
+  "readout.weekday.1": "Mon",
+  /** `calendar-month` の曜日 (火曜) */
+  "readout.weekday.2": "Tue",
+  /** `calendar-month` の曜日 (水曜) */
+  "readout.weekday.3": "Wed",
+  /** `calendar-month` の曜日 (木曜) */
+  "readout.weekday.4": "Thu",
+  /** `calendar-month` の曜日 (金曜) */
+  "readout.weekday.5": "Fri",
+  /** `calendar-month` の曜日 (土曜) */
+  "readout.weekday.6": "Sat",
+  /** `rating-thumb` の賛成の割合と票数 */
+  "readout.ratingThumb.summary": "{pct}% up \xB7 {total} votes",
+  /** `kpi-trend-tile` の前の期間の値 */
+  "readout.kpiTrend.prev": "prev {v}",
+  /** `quick-poll-emoji` の票の合計 */
+  "readout.poll.total": "total {n}",
+  /** `thread-summary` の参加者の数 */
+  "readout.thread.participants": "{n} participants",
+  /** `thread-summary` の最後に書いた人 */
+  "readout.thread.last": "last: {name}",
+  /** `read-receipt` の送信した段 */
+  "readout.readReceipt.sent": "sent",
+  /** `read-receipt` の相手に届いた段 */
+  "readout.readReceipt.delivered": "delivered",
+  /** `read-receipt` の読まれた段 */
+  "readout.readReceipt.read": "read",
+  /** `password-strength` の段階 0 */
+  "readout.password.0": "too weak",
+  /** `password-strength` の段階 1 */
+  "readout.password.1": "weak",
+  /** `password-strength` の段階 2 */
+  "readout.password.2": "fair",
+  /** `password-strength` の段階 3 */
+  "readout.password.3": "good",
+  /** `password-strength` の段階 4 */
+  "readout.password.4": "strong",
+  /** `file-dropzone` で取り込んだ後の字 */
+  "readout.dropzone.uploaded": "uploaded",
+  /** `file-dropzone` の空の時の 1 行目 */
+  "readout.dropzone.drop": "\u2B06 Drop file here",
+  /** `file-dropzone` の空の時の 2 行目 */
+  "readout.dropzone.browse": "or click to browse",
+  /** `log-stream` の重さ 0 (調べるための詳細) */
+  "readout.log.0": "DBG",
+  /** `log-stream` の重さ 1 (知らせ) */
+  "readout.log.1": "INF",
+  /** `log-stream` の重さ 2 (警告) */
+  "readout.log.2": "WRN",
+  /** `log-stream` の重さ 3 (異常) */
+  "readout.log.3": "ERR",
+  /** `cart-summary` の点数 */
+  "readout.cart.items": "Items",
+  /** `cart-summary` の小計 */
+  "readout.cart.subtotal": "Subtotal",
+  /** `cart-summary` の送料 */
+  "readout.cart.shipping": "Shipping",
+  /** `cart-summary` の合計 */
+  "readout.cart.total": "Total",
+  /** `pricing-tier` で名前が空の時の名前 */
+  "readout.pricing.plan": "Plan",
+  /** `pricing-tier` の価格の後ろ */
+  "readout.pricing.perMonth": "per month",
+  /** `pricing-tier` の押す札 */
+  "readout.pricing.get": "Get {name}",
+  /** `coupon-code` で番号が空の時の字 */
+  "readout.coupon.placeholder": "ENTER CODE",
+  /** `coupon-code` の割引の割合 */
+  "readout.coupon.off": "-{pct}% off",
+  /** `coupon-code` の押す札 */
+  "readout.coupon.apply": "Apply",
+  /** `article-preview` の書いた人 */
+  "readout.article.by": "by {author}",
+  /** `priority-badge` の高い優先度の表示 (値は `high` / `2` で読む) */
+  "readout.priority.high": "HIGH",
+  /** `priority-badge` の中ほどの優先度の表示 */
+  "readout.priority.med": "MED",
+  /** `priority-badge` の低い優先度の表示 (値は `low` / `0` で読む) */
+  "readout.priority.low": "LOW",
+  /** `kanban-board` の列の見出し (値は `todo` で読む) */
+  "readout.kanban.todo": "Todo",
+  /** `kanban-board` の列の見出し (値は `inprogress` で読む) */
+  "readout.kanban.inprogress": "In Progress",
+  /** `kanban-board` の列の見出し (値は `done` で読む) */
+  "readout.kanban.done": "Done",
+  /** `traffic-light` の赤の灯の見出し (値は `red` で読む) */
+  "readout.trafficLight.red": "red",
+  /** `traffic-light` の黄の灯の見出し (値は `yellow` / `amber` で読む) */
+  "readout.trafficLight.yellow": "yellow",
+  /** `traffic-light` の緑の灯の見出し (値は `green` で読む) */
+  "readout.trafficLight.green": "green"
 };
 var ja = {
   "terminal.output": "\u2192 1.8 \u79D2\u3067\u5B8C\u4E86",
@@ -461,13 +601,85 @@ var ja = {
   "apiGateway.delete": "DELETE",
   "apiGateway.users": "/\u5229\u7528\u8005",
   "apiGateway.orders": "/\u6CE8\u6587",
-  "apiGateway.session": "/\u63A5\u7D9A"
+  "apiGateway.session": "/\u63A5\u7D9A",
+  "readout.empty": "\u306A\u3057",
+  "readout.sparkline.waiting": "\u5F85\u6A5F\u4E2D",
+  "input.timeline.speed": "{speed}\u500D",
+  "input.timeline.time": "{t}\u79D2 / {d}\u79D2",
+  "readout.sequenceTimeline.title": "{name}: \u6642\u523B {t}",
+  "readout.bubbleChart.title": "({x}, {y}) \u534A\u5F84 {r}",
+  "readout.calendarHeatmap.title": "{i} \u65E5\u76EE: {v}",
+  "readout.candlestick.title": "\u59CB {o} \u9AD8 {h} \u5B89 {l} \u7D42 {c}",
+  "readout.slope.before": "\u524D",
+  "readout.slope.after": "\u5F8C",
+  "readout.bulletChart.actual": "\u5B9F\u7E3E: {v}",
+  "readout.bulletChart.target": "\u76EE\u6A19: {v}",
+  "readout.rating.full": "\u6E80",
+  "readout.rating.half": "\u534A\u5206",
+  "readout.rating.empty": "\u7A7A",
+  "readout.priceTag.save": "{amount} \u304A\u5F97",
+  "readout.confidence.low": "\u4F4E",
+  "readout.confidence.mid": "\u4E2D",
+  "readout.confidence.high": "\u9AD8",
+  "readout.more": "\u307B\u304B {n}",
+  "readout.videoCard.views": "{v} \u56DE\u8996\u8074",
+  "readout.attendance.corner": "\u65E5",
+  "readout.weekday.0": "\u65E5",
+  "readout.weekday.1": "\u6708",
+  "readout.weekday.2": "\u706B",
+  "readout.weekday.3": "\u6C34",
+  "readout.weekday.4": "\u6728",
+  "readout.weekday.5": "\u91D1",
+  "readout.weekday.6": "\u571F",
+  "readout.ratingThumb.summary": "\u8CDB\u6210 {pct}% \xB7 {total} \u7968",
+  "readout.kpiTrend.prev": "\u524D\u56DE {v}",
+  "readout.poll.total": "\u5408\u8A08 {n}",
+  "readout.thread.participants": "{n} \u4EBA",
+  "readout.thread.last": "\u6700\u5F8C: {name}",
+  "readout.readReceipt.sent": "\u9001\u4FE1\u6E08\u307F",
+  "readout.readReceipt.delivered": "\u914D\u4FE1\u6E08\u307F",
+  "readout.readReceipt.read": "\u65E2\u8AAD",
+  "readout.password.0": "\u5F31\u3059\u304E\u308B",
+  "readout.password.1": "\u5F31\u3044",
+  "readout.password.2": "\u666E\u901A",
+  "readout.password.3": "\u826F\u3044",
+  "readout.password.4": "\u5F37\u3044",
+  "readout.dropzone.uploaded": "\u53D6\u308A\u8FBC\u307F\u6E08\u307F",
+  "readout.dropzone.drop": "\u2B06 \u3053\u3053\u306B\u30D5\u30A1\u30A4\u30EB\u3092\u7F6E\u304F",
+  "readout.dropzone.browse": "\u307E\u305F\u306F\u62BC\u3057\u3066\u9078\u3076",
+  "readout.log.0": "\u8A73\u7D30",
+  "readout.log.1": "\u60C5\u5831",
+  "readout.log.2": "\u8B66\u544A",
+  "readout.log.3": "\u7570\u5E38",
+  "readout.cart.items": "\u70B9\u6570",
+  "readout.cart.subtotal": "\u5C0F\u8A08",
+  "readout.cart.shipping": "\u9001\u6599",
+  "readout.cart.total": "\u5408\u8A08",
+  "readout.pricing.plan": "\u30D7\u30E9\u30F3",
+  "readout.pricing.perMonth": "\u6708\u984D",
+  "readout.pricing.get": "{name}\u3092\u9078\u3076",
+  "readout.coupon.placeholder": "\u30B3\u30FC\u30C9\u3092\u5165\u529B",
+  "readout.coupon.off": "-{pct}% \u5F15\u304D",
+  "readout.coupon.apply": "\u9069\u7528",
+  "readout.article.by": "\u6587: {author}",
+  "readout.priority.high": "\u9AD8",
+  "readout.priority.med": "\u4E2D",
+  "readout.priority.low": "\u4F4E",
+  "readout.kanban.todo": "\u672A\u7740\u624B",
+  "readout.kanban.inprogress": "\u9032\u884C\u4E2D",
+  "readout.kanban.done": "\u5B8C\u4E86",
+  "readout.trafficLight.red": "\u8D64",
+  "readout.trafficLight.yellow": "\u9EC4",
+  "readout.trafficLight.green": "\u7DD1"
 };
 var CDL_TEXT = { en, ja };
 function \u5B57\u5F15\u304D\u3092\u4F5C\u308B(lang) {
   const \u8A00\u8A9E = lang ?? "en";
   return (key) => CDL_TEXT[\u8A00\u8A9E][key];
 }
+function \u5B57\u3092\u5DEE\u3057\u8FBC\u3080(template, values) {
+  return template.replace(/\{(\w+)\}/g, (whole, name) => name in values ? String(values[name]) : whole);
+}
 
 // src/formula/ast.ts
 var ALLOWED_MATH_FNS = /* @__PURE__ */ new Set([
@@ -1379,6 +1591,83 @@ function textWidth(s, size, \u5B57\u9001\u308A = 0) {
   }
   return \u5E45 * size + \u5B57\u9001\u308A * \u5B57\u6570;
 }
+
+// src/kinds/row-align.ts
+var GENERIC_ROW_LEFT_SIZE_PX = 18;
+var GENERIC_ROW_RIGHT_SIZE_PX = 21;
+var MONO_ADVANCE_RATIO = 0.6;
+var STORAGE_CHAR_ADVANCE_PX = 26 * MONO_ADVANCE_RATIO;
+var ROW_PAD_X_PX = 26;
+var ROW_COL_GAP_PX = 16;
+var STORAGE_COL_GAP_PX = 32;
+var ROW_RIGHT_PAD_PX = 26;
+var DELIMITERS = [" -> ", " \u2192 ", " = ", ": ", ":"];
+function splitRow(row) {
+  for (const d of DELIMITERS) {
+    const idx = row.indexOf(d);
+    if (idx > 0) {
+      return {
+        left: row.slice(0, idx).trim(),
+        right: row.slice(idx + d.length).trim(),
+        split: true
+      };
+    }
+  }
+  return { left: row.trim(), right: "", split: false };
+}
+function rowColumnWidth(text, size, mono) {
+  return mono ? displayWidth(text) * size * MONO_ADVANCE_RATIO : textWidth(text, size);
+}
+function displayWidth(text) {
+  let w = 0;
+  for (const ch of text) {
+    const code = ch.codePointAt(0) ?? 0;
+    w += code >= 32 && code <= 126 ? 1 : 2;
+  }
+  return w;
+}
+function \u6841\u3067\u5272\u308B(text, \u6841) {
+  let w = 0;
+  let \u53D6\u3063\u305F = "";
+  for (const ch of text) {
+    const code = ch.codePointAt(0) ?? 0;
+    const \u5B57\u306E\u6841 = code >= 32 && code <= 126 ? 1 : 2;
+    if (w + \u5B57\u306E\u6841 > \u6841) break;
+    w += \u5B57\u306E\u6841;
+    \u53D6\u3063\u305F += ch;
+  }
+  return [\u53D6\u3063\u305F, text.slice(\u53D6\u3063\u305F.length)];
+}
+function \u6841\u3067\u7701\u304F(text, \u4E0A\u9650) {
+  if (displayWidth(text) <= \u4E0A\u9650) return text;
+  return `${\u6841\u3067\u5272\u308B(text, \u4E0A\u9650 - 1)[0]}\u2026`;
+}
+function requiredRowsWidth(rows, kind) {
+  if (!rows || rows.length === 0) return 0;
+  const splits = rows.map(splitRow);
+  const \u4E00\u756A\u5E83\u3044 = (\u53D6\u308B) => splits.reduce((m, s) => Math.max(m, \u53D6\u308B(s)), 0);
+  const storage = ROW_PAD_X_PX + \u4E00\u756A\u5E83\u3044((s) => rowColumnWidth(s.left, 26, true)) + STORAGE_COL_GAP_PX + \u4E00\u756A\u5E83\u3044((s) => rowColumnWidth(s.right, 26, true)) + ROW_RIGHT_PAD_PX;
+  const generic = ROW_PAD_X_PX + \u4E00\u756A\u5E83\u3044((s) => rowColumnWidth(s.left, GENERIC_ROW_LEFT_SIZE_PX, false)) + ROW_COL_GAP_PX + \u4E00\u756A\u5E83\u3044((s) => rowColumnWidth(s.right, GENERIC_ROW_RIGHT_SIZE_PX, true)) + ROW_RIGHT_PAD_PX;
+  if (kind === void 0) return Math.ceil(Math.max(storage, generic));
+  return Math.ceil(kind === "storage" ? storage : generic);
+}
+var \u64CD\u4F5C\u90E8\u306E\u8A00\u8A9E = react.createContext("en");
+function use\u5B57\u5F15() {
+  const lang = react.useContext(\u64CD\u4F5C\u90E8\u306E\u8A00\u8A9E);
+  return (key, values) => values ? \u5B57\u3092\u5DEE\u3057\u8FBC\u3080(CDL_TEXT[lang][key], values) : CDL_TEXT[lang][key];
+}
+function \u5B57({ k, v }) {
+  const \u5F15\u304F = use\u5B57\u5F15();
+  return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: \u5F15\u304F(k, v) });
+}
+function \u5B57\u306E\u898B\u51FA\u3057({
+  k,
+  v,
+  \u524D = ""
+}) {
+  const \u5F15\u304F = use\u5B57\u5F15();
+  return /* @__PURE__ */ jsxRuntime.jsx("title", { children: k === void 0 ? "" : `${\u524D}${\u5F15\u304F(k, v)}` });
+}
 function createInteractiveSignalsAccessor(diagram2, signals, formula, scroll) {
   const kindByInputId = /* @__PURE__ */ new Map();
   for (const inp of diagram2.inputs ?? []) {
@@ -1693,20 +1982,23 @@ function useInteractiveIntegration(diagram2, options = {}) {
     const readouts = diagram2.readouts ?? [];
     if (inputs.length === 0 && scrolls.length === 0 && formulasList.length === 0 && readouts.length === 0)
       return null;
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-root", "data-cdl-interactive-panel": "true", children: [
-      inputs.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-group", children: inputs.map((input) => /* @__PURE__ */ jsxRuntime.jsx(InputWidget, { input, signal: signals[input.id] }, input.id)) }),
-      formulasList.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-group", children: formulasList.map((f) => /* @__PURE__ */ jsxRuntime.jsx(
-        FormulaReadout,
-        {
-          id: f.id,
-          expression: f.expression,
-          value: stateOverrides[f.id]
-        },
-        f.id
-      )) }),
-      scrolls.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-group", children: scrolls.map((s) => /* @__PURE__ */ jsxRuntime.jsx(ScrollReadout, { id: s.id, progress: stateOverrides[s.id] }, s.id)) }),
-      readouts.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-group", children: readouts.map((r) => /* @__PURE__ */ jsxRuntime.jsx(ReadoutWidget, { readout: r, stateOverrides: mergedStateValues }, r.id)) })
-    ] });
+    return (
+      // 操作部の中の読み出しと入力欄へ、図の言語を届ける (#849)。 型の外の値は英語に落ちる
+      /* @__PURE__ */ jsxRuntime.jsx(\u64CD\u4F5C\u90E8\u306E\u8A00\u8A9E.Provider, { value: resolveLang(diagram2.lang), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-root", "data-cdl-interactive-panel": "true", children: [
+        inputs.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-group", children: inputs.map((input) => /* @__PURE__ */ jsxRuntime.jsx(InputWidget, { input, signal: signals[input.id] }, input.id)) }),
+        formulasList.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-group", children: formulasList.map((f) => /* @__PURE__ */ jsxRuntime.jsx(
+          FormulaReadout,
+          {
+            id: f.id,
+            expression: f.expression,
+            value: stateOverrides[f.id]
+          },
+          f.id
+        )) }),
+        scrolls.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-group", children: scrolls.map((s) => /* @__PURE__ */ jsxRuntime.jsx(ScrollReadout, { id: s.id, progress: stateOverrides[s.id] }, s.id)) }),
+        readouts.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-group", children: readouts.map((r) => /* @__PURE__ */ jsxRuntime.jsx(ReadoutWidget, { readout: r, stateOverrides: mergedStateValues }, r.id)) })
+      ] }) })
+    );
   }, [diagram2, signals, stateOverrides, mergedStateValues]);
   return { stateOverrides, panel, svgRef, containerRef };
 }
@@ -3567,7 +3859,7 @@ function SparklineReadout({
   if (points.length < 2) {
     return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-sparkline", "data-cdl-readout": id, children: [
       /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-sparkline-empty", style: { width: w, height: h }, children: points.length === 0 ? "waiting" : "\u2014" }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-sparkline-empty", style: { width: w, height: h }, children: points.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.sparkline.waiting" }) : "\u2014" }),
       /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-sparkline-value", children: Number.isFinite(value) ? value : "\u2014" })
     ] });
   }
@@ -3830,27 +4122,24 @@ function TimelineWidget({
           className: "cdl-ip-timeline-scrubber"
         }
       ),
-      /* @__PURE__ */ jsxRuntime.jsxs(
+      /* @__PURE__ */ jsxRuntime.jsx(
         "button",
         {
           type: "button",
           className: "cdl-ip-timeline-btn cdl-ip-timeline-speed",
           onClick: cycleSpeed,
           "aria-label": "speed",
-          children: [
-            speed,
-            "x"
-          ]
+          children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "input.timeline.speed", v: { speed } })
         }
       )
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "cdl-ip-timeline-time", children: [
-      (progress * (input.duration / 1e3)).toFixed(1),
-      "s /",
-      " ",
-      (input.duration / 1e3).toFixed(1),
-      "s"
-    ] })
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-timeline-time", children: /* @__PURE__ */ jsxRuntime.jsx(
+      \u5B57,
+      {
+        k: "input.timeline.time",
+        v: { t: (progress * (input.duration / 1e3)).toFixed(1), d: (input.duration / 1e3).toFixed(1) }
+      }
+    ) })
   ] });
 }
 function RangeWidget({
@@ -4088,7 +4377,7 @@ function ArrayBarReadout({
   const range = max - min || 1;
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-array-bar", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-array-bar-row", children: arr.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : arr.map((v, i) => {
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-array-bar-row", children: arr.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : arr.map((v, i) => {
       const h = Math.max(0, Math.min(1, (v - min) / range));
       return /* @__PURE__ */ jsxRuntime.jsx(
         "span",
@@ -4165,7 +4454,7 @@ function StackedBarReadout({
   const range = max - min || 1;
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-stacked-bar", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-stacked-bar-row", children: n === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : Array.from({ length: n }).map((_, i) => {
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-stacked-bar-row", children: n === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : Array.from({ length: n }).map((_, i) => {
       const va = arrA[i] ?? 0;
       const vb = arrB[i] ?? 0;
       const hA = Math.max(0, Math.min(1, (va - min) / range));
@@ -4260,7 +4549,7 @@ function MatrixReadout({
   };
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-matrix", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    rows === 0 || cols === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsx(
+    rows === 0 || cols === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsx(
       "svg",
       {
         className: "cdl-ip-readout-matrix-svg",
@@ -4318,7 +4607,7 @@ function ProgressGroupReadout({
   const labelArr = labels ? safeParseArray(labels).map(String) : [];
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-progress-group", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    arr.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "cdl-ip-readout-progress-group-list", children: arr.map((v, i) => {
+    arr.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "cdl-ip-readout-progress-group-list", children: arr.map((v, i) => {
       const pct = Math.max(0, Math.min(100, v / (max || 1) * 100));
       const rowLabel = labelArr[i] ?? String(i + 1);
       return /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "cdl-ip-readout-progress-group-row", children: [
@@ -4380,7 +4669,7 @@ function SequenceTimelineReadout({
   const xFor = (t) => pad + (Math.max(min, Math.min(max, t)) - min) / range * (viewW - pad * 2);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-sequence-timeline", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    events.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsxs(
+    events.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsxs(
       "svg",
       {
         className: "cdl-ip-readout-sequence-timeline-svg",
@@ -4394,7 +4683,7 @@ function SequenceTimelineReadout({
           events.map((e, i) => {
             const x = xFor(e.t);
             return /* @__PURE__ */ jsxRuntime.jsxs("g", { "data-cdl-event-marker": e.name, children: [
-              /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: x, cy: trackY, r: 5, fill: color, stroke: "#fff", strokeWidth: 1.5, children: /* @__PURE__ */ jsxRuntime.jsx("title", { children: `${e.name}: t=${e.t}` }) }),
+              /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: x, cy: trackY, r: 5, fill: color, stroke: "#fff", strokeWidth: 1.5, children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57\u306E\u898B\u51FA\u3057, { k: "readout.sequenceTimeline.title", v: { name: e.name, t: e.t } }) }),
               /* @__PURE__ */ jsxRuntime.jsx("text", { x, y: trackY - 12, textAnchor: sequenceLabelAnchor(x, e.name, 10, viewW), fontSize: 10, fill: "var(--v4-ink, #1a1f2a)", children: e.name }),
               /* @__PURE__ */ jsxRuntime.jsx("text", { x, y: trackY + 18, textAnchor: "middle", fontSize: 9, fill: "var(--v4-mute, #64748b)", children: e.t })
             ] }, i);
@@ -4437,7 +4726,7 @@ function RadarReadout({
   const polygon = points.length ? points.map((p) => `${p.x.toFixed(1)},${p.y.toFixed(1)}`).join(" ") : "";
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-radar", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    n === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsxs("svg", { className: "cdl-ip-readout-radar-svg", viewBox: `0 0 ${viewW} ${viewH}`, width: viewW, height: viewH, children: [
+    n === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsxs("svg", { className: "cdl-ip-readout-radar-svg", viewBox: `0 0 ${viewW} ${viewH}`, width: viewW, height: viewH, children: [
       [0.33, 0.66, 1].map((t) => /* @__PURE__ */ jsxRuntime.jsx(
         "polygon",
         {
@@ -4499,14 +4788,14 @@ function BubbleChartReadout({
   const maxCircleR = 18;
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-bubble-chart", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    bubbles.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsxs("svg", { className: "cdl-ip-readout-bubble-chart-svg", viewBox: `0 0 ${viewW} ${viewH}`, width: viewW, height: viewH, children: [
+    bubbles.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsxs("svg", { className: "cdl-ip-readout-bubble-chart-svg", viewBox: `0 0 ${viewW} ${viewH}`, width: viewW, height: viewH, children: [
       /* @__PURE__ */ jsxRuntime.jsx("line", { x1: pad, x2: viewW - pad, y1: viewH - pad, y2: viewH - pad, stroke: "rgba(148,163,184,0.4)" }),
       /* @__PURE__ */ jsxRuntime.jsx("line", { x1: pad, x2: pad, y1: pad, y2: viewH - pad, stroke: "rgba(148,163,184,0.4)" }),
       bubbles.map((b, i) => {
         const cx = pad + (Math.max(xMin, Math.min(xMax, b.x)) - xMin) / xRange * w;
         const cy = viewH - pad - (Math.max(yMin, Math.min(yMax, b.y)) - yMin) / yRange * h;
         const r = 4 + (Math.max(rMin, Math.min(rMax, b.r)) - rMin) / rRange * (maxCircleR - 4);
-        return /* @__PURE__ */ jsxRuntime.jsx("circle", { cx, cy, r, fill: color, fillOpacity: 0.35, stroke: color, strokeWidth: 1.5, children: /* @__PURE__ */ jsxRuntime.jsx("title", { children: `(${b.x}, ${b.y}) r=${b.r}` }) }, i);
+        return /* @__PURE__ */ jsxRuntime.jsx("circle", { cx, cy, r, fill: color, fillOpacity: 0.35, stroke: color, strokeWidth: 1.5, children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57\u306E\u898B\u51FA\u3057, { k: "readout.bubbleChart.title", v: { x: b.x, y: b.y, r: b.r } }) }, i);
       })
     ] })
   ] });
@@ -4529,7 +4818,7 @@ function DonutReadout({
   let acc = 0;
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-donut", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    arr.length === 0 || total === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsx("svg", { className: "cdl-ip-readout-donut-svg", viewBox: `0 0 ${viewW} ${viewH}`, width: viewW, height: viewH, children: arr.map((v, i) => {
+    arr.length === 0 || total === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsx("svg", { className: "cdl-ip-readout-donut-svg", viewBox: `0 0 ${viewW} ${viewH}`, width: viewW, height: viewH, children: arr.map((v, i) => {
       const from = acc;
       const to = acc + v / total;
       acc = to;
@@ -4590,7 +4879,7 @@ function CalendarHeatmapReadout({
           height: cellSize,
           rx: 2,
           fill,
-          children: /* @__PURE__ */ jsxRuntime.jsx("title", { children: `day ${i}: ${v}` })
+          children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57\u306E\u898B\u51FA\u3057, { k: "readout.calendarHeatmap.title", v: { i, v } })
         },
         i
       );
@@ -4710,7 +4999,7 @@ function CandlestickReadout({
   const candleW = candles.length === 0 ? 0 : Math.max(3, (w - (candles.length - 1) * 3) / candles.length);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-candlestick", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    candles.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsx("svg", { className: "cdl-ip-readout-candlestick-svg", viewBox: `0 0 ${viewW} ${viewH}`, width: viewW, height: viewH, children: candles.map((cd, i) => {
+    candles.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsx("svg", { className: "cdl-ip-readout-candlestick-svg", viewBox: `0 0 ${viewW} ${viewH}`, width: viewW, height: viewH, children: candles.map((cd, i) => {
       const cx = pad + i * (candleW + 3) + candleW / 2;
       const yHigh = yFor(cd.h);
       const yLow = yFor(cd.l);
@@ -4731,7 +5020,7 @@ function CandlestickReadout({
             height: bodyH,
             fill: isUp ? color : color,
             fillOpacity: isUp ? 1 : 0.85,
-            children: /* @__PURE__ */ jsxRuntime.jsx("title", { children: `O:${cd.o} H:${cd.h} L:${cd.l} C:${cd.c}` })
+            children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57\u306E\u898B\u51FA\u3057, { k: "readout.candlestick.title", v: { o: cd.o, h: cd.h, l: cd.l, c: cd.c } })
           }
         )
       ] }, i);
@@ -4765,7 +5054,7 @@ function VennReadout({
   const cxB = viewW / 2 + gap / 2;
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-venn", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    sizeA === 0 && sizeB === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsxs("svg", { className: "cdl-ip-readout-venn-svg", viewBox: `0 0 ${viewW} ${viewH}`, width: viewW, height: viewH, children: [
+    sizeA === 0 && sizeB === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsxs("svg", { className: "cdl-ip-readout-venn-svg", viewBox: `0 0 ${viewW} ${viewH}`, width: viewW, height: viewH, children: [
       /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: cxA, cy, r: rA, fill: colorA, fillOpacity: 0.4, stroke: colorA, strokeWidth: 1.5 }),
       /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: cxB, cy, r: rB, fill: colorB, fillOpacity: 0.4, stroke: colorB, strokeWidth: 1.5 }),
       /* @__PURE__ */ jsxRuntime.jsx("text", { x: cxA - rA + 8, y: cy - 4, fontSize: 11, fill: "var(--v4-ink, #1a1f2a)", fontWeight: 600, children: labelA }),
@@ -4816,11 +5105,11 @@ function SlopeReadout({
   const yFor = (v) => pad + (1 - (Math.max(min, Math.min(max, v)) - min) / range) * h;
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-slope", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    slopes.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsxs("svg", { className: "cdl-ip-readout-slope-svg", viewBox: `0 0 ${viewW} ${viewH}`, width: viewW, height: viewH, children: [
+    slopes.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsxs("svg", { className: "cdl-ip-readout-slope-svg", viewBox: `0 0 ${viewW} ${viewH}`, width: viewW, height: viewH, children: [
       /* @__PURE__ */ jsxRuntime.jsx("line", { x1: xL, x2: xL, y1: pad - 4, y2: viewH - pad + 4, stroke: "rgba(148,163,184,0.4)" }),
       /* @__PURE__ */ jsxRuntime.jsx("line", { x1: xR, x2: xR, y1: pad - 4, y2: viewH - pad + 4, stroke: "rgba(148,163,184,0.4)" }),
-      /* @__PURE__ */ jsxRuntime.jsx("text", { x: xL, y: viewH - 4, fontSize: 9, textAnchor: "middle", fill: "var(--v4-mute, #64748b)", children: "before" }),
-      /* @__PURE__ */ jsxRuntime.jsx("text", { x: xR, y: viewH - 4, fontSize: 9, textAnchor: "middle", fill: "var(--v4-mute, #64748b)", children: "after" }),
+      /* @__PURE__ */ jsxRuntime.jsx("text", { x: xL, y: viewH - 4, fontSize: 9, textAnchor: "middle", fill: "var(--v4-mute, #64748b)", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.slope.before" }) }),
+      /* @__PURE__ */ jsxRuntime.jsx("text", { x: xR, y: viewH - 4, fontSize: 9, textAnchor: "middle", fill: "var(--v4-mute, #64748b)", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.slope.after" }) }),
       slopes.map((s, i) => {
         const yB = yFor(s.before);
         const yA = yFor(s.after);
@@ -4867,7 +5156,7 @@ function FunnelReadout({
   const [bR, bG, bB] = hexToRgb(colorBottom);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-funnel", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    stages.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsx("svg", { className: "cdl-ip-readout-funnel-svg", viewBox: `0 0 ${viewW} ${viewH}`, width: viewW, height: viewH, children: stages.map((s, i) => {
+    stages.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsx("svg", { className: "cdl-ip-readout-funnel-svg", viewBox: `0 0 ${viewW} ${viewH}`, width: viewW, height: viewH, children: stages.map((s, i) => {
       const ratio = i / Math.max(1, stages.length - 1);
       const w = maxCount > 0 ? s.count / maxCount * (viewW - 12) : 0;
       const yTop = i * stageH + 2;
@@ -4929,7 +5218,7 @@ function GanttReadout({
   const xFor = (v) => labelW + (Math.max(min, Math.min(max, v)) - min) / range * (viewW - labelW - pad);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-gantt", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    tasks.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsx("svg", { className: "cdl-ip-readout-gantt-svg", viewBox: `0 0 ${viewW} ${viewH}`, width: viewW, height: viewH, children: tasks.map((t, i) => {
+    tasks.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsx("svg", { className: "cdl-ip-readout-gantt-svg", viewBox: `0 0 ${viewW} ${viewH}`, width: viewW, height: viewH, children: tasks.map((t, i) => {
       const y = pad + i * rowH;
       const x1 = xFor(t.start);
       const x2 = xFor(t.start + t.duration);
@@ -5020,7 +5309,7 @@ function TreemapReadout({
   }
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-treemap", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    rects.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsx("svg", { className: "cdl-ip-readout-treemap-svg", viewBox: `0 0 ${viewW} ${viewH}`, width: viewW, height: viewH, children: rects.map((r, i) => /* @__PURE__ */ jsxRuntime.jsxs("g", { children: [
+    rects.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsx("svg", { className: "cdl-ip-readout-treemap-svg", viewBox: `0 0 ${viewW} ${viewH}`, width: viewW, height: viewH, children: rects.map((r, i) => /* @__PURE__ */ jsxRuntime.jsxs("g", { children: [
       /* @__PURE__ */ jsxRuntime.jsx("rect", { x: r.x + 1, y: r.y + 1, width: Math.max(0, r.w - 2), height: Math.max(0, r.h - 2), fill: colors[i % colors.length] ?? "#94a3b8", rx: 2, children: /* @__PURE__ */ jsxRuntime.jsx("title", { children: `${r.name}: ${r.size}` }) }),
       r.w > 40 && r.h > 20 ? /* @__PURE__ */ jsxRuntime.jsx("text", { x: r.x + 6, y: r.y + 14, fontSize: 10, fill: "#fff", fontWeight: 600, children: r.name }) : null
     ] }, i)) })
@@ -5086,7 +5375,7 @@ function SankeyReadout({
   const rightUsed = {};
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-sankey", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    flows.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsxs("svg", { className: "cdl-ip-readout-sankey-svg", viewBox: `0 0 ${viewW} ${viewH}`, width: viewW, height: viewH, children: [
+    flows.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsxs("svg", { className: "cdl-ip-readout-sankey-svg", viewBox: `0 0 ${viewW} ${viewH}`, width: viewW, height: viewH, children: [
       leftNodes.map((n, i) => {
         const p = leftPos[n.name];
         return /* @__PURE__ */ jsxRuntime.jsxs("g", { children: [
@@ -5148,7 +5437,7 @@ function PolarAreaReadout({
   const maxR = Math.min(cx, cy) - 20;
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-polar-area", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    n === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsxs("svg", { className: "cdl-ip-readout-polar-area-svg", viewBox: `0 0 ${viewW} ${viewH}`, width: viewW, height: viewH, children: [
+    n === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsxs("svg", { className: "cdl-ip-readout-polar-area-svg", viewBox: `0 0 ${viewW} ${viewH}`, width: viewW, height: viewH, children: [
       [0.33, 0.66, 1].map((t) => /* @__PURE__ */ jsxRuntime.jsx("circle", { cx, cy, r: maxR * t, fill: "none", stroke: "rgba(148,163,184,0.2)", strokeWidth: 1 }, t)),
       arr.map((v, i) => {
         const ratio = Math.sqrt(Math.max(0, Math.min(max, v)) / (max || 1));
@@ -5194,7 +5483,7 @@ function StepIndicatorReadout({
   const cy = viewH / 2 - 2;
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-step-indicator", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    n === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsxs("svg", { className: "cdl-ip-readout-step-indicator-svg", viewBox: `0 0 ${viewW} ${viewH}`, width: viewW, height: viewH, children: [
+    n === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsxs("svg", { className: "cdl-ip-readout-step-indicator-svg", viewBox: `0 0 ${viewW} ${viewH}`, width: viewW, height: viewH, children: [
       n > 1 ? Array.from({ length: n - 1 }).map((_, i) => {
         const x1 = pad + i * step;
         const x2 = pad + (i + 1) * step;
@@ -5284,8 +5573,8 @@ function BulletChartReadout({
       /* @__PURE__ */ jsxRuntime.jsx("rect", { x: pad, y: pad, width: badX - pad, height: trackH, fill: "rgba(239,68,68,0.25)", rx: 2 }),
       /* @__PURE__ */ jsxRuntime.jsx("rect", { x: badX, y: pad, width: avgX - badX, height: trackH, fill: "rgba(234,179,8,0.25)" }),
       /* @__PURE__ */ jsxRuntime.jsx("rect", { x: avgX, y: pad, width: pad + w - avgX, height: trackH, fill: "rgba(34,197,94,0.25)" }),
-      /* @__PURE__ */ jsxRuntime.jsx("rect", { x: pad, y: pad + trackH * 0.3, width: actualX - pad, height: trackH * 0.4, fill: colorActual, rx: 2, children: /* @__PURE__ */ jsxRuntime.jsx("title", { children: `actual: ${safeActual}` }) }),
-      /* @__PURE__ */ jsxRuntime.jsx("line", { x1: targetX, x2: targetX, y1: pad - 2, y2: pad + trackH + 2, stroke: "#0f172a", strokeWidth: 2, children: /* @__PURE__ */ jsxRuntime.jsx("title", { children: `target: ${safeTarget}` }) })
+      /* @__PURE__ */ jsxRuntime.jsx("rect", { x: pad, y: pad + trackH * 0.3, width: actualX - pad, height: trackH * 0.4, fill: colorActual, rx: 2, children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57\u306E\u898B\u51FA\u3057, { k: "readout.bulletChart.actual", v: { v: safeActual } }) }),
+      /* @__PURE__ */ jsxRuntime.jsx("line", { x1: targetX, x2: targetX, y1: pad - 2, y2: pad + trackH + 2, stroke: "#0f172a", strokeWidth: 2, children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57\u306E\u898B\u51FA\u3057, { k: "readout.bulletChart.target", v: { v: safeTarget } }) })
     ] })
   ] });
 }
@@ -5340,7 +5629,7 @@ function LeaderboardReadout({
   const medals = ["#eab308", "#94a3b8", "#c2410c"];
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-leaderboard", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    sorted.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsx("ol", { className: "cdl-ip-readout-leaderboard-list", children: sorted.map((it, i) => {
+    sorted.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsx("ol", { className: "cdl-ip-readout-leaderboard-list", children: sorted.map((it, i) => {
       const pct = topMax > 0 ? it.value / topMax * 100 : 0;
       const rankColor = i < medals.length ? medals[i] : "#cbd5e1";
       return /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "cdl-ip-readout-leaderboard-row", children: [
@@ -5391,7 +5680,7 @@ function TrafficLightReadout({
             style: {
               filter: isActive ? `drop-shadow(0 0 6px ${colors[i]})` : void 0
             },
-            children: /* @__PURE__ */ jsxRuntime.jsx("title", { children: isActive ? ["red", "yellow", "green"][i] : "" })
+            children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57\u306E\u898B\u51FA\u3057, { k: isActive ? ["readout.trafficLight.red", "readout.trafficLight.yellow", "readout.trafficLight.green"][i] : void 0 })
           },
           i
         );
@@ -5430,7 +5719,7 @@ function TagCloudReadout({
   const sizeFor = (w) => minSize + (w - minW) / range * (maxSize - minSize);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-tag-cloud", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    tags.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-tag-cloud-list", children: tags.map((t, i) => /* @__PURE__ */ jsxRuntime.jsx(
+    tags.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-tag-cloud-list", children: tags.map((t, i) => /* @__PURE__ */ jsxRuntime.jsx(
       "span",
       {
         className: "cdl-ip-readout-tag-cloud-tag",
@@ -5467,7 +5756,7 @@ function ActivityFeedReadout({
   const shown = events.slice(0, max);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-activity-feed", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    shown.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "cdl-ip-readout-activity-feed-list", children: shown.map((e, i) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "cdl-ip-readout-activity-feed-row", children: [
+    shown.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "cdl-ip-readout-activity-feed-list", children: shown.map((e, i) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "cdl-ip-readout-activity-feed-row", children: [
       /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-activity-feed-bullet", style: { background: color } }),
       /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "cdl-ip-readout-activity-feed-content", children: [
         /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-activity-feed-actor", children: e.actor }),
@@ -5518,7 +5807,7 @@ function RatingReadout({
                   strokeWidth: 1
                 }
               ),
-              isEmpty ? /* @__PURE__ */ jsxRuntime.jsx("title", { children: `${i + 1}: empty` }) : /* @__PURE__ */ jsxRuntime.jsx("title", { children: `${i + 1}: ${isFull ? "full" : "half"}` })
+              isEmpty ? /* @__PURE__ */ jsxRuntime.jsx(\u5B57\u306E\u898B\u51FA\u3057, { \u524D: `${i + 1}: `, k: "readout.rating.empty" }) : /* @__PURE__ */ jsxRuntime.jsx(\u5B57\u306E\u898B\u51FA\u3057, { \u524D: `${i + 1}: `, k: isFull ? "readout.rating.full" : "readout.rating.half" })
             ]
           },
           i
@@ -5614,7 +5903,7 @@ function ChatBubbleReadout({
   const shown = messages.slice(0, max);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-chat-bubble", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    shown.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "cdl-ip-readout-chat-bubble-list", children: shown.map((m, i) => /* @__PURE__ */ jsxRuntime.jsx(
+    shown.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "cdl-ip-readout-chat-bubble-list", children: shown.map((m, i) => /* @__PURE__ */ jsxRuntime.jsx(
       "li",
       {
         className: `cdl-ip-readout-chat-bubble-row ${m.isSelf ? "self" : "other"}`,
@@ -5706,7 +5995,7 @@ function ChecklistReadout({
   const pct = items.length === 0 ? 0 : Math.round(done / items.length * 100);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-checklist", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    items.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    items.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-readout-checklist-progress", children: [
         /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "cdl-ip-readout-checklist-progress-text", children: [
           done,
@@ -5817,11 +6106,7 @@ function PriceTagReadout({
         "%"
       ] }) : null
     ] }),
-    savings > 0 ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "cdl-ip-readout-price-tag-savings", children: [
-      "You save ",
-      currency,
-      savings
-    ] }) : null
+    savings > 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-price-tag-savings", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.priceTag.save", v: { amount: `${currency}${savings}` } }) }) : null
   ] });
 }
 function SpinnerReadout({
@@ -5958,6 +6243,11 @@ function StopwatchReadout({
     }
   );
 }
+var \u78BA\u4FE1\u5EA6\u306E\u5E2F\u306E\u5B57 = {
+  low: "readout.confidence.low",
+  mid: "readout.confidence.mid",
+  high: "readout.confidence.high"
+};
 function ConfidenceMeterReadout({
   id,
   label,
@@ -5990,7 +6280,7 @@ function ConfidenceMeterReadout({
         Math.round(safeValue),
         "%"
       ] }),
-      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-confidence-meter-band", style: { color: bandColor }, children: bandLabel })
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-confidence-meter-band", style: { color: bandColor }, children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: \u78BA\u4FE1\u5EA6\u306E\u5E2F\u306E\u5B57[bandLabel] }) })
     ] }),
     /* @__PURE__ */ jsxRuntime.jsxs("svg", { className: "cdl-ip-readout-confidence-meter-svg", viewBox: `0 0 ${viewW} ${viewH}`, width: viewW, height: viewH, children: [
       /* @__PURE__ */ jsxRuntime.jsx("rect", { x: pad, y: pad, width: lowX - pad, height: h, fill: "rgba(239,68,68,0.2)", rx: 2 }),
@@ -6025,7 +6315,7 @@ function ReactionBarReadout({
   }
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-reaction-bar", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    reactions.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-reaction-bar-row", children: reactions.map((r, i) => /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "cdl-ip-readout-reaction-bar-pill", style: { borderColor: color }, children: [
+    reactions.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-reaction-bar-row", children: reactions.map((r, i) => /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "cdl-ip-readout-reaction-bar-pill", style: { borderColor: color }, children: [
       /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-reaction-bar-emoji", children: r.emoji }),
       /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-reaction-bar-count", style: { color }, children: r.count })
     ] }, i)) })
@@ -6058,7 +6348,7 @@ function PillGroupReadout({
   }
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-pill-group", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    pills.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-pill-group-row", children: pills.map((p, i) => /* @__PURE__ */ jsxRuntime.jsx(
+    pills.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-pill-group-row", children: pills.map((p, i) => /* @__PURE__ */ jsxRuntime.jsx(
       "span",
       {
         className: "cdl-ip-readout-pill-group-pill",
@@ -6146,7 +6436,7 @@ function MetricsGridReadout({
   }
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-metrics-grid", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    items.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-metrics-grid-grid", children: items.map((m, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-readout-metrics-grid-cell", children: [
+    items.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-metrics-grid-grid", children: items.map((m, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-readout-metrics-grid-cell", children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-readout-metrics-grid-value", style: { color }, children: [
         m.value,
         m.unit ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "cdl-ip-readout-metrics-grid-unit", children: [
@@ -6233,7 +6523,7 @@ function IconTileReadout({
   }
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-icon-tile", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    tiles.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-icon-tile-row", children: tiles.map((t, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-readout-icon-tile-cell", children: [
+    tiles.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-icon-tile-row", children: tiles.map((t, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-readout-icon-tile-cell", children: [
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-icon-tile-icon", style: { background: color }, children: t.icon }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-readout-icon-tile-content", children: [
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-icon-tile-value", children: t.value }),
@@ -6274,7 +6564,7 @@ function TokenListReadout({
   }
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-token-list", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    tokens.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "cdl-ip-readout-token-list-items", children: tokens.map((t, i) => {
+    tokens.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "cdl-ip-readout-token-list-items", children: tokens.map((t, i) => {
       const isUp = t.delta >= 0;
       const deltaColor = isUp ? colorUp : colorDown;
       const arrow = isUp ? "\u25B2" : "\u25BC";
@@ -6328,7 +6618,7 @@ function MapPinReadout({
   const yFor = (v) => pad + (Math.max(yMin, Math.min(yMax, v)) - yMin) / yRange * (viewH - pad * 2);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-map-pin", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    pins.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsxs("svg", { className: "cdl-ip-readout-map-pin-svg", viewBox: `0 0 ${viewW} ${viewH}`, width: viewW, height: viewH, children: [
+    pins.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsxs("svg", { className: "cdl-ip-readout-map-pin-svg", viewBox: `0 0 ${viewW} ${viewH}`, width: viewW, height: viewH, children: [
       /* @__PURE__ */ jsxRuntime.jsx("rect", { x: 0, y: 0, width: viewW, height: viewH, fill: "rgba(148,163,184,0.08)", stroke: "rgba(148,163,184,0.3)", strokeWidth: 1, rx: 4 }),
       [0.25, 0.5, 0.75].map((t) => /* @__PURE__ */ jsxRuntime.jsxs("g", { children: [
         /* @__PURE__ */ jsxRuntime.jsx("line", { x1: pad + (viewW - pad * 2) * t, x2: pad + (viewW - pad * 2) * t, y1: pad, y2: viewH - pad, stroke: "rgba(148,163,184,0.15)" }),
@@ -6356,9 +6646,9 @@ function PriorityBadgeReadout({
   if (p === "high" || p === "2") level = "high";
   else if (p === "low" || p === "0") level = "low";
   const spec = {
-    high: { icon: "\u25B2", color: "#ef4444", bg: "rgba(239,68,68,0.12)", text: "HIGH" },
-    med: { icon: "\u25CF", color: "#eab308", bg: "rgba(234,179,8,0.12)", text: "MED" },
-    low: { icon: "\u25BC", color: "#64748b", bg: "rgba(100,116,139,0.12)", text: "LOW" }
+    high: { icon: "\u25B2", color: "#ef4444", bg: "rgba(239,68,68,0.12)", text: "readout.priority.high" },
+    med: { icon: "\u25CF", color: "#eab308", bg: "rgba(234,179,8,0.12)", text: "readout.priority.med" },
+    low: { icon: "\u25BC", color: "#64748b", bg: "rgba(100,116,139,0.12)", text: "readout.priority.low" }
   };
   const cur = spec[level];
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-priority-badge", "data-cdl-readout": id, "data-cdl-priority": level, children: [
@@ -6371,7 +6661,7 @@ function PriorityBadgeReadout({
           style: { background: cur.bg, borderColor: cur.color, color: cur.color },
           children: [
             /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-priority-badge-icon", children: cur.icon }),
-            /* @__PURE__ */ jsxRuntime.jsx("span", { children: cur.text })
+            /* @__PURE__ */ jsxRuntime.jsx("span", { children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: cur.text }) })
           ]
         }
       ),
@@ -6410,7 +6700,7 @@ function PodiumReadout({
   const order = [1, 0, 2];
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-podium", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    podium.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsx("svg", { className: "cdl-ip-readout-podium-svg", viewBox: `0 0 ${viewW} ${viewH}`, width: viewW, height: viewH, children: order.map((rankIdx, colIdx) => {
+    podium.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsx("svg", { className: "cdl-ip-readout-podium-svg", viewBox: `0 0 ${viewW} ${viewH}`, width: viewW, height: viewH, children: order.map((rankIdx, colIdx) => {
       const w = podium[rankIdx];
       if (!w) return null;
       const x = pad + colIdx * (colW + pad);
@@ -6453,7 +6743,7 @@ function PollBarReadout({
   const maxCount = options.length ? Math.max(...options.map((o) => o.count)) : 0;
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-poll-bar", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    options.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "cdl-ip-readout-poll-bar-list", children: options.map((o, i) => {
+    options.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "cdl-ip-readout-poll-bar-list", children: options.map((o, i) => {
       const pct = Math.round(o.count / total * 100);
       const isWinner = o.count === maxCount && maxCount > 0;
       const fillColor = isWinner ? colorWinner : color;
@@ -6488,6 +6778,7 @@ function UserStackReadout({
   max,
   size
 }) {
+  const \u5F15\u304F = use\u5B57\u5F15();
   const names = safeParseArray(value).map(String);
   const shown = names.slice(0, max);
   const overflow = names.length > max;
@@ -6496,7 +6787,7 @@ function UserStackReadout({
   const initialsOf = (name) => name.split(/\s+/).filter(Boolean).slice(0, 2).map((w) => w[0]?.toUpperCase() ?? "").join("") || "?";
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-user-stack", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    shown.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-readout-user-stack-row", children: [
+    shown.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-readout-user-stack-row", children: [
       shown.map((name, i) => /* @__PURE__ */ jsxRuntime.jsx(
         "span",
         {
@@ -6524,7 +6815,7 @@ function UserStackReadout({
             fontSize: `${Math.round(size * 0.35)}px`,
             marginLeft: `-${size * 0.3}px`
           },
-          title: `+${overflowCount} more`,
+          title: \u5F15\u304F("readout.more", { n: overflowCount }),
           children: [
             "+",
             overflowCount
@@ -6559,7 +6850,7 @@ function CommitListReadout({
   const shown = commits.slice(0, max);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-commit-list", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    shown.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "cdl-ip-readout-commit-list-items", children: shown.map((c, i) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "cdl-ip-readout-commit-list-row", children: [
+    shown.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "cdl-ip-readout-commit-list-items", children: shown.map((c, i) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "cdl-ip-readout-commit-list-row", children: [
       /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-commit-list-sha", style: { color }, children: c.sha }),
       /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-commit-list-msg", children: c.msg }),
       /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-commit-list-author", children: c.author })
@@ -6639,7 +6930,7 @@ function EventLogReadout({
   };
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-event-log", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    shown.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "cdl-ip-readout-event-log-items", children: shown.map((e, i) => {
+    shown.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "cdl-ip-readout-event-log-items", children: shown.map((e, i) => {
       const spec = severitySpec[e.severity] ?? severitySpec.info;
       return /* @__PURE__ */ jsxRuntime.jsxs(
         "li",
@@ -6682,7 +6973,7 @@ function SearchResultReadout({
   const shown = hits.slice(0, max);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-search-result", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    shown.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "cdl-ip-readout-search-result-items", children: shown.map((h, i) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "cdl-ip-readout-search-result-row", children: [
+    shown.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "cdl-ip-readout-search-result-items", children: shown.map((h, i) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "cdl-ip-readout-search-result-row", children: [
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-search-result-title", style: { color }, children: h.title }),
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-search-result-snippet", children: h.snippet }),
       h.url ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-search-result-url", children: h.url }) : null
@@ -6715,7 +7006,7 @@ function RoadmapReadout({
   const colors = ["#2563eb", "#22c55e", "#eab308", "#a855f7"];
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-roadmap", "data-cdl-readout": id, style: { minWidth: `${viewW}px` }, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    quarters.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-roadmap-row", style: { minHeight: `${viewH}px` }, children: quarters.map((q, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-readout-roadmap-column", children: [
+    quarters.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-roadmap-row", style: { minHeight: `${viewH}px` }, children: quarters.map((q, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-readout-roadmap-column", children: [
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-roadmap-header", style: { background: colors[i % colors.length] }, children: q.quarter }),
       /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "cdl-ip-readout-roadmap-items", children: q.items.map((it, j) => /* @__PURE__ */ jsxRuntime.jsx("li", { className: "cdl-ip-readout-roadmap-item", children: it }, j)) })
     ] }, i)) })
@@ -6747,7 +7038,7 @@ function WeatherForecastReadout({
   }
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-weather-forecast", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    days.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-weather-forecast-row", children: days.map((d, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-readout-weather-forecast-day", children: [
+    days.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-weather-forecast-row", children: days.map((d, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-readout-weather-forecast-day", children: [
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-weather-forecast-name", children: d.day }),
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-weather-forecast-icon", children: d.icon }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-readout-weather-forecast-high", children: [
@@ -6791,17 +7082,14 @@ function VideoCardReadout({
   const shown = videos.slice(0, max);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-video-card", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    shown.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "cdl-ip-readout-video-card-list", children: shown.map((v, i) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "cdl-ip-readout-video-card-row", children: [
+    shown.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "cdl-ip-readout-video-card-list", children: shown.map((v, i) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "cdl-ip-readout-video-card-row", children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-readout-video-card-thumb", style: { background: color }, children: [
         /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-video-card-thumb-icon", children: v.emoji }),
         /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-video-card-duration", children: v.duration })
       ] }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-readout-video-card-info", children: [
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-video-card-title", children: v.title }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-readout-video-card-views", children: [
-          v.views,
-          " views"
-        ] })
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-video-card-views", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.videoCard.views", v: { v: v.views } }) })
       ] })
     ] }, i)) })
   ] });
@@ -6818,7 +7106,7 @@ function OrderStatusReadout({
   const safeCurrent = Number.isFinite(current) ? Math.max(0, Math.min(stepArr.length - 1, Math.round(current))) : 0;
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-order-status", "data-cdl-readout": id, "data-cdl-step": safeCurrent, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    stepArr.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "cdl-ip-readout-order-status-list", children: stepArr.map((s, i) => {
+    stepArr.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "cdl-ip-readout-order-status-list", children: stepArr.map((s, i) => {
       const isDone = i < safeCurrent;
       const isCurrent = i === safeCurrent;
       const isPending = i > safeCurrent;
@@ -6868,9 +7156,9 @@ function AttendanceGridReadout({
   const memberArr = safeParseArray(members).map(String);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-attendance-grid", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    rows.length === 0 || memberArr.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsxs("table", { className: "cdl-ip-readout-attendance-grid-table", children: [
+    rows.length === 0 || memberArr.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsxs("table", { className: "cdl-ip-readout-attendance-grid-table", children: [
       /* @__PURE__ */ jsxRuntime.jsx("thead", { children: /* @__PURE__ */ jsxRuntime.jsxs("tr", { children: [
-        /* @__PURE__ */ jsxRuntime.jsx("th", { className: "cdl-ip-readout-attendance-grid-corner", children: "day" }),
+        /* @__PURE__ */ jsxRuntime.jsx("th", { className: "cdl-ip-readout-attendance-grid-corner", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.attendance.corner" }) }),
         memberArr.map((m, i) => /* @__PURE__ */ jsxRuntime.jsx("th", { className: "cdl-ip-readout-attendance-grid-member", children: m }, i))
       ] }) }),
       /* @__PURE__ */ jsxRuntime.jsx("tbody", { children: rows.map((r, i) => /* @__PURE__ */ jsxRuntime.jsxs("tr", { children: [
@@ -6924,7 +7212,7 @@ function TimezoneClockReadout({
   }
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-timezone-clock", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    clocks.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-timezone-clock-row", children: clocks.map((c, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-readout-timezone-clock-cell", children: [
+    clocks.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-timezone-clock-row", children: clocks.map((c, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-readout-timezone-clock-cell", children: [
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-timezone-clock-city", children: c.city }),
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-timezone-clock-time", style: { color }, children: c.time }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-readout-timezone-clock-offset", children: [
@@ -6958,7 +7246,7 @@ function FormSummaryReadout({
   }
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-form-summary", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    fields.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsx("dl", { className: "cdl-ip-readout-form-summary-list", children: fields.map((f, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-readout-form-summary-row", children: [
+    fields.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsx("dl", { className: "cdl-ip-readout-form-summary-list", children: fields.map((f, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-readout-form-summary-row", children: [
       /* @__PURE__ */ jsxRuntime.jsx("dt", { className: "cdl-ip-readout-form-summary-key", children: f.name }),
       /* @__PURE__ */ jsxRuntime.jsx("dd", { className: "cdl-ip-readout-form-summary-value", style: { color }, children: f.value })
     ] }, i)) })
@@ -6991,7 +7279,7 @@ function SongQueueReadout({
   const safeCurrent = Number.isFinite(current) ? Math.round(current) : -1;
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-song-queue", "data-cdl-readout": id, "data-cdl-current": safeCurrent, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    shown.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsx("ol", { className: "cdl-ip-readout-song-queue-list", children: shown.map((s, i) => {
+    shown.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsx("ol", { className: "cdl-ip-readout-song-queue-list", children: shown.map((s, i) => {
       const isCurrent = i === safeCurrent;
       return /* @__PURE__ */ jsxRuntime.jsxs(
         "li",
@@ -7036,12 +7324,20 @@ function CalendarMonthReadout({
     } catch {
     }
   }
-  const weekDays = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
+  const weekDays = [
+    "readout.weekday.0",
+    "readout.weekday.1",
+    "readout.weekday.2",
+    "readout.weekday.3",
+    "readout.weekday.4",
+    "readout.weekday.5",
+    "readout.weekday.6"
+  ];
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-calendar-month", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    days.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-readout-calendar-month-widget", children: [
+    days.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-readout-calendar-month-widget", children: [
       monthName ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-calendar-month-header", children: monthName }) : null,
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-calendar-month-weekdays", children: weekDays.map((w) => /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-calendar-month-weekday", children: w }, w)) }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-calendar-month-weekdays", children: weekDays.map((w) => /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-calendar-month-weekday", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: w }) }, w)) }),
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-readout-calendar-month-grid", children: days.map((d, i) => /* @__PURE__ */ jsxRuntime.jsxs(
         "div",
         {
@@ -7084,7 +7380,7 @@ function TerminalReadout({
   const shown = lines.slice(0, max);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-terminal", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
-    shown.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: "empty" }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-readout-terminal-window", children: [
+    shown.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-array-bar-empty", children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.empty" }) }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-readout-terminal-window", children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-readout-terminal-titlebar", children: [
         /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-terminal-dot", style: { background: "#ef4444" } }),
         /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-readout-terminal-dot", style: { background: "#eab308" } }),
@@ -7183,10 +7479,11 @@ function KanbanBoardReadout({
   columnWidth,
   max
 }) {
+  const \u5F15\u304F = use\u5B57\u5F15();
   const buckets = {
-    todo: { key: "todo", label: "Todo", color: "#94a3b8", tasks: [] },
-    inprogress: { key: "inprogress", label: "In Progress", color: "#2563eb", tasks: [] },
-    done: { key: "done", label: "Done", color: "#22c55e", tasks: [] }
+    todo: { key: "todo", label: \u5F15\u304F("readout.kanban.todo"), color: "#94a3b8", tasks: [] },
+    inprogress: { key: "inprogress", label: \u5F15\u304F("readout.kanban.inprogress"), color: "#2563eb", tasks: [] },
+    done: { key: "done", label: \u5F15\u304F("readout.kanban.done"), color: "#22c55e", tasks: [] }
   };
   const trimmed = value.trim();
   if (trimmed.startsWith("[") && trimmed.endsWith("]")) {
@@ -7297,13 +7594,13 @@ function KanbanBoardReadout({
                     style: { userSelect: "none" },
                     children: [
                       /* @__PURE__ */ jsxRuntime.jsx("title", { children: task.title }),
-                      task.title.length > 18 ? `${task.title.slice(0, 17)}\u2026` : task.title
+                      \u6841\u3067\u7701\u304F(task.title, 18)
                     ]
                   }
                 )
               ] }, ti);
             }),
-            overflow > 0 ? /* @__PURE__ */ jsxRuntime.jsxs(
+            overflow > 0 ? /* @__PURE__ */ jsxRuntime.jsx(
               "text",
               {
                 x: x + columnWidth / 2,
@@ -7312,11 +7609,7 @@ function KanbanBoardReadout({
                 textAnchor: "middle",
                 fill: "#64748b",
                 style: { userSelect: "none" },
-                children: [
-                  "+",
-                  overflow,
-                  " more"
-                ]
+                children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.more", v: { n: overflow } })
               }
             ) : null
           ] }, k);
@@ -7438,7 +7731,7 @@ function TimelineVerticalReadout({
                   style: { userSelect: "none" },
                   children: [
                     /* @__PURE__ */ jsxRuntime.jsx("title", { children: ev.title }),
-                    ev.title.length > 38 ? `${ev.title.slice(0, 37)}\u2026` : ev.title
+                    \u6841\u3067\u7701\u304F(ev.title, 38)
                   ]
                 }
               ),
@@ -7452,7 +7745,7 @@ function TimelineVerticalReadout({
                   style: { userSelect: "none" },
                   children: [
                     /* @__PURE__ */ jsxRuntime.jsx("title", { children: ev.description }),
-                    ev.description.length > 44 ? `${ev.description.slice(0, 43)}\u2026` : ev.description
+                    \u6841\u3067\u7701\u304F(ev.description, 44)
                   ]
                 }
               ) : null
@@ -7795,7 +8088,7 @@ function StepProgressReadout({
                   style: { userSelect: "none" },
                   children: [
                     /* @__PURE__ */ jsxRuntime.jsx("title", { children: s }),
-                    s.length > 10 ? `${s.slice(0, 9)}\u2026` : s
+                    \u6841\u3067\u7701\u304F(s, 10)
                   ]
                 }
               )
@@ -7856,7 +8149,7 @@ function UserPresenceReadout({
                   fontWeight: 500,
                   fill: "#0f172a",
                   style: { userSelect: "none" },
-                  children: u.name.length > 24 ? `${u.name.slice(0, 23)}\u2026` : u.name
+                  children: \u6841\u3067\u7701\u304F(u.name, 24)
                 }
               ),
               /* @__PURE__ */ jsxRuntime.jsx(
@@ -7873,7 +8166,7 @@ function UserPresenceReadout({
               )
             ] }, i);
           }),
-          overflow > 0 ? /* @__PURE__ */ jsxRuntime.jsxs(
+          overflow > 0 ? /* @__PURE__ */ jsxRuntime.jsx(
             "text",
             {
               x: width / 2,
@@ -7882,11 +8175,7 @@ function UserPresenceReadout({
               textAnchor: "middle",
               fill: "#64748b",
               style: { userSelect: "none" },
-              children: [
-                "+",
-                overflow,
-                " more"
-              ]
+              children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.more", v: { n: overflow } })
             }
           ) : null
         ]
@@ -7937,12 +8226,7 @@ function RatingThumbReadout({
             "\u25B2 ",
             upCount
           ] }),
-          /* @__PURE__ */ jsxRuntime.jsxs("text", { x: width / 2, y: 20, fontSize: 11, textAnchor: "middle", fill: "#64748b", style: { userSelect: "none" }, children: [
-            upPct,
-            "% up \xB7 ",
-            total,
-            " votes"
-          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx("text", { x: width / 2, y: 20, fontSize: 11, textAnchor: "middle", fill: "#64748b", style: { userSelect: "none" }, children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.ratingThumb.summary", v: { pct: upPct, total } }) }),
           /* @__PURE__ */ jsxRuntime.jsxs(
             "text",
             {
@@ -8027,7 +8311,7 @@ function OrgChartMiniReadout({
                   style: { userSelect: "none" },
                   children: [
                     /* @__PURE__ */ jsxRuntime.jsx("title", { children: n.name }),
-                    n.name.length > 10 ? `${n.name.slice(0, 9)}\u2026` : n.name
+                    \u6841\u3067\u7701\u304F(n.name, 10)
                   ]
                 }
               ),
@@ -8117,11 +8401,7 @@ function KpiTrendTileReadout({
             deltaPct.toFixed(1),
             "%)"
           ] }),
-          /* @__PURE__ */ jsxRuntime.jsxs("text", { x: 12, y: 78, fontSize: 10, fill: "#64748b", style: { userSelect: "none" }, children: [
-            "prev ",
-            prev,
-            unit
-          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx("text", { x: 12, y: 78, fontSize: 10, fill: "#64748b", style: { userSelect: "none" }, children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.kpiTrend.prev", v: { v: `${prev}${unit}` } }) }),
           history.length > 1 ? /* @__PURE__ */ jsxRuntime.jsx("polyline", { points, fill: "none", stroke: arrowColor, strokeWidth: 2 }) : null
         ]
       }
@@ -8209,7 +8489,7 @@ function QuickPollEmojiReadout({
               )
             ] }, i);
           }),
-          /* @__PURE__ */ jsxRuntime.jsxs(
+          /* @__PURE__ */ jsxRuntime.jsx(
             "text",
             {
               x: width - 8,
@@ -8218,10 +8498,7 @@ function QuickPollEmojiReadout({
               textAnchor: "end",
               fill: "#64748b",
               style: { userSelect: "none" },
-              children: [
-                "total ",
-                total
-              ]
+              children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.poll.total", v: { n: total } })
             }
           )
         ]
@@ -8356,14 +8633,8 @@ function ThreadSummaryReadout({
         height,
         children: [
           /* @__PURE__ */ jsxRuntime.jsx("rect", { x: 0, y: 0, width, height, fill: "#f8fafc", rx: 6 }),
-          /* @__PURE__ */ jsxRuntime.jsxs("text", { x: 12, y: 22, fontSize: 12, fontWeight: 600, fill: "#0f172a", style: { userSelect: "none" }, children: [
-            participants,
-            " participants"
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsxs("text", { x: 12, y: 42, fontSize: 11, fill: "#334155", style: { userSelect: "none" }, children: [
-            "last: ",
-            lastAuthor
-          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx("text", { x: 12, y: 22, fontSize: 12, fontWeight: 600, fill: "#0f172a", style: { userSelect: "none" }, children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.thread.participants", v: { n: participants } }) }),
+          /* @__PURE__ */ jsxRuntime.jsx("text", { x: 12, y: 42, fontSize: 11, fill: "#334155", style: { userSelect: "none" }, children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.thread.last", v: { name: lastAuthor } }) }),
           /* @__PURE__ */ jsxRuntime.jsx("text", { x: 12, y: 60, fontSize: 10, fill: "#64748b", style: { userSelect: "none" }, children: timeAgo }),
           unread > 0 ? /* @__PURE__ */ jsxRuntime.jsxs("g", { "data-cdl-thread-unread": "1", children: [
             /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: width - 24, cy: 26, r: 14, fill: colorUnread }),
@@ -8394,7 +8665,7 @@ function ReadReceiptReadout({
   colorPending
 }) {
   const status = Number.isFinite(value) ? Math.max(0, Math.min(2, Math.floor(value))) : 0;
-  const labelText = status === 0 ? "sent" : status === 1 ? "delivered" : "read";
+  const labelKey = status === 0 ? "readout.readReceipt.sent" : status === 1 ? "readout.readReceipt.delivered" : "readout.readReceipt.read";
   const iconColor = status === 2 ? colorRead : colorPending;
   const width = 180;
   const height = 32;
@@ -8429,7 +8700,7 @@ function ReadReceiptReadout({
               }
             ) : null
           ] }),
-          /* @__PURE__ */ jsxRuntime.jsx("text", { x: 52, y: height / 2 + 4, fontSize: 11, fontWeight: 600, fill: iconColor, style: { userSelect: "none" }, children: labelText })
+          /* @__PURE__ */ jsxRuntime.jsx("text", { x: 52, y: height / 2 + 4, fontSize: 11, fontWeight: 600, fill: iconColor, style: { userSelect: "none" }, children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: labelKey }) })
         ]
       }
     )
@@ -8443,7 +8714,7 @@ function PasswordStrengthReadout({
   colorWeak
 }) {
   const level = Number.isFinite(value) ? Math.max(0, Math.min(4, Math.floor(value))) : 0;
-  const labels = ["too weak", "weak", "fair", "good", "strong"];
+  const labels = ["readout.password.0", "readout.password.1", "readout.password.2", "readout.password.3", "readout.password.4"];
   const colors = [colorWeak, "#f97316", "#eab308", "#84cc16", colorStrong];
   const barW = 46;
   const gap = 6;
@@ -8487,7 +8758,7 @@ function PasswordStrengthReadout({
               textAnchor: "end",
               fill: level > 0 ? colors[level] ?? colorStrong : "#94a3b8",
               style: { userSelect: "none" },
-              children: labels[level]
+              children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: labels[level] })
             }
           )
         ]
@@ -8620,9 +8891,9 @@ function FileDropzoneReadout({
             ),
             /* @__PURE__ */ jsxRuntime.jsxs("text", { x: 54, y: 34, fontSize: 12, fontWeight: 600, fill: "#0f172a", style: { userSelect: "none" }, children: [
               /* @__PURE__ */ jsxRuntime.jsx("title", { children: filename }),
-              filename.length > 26 ? `${filename.slice(0, 25)}\u2026` : filename
+              \u6841\u3067\u7701\u304F(filename, 26)
             ] }),
-            /* @__PURE__ */ jsxRuntime.jsx("text", { x: 54, y: 50, fontSize: 10, fill: "#64748b", style: { userSelect: "none" }, children: "uploaded" })
+            /* @__PURE__ */ jsxRuntime.jsx("text", { x: 54, y: 50, fontSize: 10, fill: "#64748b", style: { userSelect: "none" }, children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.dropzone.uploaded" }) })
           ] }) : /* @__PURE__ */ jsxRuntime.jsxs("g", { "data-cdl-dropzone-empty": "1", children: [
             /* @__PURE__ */ jsxRuntime.jsx(
               "text",
@@ -8634,7 +8905,7 @@ function FileDropzoneReadout({
                 textAnchor: "middle",
                 fill: "#64748b",
                 style: { userSelect: "none" },
-                children: "\u2B06 Drop file here"
+                children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.dropzone.drop" })
               }
             ),
             /* @__PURE__ */ jsxRuntime.jsx(
@@ -8646,7 +8917,7 @@ function FileDropzoneReadout({
                 textAnchor: "middle",
                 fill: "#94a3b8",
                 style: { userSelect: "none" },
-                children: "or click to browse"
+                children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.dropzone.browse" })
               }
             )
           ] })
@@ -8681,7 +8952,7 @@ function LogStreamReadout({
     }
   }
   const shown = rows.slice(-5);
-  const levelLabels = ["DBG", "INF", "WRN", "ERR"];
+  const levelLabels = ["readout.log.0", "readout.log.1", "readout.log.2", "readout.log.3"];
   const levelColors = ["#94a3b8", "#2563eb", "#f97316", "#ef4444"];
   const width = 300;
   const rowH = 18;
@@ -8699,7 +8970,7 @@ function LogStreamReadout({
           /* @__PURE__ */ jsxRuntime.jsx("rect", { x: 0, y: 0, width, height, fill: "#0f172a", rx: 4 }),
           shown.map((r, i) => {
             const y = 4 + i * rowH;
-            const displayMsg = r.msg.length > 24 ? `${r.msg.slice(0, 23)}\u2026` : r.msg;
+            const displayMsg = \u6841\u3067\u7701\u304F(r.msg, 24);
             return /* @__PURE__ */ jsxRuntime.jsxs("g", { "data-cdl-log-row": i, children: [
               /* @__PURE__ */ jsxRuntime.jsx("text", { x: 6, y: y + 12, fontSize: 9, fill: "#94a3b8", fontFamily: "monospace", style: { userSelect: "none" }, children: r.ts }),
               /* @__PURE__ */ jsxRuntime.jsx("rect", { x: 62, y: y + 3, width: 26, height: 12, fill: levelColors[r.level] ?? "#94a3b8", rx: 2 }),
@@ -8714,7 +8985,7 @@ function LogStreamReadout({
                   fill: "#ffffff",
                   fontFamily: "monospace",
                   style: { userSelect: "none" },
-                  children: levelLabels[r.level] ?? "INF"
+                  children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: levelLabels[r.level] ?? "readout.log.1" })
                 }
               ),
               /* @__PURE__ */ jsxRuntime.jsxs("text", { x: 94, y: y + 12, fontSize: 10, fill: "#e2e8f0", fontFamily: "monospace", style: { userSelect: "none" }, children: [
@@ -8799,7 +9070,7 @@ function AlertBannerReadout({
               style: { userSelect: "none" },
               children: [
                 /* @__PURE__ */ jsxRuntime.jsx("title", { children: message }),
-                message.length > 32 ? `${message.slice(0, 31)}\u2026` : message
+                \u6841\u3067\u7701\u304F(message, 32)
               ]
             }
           )
@@ -8869,7 +9140,7 @@ function ServiceHealthReadout({
                 style: { userSelect: "none" },
                 children: [
                   /* @__PURE__ */ jsxRuntime.jsx("title", { children: s.name }),
-                  s.name.length > 10 ? `${s.name.slice(0, 9)}\u2026` : s.name
+                  \u6841\u3067\u7701\u304F(s.name, 10)
                 ]
               }
             )
@@ -8908,10 +9179,10 @@ function CartSummaryReadout({
   if (!Number.isFinite(shipping)) shipping = 0;
   if (!Number.isFinite(total)) total = 0;
   const rows = [
-    { l: "Items", v: `${items}`, bold: false },
-    { l: "Subtotal", v: `${currency}${subtotal.toFixed(2)}`, bold: false },
-    { l: "Shipping", v: `${currency}${shipping.toFixed(2)}`, bold: false },
-    { l: "Total", v: `${currency}${total.toFixed(2)}`, bold: true }
+    { l: "readout.cart.items", v: `${items}`, bold: false },
+    { l: "readout.cart.subtotal", v: `${currency}${subtotal.toFixed(2)}`, bold: false },
+    { l: "readout.cart.shipping", v: `${currency}${shipping.toFixed(2)}`, bold: false },
+    { l: "readout.cart.total", v: `${currency}${total.toFixed(2)}`, bold: true }
   ];
   const width = 260;
   const rowH = 20;
@@ -8941,7 +9212,7 @@ function CartSummaryReadout({
                   fontWeight: isTotal ? 700 : 500,
                   fill: isTotal ? colorTotal : "#334155",
                   style: { userSelect: "none" },
-                  children: r.l
+                  children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: r.l })
                 }
               ),
               /* @__PURE__ */ jsxRuntime.jsx(
@@ -8989,6 +9260,8 @@ function PricingTierReadout({
     }
   }
   if (!Number.isFinite(price)) price = 0;
+  const \u5F15\u304F = use\u5B57\u5F15();
+  const \u898B\u305B\u308B\u540D\u524D = planName || \u5F15\u304F("readout.pricing.plan");
   const width = 240;
   const height = 176;
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-pricing-tier", "data-cdl-readout": id, children: [
@@ -9013,7 +9286,7 @@ function PricingTierReadout({
               textAnchor: "middle",
               fill: "#ffffff",
               style: { userSelect: "none" },
-              children: planName || "Plan"
+              children: \u898B\u305B\u308B\u540D\u524D
             }
           ),
           /* @__PURE__ */ jsxRuntime.jsxs(
@@ -9041,12 +9314,12 @@ function PricingTierReadout({
               textAnchor: "middle",
               fill: "#64748b",
               style: { userSelect: "none" },
-              children: "per month"
+              children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.pricing.perMonth" })
             }
           ),
           features.slice(0, 3).map((f, i) => {
             const y = 96 + i * 18;
-            const displayF = f.length > 24 ? `${f.slice(0, 23)}\u2026` : f;
+            const displayF = \u6841\u3067\u7701\u304F(f, 24);
             return /* @__PURE__ */ jsxRuntime.jsxs("g", { "data-cdl-tier-feature": i, children: [
               /* @__PURE__ */ jsxRuntime.jsx("text", { x: 16, y, fontSize: 11, fill: colorAccent, style: { userSelect: "none" }, children: "\u2713" }),
               /* @__PURE__ */ jsxRuntime.jsxs("text", { x: 30, y, fontSize: 11, fill: "#0f172a", style: { userSelect: "none" }, children: [
@@ -9056,7 +9329,7 @@ function PricingTierReadout({
             ] }, i);
           }),
           /* @__PURE__ */ jsxRuntime.jsx("rect", { x: 16, y: 150, width: width - 32, height: 20, fill: colorAccent, rx: 4 }),
-          /* @__PURE__ */ jsxRuntime.jsxs(
+          /* @__PURE__ */ jsxRuntime.jsx(
             "text",
             {
               x: width / 2,
@@ -9066,10 +9339,7 @@ function PricingTierReadout({
               textAnchor: "middle",
               fill: "#ffffff",
               style: { userSelect: "none" },
-              children: [
-                "Get ",
-                planName || "Plan"
-              ]
+              children: \u5F15\u304F("readout.pricing.get", { name: \u898B\u305B\u308B\u540D\u524D })
             }
           )
         ]
@@ -9135,12 +9405,12 @@ function CouponCodeReadout({
               fill: applied ? colorApplied : "#94a3b8",
               fontFamily: "monospace",
               style: { userSelect: "none" },
-              children: code || "ENTER CODE"
+              children: code || /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.coupon.placeholder" })
             }
           ),
           applied ? /* @__PURE__ */ jsxRuntime.jsxs("g", { "data-cdl-coupon-applied": "1", children: [
             /* @__PURE__ */ jsxRuntime.jsx("rect", { x: boxW + 12, y: 10, width: 90, height: height - 20, fill: colorApplied, rx: 4 }),
-            /* @__PURE__ */ jsxRuntime.jsxs(
+            /* @__PURE__ */ jsxRuntime.jsx(
               "text",
               {
                 x: boxW + 57,
@@ -9150,11 +9420,7 @@ function CouponCodeReadout({
                 textAnchor: "middle",
                 fill: "#ffffff",
                 style: { userSelect: "none" },
-                children: [
-                  "-",
-                  discountPct,
-                  "% off"
-                ]
+                children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.coupon.off", v: { pct: discountPct } })
               }
             )
           ] }) : /* @__PURE__ */ jsxRuntime.jsxs("g", { "data-cdl-coupon-empty": "1", children: [
@@ -9169,7 +9435,7 @@ function CouponCodeReadout({
                 textAnchor: "middle",
                 fill: "#ffffff",
                 style: { userSelect: "none" },
-                children: "Apply"
+                children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.coupon.apply" })
               }
             )
           ] })
@@ -9204,6 +9470,7 @@ function ArticlePreviewReadout({
   const width = 300;
   const height = 116;
   const thumbW = 80;
+  const [\u629C\u7C8B\u306E\u4E00\u884C\u76EE, \u629C\u7C8B\u306E\u6B8B\u308A] = \u6841\u3067\u5272\u308B(excerpt, 28);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-readout-article-preview", "data-cdl-readout": id, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: label }),
     /* @__PURE__ */ jsxRuntime.jsxs(
@@ -9240,19 +9507,16 @@ function ArticlePreviewReadout({
               style: { userSelect: "none" },
               children: [
                 /* @__PURE__ */ jsxRuntime.jsx("title", { children: title }),
-                title.length > 26 ? `${title.slice(0, 25)}\u2026` : title
+                \u6841\u3067\u7701\u304F(title, 26)
               ]
             }
           ),
           /* @__PURE__ */ jsxRuntime.jsxs("text", { x: thumbW + 20, y: 44, fontSize: 10, fill: "#334155", style: { userSelect: "none" }, children: [
             /* @__PURE__ */ jsxRuntime.jsx("title", { children: excerpt }),
-            excerpt.length > 28 ? `${excerpt.slice(0, 27)}\u2026` : excerpt
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsx("text", { x: thumbW + 20, y: 60, fontSize: 10, fill: "#334155", style: { userSelect: "none" }, children: excerpt.length > 56 ? `${excerpt.slice(28, 55)}\u2026` : excerpt.slice(28, 56) }),
-          /* @__PURE__ */ jsxRuntime.jsxs("text", { x: thumbW + 20, y: height - 14, fontSize: 10, fontWeight: 600, fill: "#64748b", style: { userSelect: "none" }, children: [
-            "by ",
-            author
+            \u629C\u7C8B\u306E\u4E00\u884C\u76EE
           ] }),
+          /* @__PURE__ */ jsxRuntime.jsx("text", { x: thumbW + 20, y: 60, fontSize: 10, fill: "#334155", style: { userSelect: "none" }, children: \u6841\u3067\u7701\u304F(\u629C\u7C8B\u306E\u6B8B\u308A, 28) }),
+          /* @__PURE__ */ jsxRuntime.jsx("text", { x: thumbW + 20, y: height - 14, fontSize: 10, fontWeight: 600, fill: "#64748b", style: { userSelect: "none" }, children: /* @__PURE__ */ jsxRuntime.jsx(\u5B57, { k: "readout.article.by", v: { author } }) }),
           /* @__PURE__ */ jsxRuntime.jsx("text", { x: width - 8, y: height - 14, fontSize: 10, textAnchor: "end", fill: "#94a3b8", style: { userSelect: "none" }, children: timeAgo })
         ]
       }
@@ -9303,7 +9567,7 @@ function TocNavReadout({
           shown.map((it, i) => {
             const y = 4 + i * rowH;
             const indent = 12 + it.level * 16;
-            const displayT = it.title.length > 30 ? `${it.title.slice(0, 29)}\u2026` : it.title;
+            const displayT = \u6841\u3067\u7701\u304F(it.title, 30);
             return /* @__PURE__ */ jsxRuntime.jsxs("g", { "data-cdl-toc-item": i, children: [
               it.active ? /* @__PURE__ */ jsxRuntime.jsx("rect", { x: 4, y, width: 3, height: rowH - 4, fill: colorActive, rx: 1 }) : null,
               /* @__PURE__ */ jsxRuntime.jsxs(
@@ -20612,50 +20876,6 @@ function recomputeContainedLanes(lanes, nodes) {
   });
 }
 
-// src/kinds/row-align.ts
-var GENERIC_ROW_LEFT_SIZE_PX = 18;
-var GENERIC_ROW_RIGHT_SIZE_PX = 21;
-var MONO_ADVANCE_RATIO = 0.6;
-var STORAGE_CHAR_ADVANCE_PX = 26 * MONO_ADVANCE_RATIO;
-var ROW_PAD_X_PX = 26;
-var ROW_COL_GAP_PX = 16;
-var STORAGE_COL_GAP_PX = 32;
-var ROW_RIGHT_PAD_PX = 26;
-var DELIMITERS = [" -> ", " \u2192 ", " = ", ": ", ":"];
-function splitRow(row) {
-  for (const d of DELIMITERS) {
-    const idx = row.indexOf(d);
-    if (idx > 0) {
-      return {
-        left: row.slice(0, idx).trim(),
-        right: row.slice(idx + d.length).trim(),
-        split: true
-      };
-    }
-  }
-  return { left: row.trim(), right: "", split: false };
-}
-function rowColumnWidth(text, size, mono) {
-  return mono ? displayWidth(text) * size * MONO_ADVANCE_RATIO : textWidth(text, size);
-}
-function displayWidth(text) {
-  let w = 0;
-  for (const ch of text) {
-    const code = ch.codePointAt(0) ?? 0;
-    w += code >= 32 && code <= 126 ? 1 : 2;
-  }
-  return w;
-}
-function requiredRowsWidth(rows, kind) {
-  if (!rows || rows.length === 0) return 0;
-  const splits = rows.map(splitRow);
-  const \u4E00\u756A\u5E83\u3044 = (\u53D6\u308B) => splits.reduce((m, s) => Math.max(m, \u53D6\u308B(s)), 0);
-  const storage = ROW_PAD_X_PX + \u4E00\u756A\u5E83\u3044((s) => rowColumnWidth(s.left, 26, true)) + STORAGE_COL_GAP_PX + \u4E00\u756A\u5E83\u3044((s) => rowColumnWidth(s.right, 26, true)) + ROW_RIGHT_PAD_PX;
-  const generic = ROW_PAD_X_PX + \u4E00\u756A\u5E83\u3044((s) => rowColumnWidth(s.left, GENERIC_ROW_LEFT_SIZE_PX, false)) + ROW_COL_GAP_PX + \u4E00\u756A\u5E83\u3044((s) => rowColumnWidth(s.right, GENERIC_ROW_RIGHT_SIZE_PX, true)) + ROW_RIGHT_PAD_PX;
-  if (kind === void 0) return Math.ceil(Math.max(storage, generic));
-  return Math.ceil(kind === "storage" ? storage : generic);
-}
-
 // src/layout/head-label.ts
 var \u7AEF\u306E\u5B57\u3092\u623B\u3059\u8DDD\u96E2 = 22;
 var \u7AEF\u306E\u5B57\u3068\u7DDA\u306E\u9699\u9593 = 8;
@@ -23553,12 +23773,12 @@ function \u5272\u308B\u5019\u88DC(text) {
     \u7A7A\u767D.push([text.slice(0, m.index).trim(), text.slice(m.index + m[0].length).trim()]);
   }
   if (\u7A7A\u767D.length > 0) return \u7A7A\u767D.filter(\u5165\u3063\u3066\u3044\u308B);
-  const \u5B57 = [];
+  const \u5B572 = [];
   const \u4E26\u3073 = [...text];
   for (let i = 1; i < \u4E26\u3073.length; i += 1) {
-    \u5B57.push([\u4E26\u3073.slice(0, i).join(""), \u4E26\u3073.slice(i).join("")]);
+    \u5B572.push([\u4E26\u3073.slice(0, i).join(""), \u4E26\u3073.slice(i).join("")]);
   }
-  return \u5B57.filter(\u5165\u3063\u3066\u3044\u308B);
+  return \u5B572.filter(\u5165\u3063\u3066\u3044\u308B);
 }
 function \u5165\u3063\u3066\u3044\u308B([\u5DE6, \u53F3]) {
   return \u5DE6 !== "" && \u53F3 !== "";
@@ -25917,9 +26137,9 @@ function \u533A\u753B\u306E\u5272\u4ED8(w, h, \u4EF6\u6570, \u524D\u3092\u51FA\u
     \u67A0: (idx) => ({ x: \u5E45 * idx, y: 0, w: \u5E45, h })
   };
 }
-function \u53CE\u3081\u308B\u7D1A(\u5B57, \u4F7F\u3048\u308B\u5E452, \u521D\u671F, \u4E0B\u9650) {
+function \u53CE\u3081\u308B\u7D1A(\u5B572, \u4F7F\u3048\u308B\u5E452, \u521D\u671F, \u4E0B\u9650) {
   let \u7D1A = \u521D\u671F;
-  while (\u7D1A > \u4E0B\u9650 && textWidth(\u5B57, \u7D1A) > \u4F7F\u3048\u308B\u5E452) \u7D1A -= 1;
+  while (\u7D1A > \u4E0B\u9650 && textWidth(\u5B572, \u7D1A) > \u4F7F\u3048\u308B\u5E452) \u7D1A -= 1;
   return \u7D1A;
 }
 function \u5F27\u306E\u90533(cx, cy, r, \u5272\u5408) {