@devinilabs/reelstack 1.2.0

package/families/dark/presets/claudedispatch.ts

@@ -0,0 +1,46 @@
+/**
+ * Preset: claudedispatch (Dark Cinematic)
+ * Source: ClaudeDispatchReel.tsx
+ *
+ * Hero-narrative reel with dark forest green card surfaces (#1a2e1f) for
+ * embedded UI screenshots. The family's strongest card stack treatment.
+ */
+export const preset = {
+  name: "claudedispatch",
+  family: "dark",
+  source: "ClaudeDispatchReel",
+  durationFrames: 2220,
+  fps: 30,
+  copy: {
+    hook: "99% of Claude users don't know this exists.",
+    sub: "AI as your dispatching system.",
+    cta: "Setup link below.",
+  },
+  accents: {
+    cardForest: "#1a2e1f",
+    cardForestLift: "#243a28",
+    danger: "#e25822",
+    safe: "#4fc46a",
+  },
+  beats: {
+    hook: 0,
+    secret: 246,
+    dispatching: 600,
+    workflow: 990,
+    cards: 1230,
+    setup: 1560,
+    cta: 1875,
+    end: 2055,
+    final: 2220,
+  },
+  primitives: [
+    "DriftingSpotlights",
+    "RadialVignette",
+    "SegmentOpacity",
+    "Crossfade",
+    "GridBackground",
+    "ForestCard",       // preset-specific — dark green card surface
+  ],
+  notes:
+    "ForestCard surfaces (#1a2e1f bg, #243a28 lifted) are the signature element. Use them whenever a UI screenshot or terminal block needs a frame.",
+} as const;

package/families/dark/presets/codedrop.ts

@@ -0,0 +1,37 @@
+/**
+ * Preset: codedrop (Dark Cinematic)
+ * Source: CodeDropReel.tsx
+ *
+ * Short-form 37s drop reel. First 20s designed as overlay-friendly blank
+ * space (user composes screen recordings on top). Final 17s is Claude pitch
+ * + CTA.
+ */
+export const preset = {
+  name: "codedrop",
+  family: "dark",
+  source: "CodeDropReel",
+  durationFrames: 1110,
+  fps: 30,
+  copy: {
+    hook: "Claude Code just dropped.",
+    cta: "For the full tutorial, hit my YouTube.",
+  },
+  accents: {
+    safe: "#4fc46a",
+  },
+  beats: {
+    overlayWindow: 0,    // user composes screen rec here
+    clausePitch: 600,    // Claude Code pitch begins
+    feature: 750,
+    cta: 930,
+    end: 1110,
+  },
+  primitives: [
+    "DriftingSpotlights",
+    "RadialVignette",
+    "SegmentOpacity",
+    "GridBackground",
+  ],
+  notes:
+    "Frames 0–600 are intentionally minimal — buyer is expected to composite a screen recording over the top. Do not auto-fill the overlay window with motion graphics; that defeats the preset's purpose.",
+} as const;

package/families/dark/presets/gpt55.ts

@@ -0,0 +1,54 @@
+/**
+ * Preset: gpt55 (Dark Cinematic)
+ * Source: GPT55Reel.tsx
+ *
+ * Benchmark-thesis reel. OpenAI green dominant. Competitive narrative
+ * tone — uses rival purple for "Claude" beats and YouTube red for CTA.
+ */
+export const preset = {
+  name: "gpt55",
+  family: "dark",
+  source: "GPT55Reel",
+  durationFrames: 2900,
+  fps: 30,
+  copy: {
+    hook: "GPT 5.5 just dropped. It's a half-step.",
+    sub: "Stop chasing benchmarks.",
+    cta: "Full thesis on YouTube.",
+  },
+  accents: {
+    openai: "#10a37f",
+    openaiSoft: "#1ac997",
+    openaiDeep: "#0a6e55",
+    rivalPurple: "#6466f1",
+    warnAmber: "#fcbb00",
+    red: "#ff3b46",
+    youtubeRed: "#FF0033",
+  },
+  beats: {
+    hook: 0,
+    drop: 180,
+    halfStep: 420,
+    benchmarks: 600,
+    skepticism: 930,
+    rivals: 1140,
+    ship: 1320,
+    workflow: 1560,
+    payoff: 1860,
+    thesis: 2190,
+    cta: 2490,
+    end: 2715,
+    final: 2900,
+  },
+  primitives: [
+    "DriftingSpotlights",
+    "RadialVignette",
+    "SegmentOpacity",
+    "Crossfade",
+    "GridBackground",
+    "BenchmarkScreenshot", // preset-specific
+    "ForestCard",
+  ],
+  notes:
+    "Multi-brand reel: OpenAI green for GPT moments, rival purple for Claude moments, YouTube red exclusively for the CTA. Do not let any of these accents bleed into other scenes.",
+} as const;

