---
name: Order
description: "This site is a masterclass in restraint, using minimal elements to create a highly refined and premium portfolio experience."
version: alpha

colors:
  background: "#000000"
  primary: "#FFFFFF"
  neutral: "#787878"
  line: "rgba(120, 120, 120, 1)"

typography:
  display:
    fontFamily: monospace
    fontSize: 56px
    lineHeight: 1.0
    fontWeight: 400
    letterSpacing: "0px"
  body:
    fontFamily: monospace
    fontSize: 12px
    lineHeight: 1.45
    fontWeight: 400
    letterSpacing: "0px"

rounded:
  sm: 0px
  md: 0px
  lg: 0px
  pill: 999px

spacing:
  xs: 4px
  sm: 8px
  md: 16px
  lg: 24px
  xl: 32px
  2xl: 48px
  3xl: 64px

---

## Overview

A monochromatic design studio portfolio emphasizing typographic precision and archival photography.

*A pristine gallery archive for design case studies*

## Colors

Strict monochromatic palette relying entirely on pure white and mid-gray against deep black.

- **Background (`#000000`)** — uses `bg` token
- **Primary text (`#FFFFFF`)** — uses `ink` token
- **Muted (`#787878`)** — uses `muted` token
- **Borders (`rgba(120, 120, 120, 1)`)** — uses `line` token

## Typography

- **Display:** monospace
- **Body:** monospace
- **Mono:** monospace

- Use monospace typography exclusively for all text elements.
- Maintain strict lowercase formatting for navigation and body copy.
- Use horizontal rule underlines for interactive text elements.

## Layout

Asymmetrical grid layout featuring mixed image sizes and generous negative space.

*Rhythm:* Generous vertical white space separates content sections with large padding.

## Elevation & Depth

- Borders: 1px solid gray underlines for navigation links, otherwise borderless.

## Shapes

- `sm`: 0px
- `md`: 0px
- `lg`: 0px
- `pill`: 999px

## Components

- **button:** Text-only links styled with bottom border underlines.
- **card:** Full-bleed photographic case study cards with overlaid labels.
- **chip:** Simple underlined text labels for categories (e.g., 'Identity', 'Motion').
- **hero:** Large-scale, full-width photographic background with overlaid typographic elements.

## Do's and Don'ts

**Don't:**
- Don't use bright accent colors — screenshot shows a strict black, white, and gray palette.
- Don't use uppercase text for navigation — screenshot shows all lowercase text.
- Don't use rounded corners on containers — screenshot shows sharp, square edges.
- Don't use drop shadows on elements — screenshot shows a flat, layered aesthetic.
- Don't use decorative serif fonts — screenshot shows exclusively monospaced typography.
- Don't overcrowd the layout with elements — screenshot shows generous white space and sparse content.

---

## System Prompt (paste into AI agent)

```
This is a design studio portfolio site defined by strict minimalism and typographic precision. The visual identity is built on a monochromatic palette of pure black (#000000), white (#FFFFFF), and mid-gray (#787878), with no accent colors. Typography is exclusively monospaced, rendered in lowercase across navigation and metadata, often using horizontal rule underlines for interactive states. The layout is asymmetrical and sparse, relying heavily on high-quality photography and generous negative space. Critical constraints: avoid uppercase text, avoid rounded corners or shadows, and never introduce vibrant accent colors.
```