DESIGN.md — Taiho Ventures, LLC

Per-style brand authority for src/styles/cinematic-dark-syndicate/. Produced and maintained by columbus-design-md-builder. Read by columbus-design-author at scaffold time and by columbus-design-iterator on every refinement. Treat sections 1–7 as canonical truth.

1. Aesthetic Anchor

Primary family: Cinematic Dark — full-bleed motion, deep warm dark surfaces, editorial typography sized for gravity. Secondary remix: Editorial Minimalism (Stripe Press / publication-grade chrome) — restraint that prevents cinematic-dark from collapsing into spectacle. Reference brands: Cullinan Oncology (in-category proof that cinematic-dark biotech can read credible) × Recursion (science-as-spectacle, AI-bio cinematic discipline) × Stripe Press dark mode (premium publication chrome — restraint, type discipline, nothing over-decorated). Visual atmosphere: Warm-dark, cinematic, type-led. The page reads like a quarterly investor letter shot for film — sepia-undertone black instead of cool tech-cyan, generous breathing room, motion confined to the hero. The science earns the drama; nothing else does.

2. Brand Voice

Adjectives: strategic, disciplined, scientifically literate, confident, dryly precise Says: "preclinical through proof of concept", "syndicate partner", "patient capital", "build-to-buy", "the science decides", "first-in-class or new biology" Avoids: "empower", "unlock", "elevate", "supercharge", "world-class", "best-in-class", "Get started", "Sign up", "Learn more", "Where science meets capital", "Empowering tomorrow's medicine", "We partner with bold founders", "with decades of experience" Sample sentences:

Taiho Pharmaceutical shipped its first cancer therapeutic in 1967. Most of the founders we back have not yet seen their first patient dose. The distance between those two facts is what we underwrite.

Pre-IND therapeutics in oncology, immunology, and urology. If your asset isn't there, neither are we.

3. Color Palette & Roles

Mode: dark Dominant: #0E0B07 (--cinematic-dark-syndicate-surface) — page background; warm sepia-undertone near-black, NOT cool cyan-black Accent: #E31B13 (--cinematic-dark-syndicate-accent) — Taiho Red, sharp punctuation only: primary CTAs, key data callouts, masthead emphasis. Single use per fold. Surfaces:

#1A1410 (--cinematic-dark-syndicate-elevated) — cards, sticky tables, secondary surfaces
#8A6E5C (--cinematic-dark-syndicate-muted) — Taiho Sepia at body weight; captions, dates, secondary copy
#2B2118 (--cinematic-dark-syndicate-rule) — hairlines, table dividers, subtle borders
#FABE00 (--cinematic-dark-syndicate-flag) — Taiho Yellow, sparingly: data highlights, syndicate co-investor flags, chart accents. Tertiary, never co-equal with red.