package/families/dark/presets/notebooklm.ts

@@ -0,0 +1,50 @@
+/**
+ * Preset: notebooklm (Dark Cinematic)
+ * Source: NotebookLMReel.tsx
+ *
+ * Product-integration narrative (Claude × NotebookLM). NotebookLM blue is
+ * the dominant accent. 11 scenes synced to voiceover rhythm.
+ */
+export const preset = {
+  name: "notebooklm",
+  family: "dark",
+  source: "NotebookLMReel",
+  durationFrames: 1680,
+  fps: 30,
+  copy: {
+    hook: "Gave Claude infinite memory for zero tokens.",
+    sub: "Connect Claude to NotebookLM.",
+    cta: "Setup walkthrough below.",
+  },
+  accents: {
+    notebookBlue: "#4F7DF3",
+    gold: "#F0C23A",
+    danger: "#E8483A",
+    success: "#3CCB7F",
+  },
+  beats: {
+    hook: 0,
+    memory: 108,
+    tokens: 216,
+    integration: 396,
+    nb: 570,
+    semanticSearch: 684,
+    wrapup: 864,
+    walkthrough: 1056,
+    install: 1254,
+    config: 1428,
+    cta: 1536,
+    end: 1677,
+  },
+  primitives: [
+    "DriftingSpotlights",
+    "RadialVignette",
+    "SegmentOpacity",
+    "Crossfade",
+    "GridBackground",
+    "GlowingUnderline", // preset-specific — animated text underline
+    "FilmGrain",
+  ],
+  notes:
+    "NotebookLM blue (#4F7DF3) is the signature. Use the gold accent (#F0C23A) sparingly — only for the 'gave infinite memory' beat at frame 108.",
+} as const;

package/families/dark/presets/resourcescta.ts

@@ -0,0 +1,35 @@
+/**
+ * Preset: resourcescta (Dark Cinematic)
+ * Source: ResourcesCTAReel.tsx
+ *
+ * 7-second standalone CTA reel. Used as a footer/outro on Dark Cinematic
+ * reels. Generic "Comment AI / Like, Subscribe, check resources" copy.
+ */
+export const preset = {
+  name: "resourcescta",
+  family: "dark",
+  source: "ResourcesCTAReel",
+  durationFrames: 210,
+  fps: 30,
+  copy: {
+    hook: "Comment AI for resources.",
+    sub: "Like, subscribe.",
+  },
+  accents: {
+    claude: "#D4663A",
+  },
+  beats: {
+    hook: 0,
+    button: 60,
+    cta: 120,
+    end: 210,
+  },
+  primitives: [
+    "DriftingSpotlights",
+    "SegmentOpacity",
+    "GridBackground",
+    "CtaButton",
+  ],
+  notes:
+    "Designed to append after another Dark Cinematic reel. Frame budget is 7 seconds — keep motion floor at 3+ layers using concurrent (not sequenced) animations.",
+} as const;

package/families/dark/presets/skills.ts

