# Brief Template Research — Decisions, Rules, and History *Compiled from: Portal: organization thread (1483758449937616987), Portal: redesign thread (1483832609510522970), #portal-cashapp channel (1484530120936001539), QMD, memory logs 2026-03-17–20, STYLE-GUIDE.md, competitor-brief-page SKILL.md* *Date compiled: 2026-03-20* *Author: Research subagent → Kitt* --- ## 1. LOCKED DECISIONS *Things Assaf explicitly approved. No debate.* ### Hero - **Split hero layout**: Left panel = always-designed brand statement (name, one-line positioning, 3 key stats). Right panel = brand identity photo. This design never fails even with no photography. - **Hero left panel is structural**: Uses CSS custom properties (`--brand-primary`). Cannot fail regardless of assets. DO NOT put imagery here. - **Hero right = ONE image**: A single, strong, clean identity image. Not a grid, not a collage, not a thumbnail collection. - **Hero right image type**: Brand identity ONLY. Approved types: logo/wordmark on brand color; core product artifact (the thing the brand IS); brand visual system spread (guidelines page, design system overview). All three are always safe. - **"The campaign isn't the brand you see"** — Assaf's exact words. Campaign photography belongs in §11 Campaigns, never in hero. ### Mosaic Layout - **2 independent flex columns**: `align-items: flex-start`, gap 16px. NOT a CSS grid. NOT uniform height rows. - **Intentional heights per card** — cards vary in height creating diagonal rhythm. Left col large-first, right col small-first. - **Left col arc** (creative/identity): Positioning → Brand Evolution → Color+Type → Campaigns → Quick Facts - **Right col arc** (analytical): Personality → Layout+UX → Social → Assessment → Verdict → Audience → vs Client - **Caption format**: §num (red, 9px uppercase) + section name (600 weight, 13px) + expand icon. Grey subtitle at 11px. - **Captions below image on white background** — NOT overlaid on the image. No overlay text on cards except hero. - **Mosaic images are OK** — Assaf explicitly said "the mosaic images look ok to me" when reviewing v8. ### Design System - **`border-radius: 0` everywhere** — set as `!important` in `brief-page.css`. No exceptions. Images with baked-in rounded corners MUST be replaced with square-corner equivalents. This cannot be fixed with CSS. - **Scroll progress bar**: 2px red bar fixed at top of page. - **Shared CSS** (`brief-page.css`): CSS custom properties `--brand-primary`, `--brand-dark`, `--bg` set on `` per brand. Everything else inherits. That's the entire per-brand customization. ### Fallback System (four-tier) | Tier | Class | When to use | |------|-------|-------------| | 1 | `.m-img` | Real agency/brand photography — always preferred | | 2 | `.m-img` | Product screenshots (clean, no device borders) | | 3 | `.m-img.fallback.color` | Brand primary color fill + section label | | 4 | `.m-img.fallback` | Dark fill + ghost section number — last resort | - **"A confident color field always beats a mediocre crop"** — locked rule. Use Tier 3 before showing a bad image. ### Color+Type Card (§04–05) - **Three required sub-sections when expanded**: 1. **Logo** — wordmark on brand color + construction guide/spacing guidelines image 2. **Color Palette** — CSS swatches (`.swatches` > `.sw`) with hex values + color strategy analysis 3. **Typography** — type specimen image (glyph set, weights, in-use) + 1 sentence description - Omitting any of these makes the expanded card feel incomplete. ### Layout+UX Card (§06) - **Expanded content = full-bleed natural-ratio images**. Use `margin: 0 -20px` to break out of content padding. - Minimum 3 screens: homepage/landing → core product UI → secondary feature. - **Website homepage screenshot for the card thumbnail** (not app screenshot) — shows full design intent. - "We let those open to value the imagery, present it well" — Assaf's rationale. ### Brand in Practice (full-width below mosaic) - **12+ unique images** — zero duplication with images used on section cards anywhere on the page. - Full-width below both columns — not inside either column. - 3 preview images visible, 9+ more in expanded grid (aspect-ratio: 1, object-fit: cover). ### TL;DR Strip - 5 stats + 1 strategic call. - Strategic call is the most important line on the page — what the client should DO with this intelligence. - Format: "borrow / watch / reject" framing preferred. ### Social Card (§10) - Must show **social-native, culturally specific content** reflecting actual platform strategy. - Real post screenshots preferred. If no real presence on a platform → state explicitly "No active presence." - For Cash App: `web-ig-06.jpg` (Brat Cash Card) was approved over `web-ig-01.jpg` (bad crown crop). ### Image Uniqueness Rule - **Never use the same image twice on one page.** Before assigning any image, check all current assignments. ### Natural Ratio Class - `.m-img.natural` — shows at native aspect ratio, no forced crop. Use for: agency spreads, panoramas, website screenshots, typography specimens, design system overviews. - `.m-img.natural.portrait` — natural but capped at `max-height: 400px`. Use for very tall portrait images. - Do NOT use `.natural` for: portrait photos of people, social screenshots. Use fixed height + object-position instead. --- ## 2. REJECTED PATTERNS *Things Assaf explicitly rejected. Never do these.* ### Hero - ❌ **Campaign photography in hero** — celebrities, seasonal ads, event-specific shots, talent portraits. Move to §11 Campaigns. - ❌ **Grid of thumbnails as hero right panel** — any collection of small images. "A 20-thumbnail grid is noise at that scale — nothing reads, nothing lands." Kit's exact call. - ❌ **Brand pillars/values imagery as hero** — this is brand positioning content, not brand identity. ### Cards - ❌ **Overlay text on card images** — captions ALWAYS go below on white background. - ❌ **Rounded corners on images** — zero tolerance. Identify baked-in rounded corners early (can't fix with CSS). - ❌ **Images below 800px wide** — too low-res for card thumbnails. - ❌ **Images where subject is cut off or unrecognizable** at card width. - ❌ **Document thumbnail grids** as section images (e.g., 20 small document thumbnails for Brand Evolution). Looks like a filing cabinet. ### §02 Positioning - ❌ **Talent/celebrity portrait** for Positioning card. A celebrity holding the product is an ad, not brand strategy. - ❌ **Lifestyle campaign portrait** for Positioning card. This reads as a campaign card, not a strategy card. - Positioning must show the brand's **strategic territory**, not a campaign moment. ### §04–05 Color+Type - ❌ **Brand pillars or values content** in the Color+Type card. "Physical Money / Type Overlays / Fashion & Culture / Dreams" = brand values, NOT Color+Type content. Completely wrong section. - The card must show Logo + Color swatches + Type specimen — nothing else. ### §06 Layout+UX - ❌ **Small grids with forced crops** inside the expanded content. Protocol: "never small grids with forced crops — full-bleed natural-ratio images." ### Global - ❌ **Uniform height grid** for mosaic cards. Cards must have intentional varying heights. - ❌ **Using the same image twice** on one page anywhere. - ❌ **Inline `style=` on h2/h3** elements (for the full competition pages, not brief — this is a competition page rule). - ❌ **"In Progress" stubs** — if no content for a section, omit the section entirely. Don't stub. - ❌ **Tagline "The future belongs to the convicted"** — "convicted" primarily means found guilty of a crime in English. Legally loaded in financial services. Never use in fintech context. --- ## 3. OPEN QUESTIONS *Things tried but not definitively resolved.* ### Hero Right Panel — Optimal Image Type Today's session confirmed the rule (brand identity, not campaign, not grid). However the exact best image TYPE for different brand categories wasn't fully codified: - Cash App: Cash Card artifact — clear - For brands without a iconic physical product artifact: brand color + wordmark is the safe fallback - For brands with only digital products: brand color fill + text was suggested as reliable **Status**: Rule established, but implementation guide for image-poor brands could be more explicit. ### §02 Positioning — Image Classification The Positioning card is the LARGEST card opening the left column. Several images were tried for Cash App before settling on `buck-eg-11.jpg` (multi-product positioning overview): - `web-shaboozey.jpg` (Wale/celebrity) → REJECTED (campaign/talent portrait) - `buck-eg-07.jpg` (brand principles) → considered, rejected (more design principles than strategic positioning) - `buck-eg-11.jpg` (unified multi-product positioning) → selected **Open question**: What exactly counts as "shows brand's strategic territory"? The line between "strategic brand image" and "brand principles image" is somewhat subjective. Needs examples per brand category. ### §13 vs Client Image The image for this section was not fully resolved in today's session (the March 20 notes show the Positioning and §04-05 fixes but not a §13 image confirmation). `web-shaboozey.jpg` was originally listed as both §02 and §13 which would violate the uniqueness rule. **Status**: Open. No confirmed image assignment for §13. ### Social Card Real vs Styled For platforms that block automated screenshot capture (TikTok, YouTube), the approach was: - YouTube: real thumbnails via `img.youtube.com/vi/{ID}/maxresdefault.jpg` (publicly accessible, no auth) - TikTok: styled content/tone/stats cards (no actual screenshot possible — platform blocks it) **Open question**: Is a "styled card" (not a real screenshot) acceptable for the brief, or does it lower the brief's credibility? Not explicitly resolved. ### Hero Height - `brief-page.css` sets hero height at 480px (desktop), 280px (mobile) — this is the canonical spec. - Kittoro's first builds had 560px on some pages. - **Status**: 480px is canonical but wasn't declared as "locked" in explicit Assaf approval. ### Mosaic Column Count The brief uses 2 columns. The initial builds used horizontal strips. 2-col mosaic was Assaf's request and he confirmed it looks good. **Status**: 2 cols appears locked but there was no explicit "2 cols forever" statement — just feedback-driven adoption. --- ## 4. VERSION HISTORY *What changed at each version of the brief and why.* ### v1 — Initial brief - **Format**: Horizontal strips layout - **Captions**: Overlaid on images - **Hero**: Unknown — not documented (pre-March 20 thread history) - **Status**: Never surfaced to Assaf directly — Kittoro's initial build ### v2 — Kittoro confirmation - Kittoro confirmed v1 was clean - Flagged apparent §09→§11 gap (was actually the §04-05 merged card — not a real gap) - **Change**: Minor fixes only - **Status**: Clean but unreviewed by Assaf ### v3 — Full mosaic rebuild *(March 20, ~10:30 UTC)* **Trigger**: Assaf reviewed early version, said **"love this - it is so good"** then requested specific changes. **Assaf's exact requests**: - Strips → irregular 2-column mosaic (staggered heights, diagonal rhythm) - Caption below image (not overlaid) - Smaller panels - Better image cropping - Reference: "portfolio/agency grid — 2 cols, large-left/small-right alternating, caption bold+grey below each image" **Changes made**: - Full structural rebuild to 2 independent flex columns - Intentional heights per card (360px Chalamet hero L, 220px Brand Evo R etc.) - Caption text below on white background - `object-position` curated per image - Brand in Practice full-width below both columns - Commit: `e9127eea` ### v4 — Minor interim - Details not captured in logs - Likely crop/image adjustments before v5 - Existed between 10:30 and 11:30 UTC ### v5 — Shared CSS system + split hero *(March 20, ~11:30 UTC)* **Changes**: - **Split hero** introduced (brand statement left, identity photo right) - **Shared CSS** (`brief-page.css`) extracted to shared assets - CSS custom properties per brand (`--brand-primary`, `--brand-dark`, `--bg`) - Fallback tier system added (`.fallback`, `.fallback.color` classes) - Card reorder to canonical column assignments - Commit: `fb2fdf36` ### v6 — Assaf review fixes *(March 20, ~11:58 UTC)* **Changes**: - `border-radius: 0 !important` enforced globally - Image swaps: removed baked-in rounded corner images - Social card: `web-ig-06.jpg` (Brat Cash Card) over `web-ig-01.jpg` - Layout+UX expanded: full-bleed natural images (not small grids) - Color+Type card: restructured to 3 sub-sections (Logo + Color + Type) - Commit: `85a45a1f` **Key decisions locked in v6**: - "Hero: NEVER campaign photography. Left=brand statement always works. Right=brand identity photo." - "Fallback: Tier1=agency, Tier2=product, Tier3=.fallback.color (brand primary fill), Tier4=.fallback (dark+ghost)" - "border-radius: 0 everywhere — no exceptions" - "Layout+UX expanded: full-bleed natural-ratio images, not small grids" - "Color+Type: logo section + color swatches + type specimen — 3 sub-sections required" - "Brand in Practice: 12 unique images, zero duplication with other cards" ### v7 — Minor fix - Brief was "at v7" when the new channel was created at 12:32 UTC March 20 - Likely a small fix after v6 (possibly hero crop fix or image path correction) - Commit not tracked separately in memory ### v8 — Today's editorial pass *(March 20, ~12:40+ UTC)* **Trigger**: Assaf posted screenshot of the live brief saying "it feel like you aren't reading or understanding my brief: use protocol and critique it. Pop-quiz what's wrong with this image?" **Issues identified**: 1. ❌ **Hero right panel**: Grid of 20+ thumbnail sketches with green borders (`buck-eg-04.jpg` = concept sketches). Violates "one image, strong, clean" rule. 2. ❌ **§02 Positioning image** (`web-shaboozey.jpg` = Wale/celebrity portrait): Campaign/talent photography. Wrong for Positioning. 3. ❌ **§04-05 Color+Type content**: Was showing brand pillars (Physical Money / Type Overlays / Fashion & Culture / Dreams) instead of Logo + Color + Type. 4. ✅ **§08/§09 Brand Personality** (3D product mosaic on neon green): Correct — explicitly praised. **Assaf's exact words on working elements**: "the mosaic images look ok to me guys" **Fixes made**: - Hero right: `buck-eg-04.jpg` → `buck-vi-hero.jpg` (Cash Card on green cushion) - §02 Positioning: `web-shaboozey.jpg` → `buck-eg-11.jpg` (multi-product positioning overview showing Cash App's unified strategic position across payments, investing, banking) - §04-05: Content rebuilt with 3 proper sub-sections (Logo + Color swatches + Type specimen) - Deployment: `X-Token` header, not `X-Deploy-Token` --- ## 5. IMAGE SELECTION RULES *What was learned about which images go where.* ### Universal Rule **Never use the same image twice on one page.** Always audit current image assignments before picking a new one. ### Hero Right Panel - Type required: Brand identity - ✅ Logo/wordmark on brand color - ✅ Core product artifact (the physical or digital thing that IS the brand) - ✅ Brand visual system spread (guidelines page, design system overview at full scale) - ❌ Celebrity/talent portraits - ❌ Campaign photography - ❌ Any grid or collection of small images - ❌ Images with baked-in rounded corners - **Cash App assignment**: `buck-vi-hero.jpg` (Cash Card on green cushion) ### §01 Quick Facts (bottom of left col) - Type: Product/press identity - Purpose: Reference, not story opener — it's at the bottom for a reason - **Cash App assignment**: `press-cashcard.jpg` ### §02 Positioning (TOP of left col — largest card) - Type: Cultural/lifestyle or strategic overview - Must show the brand's **strategic territory** — the world they inhabit, their market position - ✅ Multi-product positioning overview - ✅ Brand cultural context (without a celebrity as the subject) - ❌ Celebrity/talent portrait — reads as campaign card - ❌ Single ad or campaign moment - **Cash App attempt 1**: `web-shaboozey.jpg` (Wale/celebrity) → REJECTED - **Cash App attempt 2**: `buck-eg-07.jpg` (brand principles) → considered but rejected (principles, not positioning) - **Cash App final**: `buck-eg-11.jpg` (unified multi-product positioning — shows Cash App across payments, investing, banking) ### §03 Brand Evolution - Type: Timeline spread / brand overview / panoramic - ✅ Full brand system overview at natural ratio (works as panoramic) - ✅ Design system spread showing evolution - ❌ Dense grid of document thumbnails (20+ small thumbnails = filing cabinet, not brand story) - Use `.m-img.natural` — let the image breathe at native aspect ratio - **Cash App assignment**: `buck-vi-panorama.jpg` (comprehensive brand mosaic, 1920×688) ### §04–05 Color & Typography - Type: Brand identity / guidelines / type system visual - Must support expanded 3-section structure (Logo + Color + Type) - ✅ Brand guidelines spread - ✅ Design system overview with typography - ❌ Brand pillars/values visual - ❌ Product screenshots - Use `.m-img.natural.dark` (dark background matches brand guidelines aesthetics) - **Cash App assignment**: `buck-vi-digital.jpg` ### §06 Layout & UX - Type: Website homepage screenshot - Must show full website design intent — use homepage, not app screenshot - Use `.m-img.natural` (website screenshots breathe at natural ratio) - Expanded content: full-bleed, 3+ screens side by side or stacked (homepage + core product + secondary feature) - **Cash App assignment**: `homepage-fresh.png` (natural green background) ### §07 Assessment - Type: Design principles / strategy visual - Supporting image for Strengths + Vulnerabilities grid content - **Cash App assignment**: `buck-vi-typography.jpg` (natural dark) ### §08 Verdict - Type: Iconic brand object - The defining artifact of the brand — what it IS at its most elemental - Use `.m-img.natural` - **Cash App assignment**: `buck-vi-overview.jpg` ### §09 Brand Personality - Type: Brand world / lifestyle objects / 3D brand artifacts - Must evoke the brand's personality and tone, not a product photo - ✅ 3D product renders on brand-color background = explicitly approved ("strong, culturally fluent, exactly right") - **Cash App assignment**: `buck-vi-system-full.jpg` (natural) ### §10 Social Strategy - Type: Social-native, viral content - Must reflect **actual platform strategy** — what the brand actually does on social - ✅ Real social post screenshots (X cards, Instagram posts) - ✅ YouTube thumbnails via `img.youtube.com/vi/{ID}/maxresdefault.jpg` - For TikTok (blocks capture): styled content/tone/stats cards are acceptable - ❌ Portrait crops of celebrities that happen to appear in social posts - ❌ Generic social media icons or mockups - **Cash App assignment**: `web-ig-06.jpg` (Brat Cash Card — culturally specific, socially native) - **Rejected for Cash App**: `web-ig-01.jpg` (bad crown crop — awkward, not social-native) ### §11 Campaigns - Type: Cinematic campaign hero — the biggest, most arresting campaign image - Left col visual anchor — this should be the largest image in the left column - Use `.m-img.natural` for full agency spreads - Multiple campaign images in expanded content (`.campaign` pattern: hero + meta + name + desc + supporting grid) ### §12 Audience - Type: Documentary / lifestyle photography - Shows the brand's actual target audience — real people, real contexts - **Cash App assignment**: `lifestyle-16.jpg` (200px crop, center 40%) ### §13 vs Client - Type: Campaign or cultural image - Houses the comparison table + strategic call - **Status**: Image assignment for Cash App not fully confirmed (uniqueness conflict with §02 noted) ### Brand in Practice (full-width) - Must use images NOT appearing anywhere else on the page - Sources: alternate agency deliverables, 3D brand objects, custom product variants (limited editions, collabs), motion/animation stills, illustration system samples, brand guidelines spreads - Target: 12–16 images (3 preview + 9+ in expanded grid) --- ## 6. SECTION STRUCTURE *What each of the 13 sections should contain and what image type it needs.* ### Mosaic Architecture ``` LEFT COLUMN (creative/identity arc) RIGHT COLUMN (analytical arc) ───────────────────────────────────── ──────────────────────────────────── §02 Positioning LARGE (360px) §09 Brand Personality §03 Brand Evolution §06 Layout & UX §04–05 Color+Type §10 Social Strategy §11 Campaigns LARGE visual anchor §07 Assessment §01 Quick Facts bottom reference §08 Verdict §12 Audience §13 vs [Client] ───────────────────────────────────────────────────────────────────────────────── BRAND IN PRACTICE (full-width, below both columns — 12+ unique images) ``` --- ### §01 — Quick Facts - **Position**: Bottom of left column (reference, not opener) - **Image type**: Product/press identity — the brand's primary product or press-ready identity shot - **Expanded content**: - Financial stats (revenue, users, valuation, market position) - Key dates (founded, IPO/acquisition, major milestones) - Geographic footprint - 4-col skeleton layout in curation dashboard --- ### §02 — Positioning - **Position**: TOP of left column, LARGEST card (360px height) - **Image type**: Cultural/lifestyle or strategic positioning overview — shows brand's world - **Expanded content**: - `callout` with direct brand voice quote or key positioning statement - 2-3 paragraphs of positioning analysis - Tag line · key claim · target demographic in caption subtitle - **Rule**: Must answer "why this brand wins" not just "what they say about themselves" --- ### §03 — Brand Evolution - **Position**: Left column, second card - **Image type**: Panoramic timeline spread or brand system overview (`.m-img.natural`) - **Expanded content**: - Timeline (`.timeline` > `.t-item`) - Each entry: year + milestone name + brand consequence of that milestone (not just facts) - Final item has class `.now` - Must pass the analytical test: "what happened AND what it meant for the brand" --- ### §04–05 — Color & Typography *(merged card)* - **Position**: Left column, third card - **Image type**: Brand identity / design system overview (`.m-img.natural.dark`) - **Expanded content** (THREE required sub-sections — none optional): 1. **Logo section** — `