Notes: Warm-dark is the brand moat. Never use cool/cyan blacks (#0a0a0f, #111827, #0f172a). Red is never a gradient, never a background fill. No purple/teal/cyan gradients anywhere. Color is set in flat blocks with optional vignette/grain layered atop.

4. Typography Rules

Headline font: Newsreader (variable, optical sizes) — https://fonts.google.com/specimen/Newsreader — weights 200, 700; opsz 36+ for hero, 16–24 for subheads Body font: IBM Plex Sans — https://fonts.google.com/specimen/IBM+Plex+Sans — weights 300, 500 Data font: IBM Plex Mono — https://fonts.google.com/specimen/IBM+Plex+Mono — weights 400, 600 (portfolio tables, round sizes, dates, ticker-like data) Pairing principle: High contrast — editorial serif against technical sans, with monospace reserved exclusively for tabular data. The serif carries cinematic gravity; the sans carries biotech credibility; the mono signals "this is data, not marketing." Weight extremes: Display 200 vs 700 (thin Newsreader for kickers, bold for hero h1). Body 300 vs 500 (no 400 / 600 mush). Size scale: H1 5rem, H2 2.5rem, H3 1.5rem, body 1rem, caption 0.875rem, data 0.9375rem (mono) Max font sizes per page: 3 Banned (do not use): Inter, Roboto, Open Sans, Lato, system stacks, Space Grotesk, Fraunces, Playfair Display, Söhne-clones from variable-fonts marketplaces. No serif other than Newsreader; no sans other than IBM Plex Sans.

5. Layout & Density

Grid: 12-col with editorial pulls. Hero is full-bleed (no container). Long-form content takes 8 cols with marginalia/captions in the remaining 4. Portfolio runs as a full-width 12-col table with mono columns for data and sans for company names. Team page uses 4–5 portraits laid out in a single editorial row at desktop (revised 2026-05-07 from "4-up" to match the actual five-partner roster), with extended bios beside (not below) each portrait. The landing-page team section is a teaser of the same row with one-line pulls beneath each portrait — extended bios live on the dedicated team page only. Container max-width: 1280px (content); 1440px (portfolio table, allowing more sortable columns); full-bleed (hero, video, cinematic photo runs) Section rhythm: Cinematic-then-clinical. Hero is full-bleed dramatic; everything below it is editorial-precise with 96–128px vertical rhythm between sections on desktop, 64px on mobile. The drama sits in the hero so the rest can breathe. Min container padding: 24px (mobile), 80px (desktop) Asymmetry / overlap commitments:

Hero h1 anchors bottom-left of the video frame, not centered
Pull-quotes from case studies hang into the right margin (overflow the 8-col content gutter)
Portfolio table cells are left-aligned mono with optical kerning corrections, not center-aligned
Section kickers (small caps, sepia muted) sit above h2s in their own row, never inline

6. Atmosphere & Media

Hero treatment: Full-bleed video loop — quiet lab, clinical, or molecular b-roll. Slow motion, no rapid cuts. Bottom-anchored linear gradient (#0E0B07 alpha 0 → 0.95) covering the lower 40% of the frame for headline legibility. Vignette at 25% opacity in the corners. Atmospheric layers: 4–5% film-grain noise across the full page background (single SVG/PNG, repeated). 1px sepia hairlines (--cinematic-dark-syndicate-rule) under section kickers and between portfolio table rows. Hero has the vignette; content sections have the grain only. Shadow style: Dramatic but warm — soft drop shadows on cards and lifted imagery: 40px blur, 25% opacity, sepia-tinted (rgba(43, 33, 24, 0.5)), never pure black. Cards lift off the surface; they don't float. Media stance: mixed-media — video-led for the hero and any major case-study openers; editorial-photography for team portraits, secondary case-study imagery, and portfolio company hero shots. No 3D renders. No stock biotech sci-fi. Stance reasoning: Cinematic Dark lives or dies on the hero motion — without it, the warm-dark surface looks like a marketing-page color choice instead of a deliberate stance. Editorial photography for everything else keeps the credibility (real labs, real people) without the spectacle pulling attention from data.

7. Do's and Don'ts

Do:

Earn the dark — every dark surface needs purpose: vignette, grain, content density, or atmospheric weight. Empty dark reads as lazy, not cinematic.
Use Taiho Red as punctuation only — one CTA per fold, never as gradient, never as a background fill, never as a hover state on a non-CTA element.
Lean into the 千 communication mark and the classical Roman caps TAIHO wordmark. They're the brand's secret moat — no peer biotech VC has them.
Write copy like a Bloomberg Businessweek long-read: confident, specific, no marketing posture. Real co-investors named, real round sizes shown, real trial-stage data quoted.
Make portfolio tables genuinely scannable — sortable by stage, modality, therapeutic area, co-investor. The data is the point; type-only treatment of it would waste the table.
Treat portfolio companies as structured entries (area, stage, status, round, co-investors) rather than logo grids. Render the data, not the marks.

Don't:

Use Inter, Roboto, Open Sans, Lato, system stacks, Space Grotesk, Fraunces, or Playfair Display
Use cool/cyan dark backgrounds (#0a0a0f, #111827, #0f172a) — the sepia undertone IS the brand
Use neon, cyberpunk, or purple-teal-gradient cinematic-dark — the AI default everyone reaches for
Use 3D-rendered DNA helices, generic molecule animations, particle systems, or stock biotech sci-fi imagery
Use frosted glass cards, glass blur stacks, neumorphism, or any depth effect that isn't a clean drop shadow
Use parallax, scroll-jacking, fade-in-on-scroll cascades, or text reveals — cinematic ≠ effects-heavy. Motion lives in the hero only.
Use the three-up icon-card feature grid for the value prop — replace with a single editorial mandate statement above the fold
Use a generic "Contact Us" email link — the brief explicitly bans this. Use a structured intake that routes by stage / TA / modality / partnership relevance
Write "Where science meets capital", "Empowering tomorrow's medicine", "We partner with bold founders", "Building the future of biotech", or any heritage-bragging like "with decades of experience"
Write CTAs like "Get started", "Sign up", "Learn more" — use first-person specifics: "Submit your asset", "Open the portfolio", "Begin an outreach"

8. Agent Prompt Guide

For any agent reading this file:

Read this DESIGN.md in full before writing any code, copy, or styling for cinematic-dark-syndicate.
Treat sections 1–7 as canonical truth. Don't override them inline.
Reject any change that violates the Don'ts in section 7. Surface the conflict to the user rather than silently picking one side. The most common silent violations: switching to a cool dark background, adding a second CTA in red on the same fold, reaching for a 3D molecule render, writing "Get started"-class CTAs.
If the user is asking for something this DESIGN.md doesn't cover, propose an addition to this file rather than introducing the decision in component code.
If the user is asking to change something in this file, route the request to columbus-design-md-builder rather than editing the file inline.
When sections conflict: section 7 (Don'ts) wins over everything; section 1 (Anchor) wins over sections 3–6; section 2 (Voice) is independent.

9. Notes & References

Created: 2026-04-29 Last updated: 2026-05-14 Source URL: n/a (brand identity composed from internal materials, not extracted from a live site) External references:

Newsreader specimen: https://fonts.google.com/specimen/Newsreader
IBM Plex Sans specimen: https://fonts.google.com/specimen/IBM+Plex+Sans
IBM Plex Mono specimen: https://fonts.google.com/specimen/IBM+Plex+Mono
Cullinan Oncology — https://www.cullinanoncology.com (in-category cinematic-dark biotech, also a Taiho portfolio company)
Recursion — https://www.recursion.com (AI-bio science-as-spectacle reference)
Stripe Press dark mode — https://press.stripe.com (premium publication chrome reference)
Source materials: research/Taiho-ventures-basic-branding-v0.pdf (Taiho corporate identity guide — sepia/red/yellow palette, 千 mark, Roman caps wordmark), research/TOI2601_TVL Site Brief_v3.docx (site brief — audience, mandate, references), research/legacy-web-copy/ (existing site copy for tone delta)

Additions log:

2026-04-29: Initial DESIGN.md captured by columbus-design-md-builder. Direction selected: Cinematic Dark over the category default (Editorial Minimalism), Data-Dense Pro, and Japanese Editorial × Pharma Heritage alternates.
2026-05-07: §5 grid rule revised from "4-up portraits" to "4–5 portraits" to match the actual Taiho Ventures roster (five partners on the live site). Landing-page team section clarified as a teaser variant of the dedicated /team page layout.
2026-05-14: Case-study and Cullinan-narrative content scrubbed. §2 voice sample replaced (legacy Cullinan Pearl re-acquisition sentence was a fabricated TVL claim) with a grounded 1967 / first-patient-dose anecdote-then-thesis. §7 portfolio "case studies with structure" guidance reframed without the four fabricated narrative framings (Cullinan Pearl build-to-buy, Arcus Asia-rights, Orna platform-validation, Harpoon risk-share). §7 CTA example "Read the Cullinan case study" replaced with "Begin an outreach". §9 Cullinan reference URL note dropped "/ case study". The legacy site has no case-studies surface; TVL's verifiable portfolio relationship with Cullinan Oncology is preserved.