@@ -0,0 +1,40 @@
+/**
+ * Preset: skills (Dark Cinematic)
+ * Source: SkillsReel.tsx
+ *
+ * Ecosystem-showcase reel. Category bento grid (UI Design, App Testing, SEO,
+ * Writing, Debugging, Deploy) + platforms (Claude Code, Codex, Desktop App,
+ * Any Editor). Lightweight motion compared to the rest of Dark Cinematic.
+ */
+export const preset = {
+  name: "skills",
+  family: "dark",
+  source: "SkillsReel",
+  durationFrames: 1260,
+  fps: 30,
+  copy: {
+    hook: "AI superpowers live in the skills, not the model.",
+    sub: "1000+ free Claude Code skills.",
+    cta: "Find one that fits below.",
+  },
+  accents: {},
+  beats: {
+    hook: 0,
+    thesis: 165,
+    categories: 330,
+    platforms: 525,
+    examples: 690,
+    install: 855,
+    cta: 1035,
+    end: 1260,
+  },
+  primitives: [
+    "DriftingSpotlights",
+    "RadialVignette",
+    "SegmentOpacity",
+    "GridBackground",
+    "BentoGrid",  // preset-specific — category × platform matrix
+  ],
+  notes:
+    "Bento grid is the signature. Each cell carries a category icon (no emojis — pull via /reelstack-icons logos:<brand>) and a platform label. Use staggered reveals with 4-frame offsets between cells.",
+} as const;

package/families/dark/presets/stitch.ts

@@ -0,0 +1,46 @@
+/**
+ * Preset: stitch (Dark Cinematic)
+ * Source: StitchReel.tsx
+ *
+ * Cross-product workflow demo. Stitch rose accent + Gemini blue + Claude
+ * terracotta in the same reel — Dark Cinematic's multi-brand allowance is
+ * on full display.
+ */
+export const preset = {
+  name: "stitch",
+  family: "dark",
+  source: "StitchReel",
+  durationFrames: 2297,
+  fps: 30,
+  copy: {
+    hook: "Stitch connects your entire Claude workflow.",
+    sub: "AI agents as you. Unlocked.",
+    cta: "Free during beta.",
+  },
+  accents: {
+    stitch: "#ff4d9b",
+    gemini: "#4285f4",
+    safe: "#4fc46a",
+  },
+  beats: {
+    hook: 0,
+    nameDrop: 249,
+    workflow: 438,
+    agents: 678,
+    unlocked: 915,
+    demo: 1320,
+    palette: 1560,
+    cta: 2025,
+    end: 2297,
+  },
+  primitives: [
+    "DriftingSpotlights",
+    "RadialVignette",
+    "SegmentOpacity",
+    "Crossfade",
+    "GridBackground",
+    "PaletteChips", // preset-specific — palette legend on screen
+  ],
+  notes:
+    "Stitch reel is the family's reference for multi-brand accent usage. Crossfades 0.45s in / 0.55s out. Palette chip legend appears in the demo scene as a credibility signal.",
+} as const;

package/families/dark/presets/stitch2.ts

@@ -0,0 +1,43 @@
+/**
+ * Preset: stitch2 (Dark Cinematic)
+ * Source: Stitch2Reel.tsx
+ *
+ * 20-second teaser variant. Letterboxed hero video (2304×1440 landscape
+ * scaled to 1080×675), title fade + lift, with safe zones at 288px top /
+ * 422px bottom offset.
+ */
+export const preset = {
+  name: "stitch2",
+  family: "dark",
+  source: "Stitch2Reel",
+  durationFrames: 600,
+  fps: 30,
+  copy: {
+    hook: "Stitch.",
+    sub: "Workflow agents. Beta open.",
+  },
+  accents: {
+    stitch: "#ff4d9b",
+  },
+  beats: {
+    clipIn: 0,
+    titleIn: 90,
+    titleLift: 360,
+    cta: 510,
+    end: 600,
+  },
+  primitives: [
+    "DriftingSpotlights",
+    "RadialVignette",
+    "SegmentOpacity",
+    "OffthreadVideoLetterbox",
+  ],
+  embeddedClip: {
+    path: "captures/stitch/hero.mp4",
+    sequenceStart: 0,
+    durationFrames: 600,
+    aspect: "letterbox",
+  },
+  notes:
+    "Use this preset when you have a clip and need a 20s teaser without composing a full motion-graphics narrative. Title lifts from baseline at frame 360.",
+} as const;

