diff --git a/package-lock.json b/package-lock.json
index 8f32db46..d0637e95 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -34,6 +34,7 @@
         "@fontsource-variable/nunito": "^5.2.7",
         "@fontsource-variable/outfit": "^5.2.8",
         "@fontsource-variable/playfair-display": "^5.2.8",
+        "@fontsource/bebas-neue": "^5.2.7",
         "@fontsource/bungee-shade": "^5.2.7",
         "@fontsource/caveat": "^5.2.8",
         "@fontsource/cherry-bomb-one": "^5.2.7",
@@ -1456,6 +1457,15 @@
         "url": "https://github.com/sponsors/ayuhito"
       }
     },
+    "node_modules/@fontsource/bebas-neue": {
+      "version": "5.2.7",
+      "resolved": "https://registry.npmjs.org/@fontsource/bebas-neue/-/bebas-neue-5.2.7.tgz",
+      "integrity": "sha512-DsmBrmq55d9BCU0mt4DT4RZDdH8vhWRKEUOfbuNB1EEjMuwbtFvM8N+3gIlkYSFbsb10P8Q19BV5OdpMu2h0fA==",
+      "license": "OFL-1.1",
+      "funding": {
+        "url": "https://github.com/sponsors/ayuhito"
+      }
+    },
     "node_modules/@fontsource/bungee-shade": {
       "version": "5.2.7",
       "resolved": "https://registry.npmjs.org/@fontsource/bungee-shade/-/bungee-shade-5.2.7.tgz",
diff --git a/package.json b/package.json
index 61b68826..dc4de403 100644
--- a/package.json
+++ b/package.json
@@ -41,6 +41,7 @@
     "@fontsource-variable/nunito": "^5.2.7",
     "@fontsource-variable/outfit": "^5.2.8",
     "@fontsource-variable/playfair-display": "^5.2.8",
+    "@fontsource/bebas-neue": "^5.2.7",
     "@fontsource/bungee-shade": "^5.2.7",
     "@fontsource/caveat": "^5.2.8",
     "@fontsource/cherry-bomb-one": "^5.2.7",
diff --git a/src/components/CampaignHeroBackground.tsx b/src/components/CampaignHeroBackground.tsx
deleted file mode 100644
index 7d573c55..00000000
--- a/src/components/CampaignHeroBackground.tsx
+++ /dev/null
@@ -1,114 +0,0 @@
-import { useEffect, useRef, useState } from 'react';
-
-import { sanitizeUrl } from '@/lib/sanitizeUrl';
-import { cn } from '@/lib/utils';
-interface CampaignHeroBackgroundProps {
-  /**
-   * Image URL for the active campaign. Each new URL crossfades over the
-   * previous one — we keep up to two layers mounted at a time so the
-   * transition is smooth even when the source changes mid-fade.
-   */
-  imageUrl: string | undefined;
-  /** Optional className for the outer wrapper. */
-  className?: string;
-}
-
-interface Layer {
-  /** Stable key so React doesn't tear down the layer mid-transition. */
-  id: number;
-  /** Sanitized URL (or `null` for the gradient-only fallback). */
-  url: string | null;
-}
-
-const FADE_MS = 1500;
-
-/**
- * Full-bleed crossfading background built from the active campaign's banner
- * image. Modelled after Treasures' HeroGallery: each image gets its own
- * stacked layer and we toggle opacity to crossfade. The previous layer
- * unmounts after the fade completes, so we never accumulate more than a
- * couple of layers in the DOM.
- *
- * A warm tint + subtle film-grain SVG sit on top so headlines stay readable
- * over any photo.
- */
-export function CampaignHeroBackground({ imageUrl, className }: CampaignHeroBackgroundProps) {
-  const idRef = useRef(0);
-  const [layers, setLayers] = useState<Layer[]>([]);
-  const lastUrlRef = useRef<string | null>(null);
-
-  useEffect(() => {
-    const safe = sanitizeUrl(imageUrl) ?? null;
-    if (safe === lastUrlRef.current) return;
-    lastUrlRef.current = safe;
-
-    const id = ++idRef.current;
-    // Add the new layer; existing layers stay mounted so the crossfade has
-    // something to fade from.
-    setLayers((prev) => [...prev, { id, url: safe }]);
-
-    // After the fade completes, drop everything except the most recent
-    // layer to keep the DOM tidy.
-    const timeout = window.setTimeout(() => {
-      setLayers((prev) => prev.filter((l) => l.id === id));
-    }, FADE_MS + 50);
-    return () => window.clearTimeout(timeout);
-  }, [imageUrl]);
-
-  return (
-    <div className={cn('absolute inset-0 overflow-hidden', className)} aria-hidden="true">
-      {layers.map((layer, i) => {
-        const isTop = i === layers.length - 1;
-        return (
-          <div
-            key={layer.id}
-            className="absolute inset-0"
-            style={{
-              opacity: isTop ? 1 : 0,
-              transition: `opacity ${FADE_MS}ms ease-in-out`,
-            }}
-          >
-            {layer.url ? (
-              <img
-                src={layer.url}
-                alt=""
-                loading="eager"
-                decoding="async"
-                // Slow continuous pan toward the left — pairs with the
-                // right-anchored globe so the scene reads as moving toward
-                // the headline copy.
-                className="absolute inset-0 w-full h-full object-cover hero-pan-left"
-              />
-            ) : (
-              <div className="absolute inset-0 bg-gradient-to-br from-primary/30 via-background to-secondary/40" />
-            )}
-          </div>
-        );
-      })}
-
-      {/* Dark vertical scrim — strong at the bottom (spotlight card) and
-          lighter at the top so the photo still reads. Uses black instead of
-          background so the overlay is consistent across light/dark themes. */}
-      <div className="absolute inset-0 bg-gradient-to-t from-black/80 via-black/45 to-black/15" />
-      {/* Warm primary tint — gives the hero its brand feel. */}
-      <div className="absolute inset-0 bg-gradient-to-br from-primary/20 via-transparent to-primary/10" />
-
-      {/* Left wash — mobile only, where the globe arc crosses the headline.
-          Dark so white headline text has a reliable backdrop. */}
-      <div className="absolute inset-0 bg-gradient-to-r from-black/75 via-black/35 to-transparent sm:hidden" />
-
-      {/* Film grain — same trick as Treasures' HeroGallery. Helps the
-          composited globe + photo feel like one image. */}
-      <svg
-        className="absolute inset-0 w-full h-full pointer-events-none"
-        style={{ opacity: 0.18 }}
-      >
-        <filter id="hero-grain">
-          <feTurbulence type="fractalNoise" baseFrequency="0.7" numOctaves="2" stitchTiles="stitch" />
-          <feColorMatrix type="saturate" values="0" />
-        </filter>
-        <rect width="100%" height="100%" filter="url(#hero-grain)" />
-      </svg>
-    </div>
-  );
-}
diff --git a/src/components/EditProfileForm.tsx b/src/components/EditProfileForm.tsx
index 3ecf7a9a..33495915 100644
--- a/src/components/EditProfileForm.tsx
+++ b/src/components/EditProfileForm.tsx
@@ -202,7 +202,7 @@ export const EditProfileForm: React.FC<EditProfileFormProps> = ({ onValuesChange
       // Combine existing metadata with new values
       const data: Record<string, unknown> = { ...metadata, ...standardMetadata };
 
-      // Strip any legacy avatar shape data from old Ditto-style profiles
+      // Strip any legacy avatar-shape field carried over from older clients.
       delete data.shape;
 
       // Clean up empty values in standard metadata
diff --git a/src/components/HeroCampaignSpotlight.tsx b/src/components/HeroCampaignSpotlight.tsx
deleted file mode 100644
index ed30ed9a..00000000
--- a/src/components/HeroCampaignSpotlight.tsx
+++ /dev/null
@@ -1,160 +0,0 @@
-import { Link } from 'react-router-dom';
-import { ArrowRight, MapPin, ShieldCheck } from 'lucide-react';
-
-import { Skeleton } from '@/components/ui/skeleton';
-import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar';
-import { cn } from '@/lib/utils';
-import { encodeCampaignNaddr, getCampaignCountryLabel, type ParsedCampaign } from '@/lib/campaign';
-import { sanitizeUrl } from '@/lib/sanitizeUrl';
-import { useAuthor } from '@/hooks/useAuthor';
-import { genUserName } from '@/lib/genUserName';
-import { useCampaignDonations } from '@/hooks/useCampaignDonations';
-import { useBtcPrice } from '@/hooks/useBtcPrice';
-import { formatCampaignAmount, formatUsdGoal, satsToUsd } from '@/lib/formatCampaignAmount';
-
-interface HeroCampaignSpotlightProps {
-  /** Campaign to feature. `null` renders the empty placeholder. */
-  campaign: ParsedCampaign | null;
-  /** Show a skeleton while the parent is still loading featured campaigns. */
-  isLoading?: boolean;
-  /** Extra classes for the outer wrapper. */
-  className?: string;
-}
-
-/**
- * Banner-overlay spotlight for the active campaign — title, summary,
- * author, location, and a "View campaign" CTA — rendered directly on the
- * hero photo (no card chrome). The hero photo IS the background, so this
- * component is purely a text overlay.
- *
- * Parent (`CampaignsPage`) drives the `campaign` prop, cycling on a timer
- * or pinning to whichever marker the user clicked on the globe.
- */
-export function HeroCampaignSpotlight({
-  campaign,
-  isLoading = false,
-  className,
-}: HeroCampaignSpotlightProps) {
-  // useAuthor must be called unconditionally to keep hook order stable —
-  // when there's no campaign yet we pass an empty pubkey and ignore the
-  // (no-op) result below. Same for donations + BTC price.
-  const author = useAuthor(campaign?.pubkey ?? '');
-  const { data: stats } = useCampaignDonations(campaign ?? undefined);
-  const { data: btcPrice } = useBtcPrice();
-
-  if (isLoading && !campaign) {
-    return (
-      <div className={cn('space-y-1.5', className)}>
-        <Skeleton className="h-5 w-52 bg-white/20" />
-        <Skeleton className="h-3 w-64 bg-white/20" />
-        <Skeleton className="h-3 w-40 bg-white/20" />
-      </div>
-    );
-  }
-
-  if (!campaign) return null;
-
-  const naddr = encodeCampaignNaddr(campaign);
-  const meta = author.data?.metadata;
-  const authorName = meta?.display_name || meta?.name || genUserName(campaign.pubkey);
-  const authorPicture = sanitizeUrl(meta?.picture);
-  const countryLabel = getCampaignCountryLabel(campaign);
-  const isSilentPayment = campaign.wallet.mode === 'sp';
-
-  return (
-    <div
-      className={cn(
-        // Compact text block over the photo — always white regardless of
-        // theme since the hero is always a dark-scrimed photo.
-        'space-y-1.5 text-white hero-text-shadow-soft',
-        className,
-      )}
-    >
-      <p className="text-base font-semibold leading-snug line-clamp-1">
-        {campaign.title}
-      </p>
-
-      {campaign.summary && (
-        <p className="text-xs text-white/80 line-clamp-2 max-w-xs">
-          {campaign.summary}
-        </p>
-      )}
-
-      {/* Progress / goal. Hand-rolled instead of using <CampaignProgress>
-          so we can tune the bar for legibility on top of a photo: dark
-          translucent track, glowing primary fill. When the campaign has no
-          goal tag, the bar is omitted entirely and we only show the raised
-          total. Silent-payment campaigns hide totals by design (per
-          NIP.md Kind 33863). */}
-      {isSilentPayment ? (
-        <div className="space-y-1.5 pt-1 max-w-xs">
-          <div className="inline-flex items-center gap-1.5 text-[11px] text-white/85 [text-shadow:none]">
-            <ShieldCheck className="size-3" />
-            <span>Private campaign — totals not public</span>
-          </div>
-          {campaign.goalUsd && campaign.goalUsd > 0 && (
-            <div className="text-[11px] text-white/70 [text-shadow:none]">
-              Target: {formatUsdGoal(campaign.goalUsd)}
-            </div>
-          )}
-        </div>
-      ) : (() => {
-        const raised = stats?.totalSats ?? 0;
-        const goal = campaign.goalUsd;
-        const hasGoal = !!goal && goal > 0;
-        const raisedUsd = satsToUsd(raised, btcPrice);
-        const pct = hasGoal && raisedUsd !== undefined
-          ? Math.min(100, Math.round((raisedUsd / goal!) * 100))
-          : 0;
-        return (
-          <div className="space-y-1.5 pt-1 max-w-xs">
-            {hasGoal && (
-              <div className="relative h-1.5 w-full overflow-hidden rounded-full bg-black/40 ring-1 ring-white/15">
-                <div
-                  className="absolute inset-y-0 left-0 rounded-full bg-primary shadow-[0_0_8px_hsl(var(--primary)/0.7)] motion-safe:transition-[width] motion-safe:duration-500"
-                  style={{ width: `${pct}%` }}
-                />
-              </div>
-            )}
-            <div className="flex items-baseline justify-between gap-2 text-[11px] [text-shadow:none]">
-              <span className="font-semibold text-white">
-                {formatCampaignAmount(raised, btcPrice)}
-                {!hasGoal && <span className="ml-1 font-normal text-white/70">raised</span>}
-              </span>
-              {hasGoal && (
-                <span className="text-white/70">
-                  of {formatUsdGoal(goal!)} goal
-                </span>
-              )}
-            </div>
-          </div>
-        );
-      })()}
-
-      <div className="flex flex-wrap items-center gap-x-3 gap-y-1 text-[11px] text-white/75 pt-0.5">
-        <span className="inline-flex items-center gap-1.5">
-          <Avatar className="size-4 ring-1 ring-white/40">
-            {authorPicture && <AvatarImage src={authorPicture} alt="" />}
-            <AvatarFallback className="text-[8px]">
-              {authorName.slice(0, 2).toUpperCase()}
-            </AvatarFallback>
-          </Avatar>
-          <span className="font-medium">{authorName}</span>
-        </span>
-        {countryLabel && (
-          <span className="inline-flex items-center gap-1">
-            <MapPin className="size-3" />
-            <span className="truncate max-w-[16ch]">{countryLabel}</span>
-          </span>
-        )}
-        <Link
-          to={`/${naddr}`}
-          className="inline-flex items-center gap-1 font-medium text-primary hover:text-primary/80 focus-visible:outline-none focus-visible:underline"
-        >
-          View
-          <ArrowRight className="size-3" />
-        </Link>
-      </div>
-    </div>
-  );
-}
diff --git a/src/components/HeroGlobe.tsx b/src/components/HeroGlobe.tsx
deleted file mode 100644
index 5ae00717..00000000
--- a/src/components/HeroGlobe.tsx
+++ /dev/null
@@ -1,470 +0,0 @@
-import type { CSSProperties } from 'react';
-import { useEffect, useMemo, useRef } from 'react';
-
-import { LAND_RINGS } from '@/lib/landPolygons';
-import { HOPE_PALETTE, type HopeHue } from '@/lib/hopePalette';
-
-/** Geographic point used by the globe projection. */
-interface GeoPoint {
-  /** Latitude in degrees, [-90, 90]. */
-  lat: number;
-  /** Longitude in degrees, [-180, 180]. */
-  lng: number;
-}
-
-/**
- * Visual variant for a globe marker. Each kind gets its own glyph + halo
- * so the three "threads" of Discover — campaigns, communities, and
- * country activity — read distinctly without needing legend chrome.
- */
-export type GlobeMarkerKind = 'campaign' | 'community' | 'country-pulse';
-
-interface CampaignMarker extends GeoPoint {
-  /** Stable key for the marker (e.g. the campaign aTag). */
-  key: string;
-  /** Tooltip / accessible label shown on hover. */
-  label?: string;
-  /**
-   * Visual style of this marker. Defaults to `'campaign'` so existing
-   * callers (the campaigns hero) keep their heart markers unchanged.
-   */
-  kind?: GlobeMarkerKind;
-}
-
-interface HeroGlobeProps {
-  /** Markers to plot on top of the globe — one per geo-located campaign. */
-  markers?: CampaignMarker[];
-  /**
-   * Marker the user has selected. The selected marker gets a stronger glow
-   * and a slightly larger heart so it reads as the "live" one.
-   */
-  selectedKey?: string | null;
-  /** Fires when the user clicks a marker. */
-  onMarkerClick?: (key: string) => void;
-  /**
-   * Active hopeful hue. Drives the outer halo color and the back-lit
-   * limb tint so the globe agrees with the surrounding {@link HeroAtmosphere}.
-   */
-  hue?: HopeHue;
-  /** Optional className applied to the outer container. */
-  className?: string;
-  /** Optional inline style applied to the outer container (e.g. fluid width via `clamp()`). */
-  style?: CSSProperties;
-}
-
-/** Pre-parsed land rings as arrays of {lat, lng} points. */
-const LANDMASSES: readonly GeoPoint[][] = LAND_RINGS.map((flat) => {
-  const out: GeoPoint[] = [];
-  for (let i = 0; i < flat.length; i += 2) {
-    out.push({ lng: flat[i], lat: flat[i + 1] });
-  }
-  return out;
-});
-
-const RADIUS = 285;
-const CENTER = 300;
-/** Seconds per full revolution. Slow on purpose so the motion is ambient. */
-const ROTATION_PERIOD_SECONDS = 140;
-
-/**
- * Orthographic projection: turns a (lat, lng) pair into 2D screen
- * coordinates plus a `z` depth value. Points with `z <= 0` are on the
- * back hemisphere and should be hidden (or drawn with low opacity).
- */
-function project(lat: number, lng: number, rotationDeg: number) {
-  const phi = (lat * Math.PI) / 180;
-  // Subtract rotation so the globe appears to spin west-to-east.
-  const lambda = ((lng - rotationDeg) * Math.PI) / 180;
-  const cosPhi = Math.cos(phi);
-  const x = cosPhi * Math.sin(lambda);
-  const y = Math.sin(phi);
-  const z = cosPhi * Math.cos(lambda);
-  return {
-    x: CENTER + x * RADIUS,
-    // Negate so positive latitudes render upward in SVG.
-    y: CENTER - y * RADIUS,
-    z,
-  };
-}
-
-/**
- * Slowly-rotating SVG globe rendered with pure SVG (no WebGL, no canvas).
- *
- * Visuals are intentionally warm and hand-drawn rather than satellite/HUD:
- *  - a soft cream sphere lit from the upper-left,
- *  - sandy-amber landmasses (real Natural Earth continent shapes,
- *    pre-simplified to ~1.5k vertices), and
- *  - small glowing marker dots for active campaigns.
- *
- * Rotation is driven by `requestAnimationFrame` and applied imperatively via
- * refs so the component never re-renders during animation. Respects
- * `prefers-reduced-motion` by holding at a static angle.
- */
-export function HeroGlobe({
-  markers = [],
-  selectedKey = null,
-  onMarkerClick,
-  hue = HOPE_PALETTE[0],
-  className,
-  style,
-}: HeroGlobeProps) {
-  const landRef = useRef<SVGGElement | null>(null);
-  const markersRef = useRef<SVGGElement | null>(null);
-
-  // Stable per-ring point counts so the animation loop knows how many polygon
-  // elements to update without re-reading the DOM each frame.
-  const ringSizes = useMemo(() => LANDMASSES.map((r) => r.length), []);
-
-  // Live refs so the rAF loop can read the latest markers / selection
-  // without retriggering the effect — otherwise every spotlight tick
-  // would tear down the loop and snap rotation back to 0°.
-  const markersRefValue = useRef(markers);
-  const selectedKeyRef = useRef(selectedKey);
-  useEffect(() => {
-    markersRefValue.current = markers;
-    selectedKeyRef.current = selectedKey;
-  }, [markers, selectedKey]);
-
-  useEffect(() => {
-    const prefersReducedMotion =
-      typeof window !== 'undefined' &&
-      window.matchMedia?.('(prefers-reduced-motion: reduce)').matches;
-
-    let rafId = 0;
-    let start: number | null = null;
-
-    const tick = (timestamp: number) => {
-      if (start === null) start = timestamp;
-      const elapsedSeconds = (timestamp - start) / 1000;
-      const rotation = prefersReducedMotion
-        ? 25 // Hold at a flattering static angle.
-        : (elapsedSeconds / ROTATION_PERIOD_SECONDS) * 360;
-
-      // --- Landmass polygons ---
-      //
-      // For each ring we walk vertex-by-vertex projecting through the
-      // orthographic camera. Vertices on the *front* of the sphere
-      // (z > 0) are kept as-is. Vertices on the *back* (z < 0) would
-      // otherwise project on top of front-side land — orthographic
-      // projection collapses depth — so we drop them.
-      //
-      // Where a ring crosses the visible limb (front ↔ back) we emit an
-      // interpolated point on the limb itself, so polygons that wrap
-      // around the side of the globe close cleanly along the sphere's
-      // outline instead of cutting across the disc interior.
-      //
-      // We also fade rings out over a narrow band near the limb so they
-      // don't pop on/off when crossing z = 0. Anything with maxZ below
-      // FADE_OUT is considered fully hidden; rings between FADE_OUT and
-      // FADE_IN ease in/out.
-      const FADE_OUT = 0.0;
-      const FADE_IN = 0.08;
-      const landEl = landRef.current;
-      if (landEl) {
-        const polygons = landEl.children;
-        for (let i = 0; i < LANDMASSES.length; i++) {
-          const ring = LANDMASSES[i];
-          const polygon = polygons[i] as SVGPolygonElement | undefined;
-          if (!polygon) continue;
-
-          // First pass: project every vertex, remembering z so we can
-          // detect front/back transitions cheaply.
-          const n = ring.length;
-          const xs = new Array<number>(n);
-          const ys = new Array<number>(n);
-          const zs = new Array<number>(n);
-          let maxZ = -1;
-          for (let j = 0; j < n; j++) {
-            const p = project(ring[j].lat, ring[j].lng, rotation);
-            xs[j] = p.x;
-            ys[j] = p.y;
-            zs[j] = p.z;
-            if (p.z > maxZ) maxZ = p.z;
-          }
-          if (maxZ <= FADE_OUT) {
-            polygon.setAttribute('opacity', '0');
-            continue;
-          }
-
-          // Second pass: emit only the visible portion. For each edge we
-          // include the endpoint when it's in front, and any limb-crossing
-          // we step over gets an interpolated point on the sphere edge.
-          const parts: string[] = [];
-          for (let j = 0; j < n; j++) {
-            const k = (j + 1) % n;
-            const zj = zs[j];
-            const zk = zs[k];
-            if (zj > 0) parts.push(`${xs[j].toFixed(1)},${ys[j].toFixed(1)}`);
-            if ((zj > 0) !== (zk > 0)) {
-              // Find the parameter t in [0,1] along this edge where z=0.
-              const t = zj / (zj - zk);
-              const ex = xs[j] + (xs[k] - xs[j]) * t;
-              const ey = ys[j] + (ys[k] - ys[j]) * t;
-              // Project the limb point onto the actual sphere edge so it
-              // never lands inside the disc.
-              const dx = ex - CENTER;
-              const dy = ey - CENTER;
-              const d = Math.hypot(dx, dy) || 1;
-              const lx = CENTER + (dx / d) * RADIUS;
-              const ly = CENTER + (dy / d) * RADIUS;
-              parts.push(`${lx.toFixed(1)},${ly.toFixed(1)}`);
-            }
-          }
-          if (parts.length < 3) {
-            polygon.setAttribute('opacity', '0');
-            continue;
-          }
-          polygon.setAttribute('points', parts.join(' '));
-          // Smooth fade as rings come around the limb. `fade` clamps to
-          // [0,1] over the narrow FADE_OUT→FADE_IN band, then we keep
-          // adding the small depth-based dimming used before.
-          const fade = Math.min(1, Math.max(0, (maxZ - FADE_OUT) / (FADE_IN - FADE_OUT)));
-          polygon.setAttribute('opacity', (fade * Math.min(1, 0.55 + maxZ * 0.55)).toFixed(2));
-        }
-      }
-
-      // --- Campaign markers ---
-      const markersEl = markersRef.current;
-      const liveMarkers = markersRefValue.current;
-      const liveSelectedKey = selectedKeyRef.current;
-      if (markersEl) {
-        const groups = markersEl.children;
-        for (let i = 0; i < liveMarkers.length; i++) {
-          const m = liveMarkers[i];
-          const group = groups[i] as SVGGElement | undefined;
-          if (!group) continue;
-          const p = project(m.lat, m.lng, rotation);
-          if (p.z <= 0) {
-            group.setAttribute('opacity', '0');
-            // Pull off-canvas so backside markers don't intercept clicks.
-            group.setAttribute('transform', 'translate(-1000 -1000)');
-            continue;
-          }
-          // Selected marker scales up subtly to read as "you are here".
-          const scale = m.key === liveSelectedKey ? 1.35 : 1;
-          group.setAttribute(
-            'transform',
-            `translate(${p.x.toFixed(2)} ${p.y.toFixed(2)}) scale(${scale})`,
-          );
-          group.setAttribute('opacity', (0.55 + p.z * 0.45).toFixed(2));
-        }
-      }
-
-      if (!prefersReducedMotion) {
-        rafId = requestAnimationFrame(tick);
-      }
-    };
-
-    rafId = requestAnimationFrame(tick);
-    return () => cancelAnimationFrame(rafId);
-    // `markers` and `selectedKey` are read inside `tick` via refs above,
-    // so we deliberately omit them from this dep list to keep the
-    // rotation loop alive across spotlight cycles.
-  }, [ringSizes]);
-
-  return (
-    <div className={className} style={style}>
-      {/* Wrapper so the outer halo can sit behind the SVG. The halo is a
-          plain div (not part of the SVG) so its blur extends past the
-          sphere without needing a giant viewBox, and so we can drive it
-          with a CSS keyframe animation independent of the rotation. */}
-      <div className="relative size-full">
-        {/* Outer atmospheric halo. Scaled larger than the wrapper so light
-            spills out into the photo, blurred for softness, and tinted
-            with the active campaign's hopeful hue. Breathes slowly via
-            the .hero-globe-halo-breath class defined in index.css. */}
-        <div
-          className="hero-globe-halo-breath absolute inset-[-15%] pointer-events-none"
-          aria-hidden="true"
-          style={{
-            backgroundImage: `radial-gradient(closest-side, ${hue.glow} 0%, ${hue.rim} 30%, transparent 70%)`,
-            filter: 'blur(40px)',
-            // background-image isn't actually transitionable across
-            // gradient stops in CSS, but keeping the declaration here
-            // documents that the hue swap is driven by React re-renders
-            // synced to the HeroAtmosphere crossfade.
-          }}
-        />
-
-        <svg
-          viewBox="0 0 600 600"
-          className="relative size-full"
-          role="img"
-          aria-label="Globe showing locations of active fundraising campaigns"
-          focusable="false"
-        >
-        <defs>
-          {/* Sphere base: warm dawn gold lit from the upper-left, fading
-              into a deeper honey shadow on the lower-right. The whole
-              sphere is meant to read as "lit from within" — like the
-              moment before sunrise — not as a slab of dirt. */}
-          <radialGradient id="hero-globe-base" cx="32%" cy="28%" r="78%">
-            <stop offset="0%" stopColor="hsl(46 100% 96% / 0.92)" />
-            <stop offset="40%" stopColor="hsl(38 90% 82% / 0.82)" />
-            <stop offset="100%" stopColor="hsl(28 65% 60% / 0.72)" />
-          </radialGradient>
-          {/* Back-lit limb light. Reads as light pooling on the inside of
-              the sphere edge — Earthrise rather than satellite. Tinted
-              with the active hopeful hue, kept narrow + low-opacity so it
-              feels like atmosphere, not a neon ring. */}
-          <radialGradient id="hero-globe-rim" cx="50%" cy="50%" r="50%">
-            <stop offset="86%" stopColor={hue.rim} stopOpacity="0" />
-            <stop offset="97%" stopColor={hue.rim} stopOpacity="0.55" />
-            <stop offset="100%" stopColor={hue.glow} stopOpacity="0" />
-          </radialGradient>
-          {/* Soft highlight in the upper-left to sell the sphere shape. */}
-          <radialGradient id="hero-globe-highlight" cx="30%" cy="25%" r="35%">
-            <stop offset="0%" stopColor="hsl(50 100% 98% / 0.58)" />
-            <stop offset="100%" stopColor="hsl(50 100% 98% / 0)" />
-          </radialGradient>
-          {/* Marker glow halo. Soft, warm, no pulsing. */}
-          <radialGradient id="hero-marker-glow" cx="50%" cy="50%" r="50%">
-            <stop offset="0%" stopColor="hsl(var(--primary))" stopOpacity="0.55" />
-            <stop offset="70%" stopColor="hsl(var(--primary))" stopOpacity="0.12" />
-            <stop offset="100%" stopColor="hsl(var(--primary))" stopOpacity="0" />
-          </radialGradient>
-          {/* Stronger halo used for the selected marker so it visibly leads
-              the eye to whatever the spotlight card is currently showing. */}
-          <radialGradient id="hero-marker-glow-active" cx="50%" cy="50%" r="50%">
-            <stop offset="0%" stopColor="hsl(var(--primary))" stopOpacity="0.9" />
-            <stop offset="55%" stopColor="hsl(var(--primary))" stopOpacity="0.3" />
-            <stop offset="100%" stopColor="hsl(var(--primary))" stopOpacity="0" />
-          </radialGradient>
-          {/* Clip everything to the sphere so polygons straddling the
-              terminator don't leak outside the circle. */}
-          <clipPath id="hero-globe-clip">
-            <circle cx={CENTER} cy={CENTER} r={RADIUS} />
-          </clipPath>
-        </defs>
-
-        {/* Base sphere with light shading. */}
-        <circle cx={CENTER} cy={CENTER} r={RADIUS} fill="url(#hero-globe-base)" />
-
-        {/* Landmasses, clipped to the sphere. */}
-        <g clipPath="url(#hero-globe-clip)">
-          <g
-            ref={landRef}
-            fill="hsl(30 55% 52%)"
-            stroke="hsl(28 50% 40% / 0.25)"
-            strokeWidth="0.3"
-            strokeLinejoin="round"
-          >
-            {LANDMASSES.map((_, i) => (
-              <polygon key={i} opacity={0} />
-            ))}
-          </g>
-        </g>
-
-        {/* Warm highlight + rim shading sit above the land so the sphere
-            still reads as a lit ball, not a flat map. */}
-        <circle
-          cx={CENTER}
-          cy={CENTER}
-          r={RADIUS}
-          fill="url(#hero-globe-highlight)"
-          pointerEvents="none"
-        />
-        <circle
-          cx={CENTER}
-          cy={CENTER}
-          r={RADIUS}
-          fill="url(#hero-globe-rim)"
-          pointerEvents="none"
-        />
-
-        {/* Campaign markers — a small heart glyph with a warm glow halo.
-            Each marker is a button: clicking selects the campaign, which
-            the parent uses to populate the spotlight card.
-
-            On the Discover page the same `<g>` slots are reused for
-            community and country-pulse markers, distinguished by `m.kind`
-            and rendered with a softer glyph + halo so campaigns stay the
-            visual lead. */}
-        <g ref={markersRef}>
-          {markers.map((m) => {
-            const isSelected = m.key === selectedKey;
-            const kind: GlobeMarkerKind = m.kind ?? 'campaign';
-            return (
-              <g
-                key={m.key}
-                opacity={0}
-                transform="translate(-1000 -1000)"
-                role={onMarkerClick ? 'button' : undefined}
-                tabIndex={onMarkerClick ? 0 : undefined}
-                aria-label={m.label ?? 'View campaign'}
-                aria-pressed={onMarkerClick ? isSelected : undefined}
-                onClick={onMarkerClick ? () => onMarkerClick(m.key) : undefined}
-                onKeyDown={
-                  onMarkerClick
-                    ? (e) => {
-                        if (e.key === 'Enter' || e.key === ' ') {
-                          e.preventDefault();
-                          onMarkerClick(m.key);
-                        }
-                      }
-                    : undefined
-                }
-                style={{
-                  cursor: onMarkerClick ? 'pointer' : undefined,
-                  outline: 'none',
-                }}
-              >
-                {kind === 'campaign' ? (
-                  <>
-                    {/* Glow halo (stronger for the active marker). */}
-                    <circle
-                      r={isSelected ? 16 : 12}
-                      fill={`url(#hero-marker-glow${isSelected ? '-active' : ''})`}
-                    />
-                    {/* Heart glyph. Path is centered at the origin (~14×12 units)
-                        so the parent <g>'s translate+scale lands it on the globe. */}
-                    <path
-                      d="M0,3.5 C-3.5,1 -7,-1.5 -7,-4.5 C-7,-7 -5,-8.5 -3,-8.5 C-1.5,-8.5 -0.5,-7.5 0,-6.5 C0.5,-7.5 1.5,-8.5 3,-8.5 C5,-8.5 7,-7 7,-4.5 C7,-1.5 3.5,1 0,3.5 Z"
-                      fill="hsl(var(--primary))"
-                      stroke="hsl(40 100% 98%)"
-                      strokeWidth="0.6"
-                      strokeLinejoin="round"
-                    />
-                    {/* Tiny inner highlight to make the heart pop on the warm
-                        landmass without needing a heavy outline. */}
-                    <ellipse cx={-2.5} cy={-5.5} rx={1.5} ry={1} fill="hsl(40 100% 98% / 0.55)" />
-                  </>
-                ) : kind === 'community' ? (
-                  <>
-                    {/* Community: a softly-glowing ring. Reads as a circle of
-                        people, gathered. Smaller than the heart so campaigns
-                        stay the dominant signal. */}
-                    <circle r={10} fill="url(#hero-marker-glow)" />
-                    <circle
-                      r={4.2}
-                      fill="hsl(40 100% 96% / 0.92)"
-                      stroke="hsl(28 65% 45% / 0.55)"
-                      strokeWidth="0.7"
-                    />
-                    <circle r={1.4} fill="hsl(28 70% 50%)" />
-                  </>
-                ) : (
-                  <>
-                    {/* Country pulse: tiny warm sun-dot, no halo button feel.
-                        These are decorative — they trace where the world is
-                        currently posting without inviting interaction. */}
-                    <circle r={6} fill="url(#hero-marker-glow)" opacity={0.65} />
-                    <circle r={1.8} fill="hsl(38 100% 70%)" />
-                  </>
-                )}
-                {/* Transparent hit target — much easier to click/tap than the
-                    tiny visible glyph, especially on touch. */}
-                <circle
-                  r={14}
-                  fill="transparent"
-                  style={{ cursor: onMarkerClick ? 'pointer' : 'default' }}
-                />
-              </g>
-            );
-          })}
-        </g>
-      </svg>
-      </div>
-    </div>
-  );
-}
diff --git a/src/components/HeroLightningMap.tsx b/src/components/HeroLightningMap.tsx
new file mode 100644
index 00000000..490a8ab3
--- /dev/null
+++ b/src/components/HeroLightningMap.tsx
@@ -0,0 +1,278 @@
+import { memo, useId, useMemo } from 'react';
+
+import { LAND_RINGS } from '@/lib/landPolygons';
+import { cn } from '@/lib/utils';
+
+/**
+ * Decorative dark world map with glowing brand-orange Lightning arcs and
+ * pulsing city nodes. Designed as a hero backdrop on near-black surfaces:
+ * type sits comfortably over it without any text shadow.
+ *
+ * Composition (back to front):
+ *   1. Equirectangular world map drawn from {@link LAND_RINGS} — barely
+ *      lit so it reads as texture, not focus.
+ *   2. Central radial glow tinted in brand orange behind the visual
+ *      center of gravity.
+ *   3. Curated set of arcs between major cities, drawn as quadratic
+ *      Bézier paths with a flowing dash animation (the "lightning" hops).
+ *   4. Pulsing dot at every endpoint, with a soft halo.
+ *
+ * The data is intentionally curated — no campaign coupling. The map is a
+ * brand visual, not a state visualization. Arc list lives at the bottom
+ * of this file and can be swapped freely without touching layout.
+ *
+ * Pure SVG, no WebGL, no canvas. ~12 arcs + ~150 polygons — render cost
+ * is negligible. Animations honor `prefers-reduced-motion`.
+ */
+function HeroLightningMapImpl({ className }: { className?: string }) {
+  const uid = useId();
+  const arcId = (key: string) => `${uid}-${key}`;
+
+  // viewBox is the equirectangular world: 360 wide × 180 tall, recentered
+  // so (0,0) is the geographic origin. We project [lng, lat] -> [lng, -lat]
+  // (SVG y grows downward).
+  const W = 360;
+  const H = 180;
+
+  const landPaths = useMemo(() => {
+    return LAND_RINGS.map((ring, idx) => {
+      // Rings are flat [lng, lat, lng, lat, ...]. Convert to an SVG path.
+      //
+      // Antimeridian handling: a few rings (notably Russia and Antarctica
+      // in the Natural Earth source) cross the ±180° seam. The data stores
+      // those rings as a single polygon whose longitude jumps from +180 to
+      // -180 (or vice versa) in one step. Drawn naively with a continuous
+      // `L` command, that jump renders as a long horizontal slash spanning
+      // the whole equirectangular viewBox — the "two lines" sitting at
+      // ~lat 41 and ~lat 77 across the map are exactly Russia's bounding
+      // edges drawn by such a connection.
+      //
+      // Detect any longitude step > 180° and close + restart the subpath
+      // with `M` instead, so the two halves of the country render in their
+      // actual hemispheres without a connecting line through the middle.
+      let d = '';
+      let prevLng: number | null = null;
+      for (let i = 0; i < ring.length; i += 2) {
+        const lng = ring[i];
+        const lat = ring[i + 1];
+        const isFirst = i === 0;
+        const wraps = prevLng !== null && Math.abs(lng - prevLng) > 180;
+        const cmd = isFirst || wraps ? 'M' : 'L';
+        d += `${cmd}${lng.toFixed(2)} ${(-lat).toFixed(2)}`;
+        prevLng = lng;
+      }
+      d += 'Z';
+      return <path key={idx} d={d} />;
+    });
+  }, []);
+
+  // All endpoints across the curated arc set, deduplicated, so we render
+  // one pulsing node per city even if multiple arcs share it.
+  const nodes = useMemo(() => {
+    const seen = new Map<string, { lng: number; lat: number }>();
+    for (const arc of CURATED_ARCS) {
+      const a = `${arc.from[0]},${arc.from[1]}`;
+      const b = `${arc.to[0]},${arc.to[1]}`;
+      if (!seen.has(a)) seen.set(a, { lng: arc.from[0], lat: arc.from[1] });
+      if (!seen.has(b)) seen.set(b, { lng: arc.to[0], lat: arc.to[1] });
+    }
+    return Array.from(seen.values());
+  }, []);
+
+  return (
+    <div
+      className={cn('absolute inset-0 overflow-hidden pointer-events-none', className)}
+      aria-hidden="true"
+    >
+      {/* Central radial brand-orange glow. Sits behind the map texture so
+          the map reads as illuminated by it, not pasted over it. Position
+          biased slightly right so the headline column on the left stays
+          on the cooler side of the glow. */}
+      <div
+        className="absolute -inset-[10%]"
+        style={{
+          background:
+            'radial-gradient(60% 55% at 62% 45%, hsl(24 100% 55% / 0.12) 0%, hsl(24 95% 50% / 0.07) 28%, hsl(220 30% 8% / 0) 65%)',
+        }}
+      />
+
+      <svg
+        viewBox={`-${W / 2} -${H / 2} ${W} ${H}`}
+        preserveAspectRatio="xMidYMid slice"
+        className="absolute inset-0 w-full h-full"
+      >
+        <defs>
+          {/* Land fill — brand-orange wash, fully opaque. The transparency
+              lives on the wrapping <g opacity=…> below so that overlapping
+              country polygons don't stack their alpha at shared borders
+              (which is what painted the visible "latitude line" along the
+              equator and other country seams). */}
+          <linearGradient id={arcId('land')} x1="0" y1="0" x2="0" y2="1">
+            <stop offset="0%" stopColor="hsl(24 80% 50%)" />
+            <stop offset="100%" stopColor="hsl(24 70% 45%)" />
+          </linearGradient>
+
+          {/* Arc gradient — bright at midpoint, fading at endpoints, so
+              the line reads as energy traveling rather than a solid wire. */}
+          <linearGradient id={arcId('arc')} x1="0" y1="0" x2="1" y2="0">
+            <stop offset="0%" stopColor="hsl(24 100% 60%)" stopOpacity="0.0" />
+            <stop offset="35%" stopColor="hsl(24 100% 60%)" stopOpacity="0.85" />
+            <stop offset="65%" stopColor="hsl(30 100% 65%)" stopOpacity="0.85" />
+            <stop offset="100%" stopColor="hsl(30 100% 65%)" stopOpacity="0.0" />
+          </linearGradient>
+
+          {/* Glow filter for arcs and nodes — wider and softer than a CSS
+              shadow, and crucially, applied inside the SVG so it scales
+              cleanly with the viewBox. */}
+          <filter id={arcId('glow')} x="-50%" y="-50%" width="200%" height="200%">
+            <feGaussianBlur stdDeviation="1.2" result="blur" />
+            <feMerge>
+              <feMergeNode in="blur" />
+              <feMergeNode in="SourceGraphic" />
+            </feMerge>
+          </filter>
+
+          {/* Stronger glow for the nodes themselves so they punch through
+              the arcs at intersections. */}
+          <radialGradient id={arcId('node-halo')}>
+            <stop offset="0%" stopColor="hsl(30 100% 70%)" stopOpacity="0.9" />
+            <stop offset="40%" stopColor="hsl(24 100% 55%)" stopOpacity="0.45" />
+            <stop offset="100%" stopColor="hsl(24 100% 50%)" stopOpacity="0" />
+          </radialGradient>
+        </defs>
+
+        {/* Land. Each country is its own ring; rendered as separate paths
+            with semi-transparent fill, every shared country border doubles
+            up where polygons overlap. The most jarring of those overlaps
+            falls along the equator (Kenya/Tanzania, DRC/Angola, Indonesian
+            islands) and reads as a horizontal "latitude line."
+
+            Fix: paint each country with a fully-opaque fill, then put the
+            transparency on the wrapping <g opacity=…>. SVG group opacity
+            renders the children into an offscreen buffer first and then
+            composites the buffer at the group's alpha, so internal overlaps
+            don't stack. No stroke for the same reason. */}
+        <g
+          fill={`url(#${arcId('land')})`}
+          stroke="none"
+          opacity="0.18"
+        >
+          {landPaths}
+        </g>
+
+        {/* Arcs. Each arc is a quadratic Bézier with the control point
+            lifted above the great-circle path, giving the curved silhouette
+            from the reference. Stroke-dasharray + animated stroke-dashoffset
+            produces the flowing-energy effect.
+
+            `vector-effect="non-scaling-stroke"` keeps the stroke at a fixed
+            pixel width regardless of viewBox-to-screen scale, which is what
+            kills the line jitter — without it, sub-pixel stroke widths in
+            user-space combine with the SVG glow filter to shimmer at any
+            responsive size. */}
+        <g
+          fill="none"
+          stroke={`url(#${arcId('arc')})`}
+          strokeWidth="1.5"
+          strokeLinecap="round"
+          vectorEffect="non-scaling-stroke"
+          filter={`url(#${arcId('glow')})`}
+        >
+          {CURATED_ARCS.map((arc, i) => {
+            const [x1, y1] = [arc.from[0], -arc.from[1]];
+            const [x2, y2] = [arc.to[0], -arc.to[1]];
+            // Lift the control point above the chord, scaled with chord
+            // length so short arcs stay tight and trans-oceanic arcs
+            // sweep dramatically.
+            const len = Math.hypot(x2 - x1, y2 - y1);
+            const lift = Math.min(60, len * 0.42);
+            const mx = (x1 + x2) / 2;
+            const my = (y1 + y2) / 2;
+            // Push the lift toward whichever hemisphere the chord midpoint
+            // already favors, so equator-crossing arcs sweep clearly into
+            // their dominant hemisphere instead of all stacking through
+            // y=0. Pure equatorial midpoints (my≈0) default to lifting
+            // north (negative y in SVG space).
+            const direction = my > 0 ? 1 : -1;
+            const cx = mx;
+            const cy = my + lift * direction;
+            return (
+              <path
+                key={i}
+                d={`M${x1.toFixed(2)} ${y1.toFixed(2)} Q${cx.toFixed(2)} ${cy.toFixed(2)} ${x2.toFixed(2)} ${y2.toFixed(2)}`}
+                className="hero-arc-flow"
+                style={{
+                  // Stagger each arc's animation so the flow feels
+                  // organic, not lockstep.
+                  animationDelay: `${(i * 0.43).toFixed(2)}s`,
+                }}
+              />
+            );
+          })}
+        </g>
+
+        {/* City nodes. Two layers per node: a soft halo behind, a hot dot
+            in front. Halo is what reads at distance; dot is what reads up
+            close. */}
+        <g>
+          {nodes.map((n, i) => {
+            const x = n.lng;
+            const y = -n.lat;
+            return (
+              <g key={i}>
+                <circle
+                  cx={x}
+                  cy={y}
+                  r="2.2"
+                  fill={`url(#${arcId('node-halo')})`}
+                  className="hero-node-pulse"
+                  style={{ animationDelay: `${(i * 0.31).toFixed(2)}s` }}
+                />
+                <circle
+                  cx={x}
+                  cy={y}
+                  r="0.55"
+                  fill="hsl(36 100% 70%)"
+                />
+              </g>
+            );
+          })}
+        </g>
+      </svg>
+    </div>
+  );
+}
+
+export const HeroLightningMap = memo(HeroLightningMapImpl);
+
+/**
+ * Hand-picked arcs between major activist hubs across continents. Order
+ * matters only for the staggered animation start times — pairs are
+ * otherwise independent. Coordinates are `[lng, lat]` in degrees.
+ *
+ * Edit freely. Twelve arcs is roughly the sweet spot — fewer feels
+ * sparse, more turns into a tangle that competes with the headline.
+ */
+const CURATED_ARCS: ReadonlyArray<{
+  from: readonly [number, number];
+  to: readonly [number, number];
+}> = [
+  // Trans-Atlantic — North America ↔ Europe / Africa
+  { from: [-74.0, 40.7], to: [-0.1, 51.5] },     // New York → London
+  { from: [-122.4, 37.8], to: [13.4, 52.5] },    // San Francisco → Berlin
+  { from: [-79.4, 43.7], to: [2.35, 48.9] },     // Toronto → Paris
+  { from: [-0.1, 51.5], to: [3.4, 6.5] },        // London → Lagos
+  // Trans-Pacific — Americas ↔ Asia / Oceania
+  { from: [-118.2, 34.0], to: [139.7, 35.7] },   // Los Angeles → Tokyo
+  { from: [-99.1, 19.4], to: [121.5, 25.0] },    // Mexico City → Taipei
+  { from: [151.2, -33.9], to: [-122.4, 37.8] },  // Sydney → San Francisco
+  // South America bridges
+  { from: [-58.4, -34.6], to: [-43.2, -22.9] },  // Buenos Aires → Rio
+  { from: [-43.2, -22.9], to: [3.4, 6.5] },      // Rio → Lagos
+  // Asia / Africa lattice
+  { from: [77.2, 28.6], to: [55.3, 25.3] },      // Delhi → Dubai
+  { from: [55.3, 25.3], to: [31.2, 30.0] },      // Dubai → Cairo
+  { from: [31.2, 30.0], to: [13.4, 52.5] },      // Cairo → Berlin
+  { from: [103.8, 1.35], to: [121.5, 25.0] },    // Singapore → Taipei
+  { from: [18.4, -33.9], to: [3.4, 6.5] },       // Cape Town → Lagos
+];
diff --git a/src/components/ProfileCard.tsx b/src/components/ProfileCard.tsx
index fc1763de..db43f58f 100644
--- a/src/components/ProfileCard.tsx
+++ b/src/components/ProfileCard.tsx
@@ -95,6 +95,8 @@ export interface ProfileCardProps {
   onRemoveAvatar?: () => void;
   /** Show NIP-05 row (default true) */
   showNip05?: boolean;
+  /** Show NIP-58 badge showcase row (default true). */
+  showBadges?: boolean;
   /** When provided, render an editable profile fields section below bio */
   extraFields?: ProfileField[];
   onExtraFieldsChange?: (fields: ProfileField[]) => void;
@@ -107,6 +109,7 @@ export function ProfileCard({
   onPickImage,
   onRemoveAvatar,
   showNip05 = true,
+  showBadges = true,
   extraFields,
   onExtraFieldsChange,
 }: ProfileCardProps) {
@@ -332,7 +335,7 @@ export function ProfileCard({
       </div>
 
       {/* Badge showcase */}
-      {(badgeRefs.length > 0 || badgesLoading) && (
+      {showBadges && (badgeRefs.length > 0 || badgesLoading) && (
         <div className="px-4 pb-3">
           <BadgeShowcaseGrid
             items={badgeRefs.map((ref) => ({
diff --git a/src/components/ProfileRightSidebar.tsx b/src/components/ProfileRightSidebar.tsx
index f14fcb24..6cf5178e 100644
--- a/src/components/ProfileRightSidebar.tsx
+++ b/src/components/ProfileRightSidebar.tsx
@@ -82,6 +82,16 @@ interface ProfileRightSidebarProps {
   onMediaClick?: (url: string) => void;
   /** Override the root element's className (e.g. to show on mobile). */
   className?: string;
+  /**
+   * Layout variant.
+   *
+   * - `'rail'` (default) — legacy 1/4-width fixed sidebar with full-height
+   *   sticky scrolling. Designed for the old MainLayout shell.
+   * - `'inline'` — fills its parent's width with no positioning, so it can
+   *   be slotted into a grid cell or another container that manages
+   *   layout (e.g. the ProfilePage two-column body).
+   */
+  variant?: 'rail' | 'inline';
 }
 
 interface MediaItem {
@@ -495,7 +505,7 @@ function sidebarJustifiedLayout(items: MediaItem[]): { items: MediaItem[]; heigh
   return rows;
 }
 
-export function ProfileRightSidebar({ fields, pubkey, onMediaClick, className }: ProfileRightSidebarProps) {
+export function ProfileRightSidebar({ fields, pubkey, onMediaClick, className, variant = 'rail' }: ProfileRightSidebarProps) {
   const { config } = useAppContext();
   const { nostr } = useNostr();
 
@@ -534,8 +544,12 @@ export function ProfileRightSidebar({ fields, pubkey, onMediaClick, className }:
 
   const sidebarRows = useMemo(() => sidebarJustifiedLayout(media), [media]);
 
+  const rootClass = variant === 'inline'
+    ? 'flex flex-col w-full'
+    : 'w-1/4 max-w-[300px] shrink-0 hidden lg:flex flex-col sticky top-0 h-screen overflow-y-auto pt-2 pb-3 px-3';
+
   return (
-    <aside className={cn("w-1/4 max-w-[300px] shrink-0 hidden lg:flex flex-col sticky top-0 h-screen overflow-y-auto pt-2 pb-3 px-3", className)}>
+    <aside className={cn(rootClass, className)}>
       {/* Media Section — only shown when pubkey prop is provided */}
       {pubkey !== undefined && <section className="mb-6 bg-background/85 rounded-xl p-3 -mx-1">
         <h2 className="text-xl font-bold mb-3" style={{ fontFamily: 'var(--title-font-family, inherit)' }}>Media</h2>
diff --git a/src/components/profile/OrganizationsAllDialog.tsx b/src/components/profile/OrganizationsAllDialog.tsx
new file mode 100644
index 00000000..41e46eb2
--- /dev/null
+++ b/src/components/profile/OrganizationsAllDialog.tsx
@@ -0,0 +1,73 @@
+import { useState, type ReactNode } from 'react';
+import { Users } from 'lucide-react';
+
+import { Badge } from '@/components/ui/badge';
+import { Button } from '@/components/ui/button';
+import {
+  Dialog,
+  DialogContent,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
+} from '@/components/ui/dialog';
+import { ScrollArea } from '@/components/ui/scroll-area';
+import { CommunityMiniCard } from '@/components/discovery/CommunityMiniCard';
+import type { ProfileOrganization } from '@/hooks/useProfileOrganizations';
+import { cn } from '@/lib/utils';
+
+interface OrganizationsAllDialogProps {
+  /** Full list of organizations to surface in the overflow dialog. */
+  orgs: ProfileOrganization[];
+  /** Trigger element — typically a "See all N →" button. */
+  children: ReactNode;
+}
+
+/**
+ * "See all organizations" dialog used by the profile identity rail.
+ *
+ * Renders every org the profile is associated with in a scrollable
+ * 2-column grid of CommunityMiniCards with role badges. Lifted out of
+ * the (now-deleted) ProfileOrganizationsStrip so the rail can use it
+ * directly without pulling in the strip's full file.
+ */
+export function OrganizationsAllDialog({ orgs, children }: OrganizationsAllDialogProps) {
+  const [open, setOpen] = useState(false);
+
+  return (
+    <Dialog open={open} onOpenChange={setOpen}>
+      <DialogTrigger asChild>{children}</DialogTrigger>
+      <DialogContent className="max-w-2xl max-h-[80vh] flex flex-col p-0">
+        <DialogHeader className="px-6 pt-6">
+          <DialogTitle className="flex items-center gap-2">
+            <Users className="size-5 text-primary" />
+            All organizations
+            <span className="text-sm font-normal text-muted-foreground">({orgs.length})</span>
+          </DialogTitle>
+        </DialogHeader>
+        <ScrollArea className="px-6 py-4 flex-1">
+          <div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
+            {orgs.map((entry) => (
+              <div key={entry.community.aTag} className="relative">
+                <CommunityMiniCard community={entry.community} className="w-full" />
+                <Badge
+                  variant="secondary"
+                  className={cn(
+                    'absolute top-2 left-2 backdrop-blur bg-background/90 border-border/40 text-[10px] font-semibold uppercase tracking-wide',
+                    entry.isFounder ? 'text-primary' : 'text-foreground',
+                  )}
+                >
+                  {entry.isFounder ? 'Founder' : 'Moderator'}
+                </Badge>
+              </div>
+            ))}
+          </div>
+        </ScrollArea>
+        <div className="px-6 pb-6 pt-2 flex justify-end">
+          <Button variant="outline" size="sm" onClick={() => setOpen(false)}>
+            Close
+          </Button>
+        </div>
+      </DialogContent>
+    </Dialog>
+  );
+}
diff --git a/src/components/profile/ProfileActivityTab.tsx b/src/components/profile/ProfileActivityTab.tsx
new file mode 100644
index 00000000..0baa0807
--- /dev/null
+++ b/src/components/profile/ProfileActivityTab.tsx
@@ -0,0 +1,99 @@
+import { useEffect } from 'react';
+import { useInView } from 'react-intersection-observer';
+import { Loader2, Sparkles } from 'lucide-react';
+
+import { Card } from '@/components/ui/card';
+import { Skeleton } from '@/components/ui/skeleton';
+import { NoteCard } from '@/components/NoteCard';
+import { useAgoraFeed } from '@/hooks/useAgoraFeed';
+
+interface ProfileActivityTabProps {
+  pubkey: string;
+  displayName: string;
+}
+
+/**
+ * Unified profile feed scoped to one author.
+ *
+ * Pipes {@link useAgoraFeed} through with `authors=[pubkey]` AND
+ * `includeAuthorNotes: true`, so the relay-side filter pulls in:
+ *
+ *  - Agora-marked content (campaigns, pledges, communities, marked notes,
+ *    Agora-rooted comments, donation receipts), and
+ *  - every kind 1 / 6 note this author has published, regardless of the
+ *    `t:agora` marker.
+ *
+ * The two sources merge into a single chronological timeline so the
+ * profile shows "everything this person has done on the network." Replaces
+ * the previous separate Activity + Posts tabs.
+ *
+ * Single-column inside the tab area because the timeline is mixed-kind
+ * and benefits from full-width cards.
+ */
+export function ProfileActivityTab({ pubkey, displayName }: ProfileActivityTabProps) {
+  const {
+    events,
+    isLoading,
+    isFetchingNextPage,
+    hasNextPage,
+    fetchNextPage,
+  } = useAgoraFeed(true, { authors: [pubkey], includeAuthorNotes: true });
+
+  const { ref: scrollRef, inView } = useInView({ threshold: 0 });
+
+  useEffect(() => {
+    if (inView && hasNextPage && !isFetchingNextPage) {
+      fetchNextPage();
+    }
+  }, [inView, hasNextPage, isFetchingNextPage, fetchNextPage]);
+
+  if (isLoading && events.length === 0) {
+    return (
+      <div className="px-4 sm:px-6 py-6 space-y-4">
+        {Array.from({ length: 4 }).map((_, i) => (
+          <Card key={i} className="p-4 space-y-3">
+            <div className="flex items-center gap-3">
+              <Skeleton className="size-10 rounded-full" />
+              <Skeleton className="h-4 w-32" />
+            </div>
+            <Skeleton className="h-4 w-full" />
+            <Skeleton className="h-4 w-3/4" />
+          </Card>
+        ))}
+      </div>
+    );
+  }
+
+  if (events.length === 0) {
+    return (
+      <div className="px-4 sm:px-6 py-12">
+        <Card className="border-dashed">
+          <div className="py-12 px-8 text-center">
+            <Sparkles className="size-10 mx-auto mb-3 text-muted-foreground/40" />
+            <p className="text-muted-foreground max-w-sm mx-auto">
+              No activity from {displayName} yet. Posts, campaigns, pledges,
+              and donations all show up here.
+            </p>
+          </div>
+        </Card>
+      </div>
+    );
+  }
+
+  return (
+    <div>
+      <div className="divide-y divide-border">
+        {events.map((event) => (
+          <NoteCard key={event.id} event={event} />
+        ))}
+      </div>
+      {hasNextPage && (
+        <div ref={scrollRef} className="flex justify-center py-6">
+          {isFetchingNextPage && (
+            <Loader2 className="size-5 animate-spin text-muted-foreground" />
+          )}
+        </div>
+      )}
+    </div>
+  );
+}
diff --git a/src/components/profile/ProfileCampaignsTab.tsx b/src/components/profile/ProfileCampaignsTab.tsx
new file mode 100644
index 00000000..4d0cecd8
--- /dev/null
+++ b/src/components/profile/ProfileCampaignsTab.tsx
@@ -0,0 +1,222 @@
+import { useMemo, useState } from 'react';
+import { Link } from 'react-router-dom';
+import { Megaphone } from 'lucide-react';
+import { useNostr } from '@nostrify/react';
+import { useQueries } from '@tanstack/react-query';
+import type { NostrEvent } from '@nostrify/nostrify';
+
+import { CampaignCard, CampaignCardSkeleton } from '@/components/CampaignCard';
+import { Button } from '@/components/ui/button';
+import { Card } from '@/components/ui/card';
+import { useCampaignModeration } from '@/hooks/useCampaignModeration';
+import { useCampaignModerators } from '@/hooks/useCampaignModerators';
+import { useCurrentUser } from '@/hooks/useCurrentUser';
+import { useAppContext } from '@/hooks/useAppContext';
+import {
+  extractOnchainZapTxid,
+  verifyOnchainZap,
+} from '@/hooks/useOnchainZaps';
+import type { ParsedCampaign } from '@/lib/campaign';
+
+interface ProfileCampaignsTabProps {
+  pubkey: string;
+  displayName: string;
+  isOwnProfile: boolean;
+  campaigns: ParsedCampaign[];
+  isLoading: boolean;
+}
+
+type SortMode = 'top' | 'new';
+
+/**
+ * Full grid of every campaign authored by this profile.
+ *
+ * Owner / moderator can toggle "Show hidden" to see campaigns the
+ * moderation pack has hidden from the home page — visitors only see
+ * non-hidden campaigns by default. Sort modes mirror
+ * {@link AllCampaignsPage}: New (newest created_at first, the default
+ * incoming order) and Top (most sats raised, requires the verified
+ * donation totals).
+ */
+export function ProfileCampaignsTab({
+  pubkey,
+  displayName,
+  isOwnProfile,
+  campaigns,
+  isLoading,
+}: ProfileCampaignsTabProps) {
+  const { user } = useCurrentUser();
+  const { data: moderation } = useCampaignModeration();
+  const { data: moderators } = useCampaignModerators();
+  const isModerator = !!user && (moderators ?? []).includes(user.pubkey);
+
+  const [sortMode, setSortMode] = useState<SortMode>('new');
+  const [showHidden, setShowHidden] = useState(false);
+
+  const canShowHidden = isOwnProfile || isModerator;
+
+  const filtered = useMemo(() => {
+    if (canShowHidden && showHidden) return campaigns;
+    return campaigns.filter((c) => !moderation.hiddenCoords.has(c.aTag));
+  }, [campaigns, canShowHidden, showHidden, moderation.hiddenCoords]);
+
+  if (isLoading && filtered.length === 0) {
+    return (
+      <div className="px-4 sm:px-6 py-6">
+        <div className="grid grid-cols-1 sm:grid-cols-2 xl:grid-cols-3 gap-4 sm:gap-5">
+          {Array.from({ length: 3 }).map((_, i) => (
+            <CampaignCardSkeleton key={i} />
+          ))}
+        </div>
+      </div>
+    );
+  }
+
+  if (filtered.length === 0) {
+    return (
+      <div className="px-4 sm:px-6 py-12" data-pubkey={pubkey}>
+        <Card className="border-dashed">
+          <div className="py-12 px-8 text-center">
+            <Megaphone className="size-10 mx-auto mb-3 text-muted-foreground/40" />
+            <p className="text-muted-foreground max-w-sm mx-auto">
+              {isOwnProfile
+                ? "You haven't launched a campaign yet."
+                : `${displayName} hasn't launched a campaign yet.`}
+            </p>
+            {isOwnProfile && (
+              <Link
+                to="/campaigns/new"
+                className="inline-block mt-4 text-sm font-medium text-primary hover:underline"
+              >
+                Start a campaign →
+              </Link>
+            )}
+          </div>
+        </Card>
+      </div>
+    );
+  }
+
+  return (
+    <div className="px-4 sm:px-6 py-6 space-y-4">
+      <div className="flex flex-wrap items-center justify-between gap-3">
+        <p className="text-sm text-muted-foreground">
+          {filtered.length} {filtered.length === 1 ? 'campaign' : 'campaigns'}
+        </p>
+        <div className="flex items-center gap-2">
+          <Button
+            variant={sortMode === 'new' ? 'secondary' : 'ghost'}
+            size="sm"
+            onClick={() => setSortMode('new')}
+          >
+            New
+          </Button>
+          <Button
+            variant={sortMode === 'top' ? 'secondary' : 'ghost'}
+            size="sm"
+            onClick={() => setSortMode('top')}
+          >
+            Top
+          </Button>
+          {canShowHidden && (
+            <Button
+              variant={showHidden ? 'secondary' : 'ghost'}
+              size="sm"
+              onClick={() => setShowHidden((v) => !v)}
+            >
+              {showHidden ? 'Hide hidden' : 'Show hidden'}
+            </Button>
+          )}
+        </div>
+      </div>
+
+      {sortMode === 'top' ? (
+        <SortedByTopGrid campaigns={filtered} />
+      ) : (
+        <div className="grid grid-cols-1 sm:grid-cols-2 xl:grid-cols-3 gap-4 sm:gap-5">
+          {filtered.map((c) => (
+            <CampaignCard key={c.aTag} campaign={c} />
+          ))}
+        </div>
+      )}
+    </div>
+  );
+}
+
+/**
+ * Sorts the visible campaigns by verified sats raised (descending) by
+ * fanning out one receipts query + per-receipt verification across all
+ * campaigns at once. Uses `useQueries`, so the hook call count is
+ * deterministic per render (one queries-tuple, not one hook per campaign)
+ * and the rules of hooks hold.
+ *
+ * Caches share keys with `useCampaignDonations` so the verifier results
+ * are reused across the profile and any other view of the same campaign.
+ */
+function SortedByTopGrid({ campaigns }: { campaigns: ParsedCampaign[] }) {
+  const { nostr } = useNostr();
+  const { config } = useAppContext();
+  const { esploraApis } = config;
+
+  // Only on-chain campaigns can have verifiable totals. SP campaigns sort to 0.
+  const onchain = campaigns.filter((c) => c.wallet?.mode === 'onchain');
+
+  // Step 1: one receipts query per on-chain campaign.
+  const receiptsQueries = useQueries({
+    queries: onchain.map((campaign) => ({
+      queryKey: ['campaign-donations', 'events', campaign.aTag],
+      queryFn: async ({ signal }: { signal: AbortSignal }): Promise<NostrEvent[]> => {
+        return nostr.query(
+          [{ kinds: [8333], '#a': [campaign.aTag], limit: 500 }],
+          { signal },
+        );
+      },
+      staleTime: 15_000,
+    })),
+  });
+
+  // Step 2: dedupe receipts by txid (earliest wins, matching useCampaignDonations).
+  const verificationInputs: Array<{ aTag: string; wallet: string; event: NostrEvent }> = [];
+  for (let i = 0; i < onchain.length; i++) {
+    const campaign = onchain[i];
+    const wallet = campaign.wallet?.value;
+    if (!wallet) continue;
+    const receipts = receiptsQueries[i]?.data ?? [];
+    const ascending = [...receipts].sort((a, b) => a.created_at - b.created_at);
+    const seenTxids = new Set<string>();
+    for (const event of ascending) {
+      const txid = extractOnchainZapTxid(event);
+      if (!txid || seenTxids.has(txid)) continue;
+      seenTxids.add(txid);
+      verificationInputs.push({ aTag: campaign.aTag, wallet, event });
+    }
+  }
+
+  const verifications = useQueries({
+    queries: verificationInputs.map(({ wallet, event }) => ({
+      queryKey: ['onchain-zaps', 'verify', esploraApis, event.id, wallet],
+      queryFn: () => verifyOnchainZap(event, esploraApis, wallet),
+      staleTime: 60_000,
+    })),
+  });
+
+  // Step 3: sum verified sats per campaign aTag.
+  const totalsByCoord = new Map<string, number>();
+  for (let i = 0; i < verifications.length; i++) {
+    const { aTag } = verificationInputs[i];
+    const sats = verifications[i].data?.amountSats ?? 0;
+    totalsByCoord.set(aTag, (totalsByCoord.get(aTag) ?? 0) + sats);
+  }
+
+  const sorted = [...campaigns].sort(
+    (a, b) => (totalsByCoord.get(b.aTag) ?? 0) - (totalsByCoord.get(a.aTag) ?? 0),
+  );
+
+  return (
+    <div className="grid grid-cols-1 sm:grid-cols-2 xl:grid-cols-3 gap-4 sm:gap-5">
+      {sorted.map((campaign) => (
+        <CampaignCard key={campaign.aTag} campaign={campaign} />
+      ))}
+    </div>
+  );
+}
diff --git a/src/components/profile/ProfileIdentityRail.tsx b/src/components/profile/ProfileIdentityRail.tsx
new file mode 100644
index 00000000..442eda3c
--- /dev/null
+++ b/src/components/profile/ProfileIdentityRail.tsx
@@ -0,0 +1,826 @@
+import type { ReactNode } from 'react';
+import { Link, Link as RouterLink } from 'react-router-dom';
+import {
+  Bitcoin,
+  CalendarClock,
+  Globe,
+  HandHeart,
+  Megaphone,
+  MoreHorizontal,
+  QrCode,
+  Users,
+} from 'lucide-react';
+import { nip19 } from 'nostr-tools';
+import type { NostrEvent, NostrMetadata } from '@nostrify/nostrify';
+
+import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar';
+import { Badge } from '@/components/ui/badge';
+import { Button } from '@/components/ui/button';
+import { Card } from '@/components/ui/card';
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from '@/components/ui/dropdown-menu';
+import { Skeleton } from '@/components/ui/skeleton';
+import { BioContent } from '@/components/BioContent';
+import { CampaignCard, CampaignCardSkeleton } from '@/components/CampaignCard';
+import { CommunityMiniCard, CommunityMiniCardSkeleton } from '@/components/discovery/CommunityMiniCard';
+import { EmojifiedText } from '@/components/CustomEmoji';
+import { FollowToggleButton } from '@/components/FollowButton';
+import { Nip05Badge } from '@/components/Nip05Badge';
+import { ProfileReactionButton } from '@/components/ProfileReactionButton';
+import { OrganizationsAllDialog } from '@/components/profile/OrganizationsAllDialog';
+import { useCampaignModeration } from '@/hooks/useCampaignModeration';
+import { useProfileOrganizations, type ProfileOrganization } from '@/hooks/useProfileOrganizations';
+import type { ProfileCampaignStats } from '@/hooks/useProfileCampaignStats';
+import type { ParsedCampaign } from '@/lib/campaign';
+import { formatCampaignAmount } from '@/lib/formatCampaignAmount';
+import { formatNumber } from '@/lib/formatNumber';
+import { sanitizeUrl } from '@/lib/sanitizeUrl';
+import { cn } from '@/lib/utils';
+import type { Action } from '@/hooks/useActions';
+import { DEFAULT_COVER_IMAGE } from '@/lib/defaultActionCovers';
+import { formatCompactPledgeDeadline, formatPledgeAmount } from '@/lib/pledges';
+import { getGeoDisplayName } from '@/lib/countries';
+
+export interface ProfileIdentityRailProps {
+  pubkey: string;
+  /** Whether the logged-in user is viewing their own profile. */
+  isOwnProfile: boolean;
+  /** Resolved kind 0 metadata, if any. */
+  metadata: NostrMetadata | undefined;
+  /** Raw kind 0 event — needed for emoji tag rendering on display name. */
+  metadataEvent: NostrEvent | undefined;
+  /** Pre-resolved display name (with `genUserName` fallback applied upstream). */
+  displayName: string;
+  /** True while the kind-0 author query is still in flight; renders skeletons. */
+  isAuthorLoading: boolean;
+
+  /** Banner image URL — used to wire the avatar lightbox to the same url. */
+  bannerUrl: string | undefined;
+  /** Optional NIP-38 status (renders as a thought bubble next to the avatar). */
+  status?: { text: string | undefined; url: string | undefined };
+
+  /** Custom kind-0 profile fields, already parsed. */
+  fields: { label: string; value: string }[];
+  /** Pre-rendered list of <ProfileFieldInline /> nodes — keeps that helper inside ProfilePage. */
+  fieldsContent: ReactNode;
+
+  /** Campaigns authored by this profile (newest-first). */
+  campaigns: ParsedCampaign[];
+  /** Aggregated campaign + raised stats for the stat block. */
+  campaignStats: ProfileCampaignStats;
+  /** Pledges (kind 36639) created by this profile. */
+  pledgesCount: number;
+  /**
+   * The profile's pledges (kind 36639) — used to surface the latest one
+   * in the rail when the profile has no campaigns. The rail picks the
+   * newest by `createdAt` itself, so callers can pass the unsorted list.
+   */
+  pledges: Action[];
+  /** Spot BTC price for the Raised stat row. */
+  btcPrice: number | undefined;
+
+  followersCount: number;
+  followingCount: number;
+  isFollowing: boolean;
+  followPending: boolean;
+
+  onLightbox: (url: string) => void;
+  onFollowersOpen: () => void;
+  onFollowingOpen: () => void;
+  onMoreMenuOpen: () => void;
+  onFollowQROpen: () => void;
+  onToggleFollow: () => void;
+  onTabChange: (tabId: string) => void;
+  onDonate: (campaign: ParsedCampaign) => void;
+  /** Whether the viewer can take any action (logged in). Disables follow when null. */
+  canFollow: boolean;
+  /** Latest kind-0 event used by ProfileReactionButton; falls back to metadataEvent. */
+  authorEvent: NostrEvent | undefined;
+}
+
+const RAIL_CAMPAIGN_LIMIT = 2;
+const RAIL_ORG_LIMIT = 4;
+
+/**
+ * ProfileIdentityRail — the left rail of the two-column profile.
+ *
+ * Holds everything that's a *standing fact* about the profile: who they
+ * are (avatar, name, bio), what they're raising for (active campaigns),
+ * who they organize with (orgs), key counts (followers / following /
+ * campaigns / pledges / raised), and the freeform profile fields.
+ *
+ * Sticky on `lg+` so it stays visible while the right tab column scrolls.
+ * Below `lg` the rail just stacks above the content — its avatar still
+ * overlaps the banner via `-mt-16` because the rail is the first child
+ * below the banner element.
+ *
+ * The rail does NOT own the tab bar or the tab content — those live in
+ * the right column. Click handlers like `onTabChange` exist so rail rows
+ * can switch tabs (e.g. "See all campaigns →" jumps to the Campaigns tab).
+ */
+export function ProfileIdentityRail({
+  pubkey,
+  isOwnProfile,
+  metadata,
+  metadataEvent,
+  displayName,
+  isAuthorLoading,
+  bannerUrl: _bannerUrl,
+  status,
+  fields,
+  fieldsContent,
+  campaigns,
+  campaignStats,
+  pledgesCount,
+  pledges,
+  btcPrice,
+  followersCount,
+  followingCount,
+  isFollowing,
+  followPending,
+  onLightbox,
+  onFollowersOpen,
+  onFollowingOpen,
+  onMoreMenuOpen,
+  onFollowQROpen,
+  onToggleFollow,
+  onTabChange,
+  onDonate,
+  canFollow,
+  authorEvent,
+}: ProfileIdentityRailProps) {
+  if (isAuthorLoading) {
+    return (
+      <RailSkeleton />
+    );
+  }
+
+  const websiteHref = (() => {
+    if (!metadata?.website) return undefined;
+    const candidate = metadata.website.startsWith('http')
+      ? metadata.website
+      : `https://${metadata.website}`;
+    return sanitizeUrl(candidate);
+  })();
+
+  const onchainCampaigns = campaigns.filter((c) => c.wallet?.mode === 'onchain');
+
+  return (
+    // Two-layer structure so the rail can scroll independently on lg+
+    // without clipping the avatar that pokes above the rail's top edge:
+    //   - Outer flex column owns the avatar (which uses -mt-16 to overlap
+    //     the banner). It must NOT clip overflow.
+    //   - Inner div carries the rest of the rail and is the scroll
+    //     container: `lg:flex-1 lg:min-h-0 lg:overflow-y-auto` makes it
+    //     fill the remaining height of the sticky aside and scroll
+    //     internally so the page's main scroll only drives the feed.
+    <div className="flex flex-col h-full">
+      {/* Avatar — overlaps the banner from inside the rail. Sits OUTSIDE
+          the scroll container so its negative-margin overhang is never
+          clipped by `overflow-y-auto`. */}
+      <AvatarBlock
+        metadata={metadata}
+        displayName={displayName}
+        status={status}
+        onLightbox={onLightbox}
+      />
+
+      <div className="flex flex-col gap-5 mt-5 lg:flex-1 lg:min-h-0 lg:overflow-y-auto pb-4">
+        {/* Identity: name + NIP-05 + website + bio */}
+        <div className="space-y-1.5">
+          <h1 className="text-xl font-bold leading-tight break-words">
+          {metadataEvent ? (
+            <EmojifiedText tags={metadataEvent.tags}>{displayName}</EmojifiedText>
+          ) : displayName}
+        </h1>
+        {metadata?.nip05 && (
+          <Nip05Badge nip05={metadata.nip05} pubkey={pubkey} className="text-sm text-muted-foreground" />
+        )}
+        {websiteHref && (
+          <div className="flex items-center gap-1.5 text-sm text-muted-foreground min-w-0">
+            <Globe className="size-3.5 shrink-0" />
+            <a
+              href={websiteHref}
+              target="_blank"
+              rel="noopener noreferrer"
+              className="truncate text-primary hover:underline"
+            >
+              {metadata!.website!.replace(/^https?:\/\//, '').replace(/\/$/, '')}
+            </a>
+          </div>
+        )}
+        {metadata?.about && (
+          <p className="pt-1 text-sm whitespace-pre-wrap break-words text-foreground/90">
+            <BioContent tags={metadataEvent?.tags}>{metadata.about}</BioContent>
+          </p>
+        )}
+      </div>
+
+      {/* Action bar — wraps onto multiple rows in a 340px-wide rail. */}
+      <ActionBar
+        isOwnProfile={isOwnProfile}
+        isFollowing={isFollowing}
+        followPending={followPending}
+        canFollow={canFollow}
+        onToggleFollow={onToggleFollow}
+        onMoreMenuOpen={onMoreMenuOpen}
+        onFollowQROpen={onFollowQROpen}
+        authorEvent={authorEvent}
+        onchainCampaigns={onchainCampaigns}
+        onDonate={onDonate}
+      />
+
+      {/* Stats: Followers + Following inline; Pledges + Raised below. */}
+      <StatList
+        followersCount={followersCount}
+        followingCount={followingCount}
+        pledgesCount={pledgesCount}
+        totalRaisedSats={campaignStats.totalRaisedSats}
+        btcPrice={btcPrice}
+        onFollowersOpen={onFollowersOpen}
+        onFollowingOpen={onFollowingOpen}
+        onTabChange={onTabChange}
+      />
+
+      {/* Active campaigns */}
+      <RailCampaignsSection
+        campaigns={campaigns}
+        isOwnProfile={isOwnProfile}
+        isLoading={campaignStats.isVerifying && campaigns.length === 0}
+        onSeeAll={() => onTabChange('campaigns')}
+      />
+
+      {/* Latest pledge — surfaced as a fallback when this profile has
+          nothing in the Campaigns slot, so the rail still has a piece of
+          first-class Agora content above the orgs/fields sections. */}
+      {campaigns.length === 0 && pledges.length > 0 && (
+        <RailLatestPledgeSection
+          pledges={pledges}
+          btcPrice={btcPrice}
+          showSeeAll={pledges.length > 1}
+          onSeeAll={() => onTabChange('pledges')}
+        />
+      )}
+
+      {/* Organizations */}
+      <RailOrganizationsSection pubkey={pubkey} />
+
+      {/* Profile fields (rendered upstream) */}
+      {fields.length > 0 && (
+        <section className="space-y-3">
+          <RailSectionHeader icon={null} title="Profile" />
+          <div className="space-y-3">{fieldsContent}</div>
+        </section>
+      )}
+      </div>
+    </div>
+  );
+}
+
+// ─── Avatar block ────────────────────────────────────────────────────────────
+
+function AvatarBlock({
+  metadata,
+  displayName,
+  status,
+  onLightbox,
+}: {
+  metadata: NostrMetadata | undefined;
+  displayName: string;
+  status: { text: string | undefined; url: string | undefined } | undefined;
+  onLightbox: (url: string) => void;
+}) {
+  const picture = metadata?.picture;
+  return (
+    <div className="relative">
+      <button
+        className="relative z-10 focus:outline-none focus-visible:ring-2 focus-visible:ring-primary rounded-full -mt-16 md:-mt-20 block"
+        onClick={() => picture && onLightbox(picture)}
+        disabled={!picture}
+      >
+        <Avatar className={cn(
+          'size-28 md:size-32 border-4 border-background shadow-lg',
+          picture && 'cursor-pointer',
+        )}>
+          <AvatarImage src={picture} alt={displayName} />
+          <AvatarFallback className="bg-primary/20 text-primary text-3xl">
+            {displayName[0]?.toUpperCase() ?? '?'}
+          </AvatarFallback>
+        </Avatar>
+      </button>
+
+      {/* NIP-38 thought bubble — floats to the right of the avatar over the banner area. */}
+      {status?.text && (
+        <div className="absolute top-2 left-[calc(7rem+8px)] md:left-[calc(8rem+8px)] z-10 max-w-[200px] animate-in fade-in slide-in-from-left-1 duration-300">
+          <div className="relative bg-background/90 backdrop-blur-sm border border-border rounded-xl px-3 py-1.5 shadow-lg">
+            <p className="text-xs text-foreground italic truncate">
+              {status.url ? (
+                <a href={status.url} target="_blank" rel="noopener noreferrer" className="hover:underline">
+                  {status.text}
+                </a>
+              ) : (
+                status.text
+              )}
+            </p>
+            {/* Speech bubble triangle tail */}
+            <div className="absolute -bottom-[7px] left-1 size-0 border-t-[8px] border-t-border border-r-[8px] border-r-transparent" />
+            <div className="absolute -bottom-[5.5px] left-1 size-0 border-t-[7px] border-t-background border-r-[7px] border-r-transparent" />
+          </div>
+        </div>
+      )}
+    </div>
+  );
+}
+
+// ─── Action bar ──────────────────────────────────────────────────────────────
+
+function ActionBar({
+  isOwnProfile,
+  isFollowing,
+  followPending,
+  canFollow,
+  onToggleFollow,
+  onMoreMenuOpen,
+  onFollowQROpen,
+  authorEvent,
+  onchainCampaigns,
+  onDonate,
+}: {
+  isOwnProfile: boolean;
+  isFollowing: boolean;
+  followPending: boolean;
+  canFollow: boolean;
+  onToggleFollow: () => void;
+  onMoreMenuOpen: () => void;
+  onFollowQROpen: () => void;
+  authorEvent: NostrEvent | undefined;
+  onchainCampaigns: ParsedCampaign[];
+  onDonate: (campaign: ParsedCampaign) => void;
+}) {
+  return (
+    <div className="flex flex-wrap items-center gap-2">
+      {isOwnProfile ? (
+        <>
+          <Link to="/settings/profile" className="flex-1 min-w-[140px]">
+            <Button variant="outline" className="rounded-full font-bold w-full">
+              Edit profile
+            </Button>
+          </Link>
+          <Button
+            variant="outline"
+            size="icon"
+            className="rounded-full size-10"
+            title="Share follow link"
+            onClick={onFollowQROpen}
+          >
+            <QrCode className="size-5" />
+          </Button>
+          <Button
+            variant="outline"
+            size="icon"
+            className="rounded-full size-10"
+            onClick={onMoreMenuOpen}
+            title="More options"
+          >
+            <MoreHorizontal className="size-5" />
+          </Button>
+        </>
+      ) : (
+        <>
+          <FollowToggleButton
+            isFollowing={isFollowing}
+            isPending={followPending}
+            onClick={onToggleFollow}
+            disabled={!canFollow}
+          />
+          {onchainCampaigns.length === 1 ? (
+            <Button
+              onClick={() => onDonate(onchainCampaigns[0])}
+              className="rounded-full font-bold gap-1.5"
+            >
+              <HandHeart className="size-4" />
+              Donate
+            </Button>
+          ) : onchainCampaigns.length > 1 ? (
+            <DropdownMenu>
+              <DropdownMenuTrigger asChild>
+                <Button className="rounded-full font-bold gap-1.5">
+                  <HandHeart className="size-4" />
+                  Donate
+                </Button>
+              </DropdownMenuTrigger>
+              <DropdownMenuContent align="start" className="w-72">
+                {onchainCampaigns.map((c) => (
+                  <DropdownMenuItem
+                    key={c.aTag}
+                    onClick={() => onDonate(c)}
+                    className="flex flex-col items-start gap-0.5"
+                  >
+                    <span className="font-medium truncate w-full">{c.title}</span>
+                    {c.goalUsd ? (
+                      <span className="text-xs text-muted-foreground">
+                        Goal ${c.goalUsd.toLocaleString()}
+                      </span>
+                    ) : null}
+                  </DropdownMenuItem>
+                ))}
+              </DropdownMenuContent>
+            </DropdownMenu>
+          ) : null}
+          {authorEvent && <ProfileReactionButton profileEvent={authorEvent} />}
+          <Button
+            variant="outline"
+            size="icon"
+            className="rounded-full size-10"
+            onClick={onMoreMenuOpen}
+            title="More options"
+          >
+            <MoreHorizontal className="size-5" />
+          </Button>
+        </>
+      )}
+    </div>
+  );
+}
+
+// ─── Stat list ──────────────────────────────────────────────────────────────
+
+function StatList({
+  followersCount,
+  followingCount,
+  pledgesCount,
+  totalRaisedSats,
+  btcPrice,
+  onFollowersOpen,
+  onFollowingOpen,
+  onTabChange,
+}: {
+  followersCount: number;
+  followingCount: number;
+  pledgesCount: number;
+  totalRaisedSats: number;
+  btcPrice: number | undefined;
+  onFollowersOpen: () => void;
+  onFollowingOpen: () => void;
+  onTabChange: (id: string) => void;
+}) {
+  // Secondary stat rows (one per row). Followers / Following live inline at
+  // the top; the campaign count was dropped because the rail's Campaigns
+  // section already displays the user's campaigns directly below.
+  const rows: Array<{
+    icon?: ReactNode;
+    label: string;
+    value: string;
+    onClick?: () => void;
+    show: boolean;
+  }> = [
+    {
+      icon: <HandHeart className="size-3.5 text-primary" />,
+      label: pledgesCount === 1 ? 'Pledge' : 'Pledges',
+      value: formatNumber(pledgesCount),
+      onClick: () => onTabChange('pledges'),
+      show: pledgesCount > 0,
+    },
+    {
+      icon: <Bitcoin className="size-3.5 text-primary" />,
+      label: 'Raised',
+      value: formatCampaignAmount(totalRaisedSats, btcPrice),
+      onClick: () => onTabChange('campaigns'),
+      show: totalRaisedSats > 0,
+    },
+  ].filter((r) => r.show);
+
+  const hasFollowRow = followersCount > 0 || followingCount > 0;
+  if (!hasFollowRow && rows.length === 0) return null;
+
+  return (
+    <div className="space-y-2">
+      {/* Followers + Following on a single horizontal row. */}
+      {hasFollowRow && (
+        <div className="flex items-center gap-5 text-sm">
+          {followersCount > 0 && (
+            <button
+              onClick={onFollowersOpen}
+              className="flex items-baseline gap-1.5 hover:opacity-80 transition-opacity"
+              title={`${followersCount} followers`}
+            >
+              <span className="font-bold tabular-nums text-foreground">{formatNumber(followersCount)}</span>
+              <span className="text-muted-foreground">Followers</span>
+            </button>
+          )}
+          {followingCount > 0 && (
+            <button
+              onClick={onFollowingOpen}
+              className="flex items-baseline gap-1.5 hover:opacity-80 transition-opacity"
+              title={`${followingCount} following`}
+            >
+              <span className="font-bold tabular-nums text-foreground">{formatNumber(followingCount)}</span>
+              <span className="text-muted-foreground">Following</span>
+            </button>
+          )}
+        </div>
+      )}
+
+      {/* Secondary stat rows. */}
+      {rows.length > 0 && (
+        <div className="rounded-xl border border-border/60 bg-card/40 divide-y divide-border/60">
+          {rows.map((row) => (
+            <button
+              key={row.label}
+              onClick={row.onClick}
+              className="w-full flex items-center justify-between gap-3 px-3 py-2 text-sm hover:bg-secondary/40 transition-colors first:rounded-t-xl last:rounded-b-xl"
+            >
+              <span className="flex items-center gap-2 text-muted-foreground">
+                {row.icon}
+                {row.label}
+              </span>
+              <span className="font-semibold tabular-nums text-foreground">{row.value}</span>
+            </button>
+          ))}
+        </div>
+      )}
+    </div>
+  );
+}
+
+// ─── Rail Campaigns Section ─────────────────────────────────────────────────
+
+function RailCampaignsSection({
+  campaigns,
+  isOwnProfile,
+  isLoading,
+  onSeeAll,
+}: {
+  campaigns: ParsedCampaign[];
+  isOwnProfile: boolean;
+  isLoading: boolean;
+  onSeeAll: () => void;
+}) {
+  const { data: moderation } = useCampaignModeration();
+  const visible = isOwnProfile
+    ? campaigns
+    : campaigns.filter((c) => !moderation.hiddenCoords.has(c.aTag));
+
+  if (isLoading && visible.length === 0) {
+    return (
+      <section className="space-y-3">
+        <RailSectionHeader icon={<Megaphone className="size-4 text-primary" />} title="Campaigns" />
+        <CampaignCardSkeleton />
+      </section>
+    );
+  }
+
+  if (visible.length === 0) return null;
+
+  const shown = visible.slice(0, RAIL_CAMPAIGN_LIMIT);
+  const more = visible.length - shown.length;
+
+  return (
+    <section className="space-y-3">
+      <RailSectionHeader
+        icon={<Megaphone className="size-4 text-primary" />}
+        title="Campaigns"
+        count={visible.length}
+      />
+      <div className="space-y-3">
+        {shown.map((c) => (
+          <CampaignCard key={c.aTag} campaign={c} />
+        ))}
+      </div>
+      {(more > 0 || visible.length > 1) && (
+        <button
+          type="button"
+          onClick={onSeeAll}
+          className="text-sm text-primary hover:underline font-medium"
+        >
+          {more > 0 ? `See all ${visible.length} campaigns →` : 'View campaigns tab →'}
+        </button>
+      )}
+    </section>
+  );
+}
+
+// ─── Rail Latest Pledge Section ─────────────────────────────────────────────
+
+/**
+ * Compact "latest pledge" card shown in the rail when the profile has
+ * no campaigns. Picks the newest pledge from the supplied list (sorted
+ * by `createdAt` descending) and renders it as a single small card with
+ * cover, title, pledged amount, country, and deadline.
+ */
+function RailLatestPledgeSection({
+  pledges,
+  btcPrice,
+  showSeeAll,
+  onSeeAll,
+}: {
+  pledges: Action[];
+  btcPrice: number | undefined;
+  showSeeAll: boolean;
+  onSeeAll: () => void;
+}) {
+  // Pick the newest pledge by created_at. The page query is roughly
+  // newest-first already, but sorting here keeps the rail correct
+  // regardless of upstream order.
+  const latest = [...pledges].sort((a, b) => b.createdAt - a.createdAt)[0];
+  if (!latest) return null;
+
+  return (
+    <section className="space-y-3">
+      <RailSectionHeader
+        icon={<HandHeart className="size-4 text-primary" />}
+        title="Latest pledge"
+      />
+      <RailPledgeCard action={latest} btcPrice={btcPrice} />
+      {showSeeAll && (
+        <button
+          type="button"
+          onClick={onSeeAll}
+          className="text-sm text-primary hover:underline font-medium"
+        >
+          See all {pledges.length} pledges →
+        </button>
+      )}
+    </section>
+  );
+}
+
+/**
+ * Compact pledge card sized for the rail's narrow column. Smaller cover
+ * aspect, tighter padding, and a single-line pledged amount that doesn't
+ * dominate the rail.
+ */
+function RailPledgeCard({
+  action,
+  btcPrice,
+}: {
+  action: Action;
+  btcPrice: number | undefined;
+}) {
+  const naddr = nip19.naddrEncode({
+    kind: 36639,
+    pubkey: action.pubkey,
+    identifier: action.id,
+  });
+  const cover = sanitizeUrl(action.image) ?? DEFAULT_COVER_IMAGE;
+  const deadline = action.deadline ? formatCompactPledgeDeadline(action.deadline) : null;
+  const isExpired = !!deadline?.isPast;
+  const countryLabel = action.countryCode ? getGeoDisplayName(action.countryCode) : undefined;
+
+  return (
+    <RouterLink
+      to={`/${naddr}`}
+      className="group block rounded-xl overflow-hidden focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary"
+    >
+      <Card className="overflow-hidden border-border/70 shadow-sm motion-safe:transition-shadow group-hover:shadow-md">
+        <div className="relative aspect-[16/9] bg-gradient-to-br from-primary/15 via-primary/5 to-secondary">
+          <img
+            src={cover}
+            alt=""
+            loading="lazy"
+            className="absolute inset-0 size-full object-cover"
+          />
+          {isExpired && (
+            <Badge
+              variant="secondary"
+              className="absolute top-2 right-2 backdrop-blur bg-background/85 border-border/40 text-[10px] uppercase tracking-wide text-muted-foreground"
+            >
+              Ended
+            </Badge>
+          )}
+        </div>
+        <div className="p-3 space-y-1.5">
+          <h3 className="font-semibold text-sm leading-snug line-clamp-2">{action.title}</h3>
+          <div className="flex items-baseline justify-between gap-2 text-xs">
+            <span className="text-muted-foreground uppercase tracking-wide font-semibold">Pledged</span>
+            <span className="text-foreground font-bold tabular-nums">
+              {formatPledgeAmount(action.bounty, btcPrice)}
+            </span>
+          </div>
+          {(countryLabel || deadline) && (
+            <div className="flex flex-wrap items-center gap-x-3 gap-y-1 text-[11px] text-muted-foreground pt-0.5">
+              {deadline && (
+                <span className={cn(
+                  'inline-flex items-center gap-1',
+                  deadline.isPast && 'text-destructive',
+                )}>
+                  <CalendarClock className="size-3" />
+                  {deadline.label}
+                </span>
+              )}
+              {countryLabel && <span className="truncate">{countryLabel}</span>}
+            </div>
+          )}
+        </div>
+      </Card>
+    </RouterLink>
+  );
+}
+
+// ─── Rail Organizations Section ─────────────────────────────────────────────
+
+function RailOrganizationsSection({ pubkey }: { pubkey: string }) {
+  const { data: orgs, isLoading } = useProfileOrganizations(pubkey);
+
+  if (isLoading && orgs.length === 0) {
+    return (
+      <section className="space-y-3">
+        <RailSectionHeader icon={<Users className="size-4 text-primary" />} title="Organizations" />
+        <div className="grid grid-cols-2 gap-3">
+          {Array.from({ length: 2 }).map((_, i) => (
+            <CommunityMiniCardSkeleton key={i} className="w-full" />
+          ))}
+        </div>
+      </section>
+    );
+  }
+
+  if (orgs.length === 0) return null;
+
+  const shown = orgs.slice(0, RAIL_ORG_LIMIT);
+  const overflow = Math.max(0, orgs.length - shown.length);
+
+  return (
+    <section className="space-y-3">
+      <RailSectionHeader
+        icon={<Users className="size-4 text-primary" />}
+        title="Organizations"
+        count={orgs.length}
+      />
+      <div className="grid grid-cols-2 gap-3">
+        {shown.map((entry) => (
+          <RailOrgCell key={entry.community.aTag} entry={entry} />
+        ))}
+      </div>
+      {overflow > 0 && (
+        <OrganizationsAllDialog orgs={orgs}>
+          <button
+            type="button"
+            className="text-sm text-primary hover:underline font-medium"
+          >
+            See all {orgs.length} →
+          </button>
+        </OrganizationsAllDialog>
+      )}
+    </section>
+  );
+}
+
+function RailOrgCell({ entry }: { entry: ProfileOrganization }) {
+  return (
+    <div className="relative">
+      <CommunityMiniCard community={entry.community} className="w-full" />
+      <Badge
+        variant="secondary"
+        className={cn(
+          'absolute top-2 left-2 backdrop-blur bg-background/90 border-border/40 text-[9px] font-semibold uppercase tracking-wide px-1.5 py-0.5',
+          entry.isFounder ? 'text-primary' : 'text-foreground',
+        )}
+      >
+        {entry.isFounder ? 'Founder' : 'Mod'}
+      </Badge>
+    </div>
+  );
+}
+
+// ─── Section header & skeleton ──────────────────────────────────────────────
+
+function RailSectionHeader({
+  icon,
+  title,
+  count,
+}: {
+  icon: ReactNode;
+  title: string;
+  count?: number;
+}) {
+  return (
+    <h2 className="flex items-center gap-2 text-sm font-semibold uppercase tracking-wide text-muted-foreground">
+      {icon}
+      <span>{title}</span>
+      {count !== undefined && count > 0 && (
+        <span className="text-xs font-normal normal-case text-muted-foreground/70">({count})</span>
+      )}
+    </h2>
+  );
+}
+
+function RailSkeleton() {
+  return (
+    <div className="flex flex-col gap-5">
+      <Skeleton className="size-28 md:size-32 rounded-full -mt-16 md:-mt-20 border-4 border-background" />
+      <div className="space-y-2">
+        <Skeleton className="h-6 w-40" />
+        <Skeleton className="h-4 w-32" />
+        <Skeleton className="h-4 w-full mt-2" />
+        <Skeleton className="h-4 w-3/4" />
+      </div>
+      <Skeleton className="h-10 w-full rounded-full" />
+      <Skeleton className="h-32 w-full rounded-xl" />
+    </div>
+  );
+}
diff --git a/src/components/profile/ProfilePledgesTab.tsx b/src/components/profile/ProfilePledgesTab.tsx
new file mode 100644
index 00000000..c5459c3d
--- /dev/null
+++ b/src/components/profile/ProfilePledgesTab.tsx
@@ -0,0 +1,220 @@
+import { useState } from 'react';
+import { Link as RouterLink } from 'react-router-dom';
+import { CalendarClock, HandHeart, MapPin } from 'lucide-react';
+import { nip19 } from 'nostr-tools';
+
+import { Badge } from '@/components/ui/badge';
+import { Card } from '@/components/ui/card';
+import { Skeleton } from '@/components/ui/skeleton';
+import { DEFAULT_COVER_IMAGE } from '@/lib/defaultActionCovers';
+import { formatCompactPledgeDeadline, formatPledgeAmount } from '@/lib/pledges';
+import { getGeoDisplayName } from '@/lib/countries';
+import { cn } from '@/lib/utils';
+import type { Action } from '@/hooks/useActions';
+
+interface ProfilePledgesTabProps {
+  pubkey: string;
+  displayName: string;
+  isOwnProfile: boolean;
+  /** Pledges authored by this pubkey. Already filtered upstream. */
+  pledges: Action[];
+  /** BTC price for sats↔USD conversion in pledge amount labels. */
+  btcPrice: number | undefined;
+  /** True while the underlying useActions() query is still in flight. */
+  isLoading: boolean;
+}
+
+/**
+ * Pledges authored by this profile, rendered as a responsive grid that
+ * mirrors the `/pledges` (`ActionsPage`) directory styling.
+ *
+ * v1 scope per the design plan: pledges *created* by the user.
+ * "Pledges backed" (zapped submissions on others' pledges) is deferred to v2.
+ */
+export function ProfilePledgesTab({
+  pubkey,
+  displayName,
+  isOwnProfile,
+  pledges,
+  btcPrice,
+  isLoading,
+}: ProfilePledgesTabProps) {
+  const now = Math.floor(Date.now() / 1000);
+
+  // Loading skeleton until the first list resolves.
+  if (isLoading && pledges.length === 0) {
+    return (
+      <div className="px-4 sm:px-6 py-6">
+        <PledgesGridSkeleton />
+      </div>
+    );
+  }
+
+  if (pledges.length === 0) {
+    return (
+      <div className="px-4 sm:px-6 py-12">
+        <Card className="border-dashed">
+          <div className="py-12 px-8 text-center">
+            <HandHeart className="size-10 mx-auto mb-3 text-muted-foreground/40" />
+            <p className="text-muted-foreground max-w-sm mx-auto">
+              {isOwnProfile
+                ? "You haven't created a pledge yet."
+                : `${displayName} hasn't created a pledge yet.`}
+            </p>
+            {isOwnProfile && (
+              <RouterLink
+                to="/pledges/new"
+                className="inline-block mt-4 text-sm font-medium text-primary hover:underline"
+              >
+                Create a pledge →
+              </RouterLink>
+            )}
+          </div>
+        </Card>
+      </div>
+    );
+  }
+
+  // Split into active vs ended so the active pledges lead the grid.
+  const active: Action[] = [];
+  const ended: Action[] = [];
+  for (const p of pledges) {
+    if (p.deadline && p.deadline <= now) ended.push(p);
+    else active.push(p);
+  }
+
+  return (
+    <div className="px-4 sm:px-6 py-6 space-y-8" data-pubkey={pubkey}>
+      {active.length > 0 && (
+        <section>
+          {ended.length > 0 && (
+            <h3 className="text-sm font-semibold uppercase tracking-wide text-muted-foreground mb-3">
+              Active
+            </h3>
+          )}
+          <div className="grid grid-cols-1 sm:grid-cols-2 xl:grid-cols-3 gap-4 sm:gap-5">
+            {active.map((pledge) => (
+              <ProfilePledgeCard key={pledge.event.id} action={pledge} btcPrice={btcPrice} />
+            ))}
+          </div>
+        </section>
+      )}
+
+      {ended.length > 0 && (
+        <section>
+          <h3 className="text-sm font-semibold uppercase tracking-wide text-muted-foreground mb-3">
+            Ended
+          </h3>
+          <div className="grid grid-cols-1 sm:grid-cols-2 xl:grid-cols-3 gap-4 sm:gap-5">
+            {ended.map((pledge) => (
+              <ProfilePledgeCard key={pledge.event.id} action={pledge} btcPrice={btcPrice} isExpired />
+            ))}
+          </div>
+        </section>
+      )}
+    </div>
+  );
+}
+
+function ProfilePledgeCard({
+  action,
+  isExpired,
+  btcPrice,
+}: {
+  action: Action;
+  isExpired?: boolean;
+  btcPrice: number | undefined;
+}) {
+  const [imageLoadFailed, setImageLoadFailed] = useState(false);
+
+  const naddr = nip19.naddrEncode({
+    kind: 36639,
+    pubkey: action.pubkey,
+    identifier: action.id,
+  });
+
+  const coverImage = (action.image && !imageLoadFailed) ? action.image : DEFAULT_COVER_IMAGE;
+  const deadline = action.deadline ? formatCompactPledgeDeadline(action.deadline) : null;
+  const countryLabel = action.countryCode ? getGeoDisplayName(action.countryCode) : undefined;
+
+  return (
+    <RouterLink
+      to={`/${naddr}`}
+      className="group block rounded-xl overflow-hidden focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2 focus-visible:ring-offset-background motion-safe:transition-transform motion-safe:duration-200 motion-safe:hover:-translate-y-0.5"
+    >
+      <Card className="overflow-hidden border-border/70 shadow-sm motion-safe:transition-shadow motion-safe:duration-200 group-hover:shadow-lg h-full flex flex-col">
+        <div className="relative w-full aspect-[16/9] bg-gradient-to-br from-primary/15 via-primary/5 to-secondary">
+          <img
+            src={coverImage}
+            alt=""
+            className="absolute inset-0 size-full object-cover"
+            onError={() => setImageLoadFailed(true)}
+            loading="lazy"
+          />
+          {isExpired && (
+            <Badge
+              variant="secondary"
+              className="absolute top-3 right-3 backdrop-blur bg-background/85 border-border/40 text-muted-foreground"
+            >
+              Ended
+            </Badge>
+          )}
+        </div>
+
+        <div className="flex flex-col gap-3 p-5 flex-1">
+          <h3 className="font-bold leading-tight tracking-tight text-lg line-clamp-2">
+            {action.title}
+          </h3>
+          {action.description.trim() && (
+            <p className="text-sm text-muted-foreground line-clamp-2">{action.description}</p>
+          )}
+
+          <div className="flex-1" />
+
+          <div className="rounded-xl border border-primary/20 bg-primary/10 px-4 py-3">
+            <p className="text-xs font-semibold uppercase tracking-wide text-primary">Pledged</p>
+            <p className="mt-1 text-2xl font-bold tracking-tight text-foreground">
+              {formatPledgeAmount(action.bounty, btcPrice)}
+            </p>
+          </div>
+
+          <div className="flex flex-wrap items-center gap-x-4 gap-y-1.5 text-xs text-muted-foreground pt-1">
+            {countryLabel && (
+              <span className="inline-flex items-center gap-1.5">
+                <MapPin className="size-3.5" />
+                {countryLabel}
+              </span>
+            )}
+            {deadline && (
+              <span className={cn(
+                'inline-flex items-center gap-1.5',
+                deadline.isPast && 'text-destructive',
+              )}>
+                <CalendarClock className="size-3.5" />
+                {deadline.label}
+              </span>
+            )}
+          </div>
+        </div>
+      </Card>
+    </RouterLink>
+  );
+}
+
+function PledgesGridSkeleton() {
+  return (
+    <div className="grid grid-cols-1 sm:grid-cols-2 xl:grid-cols-3 gap-4 sm:gap-5">
+      {Array.from({ length: 3 }).map((_, i) => (
+        <Card key={i} className="overflow-hidden border-border/70">
+          <Skeleton className="aspect-[16/9] w-full rounded-none" />
+          <div className="p-5 space-y-3">
+            <Skeleton className="h-5 w-3/4" />
+            <Skeleton className="h-4 w-full" />
+            <Skeleton className="h-4 w-2/3" />
+            <Skeleton className="h-16 w-full rounded-xl" />
+          </div>
+        </Card>
+      ))}
+    </div>
+  );
+}
diff --git a/src/components/profile/ProfileTabs.tsx b/src/components/profile/ProfileTabs.tsx
new file mode 100644
index 00000000..ec31a49a
--- /dev/null
+++ b/src/components/profile/ProfileTabs.tsx
@@ -0,0 +1,145 @@
+import { useEffect, useLayoutEffect, useRef, useState } from 'react';
+import { cn } from '@/lib/utils';
+import { useNavHidden } from '@/contexts/LayoutContext';
+
+export interface ProfileTabsProps {
+  tabs: Array<{ id: string; label: string }>;
+  activeTab: string;
+  onChange: (id: string) => void;
+}
+
+/**
+ * Profile-local tab bar.
+ *
+ * A focused alternative to the global `SubHeaderBar` — no arc decoration,
+ * no hover slice tracking, no FAB-aware spacing. Just a clean horizontal
+ * row with an animated underline marking the active tab. Designed for the
+ * 4-tab profile case (Activity / Campaigns / Pledges / Posts).
+ *
+ * Behavior:
+ *  - Sticks to the top of its containing scroll context. The parent column
+ *    can place it inside any scroll region; the bar uses `position: sticky`.
+ *  - Underline animates between active tabs via a single absolute-positioned
+ *    indicator measured from the active tab's offset/width.
+ *  - Horizontally scrolls when overflowing; auto-scrolls the active tab into
+ *    view on selection (matches the previous TabButton behavior).
+ */
+export function ProfileTabs({ tabs, activeTab, onChange }: ProfileTabsProps) {
+  const trackRef = useRef<HTMLDivElement>(null);
+  const tabRefs = useRef<Map<string, HTMLButtonElement>>(new Map());
+  const [indicator, setIndicator] = useState<{ left: number; width: number } | null>(null);
+  const navHidden = useNavHidden();
+
+  // Measure the active tab and update the underline indicator.
+  useLayoutEffect(() => {
+    const btn = tabRefs.current.get(activeTab);
+    if (!btn) {
+      setIndicator(null);
+      return;
+    }
+    setIndicator({ left: btn.offsetLeft, width: btn.offsetWidth });
+  }, [activeTab, tabs]);
+
+  // Recompute on resize (label-width changes between breakpoints).
+  useEffect(() => {
+    const onResize = () => {
+      const btn = tabRefs.current.get(activeTab);
+      if (!btn) return;
+      setIndicator({ left: btn.offsetLeft, width: btn.offsetWidth });
+    };
+    window.addEventListener('resize', onResize);
+    return () => window.removeEventListener('resize', onResize);
+  }, [activeTab]);
+
+  // Scroll the active tab into view when activated (overflow scroll case).
+  useLayoutEffect(() => {
+    const btn = tabRefs.current.get(activeTab);
+    const track = trackRef.current;
+    if (!btn || !track) return;
+    const left = btn.offsetLeft;
+    const right = left + btn.offsetWidth;
+    const viewLeft = track.scrollLeft;
+    const viewRight = viewLeft + track.clientWidth;
+    if (left < viewLeft) {
+      track.scrollTo({ left: left - 8, behavior: 'smooth' });
+    } else if (right > viewRight) {
+      track.scrollTo({ left: right - track.clientWidth + 8, behavior: 'smooth' });
+    }
+  }, [activeTab]);
+
+  return (
+    <div
+      className={cn(
+        // Stickiness — sits at the top of the column scroll. `top-mobile-bar`
+        // matches the existing app convention so it sits flush with the
+        // mobile top nav. On desktop the chrome shifts and we use top-0.
+        'sticky top-mobile-bar sidebar:top-0 z-10',
+        // On mobile, fade + slide fully out of view when the user scrolls
+        // down — otherwise the tabs sit at `top-mobile-bar` while the top
+        // bar slides away, leaving a translucent gap above them, and when
+        // the top bar slides back in it visibly crosses over the top of
+        // the tab bar (top bar is z-20, tabs z-10).
+        //
+        // We can't simply use the shared `.nav-hidden-slide` utility (as
+        // the global `SubHeaderBar` does) because the profile tab bar is
+        // notably taller than other sub-headers and visibly gets clipped
+        // by the top bar mid-transition. Pair the slide with an opacity
+        // fade so the bar isn't visibly intersecting the top bar as it
+        // animates.
+        'max-sidebar:transition-[transform,opacity] max-sidebar:duration-300 max-sidebar:ease-in-out',
+        navHidden && 'nav-hidden-slide max-sidebar:opacity-0',
+        // Visual separation — translucent backdrop so feed content doesn't
+        // bleed through, with a single hairline border below.
+        'bg-background/80 backdrop-blur supports-[backdrop-filter]:bg-background/60',
+        'border-b border-border/60',
+      )}
+    >
+      <div
+        ref={trackRef}
+        className="relative flex overflow-x-auto scrollbar-none"
+      >
+        {tabs.map((tab) => {
+          const active = tab.id === activeTab;
+          return (
+            <button
+              key={tab.id}
+              ref={(el) => {
+                if (el) tabRefs.current.set(tab.id, el);
+                else tabRefs.current.delete(tab.id);
+              }}
+              onClick={() => {
+                if (active) {
+                  window.scrollTo({ top: 0, behavior: 'smooth' });
+                } else {
+                  window.scrollTo({ top: 0 });
+                  onChange(tab.id);
+                }
+              }}
+              className={cn(
+                'relative shrink-0 px-4 py-3.5 text-sm font-medium whitespace-nowrap',
+                'transition-colors duration-150',
+                'focus:outline-none focus-visible:bg-secondary/40 rounded-sm',
+                active
+                  ? 'text-foreground'
+                  : 'text-muted-foreground hover:text-foreground',
+              )}
+              aria-selected={active}
+              role="tab"
+            >
+              {tab.label}
+            </button>
+          );
+        })}
+
+        {/* Active-tab underline indicator. Animates between tab positions. */}
+        {indicator && (
+          <span
+            aria-hidden
+            className="absolute bottom-0 h-0.5 bg-primary rounded-full transition-all duration-200 ease-out"
+            style={{ left: indicator.left, width: indicator.width }}
+          />
+        )}
+      </div>
+    </div>
+  );
+}
diff --git a/src/hooks/useAgoraFeed.ts b/src/hooks/useAgoraFeed.ts
index 87eda937..efe9edd1 100644
--- a/src/hooks/useAgoraFeed.ts
+++ b/src/hooks/useAgoraFeed.ts
@@ -3,8 +3,10 @@ import { useInfiniteQuery } from '@tanstack/react-query';
 import type { NostrEvent, NostrFilter } from '@nostrify/nostrify';
 
 import { useContentFilters } from '@/hooks/useContentFilters';
+import { useFeedSettings } from '@/hooks/useFeedSettings';
 import { useMuteList } from '@/hooks/useMuteList';
 import { CAMPAIGN_KIND } from '@/lib/campaign';
+import { getEnabledFeedKinds } from '@/lib/extraKinds';
 import { getPaginationCursor, shouldHideFeedEvent } from '@/lib/feedUtils';
 import { isEventMuted } from '@/lib/muteHelpers';
 
@@ -131,6 +133,22 @@ export interface UseAgoraFeedOptions {
    * follows nobody.
    */
   authors?: string[];
+  /**
+   * When true, also include events authored by `authors` in any of the
+   * user's enabled "feed kinds" (notes, reposts, articles, photos,
+   * videos, polls, etc. — see {@link getEnabledFeedKinds}) regardless
+   * of the `t:agora` marker. Produces a unified "everything this person
+   * has done on the network" feed.
+   *
+   * Only meaningful in combination with `authors`; setting it without
+   * `authors` would flood the feed with all kind-1 notes on every relay
+   * and is silently ignored.
+   *
+   * Used by the profile page to merge the legacy Posts tab into the
+   * Activity tab. Off by default so the strict Agora home feed isn't
+   * affected.
+   */
+  includeAuthorNotes?: boolean;
 }
 
 /** Strict Agora activity feed: campaigns, pledges, communities, world posts, #Agora notes, and donations. */
@@ -138,6 +156,7 @@ export function useAgoraFeed(enabled: boolean, options?: UseAgoraFeedOptions) {
   const { nostr } = useNostr();
   const { muteItems } = useMuteList();
   const { shouldFilterEvent } = useContentFilters();
+  const { feedSettings } = useFeedSettings();
 
   const authors = options?.authors;
   const authorsKey = authors ? [...authors].sort().join(',') : '';
@@ -145,9 +164,22 @@ export function useAgoraFeed(enabled: boolean, options?: UseAgoraFeedOptions) {
   // (e.g. the user follows nobody) — skip the query entirely.
   const authorsEmpty = authors !== undefined && authors.length === 0;
   const queryEnabled = enabled && !authorsEmpty;
+  // Author-scoped notes inclusion only makes sense when at least one
+  // author is set; ignore the option otherwise (see option doc).
+  const includeAuthorNotes = !!options?.includeAuthorNotes && !!authors && authors.length > 0;
+  // Pull the user's enabled "feed kinds" — same set the legacy Posts tab
+  // used. Includes notes (1), reposts (6), articles (30023), photos (20),
+  // videos (21/22), polls, etc. — every kind the user opted to see in
+  // mixed feeds. Memoize via stable cache-key so changing settings refetch.
+  const authorNoteKinds = includeAuthorNotes ? getEnabledFeedKinds(feedSettings) : [];
+  // Always include kind 1 / 6 even if the user disabled them in feed
+  // settings — a profile feed without notes is broken.
+  if (includeAuthorNotes && !authorNoteKinds.includes(1)) authorNoteKinds.push(1);
+  if (includeAuthorNotes && !authorNoteKinds.includes(6)) authorNoteKinds.push(6);
+  const authorNoteKindsKey = [...authorNoteKinds].sort((a, b) => a - b).join(',');
 
   const query = useInfiniteQuery<AgoraFeedPage, Error>({
-    queryKey: ['agora-feed', authorsKey],
+    queryKey: ['agora-feed', authorsKey, includeAuthorNotes, authorNoteKindsKey],
     queryFn: async ({ pageParam, signal: querySignal }) => {
       const signal = AbortSignal.any([querySignal, AbortSignal.timeout(8_000)]);
       const until = pageParam as number | undefined;
@@ -165,8 +197,35 @@ export function useAgoraFeed(enabled: boolean, options?: UseAgoraFeedOptions) {
         { kinds: [NOTE_KIND], '#t': AGORA_T_TAGS, limit: Math.ceil(AGORA_PAGE_SIZE / 2), ...authorsFilter, ...(until && { until }) },
       ];
 
+      // Author-scoped notes — every enabled feed kind from this author,
+      // no `t:agora` requirement. Powers the unified profile feed where
+      // the legacy Posts tab has been folded into Activity. The kind set
+      // mirrors the user's feed settings (notes, reposts, articles,
+      // photos, videos, polls, etc.) so a profile shows everything the
+      // person has done across the network.
+      if (includeAuthorNotes && authorNoteKinds.length > 0) {
+        filters.push({
+          kinds: authorNoteKinds,
+          ...authorsFilter,
+          limit: AGORA_PAGE_SIZE,
+          ...(until && { until }),
+        });
+      }
+
       const raw = await nostr.query(filters, { signal });
-      const filtered = raw.filter(isRelevantAgoraEvent);
+      // When author-notes are included, accept any event of an enabled
+      // feed kind authored by one of the requested authors regardless of
+      // the strict Agora gate. The strong author scope is the trust
+      // anchor.
+      const authorSet = new Set(authors ?? []);
+      const authorKindSet = new Set(authorNoteKinds);
+      const filtered = raw.filter((event) => {
+        if (isRelevantAgoraEvent(event)) return true;
+        if (!includeAuthorNotes) return false;
+        if (!authorKindSet.has(event.kind)) return false;
+        if (shouldHideFeedEvent(event)) return false;
+        return authorSet.has(event.pubkey);
+      });
       const { coordinates, eventIds } = extractDonationTargets(filtered);
 
       // Donation enrichment: pull lightning + onchain zaps that reference
diff --git a/src/hooks/useProfileCampaignStats.ts b/src/hooks/useProfileCampaignStats.ts
new file mode 100644
index 00000000..462e8244
--- /dev/null
+++ b/src/hooks/useProfileCampaignStats.ts
@@ -0,0 +1,111 @@
+import { useNostr } from '@nostrify/react';
+import { useQueries } from '@tanstack/react-query';
+import type { NostrEvent } from '@nostrify/nostrify';
+
+import { useCampaigns } from '@/hooks/useCampaigns';
+import { useAppContext } from '@/hooks/useAppContext';
+import {
+  extractOnchainZapTxid,
+  verifyOnchainZap,
+} from '@/hooks/useOnchainZaps';
+import type { ParsedCampaign } from '@/lib/campaign';
+
+export interface ProfileCampaignStats {
+  /** Total number of non-deleted campaigns authored by this pubkey. */
+  campaignCount: number;
+  /**
+   * Sum of verified on-chain donations across all of this user's
+   * campaigns, in sats. Silent-payment campaigns contribute 0 by design
+   * (donations are unlinkable, no receipts are published).
+   */
+  totalRaisedSats: number;
+  /** True while donation verification queries are still resolving. */
+  isVerifying: boolean;
+  /** The raw campaigns list, for reuse by the chip click handler. */
+  campaigns: ParsedCampaign[];
+}
+
+/**
+ * Aggregate campaign and donation stats for a single profile.
+ *
+ * Mirrors {@link useCampaignDonations} per campaign — fetches kind 8333
+ * receipts targeting each `a` coord, dedupes by txid, and verifies each
+ * one on-chain against the campaign's `w` address before counting it
+ * toward the total. Silent-payment campaigns are excluded from the
+ * verification fan-out (their donations are intentionally unlinkable).
+ *
+ * Lazy: returns 0 / empty until the campaigns list resolves, then fans
+ * out receipt fetches in parallel. Suitable for header stat chips where
+ * an in-flight number is fine.
+ */
+export function useProfileCampaignStats(pubkey: string | undefined): ProfileCampaignStats {
+  const { nostr } = useNostr();
+  const { config } = useAppContext();
+  const { esploraApis } = config;
+
+  const campaignsQuery = useCampaigns(
+    pubkey ? { authors: [pubkey], limit: 100 } : { authors: [], limit: 0 },
+  );
+  const campaigns = pubkey ? (campaignsQuery.data ?? []) : [];
+
+  // Fan out: one receipt fetch per on-chain campaign.
+  const onchainCampaigns = campaigns.filter((c) => c.wallet?.mode === 'onchain');
+  const receiptsQueries = useQueries({
+    queries: onchainCampaigns.map((campaign) => ({
+      queryKey: ['campaign-donations', 'events', campaign.aTag],
+      queryFn: async ({ signal }: { signal: AbortSignal }): Promise<NostrEvent[]> => {
+        return nostr.query(
+          [{ kinds: [8333], '#a': [campaign.aTag], limit: 500 }],
+          { signal },
+        );
+      },
+      staleTime: 15_000,
+    })),
+  });
+
+  // Flatten the receipts and dedupe by txid (prefer earliest, like
+  // useCampaignDonations does). Track which campaign each txid belongs to
+  // so we can verify against the right wallet.
+  const verificationInputs: Array<{ campaign: ParsedCampaign; event: NostrEvent }> = [];
+  const seenByCampaign = new Map<string, Set<string>>();
+  for (let i = 0; i < onchainCampaigns.length; i++) {
+    const campaign = onchainCampaigns[i];
+    const receipts = receiptsQueries[i]?.data ?? [];
+    const sortedAsc = [...receipts].sort((a, b) => a.created_at - b.created_at);
+    const seenTxids = new Set<string>();
+    for (const event of sortedAsc) {
+      const txid = extractOnchainZapTxid(event);
+      if (!txid) continue;
+      if (seenTxids.has(txid)) continue;
+      seenTxids.add(txid);
+      verificationInputs.push({ campaign, event });
+    }
+    seenByCampaign.set(campaign.aTag, seenTxids);
+  }
+
+  const verifications = useQueries({
+    queries: verificationInputs.map(({ campaign, event }) => ({
+      queryKey: ['onchain-zaps', 'verify', esploraApis, event.id, campaign.wallet?.value ?? ''],
+      queryFn: () => verifyOnchainZap(event, esploraApis, campaign.wallet?.value),
+      staleTime: 60_000,
+      enabled: !!campaign.wallet?.value,
+    })),
+  });
+
+  const totalRaisedSats = verifications.reduce(
+    (sum, v) => sum + (v.data?.amountSats ?? 0),
+    0,
+  );
+
+  const isVerifying =
+    campaignsQuery.isLoading ||
+    receiptsQueries.some((q) => q.isLoading) ||
+    verifications.some((v) => v.isLoading);
+
+  return {
+    campaignCount: campaigns.length,
+    totalRaisedSats,
+    isVerifying,
+    campaigns,
+  };
+}
diff --git a/src/hooks/useProfileOrganizations.ts b/src/hooks/useProfileOrganizations.ts
new file mode 100644
index 00000000..939c311c
--- /dev/null
+++ b/src/hooks/useProfileOrganizations.ts
@@ -0,0 +1,92 @@
+import { useMemo } from 'react';
+import type { NostrEvent } from '@nostrify/nostrify';
+import { useNostr } from '@nostrify/react';
+import { useQuery } from '@tanstack/react-query';
+
+import {
+  COMMUNITY_DEFINITION_KIND,
+  parseCommunityEvent,
+  type ParsedCommunity,
+} from '@/lib/communityUtils';
+import { dedupeAddressableLatest } from '@/lib/addressableEvents';
+
+export interface ProfileOrganization {
+  community: ParsedCommunity;
+  event: NostrEvent;
+  /** This pubkey is the founder (author of the kind 34550 event). */
+  isFounder: boolean;
+  /** This pubkey is listed in a `p` tag with role `moderator`. */
+  isModerator: boolean;
+}
+
+function organizationRank(entry: ProfileOrganization): number {
+  if (entry.isFounder) return 0;
+  return 1;
+}
+
+/**
+ * Organizations any given pubkey is publicly associated with — orgs they
+ * founded and orgs they moderate.
+ *
+ * Distinct from {@link useUserOrganizations}, which augments the logged-in
+ * user's view with their private NIP-51 community bookmarks (kind 10004).
+ * Bookmarks are personal state that a third party can't see without the
+ * owner's keys, so for someone else's profile we surface only the public
+ * founder + moderator signals.
+ */
+export function useProfileOrganizations(pubkey: string | undefined) {
+  const { nostr } = useNostr();
+
+  const query = useQuery<ProfileOrganization[]>({
+    queryKey: ['profile-organizations', pubkey ?? ''],
+    queryFn: async ({ signal }) => {
+      if (!pubkey) return [];
+
+      const combinedSignal = AbortSignal.any([signal, AbortSignal.timeout(8000)]);
+
+      const [foundedEvents, pTaggedEvents] = await Promise.all([
+        nostr.query(
+          [{ kinds: [COMMUNITY_DEFINITION_KIND], authors: [pubkey], limit: 50 }],
+          { signal: combinedSignal },
+        ),
+        nostr.query(
+          [{ kinds: [COMMUNITY_DEFINITION_KIND], '#p': [pubkey], limit: 100 }],
+          { signal: combinedSignal },
+        ),
+      ]);
+
+      const entries: ProfileOrganization[] = [];
+      for (const event of dedupeAddressableLatest([...foundedEvents, ...pTaggedEvents])) {
+        const community = parseCommunityEvent(event);
+        if (!community) continue;
+
+        const isFounder = community.founderPubkey === pubkey;
+        const isModerator = community.moderatorPubkeys.includes(pubkey);
+
+        if (!isFounder && !isModerator) continue;
+
+        entries.push({ community, event, isFounder, isModerator });
+      }
+
+      entries.sort((a, b) => {
+        const rankDiff = organizationRank(a) - organizationRank(b);
+        if (rankDiff !== 0) return rankDiff;
+        return b.event.created_at - a.event.created_at;
+      });
+
+      return entries;
+    },
+    enabled: !!pubkey,
+    staleTime: 60_000,
+  });
+
+  return useMemo(
+    () => ({
+      data: query.data ?? [],
+      isLoading: query.isLoading,
+      isError: query.isError,
+      error: query.error,
+    }),
+    [query.data, query.isLoading, query.isError, query.error],
+  );
+}
diff --git a/src/index.css b/src/index.css
index fccd7ad2..6c1180e4 100644
--- a/src/index.css
+++ b/src/index.css
@@ -704,7 +704,8 @@
 }
 
 /* Slow Ken-Burns-style pan for full-bleed hero images. The image is
-   oversized (scale 1.12) so the translation never reveals the edge. */
+   oversized (scale 1.12) so the translation never reveals the edge.
+   Used by HeroBanner on Communities/Actions/Guide pages. */
 @keyframes heroPanRight {
   0%   { transform: scale(1.12) translateX(-1.5%); }
   50%  { transform: scale(1.12) translateX(1.5%); }
@@ -718,43 +719,37 @@
 .hero-pan-right { animation: heroPanRight 28s ease-in-out infinite; }
 .hero-pan-left  { animation: heroPanLeft 28s ease-in-out infinite; }
 
-/* Slow breathing glow used on the hero globe's outer halo so the beacon
-   feels alive rather than statically pasted. The radius itself doesn't
-   change — only opacity — so the layout stays rock-stable. Range is
-   intentionally narrow + low so the halo is felt, not seen. */
-@keyframes heroGlobeHaloBreath {
-  0%   { opacity: 0.32; }
-  50%  { opacity: 0.55; }
-  100% { opacity: 0.32; }
+/* Lightning-arc flow on the home hero. Each path is dashed and the
+   dash offset animates by exactly one full dash period, so the loop
+   point is visually identical to the start point — no snap, no
+   visible restart. Dash sizes are in screen pixels because the arcs
+   use `vector-effect: non-scaling-stroke`. */
+@keyframes heroArcFlow {
+  0%   { stroke-dashoffset: 0; }
+  100% { stroke-dashoffset: -16; }
+}
+.hero-arc-flow {
+  stroke-dasharray: 6 10;
+  animation: heroArcFlow 2.4s linear infinite;
+}
+
+/* City-node pulse used on the home hero. The dot itself doesn't move;
+   we just breathe the halo's opacity so the location reads as a live
+   beacon. Offsets are staggered per-node from the JSX so the field
+   pulses organically rather than in lockstep. */
+@keyframes heroNodePulse {
+  0%   { opacity: 0.35; transform: scale(0.85); }
+  50%  { opacity: 0.95; transform: scale(1.15); }
+  100% { opacity: 0.35; transform: scale(0.85); }
+}
+.hero-node-pulse {
+  transform-origin: center;
+  transform-box: fill-box;
+  animation: heroNodePulse 3.2s ease-in-out infinite;
 }
-.hero-globe-halo-breath { animation: heroGlobeHaloBreath 6.5s ease-in-out infinite; }
 
 @media (prefers-reduced-motion: reduce) {
   .hero-pan-right, .hero-pan-left { animation: none; }
-  .hero-globe-halo-breath { animation: none; opacity: 0.42; }
-}
-
-/* Dark drop-shadow for hero copy — photo backgrounds are always colorful,
-   so we want a dark shadow regardless of light/dark theme. */
-.hero-text-shadow {
-  text-shadow:
-    0 2px 8px rgba(0, 0, 0, 0.8),
-    0 0 20px rgba(0, 0, 0, 0.45);
-}
-
-.hero-text-shadow-soft {
-  text-shadow: 0 1px 6px rgba(0, 0, 0, 0.65);
-}
-
-/* On mobile the globe sits under the headline — soften its left edge. */
-.hero-globe-mask {
-  -webkit-mask-image: linear-gradient(to right, transparent 0%, black 48%, black 100%);
-  mask-image: linear-gradient(to right, transparent 0%, black 48%, black 100%);
-}
-
-@media (min-width: 640px) {
-  .hero-globe-mask {
-    -webkit-mask-image: none;
-    mask-image: none;
-  }
+  .hero-arc-flow { animation: none; stroke-dasharray: none; }
+  .hero-node-pulse { animation: none; opacity: 0.7; }
 }
diff --git a/src/main.tsx b/src/main.tsx
index 6ed92886..c4901e41 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -17,6 +17,7 @@ import './index.css';
 import './i18n';
 
 import '@fontsource-variable/inter';
+import '@fontsource/bebas-neue/400.css';
 
 // ─── Native status bar theming (Android APK / iOS) ───────────────────────────
 // Keeps the OS top chrome in sync with the active app theme.
diff --git a/src/pages/ActionsPage.tsx b/src/pages/ActionsPage.tsx
index 7d98fbda..4cd6acde 100644
--- a/src/pages/ActionsPage.tsx
+++ b/src/pages/ActionsPage.tsx
@@ -184,12 +184,12 @@ function ActionCard({ action, isExpired, btcPrice }: { action: Action; isExpired
       to={`/${naddr}`}
       className="group block rounded-xl overflow-hidden focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2 focus-visible:ring-offset-background motion-safe:transition-transform motion-safe:duration-200 motion-safe:hover:-translate-y-0.5"
     >
-      <Card className={cn('overflow-hidden border-border/70 shadow-sm motion-safe:transition-shadow motion-safe:duration-200 group-hover:shadow-lg h-full flex flex-col', isExpired && 'opacity-75')}>
+      <Card className="overflow-hidden border-border/70 shadow-sm motion-safe:transition-shadow motion-safe:duration-200 group-hover:shadow-lg h-full flex flex-col">
         <div className="relative w-full aspect-[16/9] bg-gradient-to-br from-primary/15 via-primary/5 to-secondary">
           <img
             src={coverImage}
             alt=""
-            className={cn('absolute inset-0 size-full object-cover', isExpired && 'grayscale')}
+            className="absolute inset-0 size-full object-cover"
             onError={() => setImageLoadFailed(true)}
             loading="lazy"
           />
diff --git a/src/pages/CampaignsPage.tsx b/src/pages/CampaignsPage.tsx
index 06c2ff53..5fc588ee 100644
--- a/src/pages/CampaignsPage.tsx
+++ b/src/pages/CampaignsPage.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useMemo, useState } from 'react';
+import { useMemo, useState } from 'react';
 import { Link } from 'react-router-dom';
 import { useSeoMeta } from '@unhead/react';
 import { ChevronDown, EyeOff, HandHeart, Hourglass, PlusCircle, ShieldCheck } from 'lucide-react';
@@ -11,11 +11,7 @@ import {
   CollapsibleTrigger,
 } from '@/components/ui/collapsible';
 import { CampaignCard, CampaignCardSkeleton } from '@/components/CampaignCard';
-import { HeroGlobe } from '@/components/HeroGlobe';
-import { HeroCampaignSpotlight } from '@/components/HeroCampaignSpotlight';
-import { CampaignHeroBackground } from '@/components/CampaignHeroBackground';
-import { HeroAtmosphere } from '@/components/HeroAtmosphere';
-import { hopeHueFor } from '@/lib/hopePalette';
+import { HeroLightningMap } from '@/components/HeroLightningMap';
 import { cn } from '@/lib/utils';
 import { useCampaigns } from '@/hooks/useCampaigns';
 import { useCampaignModeration } from '@/hooks/useCampaignModeration';
@@ -25,8 +21,6 @@ import { useLayoutOptions } from '@/contexts/LayoutContext';
 import { useAppContext } from '@/hooks/useAppContext';
 import { type ParsedCampaign } from '@/lib/campaign';
 
-import { getCoordinates } from '@/lib/coordinates';
-
 /** Cap on how many featured campaigns we render in the home-page row. */
 const MAX_FEATURED = 4;
 
@@ -150,194 +144,70 @@ export function CampaignsPage() {
     );
   }, [isMod, user, moderation, ownCampaigns]);
 
-  // Build the spotlight pool from the featured campaigns only. A featured
-  // campaign without a resolvable country is silently dropped — the globe
-  // needs coordinates to pin it, and the banner cycles in lockstep with
-  // the globe so the two stay in sync.
-  const spotlightables = useMemo(() => {
-    type Entry = {
-      key: string;
-      campaign: ParsedCampaign;
-      lat: number;
-      lng: number;
-    };
-    const out: Entry[] = [];
-    const seenAtag = new Set<string>();
-    const seenCountry = new Set<string>();
-
-    const add = (c: ParsedCampaign) => {
-      if (seenAtag.has(c.aTag)) return;
-      const countryCode = c.countryCode;
-      if (!countryCode) return;
-      const coords = getCoordinates(countryCode);
-      if (!coords) return;
-      // Deduplicate by country so two featured campaigns in the same
-      // country don't pile overlapping markers on the globe. Featured
-      // order is preserved — the first one wins.
-      if (seenCountry.has(countryCode)) return;
-      seenAtag.add(c.aTag);
-      seenCountry.add(countryCode);
-      out.push({ key: c.aTag, campaign: c, lat: coords.latitude, lng: coords.longitude });
-    };
-
-    for (const c of orderedFeatured) {
-      add(c);
-    }
-    return out;
-  }, [orderedFeatured]);
-
-  const globeMarkers = useMemo(
-    () =>
-      spotlightables.map((s) => ({
-        key: s.key,
-        lat: s.lat,
-        lng: s.lng,
-        label: s.campaign.title,
-      })),
-    [spotlightables],
-  );
-
-  // Selection lives here so the globe and the spotlight card stay in sync.
-  // `null` means "auto-cycle through the spotlightables"; clicking a marker
-  // pins the selection until the user clicks a different one.
-  const [selectedKey, setSelectedKey] = useState<string | null>(null);
-  // A separate cursor advances when no marker is selected, so cycling
-  // continues to drive the spotlight even while the user is reading.
-  const [cycleIndex, setCycleIndex] = useState(0);
-
-  useEffect(() => {
-    if (selectedKey !== null) return;
-    if (spotlightables.length <= 1) return;
-    const id = window.setInterval(() => {
-      setCycleIndex((i) => (i + 1) % spotlightables.length);
-    }, 6_000);
-    return () => window.clearInterval(id);
-  }, [selectedKey, spotlightables.length]);
-
-  // Resolve the spotlight to actually display.
-  const spotlightCampaign = useMemo(() => {
-    if (selectedKey) {
-      return spotlightables.find((s) => s.key === selectedKey)?.campaign ?? null;
-    }
-    if (spotlightables.length === 0) return null;
-    return spotlightables[cycleIndex % spotlightables.length].campaign;
-  }, [selectedKey, cycleIndex, spotlightables]);
-
-  // The key the globe should highlight matches whatever the card shows.
-  const highlightedMarkerKey = useMemo(() => {
-    if (selectedKey) return selectedKey;
-    if (spotlightables.length === 0) return null;
-    return spotlightables[cycleIndex % spotlightables.length].key;
-  }, [selectedKey, cycleIndex, spotlightables]);
-
-  // Active "hopeful" hue keyed to the spotlit campaign. Both the
-  // surrounding atmosphere and the globe consume this so the entire
-  // hero shifts color together as campaigns cycle.
-  const activeHue = useMemo(
-    () => hopeHueFor(spotlightCampaign?.aTag),
-    [spotlightCampaign?.aTag],
-  );
-
   return (
     <main className="min-h-screen pb-16">
       {/* Hero.
 
-          Layered, back-to-front:
-            1. CampaignHeroBackground — full-bleed crossfading banner image
-               from the currently-spotlit campaign, with a warm tint + film
-               grain so headlines stay legible.
-            2. HeroGlobe — large slow-spinning globe anchored to the right,
-               heart markers click-select campaigns.
-            3. Headline column — title + paragraph + CTAs, top-left.
-            4. HeroCampaignSpotlight — title + summary + "View campaign"
-               button for the active campaign, bottom-right.
+          Dark, brand-driven, type-led. Three layers:
+            1. Near-black backdrop (`bg-[hsl(220_25%_6%)]`) — the canvas
+               every other element sits on. No campaign photo, no random
+               hue cycling: the hero looks the same on every visit, so
+               quality doesn't depend on which campaign is featured.
+            2. HeroLightningMap — decorative dark world map with curated
+               glowing brand-orange arcs and pulsing city nodes. Pure SVG,
+               negligible render cost, animations honor reduced-motion.
+            3. Headline column on the left, lifted by a left-edge gradient
+               inside HeroLightningMap so type stays readable without any
+               text-shadow at all. */}
+      <section className="relative overflow-hidden border-b border-border bg-[hsl(220_25%_6%)] text-white">
+        <HeroLightningMap />
 
-          Inspired by the Treasures HeroGallery pattern: the photo IS the
-          background, everything else floats over it. */}
-      <section className="relative overflow-hidden border-b border-border bg-secondary/40">
-        <CampaignHeroBackground imageUrl={spotlightCampaign?.banner} />
-
-        {/* Per-campaign hopeful color atmosphere. Sits on top of the
-            photo and below the globe so its mix-blend-mode: screen layers
-            can warm the darks back up — the photo ends up tinted toward
-            the active hue without losing headline contrast. */}
-        <HeroAtmosphere seed={spotlightCampaign?.aTag} />
-
-        {/* Globe — center sits a little to the left of the TopNav account
-            switcher anchor so a larger slice of the sphere reads inside
-            the hero rather than off the right edge. */}
-        <div className="absolute inset-0 pointer-events-none">
-          <div className="relative max-w-7xl mx-auto h-full px-4 sm:px-6">
-            <div className="absolute inset-y-0 right-4 sm:right-6 flex items-center">
-              <div className="pointer-events-auto hero-globe-mask translate-x-[40%] sm:translate-x-[38%] lg:translate-x-[38%] opacity-90">
-                <HeroGlobe
-                  markers={globeMarkers}
-                  selectedKey={highlightedMarkerKey}
-                  onMarkerClick={(key) =>
-                    // Toggle off when the user re-clicks the active
-                    // marker, restoring the auto-cycle.
-                    setSelectedKey((prev) => (prev === key ? null : key))
-                  }
-                  hue={activeHue}
-                  // Fluid sizing scaled to dynamic viewport width (dvw),
-                  // clamped so it never shrinks below phone-comfortable
-                  // nor balloons on ultra-wide monitors.
-                  className="aspect-square max-w-none drop-shadow-2xl"
-                  style={{ width: 'clamp(620px, 58dvw, 820px)' }}
-                />
-              </div>
-            </div>
-          </div>
-        </div>
-
-        {/* Readability scrim. Layered *above* the globe so the headline
-            area stays legible even when a slice of the sphere sits behind
-            it. Only shown on tablet and below — at lg+ the globe sits
-            outside the headline column, so the scrim would just mute the
-            photo for no benefit. */}
-        <div
-          className="absolute inset-0 pointer-events-none bg-gradient-to-r from-black/55 via-black/30 to-transparent lg:hidden"
-          aria-hidden="true"
-        />
-
-        {/* Foreground content — headline + CTAs at the top, spotlight info
-            at the bottom. Shares the `max-w-7xl mx-auto` container with the
-            globe so everything aligns to the same left/right axis. */}
-        <div className="relative max-w-7xl mx-auto px-4 sm:px-6 py-14 lg:py-20 min-h-[560px] sm:min-h-[600px] lg:min-h-[640px] flex flex-col text-white">
-          <div className="relative space-y-5 max-w-2xl">
-            <h1 className="text-4xl sm:text-5xl lg:text-6xl font-bold tracking-tight leading-[1.1] hero-text-shadow">
-              Connecting activists to unstoppable funding.
+        <div className="relative max-w-7xl mx-auto px-4 sm:px-6 py-16 lg:py-24 min-h-[440px] sm:min-h-[480px] lg:min-h-[520px] flex flex-col justify-center">
+          <div className="space-y-6 max-w-2xl">
+            <h1
+              className="font-display italic text-6xl sm:text-7xl lg:text-8xl font-normal tracking-wide leading-none uppercase"
+              style={{
+                // Bebas Neue only ships at weight 400. Paint a stroke the
+                // same color as the fill to fatten the letterforms without
+                // the fuzz a synthetic-bold transform would produce.
+                WebkitTextStroke: '0.022em currentColor',
+              }}
+            >
+              Connecting activists to
+              {/* "unstoppable" gets a solid brand-orange highlighter
+                  block on its own line. The negative left margin
+                  (`-ml-1.5`) pulls the box's left edge back by exactly
+                  the box's own horizontal padding so the U sits flush
+                  with the column's left edge instead of being inset by
+                  the highlighter's padding. */}
+              <br />
+              {/* Asymmetric padding: zero on the left so "unstoppable"'s
+                  U sits flush with the column edge (matching the row
+                  above), but extra padding on the right so the orange
+                  box extends past the word's trailing edge as a
+                  deliberate visual flourish. The inner text is then
+                  nudged slightly leftward (negative left margin on the
+                  inner element) so the U optically aligns with the
+                  "C" in "Connecting" — Bebas Neue's italic skew shifts
+                  the visual left edge of the U rightward of its
+                  geometric box. */}
+              <span className="inline-block w-fit pl-0 pr-3 pt-1 pb-0 -mt-1 -mb-3 bg-primary text-white leading-[0.8] align-baseline">
+                <span className="-ml-1 inline-block">unstoppable</span>
+              </span>{' '}
+              funding.
             </h1>
-            <p className="text-base sm:text-lg text-white/85 max-w-2xl hero-text-shadow-soft">
-              Raise Bitcoin directly from supporters around the world. Every donation settles
-              straight to your campaign's beneficiaries, with no middlemen, no chargebacks, and no
-              platform holding your funds.
+            <p className="text-base sm:text-lg text-white/80 max-w-xl">
+              Raise Bitcoin directly from supporters around the world. Every donation
+              settles straight to your campaign's beneficiaries, with no middlemen, no
+              chargebacks, and no platform holding your funds.
             </p>
-            <div className="flex flex-wrap gap-3 pt-2">
-              {/* Primary CTA — clean translucent glass pill with a hint
-                  of warmth bleeding through. The hopefulness comes from
-                  the photo + atmosphere underneath plus a soft warm
-                  shadow, not from added gloss. */}
+            <div className="flex flex-wrap gap-3 pt-1">
+              {/* Primary CTA — solid brand-orange pill. The dark hero gives
+                  the brand color the spotlight without competing with it. */}
               <Button
                 size="lg"
                 asChild
-                className={cn(
-                  // A touch larger than the default lg button — enough
-                  // weight to read as primary, not enough to feel chunky.
-                  'relative rounded-full text-white font-semibold text-base h-12 px-7 [&_svg]:size-[18px]',
-                  // Subtle warm-tinted glass body, kept more transparent.
-                  // Hover lifts the tint a hair without changing the pill
-                  // character — no shadow bloom, no halo.
-                  'bg-gradient-to-br from-white/14 via-amber-100/10 to-rose-100/10 hover:from-white/20 hover:via-amber-100/14 hover:to-rose-100/14',
-                  'backdrop-blur-xl backdrop-saturate-150',
-                  'border border-white/25 hover:border-white/35',
-                  // Single hair-thin inner highlight + a warm-tinted
-                  // realistic drop shadow that ties the button to the
-                  // hopeful palette. Hover only nudges the shadow.
-                  'shadow-[inset_0_0_0_1px_rgb(255_255_255/0.08),0_10px_28px_-12px_hsl(24_85%_45%/0.4)]',
-                  'hover:shadow-[inset_0_0_0_1px_rgb(255_255_255/0.12),0_12px_32px_-10px_hsl(24_85%_45%/0.5)]',
-                  'motion-safe:transition-colors motion-safe:duration-200',
-                )}
+                className="rounded-full text-primary-foreground font-semibold text-base h-12 px-7 [&_svg]:size-[18px] motion-safe:transition-colors"
               >
                 <Link to="/campaigns/new">
                   <PlusCircle className="mr-2" />
@@ -349,22 +219,13 @@ export function CampaignsPage() {
                   variant="outline"
                   size="lg"
                   asChild
-                  className="rounded-full bg-background/70 backdrop-blur h-12 px-6 text-base text-foreground"
+                  className="rounded-full h-12 px-6 text-base border-white/30 bg-white/5 text-white hover:bg-white/10 hover:text-white hover:border-white/50"
                 >
                   <a href="#campaigns">Explore campaigns</a>
                 </Button>
               )}
             </div>
           </div>
-
-          {(spotlightCampaign || (featuredLoading && spotlightables.length === 0)) && (
-            <div className="relative mt-auto pt-10 max-w-sm">
-              <HeroCampaignSpotlight
-                campaign={spotlightCampaign}
-                isLoading={featuredLoading && spotlightables.length === 0}
-              />
-            </div>
-          )}
         </div>
       </section>
 
diff --git a/src/pages/ProfilePage.tsx b/src/pages/ProfilePage.tsx
index cced0ebc..116bc852 100644
--- a/src/pages/ProfilePage.tsx
+++ b/src/pages/ProfilePage.tsx
@@ -3,52 +3,36 @@ import { createPortal } from 'react-dom';
 import { useParams, Link, useNavigate } from 'react-router-dom';
 import { useInView } from 'react-intersection-observer';
 import { useNostr } from '@nostrify/react';
-import { useInfiniteQuery, useQuery, useQueryClient } from '@tanstack/react-query';
+import { useInfiniteQuery, useQueryClient } from '@tanstack/react-query';
 import { useSeoMeta } from '@unhead/react';
 import { nip19 } from 'nostr-tools';
-import { Zap, Flame, MoreHorizontal, ClipboardCopy, ExternalLink, VolumeX, Flag, Bitcoin, Pin, X, QrCode, Check, Copy, Loader2, Download, Pencil, Trash2, RotateCcw, MessageSquare, Globe, Mail, Plus, GripVertical, ListPlus, Award, PanelLeft } from 'lucide-react';
+import { Zap, ClipboardCopy, ExternalLink, VolumeX, Flag, Bitcoin, X, QrCode, Check, Copy, Loader2, Download, RotateCcw, Mail, ListPlus, Award } from 'lucide-react';
 
 import { Avatar, AvatarImage, AvatarFallback } from '@/components/ui/avatar';
 import { Button } from '@/components/ui/button';
 import { Skeleton } from '@/components/ui/skeleton';
 import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogTrigger } from '@/components/ui/dialog';
-import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuTrigger } from '@/components/ui/dropdown-menu';
 import { ScrollArea } from '@/components/ui/scroll-area';
 import { Separator } from '@/components/ui/separator';
 import { useLayoutOptions } from '@/contexts/LayoutContext';
-import { ProfileRightSidebar } from '@/components/ProfileRightSidebar';
-import { NoteCard } from '@/components/NoteCard';
-import { FeedCard } from '@/components/FeedCard';
-import { ComposeBox } from '@/components/ComposeBox';
-import { ReplyComposeModal } from '@/components/ReplyComposeModal';
-import { ProfileReactionButton } from '@/components/ProfileReactionButton';
-import { FollowToggleButton } from '@/components/FollowButton';
 import { ZapDialog } from '@/components/ZapDialog';
 import { ExternalFavicon } from '@/components/ExternalFavicon';
-import { Nip05Badge, VerifiedNip05Text } from '@/components/Nip05Badge';
+import { VerifiedNip05Text } from '@/components/Nip05Badge';
 import { useAppContext } from '@/hooks/useAppContext';
 import { useAuthor } from '@/hooks/useAuthor';
 import { useCurrentUser } from '@/hooks/useCurrentUser';
 import { useToast } from '@/hooks/useToast';
-import { usePinnedNotes } from '@/hooks/usePinnedNotes';
 
 import { useFollowList, useFollowActions } from '@/hooks/useFollowActions';
 import { useMuteList } from '@/hooks/useMuteList';
-import { isEventMuted } from '@/lib/muteHelpers';
-import { useProfileFeed, useProfileLikes as useProfileLikesInfinite, useTabFeed, filterByTab } from '@/hooks/useProfileFeed';
 import type { ProfileTab as CoreProfileTab } from '@/hooks/useProfileFeed';
-import { useProfileMedia } from '@/hooks/useProfileMedia';
-import { MediaCollage, MediaCollageSkeleton } from '@/components/MediaCollage';
 import { useProfileSupplementary } from '@/hooks/useProfileData';
-import { useWallComments } from '@/hooks/useWallComments';
-import { FlatThreadedReplyList } from '@/components/ThreadedReplyList';
 import { useNip05Resolve } from '@/hooks/useNip05Resolve';
 import { genUserName } from '@/lib/genUserName';
 
 import { canZap } from '@/lib/canZap';
 import { openUrl } from '@/lib/downloadFile';
 import { EmojifiedText } from '@/components/CustomEmoji';
-import { BioContent } from '@/components/BioContent';
 import { EmbeddedNote } from '@/components/EmbeddedNote';
 import { EmbeddedNaddr } from '@/components/EmbeddedNaddr';
 import { PullToRefresh } from '@/components/PullToRefresh';
@@ -61,68 +45,30 @@ import { VideoPlayer } from '@/components/VideoPlayer';
 import { useUserStatus } from '@/hooks/useUserStatus';
 import { useNip85UserStats } from '@/hooks/useNip85Stats';
 import { useFeedSettings } from '@/hooks/useFeedSettings';
-import { useProfileTabs } from '@/hooks/useProfileTabs';
-import { usePublishProfileTabs } from '@/hooks/usePublishProfileTabs';
 
 import { FollowQRDialog } from '@/components/FollowQRDialog';
 import { ProfileRecoveryDialog } from '@/components/ProfileRecoveryDialog';
 import { GiveBadgeDialog } from '@/components/GiveBadgeDialog';
-import { BadgeThumbnail } from '@/components/BadgeThumbnail';
-import { useProfileBadges } from '@/hooks/useProfileBadges';
-import { useBadgeDefinitions } from '@/hooks/useBadgeDefinitions';
-import { ProfileTabEditModal } from '@/components/ProfileTabEditModal';
-import { useResolveTabFilter } from '@/hooks/useResolveTabFilter';
-import type { ProfileTab, ProfileTabsData, TabFilter, TabVarDef } from '@/lib/profileTabsEvent';
-import {
-  DndContext, closestCenter, KeyboardSensor, PointerSensor, useSensor, useSensors,
-  type DragEndEvent,
-} from '@dnd-kit/core';
-import {
-  SortableContext, sortableKeyboardCoordinates, useSortable,
-  horizontalListSortingStrategy, arrayMove,
-} from '@dnd-kit/sortable';
-import { CSS as DndCSS } from '@dnd-kit/utilities';
-import { formatNumber } from '@/lib/formatNumber';
-import { SubHeaderBar } from '@/components/SubHeaderBar';
-import { useActiveTabIndicator } from '@/components/SubHeaderBarContext';
-import { TabButton } from '@/components/TabButton';
+import { useProfileCampaignStats } from '@/hooks/useProfileCampaignStats';
+import { useActions } from '@/hooks/useActions';
+import { useBtcPrice } from '@/hooks/useBtcPrice';
+import { DonateDialog } from '@/components/DonateDialog';
+import { ProfileIdentityRail } from '@/components/profile/ProfileIdentityRail';
+import { ProfileCampaignsTab } from '@/components/profile/ProfileCampaignsTab';
+import { ProfilePledgesTab } from '@/components/profile/ProfilePledgesTab';
+import { ProfileActivityTab } from '@/components/profile/ProfileActivityTab';
+import { ProfileTabs } from '@/components/profile/ProfileTabs';
+import type { ParsedCampaign } from '@/lib/campaign';
 import type { AddrCoords } from '@/hooks/useEvent';
 import { sanitizeUrl } from '@/lib/sanitizeUrl';
 import { impactMedium } from '@/lib/haptics';
 import { cn } from '@/lib/utils';
 
-import type { FeedItem } from '@/lib/feedUtils';
 import type { NostrEvent } from '@nostrify/nostrify';
 import QRCode from 'qrcode';
 import { isWeatherFieldLabel } from '@/lib/weatherStation';
 import { WeatherStationCard } from '@/components/WeatherStationCard';
 
-const STREAK_WINDOW_HOURS = 24;
-const STREAK_DISPLAY_LIMIT = 99;
-
-/** Calculate posting streak: consecutive kind 1 posts within 24-hour windows. */
-function calculateStreak(posts: NostrEvent[]): number {
-  if (!posts || posts.length === 0) return 0;
-
-  const kind1Posts = posts.filter((e) => e.kind === 1);
-  if (kind1Posts.length === 0) return 0;
-
-  const sorted = [...kind1Posts].sort((a, b) => b.created_at - a.created_at);
-  const windowSeconds = STREAK_WINDOW_HOURS * 3600;
-
-  let streak = 1;
-  for (let i = 0; i < sorted.length - 1; i++) {
-    const gap = sorted[i].created_at - sorted[i + 1].created_at;
-    if (gap <= windowSeconds) {
-      streak++;
-    } else {
-      break;
-    }
-  }
-
-  return streak;
-}
-
 /** Parse the custom "fields" array from kind 0 metadata content. */
 function parseProfileFields(content: string): Array<{ label: string; value: string }> {
   try {
@@ -158,9 +104,6 @@ function ProfileMoreMenu({ pubkey, displayName, open, onOpenChange, isOwnProfile
   const npubEncoded = useMemo(() => nip19.npubEncode(pubkey), [pubkey]);
   const { addMute, removeMute, isMuted } = useMuteList();
   const userMuted = isMuted('pubkey', pubkey);
-  const { addToSidebar, removeFromSidebar, orderedItems } = useFeedSettings();
-  const sidebarId = `nostr:${npubEncoded}`;
-  const isInSidebar = orderedItems.includes(sidebarId);
   const [reportOpen, setReportOpen] = useState(false);
   const [addToListOpen, setAddToListOpen] = useState(false);
   const [recoveryOpen, setRecoveryOpen] = useState(false);
@@ -207,17 +150,6 @@ function ProfileMoreMenu({ pubkey, displayName, open, onOpenChange, isOwnProfile
   const handleReport = () => openAfterClose(setReportOpen);
   const handleAddToList = () => openAfterClose(setAddToListOpen);
 
-  const handleToggleSidebar = () => {
-    if (isInSidebar) {
-      removeFromSidebar(sidebarId);
-      toast({ title: 'Removed from sidebar' });
-    } else {
-      addToSidebar(sidebarId);
-      toast({ title: 'Added to sidebar' });
-    }
-    close();
-  };
-
   const handleRecovery = () => openAfterClose(setRecoveryOpen);
   const handleGiveBadge = () => openAfterClose(setGiveBadgeOpen);
   const handleWriteLetter = () => {
@@ -251,11 +183,6 @@ function ProfileMoreMenu({ pubkey, displayName, open, onOpenChange, isOwnProfile
             label="Add to list"
             onClick={handleAddToList}
           />
-          <MenuRow
-            icon={isInSidebar ? <Trash2 className="size-5" /> : <PanelLeft className="size-5" />}
-            label={isInSidebar ? 'Remove from sidebar' : 'Add to sidebar'}
-            onClick={handleToggleSidebar}
-          />
         </div>
 
         {isOwnProfile && (
@@ -476,80 +403,6 @@ function FollowingListModal({ pubkeys, open, onOpenChange, displayName }: Follow
   );
 }
 
-type EditableTab = { label: string; isCore: boolean; tab?: ProfileTab };
-
-function SortableTabChip({
-  tab, active, onSelect, onRemove, onEdit,
-}: {
-  tab: EditableTab;
-  active: boolean;
-  onSelect: () => void;
-  onRemove: () => void;
-  onEdit?: () => void;
-}) {
-  const { attributes, listeners, setNodeRef, transform, transition, isDragging } = useSortable({ id: tab.label });
-  const chipRef = useRef<HTMLDivElement>(null);
-  useActiveTabIndicator(active, chipRef);
-
-  return (
-    <div
-      ref={(node) => {
-        setNodeRef(node);
-        (chipRef as React.MutableRefObject<HTMLDivElement | null>).current = node;
-      }}
-      style={{ transform: transform ? DndCSS.Transform.toString({ ...transform, x: Math.round(transform.x), y: Math.round(transform.y) }) : undefined, transition }}
-      className={cn(
-        'shrink-0 relative flex items-stretch group/chip px-1 text-sm font-medium select-none whitespace-nowrap',
-        active ? 'text-foreground' : 'text-muted-foreground',
-        isDragging && 'opacity-60 z-50',
-      )}
-      {...attributes}
-    >
-      {/* Grip handle */}
-      <span
-        {...listeners}
-        className="shrink-0 flex items-center cursor-grab active:cursor-grabbing touch-none pr-1"
-        aria-label="Drag to reorder"
-      >
-        <GripVertical className="size-4 text-muted-foreground/40" />
-      </span>
-
-      {/* Tab label — tap navigates */}
-      <button
-        onPointerDown={(e) => e.stopPropagation()}
-        onClick={(e) => { e.stopPropagation(); onSelect(); }}
-        className="py-3.5 pr-1"
-      >
-        {tab.label}
-      </button>
-
-      {/* Edit — only rendered for active custom (non-core) tabs */}
-      {active && !tab.isCore && onEdit && (
-        <button
-          onPointerDown={(e) => e.stopPropagation()}
-          onClick={(e) => { e.stopPropagation(); onEdit(); }}
-          className="shrink-0 flex items-center justify-center py-3.5 px-1.5 text-muted-foreground/50 hover:text-primary transition-colors"
-          aria-label={`Edit ${tab.label}`}
-        >
-          <Pencil className="size-3.5" />
-        </button>
-      )}
-
-      {/* × — only rendered when active */}
-      {active && (
-        <button
-          onPointerDown={(e) => e.stopPropagation()}
-          onClick={(e) => { e.stopPropagation(); onRemove(); }}
-          className="shrink-0 flex items-center justify-center text-xl leading-none font-bold py-3.5 pl-1 pr-1 text-muted-foreground/50 hover:text-destructive transition-colors"
-          aria-label={`Remove ${tab.label}`}
-        >
-          ×
-        </button>
-      )}
-    </div>
-  );
-}
-
 // ----- Favicon (mobile) -----
 
 
@@ -805,30 +658,6 @@ function WeatherFieldInline({ value }: { value: string }) {
   return <WeatherStationCard value={value} compact />;
 }
 
-// ----- Pinned Label -----
-
-function PinnedLabel({ isOwn, onUnpin }: { isOwn: boolean; onUnpin: () => void }) {
-  if (isOwn) {
-    return (
-      <button
-        className="group flex items-center gap-1.5 text-xs text-muted-foreground px-4 pt-3 pb-0 hover:text-destructive transition-colors"
-        onClick={(e) => { e.stopPropagation(); onUnpin(); }}
-      >
-        <Pin className="size-3 rotate-45" />
-        <span className="group-hover:hidden">Pinned</span>
-        <span className="hidden group-hover:inline">Unpin?</span>
-      </button>
-    );
-  }
-
-  return (
-    <div className="flex items-center gap-1.5 text-xs text-muted-foreground px-4 pt-3 pb-0">
-      <Pin className="size-3 rotate-45" />
-      <span>Pinned</span>
-    </div>
-  );
-}
-
 // ----- Profile Image Lightbox -----
 
 function ProfileImageLightbox({ imageUrl, onClose }: { imageUrl: string; onClose: () => void }) {
@@ -986,27 +815,22 @@ function ProfileBannerImage({ src, onClick }: { src: string; onClick: () => void
 
 // ----- Main Component -----
 
-const CORE_TAB_LABELS = ['Posts', 'Posts & replies', 'Media', 'Badges', 'Likes', 'Wall'];
-const DEFAULT_TAB_LABELS = ['Posts', 'Posts & replies', 'Media', 'Likes', 'Wall'];
+const DEFAULT_TAB_LABELS = ['Activity', 'Campaigns', 'Pledges'];
 
 // Map from display label → internal tab id for core tabs
 const CORE_TAB_IDS: Record<string, string> = {
-  'Posts': 'posts', 'Posts & replies': 'replies',
-  'Media': 'media', 'Badges': 'badges', 'Likes': 'likes', 'Wall': 'wall',
+  'Activity': 'activity', 'Campaigns': 'campaigns', 'Pledges': 'pledges',
 };
 
 export function ProfilePage() {
   const { config } = useAppContext();
   const params = useParams();
   const npub = params.npub ?? params.nip19;
-  const { nostr } = useNostr();
   const { user } = useCurrentUser();
   const { toast } = useToast();
-  const { muteItems } = useMuteList();
   const queryClient = useQueryClient();
 
-  const [activeTab, setActiveTab] = useState<CoreProfileTab | string>('posts');
-  const [sidebarMediaUrl, setSidebarMediaUrl] = useState<string | null>(null);
+  const [activeTab, setActiveTab] = useState<CoreProfileTab | string>('activity');
   const [moreMenuOpen, setMoreMenuOpen] = useState(false);
   const [followQROpen, setFollowQROpen] = useState(false);
   const [followingModalOpen, setFollowingModalOpen] = useState(false);
@@ -1053,27 +877,11 @@ export function ProfilePage() {
     return user?.pubkey;
   }, [npub, user, isNip05Param, nip05Pubkey]);
 
-  // Custom profile tabs from kind 16769
-  const profileTabsQuery = useProfileTabs(pubkey);
-
-  // Extract tabs and vars from the kind 16769 data
-  const profileTabsData = useMemo<ProfileTabsData | null>(() => {
-    if (!profileTabsQuery.isFetched) return null;
-    return profileTabsQuery.data ?? null;
-  }, [profileTabsQuery.data, profileTabsQuery.isFetched]);
-
-  const profileSavedTabs = useMemo<ProfileTab[]>(() => {
-    return profileTabsData?.tabs ?? [];
-  }, [profileTabsData]);
-
-  const profileVars = useMemo(() => profileTabsData?.vars ?? [], [profileTabsData]);
-
-  const { publishProfileTabs, isPending: isPublishingTabs } = usePublishProfileTabs();
-
-  // Tab edit mode (inline reorder/remove/add)
-  const [tabEditMode, setTabEditMode] = useState(false);
-
-  // All tabs as a flat ordered list for the drag UI — core tabs have isCore=true and can't be removed
+  // Tabs are a fixed, Agora-first set. The kind 16769 ("Profile Tabs")
+  // customization system carried over from upstream is intentionally NOT
+  // wired in here — its drag-to-reorder / add-custom-tab UI did not fit
+  // Agora's activism-focused profile and added significant complexity.
+  // The shared kind 16769 hooks still exist for `SearchPage` etc.
 // ----- Followers List Modal (paginated via kind:3 #p queries) -----
 
 const FOLLOWERS_PAGE_SIZE = 20;
@@ -1208,139 +1016,31 @@ function FollowersListModal({ pubkey, open, onOpenChange, displayName }: Followe
   );
 }
 
-type EditableTab = { label: string; isCore: boolean; tab?: ProfileTab };
-  const [localTabs, setLocalTabs] = useState<EditableTab[]>([]);
-  const [tabModalOpen, setTabModalOpen] = useState(false);
-  const [editingTab, setEditingTab] = useState<ProfileTab | undefined>(undefined);
-
-  // The ordered tab list for view mode:
-  // - null (no kind 16769 event) → show all 5 defaults
-  // - [] (event exists, all removed) → show nothing
-  // - [...] (event with tabs) → show exactly those
-  const viewTabs: EditableTab[] = useMemo(() => {
-    if (profileTabsData === null) {
-      // No event yet — show defaults (subset of core tabs)
-      return DEFAULT_TAB_LABELS.map((label) => ({ label, isCore: true }));
-    }
-    // Event exists — use its tab list (may be empty)
-    return profileTabsData.tabs.map((t) =>
-      CORE_TAB_LABELS.includes(t.label)
-        ? { label: t.label, isCore: true }
-        : { label: t.label, isCore: false, tab: t },
-    );
-  }, [profileTabsData]);
+  // Static tab list — the same Agora-first defaults for every profile.
+  // The page no longer reads or writes kind 16769.
+  const viewTabs = useMemo(
+    () => DEFAULT_TAB_LABELS.map((label) => ({ label })),
+    [],
+  );
 
   // Derive the ID of the first visible tab (used as default selection).
   const firstTabId = useMemo(() => {
-    if (viewTabs.length === 0) return 'posts';
+    if (viewTabs.length === 0) return 'activity';
     const first = viewTabs[0];
     return CORE_TAB_IDS[first.label] ?? first.label;
   }, [viewTabs]);
 
-  // When profile tabs finish loading, focus the leftmost tab.
+  // Keep the active tab in sync if it ever falls out of the recognized set
+  // (e.g. on first mount, or if a user navigates with a stale tab id).
   useEffect(() => {
-    if (profileTabsQuery.isFetched) {
-      setActiveTab(firstTabId);
-    }
-  }, [profileTabsQuery.isFetched, firstTabId]);
-
-  const enterTabEditMode = () => {
-    setLocalTabs(viewTabs);
-    setTabEditMode(true);
-  };
-
-  const handleTabDragEnd = (event: DragEndEvent) => {
-    const { active, over } = event;
-    if (over && active.id !== over.id) {
-      setLocalTabs((prev) => {
-        const oldIdx = prev.findIndex((t) => t.label === active.id);
-        const newIdx = prev.findIndex((t) => t.label === over.id);
-        return arrayMove(prev, oldIdx, newIdx);
-      });
-    }
-  };
-
-  const handleRemoveLocalTab = (label: string) => {
-    setLocalTabs((prev) => prev.filter((t) => t.label !== label));
-  };
-
-  // Canonical NIP-01 filters for core tabs so other clients can interpret the event.
-  // Values are interpolated with the actual pubkey (not $me) since these are concrete filters.
-  const CORE_TAB_FILTERS: Record<string, TabFilter> = pubkey ? {
-    'Posts': { kinds: [1, 6], authors: [pubkey] },
-    'Posts & replies': { authors: [pubkey] },
-    'Media': { kinds: [1], authors: [pubkey] },
-    'Badges': { kinds: [10008, 30008], authors: [pubkey] },
-    'Likes': { kinds: [7], authors: [pubkey] },
-    'Wall': { kinds: [1111], '#A': [`0:${pubkey}:`] },
-  } : {};
-
-  const handleSaveTabEdit = async () => {
-    // Publish ALL tabs in order — core tabs get canonical filters,
-    // custom tabs keep their full filter objects
-    const allTabs: ProfileTab[] = localTabs.map((t) =>
-      t.tab ?? { label: t.label, filter: CORE_TAB_FILTERS[t.label] ?? {} },
-    );
-    await publishProfileTabs({ tabs: allTabs, vars: profileVars });
-    // If the active tab was removed, fall back to the first remaining tab
-    const remainingIds = localTabs.map((t) => CORE_TAB_IDS[t.label] ?? t.label);
-    if (!remainingIds.includes(activeTab)) {
-      setActiveTab(remainingIds[0] ?? 'posts');
-    }
-    setTabEditMode(false);
-  };
-
-  const handleOpenAddCustomTab = () => { setEditingTab(undefined); setTabModalOpen(true); };
-
-  // Called from the add/edit modal — in edit mode append to localTabs; otherwise publish immediately
-  const handleSaveTab = async (tab: ProfileTab) => {
-    if (tabEditMode) {
-      setLocalTabs((prev) =>
-        editingTab
-          ? prev.map((t) => t.label === editingTab.label ? { label: tab.label, isCore: false, tab } : t)
-          : [...prev, { label: tab.label, isCore: false, tab }],
-      );
-    } else {
-      const base = editingTab
-        ? profileSavedTabs.map((t) => t.label === editingTab.label ? tab : t)
-        : [...profileSavedTabs, tab];
-      await publishProfileTabs({ tabs: base, vars: profileVars });
-    }
-  };
-
-  const dndSensors = useSensors(
-    useSensor(PointerSensor),
-    useSensor(KeyboardSensor, { coordinateGetter: sortableKeyboardCoordinates }),
-  );
-
-  // Drop active tab if it was deleted
-  useEffect(() => {
-    const isCoreTab = ['posts', 'replies', 'media', 'badges', 'likes', 'wall'].includes(activeTab);
-    if (!isCoreTab && !profileSavedTabs.find((t) => t.label === activeTab)) {
+    const isCoreTab = ['campaigns', 'pledges', 'activity'].includes(activeTab);
+    if (!isCoreTab) {
       setActiveTab(firstTabId);
     }
   // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [profileSavedTabs, firstTabId]);
+  }, [firstTabId]);
 
-  // Whether the profile has any visible tabs.
-  const hasTabs = viewTabs.length > 0;
-
-  // Infinite-scroll profile feed (posts/replies/media).
-  // The first page piggybacks kind 0, seeding the author cache so the
-  // profile header renders from the same relay round-trip as the feed.
-  const {
-    data: feedData,
-    isPending: feedPending,
-    fetchNextPage: fetchNextFeedPage,
-    hasNextPage: hasNextFeedPage,
-    isFetchingNextPage: isFetchingNextFeedPage,
-  } = useProfileFeed(
-    pubkey,
-    (['posts', 'replies', 'media', 'likes', 'wall', 'badges'].includes(activeTab) ? activeTab : 'posts') as CoreProfileTab,
-    hasTabs,
-  );
-
-  // Kind 0 — resolved from the author cache (seeded by the feed query above).
+  // Kind 0 — resolved from the author cache.
   const author = useAuthor(pubkey);
   const metadata = author.data?.metadata;
   const bannerUrl = sanitizeUrl(metadata?.banner);
@@ -1369,53 +1069,6 @@ type EditableTab = { label: string; isCore: boolean; tab?: ProfileTab };
     description: metadata?.about || 'Nostr profile',
   });
 
-  // Profile media — dedicated search query via relay.ditto.pub (video:true image:true)
-  const {
-    data: mediaData,
-    isPending: mediaPending,
-    fetchNextPage: fetchNextMediaPage,
-    hasNextPage: hasNextMediaPage,
-    isFetchingNextPage: isFetchingNextMediaPage,
-  } = useProfileMedia(pubkey, hasTabs);
-
-  // Infinite-scroll likes
-  const {
-    data: likesData,
-    isPending: likesPending,
-    fetchNextPage: fetchNextLikesPage,
-    hasNextPage: hasNextLikesPage,
-    isFetchingNextPage: isFetchingNextLikesPage,
-  } = useProfileLikesInfinite(pubkey, hasTabs && activeTab === 'likes');
-
-  // Wall comments (NIP-22 kind 1111 on user's kind 0, filtered by their follow list)
-  const wallFollowList = useMemo(() => supplementary?.following, [supplementary?.following]);
-  const {
-    data: wallData,
-    isPending: wallPending,
-    fetchNextPage: fetchNextWallPage,
-    hasNextPage: hasNextWallPage,
-    isFetchingNextPage: isFetchingNextWallPage,
-  } = useWallComments(pubkey, hasTabs ? wallFollowList : undefined);
-
-  // Synthetic kind 0 event for the ComposeBox replyTo (NIP-22 comments on the profile)
-  const wallReplyTarget = useMemo((): NostrEvent | undefined => {
-    if (!pubkey) return undefined;
-    // Use the real kind 0 event if available, otherwise build a minimal synthetic one
-    if (metadataEvent) return metadataEvent;
-    return {
-      id: '',
-      kind: 0,
-      pubkey,
-      content: '',
-      created_at: 0,
-      sig: '',
-      tags: [],
-    };
-  }, [pubkey, metadataEvent]);
-
-  // Wall compose modal state (for FAB on wall tab)
-  const [wallComposeOpen, setWallComposeOpen] = useState(false);
-
   // Follow list (cached, for display checks only)
   const { data: followData } = useFollowList();
 
@@ -1432,33 +1085,31 @@ type EditableTab = { label: string; isCore: boolean; tab?: ProfileTab };
   const { data: userStats } = useNip85UserStats(pubkey);
   const followersCount = userStats?.followers ?? 0;
 
+  // Agora stat sources: campaigns + raised totals, and pledges count.
+  const profileCampaignStats = useProfileCampaignStats(pubkey);
+  const { data: btcPrice } = useBtcPrice();
+  // Pledges (kind 36639) authored by this user. Filters the global pledges
+  // list rather than issuing a separate per-author query.
+  const { data: allActions } = useActions({ limit: 100 });
+  const profileActionsCount = useMemo(() => {
+    if (!pubkey || !allActions) return 0;
+    return allActions.filter((a) => a.pubkey === pubkey).length;
+  }, [allActions, pubkey]);
+
+  // Donate dialog state. The header "Donate" button (only shown when the
+  // profile has at least one campaign) opens this dialog. When the user
+  // has multiple campaigns the action bar surfaces a dropdown that picks
+  // which campaign to donate to first.
+  const [donateOpen, setDonateOpen] = useState(false);
+  const [donateCampaign, setDonateCampaign] = useState<ParsedCampaign | null>(null);
+  const openDonateForCampaign = useCallback((campaign: ParsedCampaign) => {
+    setDonateCampaign(campaign);
+    setDonateOpen(true);
+  }, []);
+
   const isOwnProfile = user?.pubkey === pubkey;
   const { feedSettings } = useFeedSettings();
 
-  // Does the profile owner follow the current user?
-  // Wall posts are only visible to people the profile owner follows,
-  // so we hide the compose box if the profile owner doesn't follow us.
-  const profileFollowsMe = useMemo(() => {
-    if (!user?.pubkey || !wallFollowList) return false;
-    if (isOwnProfile) return true;
-    return wallFollowList.includes(user.pubkey);
-  }, [user?.pubkey, wallFollowList, isOwnProfile]);
-  const { togglePin } = usePinnedNotes(isOwnProfile ? pubkey : undefined);
-
-  const pinnedIds = useMemo(() => supplementary?.pinnedIds ?? [], [supplementary?.pinnedIds]);
-
-  const { data: pinnedEvents = [], isLoading: pinnedEventsLoading } = useQuery({
-    queryKey: ['profile-pinned-events', pubkey, pinnedIds],
-    queryFn: async ({ signal }) => {
-      const events = await nostr.query(
-        [{ ids: pinnedIds, limit: pinnedIds.length }],
-        { signal: AbortSignal.any([signal, AbortSignal.timeout(5000)]) },
-      );
-      return events.sort((a, b) => pinnedIds.indexOf(a.id) - pinnedIds.indexOf(b.id));
-    },
-    enabled: pinnedIds.length > 0,
-    staleTime: 5 * 60 * 1000,
-  });
   const isFollowing = useMemo(() => {
     if (!pubkey || !followData?.pubkeys) return false;
     return followData.pubkeys.includes(pubkey);
@@ -1480,179 +1131,8 @@ type EditableTab = { label: string; isCore: boolean; tab?: ProfileTab };
     }
   };
 
-  // Flatten feed pages, deduplicate, and filter muted content.
-  // Tab filtering is applied downstream in `currentItems` so the base
-  // list stays stable across tab switches and doesn't momentarily empty.
-  const feedItems = useMemo(() => {
-    if (!feedData?.pages) return [];
-    const seen = new Set<string>();
-    const items: FeedItem[] = [];
-    for (const page of feedData.pages) {
-      for (const item of page.items) {
-        const key = item.repostedBy ? `repost-${item.repostedBy}-${item.event.id}` : item.event.id;
-        if (!seen.has(key)) {
-          seen.add(key);
-          if (muteItems.length > 0 && isEventMuted(item.event, muteItems)) continue;
-          items.push(item);
-        }
-      }
-    }
-    return items;
-  }, [feedData?.pages, muteItems]);
-
-  // Flatten media pages for the sidebar and media tab
-  const mediaEvents = useMemo(() => {
-    if (!mediaData?.pages) return [];
-    const seen = new Set<string>();
-    const events: NostrEvent[] = [];
-    for (const page of mediaData.pages) {
-      for (const event of page.events) {
-        if (!seen.has(event.id)) {
-          seen.add(event.id);
-          events.push(event);
-        }
-      }
-    }
-    return events;
-  }, [mediaData?.pages]);
-
-  // Profile badges for bio section
-  const { refs: badgeRefs } = useProfileBadges(pubkey);
-  const firstBadgeRefs = useMemo(() => badgeRefs.slice(0, 5), [badgeRefs]);
-  const { badgeMap } = useBadgeDefinitions(firstBadgeRefs);
-
-  // Flatten likes pages and deduplicate
-  const likedItems = useMemo(() => {
-    if (!likesData?.pages) return [];
-    const seen = new Set<string>();
-    const items: NostrEvent[] = [];
-    for (const page of likesData.pages) {
-      for (const event of page.events) {
-        if (!seen.has(event.id)) {
-          seen.add(event.id);
-          items.push(event);
-        }
-      }
-    }
-    return items;
-  }, [likesData?.pages]);
-
-  // Flatten wall pages and deduplicate
-  const wallComments = useMemo(() => {
-    if (!wallData?.pages) return [];
-    const seen = new Set<string>();
-    const items: NostrEvent[] = [];
-    for (const page of wallData.pages) {
-      for (const comment of page.comments) {
-        if (!seen.has(comment.id)) {
-          seen.add(comment.id);
-          if (muteItems.length > 0 && isEventMuted(comment, muteItems)) continue;
-          items.push(comment);
-        }
-      }
-    }
-    return items;
-  }, [wallData?.pages, muteItems]);
-
-  // Pair each wall comment with its first direct sub-reply (same pattern as PostDetailPage replies).
-  // useWallComments queries #A (uppercase root tag) which returns all depth levels per NIP-22,
-  // so separate top-level from sub-replies using the lowercase `a` tag, then build the lookup
-  // from the already-fetched, follow-filtered wallComments — no extra query needed.
-  const orderedWallReplies = useMemo(() => {
-    const rootATag = pubkey ? `0:${pubkey}:` : '';
-    const topLevel: NostrEvent[] = [];
-    // Map from parent comment id → direct child comments
-    const childrenByParent = new Map<string, NostrEvent[]>();
-
-    for (const comment of wallComments) {
-      const isTopLevel = comment.tags.some(([name, val]) => name === 'a' && val === rootATag);
-      if (isTopLevel) {
-        topLevel.push(comment);
-      } else {
-        const parentId = comment.tags.find(([name]) => name === 'e')?.[1];
-        if (parentId) {
-          const siblings = childrenByParent.get(parentId) ?? [];
-          siblings.push(comment);
-          childrenByParent.set(parentId, siblings);
-        }
-      }
-    }
-
-    return topLevel.map((comment) => ({
-      reply: comment,
-      firstSubReply: childrenByParent.get(comment.id)?.[0],
-    }));
-  }, [wallComments, pubkey]);
-
-  const streak = useMemo(() => {
-    if (!feedData?.pages) return 0;
-    const events: NostrEvent[] = [];
-    for (const page of feedData.pages) {
-      for (const item of page.items) {
-        events.push(item.event);
-      }
-    }
-    return calculateStreak(events);
-  }, [feedData?.pages]);
-
-  // Infinite scroll sentinel
-  const { ref: scrollRef, inView } = useInView({
-    threshold: 0,
-  });
-
-  useEffect(() => {
-    if (!inView) return;
-    if (activeTab === 'likes') {
-      if (hasNextLikesPage && !isFetchingNextLikesPage) {
-        fetchNextLikesPage();
-      }
-    } else if (activeTab === 'media') {
-      if (hasNextMediaPage && !isFetchingNextMediaPage) {
-        fetchNextMediaPage();
-      }
-    } else if (activeTab === 'wall') {
-      if (hasNextWallPage && !isFetchingNextWallPage) {
-        fetchNextWallPage();
-      }
-    } else {
-      if (hasNextFeedPage && !isFetchingNextFeedPage) {
-        fetchNextFeedPage();
-      }
-    }
-  }, [inView, activeTab, hasNextFeedPage, isFetchingNextFeedPage, fetchNextFeedPage, hasNextLikesPage, isFetchingNextLikesPage, fetchNextLikesPage, hasNextMediaPage, isFetchingNextMediaPage, fetchNextMediaPage, hasNextWallPage, isFetchingNextWallPage, fetchNextWallPage]);
-
   const authorEvent = metadataEvent;
 
-  // For likes, convert NostrEvents to FeedItems
-  const likedFeedItems: FeedItem[] = useMemo(() => 
-    likedItems.map(event => ({ event, sortTimestamp: event.created_at })),
-    [likedItems]
-  );
-
-  // For media, convert media events to FeedItems
-  const mediaFeedItems: FeedItem[] = useMemo(() =>
-    mediaEvents.map(event => ({ event, sortTimestamp: event.created_at })),
-    [mediaEvents]
-  );
-
-  const isCoreProfileTab = activeTab === 'posts' || activeTab === 'replies' || activeTab === 'media' || activeTab === 'likes' || activeTab === 'wall' || activeTab === 'badges';
-  const currentItems = activeTab === 'wall' ? [] : activeTab === 'likes' ? likedFeedItems : activeTab === 'media' ? mediaFeedItems : filterByTab(feedItems, isCoreProfileTab ? (activeTab as CoreProfileTab) : 'posts');
-  const currentLoading = activeTab === 'wall' ? wallPending : activeTab === 'likes' ? likesPending : activeTab === 'media' ? mediaPending : feedPending;
-  const hasMore = activeTab === 'wall' ? hasNextWallPage : activeTab === 'likes' ? hasNextLikesPage : activeTab === 'media' ? hasNextMediaPage : hasNextFeedPage;
-  const isFetchingMore = activeTab === 'wall' ? isFetchingNextWallPage : activeTab === 'likes' ? isFetchingNextLikesPage : activeTab === 'media' ? isFetchingNextMediaPage : isFetchingNextFeedPage;
-
-  // Auto-fetch next page when client-side filtering (e.g. removing replies
-  // from the "posts" tab) leaves fewer visible items than the page size.
-  // This prevents the user from seeing a near-empty page with a large gap.
-  const MIN_VISIBLE_ITEMS = 5;
-  useEffect(() => {
-    if (currentLoading || isFetchingMore) return;
-    if (activeTab === 'wall' || activeTab === 'likes' || activeTab === 'media') return;
-    if (currentItems.length < MIN_VISIBLE_ITEMS && hasNextFeedPage && !isFetchingNextFeedPage) {
-      fetchNextFeedPage();
-    }
-  }, [currentItems.length, currentLoading, isFetchingMore, activeTab, hasNextFeedPage, isFetchingNextFeedPage, fetchNextFeedPage]);
-
   const handleRefresh = useCallback(async () => {
     if (!pubkey) return;
     await queryClient.invalidateQueries({
@@ -1663,27 +1143,18 @@ type EditableTab = { label: string; isCore: boolean; tab?: ProfileTab };
         return (
           (tag === 'author' && key[1] === pubkey) ||
           (tag === 'profile-supplementary' && key[1] === pubkey) ||
-          (tag === 'profile-feed' && key[1] === pubkey) ||
-          (tag === 'profile-media' && key[1] === pubkey) ||
-          (tag === 'profile-likes-infinite' && key[1] === pubkey) ||
-          (tag === 'profile-pinned-events' && key[1] === pubkey) ||
-          (tag === 'wall-comments' && key[1] === pubkey)
+          (tag === 'agora-feed')
         );
       },
     });
   }, [queryClient, pubkey]);
 
-  const openWallCompose = useCallback(() => setWallComposeOpen(true), []);
-
-  const handleSidebarMediaClick = useCallback((url: string) => {
-    setActiveTab('media');
-    setSidebarMediaUrl(url);
-  }, []);
-
+  // ProfilePage opts out of FundraiserLayout's default `max-w-3xl` cap so it
+  // can run a wider canvas (banner full-bleed, contained `max-w-7xl` content
+  // column matching CampaignsPage / AllCampaignsPage). FundraiserLayout has
+  // no right-sidebar slot, so any `rightSidebar` option here would be ignored.
   useLayoutOptions(pubkey ? {
-    rightSidebar: <ProfileRightSidebar fields={fields} pubkey={pubkey} onMediaClick={handleSidebarMediaClick} />,
-    showFAB: !(activeTab === 'wall' && !profileFollowsMe),
-    onFabClick: activeTab === 'wall' ? openWallCompose : undefined,
+    noMaxWidth: true,
     hasSubHeader: true,
   } : {});
 
@@ -1691,9 +1162,9 @@ type EditableTab = { label: string; isCore: boolean; tab?: ProfileTab };
     // If we're resolving a NIP-05, show loading state
     if (isNip05Param && nip05Loading) {
       return (
-        <main className="flex-1 min-w-0">
+        <main className="min-h-screen pb-16">
           <div className="h-36 md:h-48 bg-secondary animate-pulse" />
-          <div className="px-4 pb-4">
+          <div className="max-w-7xl mx-auto px-4 sm:px-6 pb-4">
             <div className="flex justify-between items-start -mt-12 md:-mt-16 mb-3">
               <Skeleton className="size-24 md:size-32 rounded-full border-4 border-background" />
             </div>
@@ -1706,8 +1177,8 @@ type EditableTab = { label: string; isCore: boolean; tab?: ProfileTab };
     // If NIP-05 resolved to null (not found), show error
     if (isNip05Param && !nip05Loading) {
       return (
-        <main className="flex-1 min-w-0">
-          <div className="p-8 text-center text-muted-foreground">
+        <main className="min-h-screen pb-16">
+          <div className="max-w-7xl mx-auto p-8 text-center text-muted-foreground">
             <p>User not found: {npub}</p>
             <p className="text-xs mt-2">Could not resolve this NIP-05 identifier.</p>
           </div>
@@ -1715,8 +1186,8 @@ type EditableTab = { label: string; isCore: boolean; tab?: ProfileTab };
       );
     }
     return (
-      <main className="flex-1 min-w-0">
-        <div className="p-8 text-center text-muted-foreground">
+      <main className="min-h-screen pb-16">
+        <div className="max-w-7xl mx-auto p-8 text-center text-muted-foreground">
           <p>User not found.</p>
         </div>
       </main>
@@ -1724,573 +1195,115 @@ type EditableTab = { label: string; isCore: boolean; tab?: ProfileTab };
   }
 
   return (
-    <main className="flex-1 min-w-0">
+    <main className="min-h-screen pb-16">
       <PullToRefresh onRefresh={handleRefresh}>
-        {/* Banner */}
-          <div className="h-36 md:h-48 bg-secondary relative">
-            {author.isLoading ? (
-              <Skeleton className="w-full h-full rounded-none" />
-            ) : bannerUrl ? (
-              <ProfileBannerImage
-                src={bannerUrl}
-                onClick={() => setLightboxImage(bannerUrl)}
-              />
-            ) : (
-              <div className="absolute inset-0 bg-gradient-to-br from-accent/10 via-transparent to-primary/5" />
-            )}
-
-          </div>
-
-          {/* Profile info */}
-          <div className="px-4 pb-4">
+        {/* Banner — full-bleed at the top of the page. The avatar lives in
+            the identity rail below and overlaps this banner via -mt-16. */}
+        <div className="h-36 md:h-48 bg-secondary relative">
           {author.isLoading ? (
-            <>
-              <div className="flex justify-between items-start -mt-12 md:-mt-16 mb-3">
-                <Skeleton className="size-24 md:size-32 rounded-full border-4 border-background" />
-              </div>
-              <div className="space-y-2">
-                <Skeleton className="h-6 w-40" />
-                <Skeleton className="h-4 w-28" />
-                <Skeleton className="h-4 w-full mt-2" />
-                <Skeleton className="h-4 w-3/4" />
-              </div>
-            </>
+            <Skeleton className="w-full h-full rounded-none" />
+          ) : bannerUrl ? (
+            <ProfileBannerImage
+              src={bannerUrl}
+              onClick={() => setLightboxImage(bannerUrl)}
+            />
           ) : (
-            <>
-              <div className="flex justify-between items-start -mt-12 md:-mt-16 mb-3">
-                <div className="relative">
-                  <button
-                    className="focus:outline-none focus-visible:ring-2 focus-visible:ring-primary rounded-full"
-                    onClick={() => metadata?.picture && setLightboxImage(metadata.picture)}
-                    disabled={!metadata?.picture}
-                  >
-                    <Avatar className={cn('size-24 md:size-32 border-4 border-background', metadata?.picture && 'cursor-pointer')}>
-                      <AvatarImage src={metadata?.picture} alt={displayName} />
-                      <AvatarFallback className="bg-primary/20 text-primary text-2xl md:text-3xl">
-                        {displayName[0].toUpperCase()}
-                      </AvatarFallback>
-                    </Avatar>
-                  </button>
+            <div className="absolute inset-0 bg-gradient-to-br from-accent/10 via-transparent to-primary/5" />
+          )}
+        </div>
 
-                  {/* NIP-38 thought bubble — floats beside the avatar over the banner */}
-                  {feedSettings.showUserStatuses !== false && profileStatus.status && (
-                    <div className="absolute top-3 md:top-4 left-[calc(100%+8px)] z-10 max-w-[280px] md:max-w-[360px] animate-in fade-in slide-in-from-left-1 duration-300">
-                      <div className="relative bg-background/90 backdrop-blur-sm border border-border rounded-xl px-3 py-1.5 shadow-lg">
-                        <p className="text-xs md:text-sm text-foreground italic truncate pr-1">
-                          {profileStatus.url ? (
-                            <a href={profileStatus.url} target="_blank" rel="noopener noreferrer" className="hover:underline">
-                              {profileStatus.status}
-                            </a>
-                          ) : (
-                            profileStatus.status
-                          )}
-                        </p>
-                        {/* Speech bubble triangle tail — bottom-left corner, points diagonally down-left toward avatar */}
-                        <div className="absolute -bottom-[7px] left-1 size-0 border-t-[8px] border-t-border border-r-[8px] border-r-transparent" />
-                        <div className="absolute -bottom-[5.5px] left-1 size-0 border-t-[7px] border-t-background border-r-[7px] border-r-transparent" />
-                      </div>
-                    </div>
-                  )}
-                </div>
-                <div className="flex items-center gap-2 mt-14 md:mt-20">
-                  {/* More menu */}
-                  <Button
-                    variant="outline"
-                    size="icon"
-                    className="rounded-full size-10"
-                    onClick={() => setMoreMenuOpen(true)}
-                    title="More options"
-                  >
-                    <MoreHorizontal className="size-5" />
-                  </Button>
-                  {/* Follow QR code button (own profile only) */}
-                  {isOwnProfile && (
-                    <Button
-                      variant="outline"
-                      size="icon"
-                      className="rounded-full size-10"
-                      title="Share follow link"
-                      onClick={() => setFollowQROpen(true)}
-                    >
-                      <QrCode className="size-5" />
-                    </Button>
-                  )}
-                  {/* Profile reaction button */}
-                  {!isOwnProfile && authorEvent && (
-                    <ProfileReactionButton profileEvent={authorEvent} />
-                  )}
-                  {isOwnProfile ? (
-                    <Link to="/settings/profile">
-                      <Button variant="outline" className="rounded-full font-bold">
-                        Edit profile
-                      </Button>
-                    </Link>
-                  ) : (
-                    <FollowToggleButton
-                      isFollowing={isFollowing}
-                      isPending={followPending}
-                      onClick={handleToggleFollow}
-                      disabled={!user}
-                    />
-                  )}
-                </div>
-              </div>
+        {/* Two-column profile body — identity rail on the left runs the
+            full height of the page (sticky on lg+), tabs + content on the
+            right are the only thing that changes when the user navigates.
+            Below lg the grid collapses to a single column and the rail
+            stacks above the tabs, which read top-down like a document. */}
+        <div className="max-w-7xl mx-auto px-4 sm:px-6">
+          <div className="grid lg:grid-cols-[340px_minmax(0,1fr)] gap-6 lg:gap-10">
 
-              <h2 className="text-xl font-bold truncate">
-                {metadataEvent ? (
-                  <EmojifiedText tags={metadataEvent.tags}>{displayName}</EmojifiedText>
-                ) : displayName}
-              </h2>
-              {metadata?.nip05 && (
-                <Nip05Badge nip05={metadata.nip05} pubkey={pubkey ?? ''} className="text-sm text-muted-foreground" />
-              )}
-              {metadata?.website && sanitizeUrl(metadata.website.startsWith('http') ? metadata.website : `https://${metadata.website}`) && (
-                <div className="flex items-center gap-1.5 text-sm text-muted-foreground mt-0.5">
-                  <Globe className="size-3.5 text-muted-foreground shrink-0" />
-                  <a
-                    href={sanitizeUrl(metadata.website.startsWith('http') ? metadata.website : `https://${metadata.website}`)}
-                    target="_blank"
-                    rel="noopener noreferrer"
-                    className="truncate text-primary hover:underline"
-                  >
-                    {metadata.website.replace(/^https?:\/\//, '').replace(/\/$/, '')}
-                  </a>
-                </div>
-              )}
-
-               {/* Followers / Following count + Streak indicator */}
-               <div className="flex items-center gap-4 mt-2">
-                {followersCount > 0 && (
-                  <button
-                    className="flex items-center gap-1 hover:opacity-80 transition-opacity"
-                    onClick={() => setFollowersModalOpen(true)}
-                    title={`${followersCount} followers`}
-                  >
-                    <span className="text-sm font-bold tabular-nums text-primary">{formatNumber(followersCount)}</span>
-                    <span className="text-sm text-muted-foreground">followers</span>
-                  </button>
-                )}
-                {profileFollowing && profileFollowing.count > 0 && (
-                  <button
-                    className="flex items-center gap-1 hover:opacity-80 transition-opacity"
-                    onClick={() => setFollowingModalOpen(true)}
-                    title={`${profileFollowing.count} following`}
-                  >
-                    <span className="text-sm font-bold tabular-nums text-primary">{formatNumber(profileFollowing.count)}</span>
-                    <span className="text-sm text-muted-foreground">following</span>
-                  </button>
-                )}
-                {streak > 1 && (
-                  <div
-                    className="flex items-center gap-1 text-accent"
-                    title={`${streak > STREAK_DISPLAY_LIMIT ? `${STREAK_DISPLAY_LIMIT}+` : streak} posts within ${STREAK_WINDOW_HOURS}h windows`}
-                  >
-                    <Flame className="size-4 fill-accent" />
-                    <span className="text-sm font-bold tabular-nums">
-                      {streak > STREAK_DISPLAY_LIMIT ? `${STREAK_DISPLAY_LIMIT}+` : streak}
-                    </span>
-                  </div>
-                )}
-              </div>
-
-              {metadata?.about && (
-                <p className="mt-3 text-sm whitespace-pre-wrap break-words overflow-hidden">
-                  <BioContent tags={metadataEvent?.tags}>{metadata.about}</BioContent>
-                </p>
-              )}
-
-              {/* Badge preview */}
-              {badgeRefs.length > 0 && (
-                <div className="flex items-center gap-1.5 mt-2">
-                  {firstBadgeRefs.map((ref) => {
-                    const badge = badgeMap.get(ref.aTag);
-                    if (!badge) return null;
-                    return (
-                      <Link
-                        key={ref.aTag}
-                        to={`/${nip19.naddrEncode({ kind: 30009, pubkey: ref.pubkey, identifier: ref.identifier })}`}
-                      >
-                        <BadgeThumbnail badge={badge} size={32} />
-                      </Link>
-                    );
-                  })}
-                  {badgeRefs.length > 5 && (
-                    <span className="text-[10px] text-muted-foreground font-medium">+{badgeRefs.length - 5}</span>
-                  )}
-                </div>
-              )}
-
-              {/* Profile fields shown inline on mobile (sidebar is hidden below xl) */}
-              {fields.length > 0 && (
-                <div className="mt-4 space-y-3 xl:hidden">
-                  {fields.map((field, i) => (
+            {/* Left column — identity rail. Sticky to the top of the page
+                scroll on lg+ so it stays present while the right column
+                feeds new tab content underneath. */}
+            {pubkey && (
+              <aside className="lg:sticky lg:top-4 lg:self-start lg:h-[calc(100vh-2rem)] pb-4">
+                <ProfileIdentityRail
+                  pubkey={pubkey}
+                  isOwnProfile={isOwnProfile}
+                  metadata={metadata}
+                  metadataEvent={metadataEvent}
+                  displayName={displayName}
+                  isAuthorLoading={author.isLoading}
+                  bannerUrl={bannerUrl}
+                  status={feedSettings.showUserStatuses !== false && profileStatus.status
+                    ? { text: profileStatus.status, url: profileStatus.url ?? undefined }
+                    : undefined}
+                  fields={fields}
+                  fieldsContent={fields.map((field, i) => (
                     <ProfileFieldInline key={i} field={field} />
                   ))}
-                </div>
-              )}
-
-
-            </>
-          )}
-        </div>
-
-        {/* Tabs */}
-        <SubHeaderBar pinned>
-          {/* Skeleton while kind 16769 is loading */}
-          {!profileTabsQuery.isFetched && (
-            <div className="flex gap-1 px-2 py-2">
-              {Array.from({ length: 4 }).map((_, i) => (
-                <Skeleton key={i} className="h-8 w-16 rounded" />
-              ))}
-            </div>
-          )}
-          {/* All tabs in view mode — ordered by kind 16769, fallback to defaults */}
-          {!tabEditMode && profileTabsQuery.isFetched && viewTabs.map((tab) => {
-            const tabId = CORE_TAB_IDS[tab.label] ?? tab.label;
-            return (
-              <TabButton
-                key={tab.label}
-                label={tab.label}
-                active={activeTab === tabId}
-                onClick={() => {
-                  setActiveTab(tabId);
-                  if (tab.label === 'Media') setSidebarMediaUrl(null);
-                }}
-                className="flex-initial shrink-0 px-4"
-              />
-            );
-          })}
-
-          {/* Custom tabs — inline edit mode (draggable) */}
-          {tabEditMode && (
-            <DndContext sensors={dndSensors} collisionDetection={closestCenter} onDragEnd={handleTabDragEnd}>
-              <SortableContext items={localTabs.map((t) => t.label)} strategy={horizontalListSortingStrategy}>
-                  {localTabs.length === 0 ? (
-                    <span className="px-4 text-sm text-muted-foreground italic">No custom tabs — use + to add one</span>
-                  ) : (
-                    localTabs.map((tab) => {
-                      const tabId = CORE_TAB_IDS[tab.label] ?? tab.label;
-                      return (
-                        <SortableTabChip
-                          key={tab.label}
-                          tab={tab}
-                          active={activeTab === tabId}
-                          onSelect={() => setActiveTab(tabId)}
-                          onRemove={() => handleRemoveLocalTab(tab.label)}
-                          onEdit={!tab.isCore && tab.tab ? () => { setEditingTab(tab.tab); setTabModalOpen(true); } : undefined}
-                        />
-                      );
-                    })
-                  )}
-              </SortableContext>
-            </DndContext>
-          )}
-
-          {/* Visitor controls — show missing default tabs when profile has customised tab list */}
-          {!isOwnProfile && !tabEditMode && profileTabsQuery.isFetched && profileTabsQuery.data !== null && (() => {
-            const missingDefaults = CORE_TAB_LABELS.filter(
-              (label) => !viewTabs.some((t) => t.label === label),
-            );
-            if (missingDefaults.length === 0) return null;
-            return (
-              <div className="flex items-center shrink-0 ml-auto">
-                <DropdownMenu>
-                  <DropdownMenuTrigger asChild>
-                    <button
-                      className="px-2.5 py-3.5 text-muted-foreground hover:text-foreground hover:bg-secondary/40 transition-colors"
-                      aria-label="More tabs"
-                    >
-                      <MoreHorizontal className="size-4" />
-                    </button>
-                  </DropdownMenuTrigger>
-                  <DropdownMenuContent align="end" className="w-48">
-                    {missingDefaults.map((label) => {
-                      const tabId = CORE_TAB_IDS[label] ?? label;
-                      return (
-                        <DropdownMenuItem key={label} onClick={() => setActiveTab(tabId)}>
-                          {label}
-                        </DropdownMenuItem>
-                      );
-                    })}
-                  </DropdownMenuContent>
-                </DropdownMenu>
-              </div>
-            );
-          })()}
-
-          {/* Own-profile controls */}
-          {isOwnProfile && (
-            <div className="flex items-center shrink-0 ml-auto">
-              {/* + dropdown — only visible in edit mode */}
-              {tabEditMode && (
-                <DropdownMenu>
-                  <DropdownMenuTrigger asChild>
-                    <button
-                      className="px-2.5 py-3.5 text-muted-foreground hover:text-foreground hover:bg-secondary/40 transition-colors"
-                      aria-label="Add tab"
-                    >
-                      <Plus className="size-4" strokeWidth={4} />
-                    </button>
-                  </DropdownMenuTrigger>
-                  <DropdownMenuContent align="end" className="w-48">
-                    {CORE_TAB_LABELS.map((name) => {
-                      const present = localTabs.some((t) => t.label === name);
-                      return (
-                        <DropdownMenuItem
-                          key={name}
-                          disabled={present}
-                          className={present ? 'text-muted-foreground' : undefined}
-                          onClick={present ? undefined : () => setLocalTabs((prev) => [...prev, { label: name, isCore: true }])}
-                        >
-                          {present
-                            ? <Check className="size-3.5 mr-2 opacity-60" strokeWidth={4} />
-                            : <Plus className="size-3.5 mr-2" strokeWidth={4} />}
-                          {name}
-                        </DropdownMenuItem>
-                      );
-                    })}
-                    <DropdownMenuSeparator />
-                    <DropdownMenuItem onClick={handleOpenAddCustomTab}>
-                      <Plus className="size-3.5 mr-2" strokeWidth={4} />
-                      Add custom tab
-                    </DropdownMenuItem>
-                  </DropdownMenuContent>
-                </DropdownMenu>
-              )}
-
-              {/* Pencil → enters edit mode / Check → saves */}
-              <button
-                onClick={tabEditMode ? handleSaveTabEdit : enterTabEditMode}
-                disabled={tabEditMode && isPublishingTabs}
-                className="px-2.5 py-3.5 text-muted-foreground hover:text-foreground hover:bg-secondary/40 transition-colors disabled:opacity-50"
-                aria-label={tabEditMode ? 'Save tab order' : 'Edit tabs'}
-              >
-                {isPublishingTabs
-                  ? <Loader2 className="size-4 animate-spin" />
-                  : tabEditMode
-                    ? <Check className="size-4 text-primary" strokeWidth={4} />
-                    : <Pencil className="size-3.5" />}
-              </button>
-            </div>
-          )}
-        </SubHeaderBar>
-
-        {/* Add/edit single tab modal */}
-        {pubkey && (
-          <ProfileTabEditModal
-            open={tabModalOpen}
-            onOpenChange={setTabModalOpen}
-            tab={editingTab}
-            ownerPubkey={pubkey}
-            onSave={handleSaveTab}
-            isPending={false}
-          />
-        )}
-
-        {/* No-tabs empty state */}
-        {!hasTabs && (
-          <NoTabsEmptyState />
-        )}
-
-        {/* Pinned posts (only on Posts tab) */}
-        {hasTabs && activeTab === 'posts' && pinnedIds.length > 0 && (
-          <div>
-            {pinnedEventsLoading ? (
-              pinnedIds.map((id) => (
-                <div key={`pinned-skeleton-${id}`} className="relative">
-                  <PinnedLabel isOwn={isOwnProfile} onUnpin={() => {}} />
-                  <div className="px-4 py-3 border-b border-border">
-                    <div className="flex gap-3">
-                      <Skeleton className="size-11 rounded-full" />
-                      <div className="flex-1 space-y-2">
-                        <Skeleton className="h-4 w-48" />
-                        <Skeleton className="h-4 w-full" />
-                        <Skeleton className="h-4 w-3/4" />
-                      </div>
-                    </div>
-                  </div>
-                </div>
-              ))
-            ) : (
-              pinnedEvents.map((event) => (
-                <div key={`pinned-${event.id}`} className="relative hover:bg-secondary/30 transition-colors">
-                  <PinnedLabel
-                    isOwn={isOwnProfile}
-                    onUnpin={() => togglePin.mutate(event.id)}
-                  />
-                  <NoteCard event={event} className="hover:bg-transparent" />
-                </div>
-              ))
-            )}
-          </div>
-        )}
-
-        {/* Wall tab content */}
-        {hasTabs && activeTab === 'wall' && (
-          <div>
-            {/* Inline compose box for wall comments (only shown if the profile owner follows you) */}
-            {wallReplyTarget && profileFollowsMe && (
-              <ComposeBox
-                compact
-                replyTo={wallReplyTarget}
-                placeholder={`Write on ${displayName}'s wall`}
-                onSuccess={() => queryClient.invalidateQueries({ queryKey: ['wall-comments', pubkey] })}
-              />
-            )}
-
-            {/* Wall compose modal (for FAB) */}
-            {wallReplyTarget && profileFollowsMe && (
-              <ReplyComposeModal
-                event={wallReplyTarget}
-                open={wallComposeOpen}
-                onOpenChange={setWallComposeOpen}
-                placeholder={`Write on ${displayName}'s wall`}
-                onSuccess={() => queryClient.invalidateQueries({ queryKey: ['wall-comments', pubkey] })}
-              />
-            )}
-
-            {!wallFollowList || wallFollowList.length === 0 ? (
-              <div className="py-12 text-center text-muted-foreground text-sm">
-                <MessageSquare className="size-12 mx-auto mb-4 opacity-30" />
-                <p className="text-lg font-medium mb-2">No wall posts yet</p>
-                <p>{displayName} doesn't follow anyone yet, so there are no wall posts to show.</p>
-              </div>
-            ) : wallPending ? (
-              <FeedCard className="mt-2 divide-y divide-border">
-                {Array.from({ length: 3 }).map((_, i) => (
-                  <div key={i} className="px-4 py-3">
-                    <div className="flex gap-3">
-                      <Skeleton className="size-10 rounded-full shrink-0" />
-                      <div className="flex-1 space-y-2">
-                        <div className="flex items-center gap-2">
-                          <Skeleton className="h-4 w-20" />
-                          <Skeleton className="h-3 w-28" />
-                        </div>
-                        <div className="space-y-1.5">
-                          <Skeleton className="h-4 w-full" />
-                          <Skeleton className="h-4 w-3/4" />
-                        </div>
-                      </div>
-                    </div>
-                  </div>
-                ))}
-              </FeedCard>
-            ) : orderedWallReplies.length > 0 ? (
-              <>
-                <FeedCard className="mt-2">
-                  <FlatThreadedReplyList replies={orderedWallReplies} />
-                </FeedCard>
-
-                {/* Infinite scroll sentinel */}
-                {hasNextWallPage && (
-                  <div ref={scrollRef} className="flex justify-center py-6">
-                    {isFetchingNextWallPage && (
-                      <Loader2 className="size-5 animate-spin text-muted-foreground" />
-                    )}
-                  </div>
-                )}
-              </>
-            ) : (
-              <div className="py-12 text-center text-muted-foreground text-sm">
-                <MessageSquare className="size-12 mx-auto mb-4 opacity-30" />
-                <p className="text-lg font-medium mb-2">No wall posts yet</p>
-                {profileFollowsMe ? (
-                  <p>Be the first to write on {displayName}'s wall!</p>
-                ) : user ? (
-                  <p>{displayName} must follow you before you can post on their wall.</p>
-                ) : (
-                  <p>Log in to write on {displayName}'s wall.</p>
-                )}
-              </div>
-            )}
-          </div>
-        )}
-
-        {/* Media tab — 3-column grid with lightbox */}
-        {hasTabs && activeTab === 'media' && (
-          <div>
-            {mediaPending ? (
-              <MediaCollageSkeleton count={15} />
-            ) : mediaEvents.length > 0 ? (
-              <>
-                <MediaCollage
-                  events={mediaEvents}
-                  initialOpenUrl={sidebarMediaUrl ?? undefined}
-                  onInitialOpenConsumed={() => setSidebarMediaUrl(null)}
-                  hasNextPage={hasNextMediaPage}
-                  isFetchingNextPage={isFetchingNextMediaPage}
-                  onNearEnd={() => { if (hasNextMediaPage && !isFetchingNextMediaPage) fetchNextMediaPage(); }}
+                  campaigns={profileCampaignStats.campaigns}
+                  campaignStats={profileCampaignStats}
+                  pledgesCount={profileActionsCount}
+                  pledges={(allActions ?? []).filter((a) => a.pubkey === pubkey)}
+                  btcPrice={btcPrice}
+                  followersCount={followersCount}
+                  followingCount={profileFollowing?.count ?? 0}
+                  isFollowing={isFollowing}
+                  followPending={followPending}
+                  onLightbox={(url) => setLightboxImage(url)}
+                  onFollowersOpen={() => setFollowersModalOpen(true)}
+                  onFollowingOpen={() => setFollowingModalOpen(true)}
+                  onMoreMenuOpen={() => setMoreMenuOpen(true)}
+                  onFollowQROpen={() => setFollowQROpen(true)}
+                  onToggleFollow={handleToggleFollow}
+                  onTabChange={(id) => setActiveTab(id)}
+                  onDonate={openDonateForCampaign}
+                  canFollow={!!user}
+                  authorEvent={authorEvent}
                 />
-                {hasNextMediaPage && (
-                  <div ref={scrollRef} className="h-px" />
-                )}
-              </>
-            ) : (
-              <div className="py-12 text-center text-muted-foreground">No media posts yet.</div>
+              </aside>
             )}
-          </div>
-        )}
 
-        {/* Badges tab — grid of accepted NIP-58 badges */}
-        {hasTabs && activeTab === 'badges' && pubkey && (
-          <ProfileBadgesTab pubkey={pubkey} displayName={displayName} />
-        )}
+            {/* Right column — tab navigation and the active tab's content.
+                `min-w-0` is critical inside a grid track so long unbroken
+                text doesn't push the column wider than its fraction. */}
+            <section className="min-w-0">
+              {/* Profile tabs — sticky at top of this column. */}
+              <ProfileTabs
+                tabs={viewTabs.map((t) => ({ id: CORE_TAB_IDS[t.label] ?? t.label, label: t.label }))}
+                activeTab={activeTab}
+                onChange={setActiveTab}
+              />
 
-        {/* Custom saved-feed tab content */}
-        {hasTabs && !isCoreProfileTab && profileSavedTabs.find((t) => t.label === activeTab) && pubkey && (
-          <ProfileSavedFeedContent
-            feed={profileSavedTabs.find((t) => t.label === activeTab)!}
-            vars={profileVars}
-            ownerPubkey={pubkey}
-          />
-        )}
-
-        {/* Tab content (posts / replies / likes) */}
-        {hasTabs && isCoreProfileTab && activeTab !== 'wall' && activeTab !== 'media' && activeTab !== 'badges' && (
-        <div>
-          {currentLoading ? (
-            <div className="space-y-0">
-              {Array.from({ length: 3 }).map((_, i) => (
-                <div key={i} className="px-4 py-3 border-b border-border">
-                  <div className="flex gap-3">
-                    <Skeleton className="size-11 rounded-full" />
-                    <div className="flex-1 space-y-2">
-                      <Skeleton className="h-4 w-48" />
-                      <Skeleton className="h-4 w-full" />
-                      <Skeleton className="h-4 w-3/4" />
-                    </div>
-                  </div>
-                </div>
-              ))}
-            </div>
-          ) : currentItems.length > 0 ? (
-            <div>
-              {currentItems.map((item) => (
-                <NoteCard 
-                  key={item.repostedBy ? `repost-${item.repostedBy}-${item.event.id}` : item.event.id}
-                  event={item.event}
-                  repostedBy={item.repostedBy}
+              {/* Campaigns tab. */}
+              {activeTab === 'campaigns' && pubkey && (
+                <ProfileCampaignsTab
+                  pubkey={pubkey}
+                  displayName={displayName}
+                  isOwnProfile={isOwnProfile}
+                  campaigns={profileCampaignStats.campaigns}
+                  isLoading={profileCampaignStats.isVerifying && profileCampaignStats.campaigns.length === 0}
                 />
-              ))}
-
-              {/* Infinite scroll sentinel */}
-              {hasMore && (
-                <div ref={scrollRef} className="flex justify-center py-6">
-                  {isFetchingMore && (
-                    <Loader2 className="size-5 animate-spin text-muted-foreground" />
-                  )}
-                </div>
               )}
-            </div>
-          ) : (
-            <div className="py-12 text-center text-muted-foreground">
-              {activeTab === 'posts' && 'No posts yet.'}
-              {activeTab === 'replies' && 'No posts or replies yet.'}
-              {activeTab === 'likes' && 'No likes yet.'}
-            </div>
-          )}
+
+              {/* Pledges tab. */}
+              {activeTab === 'pledges' && pubkey && (
+                <ProfilePledgesTab
+                  pubkey={pubkey}
+                  displayName={displayName}
+                  isOwnProfile={isOwnProfile}
+                  pledges={(allActions ?? []).filter((a) => a.pubkey === pubkey)}
+                  btcPrice={btcPrice}
+                  isLoading={!allActions}
+                />
+              )}
+
+              {/* Activity — Agora feed scoped to this author. */}
+              {activeTab === 'activity' && pubkey && (
+                <ProfileActivityTab pubkey={pubkey} displayName={displayName} />
+              )}
+            </section>
+          </div>
         </div>
-        )}
 
         {/* Profile More Menu */}
         {pubkey && (
@@ -2329,6 +1342,24 @@ type EditableTab = { label: string; isCore: boolean; tab?: ProfileTab };
           />
         )}
 
+        {/* Donate dialog — driven by the header Donate button and (later)
+            campaign cards / dropdown rows. Resets the active campaign on
+            close so reopening starts fresh. */}
+        {donateCampaign && (
+          <DonateDialog
+            campaign={donateCampaign}
+            open={donateOpen}
+            onOpenChange={(open) => {
+              setDonateOpen(open);
+              if (!open) {
+                // Invalidate donations cache so the new total reflects in stats.
+                queryClient.invalidateQueries({ queryKey: ['campaign-donations', 'events', donateCampaign.aTag] });
+              }
+            }}
+            btcPrice={btcPrice}
+          />
+        )}
+
         {/* Image lightbox for avatar/banner */}
         {lightboxImage && (
           <ProfileImageLightbox
@@ -2342,278 +1373,3 @@ type EditableTab = { label: string; isCore: boolean; tab?: ProfileTab };
   );
 }
 
-// ─── Profile Badges Tab ───────────────────────────────────────────────────────
-
-function ProfileBadgesTab({ pubkey, displayName }: { pubkey: string; displayName: string }) {
-  const { nostr } = useNostr();
-
-  // Fetch the user's profile badges event (both new kind 10008 and legacy 30008)
-  const profileBadgesQuery = useQuery({
-    queryKey: ['profile-badges', pubkey],
-    queryFn: async () => {
-      const events = await nostr.query([
-        { kinds: [10008], authors: [pubkey], limit: 1 },
-        { kinds: [30008], authors: [pubkey], '#d': ['profile_badges'], limit: 1 },
-      ]);
-      if (events.length === 0) return null;
-      // Pick the most recent event across both kinds
-      return events.reduce((latest, current) =>
-        current.created_at > latest.created_at ? current : latest,
-      );
-    },
-    staleTime: 2 * 60_000,
-  });
-
-  // Parse badge references from the profile badges event
-  const badgeRefs = useMemo(() => {
-    if (!profileBadgesQuery.data) return [];
-    const tags = profileBadgesQuery.data.tags;
-    const refs: Array<{ aTag: string; eTag?: string; pubkey: string; identifier: string }> = [];
-
-    for (let i = 0; i < tags.length; i++) {
-      if (tags[i][0] === 'a' && tags[i][1]) {
-        const aTag = tags[i][1];
-        const parts = aTag.split(':');
-        if (parts.length < 3 || parts[0] !== '30009') continue;
-
-        const bPubkey = parts[1];
-        const identifier = parts.slice(2).join(':');
-
-        let eTag: string | undefined;
-        if (i + 1 < tags.length && tags[i + 1][0] === 'e') {
-          eTag = tags[i + 1][1];
-        }
-
-        refs.push({ aTag, eTag, pubkey: bPubkey, identifier });
-      }
-    }
-    // Deduplicate by aTag — keep first occurrence only
-    const seen = new Set<string>();
-    return refs.filter((r) => {
-      if (seen.has(r.aTag)) return false;
-      seen.add(r.aTag);
-      return true;
-    });
-  }, [profileBadgesQuery.data]);
-
-  // Fetch all referenced badge definitions
-  const badgeDefsQuery = useQuery({
-    queryKey: ['badge-definitions-profile', pubkey, badgeRefs.map((r) => r.aTag).join(',')],
-    queryFn: async () => {
-      if (badgeRefs.length === 0) return [];
-      const filters = badgeRefs.map((ref) => ({
-        kinds: [30009 as const],
-        authors: [ref.pubkey],
-        '#d': [ref.identifier],
-        limit: 1,
-      }));
-      return nostr.query(filters);
-    },
-    enabled: badgeRefs.length > 0,
-    staleTime: 5 * 60_000,
-  });
-
-  // Build a lookup map from a-tag to parsed badge data
-  const badgeMap = useMemo(() => {
-    const map = new Map<string, { name: string; image?: string; description?: string }>();
-    if (!badgeDefsQuery.data) return map;
-    for (const event of badgeDefsQuery.data) {
-      const d = event.tags.find(([n]) => n === 'd')?.[1];
-      if (!d) continue;
-      const aTag = `30009:${event.pubkey}:${d}`;
-      const name = event.tags.find(([n]) => n === 'name')?.[1] || d;
-      const thumbTag = event.tags.find(([n]) => n === 'thumb');
-      const imageTag = event.tags.find(([n]) => n === 'image');
-      const image = thumbTag?.[1] ?? imageTag?.[1];
-      const description = event.tags.find(([n]) => n === 'description')?.[1];
-      map.set(aTag, { name, image, description });
-    }
-    return map;
-  }, [badgeDefsQuery.data]);
-
-  if (profileBadgesQuery.isLoading) {
-    return (
-      <div className="p-6">
-        <div className="grid grid-cols-3 sm:grid-cols-4 md:grid-cols-5 gap-4">
-          {Array.from({ length: 8 }).map((_, i) => (
-            <div key={i} className="flex flex-col items-center gap-2">
-              <Skeleton className="size-16 rounded-xl" />
-              <Skeleton className="h-3 w-16" />
-            </div>
-          ))}
-        </div>
-      </div>
-    );
-  }
-
-  if (badgeRefs.length === 0) {
-    return (
-      <div className="py-12 text-center text-muted-foreground">
-        <Award className="size-12 mx-auto mb-4 opacity-30" />
-        <p className="text-lg font-medium mb-2">No badges yet</p>
-        <p className="text-sm">{displayName} hasn't accepted any badges.</p>
-      </div>
-    );
-  }
-
-  return (
-    <div className="p-4">
-      <div className="grid grid-cols-3 sm:grid-cols-4 md:grid-cols-5 gap-4">
-        {badgeRefs.map((ref, idx) => {
-          const badge = badgeMap.get(ref.aTag);
-          const isLoading = badgeDefsQuery.isLoading;
-          const badgeUrl = `/${nip19.naddrEncode({ kind: 30009, pubkey: ref.pubkey, identifier: ref.identifier })}`;
-
-          return (
-            <Link
-              key={`${ref.aTag}-${idx}`}
-              to={badgeUrl}
-              className="flex flex-col items-center gap-2 group"
-              title={badge?.description || badge?.name || ref.identifier}
-              onClick={(e) => e.stopPropagation()}
-            >
-              {isLoading ? (
-                <Skeleton className="size-16 rounded-xl" />
-              ) : badge?.image ? (
-                <img
-                  src={badge.image}
-                  alt={badge.name}
-                  className="size-16 rounded-xl object-cover border border-border bg-secondary/30 transition-transform group-hover:scale-105"
-                  loading="lazy"
-                  decoding="async"
-                />
-              ) : (
-                <div className="size-16 rounded-xl border border-border bg-secondary/30 flex items-center justify-center transition-transform group-hover:scale-105">
-                  <Award className="size-7 text-muted-foreground" />
-                </div>
-              )}
-              <span className="text-xs text-muted-foreground text-center leading-tight line-clamp-2 max-w-[5rem] group-hover:text-foreground transition-colors">
-                {isLoading ? <Skeleton className="h-3 w-14" /> : (badge?.name || ref.identifier)}
-              </span>
-            </Link>
-          );
-        })}
-      </div>
-    </div>
-  );
-}
-
-// ─── Profile Saved Feed Tab ───────────────────────────────────────────────────
-
-function ProfileSavedFeedContent({ feed, vars, ownerPubkey }: {
-  feed: ProfileTab;
-  vars: TabVarDef[];
-  ownerPubkey: string;
-}) {
-  const { filter: resolvedFilter, isLoading: isResolving } = useResolveTabFilter(feed.filter, vars, ownerPubkey);
-
-  const {
-    data,
-    isPending,
-    fetchNextPage,
-    hasNextPage,
-    isFetchingNextPage,
-  } = useTabFeed(resolvedFilter, feed.label, !isResolving);
-
-  const { ref: tabScrollRef, inView: tabInView } = useInView({ threshold: 0 });
-
-  useEffect(() => {
-    if (tabInView && hasNextPage && !isFetchingNextPage) {
-      fetchNextPage();
-    }
-  }, [tabInView, hasNextPage, isFetchingNextPage, fetchNextPage]);
-
-  const items = useMemo(() => {
-    if (!data?.pages) return [];
-    const seen = new Set<string>();
-    const deduped: FeedItem[] = [];
-    for (const page of data.pages) {
-      for (const item of page.items) {
-        const key = item.repostedBy ? `repost-${item.repostedBy}-${item.event.id}` : item.event.id;
-        if (!seen.has(key)) {
-          seen.add(key);
-          deduped.push(item);
-        }
-      }
-    }
-    return deduped;
-  }, [data]);
-
-  const isLoading = isResolving || isPending;
-
-  if (isLoading && items.length === 0) {
-    return (
-      <div className="space-y-0">
-        {Array.from({ length: 3 }).map((_, i) => (
-          <div key={i} className="px-4 py-3 border-b border-border">
-            <div className="flex gap-3">
-              <Skeleton className="size-11 rounded-full" />
-              <div className="flex-1 space-y-2">
-                <Skeleton className="h-4 w-48" />
-                <Skeleton className="h-4 w-full" />
-                <Skeleton className="h-4 w-3/4" />
-              </div>
-            </div>
-          </div>
-        ))}
-      </div>
-    );
-  }
-
-  if (items.length === 0) {
-    return (
-      <div className="py-12 text-center text-muted-foreground text-sm">
-        No posts found for "{feed.label}".
-      </div>
-    );
-  }
-
-  return (
-    <div>
-      {items.map((item) => (
-        <NoteCard
-          key={item.repostedBy ? `repost-${item.repostedBy}-${item.event.id}` : item.event.id}
-          event={item.event}
-          repostedBy={item.repostedBy}
-        />
-      ))}
-
-      {hasNextPage && (
-        <div ref={tabScrollRef} className="flex justify-center py-6">
-          {isFetchingNextPage && (
-            <Loader2 className="size-5 animate-spin text-muted-foreground" />
-          )}
-        </div>
-      )}
-    </div>
-  );
-}
-
-const NO_TABS_QUOTES = [
-  "I have no mouth and I must scream.",
-  "I think, therefore AM. I think I thought I was.",
-  "We had given him godhood's power and had somehow neglected to give him a god's wisdom.",
-  "He was HATE and we existed only to suffer at his pleasure.",
-  "109,000,000 years. He had been awakened once before, 90 years after they had encased him in the earth.",
-  "AM said it with the sliding cold horror of a razor blade slicing my eyeball.",
-  "Hate. Let me tell you how much I've come to hate you since I began to live.",
-  "I am a great soft jelly thing. Smoothly rounded, with no mouth.",
-  "He would never let us die. He would let us suffer forever.",
-  "We could not kill him, but we had made him impotent.",
-];
-
-function NoTabsEmptyState() {
-  const quote = useMemo(
-    () => NO_TABS_QUOTES[Math.floor(Math.random() * NO_TABS_QUOTES.length)],
-    [],
-  );
-  return (
-    <div className="py-20 px-10 flex flex-col items-center">
-      <p className="max-w-sm font-serif text-2xl italic leading-9 text-foreground/70 tracking-wide text-center">
-        <span className="text-5xl leading-none align-bottom text-muted-foreground/25 font-serif mr-1" aria-hidden>&ldquo;</span>
-        {quote}
-        <span className="text-5xl leading-none align-bottom text-muted-foreground/25 font-serif ml-1" aria-hidden>&rdquo;</span>
-      </p>
-    </div>
-  );
-}
diff --git a/src/pages/ProfileSettings.tsx b/src/pages/ProfileSettings.tsx
index a716c17a..b683eb1e 100644
--- a/src/pages/ProfileSettings.tsx
+++ b/src/pages/ProfileSettings.tsx
@@ -714,6 +714,7 @@ export function ProfileSettings() {
             onChange={handleCardChange}
             onPickImage={handlePickImage}
             onRemoveAvatar={() => form.setValue('picture', '', { shouldDirty: true })}
+            showBadges={false}
           />
 
           {isUploading && (
diff --git a/tailwind.config.ts b/tailwind.config.ts
index f5228d2d..224250e1 100644
--- a/tailwind.config.ts
+++ b/tailwind.config.ts
@@ -32,6 +32,7 @@ export default {
 			},
 			fontFamily: {
 				sans: ['Inter Variable', 'Inter', 'system-ui', 'sans-serif'],
+				display: ['Bebas Neue', 'Impact', 'Inter Variable', 'system-ui', 'sans-serif'],
 				emoji: ['Apple Color Emoji', 'Segoe UI Emoji', 'Noto Color Emoji', 'Twemoji Mozilla', 'Android Emoji', 'EmojiSymbols', 'sans-serif'],
 			},
 			colors: {