diff --git "a/index.html" "b/index.html"
--- "a/index.html"
+++ "b/index.html"
@@ -1693,1262 +1693,1353 @@ header.addEventListener('click', () => {
         <button class="lock-controls-btn" id="lock-controls-btn" title="コントロールバーを固定">🔒</button>
         <script>
             document.addEventListener('DOMContentLoaded', function() {
-                // 同期管理用の変数
-                let lastSyncTime = 0;
-                let isBuffering = false;
-                let syncDriftLog = [];
-                let syncCheckInterval;
-                let audioContext;
-                let controlsHideTimeout;
-                let isControlsLocked = false;
-                let controlsVisible = true;
-                let isCheckingSync = false;
-                let isInBackgroundTab = false;
-                
-                try {
-                    audioContext = new (window.AudioContext || window.webkitAudioContext)();
-                } catch (e) {
-                    console.error('Web Audio APIがサポートされていません:', e);
-                }
-            
-                // テクノロジー風背景を生成
-                function createTechBackground() {
-                    const bg = document.getElementById('techBg');
-                    
-                    for (let i = 0; i < 200; i++) {
-                        const line = document.createElement('div');
-                        line.className = 'circuit-line';
-                        
-                        const isHorizontal = Math.random() > 0.5;
-                        if (isHorizontal) {
-                            line.style.width = `${Math.random() * 300 + 100}px`;
-                            line.style.height = '1px';
-                        } else {
-                            line.style.width = '1px';
-                            line.style.height = `${Math.random() * 300 + 100}px`;
-                        }
-                        
-                        line.style.left = `${Math.random() * 100}%`;
-                        line.style.top = `${Math.random() * 100}%`;
-                        line.style.opacity = Math.random() * 0.5 + 0.1;
-                        bg.appendChild(line);
-                    }
-            
-                    for (let i = 0; i < 200; i++) {
-                        const dot = document.createElement('div');
-                        dot.className = 'grid-dot';
-                        dot.style.left = `${Math.random() * 100}%`;
-                        dot.style.top = `${Math.random() * 100}%`;
-                        bg.appendChild(dot);
-                    }
-            
-                    for (let i = 0; i < 15; i++) {
-                        const hex = document.createElement('div');
-                        hex.className = 'hexagon';
-                        hex.style.left = `${Math.random() * 100}%`;
-                        hex.style.top = `${Math.random() * 100}%`;
-                        hex.style.transform = `rotate(${Math.random() * 360}deg)`;
-                        hex.style.animation = `float ${Math.random() * 10 + 5}s infinite ease-in-out`;
-                        bg.appendChild(hex);
-                    }
-            
-                    for (let i = 0; i < 8; i++) {
-                        const pulse = document.createElement('div');
-                        pulse.className = 'pulse';
-                        pulse.style.left = `${Math.random() * 100}%`;
-                        pulse.style.top = `${Math.random() * 100}%`;
-                        pulse.style.animationDelay = `${Math.random() * 2}s`;
-                        bg.appendChild(pulse);
-                    }
-                }
-                
-                createTechBackground();
-              
-                const urlParams = new URLSearchParams(window.location.search);
-                const isTMode = urlParams.has('mode') && urlParams.get('mode') === 't';
-                const basePath = isTMode ? '/t/' : '/';
-              
-                // ローディング状態を管理
-                let loadingCount = 0;
-                let totalToLoad = 6; // 動画 + 5つの音声ファイル
-                let lastUpdateTime = 0;
-                const updateInterval = 1;
-                
-                function checkLoadingComplete() {
-                    loadingCount++;
-                    if (loadingCount >= totalToLoad) {
-                        setTimeout(function() {
-                            const loadingOverlay = document.getElementById('loadingOverlay');
-                            loadingOverlay.style.opacity = '0';
-                            setTimeout(function() {
-                                loadingOverlay.style.display = 'none';
-                            }, 1000);
-                        }, 500);
-                    }
-                }
-                
-                function handleError(error, message) {
-                    console.error(message, error);
-                    window.alert(`${message}\n\nエラー詳細: ${error.message}`);
-                }
-            
-                // ��素を取得
-                const video = document.getElementById('video');
-                video.preservesPitch = true;
-                video.mozPreservesPitch = true; // Firefox用
-                video.webkitPreservesPitch = true; // 古いWebKit用
-                const videoContainer = document.getElementById('video-container');
-                const playPauseBtn = document.getElementById('play-pause-btn');
-                const timeDisplay = document.getElementById('time-display');
-                const progressContainer = document.getElementById('progress-container');
-                const progressBar = document.getElementById('progress-bar');
-                const progressTime = document.getElementById('progress-time');
-                const volumeBtn = document.getElementById('volume-btn');
-                const volumeSlider = document.getElementById('volume-slider');
-                const speedSlider = document.getElementById('speed-slider');
-                const speedValue = document.getElementById('speed-value');
-                const playbackSpeedSlider = document.getElementById('playback-speed');
-                const playbackSpeedValue = document.getElementById('playback-speed-value');
-                const fullscreenBtn = document.getElementById('fullscreen-btn');
-                const startTimeInput = document.getElementById('start-time');
-                const endTimeInput = document.getElementById('end-time');
-                const loopCheckbox = document.getElementById('loop');
-                const globalVolumeSlider = document.getElementById('global-volume');
-                const globalVolumeValue = document.getElementById('global-volume-value');
-                const audioSliders = document.querySelectorAll('.audio-slider');
-                const volumeValues = document.querySelectorAll('.volume-value');
-                const setStartTimeBtn = document.getElementById('set-start-time');
-                const setEndTimeBtn = document.getElementById('set-end-time');
-                const resetEndTimeBtn = document.getElementById('reset-end-time');
-                const disabledOverlay = document.getElementById('disabledOverlay');
-                const combineButton = document.getElementById('combine-button');
-                const combineStatus = document.getElementById('combine-status');
-                const previewSection = document.getElementById('preview-section');
-                const previewButton = document.getElementById('preview-button');
-                const previewTime = document.getElementById('preview-time');
-                const bufferingIndicator = document.getElementById('buffering-indicator');
-                const syncStatus = document.getElementById('sync-status');
-                const syncStatusText = document.getElementById('sync-status-text');
-                const syncStatusClose = document.getElementById('sync-status-close');
-                const lockControlsBtn = document.getElementById('lock-controls-btn');
-                const startMarker = document.getElementById('start-marker');
-                const endMarker = document.getElementById('end-marker');
-                const tempoInput = document.getElementById('tempo');
-                const tempoSpeedValue = document.getElementById('tempo-speed-value');
-                const videoControls = document.querySelector('.video-controls');
-                const applyTimeBtn = document.getElementById('apply-time-btn');
-                const pipBtn = document.getElementById('pip-btn');
-                const resetBtn = document.getElementById('reset-btn');
-              
-                // 音声オブジェクトを作成
-                const audioElements = {};
-                const audioBuffers = {};
-                const audioFiles = ['p', 'a', 't', 's', 'k'];
-                let combinedAudioElement = null;
-                let isAudioCombined = false;
-                let currentVolumes = { p: 0, a: 1, t: 1, s: 1, k: 0 };
-                
-                // 初期化
-                let videoDuration = 0;
-                let isPlaying = false;
-                let lastVolume = 1;
-                let currentPlaybackRate = 1;
-                let isFullscreen = false;
-            
-                async function enterPiP() {
-                if (!document.pictureInPictureElement && !video.paused) {
-                  try {
-                    await video.requestPictureInPicture();
-                  } catch (err) {
-                    console.warn('PiP開始失敗:', err);
-                  }
-                }
-              }
-            
-              async function exitPiP() {
-                if (document.pictureInPictureElement) {
-                  try {
-                    await document.exitPictureInPicture();
-                  } catch (err) {
-                    console.warn('PiP終了失敗:', err);
-                  }
-                }
-              }
-                const hideVideoCheckbox = document.getElementById('hide-video');
-                hideVideoCheckbox.addEventListener('change', function() {
-                    video.style.backgroundColor = this.checked ? 'black' : '';
-                    video.style.opacity = this.checked ? '0' : '1';
-                });
-              
-                // 動画のバッファリング状態を監視
-                video.addEventListener('waiting', function() {
-                    isBuffering = true;
-                    bufferingIndicator.style.display = 'block';
-                    if (combinedAudioElement) {
-                        combinedAudioElement.pause();
-                    }
-                });
-                
-                video.addEventListener('playing', function() {
-                    isBuffering = false;
-                    bufferingIndicator.style.display = 'none';
-                    if (combinedAudioElement && isPlaying) {
-                        syncAudioWithVideo();
-                    }
-                });
-                
-                video.addEventListener('suspend', function() {
-                    console.log('動画の読み込みが一時停止しました');
-                });
-                
-                video.addEventListener('stalled', function() {
-                    console.log('動画の読み込みが停滞しました');
-                    if (isPlaying) {
-                        pauseMedia();
-                    }
-                });
-function updatePipButton() {
-    if (document.pictureInPictureElement) {
-        pipBtn.textContent = '↸';
-        pipBtn.title = 'ピクチャーインピクチャーを終了';
-    } else {
-        pipBtn.textContent = '⇲';
-        pipBtn.title = 'ピクチャーインピクチャーで再生';
-    }
-}
-
-pipBtn.addEventListener('click', async () => {
-    try {
-        if (document.pictureInPictureElement) {
-            await document.exitPictureInPicture();
-        } else {
-            await video.requestPictureInPicture();
-        }
-        updatePipButton();
-    } catch (err) {
-        console.error('PiP操作エラー:', err);
-    }
-});
-   video.addEventListener('enterpictureinpicture', updatePipButton);
-video.addEventListener('leavepictureinpicture', updatePipButton);
-            
-          // リセットボタンクリック処理
-resetBtn.addEventListener('click', () => {
-    const startTime = parseFloat(startTimeInput.value) || 0;
-    seekMedia(startTime);
-    if (isPlaying) {
-        playMedia();
-    }
-});
-
-// 初期化時にPiPボタンの状態を設定
-updatePipButton();    
-          
-          
-          
-          function startSyncCheck() {
-              if (isCheckingSync) return;
-              isCheckingSync = true;
-              if (syncCheckInterval) clearInterval(syncCheckInterval);
-              syncCheckInterval = setInterval(checkSync, 1000);
-            }
-            
-            function stopSyncCheck() {
-              isCheckingSync = false;
-              if (syncCheckInterval) clearInterval(syncCheckInterval);
-            }
-            
-            function checkSync() {
-              if (!isAudioCombined || !isPlaying || isBuffering || isInBackgroundTab) return;
-              
-              const videoTime = video.currentTime;
-              const audioTime = combinedAudioElement.currentTime;
-              const drift = videoTime - audioTime;
-              
-              syncDriftLog.push(drift);
-              if (syncDriftLog.length > 5) syncDriftLog.shift();
-              
-              const avgDrift = syncDriftLog.reduce((a, b) => a + b, 0) / syncDriftLog.length;
-              syncStatusText.textContent = `同期ズレ: ${avgDrift.toFixed(3)}秒`;
-              
-              if (Math.abs(avgDrift) > 0.1) {
-                console.log(`同期ズレを修正: ${avgDrift.toFixed(3)}秒`);
-                syncAudioWithVideo();
-              }
-            }
-
-              applyTimeBtn.addEventListener('click', function() {
-    // 現在再生中なら一時停止
-    const wasPlaying = isPlaying;
-    if (isPlaying) {
-        pauseMedia();
-    }
-    
-    // 開始時間と終了時間を取得
-    const startTime = parseFloat(startTimeInput.value) || 0;
-    const endTime = parseFloat(endTimeInput.value) || video.duration;
-    
-    // 現在位置が開始時間より前なら開始時間に移動
-    if (video.currentTime < startTime) {
-        video.currentTime = startTime;
-        if (combinedAudioElement) {
-            combinedAudioElement.currentTime = startTime;
-        }
-    }
-    // 現在位置が終了時間より後なら開始時間に移動
-    else if (video.currentTime > endTime) {
-        video.currentTime = startTime;
-        if (combinedAudioElement) {
-            combinedAudioElement.currentTime = startTime;
-        }
-    }
-    
-    // 再生中だった場合は再開
-    if (wasPlaying) {
-        playMedia();
-    }
-    
-    // マーカーを更新
-    updateProgressMarkers();
-});
-
-                // 音声を動画に同期させる関数
-                function syncAudioWithVideo() {
-                    if (!isAudioCombined || !isPlaying) return;
-                    
-                    const currentTime = video.currentTime;
-                    
-                    if (combinedAudioElement) {
-                        combinedAudioElement.currentTime = currentTime;
-                        if (isPlaying) {
-                            combinedAudioElement.play().catch(e => console.error('音声再生エラー:', e));
-                        }
-                    }
-                    
-                    // ズレ記録をリセット
-                    syncDriftLog = [];
-                    lastSyncTime = performance.now();
-                }
-            
-                // 音声ファイルをロード
-                function loadAudioFiles() {
-                    audioFiles.forEach(file => {
-                        try {
-                            const audio = new Audio(`${basePath}${file}.mp3`);
-                            audio.preload = 'auto';
-                            audio.loop = false;
-                            audioElements[file] = audio;
-                            
-                            audio.addEventListener('loadedmetadata', function() {
-                                console.log(`${basePath}${file}.mp3 loaded`);
-                                checkLoadingComplete();
-                            });
-                            
-                            audio.addEventListener('error', function() {
-                                console.error(`音声ファイル読み込みエラー (${basePath}${file}.mp3):`, audio.error);
-                                checkLoadingComplete();
-                            });
-                        } catch (error) {
-                            console.error(`音声ファイル初期化エラー (${basePath}${file}.mp3):`, error);
-                            checkLoadingComplete();
-                        }
-                    });
-                }
-            
-                // 音声を結合する関数
-                async function combineAudio() {
-                    if (combinedAudioElement) {
-                        combinedAudioElement.pause();
-                        combinedAudioElement.src = '';
-                        URL.revokeObjectURL(combinedAudioElement.src);
-                    }
-                    combineButton.disabled = true;
-                    combineStatus.textContent = "音声を合成中...";
-            
-                    try {
-                        // 現在の音量設定を保存
-                        audioFiles.forEach(file => {
-                            currentVolumes[file] = parseFloat(document.querySelector(`.audio-slider[data-audio="${file}"]`).value);
-                        });
-            
-                        // 各音声ファイルをデコード
-                        const audioBufferPromises = audioFiles.map(async file => {
-                            const audio = audioElements[file];
-                            if (!audio) return null;
-            
-                            // 音量が0の場合はスキップ
-                            if (currentVolumes[file] === 0) return null;
-            
-                            const response = await fetch(`${basePath}${file}.mp3`);
-                            const arrayBuffer = await response.arrayBuffer();
-                            return await audioContext.decodeAudioData(arrayBuffer);
-                        });
-            
-                        // すべての音声バッファを取得
-                        const buffers = await Promise.all(audioBufferPromises);
-                        audioFiles.forEach((file, index) => {
-                            audioBuffers[file] = buffers[index];
-                        });
-            
-                        // 最長の音声バッファの長さを取得
-                        const maxDuration = Math.max(...buffers.filter(b => b).map(b => b.duration));
-            
-                        // 新しい音声バッファを作成
-                        const combinedAudioBuffer = audioContext.createBuffer(
-                            2, // ステレオ
-                            audioContext.sampleRate * maxDuration,
-                            audioContext.sampleRate
-                        );
-            
-                        // 各音声バッファを結合
-                        for (let file of audioFiles) {
-                            if (!audioBuffers[file] || currentVolumes[file] === 0) continue;
-            
-                            const buffer = audioBuffers[file];
-                            const volume = currentVolumes[file];
-            
-                            // 各チャンネルに音声を加算
-                            for (let channel = 0; channel < 2; channel++) {
-                                const inputData = buffer.getChannelData(channel % buffer.numberOfChannels);
-                                const outputData = combinedAudioBuffer.getChannelData(channel);
-            
-                                for (let i = 0; i < inputData.length; i++) {
-                                    outputData[i] += inputData[i] * volume;
-                                }
-                            }
-                        }
-            
-                        // 音量を正規化 (クリッピング防止)
-                        for (let channel = 0; channel < 2; channel++) {
-                            const outputData = combinedAudioBuffer.getChannelData(channel);
-                            let max = 0;
-                            
-                            for (let i = 0; i < outputData.length; i++) {
-                                if (Math.abs(outputData[i]) > max) {
-                                    max = Math.abs(outputData[i]);
-                                }
-                            }
-            
-                            if (max > 1) {
-                                for (let i = 0; i < outputData.length; i++) {
-                                    outputData[i] /= max;
-                                }
-                            }
-                        }
-            
-                        // AudioBufferをBlobに変換
-                        const blob = bufferToWave(combinedAudioBuffer);
-                        const url = URL.createObjectURL(blob);
-            
-                        // 新しいaudio要素を作成
-                        combinedAudioElement = new Audio(url);
-                        combinedAudioElement.preservesPitch = true;
-                        combinedAudioElement.mozPreservesPitch = true;
-                        combinedAudioElement.webkitPreservesPitch = true;
-                        combinedAudioElement.playbackRate = currentPlaybackRate;
-            
-                        isAudioCombined = true;
-                        combineStatus.textContent = "音声の合成が完了しました";
-                        enablePlayerControls();
-            
-                        combineButton.disabled = false;
-            
-document.addEventListener('visibilitychange', async () => {
-    if (document.hidden) {
-        isInBackgroundTab = true;
-        // 動画のみ停止
-        video.pause();
-        // 音声とメトロノームは継続
-        if (combinedAudioElement && !combinedAudioElement.paused) {
-            await combinedAudioElement.play();
-        }
-        if (tl.isActive()) {
-            tl.play();
-        }
-    } else {
-        isInBackgroundTab = false;
-        if (combinedAudioElement && !combinedAudioElement.paused) {
-            video.currentTime = combinedAudioElement.currentTime;
-            if (isPlaying) {
-                await video.play();
-            }
-        }
-    }
-});
-            
-            
-              // 動画終了時に自動的にPiPを閉じる（次回再開のため）
-              video.addEventListener('ended', exitPiP);
-                        // 合成後に音量と再生速度を適用
-                        applyVolume();
-                        applyPlaybackRate();
-            
-                    } catch (error) {
-                        console.error('音声合成エラー:', error);
-                        combineStatus.textContent = "音声の合成に失敗しました";
-                        combineButton.disabled = false;
-                    }
-                }
-            
-                function bufferToWave(abuffer) {
-                    const numOfChan = abuffer.numberOfChannels,
-                        length = abuffer.length * numOfChan * 2 + 44,
-                        buffer = new ArrayBuffer(length),
-                        view = new DataView(buffer),
-                        channels = [],
-                        sampleRate = abuffer.sampleRate;
-                        
-                    // posをletで宣言（constから変更）
-                    let pos = 0;
-            
-                    // write WAV header
-                    setUint32(0x46464952); // "RIFF"
-                    setUint32(length - 8); // file length - 8
-                    setUint32(0x45564157); // "WAVE"
-            
-                    setUint32(0x20746d66); // "fmt " chunk
-                    setUint32(16); // length = 16
-                    setUint16(1); // PCM (uncompressed)
-                    setUint16(numOfChan);
-                    setUint32(sampleRate);
-                    setUint32(sampleRate * 2 * numOfChan);
-                    setUint16(numOfChan * 2);
-                    setUint16(16);
-            
-                    setUint32(0x61746164); // "data" - chunk
-                    setUint32(length - pos - 4);
-            
-                    // write interleaved data
-                    for (let i = 0; i < abuffer.length; i++) {
-                        for (let channel = 0; channel < numOfChan; channel++) {
-                            let sample = abuffer.getChannelData(channel)[i] * 0x7fff;
-                            if (sample < -32768) sample = -32768;
-                            if (sample > 32767) sample = 32767;
-                            view.setInt16(pos, sample, true);
-                            pos += 2;
-                        }
-                    }
-            
-                    function setUint16(data) {
-                        view.setUint16(pos, data, true);
-                        pos += 2;
-                    }
-            
-                    function setUint32(data) {
-                        view.setUint32(pos, data, true);
-                        pos += 4;
-                    }
-            
-                    return new Blob([buffer], { type: 'audio/wav' });
-                }
-            
-                function applyVolume() {
-                    if (!isAudioCombined) return;
-                    
-                    // ベース音量 (0-1)
-                    const baseVolume = parseFloat(volumeSlider.value);
-                    // グローバル音量係数 (0-10)
-                    const globalVolume = parseFloat(globalVolumeSlider.value) / 10; // 0-1に変換
-                    
-                    // 最終音量 (0-1)
-                    const finalVolume = Math.max(0, Math.min(1, baseVolume * globalVolume));
-                    
-                    // 動画と音声の音量を設定
-                    video.volume = finalVolume;
-                    if (combinedAudioElement) {
-                        combinedAudioElement.volume = finalVolume;
-                    }
-                    
-                    // 音量アイコンを更新
-                    updateVolumeIcon();
-                }
-            
-                function applyPlaybackRate() {
-                    if (!isAudioCombined) return;
-                    
-                    const speed = parseFloat(playbackSpeedSlider.value);
-                    currentPlaybackRate = speed;
-                    video.playbackRate = speed;
-                    
-                    if (combinedAudioElement) {
-                        combinedAudioElement.playbackRate = speed;
-                    }
-                    
-                    speedValue.textContent = speed.toFixed(2) + 'x';
-                    playbackSpeedValue.textContent = speed.toFixed(2) + 'x';
-                    speedSlider.value = speed;
-                }
-                // プレイヤーコントロールを有効化
-                function enablePlayerControls() {
-                    disabledOverlay.style.display = 'none';
-                    playPauseBtn.disabled = false;
-                    volumeBtn.disabled = false;
-                    volumeSlider.disabled = false;
-                    speedSlider.disabled = false;
-                    fullscreenBtn.disabled = false;
-                    startTimeInput.disabled = false;
-                    endTimeInput.disabled = false;
-                    resetEndTimeBtn.disabled = false;
-                    loopCheckbox.disabled = false;
-                    globalVolumeSlider.disabled = false;
-                    setStartTimeBtn.disabled = false;
-                    setEndTimeBtn.disabled = false;
-                    playbackSpeedSlider.disabled = false;
-                    applyTimeBtn.disabled = false;
-                    resetBtn.disabled = false; // 追加
-                    pipBtn.disabled = false; // 追加
-                }
-            
-                // プレビュー再生
-                function togglePreview() {
-                    if (!isAudioCombined || !combinedAudioElement) return;
-            
-                    if (previewButton.textContent === '▶') {
-                        // 再生
-                        combinedAudioElement.currentTime = 0;
-                        combinedAudioElement.play()
-                            .then(() => {
-                                previewButton.textContent = '⏸';
-                                
-                                // プレビューの時間表示を更新
-                                const updatePreviewTime = () => {
-                                    if (!combinedAudioElement || !isAudioCombined) return;
-                                    
-                                    const currentTime = combinedAudioElement.currentTime;
-                                    const duration = combinedAudioElement.duration;
-                                    
-                                    if (currentTime >= duration) {
-                                        previewButton.textContent = '▶';
-                                        previewTime.textContent = `00:00 / ${formatTime(duration)}`;
-                                        return;
-                                    }
-                                    
-                                    previewTime.textContent = `${formatTime(currentTime)} / ${formatTime(duration)}`;
-                                    requestAnimationFrame(updatePreviewTime);
-                                };
-                                
-                                updatePreviewTime();
-                            })
-                            .catch(e => console.error('プレビュー再生エラー:', e));
-                    } else {
-                        // 一時停止
-                        combinedAudioElement.pause();
-                        previewButton.textContent = '▶';
-                    }
-                }
-            
-                // 時間をフォーマットするヘルパー関数
-                function formatTime(seconds) {
-                    const mins = Math.floor(seconds / 60);
-                    const secs = Math.floor(seconds % 60);
-                    return `${String(mins).padStart(2, '0')}:${String(secs).padStart(2, '0')}`;
-                }
-            
-                // 動画のメタデータが読み込まれたら
-                video.addEventListener('loadedmetadata', function() {
-                    try {
-                        videoDuration = video.duration;
-                        endTimeInput.value = videoDuration.toFixed(2);
-                        endTimeInput.max = videoDuration;
-                        startTimeInput.max = videoDuration - 0.1;
-                        updateTimeDisplay();
-                        checkLoadingComplete();
-                    } catch (error) {
-                        handleError(error, '動画メタデータ読み込み中にエラーが発生しました');
-                    }
-                });
-                
-                // 動画エラー処理
-                video.addEventListener('error', function() {
-                    handleError(video.error, '動画読み込み中にエラーが発生しました');
-                });
-                
-                // 再生ボタンクリック
-                playPauseBtn.addEventListener('click', function() {
-                    const endTime = parseFloat(endTimeInput.value) || videoDuration;
-                    if (video.currentTime >= endTime) {
-                        const startTime = parseFloat(startTimeInput.value) || 0;
-                        seekMedia(startTime);
-                    }
-                    togglePlayPause();
-                });
-                
-                // 時間表示を更新
-                function updateTimeDisplay() {
-                    const now = performance.now();
-                    if (now - lastUpdateTime < updateInterval && !isFullscreen) return;
-                    lastUpdateTime = now;
-                    
-                    try {
-                        const currentTime = video.currentTime;
-                        const duration = video.duration || videoDuration;
-                        
-                        const currentMinutes = Math.floor(currentTime / 60);
-                        const currentSeconds = Math.floor(currentTime % 60);
-                        const currentMilliseconds = Math.floor((currentTime % 1) * 100);
-                        const durationMinutes = Math.floor(duration / 60);
-                        const durationSeconds = Math.floor(duration % 60);
-                        const durationMilliseconds = Math.floor((duration % 1) * 100);
-                        
-                        timeDisplay.textContent = 
-                            `${String(currentMinutes).padStart(2, '0')}:${String(currentSeconds).padStart(2, '0')}.${String(currentMilliseconds).padStart(2, '0')} / ` +
-                            `${String(durationMinutes).padStart(2, '0')}:${String(durationSeconds).padStart(2, '0')}.${String(durationMilliseconds).padStart(2, '0')}`;
-                        
-                        const progressPercent = (currentTime / duration) * 100;
-                        progressBar.style.width = `${progressPercent}%`;
-                    } catch (error) {
-                        console.error('時間表示更新エラー:', error);
-                    }
-                }
-                
-                // 再生/一時停止をトグル
-                function togglePlayPause() {
-                    if (isPlaying) {
-                        pauseMedia();
-                    } else {
-                        playMedia();
-                    }
-                }
-                
-            function playMedia() {
-                try {
-                    const duration = video.duration || videoDuration;
-                    const startTime = parseFloat(startTimeInput.value) || 0;
-                    const endTime = parseFloat(endTimeInput.value) || duration;
-                    
-                    if (video.currentTime >= endTime) {
-                        video.currentTime = startTime;
-                    }
-                    
-                    const playPromise = video.play();
-                    
-                    if (playPromise !== undefined) {
-                        playPromise.then(() => {
-                            isPlaying = true;
-                            playPauseBtn.textContent = '⏸';
-                            
-                            // 音声を同期して再生
-                            if (isAudioCombined) {
-                                combinedAudioElement.currentTime = video.currentTime;
-                                combinedAudioElement.play().catch(e => console.error('音声再生エラー:', e));
-                            }
-                            
-                            startSyncCheck();
-                            
-                            video.playbackRate = currentPlaybackRate;
-                        }).catch(error => {
-                            console.error('動画再生エラー:', error);
-                            isPlaying = false;
-                            playPauseBtn.textContent = '▶';
-                        });
-                    }
-                } catch (error) {
-                    console.error('メディア再生エラー:', error);
-                    isPlaying = false;
-                    playPauseBtn.textContent = '▶';
-                }
-            }
-            
-            function pauseMedia() {
-                try {
-                    video.pause();
-                    isPlaying = false;
-                    playPauseBtn.textContent = '▶';
-                    stopSyncCheck();
-                    
-                    if (combinedAudioElement) {
-                        combinedAudioElement.pause();
-                    }
-                } catch (error) {
-                    console.error('メディア一時停止エラー:', error);
-                }
-            }
-                
-                // 時間更新時の処理
-video.addEventListener('timeupdate', function() {   
-    updateTimeDisplay();
-});
-                
-                // プログレスバークリックでシーク
-                progressContainer.addEventListener('click', function(e) {
-                    if (!video.duration) return;
-                    
-                    const rect = this.getBoundingClientRect();
-                    const pos = (e.clientX - rect.left) / rect.width;
-                    const seekTime = pos * video.duration;
-                    
-                    seekMedia(seekTime);
-                });
-                
-                // 指定した時間にシーク (改良版)
-                function seekMedia(time) {
-                    try {
-                        const duration = video.duration || videoDuration;
-                        const startTime = parseFloat(startTimeInput.value) || 0;
-                        const endTime = parseFloat(endTimeInput.value) || duration;
-                        
-                        const seekTime = Math.max(startTime, Math.min(time, endTime));
-                        video.currentTime = seekTime;
-                        
-                        if (combinedAudioElement) {
-                            combinedAudioElement.currentTime = seekTime;
-                            if (isPlaying) {
-                                combinedAudioElement.play().catch(e => console.error('音声再生エラー:', e));
-                            }
-                        }
-                    } catch (error) {
-                        console.error('メディアシークエラー:', error);
-                    }
-                }
-                
-                // プログレスバー上でマウス移動時に時間を表示
-                progressContainer.addEventListener('mousemove', function(e) {
-                    if (!video.duration) return;
-                    
-                    const rect = this.getBoundingClientRect();
-                    const pos = (e.clientX - rect.left) / rect.width;
-                    const hoverTime = pos * video.duration;
-                    
-                    const minutes = Math.floor(hoverTime / 60);
-                    const seconds = Math.floor(hoverTime % 60);
-                    const milliseconds = Math.floor((hoverTime % 1) * 100);
-                    
-                    progressTime.textContent = `${String(minutes).padStart(2, '0')}:${String(seconds).padStart(2, '0')}.${String(milliseconds).padStart(2, '0')}`;
-                    progressTime.style.display = 'block';
-                    progressTime.style.left = `${pos * 100}%`;
-                });
-                
-                progressContainer.addEventListener('mouseleave', function() {
-                    progressTime.style.display = 'none';
-                });
-                
-                // 動画クリックで再生/一時停止
-                video.addEventListener('click', function() {
-                    togglePlayPause();
-                });
-            
-                volumeSlider.addEventListener('input', function() {
-                    if (!isAudioCombined) return;
-                    
-                    lastVolume = parseFloat(this.value);
-                    applyVolume();
-                });
-                
-                volumeBtn.addEventListener('click', function() {
-                    if (!isAudioCombined) return;
-                    
-                    if (video.volume > 0) {
-                        lastVolume = parseFloat(volumeSlider.value);
-                        volumeSlider.value = 0;
-                    } else {
-                        volumeSlider.value = lastVolume;
-                    }
-                    
-                    applyVolume();
-                });
-                
-                // 音量アイコンを更新
-                function updateVolumeIcon() {
-                    if (video.volume === 0) {
-                        volumeBtn.textContent = '🔇';
-                    } else if (video.volume < 3) {
-                        volumeBtn.textContent = '🔈';
-                    } else {
-                        volumeBtn.textContent = '🔊';
-                    }
-                }
-                
-                // 再生速度スライダー (動画プレイヤー)
-                speedSlider.addEventListener('input', function() {
-                    if (!isAudioCombined) return;
-                    
-                    const speed = parseFloat(this.value);
-                    speedValue.textContent = speed.toFixed(2) + 'x';
-                    playbackSpeedSlider.value = speed;
-                    playbackSpeedValue.textContent = speed.toFixed(2) + 'x';
-                    updatePlaybackRate(speed);
-                });
-                
-                // 再生速度スライダー (設定メニュー)
-                playbackSpeedSlider.addEventListener('input', function() {
-                    if (!isAudioCombined) return;
-                    
-                    const speed = parseFloat(this.value);
-                    playbackSpeedValue.textContent = speed.toFixed(2) + 'x';
-                    speedSlider.value = speed;
-                    speedValue.textContent = speed.toFixed(2) + 'x';
-                    updatePlaybackRate(speed);
-                });
-                
-                // テンポ入力による再生速度更新
-                tempoInput.addEventListener('input', function() {
-                    const tempo = parseFloat(this.value);
-                    const baseTempo = isTMode ? 66 : 92;
-                    const speed = tempo / baseTempo;
-                    
-                    const clampedSpeed = Math.max(0.001, Math.min(5.0, speed));
-                    
-                    playbackSpeedSlider.value = clampedSpeed;
-                    playbackSpeedValue.textContent = clampedSpeed.toFixed(2) + 'x';
-                    speedSlider.value = clampedSpeed;
-                    speedValue.textContent = clampedSpeed.toFixed(2) + 'x';
-                    tempoSpeedValue.textContent = clampedSpeed.toFixed(2) + 'x';
-                    
-                    updatePlaybackRate(clampedSpeed);
-                });
-                
-                function updatePlaybackRate(speed) {
-                    if (!isAudioCombined) return;
-                    
-                    currentPlaybackRate = speed;
-                    video.playbackRate = speed;
-                    
-                    // ピッチ保持を再設定
-                    video.preservesPitch = true;
-                    video.mozPreservesPitch = true;
-                    video.webkitPreservesPitch = true;
-                    
-                    if (combinedAudioElement) {
-                        combinedAudioElement.playbackRate = speed;
-                        
-                        // 合成音声のピッチ保持を設定
-                        combinedAudioElement.preservesPitch = true;
-                        combinedAudioElement.mozPreservesPitch = true;
-                        combinedAudioElement.webkitPreservesPitch = true;
-                    }
-                }
-                
-                // 全画面ボタン
-                fullscreenBtn.addEventListener('click', function() {
-                    if (!isFullscreen) {
-                        if (videoContainer.requestFullscreen) {
-                            videoContainer.requestFullscreen();
-                        } else if (videoContainer.webkitRequestFullscreen) {
-                            videoContainer.webkitRequestFullscreen();
-                        } else if (videoContainer.msRequestFullscreen) {
-                            videoContainer.msRequestFullscreen();
-                        }
-                    } else {
-                        if (document.exitFullscreen) {
-                            document.exitFullscreen();
-                        } else if (document.webkitExitFullscreen) {
-                            document.webkitExitFullscreen();
-                        } else if (document.msExitFullscreen) {
-                            document.msExitFullscreen();
-                        }
-                    }
-                });
-                
-                // 全画面変更イベント
-                document.addEventListener('fullscreenchange', handleFullscreenChange);
-                document.addEventListener('webkitfullscreenchange', handleFullscreenChange);
-                document.addEventListener('msfullscreenchange', handleFullscreenChange);
-                
-                function handleFullscreenChange() {
-                    isFullscreen = !!(document.fullscreenElement || document.webkitFullscreenElement || document.msFullscreenElement);
-                    fullscreenBtn.textContent = isFullscreen ? '⛶' : '⛶';
-                    video.controls = false;
-                    
-                    // 全画面時にロックボタンを表示
-                    lockControlsBtn.style.display = isFullscreen ? 'flex' : 'none';
-                    
-                    // 全画面時にコントロールバー自動非表示機能を有効化
-                    if (isFullscreen) {
-                        resetControlsHideTimer();
-                        document.addEventListener('mousemove', handleFullscreenMouseMove);
-                    } else {
-                        document.removeEventListener('mousemove', handleFullscreenMouseMove);
-                        clearTimeout(controlsHideTimeout);
-                        showControls();
-                    }
-                }
-                
-                // 全画面時のマウス移動処理
-                function handleFullscreenMouseMove() {
-                    if (!isControlsLocked) {
-                        showControls();
-                        resetControlsHideTimer();
-                    }
-                }
-                
-                // コントロールバーを表示
-                function showControls() {
-                    if (!controlsVisible) {
-                        videoControls.style.opacity = '1';
-                        controlsVisible = true;
-                    }
-                }
-                
-                // コントロールバーを非表示
-                function hideControls() {
-                    if (!isControlsLocked && controlsVisible) {
-                        videoControls.style.opacity = '0';
-                        controlsVisible = false;
-                    }
-                }
-                
-                // コントロールバー非表示タイマーをリセット
-                function resetControlsHideTimer() {
-                    clearTimeout(controlsHideTimeout);
-                    if (!isControlsLocked) {
-                        controlsHideTimeout = setTimeout(hideControls, 1500); // 1.5秒後に非表示
-                    }
-                }
-                
-                // ロックボタンのクリック処理
-                lockControlsBtn.addEventListener('click', function() {
-                    isControlsLocked = !isControlsLocked;
-                    this.classList.toggle('locked', isControlsLocked);
-                    
-                    if (isControlsLocked) {
-                        showControls();
-                        clearTimeout(controlsHideTimeout);
-                    } else {
-                        resetControlsHideTimer();
-                    }
-                });
-                
-                // キーボードイベント (ESCで全画面終了)
-                document.addEventListener('keydown', function(e) {
-                    if (e.key === 'Escape' && isFullscreen) {
-                        if (document.exitFullscreen) {
-                            document.exitFullscreen();
-                        } else if (document.webkitExitFullscreen) {
-                            document.webkitExitFullscreen();
-                        } else if (document.msExitFullscreen) {
-                            document.msExitFullscreen();
-                        }
-                    }
-                });
-                
-                // ボリュームスライダーのイベント
-                audioSliders.forEach((slider, index) => {
-                    slider.addEventListener('input', function() {
-                        const value = parseFloat(this.value);
-                        volumeValues[index].textContent = value.toFixed(2);
-                        
-                        const percent = value * 100;
-                        this.style.backgroundSize = `${percent}% 100%`;
-                    });
-                });
-                
-                globalVolumeSlider.addEventListener('input', function() {
-                    const value = parseFloat(this.value);
-                    globalVolumeValue.textContent = value.toFixed(1);
-                    
-                    const percent = (value - this.min) / (this.max - this.min) * 100;
-                    this.style.backgroundSize = `${percent}% 100%`;
-                    
-                    applyVolume();
-                });
-                
-                // ループ設定変更時
-                loopCheckbox.addEventListener('change', function() {
-                    // 合成音声ではループは動画に依存する
-                });
-                
-                // 現在の秒数を開始時間に設定
-                setStartTimeBtn.addEventListener('click', function() {
-                    startTimeInput.value = video.currentTime.toFixed(2);
-                    updateProgressMarkers();
-                });
-                
-                // 現在の秒数を終了時間に設定
-                setEndTimeBtn.addEventListener('click', function() {
-                    endTimeInput.value = video.currentTime.toFixed(2);
-                    updateProgressMarkers();
-                });
-                
-                // 終了時間を動画の長さにリセット
-                resetEndTimeBtn.addEventListener('click', function() {
-                    endTimeInput.value = video.duration.toFixed(2);
-                    updateProgressMarkers();
-                });
-                
-                // プログレスバーのマーカーを更新
-                function updateProgressMarkers() {
-                    const duration = video.duration || 0;
-                    const startTime = parseFloat(startTimeInput.value) || 0;
-                    const endTime = parseFloat(endTimeInput.value) || duration;
-              
-                    if (duration > 0) {
-                        if (startTime > 0) {
-                            startMarker.style.left = `${(startTime / duration) * 100}%`;
-                            startMarker.style.display = 'block';
-                        } else {
-                            startMarker.style.display = 'none';
-                        }
-              
-                        if (endTime < duration) {
-                            endMarker.style.left = `${(endTime / duration) * 100}%`;
-                            endMarker.style.display = 'block';
-                        } else {
-                            endMarker.style.display = 'none';
-                        }
-                    }
-                }
-                
-                // 開始/終了時間変更時にマーカーを更新
-                startTimeInput.addEventListener('input', updateProgressMarkers);
-                endTimeInput.addEventListener('input', updateProgressMarkers);
-                
-                // 合成ボタンクリック
-                combineButton.addEventListener('click', combineAudio);
-                
-                // プレビューボタンクリック
-                previewButton.addEventListener('click', togglePreview);
-                
-                // 同期ステータスを閉じる
-                syncStatusClose.addEventListener('click', function() {
-                    syncStatus.style.display = 'none';
-                });
-                
-                // 初期化
-                loadAudioFiles();
-                updateVolumeIcon();
-                volumeSlider.value = video.volume;
-                video.controls = false;
-                
-                // スライダーの背景を初期化
-                function initSliderBackgrounds() {
-                    const sliders = [
-                        volumeSlider, 
-                        speedSlider, 
-                        globalVolumeSlider, 
-                        playbackSpeedSlider, 
-                        ...audioSliders
-                    ];
-                    
-                    sliders.forEach(slider => {
-                        if (slider) {
-                            slider.style.backgroundImage = 'linear-gradient(#64ffda, #64ffda)';
-                            slider.style.backgroundRepeat = 'no-repeat';
-                            
-                            if (slider === globalVolumeSlider) {
-                                const percent = (slider.value - slider.min) / (slider.max - slider.min) * 100;
-                                slider.style.backgroundSize = `${percent}% 100%`;
-                                globalVolumeValue.textContent = slider.value;
-                            } else {
-                                slider.style.backgroundSize = `${slider.value * 100}% 100%`;
-                            }
-                        }
-                    });
-                }
-                
-                initSliderBackgrounds();
-                startSyncCheck(); // 同期チェックを開始
-                
-                // 初期テンポ設定
-                tempoInput.value = isTMode ? 66 : 92;
-                tempoInput.dispatchEvent(new Event('input'));
+            	// 同期管理用の変数
+            	let lastSyncTime = 0;
+            	let isBuffering = false;
+            	let syncDriftLog = [];
+            	let syncCheckInterval;
+            	let audioContext;
+            	let controlsHideTimeout;
+            	let isControlsLocked = false;
+            	let controlsVisible = true;
+            	let isCheckingSync = false;
+            	let isInBackgroundTab = false;
+
+            	try {
+            		audioContext = new(window.AudioContext || window.webkitAudioContext)
+            			();
+            	} catch (e) {
+            		console.error('Web Audio APIがサポートされていません:', e);
+            	}
+
+            	// テクノロジー風背景を生成
+            	function createTechBackground() {
+            		const bg = document.getElementById('techBg');
+
+            		for (let i = 0; i < 200; i++) {
+            			const line = document.createElement('div');
+            			line.className = 'circuit-line';
+
+            			const isHorizontal = Math.random() > 0.5;
+            			if (isHorizontal) {
+            				line.style.width = `${Math.random() * 300 + 100}px`;
+            				line.style.height = '1px';
+            			} else {
+            				line.style.width = '1px';
+            				line.style.height = `${Math.random() * 300 + 100}px`;
+            			}
+
+            			line.style.left = `${Math.random() * 100}%`;
+            			line.style.top = `${Math.random() * 100}%`;
+            			line.style.opacity = Math.random() * 0.5 + 0.1;
+            			bg.appendChild(line);
+            		}
+
+            		for (let i = 0; i < 200; i++) {
+            			const dot = document.createElement('div');
+            			dot.className = 'grid-dot';
+            			dot.style.left = `${Math.random() * 100}%`;
+            			dot.style.top = `${Math.random() * 100}%`;
+            			bg.appendChild(dot);
+            		}
+
+            		for (let i = 0; i < 15; i++) {
+            			const hex = document.createElement('div');
+            			hex.className = 'hexagon';
+            			hex.style.left = `${Math.random() * 100}%`;
+            			hex.style.top = `${Math.random() * 100}%`;
+            			hex.style.transform = `rotate(${Math.random() * 360}deg)`;
+            			hex.style.animation =
+            				`float ${Math.random() * 10 + 5}s infinite ease-in-out`;
+            			bg.appendChild(hex);
+            		}
+
+            		for (let i = 0; i < 8; i++) {
+            			const pulse = document.createElement('div');
+            			pulse.className = 'pulse';
+            			pulse.style.left = `${Math.random() * 100}%`;
+            			pulse.style.top = `${Math.random() * 100}%`;
+            			pulse.style.animationDelay = `${Math.random() * 2}s`;
+            			bg.appendChild(pulse);
+            		}
+            	}
+
+            	createTechBackground();
+
+            	const urlParams = new URLSearchParams(window.location.search);
+            	const isTMode = urlParams.has('mode') && urlParams.get('mode') ===
+            		't';
+            	const basePath = isTMode ? '/t/' : '/';
+
+            	// ローディング状態を管理
+            	let loadingCount = 0;
+            	let totalToLoad = 6; // 動画 + 5つの音声ファイル
+            	let lastUpdateTime = 0;
+            	const updateInterval = 1;
+
+            	function checkLoadingComplete() {
+            		loadingCount++;
+            		if (loadingCount >= totalToLoad) {
+            			setTimeout(function() {
+            				const loadingOverlay = document.getElementById(
+            					'loadingOverlay');
+            				loadingOverlay.style.opacity = '0';
+            				setTimeout(function() {
+            					loadingOverlay.style.display = 'none';
+            				}, 1000);
+            			}, 500);
+            		}
+            	}
+
+            	function handleError(error, message) {
+            		console.error(message, error);
+            		window.alert(`${message}\n\nエラー詳細: ${error.message}`);
+            	}
+
+            	// 要素を取得
+            	const video = document.getElementById('video');
+            	video.preservesPitch = true;
+            	video.mozPreservesPitch = true; // Firefox用
+            	video.webkitPreservesPitch = true; // 古いWebKit用
+            	const videoContainer = document.getElementById('video-container');
+            	const playPauseBtn = document.getElementById('play-pause-btn');
+            	const timeDisplay = document.getElementById('time-display');
+            	const progressContainer = document.getElementById(
+            		'progress-container');
+            	const progressBar = document.getElementById('progress-bar');
+            	const progressTime = document.getElementById('progress-time');
+            	const volumeBtn = document.getElementById('volume-btn');
+            	const volumeSlider = document.getElementById('volume-slider');
+            	const speedSlider = document.getElementById('speed-slider');
+            	const speedValue = document.getElementById('speed-value');
+            	const playbackSpeedSlider = document.getElementById(
+            		'playback-speed');
+            	const playbackSpeedValue = document.getElementById(
+            		'playback-speed-value');
+            	const fullscreenBtn = document.getElementById('fullscreen-btn');
+            	const startTimeInput = document.getElementById('start-time');
+            	const endTimeInput = document.getElementById('end-time');
+            	const loopCheckbox = document.getElementById('loop');
+            	const globalVolumeSlider = document.getElementById(
+            		'global-volume');
+            	const globalVolumeValue = document.getElementById(
+            		'global-volume-value');
+            	const audioSliders = document.querySelectorAll('.audio-slider');
+            	const volumeValues = document.querySelectorAll('.volume-value');
+            	const setStartTimeBtn = document.getElementById('set-start-time');
+            	const setEndTimeBtn = document.getElementById('set-end-time');
+            	const resetEndTimeBtn = document.getElementById('reset-end-time');
+            	const disabledOverlay = document.getElementById(
+            		'disabledOverlay');
+            	const combineButton = document.getElementById('combine-button');
+            	const combineStatus = document.getElementById('combine-status');
+            	const previewSection = document.getElementById('preview-section');
+            	const previewButton = document.getElementById('preview-button');
+            	const previewTime = document.getElementById('preview-time');
+            	const bufferingIndicator = document.getElementById(
+            		'buffering-indicator');
+            	const syncStatus = document.getElementById('sync-status');
+            	const syncStatusText = document.getElementById(
+            		'sync-status-text');
+            	const syncStatusClose = document.getElementById(
+            		'sync-status-close');
+            	const lockControlsBtn = document.getElementById(
+            		'lock-controls-btn');
+            	const startMarker = document.getElementById('start-marker');
+            	const endMarker = document.getElementById('end-marker');
+            	const tempoInput = document.getElementById('tempo');
+            	const tempoSpeedValue = document.getElementById(
+            		'tempo-speed-value');
+            	const videoControls = document.querySelector('.video-controls');
+            	const applyTimeBtn = document.getElementById('apply-time-btn');
+            	const pipBtn = document.getElementById('pip-btn');
+            	const resetBtn = document.getElementById('reset-btn');
+
+            	// 音声オブジェクトを作成
+            	const audioElements = {};
+            	const audioBuffers = {};
+            	const audioFiles = ['p', 'a', 't', 's', 'k'];
+            	let combinedAudioElement = null;
+            	let isAudioCombined = false;
+            	let currentVolumes = {
+            		p: 0,
+            		a: 1,
+            		t: 1,
+            		s: 1,
+            		k: 0
+            	};
+
+            	// 初期化
+            	let videoDuration = 0;
+            	let isPlaying = false;
+            	let lastVolume = 1;
+            	let currentPlaybackRate = 1;
+            	let isFullscreen = false;
+
+            	async function enterPiP() {
+            		if (!document.pictureInPictureElement && !video.paused) {
+            			try {
+            				await video.requestPictureInPicture();
+            			} catch (err) {
+            				console.warn('PiP開始失敗:', err);
+            			}
+            		}
+            	}
+
+            	async function exitPiP() {
+            		if (document.pictureInPictureElement) {
+            			try {
+            				await document.exitPictureInPicture();
+            			} catch (err) {
+            				console.warn('PiP終了失敗:', err);
+            			}
+            		}
+            	}
+            	const hideVideoCheckbox = document.getElementById('hide-video');
+            	hideVideoCheckbox.addEventListener('change', function() {
+            		video.style.backgroundColor = this.checked ? 'black' : '';
+            		video.style.opacity = this.checked ? '0' : '1';
+            	});
+
+            	// 動画のバッファリング状態を監視
+            	video.addEventListener('waiting', function() {
+            		isBuffering = true;
+            		bufferingIndicator.style.display = 'block';
+            		if (combinedAudioElement) {
+            			combinedAudioElement.pause();
+            		}
+            	});
+
+            	video.addEventListener('playing', function() {
+            		isBuffering = false;
+            		bufferingIndicator.style.display = 'none';
+            		if (combinedAudioElement && isPlaying) {
+            			syncAudioWithVideo();
+            		}
+            	});
+
+            	video.addEventListener('suspend', function() {
+            		console.log('動画の読み込みが一時停止しました');
+            	});
+
+            	video.addEventListener('stalled', function() {
+            		console.log('動画の読み込みが停滞しました');
+            		if (isPlaying) {
+            			pauseMedia();
+            		}
+            	});
+
+            	function updatePipButton() {
+            		if (document.pictureInPictureElement) {
+            			pipBtn.textContent = '↸';
+            			pipBtn.title = 'ピクチャーインピクチャーを終了';
+            		} else {
+            			pipBtn.textContent = '⇲';
+            			pipBtn.title = 'ピクチャーインピクチャーで再生';
+            		}
+            	}
+
+            	pipBtn.addEventListener('click', async() => {
+            		try {
+            			if (document.pictureInPictureElement) {
+            				await document.exitPictureInPicture();
+            			} else {
+            				await video.requestPictureInPicture();
+            			}
+            			updatePipButton();
+            		} catch (err) {
+            			console.error('PiP操作エラー:', err);
+            		}
+            	});
+            	video.addEventListener('enterpictureinpicture', updatePipButton);
+            	video.addEventListener('leavepictureinpicture', async() => {
+            		updatePipButton();
+            		if (isPlaying && !document.hidden) {
+            			try {
+            				await video.play();
+            			} catch (err) {
+            				console.error('PiP終了後の再生エラー:', err);
+            			}
+            		}
+            	});
+
+            	// リセットボタンクリック処理
+            	resetBtn.addEventListener('click', () => {
+            		const startTime = parseFloat(startTimeInput.value) || 0;
+            		seekMedia(startTime);
+            		if (isPlaying) {
+            			playMedia();
+            		}
+            	});
+
+            	// 初期化時にPiPボタンの状態を設定
+            	updatePipButton();
+
+
+            	function startSyncCheck() {
+            		if (isCheckingSync) return;
+            		isCheckingSync = true;
+            		if (syncCheckInterval) clearInterval(syncCheckInterval);
+            		syncCheckInterval = setInterval(checkSync, 1000);
+            	}
+
+            	function stopSyncCheck() {
+            		isCheckingSync = false;
+            		if (syncCheckInterval) clearInterval(syncCheckInterval);
+            	}
+
+            	function checkSync() {
+            		if (!isAudioCombined || !isPlaying || isBuffering ||
+            			isInBackgroundTab) return;
+
+            		const videoTime = video.currentTime;
+            		const audioTime = combinedAudioElement.currentTime;
+            		const drift = videoTime - audioTime;
+
+            		syncDriftLog.push(drift);
+            		if (syncDriftLog.length > 5) syncDriftLog.shift();
+
+            		const avgDrift = syncDriftLog.reduce((a, b) => a + b, 0) /
+            			syncDriftLog.length;
+            		syncStatusText.textContent = `同期ズレ: ${avgDrift.toFixed(3)}秒`;
+
+            		if (Math.abs(avgDrift) > 0.1) {
+            			console.log(`同期ズレを修正: ${avgDrift.toFixed(3)}秒`);
+            			syncAudioWithVideo();
+            		}
+            	}
+
+            	applyTimeBtn.addEventListener('click', function() {
+            		// 現在再生中なら一時停止
+            		const wasPlaying = isPlaying;
+            		if (isPlaying) {
+            			pauseMedia();
+            		}
+
+            		// 開始時間と終了時間を取得
+            		const startTime = parseFloat(startTimeInput.value) || 0;
+            		const endTime = parseFloat(endTimeInput.value) || video.duration;
+
+            		// 現在位置が開始時間より前なら開始時間に移動
+            		if (video.currentTime < startTime) {
+            			video.currentTime = startTime;
+            			if (combinedAudioElement) {
+            				combinedAudioElement.currentTime = startTime;
+            			}
+            		}
+            		// 現在位置が終了時間より後なら開始時間に移動
+            		else if (video.currentTime > endTime) {
+            			video.currentTime = startTime;
+            			if (combinedAudioElement) {
+            				combinedAudioElement.currentTime = startTime;
+            			}
+            		}
+
+            		// 再生中だった場合は再開
+            		if (wasPlaying) {
+            			playMedia();
+            		}
+
+            		// マーカーを更新
+            		updateProgressMarkers();
+            	});
+
+            	// 音声を動画に同期させる関数
+            	function syncAudioWithVideo() {
+            		if (!isAudioCombined || !isPlaying) return;
+
+            		const currentTime = video.currentTime;
+
+            		if (combinedAudioElement) {
+            			combinedAudioElement.currentTime = currentTime;
+            			if (isPlaying) {
+            				combinedAudioElement.play().catch(e => console.error(
+            					'音声再生エラー:', e));
+            			}
+            		}
+
+            		// ズレ記録をリセット
+            		syncDriftLog = [];
+            		lastSyncTime = performance.now();
+            	}
+
+            	// 音声ファイルをロード
+            	function loadAudioFiles() {
+            		audioFiles.forEach(file => {
+            			try {
+            				const audio = new Audio(`${basePath}${file}.mp3`);
+            				audio.preload = 'auto';
+            				audio.loop = false;
+            				audioElements[file] = audio;
+
+            				audio.addEventListener('loadedmetadata', function() {
+            					console.log(`${basePath}${file}.mp3 loaded`);
+            					checkLoadingComplete();
+            				});
+
+            				audio.addEventListener('error', function() {
+            					console.error(`音声ファイル読み込みエラー (${basePath}${file}.mp3):`,
+            						audio.error);
+            					checkLoadingComplete();
+            				});
+            			} catch (error) {
+            				console.error(`音声ファイル初期化エラー (${basePath}${file}.mp3):`,
+            					error);
+            				checkLoadingComplete();
+            			}
+            		});
+            	}
+
+            	// 音声を結合する関数
+            	async function combineAudio() {
+            		if (combinedAudioElement) {
+            			combinedAudioElement.pause();
+            			combinedAudioElement.src = '';
+            			URL.revokeObjectURL(combinedAudioElement.src);
+            		}
+            		combineButton.disabled = true;
+            		combineStatus.textContent = "音声を合成中...";
+
+            		try {
+            			// 現在の音量設定を保存
+            			audioFiles.forEach(file => {
+            				currentVolumes[file] = parseFloat(document.querySelector(
+            					`.audio-slider[data-audio="${file}"]`).value);
+            			});
+
+            			// 各音声ファイルをデコード
+            			const audioBufferPromises = audioFiles.map(async file => {
+            				const audio = audioElements[file];
+            				if (!audio) return null;
+
+            				// 音量が0の場合はスキップ
+            				if (currentVolumes[file] === 0) return null;
+
+            				const response = await fetch(`${basePath}${file}.mp3`);
+            				const arrayBuffer = await response.arrayBuffer();
+            				return await audioContext.decodeAudioData(arrayBuffer);
+            			});
+
+            			// すべての音声バッファを取得
+            			const buffers = await Promise.all(audioBufferPromises);
+            			audioFiles.forEach((file, index) => {
+            				audioBuffers[file] = buffers[index];
+            			});
+
+            			// 最長の音声バッファの長さを取得
+            			const maxDuration = Math.max(...buffers.filter(b => b).map(b =>
+            				b.duration));
+
+            			// 新しい音声バッファを作成
+            			const combinedAudioBuffer = audioContext.createBuffer(
+            				2, // ステレオ
+            				audioContext.sampleRate * maxDuration,
+            				audioContext.sampleRate
+            			);
+
+            			// 各音声バッファを結合
+            			for (let file of audioFiles) {
+            				if (!audioBuffers[file] || currentVolumes[file] === 0)
+            					continue;
+
+            				const buffer = audioBuffers[file];
+            				const volume = currentVolumes[file];
+
+            				// 各チャンネルに音声を加算
+            				for (let channel = 0; channel < 2; channel++) {
+            					const inputData = buffer.getChannelData(channel % buffer.numberOfChannels);
+            					const outputData = combinedAudioBuffer.getChannelData(
+            						channel);
+
+            					for (let i = 0; i < inputData.length; i++) {
+            						outputData[i] += inputData[i] * volume;
+            					}
+            				}
+            			}
+
+            			// 音量を正規化 (クリッピング防止)
+            			for (let channel = 0; channel < 2; channel++) {
+            				const outputData = combinedAudioBuffer.getChannelData(channel);
+            				let max = 0;
+
+            				for (let i = 0; i < outputData.length; i++) {
+            					if (Math.abs(outputData[i]) > max) {
+            						max = Math.abs(outputData[i]);
+            					}
+            				}
+
+            				if (max > 1) {
+            					for (let i = 0; i < outputData.length; i++) {
+            						outputData[i] /= max;
+            					}
+            				}
+            			}
+
+            			// AudioBufferをBlobに変換
+            			const blob = bufferToWave(combinedAudioBuffer);
+            			const url = URL.createObjectURL(blob);
+
+            			// 新しいaudio要素を作成
+            			combinedAudioElement = new Audio(url);
+            			combinedAudioElement.preservesPitch = true;
+            			combinedAudioElement.mozPreservesPitch = true;
+            			combinedAudioElement.webkitPreservesPitch = true;
+            			combinedAudioElement.playbackRate = currentPlaybackRate;
+
+            			isAudioCombined = true;
+            			combineStatus.textContent = "音声の合成が完了しました";
+            			enablePlayerControls();
+
+            			combineButton.disabled = false;
+
+            			document.addEventListener('visibilitychange', async() => {
+            				if (document.hidden) {
+            					isInBackgroundTab = true;
+            					// 動画のみ停止
+            					if (!document.pictureInPictureElement) {
+            						video.pause();
+            					}
+            					// 音声とメトロノームは継続
+            					if (combinedAudioElement && !combinedAudioElement.paused) {
+            						await combinedAudioElement.play();
+            					}
+            					if (tl.isActive()) {
+            						tl.play();
+            					}
+            				} else {
+            					isInBackgroundTab = false;
+            					if (combinedAudioElement && !combinedAudioElement.paused) {
+            						video.currentTime = combinedAudioElement.currentTime;
+            						if (isPlaying) {
+            							await video.play();
+            						}
+            					}
+            				}
+            			});
+
+
+            			// 動画終了時に自動的にPiPを閉じる（次回再開のため）
+            			video.addEventListener('ended', exitPiP);
+            			// 合成後に音量と再生速度を適用
+            			applyVolume();
+            			applyPlaybackRate();
+
+            		} catch (error) {
+            			console.error('音声合成エラー:', error);
+            			combineStatus.textContent = "音声の合成に失敗しました";
+            			combineButton.disabled = false;
+            		}
+            	}
+
+            	function bufferToWave(abuffer) {
+            		const numOfChan = abuffer.numberOfChannels,
+            			length = abuffer.length * numOfChan * 2 + 44,
+            			buffer = new ArrayBuffer(length),
+            			view = new DataView(buffer),
+            			channels = [],
+            			sampleRate = abuffer.sampleRate;
+
+            		// posをletで宣言（constから変更）
+            		let pos = 0;
+
+            		// write WAV header
+            		setUint32(0x46464952); // "RIFF"
+            		setUint32(length - 8); // file length - 8
+            		setUint32(0x45564157); // "WAVE"
+
+            		setUint32(0x20746d66); // "fmt " chunk
+            		setUint32(16); // length = 16
+            		setUint16(1); // PCM (uncompressed)
+            		setUint16(numOfChan);
+            		setUint32(sampleRate);
+            		setUint32(sampleRate * 2 * numOfChan);
+            		setUint16(numOfChan * 2);
+            		setUint16(16);
+
+            		setUint32(0x61746164); // "data" - chunk
+            		setUint32(length - pos - 4);
+
+            		// write interleaved data
+            		for (let i = 0; i < abuffer.length; i++) {
+            			for (let channel = 0; channel < numOfChan; channel++) {
+            				let sample = abuffer.getChannelData(channel)[i] * 0x7fff;
+            				if (sample < -32768) sample = -32768;
+            				if (sample > 32767) sample = 32767;
+            				view.setInt16(pos, sample, true);
+            				pos += 2;
+            			}
+            		}
+
+            		function setUint16(data) {
+            			view.setUint16(pos, data, true);
+            			pos += 2;
+            		}
+
+            		function setUint32(data) {
+            			view.setUint32(pos, data, true);
+            			pos += 4;
+            		}
+
+            		return new Blob([buffer], {
+            			type: 'audio/wav'
+            		});
+            	}
+
+            	function applyVolume() {
+            		if (!isAudioCombined) return;
+
+            		// ベース音量 (0-1)
+            		const baseVolume = parseFloat(volumeSlider.value);
+            		// グローバル音量係数 (0-10)
+            		const globalVolume = parseFloat(globalVolumeSlider.value) / 10; // 0-1に変換
+
+            		// 最終音量 (0-1)
+            		const finalVolume = Math.max(0, Math.min(1, baseVolume *
+            			globalVolume));
+
+            		// 動画と音声の音量を設定
+            		video.volume = finalVolume;
+            		if (combinedAudioElement) {
+            			combinedAudioElement.volume = finalVolume;
+            		}
+
+            		// 音量アイコンを更新
+            		updateVolumeIcon();
+            	}
+
+            	function applyPlaybackRate() {
+            		if (!isAudioCombined) return;
+
+            		const speed = parseFloat(playbackSpeedSlider.value);
+            		currentPlaybackRate = speed;
+            		video.playbackRate = speed;
+
+            		if (combinedAudioElement) {
+            			combinedAudioElement.playbackRate = speed;
+            		}
+
+            		speedValue.textContent = speed.toFixed(2) + 'x';
+            		playbackSpeedValue.textContent = speed.toFixed(2) + 'x';
+            		speedSlider.value = speed;
+            	}
+            	// プレイヤーコントロールを有効化
+            	function enablePlayerControls() {
+            		disabledOverlay.style.display = 'none';
+            		playPauseBtn.disabled = false;
+            		volumeBtn.disabled = false;
+            		volumeSlider.disabled = false;
+            		speedSlider.disabled = false;
+            		fullscreenBtn.disabled = false;
+            		startTimeInput.disabled = false;
+            		endTimeInput.disabled = false;
+            		resetEndTimeBtn.disabled = false;
+            		loopCheckbox.disabled = false;
+            		globalVolumeSlider.disabled = false;
+            		setStartTimeBtn.disabled = false;
+            		setEndTimeBtn.disabled = false;
+            		playbackSpeedSlider.disabled = false;
+            		applyTimeBtn.disabled = false;
+            		resetBtn.disabled = false; // 追加
+            		pipBtn.disabled = false; // 追加
+            	}
+
+            	// プレビュー再生
+            	function togglePreview() {
+            		if (!isAudioCombined || !combinedAudioElement) return;
+
+            		if (previewButton.textContent === '▶') {
+            			// 再生
+            			combinedAudioElement.currentTime = 0;
+            			combinedAudioElement.play()
+            				.then(() => {
+            					previewButton.textContent = '⏸';
+
+            					// プレビューの時間表示を更新
+            					const updatePreviewTime = () => {
+            						if (!combinedAudioElement || !isAudioCombined) return;
+
+            						const currentTime = combinedAudioElement.currentTime;
+            						const duration = combinedAudioElement.duration;
+
+            						if (currentTime >= duration) {
+            							previewButton.textContent = '▶';
+            							previewTime.textContent =
+            								`00:00 / ${formatTime(duration)}`;
+            							return;
+            						}
+
+            						previewTime.textContent =
+            							`${formatTime(currentTime)} / ${formatTime(duration)}`;
+            						requestAnimationFrame(updatePreviewTime);
+            					};
+
+            					updatePreviewTime();
+            				})
+            				.catch(e => console.error('プレビュー再生エラー:', e));
+            		} else {
+            			// 一時停止
+            			combinedAudioElement.pause();
+            			previewButton.textContent = '▶';
+            		}
+            	}
+
+            	// 時間をフォーマットするヘルパー関数
+            	function formatTime(seconds) {
+            		const mins = Math.floor(seconds / 60);
+            		const secs = Math.floor(seconds % 60);
+            		return
+            			`${String(mins).padStart(2, '0')}:${String(secs).padStart(2, '0')}`;
+            	}
+
+            	// 動画のメタデータが読み込まれたら
+            	video.addEventListener('loadedmetadata', function() {
+            		try {
+            			videoDuration = video.duration;
+            			endTimeInput.value = videoDuration.toFixed(2);
+            			endTimeInput.max = videoDuration;
+            			startTimeInput.max = videoDuration - 0.1;
+            			updateTimeDisplay();
+            			checkLoadingComplete();
+            		} catch (error) {
+            			handleError(error, '動画メタデータ読み込み中にエラーが発生しました');
+            		}
+            	});
+
+            	// 動画エラー処理
+            	video.addEventListener('error', function() {
+            		handleError(video.error, '動画読み込み中にエラーが発生しました');
+            	});
+
+            	// 再生ボタンクリック
+            	playPauseBtn.addEventListener('click', function() {
+            		const endTime = parseFloat(endTimeInput.value) ||
+            			videoDuration;
+            		if (video.currentTime >= endTime) {
+            			const startTime = parseFloat(startTimeInput.value) || 0;
+            			seekMedia(startTime);
+            		}
+            		togglePlayPause();
+            	});
+
+            	// 時間表示を更新
+            	function updateTimeDisplay() {
+            		const now = performance.now();
+            		if (now - lastUpdateTime < updateInterval && !isFullscreen)
+            			return;
+            		lastUpdateTime = now;
+
+            		try {
+            			const currentTime = video.currentTime;
+            			const duration = video.duration || videoDuration;
+
+            			const currentMinutes = Math.floor(currentTime / 60);
+            			const currentSeconds = Math.floor(currentTime % 60);
+            			const currentMilliseconds = Math.floor((currentTime % 1) * 100);
+            			const durationMinutes = Math.floor(duration / 60);
+            			const durationSeconds = Math.floor(duration % 60);
+            			const durationMilliseconds = Math.floor((duration % 1) * 100);
+
+            			timeDisplay.textContent =
+            				`${String(currentMinutes).padStart(2, '0')}:${String(currentSeconds).padStart(2, '0')}.${String(currentMilliseconds).padStart(2, '0')} / ` +
+            				`${String(durationMinutes).padStart(2, '0')}:${String(durationSeconds).padStart(2, '0')}.${String(durationMilliseconds).padStart(2, '0')}`;
+
+            			const progressPercent = (currentTime / duration) * 100;
+            			progressBar.style.width = `${progressPercent}%`;
+            		} catch (error) {
+            			console.error('時間表示更新エラー:', error);
+            		}
+            	}
+
+            	// 再生/一時停止をトグル
+            	function togglePlayPause() {
+            		if (isPlaying) {
+            			pauseMedia();
+            		} else {
+            			playMedia();
+            		}
+            	}
+
+            	function playMedia() {
+            		try {
+            			const duration = video.duration || videoDuration;
+            			const startTime = parseFloat(startTimeInput.value) || 0;
+            			const endTime = parseFloat(endTimeInput.value) || duration;
+
+            			if (video.currentTime >= endTime) {
+            				video.currentTime = startTime;
+            			}
+
+            			const playPromise = video.play();
+
+            			if (playPromise !== undefined) {
+            				playPromise.then(() => {
+            					isPlaying = true;
+            					playPauseBtn.textContent = '⏸';
+
+            					// 音声を同期して再生
+            					if (isAudioCombined) {
+            						combinedAudioElement.currentTime = video.currentTime;
+            						combinedAudioElement.play().catch(e => console.error(
+            							'音声再生エラー:', e));
+            					}
+
+            					startSyncCheck();
+
+            					video.playbackRate = currentPlaybackRate;
+            				}).catch(error => {
+            					console.error('動画再生エラー:', error);
+            					isPlaying = false;
+            					playPauseBtn.textContent = '▶';
+            				});
+            			}
+            		} catch (error) {
+            			console.error('メディア再生エラー:', error);
+            			isPlaying = false;
+            			playPauseBtn.textContent = '▶';
+            		}
+            	}
+
+            	function pauseMedia() {
+            		try {
+            			video.pause();
+            			isPlaying = false;
+            			playPauseBtn.textContent = '▶';
+            			stopSyncCheck();
+
+            			if (combinedAudioElement) {
+            				combinedAudioElement.pause();
+            			}
+            		} catch (error) {
+            			console.error('メディア一時停止エラー:', error);
+            		}
+            	}
+
+            	// 時間更新時の処理
+            	video.addEventListener('timeupdate', function() {
+            		updateTimeDisplay();
+            	});
+
+            	// プログレスバークリックでシーク
+            	progressContainer.addEventListener('click', function(e) {
+            		if (!video.duration) return;
+
+            		const rect = this.getBoundingClientRect();
+            		const pos = (e.clientX - rect.left) / rect.width;
+            		const seekTime = pos * video.duration;
+
+            		seekMedia(seekTime);
+            	});
+
+            	// 指定した時間にシーク (改良版)
+            	function seekMedia(time) {
+            		try {
+            			const duration = video.duration || videoDuration;
+            			const startTime = parseFloat(startTimeInput.value) || 0;
+            			const endTime = parseFloat(endTimeInput.value) || duration;
+
+            			const seekTime = Math.max(startTime, Math.min(time, endTime));
+            			video.currentTime = seekTime;
+
+            			if (combinedAudioElement) {
+            				combinedAudioElement.currentTime = seekTime;
+            				if (isPlaying) {
+            					combinedAudioElement.play().catch(e => console.error(
+            						'音声再生エラー:', e));
+            				}
+            			}
+            		} catch (error) {
+            			console.error('メディアシークエラー:', error);
+            		}
+            	}
+
+            	// プログレスバー上でマウス移動時に時間を表示
+            	progressContainer.addEventListener('mousemove', function(e) {
+            		if (!video.duration) return;
+
+            		const rect = this.getBoundingClientRect();
+            		const pos = (e.clientX - rect.left) / rect.width;
+            		const hoverTime = pos * video.duration;
+
+            		const minutes = Math.floor(hoverTime / 60);
+            		const seconds = Math.floor(hoverTime % 60);
+            		const milliseconds = Math.floor((hoverTime % 1) * 100);
+
+            		progressTime.textContent =
+            			`${String(minutes).padStart(2, '0')}:${String(seconds).padStart(2, '0')}.${String(milliseconds).padStart(2, '0')}`;
+            		progressTime.style.display = 'block';
+            		progressTime.style.left = `${pos * 100}%`;
+            	});
+
+            	progressContainer.addEventListener('mouseleave', function() {
+            		progressTime.style.display = 'none';
+            	});
+
+            	// 動画クリックで再生/一時停止
+            	video.addEventListener('click', function() {
+            		togglePlayPause();
+            	});
+
+            	volumeSlider.addEventListener('input', function() {
+            		if (!isAudioCombined) return;
+
+            		lastVolume = parseFloat(this.value);
+            		applyVolume();
+            	});
+
+            	volumeBtn.addEventListener('click', function() {
+            		if (!isAudioCombined) return;
+
+            		if (video.volume > 0) {
+            			lastVolume = parseFloat(volumeSlider.value);
+            			volumeSlider.value = 0;
+            		} else {
+            			volumeSlider.value = lastVolume;
+            		}
+
+            		applyVolume();
+            	});
+
+            	// 音量アイコンを更新
+            	function updateVolumeIcon() {
+            		if (video.volume === 0) {
+            			volumeBtn.textContent = '🔇';
+            		} else if (video.volume < 3) {
+            			volumeBtn.textContent = '🔈';
+            		} else {
+            			volumeBtn.textContent = '🔊';
+            		}
+            	}
+
+            	// 再生速度スライダー (動画プレイヤー)
+            	speedSlider.addEventListener('input', function() {
+            		if (!isAudioCombined) return;
+
+            		const speed = parseFloat(this.value);
+            		speedValue.textContent = speed.toFixed(2) + 'x';
+            		playbackSpeedSlider.value = speed;
+            		playbackSpeedValue.textContent = speed.toFixed(2) + 'x';
+            		updatePlaybackRate(speed);
+            	});
+
+            	// 再生速度スライダー (設定メニュー)
+            	playbackSpeedSlider.addEventListener('input', function() {
+            		if (!isAudioCombined) return;
+
+            		const speed = parseFloat(this.value);
+            		playbackSpeedValue.textContent = speed.toFixed(2) + 'x';
+            		speedSlider.value = speed;
+            		speedValue.textContent = speed.toFixed(2) + 'x';
+            		updatePlaybackRate(speed);
+            	});
+
+            	// テンポ入力による再生速度更新
+            	tempoInput.addEventListener('input', function() {
+            		const tempo = parseFloat(this.value);
+            		const baseTempo = isTMode ? 66 : 92;
+            		const speed = tempo / baseTempo;
+
+            		const clampedSpeed = Math.max(0.001, Math.min(5.0, speed));
+
+            		playbackSpeedSlider.value = clampedSpeed;
+            		playbackSpeedValue.textContent = clampedSpeed.toFixed(2) +
+            			'x';
+            		speedSlider.value = clampedSpeed;
+            		speedValue.textContent = clampedSpeed.toFixed(2) + 'x';
+            		tempoSpeedValue.textContent = clampedSpeed.toFixed(2) + 'x';
+
+            		updatePlaybackRate(clampedSpeed);
+            	});
+
+            	function updatePlaybackRate(speed) {
+            		if (!isAudioCombined) return;
+
+            		currentPlaybackRate = speed;
+            		video.playbackRate = speed;
+
+            		// ピッチ保持を再設定
+            		video.preservesPitch = true;
+            		video.mozPreservesPitch = true;
+            		video.webkitPreservesPitch = true;
+
+            		if (combinedAudioElement) {
+            			combinedAudioElement.playbackRate = speed;
+
+            			// 合成音声のピッチ保持を設定
+            			combinedAudioElement.preservesPitch = true;
+            			combinedAudioElement.mozPreservesPitch = true;
+            			combinedAudioElement.webkitPreservesPitch = true;
+            		}
+            	}
+
+            	// 全画面ボタン
+            	fullscreenBtn.addEventListener('click', function() {
+            		if (!isFullscreen) {
+            			if (videoContainer.requestFullscreen) {
+            				videoContainer.requestFullscreen();
+            			} else if (videoContainer.webkitRequestFullscreen) {
+            				videoContainer.webkitRequestFullscreen();
+            			} else if (videoContainer.msRequestFullscreen) {
+            				videoContainer.msRequestFullscreen();
+            			}
+            		} else {
+            			if (document.exitFullscreen) {
+            				document.exitFullscreen();
+            			} else if (document.webkitExitFullscreen) {
+            				document.webkitExitFullscreen();
+            			} else if (document.msExitFullscreen) {
+            				document.msExitFullscreen();
+            			}
+            		}
+            	});
+
+            	// 全画面変更イベント
+            	document.addEventListener('fullscreenchange',
+            		handleFullscreenChange);
+            	document.addEventListener('webkitfullscreenchange',
+            		handleFullscreenChange);
+            	document.addEventListener('msfullscreenchange',
+            		handleFullscreenChange);
+
+            	function handleFullscreenChange() {
+            		isFullscreen = !!(document.fullscreenElement || document.webkitFullscreenElement ||
+            			document.msFullscreenElement);
+            		fullscreenBtn.textContent = isFullscreen ? '⛶' : '⛶';
+            		video.controls = false;
+
+            		// 全画面時にロックボタンを表示
+            		lockControlsBtn.style.display = isFullscreen ? 'flex' : 'none';
+
+            		// 全画面時にコントロールバー自動非表示機能を有効化
+            		if (isFullscreen) {
+            			resetControlsHideTimer();
+            			document.addEventListener('mousemove',
+            				handleFullscreenMouseMove);
+            		} else {
+            			document.removeEventListener('mousemove',
+            				handleFullscreenMouseMove);
+            			clearTimeout(controlsHideTimeout);
+            			showControls();
+            		}
+            	}
+
+            	// 全画面時のマウス移動処理
+            	function handleFullscreenMouseMove() {
+            		if (!isControlsLocked) {
+            			showControls();
+            			resetControlsHideTimer();
+            		}
+            	}
+
+            	// コントロールバーを表示
+            	function showControls() {
+            		if (!controlsVisible) {
+            			videoControls.style.opacity = '1';
+            			controlsVisible = true;
+            		}
+            	}
+
+            	// コントロールバーを非表示
+            	function hideControls() {
+            		if (!isControlsLocked && controlsVisible) {
+            			videoControls.style.opacity = '0';
+            			controlsVisible = false;
+            		}
+            	}
+
+            	// コントロールバー非表示タイマーをリセット
+            	function resetControlsHideTimer() {
+            		clearTimeout(controlsHideTimeout);
+            		if (!isControlsLocked) {
+            			controlsHideTimeout = setTimeout(hideControls, 1500); // 1.5秒後に非表示
+            		}
+            	}
+
+            	// ロックボタンのクリック処理
+            	lockControlsBtn.addEventListener('click', function() {
+            		isControlsLocked = !isControlsLocked;
+            		this.classList.toggle('locked', isControlsLocked);
+
+            		if (isControlsLocked) {
+            			showControls();
+            			clearTimeout(controlsHideTimeout);
+            		} else {
+            			resetControlsHideTimer();
+            		}
+            	});
+
+            	// キーボードイベント (ESCで全画面終了)
+            	document.addEventListener('keydown', function(e) {
+            		if (e.key === 'Escape' && isFullscreen) {
+            			if (document.exitFullscreen) {
+            				document.exitFullscreen();
+            			} else if (document.webkitExitFullscreen) {
+            				document.webkitExitFullscreen();
+            			} else if (document.msExitFullscreen) {
+            				document.msExitFullscreen();
+            			}
+            		}
+            	});
+
+            	// ボリュームスライダーのイベント
+            	audioSliders.forEach((slider, index) => {
+            		slider.addEventListener('input', function() {
+            			const value = parseFloat(this.value);
+            			volumeValues[index].textContent = value.toFixed(2);
+
+            			const percent = value * 100;
+            			this.style.backgroundSize = `${percent}% 100%`;
+            		});
+            	});
+
+            	globalVolumeSlider.addEventListener('input', function() {
+            		const value = parseFloat(this.value);
+            		globalVolumeValue.textContent = value.toFixed(1);
+
+            		const percent = (value - this.min) / (this.max - this.min) *
+            			100;
+            		this.style.backgroundSize = `${percent}% 100%`;
+
+            		applyVolume();
+            	});
+
+            	// ループ設定変更時
+            	loopCheckbox.addEventListener('change', function() {
+            		// 合成音声ではループは動画に依存する
+            	});
+
+            	// 現在の秒数を開始時間に設定
+            	setStartTimeBtn.addEventListener('click', function() {
+            		startTimeInput.value = video.currentTime.toFixed(2);
+            		updateProgressMarkers();
+            	});
+
+            	// 現在の秒数を終了時間に設定
+            	setEndTimeBtn.addEventListener('click', function() {
+            		endTimeInput.value = video.currentTime.toFixed(2);
+            		updateProgressMarkers();
+            	});
+
+            	// 終了時間を動画の長さにリセット
+            	resetEndTimeBtn.addEventListener('click', function() {
+            		endTimeInput.value = video.duration.toFixed(2);
+            		updateProgressMarkers();
+            	});
+
+            	// プログレスバーのマーカーを更新
+            	function updateProgressMarkers() {
+            		const duration = video.duration || 0;
+            		const startTime = parseFloat(startTimeInput.value) || 0;
+            		const endTime = parseFloat(endTimeInput.value) || duration;
+
+            		if (duration > 0) {
+            			if (startTime > 0) {
+            				startMarker.style.left = `${(startTime / duration) * 100}%`;
+            				startMarker.style.display = 'block';
+            			} else {
+            				startMarker.style.display = 'none';
+            			}
+
+            			if (endTime < duration) {
+            				endMarker.style.left = `${(endTime / duration) * 100}%`;
+            				endMarker.style.display = 'block';
+            			} else {
+            				endMarker.style.display = 'none';
+            			}
+            		}
+            	}
+
+            	// 開始/終了時間変更時にマーカーを更新
+            	startTimeInput.addEventListener('input', updateProgressMarkers);
+            	endTimeInput.addEventListener('input', updateProgressMarkers);
+
+            	// 合成ボタンクリック
+            	combineButton.addEventListener('click', combineAudio);
+
+            	// プレビューボタンクリック
+            	previewButton.addEventListener('click', togglePreview);
+
+            	// 同期ステータスを閉じる
+            	syncStatusClose.addEventListener('click', function() {
+            		syncStatus.style.display = 'none';
+            	});
+
+            	// 初期化
+            	loadAudioFiles();
+            	updateVolumeIcon();
+            	volumeSlider.value = video.volume;
+            	video.controls = false;
+
+            	// スライダーの背景を初期化
+            	function initSliderBackgrounds() {
+            		const sliders = [
+            			volumeSlider,
+            			speedSlider,
+            			globalVolumeSlider,
+            			playbackSpeedSlider,
+            			...audioSliders
+            		];
+
+            		sliders.forEach(slider => {
+            			if (slider) {
+            				slider.style.backgroundImage =
+            					'linear-gradient(#64ffda, #64ffda)';
+            				slider.style.backgroundRepeat = 'no-repeat';
+
+            				if (slider === globalVolumeSlider) {
+            					const percent = (slider.value - slider.min) / (slider.max -
+            						slider.min) * 100;
+            					slider.style.backgroundSize = `${percent}% 100%`;
+            					globalVolumeValue.textContent = slider.value;
+            				} else {
+            					slider.style.backgroundSize =
+            						`${slider.value * 100}% 100%`;
+            				}
+            			}
+            		});
+            	}
+
+            	initSliderBackgrounds();
+            	startSyncCheck(); // 同期チェックを開始
+
+            	// 初期テンポ設定
+            	tempoInput.value = isTMode ? 66 : 92;
+            	tempoInput.dispatchEvent(new Event('input'));
             });
             // タイムマーカー関連のコードを修正
-document.addEventListener('DOMContentLoaded', function() {
-    // まず必要なDOM要素を取得
-    const startMarker = document.getElementById('start-marker');
-    const endMarker = document.getElementById('end-marker');
-    const video = document.getElementById('video');
-    const startTimeInput = document.getElementById('start-time');
-    const endTimeInput = document.getElementById('end-time');
-
-    // URLパラメータをチェック
-    const urlParams = new URLSearchParams(window.location.search);
-    const isTMode = urlParams.has('mode') && urlParams.get('mode') === 't';
-
-    // タイムマーカーデータ
-    const timeMarkers = isTMode ? [
-            { label: '①[1番]', time: 15.2 },
-            { label: '②[1番]', time: 43.8 },
-            { label: '①[2番]', time: 79.0 },
-            { label: '②[2番]', time: 108.0 },
-            { label: '③', time: 137.25 },
-            { label: '④', time: 162.55 },
-            { label: '⑤', time: 191.65 }
-    ] : [
-            { label: 'A', time: 8.35 },
-            { label: 'B', time: 72.1 },
-            { label: 'C', time: 98.67 },
-            { label: 'D', time: 155.83 },
-            { label: 'E', time: 192.55 }
-    ];
-
-    // タイムマーカーを表示
-    const timeMarkersContainer = document.getElementById('time-markers-container');
-
-    timeMarkers.forEach(marker => {
-            const markerElement = document.createElement('div');
-            markerElement.className = 'time-marker';
-            markerElement.innerHTML = `<b>${marker.label}</b>(${marker.time}秒)`;
-            markerElement.dataset.time = marker.time;
-
-            // ドラッグ開始
-            markerElement.addEventListener('dragstart', function(e) {
-                    e.dataTransfer.setData('text/plain', marker.time);
-                    this.classList.add('dragging');
-            });
-
-            // ドラッグ終了
-            markerElement.addEventListener('dragend', function() {
-                    this.classList.remove('dragging');
-            });
-
-            // ドラッグ可能に設定
-            markerElement.draggable = true;
-
-            // クリックで開始時間に設定
-            markerElement.addEventListener('click', function() {
-                    startTimeInput.value = marker.time;
-                    updateProgressMarkers();
-            });
-
-            timeMarkersContainer.appendChild(markerElement);
-    });
-
-    // ドロップターゲットの設定
-    [startTimeInput, endTimeInput].forEach(input => {
-            // ドラッグオーバー
-            input.addEventListener('dragover', function(e) {
-                    e.preventDefault();
-                    this.style.backgroundColor = 'rgba(100, 255, 218, 0.2)';
-            });
-
-            // ドラッグリーブ
-            input.addEventListener('dragleave', function() {
-                    this.style.backgroundColor = '';
-            });
-
-            // ドロップ
-            input.addEventListener('drop', function(e) {
-                    e.preventDefault();
-                    this.style.backgroundColor = '';
-
-                    const time = parseFloat(e.dataTransfer.getData('text/plain'));
-                    if (!isNaN(time)) {
-                            this.value = time;
-                            updateProgressMarkers();
-                    }
+            document.addEventListener('DOMContentLoaded', function() {
+            	// まず必要なDOM要素を取得
+            	const startMarker = document.getElementById('start-marker');
+            	const endMarker = document.getElementById('end-marker');
+            	const video = document.getElementById('video');
+            	const startTimeInput = document.getElementById('start-time');
+            	const endTimeInput = document.getElementById('end-time');
+
+            	// URLパラメータをチェック
+            	const urlParams = new URLSearchParams(window.location.search);
+            	const isTMode = urlParams.has('mode') && urlParams.get('mode') ===
+            		't';
+
+            	// タイムマーカーデータ
+            	const timeMarkers = isTMode ? [{
+            		label: '①[1番]',
+            		time: 15.2
+            	}, {
+            		label: '②[1番]',
+            		time: 43.8
+            	}, {
+            		label: '①[2番]',
+            		time: 79.0
+            	}, {
+            		label: '②[2番]',
+            		time: 108.0
+            	}, {
+            		label: '③',
+            		time: 137.25
+            	}, {
+            		label: '④',
+            		time: 162.55
+            	}, {
+            		label: '⑤',
+            		time: 191.65
+            	}] : [{
+            		label: 'A',
+            		time: 8.35
+            	}, {
+            		label: 'B',
+            		time: 72.1
+            	}, {
+            		label: 'C',
+            		time: 98.67
+            	}, {
+            		label: 'D',
+            		time: 155.83
+            	}, {
+            		label: 'E',
+            		time: 192.55
+            	}];
+
+            	// タイムマーカーを表示
+            	const timeMarkersContainer = document.getElementById(
+            		'time-markers-container');
+
+            	timeMarkers.forEach(marker => {
+            		const markerElement = document.createElement('div');
+            		markerElement.className = 'time-marker';
+            		markerElement.innerHTML =
+            			`<b>${marker.label}</b>(${marker.time}秒)`;
+            		markerElement.dataset.time = marker.time;
+
+            		// ドラッグ開始
+            		markerElement.addEventListener('dragstart', function(e) {
+            			e.dataTransfer.setData('text/plain', marker.time);
+            			this.classList.add('dragging');
+            		});
+
+            		// ドラッグ終了
+            		markerElement.addEventListener('dragend', function() {
+            			this.classList.remove('dragging');
+            		});
+
+            		// ドラッグ可能に設定
+            		markerElement.draggable = true;
+
+            		// クリックで開始時間に設定
+            		markerElement.addEventListener('click', function() {
+            			startTimeInput.value = marker.time;
+            			updateProgressMarkers();
+            		});
+
+            		timeMarkersContainer.appendChild(markerElement);
+            	});
+
+            	// ドロップターゲットの設定
+            	[startTimeInput, endTimeInput].forEach(input => {
+            		// ドラッグオーバー
+            		input.addEventListener('dragover', function(e) {
+            			e.preventDefault();
+            			this.style.backgroundColor = 'rgba(100, 255, 218, 0.2)';
+            		});
+
+            		// ドラッグリーブ
+            		input.addEventListener('dragleave', function() {
+            			this.style.backgroundColor = '';
+            		});
+
+            		// ドロップ
+            		input.addEventListener('drop', function(e) {
+            			e.preventDefault();
+            			this.style.backgroundColor = '';
+
+            			const time = parseFloat(e.dataTransfer.getData(
+            				'text/plain'));
+            			if (!isNaN(time)) {
+            				this.value = time;
+            				updateProgressMarkers();
+            			}
+            		});
+            	});
+
+            	// 入力ボックスの変更時にマーカーを更新
+            	startTimeInput.addEventListener('input', updateProgressMarkers);
+            	endTimeInput.addEventListener('input', updateProgressMarkers);
+
+            	// updateProgressMarkers関数
+            	function updateProgressMarkers() {
+            		const duration = video.duration || 0;
+            		const startTime = parseFloat(startTimeInput.value) || 0;
+            		const endTime = parseFloat(endTimeInput.value) || duration;
+
+            		if (duration > 0) {
+            			if (startMarker) startMarker.style.left =
+            				`${(startTime / duration) * 100}%`;
+            			if (endMarker) endMarker.style.left =
+            				`${(endTime / duration) * 100}%`;
+
+            			if (startMarker) startMarker.style.display = 'block';
+            			if (endMarker) endMarker.style.display = 'block';
+            		}
+            	}
             });
-    });
-
-    // 入力ボックスの変更時にマーカーを更新
-    startTimeInput.addEventListener('input', updateProgressMarkers);
-    endTimeInput.addEventListener('input', updateProgressMarkers);
-
-    // updateProgressMarkers関数
-    function updateProgressMarkers() {
-            const duration = video.duration || 0;
-            const startTime = parseFloat(startTimeInput.value) || 0;
-            const endTime = parseFloat(endTimeInput.value) || duration;
-
-            if (duration > 0) {
-                    if(startMarker) startMarker.style.left = `${(startTime / duration) * 100}%`;
-                    if(endMarker) endMarker.style.left = `${(endTime / duration) * 100}%`;
-
-                    if(startMarker) startMarker.style.display = 'block';
-                    if(endMarker) endMarker.style.display = 'block';
-            }
-    }
-});
         </script>
     </body>
 </html>
\ No newline at end of file