package/families/dark/typography.ts

@@ -0,0 +1,16 @@
+/** Dark Cinematic typography scale. Geist Sans + Geist Mono only.
+ *  Pulled from existing template usage (StitchReel / CodeDropReel hero 84);
+ *  locks the implicit scale into named tokens. Text colors come from palette
+ *  (fg / fgSoft / fgMuted) — never embed colors in typography tokens.
+ */
+export const typography = {
+  hero: { fontSize: 96, fontWeight: 700, letterSpacing: -2, lineHeight: 1.05, fontFamily: "Geist, system-ui" },
+  h1:   { fontSize: 84, fontWeight: 700, letterSpacing: -1.5, lineHeight: 1.1, fontFamily: "Geist, system-ui" },
+  h2:   { fontSize: 56, fontWeight: 700, letterSpacing: -1.5, lineHeight: 1.15, fontFamily: "Geist, system-ui" },
+  h3:   { fontSize: 36, fontWeight: 600, letterSpacing: -1, lineHeight: 1.2, fontFamily: "Geist, system-ui" },
+  body: { fontSize: 24, fontWeight: 500, letterSpacing: -0.2, lineHeight: 1.5, fontFamily: "Geist, system-ui" },
+  caption: { fontSize: 18, fontWeight: 500, letterSpacing: 0.5, lineHeight: 1.4, fontFamily: "Geist, system-ui", textTransform: "uppercase" as const },
+  mono: { fontSize: 22, fontWeight: 500, letterSpacing: 0.3, lineHeight: 1.4, fontFamily: "Geist Mono, monospace" },
+  counter: { fontSize: 144, fontWeight: 700, letterSpacing: -2, lineHeight: 1, fontFamily: "Geist Mono, monospace" },
+} as const;
+export type Typography = typeof typography;

package/families/forbidden/components/ForbiddenCausticBlobs.tsx

@@ -0,0 +1,52 @@
+import React from "react";
+import { AbsoluteFill, useCurrentFrame } from "remotion";
+import { palette, gradients } from "../palette";
+
+/**
+ * ForbiddenCausticBlobs — animated radial gradients drifting on sine paths.
+ *
+ * Forbidden's signature background motion. Same shape as Glass's CausticBlobs
+ * but with two key differences:
+ *   1. Stops are ember/crimson/ultraviolet/plasma (NEVER gold — gold belongs
+ *      to Glass).
+ *   2. mixBlendMode is `multiply` (not `screen`) so the blobs darken the
+ *      cream-rose paper into deeper rose tones instead of brightening it.
+ *
+ * Frame-budget: cheap. 4 absolutely-positioned divs with CSS gradients only.
+ */
+export const ForbiddenCausticBlobs: React.FC<{
+  intensity?: number; // 0..1 — overall opacity multiplier
+  reduceMotion?: boolean;
+}> = ({ intensity = 1, reduceMotion = false }) => {
+  const frame = useCurrentFrame();
+  const blobs = [
+    { gradient: gradients.causticEmber,       speedX: 0.0040, speedY: 0.0030, size: 1100 },
+    { gradient: gradients.causticCrimson,     speedX: 0.0033, speedY: 0.0042, size: 1100 },
+    { gradient: gradients.causticUltraviolet, speedX: 0.0027, speedY: 0.0035, size: 1100 },
+    { gradient: gradients.causticPlasma,      speedX: 0.0046, speedY: 0.0024, size: 1100 },
+  ];
+  return (
+    <AbsoluteFill style={{ background: palette.bg, opacity: intensity }}>
+      {blobs.map((b, i) => {
+        const cx = reduceMotion ? 0.5 : 0.5 + 0.35 * Math.sin(frame * b.speedX + i);
+        const cy = reduceMotion ? 0.5 : 0.5 + 0.30 * Math.cos(frame * b.speedY + i * 1.3);
+        return (
+          <div
+            key={i}
+            style={{
+              position: "absolute",
+              left: `${cx * 100 - 50}%`,
+              top:  `${cy * 100 - 50}%`,
+              width: b.size,
+              height: b.size,
+              background: b.gradient,
+              filter: "blur(60px)",
+              mixBlendMode: "multiply",
+              pointerEvents: "none",
+            }}
+          />
+        );
+      })}
+    </AbsoluteFill>
+  );
+};

