Landing page is now a live demo of the macrostructure layer. The bottom-left
themer chip is replaced by a thin sticky-top banner: wordmark, active theme
name in display weight, 12 theme dots, random button. Pressing T cycles
themes; R picks a random one; ?theme= shareable links work.
Switching themes no longer just repaints — it rebuilds the page. The hero
and footer are now slots that swap component archetype per theme: Specimen
gets a Marquee hero + Mast-headed footer, Brutal gets Photographic + Inline,
Newsprint gets Split Diptych + Index columns, Atelier gets Quote-Led, etc.
Six hero archetypes and four footer archetypes are pre-templated in HTML
<template> elements; JS clones and interpolates per-theme copy fixtures
(distinct voice per theme, not just colour-swapped lorem). View Transitions
cross-fade the structure swap.
Skill side, Tier 1 of the diagnostic ships: structure.md vague-tone fallback
becomes a domain-aware lookup table (audio→Photographic+Quote-Led+Letter,
commerce→Catalogue+Photographic+Bento, docs→Workbench+Long Doc+Component
Playground, etc.) so Bento/Long Doc/Manifesto isn't the catch-all anymore.
component-cookbook.md gains a within-archetype variation matrix (2-3 knobs
per archetype — tile counts, ratios, attribution positions, etc. — picked
per output, stamped in the macrostructure comment) and a new F6 Product
card grid archetype distinct from Bento (sells things, not features).
SKILL.md slop test goes 23→29: the six rules that used to be advice
(zero-chroma greys, accent footprint, spacing scale, measure 45-75ch,
eight states, reduced-motion fallbacks) are now binary gates. The audit
verb gains a stamp-vs-page check that flags drift when the stamp says
one macrostructure but the page is actually the AI template.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
The 12-theme popover was congested when opened inline in the
navbar. Now it lives as a floating chip in the bottom-left corner:
always reachable on desktop and mobile, popover opens upward, and
the navbar is a clean two-column wordmark + meta layout.
- index.html: themer markup moved to end of <body>, navbar simplified
- components.css: .themer is position: fixed with bottom/left anchors,
popover opens upward (bottom: 100% + 0.5rem), responsive grid
collapses to 2 columns under 60rem
- sections.css: removed .nav__themer rules; .nav restored to flex
space-between
- README.md: rewritten concise + complete, mirrors the v0.2.0 surface
(10 reference files, 12 themes, 4 verbs, 20-question slop test)
Anti-AI-slop design skill for Claude Code, Cursor, and Codex,
plus a self-demonstrating landing page powered by Together AI.
- 4 verbs: default / audit / refine / redesign
- 10 reference files including microinteractions and structure
- 12 themes with structural fingerprints
- Two test specimens: bakery (editorial) and cmdk (technical)
- 20-question slop test covering visual, structural, and microinteraction tells
