From c53f9039c0b2b41f2b2c6584b4f4b42deeaa88a3 Mon Sep 17 00:00:00 2001
From: "prompt.ac/@jeffrey" <mail@aesthetic.computer>
Date: Tue, 15 Sep 2026 17:01:19 -0700
Subject: [PATCH] pals: animated turnarounds on every hit, 50/50 with stills;
 oven backdrop pool
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

pals.aesthetic.computer now serves a fresh random pal per request, half
the time a looping Seedance turnaround (webp / apng / mp4) instead of a
still. 13 pals have turnarounds published (11 turntables + 2 glow
pulses); animate-pals.mjs batches the rest via fal (--missing) and
encodes webp with img2webp + a palette APNG, publish-pals-turnaround.mjs
uploads all three and registers the slug in logo.mjs. The "jelly"
motion melted the mark into blobs, so it is opt-in as "morph".

oven: /kidlisp-backdrop.webp no longer 301-pins one daily clip — it
302s (no-store) to a random clip from a pool of top @jeffrey pieces
(backdrop/kidlisp/pool/), warmed at startup and daily;
/kidlisp-backdrop/pool shows status, POST /pool/warm renders.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
---
 marketing/podcast/bin/animate-pals.mjs        | 204 +++++++++++--
 .../podcast/bin/publish-pals-turnaround.mjs   |  87 +++---
 oven/grabber.mjs                              | 133 ++++++++-
 oven/server.mjs                               |  66 ++++-
 system/backend/logo.mjs                       |  54 +++-
 system/netlify/functions/logo.js              | 274 +++++++++---------
 6 files changed, 584 insertions(+), 234 deletions(-)
 mode change 100644 => 100755 marketing/podcast/bin/animate-pals.mjs
 mode change 100644 => 100755 marketing/podcast/bin/publish-pals-turnaround.mjs

diff --git a/marketing/podcast/bin/animate-pals.mjs b/marketing/podcast/bin/animate-pals.mjs
old mode 100644
new mode 100755
index d3d9b5c7eb..573cf8e15c
--- a/marketing/podcast/bin/animate-pals.mjs
+++ b/marketing/podcast/bin/animate-pals.mjs
@@ -1,36 +1,178 @@
-// animate-pals.mjs — turn a still "pals" logo tile into a seamless LOOPING
-// turnaround clip with Seedance 2.0. The trick: pass the same still as both
-// the start frame (image) and the end frame (endImage) so the last frame
-// snaps back to the first → the object spins 360° and loops cleanly.
+#!/usr/bin/env node
+// animate-pals.mjs — turn still "pals" logo tiles into seamless LOOPING
+// turnaround clips with Seedance 2.0, then encode each clip as an animated
+// WebP (hero) and an animated PNG (APNG, for hosts that only take PNG).
 //
-// Usage: node bin/animate-pals.mjs [slug]   (default: nat-amethyst)
-//   → ~/Desktop/pals-turnaround-<slug>.mp4
-import { generateShot } from "../../../pop/lib/fal.mjs";
-import { homedir } from "node:os";
+// The loop trick: the same still is passed as both the start frame (image)
+// and the end frame (endImage), so the last frame snaps back to the first
+// and the object returns to its starting pose. The encoder drops that
+// duplicated last frame so the loop has no hitch.
+//
+// Usage:
+//   node bin/animate-pals.mjs <slug...>            one or more pals (e.g. nat-jade chrome)
+//   node bin/animate-pals.mjs --all                every pal in system/backend/logo.mjs
+//   node bin/animate-pals.mjs --missing            every pal without a local .mp4 yet
+//   node bin/animate-pals.mjs --tray nat|cf|ig|av|materials
+//
+// Flags:
+//   --tier fast|standard   Seedance tier (default standard: nicer facets/light)
+//   --motion <style>       turntable | pulse | morph | auto (default auto: pulse for glowing
+//                          materials, else turntable; morph is opt-in — it melts the mark)
+//   --concurrency N        parallel fal jobs (default 3)
+//   --encode-only          skip fal, just (re)encode webp+apng from existing .mp4s
+//   --force                regenerate even if the .mp4 already exists
+//   --dry                  print the plan + cost estimate and exit
+//
+// Outputs: out/pals/turnarounds/<slug>.{mp4,webp,apng}
+// Stills are read from out/pals/<slug>.png, or fetched from the pals CDN.
+// Then: node bin/publish-pals-turnaround.mjs <slug...>|--all
+
+import { generateShot, RATE_PER_SEC } from "../../../pop/lib/fal.mjs";
+import { logoSlugs } from "../../../system/backend/logo.mjs";
+import { existsSync, mkdirSync, writeFileSync, readdirSync, rmSync } from "node:fs";
 import { resolve, dirname } from "node:path";
 import { fileURLToPath } from "node:url";
+import { execFileSync } from "node:child_process";
+import { tmpdir } from "node:os";
 
 const HERE = dirname(fileURLToPath(import.meta.url));