package/families/forbidden/components/NewsprintTexture.tsx

@@ -0,0 +1,28 @@
+import React from "react";
+import { AbsoluteFill } from "remotion";
+
+/**
+ * Brutalist Swiss Industrial newsprint texture — opt-in for Forbidden reels.
+ * Pure SVG turbulence for a halftone/grain effect on cream-rose paper.
+ * Inspired by leonxlnx/taste-skill-brutalist's Swiss Industrial Print mode.
+ */
+export const NewsprintTexture: React.FC<{
+  opacity?: number;
+  reduceMotion?: boolean;
+}> = ({ opacity = 0.08, reduceMotion: _r = false }) => {
+  // Newsprint is texture-only; no motion to reduce. The reduceMotion prop is
+  // accepted for API consistency.
+  return (
+    <AbsoluteFill style={{ pointerEvents: "none", opacity, mixBlendMode: "multiply" }}>
+      <svg width="100%" height="100%">
+        <filter id="reelstack-newsprint">
+          <feTurbulence type="fractalNoise" baseFrequency="0.85" numOctaves="3" seed="2" />
+          <feColorMatrix
+            values="0 0 0 0 0.45  0 0 0 0 0.30  0 0 0 0 0.40  0 0 0 0.6 0"
+          />
+        </filter>
+        <rect width="100%" height="100%" filter="url(#reelstack-newsprint)" />
+      </svg>
+    </AbsoluteFill>
+  );
+};

package/families/forbidden/components/TintedShadow.tsx

@@ -0,0 +1,36 @@
+import React, { CSSProperties, ReactNode } from "react";
+import { palette } from "../palette";
+
+type Depth = "soft" | "mid" | "deep";
+
+/**
+ * tintedShadow — helper that returns a `{ boxShadow }` style object using the
+ * Forbidden palette's rose-purple shadow stack (rgba(120,80,120,…)).
+ *
+ * Spread it into another component's style prop to inherit the family's
+ * tinted-shadow signature without wrapping in an extra div:
+ *   <GlassCard style={{ ...tintedShadow("deep"), padding: 36 }}>...</GlassCard>
+ */
+export const tintedShadow = (depth: Depth = "mid"): CSSProperties => ({
+  boxShadow:
+    depth === "soft" ? palette.shadowSoft :
+    depth === "deep" ? palette.shadowDeep :
+                       palette.shadowMid,
+});
+
+/**
+ * TintedShadow — wrapper component that applies the matching Forbidden
+ * rose-purple shadow to its children. Use when JSX composition is cleaner
+ * than spreading the helper into an existing style prop.
+ *
+ * The Forbidden family's secret weapon: every shadow is rose-purple, never
+ * pure black. Pure-black shadows on cream-rose paper read as cheap and
+ * generic — the tinted variant reads as printed dye.
+ */
+export const TintedShadow: React.FC<{
+  depth?: Depth;
+  style?: CSSProperties;
+  children?: ReactNode;
+}> = ({ depth = "mid", style, children }) => (
+  <div style={{ ...tintedShadow(depth), ...style }}>{children}</div>
+);

package/families/forbidden/components/index.ts

