The Cognition
System.

The mark is the cognition orb reduced to its essence — the sphere’s silhouette and the mind at its center. It holds at 16px as the favicon and scales to architecture. Pair it with the Verlag wordmark for the primary lockup; either stands alone.

Mark

A 2px teal ring with a solid teal node at center — the orb, reduced. Ring-to-node ratio ≈ 13 : 4 (from the 32px favicon). On dark the field is ink (#0B0E13); on light the ring and node hold teal on paper.

Wordmark

CANYON OAKS set in Verlag, weight 500, uppercase, tracked +0.14em. Never condensed, never italic, never a different face.

Clear space

Keep at least one ring-diameter of clear space on every side. Minimum mark size 16px; minimum lockup width ≈ 120px.

Don’t

Don’t recolor outside the palette, add shadow or gradient, stretch, rotate, box, or fill the ring. The node is always solid; the ring is always open.

Cognition teal is the resolved brand accent — the brief Indigo experiment was reversed and teal made permanent. Neutrals are cool; hue is used sparingly and only where it carries meaning.

Eyebrows always take the // prefix in IBM Plex Mono, letter-spaced and uppercase. Display and headings use Verlag at 500; body at 300 (Outfit is the web fallback). Mono carries every label, metric, and instrument readout. Numbered markers (01 / 02) are used only where content is a real sequence — as with these section indices.

Every ecosystem node renders one of eight motions in its vitrine and dossier — built only from real data, never fabricated numbers, always on the palette.

Color and links are not hardcoded. The Back Office Landing · Appearance tab writes two rows in Supabase settings; the public landing reads them on load and applies accent, link color, mode, orb color, and signal colors — no redeploy.

copy{
  "accent":  "#4FE0E8",   // --acc + orb structure
  "accent2": "#8FECF0",   // glow
  "link":    "#4FE0E8",   // --link (falls back to accent)
  "mode":    "dark",      // "dark" | "light"
  "name":    "Cognition",
  "signals": ["#4FE0E8", "#5BD0FF", "#3FCB7E"] // orb pulses; null = follow accent
}

copy{
  "deepVenue": "https://…",
  "sphere":    "https://…",
  "tashombe":  "https://tashombe.com"
}

copy:root{
  --bg:#080A0E; --b0:#0e1a26; --b2:#04070c; --panel:#0b1016;
  --ink:#E9ECF1; --dim:#828B99; --faint:#4A5260;
  --acc:#4FE0E8; --acc2:#8FECF0; --link:#4FE0E8;
  --plat:#C7D0DE; --slate:#4C5260;
  --line:rgba(255,255,255,.09);
  --p1:#5BD0FF; --p2:#E7C463; --p3:#FF7DA8; --p4:#4FD08A;
  --disp:'Verlag A','Verlag B','Outfit'; --mono:'IBM Plex Mono';
}