---
version: alpha
name: "Prada"
description: "Industrial-modernist luxury system built on a stark black-and-white canvas, a single classical serif, and the kind of typographic authority that treats decoration as weakness."

colors:
  # Surface / canvas
  background: "#ffffff"              # pure white — the only page canvas
  surface: "#f4f4f4"                 # faint cool step used for secondary fills and hover backgrounds /* estimated */

  # Ink / text
  ink: "#000000"                     # absolute black — primary text, logo, navigation
  ink-muted: "#666666"               # secondary labels, metadata, captions /* estimated */
  ink-ghost: "#b3b3b3"               # placeholder text, disabled states, fine print /* estimated */

  # Brand accent — Prada is achromatic; black carries every accent role
  primary: "#000000"                 # CTA fill, primary button — pure black
  on-primary: "#ffffff"              # text on black CTA surface

  # Interactive states (all rgba flattened to opaque hex)
  primary-hover: "#1a1a1a"           # button hover: near-black softening /* was rgba(0,0,0,0.9) — Google format requires hex */
  text-hover: "#000000"              # link hover deepens to absolute black

  # Semantic
  error: "#cc0000"                   # form validation, required field markers /* estimated */

  # Borders
  border: "#000000"                  # hairline rules on inputs, button outlines, structural dividers
  border-subtle: "#e0e0e0"           # light section rules, resting input underlines /* estimated */

  # Shadow tints
  shadow-soft: "#cccccc"             # was rgba(0,0,0,0.15) — modals, slide-in panels /* estimated */

typography:
  display-hero:
    fontFamily: "Linotype Didot, Didot, Georgia, serif"
    fontSize: 72px
    fontWeight: 400
    lineHeight: 1.0
    letterSpacing: 0.02em
  display:
    fontFamily: "Linotype Didot, Didot, Georgia, serif"
    fontSize: 48px
    fontWeight: 400
    lineHeight: 1.05
    letterSpacing: 0.02em
  heading-section:
    fontFamily: "Helvetica Neue, Helvetica, Arial, sans-serif"
    fontSize: 18px
    fontWeight: 400
    lineHeight: 1.3
    letterSpacing: 0.06em
  heading-sub:
    fontFamily: "Helvetica Neue, Helvetica, Arial, sans-serif"
    fontSize: 14px
    fontWeight: 400
    lineHeight: 1.4
    letterSpacing: 0.08em
  body-large:
    fontFamily: "Helvetica Neue, Helvetica, Arial, sans-serif"
    fontSize: 16px
    fontWeight: 400
    lineHeight: 1.7
    letterSpacing: 0.02em
  body:
    fontFamily: "Helvetica Neue, Helvetica, Arial, sans-serif"
    fontSize: 13px
    fontWeight: 400
    lineHeight: 1.65
    letterSpacing: 0.02em
  nav-link:
    fontFamily: "Helvetica Neue, Helvetica, Arial, sans-serif"
    fontSize: 12px
    fontWeight: 400
    lineHeight: 1.0
    letterSpacing: 0.1em
  button-ui:
    fontFamily: "Helvetica Neue, Helvetica, Arial, sans-serif"
    fontSize: 11px
    fontWeight: 400
    lineHeight: 1.0
    letterSpacing: 0.12em
  caption:
    fontFamily: "Helvetica Neue, Helvetica, Arial, sans-serif"
    fontSize: 10px
    fontWeight: 400
    lineHeight: 1.5
    letterSpacing: 0.06em

spacing:
  xs: 4px
  sm: 8px
  md: 16px
  lg: 24px
  xl: 40px
  2xl: 64px
  3xl: 96px
  4xl: 128px

rounded:
  none: 0px              # buttons, cards, inputs, image frames — the universal default
  pill: 9999px           # cookie-consent toggles and circular icon controls only