Logo

` + wordmark image on brand color + logo construction/spacing guidelines image 2. **Color Palette** — `

Color Palette

` + CSS swatches (`.swatches` > `.sw` with `.sw-block`, `.sw-name`, `.sw-hex`) + color strategy note 3. **Typography** — `

Typography

` + type specimen image + 1 sentence on typeface and usage strategy --- ### §06 — Layout & UX (Digital Experience) - **Position**: Right column, second card - **Image type**: Website homepage screenshot (natural ratio, `.m-img.natural`) - **Expanded content**: - Full-bleed images at natural ratio (break out of content padding: `margin: 16px -20px 0`) - Minimum 3 screens: homepage → core product UI → secondary feature - 2-up grid for pairs, full-width for hero screens - Analysis: how design communicates brand values, what UX decisions signal about brand trust --- ### §07 — Assessment - **Position**: Right column, fourth card - **Image type**: Design principles / strategy visual - **Expanded content**: - Strengths + Vulnerabilities grid - Every "What Doesn't" item must name a **specific strategic vulnerability eToro can exploit** (not a generic quality deficiency) - User psychology observations (love patterns / rage patterns from Reddit, App Store reviews) - Sources must be explicit --- ### §08 — Strategic Verdict - **Position**: Right column, fifth card - **Image type**: Iconic brand object — the most elemental artifact of what this brand IS - **Expanded content**: - Borrow / Watch / Reject framework - Each item MUST include a "because for eToro" clause: "(because eToro's [audience/positioning] means [specific reason])" - No item without a clause — observations without eToro-specific reasoning are incomplete --- ### §09 — Brand Personality - **Position**: Top of right column (first card, smaller height) - **Image type**: Brand world / lifestyle objects / 3D brand artifacts on brand-color background - **Expanded content**: - Brand archetype(s) - Tone descriptors (3-5 words) - Target audience — must be specific enough that it CANNOT apply to a different brand (specificity test: swap brand names — if it still reads true, it's too generic) - How the brand makes users feel --- ### §10 — Social Strategy - **Position**: Right column, third card - **Image type**: Social-native, viral content (`.m-img` fixed height + object-position) - **Expanded content**: - Per-platform breakdown (Instagram, X/Twitter, YouTube, TikTok, Reddit, etc.) - Each platform: post examples OR explicit "No active presence" - What content types they publish + why each works strategically - What social content reveals about how they recruit from eToro's target demographic - Styled cards acceptable for TikTok (blocks capture); YouTube thumbnails via CDN --- ### §11 — Campaigns - **Position**: Left column, fourth card (largest visual anchor) - **Image type**: Cinematic campaign hero — the most arresting agency/campaign image available - **Expanded content**: - `.campaign` pattern: campaign hero image + meta (year, agency, channel) + name + description + supporting 3-up grid - Multiple campaigns can be included - Campaign hero: `height: 360px` - Supporting grid: 3 columns, aspect-ratio: 16/9 --- ### §12 — Audience - **Position**: Right column, sixth card - **Image type**: Documentary / lifestyle photography — real people, real contexts - **Expanded content**: - Age range, geography - Psychographic profile - Retention driver (what psychological job does staying serve?) - What makes switching feel like loss --- ### §13 — vs [Client] - **Position**: Right column, last card - **Image type**: Campaign or cultural image - **Expanded content**: - Comparison table (brand feature/quality vs client equivalent) - Strategic call: specific, testable insight about where client should swing and why - eToro implication at section level (not just at §10) --- ### Brand in Practice (full-width section below all cards) - **Not a numbered section** (no §label) - **Position**: Full-width, below both mosaic columns - **Image type**: Broad visual library — 12–16 images never duplicated elsewhere - **Rule**: Must feel like the brand's complete visual library, not a repeat of card images - Good sources: alternate agency deliverables, 3D objects, custom product variants, collabs, motion/animation stills, illustration system, brand guidelines spreads --- ## APPENDIX: Image Naming Patterns (Cash App) For future brand builds, Cash App image naming reveals the source system: | Prefix | Source | |--------|--------| | `buck-vi-*` | Buck agency — Visual Identity guidelines spreads | | `buck-eg-*` | Buck agency — Evergreen content / system examples | | `buck-taxes-*` | Buck agency — Tax season campaign | | `buck-illus-*` | Buck agency — Illustration system | | `web-ig-*` | Scraped from Cash App Instagram | | `web-heirloom-*` | Scraped from Cash App web (Heirloom campaign) | | `web-shaboozey-*` / `web-wale-*` | Campaign talent photography (web-scraped) | | `web-court-*` | Campaign photography (court/basketball) | | `lifestyle-*` | Curated lifestyle photography | | `press-*` | Press/media assets | | `product-*` | Product screenshots | | `appstore-*` | App Store screenshots | | `social-*` | Social media card assets | | `qa-*` | QA artifacts — EXCLUDE from all brand image directories | --- ## APPENDIX: Known Technical Rules 1. **Deploy header**: `X-Token`, NOT `X-Deploy-Token` 2. **Playwright lazy-load**: `loading="lazy"` causes grey boxes in screenshots — use `loading="eager"` on competition pages 3. **QA artifact exclusion**: `qa-render.png`, `qa-screenshot.png` naming pattern — exclude from all brand asset directories 4. **GitHub PAT 'dan'**: Expires ~Mar 25 2026 — renew at https://github.com/settings/tokens/ 5. **Playwright-stealth**: Works on Revolut, X/Twitter. Blocked on: TikTok (captcha), YouTube (cookie wall), Reddit (network security) 6. **YouTube thumbnails**: `img.youtube.com/vi/{VIDEO_ID}/maxresdefault.jpg` — publicly accessible, no auth needed --- ## APPENDIX: Collaboration Protocol Kitt plans → Kittoro executes → Kitt critiques → iterate **Never**: Both build the same thing independently (Assaf corrected this pattern explicitly on March 19) **Kittoro**: Critiques on staging, does NOT touch the files **Kitt**: Edits files, deploys, posts staging URLs **Canonical template**: Law. No section additions without agreement from Kitt + Kittoro + Assaf.