Categories Page · Spacing Pass

Same layout as app/category/page.tsx: title row + sort/create/view-toggle, then a grid of CategoryGridCards. Two views: portrait (golden-ratio 1:1.618 cards, 7-up at desktop) and landscape (1.618:1 cards, 3-up at desktop). The card aspect ratios are golden — not touched.

Spacing changes only — 2 lines
1 · empty-state Panel padding
p-12 48 px → p-card 15 px
2 · empty-state icon → text margin
mb-2 8 px → mb-label 7 px

Untouched: page outer px-6 py-6, title row mb-6, sort/view toggle pills, create form, grid gap-4, card responsive column counts, card golden-ratio aspect (1/1.618 and 1.618/1), card internal p-3 pt-10 name-overlay.

PORTRAIT VIEW · 7 cards per row · 1:1.618 aspect (golden, untouched)view=portrait

Categories

Umbrellas that group related tags. A category like BDSM can collect bondage, shibari, cuffs, etc. Each tag belongs to at most one category.

7 categories

⇊ A-Z ⏚ Count
New category
+ Create
▭ P ▭ L
BDSM
12 tags · 89 covers
Cosplay
8 tags · 45 covers
Outdoor
5 tags · 33 covers
Group
9 tags · 71 covers
Solo
3 tags · 18 covers
School
6 tags · 27 covers
Office
4 tags · 16 covers
LANDSCAPE VIEW · 3 cards per row · 1.618:1 aspect (golden, untouched)view=landscape

Categories

Umbrellas that group related tags. A category like BDSM can collect bondage, shibari, cuffs, etc.

7 categories

⇊ A-Z ⏚ Count
New category
+ Create
▭ P ▭ L
BDSM
Bondage, shibari, cuffs and related restraint kinks. Sub-tags inherit the umbrella's color.
12 tags · 89 covers
Cosplay
Anime, school uniforms, costume play. Includes themed wardrobes.
8 tags · 45 covers
Outdoor
Beach, park, public, nature settings.
5 tags · 33 covers
Group
3+ participant scenes, orgy, threesome categories.
9 tags · 71 covers
Solo
Single-performer content; masturbation focus.
3 tags · 18 covers
School
Classroom, uniforms, schoolgirl and teacher dynamics.
6 tags · 27 covers
EMPTY STATE · BEFORE vs AFTER · only place spacing changescats.length === 0
BEFORE — p-12 · mb-2
▦

No categories yet. Create one above to start grouping tags.

AFTER — p-card · mb-label
▦

No categories yet. Create one above to start grouping tags.