-const slug = process.argv[2] || "nat-amethyst";
-const still = resolve(HERE, "..", "out", "pals", `${slug}.png`);
-
-const r = await generateShot({
-  image: still,
-  endImage: still, // same first & last frame → seamless loop
-  prompt:
-    "product turntable: the sculpted logo object rotates smoothly and " +
-    "continuously through a full 360-degree spin on an invisible turntable and " +
-    "returns to the exact starting angle, a seamless loop. as it turns, its " +
-    "polished crystal facets catch and refract soft studio light with gentle " +
-    "moving glints and highlights. the flat pastel background stays perfectly " +
-    "still and unchanged. locked, centered camera with NO camera movement — " +
-    "only the object rotates in place. crisp, high detail, even studio light, " +
-    "seamless loopable turntable, no text, no extra objects.",
-  duration: "5",
-  ratio: "1:1",
-  resolution: "720p",
-  tier: "standard", // nicer facets/light than fast for a hero turnaround
-  outPath: `${homedir()}/Desktop/pals-turnaround-${slug}.mp4`,
-  label: `pals-turn-${slug}`,
-});
-console.log(JSON.stringify(r, null, 2));
+const STILLS = resolve(HERE, "..", "out", "pals");
+const OUT = resolve(STILLS, "turnarounds");
+mkdirSync(OUT, { recursive: true });
+
+const PALS_CDN = "https://pals-aesthetic-computer.sfo3.cdn.digitaloceanspaces.com";
+const DURATION = 5; // seconds
+const FPS = 24;
+
+const argv = process.argv.slice(2);
+const flag = (k, d = null) => { const i = argv.indexOf(`--${k}`); return i >= 0 ? argv[i + 1] : d; };
+const has = (k) => argv.includes(`--${k}`);
+const TIER = flag("tier", "standard");
+const MOTION = flag("motion", "auto");
+const CONCURRENCY = Number(flag("concurrency", 3));
+const ENCODE_ONLY = has("encode-only");
+const FORCE = has("force");
+const DRY = has("dry");
+
+const allSlugs = logoSlugs.map((f) => f.replace(/^pals-/, "").replace(/\.png$/, ""));
+const trayFilter = flag("tray");
+let slugs = argv.filter((a) => !a.startsWith("--") && !argv.includes(`--${a}`) && allSlugs.includes(a));
+if (has("all")) slugs = allSlugs;
+if (trayFilter) {
+  slugs = allSlugs.filter((s) => (trayFilter === "materials" ? !/^(nat|cf|ig|av)-/.test(s) : s.startsWith(`${trayFilter}-`)));
+}
+if (has("missing")) slugs = allSlugs.filter((s) => !existsSync(resolve(OUT, `${s}.mp4`)));
+if (!slugs.length) {
+  console.error("no pals selected — pass slugs, --all, --missing, or --tray <nat|cf|ig|av|materials>");
+  console.error(`known: ${allSlugs.join(" ")}`);
+  process.exit(1);
+}
+
+// ── motion prompts — every style returns to the exact start pose so the
+// start=end frame trick loops. The look lives in the still; these are MOTION only.
+const LOCK = "The flat background stays perfectly still and unchanged. Locked, centered camera with NO camera movement, no zoom, no pan. Crisp, high detail, even studio light, seamless loopable, no text, no extra objects, the object never leaves frame.";
+const MOTIONS = {
+  turntable:
+    "product turntable: the sculpted logo object rotates smoothly and continuously through one full 360-degree spin on an invisible turntable and returns to the exact starting angle, a seamless loop. As it turns its surface catches soft studio light with gentle moving glints and highlights. Only the object rotates in place. " + LOCK,
+  // morph: Seedance treats "jiggle like jelly" as licence to melt the mark into a
+  // blob mid-loop (felt / balloon / bubblegum all did). Fun, but it loses the
+  // logo, so it is opt-in only.
+  morph:
+    "the soft squishy logo object does one slow full 360-degree turn on an invisible turntable while gently bouncing and jiggling like jelly — a soft squash as it lands, a gentle stretch as it lifts — and settles back to the exact starting pose and angle, a seamless loop. Playful, bouncy, tactile. Only the object moves. " + LOCK,
+  pulse:
+    "the glowing logo object does one slow full 360-degree turn on an invisible turntable while its light breathes: the glow swells brighter then softens twice per turn, with soft bloom and faint flicker, returning to the exact starting brightness and angle, a seamless loop. Only the object moves and glows. " + LOCK,
+};
+function motionFor(slug) {
+  if (MOTION !== "auto") return MOTION;
+  if (/neon|holo|electric|spectrum|crystal|amethyst/.test(slug)) return "pulse";
+  return "turntable";
+}
+function ensureStill(slug) {
+  const p = resolve(STILLS, `${slug}.png`);
+  if (existsSync(p)) return p;
+  mkdirSync(STILLS, { recursive: true });
+  const url = `${PALS_CDN}/pals-${slug}.png`;
+  console.log(`  ⬇ ${slug}: fetching still ${url}`);
+  execFileSync("curl", ["-sfL", "-o", p, url]);
+  if (!existsSync(p)) throw new Error(`could not fetch still for ${slug}`);
+  return p;
+}
+
+// ── encoders ────────────────────────────────────────────────────────────
+function frameCount(mp4) {
+  const out = execFileSync("ffprobe", ["-v", "error", "-select_streams", "v:0", "-count_frames",
+    "-show_entries", "stream=nb_read_frames", "-of", "csv=p=0", mp4]).toString().trim();
+  return Number(out) || Math.round(DURATION * FPS);
+}
+export function encodeTurnaround(slug) {
+  const mp4 = resolve(OUT, `${slug}.mp4`);
+  const webp = resolve(OUT, `${slug}.webp`);
+  const apng = resolve(OUT, `${slug}.apng`);
+  const keep = frameCount(mp4) - 1; // drop the duplicated last frame → clean loop
+  const base = `trim=end_frame=${keep},setpts=PTS-STARTPTS`;
+
+  // WebP: 720px @ 24fps lossy — this ffmpeg has no libwebp, so frames → img2webp.
+  const frames = resolve(tmpdir(), `pals-frames-${slug}-${process.pid}`);
+  rmSync(frames, { recursive: true, force: true });
+  mkdirSync(frames, { recursive: true });
+  execFileSync("ffmpeg", ["-y", "-hide_banner", "-loglevel", "error", "-i", mp4,
+    "-vf", `${base},fps=${FPS},scale=720:-1:flags=lanczos`, resolve(frames, "%04d.png")]);
+  const pngs = readdirSync(frames).filter((f) => f.endsWith(".png")).sort().map((f) => resolve(frames, f));
+  execFileSync("img2webp", ["-loop", "0", "-d", String(Math.round(1000 / FPS)), "-lossy", "-q", "72", "-m", "4", ...pngs, "-o", webp]);
+  rmSync(frames, { recursive: true, force: true });
+
+  // APNG: 400px @ 12fps, 256-colour palette, mixed prediction — PNG frames are
+  // lossless so this is the knob that keeps it near 2–3MB instead of 8MB+.
+  execFileSync("ffmpeg", ["-y", "-hide_banner", "-loglevel", "error", "-i", mp4,
+    "-vf", `${base},fps=12,scale=400:-1:flags=lanczos,split[a][b];[a]palettegen=max_colors=256:stats_mode=diff[p];[b][p]paletteuse=dither=sierra2_4a`,
+    "-plays", "0", "-pred", "mixed", "-f", "apng", apng]);
+  return { webp, apng };
+}
+
+// ── plan ─────────────────────────────────────────────────────────────────
+const jobs = slugs.map((slug) => ({
+  slug,
+  motion: motionFor(slug),
+  mp4: resolve(OUT, `${slug}.mp4`),
+  skipFal: ENCODE_ONLY || (!FORCE && existsSync(resolve(OUT, `${slug}.mp4`))),
+}));
+const toGenerate = jobs.filter((j) => !j.skipFal);
+const cost = toGenerate.length * DURATION * RATE_PER_SEC[TIER];
+console.log(`pals turnarounds: ${jobs.length} selected · ${toGenerate.length} to generate on fal (${TIER}) ≈ $${cost.toFixed(2)}`);
+for (const j of jobs) console.log(`  ${j.skipFal ? "· encode " : "★ fal    "} ${j.slug}  [${j.motion}]`);
+if (DRY) process.exit(0);
+if (toGenerate.length) writeFileSync(resolve(OUT, `.last-batch.json`), JSON.stringify({ at: new Date().toISOString(), tier: TIER, slugs: toGenerate.map((j) => j.slug) }, null, 2));
+
+// ── run ─────────────────────────────────────────────────────────────────
+const results = [];
+let cursor = 0;
+async function worker() {
+  while (cursor < jobs.length) {
+    const job = jobs[cursor++];
+    const t0 = Date.now();
+    try {
+      if (!job.skipFal) {
+        const still = ensureStill(job.slug);
+        const r = await generateShot({
+          image: still, endImage: still,
+          prompt: MOTIONS[job.motion],
+          duration: String(DURATION), ratio: "1:1", resolution: "720p", tier: TIER,
+          outPath: job.mp4, label: `pals-turn-${job.slug}`,
+        });
+        if (!r.ok && !existsSync(job.mp4)) throw new Error(r.error || "fal failed");
+      }
+      const enc = encodeTurnaround(job.slug);
+      results.push({ slug: job.slug, ok: true, motion: job.motion, ...enc, secs: ((Date.now() - t0) / 1000) | 0 });
+      console.log(`  ✓ ${job.slug} (${job.motion}) ${results.at(-1).secs}s`);
+    } catch (err) {
+      results.push({ slug: job.slug, ok: false, error: err.message });
+      console.log(`  ✗ ${job.slug}: ${err.message}`);
+    }
+  }
+}
+await Promise.all(Array.from({ length: Math.min(CONCURRENCY, jobs.length) }, worker));
+
+const ok = results.filter((r) => r.ok);
+console.log(`\ndone: ${ok.length}/${results.length} ok → ${OUT}`);
+if (ok.length) console.log(`publish: node bin/publish-pals-turnaround.mjs ${ok.map((r) => r.slug).join(" ")}`);
+process.exit(ok.length === results.length ? 0 : 1);
diff --git a/marketing/podcast/bin/publish-pals-turnaround.mjs b/marketing/podcast/bin/publish-pals-turnaround.mjs
old mode 100644
new mode 100755
index 7dbafa0487..ea4e1d3df3
--- a/marketing/podcast/bin/publish-pals-turnaround.mjs
+++ b/marketing/podcast/bin/publish-pals-turnaround.mjs
@@ -1,10 +1,12 @@
 #!/usr/bin/env node
