diff --git a/app/portal/page.tsx b/app/portal/page.tsx
index df231159..849f2d85 100644
--- a/app/portal/page.tsx
+++ b/app/portal/page.tsx
@@ -1,12 +1,288 @@
-// app/portal/page.tsx
-export default function PortalHome() {
+"use client";
+
+import { motion } from "framer-motion";
+import Link from "next/link";
+import {
+    ArrowRight,
+    CheckCircle2,
+    CircleX,
+    HeartHandshake,
+    HandCoins,
+    Coffee,
+    ShieldCheck,
+    Users,
+    Video,
+    Sparkles,
+} from "lucide-react";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { Button } from "@/components/ui/button";
+import { Badge } from "@/components/ui/badge";
+import { Progress } from "@/components/ui/progress";
+import { Separator } from "@/components/ui/separator";
+
+/**
+ * App Dashboard: Support CTA
+ * -------------------------------------------------
+ * This page is the first thing signed‑in users see. It makes a heartfelt,
+ * transparent pitch for community funding to keep Laser Everything + MakeArmy
+ * free and ad‑independent.
+ *
+ * Quick wiring:
+ *  - If you have live funding data, replace the GOAL and CURRENT below or
+ *    fetch dynamically in a useEffect.
+ */
+const GOAL = 5000; // monthly goal in USD (adjust as needed)
+const CURRENT = 0; // replace with live value if available
+
+const perks = [
+    { icon: <ShieldCheck className="h-5 w-5" />, text: "No ads. No sponsors. No affiliates." },
+{ icon: <Users className="h-5 w-5" />, text: "Community‑funded, community‑first priorities." },
+{ icon: <Video className="h-5 w-5" />, text: "Videos, tools, and guides stay open for all." },
+];
+
+const supportTiers = [
+    {
+        name: "Laser Master Academy",
+        href: "https://masters.lasereverything.net",
+        icon: <Sparkles className="h-6 w-6" />,
+        blurb:
+        "Our flagship learning community on MightyNetworks: structured courses, AMAs, and deeper mentorship.",
+        perks: ["In‑depth lessons", "Member Q&A", "Early access when available"],
+        cta: "Join the Academy",
+    },
+{
+    name: "Patreon",
+    href: "https://www.patreon.com/c/LaserEverything",
+    icon: <HeartHandshake className="h-6 w-6" />,
+    blurb:
+    "Flexible monthly support to underwrite videos, research, and open tools without monetization strings.",
+    perks: ["Support milestones", "Behind‑the‑scenes notes", "Community shout‑outs"],
+    cta: "Back on Patreon",
+},
+{
+    name: "Ko‑Fi",
+    href: "https://ko-fi.com/lasereverything",
+    icon: <Coffee className="h-6 w-6" />,
+    blurb:
+    "One‑time tips that go straight to hosting, development, and production costs—no paywall, just fuel.",
+    perks: ["Say thanks once", "Help cover a bill", "Keep it free for others"],
+    cta: "Tip on Ko‑Fi",
+},
+];
+
+const adVsCommunity = {
+    ads: [
+        "Algorithm‑shaped content",
+        "Sponsor talking points",
+        "Affiliate bias risk",
+        "Tracking and interruptions",
+    ],
+    community: [
+        "Curriculum set by makers",
+        "Honest reviews & hard truths",
+        "Open tools without strings",
+        "Privacy‑respecting experience",
+    ],
+};
+
+export default function Page() {
+    const pct = Math.max(0, Math.min(100, Math.round((CURRENT / GOAL) * 100)));
+
     return (
-        <div className="rounded-lg border p-6">
-        <h2 className="text-xl font-semibold mb-2">Dashboard</h2>
-        <p className="opacity-80">
-        Pick a tab to get started. You can add and manage Rigs, Laser Settings, Sources, Materials, Projects,
-        or jump into Utilities and Account.
+        <div className="min-h-[calc(100dvh-4rem)] w-full">
+        {/* Hero */}
+        <section className="relative isolate overflow-hidden">
+        <div className="pointer-events-none absolute inset-0 bg-gradient-to-br from-slate-900 via-slate-800 to-slate-900" />
+        <div className="relative mx-auto max-w-6xl px-6 py-16 sm:py-20">
+        <motion.div
+        initial={{ opacity: 0, y: 12 }}
+        animate={{ opacity: 1, y: 0 }}
+        transition={{ duration: 0.5 }}
+        className="text-center"
+        >
+        <Badge variant="secondary" className="mb-4">
+        Community‑Funded • Ad‑Free • Open Resources
+        </Badge>
+        <h1 className="text-4xl font-extrabold tracking-tight text-white sm:text-5xl">
+        Keep Laser Everything & MakeArmy <span className="text-teal-300">free</span> for everyone
+        </h1>
+        <p className="mx-auto mt-4 max-w-3xl text-balance text-base text-slate-200 sm:text-lg">
+        The videos, tools, and docs you use today exist because previous supporters paid it forward.
+        If we hit our monthly goal together, we can stay independent—no ads, no sponsors, no affiliate strings.
         </p>
+
+        {/* Progress */}
+        <div className="mx-auto mt-8 max-w-xl rounded-2xl bg-white/5 p-6 shadow-lg ring-1 ring-white/10 backdrop-blur">
+        <div className="flex items-end justify-between">
+        <div>
+        <p className="text-sm text-slate-300">This month’s goal</p>
+        <p className="text-2xl font-semibold text-white">${GOAL.toLocaleString()}</p>
+        </div>
+        <div className="text-right">
+        <p className="text-sm text-slate-300">Funded</p>
+        <p className="text-2xl font-semibold text-teal-300">{pct}%</p>
+        </div>
+        </div>
+        <Progress value={pct} className="mt-3 h-3" />
+        <p className="mt-3 text-xs text-slate-300">
+        Live totals coming soon. Your support directly underwrites hosting, development, and production.
+        </p>
+        </div>
+
+        {/* Quick CTA */}
+        <div className="mt-6 flex flex-wrap items-center justify-center gap-3">
+        <Button asChild size="lg" className="rounded-2xl">
+        <Link href="https://masters.lasereverything.net" target="_blank" rel="noopener noreferrer">
+        Join Laser Master Academy <ArrowRight className="ml-2 h-4 w-4" />
+        </Link>
+        </Button>
+        <Button asChild variant="secondary" size="lg" className="rounded-2xl">
+        <Link href="https://www.patreon.com/c/LaserEverything" target="_blank" rel="noopener noreferrer">
+        Back on Patreon
+        </Link>
+        </Button>
+        <Button asChild variant="outline" size="lg" className="rounded-2xl border-white/30 text-white hover:bg-white/10">
+        <Link href="https://ko-fi.com/lasereverything" target="_blank" rel="noopener noreferrer">
+        Tip on Ko‑Fi
+        </Link>
+        </Button>
+        </div>
+
+        {/* Trust perks */}
+        <ul className="mx-auto mt-6 grid max-w-2xl grid-cols-1 gap-3 sm:grid-cols-3">
+        {perks.map((p, i) => (
+            <li key={i} className="flex items-center justify-center gap-2 text-slate-200">
+            {p.icon}
+            <span className="text-sm">{p.text}</span>
+            </li>
+        ))}
+        </ul>
+        </motion.div>
+        </div>
+        </section>
+
+        {/* Support Options */}
+        <section className="mx-auto -mt-8 max-w-6xl px-6 pb-12">
+        <motion.div
+        initial={{ opacity: 0, y: 12 }}
+        whileInView={{ opacity: 1, y: 0 }}
+        viewport={{ once: true }}
+        transition={{ duration: 0.5 }}
+        className="rounded-3xl border bg-card p-6 shadow-sm sm:p-8"
+        >
+        <div className="mx-auto max-w-3xl text-center">
+        <h2 className="text-2xl font-bold tracking-tight sm:text-3xl">How you can help—pick what fits</h2>
+        <p className="mt-2 text-muted-foreground">
+        Whether you join the Academy, pledge monthly, or tip once, every contribution sustains the whole community.
+        </p>
+        </div>
+
+        <div className="mt-8 grid grid-cols-1 gap-6 md:grid-cols-3">
+        {supportTiers.map((tier) => (
+            <Card key={tier.name} className="group rounded-2xl transition hover:shadow-lg">
+            <CardHeader>
+            <div className="mb-2 flex items-center gap-2 text-teal-600 dark:text-teal-400">
+            {tier.icon}
+            <CardTitle className="text-lg">{tier.name}</CardTitle>
+            </div>
+            <p className="text-sm text-muted-foreground">{tier.blurb}</p>
+            </CardHeader>
+            <CardContent>
+            <ul className="space-y-2 text-sm">
+            {tier.perks.map((perk) => (
+                <li key={perk} className="flex items-center gap-2">
+                <CheckCircle2 className="h-4 w-4" /> {perk}
+                </li>
+            ))}
+            </ul>
+            <Button asChild className="mt-4 w-full rounded-xl">
+            <Link href={tier.href} target="_blank" rel="noopener noreferrer">
+            {tier.cta}
+            </Link>
+            </Button>
+            </CardContent>
+            </Card>
+        ))}
+        </div>
+
+        {/* Philosophy: Ads vs Community */}
+        <div className="mt-10">
+        <div className="mx-auto max-w-3xl text-center">
+        <h3 className="text-xl font-semibold">Why not just run ads & sponsors?</h3>
+        <p className="mt-2 text-sm text-muted-foreground">
+        Because it quietly changes what we make and who we serve. We’d rather be accountable to you.
+        </p>
+        </div>
+
+        <div className="mt-6 grid grid-cols-1 gap-6 md:grid-cols-2">
+        <Card className="rounded-2xl">
+        <CardHeader>
+        <div className="flex items-center gap-2 text-rose-600 dark:text-rose-400">
+        <CircleX className="h-5 w-5" />
+        <CardTitle className="text-base">Advertising / Sponsorship Model</CardTitle>
+        </div>
+        </CardHeader>
+        <CardContent>
+        <ul className="space-y-2 text-sm text-muted-foreground">
+        {adVsCommunity.ads.map((t) => (
+            <li key={t} className="flex items-center gap-2">
+            <CircleX className="h-4 w-4" /> {t}
+            </li>
+        ))}
+        </ul>
+        </CardContent>
+        </Card>
+
+        <Card className="rounded-2xl border-teal-600/30">
+        <CardHeader>
+        <div className="flex items-center gap-2 text-teal-700 dark:text-teal-300">
+        <CheckCircle2 className="h-5 w-5" />
+        <CardTitle className="text-base">Community‑Funded Model</CardTitle>
+        </div>
+        </CardHeader>
+        <CardContent>
+        <ul className="space-y-2 text-sm">
+        {adVsCommunity.community.map((t) => (
+            <li key={t} className="flex items-center gap-2">
+            <CheckCircle2 className="h-4 w-4" /> {t}
+            </li>
+        ))}
+        </ul>
+        </CardContent>
+        </Card>
+        </div>
+        </div>
+
+        {/* Other ways */}
+        <div className="mt-10">
+        <h3 className="text-center text-xl font-semibold">No budget? No problem—here’s how to help for free</h3>
+        <div className="mx-auto mt-4 max-w-3xl">
+        <ul className="grid grid-cols-1 gap-3 sm:grid-cols-2">
+        {[
+            "Share our videos with a friend",
+            "Star + share our repos/tools",
+            "Submit laser settings & materials",
+            "Report bugs and suggest features",
+        ].map((item) => (
+            <li key={item} className="flex items-center gap-2 text-sm text-muted-foreground">
+            <HandCoins className="h-4 w-4" /> {item}
+            </li>
+        ))}
+        </ul>
+        </div>
+        </div>
+
+        <Separator className="my-10" />
+
+        {/* Closing statement */}
+        <div className="mx-auto max-w-3xl text-center">
+        <p className="text-balance text-sm text-muted-foreground">
+        Laser Everything exists because makers before you chose to keep the ladder down. If we each do a small part—
+        <span className="font-medium text-foreground"> we never need a paywall</span>.
+        </p>
+        </div>
+        </motion.div>
+        </section>
         </div>
     );
 }