zugzbot 1.0.21 → 1.0.22

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

@@ -1,74 +0,0 @@
-# Omnichat — Verification Notes (2026-06-10)
-
-## Proof — Tier 1 live inspect
-
-**Inspected:** 2026-06-10
-**Method:** playwright getComputedStyle (live DOM) — global playwright (chromium, headless), viewport 1440×900, goto https://www.omnichat.ai/tw/ and https://www.omnichat.ai/tw/pricing/ domcontentloaded + 3.5s settle, modal dismissal pass, then `getComputedStyle` on body, h1/h2/h3, header/nav, buttons, links, inputs, cards, plus full-DOM background/text color frequency scans. Screenshots taken to confirm visible rendering (black aurora hero; pricing band).
-**Sources:**
-- https://www.omnichat.ai/tw/ (zh-TW homepage, live computed style + screenshot)
-- https://www.omnichat.ai/tw/pricing/ (pricing surface, live computed style + screenshot)
-- https://www.omnichat.ai/tw/about/ (brand story / mission — fetched)
-- https://blog.omnichat.ai/tw/ (Omnichat official blog — brand-owned, fetched)
-
-### Raw samples
-- `https://www.omnichat.ai/tw/` · body · `font-family: -apple-system, "system-ui"…"Noto Sans"…` · `color: rgb(51, 51, 51)` (#333333) · `font-size: 16px` · `line-height: 24px` · `background: rgb(255, 255, 255)`
-- `https://www.omnichat.ai/tw/` · hero H1 "AI 全通路顧客體驗平台 全方位賦能客服、行銷、銷售轉換" · `font: Outfit 52px / 64px / weight 500` · `letter-spacing: 1.4px` · `color: rgba(0,0,0,0)` with `background-image: linear-gradient(270deg, rgb(172,156,255) 0%, rgb(142,77,255) 25%, rgb(105,223,178) 50%, rgb(55,154,253) 75%, rgb(172,156,255) 100%)` + `-webkit-background-clip: text` (= #ac9cff / #8e4dff / #69dfb2 / #379afd)
-- `https://www.omnichat.ai/tw/` · hero subtitle H1 "Omni AI by Omnichat" · `color: rgb(140, 168, 207)` (#8ca8cf) · 24px / 500 / ls 1px · Outfit
-- `https://www.omnichat.ai/tw/` · hero dark band · `background-color: rgb(0, 0, 0)` (#000000) · height 704px
-- `https://www.omnichat.ai/tw/` · H2 "全渠道 AI 對話商務平台 深受全球 5,000+ 客戶信賴" · `color: rgb(2, 2, 166)` (#0202a6) · 40px / 500 / lh 64px / ls 1px
-- `https://www.omnichat.ai/tw/` · H2 "為何 Omnichat 是最好的選擇？" · `color: rgb(46, 46, 46)` (#2e2e2e) · 40px / 500 / ls 1px · Outfit
-- `https://www.omnichat.ai/tw/` · H2 on dark "全方位自動化客服、行銷與銷售…" · `color: rgb(117, 173, 252)` (#75adfc) · 46px / 500 / lh 64.4px
-- `https://www.omnichat.ai/tw/` · H3 "Omni AI Message Flow：AI 行銷活動產生器" · `color: rgb(78, 151, 255)` (#4e97ff) · 34px / 500 / lh 47.6px
-- `https://www.omnichat.ai/tw/` · H3 "自主代理型 AI 秒速打造高轉換對話式行銷活動" · `color: rgb(4, 3, 183)` (#0403b7) · 26px / 500 / lh 33.8px
-- `https://www.omnichat.ai/tw/` · header CTA "專家諮詢" (filled) · `background: rgb(0, 106, 255)` (#006aff) · `color: rgb(255,255,255)` · `border: 1px solid rgb(0,106,255)` · `border-radius: 13px 13px 0px` · height 32px · 16px / 500 · "Noto Sans HK"
-- `https://www.omnichat.ai/tw/` · header CTA "免費試用" (outline) · bg transparent · `color: rgb(0, 106, 255)` · `border: 1px solid rgb(0,106,255)` · `border-radius: 13px 13px 0px` · height 32px · 16px / 500
-- `https://www.omnichat.ai/tw/` · hero CTA "專家諮詢" · `background-color: rgb(51, 55, 246)` (#3337f6) · `background-image: linear-gradient(270deg, rgb(51,50,246), rgb(55,154,253), rgb(105,223,178), rgb(55,154,253), rgb(51,50,246))` · `border-radius: 10px` · padding 10px · height 44px · 16px / 500
-- `https://www.omnichat.ai/tw/` · button "更多成功案例" · `background: rgb(2, 2, 166)` (#0202a6) · white text · radius 10px · height 44px · Outfit 16px / 500
-- `https://www.omnichat.ai/tw/` · link CTA "了解完整案例" ×5 · `color: rgb(64, 143, 255)` (#408fff) · 16px / 500 · transparent bg
-- `https://www.omnichat.ai/tw/` · form input · `background: rgb(249, 249, 249)` (#f9f9f9) · `border: 1px solid rgb(197, 197, 197)` (#c5c5c5) · `border-radius: 8px` · padding 8px 16px · height 44px · text rgb(61,61,61) (#3d3d3d)
-- `https://www.omnichat.ai/tw/` · submit "送出資料" · `background: rgb(64, 143, 255)` (#408fff) · `border-radius: 0px 24px` · padding 9px 80px 10px · height 45px · white 16px / 500
-- `https://www.omnichat.ai/tw/` · nav link "平台" · `color: rgb(51, 51, 51)` · 17px / 400 · "Noto Sans HK" · row height 60px
-- `https://www.omnichat.ai/tw/` · mega-menu item "LINE 官方帳號" · `color: rgb(204, 51, 102)` (#cc3366) · 14px / 500 · `border-radius: 0px 0px 5px 5px` · row 42px (dropdown panel; hidden until menu opens)
-- `https://www.omnichat.ai/tw/` · bg frequency scan: `rgb(248,249,250)` ×68 (#f8f9fa), white ×12, `rgb(249,249,249)` ×12 (#f9f9f9), `rgb(0,106,255)` ×4 (#006aff), `rgb(0,0,0)` ×3, `rgb(51,55,246)` ×2 (#3337f6), `rgba(217,232,255,0.75)` ×2 (#d9e8ff), `rgb(2,2,166)` ×1
-- `https://www.omnichat.ai/tw/` · fg frequency scan: `rgb(51,51,51)` ×845 (#333333), `rgb(204,51,102)` ×233 (#cc3366, menu panels), `rgb(61,61,61)` ×216 (#3d3d3d), `rgb(102,102,102)` ×132 (#666666), `rgb(64,143,255)` ×40 (#408fff), `rgb(105,114,125)` ×37 (#69727d)
-- `https://www.omnichat.ai/tw/pricing/` · H2 "價格方案" · `color: rgb(46,46,46)` · 42px / 500 · Outfit; H3 plan names "高效客服方案 / 基本行銷商務 / 進階行銷商務 / 企業旗艦方案" · `color: rgb(61,61,61)` (#3d3d3d) · 24px / 500 / ls 1px
-- `https://www.omnichat.ai/tw/pricing/` · action CTA "聯絡專人 / 聯絡專員 / 預約示範" · `background: rgb(64, 143, 255)` (#408fff) · `border: 1px solid rgb(0,106,255)` · `border-radius: 0px 24px` · padding 8px 20px 11px · height 45px; compact "獲得報價" variant padding 2px 20px 5px · height 33px
-- `https://www.omnichat.ai/tw/pricing/` · segmented toggle · active "線上對話商務" `background: rgb(64,143,255)` white text · inactive "OMO全渠道銷售 / Social CDP" white bg `color: rgb(64,143,255)` · `border-radius: 99px` · height 36px · padding 6px
-- `https://www.omnichat.ai/tw/pricing/` · plan card · `background: rgb(255,255,255)` · `border-radius: 20px` · `border: 2px solid rgb(255,255,255)` (featured card: `2px solid rgb(0,106,255)`) · `box-shadow: rgba(0,0,0,0.06) 3px 3px 15px 0px` · padding 36px 26px 130px · width 288px
-- `https://www.omnichat.ai/tw/pricing/` · tab content panel · white · `border-radius: 0px 0px 13px 13px` · `box-shadow: rgba(0,0,0,0.15) 0px 3px 7px 0px` · padding 27px
-- `https://www.omnichat.ai/tw/pricing/` · badge "最受歡迎" · `background: rgb(0, 106, 255)` (#006aff) · white text · `border-radius: 5px` · padding 1px 32px · height 28px · 16px / 400
-- `https://www.omnichat.ai/tw/pricing/` · bg frequency scan: white ×181, `rgb(248,249,250)` ×168 (#f8f9fa), `rgb(236,244,255)` ×42 (#ecf4ff), `rgb(64,143,255)` ×42 (#408fff), `rgb(217,232,255)` ×10 (#d9e8ff), `rgb(0,106,255)` ×6, `rgb(6,199,85)` ×3 (LINE green, third-party logo)
-- document.title (home): "Agentic AI 建立 LINE 自動化行銷，打造全通路 AI 顧客體驗平台｜Omnichat"; document.title (pricing): "線上對話商務價格方案 - Omnichat"
-
-## Conflict matrix
-
-| Field | Tier 1 (live) | getdesign | refero | Resolution |
-|---|---|---|---|---|
-| — | all values above | 404 — "No designs found for 'omnichat'" | not listed (?q=omnichat searched, results returned unrelated brands) | Tier 1 only; no conflicts possible |
-
-Notes:
-- `#cc3366` raspberry appears 233× in the fg scan but only inside mega-menu dropdown panels (ancestor chain hidden until hover). Verified via visibility-chain check + full-page screenshot: visible chrome is blue-only. Documented as menu-only accent, not an action color.
-- Two near-duplicate deep blues observed (`#0202a6` H2 vs `#0403b7` H3) and two gradient indigos (`#3337f6` bg-color vs `#3332f6` first gradient stop) — both pairs documented in prose; tokens carry the dominant value. Not a Tier conflict (same source, adjacent elements).
-
-## Tier 2 attempts (both tried, 2026-06-10)
-
-1. **getdesign.md/omnichat** — WebFetch → 404 "No designs found for 'omnichat'".
-2. **styles.refero.design/?q=omnichat** — playwright navigate + search; result cards were unrelated brands (SpatialChat, Discord, NEVERHACK…); no /style/ page for Omnichat. Declared not listed after search-box query.
-
-## Country sources
-
-TW requirement — brand-owned sources (≥2):
-
-1. **https://www.omnichat.ai/tw/** — Omnichat official zh-TW homepage (Tier 1 live-inspected source for token claims).
-2. **https://www.omnichat.ai/tw/pricing/** — official pricing surface (second live-inspected surface).
-3. **https://blog.omnichat.ai/tw/** — Omnichat official blog ("Omnichat Blog 2.0 TW"; case studies 信義房屋 / m2 美度 / à la sha, channel guides).
-4. **https://www.omnichat.ai/tw/about/** — official brand-story page (mission, founder Alan Chan, 2017 founding, market list).
-
-Note: getdesign.md / refero.design / Google favicon proxy are explicitly NOT counted toward the TW brand-owned requirement.
-
-## Logo decision
-
-- Google s2 favicon proxy (`?domain=omnichat.ai&sz=128`, redirect followed): 726 B, 16×16 generic globe (washed blue-grey pixels) → rejected.
-- simpleicons `cdn.simpleicons.org/omnichat`: 404 → rejected.
-- GitHub org `OmniChat` (u/16149899): different company (yellow cart logo, blog omni.chat) → rejected.
-- **Chosen:** site's own declared icon `https://www.omnichat.ai/wp-content/uploads/webiconlogo.png` — 7,392 B, 128×128 PNG, verified visually as the brand mark (mint petals + blue chat bubble). `logo: { type: favicon, slug: <direct URL> }` per logos.ts ("Favicon: direct URL stored in slug (preferred)").

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

@@ -1,499 +0,0 @@
----
-id: omnichat
-name: Omnichat
-country: TW
-category: marketing
-homepage: "https://www.omnichat.ai"
-primary_color: "#006aff"
-logo:
-  type: favicon
-  slug: "https://www.omnichat.ai/wp-content/uploads/webiconlogo.png"
-verified: "2026-06-10"
-added: "2026-06-10"
-omd: "0.1"
-tokens:
-  source: live-extract
-  extracted: "2026-06-10"
-  note: "primary = header CTA / featured-card blue (#006aff); action CTAs use lighter #408fff; deep navy-blue #0202a6 for section headings; signature aurora gradient (#ac9cff/#8e4dff/#69dfb2/#379afd) clipped into hero text on black."
-  colors:
-    primary: "#006aff"
-    action: "#408fff"
-    deep: "#0202a6"
-    gradient-base: "#3337f6"
-    gradient-sky: "#379afd"
-    gradient-mint: "#69dfb2"
-    gradient-lavender: "#ac9cff"
-    gradient-violet: "#8e4dff"
-    heading-sky: "#4e97ff"
-    heading-sky-soft: "#75adfc"
-    hero-sub: "#8ca8cf"
-    ink: "#333333"
-    ink-strong: "#2e2e2e"
-    ink-heading: "#3d3d3d"
-    muted: "#666666"
-    icon-grey: "#69727d"
-    canvas: "#ffffff"
-    surface: "#f8f9fa"
-    surface-alt: "#f9f9f9"
-    tint-blue: "#ecf4ff"
-    tint-blue-deep: "#d9e8ff"
-    hero-dark: "#000000"
-    input-border: "#c5c5c5"
-    menu-accent: "#cc3366"
-  typography:
-    family: { display: "Outfit", zh: "Noto Sans HK" }
-    display-hero: { size: 52, weight: 500, lineHeight: 1.23, tracking: 1.4, use: "Hero headline, aurora-gradient-clipped Outfit on black" }
-    display-xl:   { size: 46, weight: 500, lineHeight: 1.40, tracking: 1, use: "Major section headlines on dark bands" }
-    section:      { size: 40, weight: 500, lineHeight: 1.60, tracking: 1, use: "Section titles (deep blue or ink)" }
-    feature:      { size: 34, weight: 500, lineHeight: 1.40, tracking: 1, use: "Feature / case-study headings" }
-    card-head:    { size: 26, weight: 500, lineHeight: 1.30, tracking: 1, use: "Card and capability heads" }
-    plan-head:    { size: 24, weight: 500, tracking: 1, use: "Pricing plan names" }
-    nav:          { size: 17, weight: 400, use: "Top navigation items" }
-    body:         { size: 16, weight: 400, lineHeight: 1.50, use: "Body copy, buttons, badges" }
-    menu-item:    { size: 14, weight: 500, use: "Mega-menu dropdown links" }
-  spacing: { xs: 3, sm: 8, md: 10, base: 16, lg: 20, xl: 27, xxl: 36 }
-  rounded: { sm: 5, md: 10, lg: 20, full: 99 }
-  shadow:
-    card: "rgba(0,0,0,0.06) 3px 3px 15px 0px"
-    panel: "rgba(0,0,0,0.15) 0px 3px 7px 0px"
-  components:
-    button-primary: { type: button, bg: "#006aff", fg: "#ffffff", border: "1px solid #006aff", radius: "13px 13px 0px", height: "32px", font: "16px / 500", use: "Header 專家諮詢 CTA — notched bottom-right corner" }
-    button-outline: { type: button, bg: "#ffffff", fg: "#006aff", border: "1px solid #006aff", radius: "13px 13px 0px", height: "32px", font: "16px / 500", use: "Header 免費試用 secondary CTA, same notched geometry" }
-    button-gradient: { type: button, bg: "#3337f6", fg: "#ffffff", radius: "10px", height: "44px", padding: "10px", font: "16px / 500", states: "animated 270deg gradient #3337f6 → #379afd → #69dfb2", use: "Hero 專家諮詢 CTA on black" }
-    button-action: { type: button, bg: "#408fff", fg: "#ffffff", radius: "0px 24px", height: "45px", padding: "8px 20px 11px", font: "16px / 500", use: "聯絡專人 / 送出資料 ribbon CTA — opposing corners rounded" }
-    segment-toggle: { type: tab, fg: "#408fff", active: "bg #408fff + text #ffffff", radius: "99px", height: "36px", font: "16px / 500", use: "Pricing product switcher pill (線上對話商務 / OMO / Social CDP)" }
-    input-default: { type: input, bg: "#f9f9f9", fg: "#3d3d3d", border: "1px solid #c5c5c5", radius: "8px", height: "44px", padding: "8px 16px", font: "16px / 400", use: "Lead-form text field" }
-    card-pricing: { type: card, bg: "#ffffff", border: "2px solid #006aff", radius: "20px", padding: "36px 26px", shadow: "rgba(0,0,0,0.06) 3px 3px 15px", use: "Featured plan card; non-featured plans carry an invisible 2px #ffffff border" }
-    badge-popular: { type: badge, bg: "#006aff", fg: "#ffffff", radius: "5px", padding: "1px 32px", height: "28px", font: "16px / 400", use: "最受歡迎 plan ribbon" }
-  components_harvested: true
----
-
-# Design System Inspiration of Omnichat
-
-## 1. Visual Theme & Atmosphere
-
-Omnichat is Taiwan and Hong Kong's leading omnichannel chat-commerce platform, and its zh-TW marketing surface reads like a confident AI-era SaaS pitch deck: a pure black (`#000000`) hero stage where the headline itself glows in an animated aurora gradient — lavender (`#ac9cff`) through violet (`#8e4dff`), mint (`#69dfb2`) and sky blue (`#379afd`) — clipped directly into the Outfit letterforms. Below that cinematic opening, the page settles onto a white (`#ffffff`) and soft-grey (`#f8f9fa`) canvas with periodic light-blue tint bands (`#ecf4ff`), so the dark AI theatre and the bright commercial sections alternate in clean cycles.
-
-The system speaks two typographic languages at once. Latin display text — including the rounded "Omnichat" wordmark moments — is set in **Outfit at weight 500**, while Traditional Chinese UI copy runs in **Noto Sans HK**. Crucially, every heading uses *positive* letter-spacing (+1px to +1.4px) at a medium 500 weight, the opposite of the tight-tracked heavyweight convention: headlines feel open, geometric, and friendly rather than aggressive. Heading color is itself a hierarchy device — deep navy-blue (`#0202a6`) for trust-bearing section titles, sky blues (`#4e97ff`, `#75adfc`) for AI feature heads on dark, and neutral inks (`#2e2e2e`, `#3d3d3d`) for plain content.
-
-The most distinctive signature is Omnichat's asymmetric corner geometry. Header CTAs round three corners at 13px and square the bottom-right ("13px 13px 0px"); pricing and form CTAs round only opposing corners ("0px 24px"), producing a ribbon-like parallelogram feel; pricing cards sit at a generous 20px with feather-soft shadows. Nothing is a plain rectangle and nothing is a default pill — the corner language alone identifies the brand. Combined with the chat-bubble logo mark and the blue monochrome action palette (`#006aff` primary, `#408fff` action), the whole surface signals "conversational, automated, commerce-grade".
-
-**Key Characteristics:**
-- Black hero stage with aurora-gradient text (`#ac9cff` → `#8e4dff` → `#69dfb2` → `#379afd`) clipped into the headline
-- Outfit (Latin) + Noto Sans HK (zh-TW) pairing at medium weight 500 — never bold-heavy
-- Positive letter-spacing (+1px / +1.4px) on all headings — open, geometric, friendly
-- Asymmetric corner signatures: notched "13px 13px 0px" header CTAs, ribbon "0px 24px" action CTAs
-- Blue-only action palette: `#006aff` primary chrome, `#408fff` action CTAs, `#0202a6` deep headings
-- White/`#f8f9fa` canvas with `#ecf4ff` and `#d9e8ff` light-blue tint bands
-- Feather shadows (`rgba(0,0,0,0.06) 3px 3px 15px`) on 20px-radius pricing cards
-- Heading color as hierarchy: deep blue for trust claims, sky blue for AI features, ink for plain content
-
-## 2. Color Palette & Roles
-
-### Primary
-- **Omnichat Blue** (`#006aff`): Primary brand action color — header CTA fill and outline, featured pricing-card border, the 最受歡迎 badge. The chrome-level "do this" blue.
-- **Action Blue** (`#408fff`): Lighter working blue for in-page CTAs (聯絡專人, 送出資料, 獲得報價), the active pricing toggle, inline link CTAs (了解完整案例), and the rounded wordmark moments.
-- **Deep Blue** (`#0202a6`): Near-navy section-heading color for trust statements ("深受全球 5,000+ 客戶信賴") and the dark solid button (更多成功案例). A close variant `#0403b7` appears on feature H3s.
-
-### Aurora Gradient (hero signature)
-- **Gradient Lavender** (`#ac9cff`): First and last stop of the 270° hero text gradient.
-- **Gradient Violet** (`#8e4dff`): Second stop — the purple depth of the aurora.
-- **Gradient Mint** (`#69dfb2`): Center stop — the green flash that ties to the logo's mint petals.
-- **Gradient Sky** (`#379afd`): Fourth stop — bridges the aurora back to brand blue.
-- **Gradient Base** (`#3337f6`): Indigo base color of the hero gradient CTA button (stops run `#3332f6` → `#379afd` → `#69dfb2`).
-
-### Headings on Dark
-- **Heading Sky** (`#4e97ff`): AI feature H3s ("Omni AI Message Flow：AI 行銷活動產生器").
-- **Heading Sky Soft** (`#75adfc`): Large section H2s on black bands.
-- **Hero Sub** (`#8ca8cf`): Muted blue-grey hero subtitle ("Omni AI by Omnichat").
-
-### Neutral & Ink
-- **Ink** (`#333333`): Document body color and nav links.
-- **Ink Strong** (`#2e2e2e`): Strong section H2s on white ("為何 Omnichat 是最好的選擇？").
-- **Ink Heading** (`#3d3d3d`): H3s, plan names, partner statements.
-- **Muted** (`#666666`): Secondary copy and descriptions.
-- **Icon Grey** (`#69727d`): Footer social icons and tertiary glyphs.
-
-### Surface
-- **Canvas** (`#ffffff`): Page background, cards, button text on blue.
-- **Surface** (`#f8f9fa`): The dominant section-band grey (most frequent background on the homepage).
-- **Surface Alt** (`#f9f9f9`): Form-field fill.
-- **Tint Blue** (`#ecf4ff`): Light-blue pricing hero band.
-- **Tint Blue Deep** (`#d9e8ff`): Deeper blue tint for feature chips and translucent panels (`rgba(217,232,255,0.75)`).
-- **Hero Dark** (`#000000`): Full-bleed black hero and AI showcase bands.
-- **Input Border** (`#c5c5c5`): Form-field hairline.
-
-### Accent (menu-only)
-- **Menu Accent** (`#cc3366`): Raspberry-pink link color inside the mega-menu dropdowns (platform/product lists). It lives only in the opened navigation panels — never on buttons or body copy — acting as a hidden wayfinding accent inside an otherwise all-blue system.
-
-## 3. Typography Rules
-
-### Font Family
-- **Display / Latin**: `Outfit` — geometric rounded sans for all headings and English display text.
-- **Traditional Chinese UI**: `"Noto Sans HK"` — buttons, nav, body-level zh-TW copy.
-- **Body default**: system stack (`-apple-system, "Segoe UI", Roboto, "Noto Sans"...`) at 16px/24px.
-
-### Hierarchy
-
-| Role | Font | Size | Weight | Line Height | Letter Spacing | Notes |
-|------|------|------|--------|-------------|----------------|-------|
-| Display Hero | Outfit | 52px | 500 | 1.23 (64px) | +1.4px | Aurora-gradient-clipped, on black |
-| Display XL | Outfit | 46px | 500 | 1.40 | +1px | Section headlines on dark bands |
-| Section | Outfit | 40–42px | 500 | 1.60 | +1px | Section titles (deep blue `#0202a6` or ink) |
-| Feature | Outfit | 34px | 500 | 1.40 | +1px | Case-study and AI feature heads |
-| Card Head | Outfit | 26px | 500 | 1.30 | +1px | Capability card heads |
-| Plan Head | Outfit | 24px | 500 | — | +1px | Pricing plan names |
-| Sub-head | Outfit | 22–24px | 500 | 1.40–1.60 | +0.6–1px | Partner line, hero eyebrow |
-| Nav | Noto Sans HK | 17px | 400 | — | normal | Top navigation items |
-| Body / Button | Noto Sans HK | 16px | 400–500 | 1.50 (24px) | normal–0.6px | Body copy 400; buttons 500 |
-| Menu Item | Noto Sans HK | 14px | 500 | — | normal | Mega-menu dropdown links |
-
-### Principles
-- **Medium, never bold**: Weight 500 is the display weight across every size. Omnichat persuades with color and gradient, not with heavy strokes.
-- **Positive tracking as identity**: +1px to +1.4px letter-spacing on headings — open and airy where most tech brands track tight. Body returns to normal tracking.
-- **Color is the type hierarchy**: The same 40px/500 heading switches between deep blue (`#0202a6`) for trust claims, ink (`#2e2e2e`) for questions, and sky (`#75adfc`) on dark — meaning is encoded in hue, not weight.
-- **Two scripts, one voice**: Outfit's geometric rounds and Noto Sans HK's clean strokes are matched in optical weight so bilingual lines feel uniform.
-
-## 4. Component Stylings
-
-### Buttons
-
-**Header Primary (專家諮詢)**
-- Background: `#006aff`
-- Text: `#ffffff`
-- Border: 1px solid `#006aff`
-- Radius: 13px 13px 0px
-- Padding: 3px
-- Font: 16px / 500 / Noto Sans HK
-- Use: Header expert-consult CTA — signature notched bottom-right corner
-
-**Header Outline (免費試用)**
-- Background: `#ffffff`
-- Text: `#006aff`
-- Border: 1px solid `#006aff`
-- Radius: 13px 13px 0px
-- Padding: 3px
-- Font: 16px / 500 / Noto Sans HK
-- Use: Free-trial secondary CTA, identical notched geometry next to the primary
-
-**Hero Gradient (專家諮詢)**
-- Background: `#3337f6`
-- Text: `#ffffff`
-- Radius: 10px
-- Padding: 10px
-- Font: 16px / 500 / Noto Sans HK
-- Hover: animated 270° gradient sweep (`#3332f6` → `#379afd` → `#69dfb2` → `#379afd` → `#3332f6`)
-- Use: Hero CTA on the black stage — the aurora gradient made clickable
-
-**Action Ribbon (聯絡專人 / 送出資料 / 獲得報價 / 預約示範)**
-- Background: `#408fff`
-- Text: `#ffffff`
-- Border: 1px solid `#006aff`
-- Radius: 0px 24px
-- Padding: 8px 20px 11px
-- Font: 16px / 500 / Noto Sans HK
-- Use: All pricing and form CTAs — opposing corners rounded into a ribbon shape; compact 33px variant uses 2px 20px 5px padding
-
-**Deep Solid (更多成功案例)**
-- Background: `#0202a6`
-- Text: `#ffffff`
-- Radius: 10px
-- Padding: 10px
-- Font: 16px / 500 / Outfit
-- Use: Case-study section CTA — deep blue gravity without the gradient
-
-### Tabs
-
-**Pricing Product Switcher**
-- Background: `#ffffff`
-- Text: `#408fff`
-- Radius: 99px
-- Padding: 6px
-- Font: 16px / 500 / Noto Sans HK
-- Active: `#408fff` background + `#ffffff` text
-- Use: Segmented pill switching 線上對話商務 / OMO全渠道銷售 / Social CDP plan groups
-
-### Inputs & Forms
-
-**Lead-Form Field**
-- Background: `#f9f9f9`
-- Text: `#3d3d3d`
-- Border: 1px solid `#c5c5c5`
-- Radius: 8px
-- Padding: 8px 16px
-- Font: 16px / 400
-- Use: Demo-request form fields (name, company, email)
-
-### Cards & Containers
-
-**Pricing Plan Card**
-- Background: `#ffffff`
-- Border: 2px solid `#ffffff`
-- Radius: 20px
-- Padding: 36px 26px
-- Shadow: `rgba(0,0,0,0.06) 3px 3px 15px`
-- Use: Plan cards (高效客服方案, 基本行銷商務…); featured plan swaps the invisible border for 2px solid `#006aff`
-
-**Tab Content Panel**
-- Background: `#ffffff`
-- Radius: 0px 0px 13px 13px
-- Padding: 27px
-- Shadow: `rgba(0,0,0,0.15) 0px 3px 7px`
-- Use: Content panel hanging below active tabs — top corners squared into the tab bar
-
-### Badges
-
-**最受歡迎 (Most Popular)**
-- Background: `#006aff`
-- Text: `#ffffff`
-- Radius: 5px
-- Padding: 1px 32px
-- Font: 16px / 400
-- Use: Plan ribbon floating above the featured pricing card
-
-### Navigation
-- Background: `#ffffff`
-- Text: `#333333`
-- Font: 17px / 400 / Noto Sans HK
-- Height: 60px rows
-- Use: Top nav (平台 / 產品 / 案例 / 價格 / 資源 / 關於 Omnichat); active section turns `#408fff`
-- Dropdown items: `#cc3366` text, 14px / 500, radius 0px 0px 5px 5px, 42px rows
-
----
-**Verified:** 2026-06-10
-**Tier 1 sources:** https://www.omnichat.ai/tw/ (homepage, live inspect), https://www.omnichat.ai/tw/pricing/ (pricing, live inspect), https://www.omnichat.ai/tw/about/ (brand story), https://blog.omnichat.ai/tw/ (official blog)
-**Tier 2 sources:** none available (getdesign.md/omnichat → 404 "No designs found"; styles.refero.design/?q=omnichat → not listed)
-**Conflicts unresolved:** none
-
-## 5. Layout Principles
-
-### Spacing System
-- Base unit: ~4px with measured stops at 3px, 8px, 10px, 16px, 20px, 27px, 36px
-- Notable: pricing cards run asymmetric 36px 26px padding with a deep 130px bottom reserve for the anchored CTA; panels use 27px
-
-### Grid & Container
-- Full-bleed alternating bands: black hero → white/`#f8f9fa` content → black AI showcase → `#ecf4ff` pricing tint
-- Centered single-column hero with a single inline question field ("你想從哪裡著手?")
-- Pricing: 4-up equal-width plan cards (288px) under a centered 99px segmented pill
-- Case studies: logo-led cards with 了解完整案例 link CTAs in repeating rows
-
-### Whitespace Philosophy
-- **Stage vs. shelf**: black bands are theatrical and sparse (one headline, one CTA); white bands are denser, shelf-like product sections. The contrast in density is intentional rhythm.
-- **Tint as chapter break**: `#ecf4ff` and `#d9e8ff` bands mark commercial chapters (pricing, lead capture) without needing rules or borders.
-- **Soft separation**: shadows are feather-light; most separation comes from background alternation.
-
-### Border Radius Scale
-- Small (5px): badges, dropdown bottoms
-- Medium (8–10px): inputs, gradient/deep buttons
-- Notch (13px 13px 0px): header CTAs, tab panels (inverted)
-- Large (20px): pricing cards
-- Ribbon (0px 24px): action CTAs — opposing corners only
-- Full (99px): segmented pills
-
-## 6. Depth & Elevation
-
-| Level | Treatment | Use |
-|-------|-----------|-----|
-| Flat (Level 0) | No shadow | Bands, hero, nav, badges |
-| Tint (Level 1) | `#f8f9fa` / `#ecf4ff` background shift | Section and chapter separation |
-| Feather (Level 2) | `rgba(0,0,0,0.06) 3px 3px 15px` | Pricing cards — barely-there lift |
-| Panel (Level 3) | `rgba(0,0,0,0.15) 0px 3px 7px` | Tab content panels, dropdown sheets |
-
-**Shadow Philosophy**: Omnichat keeps elevation nearly invisible. The two measured shadows are a feather-soft 6%-alpha card lift and a slightly firmer 15%-alpha panel drop — both tight and neutral. Drama is delegated entirely to the black bands and the aurora gradient; surfaces themselves stay calm and flat so the conversational UI mockups inside them (chat bubbles, LINE/WhatsApp threads) carry the visual interest. When the system wants emphasis it changes the background color of a whole band, never the z-axis of a single card.
-
-## 7. Do's and Don'ts
-
-### Do
-- Stage hero statements on pure black (`#000000`) with the aurora gradient (`#ac9cff` → `#8e4dff` → `#69dfb2` → `#379afd`) clipped into the headline text
-- Set headings in Outfit weight 500 with positive +1px letter-spacing; pair zh-TW copy in Noto Sans HK
-- Use the notched corner ("13px 13px 0px") on header CTAs and the ribbon ("0px 24px") on action CTAs — the asymmetric corners are the brand signature
-- Keep the action palette blue-only: `#006aff` chrome, `#408fff` in-page CTAs, `#0202a6` deep headings
-- Separate sections with background alternation (white / `#f8f9fa` / `#ecf4ff` / black), not rules or heavy shadows
-- Use heading color (deep blue vs sky vs ink) to signal content register
-- Float the `#006aff` badge above the featured pricing card and mark it with a 2px `#006aff` border
-- Keep shadows at feather strength (`rgba(0,0,0,0.06)`)
-
-### Don't
-- Use bold (700+) display weights — the system persuades at weight 500
-- Track headings tight or negative — Omnichat's letter-spacing is always open and positive
-- Round buttons symmetrically into default pills or plain rectangles — every CTA carries an asymmetric corner
-- Introduce warm accent colors on actions — the raspberry `#cc3366` lives only inside mega-menu dropdowns
-- Stack heavy drop shadows on cards — elevation stays whisper-quiet
-- Put the aurora gradient on body text or small UI — it belongs to hero-scale statements and the hero CTA only
-- Use grey hairline dividers between sections — switch the band background instead
-- Mix a second blue system into chrome — `#006aff` and `#408fff` have fixed, separate jobs
-
-## 8. Responsive Behavior
-
-### Breakpoints
-| Name | Width | Key Changes |
-|------|-------|-------------|
-| Mobile | <768px | Single column, hero text scales down, plan cards stack |
-| Tablet | 768–1024px | 2-up plan cards, condensed nav |
-| Desktop | 1024–1440px | Full 4-up pricing, mega-menu navigation |
-
-### Touch Targets
-- Action ribbon CTAs at 45px height with 20px side padding
-- Segmented pill options at 36px inside a generously padded track
-- Form fields at 44px height
-- Nav rows at 60px with dropdown items at 42px
-
-### Collapsing Strategy
-- Hero: 52px aurora headline compresses while keeping gradient clip and +letter-spacing
-- Pricing: 4-up cards → stacked column, featured card keeps its `#006aff` border and badge
-- Mega-menu: hover dropdowns → accordion drawer
-- Black showcase bands keep full-bleed treatment with reduced internal padding
-
-### Image Behavior
-- Product UI mockups (chat threads, dashboards) sit directly on band backgrounds without frames
-- Client logos render monochrome on white cards in case-study rows
-- Cards maintain 20px radius across breakpoints
-
-## 9. Agent Prompt Guide
-
-### Quick Color Reference
-- Primary chrome CTA: Omnichat Blue (`#006aff`)
-- In-page action CTA: Action Blue (`#408fff`)
-- Deep heading / dark button: Deep Blue (`#0202a6`)
-- Hero gradient: `#ac9cff` → `#8e4dff` → `#69dfb2` → `#379afd` (270°)
-- Hero CTA gradient base: `#3337f6`
-- Background: White (`#ffffff`) / Surface (`#f8f9fa`)
-- Tint bands: `#ecf4ff`, `#d9e8ff`
-- Hero stage: Black (`#000000`)
-- Body text: Ink (`#333333`); headings `#2e2e2e` / `#3d3d3d`
-- Headings on dark: `#75adfc`, `#4e97ff`; hero subtitle `#8ca8cf`
-
-### Example Component Prompts
-- "Create a hero on pure black #000000. Headline at 52px Outfit weight 500, line-height 64px, letter-spacing +1.4px, with a 270deg linear-gradient (#ac9cff, #8e4dff, #69dfb2, #379afd, #ac9cff) clipped into the text. Subtitle 24px Outfit 500 in #8ca8cf. One CTA: #3337f6 background with animated gradient sweep to #379afd and #69dfb2, 10px radius, 44px height, white 16px/500 text."
-- "Design a header: white background, 17px Noto Sans HK #333333 nav links. Two CTAs with radius '13px 13px 0px' (notched bottom-right): outline version with 1px solid #006aff border and #006aff text, filled version with #006aff background and white text, both 32px tall."
-- "Build a pricing card: white background, 20px radius, 2px solid #006aff border, shadow rgba(0,0,0,0.06) 3px 3px 15px, padding 36px 26px. Plan name 24px Outfit 500 #3d3d3d, letter-spacing +1px. Floating badge above: #006aff background, white 16px text, 5px radius, 1px 32px padding. CTA at bottom: #408fff background, white 16px/500 text, radius '0px 24px', 45px tall."
-- "Create a segmented switcher: 99px-radius track on white with 1px blue outline. Options 16px/500: active option #408fff background with white text, inactive options white with #408fff text, 36px tall."
-- "Design a lead form: fields with #f9f9f9 fill, 1px solid #c5c5c5 border, 8px radius, 44px height, 16px text #3d3d3d. Submit button #408fff with white text, radius '0px 24px', padding 9px 80px 10px."
-
-### Iteration Guide
-1. Weight 500 + positive letter-spacing on every heading — never bold, never tight
-2. Asymmetric corners on every CTA: "13px 13px 0px" in chrome, "0px 24px" in page
-3. Blue roles are fixed: #006aff = chrome/featured, #408fff = in-page action, #0202a6 = deep heading
-4. The aurora gradient appears exactly twice per page: hero headline clip + hero CTA
-5. Separate sections by switching band background (white / #f8f9fa / #ecf4ff / black)
-6. Shadows stay at rgba(0,0,0,0.06)–0.15 — barely visible
-7. Heading hue encodes register: deep blue = trust claim, sky = AI feature on dark, ink = plain content
-8. zh-TW copy in Noto Sans HK, Latin display in Outfit, matched optical weight
-
----
-
-## 10. Voice & Tone
-
-Omnichat's voice is **confident, conversion-obsessed, and warmly pragmatic** — a sales engineer who genuinely believes conversation is commerce. Every headline ties technology to a business outcome: AI is never demoed for its own sake, it "賦能客服、行銷、銷售轉換" (empowers service, marketing, and sales conversion). Numbers do the persuading — 5,000+ clients, 50% open rates, 轉換率 (conversion rate) appears in nearly every section — while the register stays polite Taiwanese business Mandarin with English product nouns (Omni AI, Social CDP, OMO) left untranslated as badges of category leadership.
-
-| Context | Tone |
-|---|---|
-| Hero headlines | Platform-scale declarations. "AI 全通路顧客體驗平台" — category first, capability second. |
-| Feature heads | Outcome verbs: 打造, 賦能, 轉換, 加速. Tech term + business result in one line. |
-| CTAs | Consultative, low-friction: "免費試用", "專家諮詢", "聯絡專人", "預約示範" — talk to a human, not "Buy now". |
-| Trust claims | Quantified and partner-anchored: "深受全球 5,000+ 客戶信賴", "LINE、WhatsApp、Meta 官方合作夥伴". |
-| Case studies | Client name + metric + mechanism: "信義房屋…締造精準受眾推播 50% 超高開封率". |
-| Pricing | Friendly imperative with one exclamation allowed: "選擇最適合您的方案，優化客戶服務，提升銷售業績！" |
-
-**Voice samples (verbatim from live zh-TW surfaces):**
-- "AI 全通路顧客體驗平台 全方位賦能客服、行銷、銷售轉換" — hero H1 *(verified live 2026-06-10)*
-- "全渠道 AI 對話商務平台 深受全球 5,000+ 客戶信賴" — homepage H2 *(verified live 2026-06-10)*
-- "為何 Omnichat 是最好的選擇？" — homepage H2 *(verified live 2026-06-10)*
-- "選擇最適合您的方案，優化客戶服務，提升銷售業績！" — pricing subtitle *(verified live 2026-06-10)*
-- "Omnichat 讓品牌與顧客保持緊密連結互動，以提升品牌的轉換率為使命。" — about page mission *(fetched 2026-06-10)*
-
-**Forbidden register**: vague AI mysticism without a metric, hard-sell urgency ("限時搶購"), untranslated jargon walls, and cold enterprise stiffness — the brand believes "有溫度的顧客體驗" (warm customer experience) and its copy must feel like a helpful consultant, not a vending machine.
-
-## 11. Brand Narrative
-
-Omnichat was founded in **2017 by Alan Chan** in Hong Kong, beginning — as the company's own about page tells it — with a single rented coworking desk where Chan coded the first MVP of a website chat tool that quickly attracted hundreds of e-commerce businesses. The founding insight was that in Asia's mobile-first markets, commerce doesn't happen on web forms — it happens inside chat threads on LINE, WhatsApp, Facebook Messenger, Instagram and WeChat. Omnichat unified those channels into one conversational commerce platform, and Taiwan became its largest market: the zh-TW surface leads the brand, LINE 官方帳號 sits first in the platform menu, and Taiwanese retail names (信義房屋, à la sha, 博士助聽器) headline its case studies.
-
-The company states its mission plainly: "Omnichat 讓品牌與顧客保持緊密連結互動，以提升品牌的轉換率為使命" — keep brands and customers tightly connected, with raising conversion rate as the mission. Founder Alan Chan compresses it further: "Omnichat 的目標永遠只有一個，就是提高品牌的轉換率" (Omnichat has only ever had one goal: raising brands' conversion rates). Backed by a US$1.8M Pre-A round in 2022 and consecutive years of ~300% ARR growth, the platform now serves 5,000+ companies across Taiwan, Hong Kong, Malaysia, Singapore, Thailand and Indonesia as an official WhatsApp Business Solution Provider and authorized partner of Meta and LINE — partner logos the design treats as first-class trust assets. The 2025-era reinvention as an "Agentic AI customer experience platform" (Omni AI) put the black-stage aurora hero at the front of the brand.
-
-What Omnichat refuses: faceless automation. The company's stated belief — "Omnichat 相信有溫度的顧客體驗，是品牌成功的關鍵" (warm customer experience is the key to brand success) — explains the design's character: a friendly rounded wordmark, open positive-tracked headings, consultative CTAs that offer a human expert, and chat bubbles as the recurring visual motif. The aesthetic says AI infrastructure; the voice says there's a person on the other end of the conversation.
-
-## 12. Principles
-
-1. **Conversion is the only scoreboard.** Every surface ties capability to 轉換率. *UI implication:* every section ends in a measurable next step (試用, 諮詢, 報價); decorative sections without a CTA are off-brand.
-2. **Conversation is the interface.** Commerce happens in chat threads, so chat is the hero artifact. *UI implication:* show real LINE/WhatsApp-style bubbles and threads in product mockups; the logo's speech-bubble motif echoes through rounded, asymmetric shapes.
-3. **Warmth over automation theatre.** "有溫度的顧客體驗" is the stated belief. *UI implication:* medium weights, open tracking, consultative CTA language ("專家諮詢" not "立即購買"), and human-team imagery beside AI features.
-4. **Prove it with partners and numbers.** Official Meta/LINE/WhatsApp partnership and 5,000+ clients carry the trust load. *UI implication:* partner logos and quantified case-study metrics are first-class design elements, placed early and styled prominently.
-5. **One drama per page.** The black aurora hero is the spectacle; everything after is calm white shelf. *UI implication:* reserve gradient and black bands for the opening statement and one AI showcase; keep pricing and content sections flat, tinted, and quiet.
-
-## 13. Personas
-
-*Personas below are fictional archetypes informed by publicly observable Omnichat customer segments (Taiwanese omnichannel retailers, e-commerce marketing teams, customer-service leads), not individual people.*
-
-**林佳穎, 34, 台北.** E-commerce marketing manager at a mid-size apparel brand running LINE OA, Instagram and a Shopline store. Lives in broadcast open-rate dashboards; chose Omnichat because segmented LINE pushes lifted open rates past 50% without raising message costs. Wants every new AI feature explained as a campaign she can ship this quarter.
-
-**陳俊宏, 41, 台中.** Retail operations director for a 60-store chain rolling out OMO member binding. Cares about 門市 staff adoption more than features — the platform must let a store clerk pick up a web chat without training. Trusts Omnichat because case studies name brands his scale, with numbers attached.
-
-**黃以涵, 28, 高雄.** Customer-service team lead at a beauty D2C brand drowning in repeated FAQs across five channels. Evaluates AI agents by how gracefully they hand off to her human team. The "專家諮詢" button — a person, not a paywall — is exactly the vendor relationship she wants.
-
-## 14. States
-
-| State | Treatment |
-|---|---|
-| **Empty (no conversations yet)** | White canvas, single Ink (`#333333`) line explaining the channel isn't connected, with one Action Blue (`#408fff`) ribbon CTA to connect LINE/WhatsApp. Chat-bubble illustration kept minimal. |
-| **Empty (no campaign results)** | Muted (`#666666`) single line on `#f8f9fa`; CTA offers a template, not a blank editor. |
-| **Loading (dashboard)** | Skeleton blocks on `#f8f9fa` at final dimensions, 20px radius for cards; flat pulse, no shimmer drama — consistent with the feather-shadow system. |
-| **Loading (AI generating)** | The one permitted spectacle: aurora-gradient progress treatment on the generating element, echoing the hero gradient. |
-| **Error (channel disconnected)** | Inline banner with plain-language cause and a reconnect action; never just "發生錯誤". Deep tone, no red flooding. |
-| **Error (form validation)** | Field-level message below the `#c5c5c5`-bordered input; states what a valid value looks like. |
-| **Success (campaign sent)** | Calm inline confirmation with the sent count — a number, in brand fashion. No confetti. |
-| **Success (form submitted)** | Confirmation replaces the form body; next step (專人將與您聯繫) stated explicitly. |
-| **Skeleton** | `#f8f9fa` blocks, 20px radius on cards, 99px on pill placeholders; flat pulse. |
-| **Disabled** | Buttons drop to reduced-opacity blue rather than grey, preserving the blue-only action language; text at `#69727d`. |
-
-## 15. Motion & Easing
-
-**Durations**:
-
-| Token | Value | Use |
-|---|---|---|
-| `motion-fast` | 150ms | Hover, pill toggle, focus |
-| `motion-standard` | 250ms | Card reveal, dropdown sheets, tab panels |
-| `motion-slow` | 400ms | Band transitions, hero entrance |
-| `motion-ambient` | 6–10s | Aurora gradient sweep on hero text and CTA |
-
-**Easings**:
-
-| Token | Curve | Use |
-|---|---|---|
-| `ease-enter` | `cubic-bezier(0.2, 0.6, 0.25, 1)` | Arriving — dropdowns, panels, cards |
-| `ease-exit` | `cubic-bezier(0.4, 0.0, 1, 1)` | Dismissals |
-| `ease-ambient` | `linear` | The looping aurora gradient |
-
-**Motion rules**: The aurora gradient is the brand's only continuous motion — a slow linear 270° sweep across the hero headline and gradient CTA, ambient like the AI it represents. Everything else is quick and functional: dropdown mega-menus slide down with `motion-standard / ease-enter`, the pricing pill slides its active state, chat-bubble mockups may type in once on scroll-into-view. No bounce, no spring — the product sells reliability to retailers. Under `prefers-reduced-motion: reduce`, the aurora freezes to a static gradient and all transitions collapse to instant; nothing functional is lost.
-
-<!--
-OmD v0.1 Sources — Philosophy Layer (sections 10–15)
-
-Tier 1 live inspect (2026-06-10) via playwright getComputedStyle on
-https://www.omnichat.ai/tw/ and https://www.omnichat.ai/tw/pricing/:
-- All token-level claims in §1–9 (colors, Outfit/Noto Sans HK, weight 500 +
-  positive tracking, notched/ribbon radii, aurora gradient stops, shadows)
-  are sourced from this live inspection. Raw samples in .verification.md.
-
-Voice samples (§10) are verbatim from the live zh-TW homepage and pricing
-page (hero H1, H2s, pricing subtitle), plus the about page mission line.
-
-Brand narrative (§11): founding (2017, Alan Chan, coworking-desk MVP origin),
-mission/belief statements, and the founder quote are from
-https://www.omnichat.ai/tw/about/ (fetched 2026-06-10). Funding (US$1.8M
-Pre-A, April 2022) and ~300% YoY ARR growth are from the company's PR
-(en.prnasia.com release, surfaced via web search 2026-06-10). Official
-WhatsApp BSP / Meta / LINE partner status is stated on the live homepage.
-Market list (TW/HK/MY/SG/TH/ID) is from the about page. Omnichat is
-HK-founded; it is catalogued country: TW as Taiwan is its lead market and
-the zh-TW surface is the brand's primary storefront.
-
-Personas (§13) are fictional archetypes informed by publicly observable
-Omnichat customer segments (Taiwanese retail/e-commerce teams). Names are
-illustrative; they do not refer to real people.
-
-States (§14) and Motion (§15) are design-system extrapolations consistent
-with the observed live aesthetic (flat surfaces, feather shadows, single
-ambient gradient), marked here as editorial/illustrative rather than
-documented Omnichat product specs.
--->

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

@@ -1,21 +0,0 @@
-# OpenAI — Verification Notes (2026-06-06)
-
-## Proof — Tier 1 live inspect
-**Inspected:** 2026-06-06
-**Method:** playwright getComputedStyle (live DOM) on the production site
-**Sources:**
-- https://openai.com
-
-### Raw samples
-- live openai.com body text: color #000000, font 17px, family OpenAI Sans — source: live DOM getComputedStyle
-- live openai.com page background: color #ffffff — source: live DOM getComputedStyle
-- live openai.com root background: color #000000 — source: live DOM getComputedStyle
-- live openai.com heading: color #000000, font 22px, / 500, family OpenAI Sans — source: live DOM getComputedStyle
-- live openai.com primary button: color #000000, background #000000, border-radius 40px, height 29px, font 13px, / 500 — source: live DOM getComputedStyle
-- live openai.com link: color #000000 — source: live DOM getComputedStyle
-
-## Tier 2 — cross-check
-- Live-DOM computed values above are the source of truth for this reference's hex/px tokens. DESIGN.md token roles were reconciled against these measurements.
-
-## Country sources
-- country US; brand-owned live source: https://openai.com (production site, all hex/px captured via live DOM getComputedStyle).