egatari 0.0.0-stage → 0.6.4

package/vendor/components/sha256/64947d36ee857847ecbc3cd23f2ac9f76f591159945080660c68604c0d4894a0/README.md

@@ -0,0 +1,72 @@
+---
+name: m-kanbun
+series: kokugo
+summary: 白文に返り点・送り仮名を付け、訓読の順に字をたどり（返り点で上へ戻るところに弧）、書き下し文にする（縦書き）
+steps: phases の数（order は句の数だけ。既定：訓点 1＋句の数＋書き下し文 1）
+purposes: text-structure
+props: size, slot, phases, kaki, nums
+---
+
+漢文の授業で、白文 → 訓点 → 読む順 → 書き下し文 を 1 枚で見せるときに使う。段階 0 は白文。
+<!-- llm: omit -->
+字の並べ方・訓点の位置（返り点は字の左下、送り仮名は右下、振り仮名は右）は部品が字の大きさから決めるので、測らない（字が読み込まれる前でも同じ配置）。
+字は明朝（`var(--font-mincho)`。build が BIZ UDP明朝を埋め込む）。
+<!-- llm: end -->
+
+## 書き方
+
+要素の中に、1 行に 1 列（句）を書く。行の中の空白は読まない。字の後ろに付けるもの（順は問わない）：
+
+| 書き方 | 意味 | 例 |
+|---|---|---|
+| `(…)` | 送り仮名（片仮名。右下に出す） | `覚(エ)` |
+| `[…]` | 返り点：`レ` `一` `二` `三` `四` `五` `上` `中` `下` `甲` `乙` `丙` `丁` `天` `地` `人`、`一レ` `上レ` `甲レ` `天レ` | `聞(ク)[二]啼鳥(ヲ)[一]` |
+| `レ` | レ点（`[レ]` と同じ） | `不{=ず}レ覚(エ)レ暁(ヲ)` |
+| `{…}` | 振り仮名（右に出す。書き下し文ではルビ） | `濺{そそ}(ギ)` |
+| `{=…}` | 書き下し文で平仮名にする字（助字）の読み | `不{=ず}`、`也{=なり}` |
+| `{-}` | 置き字（読まない。読む順の段階から薄くする） | `而{-}` |
+| `(右\|二度目)` | 再読文字：右の送り仮名と二度目の読み。二度目の片仮名は左の送り仮名として出す | `未(ダ\|ず)`、`将(ニ\|ス)` |
+| `字-字` | 竪点（続けて読む熟語。返り点はまとまり全体に効く） | `読-書` |
+| `、` `。` | 句読点（白文では出さない。書き下し文では、そこまでの字を読み終えたところに置く） | `人(ヲ)、` |
+
+括弧は全角でもよい。
+<!-- llm: omit -->
+`不` に `{=ず}` を付け忘れると知らせる（console の warning）。
+<!-- llm: end -->
+
+<!-- llm: omit -->
+## 訓読の順の規則
+
+- レ点：その字を飛ばし、次の字（まとまり）を読んだら戻る。続くレ点は下から順に戻る
+- 一二点・上中下点・甲乙点・天地人点：順位 2 以上（二・中・下・乙…）を飛ばし、同じ系列の順位 1 を読んだら、順位の小さい順に戻る
+- 一レ点・上レ点：先にレ点として戻り、読んだら一（上）として二（下）へ戻る（レ点の戻りを先に、系列の戻りを後に）
+- 再読文字：出てきたところで一度目、返り点に従って戻ったところで二度目（返り点がなければレ点と同じ）
+- 置き字は読まない。戻り先のない返り点は知らせ、最後に下から読む
+
+順と書き下し文は `DECK.kanbun.order(chars)`・`DECK.kanbun.kakikudashi(chars, o)`・`DECK.kanbun.yomi(文字列)` でも得られる。試験は `tools/test-kokugo.mjs`（「春暁」「春望」、『史記』『論語』『荀子』など）。
+
+<!-- llm: end -->
+## 段階
+
+`phases`（既定 `kunten order kaki`）の順に 1 段階ずつ：
+
+- `kunten`：返り点・送り仮名・振り仮名・句読点が出る
+- `order`：句（列）ごとに 1 段階。目（朱の枠）が読む順に字をたどる。読んだ字には番号（左上。再読文字の二度目は右上）と淡い色。上へ戻るところに弧の矢印。`slot` 秒で 1 字。1 句 = 1 ステップ。台本の [n] は句ごとに書く
+<!-- llm: omit -->
+  - 段階の分け方：読む順の字（事柄）を順に見て、字の列が変わるところで新しい段階にする。続けて同じ列を読む間が 1 段階なので、ふつうは 1 句 = 1 段階。返り点や再読文字で前の列へ戻って読むときは、戻ったところからまた別の段階になる（同じ列が 2 つの段階に出ることがある）。字を 1 つも読まない列（置き字だけの列など）は段階を作らない。前の段階で読んだ字の番号・色・弧はそのまま残る
+  - 段階の長さは（その段階で読む字の数）× `slot` ＋ 0.3 秒。最後の 0.3 秒で目の枠と朱の字が消え、弧が読み終えた濃さになる（段階の長さの時点で最後の状態と同じ）。段階の中に `cues(k)` はない
+  - `order-by="all"`：v1.3.0 までと同じく、読む順の全体を 1 段階にする（描画と時間も同じ。最後の 0.3 秒の消え方だけが違う）。`cues(k)` は 2 列目からの各列の読み始めの時刻で、口述原稿の `{cue}` を句ごとに置ける
+<!-- llm: end -->
+- `kaki`：書き下し文が左に縦書きで出る（部品の高さで折り返す）
+
+`phases="kunten kaki"` のように一部だけにもできる（`kunten` を外すと訓点は初めから出る）。
+
+## 注意
+
+<!-- llm: omit -->
+- 長い送り仮名（`落(ツルコト)`、`先(ンズレバ)`）は、印刷と同じく次の字を下げずに詰める：字の下半分の右から始め、次の字の右の欄の上半分にはみ出し、字間を詰め、それでも長ければ縦に縮める（字の大きさは変えない。自然の長さの 0.78 まで）。次の字の送り仮名が後ろに余裕を持って収まるときは、それを字の 0.36 まで下げて場所を譲る。次の字に振り仮名があるときや、0.78 まで詰めても入らないときだけ、次の字から後ろを下げる
+- 要素に収める（issue #3）：いちばん長い列の下端（振り仮名・送り仮名・返り点・句読点を含む）が要素の高さを 6px より超えるか、列と書き下し文の幅が要素の幅を超えるときは、字の大きさと字の送り（字の 1.2、欄の 0.5・0.3）を一緒に 1px ずつ下げる。下限は 42px：振り仮名・送り仮名・返り点は 24px のままなので、これより小さいと返り点が隣の列の送り仮名に 4px より近づく。下限でも収まらなければ、足りない px と直し方を console.warn で知らせる（高さなら要素を高くするか 1 行の字を減らす、幅なら詩を 2 枚に分ける）。`size` のままで収まるときは配置を変えない。書き下し文の幅は字数から見積もる（字の大きさを下げても変わらない）。試験は `tools/test-kanbun-fit.mjs`
+<!-- llm: end -->
+- 字は要素の高さと幅に自動で合わせる。収まらなければ、横は句を分け（1 枚に 2 句など）、縦は要素を高くする
+
+見本は `demo.html`（「春暁」、『史記』の一レ点（`order-by="all"`）、『論語』の再読文字と置き字）。