components:
  button-primary:
    backgroundColor: "{colors.primary}"
    textColor: "{colors.on-primary}"
    typography: "{typography.button-ui}"
    rounded: "{rounded.none}"
    padding: 14px 28px
    border: "1px solid {colors.border}"
    textTransform: uppercase
  button-primary-hover:
    backgroundColor: "{colors.primary-hover}"
    textColor: "{colors.on-primary}"
    border: "1px solid {colors.primary-hover}"

  button-secondary:
    backgroundColor: "{colors.background}"
    textColor: "{colors.ink}"
    typography: "{typography.button-ui}"
    rounded: "{rounded.none}"
    padding: 14px 28px
    border: "1px solid {colors.border}"
    textTransform: uppercase
  button-secondary-hover:
    backgroundColor: "{colors.surface}"
    textColor: "{colors.ink}"
    border: "1px solid {colors.border}"

  button-ghost:
    backgroundColor: "transparent"
    textColor: "{colors.ink}"
    typography: "{typography.button-ui}"
    rounded: "{rounded.none}"
    padding: 0px
    borderBottom: "1px solid {colors.border}"
    textTransform: uppercase
  button-ghost-hover:
    textColor: "{colors.primary-hover}"
    borderBottom: "1px solid {colors.primary-hover}"

  card:
    backgroundColor: "{colors.background}"
    textColor: "{colors.ink}"
    rounded: "{rounded.none}"
    padding: 0px

  input:
    backgroundColor: "{colors.background}"
    textColor: "{colors.ink}"
    typography: "{typography.body}"
    rounded: "{rounded.none}"
    padding: 12px 0px
    borderBottom: "1px solid {colors.border-subtle}"
  input-focus:
    borderBottom: "1px solid {colors.border}"
    outline: "1px solid {colors.border}"

  nav-bar:
    backgroundColor: "{colors.background}"
    textColor: "{colors.ink}"
    typography: "{typography.nav-link}"
    padding: 20px 0px
    textTransform: uppercase

  badge:
    backgroundColor: "{colors.background}"
    textColor: "{colors.ink-muted}"
    typography: "{typography.caption}"
    rounded: "{rounded.none}"
    padding: 2px 6px
    textTransform: uppercase
---

# Prada Design System

## Overview

Prada's digital presence is intellectual luxury rendered in the most severe possible canvas. The background is pure white (`{colors.background}`), the ink is absolute black (`{colors.ink}`), and nothing sits between those two poles except photography and negative space. This is not the warm near-black of The Row or the tobacco-brown restraint of Louis Vuitton — Prada commits to maximum contrast, maximum tension, and zero apology. The inverted triangle mark that defines the brand's physical identity translates digitally into a system so stripped of ornament that the absence of decoration becomes the decoration itself.

The typographic strategy is the system's most sophisticated move: campaign and editorial display text is set in **Linotype Didot**, a classical high-contrast serif with dramatically thin hairline strokes and sharp wedge serifs that read simultaneously as haute couture and industrial-era precision. UI chrome — navigation, buttons, labels, captions — is set in **Helvetica Neue** at small sizes with generous positive letter-spacing. The collision of a nineteenth-century classical serif with a mid-century Swiss grotesque is not accidental: it is the exact tension Miuccia Prada courts in collections that pair utilitarian nylon with baroque embroidery. The typefaces argue, and that argument is the identity.

Color is structurally absent. No chromatic accent has ever appeared in Prada's core digital system — `{colors.primary}` (pure black) and `{colors.on-primary}` (white) constitute the entire interactive palette. Hover states, focus rings, active markers: all operate within the black-to-white binary. The closest the system gets to color is in seasonal campaign photography, where the brand's chosen Pantone-adjacent palette lives entirely within the image frame, never bleeding into chrome. This absolutism means that `{colors.ink}` and `{colors.background}` must carry every navigational, structural, and expressive burden in the interface — a constraint the system wears as a credential.

