DESIGN.md — Taiho Ventures (Capital Terminal concept)

Per-style brand authority for src/styles/terminal-core-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: Terminal-Core — financial-workstation surface; monospace + neo-grotesque set tight; data is the first-class visual. Secondary remix: Data-Dense Pro — cell-borders, filter chips, tabular density borrowed from analyst tooling. Reference brands: Bloomberg Terminal (chrome, status flags, tabular density) × PitchBook (deal-memo information architecture, syndicate views) × ClickHouse (cool-slate dev-doc surface, monospace as primary type) × Reuters Eikon (ticker rails, sparklines, KPI strips). Visual atmosphere: Cool, dark, dense. The page reads as a workstation, not a marketing site — every screen has the texture of a watchlist or a deal memo. Type is set tight, color is restrained, and the data does the talking. The PhD analyst should feel that this site was built for them to do diligence in, not pitched at them.

2. Brand Voice

Adjectives: analytical, terse, fluent, disciplined, plainspoken Says: "Phase 2 readout 2027", "Lead: ARCH; co-investors: GV, MPM", "Build-to-buy; re-acquired 2024", "Mandate: preclinical → POC, oncology / immunology / urology" Avoids: "empower", "unlock", "elevate", "transform", "world-class", "best-in-class", "seamless", "robust", "next-generation", "Get started", "Learn more", "Sign up", "We believe…", any sentence that opens with "At Taiho Ventures, we…" Sample sentences:

Taiho Ventures invests at preclinical through proof of concept in oncology, immunology, and urology. The fund has $400M under management, deploys alongside top-tier institutional life-science syndicates, and offers strategic access to Asian markets through Taiho Pharmaceutical.

3. Color Palette & Roles

Mode: dark — committed; no light theme. Dominant: #0B0E14 (--tcs-ground) — page background; deep cool slate, near-black with a blue cast. Accent: #E31B13 (--tcs-flag) — Taiho Red. Used only for clinical-phase indicators and ticker-style status flags. Not for links, not for hover, not for decoration. Surfaces:

#11151D (--tcs-panel) — data panel / card background, one step lighter than ground
#1A1F2A (--tcs-panel-alt) — alternating row banding in tables
#232936 (--tcs-rule) — cell borders, panel borders, hairlines
#3A4150 (--tcs-muted) — secondary type, table headers, axis labels
#C8CDD6 (--tcs-text) — primary text on dark surface
#F5F7FA (--tcs-text-bright) — emphasis numerals, headlines
#FABE00 (--tcs-kpi) — Taiho Yellow. KPI accent — round size, exit outcome, AUM headline numerals. Used sparingly; reserve for the figure that matters most on a screen.

Status palette (for delta indicators, sparkline up/down, chart series):

