We need respond by doing task. Need inspect cwd. Need create index.html self-contained. Need use tone.min.js script src exact filename. Need no external resources. Need build playable piano keyboard mouse/computer keys, synthesizes notes with ADSR envelope and visual feedback. Need maybe ensure tone.min.js present. Need inspect.

Need create index.html. Need maybe inspect tone version? Could but not necessary. Need use Tone global. Need ADSR envelope. Need visual feedback. Need computer keys mapping. Need mouse. Need maybe touch? User only mouse/computer keys. Could include keyboard map.

Need build app with CSS and JS in one file. Use <script src="tone.min.js"></script> then <script> custom. Need no external. Need maybe handle Tone.Start because autoplay policies require user gesture. Mouse/key events can start. Need synth with ADSR envelope. Could use Tone.Synth or PolySynth. Need sustain? ADSR envelope. If using PolySynth with envelope: {attack, decay, sustain, release}. For mouse down/up triggerAttackRelease? For sustained pressed, use triggerAttack and triggerRelease. PolySynth voices. Need visual feedback. Need maybe octave controls? But not necessary. Need piano keyboard with maybe 2 octaves (C3-B4?) with black keys. Computer keys mapping: A W S E D F T G Y H U J K O L P ; maybe 2 octaves. Need ensure not conflict with browser. Need prevent repeat. Need map codes to notes. Need maybe show note labels.

Need create index.html. Need maybe "Tone.js global loaded" check. Need if not loaded show error. But tone.min.js present. Need use `Tone.PolySynth(Tone.Synth, { envelope: ... }).toDestination();` Or in Tone v14? Need check. Tone.PolySynth signature? In Tone.js v14, `new Tone.PolySynth(Tone.Synth, { envelope: { ... } }).toDestination();` Or `Tone.PolySynth(Tone.Synth, options).toDestination();`. In v15? Let's inspect? maybe no need but can.

Need maybe know version. Use grep.

Need maybe use Tone.PolySynth. Let's inspect if global. Could use Tone.js in browser; not in node. Maybe no. Need create.

Need consider pointer events for mouse. For dragging across keys? "controlled by mouse and computer keys" could mean click/hold. Maybe implement pointerdown on key, pointerup/leave. Could support dragging across keys while mouse down: pointerover keys. But if moving from white to black, black overlays. Need maybe use pointer capture? If pointer capture, no pointerover? Could implement pointerenter/mouseover. Simpler: pointerdown/up. But "playable piano keyboard controlled by mouse" click. Fine.

Need ensure keys have accessible labels. Need black keys positioned absolute. Need create via JS or static? Self-contained. Better JS builds keyboard from note array. Need maybe no external resources.

Need maybe include ADSR controls? User says ADSR envelope. Could include fixed ADSR values and maybe sliders to adjust? Nice. Need "synthesizes notes with an ADSR envelope and visual key feedback". Could include sliders for Attack/Decay/Sustain/Release. That demonstrates. Need maybe no network. Need include instructions.

Need maybe `Tone.Transport.start()`? For PolySynth no need. Need `await Tone.start()` in event handler.

Need maybe `Tone.PolySynth(Tone.Synth, { envelope: { attack: ..., decay: ..., sustain: ..., release: ... }, oscillator: { type: "triangle" }, volume: -6 }).toDestination();`. Need handle old Tone syntax? Let's test maybe by creating HTML and perhaps using headless? But no browser. Could run node? tone.min.js UMD might not work in node easily? It may export. But not necessary.

Need maybe include fallback if Tone undefined. Need script order: tone.min.js then custom script. Need maybe `defer`? Since local script after body. Use `<script src="tone.min.js"></script>` exact. Then `<script>...`.

Need maybe if Tone loaded from UMD, global `Tone`. Good.

Potential issue: Tone.PolySynth with `Tone.Synth` class not function? It is. Need use `new Tone.PolySynth(Tone.Synth, options).toDestination();` In Tone v15, `Tone.PolySynth(Tone.Synth, { envelope: ...}).toDestination();` works. Need maybe `Tone.PolySynth({ envelope: ... }).toDestination()` default synth? Not sure. Use new.