**Key Characteristics:**
- Pure white canvas (`{colors.background}`) — absolute, never tinted, no dark-mode variant in baseline system
- Absolute black (`{colors.ink}`) for all text, navigation, and CTA fills — no warm offset, no charcoal approximation
- Dual-typeface strategy: `{typography.display-hero}` Linotype Didot for editorial and campaign display; Helvetica Neue for all UI chrome
- Upper-case Helvetica Neue navigation at `{typography.nav-link}` (12px, `0.1em` tracking) — restrained, architectural
- Positive letter-spacing on all UI type — `{typography.button-ui}` at `0.12em`, nav at `0.1em` — authority through spacing, not size
- Zero border-radius on every UI element (`{rounded.none}`) — buttons, cards, inputs, and image frames are always hard-cornered
- Bottom-border-only inputs: `1px solid {colors.border-subtle}` underline at rest, upgrading to `{colors.border}` black on focus
- No shadows, no gradients, no hover lifts — the flat canvas is structural, not accidental
- Photography is always editorial in character: stark studio light, plain colored sweeps, or exterior environments that feel art-directed
- Section spacing is operatic — vertical gaps at `{spacing.3xl}` and `{spacing.4xl}` — the whitespace budget reflects the physical retail experience of a Prada flagship interior

## Colors

### Surface & Canvas
- **White** (`{colors.background}`): The only page background. Prada does not tint, alternate, or vary the canvas — white is unconditional.
- **Cool Surface** (`{colors.surface}`): A barely perceptible cool step used for hover fills on outline buttons and secondary section treatments. /* estimated */

### Ink / Text
- **Absolute Black** (`{colors.ink}`): Primary text, the triangle wordmark, all navigation links, product names, and prices. Pure `#000000` — Prada does not use a warmer near-black; the graphic severity is intentional.
- **Muted Ink** (`{colors.ink-muted}`): Secondary descriptors — image captions, product metadata, filter labels, size availability. /* estimated */
- **Ghost Ink** (`{colors.ink-ghost}`): Placeholder text, disabled states, fine-print legal copy. The system's lowest-contrast tier. /* estimated */

### Brand Accent
- **Black CTA** (`{colors.primary}`): The button fill and all interactive accent surfaces. Prada has no chromatic brand color — `{colors.ink}` and `{colors.primary}` are the same absolute black, and that is a deliberate statement.
- **White on Black** (`{colors.on-primary}`): Button label text on the black primary surface.

### Text States
- **Hover Deepening** (`{colors.text-hover}`): Link hover arrives at absolute black — the maximum contrast state, not a tinted hover color.
- **Button Hover** (`{colors.primary-hover}`): A near-imperceptible darkening of the primary fill — the system registers interaction without introducing hue.

### Semantic
- **Error Red** (`{colors.error}`): Form validation indicators and required-field markers. The only color in the system that is not black or white. /* estimated */

### Borders
- **Structural Border** (`{colors.border}`): 1px rules on button outlines and input focus states — pure black.
- **Subtle Divider** (`{colors.border-subtle}`): Light hairline for resting input underlines and section rules. /* estimated */

## Typography

### Font Family
- **Display / Editorial**: `Linotype Didot`, with fallbacks: `Didot, Georgia, serif`. A classical high-contrast serif — deeply cut hairlines, sharp wedge serifs, dramatic stroke contrast. Used exclusively for display-scale editorial and campaign headlines. The face carries the brand's intellectual luxury signal.
- **UI / Chrome**: `Helvetica Neue`, with fallbacks: `Helvetica, Arial, sans-serif`. The modernist Swiss grotesque for all navigation, button labels, body text, and captions. A deliberate counterpoint to the Didot display voice.
- **OpenType Features**: No stylistic alternates or optical sizes invoked beyond defaults. Letter-spacing is controlled entirely via `letter-spacing` declarations, not OpenType kerning pairs.

### Hierarchy

