ストップウォッチ。賞金付き。 1秒300円。賞金には区切りをつける。 6時まで。

⏱️ ストップウォッチ 🎉
00:00:00
💰 賞金: ¥0
🎈🎉🎊✨🌟🎀
```html
<!DOCTYPE html>
<html>
<head>
    <style>
        @keyframes bounce {
            0%, 20%, 50%, 80%, 100% { transform: translateY(0); }
            40% { transform: translateY(-20px); }
            60% { transform: translateY(-10px); }
        }
        @keyframes pop {
            0% { transform: scale(1); }
            50% { transform: scale(1.3); }
            100% { transform: scale(1); }
        }
    </style>
</head>
<body>
    <div style="width: 400px; height: 400px; margin: auto; text-align: center; font-family: Arial, sans-serif; background-color: #f0f8ff; border: 2px solid #add8e6; border-radius: 10px; position: relative;">
        <div style="font-size: 2em; margin-top: 20px;">⏱️ ストップウォッチ 🎉</div>
        <div id="time" style="font-size: 1.5em; margin: 20px 0;">00:00:00</div>
        <div id="earnings" style="font-size: 1.2em; margin-bottom: 20px;">💰 賞金: ¥0</div>
        <div>
            <button id="startBtn" style="font-size: 1em; padding: 10px 20px; margin: 5px; cursor: pointer; border: none; background-color: #4caf50; color: white; border-radius: 5px;" onclick="startTimer()">▶️ Start</button>
            <button id="stopBtn" style="font-size: 1em; padding: 10px 20px; margin: 5px; cursor: pointer; border: none; background-color: #f44336; color: white; border-radius: 5px;" onclick="stopTimer()">⏸️ Stop</button>
            <button id="resetBtn" style="font-size: 1em; padding: 10px 20px; margin: 5px; cursor: pointer; border: none; background-color: #ff9800; color: white; border-radius: 5px;" onclick="resetTimer()">🔄 Reset</button>
        </div>
        <div style="position: absolute; bottom: 10px; width: 100%; text-align: center;">
            <span style="font-size: 1.5em;">🎈🎉🎊✨🌟🎀</span>
        </div>
        <canvas id="confetti" width="400" height="400" style="position: absolute; top: 0; left: 0; pointer-events: none;"></canvas>
    </div>
    <script>
        let startTime, elapsedTime = 0, timerInterval;
        const timeDisplay = document.getElementById('time');
        const earningsDisplay = document.getElementById('earnings');
        const confettiCanvas = document.getElementById('confetti');
        const ctx = confettiCanvas.getContext('2d');

        function updateTime() {
            elapsedTime = Date.now() - startTime;
            let totalSeconds = Math.floor(elapsedTime / 1000);
            if (totalSeconds >= 21600) { // 6 hours in seconds
                stopTimer();
                return;
            }
            let hours = String(Math.floor(totalSeconds / 3600)).padStart(2, '0');
            let minutes = String(Math.floor((totalSeconds % 3600) / 60)).padStart(2, '0');
            let seconds = String(totalSeconds % 60).padStart(2, '0');
            timeDisplay.textContent = `${hours}:${minutes}:${seconds}`;
            earningsDisplay.textContent = `💰 賞金: ¥${(totalSeconds * 300).toLocaleString()}`;
        }

        function startTimer() {
            if (!timerInterval) {
                startTime = Date.now() - elapsedTime;
                timerInterval = setInterval(updateTime, 1000);
                animateButton('startBtn');
                launchConfetti();
            }
        }

        function stopTimer() {
            if (timerInterval) {
                clearInterval(timerInterval);
                timerInterval = null;
                animateButton('stopBtn');
            }
        }

        function resetTimer() {
            stopTimer();
            elapsedTime = 0;
            timeDisplay.textContent = "00:00:00";
            earningsDisplay.textContent = "💰 賞金: ¥0";
            animateButton('resetBtn');
        }

        function animateButton(id) {
            const button = document.getElementById(id);
            button.style.animation = 'pop 0.3s';
            button.addEventListener('animationend', () => {
                button.style.animation = '';
            }, { once: true });
        }

        function launchConfetti() {
            const colors = ['#fde132', '#009bde', '#ff6b00'];
            const particles = [];

            function createParticles() {
                for (let i = 0; i < 100; i++) {
                    particles.push({
                        x: Math.random() * confettiCanvas.width,
                        y: Math.random() * confettiCanvas.height - confettiCanvas.height,
                        r: Math.random() * 4 + 1,
                        d: Math.random() * particles.length,
                        color: colors[Math.floor(Math.random() * colors.length)],
                        tilt: Math.floor(Math.random() * 10) - 10,
                        tiltAngleIncremental: (Math.random() * 0.07) + 0.05,
                        tiltAngle: 0
                    });
                }
            }

            createParticles();

            function draw() {
                ctx.clearRect(0, 0, confettiCanvas.width, confettiCanvas.height);
                particles.forEach(p => {
                    ctx.beginPath();
                    ctx.lineWidth = p.r;
                    ctx.strokeStyle = p.color;
                    ctx.moveTo(p.x + p.tilt + p.r, p.y);
                    ctx.lineTo(p.x + p.tilt, p.y + p.tilt + p.r);
                    ctx.stroke();
                });
                update();
            }

            let angle = 0;

            function update() {
                angle += 0.01;
                particles.forEach(p => {
                    p.y += (Math.cos(angle + p.d) + 1 + p.r / 2) / 2;
                    p.tiltAngle += p.tiltAngleIncremental;
                    p.tilt = Math.sin(p.tiltAngle) * 15;

                    if (p.y > confettiCanvas.height) {
                        p.y = -10;
                        p.x = Math.random() * confettiCanvas.width;
                    }
                });
            }

            setInterval(draw, 33);
        }
    </script>
</body>
</html>
```