zugzbot 1.0.20 → 1.0.22

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

@@ -1,206 +0,0 @@
-# Figma — Verification Notes (2026-05-08)
-
-Pipeline: `spec/verification-pipeline.md` · Skill: `omd:migrate`
-
-## Tier 1 — figma.com live DOM (playwright getComputedStyle)
-
-### Surfaces inspected
-- `figma.com/ko-kr/` (home, Korean locale)
-- `figma.com/ko-kr/design/` (Design product page)
-
-### Raw observations
-
-**Primary Pill (Black) — `.fig-fa3ze6`**
-- bg `rgb(0, 0, 0)` = `#000000`
-- color `#ffffff`
-- border-radius **8px**
-- padding **12px 21px**
-- height 49px
-- font 16px / weight 330 (home) | 400 (design surface, alt class)
-- Used: "지금 무료로 시작하기" (home), "스토리 보기", "시작하기" alt
-
-**Primary Pill (Indigo) — `.fig-1onxcvr`**
-- bg `rgb(77, 73, 252)` = `#4D49FC`
-- color `#ffffff`
-- border-radius 8px
-- padding 12px 20px
-- height 49px
-- font 18px / weight 480
-- Used: alt Primary on hero (home only — not on design surface)
-
-**Outline Text Button — `.fig-taeqz`**
-- bg transparent
-- color `#000000`
-- border-radius 8px
-- padding 12px 21px
-- height 49px
-- font 18px / weight 330 (home) | 16px / 400 (design)
-- Used: "영업팀에 문의" — Sales contact
-
-**Segmented Tab Pill — `.fig-111738k` (active) / `.fig-47kzj9` etc (inactive)**
-- bg active `rgba(0, 0, 0, 0.08)` | inactive `#ffffff`
-- color `#000000`
-- border-radius **50px** (pill)
-- padding 8px 18px 10px (asymmetric)
-- height 43px
-- font 18px / weight 480
-- Used: product nav tabs ("프롬프트", "디자인", "그리기", "개발", "게시", "홍보", "협업", "프레젠테이션")
-
-**Icon Round Light — `.fig-1qn7s3f`**
-- bg `rgba(0, 0, 0, 0.08)` (frosted on light)
-- color `#000000`
-- border-radius 50%
-- 36×36px
-- Used: carousel prev/next on light surfaces
-
-**Icon Round Dark — `.fig-l5v9cg`**
-- bg `rgba(255, 255, 255, 0.16)` (frosted on dark)
-- color `#ffffff`
-- border-radius 50%
-- 36×36px
-
-**Icon Round Solid Black** (design surface)
-- bg `#000000`
-- color `#ffffff`
-- border-radius 50%
-- 40×40px
-
-**Hero CTA (Larger) — `.fig-17xt3vd`**
-- bg `#000000`
-- color `#ffffff`
-- border-radius **16px**
-- padding 8px 24px 10px
-- height 88px (hero region)
-- font 16px / 400
-
-**Cookie Banner Button — `.fig-2zebud`**
-- bg `#ffffff`
-- color `#000000`
-- border-radius 8px
-- padding 12px 21px
-- 49px / 16px·400
-
-**Color Tile Card** (templates section)
-- bg variants: `#e4ff97` (lime), `#00b6ff` (cyan), `#24cb71` (green), `#c4baff` (lavender), `#95b9ac` (sage)
-- color `#000000`
-- border-radius **0px** (full bleed) — these are landing-page color tiles, not button
-
-**FigJam Pill** (template card)
-- bg `#cb9fd2`
-- color `#000000`
-- border-radius 60px
-- padding 8px 24px 10px
-- 88px
-
----
-
-## Tier 2a — getdesign.md
-- `getdesign.md/figma` — directory only ("Warm minimalism, serif headings, soft surfaces" — generic snippet, no token data)
-
-## Tier 2b — styles.refero.design
-- 2 entries found at `?q=Figma`:
-  - `/style/60793669-28e2-41bd-bf9d-972151630f7c` — "Figma" (primary)
-  - `/style/8caa5004-a8cc-4c7e-a2bb-00ff60618729` — "Figma Config"
-
-### refero `/style/60793669` extract (primary):
-- Color: `#ffffff` Canvas, `#000000` Ink, `#595959` Graphite, `#e2e2e2` Boundary, `#4d49fc` Context Action Violet, `#33dfdf` Angular Teal
-- Typography: figmaSans + figmaMono, scale 12/16/18/24/56/72px, weight range 320-700
-- Spacing scale: 4/8/12/16/20/24/32/40/48/56/60/64/80/120/180px (4px base)
-- Border radius: contentCards 0px / contextualButtons 8px / floatingPanels 16px / **globalNavButtons 50px**
-- Components:
-  - **Global Action Pill**: `#000` / 50px / 8×18 / figmaSans 16px·480 ← refero says Primary is 50px
-  - **Navigation Utility Pill**: transparent / 1.5px solid `#000` / 50px / 8×18
-  - **Prompt Input Panel**: `#fff` / 16px / 16px padding / shadow `rgba(0,0,0,0.1) 0 24px 70px 0`
-  - **Panel Execution CTA**: `#4d49fc` / 8px / 8×16
-  - **Community Artifact Card**: 0px radius
-
----
-
-## Conflict Matrix
-
-| Field | Tier 1 (live) | refero | Resolution |
-|---|---|---|---|
-| Primary Pill bg | `#000000` | `#000000` | **#000000** ✓ |
-| **Primary Pill radius** | **8px** | **50px** | **CONFLICT** |
-| Primary Pill padding | 12×21 | 8×18 | live wins |
-| Primary Pill font | 16px·330-400 | figmaSans 16px·480 | live wins |
-| Indigo Primary bg | `#4D49FC` | `#4D49FC` | ✓ |
-| Indigo Primary radius | 8px | 8px | ✓ |
-| Indigo Primary use | "alt hero CTA" | "Panel Execution CTA" | both — same variant, different naming |
-| Segmented Tab radius | 50px | n/a | live |
-| Icon Round Light bg | `rgba(0,0,0,0.08)` | n/a | live |
-| Card radius (community) | 0px | 0px | ✓ |
-| Hero CTA radius | 16px | n/a (Prompt Panel 16px is closest match) | live |
-| Color tiles | `#e4ff97`/`#00b6ff`/`#24cb71`/`#c4baff` | not captured | live observation |
-| Token: `figmaSans` | confirmed | confirmed | ✓ |
-
-### Conflict resolution: Primary Pill radius (8px vs 50px)
-
-**Investigation:** refero claims Figma Primary is 50px pill. Live Tier 1 inspect on `figma.com/ko-kr/` shows Primary CTAs ("지금 무료로 시작하기", "시작하기") use **8px** radius. The **50px** pill in live observations is the **Segmented Tab** for product nav (`.fig-111738k`), not Primary.
-
-**Hypothesis:** refero's "Global Action Pill 50px" likely captured the Segmented Tab Pill OR a legacy variant. The contemporary figma.com Primary CTA is unambiguously 8px.
-
-**Resolution:** **Live Tier 1 wins.** §4 documents:
-- Primary Pill: `#000` 8px (the actual Primary CTA observed live)
-- Segmented Tab Pill: 50px (separate variant for product navigation)
-
-This explains the previous figma DESIGN.md confusion — "Black Solid (Pill)" with `Radius: circle (50%) for icon buttons` was conflating Primary, Tab Pill, and Icon Round into one entry.
-
----
-
-## Earlier mistakes to revert
-
-1. **§4 "Black Solid (Pill)" had `Radius: circle (50%) for icon buttons`** — wrong. That was conflating Primary (8px), Segmented (50px), and Icon Round (50%). Now split into 3 variants.
-2. **Cards/Navigation/Distinctive sections were prose, not canonical schema** — they didn't render as spec cards in `/reference/figma`. Now converted to variant blocks.
-3. **Indigo `#4D49FC` Primary alt was missing from §4** despite being in footer.
-4. **Outline-text, Segmented Tab, Icon Round (light/dark) all missing** as discrete variant blocks.
-
-## Components to write in §4
-
-1. **Buttons** (8 variants)
-   - Primary Pill Black (`#000` 8px 12×21 49px / 16px·330-400)
-   - Primary Pill Indigo (`#4D49FC` 8px 12×20 49px / 18px·480)
-   - Outline Text (transparent / `#000` border 8px 12×21 49px)
-   - Hero CTA (`#000` 16px 8×24 88px hero region)
-   - Segmented Tab Pill (active `rgba(0,0,0,0.08)` / inactive `#fff` / 50px / 8×18×10 / 43px / 18px·480)
-   - Icon Round Light (`rgba(0,0,0,0.08)` / 50% / 36×36)
-   - Icon Round Dark (`rgba(255,255,255,0.16)` / 50% / 36×36)
-   - Icon Round Solid (`#000` / 50% / 40×40)
-
-2. **Inputs** (1 variant — Prompt Panel)
-   - Prompt Input Panel (`#fff` / 16px / 16px padding / shadow `rgba(0,0,0,0.1) 0 24px 70px`)
-
-3. **Cards** (2 variants)
-   - Community Artifact Card (0px radius / image bleeds / 12px metadata gap)
-   - Hero Tile Card (color-bg variants `#e4ff97`/`#00b6ff`/`#24cb71`/`#c4baff`/`#95b9ac` / 0px / fullbleed)
-
-4. **Navigation**
-   - Pill Tab Bar (Segmented Tab Pill variant; product-area nav)
-
----
-
-## Philosophy sources
-
-### §11 Brand Narrative — verified facts
-- Founded **2012** (incorporated **August 16, 2012**) — Wikipedia, Index Ventures, founderoo.co
-- Founders: **Dylan Field** + **Evan Wallace**, met at **Brown University** (Wallace TA'd Field's CS course) — Sequoia spotlight, Index Ventures retrospective
-- Field received **$100,000 Thiel Fellowship 2012** to leave school full-time — Fortune
-- 3 years stealth building browser-native vector engine on WebGL — Index Ventures retrospective, Sequoia
-- Closed beta → **public launch September 2016** — multiple
-- **2021 valuation: $10B** — Wikipedia
-- **August 2, 2025 IPO on NYSE** — Fortune, Yahoo Finance ($68B post-IPO market cap)
-- Adobe acquisition deal ($20B) **fell through** in 2023 (regulatory) — public record
-
-### §10 Voice samples (live-verified)
-- *"지금 무료로 시작하기"* — homepage Primary CTA <!-- verified: figma.com/ko-kr 2026-05 -->
-- *"시작하기"* — alt Primary Indigo CTA <!-- verified: figma.com/ko-kr -->
-- *"영업팀에 문의"* — Outline Text CTA <!-- verified: figma.com/ko-kr -->
-- *"Make anything possible, all in Figma."* — figma.com/about <!-- verified: figma.com/about 2026-05 -->
-
----
-
-**Verified-against:**
-- Tier 1: figma.com/ko-kr/, figma.com/ko-kr/design/ (live DOM via playwright, 2026-05-08)
-- Tier 2: styles.refero.design/style/60793669-28e2-41bd-bf9d-972151630f7c, /style/8caa5004-a8cc-4c7e-a2bb-00ff60618729
-- Tier 2b: getdesign.md/figma — directory snippet only
-- Founder/IPO facts: Wikipedia (Dylan Field), Index Ventures, Sequoia Capital, Fortune, founderoo.co