| Token | Use |
|---|---|
| `display-hero` | 72px Linotype Didot — campaign editorial openers, collection launch headlines, seasonal feature moments |
| `display` | 48px Linotype Didot — secondary editorial modules, collection category headings, feature section titles |
| `heading-section` | 18px Helvetica Neue — primary UI section titles, category labels, product segment openers |
| `heading-sub` | 14px Helvetica Neue — sub-navigation headings, panel titles, filter group labels |
| `body-large` | 16px Helvetica Neue — editorial paragraphs, collection descriptions, expanded product copy |
| `body` | 13px Helvetica Neue — product descriptions, form labels, running body copy |
| `nav-link` | 12px Helvetica Neue uppercase — top navigation, footer link lists |
| `button-ui` | 11px Helvetica Neue uppercase — CTA labels, secondary action labels |
| `caption` | 10px Helvetica Neue — size selectors, color swatch labels, image credits, fine print |

### Principles
- **Two-typeface authority**: Didot for editorial aspiration; Helvetica Neue for system function. No third face, no substitutes, no blurring of the roles.
- **Uppercase as a register marker**: `{typography.nav-link}` and `{typography.button-ui}` are always uppercase. Body and editorial prose are sentence case. The case contract is maintained rigorously.
- **Tracking as chrome voice**: positive letter-spacing on all UI type communicates architectural deliberateness — small type spread wide reads as designed, not timid.
- **Weight restraint**: a single weight (400 regular) throughout. No bold weights, no medium weights. Emphasis is via typeface switch (Didot vs Helvetica Neue), size, and case — never weight escalation.
- **Display scale reserved for Didot**: the serif appears only above 40px. Below that threshold, Helvetica Neue handles every role. The typefaces do not share a size range.

## Layout

### Spacing System
The complete spacing scale is in the `spacing:` token block. Base unit: 8px.

Prada's pages are spaced at a fashion-editorial pace. Campaign section gaps reach `{spacing.4xl}` (128px) on large desktop — the same quality of negative space found in a Prada flagship's pale concrete interior. Product grids are generous and uncluttered. The system earns its luxury reading through spatial generosity, not ornamentation.

### Grid & Container
- Max content width: approximately 1440–1600px with symmetric outer margins
- Desktop product grid: typically 3–4 columns with `{spacing.lg}` or `{spacing.xl}` gutters, no card chrome
- Hero sections: full-bleed campaign photography with overlaid Didot display type — the image occupies the full viewport; type is positioned at edge or center
- Navigation: minimal horizontal bar; the Prada logotype and inverted-triangle mark at top-left; primary category links across the top; utility icons (search, account, bag) at top-right

### Whitespace Philosophy
- Negative space is load-bearing — it is not the gap between content but the content itself
- Photography-first composition: the editorial image occupies the frame completely; UI chrome orbits the periphery
- No decorative separators between sections — no tinted fills, no rule-bars, no background alternation

## Elevation & Depth

| Level | Treatment | Use |
|---|---|---|
| Flat (Level 0) | No shadow | Every page surface — the site is categorically flat |
| Hairline (Level 1) | `border-bottom: 1px solid {colors.border-subtle}` | Resting input underlines, light section rules |
| Input Focus (Level 1) | `border-bottom: 1px solid {colors.border}` + `outline: 1px solid {colors.border}` | Input focus state — black border upgrade only |
| Button Outline (Level 1) | `1px solid {colors.border}` | All button borders — primary, secondary, ghost |
| Panel (Level 3) | `box-shadow: 0 20px 60px {colors.shadow-soft}` | Slide-in cart drawer, account panel, cookie modal /* estimated */ |
| Focus Ring (Level 2) | `outline: 2px solid {colors.ink}` | Keyboard-focus accessibility state on interactive elements |

**Shadow Philosophy**: Prada uses shadow only to lift floating layers — drawers, modals — above the page surface. Every card, every content section, every navigation element rests flat. The brand's physical architecture (Rem Koolhaas-designed flagships, raw concrete, bare steel) provides the spatial precedent: surfaces do not simulate depth, they define planes.