package/vendor/components/sha256/64947d36ee857847ecbc3cd23f2ac9f76f591159945080660c68604c0d4894a0/demo.html

@@ -0,0 +1,50 @@
+<!DOCTYPE html>
+<html lang="ja" data-theme="kokugo">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<title>m-kanbun の見本</title>
+<!-- 組み方：node kit/build.mjs components/kanbun/demo.html -o components/kanbun/out/demo.html -->
+</head>
+<body>
+<div id="stage">
+
+<section class="slide">
+  <h2>孟浩然「春暁」</h2>
+  <div class="body">
+    <m-kanbun style="height:430px">
+      春眠不{=ず}レ覚(エ)レ暁(ヲ)
+      処処聞(ク)[二]啼鳥(ヲ)[一]
+      夜来風雨(ノ)声
+      花落(ツルコト)知(ル)多少
+    </m-kanbun>
+  </div>
+  <div class="concl"><span>返り点に従って下から上へ戻って読む</span></div>
+</section>
+
+<section class="slide">
+  <h2>レ点・一二点・一レ点（『史記』）</h2>
+  <div class="body">
+    <m-kanbun size="56" order-by="all" style="height:430px">
+      先(ンズレバ)即(チ)制(シ)[レ]人(ヲ)、
+      後(ルレバ)則(チ)為(ル)[二]人(ノ)所(ト)[一レ]制(スル)
+    </m-kanbun>
+  </div>
+  <div class="concl"><span>一レ点は、レ点で戻ってから二へ戻る</span></div>
+</section>
+
+<section class="slide">
+  <h2>再読文字と置き字（『論語』）</h2>
+  <div class="body">
+    <m-kanbun style="height:430px">
+      未(ダ|ず)[レ]知(ラ)[レ]生(ヲ)、
+      焉{いづく}(ンゾ)知(ラン)[レ]死(ヲ)
+      学(ビテ)而{-}時(ニ)習(フ)[レ]之(ヲ)
+    </m-kanbun>
+  </div>
+  <div class="concl"><span>再読文字は二度読み、置き字は読まない</span></div>
+</section>
+
+</div>
+</body>
+</html>

package/vendor/components/sha256/64947d36ee857847ecbc3cd23f2ac9f76f591159945080660c68604c0d4894a0/index.js