-// Publish an accepted Pal turnaround master and animated WebP to stable,
-// versioned Art Space keys.
+// Publish accepted Pal turnarounds (mp4 master + animated WebP + APNG) to
+// stable, versioned Art Space keys, then register them in
+// system/backend/logo.mjs so pals.aesthetic.computer can serve them.
 //
-// Usage: node bin/publish-pals-turnaround.mjs <slug>
+// Usage: node bin/publish-pals-turnaround.mjs <slug...>
+//        node bin/publish-pals-turnaround.mjs --all     (every slug with all three files)
 
-import { existsSync, readFileSync } from "node:fs";
+import { existsSync, readFileSync, writeFileSync, readdirSync } from "node:fs";
 import { resolve, dirname } from "node:path";
 import { fileURLToPath } from "node:url";
 import { S3Client, PutObjectCommand } from "@aws-sdk/client-s3";
@@ -12,12 +14,26 @@ import { S3Client, PutObjectCommand } from "@aws-sdk/client-s3";
 const HERE = dirname(fileURLToPath(import.meta.url));
 const REPO = resolve(HERE, "../../..");
 const OUT = resolve(HERE, "../out/pals/turnarounds");
-const slug = process.argv[2];
+const LOGO = resolve(REPO, "system/backend/logo.mjs");
+const FORMATS = [
+  { ext: "mp4", type: "video/mp4" },
+  { ext: "webp", type: "image/webp" },
+  { ext: "apng", type: "image/apng" },
+];
 