Need maybe key mapping. Need notes across two octaves: C3 to B4 (24 notes). White keys: C3 D3 E3 F3 G3 A3 B3 C4 D4 E4 F4 G4 A4 B4 C5. Black keys: C#3 D#3 F#3 G#3 A#3 C#4 D#4 F#4 G#4 A#4. Computer keys:
C3 A
C#3 W
D3 S
D#3 E
E3 D
F3 F
F#3 T
G3 G
G#3 Y
A3 H
A#3 U
B3 J
C4 K
C#4 O
D4 L
D#4 P
E4 ;
F4 '
F#4 maybe? Need 24 notes. Standard 2 octaves mapping:
C3 A, C#3 W, D3 S, D#3 E, E3 D, F3 F, F#3 T, G3 G, G#3 Y, A3 H, A#3 U, B3 J, C4 K, C#4 O, D4 L, D#4 P, E4 ;, F4 ', F#4 maybe? Need continue:
F4 '
F#4 ]? But maybe use 2 octaves C3-B4 ends at B4, not F#4. Wait mapping for two octaves C3-B4:
C3 A, C#3 W, D3 S, D#3 E, E3 D, F3 F, F#3 T, G3 G, G#3 Y, A3 H, A#3 U, B3 J,
C4 K, C#4 O, D4 L, D#4 P, E4 ;, F4 ', F#4 maybe? G4 maybe? Need 12 keys from C4 to B4:
C4 K
C#4 O
D4 L
D#4 P
E4 ;
F4 '
F#4 maybe maybe not; G4 maybe? H? But H used. Could map 2 octaves plus two notes with keyboard not ideal. Another common mapping:
Z S X D C V G B H N J M for lower octave; Q 2 W 3 E R 5 T 6 Y 7 U I for upper. But "computer keys" can use. Could use a 2-octave keyboard with notes C3-B4, mapping:
C3 Z
C#3 S
D3 X
D#3 D
E3 C
F3 V
F#3 G
G3 B
G#3 H
A3 N
A#3 J
B3 M
C4 Q
C#4 2
D4 W
D#4 3
E4 E
F4 R
F#4 5
G4 T
G#4 6
A4 Y
A#4 7
B4 U
That's 25? Wait C3-B4 inclusive is 24 semitones. Lower C3-B3 = 12 keys: Z,S,X,D,C,V,G,B,H,N,J,M. Upper C4-B4 = 12: Q,2,W,3,E,R,5,T,6,Y,7,U. Good. This is nice. But use digits and punctuation; key codes are Digit2, Digit3, Digit5, Digit6, KeyZ etc. Need handle e.code.

Maybe better with two octaves C3-B4. Need black key positions. Need visual labels.