@@ -0,0 +1,498 @@
+// m-kanbun：白文に返り点・送り仮名を付け、訓読の順に読み、書き下し文にする（縦書き）
+// <m-kanbun style="height:440px">
+//   春眠不{=ず}レ覚(エ)レ暁(ヲ)
+//   処処聞(ク)[二]啼鳥(ヲ)[一]
+// </m-kanbun>
+// 1 行が 1 列（句）。行の中の空白は読まない。字の後ろに付けるもの（順は問わない）：
+//   (送り仮名)   [返り点]（レ・一二三四五・上中下・甲乙丙丁・天地人、一レ・上レ・甲レ・天レ）。レ点だけは [ ] なしの「レ」でもよい
+//   {振り仮名}   {=かな}（書き下し文で平仮名にする字：不{=ず}、也{=なり}）   {-}（置き字：読まない）
+//   (右|二度目)  再読文字：右の送り仮名と二度目の読み（未(ダ|ず)、将(ニ|ス)）。二度目の読みの片仮名は左の送り仮名として出す
+//   字-字        竪点（続けて読む熟語。返り点はまとまり全体に効く）    、。        句読点（白文では出さない）
+// 段階（phases の順。既定は kunten order kaki）：段階 0 は白文 → kunten 訓点（返り点・送り仮名）→ order 読む順（目が字を順にたどり、
+// 返り点で上へ戻るところに弧を描く）→ kaki 書き下し文（左に縦書きで）。読む順の計算は DECK.kanbun.order（試験は tools/test-kokugo.mjs）
+// order は既定（order-by="col"）で列（句）ごとに 1 段階：読む順の字を、字の列が変わるところで切る。order-by="all" で全体を 1 段階（v1.3.0 まで）
+(function(){
+"use strict";
+var D = window.DECK;
+
+// ---------------------------------------------------------------- 読み取り（文字列 → 字の並び）
+// 返り点の字 → [系列, 順位]。順位 1（一・上・甲・天）を読んだら、同じ系列で順位の大きいものへ戻る
+var SERIES = {"一": ["i", 1], "二": ["i", 2], "三": ["i", 3], "四": ["i", 4], "五": ["i", 5],
+  "上": ["j", 1], "中": ["j", 2], "下": ["j", 3], "甲": ["k", 1], "乙": ["k", 2], "丙": ["k", 3], "丁": ["k", 4],
+  "天": ["t", 1], "地": ["t", 2], "人": ["t", 3]};
+var OPEN = {"(": ")", "（": "）", "[": "]", "［": "］", "{": "}", "｛": "｝"};
+var PUNCT = "、。，．！？";
+// parse(文字列) → {chars, cols, warnings}。chars[n] = {ch, col, okuri, second, ruby, kana, oki, re, series, rank, mark, join, punct}
+function parse(src){
+  var chars = [], warnings = [], lines = String(src || "").split(/\r?\n/).map(function(l){ return l.trim(); }).filter(Boolean);
+  lines.forEach(function(line, col){
+    var A = Array.from(line), c = null;
+    var need = function(what){ if (!c){ warnings.push(what + " の前に字がない（" + (col + 1) + " 行目）"); return false; } return true; };
+    for (var j = 0; j < A.length; j++){
+      var ch = A[j];
+      if (/\s/.test(ch)) continue;
+      if (OPEN[ch]){
+        var close = OPEN[ch], body = "", k = j + 1;
+        // 閉じ括弧は半角・全角のどちらでもよい
+        var alt = {")": "）", "）": ")", "]": "］", "］": "]", "}": "｝", "｝": "}"}[close];
+        while (k < A.length && A[k] !== close && A[k] !== alt){ body += A[k]; k++; }
+        if (k >= A.length) warnings.push("「" + ch + "」が閉じていない（" + (col + 1) + " 行目）");
+        j = k;
+        if (!need(ch + body + close)) continue;
+        if (ch === "(" || ch === "（"){
+          var sp = body.split(/[|｜]/);
+          c.okuri += sp[0];
+          if (sp.length > 1) c.second = sp.slice(1).join("");
+        } else if (ch === "[" || ch === "［"){
+          Array.from(body).forEach(function(m){
+            if (m === "レ") c.re = true;
+            else if (SERIES[m]){ c.series = SERIES[m][0]; c.rank = SERIES[m][1]; c.mark = m; }
+            else if (!/\s/.test(m)) warnings.push("返り点ではない「" + m + "」（" + (col + 1) + " 行目「" + c.ch + "」）");
+          });
+        } else {
+          if (/^[-−‐ー]$/.test(body)) c.oki = true;
+          else if (/^[=＝]/.test(body)) c.kana = body.slice(1);
+          else c.ruby = body;
+        }
+        continue;
+      }
+      if (ch === "-" || ch === "‐" || ch === "－"){ if (need(ch)) c.join = true; continue; }
+      if (PUNCT.indexOf(ch) >= 0){ if (need(ch)) c.punct += ch; continue; }
+      if (ch === "レ"){ if (need(ch)) c.re = true; continue; }
+      c = {ch: ch, col: col, okuri: "", second: null, ruby: "", kana: null, oki: false, re: false, series: null, rank: 0, mark: "", join: false, punct: ""};
+      chars.push(c);
+    }
+  });
+  chars.forEach(function(c){ if (c.ch === "不" && c.kana === null && !c.oki) warnings.push("「不」は書き下し文で平仮名にする：不{=ず}"); });
+  return {chars: chars, cols: lines.length, warnings: warnings};
+}
+
+// ---------------------------------------------------------------- 訓読の順
+// まとまり（竪点でつないだ字）ごとに読む。返り点の規則：
+//   レ点：その字を飛ばし、次のまとまりを読んだら戻る（続くレ点は下から順に戻る）
+//   一二点・上中下点・甲乙点・天地人点：順位 2 以上の字を飛ばし、同じ系列の順位 1 を読んだら、順位の小さい順に戻る
+//   一レ・上レ：先にレ点として戻り、読んだら一（上）として二（下）へ戻る
+//   再読文字：出てきたところで一度目を読み、返り点に従って戻ったところで二度目を読む（返り点がなければレ点と同じ）
+//   置き字は読まない。戻るときは、レ点の戻りを先に、系列の戻りを後にする
+// order(chars) → {units, events, warnings}。events[n] = {u（まとまりの番号）, kind: "read" | "first" | "second"}
+function order(chars){
+  var units = [], warnings = [];
+  chars.forEach(function(c, n){
+    var last = units[units.length - 1];
+    if (last && chars[last.chars[last.chars.length - 1]].join) last.chars.push(n);
+    else units.push({chars: [n]});
+  });
+  units.forEach(function(u){
+    var cs = u.chars.map(function(n){ return chars[n]; });
+    u.oki = cs.every(function(c){ return c.oki; });
+    u.re = cs.some(function(c){ return c.re; });
+    var s = cs.filter(function(c){ return c.series; })[0];
+    u.series = s ? s.series : null; u.rank = s ? s.rank : 0;
+    u.saidoku = cs.some(function(c){ return c.second !== null; });
+  });
+  var events = [], done = units.map(function(){ return false; }), pendRe = {}, stacks = {};
+  function prevOf(x){ for (var y = x - 1; y >= 0; y--) if (!units[y].oki) return y; return -1; }
+  function read(x){
+    events.push({u: x, kind: units[x].saidoku ? "second" : "read"});
+    done[x] = true;
+    // レ点：すぐ上のまとまりがレ点で待っていれば戻る
+    var p = prevOf(x);
+    if (p >= 0 && pendRe[p]){ delete pendRe[p]; read(p); }
+    // 一二点など：同じ系列で、待っている順位の大きいものへ戻る
+    var u = units[x];
+    if (u.series){
+      var st = stacks[u.series] || [];
+      if (st.length && units[st[st.length - 1]].rank > u.rank) read(st.pop());
+    }
+  }
+  units.forEach(function(u, x){
+    if (u.oki) return;
+    var bySeries = u.series && u.rank >= 2;
+    if (u.saidoku){
+      events.push({u: x, kind: "first"});
+      if (!u.re && !bySeries){ pendRe[x] = true; return; }   // 返り点のない再読文字：次を読んでから二度目
+    }
+    if (u.re) pendRe[x] = true;
+    if (bySeries) (stacks[u.series] = stacks[u.series] || []).push(x);
+    if (!u.re && !bySeries) read(x);
+  });
+  // 戻り先のないもの：知らせて、下から順に読む
+  var left = Object.keys(pendRe).map(Number);
+  Object.keys(stacks).forEach(function(s){ left = left.concat(stacks[s]); });
+  left.sort(function(a, b){ return b - a; }).forEach(function(x){
+    if (done[x]) return;
+    warnings.push("返り点の戻り先がない「" + units[x].chars.map(function(n){ return chars[n].ch; }).join("") + "」");
+    events.push({u: x, kind: units[x].saidoku ? "second" : "read"}); done[x] = true;
+  });
+  return {units: units, events: events, warnings: warnings};
+}
+
+// ---------------------------------------------------------------- 書き下し文
+function hira(s){
+  return String(s || "").replace(/[ァ-ヶ]/g, function(c){ return String.fromCharCode(c.charCodeAt(0) - 0x60); }).replace(/ヽ/g, "ゝ").replace(/ヾ/g, "ゞ");
+}
+// 読んだ順の字ごとの事柄（まとまりは字に分ける）：[{c（字の番号）, kind}]
+function charEvents(o){
+  var out = [];
+  o.events.forEach(function(e, n){ o.units[e.u].chars.forEach(function(c){ out.push({c: c, kind: e.kind, ev: n}); }); });
+  return out;
+}
+// kakikudashi(chars, o) → 行の配列。行 = [{t, rb}]（rb は振り仮名）。句読点は、そこまでの字をみな読み終えたところに置き、
+// 列の終わり（その列の字をみな読み終えたところ）で行を改める
+function kakikudashi(chars, o){
+  var ce = charEvents(o), fin = chars.map(function(c){ return c.oki; }), lines = [[]], flushed = -1;
+  function flush(){
+    // 読み終えた字の続き（置き字を含む）の終わりまで、句読点と改行を出す
+    var upto = flushed;
+    while (upto + 1 < chars.length && fin[upto + 1]) upto++;
+    for (var n = flushed + 1; n <= upto; n++){
+      if (chars[n].punct) lines[lines.length - 1].push({t: chars[n].punct});
+      if (n + 1 < chars.length && chars[n + 1].col !== chars[n].col) lines.push([]);
+    }
+    flushed = upto;
+  }
+  flush();
+  ce.forEach(function(e){
+    var c = chars[e.c], L = lines[lines.length - 1];
+    if (e.kind === "second") L.push({t: hira(c.second)});
+    else if (c.kana !== null) L.push({t: hira(c.kana + c.okuri)});
+    else {
+      L.push({t: c.ch, rb: c.ruby || ""});
+      if (c.okuri) L.push({t: hira(c.okuri)});
+    }
+    if (e.kind !== "first"){ fin[e.c] = true; flush(); }
+  });
+  return lines.filter(function(l){ return l.length; });
+}
+// 読む順の段階の分け方：stepGroups(chars, ce, by) → [{a, b}]（字の事柄 ce の範囲 [a, b)）。by = "col"（既定）は、字の列が
+// 変わるところで切る（続けて同じ列を読む間が 1 段階。返り点・再読文字で前の列へ戻れば、そこからまた別の段階）。"all" は全体で 1 つ
+function stepGroups(chars, ce, by){
+  var groups = [];
+  if (String(by).trim() !== "all") ce.forEach(function(ev, m){
+    if (!groups.length || chars[ev.c].col !== chars[ce[m - 1].c].col) groups.push({a: m, b: m + 1});
+    else groups[groups.length - 1].b = m + 1;
+  });
+  return groups.length ? groups : [{a: 0, b: ce.length}];
+}
+var plain = function(line){ return line.map(function(s){ return s.t; }).join(""); };
+D.kanbun = {parse: parse, order: order, kakikudashi: kakikudashi, charEvents: charEvents, hira: hira, stepGroups: stepGroups,
+  // 文字列から書き下し文の文字列（行は改行でつなぐ）
+  yomi: function(src){ var p = parse(src), o = order(p.chars); return kakikudashi(p.chars, o).map(plain).join("\n"); }};
+if (!D.MotionElement) return;   // 試験（Node）では読み取りと順だけ
+
+// ---------------------------------------------------------------- 部品
+var PH = ["kunten", "order", "kaki"];
+// 長い送り仮名を詰める：fit は自然の長さ（字数 × 字の大きさ）に対する割合。まず字間を詰め（1 字につき字の大きさの 0.12 まで）、
+// 残りを縦に縮める（transform。字の大きさ・字の幅は変えない）。OK_MIN より詰めない（それより長ければ次の字を下げる）
+var OK_MIN = 0.78, OK_TRACK = 0.12, GAP_OK = 8, OK_DELAY = 0.36;
+// 要素に収めるときの字の大きさの下限（px）。振り仮名・送り仮名・返り点は 24px のままなので、これより小さいと
+// 返り点が隣の列の送り仮名に 4px より近づく（列の間 1.3 字 = 返り点と送り仮名 2 つ分の 48px ＋ 3px ＋ 4px）
+var FIT_MIN = 42;
+// 高さは要素を FIT_SLACK px まで超えてよい（最後の仮名の字の枠の下の余白。見本の『史記』は size=56 で 4.4px 超えていて、これまでどおりに描く）
+var FIT_SLACK = 6;
+function okSquash(n, F, fit){
+  if (!(fit < 0.999) || !n) return "";
+  var ls = Math.max(-OK_TRACK * F, (fit - 1) * F), sy = fit * F / (F + ls);
+  return ";letter-spacing:" + ls.toFixed(2) + "px" + (sy < 0.999 ? ";transform:scaleY(" + sy.toFixed(3) + ");transform-origin:50% 0" : "");
+}
+D.define("m-kanbun", class extends D.MotionElement {
+  // データの形（kit/shape.js）：JSON ではなく、要素の中に 1 行 1 句の字（送り仮名 (…)・返り点 […]）
+  static shape = {text: true, example: "学(ビテ)而{-}時(ニ)習(フ)[レ]之(ヲ)"};
+  static props = {
+    size:   {type: "number", default: 60, doc: "漢字の大きさ（px）。送り仮名・返り点はその 0.42 倍（24px より小さくしない）"},
+    slot:   {type: "number", default: 0.55, doc: "読む順で 1 字にかける秒数"},
+    phases: {type: "string", default: "kunten order kaki", doc: "段階の並び（kunten 訓点・order 読む順・kaki 書き下し文から選ぶ）"},
+    kaki:   {type: "number", default: 36, doc: "書き下し文の字の大きさ（px）"},
+    nums:   {type: "bool", default: true, doc: "読む順の番号を字の左上に出す"},
+    "order-by": {type: "string", default: "col", doc: "読む順の段階の分け方：col は列（句）ごとに 1 段階、all は読む順の全体で 1 段階（v1.3.0 まで）"},
+  };
+  get phaseList(){
+    var a = String(this.props.phases || "").split(/[\s,]+/).filter(function(x){ return PH.indexOf(x) >= 0; });
+    return a.length ? a : PH.slice();
+  }
+  // 読み取りと読む順（段階の数を決めるので mount の前にも読む）。groups：読む順の段階ごとの字の事柄の範囲（stepGroups）
+  get kd(){
+    if (!this._kd){
+      var p = parse(this._src !== undefined ? this._src : this.textContent), o = order(p.chars), ce = charEvents(o);
+      this._kd = {p: p, o: o, ce: ce, groups: stepGroups(p.chars, ce, this.props["order-by"])};
+    }
+    return this._kd;
+  }
+  // 段階の並び：phases の各段階。order は groups の数だけ（{name, g}）
+  get stepList(){
+    var G = this.kd.groups;
+    return this.phaseList.reduce(function(a, name){ return a.concat(name === "order" ? G.map(function(g){ return {name: name, g: g}; }) : [{name: name}]); }, []);
+  }
+  get steps(){ return this.getAttribute("steps") !== null ? +this.getAttribute("steps") : this.stepList.length; }
+  // 段階 name の（最初の）番号（1 から）。phases になければ 0
+  phaseStep(name){ var L = this.stepList; for (var i = 0; i < L.length; i++) if (L[i].name === name) return i + 1; return 0; }
+  mount(){
+    var self = this, P = this.props;
+    this._src = this.textContent;
+    var kd = this.kd, p = kd.p, o = kd.o, kaki = kakikudashi(p.chars, o);
+    p.warnings.concat(o.warnings).forEach(function(w){ console.warn("m-kanbun: " + w); });
+    this.k = {p: p, o: o, ce: kd.ce, kaki: kaki, groups: kd.groups};
+    this.textContent = "";
+    this.classList.add("plot", "kanbun");
+    this.style.display = "block"; this.style.position = "relative";
+    this.setAttribute("role", "img");
+    this.setAttribute("aria-label", p.chars.map(function(c){ return c.ch; }).join("") + "。書き下し文：" + kaki.map(plain).join(""));
+    // ---- 配置：列は右から左へ。列の中は 左の欄（返り点・再読の左の送り仮名）・漢字・右の欄（振り仮名・送り仮名）
+    // lay(S)：字の大きさ S で並べる（字の位置を p.chars に書き、寸法を返す）。B は字の下端（振り仮名・送り仮名・返り点・句読点を含む）
+    var S, F, L, R, G, PITCH, cols, H, XR;
+    var lay = function(S0){
+      S = S0; F = Math.max(24, Math.round(S * 0.42));
+      L = Math.round(S * 0.5); R = Math.round(S * 0.5); G = Math.round(S * 0.3); PITCH = L + S + R + G;
+      cols = []; H = 0;
+      p.chars.forEach(function(c, n){
+        var col = cols[c.col] = cols[c.col] || {y: 0, rEnd: 0, lEnd: 0, list: [], prevOk: null};
+        // 前の字の右と左の欄の終わりにぶつからないところまで下げる
+        var rStart = c.ruby ? 0 : S * 0.52, lStart = S * 0.5;
+        // 番号（左上）を出すときは、前の字の左の欄（一レ点・再読文字の左の送り仮名）の下から始める
+        var y = Math.max(col.y, col.lEnd - (P.nums ? 0 : lStart) + 2);
+        // 右の欄：前の字の送り仮名は、この字を下げずに収まるように詰める（印刷の組み方：字間を詰め、それでも長ければ縦に縮める。
+        // 字の大きさは変えない）。この字に振り仮名も送り仮名もなければ、この字の右の欄の 0.8 まではみ出してよい。
+        // 振り仮名は前の字の送り仮名から少し離す（続けて読まないように）。縮めきっても入らないときだけ下げる
+        var pk = col.prevOk;
+        if (pk){
+          // 次の字の送り仮名は下で OK_DELAY まで下げうるので、ここではそれを見込む（足りなければ下で後ろの字をまとめて下げる）
+          var room = c.ruby ? -10 : c.okuri ? rStart - GAP_OK + S * OK_DELAY : S * 0.8;
+          var need = pk.len * OK_MIN;
+          y = Math.max(y, pk.top + need - room);
+          pk.c.okFit = Math.min(1, (y + room - pk.top) / pk.len);
+        } else y = Math.max(y, col.rEnd - rStart + (c.ruby ? 10 : 6));
+        c.y = y; c.n = n;
+        var rr = y + (c.ruby ? 0 : S * 0.52);
+        if (c.ruby){ c.rubyY = y + Math.max(0, (S * 0.52 - Array.from(c.ruby).length * F) / 2); rr = Math.max(y + S * 0.52, c.rubyY + Array.from(c.ruby).length * F); }
+        c.okY = rr; c.okFit = 1;
+        var okLen = Array.from(c.okuri).length * F;
+        col.rEnd = rr + okLen; col.prevOk = okLen ? {c: c, top: rr, len: okLen} : null;
+        var ll = y + S * 0.5, leftKana = c.second ? (c.second.match(/[ァ-ヶー]/g) || []).join("") : "";
+        c.leftKana = leftKana; c.lkY = ll; ll += Array.from(leftKana).length * F;
+        // 返り点は左下：字の下端をまたぐところ（天を字の 0.72 の高さに）
+        c.kaeriY = Math.max(ll, y + S * 0.72); c.kaeriN = (c.mark ? 1 : 0) + (c.re ? 1 : 0);
+        col.lEnd = c.kaeriN ? c.kaeriY + c.kaeriN * F * 0.92 : ll;
+        col.y = y + S * 1.2 + (c.punct ? S * 0.42 : 0) + (c.join ? S * 0.22 : 0);
+        col.list.push(n);
+        H = Math.max(H, col.y, col.rEnd, col.lEnd);
+      });
+      // 右の欄の送り仮名を列ごとに置き直す（字の位置は上で決まったまま）。送り仮名は字の下半分から始め、長ければ詰める。
+      // 次の字の送り仮名がその次の字までに楽に収まるなら、次の字の送り仮名を字の 0.36（OK_DELAY）まで下げて、前の長い送り仮名に場所を譲る
+      var okLen = function(c){ return Array.from(c.okuri).length * F; };
+      cols.forEach(function(col){
+        var L2 = col.list.map(function(n){ return p.chars[n]; }), prevEnd = -Infinity;
+        // 字 i の送り仮名の終わりの上限（次の字の振り仮名・送り仮名・字そのもの）。delay：次の字の送り仮名を下げる量
+        var limitOf = function(i, delay){
+          var d = L2[i + 1];
+          if (!d) return Infinity;
+          return d.ruby ? d.rubyY - 10 : d.okuri ? d.okY + delay - GAP_OK : d.y + S * 0.8;
+        };
+        L2.forEach(function(c, i){
+          if (!c.okuri) return;
+          var top = Math.max(c.okY, prevEnd + GAP_OK), len = okLen(c), d = L2[i + 1], delay = 0;
+          if (d && d.okuri && !d.ruby){
+            var slack = limitOf(i + 1, 0) - (d.okY + okLen(d));
+            delay = Math.max(0, Math.min(S * OK_DELAY, slack, top + len + GAP_OK - d.okY));
+          }
+          var lim = limitOf(i, delay);
+          // 縮めきっても入らなければ、この列の後ろの字をまとめて下げる（字どうしの間は変えない）
+          var short = top + len * OK_MIN - lim;
+          if (short > 0) L2.slice(i + 1).forEach(function(e){
+            e.y += short; e.okY += short; e.lkY += short; e.kaeriY += short; if (e.ruby) e.rubyY += short;
+            H = Math.max(H, e.y + S * 1.2 + (e.punct ? S * 0.42 : 0), e.kaeriY + e.kaeriN * F * 0.92, e.lkY + Array.from(e.leftKana).length * F);
+          });
+          if (short > 0) lim += short;
+          c.okY = top; c.okFit = Math.max(OK_MIN, Math.min(1, (lim - top) / len));
+          prevEnd = top + len * c.okFit;
+          H = Math.max(H, prevEnd);
+        });
+      });
+      var B = 0;
+      p.chars.forEach(function(c){
+        B = Math.max(B, c.y + S, c.okY + Array.from(c.okuri).length * F * c.okFit, c.lkY + Array.from(c.leftKana).length * F);
+        if (c.ruby) B = Math.max(B, c.rubyY + Array.from(c.ruby).length * F);
+        if (c.kaeriN) B = Math.max(B, c.kaeriY + (c.kaeriN - 1) * F * 0.92 + F);
+        if (c.punct) B = Math.max(B, c.y + S * 1.02 + Math.round(S * 0.6));
+        if (c.join) B = Math.max(B, c.y + S * 1.06 + Math.round(S * 0.24));
+      });
+      // 幅：列と、書き下し文との間。字が小さいと右端の列の送り仮名（24px）が右の欄（字の 0.5）からはみ出すので、その分（XR）も
+      XR = Math.max(0, F + 1 - R);
+      return {S: S, B: B, W: cols.length * PITCH - G + Math.round(S * 0.9) + XR};
+    };
+    // 要素の高さと幅に収める：字の大きさ size で収まらなければ、字の大きさと字の送りを一緒に 1px ずつ下げる（FIT_MIN まで）。
+    // 収まるときは size のまま（配置は今までと同じ）。幅は列と書き下し文（字の大きさによらない）の合計
+    var KS = P.kaki, avH = this.clientHeight, HA0 = Math.max(KS * 4, avH), W = this.clientWidth || 1184;
+    var kakiW = function(HA){
+      var perCol = Math.max(1, Math.floor(HA / KS));
+      return kaki.reduce(function(a, line){ return a + Math.max(1, Math.ceil(Array.from(plain(line)).length / perCol)); }, 0) * KS * 1.9;
+    };
+    var over = function(g){ return {h: avH ? g.B - FIT_SLACK - avH : 0, w: g.W + kakiW(avH ? HA0 : Math.max(KS * 4, H)) - W}; };
+    var g = lay(P.size), o2 = over(g);
+    while ((o2.h > 0.5 || o2.w > 0.5) && S > FIT_MIN){ g = lay(Math.max(FIT_MIN, Math.ceil(S) - 1)); o2 = over(g); }
+    if (o2.h > 0.5 || o2.w > 0.5){
+      var at = S < P.size ? "字を size=" + S + " まで小さくしても" : "size=" + S + " では";
+      if (o2.h > 0.5) console.warn("m-kanbun: " + at + "要素の高さ " + avH + "px に " + Math.ceil(g.B - avH) + "px 足りない（いちばん長い列 " + Math.ceil(g.B) + "px）。" +
+        "高さを " + Math.ceil(g.B) + "px 以上にするか、1 行の字を減らす（長い文は句読点のところで行を分ける）");
+      if (o2.w > 0.5) console.warn("m-kanbun: " + at + "要素の幅 " + W + "px に " + Math.ceil(o2.w) + "px 足りない（" + cols.length + " 列と書き下し文）。" +
+        "詩を分けて 2 枚にする（1 枚に 2 句など）");
+    }
+    var nc = cols.length, WK = nc * PITCH - G;
+    // 書き下し文：部品の高さで折り返す。列の数は字数から見積もる（振り仮名は数えない）
+    var HA = Math.max(KS * 4, avH || H), KW = kakiW(HA), GAP = Math.round(S * 0.9);
+    var X0 = Math.max(0, Math.round((W - (WK + GAP + KW + XR)) / 2));
+    this.geom = {S: S, F: F, L: L, PITCH: PITCH, WK: WK, H: H};
+    var box = function(tag, cls, css, parent, text){
+      var e = document.createElement(tag); e.className = cls; e.style.cssText = css; if (text !== undefined) e.textContent = text; (parent || self).appendChild(e); return e;
+    };
+    var kb = box("div", "kb", "position:absolute;top:0;left:" + (X0 + KW + GAP) + "px;width:" + WK + "px;height:" + Math.ceil(H) + "px;font-family:var(--font-mincho);color:var(--fg)");
+    // 列 c の左端（kb の中の x）
+    var colLeft = function(c){ return WK - (c + 1) * PITCH + G; };
+    this.cells = p.chars.map(function(c){
+      var x = colLeft(c.col) + L, e = {c: c, x: x, y: c.y};
+      e.bg = box("div", "kb-bg", "position:absolute;left:" + (x - 3) + "px;top:" + (c.y - 3) + "px;width:" + (S + 6) + "px;height:" + (S + 6) + "px;border-radius:6px;background:var(--term-tint);opacity:0", kb);
+      e.ch = box("span", "kb-ch", "position:absolute;left:" + x + "px;top:" + c.y + "px;width:" + S + "px;height:" + S + "px;font-size:" + S + "px;line-height:" + S + "px;text-align:center", kb, c.ch);
+      var vt = "writing-mode:vertical-rl;text-orientation:upright;position:absolute;font-size:" + F + "px;line-height:" + F + "px;white-space:nowrap;opacity:0;";
+      e.ann = [];
+      // 右の欄：振り仮名（上）と送り仮名（下半分から）。左の欄：再読文字の二度目の片仮名、その下に返り点
+      if (c.ruby) e.ann.push(box("span", "kb-ruby", vt + "left:" + (x + S + 1) + "px;top:" + c.rubyY + "px;color:var(--muted)", kb, c.ruby));
+      if (c.okuri) e.ann.push(box("span", "kb-ok", vt + "left:" + (x + S + 1) + "px;top:" + c.okY + "px;color:var(--term)" + okSquash(Array.from(c.okuri).length, F, c.okFit), kb, c.okuri));
+      if (c.leftKana) e.ann.push(box("span", "kb-ok kb-left", vt + "left:" + (x - F - 1) + "px;top:" + c.lkY + "px;color:var(--term)", kb, c.leftKana));
+      e.kaeri = [];
+      var ky = c.kaeriY, kx = x - F - 2;
+      var mk = function(s){ var k = box("span", "kb-kaeri", "position:absolute;left:" + kx + "px;top:" + ky + "px;width:" + F + "px;font-size:" + F + "px;line-height:" + F + "px;text-align:center;color:var(--emph);font-weight:700;opacity:0", kb, s); e.kaeri.push(k); ky += F * 0.92; };
+      if (c.mark) mk(c.mark);
+      if (c.re) mk("レ");
+      if (c.punct) e.punct = box("span", "kb-punct", "writing-mode:vertical-rl;position:absolute;left:" + (x + S * 0.2) + "px;top:" + (c.y + S * 1.02) + "px;font-size:" + Math.round(S * 0.6) + "px;line-height:" + Math.round(S * 0.6) + "px;opacity:0", kb, c.punct);
+      if (c.join) e.join = box("span", "kb-join", "position:absolute;left:" + (x + S / 2 - 1.5) + "px;top:" + (c.y + S * 1.06) + "px;width:3px;height:" + Math.round(S * 0.24) + "px;background:var(--fg);opacity:0", kb);
+      e.nums = [];
+      return e;
+    });
+    // 読む順：字ごとの番号（左上。再読文字の二度目は右上、振り仮名があれば左上の番号の上）
+    var ce = this.k.ce, NF = Math.max(24, Math.round(S * 0.4));
+    ce.forEach(function(ev, m){
+      var e = self.cells[ev.c], second = ev.kind === "second" && e.c.second !== null;
+      // 右上の番号は、字が小さいとき（要素に収めたとき）に送り仮名と重ならないよう、送り仮名の上に上げる
+      var nx = second && !e.c.ruby ? e.x + S + 1 : e.x - L, ny = second && e.c.ruby ? e.y - NF : second && e.c.okuri ? Math.min(e.y + 3, e.c.okY - NF - 1) : e.y + 3;
+      // 二桁以上は箱（幅 L）に収まるよう字の大きさだけを下げる（数字 1 つの幅を 0.75em と見て 2 px の余白を残す）。一桁は従来のまま
+      var nd = String(m + 1).length, NS = nd > 1 ? Math.floor(Math.min(NF, (L - 2) / (nd * 0.75)) * 2) / 2 : NF;
+      var nb = box("span", "kb-num", "position:absolute;left:" + nx + "px;top:" + ny + "px;width:" + L + "px;font-family:var(--font-sans);font-size:" + NS + "px;line-height:" + NF + "px;text-align:center;font-weight:700;color:var(--emph);font-variant-numeric:tabular-nums;opacity:0", kb, String(m + 1));
+      // 字の脇に添える小さい注記の印（Egatari Studio の品質チェックが字の大きさの最小を見ない。docs/contract.md §10）
+      nb.setAttribute("data-annot", "");
+      e.nums.push(nb); ev.num = nb;
+    });
+    // 目（今読んでいる字の枠）と、上へ戻るところの弧
+    this.eye = box("div", "kb-eye", "position:absolute;left:0;top:0;width:" + (S + 10) + "px;height:" + (S + 10) + "px;border:3px solid var(--emph);border-radius:9px;opacity:0", kb);
+    var svg = D.el("svg", {width: WK, height: Math.ceil(H), viewBox: "0 0 " + WK + " " + Math.ceil(H), style: "position:absolute;left:0;top:0;overflow:visible;pointer-events:none"}, kb);
+    this.jumps = [];
+    ce.forEach(function(ev, m){
+      if (m === 0) return;
+      var a = self.cells[ce[m - 1].c], b = self.cells[ev.c];
+      // 同じ列の上の字へ戻るとき（または右の列へ戻るとき）に弧を描く
+      var back = a.c.col === b.c.col ? b.c.n < a.c.n : b.c.col < a.c.col;
+      if (!back) return;
+      // 弧は左の欄（返り点・番号）の外を通す（2 次曲線の頂点は制御点までの半分）
+      var x0 = a.x - 4, y0 = a.y + S / 2, x1 = b.x - 4, y1 = b.y + S / 2, cx = Math.min(x0, x1) - S * 1.3;
+      if (a.c.col !== b.c.col){ x0 = a.x + S / 2; y0 = a.y - 4; x1 = b.x + S / 2; y1 = b.y - 4; cx = (x0 + x1) / 2; }
+      var cy = a.c.col !== b.c.col ? Math.min(y0, y1) - S * 0.8 : (y0 + y1) / 2;
+      var d = "M" + x0.toFixed(1) + "," + y0.toFixed(1) + "Q" + cx.toFixed(1) + "," + cy.toFixed(1) + " " + x1.toFixed(1) + "," + y1.toFixed(1);
+      var g = D.el("g", {opacity: 0}, svg);
+      var path = D.el("path", {d: d, fill: "none", stroke: "var(--emph)", "stroke-width": 3, "stroke-linecap": "round", pathLength: 1, "stroke-dasharray": 1, "stroke-dashoffset": 1}, g);
+      // 矢じり：終わりの点での向き（2 次曲線の終わりの接線は制御点 → 終点）
+      var ang = Math.atan2(y1 - cy, x1 - cx) * 180 / Math.PI;
+      var head = D.el("path", {d: "M0,0L-13,-6L-13,6Z", fill: "var(--emph)", transform: "translate(" + x1.toFixed(1) + " " + y1.toFixed(1) + ") rotate(" + ang.toFixed(1) + ")", opacity: 0}, g);
+      self.jumps.push({m: m, g: g, path: path, head: head});
+    });
+    // 書き下し文（縦書き、左に）
+    var kk = box("div", "kb-kaki", "position:absolute;top:0;left:" + X0 + "px;width:" + Math.ceil(KW) + "px;height:" + Math.ceil(HA) + "px;writing-mode:vertical-rl;font-family:var(--font-mincho);font-size:" + KS + "px;line-height:1.9;color:var(--fg);line-break:strict");
+    this.kakiLines = kaki.map(function(line){
+      var d = box("div", "kb-kaki-line", "opacity:0", kk);
+      line.forEach(function(s){
+        if (s.rb){ var r = document.createElement("ruby"); r.textContent = s.t; var rt = document.createElement("rt"); rt.textContent = s.rb; r.appendChild(rt); d.appendChild(r); }
+        else d.appendChild(document.createTextNode(s.t));
+      });
+      return d;
+    });
+  }
+  duration(k){
+    var st = this.stepList[k - 1], name = st && st.name;
+    if (name === "kunten") return 0.9;
+    if (name === "order") return (st.g.b - st.g.a) * this.props.slot + 0.3;
+    if (name === "kaki") return (this.kakiLines ? this.kakiLines.length : 1) * 0.3 + 0.45;
+    return 0;
+  }
+  // 読む順の段階：その段階の中で列が変わる字（order-by="all" では 2 列目からの各列の読み始め）の時刻。
+  // order-by="col" では列が変わるところで段階が分かれるので、段階の中に合図はない
+  cues(k){
+    var st = this.stepList[k - 1];
+    if (!st || st.name !== "order") return null;
+    var ce = this.kd.ce, ch = this.kd.p.chars, slot = this.props.slot, a = st.g.a, out = [];
+    for (var m = a + 1; m < st.g.b; m++) if (ch[ce[m].c].col !== ch[ce[m - 1].c].col) out.push(+((m - a) * slot).toFixed(4));
+    return out.length ? out : null;
+  }
+  render(k, t, ctx){
+    var self = this, S = this.geom.S, slot = this.props.slot;
+    // 先の段階を薄く見せる表示（授業の表示）：後の段階の訓点・読む順の番号と弧・書き下し文を、最後の形のまま --preview-opacity の濃さで
+    var preview = !!(ctx && (ctx.preview || ctx.mode === "lecture")), PV = 0.45;
+    if (preview){ PV = parseFloat(getComputedStyle(this).getPropertyValue("--preview-opacity")); if (!(PV >= 0 && PV <= 1)) PV = 0.45; }
+    // 段階 name の進み：まだなら -1、済んだら Infinity、今なら t。phases になければ、訓点は初めから済み、ほかは来ない
+    var at = function(name){ var s = self.phaseStep(name); if (!s) return name === "kunten" ? Infinity : -1; return k > s ? Infinity : k < s ? -1 : t; };
+    var pr = function(tt, a, d){ return tt < 0 ? 0 : D.prog(tt, a, d); };
+    var tk = at("kunten"), tw = at("kaki");
+    // 読む順の段階は groups の数だけ続く（first から last）。今の段階の範囲 [a, a + len) と、その中の時刻 to
+    var first = this.phaseStep("order"), G = this.k.groups, last = first ? first + G.length - 1 : 0;
+    var started = first > 0 && k >= first, done = started && k > last, a = 0, len = 0, to = -1;
+    if (started && !done){ a = G[k - first].a; len = G[k - first].b - a; to = t; }
+    var eK = pr(tk, 0, 0.4), eO = pr(tk, 0.3, 0.45), eP = pr(tk, 0.45, 0.3);
+    if (preview && tk < 0) eK = eO = eP = PV;
+    this.cells.forEach(function(e){
+      e.kaeri.forEach(function(x){ x.style.opacity = eK.toFixed(3); });
+      e.ann.forEach(function(x){ x.style.opacity = eO.toFixed(3); });
+      if (e.punct) e.punct.style.opacity = eP.toFixed(3);
+      if (e.join) e.join.style.opacity = eK.toFixed(3);
+      e.bg.style.opacity = 0;
+      // 置き字は読む順の段階から薄くする（読まない字）
+      e.ch.style.color = e.c.oki && started ? "var(--muted)" : "";
+    });
+    // 読む順：事柄 m は m * slot 秒に始まる。今の事柄 j
+    // 段階の終わりの 0.3 秒（tail）で、今の字の印（目の枠・朱の字）を消し、弧を読み終えた濃さにする：段階の長さの時点で最後の状態と同じ
+    var ce = this.k.ce, n = ce.length, j = -1, tail = done ? 1 : to >= 0 ? pr(to - len * slot, 0, 0.25) : 0;
+    if (done) j = n;
+    else if (to >= 0) j = a + Math.max(0, Math.min(len - 1, Math.floor(to / slot)));
+    // 事柄 m の始まりからの時刻
+    var lt = function(m){ return to - (m - a) * slot; };
+    var seen = {}, numFade = 1 - 0.6 * pr(tw, 0, 0.45);   // 書き下し文が出るときに番号を薄くする
+    ce.forEach(function(ev, m){
+      var e = self.cells[ev.c], v = m < j ? 1 : m === j ? pr(lt(m), 0.12 * slot, 0.3 * slot) : 0;
+      if (v > 0) seen[ev.c] = Math.max(seen[ev.c] || 0, v);
+      // 後の段階の事柄（読む順の段階の前、または今の段階より後）
+      var later = preview && first > 0 && (!started || (!done && m >= a + len));
+      ev.num.style.opacity = self.props.nums ? (later ? PV : v * numFade).toFixed(3) : 0;
+    });
+    Object.keys(seen).forEach(function(c){ self.cells[c].bg.style.opacity = (seen[c] * 0.9).toFixed(3); });
+    var fade = 1 - pr(tw, 0, 0.45);   // 書き下し文が出るときに弧を薄くする
+    this.jumps.forEach(function(J){
+      if (preview && first > 0 && (!started || (!done && J.m >= a + len))){
+        // 後の段階の弧：引き終えた形を、読み終えた弧の濃さ（0.55）のまま薄く
+        J.path.setAttribute("stroke-dashoffset", "0.0000"); J.head.setAttribute("opacity", 1); J.g.setAttribute("opacity", (0.55 * PV).toFixed(3));
+        return;
+      }
+      var d = J.m < j ? 1 : J.m === j ? pr(lt(J.m), 0, 0.35 * slot) : 0;
+      J.path.setAttribute("stroke-dashoffset", (1 - d).toFixed(4));
+      J.head.setAttribute("opacity", d >= 0.98 ? 1 : 0);
+      J.g.setAttribute("opacity", d <= 0 ? 0 : ((J.m === j && !done ? 1 - 0.45 * tail : 0.55) * fade).toFixed(3));
+    });
+    // 目：前の字から今の字へ 0.35 slot で動く。読み終えたら消える
+    if (j >= 0 && j < n && !done && tail < 1){
+      var cur = this.cells[ce[j].c], prev = j > 0 ? this.cells[ce[j - 1].c] : cur;
+      // 同じ列の中では滑らせ、列が変わるとき（次の句へ）は今の字で現れる
+      var e2 = pr(lt(j), 0, 0.35 * slot), hop = prev.c.col !== cur.c.col;
+      var x = hop ? cur.x : D.lerp(prev.x, cur.x, e2), y = hop ? cur.y : D.lerp(prev.y, cur.y, e2);
+      this.eye.style.left = (x - 8).toFixed(2) + "px"; this.eye.style.top = (y - 8).toFixed(2) + "px";
+      this.eye.style.opacity = ((j === 0 ? pr(to, 0, 0.15) : hop ? e2 : 1) * (1 - tail)).toFixed(3);
+      cur.ch.style.color = tail > 0 ? "color-mix(in srgb, var(--emph) " + (100 * (1 - tail)).toFixed(1) + "%, var(--fg))" : "var(--emph)";
+    } else this.eye.style.opacity = 0;
+    // 書き下し文：行ごとに 0.3 秒ずつ遅らせて出す
+    this.kakiLines.forEach(function(d, L){ d.style.opacity = (preview && tw < 0 && self.phaseStep("kaki") ? PV : pr(tw, L * 0.3, 0.45)).toFixed(3); });
+  }
+});
+})();