designmd-forge 1.2.0

package/dist/data/designs/ios-vero.md

@@ -0,0 +1,394 @@
+# Design System Inspiration of Vero (iOS)
+
+## 1. Visual Theme & Atmosphere
+
+Vero's iOS app is the anti-feed. Its entire reason to exist is a reaction against algorithmic timelines, engagement-bait, and infinite ad walls — so the design philosophy is *calm, chronological, and deliberate*. The canvas is pure true-black (`#000000`), not a charcoal, because Vero presents content like a gallery wall: an OLED-deep void around full-bleed photography so the image is the only light in the room. There are no trending modules, no "for you" reshuffling, no read-receipts pressure. The feed is **strictly chronological — newest first, never reordered** — and that promise is itself a design principle: nothing in the UI implies an algorithm is choosing for you.
+
+The signature creation moment is the **7 post-type selector**. Unlike single-purpose social apps, Vero treats a "post" as one of seven distinct, first-class media types — **Photo, Video, Link, Music, Film, Book, Place** — each with its own icon, its own composer, and its own card rendering in the feed. A book post shows a cover + author + star rating; a music post shows album art + track; a place post shows a pin + map; a film post shows a poster + your rating. This typed-post system is the structural soul of Vero and the most recognizable interaction: the horizontal row of seven icons that opens the compose flow. The second signature surface is the **chronological feed itself** — uniform, quiet post cards separated by hairline `#232325` dividers, each headed by a circular avatar, the author's name, and a small colored post-type chip that tells you *what kind* of thing you're looking at before you read a word.
+
+Color is austere and singular. There is exactly one brand expression: a **teal→blue gradient** (`#00D1C1 → #0079D3`) that appears on the wordmark, the primary "Post" CTA, the compose ring in the tab bar, and active states. A flat teal (`#00C2B8`) carries small accents — the liked heart, the active post-type icon, links. There is no second brand color; the only other saturated hue is a restrained camera-amber (`#E8B23A`) for star ratings on book/film posts, nodding to Vero's photographer-and-film-buff audience. Text is pure white (`#FFFFFF`) for names and titles, a soft gray (`#9A9AA0`) for captions, and a quiet gray (`#5E5E64`) for metadata. Typography is **Manrope** — a clean, modern geometric sans with a slightly humanist warmth — sized for unhurried reading: 18pt author names, 14pt captions, generous line height, nothing aggressive.
+
+**Key Characteristics:**
+- True-black canvas (`#000000`) — OLED-deep, gallery-wall presentation; surfaces lift only to `#0E0E10` / `#161618`
+- **Strictly chronological feed** — newest first, never reordered, no algorithm, no trending — a design promise
+- **7 first-class post types** — Photo / Video / Link / Music / Film / Book / Place — each with its own icon, composer, and card
+- Post-type chip on every post — a small teal label that says *what kind* of content before you read it
+- Single brand expression — a teal→blue gradient (`#00D1C1 → #0079D3`) on wordmark, Post CTA, compose ring, active states
+- Flat teal (`#00C2B8`) for small accents — liked heart, active type icon, links
+- Camera-amber (`#E8B23A`) star ratings — the only other saturated hue, for book/film posts
+- Manrope typography sized for unhurried reading — 18pt author, 14pt caption, generous leading
+- Uniform quiet post cards separated by hairline `#232325` dividers — content, not chrome
+- A center compose action in the tab bar with the gradient ring — opens the 7-type picker
+
+## 2. Color Palette & Roles
+
+### Primary (Interactive)
+- **Brand Gradient** (`#00D1C1 → #0079D3`, 135°): The single brand expression — wordmark, primary "Post" CTA, compose ring, gradient fills.
+- **Vero Teal** (`#00C2B8`): Flat accent — liked hearts, active post-type icons, active tab tint, links, focus rings.
+- **Vero Blue** (`#0098E6`): Secondary flat accent / the blue end of the gradient when a flat blue is needed.
+- **Gradient Stop A** (`#00D1C1`): Teal end (top-left).
+- **Gradient Stop B** (`#0079D3`): Blue end (bottom-right).
+- **Teal Pressed** (`#00A89F`): Pressed state for flat teal elements.
+
+### Canvas & Surfaces (Dark — primary mode)
+- **True Black** (`#000000`): The app background — pure black, gallery void, OLED-deep.
+- **Surface 1** (`#0E0E10`): Embedded cards (book/music/place post inner cards), sheets — barely lifted.
+- **Surface 2** (`#161618`): Composer fields, pickers, pressed list rows.
+- **Divider** (`#232325`): Hairline separators between posts and sections — the primary structural line.
+- **Overlay Scrim** (`rgba(0,0,0,0.6)`): Dim behind modals/sheets.
+
+### Canvas & Surfaces (Light — secondary, rare)
+Vero is true-black-first; a light mode exists for accessibility/parity.
+
+| Role | Light Mode | Dark Mode |
+|------|-----------|-----------|
+| Canvas | `#FFFFFF` | `#000000` |
+| Surface 1 | `#F6F6F7` | `#0E0E10` |
+| Surface 2 | `#ECECEE` | `#161618` |
+| Divider | `#E4E4E6` | `#232325` |
+| Text Primary | `#0B0B0C` | `#FFFFFF` |
+| Text Secondary | `#6A6A70` | `#9A9AA0` |
+
+### Text
+- **Text Primary** (`#FFFFFF`): Author names, post titles, screen titles — pure white.
+- **Text Secondary** (`#9A9AA0`): Captions, descriptions, body — soft gray.
+- **Text Tertiary** (`#5E5E64`): Timestamps, counts, metadata, inactive tab labels — quiet gray.
+- **Text on Gradient** (`#FFFFFF`): On the teal→blue gradient (white reads well on both ends).
+
+### Accent & Ratings
+- **Camera Amber** (`#E8B23A`): Star ratings on Book and Film posts only — a nod to the film-buff audience. Never a generic warning.
+- **On-Amber Ink** (`#1A1206`): Text/glyph on amber chips.
+
+### Semantic
+- **Success** (`#2ECC71`): Post-published toast, "Connected" confirmation.
+- **Error** (`#FF4D4F`): Failed post, destructive confirm, validation.
+- **Warning** (`#E8B23A`): Reuses Camera Amber for soft warnings (consistent palette discipline).
+- **Connection Teal** (`#00C2B8`): "Connection request" / relationship-tier accents (Vero's Close Friends / Friends / Acquaintances / Followers model).
+
+## 3. Typography Rules
+
+### Font Family
+- **Primary**: `Manrope` (by Mikhail Sharanda / Mirko Velimirović, SIL OFL) — a clean modern geometric sans with subtle humanist warmth and excellent screen rendering. Closest free Google Font to Vero's calm, modern product type.
+- **Fallback Stack**: `-apple-system, BlinkMacSystemFont, 'SF Pro Display', 'SF Pro Text', 'Segoe UI', Roboto, Helvetica, Arial, sans-serif`
+- **Numerals**: Tabular figures for counts and timestamps so the post action row doesn't shift.
+
+### Hierarchy
+
+| Role | Font | Size | Weight | Line Height | Letter Spacing | Notes |
+|------|------|------|--------|-------------|----------------|-------|
+| Display | Manrope | 32pt | 800 | 1.15 | -0.4pt | Top-level "Feed" / wordmark scale |
+| Screen Title | Manrope | 26pt | 700 | 1.2 | -0.3pt | "Discover", section landings |
+| Section Header | Manrope | 22pt | 700 | 1.25 | -0.2pt | "People you follow" |
+| Post Author | Manrope | 18pt | 700 | 1.3 | -0.1pt | Author name in the post head (often shown 14pt in compact lists) |
+| Post Author (Compact) | Manrope | 14pt | 700 | 1.3 | 0pt | Author name in feed card |
+| Title | Manrope | 15pt | 600 | 1.35 | 0pt | Book/film/music titles inside typed cards |
+| Caption / Body | Manrope | 14pt | 500 | 1.5 | 0pt | Post captions, descriptions |
+| Body (Reading) | Manrope | 14pt | 400 | 1.6 | 0pt | Long captions, comments |
+| Metadata | Manrope | 13pt | 400 | 1.4 | 0pt | "Photo · 14m ago", counts |
+| Button | Manrope | 15pt | 700 | 1.0 | 0.2pt | Primary/secondary buttons |
+| Type Label | Manrope | 11pt | 600 | 1.0 | 0.4pt | Post-type chip / selector labels |
+| Star Rating | Manrope | 11pt | 600 | 1.0 | 1.0pt | ★★★★★ amber rating row |
+| Tab Label | Manrope | 10pt | 500 | 1.0 | 0pt | Bottom tab labels |
+| Overline | Manrope | 11pt | 600 | 1.0 | 0.4pt | Uppercase section overlines |
+
+### Principles
+- **Unhurried reading**: type is calm — author at 14–18pt, captions at 14pt with 1.5 line height, never crowded.
+- **Weight for hierarchy**: 700 for names/titles, 500 for captions, 400 for long reading; 800 reserved for the single Display.
+- **Metadata recedes**: 13pt `#5E5E64` keeps "Photo · 14m" present but never competing with the image.
+- **The type chip is meaningful**: the 11pt teal post-type label is a functional signpost, not decoration.
+- **Dynamic Type**: titles, captions, body scale; type labels, tab labels, star ratings stay fixed (layout-critical).
+
+## 4. Component Stylings
+
+### Buttons
+
+**Primary Button (Post / Publish)**
+- Shape: Full pill, 999pt corner radius
+- Background: linear gradient `#00D1C1 → #0079D3` (135°)
+- Text: `#FFFFFF`, Manrope 15pt weight 700
+- Padding: 13pt vertical, 28pt horizontal
+- Pressed: `filter: brightness(0.94)` + scale 0.98
+- Disabled: gradient at 40% opacity, text at 60%
+
+**Outline Button (Connect / Follow primary)**
+- Background: transparent
+- Border: 1.5pt `#00C2B8`
+- Text: `#00C2B8`, Manrope 14pt weight 700
+- Padding: 11pt vertical, 22pt horizontal
+- Corner radius: 999pt
+- Pressed: background `rgba(0,194,184,0.10)`
+
+**Ghost / Surface Button (Follow secondary)**
+- Background: `#161618`
+- Border: 1pt `#232325`
+- Text: `#FFFFFF`, Manrope 14pt weight 600
+- Corner radius: 999pt (Vero favors full pills)
+- Pressed: background `#232325`
+
+**Text Button (See all post types)**
+- Text: `#00C2B8`, Manrope 14pt weight 600
+- No background, no underline
+- Pressed: 70% opacity
+
+### Core Atoms
+
+**Avatar**
+- Circle, 38pt in feed (28pt in lists, 80pt on profile)
+- Fallback: brand gradient `#00D1C1 → #0079D3`
+- Relationship ring (optional): 1.5pt — teal for Close Friends, gray otherwise
+
+**Post Card**
+- No card border or background — posts sit directly on `#000000`, separated only by a 0.5pt `#232325` divider
+- Padding: 16pt horizontal, 16pt top / 14pt bottom
+- Media corner radius: 10pt
+- This "no card chrome" choice is core to the gallery-wall feel
+
+**Post-Type Chip (in post head)**
+- Inline, no background
+- Leading 11pt type icon + label, both `#00C2B8`
+- Manrope 10–11pt weight 700
+- Followed by " · {timestamp}" in `#5E5E64`
+
+**Typed Inner Card (Book / Music / Film / Place)**
+- Background: `#0E0E10`, 1pt `#232325` border, 10pt radius, 12pt padding
+- Book: 56×80pt cover + title (15pt w600) + author (12pt `#9A9AA0`) + amber stars
+- Music: 56×56pt album art + track + artist + play glyph
+- Place: map thumbnail + place name + teal pin
+- Film: poster + title + your rating (amber stars)
+
+**Media (Photo / Video)**
+- Aspect ratio: respects original (commonly 4:5 portrait), 10pt corners
+- Video: teal play affordance center, duration chip bottom-right
+- Never algorithmically cropped — Vero respects the photographer's frame
+
+### Navigation
+
+**Top Bar**
+- Height: 44pt + safe area
+- Leading: "VERO" wordmark — gradient-filled text, letter-spaced
+- Trailing: search glyph + notifications bell, 21pt `#FFFFFF`, 1.8pt stroke
+- Background: `#000000`, 0.5pt `#232325` bottom border only when scrolled
+
+**Post-Type Selector Row (under top bar OR as compose sheet)**
+- Horizontal row of all 7 types: Photo, Video, Link, Music, Film, Book, Place
+- Each: 19pt icon + 9–11pt label, evenly distributed
+- Inactive: `#5E5E64`; active/selected: `#00C2B8`
+- 0.5pt `#232325` bottom border
+
+**Bottom Tab Bar**
+- Height: 50pt + safe area (66pt visual)
+- Background: `rgba(0,0,0,0.96)` + `saturate(180%) blur(20px)`
+- Top border: 0.5pt `#232325`
+- 5 slots: Feed, Discover, **Compose (center, gradient ring)**, Inbox, Profile
+- Icon size: 22pt (Compose center 27pt with gradient stroke ring)
+- Active color: `#00C2B8` (icons fill); inactive: `#5E5E64`
+- Labels: Manrope 10pt weight 500 (Compose label blank — icon-only)
+
+**Profile Header**
+- 80pt avatar, name 22pt weight 700, relationship-tier control (Close Friends / Friends / Acquaintances / Followers)
+- Tab strip: "Posts", "Collections", "About" — underlined 2pt teal active
+
+### Input Fields
+
+**Search Field**
+- Height: 44pt
+- Background: `#161618`
+- Border: none (focus: 1.5pt `#00C2B8`)
+- Corner radius: 999pt (pill search) or 12pt
+- Leading magnifier 16pt `#5E5E64`
+- Placeholder: "Search people, posts" Manrope 14pt `#5E5E64`
+
+**Caption Composer**
+- Background: `#000000` (full-screen compose) with `#232325` field outline
+- Text Manrope 16pt `#FFFFFF`
+- Placeholder varies by type: "Write a caption…", "What did you think of this book?"
+
+### Distinctive Components
+
+**7 Post-Type Selector (the signature)**
+- Compose entry shows a grid/row of seven equally weighted cells: Photo, Video, Link, Music, Film, Book, Place
+- Cell: icon (20pt) + label (10pt w600), `#0E0E10` bg, 1pt `#232325` border, 12pt radius
+- Selected cell: border `#00C2B8`, content `#00C2B8`, background `rgba(0,194,184,0.08)`
+- This is the structural heart of Vero — all seven are first-class, none is "primary"
+
+**Chronological Feed Promise**
+- The feed is strictly newest-first; surface a quiet "Caught up" / chronological indicator rather than any "suggested for you" rail
+- No engagement-driven reordering, no algorithmic insertions
+
+**Post Action Row**
+- Like (heart), Comment (bubble), Share (tray) — 19pt icons `#9A9AA0`, count Manrope 12pt w600
+- Liked: heart fills `#00C2B8`
+- Evenly spaced with 22pt gaps, no background
+
+**Relationship Tier Selector** (Vero's signature privacy model)
+- When following: choose Close Friends / Friends / Acquaintances / Followers
+- A segmented or list control; selected tier highlighted teal
+- Governs who sees each post — surfaced at post time too
+
+**Compose Ring (tab bar center)**
+- A circle with a gradient stroke (`#00D1C1 → #0079D3`) and a `+` glyph
+- Tapping opens the 7-type selector
+- The brand gradient's most prominent placement
+
+**Book / Film Rating Stars**
+- Five stars, filled in Camera Amber `#E8B23A`
+- Manrope-spaced, 11pt, 1pt letter-spacing
+- The only amber in the product — film-buff/reader signal
+
+## 5. Layout Principles
+
+### Spacing System
+- Base unit: 4pt
+- Scale: 4, 8, 12, 14, 16, 20, 24, 32, 40, 48
+- Screen horizontal inset: 16pt
+- Post top padding 16pt / bottom 14pt; media-to-caption gap 12pt
+- Post-type selector cell gap: 10pt
+
+### Grid & Container
+- iPhone: single column, 16pt insets, full-width media
+- Posts: no card frame — full-bleed within insets, divided by hairlines
+- iPad: single centered column (max-width ~620pt) — Vero stays single-stream even on large screens (anti-grid, pro-reading)
+- Profile collections: 3-up thumbnail grid
+
+### Whitespace Philosophy
+- **Gallery wall**: generous black around every image; the photo is the light source
+- **No card chrome**: posts are separated by hairlines, not boxes — content is the interface
+- **One brand expression, used sparingly**: the gradient appears on the wordmark, Post CTA, and compose ring only
+- **Calm rhythm**: uniform post structure, consistent quiet metadata — nothing competes for attention
+
+### Border Radius Scale
+- Square (0pt): dividers, full-bleed media edges
+- Subtle (4pt): book/album-cover thumbnails, small tags
+- Standard (8pt): small chips
+- Media (10pt): photo/video, typed inner cards
+- Comfortable (14pt): composer surfaces, pickers
+- Sheet (20pt): bottom sheets, modals
+- Pill (500pt): all buttons, search, type chips — Vero strongly favors pills
+- Circle (50%): avatars, the compose ring
+
+## 6. Depth & Elevation
+
+Vero is profoundly flat — true-black with hairline structure. There is essentially no elevation in content; depth exists only for transient floating surfaces.
+
+| Level | Treatment | Use |
+|-------|-----------|-----|
+| Flat (Level 0) | No shadow, hairline `#232325` only | Posts, feed, profile content |
+| Inset Card (Level 0.5) | `#0E0E10` fill + 1pt `#232325` border, no shadow | Book/music/film/place inner cards |
+| Floating (Level 1) | `rgba(0,0,0,0.6) 0 8px 24px` + 1pt `#232325` | Context menus, type picker popover, toasts |
+| Sheet (Level 2) | `rgba(0,0,0,0.7) 0 -6px 28px` + 20pt top radius | Compose sheet, share sheet, relationship picker |
+| Modal Scrim | `rgba(0,0,0,0.6)` | Dim behind sheets/modals |
+
+**Shadow Philosophy**: On a true-black canvas, shadows are invisible — so Vero structures the screen with *hairlines and barely-lifted surfaces* (`#0E0E10`), never elevation. Floating elements get a heavy `0.6–0.7` shadow plus a `#232325` hairline so they're distinguishable against the void. The product's flatness is intentional: a calm, document-like surface with no Material-style layering.
+
+### Motion
+- **Post-type select**: cell border + content tint to teal over 160ms ease-out; soft haptic
+- **Compose sheet**: slides up 300ms ease-out from the gradient ring; scrim fades in parallel
+- **Like**: heart scales 1.0 → 1.2 → 1.0 over 240ms spring, fills `#00C2B8`; soft haptic
+- **Feed refresh**: pull triggers a teal spinner; new posts insert at top with a 220ms fade (never reshuffle existing)
+- **Tab switch**: cross-fade content 200ms; active icon tints teal instantly
+- **Relationship tier change**: segmented selection slides 180ms; selected pill tints teal
+- **Image load**: cross-fade from `#0E0E10` placeholder to image over 220ms
+- **Connect/Follow**: button label cross-fades 180ms; outline → filled state
+- **Haptics**: soft impact on post-type select, like, connect; selection tick on tab change
+
+## 7. Do's and Don'ts
+
+### Do
+- Use pure true-black (`#000000`) as the canvas — Vero is a gallery wall, OLED-deep
+- Keep the feed strictly chronological, newest-first — it's a design promise, not just a setting
+- Treat all 7 post types (Photo/Video/Link/Music/Film/Book/Place) as equal, first-class citizens
+- Show the teal post-type chip on every post so the *kind* of content is legible before reading
+- Use the teal→blue gradient (`#00D1C1 → #0079D3`) sparingly — wordmark, Post CTA, compose ring, active
+- Separate posts with hairline `#232325` dividers — no card boxes
+- Use flat teal (`#00C2B8`) for small accents — liked hearts, active icons, links
+- Reserve Camera Amber (`#E8B23A`) for book/film star ratings only
+- Favor full pills (999pt) for buttons, search, chips
+- Keep type calm — Manrope, 14pt captions with 1.5 line height, unhurried
+
+### Don't
+- Don't use charcoal (`#0E0E10` is for inset cards, not the canvas) — the canvas is pure `#000000`
+- Don't add a "trending", "for you", or "suggested" rail — Vero is explicitly anti-algorithm
+- Don't reorder the feed by engagement — newest-first, always; new posts insert at top
+- Don't privilege one post type over the others — all seven are co-equal
+- Don't add a second brand color — there is only the teal→blue gradient and flat teal
+- Don't reuse Camera Amber for warnings or decoration — it means "rating", nothing else
+- Don't wrap posts in card boxes/shadows — hairline dividers on true-black only
+- Don't use heavy drop shadows on content — they're invisible on black; use hairlines + barely-lifted surfaces
+- Don't crowd captions — 14pt with generous 1.5 leading; calm over dense
+- Don't crop photos algorithmically — respect the photographer's original frame
+
+## 8. Responsive Behavior
+
+### Device Sizes
+| Device | Width | Key Changes |
+|--------|-------|-------------|
+| iPhone SE (3rd gen) | 375pt | Post-type selector scrolls horizontally if cramped; 14pt author |
+| iPhone 13/14/15 | 390pt | Standard layout — all 7 type icons fit the row |
+| iPhone 15/16 Pro | 393pt | Dynamic Island accommodated in top bar |
+| iPhone 15/16 Pro Max | 430pt | Larger media; 38pt avatars; comfortable 7-type row |
+| iPad (portrait) | 768pt | Single centered stream (max ~620pt) — NOT a grid; Vero stays single-column |
+| iPad (landscape) | 1024pt+ | Same centered single stream; optional left rail for nav only |
+
+### Dynamic Type
+- Scales: screen titles, author names, captions, body, descriptions
+- Fixed: post-type labels, tab labels, star ratings, type chips (layout-critical)
+- Long captions expand inline with a "more" toggle
+
+### Orientation
+- Portrait-first (a reading/gallery app)
+- Landscape supported; media scales to fit, single stream maintained
+- iPad Split View supported; stream stays centered and single-column
+
+### Touch Targets
+- Post-type selector cell: full cell tappable, ≥ 56pt
+- Tab bar items: 22pt glyph, 48pt hit; compose ring 27pt glyph / 56pt hit
+- Like/Comment/Share: 44pt hit each
+- Buttons: ≥ 36pt tall (pills)
+
+### Safe Area Handling
+- Top: top bar + Dynamic Island respected
+- Bottom: tab bar + home indicator respected; compose sheet respects bottom inset
+- Sides: 16pt content inset; media full-bleed within insets
+- Keyboard: caption composer rises above keyboard; feed scrolls clear
+
+## 9. Agent Prompt Guide
+
+### Quick Color Reference
+- Canvas (dark): `#000000`
+- Surface 1: `#0E0E10`
+- Surface 2: `#161618`
+- Divider: `#232325`
+- Text primary: `#FFFFFF`
+- Text secondary: `#9A9AA0`
+- Text tertiary / metadata: `#5E5E64`
+- Brand gradient: `#00D1C1 → #0079D3` (135°)
+- Vero Teal (flat accent): `#00C2B8`
+- Vero Blue: `#0098E6`
+- Teal pressed: `#00A89F`
+- Camera Amber (ratings only): `#E8B23A`
+- Success: `#2ECC71` · Error: `#FF4D4F`
+
+### Example Component Prompts
+- "Build the Vero 7 post-type selector in SwiftUI: a row (or 4×2 grid) of seven equally weighted cells — Photo, Video, Link, Music, Film, Book, Place. Each cell: a 20pt SF Symbol + a Manrope 10pt weight 600 label, `#0E0E10` background, 1pt `#232325` border, 12pt corner radius, content color `#5E5E64`. The selected cell: border `#00C2B8`, content `#00C2B8`, background `rgba(0,194,184,0.08)`. No type is primary — all seven are co-equal. Tapping a cell tints it over 160ms ease-out with a soft haptic."
+
+- "Create a Vero feed post card: no card box — it sits directly on `#000000`, separated from the next post only by a 0.5pt `#232325` bottom divider, 16pt horizontal padding, 16pt top / 14pt bottom. Head: 38pt circular avatar (brand-gradient `#00D1C1 → #0079D3` fallback), author name Manrope 14pt weight 700 `#FFFFFF`, and a meta line: a teal post-type chip (11pt icon + 10pt weight 700 label, both `#00C2B8`) followed by ' · 14m' in `#5E5E64`, with a trailing '···' more glyph. Media at 10pt corner radius respecting original aspect. Caption Manrope 14pt weight 500 `#9A9AA0`, 1.5 line height. Action row: Like / Comment / Share, 19pt `#9A9AA0` icons with 12pt counts, 22pt gaps; liked heart fills `#00C2B8`."
+
+- "Build a Vero Book post inner card: `#0E0E10` background, 1pt `#232325` border, 10pt corner radius, 12pt padding. Left: a 56×80pt cover (4pt radius). Right: title Manrope 15pt weight 600 `#FFFFFF`, author Manrope 12pt `#9A9AA0`, and a 5-star rating row in Camera Amber `#E8B23A` (Manrope 11pt, 1pt letter-spacing)."
+
+- "Create the Vero bottom tab bar: 50pt + safe area, background `rgba(0,0,0,0.96)` with `saturate(180%) blur(20px)`, 0.5pt `#232325` top border. Five slots: Feed, Discover, Compose (center — a 27pt circle with a 2pt gradient stroke `#00D1C1 → #0079D3` and a `+` glyph, no label), Inbox, Profile. Inactive icons 22pt `#5E5E64`; active icon fills `#00C2B8`. Labels Manrope 10pt weight 500. Tapping Compose opens the 7 post-type selector sheet."
+
+- "Create the Vero primary 'Post' button: a full pill (999pt radius) filled with a 135° linear gradient `#00D1C1 → #0079D3`, white Manrope 15pt weight 700 text, 13pt vertical / 28pt horizontal padding. Pressed: brightness 0.94 + scale 0.98. Disabled: gradient at 40% opacity."
+
+- "Build the Vero 'VERO' wordmark: uppercase Manrope weight 800, ~2pt letter-spacing, filled with the 135° teal→blue gradient `#00D1C1 → #0079D3` (gradient-clipped text), left-aligned in the top bar."
+
+### Iteration Guide
+1. Canvas is PURE true-black `#000000` — NOT charcoal, NOT `#0E0E10` (that's for inset cards) — a gallery void
+2. The feed is strictly chronological — newest-first, never reordered; no "for you", no trending — this is a design promise
+3. There are exactly 7 first-class post types (Photo/Video/Link/Music/Film/Book/Place) — none is primary, all co-equal
+4. Every post shows a teal post-type chip so the *kind* of content is legible before reading
+5. There is ONE brand expression: the teal→blue gradient `#00D1C1 → #0079D3` — wordmark, Post CTA, compose ring, active
+6. Flat teal `#00C2B8` carries small accents — liked hearts, active icons, links
+7. Camera Amber `#E8B23A` is for book/film star ratings ONLY — never a warning or decoration
+8. Posts have NO card box — hairline `#232325` dividers on true-black; content is the interface
+9. Favor full pills (999pt) for buttons, search, chips; Manrope at calm, unhurried sizes
+10. No heavy shadows — they're invisible on black; structure with hairlines + barely-lifted `#0E0E10` surfaces