-if (!slug || !/^[a-z0-9]+(?:-[a-z0-9]+)*$/.test(slug)) {
-  console.error("usage: node bin/publish-pals-turnaround.mjs <slug>");
+const argv = process.argv.slice(2);
+const complete = (slug) => FORMATS.every((f) => existsSync(resolve(OUT, `${slug}.${f.ext}`)));
+let slugs = argv.filter((a) => /^[a-z0-9]+(?:-[a-z0-9]+)*$/.test(a));
+if (argv.includes("--all")) {
+  slugs = existsSync(OUT) ? [...new Set(readdirSync(OUT).map((f) => f.replace(/\.(mp4|webp|apng)$/, "")).filter((s) => /^[a-z0-9-]+$/.test(s)))].filter(complete).sort() : [];
+}
+if (!slugs.length) {
+  console.error("usage: node bin/publish-pals-turnaround.mjs <slug...> | --all");
   process.exit(1);
 }
+for (const slug of slugs) {
+  if (!complete(slug)) throw new Error(`Missing one of ${FORMATS.map((f) => `${slug}.${f.ext}`).join(", ")} in ${OUT} — run animate-pals.mjs first`);
+}
 
 const env = { ...process.env };
 const vault = resolve(REPO, "aesthetic-computer-vault/oven/.env");
@@ -27,46 +43,41 @@ if (existsSync(vault)) {
     if (match) env[match[1]] ||= match[2].replace(/^['"]|['"]$/g, "");
   }
 }
-
 if (!env.ART_SPACES_KEY || !env.ART_SPACES_SECRET) {
   throw new Error(`Art Space credentials missing from environment or ${vault}`);
 }
 
-const files = [
-  { ext: "mp4", type: "video/mp4" },
-  { ext: "webp", type: "image/webp" },
-].map((asset) => ({
-  ...asset,
-  path: resolve(OUT, `${slug}.${asset.ext}`),
-  key: `pals/turnarounds/v1/${slug}.${asset.ext}`,
-}));
-
-for (const asset of files) {
-  if (!existsSync(asset.path)) throw new Error(`Missing ${asset.path}`);
-}
-
 const client = new S3Client({
   endpoint: env.ART_SPACES_ENDPOINT || "https://sfo3.digitaloceanspaces.com",
   region: "sfo3",
-  credentials: {
-    accessKeyId: env.ART_SPACES_KEY,
-    secretAccessKey: env.ART_SPACES_SECRET,
-  },
+  credentials: { accessKeyId: env.ART_SPACES_KEY, secretAccessKey: env.ART_SPACES_SECRET },
 });
 const bucket = env.ART_SPACES_BUCKET || "art-aesthetic-computer";
 const cdn = env.ART_CDN_BASE || "https://art.aesthetic.computer";
 
-for (const asset of files) {
-  await client.send(new PutObjectCommand({
-    Bucket: bucket,
-    Key: asset.key,
-    Body: readFileSync(asset.path),
-    ContentType: asset.type,
-    ACL: "public-read",
-    CacheControl: "public, max-age=31536000, immutable",
-  }));
-  const url = `${cdn}/${asset.key}`;
-  const response = await fetch(url, { method: "HEAD", cache: "no-store" });
-  if (!response.ok) throw new Error(`Published ${url}, verification returned ${response.status}`);
-  console.log(`${asset.ext}: ${url}`);
+const published = [];
+for (const slug of slugs) {
+  for (const f of FORMATS) {
+    const key = `pals/turnarounds/v1/${slug}.${f.ext}`;
+    await client.send(new PutObjectCommand({
+      Bucket: bucket, Key: key, Body: readFileSync(resolve(OUT, `${slug}.${f.ext}`)),
+      ContentType: f.type, ACL: "public-read",
+      CacheControl: "public, max-age=31536000, immutable",
+    }));
+    const url = `${cdn}/${key}`;
+    const response = await fetch(url, { method: "HEAD", cache: "no-store" });
+    if (!response.ok) throw new Error(`Published ${url}, verification returned ${response.status}`);
+    console.log(`${slug}.${f.ext}: ${url}`);
+  }
+  published.push(slug);
 }
+
+// Register in logo.mjs — the endpoint only serves turnarounds it knows about.
+const src = readFileSync(LOGO, "utf8");
+const m = src.match(/export const turnaroundSlugs = \[([\s\S]*?)\];/);
+if (!m) throw new Error("turnaroundSlugs array not found in logo.mjs");
+const existing = [...m[1].matchAll(/"([a-z0-9-]+)"/g)].map((x) => x[1]);
+const merged = [...new Set([...existing, ...published])].sort();
+const block = `export const turnaroundSlugs = [\n${merged.map((s) => `  "${s}",`).join("\n")}\n];`;
+writeFileSync(LOGO, src.replace(m[0], block));
+console.log(`\nlogo.mjs: turnaroundSlugs now ${merged.length} (${published.length} published this run)`);
diff --git a/oven/grabber.mjs b/oven/grabber.mjs
index d7d409fd40..6c3e6cd823 100644
--- a/oven/grabber.mjs
+++ b/oven/grabber.mjs
@@ -8,7 +8,7 @@ import { join } from 'path';
 import { randomBytes, createHash } from 'crypto';
 import puppeteer from 'puppeteer';
 import { MongoClient } from 'mongodb';
-import { S3Client, PutObjectCommand, HeadObjectCommand, GetObjectCommand } from '@aws-sdk/client-s3';
+import { S3Client, PutObjectCommand, HeadObjectCommand, GetObjectCommand, ListObjectsV2Command } from '@aws-sdk/client-s3';
 import sharp from 'sharp';
 import { readFileSync } from 'fs';
 import { dirname } from 'path';
@@ -4550,6 +4550,137 @@ export async function getLatestBackdropUrl() {
   }
 }
 
+// =============================================================================
+// KidLisp Backdrop POOL - many pieces, a random one on every request.
+// The daily backdrop above renders ONE piece per day; the pool keeps a
+// per-piece object per @jeffrey top piece at backdrop/kidlisp/pool/<code>.webp
+// so /kidlisp-backdrop.webp can 302 to a different clip each hit.
+// =============================================================================
+
+const BACKDROP_POOL_PREFIX = 'backdrop/kidlisp/pool/';
+const BACKDROP_POOL_SIZE = Number(process.env.BACKDROP_POOL_SIZE || 16);
+const BACKDROP_POOL_MAX_AGE_MS = 14 * 24 * 60 * 60 * 1000; // re-render a pool clip after 2 weeks
+const BACKDROP_POOL_LIST_TTL_MS = 5 * 60 * 1000;
+
+const backdropPool = { entries: [], listedAt: 0, warming: false, lastWarm: null };
+
+/**
+ * List the pool objects in Spaces (cached for 5 minutes).
+ * @returns {Array<{ code: string, url: string, key: string, modified: Date, size: number }>}
+ */
+export async function listBackdropPool(force = false) {
+  if (!force && backdropPool.entries.length && Date.now() - backdropPool.listedAt < BACKDROP_POOL_LIST_TTL_MS) {
+    return backdropPool.entries;
+  }
+  const entries = [];
+  let token;
+  do {
+    const page = await spacesClient.send(new ListObjectsV2Command({
+      Bucket: SPACES_BUCKET,
+      Prefix: BACKDROP_POOL_PREFIX,
+      ContinuationToken: token,
+    }));
+    for (const obj of page.Contents || []) {
+      const m = obj.Key.match(/pool\/([a-z0-9]+)\.webp$/i);
+      if (!m) continue;
+      entries.push({ code: m[1], key: obj.Key, url: `${SPACES_CDN_BASE}/${obj.Key}`, modified: obj.LastModified, size: obj.Size });
+    }
+    token = page.IsTruncated ? page.NextContinuationToken : undefined;
+  } while (token);
+  backdropPool.entries = entries;
+  backdropPool.listedAt = Date.now();
+  return entries;
+}
+
+/**
+ * Pick a random backdrop URL from the pool — a different one every call.
+ * `exclude` (a code or URL) is skipped when there is any alternative.
+ * Falls back to today's daily backdrop when the pool is empty.
+ */
+export async function pickBackdropUrl({ code = null, exclude = null } = {}) {
+  let pool = [];
+  try { pool = await listBackdropPool(); } catch (err) { console.error('❌ Backdrop pool list failed:', err.message); }
+  if (code) {
+    const hit = pool.find((e) => e.code === code.replace(/^\$/, ''));
+    if (hit) return { url: hit.url, piece: `$${hit.code}`, pool: pool.length };
+  }
+  const candidates = pool.filter((e) => e.code !== exclude && e.url !== exclude);
+  const from = candidates.length ? candidates : pool;
+  if (from.length) {
+    const hit = from[Math.floor(Math.random() * from.length)];
+    return { url: hit.url, piece: `$${hit.code}`, pool: pool.length };
+  }
+  const daily = await getLatestBackdropUrl();
+  return daily ? { url: daily, piece: backdropCache.piece, pool: 0 } : null;
+}
+
+/**
+ * Warm the pool: render (or refresh) one clip per top @jeffrey piece.
+ * Skips clips younger than BACKDROP_POOL_MAX_AGE_MS unless force. Serial —
+ * grabPiece drives a headless browser and has its own queue.
+ */
+export async function warmBackdropPool({ size = BACKDROP_POOL_SIZE, force = false } = {}) {
+  if (backdropPool.warming) return { skipped: true, reason: 'already warming' };
+  backdropPool.warming = true;
+  const summary = { rendered: [], fresh: [], failed: [], startedAt: new Date().toISOString() };
+  try {
+    const top = await fetchTopKidlispHits(Math.max(size * 4, 60));
+    const picks = top.filter((p) => p.owner?.handle === '@jeffrey').slice(0, size);
+    if (!picks.length) throw new Error('No KidLisp pieces by @jeffrey available for the backdrop pool');
+    const existing = new Map((await listBackdropPool(true)).map((e) => [e.code, e]));
+
+    for (const p of picks) {
+      const code = p.code;
+      const key = `${BACKDROP_POOL_PREFIX}${code}.webp`;
+      const have = existing.get(code);
+      if (!force && have && Date.now() - new Date(have.modified).getTime() < BACKDROP_POOL_MAX_AGE_MS) {
+        summary.fresh.push(code);
+        continue;
+      }
+      try {
+        console.log(`🎨 Backdrop pool: rendering $${code} (${formatHits(p.hits)} hits)`);
+        const result = await grabPiece(`$${code}`, {
+          format: 'webp', width: 256, height: 256, duration: 12000, fps: 7.5,
+          playbackFps: 15, density: 4, quality: 85, skipCache: force, source: 'backdrop',
+        });
+        if (!result.success) throw new Error(result.error || 'grab failed');
+        let buffer = result.buffer;
+        if (!buffer && result.cdnUrl) {
+          const response = await fetch(result.cdnUrl);
+          if (!response.ok) throw new Error(`cached grab fetch ${response.status}`);
+          buffer = Buffer.from(await response.arrayBuffer());
+        }
+        if (!buffer) throw new Error('no bytes from grabPiece');
+        await spacesClient.send(new PutObjectCommand({
+          Bucket: SPACES_BUCKET, Key: key, Body: buffer, ContentType: 'image/webp',
+          ACL: 'public-read', CacheControl: 'public, max-age=31536000, immutable',
+        }));
+        summary.rendered.push(code);
+        console.log(`📤 Backdrop pool: $${code} → ${SPACES_CDN_BASE}/${key}`);
+      } catch (err) {
+        summary.failed.push({ code, error: err.message });
+        console.error(`❌ Backdrop pool: $${code} failed: ${err.message}`);
+      }
+    }
+    await listBackdropPool(true);
+  } finally {
+    backdropPool.warming = false;
+    backdropPool.lastWarm = { ...summary, finishedAt: new Date().toISOString() };
+  }
+  return summary;
+}
+
+export function getBackdropPoolStatus() {
+  return {
+    size: backdropPool.entries.length,
+    target: BACKDROP_POOL_SIZE,
+    warming: backdropPool.warming,
+    lastWarm: backdropPool.lastWarm,
+    listedAt: backdropPool.listedAt ? new Date(backdropPool.listedAt).toISOString() : null,
+    entries: backdropPool.entries.map((e) => ({ piece: `$${e.code}`, url: e.url, modified: e.modified, size: e.size })),
+  };
+}
+
 // =============================================================================
 // Notepat.com OG Preview Image
 // =============================================================================
diff --git a/oven/server.mjs b/oven/server.mjs
index 6ffc74eaf3..ced386a8ef 100644
--- a/oven/server.mjs
+++ b/oven/server.mjs
@@ -11,7 +11,7 @@ import { execSync } from 'child_process';
 import { gunzipSync, gzipSync } from 'node:zlib';
 import { WebSocketServer } from 'ws';
 import { healthHandler, bakeHandler, statusHandler, bakeCompleteHandler, bakeStatusHandler, getActiveBakes, getIncomingBakes, getRecentBakes, subscribeToUpdates, cleanupStaleBakes } from './baker.mjs';
-import { grabHandler, grabGetHandler, grabIPFSHandler, grabPiece, getCachedOrGenerate, getActiveGrabs, getRecentGrabs, getLatestKeepThumbnail, ensureLatestKeepThumbnail, getLatestIPFSUpload, getAllLatestIPFSUploads, setNotifyCallback, setLogCallback, cleanupStaleGrabs, clearAllActiveGrabs, getQueueStatus, getCurrentProgress, getAllProgress, getConcurrencyStatus, IPFS_GATEWAY, generateKidlispOGImage, getOGImageCacheStatus, getFrozenPieces, clearFrozenPiece, getLatestOGImageUrl, regenerateOGImagesBackground, generateKidlispBackdrop, getLatestBackdropUrl, APP_SCREENSHOT_PRESETS, generateNotepatOGImage, getLatestNotepatOGUrl, prewarmGrabBrowser, generateNewsOGImage } from './grabber.mjs';
+import { grabHandler, grabGetHandler, grabIPFSHandler, grabPiece, getCachedOrGenerate, getActiveGrabs, getRecentGrabs, getLatestKeepThumbnail, ensureLatestKeepThumbnail, getLatestIPFSUpload, getAllLatestIPFSUploads, setNotifyCallback, setLogCallback, cleanupStaleGrabs, clearAllActiveGrabs, getQueueStatus, getCurrentProgress, getAllProgress, getConcurrencyStatus, IPFS_GATEWAY, generateKidlispOGImage, getOGImageCacheStatus, getFrozenPieces, clearFrozenPiece, getLatestOGImageUrl, regenerateOGImagesBackground, generateKidlispBackdrop, getLatestBackdropUrl, listBackdropPool, pickBackdropUrl, warmBackdropPool, getBackdropPoolStatus, APP_SCREENSHOT_PRESETS, generateNotepatOGImage, getLatestNotepatOGUrl, prewarmGrabBrowser, generateNewsOGImage } from './grabber.mjs';
 import archiver from 'archiver';
 import sharp from 'sharp';
 import { createBundle, createJSPieceBundle, createJSLibraryBundle, createM4DBundle, generateDeviceHTML, prewarmCache, getCacheStatus, setSkipMinification } from './bundler.mjs';
@@ -1117,6 +1117,7 @@ app.get('/tools', (req, res) => {
     <div><a href="/news-og/ncd2.png">/news-og/:code.png</a><span class="desc">News article OG image</span></div>
     <div><a href="/kidlisp-backdrop.webp">/kidlisp-backdrop.webp</a><span class="desc">KidLisp backdrop animation</span></div>
     <div><a href="/kidlisp-backdrop">/kidlisp-backdrop</a><span class="desc">KidLisp backdrop page</span></div>
+    <div><a href="/kidlisp-backdrop/pool">/kidlisp-backdrop/pool</a><span class="desc">Backdrop pool status (POST /pool/warm to render)</span></div>
   </div>
 
   <h2>App Screenshots</h2>
@@ -2056,36 +2057,60 @@ app.get('/news-og/:code.png', async (req, res) => {
 // KidLisp Backdrop - Animated WebP for login screens, Auth0, etc.
 // =============================================================================
 
-// Fast redirect to CDN-cached 1024px animated webp
+// A random pool clip on every hit (302 + no-store so nothing pins one).
+//   ?piece=$code   a specific pool piece
+//   ?not=$code     skip this one (client-side "next")
+// Falls back to the daily backdrop while the pool is empty.
 app.get('/kidlisp-backdrop.webp', async (req, res) => {
   try {
-    // Get cached URL without triggering generation (fast!)
-    const url = await getLatestBackdropUrl();
-    
-    if (url) {
-      res.setHeader('Cache-Control', 'public, max-age=3600');
-      res.setHeader('X-Cache', 'CDN');
-      return res.redirect(301, url);
+    const pick = await pickBackdropUrl({
+      code: typeof req.query.piece === 'string' ? req.query.piece : null,
+      exclude: typeof req.query.not === 'string' ? req.query.not.replace(/^\$/, '') : null,
+    });
+    if (pick?.url) {
+      res.setHeader('Cache-Control', 'no-store');
+      res.setHeader('X-Cache', pick.pool ? 'POOL' : 'CDN');
+      res.setHeader('X-Backdrop-Piece', pick.piece || 'unknown');
+      res.setHeader('X-Backdrop-Pool', String(pick.pool || 0));
+      if (!pick.pool) warmBackdropPool().catch(() => {});
+      return res.redirect(302, pick.url);
     }
-    
-    // No cached backdrop - generate synchronously (first request will be slow)
+
+    // Nothing anywhere yet - render today's daily backdrop synchronously.
     addServerLog('warn', '⚠️', 'Backdrop cache miss, generating...');
-    
     const result = await generateKidlispBackdrop(false);
+    warmBackdropPool().catch(() => {});
     if (result.url) {
-      res.setHeader('Cache-Control', 'public, max-age=3600');
+      res.setHeader('Cache-Control', 'no-store');
       res.setHeader('X-Cache', 'MISS');
       return res.redirect(302, result.url);
     }
-    
     res.status(503).json({ error: 'Backdrop generation in progress, try again shortly' });
-    
   } catch (error) {
     console.error('Backdrop error:', error);
     res.status(500).json({ error: 'Failed to get backdrop', message: error.message });
   }
 });
 
+// Pool status + manual warm
+app.get('/kidlisp-backdrop/pool', async (req, res) => {
+  try {
+    await listBackdropPool(req.query.refresh === 'true');
+    res.setHeader('Cache-Control', 'no-store');
+    res.json(getBackdropPoolStatus());
+  } catch (error) {
+    res.status(500).json({ error: error.message });
+  }
+});
+app.post('/kidlisp-backdrop/pool/warm', async (req, res) => {
+  const force = req.query.force === 'true';
+  addServerLog('info', '🖼️', `Backdrop pool warm requested${force ? ' (force)' : ''}`);
+  warmBackdropPool({ force })
+    .then((s) => addServerLog('success', '🎨', `Backdrop pool warm: ${s.rendered?.length ?? 0} rendered, ${s.fresh?.length ?? 0} fresh, ${s.failed?.length ?? 0} failed`))
+    .catch((err) => addServerLog('error', '❌', `Backdrop pool warm failed: ${err.message}`));
+  res.json({ started: true, force });
+});
+
 // Dynamic backdrop generation (may regenerate on-demand)
 app.get('/kidlisp-backdrop', async (req, res) => {
   try {
@@ -4410,6 +4435,17 @@ if (dev) {
       });
     }, 10000); // Wait 10s for server to fully initialize
     
+    // Warm the KidLisp backdrop pool (one clip per top @jeffrey piece) after
+    // the OG pass, then top it up daily so new top pieces join the rotation.
+    const warmPool = (why) => {
+      addServerLog('info', '🖼️', `Backdrop pool warm (${why})...`);
+      warmBackdropPool().then((s) => {
+        if (!s.skipped) addServerLog('success', '🎨', `Backdrop pool: ${s.rendered.length} rendered, ${s.fresh.length} fresh, ${s.failed.length} failed`);
+      }).catch(err => addServerLog('error', '❌', `Backdrop pool warm failed: ${err.message}`));
+    };
+    setTimeout(() => warmPool('startup'), 90000);
+    setInterval(() => warmPool('daily'), 24 * 60 * 60 * 1000);
+
     // Schedule periodic regeneration (every 6 hours)
     setInterval(() => {
       addServerLog('info', '🖼️', 'Scheduled OG regeneration starting...');
diff --git a/system/backend/logo.mjs b/system/backend/logo.mjs
index e3f36dc7cd..bee0d40a88 100644
--- a/system/backend/logo.mjs
+++ b/system/backend/logo.mjs
@@ -56,16 +56,56 @@ export const logoSlugs = [
   "pals-wood.png",
 ];
 
-export const turnaroundSlugs = ["nat-amethyst"];
+// Pals with a published looping turnaround (mp4 master + animated webp +
+// apng) at art.aesthetic.computer/pals/turnarounds/v1/. Maintained by
+// marketing/podcast/bin/publish-pals-turnaround.mjs — don't hand-edit.
+export const turnaroundSlugs = [
+  "av-balloon",
+  "cf-electric",
+  "cf-sunset",
+  "chrome",
+  "crystal",
+  "felt",
+  "glass",
+  "ig-bubblegum",
+  "nat-amethyst",
+  "nat-jade",
+  "nat-terracotta",
+  "neon",
+  "wood",
+];
+
+export const turnaroundFormats = ["mp4", "webp", "apng"];
+export const PALS_CDN = "https://pals-aesthetic-computer.sfo3.cdn.digitaloceanspaces.com";
+export const ART_CDN = "https://art.aesthetic.computer";
+
+const pick = (list) => list[Math.floor(Math.random() * list.length)];
+const stillSlug = (file) => file.replace(/^pals-/, "").replace(/\.png$/, "");
+export const stillSlugs = logoSlugs.map(stillSlug);
 
 export function logoUrl(slug = null) {
-  const file = slug ? `pals-${slug}.png` : logoSlugs[Math.floor(Math.random() * logoSlugs.length)];
-  if (!logoSlugs.includes(file)) return null;
-  return `https://pals-aesthetic-computer.sfo3.cdn.digitaloceanspaces.com/${file}`;
+  const file = slug ? `pals-${slug}.png` : pick(logoSlugs);
+  if (slug && !logoSlugs.includes(file)) return null;
+  return `${PALS_CDN}/${file}`;
 }
 
 export function turnaroundUrl(slug = null, format = "webp") {
-  const selected = slug || turnaroundSlugs[Math.floor(Math.random() * turnaroundSlugs.length)];
-  if (!turnaroundSlugs.includes(selected) || !["mp4", "webp"].includes(format)) return null;
-  return `https://art.aesthetic.computer/pals/turnarounds/v1/${selected}.${format}`;
+  const selected = slug || pick(turnaroundSlugs);
+  if (!turnaroundSlugs.includes(selected) || !turnaroundFormats.includes(format)) return null;
+  return `${ART_CDN}/pals/turnarounds/v1/${selected}.${format}`;
+}
+
+// A random pal, 50/50 still vs animated, never repeating `previous`.
+// `animated` forces the coin: true → turnaround, false → still, null → 50/50.
+export function randomPal({ previous = null, animated = null, format = "webp" } = {}) {
+  let pal;
+  for (let i = 0; i < 8; i++) {
+    const coin = animated ?? Math.random() < 0.5;
+    pal = coin && turnaroundSlugs.length
+      ? { slug: pick(turnaroundSlugs), animated: true, format }
+      : { slug: pick(stillSlugs), animated: false, format: "png" };
+    pal.url = pal.animated ? turnaroundUrl(pal.slug, format) : logoUrl(pal.slug);
+    if (pal.url !== previous) break;
+  }
+  return pal;
 }
diff --git a/system/netlify/functions/logo.js b/system/netlify/functions/logo.js
index b8008541e1..a93bd0a867 100644
--- a/system/netlify/functions/logo.js
+++ b/system/netlify/functions/logo.js
@@ -1,149 +1,139 @@
-// Logo, 23.05.02.22.09
-// Proxy a random logo from one endpoint.
-// If loaded in the browser, return a tappable HTML response to cycle logos.
-// Otherwise, proxy the `.png`.
-
-/* #region 🏁 TODO 
-  - [] Make it cooler?
-#endregion */
-
-import { respond } from "../../backend/http.mjs";
-import { logoUrl, turnaroundUrl } from "../../backend/logo.mjs";
-
-export async function handler(event, context) {
-  // Make sure this is a GET request
-  if (event.httpMethod !== "GET") {
-    return respond(405, { error: "Wrong request type." });
-  }
+// Logo, 23.05.02.22.09 · pals.aesthetic.computer
+// Serve a random pal from one endpoint — 50/50 a still PNG or a looping
+// animated turnaround (WebP / APNG / MP4), a fresh random one every hit.
+// Loaded in a browser it returns a tappable HTML page that cycles pals.
+//
+//   /                          HTML page (50/50 still or animated, click to cycle)
+//   /logo.png                  random still, PNG bytes (proxied)
+//   /random.webp  /random.apng random animated turnaround, bytes (proxied)
+//   /random.mp4   /random.json redirect to a random turnaround / describe a random pal
+//   /pals-<slug>.png           a named still            (302 → CDN)
+//   /pals-<slug>.webp|apng|mp4 a named turnaround       (302 → CDN)
+//   /turnaround.* /auth0.*     aliases of random.* (kept for existing embeds)
+//   /pals.json                 the whole catalogue (stills + turnarounds)
+// Non-browser clients (curl, wget, <img>) hitting / get 50/50 still-or-webp bytes.
 
-  const assetPath = event.path
-    .replace(/^\/api\/logo\/?/, "")
-    .replace(/^\//, "");
-  const namedTurnaround = assetPath.match(/^(?:pals-)?([a-z0-9-]+)\.(mp4|webp)$/);
-  const turnaroundAlias = assetPath.match(/^(?:turnaround|random|auth0)\.(mp4|webp)$/);
-  const namedStill = assetPath.match(/^pals-([a-z0-9-]+)\.png$/);
+import { respond } from "../../backend/http.mjs";
+import {
+  logoUrl, turnaroundUrl, randomPal, stillSlugs, turnaroundSlugs, turnaroundFormats,
+} from "../../backend/logo.mjs";
 
-  const canonicalAsset = turnaroundAlias
-    ? turnaroundUrl(null, turnaroundAlias[1])
-    : namedTurnaround
-      ? turnaroundUrl(namedTurnaround[1], namedTurnaround[2])
-      : namedStill
-        ? logoUrl(namedStill[1])
-        : null;
+const CORS = { "Access-Control-Allow-Origin": "*" };
+const NO_CACHE = { "Cache-Control": "no-store" };
+const MIME = { png: "image/png", webp: "image/webp", apng: "image/apng", mp4: "video/mp4" };
 
-  if ((namedTurnaround || turnaroundAlias || namedStill) && !canonicalAsset) {
-    return respond(404, { error: "Pal not found." });
-  }
+const redirect = (url) => ({
+  statusCode: 302,
+  headers: { Location: url, ...CORS, ...NO_CACHE },
+  body: "",
+});
+
+async function proxy(url, format) {
+  const { got } = await import("got");
+  const response = await got(url, { responseType: "buffer", https: { rejectUnauthorized: false } });
+  return {
+    statusCode: 200,
+    headers: { "Content-Type": MIME[format] || "application/octet-stream", ...CORS, ...NO_CACHE },
+    body: Buffer.from(response.body, "binary").toString("base64"),
+    isBase64Encoded: true,
+  };
+}
+
+export async function handler(event, context) {
+  if (event.httpMethod !== "GET") return respond(405, { error: "Wrong request type." });
 
-  if (canonicalAsset) {
+  const assetPath = event.path.replace(/^\/api\/logo\/?/, "").replace(/^\//, "");
+  const query = new URLSearchParams(event.queryStringParameters || {});
+  const previous = query.get("previousLogo");
+
+  // ── catalogue ───────────────────────────────────────────────────────
+  if (assetPath === "pals.json") {
     return {
-      statusCode: 302,
-      headers: {
-        Location: canonicalAsset,
-        "Access-Control-Allow-Origin": "*",
-        "Cache-Control": "public, max-age=300",
-      },
-      body: "",
+      statusCode: 200,
+      headers: { "Content-Type": "application/json", ...CORS, "Cache-Control": "public, max-age=300" },
+      body: JSON.stringify({
+        stills: stillSlugs.map((slug) => ({ slug, png: logoUrl(slug) })),
+        turnarounds: turnaroundSlugs.map((slug) => Object.fromEntries([
+          ["slug", slug], ...turnaroundFormats.map((f) => [f, turnaroundUrl(slug, f)]),
+        ])),
+      }),
     };
   }
-
-  const { got } = await import("got");
-
-  const queryParams = new URLSearchParams(event.queryStringParameters);
-  const previousLogo = queryParams.get("previousLogo");
-
-  let logo;
-  do {
-    logo = logoUrl();
-  } while (logo === previousLogo); // Make sure we don't select the same logo
-
-  const response = await got(logo, {
-    responseType: "buffer",
-    https: { rejectUnauthorized: false },
-  });
-
-  const base64Logo = Buffer.from(response.body, "binary").toString("base64");
-
-  const userAgent = event.headers["user-agent"] || "";
-  const isServer =
-    userAgent.includes("curl") ||
-    userAgent.includes("wget") ||
-    userAgent.includes("python-requests") ||
-    userAgent.includes("node-fetch");
-  const isPngEndpoint = event.path.split("/").pop() === "logo.png";
-  // Return raw PNG when embedded via <img> tags (Accept header prefers images)
-  const accept = event.headers["accept"] || "";
-  const wantsImage = accept.startsWith("image/") || (accept.includes("image/*") && !accept.includes("text/html"));
-
-  if (isServer || isPngEndpoint || wantsImage) {
-    return {
-      statusCode: 200,
-      headers: {
-        "Content-Type": "image/png",
-        "Access-Control-Allow-Origin": "*",
-        "Cache-Control": "no-cache",
-      },
-      body: base64Logo,
-      isBase64Encoded: true,
-    };
-  } else {
-    const turnaround = turnaroundUrl();
-    const htmlResponse = `
-    <html>
-        <head>
-            <link rel="icon" href="${logo}" type="image/png">
-            <style>
-                html { height: 100%; }
-                body { 
-                    display: flex; 
-                    justify-content: center; 
-                    align-items: center; 
-                    height: 100%;
-                    background-color: ${randomPurple()};
-                    margin: 0;
-                    overflow: hidden;
-                    transition: filter 0.2s;
-                }
-                body.blurred {
-                    filter: blur(5px);
-                }
-                img { 
-                    object-fit: contain;
-                    width: 100vw;
-                    height: 100%;
-                    cursor: pointer;
-                }
-            </style>
-        </head>
-        <body>
-            <img crossorigin src="${turnaround}" onclick="updateQueryString()">
-        </body>
-        <script>
-            const strippedUrl = window.location.origin + window.location.pathname;
-            window.history.replaceState({}, document.title, strippedUrl);
-            function updateQueryString() {
-              document.body.classList.add('blurred');
-              const currentLogoId = '${turnaround}';
-              const newURL = strippedUrl + '?previousLogo=' + encodeURIComponent(currentLogoId);
-              setTimeout(() => { window.location = newURL; }, 200);
-            }
-        </script>
-    </html>
-`;
-
-    return {
-      statusCode: 200,
-      headers: {
-        "Content-Type": "text/html",
-      },
-      body: htmlResponse,
-    };
-  }
-}
-
-const randomPurple = () => {
-  const r = Math.floor(Math.random() * 50 + 50); // Values between 200 and 255
-  const g = Math.floor(Math.random() * 25); // Values between 0 and 50
-  const b = Math.floor(Math.random() * 50 + 50); // Values between 200 and 255
-  return `rgb(${r},${g},${b})`;
-};
+
+  // ── named assets → CDN ──────────────────────────────────────────────
+  const named = assetPath.match(/^pals-([a-z0-9-]+)\.(png|webp|apng|mp4)$/);
+  if (named) {
+    const [, slug, format] = named;
+    const url = format === "png" ? logoUrl(slug) : turnaroundUrl(slug, format);
+    return url ? redirect(url) : respond(404, { error: "Pal not found." });
+  }
+
+  // ── random animated (turnaround / auth0 are legacy aliases) ─────────
+  const random = assetPath.match(/^(?:random|turnaround|auth0)\.(webp|apng|mp4|json)$/);
+  if (random) {
+    const format = random[1];
+    if (format === "json") {
+      const pal = randomPal({ previous });
+      return { statusCode: 200, headers: { "Content-Type": "application/json", ...CORS, ...NO_CACHE }, body: JSON.stringify(pal) };
+    }
+    const url = turnaroundUrl(null, format);
+    if (!url) return respond(404, { error: "No turnarounds published." });
+    return format === "mp4" ? redirect(url) : proxy(url, format);
+  }
+
+  // ── random still bytes (legacy /logo.png) ───────────────────────────
+  if (assetPath === "logo.png" || assetPath === "random.png" || assetPath === "still.png") {
+    return proxy(randomPal({ previous, animated: false }).url, "png");
+  }
+
+  // ── bare endpoint: 50/50 still or animated, fresh each hit ──────────
+  const pal = randomPal({ previous });
+  const userAgent = event.headers["user-agent"] || "";
+  const accept = event.headers["accept"] || "";
+  const isServer = /curl|wget|python-requests|node-fetch/i.test(userAgent);
+  const wantsImage = accept.startsWith("image/") || (accept.includes("image/*") && !accept.includes("text/html"));
+
+  if (isServer || wantsImage) return proxy(pal.url, pal.format);
+
+  const htmlResponse = `<!doctype html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>pals · ${pal.slug}${pal.animated ? " ↻" : ""}</title>
+    <link rel="icon" href="${logoUrl(pal.slug) || pal.url}" type="image/png">
+    <style>
+      html { height: 100%; }
+      body {
+        display: flex; justify-content: center; align-items: center;
+        height: 100%; margin: 0; overflow: hidden;
+        background-color: ${randomPurple()};
+        transition: filter 0.2s;
+      }
+      body.blurred { filter: blur(5px); }
+      img { object-fit: contain; width: 100vw; height: 100%; cursor: pointer; }
+    </style>
+  </head>
+  <body>
+    <img crossorigin src="${pal.url}" alt="pals ${pal.slug}" onclick="next()">
+    <script>
+      const strippedUrl = window.location.origin + window.location.pathname;
+      window.history.replaceState({}, document.title, strippedUrl);
+      function next() {
+        document.body.classList.add("blurred");
+        const newURL = strippedUrl + "?previousLogo=" + encodeURIComponent(${JSON.stringify(pal.url)});
+        setTimeout(() => { window.location = newURL; }, 200);
+      }
+    </script>
+  </body>
+</html>
+`;
+  return { statusCode: 200, headers: { "Content-Type": "text/html", ...NO_CACHE }, body: htmlResponse };
+}
+
+const randomPurple = () => {
+  const r = Math.floor(Math.random() * 50 + 50);
+  const g = Math.floor(Math.random() * 25);
+  const b = Math.floor(Math.random() * 50 + 50);
+  return `rgb(${r},${g},${b})`;
+};
-- 
2.51.2