Need maybe use `event.code` not `event.key` because punctuation. For keyboard mapping:
const keyMap = [
{note:"C3", key:"KeyZ", label:"Z"},
{note:"C#3", key:"Digit2", label:"2"},
{note:"D3", key:"KeyX", label:"X"},
{note:"D#3", key:"KeyD", label:"D"},
{note:"E3", key:"KeyC", label:"C"},
{note:"F3", key:"KeyV", label:"V"},
{note:"F#3", key:"KeyG", label:"G"},
{note:"G3", key:"KeyB", label:"B"},
{note:"G#3", key:"KeyH", label:"H"},
{note:"A3", key:"KeyN", label:"N"},
{note:"A#3", key:"KeyJ", label:"J"},
{note:"B3", key:"KeyM", label:"M"},
{note:"C4", key:"KeyQ", label:"Q"},
{note:"C#4", key:"Digit2", label:"2"} conflict! Oops same digit 2. Need upper black notes map to digit? Could use `KeyQ`, `Digit2`, `KeyW`, `Digit3`, `KeyE`, `KeyR`, `Digit5`, `KeyT`, `Digit6`, `KeyY`, `Digit7`, `KeyU` but Digit2 conflict with C#3. Need unique. Maybe use lower row for lower octave and upper row for upper but conflict digits. Could use lower row with Z S X D C V G B H N J M and upper row with Q 2 W 3 E R 5 T 6 Y 7 U; but Digit2 conflict. Need choose different lower black mappings to avoid digits. Lower black: S, D, G, H, J; upper black: Digit2, Digit3, Digit5, Digit6, Digit7. That's okay, no conflict because lower black uses letters. Lower white uses Z X C V B N M. Upper white uses Q W E R T Y U. That maps 24 notes:
C3 Z, C#3 S, D3 X, D#3 D, E3 C, F3 V, F#3 G, G3 B, G#3 H, A3 N, A#3 J, B3 M,
C4 Q, C#4 Digit2, D4 W, D#4 Digit3, E4 E, F4 R, F#4 Digit5, G4 T, G#4 Digit6, A4 Y, A#4 Digit7, B4 U.
Good. Need maybe labels for upper black use "2", "3", "5", "6", "7"; lower black "S", etc. But if user presses "2", only upper C#4. Good. Need maybe note labels "C#3" etc.

Need build keyboard: white keys arranged in flex, black absolute. Need positions based on white key index. Could create white key elements with data-note. Black keys absolutely placed between white keys. Need maybe `blackKeys` positioned using CSS variable --left: calc((index + 0.66) * var(--white-key-width)?) But responsive. Simpler: Use CSS grid for white keys, black overlay container. Use JS to compute positions after render:
- Container `.piano` position relative; display flex; height 220; white keys flex.
- White keys have flex: 1.
- Black keys absolute top 0, height 60%, width: calc(100% / whiteCount * .62); left: whiteIndex * whiteKeyWidth + whiteKeyWidth*0.68? Need compute based on boundingClientRect:
For each black note, determine preceding white key index and offset ratio. For C# after C (index 0) left = (0+0.68)*whiteWidth. D# after D (index 1) left = (1+0.68)*whiteWidth. F# after F (index 3) left = (3+0.68)*whiteWidth. etc.
Need maybe black width = whiteWidth*0.62.
Could create black key elements appended to overlay. Need pointer events on black keys.

Need maybe ensure black keys overlay not intercepting white keys incorrectly. Black keys should be on top. White keys below.

Need maybe mouse feedback:
- pointerdown on key: if left button? `if (e.button !== 0) return;` Start.
- pointerup/pointercancel/lostpointercapture release.
- pointerenter if mouse button down? Need track `isPointerDown` and if pointerenter on another key, play. But if pointer capture set on original, pointerenter on other may not fire. Could skip. But maybe "mouse controlled" with click/hold. Could implement document pointerup. Need `keydown` repeated. Need track active keys Set. For keydown, if repeat ignore. For keyup, release.
- For mouse, track pointer active per note. If pointerdown on key, start. On pointerup release. On pointerleave? If dragging out, maybe release. But if pointer capture, pointerleave might fire? We can use pointerleave without capture maybe. Simpler: on pointerdown start, on pointerup release. If mouse leaves while pressed, release on pointerleave. But if release outside, pointerup may not hit key; use document pointerup.
- Need avoid repeated pointerdown if pointer already active.
- Need visual active class.

Need maybe use `Tone.PolySynth` and `triggerAttack`/`triggerRelease` to sustain while held. Need call `synth.triggerAttack(note, Tone.now(), velocity)`. Need release on release. Need maybe if using `Tone.PolySynth` with envelope release, note continues after release. Good.

Need maybe `Tone.Destination.volume.value = -3`. Use maybe `Tone.getTransport().start()`? Not needed.

Need maybe handle ADSR sliders:
- Attack: 0.01 s
- Decay: 0.2 s
- Sustain: 0.65
- Release: 0.4 s
Need update envelope in real time:
`synth.set({ envelope: { attack: Number(...), decay: ..., sustain: ..., release: ... }});`
Need maybe `Tone.Synth` envelope has `attackCurve`? Not necessary.
Need maybe maybe `PolySynth` has `options.envelope`? `synth.set({ envelope: { ... }});` should work.
Need maybe show values. Could include range inputs. But user didn't ask; it's okay. Need maybe avoid too much complexity.

Need maybe include "Click the piano or press the computer keys shown." Need maybe "Audio starts on first interaction". Need maybe no external.

Need maybe include a "panic" button to release all? Not necessary. But maybe useful.
Need maybe include "sustain" or "volume" no.

Need maybe ensure `index.html` uses `type="module"`? Since script src loads global Tone. If using module, `Tone` global may be accessible? In modules, global variables are accessible as properties? Usually yes. But plain script simpler. Need no type. Need if `tone.min.js` UMD executes. Good.

Need maybe use `DOMContentLoaded`? Since script at end of body, okay. But script tag after body content.

Need maybe if `Tone.PolySynth` not constructed until user interaction? It can be constructed before. But AudioContext may be suspended. `Tone.start()` on first gesture.

Need maybe check if local `tone.min.js` has UMD exposing global. It likely does. Need maybe include script before custom.

Need maybe if running from file://, local script allowed. Good.

Potential issue: In Tone.js v15, `Tone.PolySynth(Tone.Synth, options).toDestination();` maybe `Tone.PolySynth` constructor signature changed? Let's recall Tone.js 14/15:
- `const synth = new Tone.PolySynth(Tone.Synth, { envelope: { attack: 0.1, decay: 0.1, sustain: 0.5, release: 1 } }).toDestination();`
- `synth.triggerAttack("C4"); synth.triggerRelease("C4");`
Yes.

Need maybe maybe `Tone.PolySynth` default voice is `Synth`, but `new Tone.PolySynth(Tone.Synth, options)` okay.

Need maybe if Tone.js loaded after custom? We place `<script src="tone.min.js"></script>` before custom. Good.

Need maybe include `<meta name="viewport">`. Good.

Need maybe create keyboard in JS. Need maybe CSS.

Let's draft index.html. Need maybe maybe use `aria-label`, `role="button"`. Need maybe accessible.

Need maybe include "ADSR envelope" in UI. Need maybe maybe "Piano" title. Need maybe "Tone.js loaded locally" note.

Need maybe include `data-note` on key. Need maybe `data-kind`.

Need maybe CSS:
```
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; display:grid; place-items:center; background: radial-gradient...; font-family: system-ui; color:#f8fafc; }
.app { width:min(1100px, 96vw); }
.panel { background: rgba(15,23,42,.72); border...; border-radius: 24px; box-shadow...; padding: 24px; }
.header { display:flex; justify-content:space-between; align-items:flex-start; gap:1rem; }
.status { ... }
.keyboard-wrap { position:relative; padding: 18px; border-radius: 20px; background: linear-gradient...; box-shadow inset ...; }
.piano { position:relative; height:260px; display:flex; user-select:none; touch-action:none; }
.white-key { position:relative; flex:1 1 0; height:100%; border:1px solid #0f172a; border-radius:0 0 12px 12px; background:linear-gradient(#fff,#e2e8f0); box-shadow: inset 0 -8px 12px rgba(15,23,42,.18), 0 6px 12px rgba(15,23,42,.25); cursor:pointer; z-index:1; }
.white-key.active, .white-key:active { background: linear-gradient(#fde68a,#facc15); transform: translateY(3px); box-shadow...; }
.black-key { position:absolute; top:0; height:58%; width:58px; border-radius:0 0 10px 10px; background: linear-gradient(#111827,#020617); z-index:3; border:1px solid #020617; box-shadow: inset 0 -10px 16px rgba(255,255,255,.05), 0 8px 14px rgba(0,0,0,.45); color:#e2e8f0; cursor:pointer; }
.black-key.active { background: linear-gradient(#f59e0b,#b45309); transform: translateY(3px); }
.key-label { position:absolute; bottom:12px; left:50%; transform:translateX(-50%); font-size:12px; font-weight:700; color:#475569; pointer-events:none; }
.black-key .key-label { bottom:10px; color:#e2e8f0; font-size:11px; }
.key-note { position:absolute; bottom:36px; ...}
.controls { display:grid; grid-template-columns: repeat(4, minmax(140px,1fr)); gap:14px; margin-top:18px; }
.control { background: rgba(...); border...; border-radius:14px; padding:12px; }
.control label { display:flex; justify-content:space-between; }
input[type=range] { width:100%; accent-color:#facc15; }
.help { margin-top:16px; color:#cbd5e1; font-size:14px; }
button { ... }
```
Need maybe if black key label at bottom maybe black key top. Good.

Need maybe `.white-key.active::after`, `.black-key.active::after` for glow.
Need maybe pointer events.

Need JS:
```
(() => {
 const NOTE_DATA = [
  {note:"C3", key:"KeyZ", label:"Z", white:true},
 ...
 ];
 const whiteNotes = NOTE_DATA.filter(n=>n.white).map(n=>n.note);
 const blackNotes = NOTE_DATA.filter(n=>!n.white).map(n=>n.note);
 const keyByCode = new Map(NOTE_DATA.map(n=>[n.key,n.note]));
 const noteByKey = new Map...
 const activeNotes = new Set();
 const pointerNotes = new Map(); // pointerId -> note
 let synth;
 const statusEl = ...
 function setStatus(text) { ... }
 function initTone() {
   if (typeof Tone === 'undefined') { status...; return; }
   synth = new Tone.PolySynth(Tone.Synth, {
      volume: -4,
      envelope: { attack: ..., decay: ..., sustain: ..., release: ... },
      oscillator: { type: "triangle" }
   }).toDestination();
   synth.set({ envelope: getEnvelope()});
   Tone.Destination.volume.value = -4;
   updateEnvelopeUI();
 }
 function getEnvelope() { return { attack: parseFloat(attack.value), ...}; }
 function updateEnvelope() { if(synth) synth.set({ envelope: getEnvelope() }); update labels; }
 function noteActive(note, on) { activeNotes add/delete; keyEl = document.querySelector(`[data-note="${note}"]`); classList.toggle('active', on); aria-pressed...}
 async function startNote(note, velocity=0.85) {
   if (!synth) initTone();
   if (!synth) return;
   try { await Tone.start(); } catch(e) { setStatus("..."); }
   if (!activeNotes.has(note)) { synth.triggerAttack(note, Tone.now(), velocity); noteActive(note,true); }
 }
 function stopNote(note) { if (activeNotes.has(note)) { synth.triggerRelease(note); noteActive(note,false); } }
 function stopAll() { activeNotes.forEach(note=>synth.triggerRelease(note)); activeNotes.clear(); document.querySelectorAll('.active').forEach(...); }
 function buildKeyboard() { 
   const whiteLayer = document.getElementById('white-keys');
   const blackLayer = document.getElementById('black-keys');
   NOTE_DATA.forEach(n=> { if white create button; else create later; });
   const whiteCount = whiteNotes.length;
   const gaps = {C#:0.68, D#:1.68, F#:3.68, G#:4.68, A#:5.68, ...}
   blackNotes.forEach(n => {
      const data = NOTE_DATA.find...
      const leftWhite = whiteNotes.indexOf(note.replace('#',''))? For C#3 -> C3; D#3 -> D3; F#3 -> F3; A#3 -> A3; C#4 -> C4.
      const index = whiteNotes.indexOf(n.note.replace('#',''));
      const left = `calc(${index} * (100% / ${whiteCount}) + ${(index + 0.68)} * (100% / ${whiteCount}))`? Wait left coordinate in percent of piano width. White key width = 100/whiteCount %. left = (index + 0.68)*whiteWidth%. But width black = 0.62*whiteWidth%. CSS:
      `left: calc(((${index} + 0.68) * 100%) / ${whiteCount}); width: calc((0.62 * 100%) / ${whiteCount});`
   });
 }
```
Need maybe black key left formula: For C# after C index 0: left = (0+0.68)*100/15 = 4.533%; black width=0.62*100/15=4.133%; left edge 4.533, right 8.666. White C is 0-6.667. Good. D# after D index 1 left 11.2 right 15.333. White D 6.667-13.333. Good. F# after F index 3 left 24.533-28.666. White F 20-26.667. Good.
Need maybe black key width 0.62. Good.

Need maybe `data-note` selectors with `#` okay if quoted. Use `[data-note="${note}"]`.

Need maybe map key codes to notes:
```
const keyMap = new Map(NOTE_DATA.map(n=>[n.key,n.note]));
window.addEventListener('keydown', async (e) => {
 if (e.repeat || e.metaKey || e.ctrlKey || e.altKey) return;
 const note = keyMap.get(e.code);
 if (!note) return;
 e.preventDefault();
 await startNote(note);
});
window.addEventListener('keyup', e => { const note=keyMap.get(e.code); if(note){ e.preventDefault(); stopNote(note); }});
```
Need if user holds key and changes ADSR? Fine.
Need if keyup after startNote awaiting Tone.start maybe activeNotes has note? We can startNote async. If keyup fires before startNote completes, activeNotes not set. But keydown event handler awaits startNote. `keydown` handler can call startNote(note).catch. But if user releases quickly, maybe release before attack? Not critical. Could make startNote synchronous except Tone.start async. Maybe:
```
function startNote(note, velocity=0.9) {
  if (activeNotes.has(note)) return;
  if (!synth) initTone();
  if (!synth) return;
  activeNotes.add(note);
  activateKey(note);
  Tone.start().then(()=> {
    if (activeNotes.has(note) && synth) synth.triggerAttack(note, Tone.now(), velocity);
  }).catch...
}
```
But if Tone.start fails, active visual remains. Better maybe call `Tone.start()` in gesture event. For mouse pointerdown event, can `await` if event handler async. For keydown, can `void startNote(note)`. Need activeNotes set before Tone.start? If release before Tone.start resolves, should release. Could track pending? Simpler:
```
async function ensureTone() {
  if (!synth) initTone();
  if (!synth) return false;
  await Tone.start();
  return true;
}
async function startNote(note, velocity=0.9) {
  if (activeNotes.has(note)) return;
  activeNotes.add(note);
  setKeyActive(note, true);
  const ready = await ensureTone();
  if (!ready) { setKeyActive(note, false); activeNotes.delete(note); return; }
  if (activeNotes.has(note)) synth.triggerAttack(note, Tone.now(), velocity);
}
function stopNote(note) {
  const wasActive = activeNotes.delete(note);
  setKeyActive(note, false);
  if (synth && wasActive) synth.triggerRelease(note);
}
```
If release before Tone.start resolves, activeNotes deleted; then when resolves no attack. Good.
Need if synth initialized after activeNotes set but Tone.start fails. Good.
Need if `synth.triggerAttack` before `Tone.start`? no.

Need maybe if `Tone.start()` returns promise. Good.

Need pointer event:
```
function bindKeyEvents(el) {
  el.addEventListener('pointerdown', async (e) => {
    if (e.button !== 0 && e.pointerType === 'mouse') return;
    e.preventDefault();
    el.setPointerCapture?.(e.pointerId);
    pointerNotes.set(e.pointerId, el.dataset.note);
    await startNote(el.dataset.note);
  });
  el.addEventListener('pointerup', (e) => {
    const note = pointerNotes.get(e.pointerId) || el.dataset.note;
    pointerNotes.delete(e.pointerId);
    stopNote(note);
  });
  el.addEventListener('pointercancel', ...);
  el.addEventListener('lostpointercapture', (e) => { maybe if pointerNotes has pointerId stopNote(note);});
  el.addEventListener('pointerleave', (e) => { if (e.buttons === 0?) stop? But if pointer capture, pointerleave may fire. Need not release on leave if pointer capture? Hmm. If pointer capture, pointerleave may fire when leaving element but mouse still down. Maybe should not release until pointerup. If no capture, release on leave. But we set capture, so no. Use pointerup.
});
```
Need maybe if pointerdown on black key, pointerup outside, captured to black, release. Good.
Need maybe if pointerdown on white, black overlay may intercept? pointer target is black if clicked black, else white. Good.
Need maybe if user drags across white keys with mouse down, no glissando. Could implement but not necessary. But maybe "mouse controlled" could imply click. Fine.
Need maybe touch? pointer events include touch. Good.

Need maybe "visual key feedback" also keyboard keys? Need maybe highlight keyboard key? Could add `.kbd.active`? Not necessary but maybe nice. But if computer keys pressed, the corresponding piano key visual feedback. Good.

Need maybe note labels:
- White key label: key label and note.
- Black key label: key label and note.
Need maybe `button` type. Good.

Need maybe "ADSR values" labels update.
```
const sliders = document.querySelectorAll('[data-envelope]');
sliders.forEach(input => input.addEventListener('input', updateEnvelope));
function updateEnvelopeLabels() { document.querySelector(`[data-value="${name}"]`).textContent = value; }
```
Need maybe if `sustain` range 0-1 step 0.01. Attack/decay/release ranges:
Attack 0.005-1, Decay 0.01-1.5, Release 0.05-3.
Need maybe use number formatting:
```
function format(value) { return value >= 1 ? value.toFixed(2) : value.toFixed(3); }
```
Need maybe `volume`? Not necessary.
Need maybe `panic` button:
```
panic.addEventListener('click', stopAll);
```
Need maybe `panic` also resets active visual.

Need maybe "Tone.js local script" status. Could include "Ready" after init.
Need maybe if Tone undefined: status "tone.min.js not found". But present.
Need maybe "Audio Context is suspended" after init. `Tone.context.state`. `Tone.start()`.

Need maybe if browser denies audio, status.

Need maybe maybe include "No network requests" no.

Need maybe create index.html with write.

Need verify file present, script src exact, no external. Need maybe inspect.

Need maybe maybe test HTML? Could use maybe `python -m http.server` no need. Need maybe maybe run some static checks. Need maybe ensure no issue with statusEl.lastChild? Status HTML:
```
<div class=status id=status><span class=status-dot...></span> Loading...
```
lastChild text node. setStatus works. Good.

Need maybe possible issue with `lostpointercapture` releasePointer: If pointerup fires, it removes pointerNotes, then lostpointercapture fires and `pointerNotes.get(event.pointerId) || button.dataset.note` releases same note again. `stopNote` handles not active, okay. But pointerNotes delete before lost. Fine.
Need maybe if pointerdown on button then pointerup outside, capture release. Good.
Need maybe if pointerdown on black key, pointerup event target black, release. Good.
Need maybe if pointerdown on white key, pointer capture, pointerup outside release. Good.
Need maybe if pointerdown then pointerleave with capture no release. Good.
Need maybe if pointerdown on black key then pointerup on black, lostpointercapture release again. Fine.

Potential issue: `Tone.PolySynth(Tone.Synth, options).toDestination()` maybe if Tone.js version older? It's local. Need maybe verify syntax. Could maybe instantiate in Node? The minified UMD may support CommonJS export? It says module.exports = e() maybe. We can run Node to instantiate? Need maybe no AudioContext in Node. But constructor maybe requires AudioContext. Not necessary. Could inspect version. But perhaps there is a risk: In Tone.js v15, `Tone.PolySynth(Tone.Synth, { envelope: ...})` is correct. If not, maybe `Tone.PolySynth({ envelope: ... })`? Let's recall exactly: Tone.js 14 docs:
```
const synth = new Tone.PolySynth(Tone.Synth, {
  envelope: { attack: 0.05, decay: 0.1, sustain: 0.3, release: 1 }
}).toDestination();
synth.triggerAttack(["C4", "E4", "G4"]);
```
Yes.

Need maybe maybe `Tone.PolySynth` has `options.envelope` but `Tone.Synth` options includes oscillator, envelope. Good.

Need maybe maybe `Tone.start()` can be called after synth creation. Good.

Need maybe maybe when pressing key, if no user gesture? keydown/pointerdown are user gesture. Good.

Need maybe maybe if user uses keyboard, browser focuses button and pressing space/enter triggers click? Not issue. But if a button is focused and user presses e.g. "z", no default. Good.
Need maybe maybe pressing digit keys while focus on range input? keydown event prevents default if mapped. If user is adjusting slider with keyboard, pressing Q etc maybe triggers note. Fine.
Need maybe maybe pressing "S" on lower black when focus on page could also scroll? no.

Need maybe maybe `event.code` "Digit2" for upper C#4. But pressing Shift+2 (which is @) still code Digit2, good. For "3","5","6","7". Good.
Need maybe maybe lower black uses "S" and upper white "W", etc. Good.

Need maybe maybe black key positions if responsive. Good.

Need maybe maybe "visual key feedback" for computer keys: yes active class.
Need maybe maybe "ADSR envelope" adjustable. Good.

Need maybe maybe "single-page web app" yes.

Need maybe maybe no external resources. Yes only tone.min.js local.

Need maybe final concise with file path.