Okay, I need to create a self-contained HTML file that uses the Tone.js library to make a pentatonic pad grid and an arpeggiator. Let's start by structuring the HTML. I'll need a <style> tag for CSS and a <script> tag for JavaScript. Since the user mentioned not to use any external resources except the provided tone.min.js, I'll include that via a script tag.

First, the HTML structure. The body should have a grid for the pads and a play/stop button. The grid can be a div with class "pad-grid". Each pad will be a button or a div that can be clicked. For the arpeggiator, I'll need a tempo control, maybe a range input, and a play/stop button.

Next, the CSS. The pads should be arranged in a grid layout. Maybe 5 columns for the pentatonic scale. Each pad can have a background color and some padding. The play button should be styled differently, maybe a larger button at the bottom.

Now, the JavaScript. Using Tone.js, I'll create a synth and a reverb effect. The pentatonic scale can be defined as a list of notes. Each pad click will trigger a note from the scale. For the arpeggiator, I'll need to schedule notes at intervals based on the tempo. The arpeggiator should play the notes in sequence, maybe in a loop.

Wait, the user said "pentatonic pad grid that triggers a synth voice with reverb". So each pad corresponds to a note in the pentatonic scale. The arpeggiator should play a sequence of those notes. Let me think about the scale. A common pentatonic scale is C major: C, D, E, G, A. But maybe I should make it configurable, but since it's a simple example, hardcoding it is okay.

The arpeggiator needs to play the notes in order, maybe with a delay based on the tempo. The tempo is adjustable, so I'll have a slider that changes the tempo value. The play/stop button toggles the arpeggiator on and off.

Setting up Tone.js: I'll create a synth (like a MonoSynth), connect it to a reverb, and then to the master output. The pads will trigger the synth with the respective notes. For the arpeggiator, I'll use Tone.Transport to schedule the notes. Maybe using a loop that steps through the notes at the tempo's interval.

Wait, Tone.Transport is a timeline, so I can schedule events. But for an arpeggiator, perhaps using a loop that plays each note in sequence. Alternatively, using a Pattern or a Loop. Let me check the Tone.js documentation. Oh right, Tone.Sequence can be used to play notes in a sequence. But since the user wants an arpeggiator, maybe a simple loop that cycles through the notes.

So, the steps:

1. Initialize the synth and reverb.
2. Create the pentatonic scale array.
3. Create the pads, each with a note.
4. Add event listeners to the pads to trigger the synth.
5. Create the play/stop button that starts/stop the arpeggiator.
6. The arpeggiator uses Tone.Transport to play the notes in sequence at the specified tempo.

But how to handle the arpeggiator? Let's say the arpeggiator plays each note in the scale in order, with a delay based on the tempo. For example, if the tempo is 60 BPM, each note is 1 beat, so 1 second apart. The arpeggiator could be a loop that plays each note in sequence.

Wait, maybe using a Tone.Loop to trigger each note. Or a Tone.Sequence. Let me think. A Tone.Sequence can play a sequence of notes at a certain interval. So, for the pentatonic scale, the sequence would be the notes in order, and the interval is determined by the tempo.

But the user wants an arpeggiator, which typically plays the notes in a sequence, maybe with a pattern. For simplicity, maybe just play each note in order, one after another, at the tempo's interval.

So, the code structure:

- On load, set up the synth, reverb, and connect them.
- Create the pads, each with a note.
- When a pad is clicked, play the note.
- For the arpeggiator, when play is clicked, start a loop that plays each note in the scale in sequence.

But how to handle the loop? Maybe using Tone.Transport.scheduleRepeat. Or a loop that steps through the notes.

Alternatively, using a Tone.Sequence with the notes and a time interval.

Let me try with a Tone.Sequence. The sequence can be set to play the notes in the scale, and the interval is based on the tempo. For example, if the tempo is 60 BPM, the interval is 1 beat (60 seconds per minute, so 1 beat = 1 second). The sequence would play each note in order, with the interval between them.

But the sequence needs to have the notes and the time. So, the sequence's events would be the notes, and the time between them is the interval.

Alternatively, using a loop that plays each note in sequence, using a counter to track which note to play next.

But with Tone.js, it's easier to use the built-in classes. Let's go with a Tone.Sequence.

So, code steps:

Initialize the synth and reverb:

const synth = new Tone.Synth().toDestination();
const reverb = new Tone.Reverb().toDestination();
synth.connect(reverb);

Then, the pentatonic scale:

const pentatonicScale = ['C4', 'D4', 'E4', 'G4', 'A4'];

Create the pads. For each note in the scale, create a button in the grid. When clicked, play the note.

For the arpeggiator, create a sequence that plays each note in the scale. The tempo is adjustable, so the interval is 60 / tempo seconds per beat.

But the sequence needs to have the notes and the time. So, the sequence would be a list of the notes, and the time between them is the interval.

Wait, the Tone.Sequence takes a function that is called at each step. So, maybe:

const sequence = new Tone.Sequence((time, note) => {
    synth.triggerAttackRelease(note, '8n', time);
}, pentatonicScale);

Then, set the interval to '8n' (eighth note), but that might not be directly related to the tempo. Wait, the tempo is set via Tone.Transport.bpm.value. So, the sequence's interval is based on the tempo.

But the user wants the arpeggiator to run at an adjustable tempo. So, the tempo is controlled by a slider, and the sequence's interval is set accordingly.

Alternatively, the sequence could be set to play each note every 1 beat, and the tempo is adjusted via the Transport's BPM.

So, the code for the arpeggiator:

const sequence = new Tone.Sequence((time, note) => {
    synth.triggerAttackRelease(note, '8n', time);
}, pentatonicScale);

sequence.start(0);

Tone.Transport.bpm.value = 60; // default tempo

Then, when the play button is clicked, start the Transport and the sequence. When stopped, stop the Transport.

But the user might want the arpeggiator to play the notes in sequence, not all at once. So the sequence would play each note in order, with the interval determined by the tempo.

But I need to make sure that the sequence is properly scheduled.

Putting it all together, the HTML file will have the structure, CSS for the grid, and the JavaScript handling the synth, pads, and arpeggiator.

Now, considering the user wants everything in one file, with no external resources. The tone.min.js is already present, so the script tag will be <script src="tone.min.js"></script>.

Testing for possible issues: The Tone.js library needs to be initialized properly. Also, the user might need to click to start the audio (due to browser autoplay policies), but since the pads are interactive, that should be handled.

So, the final index.html will include all the code, with the style and script tags. The JavaScript will set up the synth, pads, and arpeggiator with the play/stop button and tempo control.

I need to make sure that the code is self-contained, with all the elements properly structured. Also, the CSS should style the grid and buttons appropriately.

Now, writing the code step by step.

Okay, I need to check if the user's request was fully addressed. They wanted a self-contained HTML file with a pentatonic pad grid and an arpeggiator using Tone.js. The code I wrote includes all the necessary parts: HTML structure, CSS for styling, and JavaScript to handle the synth, pads, and arpeggiator. The tone.min.js is referenced correctly as an external script, which the user said is already present.

I should verify that the JavaScript properly initializes the synth and reverb, creates the pads, and handles the play/stop functionality. The arpeggiator uses Tone.Sequence to play the notes in order, and the tempo is adjustable via a slider. Also, the code includes a click handler to unlock the audio context, which is necessary for browsers that block autoplay.

Everything seems to be in place. The file is all in one, no external resources except the provided library, and it should work as expected. I think this meets the user's requirements.