## Shapes

The complete radius scale is in the `rounded:` token block.

| Token | Value | Use |
|---|---|---|
| `none` | 0px | Buttons, product cards, inputs, image frames, modals, drawers — all primary UI |
| `pill` | 9999px | Cookie-consent toggles and circular icon-button controls only |

The system is binary and uncompromising: every designed UI element is sharp-cornered. The `pill` value is a functional concession for toggle controls, not a brand language. Prada's geometric sensibility — the triangle as a structural motif, the hard edge as a philosophical position — makes any softened corner read as a mistake.

## Components

The complete component spec lives in the `components:` token block.

### Button Variants
- **`button-primary`** — `{colors.primary}` (pure black) fill, `{colors.on-primary}` white text, `{rounded.none}`, 11px Helvetica Neue uppercase at `0.12em` tracking, `1px solid {colors.border}` outline, `padding: 14px 28px`. Hover transitions fill to `{colors.primary-hover}`. The system's definitive action — "Add to Bag", "Shop the Collection".
- **`button-secondary`** — White (`{colors.background}`) fill, `{colors.ink}` text, same geometry and 1px border, identical typography. Hover fills `{colors.surface}`. Used for secondary actions — "Save to Wishlist", "Size Guide".
- **`button-ghost`** — Transparent fill, `{colors.ink}` text, `border-bottom: 1px solid {colors.border}` only. Used for inline editorial links and text-adjacent CTAs — "View Details", "Explore".

### Cards
- **`card`** — Flat white surface (`{colors.background}`), no border, no shadow, `{rounded.none}`. Product photography fills the card flush; `{typography.heading-sub}` product name and `{typography.body}` price appear below with a minimal gap. The card is a presentation frame, not a chrome container.

### Inputs
- **`input`** — White fill, `border-bottom: 1px solid {colors.border-subtle}` only, `{rounded.none}`. 13px Helvetica Neue. Focus upgrades the underline to `{colors.border}` black and adds a `1px solid` outline — no background change, no glow, no box-shadow.

### Badges / Tags
- **`badge`** — No fill, 10px uppercase Helvetica Neue in `{colors.ink-muted}`. Used for "NEW", "EXCLUSIVE", "LAST SIZES" product tile flags — typographic-only, absolute-positioned, no chip background.

### Navigation
- **`nav-bar`** — White background, `{colors.ink}` text, `{typography.nav-link}` (12px Helvetica Neue uppercase, `0.1em` tracking). Prada triangle wordmark at top-left. Hover transitions link color via `0.2s ease` — no underline animation, no background change, motion is color only.

## Do's and Don'ts

### Do
- Use `{colors.background}` pure white as the only canvas — no warm cream, no tinted sections, no dark-mode variant unless explicitly designed
- Set all display and campaign text in Linotype Didot — the serif is reserved for scale; never use it at body size
- Set all UI chrome in Helvetica Neue — navigation, buttons, captions, labels are always the grotesque voice
- Keep every UI element at `{rounded.none}` — buttons, cards, inputs, image frames are always hard-cornered
- Uppercase all navigation, button labels, and badge text — editorial and product body text stays sentence case
- Use `{colors.ink}` pure black for all primary text, CTAs, and border rules — no warm offset
- Apply positive letter-spacing to all UI type (`{typography.button-ui}` at `0.12em`, `{typography.nav-link}` at `0.1em`) — the tracking is structural
- Let campaign photography fill the viewport — type orbits the edges; the image IS the page
- Use `{spacing.3xl}` or `{spacing.4xl}` vertical gaps between major sections on desktop — negative space communicates value

