Add landing page, Docker setup, and CI/CD pipeline

React + Vite + TypeScript + Tailwind frontend with landing page,
Docker Compose for dev and prod (nginx-proxy integration),
and Gitea Actions workflow for automated deployment.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

frontend/src/App.tsx

@@ -0,0 +1,101 @@
+import {
+  TrendingUp,
+  Shield,
+  Smartphone,
+  BarChart3,
+  Wallet,
+  ArrowRight,
+} from 'lucide-react';
+
+function App() {
+  return (
+    <div className="min-h-screen bg-slate-950 text-white">
+      {/* Nav */}
+      <nav className="border-b border-slate-800/60 backdrop-blur-sm sticky top-0 z-50 bg-slate-950/80">
+        <div className="max-w-6xl mx-auto px-6 py-4 flex items-center justify-between">
+          <div className="flex items-center gap-2.5">
+            <div className="w-9 h-9 rounded-lg bg-gradient-to-br from-emerald-400 to-cyan-400 flex items-center justify-center">
+              <Wallet className="w-5 h-5 text-slate-950" strokeWidth={2.5} />
+            </div>
+            <span className="text-xl font-bold tracking-tight">
+              Wealthy<span className="text-emerald-400">Smart</span>
+            </span>
+          </div>
+          <span className="text-xs font-medium text-slate-500 border border-slate-800 rounded-full px-3 py-1">
+            Coming Soon
+          </span>
+        </div>
+      </nav>
+
+      {/* Hero */}
+      <section className="max-w-6xl mx-auto px-6 pt-24 pb-20">
+        <div className="max-w-2xl">
+          <div className="inline-flex items-center gap-2 text-emerald-400 text-sm font-medium mb-6 bg-emerald-400/10 rounded-full px-4 py-1.5">
+            <TrendingUp className="w-4 h-4" />
+            Personal Finance, Simplified
+          </div>
+          <h1 className="text-5xl sm:text-6xl font-extrabold leading-[1.1] tracking-tight mb-6">
+            Take control of your{' '}
+            <span className="bg-gradient-to-r from-emerald-400 to-cyan-400 bg-clip-text text-transparent">
+              financial future
+            </span>
+          </h1>
+          <p className="text-lg text-slate-400 leading-relaxed mb-10 max-w-xl">
+            Budget tracking, investment management, and financial insights — all
+            in one place. Built to replace spreadsheets with something smarter.
+          </p>
+          <div className="flex items-center gap-3">
+            <div className="inline-flex items-center gap-2 bg-emerald-500 hover:bg-emerald-400 text-slate-950 font-semibold px-6 py-3 rounded-lg transition-colors">
+              Get Started
+              <ArrowRight className="w-4 h-4" />
+            </div>
+          </div>
+        </div>
+      </section>
+
+      {/* Features */}
+      <section className="max-w-6xl mx-auto px-6 pb-24">
+        <div className="grid md:grid-cols-3 gap-6">
+          {[
+            {
+              icon: BarChart3,
+              title: 'Budget Tracking',
+              desc: 'Track income, expenses, and savings across multiple accounts and currencies with real-time balance updates.',
+            },
+            {
+              icon: Shield,
+              title: 'Investments & Pensions',
+              desc: 'Monitor your portfolio, pension funds, and long-term savings all in a single dashboard.',
+            },
+            {
+              icon: Smartphone,
+              title: 'Mobile First',
+              desc: 'Check and edit your finances on the go. Designed to work seamlessly on any device.',
+            },
+          ].map(({ icon: Icon, title, desc }) => (
+            <div
+              key={title}
+              className="group border border-slate-800/60 rounded-xl p-6 hover:border-emerald-500/30 transition-colors bg-slate-900/40"
+            >
+              <div className="w-10 h-10 rounded-lg bg-emerald-400/10 flex items-center justify-center mb-4 group-hover:bg-emerald-400/20 transition-colors">
+                <Icon className="w-5 h-5 text-emerald-400" />
+              </div>
+              <h3 className="text-lg font-semibold mb-2">{title}</h3>
+              <p className="text-sm text-slate-400 leading-relaxed">{desc}</p>
+            </div>
+          ))}
+        </div>
+      </section>
+
+      {/* Footer */}
+      <footer className="border-t border-slate-800/60 py-8">
+        <div className="max-w-6xl mx-auto px-6 flex items-center justify-between text-sm text-slate-500">
+          <span>&copy; {new Date().getFullYear()} WealthySmart</span>
+          <span>wealthy.cescalante.dev</span>
+        </div>
+      </footer>
+    </div>
+  );
+}
+
+export default App;