Tokens, primitives, composites, and whole surfaces for every Fat Tailed Solutions product — one vocabulary for humans and agents, light and dark from a single source, quality checked by script.
npx shadcn@latest add @fts/theme @fts/utils @fts/rulesAn OKLCH token system derived from the FTS mark — semantic aliases over primitive ramps, so components never name a color, and both themes fall out of one file.
Body text is quiet and unhurried. Emphasis comes from weight and ink, not color.
The vocabulary — boring on purpose. Radix underneath wherever behavior is hard; FTS tokens and one focus-ring language throughout.
Visible to the whole desk.
Must be a negative percentage.
| Scenario | P&L |
|---|---|
| −3σ equity gap | +$8.4M |
| Vol crush | −$0.6M |
The money layer: recurring combinations with the opinions baked in, so nobody re-decides them per app. This is where coherence is actually enforced.
Convexity-first hedging program, 85bps annual premium budget.
A falling drawdown is good news — the type system lets you say so.
| Instrument | Notional | Convexity | Status |
|---|---|---|---|
SPX 3600P DEC26 Left-tail hedge · S&P 500 | $4.2M | 0.94 | Active |
CL 55P JUN27 Convex overlay · crude | $1.8M | 0.81 | Rolling |
VIX 40C MAR27 Vol spike convexity | $950K | 0.77 | Review |
EEM 28P SEP26 EM drawdown protection | $640K | 0.52 | Breached |
No scenarios yet
Run a backtest and its scenario grid will appear here.
Press ⌘K anywhere on this page — the menu that opens is this component, navigating this page.
npx shadcn@latest add @fts/command-menuWhole surfaces, assembled from the layers below — install one, own the code, wire your data. Each frame here is the real component running live.
Every open hedge across the program.
| Instrument | Notional | Convexity | Status |
|---|---|---|---|
SPX 3600P DEC26 Left-tail hedge · S&P 500 | $4.2M | 0.94 | Active |
CL 55P JUN27 Convex overlay · crude | $1.8M | 0.81 | Rolling |
VIX 40C MAR27 Vol spike convexity | $950K | 0.77 | Review |
EEM 28P SEP26 EM drawdown protection | $640K | 0.52 | Breached |
As of 06:30 ET.
Fills and rolls, latest first.
Applies to everyone on tail-fund-2.
When the desk gets paged.
Page on any limit breach.
Morning summary at 06:30 ET.
Who gets the second page.
Left-tail hedge on S&P 500, December 2026 expiry.
Welcome back. Enter your details to continue.
No account? Ask your desk lead.
The page you’re looking for doesn’t exist or has moved. Check the address, or head back.
Every installable item, straight from registry.json — the manifest and this page can't drift apart.
@fts/themeThe token source of truth: OKLCH color system (light + dark), elevation, motion, radius, and the Tailwind v4 @theme mapping. Import once; everything else references it.
@fts/rulesThe design constitution as an installable file. Reference it from CLAUDE.md / AGENTS.md so every human and agent session builds to the same rules.
@fts/utilsClass-name merge helper (clsx + tailwind-merge).
@fts/formatNumbers, currency, percentages, deltas, dates, relative time, and bytes — formatted one way, everywhere. Intl-based, zero dependencies.
@fts/use-breakpointSSR-safe media-query hook keyed to the Tailwind breakpoints.
@fts/use-mountedTrue after first client render; avoids hydration mismatches.
@fts/use-hotkeyGlobal keyboard shortcut binding ("mod+k"). Ignores plain keys while typing; mod-combos always fire.
@fts/spinnerIndeterminate activity indicator for in-place work. Page and section loads should use Skeleton instead.
@fts/buttonThe action primitive: five variants, five sizes, asChild slot, and a width-stable loading state.
@fts/inputText input with focus ring, token styling, and aria-invalid error styling. Wrap in Field for label + error wiring.
@fts/textareaMulti-line input that grows with content, capped at a sane height.
@fts/labelAccessible form label (Radix).
@fts/checkboxCheckbox with checked and indeterminate states (Radix).
@fts/radio-groupPick one of a few visible options (Radix). More than five options wants a Select.
@fts/switchOn/off toggle for settings that apply immediately (Radix).
@fts/selectDropdown selection styled like Input, with groups, labels, and keyboard support (Radix).
@fts/tabsUnderline-style tabs — the one tab treatment used everywhere (Radix).
@fts/badgeSmall label token with the full semantic tone set (brand, neutral, success, warning, danger, info) and an optional dot.
@fts/cardSurface container with Header/Title/Description/Content/Footer.
@fts/separatorHairline divider (Radix).
@fts/kbdKeyboard shortcut hint.
@fts/skeletonLoading placeholder; respects reduced motion.
@fts/avatarImage avatar with automatic initials fallback. One style, three sizes (Radix).
@fts/progressDeterminate progress bar. Unknown durations want a Spinner (Radix).
@fts/alertInline callout with semantic tones and correct live-region roles: info/success announce, warning/danger interrupt.
@fts/tablePlain table primitives — the single source of the FTS table look. DataTable builds on these.
@fts/breadcrumbWhere-am-I trail; the last item is the current page.
@fts/tooltipInverted-surface tooltip for labeling icon-only controls. Never hides essential information (Radix).
@fts/popoverAnchored floating panel for filters, pickers, and small forms (Radix).
@fts/dropdown-menuAction menu with checkbox/radio items, submenus, shortcuts, and a danger treatment for destructive items (Radix).
@fts/dialogModal dialog with scrim, pop-in motion, and scroll containment (Radix).
@fts/alert-dialogInterruptive confirmation: no X, no outside-click dismiss — the user must choose. Prefer the ConfirmDialog composite (Radix).
@fts/sheetEdge-anchored drawer for nav, filters, and side detail. Four sides, slide motion (Radix Dialog).
@fts/toasttoast() function + Toaster viewport. At most three on screen, calm durations, swipe to dismiss, action support (Radix).
@fts/theme-providerLight/dark/system theme context with a pre-hydration ThemeScript (no flash), cross-tab sync, and OS following. No dependencies.
@fts/theme-toggleLight/dark switch button. Requires ThemeProvider.
@fts/fieldLabelled form row that wires id, aria-describedby, and aria-invalid onto its child control automatically.
@fts/status-pillThe one way status is shown: dot + semantic tone, decided once for every FTS app.
@fts/metric-cardKPI panel with value and delta. Direction moves the arrow, sentiment picks the color — a falling drawdown can be good news. Compose in MetricStrip.
@fts/page-headerTitle + description + actions header. Enforces the FTS opening rhythm.
@fts/empty-stateCentered zero/empty state with icon, copy that says what will appear, and an optional action.
@fts/search-inputInput with a leading search glyph and optional shortcut hint.
@fts/data-tablePresentational table with built-in loading / error / empty states and keyboard-operable rows. Built on the Table primitives; never fetches.
@fts/toolbarRow of controls above content, with Spacer and Separator helpers.
@fts/description-listKey–value detail rows for entity attributes and metadata; responsive term/detail layout.
@fts/paginationNumbered pagination with previous/next; collapses to ellipses past seven pages. You own the page state.
@fts/copy-buttonCopy-to-clipboard with visible check confirmation, announced to screen readers.
@fts/confirm-dialogThe one way consequential actions are confirmed: destructive tone, async progress, and typed confirmation for irreversible operations.
@fts/command-menu⌘K command menu (cmdk): every important action reachable from the keyboard. Data-driven groups with icons and shortcut hints.
@fts/app-shellTwo-column app layout: sidebar with sectioned nav and badges, sticky topbar, and a mobile drawer so navigation never disappears on small screens.
@fts/search-results-viewFlagship surface: search bar, optional filter row, KPI strip, and a results table with relevance bars and status pills.
@fts/auth-pageCentered sign-in surface with error and pending states wired: Card + Field + Input + Button.
@fts/dashboard-pageOverview surface: header, KPI strip, and a section grid (DashboardSection) for tables, lists, and activity.
@fts/settings-pageSettings surface: narrow column, left-rail section titles, one control per row (SettingsSection + SettingsRow).
@fts/detail-pageSingle-entity surface: breadcrumbs, identity header with status, key facts, and tabbed detail.
@fts/error-pageFull-page 404/500 that leads with the way out: retry, go home, or reach support. Never a dead end.