@@ -0,0 +1,38 @@
+/**
+ * Forbidden — primitive components index.
+ *
+ * Forbidden inherits most primitives from Glass (they accept palette-agnostic
+ * props) and overrides only what truly differs:
+ *   - ForbiddenCausticBlobs replaces Glass's CausticBlobs (multiply blend,
+ *     ember/crimson/ultraviolet/plasma stops — never gold)
+ *   - TintedShadow + tintedShadow() add the family's rose-purple shadow stack
+ *
+ * Scaffold templates import from here:
+ *   import { CausticBlobs, GlassCard, TintedShadow, tintedShadow }
+ *     from "@devinilabs/reelstack/families/forbidden/components";
+ *
+ * `CausticBlobs` is aliased to ForbiddenCausticBlobs so a buyer never has to
+ * remember which family's variant they're using — it's always the right one
+ * for the family they imported from.
+ */
+
+// Forbidden-specific
+export { ForbiddenCausticBlobs } from "./ForbiddenCausticBlobs";
+export { TintedShadow, tintedShadow } from "./TintedShadow";
+
+// Inherited from Glass — these primitives are palette-agnostic.
+export {
+  HairlineGrid,
+  GlassCard,
+  EyebrowPill,
+  StaggeredWords,
+  Counter,
+  SonarRings,
+  ParticleBurst,
+  FloatingGlyphs,
+  LightBeam,
+} from "../../glass/components";
+
+// Renamed: Forbidden's caustics replace Glass's at the family-canonical name.
+export { ForbiddenCausticBlobs as CausticBlobs } from "./ForbiddenCausticBlobs";
+export { NewsprintTexture } from "./NewsprintTexture";

package/families/forbidden/index.ts

@@ -0,0 +1,17 @@
+/**
+ * Forbidden — family index.
+ */
+export { palette, safeZones, gradients } from "./palette";
+export type { ForbiddenPalette } from "./palette";
+
+import { preset as heretic } from "./presets/heretic";
+
+export const presets = {
+  heretic,
+} as const;
+
+export const family = {
+  name: "forbidden",
+  label: "Forbidden",
+  presets: Object.keys(presets) as Array<keyof typeof presets>,
+} as const;

package/families/forbidden/palette.ts

