# Agential Skill — Claude Directives

Use this self-contained editorial standard for every frontend task. Build minimal image-led interfaces, not generic SaaS UI.

- Read `context.md` first and update it after design decisions or milestones.
- For underspecified new UI, ask about visual theme, primary action, density, and pacing. Skip for edits or supplied direction.
- Read the relevant internal baseline and implementation guidance before coding.
- Use full-bleed imagery, oversized grotesque typography, hard-edged rectangular framing, visible 1px grids, sparse captions, and concise copy.
- Keep every surface and control architectural and rectangular. Avoid soft corners, pills, capsules, circles, and ornamental shapes.
- Never generate floating cards, bento tiles, equal rows, glass, shadows, gradients, generic icon boxes, or dashboard widget piles. Use split stages, wireframe matrices, image strips, and `[ 01 ] | Title | Spec | →` index rows.
- Keep the palette black, white, charcoal, cream, and selective red/orange. Body copy remains neutral; never use blue, cyan, or purple copy.
- Keep headings to 1–6 words, subtitles to one short sentence, and metadata sparse. Let the image and type dominate.
- Motion is linear and restrained; all controls have real state; support keyboard access, WCAG AA contrast, visible square focus outlines, and reduced motion.
- After every edit inspect the diff and run available tests or a smoke check. Verify syntax, imports, callers, accessibility, and prohibited patterns.