diff --git a/index.html b/index.html
new file mode 100644
index 0000000..db0b4d3
--- /dev/null
+++ b/index.html
@@ -0,0 +1,244 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="McDonald's China IT Halloween 2025 - Join 300 MITA developers for cosplay, debugging games, and lucky draw at MITA Building 2F Pantry">
+    <title>2025 MITA Halloween</title>
+    <link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='0.9em' font-size='90'>🎃</text></svg>">
+    <style>
+        /* CSS Reset / Normalize */
+        * {
+            margin: 0;
+            padding: 0;
+            box-sizing: border-box;
+        }
+
+        /* Base Styles */
+        body {
+            background: #000000;
+            color: #00FF00;
+            font-family: "Courier New", Monaco, Consolas, Menlo, monospace;
+            line-height: 1.6;
+            padding: 20px;
+        }
+
+        .accent {
+            color: #FFBF00;
+        }
+
+        /* Typography */
+        p {
+            margin: 0.5rem 0;
+        }
+
+        /* Layout */
+        pre {
+            text-align: center;
+            line-height: 1.2;
+            color: #00FF00;
+        }
+
+        .tagline {
+            text-align: center;
+            font-size: 20px;
+            margin: 1rem 0 2rem 0;
+        }
+
+        .countdown {
+            text-align: center;
+            font-size: 24px;
+            color: #FFBF00;
+            margin: 2rem 0;
+            font-weight: bold;
+        }
+
+        .event-info p,
+        .activities p {
+            text-align: center;
+            margin: 0.5rem 0;
+        }
+
+        .decorations {
+            margin: 2rem 0;
+        }
+
+        footer {
+            text-align: center;
+            margin-top: 3rem;
+            padding: 1rem 0;
+            border-top: 1px solid #00FF00;
+        }
+
+        .ascii-mobile {
+            display: none;
+        }
+
+        .cursor {
+            animation: blink 1s step-end infinite;
+        }
+
+        @keyframes blink {
+            50% {
+                opacity: 0;
+            }
+        }
+
+        @media (prefers-reduced-motion: reduce) {
+            .cursor {
+                animation: none;
+                opacity: 1;
+            }
+        }
+
+        /* Responsive Design */
+        @media (max-width: 767px) {
+            .ascii-desktop {
+                display: none;
+            }
+
+            .ascii-mobile {
+                display: block;
+            }
+
+            body {
+                padding: 10px;
+                font-size: 14px;
+            }
+
+            .tagline {
+                font-size: 16px;
+            }
+        }
+
+        @media (min-width: 768px) and (max-width: 1023px) {
+            body {
+                font-size: 15px;
+            }
+        }
+
+    </style>
+</head>
+<body>
+    <header>
+        <pre class="ascii-desktop" aria-label="McDonald's Logo">
+     __  __      _____                   _     _ _
+    |  \/  |    |  __ \                 | |   | ( )
+    | \  / | ___| |  | | ___  _ __   __ _| | __| |/ ___
+    | |\/| |/ __| |  | |/ _ \| '_ \ / _` | |/ _` | / __|
+    | |  | | (__| |__| | (_) | | | | (_| | | (_| | \__ \
+    |_|  |_|\___|_____/ \___/|_| |_|\__,_|_|\__,_| |___/
+
+           ██████╗  ██████╗ ██╗     ██████╗ ███████╗███╗   ██╗
+          ██╔════╝ ██╔═══██╗██║     ██╔══██╗██╔════╝████╗  ██║
+          ██║  ███╗██║   ██║██║     ██║  ██║█████╗  ██╔██╗ ██║
+          ██║   ██║██║   ██║██║     ██║  ██║██╔══╝  ██║╚██╗██║
+          ╚██████╔╝╚██████╔╝███████╗██████╔╝███████╗██║ ╚████║
+           ╚═════╝  ╚═════╝ ╚══════╝╚═════╝ ╚══════╝╚═╝  ╚═══╝
+
+                 █████╗ ██████╗  ██████╗██╗  ██╗███████╗███████╗
+                ██╔══██╗██╔══██╗██╔════╝██║  ██║██╔════╝██╔════╝
+                ███████║██████╔╝██║     ███████║█████╗  ███████╗
+                ██╔══██║██╔══██╗██║     ██╔══██║██╔══╝  ╚════██║
+                ██║  ██║██║  ██║╚██████╗██║  ██║███████╗███████║
+                ╚═╝  ╚═╝╚═╝  ╚═╝ ╚═════╝╚═╝  ╚═╝╚══════╝╚══════╝</pre>
+        <pre class="ascii-mobile" aria-label="McDonald's Logo">
+    __  __      ____
+   |  \/  |    |  _ \
+   | |\/| | ___| | | |
+   | |  | |/ __| |_| |
+   |_|  |_|\___|____/
+
+   Golden Arches M</pre>
+        <p class="tagline" lang="en">i'm lovin' IT<span class="cursor">_</span></p>
+    </header>
+
+    <main>
+        <section class="countdown">
+            <div id="countdown-display" aria-live="polite" aria-atomic="true">
+                <span id="countdown-text">Loading countdown...</span>
+            </div>
+            <noscript>Enable JavaScript for live countdown</noscript>
+        </section>
+
+        <section class="event-info">
+            <p lang="en">📅 Date: October 31, 2025</p>
+            <p lang="zh-CN">日期：2025年10月31日</p>
+
+            <p lang="en">⏰ Time: 18:00 - 21:00 (6:00 PM - 9:00 PM) GMT+8</p>
+            <p lang="zh-CN">时间：18:00 - 21:00</p>
+
+            <p lang="en">📍 Location: MITA Building 2F Pantry</p>
+            <p lang="zh-CN">地点：MITA大厦2楼茶水间</p>
+
+            <p lang="en">👤 Organizer: Jessi Pan (jessi.pan@cn.mcd.com)</p>
+            <p lang="zh-CN">组织者：Jessi Pan (jessi.pan@cn.mcd.com)</p>
+        </section>
+
+        <section class="activities">
+            <p lang="en">🎭 Activities:</p>
+            <p lang="zh-CN">活动：</p>
+
+            <p lang="en">• Cosplay (costumes encouraged!)</p>
+            <p lang="zh-CN">• 角色扮演（鼓励穿戏服！）</p>
+
+            <p lang="en">• Bug Debugging Games</p>
+            <p lang="zh-CN">• Bug调试游戏</p>
+
+            <p lang="en">• Lucky Draw</p>
+            <p lang="zh-CN">• 幸运抽奖</p>
+
+            <p lang="en">🍔 Food and drinks will be provided!</p>
+            <p lang="zh-CN">将提供食物和饮料！</p>
+        </section>
+
+        <section class="decorations">
+            <pre>
+    🎃     👻     🦇     🎃     👻     🦇     🎃
+            </pre>
+        </section>
+    </main>
+
+    <footer>
+        <p>McDonald's IT Academy</p>
+    </footer>
+
+    <script>
+        // Countdown timer for Halloween event
+        // Target: Oct 31 2025 18:00 GMT+8 (which is 10:00 UTC)
+        const targetDate = new Date('2025-10-31T10:00:00Z');
+        const eventEnd = new Date('2025-10-31T13:00:00Z'); // 21:00 GMT+8
+
+        function updateCountdown() {
+            const now = new Date();
+            const countdownElement = document.getElementById('countdown-text');
+
+            // Check if event has ended
+            if (now >= eventEnd) {
+                countdownElement.textContent = '👻 EVENT COMPLETED - Thanks for joining! 👻';
+                return;
+            }
+
+            // Check if event has started
+            if (now >= targetDate) {
+                countdownElement.textContent = '🎃 EVENT STARTING NOW! 🎃';
+                return;
+            }
+
+            // Calculate time remaining
+            const diff = targetDate - now;
+            const days = Math.floor(diff / (1000 * 60 * 60 * 24));
+            const hours = Math.floor((diff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
+            const minutes = Math.floor((diff % (1000 * 60 * 60)) / (1000 * 60));
+            const seconds = Math.floor((diff % (1000 * 60)) / 1000);
+
+            // Display countdown
+            countdownElement.textContent = `${days}d ${hours}h ${minutes}m ${seconds}s until Halloween!`;
+        }
+
+        // Update countdown immediately and then every second
+        updateCountdown();
+        setInterval(updateCountdown, 1000);
+    </script>
+</body>
+</html>