### Don't
- Don't introduce any chromatic brand accent — `{colors.ink}` (black) and `{colors.on-primary}` (white) constitute the entire interactive palette
- Don't add box shadows, hover lifts, or card elevation — every surface is flat except floating drawers and modals
- Don't round any corner beyond the `{rounded.pill}` exception for functional toggles — soft corners undermine the system's philosophical position
- Don't use Didot at body size (below 40px) — it becomes illegible at small scale and blurs the role distinction with Helvetica Neue
- Don't use Helvetica Neue at display scale — the grotesque loses authority above 32px in this system
- Don't introduce a third typeface or a display serif variant — the two-face contract is the identity
- Don't increase type weight beyond 400 — emphasis is via typeface, size, and case, never bold
- Don't tighten line-height below 1.5 on body copy — the spacious reading rhythm is a quality signal, not a luxury waste
- Don't use `{colors.error}` outside of form validation — the system's only hue is not a general accent
- Don't compress section spacing — if a page feels dense, add air; never reduce `{spacing.2xl}` below 64px between content blocks

---

## Responsive Behavior

### Breakpoints
| Name | Width | Key Changes |
|---|---|---|
| Mobile Small | < 375px | Single-column; hamburger nav; display type scales to ~36px Didot; body at 13px |
| Mobile | 375–767px | Single-column product grid; nav collapsed to drawer; hero photography full-width portrait |
| Tablet | 768–1023px | Two-column product grid; condensed nav still collapsed; wider outer margins |
| Desktop | 1024–1439px | Full horizontal nav visible; 3-column product grid; section gaps at `{spacing.3xl}` |
| Large Desktop | ≥ 1440px | 4-column product grid; max container ~1440–1600px; full `{spacing.4xl}` vertical rhythm |

### Touch Targets
- Primary buttons use 14px vertical padding — effective tap height around 44–48px
- Navigation links on mobile render with generous surrounding tap zones (minimum 44px effective height)
- Product tiles are fully tappable card regions, not just the title link
- Input fields expand to full-width on mobile with minimum 44px effective height

### Collapsing Strategy
- **Navigation**: full horizontal bar with Prada wordmark → hamburger drawer on mobile; full-screen white overlay with Helvetica Neue uppercase nav list
- **Type scale**: `{typography.display-hero}` scales from 72px toward 36–44px on mobile; `{typography.body}` holds at 13px; captions reduce to 10px
- **Product grids**: 4-column desktop → 2-column tablet → 1-column mobile; `{spacing.md}` gutters maintained proportionally
- **Spacing**: `{spacing.4xl}` vertical gaps compress toward `{spacing.2xl}` on mobile — breathing room character preserved at reduced amplitude

### Image Behavior
- Campaign photography is always full-bleed — no max-width caps on hero images
- Product tile images maintain consistent portrait aspect ratio (3:4 or 4:5) across breakpoints
- Image frames are always `{rounded.none}` — photography is never clipped to a rounded container
- Editorial photography reads as art-directed: plain sweeps, studio light, or controlled exterior environments

---

## Agent Prompt Guide

### Quick Color Reference
- Background: White (`{colors.background}`)
- Primary text: Absolute Black (`{colors.ink}`)
- CTA fill: Black (`{colors.primary}`)
- CTA text: White (`{colors.on-primary}`)
- Secondary text: Muted (`{colors.ink-muted}`)
- Border (structural): `{colors.border}`
- Border (resting input): `{colors.border-subtle}`
- Error: `{colors.error}`

### Example Component Prompts

- "Build a full-bleed campaign hero on `{colors.background}` white. A large editorial photograph fills the viewport. Over it, or below it on white space: a `{typography.display-hero}` (72px Linotype Didot, `letter-spacing: 0.02em`) campaign title in `{colors.ink}`, sentence case, left-aligned or centered. No overlay, no tint, no shadow. Navigation floats at top in `{typography.nav-link}` (12px Helvetica Neue uppercase, `0.1em` tracking, `{colors.ink}`) with the Prada logotype at top-left."