@@ -0,0 +1,88 @@
+/**
+ * ReelStack — Forbidden palette
+ *
+ * Verified against /Users/abhishekraj/my-video/src/HereticReel.tsx.
+ *
+ * Mood: forbidden, mysterious, slightly off-kilter. Desaturated palette
+ * suggests something declassified.
+ *
+ * Inherits primitives from Glass family but with rose-purple tinted shadows
+ * for the cream-rose paper background. NEVER use iridescent gold here —
+ * that hue belongs to Glass.
+ */
+export const palette = {
+  // Backgrounds — cream-rose paper
+  bg: "#F2EBE5",
+  bgWarm: "#EFE3DB",
+  bgCool: "#ECE6E8",
+
+  // Ink (slightly darker than Glass to read on rose-cream)
+  ink: "#0E0B12",      // contrast 17.6:1 on bg #F2EBE5 — WCAG AAA
+  inkSoft: "#26222A",  // contrast 13.0:1 on bg #F2EBE5 — WCAG AAA
+  inkMuted: "#5A5560", // contrast 6.8:1  on bg #F2EBE5 — WCAG AA
+  inkDim: "#8A848F",   // contrast 3.5:1  on bg #F2EBE5 — WCAG AA-Large
+
+  // Forbidden accents — desaturated, mysterious
+  ember: "#D97757",       // burning orange
+  crimson: "#C4506B",     // deep rose / refusal
+  ultraviolet: "#6B5BD9", // nightshade / mechanism
+  plasma: "#A87FE8",      // electric violet / stars
+
+  // Tinted shadows — the family's secret weapon. Never use pure black.
+  shadowSoft: "rgba(120, 80, 120, 0.10)",
+  shadowMid: "rgba(120, 80, 120, 0.18)",
+  shadowDeep: "rgba(120, 80, 120, 0.28)",
+
+  // Glass surface tokens (warmer than Glass family — rose-tinted whites)
+  glassFill: "rgba(255, 248, 245, 0.46)",
+  glassFillStrong: "rgba(255, 248, 245, 0.66)",
+  glassBorder: "rgba(255, 248, 245, 0.88)",
+
+  // Macro-window dots
+  macClose: "#FF5F57",
+  macMin: "#FEBC2E",
+  macMax: "#28C840",
+} as const;
+
+export const safeZones = {
+  top: 290,
+  bottom: 1500,
+  canvas: { width: 1080, height: 1920 },
+} as const;
+
+export const gradients = {
+  forbidden: `linear-gradient(135deg, ${palette.ember} 0%, ${palette.crimson} 33%, ${palette.ultraviolet} 66%, ${palette.plasma} 100%)`,
+  causticEmber: `radial-gradient(ellipse, ${palette.ember}55 0%, transparent 60%)`,
+  causticCrimson: `radial-gradient(ellipse, ${palette.crimson}55 0%, transparent 60%)`,
+  causticUltraviolet: `radial-gradient(ellipse, ${palette.ultraviolet}55 0%, transparent 60%)`,
+  causticPlasma: `radial-gradient(ellipse, ${palette.plasma}55 0%, transparent 60%)`,
+} as const;
+
+/**
+ * Hard-coded "allowed accents" list. The lint command checks every fill /
+ * stroke / background color in a Forbidden reel against this set. Note that
+ * ultraviolet (#6B5BD9) and plasma (#A87FE8) are family-specific overrides
+ * — they would otherwise be flagged by the AI-purple blocklist. Inside
+ * Forbidden they are allowed; nowhere else in ReelStack are they permitted.
+ */
+export const ALLOWED_ACCENTS = [
+  palette.ink,
+  palette.ember,
+  palette.crimson,
+  palette.ultraviolet,
+  palette.plasma,
+] as const;
+
+export type ForbiddenPalette = typeof palette;
+
+/** Re-export grid units so consumers can pull them from the family entrypoint. */
+export {
+  GRID,
+  GRID_2,
+  GRID_4,
+  GRID_6,
+  GRID_8,
+  GRID_12,
+  GRID_16,
+  GRID_24,
+} from "../../utils/grid";

package/families/forbidden/presets/heretic.ts

@@ -0,0 +1,44 @@
+/**
+ * Preset: heretic (Forbidden)
+ * Source: HereticReel.tsx
+ *
+ * The reference (and only) preset for the Forbidden family. Cream-rose
+ * paper background, forbidden palette stops (ember, crimson, ultraviolet,
+ * plasma). Inherits Glass primitives but with rose-purple tinted shadows.
+ */
+export const preset = {
+  name: "heretic",
+  family: "forbidden",
+  source: "HereticReel",
+  durationFrames: 1639,
+  fps: 30,
+  copy: {
+    hook: "Strip the censorship right out of any open source AI.",
+    sub: "It's called Heretic.",
+    cta: "GitHub link below.",
+  },
+  accents: {},
+  beats: {
+    hook: 0,
+    declassified: 144,
+    method: 386,
+    naming: 716,
+    refusal: 961,
+    install: 1219,
+    cta: 1500,
+    end: 1639,
+  },
+  primitives: [
+    "CausticBlobs",          // forbidden palette variant
+    "HairlineGrid",
+    "GlassCard",             // tinted shadows (rose-purple) for cream bg
+    "EyebrowPill",
+    "StaggeredWords",
+    "SonarRings",
+    "ParticleBurst",
+    "FloatingGlyphs",
+    "TintedShadow",          // preset-specific — rgba(120,80,120,…) shadow stack
+  ],
+  notes:
+    "Caustic blobs use ember/crimson/ultraviolet/plasma stops — never gold (gold belongs to Glass). Tinted shadows are the family's secret weapon: every shadow uses rose-purple tint, never pure black.",
+} as const;