zugzbot 1.0.21 → 1.0.22

package/.opencode/oh-my-design/web/references/cohere/.verification.md

@@ -1,136 +0,0 @@
-# Cohere — Verification Notes (2026-05-08)
-
-Pipeline: `spec/verification-pipeline.md` · Skill: `omd:migrate`
-
-## Tier 1 — live DOM (playwright getComputedStyle)
-
-### Surfaces inspected (G3 ≥2)
-- `cohere.com/ko` (Korean home — Enterprise AI positioning)
-- `cohere.com/about` (English about page — same chrome confirmed)
-
-### Raw observations
-
-**Cookie Banner — "내 설정 저장" / "Save My Preferences"**
-- bg `rgb(23, 23, 28)` = `#17171c` (Dark Charcoal — Cohere's near-black)
-- color `#ffffff`
-- radius **32px** (compact pill specifically for cookie consent)
-- padding 8×24×12 (asymmetric)
-- 46px / 14px·500
-- Use: cookie consent button only
-
-**Header Primary CTA — "데모 요청" / "Request a demo"**
-- bg `#17171c`
-- color `#ffffff`
-- radius **9999px** (full pill)
-- padding 12×16
-- 44px / 16px·400
-- Use: header Primary
-
-**Hero Primary CTA — "데모 요청" / "Request a demo" / "Join us"** (larger)
-- bg `#17171c`
-- color `#ffffff`
-- radius 9999px
-- padding 12×24
-- 49px height
-- 16px·400
-- Use: hero / mid-page primary CTA
-
-**Inverse Primary — "North로 이동" / "시작하기"** (white on dark sections)
-- bg `#ffffff`
-- color `#17171c`
-- radius 9999px
-- padding 12×24
-- 49px / 16px·400
-- Use: white-on-dark hero variants
-
-### Single-system: 9999px Dark Charcoal pill
-
-Cohere uses **one consistent button system** across home + about + locale variants:
-- Header (44px / 16px·400)
-- Hero (49px / 16px·400)
-- Inverse (white on dark sections)
-- Cookie banner exception (32px radius for consent only)
-
-Dark charcoal `#17171c` is the canonical Primary across surfaces. White inverse for dark hero overlays.
-
----
-
-## Tier 2a — getdesign.md
-- `getdesign.md/cohere` — directory only
-
-## Tier 2b — styles.refero.design
-- `?q=Cohere` — no record
-
-**Tier 2 status: unavailable.** Tier 1 (cohere.com home + about, KR + EN locales) treated as authoritative.
-
----
-
-## Conflict Matrix
-
-| Field | Tier 1 home | Tier 1 about | refero/getdesign | Resolution |
-|---|---|---|---|---|
-| Primary bg | `#17171c` | `#17171c` ✓ | n/a | ✓ canonical |
-| Primary radius | 9999px | 9999px ✓ | n/a | ✓ pill |
-| Primary padding | 12×16 (header) / 12×24 (hero) | 12×24 (hero) | n/a | ✓ contextual |
-| Primary height | 44 (header) / 49 (hero) | 49 ✓ | n/a | ✓ |
-| Primary font | 16px·400 | 16px·400 ✓ | n/a | ✓ |
-| Cookie radius exception | 32px | n/a | n/a | one-off — consent UX |
-
-### Unresolved
-- **None.** Single-system canonical.
-
----
-
-## Components in §4
-
-§4 already documents (prior B1):
-- Buttons primary 9999px
-- Cards 22px
-- Cool gray borders
-- Interaction Blue `#1863dc` on hover
-- Purple bands for sections (never card backgrounds)
-
-Audit needed:
-1. Confirm Primary bg `#17171c` 9999px / pill
-2. Add Cookie 32px exception variant if missing
-
----
-
-## Philosophy sources (G6)
-
-### Founder/founding facts
-- **Cohere founded 2019** in Toronto, Canada
-  - Source: [Aidan Gomez — Wikipedia](https://en.wikipedia.org/wiki/Aidan_Gomez), [Cohere About](https://cohere.com/about)
-- Founders: **Aidan Gomez (CEO)**, **Nick Frosst** (both ex-Google Brain Toronto), **Ivan Zhang**
-- **Aidan Gomez was 20 years old when he co-authored "Attention Is All You Need" (2017)** as a Google Brain intern — the foundational Transformer architecture paper that underlies all modern LLMs
-  - Source: [Wikipedia: Aidan Gomez](https://en.wikipedia.org/wiki/Aidan_Gomez)
-- **Nick Frosst** was a Google Brain Toronto researcher; worked with **Geoffrey Hinton** (the "Godfather of AI", who later joined Cohere as advisor)
-  - Source: [Globe and Mail — Toronto AI star Cohere](https://www.theglobeandmail.com/business/article-toronto-ai-star-cohere-lands-tiger-led-125-million-venture-funding/)
-- **First check: Radical Ventures** (Toronto AI VC) wrote Cohere's first cheque
-  - Source: [U Toronto — Cohere story](https://www.entrepreneurship.artsci.utoronto.ca/news/how-cohere-ai-startup-co-founded-alumni-landed-170m-funding-year)
-- **Funding total ~US$1.6B** at **valuation north of $7B** as of Sept 2025
-  - Source: [Tracxn — Cohere Profile](https://tracxn.com/d/companies/cohere/__o4xfwmr3XwgsGEyH41XvwBm6Xd-SjsMlSld3d4ci6G0), [Globe and Mail](https://www.theglobeandmail.com/business/article-toronto-startup-backed-by-ai-experts-aims-to-bring-google-quality/)
-- **Tiger Global led $125M round** in earlier fundraising
-- **Enterprise positioning**: "Private, secure, customized" — Cohere differentiates from OpenAI/Anthropic by promising no training on customer data + on-prem deployment options
-- **North** is Cohere's enterprise AI agent product (verified live "North로 이동" CTA)
-- **Cohere Labs** — research arm
-
-### Voice samples (live-verified)
-- *"엔터프라이즈 AI: 개인, 보안, 맞춤형"* — page title <!-- verified: cohere.com/ko 2026-05 -->
-- *"데모 요청"* / *"Request a demo"* — Primary CTA <!-- verified: cohere.com -->
-- *"North로 이동"* — North agent product navigation <!-- verified: cohere.com/ko -->
-- *"시작하기"* — getting started inverse CTA <!-- verified: cohere.com/ko -->
-- *"Join us"* — careers CTA on About <!-- verified: cohere.com/about -->
-
-### Existing §10-15 retained from prior augmentation (B1 batch)
-- Voice & Tone — enterprise-AI-careful, formal but readable
-- Brand narrative — Toronto founding, Aidan Gomez Transformer co-author lineage
-- "Private, secure, customized" tripletate
-- RAG-first architecture as positioning
-
----
-
-**Verified-against:**
-- Tier 1: cohere.com/ko, cohere.com/about (live DOM via playwright, 2 locales)
-- Tier 2: refero/getdesign — no record
-- Founders/funding: Wikipedia (Aidan Gomez), Globe and Mail, Cohere About, U Toronto Centre for Entrepreneurship, Tracxn, TuringPost

package/.opencode/oh-my-design/web/references/cohere/DESIGN.md

@@ -1,409 +0,0 @@
----
-id: cohere
-name: Cohere
-country: US
-category: ai
-homepage: "https://cohere.com"
-primary_color: "#39594d"
-logo:
-  type: github
-  slug: cohere-ai
-verified: "2026-05-15"
-omd: "0.1"
-ds:
-  name: Cohere Newsroom
-  url: "https://cohere.com/newsroom"
-  type: brand
-  description: Cohere's press kit with logos, symbols, and media resources.
-  og_image: "https://cdn.sanity.io/images/rjtqmwfu/web3-prod/0750efbc3db33b1a67bc77575525b076f0137f26-1200x630.jpg?w=1200&h=630"
-tokens:
-  source: prose-derived
-  extracted: "2026-06-08"
-  note: "primary_color #39594d is the brand green token; live UI is near-monochrome — primary interactive accent is Interaction Blue #1863dc"
-  colors:
-    primary: "#1863dc"
-    primary-hover: "#1863dc"
-    brand: "#39594d"
-    canvas: "#ffffff"
-    foreground: "#000000"
-    muted: "#93939f"
-    on-primary: "#ffffff"
-    near-black: "#212121"
-    deep-dark: "#17171c"
-    ring-blue: "#4c6ee6"
-    focus-purple: "#9b60aa"
-    snow: "#fafafa"
-    surface-alt: "#f2f2f2"
-    hairline: "#f2f2f2"
-    border-cool: "#d9d9dd"
-    border-light: "#e5e7eb"
-  typography:
-    family: { display: "CohereText", sans: "Unica77 Cohere Web", mono: "CohereMono" }
-    display-hero:    { size: 72, weight: 400, lineHeight: 1.00, tracking: -1.44, use: "Hero, serif authority" }
-    display-secondary: { size: 60, weight: 400, lineHeight: 1.00, tracking: -1.2, use: "Large section headings" }
-    section:         { size: 48, weight: 400, lineHeight: 1.20, tracking: -0.48, use: "Feature section titles" }
-    subheading:      { size: 32, weight: 400, lineHeight: 1.20, tracking: -0.32, use: "Card headings, feature names" }
-    feature-title:   { size: 24, weight: 400, lineHeight: 1.30, use: "Smaller section titles" }
-    body-lg:         { size: 18, weight: 400, lineHeight: 1.40, use: "Intro paragraphs" }
-    body:            { size: 16, weight: 400, lineHeight: 1.50, use: "Standard body, button text" }
-    button-medium:   { size: 14, weight: 500, lineHeight: 1.71, use: "Smaller buttons, emphasized labels" }
-    caption:         { size: 14, weight: 400, lineHeight: 1.40, use: "Metadata, descriptions" }
-    uppercase-label: { size: 14, weight: 400, lineHeight: 1.40, tracking: 0.28, use: "Uppercase section labels" }
-    small:           { size: 12, weight: 400, lineHeight: 1.40, use: "Smallest text, footer links" }
-    code-micro:      { size: 8, weight: 400, lineHeight: 1.40, tracking: 0.16, use: "Tiny uppercase code labels" }
-  spacing: { xs: 4, sm: 8, md: 16, base: 16, lg: 24, xl: 32, xxl: 40, section: 60 }
-  rounded: { sm: 4, md: 8, lg: 16, xl: 20, signature: 22, full: 9999 }
-  shadow:
-    soft: "none — depth via background contrast and cool-gray borders"
-  components_harvested: true
-  components:
-    button-ghost: { type: button, fg: "#000000", use: "Transparent fill; hover text shifts to #1863dc; focus 2px solid #1863dc outline — the base button style" }
-    button-dark-solid: { type: button, bg: "#000000", fg: "#ffffff", use: "Dark fill, pill or standard radius — CTA on light surfaces" }
-    button-outlined: { type: button, use: "Border-based containment for secondary actions" }
-    card: { type: card, bg: "#ffffff", radius: 22, use: "Signature radius, 1px solid #f2f2f2 border, shadow-free" }
-    input: { type: input, use: "Focus border #9b60aa 1px solid; focus outline 2px solid #1863dc" }
-    uppercase-code-tag: { type: badge, use: "CohereMono uppercase with positive letter-spacing as section markers" }
-    purple-hero-band: { type: card, radius: 22, use: "Full-width deep purple section housing product screenshots" }
----
-
-# Design System Inspiration of Cohere
-
-## 1. Visual Theme & Atmosphere
-
-Cohere's interface is a polished enterprise command deck — confident, clean, and designed to make AI feel like serious infrastructure rather than a consumer toy. The experience lives on a bright white canvas where content is organized into generously rounded cards (22px radius) that create an organic, cloud-like containment language. This is a site that speaks to CTOs and enterprise architects: professional without being cold, sophisticated without being intimidating.
-
-The design language bridges two worlds with a dual-typeface system: CohereText, a custom display serif with tight tracking, gives headlines the gravitas of a technology manifesto, while Unica77 Cohere Web handles all body and UI text with geometric Swiss precision. This serif/sans pairing creates a "confident authority meets engineering clarity" personality that perfectly reflects an enterprise AI platform.
-
-Color is used with extreme restraint — the interface is almost entirely black-and-white with cool gray borders (`#d9d9dd`, `#e5e7eb`). Purple-violet appears only in photographic hero bands, gradient sections, and the interactive blue (`#1863dc`) that signals hover and focus states. This chromatic restraint means that when color DOES appear — in product screenshots, enterprise photography, and the deep purple section — it carries maximum visual weight.
-
-**Key Characteristics:**
-- Bright white canvas with cool gray containment borders
-- 22px signature border-radius — the distinctive "Cohere card" roundness
-- Dual custom typeface: CohereText (display serif) + Unica77 (body sans)
-- Enterprise-grade chromatic restraint: black, white, cool grays, minimal purple-blue accent
-- Deep purple/violet hero sections providing dramatic contrast
-- Ghost/transparent buttons that shift to blue on hover
-- Enterprise photography showing diverse real-world applications
-- CohereMono for code and technical labels with uppercase transforms
-
-## 2. Color Palette & Roles
-
-### Primary
-- **Cohere Black** (`#000000`): Primary headline text and maximum-emphasis elements.
-- **Near Black** (`#212121`): Standard body link color — slightly softer than pure black.
-- **Deep Dark** (`#17171c`): A blue-tinted near-black for navigation and dark-section text.
-
-### Secondary & Accent
-- **Interaction Blue** (`#1863dc`): The primary interactive accent — appears on button hover, focus states, and active links. The sole chromatic action color.
-- **Ring Blue** (`#4c6ee6` at 50%): Tailwind ring color for keyboard focus indicators.
-- **Focus Purple** (`#9b60aa`): Input focus border color — a muted violet.
-
-### Surface & Background
-- **Pure White** (`#ffffff`): The primary page background and card surface.
-- **Snow** (`#fafafa`): Subtle elevated surfaces and light-section backgrounds.
-- **Lightest Gray** (`#f2f2f2`): Card borders and the softest containment lines.
-
-### Neutrals & Text
-- **Muted Slate** (`#93939f`): De-emphasized footer links and tertiary text — a cool-toned gray with a slight blue-violet tint.
-- **Border Cool** (`#d9d9dd`): Standard section and list-item borders — a cool, slightly purple-tinted gray.
-- **Border Light** (`#e5e7eb`): Lighter border variant — Tailwind's standard gray-200.
-
-### Gradient System
-- **Purple-Violet Hero Band**: Deep purple gradient sections that create dramatic contrast against the white canvas. These appear as full-width bands housing product screenshots and key messaging.
-- **Dark Footer Gradient**: The page transitions through deep purple/charcoal to the black footer, creating a "dusk" effect.
-
-## 3. Typography Rules
-
-### Font Family
-- **Display**: `CohereText`, with fallbacks: `Space Grotesk, Inter, ui-sans-serif, system-ui`
-- **Body / UI**: `Unica77 Cohere Web`, with fallbacks: `Inter, Arial, ui-sans-serif, system-ui`
-- **Code**: `CohereMono`, with fallbacks: `Arial, ui-sans-serif, system-ui`
-- **Icons**: `CohereIconDefault` (custom icon font)
-
-### Hierarchy
-
-| Role | Font | Size | Weight | Line Height | Letter Spacing | Notes |
-|------|------|------|--------|-------------|----------------|-------|
-| Display / Hero | CohereText | 72px (4.5rem) | 400 | 1.00 (tight) | -1.44px | Maximum impact, serif authority |
-| Display Secondary | CohereText | 60px (3.75rem) | 400 | 1.00 (tight) | -1.2px | Large section headings |
-| Section Heading | Unica77 | 48px (3rem) | 400 | 1.20 (tight) | -0.48px | Feature section titles |
-| Sub-heading | Unica77 | 32px (2rem) | 400 | 1.20 (tight) | -0.32px | Card headings, feature names |
-| Feature Title | Unica77 | 24px (1.5rem) | 400 | 1.30 | normal | Smaller section titles |
-| Body Large | Unica77 | 18px (1.13rem) | 400 | 1.40 | normal | Intro paragraphs |
-| Body / Button | Unica77 | 16px (1rem) | 400 | 1.50 | normal | Standard body, button text |
-| Button Medium | Unica77 | 14px (0.88rem) | 500 | 1.71 (relaxed) | normal | Smaller buttons, emphasized labels |
-| Caption | Unica77 | 14px (0.88rem) | 400 | 1.40 | normal | Metadata, descriptions |
-| Uppercase Label | Unica77 / CohereMono | 14px (0.88rem) | 400 | 1.40 | 0.28px | Uppercase section labels |
-| Small | Unica77 | 12px (0.75rem) | 400 | 1.40 | normal | Smallest text, footer links |
-| Code Micro | CohereMono | 8px (0.5rem) | 400 | 1.40 | 0.16px | Tiny uppercase code labels |
-
-### Principles
-- **Serif for declaration, sans for utility**: CohereText carries the brand voice at display scale — its serif terminals give headlines the authority of published research. Unica77 handles everything functional with Swiss-geometric neutrality.
-- **Negative tracking at scale**: CohereText uses -1.2px to -1.44px letter-spacing at 60–72px, creating dense, impactful text blocks.
-- **Single body weight**: Nearly all Unica77 usage is weight 400. Weight 500 appears only for small button emphasis. The system relies on size and spacing, not weight contrast.
-- **Uppercase code labels**: CohereMono uses uppercase with positive letter-spacing (0.16–0.28px) for technical tags and section markers.
-
-## 4. Component Stylings
-
-### Buttons
-
-**Ghost / Transparent**
-- Background: transparent (`rgba(255, 255, 255, 0)`)
-- Text: Cohere Black (`#000000`)
-- No border visible
-- Hover: text shifts to Interaction Blue (`#1863dc`), opacity 0.8
-- Focus: solid 2px outline in Interaction Blue
-- The primary button style — invisible until interacted with
-
-**Dark Solid**
-- Background: dark/black
-- Text: Pure White
-- For CTA on light surfaces
-- Pill-shaped or standard radius
-
-**Outlined**
-- Border-based containment
-- Used in secondary actions
-
-### Cards & Containers
-- Background: Pure White (`#ffffff`)
-- Border: thin solid Lightest Gray (`1px solid #f2f2f2`) for subtle cards; Cool Border (`#d9d9dd`) for emphasized
-- Radius: **22px** — the signature Cohere radius for primary cards, images, and dialog containers. Also 4px, 8px, 16px, 20px for smaller elements
-- Shadow: minimal — Cohere relies on background color and borders rather than shadows
-- Special: `0px 0px 22px 22px` radius (bottom-only rounding) for section containers
-- Dialog: 8px radius for modal/dialog boxes
-
-### Inputs & Forms
-- Text: white on dark input, black on light
-- Focus border: Focus Purple (`#9b60aa`) with `1px solid`
-- Focus shadow: red ring (`rgb(179, 0, 0) 0px 0px 0px 2px`) — likely for error state indication
-- Focus outline: Interaction Blue solid 2px
-
-### Navigation
-- Clean horizontal nav on white or dark background
-- Logo: Cohere wordmark (custom SVG)
-- Links: Dark text at 16px Unica77
-- CTA: Dark solid button
-- Mobile: hamburger collapse
-
-### Image Treatment
-- Enterprise photography with diverse subjects and environments
-- Purple-tinted hero photography for dramatic sections
-- Product UI screenshots on dark surfaces
-- Images with 22px radius matching card system
-- Full-bleed purple gradient sections
-
-### Distinctive Components
-
-**22px Card System**
-- The 22px border-radius is Cohere's visual signature
-- All primary cards, images, and containers use this radius
-- Creates a cloud-like, organic softness that's distinctive from the typical 8–12px
-
-**Enterprise Trust Bar**
-- Company logos displayed in a horizontal strip
-- Demonstrates enterprise adoption
-- Clean, monochrome logo treatment
-
-**Purple Hero Bands**
-- Full-width deep purple sections housing product showcases
-- Create dramatic visual breaks in the white page flow
-- Product screenshots float within the purple environment
-
-**Uppercase Code Tags**
-- CohereMono in uppercase with letter-spacing
-- Used as section markers and categorization labels
-- Creates a technical, structured information hierarchy
-
-## 5. Layout Principles
-
-### Spacing System
-- Base unit: 8px
-- Scale: 2px, 6px, 8px, 10px, 12px, 16px, 20px, 22px, 24px, 28px, 32px, 36px, 40px, 56px, 60px
-- Button padding varies by variant
-- Card internal padding: approximately 24–32px
-- Section vertical spacing: generous (56–60px between sections)
-
-### Grid & Container
-- Max container width: up to 2560px (very wide) with responsive scaling
-- Hero: centered with dramatic typography
-- Feature sections: multi-column card grids
-- Enterprise sections: full-width purple bands
-- 26 breakpoints detected — extremely granular responsive system
-
-### Whitespace Philosophy
-- **Enterprise clarity**: Each section presents one clear proposition with breathing room between.
-- **Photography as hero**: Large photographic sections provide visual interest without requiring decorative design elements.
-- **Card grouping**: Related content is grouped into 22px-rounded cards, creating natural information clusters.
-
-### Border Radius Scale
-- Sharp (4px): Navigation elements, small tags, pagination
-- Comfortable (8px): Dialog boxes, secondary containers, small cards
-- Generous (16px): Featured containers, medium cards
-- Large (20px): Large feature cards
-- Signature (22px): Primary cards, hero images, main containers — THE Cohere radius
-- Pill (9999px): Buttons, tags, status indicators
-
-## 6. Depth & Elevation
-
-| Level | Treatment | Use |
-|-------|-----------|-----|
-| Flat (Level 0) | No shadow, no border | Page background, text blocks |
-| Bordered (Level 1) | `1px solid #f2f2f2` or `#d9d9dd` | Standard cards, list separators |
-| Purple Band (Level 2) | Full-width dark purple background | Hero sections, feature showcases |
-
-**Shadow Philosophy**: Cohere is nearly shadow-free. Depth is communicated through **background color contrast** (white cards on purple bands, white surface on snow), **border containment** (cool gray borders), and the dramatic **light-to-dark section alternation**. When elements need elevation, they achieve it through being white-on-dark rather than through shadow casting.
-
-## 7. Do's and Don'ts
-
-### Do
-- Use 22px border-radius on all primary cards and containers — it's the visual signature
-- Use CohereText for display headings (72px, 60px) with negative letter-spacing
-- Use Unica77 for all body and UI text at weight 400
-- Keep the palette black-and-white with cool gray borders
-- Use Interaction Blue (#1863dc) only for hover/focus interactive states
-- Use deep purple sections for dramatic visual breaks and product showcases
-- Apply uppercase + letter-spacing on CohereMono for section labels
-- Maintain enterprise-appropriate photography with diverse subjects
-
-### Don't
-- Don't use border-radius other than 22px on primary cards — the signature radius matters
-- Don't introduce warm colors — the palette is strictly cool-toned
-- Don't use heavy shadows — depth comes from color contrast and borders
-- Don't use bold (700+) weight on body text — 400–500 is the range
-- Don't skip the serif/sans hierarchy — CohereText for headlines, Unica77 for body
-- Don't use purple as a surface color for cards — purple is reserved for full-width sections
-- Don't reduce section spacing below 40px — enterprise layouts need breathing room
-- Don't use decoration on buttons by default — ghost/transparent is the base state
-
-## 8. Responsive Behavior
-
-### Breakpoints
-| Name | Width | Key Changes |
-|------|-------|-------------|
-| Small Mobile | <425px | Compact layout, minimal spacing |
-| Mobile | 425–640px | Single column, stacked cards |
-| Large Mobile | 640–768px | Minor spacing adjustments |
-| Tablet | 768–1024px | 2-column grids begin |
-| Desktop | 1024–1440px | Full multi-column layout |
-| Large Desktop | 1440–2560px | Maximum container width |
-
-*26 breakpoints detected — one of the most granularly responsive sites in the dataset.*
-
-### Touch Targets
-- Buttons adequately sized for touch interaction
-- Navigation links with comfortable spacing
-- Card surfaces as touch targets
-
-### Collapsing Strategy
-- **Navigation**: Full nav collapses to hamburger
-- **Feature grids**: Multi-column → 2-column → single column
-- **Hero text**: 72px → 48px → 32px progressive scaling
-- **Purple sections**: Maintain full-width, content stacks
-- **Card grids**: 3 → 2 → 1 column
-
-### Image Behavior
-- Photography scales proportionally within 22px-radius containers
-- Product screenshots maintain aspect ratio
-- Purple sections scale background proportionally
-
-## 9. Agent Prompt Guide
-
-### Quick Color Reference
-- Primary Text: "Cohere Black (#000000)"
-- Page Background: "Pure White (#ffffff)"
-- Secondary Text: "Near Black (#212121)"
-- Hover Accent: "Interaction Blue (#1863dc)"
-- Muted Text: "Muted Slate (#93939f)"
-- Card Borders: "Lightest Gray (#f2f2f2)"
-- Section Borders: "Border Cool (#d9d9dd)"
-
-### Example Component Prompts
-- "Create a hero section on Pure White (#ffffff) with CohereText at 72px weight 400, line-height 1.0, letter-spacing -1.44px. Cohere Black text. Subtitle in Unica77 at 18px weight 400, line-height 1.4."
-- "Design a feature card with 22px border-radius, 1px solid Lightest Gray (#f2f2f2) border on white. Title in Unica77 at 32px, letter-spacing -0.32px. Body in Unica77 at 16px, Muted Slate (#93939f)."
-- "Build a ghost button: transparent background, Cohere Black text in Unica77 at 16px. On hover, text shifts to Interaction Blue (#1863dc) with 0.8 opacity. Focus: 2px solid Interaction Blue outline."
-- "Create a deep purple full-width section with white text. CohereText at 60px for the heading. Product screenshot floats within using 22px border-radius."
-- "Design a section label using CohereMono at 14px, uppercase, letter-spacing 0.28px. Muted Slate (#93939f) text."
-
-### Iteration Guide
-1. Focus on ONE component at a time
-2. Always use 22px radius for primary cards — "the Cohere card roundness"
-3. Specify the typeface — CohereText for headlines, Unica77 for body, CohereMono for labels
-4. Interactive elements use Interaction Blue (#1863dc) on hover only
-5. Keep surfaces white with cool gray borders — no warm tones
-6. Purple is for full-width sections, never card backgrounds
-
-## 10. Voice & Tone
-
-Cohere's voice is **enterprise-AI-careful** — formal but readable, security-aware, never breathless. Public messaging emphasizes "private, secure, customized" enterprise positioning over consumer-AI hype. Korean tagline ("개인, 보안, 맞춤형") tracks the same triple.
-
-| Context | Tone |
-|---|---|
-| CTA | Verb-noun. "Request demo", "Talk to sales", "Start free" |
-| Marketing | Enterprise-language. "Private, secure, customized" recurring triplet |
-| Onboarding | Documentation-first; quickstart with API keys |
-| Error | Formal. "Request denied: insufficient quota. Contact sales." |
-| Compliance | Heavy SOC 2 / ISO references; trust pages prominent |
-
-**Voice samples**
-- *"엔터프라이즈 AI: 개인, 보안, 맞춤형"* <!-- verified: cohere.com/ko 2026-05 -->
-- *"데모 요청"* / *"Request a demo"* <!-- verified: cohere.com -->
-
-**Forbidden phrases.** "AGI", "superintelligence". Generic "AI revolution" framing. Casual emoji.
-
-## 11. Brand Narrative
-
-Cohere was founded in **2019** in **Toronto, Canada** by **Aidan Gomez** (CEO), **Nick Frosst**, and **Ivan Zhang** ([Aidan Gomez — Wikipedia](https://en.wikipedia.org/wiki/Aidan_Gomez), [Cohere About](https://cohere.com/about)). **Aidan Gomez was 20 years old when he co-authored "Attention Is All You Need"** in 2017 as a Google Brain intern — the foundational Transformer architecture paper that every modern LLM descends from. Nick Frosst worked at **Google Brain Toronto** with **Geoffrey Hinton** (the "Godfather of AI", who later joined Cohere as advisor) ([Globe and Mail](https://www.theglobeandmail.com/business/article-toronto-ai-star-cohere-lands-tiger-led-125-million-venture-funding/)). The **first cheque came from Radical Ventures** (Toronto AI VC) ([U Toronto Centre for Entrepreneurship](https://www.entrepreneurship.artsci.utoronto.ca/news/how-cohere-ai-startup-co-founded-alumni-landed-170m-funding-year)). Cohere has raised **~US$1.6B at >$7B valuation** as of Sept 2025 ([Tracxn](https://tracxn.com/d/companies/cohere/__o4xfwmr3XwgsGEyH41XvwBm6Xd-SjsMlSld3d4ci6G0)) — Tiger Global led an earlier $125M round. Founding observation: enterprises needed customizable LLMs that respected data privacy. RAG-first, private deployment, on-prem available. **North** is Cohere's enterprise AI agent product.
-
-## 12. Principles
-
-1. **Privacy is the product, not a footnote.** *UI implication:* privacy guarantees first-class on landing pages.
-2. **RAG-first architecture.** *UI implication:* surfaces emphasize "your data + our models".
-3. **Enterprise doesn't mean stuffy.** *UI implication:* trust pages explain SOC 2 in plain English.
-4. **Interaction Blue on hover only.** *UI implication:* don't use brand blue for static CTAs.
-5. **Purple bands for sections, never cards.** *UI implication:* never apply purple to cards/buttons.
-
-## 13. Personas
-
-*Personas are fictional archetypes informed by Cohere user segments (enterprise platform engineers, AI/ML platform leads, regulated-industry compliance), not individual people.*
-
-**Catherine Liu, 42, Toronto.** Director of AI/ML at a Canadian bank. Cohere is the only LLM vendor approved by their CISO.
-
-**Hiroshi Tanaka, 36, Tokyo.** Senior platform engineer at multinational logistics. Integrates Cohere Embed for 30+ language search.
-
-**David Mensah, 50, Johannesburg.** Head of risk at insurance carrier. On-prem deployment required.
-
-## 14. States
-
-| State | Treatment |
-|---|---|
-| **Empty (no API keys)** | "Generate your first API key" CTA + quickstart code |
-| **Empty (no datasets)** | "Connect a data source" with provider grid |
-| **Loading (model inference)** | Per-token streaming visible; never just spinner |
-| **Loading (RAG retrieval)** | Two-phase: "Retrieving (12 docs)" → "Generating" |
-| **Error (rate limit)** | "Tier-1 limit reached (60 req/min). Upgrade or wait." |
-| **Error (auth)** | "API key expired. Generate a new key in Settings → API Keys." |
-| **Success (deployment)** | Endpoint URL + credentials, security reminder |
-| **Success (fine-tuned)** | Email + dashboard notification with eval metrics |
-| **Skeleton (deployments)** | White rows with cool-gray border skeletons |
-| **Disabled (no quota)** | 0.5 opacity + tooltip "Upgrade to enable" |
-| **Loading (long fine-tune)** | Persistent progress with ETA |
-
-## 15. Motion & Easing
-
-| Token | Value | Use |
-|---|---|---|
-| `motion-instant` | 0ms | Toggle |
-| `motion-fast` | 150ms | Hover (Interaction Blue color shift) |
-| `motion-standard` | 250ms | Modal, panel |
-| `motion-streaming` | continuous | Token-by-token model output |
-
-Standard cubic-bezier. **No bouncy springs** — enterprise register. `prefers-reduced-motion: reduce` removes hover transitions and panel slide-ins.
-
----
-
-**Verified:** 2026-05-08 (B1 loop)
-**Tier 1 sources:** cohere.com/ko (live DOM via playwright — Dark `#17171c` Primary 9999px / 12×16-24 / 44-49px / 16px·400)
-**Tier 2 sources:** styles.refero.design / getdesign.md — no record.
-**Tier 1 (Philosophy):** cohere.com homepage; founder bios; Trust + Security pages.
-**Style ref:** `stripe`. **Conflicts unresolved:** none.

package/.opencode/oh-my-design/web/references/cohere/README.md

@@ -1,24 +0,0 @@
-# Cohere Inspired Design System
-
-[DESIGN.md](https://github.com/VoltAgent/awesome-design-md/blob/main/design-md/cohere/DESIGN.md) extracted from the public [Cohere](https://cohere.com/) website. This is not the official design system. Colors, fonts, and spacing may not be 100% accurate. But it's a good starting point for building something similar.
-
-## Files
-
-| File | Description |
-|------|-------------|
-| `DESIGN.md` | Complete design system documentation (9 sections) |
-| `preview.html` | Interactive design token catalog (light) |
-| `preview-dark.html` | Interactive design token catalog (dark) |
-
-
-Use [DESIGN.md](https://github.com/VoltAgent/awesome-design-md/blob/main/design-md/cohere/DESIGN.md) to use as a reference for AI agents (Claude, Cursor, Stitch) to generate UI that looks like the Cohere design language.
-
-## Preview
-
-A sample landing page built with DESIGN.md. It shows the actual colors, typography, buttons, cards, spacing, and elevation, all in one page.
-
-### Dark Mode
-![Cohere Design System — Dark Mode](https://pub-2e4ecbcbc9b24e7b93f1a6ab5b2bc71f.r2.dev/designs/cohere/preview-dark-screenshot.png)
-
-### Light Mode
-![Cohere Design System — Light Mode](https://pub-2e4ecbcbc9b24e7b93f1a6ab5b2bc71f.r2.dev/designs/cohere/preview-screenshot.png)