@onjmin/dtm 0.1.0 → 0.1.1

package/dist/index.mjs

@@ -190,7 +190,7 @@ var buildChordPlacements = (options) => {
       if (notes.length === 0) return;
       const startStep = barIndex * chordLength;
       notes.forEach((noteOffset, i) => {
-        const stepOffset = i * 2;
+        const stepOffset = i * 3;
         placements.push({
           startStep: startStep + stepOffset,
           pitch: C3 + noteOffset + offset,
@@ -608,6 +608,1123 @@ var DRUM_PATTERNS = {
   ]
 };
 
+// node_modules/.pnpm/@onjmin+koe@1.0.3/node_modules/@onjmin/koe/dist/index.js
+var MAGIC = 1263486208;
+function parseKoeHeader(headerBytes) {
+  const view = new DataView(headerBytes);
+  if (view.byteLength < 8 || view.getUint32(0, false) !== MAGIC) {
+    throw new Error("Not a .koe file (bad magic)");
+  }
+  return { jsonLength: view.getUint32(4, true) };
+}
+var pcmBase = (jsonLength) => 8 + jsonLength;
+var BlobVoiceSource = class {
+  constructor(blob, base) {
+    this.blob = blob;
+    this.base = base;
+  }
+  blob;
+  base;
+  readBytes(offset, length) {
+    const start = this.base + offset;
+    return this.blob.slice(start, start + length).arrayBuffer();
+  }
+};
+var RangeVoiceSource = class {
+  constructor(url, base) {
+    this.url = url;
+    this.base = base;
+  }
+  url;
+  base;
+  async readBytes(offset, length) {
+    const start = this.base + offset;
+    const res = await fetch(this.url, {
+      headers: { Range: `bytes=${start}-${start + length - 1}` }
+    });
+    if (!res.ok && res.status !== 206) {
+      throw new Error(`.koe range request failed: ${res.status}`);
+    }
+    return res.arrayBuffer();
+  }
+};
+async function rangeFetch(url, start, length) {
+  const res = await fetch(url, {
+    headers: { Range: `bytes=${start}-${start + length - 1}` }
+  });
+  if (!res.ok && res.status !== 206)
+    throw new Error(`.koe fetch failed: ${res.status}`);
+  return res.arrayBuffer();
+}
+var VoiceBank = class _VoiceBank {
+  constructor(manifest, source) {
+    this.manifest = manifest;
+    this.source = source;
+  }
+  manifest;
+  source;
+  /**
+   * Parse a .koe archive header + manifest and bind a lazy PCM source.
+   * @param koe a Blob/File of the .koe archive, or a URL (served with Range support)
+   */
+  static async load(koe) {
+    if (typeof koe === "string") {
+      const header2 = await rangeFetch(koe, 0, 8);
+      const { jsonLength: jsonLength2 } = parseKoeHeader(header2);
+      const json2 = await rangeFetch(koe, 8, jsonLength2);
+      const manifest2 = JSON.parse(new TextDecoder().decode(json2));
+      return new _VoiceBank(
+        manifest2,
+        new RangeVoiceSource(koe, pcmBase(jsonLength2))
+      );
+    }
+    const header = await koe.slice(0, 8).arrayBuffer();
+    const { jsonLength } = parseKoeHeader(header);
+    const json = await koe.slice(8, 8 + jsonLength).arrayBuffer();
+    const manifest = JSON.parse(new TextDecoder().decode(json));
+    return new _VoiceBank(
+      manifest,
+      new BlobVoiceSource(koe, pcmBase(jsonLength))
+    );
+  }
+  /** True if the bank contains a phoneme under this alias. */
+  has(phoneme) {
+    return this.manifest.phonemes[phoneme] !== void 0;
+  }
+  /**
+   * Raw Int16 PCM bytes (48 kHz / mono) for a phoneme, or null if unknown.
+   * The returned ArrayBuffer is freshly allocated and safe to transfer to a
+   * worker / AudioWorklet.
+   */
+  async readPcmBytes(phoneme) {
+    const entry = this.manifest.phonemes[phoneme];
+    if (!entry) return null;
+    return this.source.readBytes(entry.offset, entry.length * 2);
+  }
+  /**
+   * A phoneme's PCM as a Float64Array normalised to [-1, 1], or null if unknown.
+   * Intended for external analysis / resynthesis such as the WORLD vocoder.
+   */
+  async getPcm(phoneme) {
+    const buf = await this.readPcmBytes(phoneme);
+    if (!buf) return null;
+    const int16 = new Int16Array(buf);
+    const f64 = new Float64Array(int16.length);
+    for (let i = 0; i < int16.length; i++) f64[i] = int16[i] / 32768;
+    return f64;
+  }
+};
+var WORLDLINE_SAMPLE_RATE = 48e3;
+var MIN_WORLDLINE_SAMPLES = 4096;
+var SYNTH_REQ_SIZE = 120;
+var WL_FRAME_MS = 10;
+var samplesToMs = (samples) => samples / WORLDLINE_SAMPLE_RATE * 1e3;
+function leadInFromEntry(entry) {
+  return {
+    preMs: samplesToMs(entry.pre || 0),
+    consonantMs: samplesToMs(entry.consonant || 0)
+  };
+}
+var moduleCache = /* @__PURE__ */ new Map();
+function injectScript(src) {
+  return new Promise((resolve, reject) => {
+    const existing = document.querySelector(
+      `script[data-koe-worldline="${src}"]`
+    );
+    if (existing) {
+      resolve();
+      return;
+    }
+    const s = document.createElement("script");
+    s.src = src;
+    s.dataset.koeWorldline = src;
+    s.onload = () => resolve();
+    s.onerror = () => reject(new Error(`worldline: failed to load ${src}`));
+    document.head.appendChild(s);
+  });
+}
+function loadWasm(scriptUrl) {
+  const cached = moduleCache.get(scriptUrl);
+  if (cached) return cached;
+  const baseUrl = scriptUrl.slice(0, scriptUrl.lastIndexOf("/") + 1);
+  const instantiate = () => {
+    const factory = globalThis.WorldlineModule;
+    if (!factory)
+      throw new Error(
+        "worldline: WorldlineModule global was not defined by the script"
+      );
+    return factory({ locateFile: (f) => baseUrl + f });
+  };
+  let promise;
+  if (typeof document !== "undefined") {
+    promise = injectScript(scriptUrl).then(instantiate);
+  } else if (typeof globalThis.importScripts === "function") {
+    promise = Promise.resolve().then(() => {
+      globalThis.importScripts(scriptUrl);
+      return instantiate();
+    });
+  } else {
+    return Promise.reject(
+      new Error(
+        "Worldline.load requires a DOM or a classic Web Worker (importScripts) to load worldline.js"
+      )
+    );
+  }
+  moduleCache.set(scriptUrl, promise);
+  return promise;
+}
+var Worldline = class _Worldline {
+  constructor(wasm) {
+    this.wasm = wasm;
+  }
+  wasm;
+  sampleRate = WORLDLINE_SAMPLE_RATE;
+  /**
+   * Load + instantiate the worldline WASM module (deduped per scriptUrl).
+   *
+   * Works on the main thread (loads via `<script>`) and inside a classic Web
+   * Worker (loads via `importScripts`), so the heavy synthesis can run
+   * off-thread. The matching `worldline.wasm` is fetched next to scriptUrl.
+   */
+  static async load(options) {
+    return new _Worldline(await loadWasm(options.scriptUrl));
+  }
+  /**
+   * Render one note to Float32 PCM at 48 kHz.
+   *
+   * The output buffer is laid out as [lead-in/consonant ≈ preMs][vowel ≈
+   * durationMs], rendered from sample offset 0 (no leading silence). The vowel
+   * onset (the "beat") sits at ≈ preMs into the buffer, so a sequencer should
+   * place the buffer at `beatTime − preMs` and may trim/crossfade the lead-in.
+   *
+   * No internal crossfade is applied — apply fades externally.
+   *
+   * @returns Float32 PCM, or null when `pcm` is shorter than
+   *          {@link MIN_WORLDLINE_SAMPLES} (too short for stable F0 analysis).
+   */
+  renderNote(params) {
+    const { pcm, pitch, durationMs, preMs, consonantMs, tempo = 120 } = params;
+    if (!pcm || pcm.length < MIN_WORLDLINE_SAMPLES) return null;
+    const WL = this.wasm;
+    const FS = WORLDLINE_SAMPLE_RATE;
+    const midiNote = Math.round(69 + 12 * Math.log2(pitch / 440));
+    const posMs = 0;
+    const reqLen = preMs + durationMs;
+    const cutMs = WL_FRAME_MS * 2;
+    const ps = WL._PhraseSynthNew();
+    if (!ps) return null;
+    const reqPtr = WL._malloc(SYNTH_REQ_SIZE);
+    if (!reqPtr) {
+      WL._PhraseSynthDelete(ps);
+      return null;
+    }
+    const samplePtr = WL._malloc(pcm.length * 8);
+    if (!samplePtr) {
+      WL._free(reqPtr);
+      WL._PhraseSynthDelete(ps);
+      return null;
+    }
+    WL.HEAPF64.set(pcm, samplePtr >> 3);
+    const sv = (off, val, type) => WL.setValue(reqPtr + off, val, type);
+    sv(0, FS, "i32");
+    sv(4, pcm.length, "i32");
+    sv(8, samplePtr, "*");
+    sv(12, 0, "i32");
+    sv(16, 0, "*");
+    sv(20, midiNote, "i32");
+    sv(24, 100, "double");
+    sv(32, 0, "double");
+    sv(40, reqLen, "double");
+    sv(48, consonantMs, "double");
+    sv(56, cutMs, "double");
+    sv(64, 100, "double");
+    sv(72, 0, "double");
+    sv(80, tempo, "double");
+    sv(88, 0, "i32");
+    sv(92, 0, "*");
+    sv(96, 0, "i32");
+    sv(100, 0, "i32");
+    sv(104, 100, "i32");
+    sv(108, 0, "i32");
+    sv(112, 0, "i32");
+    sv(116, 100, "i32");
+    WL._PhraseSynthAddRequest(ps, reqPtr, posMs, 0, reqLen, 0, 0, 0);
+    WL._free(samplePtr);
+    WL._free(reqPtr);
+    const totalMs = posMs + reqLen + WL_FRAME_MS * 2;
+    const nFrames = Math.ceil(totalMs / WL_FRAME_MS) + 4;
+    const f0Arr = new Float64Array(nFrames).fill(pitch);
+    const gArr = new Float64Array(nFrames).fill(0.5);
+    const tArr = new Float64Array(nFrames).fill(0.5);
+    const bArr = new Float64Array(nFrames).fill(0.5);
+    const vArr = new Float64Array(nFrames).fill(1);
+    const f0Ptr = WL._malloc(nFrames * 8);
+    const gPtr = WL._malloc(nFrames * 8);
+    const tPtr = WL._malloc(nFrames * 8);
+    const bPtr = WL._malloc(nFrames * 8);
+    const vPtr = WL._malloc(nFrames * 8);
+    if (!f0Ptr || !gPtr || !tPtr || !bPtr || !vPtr) {
+      if (f0Ptr) WL._free(f0Ptr);
+      if (gPtr) WL._free(gPtr);
+      if (tPtr) WL._free(tPtr);
+      if (bPtr) WL._free(bPtr);
+      if (vPtr) WL._free(vPtr);
+      WL._PhraseSynthDelete(ps);
+      return null;
+    }
+    WL.HEAPF64.set(f0Arr, f0Ptr >> 3);
+    WL.HEAPF64.set(gArr, gPtr >> 3);
+    WL.HEAPF64.set(tArr, tPtr >> 3);
+    WL.HEAPF64.set(bArr, bPtr >> 3);
+    WL.HEAPF64.set(vArr, vPtr >> 3);
+    WL._PhraseSynthSetCurves(
+      ps,
+      f0Ptr,
+      gPtr,
+      tPtr,
+      bPtr,
+      vPtr,
+      nFrames,
+      WL_FRAME_MS
+    );
+    WL._free(f0Ptr);
+    WL._free(gPtr);
+    WL._free(tPtr);
+    WL._free(bPtr);
+    WL._free(vPtr);
+    const yPtrPtr = WL._malloc(4);
+    if (!yPtrPtr) {
+      WL._PhraseSynthDelete(ps);
+      return null;
+    }
+    const outLen = WL._PhraseSynthSynth(ps, yPtrPtr, 0);
+    const yPtr = WL.getValue(yPtrPtr, "*");
+    const audio = outLen > 0 ? new Float32Array(WL.HEAPF32.buffer, yPtr, outLen).slice() : null;
+    WL._free(yPtrPtr);
+    WL._PhraseSynthDelete(ps);
+    return audio;
+  }
+};
+
+// src/lyrics.ts
+var kanaTable = {
+  \u3042: ["", "a"],
+  \u3044: ["", "i"],
+  \u3046: ["", "u"],
+  \u3048: ["", "e"],
+  \u304A: ["", "o"],
+  \u304B: ["k", "a"],
+  \u304D: ["k", "i"],
+  \u304F: ["k", "u"],
+  \u3051: ["k", "e"],
+  \u3053: ["k", "o"],
+  \u3055: ["s", "a"],
+  \u3057: ["sh", "i"],
+  \u3059: ["s", "u"],
+  \u305B: ["s", "e"],
+  \u305D: ["s", "o"],
+  \u305F: ["t", "a"],
+  \u3061: ["ch", "i"],
+  \u3064: ["ts", "u"],
+  \u3066: ["t", "e"],
+  \u3068: ["t", "o"],
+  \u306A: ["n", "a"],
+  \u306B: ["n", "i"],
+  \u306C: ["n", "u"],
+  \u306D: ["n", "e"],
+  \u306E: ["n", "o"],
+  \u306F: ["h", "a"],
+  \u3072: ["h", "i"],
+  \u3075: ["f", "u"],
+  \u3078: ["h", "e"],
+  \u307B: ["h", "o"],
+  \u307E: ["m", "a"],
+  \u307F: ["m", "i"],
+  \u3080: ["m", "u"],
+  \u3081: ["m", "e"],
+  \u3082: ["m", "o"],
+  \u3084: ["y", "a"],
+  \u3086: ["y", "u"],
+  \u3088: ["y", "o"],
+  \u3089: ["r", "a"],
+  \u308A: ["r", "i"],
+  \u308B: ["r", "u"],
+  \u308C: ["r", "e"],
+  \u308D: ["r", "o"],
+  \u308F: ["w", "a"],
+  \u3092: ["w", "o"],
+  \u304C: ["g", "a"],
+  \u304E: ["g", "i"],
+  \u3050: ["g", "u"],
+  \u3052: ["g", "e"],
+  \u3054: ["g", "o"],
+  \u3056: ["z", "a"],
+  \u3058: ["j", "i"],
+  \u305A: ["z", "u"],
+  \u305C: ["z", "e"],
+  \u305E: ["z", "o"],
+  \u3060: ["d", "a"],
+  \u3062: ["j", "i"],
+  \u3065: ["z", "u"],
+  \u3067: ["d", "e"],
+  \u3069: ["d", "o"],
+  \u3070: ["b", "a"],
+  \u3073: ["b", "i"],
+  \u3076: ["b", "u"],
+  \u3079: ["b", "e"],
+  \u307C: ["b", "o"],
+  \u3071: ["p", "a"],
+  \u3074: ["p", "i"],
+  \u3077: ["p", "u"],
+  \u307A: ["p", "e"],
+  \u307D: ["p", "o"],
+  \u3093: ["N", "N"]
+};
+var SMALL_KANA = "\u3041\u3043\u3045\u3047\u3049\u3083\u3085\u3087\u3063";
+var VOWEL_KANA = {
+  a: "\u3042",
+  i: "\u3044",
+  u: "\u3046",
+  e: "\u3048",
+  o: "\u304A"
+};
+var sanitizeText = (text) => text.normalize("NFKC").replace(/[ァ-ヶ]/g, (c) => String.fromCharCode(c.charCodeAt(0) - 96)).replace(/[^ぁ-ゖー]/g, "");
+var splitSyllables = (text) => {
+  const result = [];
+  for (const ch of text) {
+    if (result.length > 0 && SMALL_KANA.includes(ch)) {
+      result[result.length - 1] += ch;
+    } else {
+      result.push(ch);
+    }
+  }
+  return result;
+};
+var kanaToVowel = (kana) => {
+  if (/[ぁゃ]/.test(kana)) return "a";
+  if (/[ぃ]/.test(kana)) return "i";
+  if (/[ぅゅ]/.test(kana)) return "u";
+  if (/[ぇ]/.test(kana)) return "e";
+  if (/[ぉょ]/.test(kana)) return "o";
+  if (/[あかさたなはまやらわがざだばぱ]/.test(kana)) return "a";
+  if (/[いきしちにひみりぎじぢびぴ]/.test(kana)) return "i";
+  if (/[うくすつぬふむゆるぐずづぶぷ]/.test(kana)) return "u";
+  if (/[えけせてねへめれげぜでべぺ]/.test(kana)) return "e";
+  if (/[おこそとのほもよろごぞどぼぽ]/.test(kana)) return "o";
+  return "";
+};
+var analyzeSyllable = (syllable) => {
+  if (syllable === "\u30FC") return { kana: syllable, consonant: "-", vowel: "-" };
+  if (syllable === "\u3063") return { kana: syllable, consonant: "Q", vowel: "" };
+  const head = syllable[0];
+  const row = kanaTable[head];
+  const consonant = row ? row[0] : "";
+  let vowel = row ? row[1] : kanaToVowel(head);
+  if (syllable.length === 2 && syllable[1] !== "\u3063") {
+    const v = kanaToVowel(syllable[1]);
+    if (v) vowel = v;
+  }
+  return { kana: syllable, consonant, vowel };
+};
+var resolveLongVowels = (syllables) => {
+  const result = [];
+  let prevVowel = "";
+  for (const syl of syllables) {
+    if (syl.consonant === "-") {
+      if (!prevVowel) continue;
+      result.push({
+        kana: VOWEL_KANA[prevVowel] ?? syl.kana,
+        consonant: "",
+        vowel: prevVowel
+      });
+      continue;
+    }
+    if (syl.vowel && syl.vowel !== "N") prevVowel = syl.vowel;
+    result.push(syl);
+  }
+  return result;
+};
+var normalizeLyrics = (text) => resolveLongVowels(splitSyllables(sanitizeText(text)).map(analyzeSyllable));
+var normalizeLyricLines = (lines) => {
+  const syllables = [];
+  const lineBreaks = [];
+  for (const line of lines) {
+    const part = normalizeLyrics(line);
+    if (part.length === 0) continue;
+    if (syllables.length > 0) lineBreaks.push(syllables.length);
+    syllables.push(...part);
+  }
+  return { syllables, lineBreaks };
+};
+var LYRIC_LINE = /^@@(\d+)\s+(.*)$/;
+var isLyricContinuation = (seg) => !/^[@#]/.test(seg);
+var splitSegments = (mml) => mml.split(/[;\n\r]+/).map((s) => s.trim()).filter((s) => s.length > 0);
+var clamp = (value, lo, hi) => Math.min(hi, Math.max(lo, value));
+var MAX_VOCAL_VOLUME = 400;
+var VOCAL_BOOST_DB_PER_PERCENT = 0.08;
+var vocalVolumeToGain = (v) => {
+  if (v <= 0) return 0;
+  if (v <= 100) return v / 100;
+  return 10 ** ((v - 100) * VOCAL_BOOST_DB_PER_PERCENT / 20);
+};
+var parseLyrics = (mml) => {
+  const tracks = /* @__PURE__ */ new Map();
+  const segments = splitSegments(mml);
+  for (let i = 0; i < segments.length; i++) {
+    const m = segments[i].match(LYRIC_LINE);
+    if (!m) continue;
+    const trackId = Number.parseInt(m[1], 10);
+    const tokens = m[2].trim().split(/\s+/);
+    const modelToken = tokens.shift() ?? "";
+    let volume = 300;
+    let gate = 100;
+    let pan = 64;
+    const colon = modelToken.indexOf(":");
+    const model = (colon === -1 ? modelToken : modelToken.slice(0, colon)).toLowerCase();
+    if (colon !== -1) {
+      const v = Number.parseInt(modelToken.slice(colon + 1), 10);
+      if (Number.isFinite(v)) volume = clamp(v, 0, MAX_VOCAL_VOLUME);
+    }
+    const metaTokens = [modelToken];
+    while (tokens.length > 0) {
+      const v = /^v(\d+)$/.exec(tokens[0]);
+      const q2 = /^q(\d+)$/.exec(tokens[0]);
+      const p = /^p(\d+)$/.exec(tokens[0]);
+      if (v) {
+        volume = clamp(Number.parseInt(v[1], 10), 0, MAX_VOCAL_VOLUME);
+      } else if (q2) {
+        gate = clamp(Number.parseInt(q2[1], 10), 0, 100);
+      } else if (p) {
+        pan = clamp(Number.parseInt(p[1], 10), 0, 127);
+      } else {
+        break;
+      }
+      metaTokens.push(tokens.shift());
+    }
+    const lyricLines = [tokens.join(" ")];
+    while (i + 1 < segments.length && isLyricContinuation(segments[i + 1])) {
+      lyricLines.push(segments[++i]);
+    }
+    const { syllables, lineBreaks } = normalizeLyricLines(lyricLines);
+    tracks.set(trackId, {
+      trackId,
+      model,
+      volume,
+      gate,
+      pan,
+      syllables,
+      metaText: metaTokens.join(" "),
+      ...lineBreaks.length > 0 ? { lineBreaks } : {}
+    });
+  }
+  return tracks;
+};
+var stripLyrics = (mml) => {
+  const segments = splitSegments(mml);
+  const kept = [];
+  for (let i = 0; i < segments.length; i++) {
+    if (LYRIC_LINE.test(segments[i])) {
+      while (i + 1 < segments.length && isLyricContinuation(segments[i + 1]))
+        i++;
+      continue;
+    }
+    kept.push(segments[i]);
+  }
+  return kept.join("\n");
+};
+var panToStereo = (pan) => Math.max(-1, Math.min(1, (pan - 64) / 64));
+var createLyricsConductor = (lyrics) => {
+  const pointers = /* @__PURE__ */ new Map();
+  const consume = (trackId) => {
+    const track = lyrics.get(trackId);
+    if (!track || track.syllables.length === 0) return null;
+    const ptr = pointers.get(trackId) ?? 0;
+    const syllable = track.syllables[ptr];
+    if (!syllable) return null;
+    pointers.set(trackId, ptr + 1);
+    return {
+      model: track.model,
+      syllable,
+      volume: vocalVolumeToGain(track.volume ?? 300),
+      gate: (track.gate ?? 100) / 100,
+      pan: panToStereo(track.pan ?? 64)
+    };
+  };
+  const reset = () => pointers.clear();
+  return { consume, reset };
+};
+var FORMANTS = {
+  a: [800, 1200],
+  i: [300, 2300],
+  u: [350, 800],
+  e: [500, 1900],
+  o: [500, 900],
+  // 撥音(ん)は鼻音寄りの低フォルマント
+  N: [250, 1e3]
+};
+var midiToFreq = (m) => 440 * 2 ** ((m - 69) / 12);
+var createKlattVoice = (ctx, destination) => {
+  const active = /* @__PURE__ */ new Set();
+  const voice = (syllable, e) => {
+    const t0 = ctx.currentTime + e.when;
+    const peak = Math.max(1e-4, e.volume);
+    if (syllable.vowel === "" || syllable.consonant === "Q") return;
+    const [f1, f2] = FORMANTS[syllable.vowel] ?? FORMANTS.a;
+    const attack = 0.02;
+    const release = 0.06;
+    const sustainEnd = t0 + Math.max(attack + 0.02, e.duration);
+    let panner = null;
+    let out = destination;
+    if (typeof ctx.createStereoPanner === "function") {
+      panner = ctx.createStereoPanner();
+      panner.pan.value = Math.max(-1, Math.min(1, e.pan ?? 0));
+      panner.connect(destination);
+      out = panner;
+    }
+    const osc = ctx.createOscillator();
+    osc.type = "sawtooth";
+    osc.frequency.value = midiToFreq(e.pitch);
+    const makeFormant = (freq, q2, gainScale) => {
+      const filter = ctx.createBiquadFilter();
+      filter.type = "bandpass";
+      filter.frequency.value = freq;
+      filter.Q.value = q2;
+      const g = ctx.createGain();
+      g.gain.value = gainScale;
+      osc.connect(filter).connect(g);
+      return g;
+    };
+    const env = ctx.createGain();
+    env.gain.setValueAtTime(1e-4, t0);
+    env.gain.exponentialRampToValueAtTime(peak, t0 + attack);
+    env.gain.setValueAtTime(peak, sustainEnd);
+    env.gain.exponentialRampToValueAtTime(1e-4, sustainEnd + release);
+    const MAKEUP = 4;
+    makeFormant(f1, 6, MAKEUP).connect(env);
+    makeFormant(f2, 9, MAKEUP * 0.7).connect(env);
+    env.connect(out);
+    const fricatives = /* @__PURE__ */ new Set(["s", "sh", "ch", "ts", "h", "f"]);
+    if (fricatives.has(syllable.consonant)) {
+      const dur = 0.05;
+      const length = Math.max(1, Math.floor(ctx.sampleRate * dur));
+      const buffer = ctx.createBuffer(1, length, ctx.sampleRate);
+      const data = buffer.getChannelData(0);
+      for (let i = 0; i < length; i++) data[i] = Math.random() * 2 - 1;
+      const src = ctx.createBufferSource();
+      src.buffer = buffer;
+      const hp = ctx.createBiquadFilter();
+      hp.type = "highpass";
+      hp.frequency.value = syllable.consonant === "sh" ? 3e3 : 4500;
+      const ng = ctx.createGain();
+      ng.gain.setValueAtTime(peak * 0.5, t0);
+      ng.gain.exponentialRampToValueAtTime(1e-4, t0 + dur);
+      src.connect(hp).connect(ng).connect(out);
+      src.start(t0);
+      src.stop(t0 + dur);
+      active.add(src);
+      src.onended = () => {
+        active.delete(src);
+        src.disconnect();
+        hp.disconnect();
+        ng.disconnect();
+      };
+    }
+    osc.start(t0);
+    osc.stop(sustainEnd + release + 0.02);
+    active.add(osc);
+    osc.onended = () => {
+      active.delete(osc);
+      osc.disconnect();
+      panner?.disconnect();
+    };
+  };
+  voice.stopAll = () => {
+    for (const n of active) {
+      try {
+        n.stop();
+      } catch {
+      }
+      n.disconnect();
+    }
+    active.clear();
+  };
+  return voice;
+};
+var KOE_BASE_URL = "https://pub-12482a6b5cbc4c9e906b2e1904cabae5.r2.dev";
+var KOE_VOICEBANKS = {
+  tsukuyomi: "\u3064\u304F\u3088\u307F\u3061\u3083\u3093.koe",
+  rino: "\u6625\u97F3\u30EA\u30CEver0.3.koe",
+  roze: "\u675F\u97F3\u30ED\u30BCver0.\uFF151(\u591A\u97F3\u968E).koe",
+  ruko: "\u6B32\u97F3\u30EB\u30B3\u2640\u6B4C\u9023\u7D9A\u97F3\u666E1.00.koe",
+  teto: "\u91CD\u97F3\u30C6\u30C8\u5358\u72EC\u97F3.koe",
+  shiyo: "\u9769\u547D\u30B7\u30E8.koe"
+};
+var KOE_VOICEBANK_LABELS = {
+  tsukuyomi: "\u3064\u304F\u3088\u307F\u3061\u3083\u3093",
+  rino: "\u6625\u97F3\u30EA\u30CE",
+  roze: "\u675F\u97F3\u30ED\u30BC",
+  ruko: "\u6B32\u97F3\u30EB\u30B3",
+  teto: "\u91CD\u97F3\u30C6\u30C8",
+  shiyo: "\u9769\u547D\u30B7\u30E8"
+};
+var koeUrl = (name, base = KOE_BASE_URL) => `${base}/${encodeURIComponent(name)}`;
+var DEFAULT_WORLDLINE_SCRIPT = "https://onjmin.github.io/koe/demo/world/worldline.js";
+var KOE_SAMPLE_RATE = 48e3;
+var expandSeparators = (candidate) => candidate.includes(" ") ? [candidate, candidate.replace(/ /g, "\u3000"), candidate.replace(/ /g, "")] : [candidate];
+var PITCH_SUFFIX = /_([A-G][#b]?-?\d+)$/;
+var NAME_SEMITONE = {
+  c: 0,
+  d: 2,
+  e: 4,
+  f: 5,
+  g: 7,
+  a: 9,
+  b: 11
+};
+var pitchTokenToMidi = (token) => {
+  const m = /^([A-Ga-g])([#b]?)(-?\d+)$/.exec(token);
+  if (!m) return null;
+  let semi = NAME_SEMITONE[m[1].toLowerCase()];
+  if (m[2] === "#") semi++;
+  else if (m[2] === "b") semi--;
+  return (Number.parseInt(m[3], 10) + 1) * 12 + semi;
+};
+var collectPitchTokens = (aliases) => {
+  const seen = /* @__PURE__ */ new Map();
+  for (const a of aliases) {
+    const m = PITCH_SUFFIX.exec(a);
+    if (!m || seen.has(m[1])) continue;
+    const midi = pitchTokenToMidi(m[1]);
+    if (midi != null) seen.set(m[1], midi);
+  }
+  return [...seen].map(([token, midi]) => ({ token, midi }));
+};
+var resolveKoeAlias = (hasAlias, pitchTokens, syl, prevVowel, noteNum) => {
+  const kana = syl.kana;
+  const cons = syl.consonant === "N" ? "n" : syl.consonant;
+  const vow = syl.vowel === "N" ? "" : syl.vowel;
+  const romaji = `${cons}${vow}` || vow;
+  const pv = prevVowel || "-";
+  const raw = [
+    // 連続音（VCV）: 直前母音つき
+    `${pv} ${kana}`,
+    `${pv} ${romaji}`,
+    // 単独音 / CVVC
+    kana,
+    romaji
+  ];
+  const vk = VOWEL_KANA[syl.vowel];
+  if (vk) raw.push(`${pv} ${vk}`, vk, syl.vowel);
+  if (syl.vowel === "N") raw.push("\u3093", "n", "N", `${pv} \u3093`);
+  const seen = /* @__PURE__ */ new Set();
+  const tryAlias = (candidate) => {
+    for (const v of expandSeparators(candidate)) {
+      if (seen.has(v)) continue;
+      seen.add(v);
+      if (hasAlias(v)) return v;
+    }
+    return null;
+  };
+  if (pitchTokens.length) {
+    const nearest = pitchTokens.slice().sort((a, b) => Math.abs(a.midi - noteNum) - Math.abs(b.midi - noteNum));
+    for (const { token } of nearest) {
+      for (const base of raw) {
+        const hit = tryAlias(`${base}_${token}`);
+        if (hit) return hit;
+      }
+    }
+  }
+  for (const base of raw) {
+    const hit = tryAlias(base);
+    if (hit) return hit;
+  }
+  return null;
+};
+var createLocalBackend = async (options) => {
+  const bank = await VoiceBank.load(options.koe);
+  const worldline = options.lightweight ? null : await Worldline.load({
+    scriptUrl: options.worldlineScriptUrl ?? DEFAULT_WORLDLINE_SCRIPT
+  }).catch(() => null);
+  const pcmCache = /* @__PURE__ */ new Map();
+  const getPcm = (alias) => {
+    let p = pcmCache.get(alias);
+    if (!p) {
+      p = bank.getPcm(alias);
+      pcmCache.set(alias, p);
+    }
+    return p;
+  };
+  const renderAlias = async (alias, pitch, durationMs) => {
+    const pcm = await getPcm(alias);
+    if (!pcm || pcm.length === 0) return null;
+    const entry = bank.manifest.phonemes[alias];
+    const lead = leadInFromEntry(entry);
+    const targetHz = midiToFreq(pitch);
+    if (worldline) {
+      const audio = worldline.renderNote({
+        pcm,
+        pitch: targetHz,
+        durationMs,
+        ...lead
+      });
+      if (audio) return { pcm: audio, preSec: lead.preMs / 1e3, rate: 1 };
+    }
+    const rate = entry.pitch > 0 ? targetHz / entry.pitch : 1;
+    return {
+      pcm: Float32Array.from(pcm),
+      preSec: entry.pre / KOE_SAMPLE_RATE / rate,
+      rate
+    };
+  };
+  return {
+    hasAlias: (a) => bank.has(a),
+    pitchTokens: collectPitchTokens(Object.keys(bank.manifest.phonemes)),
+    renderAlias,
+    dispose: () => {
+    }
+  };
+};
+var spawnVoiceWorker = async (url) => {
+  const sameOrigin = new URL(url, location.href).origin === location.origin;
+  if (sameOrigin) return new Worker(url);
+  const text = await fetch(url).then((r) => r.text());
+  return new Worker(
+    URL.createObjectURL(new Blob([text], { type: "text/javascript" }))
+  );
+};
+var createWorkerBackend = async (workerUrl, options) => {
+  const worker = await spawnVoiceWorker(workerUrl);
+  const aliasSet = /* @__PURE__ */ new Set();
+  const pending = /* @__PURE__ */ new Map();
+  let reqId = 0;
+  let onReady = null;
+  let onFail = null;
+  worker.onmessage = (ev) => {
+    const m = ev.data;
+    if (m.type === "ready") {
+      for (const a of m.aliases) aliasSet.add(a);
+      onReady?.();
+    } else if (m.type === "error") {
+      onFail?.(new Error(m.message));
+    } else if (m.type === "rendered") {
+      const cb = pending.get(m.id);
+      if (cb) {
+        pending.delete(m.id);
+        cb(m);
+      }
+    }
+  };
+  worker.onerror = (e) => onFail?.(
+    new Error(`voice worker error: ${e.message || e}`)
+  );
+  await new Promise((resolve, reject) => {
+    onReady = resolve;
+    onFail = reject;
+    worker.postMessage({
+      type: "init",
+      koe: options.koe,
+      worldlineScriptUrl: options.worldlineScriptUrl ?? DEFAULT_WORLDLINE_SCRIPT,
+      lightweight: !!options.lightweight
+    });
+  });
+  onReady = null;
+  onFail = null;
+  const renderAlias = (alias, pitch, durationMs) => new Promise((resolve) => {
+    const id = ++reqId;
+    pending.set(
+      id,
+      (m) => resolve(
+        m.pcm ? { pcm: m.pcm, preSec: m.preSec ?? 0, rate: m.rate ?? 1 } : null
+      )
+    );
+    worker.postMessage({
+      type: "render",
+      id,
+      alias,
+      pitch,
+      durationMs
+    });
+  });
+  return {
+    hasAlias: (a) => aliasSet.has(a),
+    pitchTokens: collectPitchTokens(aliasSet),
+    renderAlias,
+    dispose: () => worker.terminate()
+  };
+};
+var createKoeVoice = async (ctx, destination, options) => {
+  const backend = options.voiceWorkerUrl ? await createWorkerBackend(options.voiceWorkerUrl, options) : await createLocalBackend(options);
+  const renderCache = /* @__PURE__ */ new Map();
+  const inflight = /* @__PURE__ */ new Map();
+  const active = /* @__PURE__ */ new Set();
+  let prevVowel = "";
+  const keyOf = (alias, pitch, durationMs) => `${alias}|${pitch}|${Math.round(durationMs / 10) * 10}`;
+  const renderInto = (alias, pitch, durationMs) => {
+    const key = keyOf(alias, pitch, durationMs);
+    const existing = renderCache.get(key);
+    if (existing !== void 0) return Promise.resolve(existing);
+    const flying = inflight.get(key);
+    if (flying) return flying;
+    const p = (async () => {
+      const out = await backend.renderAlias(alias, pitch, durationMs);
+      let rendered = null;
+      if (out) {
+        const buf = ctx.createBuffer(1, out.pcm.length, KOE_SAMPLE_RATE);
+        buf.copyToChannel(out.pcm, 0);
+        rendered = { audio: buf, preSec: out.preSec, rate: out.rate };
+      }
+      renderCache.set(key, rendered);
+      inflight.delete(key);
+      return rendered;
+    })();
+    inflight.set(key, p);
+    return p;
+  };
+  const LEADCAP_S = 0.09;
+  const schedule = (r, t0, peak, pan) => {
+    let out = destination;
+    let panner = null;
+    if (typeof ctx.createStereoPanner === "function") {
+      panner = ctx.createStereoPanner();
+      panner.pan.value = Math.max(-1, Math.min(1, pan));
+      panner.connect(destination);
+      out = panner;
+    }
+    const src = ctx.createBufferSource();
+    src.buffer = r.audio;
+    src.playbackRate.value = r.rate;
+    const effPre = Math.min(r.preSec, LEADCAP_S);
+    const skipS = r.preSec - effPre;
+    const startAt = Math.max(ctx.currentTime + 1e-3, t0 - effPre);
+    const playDurSec = r.audio.duration / r.rate - skipS;
+    const endAt = startAt + playDurSec;
+    const attack = 0.01;
+    const release = 0.04;
+    const env = ctx.createGain();
+    env.gain.setValueAtTime(1e-4, startAt);
+    env.gain.exponentialRampToValueAtTime(peak, startAt + attack);
+    const fadeStart = Math.max(startAt + attack, endAt - release);
+    env.gain.setValueAtTime(peak, fadeStart);
+    env.gain.exponentialRampToValueAtTime(1e-4, endAt);
+    src.connect(env).connect(out);
+    src.start(startAt, skipS);
+    src.stop(endAt + 0.02);
+    active.add(src);
+    src.onended = () => {
+      active.delete(src);
+      src.disconnect();
+      env.disconnect();
+      panner?.disconnect();
+    };
+  };
+  const model = (syllable, e) => {
+    if (syllable.consonant === "Q" || syllable.vowel === "") return;
+    const alias = resolveKoeAlias(
+      backend.hasAlias,
+      backend.pitchTokens,
+      syllable,
+      prevVowel,
+      e.pitch
+    );
+    if (syllable.vowel && syllable.vowel !== "N") prevVowel = syllable.vowel;
+    if (!alias) return;
+    const t0 = ctx.currentTime + e.when;
+    const peak = Math.max(1e-4, e.volume);
+    const pan = e.pan ?? 0;
+    const durationMs = Math.max(60, e.duration * 1e3);
+    void renderInto(alias, e.pitch, durationMs).then((r) => {
+      if (r) schedule(r, t0, peak, pan);
+    });
+  };
+  model.renderToCache = async (syllable, prevVowelArg, pitch, durationMs) => {
+    if (syllable.consonant === "Q" || syllable.vowel === "") return null;
+    const alias = resolveKoeAlias(
+      backend.hasAlias,
+      backend.pitchTokens,
+      syllable,
+      prevVowelArg,
+      pitch
+    );
+    if (!alias) return null;
+    const dMs = Math.max(60, durationMs);
+    const r = await renderInto(alias, pitch, dMs);
+    return r ? keyOf(alias, pitch, dMs) : null;
+  };
+  model.scheduleCached = (key, t0, peak, pan) => {
+    const r = renderCache.get(key);
+    if (r) schedule(r, t0, peak, pan);
+  };
+  model.stopAll = () => {
+    for (const src of active) {
+      try {
+        src.stop();
+      } catch {
+      }
+      src.disconnect();
+    }
+    active.clear();
+  };
+  model.reset = () => {
+    prevVowel = "";
+  };
+  return model;
+};
+var PREWARM_NOTES = 3;
+var STREAM_LOOKAHEAD_SEC = 1.5;
+var STREAM_POLL_MS = 100;
+var FALLBACK_MODEL = "klatt";
+var createSingingVoices = (ctx, destination, options = {}) => {
+  const catalog = {};
+  for (const [k, file] of Object.entries(KOE_VOICEBANKS))
+    catalog[k] = koeUrl(file);
+  for (const [k, v] of Object.entries(options.voicebanks ?? {}))
+    catalog[k.toLowerCase()] = v;
+  let streamSession = 0;
+  const loaded = /* @__PURE__ */ new Map([
+    [FALLBACK_MODEL, createKlattVoice(ctx, destination)]
+  ]);
+  const loading = /* @__PURE__ */ new Map();
+  const load = (model) => {
+    const m = model.toLowerCase();
+    const ready = loaded.get(m);
+    if (ready) return Promise.resolve(ready);
+    const inflight = loading.get(m);
+    if (inflight) return inflight;
+    const koe = catalog[m];
+    if (!koe) return Promise.resolve(null);
+    const p = (async () => {
+      let source = koe;
+      if (typeof source === "string") {
+        const res = await fetch(source);
+        if (!res.ok) {
+          throw new Error(`fetch failed: ${res.statusText}`);
+        }
+        source = await res.blob();
+      }
+      return createKoeVoice(ctx, destination, {
+        koe: source,
+        worldlineScriptUrl: options.worldlineScriptUrl,
+        lightweight: options.lightweight,
+        voiceWorkerUrl: options.voiceWorkerUrl
+      });
+    })().then((v) => {
+      loaded.set(m, v);
+      return v;
+    }).catch((err) => {
+      console.warn(`[dtm] koe\u97F3\u6E90 "${m}" \u306E\u8AAD\u307F\u8FBC\u307F\u306B\u5931\u6557\u3057\u307E\u3057\u305F`, err);
+      return null;
+    });
+    loading.set(m, p);
+    return p;
+  };
+  const loadModels = async (models) => {
+    const set = /* @__PURE__ */ new Set();
+    for (const m of models) if (m) set.add(m.toLowerCase());
+    await Promise.all([...set].map((m) => load(m)));
+  };
+  const forEachSungNote = (track, fn) => {
+    let prevVowel = "";
+    for (const note of track.notes) {
+      const syl = note.syllable;
+      if (syl.consonant === "Q" || syl.vowel === "") continue;
+      fn(note, prevVowel);
+      if (syl.vowel && syl.vowel !== "N") prevVowel = syl.vowel;
+    }
+  };
+  const warm = async (tracks, count = PREWARM_NOTES) => {
+    const promises = [];
+    for (const track of tracks) {
+      const m = loaded.get(track.model.toLowerCase());
+      if (!m?.renderToCache) continue;
+      let n = 0;
+      forEachSungNote(track, (note, prevVowel) => {
+        if (n >= count) return;
+        n++;
+        promises.push(
+          m.renderToCache?.(
+            note.syllable,
+            prevVowel,
+            note.pitch,
+            note.durationSec * 1e3
+          ) ?? Promise.resolve(null)
+        );
+      });
+    }
+    await Promise.all(promises);
+  };
+  const startStream = (tracks, anchorTime) => {
+    const session = ++streamSession;
+    const items = [];
+    for (const track of tracks) {
+      const model = loaded.get(track.model.toLowerCase());
+      if (!model) continue;
+      forEachSungNote(track, (note, prevVowel) => {
+        items.push({
+          model,
+          note,
+          prevVowel,
+          volume: track.volume,
+          pan: track.pan
+        });
+      });
+    }
+    items.sort((a, b) => a.note.startSec - b.note.startSec);
+    void (async () => {
+      for (const item of items) {
+        if (session !== streamSession) return;
+        while (item.note.startSec - (ctx.currentTime - anchorTime) > STREAM_LOOKAHEAD_SEC) {
+          await new Promise((resolve) => setTimeout(resolve, STREAM_POLL_MS));
+          if (session !== streamSession) return;
+        }
+        const t0 = anchorTime + item.note.startSec;
+        const peak = Math.max(1e-4, item.volume);
+        const { model, note } = item;
+        if (model.renderToCache && model.scheduleCached) {
+          const key = await model.renderToCache(
+            note.syllable,
+            item.prevVowel,
+            note.pitch,
+            note.durationSec * 1e3
+          );
+          if (session !== streamSession) return;
+          if (key) model.scheduleCached(key, t0, peak, item.pan);
+        } else {
+          const when = t0 - ctx.currentTime;
+          model(note.syllable, {
+            trackId: "",
+            pitch: note.pitch,
+            velocity: 100,
+            volume: peak,
+            when,
+            duration: note.durationSec,
+            pan: item.pan
+          });
+        }
+        await new Promise((resolve) => setTimeout(resolve, 0));
+      }
+    })();
+  };
+  const stopStream = () => {
+    streamSession++;
+    for (const v of loaded.values()) v.stopAll?.();
+  };
+  const reset = () => {
+    stopStream();
+    for (const v of loaded.values()) v.reset?.();
+  };
+  return { loadModels, warm, startStream, stopStream, reset };
+};
+var createVoiceRegistry = (models = {}, fallback = "klatt") => {
+  const sing = (model, syllable, e) => {
+    const fn = models[model] ?? models[fallback];
+    fn?.(syllable, e);
+  };
+  const register = (name, m) => {
+    models[name.toLowerCase()] = m;
+  };
+  return { sing, register };
+};
+
 // src/macros.ts
 var SCALES = [
   [0, 2, 4, 5, 7, 9, 11],
@@ -1656,6 +2773,8 @@ var MMLCore = class _MMLCore {
     const config = getRenderConfig();
     const total = config.stepsPerBar;
     const candidates = [
+      { dur: "1.", s: total * 1.5 },
+      // 付点全音符（最長。これ以上はタイ未対応のため表現不可）
       { dur: "1", s: total / 1 },
       { dur: "2.", s: total / 2 * 1.5 },
       { dur: "2", s: total / 2 },
@@ -1716,97 +2835,77 @@ var MMLCore = class _MMLCore {
     return { text: `o${octave}${name}`, currentOctave: octave };
   }
   /**
-   * MML生成（1/2小節パターンスキャン方式）
+   * MML生成（単一パス・発音順スキャン）
+   *
+   * 以前は1/2小節ごとのウィンドウで走査していたが、それだと半小節境界をまたぐ音符が
+   * 境界で切り詰められて「ぶつ切り」になり、境界直前に始まる音符は隙間が潰れて欠落し、
+   * 歌詞（@@n）の音節割り当てがずれていた。
+   * 全ノートを発音順に一度で処理し、次の発音までの距離だけを上限として
+   * 各音符の長さを忠実に出力する（次の音符がなければ曲末まで伸ばせる）。
    */
   generateMML = (volumeOverride) => {
     const config = getRenderConfig();
     const vol = volumeOverride ?? this.volume;
-    const HALF_BAR = config.stepsPerBar / 2;
-    const header = `t${this.tempo} q50 v${vol}`;
+    const header = `t${this.tempo} v${vol}`;
     const segments = [];
     let lastOctave = -1;
     let currentCursor = 0;
     if (this.notes.length === 0) return header;
-    const lastNote = this.notes[this.notes.length - 1];
-    const endStep = lastNote.startStep + lastNote.durationSteps;
-    const totalSteps = Math.ceil(endStep / HALF_BAR) * HALF_BAR;
-    for (let windowStart = 0; windowStart < totalSteps; windowStart += HALF_BAR) {
-      const windowEnd = windowStart + HALF_BAR;
-      const windowNotes = this.notes.filter(
-        (n) => n.startStep >= windowStart && n.startStep < windowEnd
-      );
-      if (windowNotes.length === 0) {
-        while (currentCursor < windowEnd) {
-          const gap = windowEnd - currentCursor;
-          if (gap <= 2) {
-            currentCursor = windowEnd;
-            break;
-          }
-          const { dur, steps } = this.findBestFitDuration(gap);
-          segments.push(`r${dur}`);
-          currentCursor += steps;
-        }
-        continue;
-      }
-      const notesByStep = /* @__PURE__ */ new Map();
-      windowNotes.forEach((n) => {
-        const list = notesByStep.get(n.startStep) || [];
-        list.push(n);
-        notesByStep.set(n.startStep, list);
-      });
-      const sortedSteps = Array.from(notesByStep.keys()).sort((a, b) => a - b);
-      for (let i = 0; i < sortedSteps.length; i++) {
-        const startStep = sortedSteps[i];
-        const notes = notesByStep.get(startStep);
-        if (!notes) continue;
-        while (currentCursor < startStep) {
-          const gap = startStep - currentCursor;
-          if (gap <= 2) {
-            currentCursor = startStep;
-            break;
-          }
-          const { dur, steps } = this.findBestFitDuration(gap);
-          segments.push(`r${dur}`);
-          currentCursor += steps;
-        }
-        const nextStart = sortedSteps[i + 1] ?? windowEnd;
-        const physicsLimit = nextStart - currentCursor;
-        const MIN_STEP = config.stepsPerBar / 64;
-        if (physicsLimit < MIN_STEP) {
-          currentCursor = startStep;
-          continue;
-        }
-        const idealDuration = notes[0].durationSteps;
-        const durStr = this.stepsToMMLDuration(idealDuration, physicsLimit);
-        const actualStepGenerated = this.getStepFromDottedMML(durStr);
-        if (notes.length > 1) {
-          const noteStrs = notes.map((n) => {
-            const oct = Math.floor(n.pitch / 12) - 1;
-            const name = PITCH_MAP[n.pitch % 12];
-            return `o${oct}${name}`;
-          });
-          segments.push(`[${noteStrs.join("")}]${durStr}`);
-        } else {
-          const { text, currentOctave } = this.getNoteWithOctave(
-            notes[0].pitch,
-            lastOctave
-          );
-          segments.push(`${text}${durStr}`);
-          lastOctave = currentOctave;
-        }
-        currentCursor += actualStepGenerated;
-      }
-      while (currentCursor < windowEnd) {
-        const gap = windowEnd - currentCursor;
+    const endStep = Math.max(
+      ...this.notes.map((n) => n.startStep + n.durationSteps)
+    );
+    const notesByStep = /* @__PURE__ */ new Map();
+    for (const n of this.notes) {
+      const list = notesByStep.get(n.startStep) ?? [];
+      list.push(n);
+      notesByStep.set(n.startStep, list);
+    }
+    const sortedSteps = Array.from(notesByStep.keys()).sort((a, b) => a - b);
+    const fillRests = (until) => {
+      while (currentCursor < until) {
+        const gap = until - currentCursor;
         if (gap <= 2) {
-          currentCursor = windowEnd;
+          currentCursor = until;
           break;
         }
         const { dur, steps } = this.findBestFitDuration(gap);
         segments.push(`r${dur}`);
         currentCursor += steps;
       }
+    };
+    const MIN_STEP = config.stepsPerBar / 64;
+    for (let i = 0; i < sortedSteps.length; i++) {
+      const startStep = sortedSteps[i];
+      const notes = notesByStep.get(startStep);
+      if (!notes) continue;
+      fillRests(startStep);
+      const nextStart = sortedSteps[i + 1] ?? endStep;
+      const physicsLimit = nextStart - currentCursor;
+      if (physicsLimit < MIN_STEP) {
+        currentCursor = startStep;
+        continue;
+      }
+      const idealDuration = notes[0].durationSteps;
+      const durStr = this.stepsToMMLDuration(idealDuration, physicsLimit);
+      const actualStepGenerated = this.getStepFromDottedMML(durStr);
+      if (notes.length > 1) {
+        const noteStrs = notes.map((n) => {
+          const oct = Math.floor(n.pitch / 12) - 1;
+          const name = PITCH_MAP[n.pitch % 12];
+          return `o${oct}${name}`;
+        });
+        segments.push(`[${noteStrs.join("")}]${durStr}`);
+      } else {
+        const { text, currentOctave } = this.getNoteWithOctave(
+          notes[0].pitch,
+          lastOctave
+        );
+        segments.push(`${text}${durStr}`);
+        lastOctave = currentOctave;
+      }
+      currentCursor += actualStepGenerated;
     }
+    fillRests(endStep);
     return `${header} ${segments.join(" ")}`;
   };
   /**
@@ -1884,13 +2983,51 @@ var PITCH_MAP2 = {
   a: 9,
   b: 11
 };
-var TRACK_INDEX_COUNT = 4;
+var clamp2 = (value, lo, hi) => Math.min(hi, Math.max(lo, value));
+var META_DIRECTIVE = /#(inst|drum|volume)=([\w-]+)/gi;
+var parseMmlMeta = (mml) => {
+  const meta = {};
+  for (const m of mml.matchAll(META_DIRECTIVE)) {
+    const key = m[1].toLowerCase();
+    if (key === "inst") meta.instrument = m[2];
+    else if (key === "drum") meta.drum = m[2];
+    else if (key === "volume") {
+      const v = Number.parseInt(m[2], 10);
+      if (!Number.isNaN(v)) meta.volume = v;
+    }
+  }
+  return meta;
+};
+var stripMmlMeta = (mml) => mml.replace(META_DIRECTIVE, "");
+var formatMmlMeta = (meta) => {
+  const parts = [];
+  if (meta.instrument) parts.push(`#inst=${meta.instrument}`);
+  if (meta.drum) parts.push(`#drum=${meta.drum}`);
+  if (meta.volume !== void 0) parts.push(`#volume=${meta.volume}`);
+  return parts.join(" ");
+};
 var parseMML = (mml, options = {}) => {
   const stepsPerBar = options.stepsPerBar ?? 192;
+  const collectTokens = options.collectTokens ?? false;
+  const collectLyrics = options.collectLyrics ?? false;
+  const clampTrackCount = options.clampTrackCount;
   const placements = [];
+  const tokenTracks = /* @__PURE__ */ new Map();
   let bpm = null;
-  if (!mml) return { placements, bpm };
-  const fullMML = mml.replace(/\/\*[\s\S]*?\*\//g, "").replace(/\/\/.*$/gm, "").replace(/[\n\r]+/g, " ").trim();
+  if (!mml) {
+    return {
+      placements,
+      bpm,
+      tokenTracks: collectTokens ? tokenTracks : void 0,
+      lyrics: collectLyrics ? /* @__PURE__ */ new Map() : void 0,
+      meta: {}
+    };
+  }
+  const noComments = mml.replace(/\/\*[\s\S]*?\*\//g, "").replace(/\/\/.*$/gm, "");
+  const meta = parseMmlMeta(noComments);
+  const noMeta = stripMmlMeta(noComments);
+  const lyrics = collectLyrics ? parseLyrics(noMeta) : void 0;
+  const fullMML = stripLyrics(noMeta).replace(/[\n\r]+/g, " ").trim();
   const parts = fullMML.split(/(@\d+)/).filter((p) => p.trim().length > 0);
   let trackIndex = 0;
   let octave = 4;
@@ -1900,7 +3037,7 @@ var parseMML = (mml, options = {}) => {
     const part = rawPart.trim();
     if (part.startsWith("@")) {
       let idx = Number.parseInt(part.substring(1), 10);
-      if (idx >= TRACK_INDEX_COUNT) idx = 2;
+      if (clampTrackCount !== void 0 && idx >= clampTrackCount) idx = 2;
       trackIndex = idx;
       octave = 4;
       currentStep = 0;
@@ -1909,13 +3046,27 @@ var parseMML = (mml, options = {}) => {
     }
     const body = part.replace(/\s+/g, "").toLowerCase();
     let j = 0;
+    const pushTok = (type, start, dur, from) => {
+      if (!collectTokens) return;
+      let arr = tokenTracks.get(trackIndex);
+      if (!arr) {
+        arr = [];
+        tokenTracks.set(trackIndex, arr);
+      }
+      arr.push({
+        text: body.slice(from, j),
+        startStep: start,
+        durationSteps: dur,
+        type
+      });
+    };
     const parseLength = () => {
       let numStr = "";
       while (j < body.length && /\d/.test(body[j])) {
         numStr += body[j];
         j++;
       }
-      const len = numStr ? Number.parseInt(numStr, 10) : baseLength;
+      const len = numStr ? clamp2(Number.parseInt(numStr, 10), 1, 64) : baseLength;
       let steps = Math.round(stepsPerBar / len);
       while (j < body.length && body[j] === ".") {
         steps = Math.round(steps * 1.5);
@@ -1925,6 +3076,7 @@ var parseMML = (mml, options = {}) => {
     };
     while (j < body.length) {
       const ch = body[j];
+      const tokStart = j;
       if (ch === "o") {
         j++;
         let numStr = "";
@@ -1932,13 +3084,16 @@ var parseMML = (mml, options = {}) => {
           numStr += body[j];
           j++;
         }
-        octave = Number.parseInt(numStr, 10) || 4;
+        octave = clamp2(Number.parseInt(numStr, 10) || 4, 0, 8);
+        pushTok("octave", currentStep, 0, tokStart);
       } else if (ch === ">") {
         octave++;
         j++;
+        pushTok("shift", currentStep, 0, tokStart);
       } else if (ch === "<") {
         octave--;
         j++;
+        pushTok("shift", currentStep, 0, tokStart);
       } else if (ch === "l") {
         j++;
         let numStr = "";
@@ -1946,11 +3101,15 @@ var parseMML = (mml, options = {}) => {
           numStr += body[j];
           j++;
         }
-        baseLength = Number.parseInt(numStr, 10) || 16;
+        baseLength = clamp2(Number.parseInt(numStr, 10) || 16, 1, 64);
+        pushTok("length", currentStep, 0, tokStart);
       } else if (ch === "r") {
         j++;
-        currentStep += parseLength();
-      } else if (ch === "t" || ch === "v" || ch === "q") {
+        const restStart = currentStep;
+        const restSteps = parseLength();
+        pushTok("rest", restStart, restSteps, tokStart);
+        currentStep += restSteps;
+      } else if (ch === "t" || ch === "v" || ch === "q" || ch === "p") {
         j++;
         let numStr = "";
         while (j < body.length && /\d/.test(body[j])) {
@@ -1958,8 +3117,9 @@ var parseMML = (mml, options = {}) => {
           j++;
         }
         if (ch === "t" && trackIndex === 0 && numStr) {
-          bpm = Number.parseInt(numStr, 10);
+          bpm = clamp2(Number.parseInt(numStr, 10), 1, 255);
         }
+        pushTok("ctrl", currentStep, 0, tokStart);
       } else if (ch === "[") {
         j++;
         const chordNotes = [];
@@ -1990,7 +3150,7 @@ var parseMML = (mml, options = {}) => {
               numStr += body[j];
               j++;
             }
-            octave = Number.parseInt(numStr, 10) || 4;
+            octave = clamp2(Number.parseInt(numStr, 10) || 4, 0, 8);
           } else {
             j++;
           }
@@ -2005,6 +3165,7 @@ var parseMML = (mml, options = {}) => {
             durationSteps: Math.max(1, steps)
           });
         }
+        pushTok("chord", currentStep, Math.max(1, steps), tokStart);
         currentStep += steps;
         octave = savedOctave;
       } else if (Object.hasOwn(PITCH_MAP2, ch)) {
@@ -2025,18 +3186,25 @@ var parseMML = (mml, options = {}) => {
           pitch: midiPitch,
           durationSteps: Math.max(1, steps)
         });
+        pushTok("note", currentStep, Math.max(1, steps), tokStart);
         currentStep += steps;
       } else {
         j++;
       }
     }
   }
-  return { placements, bpm };
+  return {
+    placements,
+    bpm,
+    tokenTracks: collectTokens ? tokenTracks : void 0,
+    lyrics,
+    meta
+  };
 };
 
 // src/sequencer.ts
 var STEPS_PER_BEAT2 = 48;
-var PLAN_TIME = 0.1;
+var PLAN_TIME = 0.5;
 var TICK_INTERVAL_MS = 20;
 var createSequencer = (options) => {
   let timeline = [];
@@ -2046,11 +3214,14 @@ var createSequencer = (options) => {
   let animationId = null;
   let active = false;
   let fromStepValue = 0;
+  let trackVolumeMap = /* @__PURE__ */ new Map();
   const secondsPerStep = () => 60 / options.getBpm() / STEPS_PER_BEAT2;
   const buildTimeline = (fromStep) => {
     timeline = [];
+    trackVolumeMap = /* @__PURE__ */ new Map();
     const sps = secondsPerStep();
     for (const track of options.getTracks()) {
+      trackVolumeMap.set(track.id, track.volume);
       for (const note of track.notes) {
         const relativeStart = note.startStep - fromStep;
         if (relativeStart < 0) continue;
@@ -2071,6 +3242,9 @@ var createSequencer = (options) => {
     const sps = secondsPerStep();
     const time = options.getAudioTime() - startTime;
     const soloId = options.getSoloTrackId();
+    for (const track of options.getTracks()) {
+      trackVolumeMap.set(track.id, track.volume);
+    }
     while (nowIndex < timeline.length) {
       const ev = timeline[nowIndex];
       if (soloId && ev.trackId !== soloId) {
@@ -2081,11 +3255,12 @@ var createSequencer = (options) => {
       if (_when > PLAN_TIME) break;
       nowIndex++;
       const velocityVolume = ev.velocity / 127;
+      const currentVolume = (trackVolumeMap.get(ev.trackId) ?? ev.volume * 100) / 100;
       options.onPlayNote({
         trackId: ev.trackId,
         pitch: ev.pitch,
         velocity: ev.velocity,
-        volume: ev.volume * velocityVolume,
+        volume: currentVolume * velocityVolume,
         when: Math.max(0, _when),
         duration: ev.duration
       });
@@ -2136,13 +3311,14 @@ var createSequencer = (options) => {
     }
     active = false;
   };
+  const START_DELAY = 0.1;
   const start = (fromStep) => {
     stop();
     fromStepValue = fromStep ?? options.getPlayStartStep();
     buildTimeline(fromStepValue);
     if (timeline.length === 0 && !options.getDrumPattern()?.length) return;
     active = true;
-    startTime = options.getAudioTime();
+    startTime = options.getAudioTime() + START_DELAY;
     nowIndex = 0;
     intervalId = setInterval(scheduleTick, TICK_INTERVAL_MS);
     animationId = requestAnimationFrame(animate);
@@ -2150,7 +3326,8 @@ var createSequencer = (options) => {
   return {
     start,
     stop,
-    isActive: () => active
+    isActive: () => active,
+    getStartTime: () => startTime
   };
 };
 
@@ -2612,10 +3789,12 @@ var DAW_CSS = `
 
 /* \u2500\u2500\u2500 \u30ED\u30FC\u30C7\u30A3\u30F3\u30B0\u30AA\u30FC\u30D0\u30FC\u30EC\u30A4 \u2500\u2500\u2500 */
 .dtm-overlay {
-  position: fixed; inset: 0; z-index: 1000;
+  position: absolute; inset: 0; z-index: 1000;
   background: rgba(0,0,0,.92);
   display: flex; align-items: center; justify-content: center;
   flex-direction: column; gap: 14px;
+  pointer-events: auto;
+  cursor: wait;
 }
 .dtm-overlay[hidden] { display: none; }
 .dtm-overlay::before {
@@ -2643,6 +3822,22 @@ var DAW_CSS = `
   animation: dtm-load 1.6s steps(8) infinite;
 }
 @keyframes dtm-load { 0%{width:0} 100%{width:100%} }
+/* \u9032\u6357\u304C\u78BA\u5B9A\u3057\u305F\u3089\u7121\u9650\u30EB\u30FC\u30D7\u6F14\u51FA\u3092\u6B62\u3081\u3001\u5B9F\u6E2C\u5024\u3067\u5857\u308A\u3064\u3076\u3059 */
+.dtm-spinner--determinate::after { display: none; }
+.dtm-spinner-fill {
+  position: absolute;
+  left: 0; top: 0; height: 100%;
+  width: 0;
+  background: var(--dtm-primary);
+  transition: width .12s steps(8);
+}
+.dtm-loading-label {
+  font-family: var(--dtm-font);
+  font-size: 11px;
+  color: var(--dtm-primary);
+  letter-spacing: .15em;
+  min-height: 1em;
+}
 
 @keyframes dtm-blink { 0%,100%{opacity:1} 50%{opacity:0} }
 .dtm-blink { animation: dtm-blink 1s steps(1) infinite; }
@@ -2655,6 +3850,112 @@ var DAW_CSS = `
   .dtm-daw { gap: 8px; padding: 10px; }
   .dtm-roll { height: 420px; }
 }
+
+/* ====================================================
+   MML PLAYER \u2014 \u518D\u751F\u5C02\u7528\u30D3\u30E5\u30FC\uFF08mountMmlPlayer\uFF09
+   ==================================================== */
+.dtm-player {
+  display: flex;
+  flex-direction: column;
+  gap: var(--dtm-gap);
+  padding: var(--dtm-gap);
+  background: var(--dtm-deep);
+  border: 2px solid var(--dtm-border2);
+  box-shadow: 4px 4px 0 var(--c-black);
+}
+.dtm-player-head {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  flex-wrap: wrap;
+}
+.dtm-player-play {
+  flex: 0 0 auto;
+  width: 28px;
+  height: 28px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: var(--dtm-primary);
+  color: var(--dtm-pfg);
+  border: 2px solid var(--c-black);
+  box-shadow: 2px 2px 0 var(--c-black);
+  cursor: pointer;
+  padding: 0;
+}
+.dtm-player-play:active { transform: translate(2px, 2px); box-shadow: none; }
+.dtm-player-play--stop { background: var(--dtm-danger); }
+.dtm-player-play:disabled { opacity: 0.4; cursor: default; }
+.dtm-player-tempo,
+.dtm-player-time {
+  font-family: 'k8x12', monospace;
+  font-size: 12px;
+  color: var(--dtm-muted);
+}
+.dtm-player-time { color: var(--dtm-text); min-width: 3em; }
+.dtm-player-dots {
+  margin-left: auto;
+  display: flex;
+  align-items: center;
+  gap: 6px;
+}
+.dtm-player-dot { width: 8px; height: 8px; display: inline-block; }
+.dtm-player-chip {
+  font-family: 'k8x12', monospace;
+  font-size: 9px;
+  color: var(--dtm-text);
+  background: var(--dtm-border2);
+  padding: 2px 6px;
+  white-space: nowrap;
+}
+.dtm-player-lane-row {
+  display: flex;
+  align-items: stretch;
+  gap: 6px;
+}
+.dtm-player-lane-label {
+  flex: 0 0 auto;
+  width: 16px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 2px;
+  padding-top: 4px;
+}
+.dtm-player-lane-no {
+  font-family: 'k8x12', monospace;
+  font-size: 9px;
+  color: var(--dtm-muted);
+}
+.dtm-player-lane {
+  position: relative; /* \u30C8\u30FC\u30AF\u30F3\u306E offsetParent \u3092\u30EC\u30FC\u30F3\u306B\u56FA\u5B9A\u3057\u3001\u4E2D\u592E\u5BC4\u305B\u8A08\u7B97\u3092\u6B63\u3059 */
+  flex: 1 1 auto;
+  overflow-x: auto;
+  white-space: nowrap;
+  background: var(--c-black);
+  border: 2px solid var(--dtm-border2);
+  padding: 6px;
+  scrollbar-width: none;
+}
+.dtm-player-lane::-webkit-scrollbar { display: none; }
+.dtm-tk {
+  font-family: 'k8x12', monospace;
+  font-size: 12px;
+  color: var(--dtm-text);
+}
+.dtm-tk--rest { color: var(--dtm-muted); }
+.dtm-tk--octave,
+.dtm-tk--shift,
+.dtm-tk--length,
+.dtm-tk--ctrl { color: var(--dtm-border2); }
+.dtm-tk--lyric { color: var(--dtm-text); letter-spacing: 1px; }
+.dtm-tk--break { color: var(--dtm-muted); opacity: 0.7; margin: 0 2px; }
+.dtm-tk--meta { color: var(--dtm-border2); margin-right: 4px; }
+.dtm-tk.is-active {
+  background: var(--tk, var(--dtm-primary));
+  color: var(--c-black);
+  font-weight: bold;
+}
 `;
 var injectStyles = (doc = document) => {
   if (doc.getElementById(STYLE_ID)) return;
@@ -2663,6 +3964,45 @@ var injectStyles = (doc = document) => {
   style.textContent = DAW_CSS;
   doc.head.appendChild(style);
 };
+var showLoadingOverlay = (container) => {
+  const origPos = container.style.position;
+  const computed = window.getComputedStyle(container).position;
+  if (computed === "static") {
+    container.style.position = "relative";
+  }
+  const doc = container.ownerDocument ?? document;
+  const overlay = doc.createElement("div");
+  overlay.className = "dtm-overlay";
+  const spinner = doc.createElement("div");
+  spinner.className = "dtm-spinner";
+  const fill = doc.createElement("i");
+  fill.className = "dtm-spinner-fill";
+  spinner.appendChild(fill);
+  overlay.appendChild(spinner);
+  const label = doc.createElement("div");
+  label.className = "dtm-loading-label";
+  overlay.appendChild(label);
+  container.appendChild(overlay);
+  const setProgress = (done, total) => {
+    if (total > 0) {
+      const pct = Math.max(0, Math.min(100, Math.round(done / total * 100)));
+      spinner.classList.add("dtm-spinner--determinate");
+      fill.style.width = `${pct}%`;
+      label.textContent = `${done} / ${total} (${pct}%)`;
+    } else {
+      spinner.classList.remove("dtm-spinner--determinate");
+      fill.style.width = "0";
+      label.textContent = "";
+    }
+  };
+  return {
+    remove: () => {
+      overlay.remove();
+      container.style.position = origPos;
+    },
+    setProgress
+  };
+};
 
 // src/daw.ts
 var BASE_STEP_WIDTH = 0.5;
@@ -2812,7 +4152,13 @@ var TRACKS_ADVANCED = [
   }
 ];
 var DEFAULT_TRACKS = TRACKS_SIMPLE;
-var clamp = (v, min, max) => Math.min(Math.max(v, min), max);
+var LYRIC_MODELS = ["klatt", ...Object.keys(KOE_VOICEBANKS)];
+var LYRIC_MODEL_LABELS = {
+  klatt: "\u8EFD\u91CF\u30ED\u30DC\u58F0",
+  ...KOE_VOICEBANK_LABELS
+};
+var lyricModelLabel = (model) => LYRIC_MODEL_LABELS[model] ?? model;
+var clamp3 = (v, min, max) => Math.min(Math.max(v, min), max);
 var mountDAW = (target, options = {}) => {
   injectStyles();
   const getAudioTime = options.getAudioTime ?? (() => performance.now() / 1e3);
@@ -2843,6 +4189,7 @@ var mountDAW = (target, options = {}) => {
   let masterVolume = 50;
   let drumVolume = 80;
   let currentDrumPattern = refs.drumSelect.value;
+  let currentInstrument = "";
   let activeTrackId = trackConfigs[0].id;
   let activeToolMode = "pen";
   let currentInsertLength = 48;
@@ -2852,6 +4199,7 @@ var mountDAW = (target, options = {}) => {
   let currentOffsetY = (104 - 1 - 60) * renderConfig.keyHeight - 215;
   let playStartStep = 0;
   let isSolo = false;
+  let lyricTrackIndices = /* @__PURE__ */ new Set();
   let playbackState = "stopped";
   let pausedPlayStep = 0;
   let currentPlayStep = 0;
@@ -2878,9 +4226,34 @@ var mountDAW = (target, options = {}) => {
       volume: config.volume,
       savedChordInput: "",
       savedChordPattern: "block",
-      savedChordRoot: 0
+      savedChordRoot: 0,
+      lyrics: "",
+      lyricModel: "",
+      // 既定は「なし」（歌わない）
+      vocalVolume: 300,
+      vocalGate: 100,
+      vocalPan: 64
     }));
   };
+  const buildLyricsMap = () => {
+    const map = /* @__PURE__ */ new Map();
+    trackStates.forEach((t, i) => {
+      const model = t.lyricModel.trim();
+      const text = t.lyrics.trim();
+      if (!model || !text) return;
+      const syllables = normalizeLyrics(text);
+      if (syllables.length === 0) return;
+      map.set(i, {
+        trackId: i,
+        model: model.toLowerCase(),
+        volume: t.vocalVolume,
+        gate: t.vocalGate,
+        pan: t.vocalPan,
+        syllables
+      });
+    });
+    return map;
+  };
   const getActive = () => trackStates.find((t) => t.config.id === activeTrackId) ?? trackStates[0];
   const getMaxNoteStep = () => {
     let maxStep = renderConfig.stepsPerBar * 4;
@@ -2984,7 +4357,7 @@ var mountDAW = (target, options = {}) => {
       );
       const ratio = currentOffsetX / maxOffsetX;
       refs.hScrollThumb.style.width = `${thumbW}px`;
-      refs.hScrollThumb.style.left = `${clamp(ratio * (sbW - thumbW), 0, sbW - thumbW)}px`;
+      refs.hScrollThumb.style.left = `${clamp3(ratio * (sbW - thumbW), 0, sbW - thumbW)}px`;
     }
     const totalHeight = renderConfig.keyCount * renderConfig.keyHeight;
     const sbH = refs.vScroll.clientHeight;
@@ -3043,9 +4416,9 @@ var mountDAW = (target, options = {}) => {
       if (maxOffsetX <= 0) return;
       const rect = refs.hScroll.getBoundingClientRect();
       const thumbW = Number.parseFloat(refs.hScrollThumb.style.width) || 40;
-      const x = clamp(clientX - rect.left - thumbW / 2, 0, rect.width - thumbW);
+      const x = clamp3(clientX - rect.left - thumbW / 2, 0, rect.width - thumbW);
       const ratio = x / (rect.width - thumbW);
-      currentOffsetX = clamp(ratio * maxOffsetX, 0, maxOffsetX);
+      currentOffsetX = clamp3(ratio * maxOffsetX, 0, maxOffsetX);
       setDrawOffset(currentOffsetX, currentOffsetY);
       redrawAll();
     };
@@ -3054,9 +4427,9 @@ var mountDAW = (target, options = {}) => {
       if (maxOffset <= 0) return;
       const rect = refs.vScroll.getBoundingClientRect();
       const thumbH = Number.parseFloat(refs.vScrollThumb.style.height) || 40;
-      const y = clamp(clientY - rect.top - thumbH / 2, 0, rect.height - thumbH);
+      const y = clamp3(clientY - rect.top - thumbH / 2, 0, rect.height - thumbH);
       const ratio = y / (rect.height - thumbH);
-      currentOffsetY = clamp(ratio * maxOffset, 0, maxOffset);
+      currentOffsetY = clamp3(ratio * maxOffset, 0, maxOffset);
       setDrawOffset(currentOffsetX, currentOffsetY);
       redrawAll();
     };
@@ -3338,7 +4711,7 @@ var mountDAW = (target, options = {}) => {
       "wheel",
       (event) => {
         event.preventDefault();
-        currentOffsetY = clamp(
+        currentOffsetY = clamp3(
           currentOffsetY + event.deltaY,
           0,
           getMaxOffsetY()
@@ -3386,7 +4759,7 @@ var mountDAW = (target, options = {}) => {
     const centerKey = (currentOffsetY + canvas.height / 2) / renderConfig.keyHeight;
     renderConfig.keyHeight = BASE_KEY_HEIGHT * zoomY / 100;
     refs.zoomYLabel.textContent = `${zoomY}%`;
-    currentOffsetY = clamp(
+    currentOffsetY = clamp3(
       centerKey * renderConfig.keyHeight - canvas.height / 2,
       0,
       getMaxOffsetY()
@@ -3410,8 +4783,11 @@ var mountDAW = (target, options = {}) => {
     getSoloTrackId: () => isSolo ? activeTrackId : null,
     getAudioTime,
     onPlayNote: (e) => {
-      const volume = e.volume * (masterVolume / 100);
-      options.onPlayNote?.({ ...e, volume });
+      const idx = trackStates.findIndex((t) => t.config.id === e.trackId);
+      if (idx >= 0 && lyricTrackIndices.has(idx) && options.singingVoices) {
+        return;
+      }
+      options.onPlayNote?.({ ...e, volume: e.volume * (masterVolume / 100) });
     },
     onPlayDrum: (e) => {
       const velocity = e.velocity * (drumVolume / 100) * (masterVolume / 100);
@@ -3437,10 +4813,52 @@ var mountDAW = (target, options = {}) => {
     },
     stepsPerBar: renderConfig.stepsPerBar
   });
-  const play = () => {
+  const play = async () => {
     options.onResumeAudio?.();
     if (playbackState === "playing") return;
     const fromStep = playbackState === "paused" ? pausedPlayStep : playStartStep;
+    options.singingVoices?.reset();
+    const lyricMap = buildLyricsMap();
+    lyricTrackIndices = new Set(lyricMap.keys());
+    const secondsPerStep = 60 / bpm / 48;
+    const streamTracks = options.singingVoices ? [...lyricMap.values()].map((lt) => {
+      const trackState = trackStates[lt.trackId];
+      const sorted = [...trackState?.core.getNotes() ?? []].sort(
+        (a, b) => a.startStep - b.startStep
+      );
+      const gate = (lt.gate ?? 100) / 100;
+      const count = Math.min(sorted.length, lt.syllables.length);
+      const notes = [];
+      for (let i = 0; i < count; i++) {
+        const n = sorted[i];
+        if (n.startStep < fromStep) continue;
+        notes.push({
+          syllable: lt.syllables[i],
+          pitch: n.pitch,
+          startSec: (n.startStep - fromStep) * secondsPerStep,
+          durationSec: n.durationSteps * secondsPerStep * gate
+        });
+      }
+      return {
+        model: lt.model,
+        volume: vocalVolumeToGain(lt.volume ?? 300) * (masterVolume / 100),
+        pan: panToStereo(lt.pan ?? 64),
+        notes
+      };
+    }) : [];
+    const voices = options.singingVoices;
+    const streaming = !!voices && streamTracks.some((t) => t.notes.length > 0);
+    if (streaming && voices) {
+      const overlay = showLoadingOverlay(target);
+      try {
+        await voices.loadModels(streamTracks.map((t) => t.model));
+        await voices.warm(streamTracks);
+      } catch (err) {
+        console.warn("[dtm] voice preload failed", err);
+      } finally {
+        overlay.remove();
+      }
+    }
     if (playbackState !== "paused") {
       const canvas = getGridCanvas();
       currentOffsetX = Math.max(
@@ -3451,17 +4869,22 @@ var mountDAW = (target, options = {}) => {
     }
     playbackState = "playing";
     sequencer.start(fromStep);
+    if (streaming && voices) {
+      voices.startStream(streamTracks, sequencer.getStartTime());
+    }
     updateTransport();
   };
   const pause = () => {
     if (playbackState !== "playing") return;
     pausedPlayStep = currentPlayStep;
     sequencer.stop();
+    options.singingVoices?.stopStream();
     playbackState = "paused";
     updateTransport();
   };
   const stop = () => {
     sequencer.stop();
+    options.singingVoices?.stopStream();
     playbackState = "stopped";
     currentPlayStep = 0;
     updateTransport();
@@ -3511,6 +4934,104 @@ var mountDAW = (target, options = {}) => {
       active.core.setVolume(active.volume);
       volLabel.textContent = String(active.volume);
     });
+    const lyricDiv = document.createElement("div");
+    lyricDiv.className = "dtm-row";
+    lyricDiv.style.flexDirection = "column";
+    lyricDiv.style.alignItems = "stretch";
+    lyricDiv.innerHTML = `
+      <div class="dtm-row">
+        <span class="dtm-label">\u266A \u6B4C\u8A5E</span>
+        <select class="dtm-select" data-dtm="lyric-model" aria-label="\u6B4C\u5531\u30E2\u30C7\u30EB"></select>
+        <span class="dtm-label dtm-grow" data-dtm="lyric-count" style="text-align:right"></span>
+      </div>
+      <div class="dtm-row" data-dtm="lyric-body" style="flex-direction:column;align-items:stretch">
+        <div class="dtm-row">
+          <span class="dtm-label">\u58F0\u91CF</span>
+          <input type="range" class="dtm-range dtm-grow" data-dtm="lyric-vol" min="0" max="${MAX_VOCAL_VOLUME}" aria-label="\u6B4C\u5531\u306E\u58F0\u91CF\uFF08100=\u7B49\u500D\u3001100\u8D85\u3067\u30D6\u30FC\u30B9\u30C8\u3001\u65E2\u5B9A300\uFF09">
+          <span class="dtm-label" data-dtm="lyric-vol-label"></span>
+        </div>
+        <div class="dtm-row">
+          <span class="dtm-label">\u5B9A\u4F4D</span>
+          <input type="range" class="dtm-range dtm-grow" data-dtm="lyric-pan" min="0" max="127" aria-label="\u6B4C\u5531\u306E\u30B9\u30C6\u30EC\u30AA\u5B9A\u4F4D\uFF08\u5DE6\u53F3\uFF09">
+          <span class="dtm-label" data-dtm="lyric-pan-label"></span>
+        </div>
+        <textarea class="dtm-textarea" data-dtm="lyric-input" rows="2" placeholder="\u3072\u3089\u304C\u306A\u30FB\u30AB\u30BF\u30AB\u30CA\u3067\u6B4C\u8A5E\uFF08\u4F8B: \u3069\u308C\u307F\u3075\u3041\u305D\u3089\u3057\u3069\uFF09"></textarea>
+      </div>`;
+    refs.trackBody.appendChild(lyricDiv);
+    const lyricModelSel = lyricDiv.querySelector(
+      '[data-dtm="lyric-model"]'
+    );
+    const lyricBody = lyricDiv.querySelector(
+      '[data-dtm="lyric-body"]'
+    );
+    const lyricInput = lyricDiv.querySelector(
+      '[data-dtm="lyric-input"]'
+    );
+    const lyricCount = lyricDiv.querySelector(
+      '[data-dtm="lyric-count"]'
+    );
+    const lyricVol = lyricDiv.querySelector(
+      '[data-dtm="lyric-vol"]'
+    );
+    const lyricVolLabel = lyricDiv.querySelector(
+      '[data-dtm="lyric-vol-label"]'
+    );
+    const lyricPan = lyricDiv.querySelector(
+      '[data-dtm="lyric-pan"]'
+    );
+    const lyricPanLabel = lyricDiv.querySelector(
+      '[data-dtm="lyric-pan-label"]'
+    );
+    const fmtPan = (pan) => pan === 64 ? "C" : pan < 64 ? `L${64 - pan}` : `R${pan - 64}`;
+    const addOpt = (value, label) => {
+      const o = document.createElement("option");
+      o.value = value;
+      o.textContent = label;
+      lyricModelSel.appendChild(o);
+    };
+    addOpt("", "\u306A\u3057");
+    for (const m of LYRIC_MODELS) addOpt(m, lyricModelLabel(m));
+    if (active.lyricModel && !LYRIC_MODELS.includes(active.lyricModel)) {
+      addOpt(active.lyricModel, lyricModelLabel(active.lyricModel));
+    }
+    lyricModelSel.value = active.lyricModel;
+    lyricInput.value = active.lyrics;
+    lyricVol.value = String(active.vocalVolume);
+    lyricVolLabel.textContent = String(active.vocalVolume);
+    lyricPan.value = String(active.vocalPan);
+    lyricPanLabel.textContent = fmtPan(active.vocalPan);
+    const updateLyricCount = () => {
+      const n = normalizeLyrics(lyricInput.value).length;
+      lyricCount.textContent = active.lyricModel && n > 0 ? `${n}\u97F3\u7BC0` : "";
+    };
+    const syncLyricVisibility = () => {
+      lyricBody.style.display = active.lyricModel ? "" : "none";
+      updateLyricCount();
+    };
+    syncLyricVisibility();
+    lyricModelSel.addEventListener("change", () => {
+      active.lyricModel = lyricModelSel.value;
+      syncLyricVisibility();
+    });
+    lyricInput.addEventListener("input", () => {
+      active.lyrics = lyricInput.value;
+      updateLyricCount();
+    });
+    lyricVol.addEventListener("input", () => {
+      active.vocalVolume = Number.parseInt(lyricVol.value, 10);
+      lyricVolLabel.textContent = lyricVol.value;
+    });
+    lyricPan.addEventListener("input", () => {
+      active.vocalPan = Number.parseInt(lyricPan.value, 10);
+      lyricPanLabel.textContent = fmtPan(active.vocalPan);
+    });
+    lyricPanLabel.style.cursor = "pointer";
+    lyricPanLabel.title = "\u30BF\u30C3\u30D7\u3067\u4E2D\u592E(C)\u3078";
+    lyricPanLabel.addEventListener("click", () => {
+      active.vocalPan = 64;
+      lyricPan.value = "64";
+      lyricPanLabel.textContent = fmtPan(64);
+    });
     if (active.config.id === "chord" && showChord) {
       const div = document.createElement("div");
       div.className = "dtm-row";
@@ -3598,6 +5119,11 @@ var mountDAW = (target, options = {}) => {
     const barLimitBars = Number(refs.barLimitSelect.value);
     const limitSteps = barLimitBars > 0 ? barLimitBars * renderConfig.stepsPerBar : Infinity;
     const clipNotes = (notes) => limitSteps === Infinity ? notes : notes.filter((n) => n.startStep < limitSteps);
+    const metaLine = formatMmlMeta({
+      instrument: currentInstrument || void 0,
+      drum: currentDrumPattern !== "none" ? currentDrumPattern : void 0,
+      volume: masterVolume
+    });
     if (refs.decomposeChordToggle.checked) {
       const ignoreHeavy = refs.ignoreChordHeavyToggle.checked;
       const targetStates = ignoreHeavy ? trackStates.filter((t) => !isChordHeavyTrack(t.core.getNotes())) : trackStates;
@@ -3607,12 +5133,14 @@ var mountDAW = (target, options = {}) => {
       );
       const monoTracks = decomposeToMonophonic(allNotes);
       const refCore = trackStates[0].core;
-      const full2 = monoTracks.map(
+      const decomposedFull = monoTracks.map(
         (notes, i) => `@${i} ${refCore.getMMLFromNotes(notes, bpm, 100).trim()}`
-      ).join(";\n");
-      const minified2 = monoTracks.map(
+      );
+      const decomposedMini = monoTracks.map(
         (notes, i) => `@${i}${refCore.getMMLFromNotes(notes, bpm, 100).trim().replace(/\s+/g, "")}`
-      ).join(";");
+      );
+      const full2 = [metaLine, ...decomposedFull].filter((s) => s.length > 0).join(";\n");
+      const minified2 = [metaLine, ...decomposedMini].filter((s) => s.length > 0).join(";");
       return {
         full: full2,
         minified: minified2,
@@ -3621,12 +5149,30 @@ var mountDAW = (target, options = {}) => {
         barLimit: barLimitBars
       };
     }
-    const full = trackStates.map(
+    const trackLines = trackStates.map(
       (t, i) => `@${i} ${t.core.getMMLFromNotes(clipNotes(t.core.getNotes()), bpm, t.volume).trim()}`
-    ).join(";\n");
-    const minified = trackStates.map(
+    );
+    const trackLinesMini = trackStates.map(
       (t, i) => `@${i}${t.core.getMMLFromNotes(clipNotes(t.core.getNotes()), bpm, t.volume).trim().replace(/\s+/g, "")}`
-    ).join(";");
+    );
+    const lyricLines = trackStates.map((t, i) => ({
+      i,
+      text: t.lyrics.trim(),
+      model: t.lyricModel.trim(),
+      vol: t.vocalVolume,
+      gate: t.vocalGate,
+      pan: t.vocalPan
+    })).filter((x) => x.model.length > 0 && x.text.length > 0).map((x) => {
+      const params = [
+        x.vol === 300 ? "" : `v${x.vol}`,
+        x.gate === 100 ? "" : `q${x.gate}`,
+        x.pan === 64 ? "" : `p${x.pan}`
+      ].filter((s) => s.length > 0).join(" ");
+      const head = params ? `${x.model} ${params}` : x.model;
+      return `@@${x.i} ${head} ${x.text}`;
+    });
+    const full = [metaLine, ...trackLines, ...lyricLines].filter((s) => s.length > 0).join(";\n");
+    const minified = [metaLine, ...trackLinesMini, ...lyricLines].filter((s) => s.length > 0).join(";");
     return {
       full,
       minified,
@@ -3647,6 +5193,34 @@ var mountDAW = (target, options = {}) => {
     refs.outputContainer.classList.remove("dtm-hidden");
     updateUndoRedo();
   };
+  const getFirstDetectedPitch = () => {
+    let minStep = Number.MAX_SAFE_INTEGER;
+    let candidateNotes = [];
+    for (const t of trackStates) {
+      for (const note of t.core.getNotes()) {
+        if (note.startStep < minStep) {
+          minStep = note.startStep;
+          candidateNotes = [note];
+        } else if (note.startStep === minStep) {
+          candidateNotes.push(note);
+        }
+      }
+    }
+    if (candidateNotes.length === 0) return null;
+    const sum = candidateNotes.reduce((acc, note) => acc + note.pitch, 0);
+    return Math.round(sum / candidateNotes.length);
+  };
+  const centerPitch = (pitch) => {
+    const canvas = getGridCanvas();
+    const yIndex = renderConfig.keyCount - 1 - (pitch - renderConfig.pitchRangeStart);
+    const logicalY = yIndex * renderConfig.keyHeight;
+    currentOffsetY = clamp3(
+      logicalY - (canvas.height - renderConfig.keyHeight) / 2,
+      0,
+      getMaxOffsetY()
+    );
+    setDrawOffset(currentOffsetX, currentOffsetY);
+  };
   const clearAll = () => {
     for (const t of trackStates) {
       t.core.resetHistory();
@@ -3658,8 +5232,42 @@ var mountDAW = (target, options = {}) => {
     if (!mml) return;
     clearAll();
     for (const t of trackStates) t.core.setLoadMode(true);
-    const { placements, bpm: parsedBpm } = parseMML(mml, {
-      stepsPerBar: renderConfig.stepsPerBar
+    const {
+      placements,
+      bpm: parsedBpm,
+      lyrics,
+      meta
+    } = parseMML(mml, {
+      stepsPerBar: renderConfig.stepsPerBar,
+      collectLyrics: true,
+      // このDAWのトラック数を超えるチャンネルはベースへ畳み込む（従来挙動）
+      clampTrackCount: trackStates.length
+    });
+    currentInstrument = meta.instrument ?? "";
+    if (meta.drum && drumPatterns[meta.drum]) {
+      currentDrumPattern = meta.drum;
+      refs.drumSelect.value = meta.drum;
+    }
+    if (meta.volume !== void 0) {
+      masterVolume = meta.volume;
+      refs.masterVolume.value = String(meta.volume);
+      refs.masterVolumeLabel.textContent = `${meta.volume}%`;
+    }
+    for (const t of trackStates) {
+      t.lyrics = "";
+      t.lyricModel = "";
+      t.vocalVolume = 300;
+      t.vocalGate = 100;
+      t.vocalPan = 64;
+    }
+    lyrics?.forEach((lt, idx) => {
+      const t = trackStates[idx];
+      if (!t) return;
+      t.lyrics = lt.syllables.map((s) => s.kana).join("");
+      t.lyricModel = lt.model;
+      t.vocalVolume = lt.volume;
+      t.vocalGate = lt.gate;
+      t.vocalPan = lt.pan;
     });
     for (const p of placements) {
       const t = trackStates[p.trackIndex];
@@ -3675,8 +5283,14 @@ var mountDAW = (target, options = {}) => {
     }
     playStartStep = 0;
     currentOffsetX = 0;
-    setDrawOffset(currentOffsetX, currentOffsetY);
+    const firstPitch = getFirstDetectedPitch();
+    if (firstPitch !== null) {
+      centerPitch(firstPitch);
+    } else {
+      setDrawOffset(currentOffsetX, currentOffsetY);
+    }
     redrawAll();
+    updateTrackPanel();
     updateUndoRedo();
   };
   const applyChord = () => {
@@ -3736,7 +5350,12 @@ var mountDAW = (target, options = {}) => {
     }
     playStartStep = 0;
     currentOffsetX = 0;
-    setDrawOffset(currentOffsetX, currentOffsetY);
+    const firstPitch = getFirstDetectedPitch();
+    if (firstPitch !== null) {
+      centerPitch(firstPitch);
+    } else {
+      setDrawOffset(currentOffsetX, currentOffsetY);
+    }
     redrawAll();
     updateUndoRedo();
   };
@@ -4008,6 +5627,9 @@ var mountDAW = (target, options = {}) => {
     pause,
     stop,
     getMML: generateMML,
+    setInstrument: (name) => {
+      currentInstrument = name;
+    },
     loadMML,
     loadMIDI,
     exportMIDI: exportMIDI2,
@@ -4128,6 +5750,388 @@ var INSTRUMENT_PRESETS = {
   }
 };
 
+// src/mml-player.ts
+var STEPS_PER_BEAT3 = 48;
+var STEPS_PER_BAR = 192;
+var DEFAULT_TRACK_COLORS = ["#00e436", "#29adff", "#ff77a8", "#ffec27"];
+var activePlayer = null;
+var formatTime = (seconds) => {
+  const m = Math.floor(seconds / 60);
+  const s = Math.floor(seconds % 60);
+  return `${String(m).padStart(2, "0")}:${String(s).padStart(2, "0")}`;
+};
+var freqFromPitch = (pitch) => 440 * 2 ** ((pitch - 69) / 12);
+var mountMmlPlayer = (target, mml, options = {}) => {
+  injectStyles(target.ownerDocument ?? document);
+  const {
+    placements,
+    bpm: parsedBpm,
+    tokenTracks,
+    lyrics,
+    meta
+  } = parseMML(mml, {
+    collectTokens: true,
+    collectLyrics: true
+  });
+  const lyricTracks = lyrics ?? /* @__PURE__ */ new Map();
+  const bpm = parsedBpm ?? options.defaultBpm ?? 120;
+  const drumPatternDict = options.drumPatterns ?? DRUM_PATTERNS;
+  const drumPattern = meta.drum ? drumPatternDict[meta.drum] ?? null : null;
+  const trackVolume = meta.volume ?? options.volume ?? 100;
+  const colors = options.trackColors ?? DEFAULT_TRACK_COLORS;
+  const useSynth = options.synth ?? !options.onPlayNote;
+  const secondsPerStep = 60 / bpm / STEPS_PER_BEAT3;
+  const trackIndices = [...new Set(placements.map((p) => p.trackIndex))].sort(
+    (a, b) => a - b
+  );
+  const seqTracks = trackIndices.map((index) => {
+    let id = 0;
+    const notes = placements.filter((p) => p.trackIndex === index).map((p) => ({
+      id: id++,
+      startStep: p.startStep,
+      durationSteps: p.durationSteps,
+      pitch: p.pitch,
+      velocity: 100
+    }));
+    return { id: String(index), volume: trackVolume, notes };
+  });
+  const colorOf = (index) => colors[index % colors.length] ?? DEFAULT_TRACK_COLORS[0];
+  let audioCtx = null;
+  const ensureCtx = () => {
+    if (!audioCtx) audioCtx = new AudioContext();
+    return audioCtx;
+  };
+  const synthPlay = (e) => {
+    const ctx = ensureCtx();
+    const osc = ctx.createOscillator();
+    const gain = ctx.createGain();
+    osc.type = "square";
+    osc.frequency.value = freqFromPitch(e.pitch);
+    const t0 = ctx.currentTime + e.when;
+    const peak = Math.max(1e-4, 0.06 * e.volume * 1.5);
+    gain.gain.setValueAtTime(peak, t0);
+    gain.gain.exponentialRampToValueAtTime(1e-3, t0 + e.duration);
+    osc.connect(gain);
+    if (typeof ctx.createStereoPanner === "function" && e.pan) {
+      const panner = ctx.createStereoPanner();
+      panner.pan.value = Math.max(-1, Math.min(1, e.pan));
+      gain.connect(panner);
+      panner.connect(ctx.destination);
+    } else {
+      gain.connect(ctx.destination);
+    }
+    osc.start(t0);
+    osc.stop(t0 + e.duration + 0.02);
+  };
+  const drumSynth = (e) => {
+    const ctx = ensureCtx();
+    const t0 = ctx.currentTime + e.when;
+    const vol = Math.max(1e-4, Math.min(1, e.velocity));
+    const isKick = e.pitch === 35 || e.pitch === 36;
+    const isSnareLike = e.pitch === 38 || e.pitch === 39 || e.pitch === 40;
+    if (isKick) {
+      const osc = ctx.createOscillator();
+      const g2 = ctx.createGain();
+      osc.frequency.setValueAtTime(150, t0);
+      osc.frequency.exponentialRampToValueAtTime(50, t0 + 0.12);
+      g2.gain.setValueAtTime(vol * 0.9, t0);
+      g2.gain.exponentialRampToValueAtTime(1e-3, t0 + 0.18);
+      osc.connect(g2).connect(ctx.destination);
+      osc.start(t0);
+      osc.stop(t0 + 0.2);
+      osc.onended = () => osc.disconnect();
+      return;
+    }
+    const dur = isSnareLike ? 0.18 : 0.05;
+    const length = Math.max(1, Math.floor(ctx.sampleRate * dur));
+    const buffer = ctx.createBuffer(1, length, ctx.sampleRate);
+    const data = buffer.getChannelData(0);
+    for (let i = 0; i < length; i++) data[i] = Math.random() * 2 - 1;
+    const src = ctx.createBufferSource();
+    src.buffer = buffer;
+    const filter = ctx.createBiquadFilter();
+    filter.type = isSnareLike ? "bandpass" : "highpass";
+    filter.frequency.value = isSnareLike ? 2e3 : 8e3;
+    const g = ctx.createGain();
+    g.gain.setValueAtTime(vol * (isSnareLike ? 0.7 : 0.4), t0);
+    g.gain.exponentialRampToValueAtTime(1e-3, t0 + dur);
+    src.connect(filter).connect(g).connect(ctx.destination);
+    src.start(t0);
+    src.stop(t0 + dur);
+    src.onended = () => {
+      src.disconnect();
+      filter.disconnect();
+      g.disconnect();
+    };
+  };
+  let voices = null;
+  const ensureVoices = () => {
+    if (options.singingVoices) return options.singingVoices;
+    if (!voices) {
+      const ctx = ensureCtx();
+      voices = createSingingVoices(ctx, ctx.destination);
+    }
+    return voices;
+  };
+  const voicesAvailable = useSynth || !!options.singingVoices;
+  const peekVoices = () => options.singingVoices ?? voices;
+  const getAudioTime = () => {
+    if (useSynth) return ensureCtx().currentTime;
+    return options.getAudioTime?.() ?? performance.now() / 1e3;
+  };
+  const doc = target.ownerDocument ?? document;
+  const root = doc.createElement("div");
+  root.className = "dtm-daw dtm-player";
+  const head = doc.createElement("div");
+  head.className = "dtm-player-head";
+  const playBtn = doc.createElement("button");
+  playBtn.type = "button";
+  playBtn.className = "dtm-player-play";
+  playBtn.innerHTML = icon("play", 12);
+  playBtn.disabled = trackIndices.length === 0;
+  const tempoEl = doc.createElement("span");
+  tempoEl.className = "dtm-player-tempo";
+  tempoEl.textContent = `\u2669=${bpm}`;
+  const timeEl = doc.createElement("span");
+  timeEl.className = "dtm-player-time";
+  timeEl.textContent = "00:00";
+  const dots = doc.createElement("div");
+  dots.className = "dtm-player-dots";
+  for (const index of trackIndices) {
+    const dot = doc.createElement("span");
+    dot.className = "dtm-player-dot";
+    dot.style.backgroundColor = colorOf(index);
+    dots.appendChild(dot);
+  }
+  head.append(playBtn, tempoEl, timeEl);
+  const addChip = (label) => {
+    const chip = doc.createElement("span");
+    chip.className = "dtm-player-chip";
+    chip.textContent = label;
+    head.appendChild(chip);
+  };
+  if (meta.instrument) addChip(`\u266A ${meta.instrument}`);
+  if (meta.drum) addChip(`\u{1F941} ${meta.drum}${drumPattern ? "" : " (?)"}`);
+  if (meta.volume !== void 0) addChip(`\u{1F50A} ${meta.volume}%`);
+  head.appendChild(dots);
+  root.appendChild(head);
+  const laneViews = [];
+  for (const index of trackIndices) {
+    const lyricTrack = lyricTracks.get(index);
+    const isLyricLane = !!lyricTrack && lyricTrack.syllables.length > 0;
+    const row = doc.createElement("div");
+    row.className = "dtm-player-lane-row";
+    const label = doc.createElement("div");
+    label.className = "dtm-player-lane-label";
+    const swatch = doc.createElement("span");
+    swatch.className = "dtm-player-dot";
+    swatch.style.backgroundColor = colorOf(index);
+    const no = doc.createElement("span");
+    no.className = "dtm-player-lane-no";
+    no.textContent = `@${index}`;
+    label.append(swatch, no);
+    const lane = doc.createElement("div");
+    lane.className = "dtm-player-lane";
+    lane.style.setProperty("--tk", colorOf(index));
+    const laneTokens = [];
+    if (isLyricLane) {
+      const notes = placements.filter((p) => p.trackIndex === index).sort((a, b) => a.startStep - b.startStep);
+      const gateScale = (lyricTrack.gate ?? 100) / 100;
+      const breaks = new Set(lyricTrack.lineBreaks ?? []);
+      if (lyricTrack.metaText) {
+        const metaEl = doc.createElement("span");
+        metaEl.className = "dtm-tk dtm-tk--meta";
+        metaEl.textContent = lyricTrack.metaText;
+        lane.appendChild(metaEl);
+      }
+      const count = Math.min(notes.length, lyricTrack.syllables.length);
+      for (let i = 0; i < count; i++) {
+        const note = notes[i];
+        if (breaks.has(i)) {
+          const br = doc.createElement("span");
+          br.className = "dtm-tk dtm-tk--break";
+          br.textContent = "\\n";
+          lane.appendChild(br);
+        }
+        const span = doc.createElement("span");
+        span.className = "dtm-tk dtm-tk--lyric";
+        span.textContent = lyricTrack.syllables[i].kana;
+        lane.appendChild(span);
+        laneTokens.push({
+          el: span,
+          startStep: note.startStep,
+          durationSteps: Math.max(
+            1,
+            Math.round(note.durationSteps * gateScale)
+          )
+        });
+      }
+    } else {
+      const tokens = tokenTracks?.get(index) ?? [];
+      for (const tok of tokens) {
+        const span = doc.createElement("span");
+        span.className = `dtm-tk dtm-tk--${tok.type}`;
+        span.textContent = tok.text;
+        lane.appendChild(span);
+        if (tok.durationSteps > 0) {
+          laneTokens.push({
+            el: span,
+            startStep: tok.startStep,
+            durationSteps: tok.durationSteps
+          });
+        }
+      }
+    }
+    row.append(label, lane);
+    root.appendChild(row);
+    laneViews.push({ lane, tokens: laneTokens });
+  }
+  target.appendChild(root);
+  const autoScroll = (lane, el) => {
+    if (el.offsetWidth === 0 || lane.clientWidth === 0) return;
+    const elementCenter = el.offsetLeft + el.offsetWidth / 2;
+    const maxScroll = Math.max(0, lane.scrollWidth - lane.clientWidth);
+    const next = elementCenter - lane.clientWidth / 2;
+    lane.scrollLeft = Math.max(0, Math.min(next, maxScroll));
+  };
+  const renderPlayhead = (step) => {
+    timeEl.textContent = formatTime(Math.max(0, step) * secondsPerStep);
+    for (const view of laneViews) {
+      let active = null;
+      for (const t of view.tokens) {
+        const on = step >= t.startStep && step < t.startStep + t.durationSteps;
+        t.el.classList.toggle("is-active", on);
+        if (on && !active) active = t;
+      }
+      if (active) autoScroll(view.lane, active.el);
+    }
+  };
+  const resetPlayhead = () => {
+    timeEl.textContent = "00:00";
+    for (const view of laneViews) {
+      for (const t of view.tokens) t.el.classList.remove("is-active");
+      view.lane.scrollLeft = 0;
+    }
+  };
+  const seq = createSequencer({
+    getTracks: () => seqTracks,
+    getBpm: () => bpm,
+    getPlayStartStep: () => 0,
+    getDrumPattern: () => drumPattern,
+    getSoloTrackId: () => null,
+    getAudioTime,
+    onPlayNote: (e) => {
+      if (lyricTracks.has(Number(e.trackId))) return;
+      options.onPlayNote?.(e);
+      if (useSynth) synthPlay(e);
+    },
+    onPlayDrum: (e) => {
+      const velocity = e.velocity * (trackVolume / 100);
+      options.onPlayDrum?.({ ...e, velocity });
+      if (useSynth) drumSynth({ ...e, velocity });
+    },
+    onTick: (step) => {
+      renderPlayhead(step);
+    },
+    onEnd: () => finish(),
+    stepsPerBar: STEPS_PER_BAR
+  });
+  let playing = false;
+  const setPlayingUI = (on) => {
+    playing = on;
+    playBtn.innerHTML = icon(on ? "stop" : "play", 12);
+    playBtn.classList.toggle("dtm-player-play--stop", on);
+  };
+  const finish = () => {
+    setPlayingUI(false);
+    resetPlayhead();
+    if (activePlayer === instance) activePlayer = null;
+  };
+  const buildStreamTracks = () => [...lyricTracks.entries()].map(([index, lt]) => {
+    const seqTrack = seqTracks.find((t) => Number(t.id) === index);
+    const sorted = [...seqTrack?.notes ?? []].sort(
+      (a, b) => a.startStep - b.startStep
+    );
+    const gate = (lt.gate ?? 100) / 100;
+    const count = Math.min(sorted.length, lt.syllables.length);
+    const notes = [];
+    for (let i = 0; i < count; i++) {
+      const n = sorted[i];
+      notes.push({
+        syllable: lt.syllables[i],
+        pitch: n.pitch,
+        startSec: n.startStep * secondsPerStep,
+        durationSec: n.durationSteps * secondsPerStep * gate
+      });
+    }
+    return {
+      model: lt.model,
+      volume: vocalVolumeToGain(lt.volume ?? 300) * (trackVolume / 100),
+      pan: panToStereo(lt.pan ?? 64),
+      notes
+    };
+  });
+  const startWhenReady = async () => {
+    const streaming = voicesAvailable && lyricTracks.size > 0;
+    const tracks = streaming ? buildStreamTracks() : [];
+    if (streaming) {
+      const v = ensureVoices();
+      const overlay = showLoadingOverlay(root);
+      try {
+        await v.loadModels(tracks.map((t) => t.model));
+        await v.warm(tracks);
+      } catch (err) {
+        console.warn("[dtm] voice preload failed", err);
+      } finally {
+        overlay.remove();
+      }
+      if (!playing || activePlayer !== instance) return;
+    }
+    seq.start(0);
+    if (streaming) ensureVoices().startStream(tracks, seq.getStartTime());
+  };
+  const play = () => {
+    if (playing || trackIndices.length === 0) return;
+    if (activePlayer && activePlayer !== instance) activePlayer.stop();
+    activePlayer = instance;
+    setPlayingUI(true);
+    void options.onResumeAudio?.();
+    if (useSynth) {
+      const ctx = ensureCtx();
+      if (ctx.state === "suspended") void ctx.resume();
+    }
+    if (voicesAvailable && lyricTracks.size > 0) ensureVoices().reset();
+    void startWhenReady();
+  };
+  const stop = () => {
+    if (!playing) return;
+    seq.stop();
+    peekVoices()?.stopStream();
+    finish();
+  };
+  playBtn.addEventListener("click", () => {
+    if (playing) stop();
+    else play();
+  });
+  const destroy = () => {
+    seq.stop();
+    peekVoices()?.stopStream();
+    if (activePlayer === instance) activePlayer = null;
+    if (audioCtx) {
+      void audioCtx.close();
+      audioCtx = null;
+    }
+    root.remove();
+  };
+  const instance = {
+    play,
+    stop,
+    isPlaying: () => playing,
+    destroy
+  };
+  return instance;
+};
+
 // src/piano-roll.ts
 var createPianoRoll = (options, handlers) => {
   const {
@@ -4416,9 +6420,14 @@ export {
   DRUM_KEYS,
   DRUM_PATTERNS,
   INSTRUMENT_PRESETS,
+  KOE_BASE_URL,
+  KOE_VOICEBANKS,
+  KOE_VOICEBANK_LABELS,
   LinkedList,
+  MAX_VOCAL_VOLUME,
   MMLCore,
   PITCH_MAP,
+  PREWARM_NOTES,
   TRACKS_ADVANCED,
   TRACKS_SIMPLE,
   analyzeMidiTracks,
@@ -4426,9 +6435,15 @@ export {
   applyMonophonic,
   buildChordPlacements,
   buildNameToKeyMapping,
+  collectPitchTokens,
   createAudioContext,
+  createKlattVoice,
+  createKoeVoice,
+  createLyricsConductor,
   createPianoRoll,
   createSequencer,
+  createSingingVoices,
+  createVoiceRegistry,
   decomposeToMonophonic,
   drawGrid,
   drawHeader,
@@ -4440,6 +6455,7 @@ export {
   extractMidiPlacements,
   extractMidiPlacementsByTrack,
   fetchSoundFontList,
+  formatMmlMeta,
   generateRandomPattern,
   getDrawOffset,
   getGridCanvas,
@@ -4453,10 +6469,19 @@ export {
   init,
   injectStyles,
   isChordHeavyTrack,
+  koeUrl,
   mountDAW,
+  mountMmlPlayer,
+  normalizeLyrics,
   onClick,
+  panToStereo,
+  parseLyrics,
   parseMML,
+  parseMmlMeta,
   setDrawOffset,
   setupRecorder,
-  shiftNotes
+  shiftNotes,
+  stripLyrics,
+  stripMmlMeta,
+  vocalVolumeToGain
 };