🚀✨トレンド変換アプリ🌈🎉

🌟 ここに結果が表示されます 🌟
```html
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>✨トレンド変換アプリ🌟</title>
    <style>
        @keyframes rotate {
            from { transform: rotate(0deg); }
            to { transform: rotate(360deg); }
        }
        @keyframes burst {
            0% { transform: scale(1); opacity: 1; }
            100% { transform: scale(2); opacity: 0; }
        }
    </style>
</head>
<body>
    <div style="width:400px; height:400px; margin:auto; border:2px solid #FFD700; border-radius:15px; padding:20px; box-sizing:border-box; background: linear-gradient(135deg, #FFDEE9 0%, #B5FFFC 100%); position:relative; overflow:hidden;">
        <h1 style="text-align:center; font-size:24px; margin-bottom:20px;">🚀✨トレンド変換アプリ🌈🎉</h1>
        <input type="text" id="trendInput" placeholder="トレンドワードを入力🔍" style="width:100%; padding:10px; font-size:16px; border:2px solid #FF69B4; border-radius:8px; margin-bottom:10px;">
        <div style="text-align:center; margin-bottom:15px;">
            <button onclick="convertTrend('ハロウィン')" style="padding:10px 15px; font-size:14px; margin:5px; cursor:pointer; border:none; border-radius:8px; background-color:#FFA07A; color:white; animation: rotate 4s linear infinite;">🎃ハロウィン</button>
            <button onclick="convertTrend('桜')" style="padding:10px 15px; font-size:14px; margin:5px; cursor:pointer; border:none; border-radius:8px; background-color:#FFB6C1; color:white; animation: rotate 6s linear infinite;">🌸桜</button>
            <button onclick="convertTrend('オリンピック')" style="padding:10px 15px; font-size:14px; margin:5px; cursor:pointer; border:none; border-radius:8px; background-color:#87CEFA; color:white; animation: rotate 5s linear infinite;">🏅オリンピック</button>
        </div>
        <div id="result" style="text-align:center; font-size:16px; min-height:60px; padding:10px; border:2px dashed #20B2AA; border-radius:8px; background-color:#E0FFFF; position:relative;">
            🌟 ここに結果が表示されます 🌟
        </div>
        <button onclick="speak()" style="display:block; margin:20px auto 0; padding:10px 20px; font-size:16px; cursor:pointer; border:none; border-radius:8px; background-color:#32CD32; color:white; box-shadow: 0 4px #2E8B57;">🔊 読み上げる 🎤</button>
        <div id="burst" style="position:absolute; width:100px; height:100px; top:50%; left:50%; transform: translate(-50%, -50%); pointer-events:none;"></div>
    </div>

    <script>
        const trends = {
            "ハロウィン": {
                English: "Halloween",
                sentence: "Halloween is celebrated on October 31st with costumes and candy! 🎃👻"
            },
            "桜": {
                English: "Cherry Blossom",
                sentence: "The cherry blossoms are blooming beautifully this spring. 🌸🌼"
            },
            "オリンピック": {
                English: "Olympics",
                sentence: "The Olympics bring together athletes from around the world. 🏅🌍"
            }
        };

        function convertTrend(word) {
            const result = trends[word];
            const resultDiv = document.getElementById('result');
            const burstDiv = document.getElementById('burst');

            if(result){
                resultDiv.innerHTML = `✨<strong>${result.English}</strong>✨<br>${result.sentence}`;
                createBurst();
            } else {
                resultDiv.innerHTML = "❗該当するトレンドワードがありません。❗";
            }
        }

        function speak(){
            const text = document.getElementById('result').innerText;
            if(text !== "🌟 ここに結果が表示されます 🌟"){
                const utter = new SpeechSynthesisUtterance(text);
                utter.lang = 'en-US';
                speechSynthesis.speak(utter);
            }
        }

        document.getElementById('trendInput').addEventListener('keypress', function(e){
            if(e.key === 'Enter'){
                convertTrend(this.value.trim());
                this.value = '';
            }
        });

        function createBurst(){
            const burstDiv = document.getElementById('burst');
            const emoji = "🎉✨💥🌟";
            burstDiv.innerHTML = '';
            for(let i=0; i<20; i++){
                const span = document.createElement('span');
                span.textContent = emoji[Math.floor(Math.random() * emoji.length)];
                span.style.position = 'absolute';
                span.style.left = '50%';
                span.style.top = '50%';
                span.style.fontSize = '20px';
                span.style.animation = `burst ${1 + Math.random()}s forwards`;
                span.style.transform = `translate(${Math.random()*100 - 50}px, ${Math.random()*100 - 50}px)`;
                burstDiv.appendChild(span);
            }
            setTimeout(() => { burstDiv.innerHTML = ''; }, 1500);
        }
    </script>
</body>
</html>
```