(cd "$(git rev-parse --show-toplevel)" && git apply --3way <<'EOF' 
diff --git a/index.html b/index.html
index 0a2994c54a8a2ef6fc15194ca431efdf9207b8a5..be79ef544082e115e5754ff22cd49cd1154289ac 100644
--- a/index.html
+++ b/index.html
@@ -1,219 +1,83 @@
  (cd "$(git rev-parse --show-toplevel)" && git apply --3way <<'EOF' 
 diff --git a/index.html b/index.html
-index 8d440c0d4a65dcf4cbca33bd7ec775bf35f23e07..3e39901d6720672b29506ca3f878655f56bf27aa 100644
+index 8d440c0d4a65dcf4cbca33bd7ec775bf35f23e07..dbdf64fd5e52052846258af2d76e7dc190979c26 100644
 --- a/index.html
 +++ b/index.html
-@@ -889,92 +889,92 @@ body {
-   <div id="loginModal" class="modal">
-     <div class="modal-content">
-       <span class="close absolute top-4 right-6 text-2xl text-slate-400 hover:text-primary cursor-pointer" onclick="closeModal('loginModal')">&times;</span>
-       <div class="text-center mb-8">
-         <div class="w-16 h-16 bg-gradient-to-br from-primary to-secondary rounded-2xl flex items-center justify-center mx-auto mb-4">
-           <i class="ri-line-chart-line ri-2x text-dark"></i>
-         </div>
-         <h2 class="text-3xl font-bold text-white mb-2">Welcome Back</h2>
-         <p class="text-slate-300">Continue your trading journey</p>
-       </div>
-       
-       <button onclick="signInWithGoogle()" class="w-full glass-effect border border-white/20 py-4 rounded-2xl text-white font-semibold mb-6 hover:border-primary/50 transition-all">
-         <i class="ri-google-line mr-3"></i>Continue with Google
-       </button>
-       
-       <div class="relative text-center mb-6">
-         <div class="absolute inset-0 flex items-center">
-           <div class="w-full border-t border-white/10"></div>
-         </div>
-         <div class="relative bg-[#10142B] px-4">
-           <span class="text-slate-400 text-sm">or</span>
-         </div>
-       </div>
-       
-       <div class="space-y-4 mb-6">
--        <input type="email" id="loginEmail" class="w-full p-4 bg-white/5 border border-white/10 rounded-2xl text-white placeholder-slate-400 focus:border-primary/50 focus:outline-none transition-colors" placeholder="Email address">
--        <input type="password" id="loginPassword" class="w-full p-4 bg-white/5 border border-white/10 rounded-2xl text-white placeholder-slate-400 focus:border-primary/50 focus:outline-none transition-colors" placeholder="Password">
-+        <input type="email" id="loginEmail" class="w-full p-4 bg-white/5 border border-white/10 rounded-2xl text-white placeholder-slate-400 focus:border-primary/50 focus:outline-none transition-colors" placeholder="Email address" required>
-+        <input type="password" id="loginPassword" class="w-full p-4 bg-white/5 border border-white/10 rounded-2xl text-white placeholder-slate-400 focus:border-primary/50 focus:outline-none transition-colors" placeholder="Password" required>
-       </div>
-       
-       <button onclick="signInWithEmail()" class="btn-primary w-full py-4 text-dark font-bold rounded-2xl text-lg mb-6">
-         Sign In
-       </button>
-       
-       <p class="text-center text-slate-400">
-         Don't have an account? 
-         <span class="text-primary cursor-pointer hover:underline" onclick="switchToSignup()">Sign up</span>
-       </p>
-     </div>
-   </div>
+@@ -1149,63 +1149,62 @@ window.addEventListener('click', function(event) {
+ // STRIPE PAYMENT INTEGRATION
+ const stripe = Stripe('pk_test_51RSUi0DCiVKytZUUYXBBlRTsSbnhH6Kz6pW905jkraW3KK8zr3dnUQoLUmiIcw1pTwjGbVtuCYu2ZevoZPSprqdt00xY9YODBL');
  
-   <div id="signupModal" class="modal">
-     <div class="modal-content">
-       <span class="close absolute top-4 right-6 text-2xl text-slate-400 hover:text-primary cursor-pointer" onclick="closeModal('signupModal')">&times;</span>
-       <div class="text-center mb-8">
-         <div class="w-16 h-16 bg-gradient-to-br from-primary to-secondary rounded-2xl flex items-center justify-center mx-auto mb-4">
-           <i class="ri-line-chart-line ri-2x text-dark"></i>
-         </div>
-         <h2 class="text-3xl font-bold text-white mb-2">Get Started Free</h2>
-         <p class="text-slate-300">Transform your trading today</p>
-       </div>
-       
-       <button onclick="signInWithGoogle()" class="w-full glass-effect border border-white/20 py-4 rounded-2xl text-white font-semibold mb-6 hover:border-primary/50 transition-all">
-         <i class="ri-google-line mr-3"></i>Continue with Google
-       </button>
-       
-       <div class="relative text-center mb-6">
-         <div class="absolute inset-0 flex items-center">
-           <div class="w-full border-t border-white/10"></div>
-         </div>
-         <div class="relative bg-[#10142B] px-4">
-           <span class="text-slate-400 text-sm">or</span>
-         </div>
-       </div>
-       
-       <div class="space-y-4 mb-6">
--        <input type="email" id="signupEmail" class="w-full p-4 bg-white/5 border border-white/10 rounded-2xl text-white placeholder-slate-400 focus:border-primary/50 focus:outline-none transition-colors" placeholder="Email address">
--        <input type="password" id="signupPassword" class="w-full p-4 bg-white/5 border border-white/10 rounded-2xl text-white placeholder-slate-400 focus:border-primary/50 focus:outline-none transition-colors" placeholder="Password (min 6 characters)">
-+        <input type="email" id="signupEmail" class="w-full p-4 bg-white/5 border border-white/10 rounded-2xl text-white placeholder-slate-400 focus:border-primary/50 focus:outline-none transition-colors" placeholder="Email address" required>
-+        <input type="password" id="signupPassword" class="w-full p-4 bg-white/5 border border-white/10 rounded-2xl text-white placeholder-slate-400 focus:border-primary/50 focus:outline-none transition-colors" placeholder="Password (min 6 characters)" required>
-       </div>
-       
-       <button onclick="signUpWithEmail()" class="btn-primary w-full py-4 text-dark font-bold rounded-2xl text-lg mb-6">
-         Create Account
-       </button>
-       
-       <p class="text-center text-slate-400">
-         Already have an account? 
-         <span class="text-primary cursor-pointer hover:underline" onclick="switchToLogin()">Sign in</span>
-       </p>
-     </div>
-   </div>
- 
- <script>
- // Intersection Observer for animations
- const observerOptions = {
-   threshold: 0.1,
-   rootMargin: '50px'
+ const STRIPE_PRICES = {
+   PRO_MONTHLY: 'price_1RSV3uDCiVKytZUUgEDzMKmj',
+   ELITE_MONTHLY: 'price_1RSVATDCiVKytZUUolgdGc4t'
  };
  
- const observer = new IntersectionObserver((entries) => {
-   entries.forEach(entry => {
-     if (entry.isIntersecting) {
-       entry.target.classList.add('visible');
-     }
-diff --git a/index.html b/index.html
-index 8d440c0d4a65dcf4cbca33bd7ec775bf35f23e07..3e39901d6720672b29506ca3f878655f56bf27aa 100644
---- a/index.html
-+++ b/index.html
-@@ -1023,105 +1023,109 @@ function openModal(modalId) {
- }
- 
- function closeModal(modalId) {
-   document.getElementById(modalId).classList.remove('show');
-   document.body.style.overflow = 'auto';
- }
- 
- function switchToSignup() {
-   closeModal('loginModal');
-   openModal('signupModal');
- }
- 
- function switchToLogin() {
-   closeModal('signupModal');
-   openModal('loginModal');
+ function upgradeToProMonthly() {
+   redirectToCheckout(STRIPE_PRICES.PRO_MONTHLY, 'Pro Monthly');
  }
  
- function signInWithGoogle() {
-   const provider = new window.GoogleAuthProvider();
-   window.signInWithPopup(window.auth, provider)
-     .then((result) => {
-       console.log('Google sign in successful', result.user);
-       closeModal('loginModal');
-       closeModal('signupModal');
-       showUserNav(result.user);
-+      showNotification('Signed in successfully!', 'success');
-     })
-     .catch((error) => {
-       alert('Error signing in with Google: ' + error.message);
-     });
+ function upgradeToEliteMonthly() {
+   redirectToCheckout(STRIPE_PRICES.ELITE_MONTHLY, 'Elite Monthly');
  }
  
- function signInWithEmail() {
-   const email = document.getElementById('loginEmail').value;
-   const password = document.getElementById('loginPassword').value;
-   
-   if (!email || !password) {
-     alert('Please fill in all fields');
+ async function redirectToCheckout(priceId, planName) {
+   const user = window.auth?.currentUser;
+   if (!user) {
+     alert('Please sign in first to upgrade your plan');
+     openModal('loginModal');
      return;
    }
-   
-   window.signInWithEmailAndPassword(window.auth, email, password)
-     .then((userCredential) => {
-       console.log('Email sign in successful', userCredential.user);
-       closeModal('loginModal');
-       showUserNav(userCredential.user);
-+      showNotification('Signed in successfully!', 'success');
-     })
-     .catch((error) => {
-       alert('Error signing in: ' + error.message);
-     });
- }
  
- function signUpWithEmail() {
-   const email = document.getElementById('signupEmail').value;
-   const password = document.getElementById('signupPassword').value;
-   
-   if (!email || !password) {
-     alert('Please fill in all fields');
-     return;
-   }
-   
-   if (password.length < 6) {
-     alert('Password must be at least 6 characters');
-     return;
-   }
-   
-   window.createUserWithEmailAndPassword(window.auth, email, password)
-     .then((userCredential) => {
-       console.log('Sign up successful', userCredential.user);
-       closeModal('signupModal');
-       showUserNav(userCredential.user);
-+      showNotification('Account created!', 'success');
-     })
-     .catch((error) => {
-       alert('Error creating account: ' + error.message);
+   try {
+-    const { error } = await stripe.redirectToCheckout({
+-      lineItems: [{ price: priceId, quantity: 1 }],
+-      mode: 'subscription',
+-      successUrl: window.location.origin + '/success.html',
+-      cancelUrl: window.location.origin + '/cancel.html',
+-      customerEmail: user.email,
+-      clientReferenceId: user.uid
++    const token = await user.getIdToken();
++    const res = await fetch('/api/createSubscription', {
++      method: 'POST',
++      headers: {
++        'Content-Type': 'application/json',
++        Authorization: `Bearer ${token}`,
++      },
++      body: JSON.stringify({ priceId, plan: planName }),
      });
+-
+-    if (error) {
+-      console.error('Stripe error:', error);
+-      alert('Payment error: ' + error.message);
+-    }
++    const data = await res.json();
++    if (!res.ok) throw new Error(data.error || 'Subscription failed');
++    window.location.href = data.url;
+   } catch (error) {
+     console.error('Checkout error:', error);
+     alert('Unable to process payment. Please try again.');
+   }
  }
  
- function signOutUser() {
-   window.signOut(window.auth).then(() => {
-     hideUserNav();
-     console.log('User signed out');
-+    showNotification('Signed out', 'info');
-   });
- }
- 
- function showUserNav(user) {
-   document.getElementById('userEmail').textContent = user.email;
-   document.getElementById('userNav').classList.remove('hidden');
- }
- 
- function hideUserNav() {
-   document.getElementById('userNav').classList.add('hidden');
- }
- 
- function goToDashboard() {
-   window.location.href = 'dashboard.html';
- }
- 
- function showDemo() {
-   alert('Demo video coming soon! Sign up to get notified when it\'s ready.');
- }
+ // Keyboard shortcuts
+ document.addEventListener('keydown', function(e) {
+   // Escape key closes modals
+   if (e.key === 'Escape') {
+     closeModal('loginModal');
+     closeModal('signupModal');
+   }
+ });
+ 
+ // Remove the parallax effect that's causing the shaking
+ // window.addEventListener('scroll', () => {
+ //   const scrolled = window.pageYOffset;
+ //   const parallax = document.querySelector('.hero-grid');
+ //   if (parallax) {
+ //     const speed = scrolled * 0.5;
+ //     parallax.style.transform = `translateY(${speed}px)`;
+ //   }
+ // });
  
- // Check authentication state
- window.addEventListener('load', function() {
-   if (window.onAuthStateChanged && window.auth) {
-     window.onAuthStateChanged(window.auth, (user) => {
-       if (user) {
  
 EOF
 )
 
EOF
)