#4ADE80 (--tcs-up) — desaturated terminal green; positive delta, IPO outcome
#F87171 (--tcs-down) — desaturated terminal red; negative delta, discontinued
#60A5FA (--tcs-info) — chart series 1, neutral data emphasis
Phase indicators step through Taiho Red intensities (#E31B13 Phase 3, #B8160F Phase 2, #7A0E0A Phase 1, #3A4150 preclinical) so phase reads as ramp, not categorical color.

Notes: No gradients. Color is set in flat blocks. Taiho Sepia is intentionally absent from chrome — it belongs to the parent corporate mark, not the workstation. The lockup may render the mark in its original three-color form, but no Sepia leaks into UI.

4. Typography Rules

Headline / display font: IBM Plex Sans — https://fonts.google.com/specimen/IBM+Plex+Sans — weights 400, 600, 700. Set tight (-0.01em to -0.02em tracking on display sizes), low x-height feel achieved through tight leading. Body / data font: IBM Plex Mono — https://fonts.google.com/specimen/IBM+Plex+Mono — weights 400, 500, 700. Used for all tabular data, filter chips, status flags, KPI numerals, ticker rails, code-like UI affordances. Pairing principle: High-contrast — neo-grotesque sans against monospace. Same designer family (Bold Monday's Plex), so they sit naturally together; the contrast is in role, not in origin. Sans for prose, mono for data — no exceptions. Weight extremes: 400 (body, data) vs 700 (display, KPI numerals). 600 reserved for table headers and section labels. No 500 in display. No italics anywhere — mono italic reads as code; sans italic reads as marketing. Size scale:

H1: 3.5rem (Plex Sans 700, tight)
H2: 2rem (Plex Sans 700)
H3: 1.25rem (Plex Sans 600)
Section label (uppercased, tracked +0.08em): 0.75rem (Plex Mono 500)
Body: 1rem (Plex Sans 400)
Data / table cell: 0.875rem (Plex Mono 400)
KPI numeral (hero figures): 4.5rem (Plex Mono 700, tabular figures)
Caption / metadata: 0.75rem (Plex Mono 400)

Max font sizes per page: 3 (display + body + data; everything else nests inside those three). Banned (do not use): Inter, Roboto, Open Sans, Lato, Space Grotesk, Manrope, Geist, system stacks, any humanist sans, any rounded sans, any serif (Plex Serif included — this concept has no serif voice).

5. Layout & Density

Grid: 12-column workstation grid with explicit cell borders. Panels are first-class — every screen reads as 2–4 panels stitched on a hairline grid (left rail / main / right rail at desktop; stacked at mobile). The data panel is the unit of composition, not the section. Container max-width: 1440px on desktop. The site uses near-full viewport width by default — terminals don't have generous side gutters. Section rhythm: consistent and dense. No "breathing" sections of large white space — the brand promise is density. Where airiness is needed, it's inside a panel via padding, not between panels via margin. Min container padding: 16px (mobile), 24px (desktop). Tighter than the columbus-design house norm — terminals don't waste viewport. Asymmetry / overlap commitments:

Top-of-screen ticker rail is full-bleed and runs edge-to-edge — never indented.
Filter chip rail is sticky on portfolio / case-study screens and sits flush with the panel edge.
KPI strips break the grid — they span full width above panels, separated by hairlines.
Footnotes and source citations live in the right rail, monospace, smaller, in --tcs-muted — like a Bloomberg help line.

6. Atmosphere & Media

Hero treatment: Committed solid --tcs-ground (#0B0E14). Above the fold the visual interest comes from a live-feeling KPI strip (AUM, # portfolio companies, # IPOs/M&A, current syndicate count), a ticker rail of clinical-phase status, and a dense mandate panel. No hero photo, no abstract DNA strand, no molecule render. Atmospheric layers:

1px --tcs-rule hairlines between every panel and around the page perimeter
Sparklines next to every portfolio row (12-month round-cadence trail or pipeline progress)
Subtle --tcs-panel-alt row banding on tables, not stripes
Optional faint dot-grid (0.5px --tcs-rule at 24px pitch) inside chart panels — terminal scope graticule, not background decoration
A blinking 4px square in --tcs-up next to "live" data (last-updated timestamps) — terminal heartbeat

Shadow style: None. Depth comes from hairline borders and surface-color steps, not elevation. A drop shadow on this concept would read as Material Design and break the workstation metaphor. Media stance: type-only (data-as-decoration variant) Stance reasoning: The Terminal-Core anchor rejects photography. What the analyst wants to see is the data, presented as data — the sparklines, ticker rails, KPI strips, and dense panels are themselves the visual. A hero portrait of a researcher would actively undermine the credibility this concept is built to earn.

7. Do's and Don'ts

Do:

Render every portfolio screen as a watchlist: rows, columns, sortable headers, sparklines, filter chips at the top.
Render every case study as a deal memo: header strip with deal terms, sectioned narrative in monospace-feeling rhythm, citations in the right rail.
Use Taiho Red only for clinical-phase indicators and ticker-style status flags. Reserving it makes the ramp meaningful.
Use Taiho Yellow only for the most-important KPI on a screen (AUM headline; primary outcome figure). Reserving it makes the figure pop.
Show data density as a feature: 20-row tables are good, not bad. The PhD analyst is not overwhelmed by a long table; they are reassured by it.
Set monospace tabular figures for every numeral that participates in a comparison.
Treat the mandate as filterable structured data (therapeutic area · stage · modality · geography), not as prose paragraphs.

Don't:

Use Inter, Roboto, Space Grotesk, Manrope, or any system stack.
Use any photography — no team headshots-as-hero, no abstract DNA, no molecule renders, no laboratory glassware, no globe-with-network-lines, no scientist-at-microscope.
Use gradients of any kind. Backgrounds are flat slate.
Use drop shadows or elevation. Depth is hairlines and surface steps.
Use sentence-case page titles like "Our Portfolio" or "Meet the Team" — use mono uppercase labels ("PORTFOLIO", "TEAM").
Use rounded corners > 2px on panels, cards, or chips. The workstation has hard corners.
Use Taiho Red as a generic accent (link color, hover state, button background). It belongs to clinical-phase status only.
Use Taiho Yellow as decoration. It belongs to the headline figure only.
Use Taiho Sepia anywhere in chrome. It lives only inside the parent corporate mark.
Write CTAs like "Get in touch", "Learn more", "Get started" — use specific routing CTAs that match the brief's structured-intake mandate ("Submit a deck for review", "Pitch a syndicate", "Open the portfolio").
Write hero headlines like "Investing in the future of biotech" — write structured first-line copy that states the mandate as data ("Early-stage therapeutics · Oncology · Immunology · Urology · $400M AUM · 10 years").
Use the three-up icon-card feature grid for differentiators. Render them as a tabular comparison panel instead.
Use a hamburger nav on mobile — use a sticky mono nav strip with a shortlist of routes.

8. Agent Prompt Guide

For any agent reading this file:

Read this DESIGN.md in full before writing any code, copy, or styling for terminal-core-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 likely violations to watch for: a stray hero photo, a gradient sneaking into a panel, Taiho Red used as a link color, a humanist sans replacing Plex Mono in a "readability" pass.
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 (e.g., "make it light mode", "swap to JetBrains Mono", "add photography"), 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.
The brand book commits to three corporate colors (Taiho Sepia, Taiho Red, Taiho Yellow). This concept deliberately uses only two of the three (Red, Yellow), reserves each to a single semantic role, and excludes Sepia from chrome on purpose. Do not "rebalance" the palette by reintroducing Sepia or by spreading Red/Yellow into general UI accent roles.

9. Notes & References

Created: 2026-04-29 Last updated: 2026-04-29 Source URL: n/a (concept exploration; brand inputs from research/Taiho-ventures-basic-branding-v0.pdf and research/TOI2601_TVL Site Brief_v4.docx) External references:

Site brief (v4): research/TOI2601_TVL Site Brief_v4.docx — primary audience, mandatories, case studies, reference brands
Brand book: research/Taiho-ventures-basic-branding-v0.pdf — Taiho Sepia / Red / Yellow specs, mark variants
Strategic UX references named in the brief: SR One, MPM BioImpact, GV (life sciences), 5AM Ventures, Third Rock — used as baselines, not as visual targets
Aesthetic references named by the user: Bloomberg Terminal, PitchBook, ClickHouse, Reuters Eikon
IBM Plex Sans: https://fonts.google.com/specimen/IBM+Plex+Sans
IBM Plex Mono: https://fonts.google.com/specimen/IBM+Plex+Mono

Additions log:

2026-04-29: Initial DESIGN.md captured by columbus-design-md-builder. Concept anchor: "The Capital Terminal" — a financial-workstation interpretation of Taiho Ventures aimed at the PhD/MD analyst doing syndicate-partner diligence.

Landing

Open detail →

desktop 1440×900

11-terminal-core-syndicate/landing

mobile 390×706

9:41

11-terminal-core-syndicate

Open →