- "Create a primary CTA button: `{colors.primary}` (pure black `#000000`) fill, `{colors.on-primary}` white text, `{typography.button-ui}` (11px Helvetica Neue, `text-transform: uppercase`, `letter-spacing: 0.12em`), `border-radius: 0`, `padding: 14px 28px`, `border: 1px solid {colors.border}`. Hover transitions fill to `{colors.primary-hover}` (`#1a1a1a`) via `transition: background-color 0.2s ease`. No scale, no shadow, no lift."

- "Design a product card on `{colors.background}` white: `border-radius: 0`, no shadow, no border. Full-width portrait product image edge-to-edge. Below: `{typography.heading-sub}` product name (14px Helvetica Neue, `0.08em` tracking, `{colors.ink}`), then `{typography.body}` price (13px, `{colors.ink}`). Sale prices in `{colors.error}`. No card chrome — it is a display frame."

- "Build a desktop navigation bar on `{colors.background}` white. Prada triangle wordmark SVG at top-left in `{colors.ink}`. Primary category links (Women, Men, Handbags, Eyewear, Beauty) across the top in `{typography.nav-link}` (12px Helvetica Neue uppercase, `0.1em` tracking, `{colors.ink}`). Utility icons at top-right. Hover transitions link color via `transition: color 0.2s ease` — no underline, no background fill."

- "Create a newsletter email input: `{colors.background}` white fill, no border on left/right/top, `border-bottom: 1px solid {colors.border-subtle}`, `border-radius: 0`, `{typography.body}` 13px Helvetica Neue, `{colors.ink}` text, `{colors.ink-ghost}` placeholder. Focus: underline upgrades to `border-bottom: 1px solid {colors.border}` + `outline: 1px solid {colors.border}` — no glow, no box-shadow, no background change."

- "Render a `{typography.display}` (48px Linotype Didot, `letter-spacing: 0.02em`, weight 400) editorial section heading in `{colors.ink}` on `{colors.background}` white. Below it, a thin `1px solid {colors.border-subtle}` rule spanning full column width, then `{typography.body-large}` (16px Helvetica Neue, `letter-spacing: 0.02em`, `line-height: 1.7`) editorial copy. The serif-to-grotesque switch at this scale is the signature Prada typographic moment."

### Iteration Guide

1. Start on absolute white (`{colors.background}`) — no tints, no surfaces with fill, no dark sections. If a section carries a background that is not white or a black CTA, remove it.
2. Check typeface assignment: display headings at 40px+ in Linotype Didot; everything below 32px in Helvetica Neue. If the serif appears at body size or the grotesque is used for campaign titles, correct the assignment.
3. Apply `border-radius: 0` to every UI element. If any corner is visibly rounded on a button, card, or input, flatten it immediately.
4. All navigation and button text must be uppercase with tracking. Verify `{typography.nav-link}` at `0.1em` and `{typography.button-ui}` at `0.12em`. If tracking is absent, add it.
5. Confirm no chromatic color exists in chrome. If a hue appears outside of campaign photography or error states, replace it with `{colors.ink}` or `{colors.background}`.
6. Check shadows. If any card, section, or button casts a drop shadow, remove it. Only floating panels and modals use `{colors.shadow-soft}` elevation.
7. Verify section spacing. Desktop vertical gaps between major content blocks should approach `{spacing.3xl}` (96px) or `{spacing.4xl}` (128px). If sections feel compressed, add air — the negative space is the luxury signal.
8. Confirm there is no bold weight anywhere in the system. Weight 400 Regular only — emphasis arrives through typeface switch, uppercase case, or size, never through `font-weight: 700`.

---

## Attribution

Independent design analysis from [Design Swatches](https://designmd.santiagoalonso.com) by [Santiago Alonso](https://santiagoalonso.com). Based on publicly observable interface patterns. Not affiliated with or endorsed by Prada. Brand names and trademarks belong to their respective owners.
