A prompt says what to do. The rules come from design.md: an agent configured on Set up your agents loads them by itself, so its prompts are task only. Claude.ai and unconfigured agents get the first line that loads them.
Audit and fix an existing screen or mock
Anything already built that should look like GTE: a vibe-coded page, a Figma export, an old mock.
Read https://assets.design.gte.xyz/design-hub/4a09d98e7dab6035bc759ec45201735b0b2d7d2abc6dacc7a89cb93aef8fd2d7/design.md and follow its routing block to the file for what I'm about to give you. Audit the attached screen against the GTE design rules. 1. List every violation as: what you see → the rule it breaks → the fix. Check the named anti-patterns first. 2. Rebuild the screen using only https://assets.design.gte.xyz/design-hub/4a09d98e7dab6035bc759ec45201735b0b2d7d2abc6dacc7a89cb93aef8fd2d7/gte-brand.css classes and tokens. Do not invent colours, type sizes, radii or spacing. Numbers are JetBrains Mono with slashed zeros. Product surfaces stay dark. 3. Keep every fact, number and control from the original. Rewrite copy to the voice rules (sentence case, specific errors, no hedge words, no emoji). 4. Return the audit list and the rebuilt HTML in one self-contained file. Here is the screen:
Build a new product surface
Trading, portfolio, onboarding, deposits, settings, modals, empty or error states. Anything inside the app shell.
Read https://assets.design.gte.xyz/design-hub/4a09d98e7dab6035bc759ec45201735b0b2d7d2abc6dacc7a89cb93aef8fd2d7/design.md, then load https://assets.design.gte.xyz/design-hub/4a09d98e7dab6035bc759ec45201735b0b2d7d2abc6dacc7a89cb93aef8fd2d7/product-design.md. Build the surface described below as one self-contained HTML file that links https://assets.design.gte.xyz/design-hub/4a09d98e7dab6035bc759ec45201735b0b2d7d2abc6dacc7a89cb93aef8fd2d7/gte-brand.css. Rules to hold: dark canvas (--surface-elevated-1), cards on --surface-elevated-2, .p3 body, .mono-3 numbers with slashed zeros, one primary CTA, border-only badges, 1px strokes, the 23.43° slant only on the active tab. Compose from the component vocabulary and the composite skeletons in product-design.md; do not draw a new atom. Before you finish, inspect your own output against the hard rules and anti-patterns and fix what fails. If the surface needs a pattern the files do not cover, build it from the atoms and mark it "draft: pattern not in the system" at the top. Surface and data:
Build a brand, marketing or growth asset
Landing sections, social and OG cards, email, slides, one-pagers, press, docs pages, diagrams.
Read https://assets.design.gte.xyz/design-hub/4a09d98e7dab6035bc759ec45201735b0b2d7d2abc6dacc7a89cb93aef8fd2d7/design.md, then load https://assets.design.gte.xyz/design-hub/4a09d98e7dab6035bc759ec45201735b0b2d7d2abc6dacc7a89cb93aef8fd2d7/brand.md. Check the format coverage table in brand.md first: if the format I ask for is "Draft", "Reserved" or "Not covered", build it from the rules (and its starter, where there is one) and label the output "Draft, format not yet vetted" in the file's first line. Hold the marketing rules of the 2026 landing: the page colour rgb(11,13,14) as the canvas, dark except one light band (#e2e3e1) for the softer trading message; headlines in APK Protocol SemiBold on the brand scale, sentence case, a two-line heading two-tone (text-high, then text-mid), never an orange word; the lede in APK Protocol 400 with its key phrases in text-high; body Inter on the brand body scale; no eyebrows; every number in JetBrains Mono; Accent for action only and Ember (--brand-ignition-2) for art only, never Signal lime for "up"; ASCII art generated on its dot grid, never typed; one 1520px measure; one primary label, "Open GTE ↗", with buttons only in the hero, nav and close and text links elsewhere; PNG wordmark; no glow beyond the FAQ and closing glows; no 23.43° slant. Link https://assets.design.gte.xyz/design-hub/4a09d98e7dab6035bc759ec45201735b0b2d7d2abc6dacc7a89cb93aef8fd2d7/gte-brand.css and use its tokens for every colour and size. Any product UI shown inside the asset stays dark inside a .dark-scope and is built from the product atoms. Asset and content:
Build a mobile screen
Any screen in the GTE mobile app. The atoms are settled; mobile-native patterns are not documented yet.
Read https://assets.design.gte.xyz/design-hub/4a09d98e7dab6035bc759ec45201735b0b2d7d2abc6dacc7a89cb93aef8fd2d7/design.md, then https://assets.design.gte.xyz/design-hub/4a09d98e7dab6035bc759ec45201735b0b2d7d2abc6dacc7a89cb93aef8fd2d7/mobile-design.md, then the product file design.md routes to. Mobile inherits the atoms unchanged: colour tokens, Inter for words, JetBrains Mono with slashed zeros for every number, the spacing scale and radii, logos and icons, the voice rules, and every hard rule (dark only, green long and red short, no emoji, no gradients, 1px strokes). Use https://assets.design.gte.xyz/design-hub/4a09d98e7dab6035bc759ec45201735b0b2d7d2abc6dacc7a89cb93aef8fd2d7/gte-brand.css for every colour, size and type style. Where a mobile-native pattern is needed (bottom sheet, tab bar, gesture affordance) build it from the atoms and list it at the top of the file as "mobile pattern, not yet documented" with the web component it maps to, so the decision can be recorded. Screen and data:
Review a screenshot or PR against the rules
Design review, PR review, or a second opinion on your own work. Produces findings, not a rebuild.
Read https://assets.design.gte.xyz/design-hub/4a09d98e7dab6035bc759ec45201735b0b2d7d2abc6dacc7a89cb93aef8fd2d7/design.md and the file it routes to for this surface. Review the attached screenshot or code against the hard rules, the named anti-patterns and the surface rules. Do not redesign it. Report as a table: location → what you see → the rule → severity (blocks shipping / fix before merge / nit). Be mechanical about: canvas colour, body size, mono numbers and slashed zeros, badge fill, stroke width, number of primaries, orange used as decoration, slant on anything other than the active tab, light theme inside product, emoji or glyph icons, hedge words in copy. End with the three fixes that would change the most. Here it is:
Use a specific component from the gallery
You know which atom you need and want it exactly right: buttons, inputs, badges, tabs, table rows, order book, toasts.
Read https://assets.design.gte.xyz/design-hub/4a09d98e7dab6035bc759ec45201735b0b2d7d2abc6dacc7a89cb93aef8fd2d7/design.md, then load https://assets.design.gte.xyz/design-hub/4a09d98e7dab6035bc759ec45201735b0b2d7d2abc6dacc7a89cb93aef8fd2d7/product-design.md. I need the GTE <component> exactly as the system defines it. Its classes are listed under Component vocabulary in product-design.md; use only those, from https://assets.design.gte.xyz/design-hub/4a09d98e7dab6035bc759ec45201735b0b2d7d2abc6dacc7a89cb93aef8fd2d7/gte-brand.css. Include every state the vocabulary names (rest, hover, focus, disabled, error, active) and use the copy style from the voice rules. Return a self-contained HTML snippet plus one line per state explaining which token drives it. If a variant I ask for is not in the vocabulary, say so and build the closest documented one instead. Component, variant and content:
If an output comes back off-brand, the fix goes into the files, not into the prompt: a rule in design.md or the file it routes to, a class in the stylesheet, or a check. That is what keeps every tool producing the same GTE.