@aexol/spectral 0.7.0 → 0.7.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (459) hide show
  1. package/dist/agent/index.js +76 -301
  2. package/dist/cli.js +11 -0
  3. package/dist/designer/data/systems/agentic/DESIGN.md +71 -0
  4. package/dist/designer/data/systems/agentic/components.html +154 -0
  5. package/dist/designer/data/systems/agentic/tokens.css +63 -0
  6. package/dist/designer/data/systems/airbnb/DESIGN.md +393 -0
  7. package/dist/designer/data/systems/airbnb/components.html +1373 -0
  8. package/dist/designer/data/systems/airbnb/tokens.css +261 -0
  9. package/dist/designer/data/systems/airtable/DESIGN.md +92 -0
  10. package/dist/designer/data/systems/airtable/components.html +489 -0
  11. package/dist/designer/data/systems/airtable/tokens.css +261 -0
  12. package/dist/designer/data/systems/ant/DESIGN.md +71 -0
  13. package/dist/designer/data/systems/ant/components.html +154 -0
  14. package/dist/designer/data/systems/ant/tokens.css +63 -0
  15. package/dist/designer/data/systems/apple/DESIGN.md +250 -0
  16. package/dist/designer/data/systems/apple/components.html +749 -0
  17. package/dist/designer/data/systems/apple/tokens.css +286 -0
  18. package/dist/designer/data/systems/application/DESIGN.md +71 -0
  19. package/dist/designer/data/systems/application/components.html +154 -0
  20. package/dist/designer/data/systems/application/tokens.css +63 -0
  21. package/dist/designer/data/systems/arc/DESIGN.md +152 -0
  22. package/dist/designer/data/systems/arc/components.html +432 -0
  23. package/dist/designer/data/systems/arc/tokens.css +137 -0
  24. package/dist/designer/data/systems/artistic/DESIGN.md +71 -0
  25. package/dist/designer/data/systems/artistic/components.html +136 -0
  26. package/dist/designer/data/systems/artistic/tokens.css +63 -0
  27. package/dist/designer/data/systems/atelier-zero/DESIGN.md +316 -0
  28. package/dist/designer/data/systems/atelier-zero/components.html +136 -0
  29. package/dist/designer/data/systems/atelier-zero/tokens.css +63 -0
  30. package/dist/designer/data/systems/bento/DESIGN.md +71 -0
  31. package/dist/designer/data/systems/bento/components.html +136 -0
  32. package/dist/designer/data/systems/bento/tokens.css +63 -0
  33. package/dist/designer/data/systems/binance/DESIGN.md +348 -0
  34. package/dist/designer/data/systems/binance/components.html +550 -0
  35. package/dist/designer/data/systems/binance/tokens.css +255 -0
  36. package/dist/designer/data/systems/bmw/DESIGN.md +183 -0
  37. package/dist/designer/data/systems/bmw/components.html +551 -0
  38. package/dist/designer/data/systems/bmw/tokens.css +179 -0
  39. package/dist/designer/data/systems/bmw-m/DESIGN.md +246 -0
  40. package/dist/designer/data/systems/bmw-m/components.html +342 -0
  41. package/dist/designer/data/systems/bmw-m/tokens.css +64 -0
  42. package/dist/designer/data/systems/bold/DESIGN.md +71 -0
  43. package/dist/designer/data/systems/bold/components.html +136 -0
  44. package/dist/designer/data/systems/bold/tokens.css +63 -0
  45. package/dist/designer/data/systems/brutalism/DESIGN.md +71 -0
  46. package/dist/designer/data/systems/brutalism/components.html +154 -0
  47. package/dist/designer/data/systems/brutalism/tokens.css +63 -0
  48. package/dist/designer/data/systems/bugatti/DESIGN.md +271 -0
  49. package/dist/designer/data/systems/bugatti/components.html +342 -0
  50. package/dist/designer/data/systems/bugatti/tokens.css +64 -0
  51. package/dist/designer/data/systems/cafe/DESIGN.md +71 -0
  52. package/dist/designer/data/systems/cafe/components.html +136 -0
  53. package/dist/designer/data/systems/cafe/tokens.css +63 -0
  54. package/dist/designer/data/systems/cal/DESIGN.md +262 -0
  55. package/dist/designer/data/systems/cal/components.html +376 -0
  56. package/dist/designer/data/systems/cal/tokens.css +265 -0
  57. package/dist/designer/data/systems/canva/DESIGN.md +157 -0
  58. package/dist/designer/data/systems/canva/components.html +461 -0
  59. package/dist/designer/data/systems/canva/tokens.css +147 -0
  60. package/dist/designer/data/systems/cisco/DESIGN.md +201 -0
  61. package/dist/designer/data/systems/cisco/components.html +342 -0
  62. package/dist/designer/data/systems/cisco/tokens.css +64 -0
  63. package/dist/designer/data/systems/claude/DESIGN.md +315 -0
  64. package/dist/designer/data/systems/claude/components.html +483 -0
  65. package/dist/designer/data/systems/claude/tokens.css +130 -0
  66. package/dist/designer/data/systems/clay/DESIGN.md +307 -0
  67. package/dist/designer/data/systems/clay/components.html +136 -0
  68. package/dist/designer/data/systems/clay/tokens.css +63 -0
  69. package/dist/designer/data/systems/claymorphism/DESIGN.md +71 -0
  70. package/dist/designer/data/systems/claymorphism/components.html +136 -0
  71. package/dist/designer/data/systems/claymorphism/tokens.css +63 -0
  72. package/dist/designer/data/systems/clean/DESIGN.md +71 -0
  73. package/dist/designer/data/systems/clean/components.html +136 -0
  74. package/dist/designer/data/systems/clean/tokens.css +63 -0
  75. package/dist/designer/data/systems/clickhouse/DESIGN.md +284 -0
  76. package/dist/designer/data/systems/clickhouse/components.html +506 -0
  77. package/dist/designer/data/systems/clickhouse/tokens.css +135 -0
  78. package/dist/designer/data/systems/cohere/DESIGN.md +269 -0
  79. package/dist/designer/data/systems/cohere/components.html +353 -0
  80. package/dist/designer/data/systems/cohere/tokens.css +126 -0
  81. package/dist/designer/data/systems/coinbase/DESIGN.md +132 -0
  82. package/dist/designer/data/systems/coinbase/components.html +501 -0
  83. package/dist/designer/data/systems/coinbase/tokens.css +257 -0
  84. package/dist/designer/data/systems/colorful/DESIGN.md +71 -0
  85. package/dist/designer/data/systems/colorful/components.html +136 -0
  86. package/dist/designer/data/systems/colorful/tokens.css +63 -0
  87. package/dist/designer/data/systems/composio/DESIGN.md +310 -0
  88. package/dist/designer/data/systems/composio/components.html +342 -0
  89. package/dist/designer/data/systems/composio/tokens.css +64 -0
  90. package/dist/designer/data/systems/contemporary/DESIGN.md +71 -0
  91. package/dist/designer/data/systems/contemporary/components.html +136 -0
  92. package/dist/designer/data/systems/contemporary/tokens.css +63 -0
  93. package/dist/designer/data/systems/corporate/DESIGN.md +71 -0
  94. package/dist/designer/data/systems/corporate/components.html +136 -0
  95. package/dist/designer/data/systems/corporate/tokens.css +63 -0
  96. package/dist/designer/data/systems/cosmic/DESIGN.md +71 -0
  97. package/dist/designer/data/systems/cosmic/components.html +136 -0
  98. package/dist/designer/data/systems/cosmic/tokens.css +63 -0
  99. package/dist/designer/data/systems/creative/DESIGN.md +71 -0
  100. package/dist/designer/data/systems/creative/components.html +136 -0
  101. package/dist/designer/data/systems/creative/tokens.css +63 -0
  102. package/dist/designer/data/systems/cursor/DESIGN.md +312 -0
  103. package/dist/designer/data/systems/cursor/components.html +654 -0
  104. package/dist/designer/data/systems/cursor/tokens.css +218 -0
  105. package/dist/designer/data/systems/dashboard/DESIGN.md +71 -0
  106. package/dist/designer/data/systems/dashboard/components.html +154 -0
  107. package/dist/designer/data/systems/dashboard/tokens.css +63 -0
  108. package/dist/designer/data/systems/default/DESIGN.md +62 -0
  109. package/dist/designer/data/systems/default/components.html +523 -0
  110. package/dist/designer/data/systems/default/tokens.css +200 -0
  111. package/dist/designer/data/systems/discord/DESIGN.md +162 -0
  112. package/dist/designer/data/systems/discord/components.html +359 -0
  113. package/dist/designer/data/systems/discord/tokens.css +125 -0
  114. package/dist/designer/data/systems/dithered/DESIGN.md +71 -0
  115. package/dist/designer/data/systems/dithered/components.html +136 -0
  116. package/dist/designer/data/systems/dithered/tokens.css +63 -0
  117. package/dist/designer/data/systems/doodle/DESIGN.md +71 -0
  118. package/dist/designer/data/systems/doodle/components.html +136 -0
  119. package/dist/designer/data/systems/doodle/tokens.css +63 -0
  120. package/dist/designer/data/systems/dramatic/DESIGN.md +71 -0
  121. package/dist/designer/data/systems/dramatic/components.html +136 -0
  122. package/dist/designer/data/systems/dramatic/tokens.css +63 -0
  123. package/dist/designer/data/systems/duolingo/DESIGN.md +154 -0
  124. package/dist/designer/data/systems/duolingo/components.html +532 -0
  125. package/dist/designer/data/systems/duolingo/tokens.css +130 -0
  126. package/dist/designer/data/systems/editorial/DESIGN.md +71 -0
  127. package/dist/designer/data/systems/editorial/components.html +154 -0
  128. package/dist/designer/data/systems/editorial/tokens.css +63 -0
  129. package/dist/designer/data/systems/elegant/DESIGN.md +71 -0
  130. package/dist/designer/data/systems/elegant/components.html +136 -0
  131. package/dist/designer/data/systems/elegant/tokens.css +63 -0
  132. package/dist/designer/data/systems/elevenlabs/DESIGN.md +268 -0
  133. package/dist/designer/data/systems/elevenlabs/components.html +342 -0
  134. package/dist/designer/data/systems/elevenlabs/tokens.css +127 -0
  135. package/dist/designer/data/systems/energetic/DESIGN.md +72 -0
  136. package/dist/designer/data/systems/energetic/components.html +136 -0
  137. package/dist/designer/data/systems/energetic/tokens.css +63 -0
  138. package/dist/designer/data/systems/enterprise/DESIGN.md +71 -0
  139. package/dist/designer/data/systems/enterprise/components.html +154 -0
  140. package/dist/designer/data/systems/enterprise/tokens.css +63 -0
  141. package/dist/designer/data/systems/expo/DESIGN.md +284 -0
  142. package/dist/designer/data/systems/expo/components.html +342 -0
  143. package/dist/designer/data/systems/expo/tokens.css +64 -0
  144. package/dist/designer/data/systems/expressive/DESIGN.md +71 -0
  145. package/dist/designer/data/systems/expressive/components.html +136 -0
  146. package/dist/designer/data/systems/expressive/tokens.css +63 -0
  147. package/dist/designer/data/systems/fantasy/DESIGN.md +71 -0
  148. package/dist/designer/data/systems/fantasy/components.html +136 -0
  149. package/dist/designer/data/systems/fantasy/tokens.css +63 -0
  150. package/dist/designer/data/systems/ferrari/DESIGN.md +317 -0
  151. package/dist/designer/data/systems/ferrari/components.html +342 -0
  152. package/dist/designer/data/systems/ferrari/tokens.css +64 -0
  153. package/dist/designer/data/systems/figma/DESIGN.md +223 -0
  154. package/dist/designer/data/systems/figma/components.html +344 -0
  155. package/dist/designer/data/systems/figma/tokens.css +126 -0
  156. package/dist/designer/data/systems/flat/DESIGN.md +71 -0
  157. package/dist/designer/data/systems/flat/components.html +136 -0
  158. package/dist/designer/data/systems/flat/tokens.css +63 -0
  159. package/dist/designer/data/systems/framer/DESIGN.md +249 -0
  160. package/dist/designer/data/systems/framer/components.html +438 -0
  161. package/dist/designer/data/systems/framer/tokens.css +238 -0
  162. package/dist/designer/data/systems/friendly/DESIGN.md +71 -0
  163. package/dist/designer/data/systems/friendly/components.html +136 -0
  164. package/dist/designer/data/systems/friendly/tokens.css +63 -0
  165. package/dist/designer/data/systems/futuristic/DESIGN.md +71 -0
  166. package/dist/designer/data/systems/futuristic/components.html +136 -0
  167. package/dist/designer/data/systems/futuristic/tokens.css +63 -0
  168. package/dist/designer/data/systems/github/DESIGN.md +155 -0
  169. package/dist/designer/data/systems/github/components.html +383 -0
  170. package/dist/designer/data/systems/github/tokens.css +125 -0
  171. package/dist/designer/data/systems/glassmorphism/DESIGN.md +71 -0
  172. package/dist/designer/data/systems/glassmorphism/components.html +154 -0
  173. package/dist/designer/data/systems/glassmorphism/tokens.css +63 -0
  174. package/dist/designer/data/systems/gradient/DESIGN.md +71 -0
  175. package/dist/designer/data/systems/gradient/components.html +154 -0
  176. package/dist/designer/data/systems/gradient/tokens.css +63 -0
  177. package/dist/designer/data/systems/hashicorp/DESIGN.md +281 -0
  178. package/dist/designer/data/systems/hashicorp/components.html +502 -0
  179. package/dist/designer/data/systems/hashicorp/tokens.css +272 -0
  180. package/dist/designer/data/systems/hud/DESIGN.md +173 -0
  181. package/dist/designer/data/systems/hud/components.html +136 -0
  182. package/dist/designer/data/systems/hud/tokens.css +63 -0
  183. package/dist/designer/data/systems/huggingface/DESIGN.md +149 -0
  184. package/dist/designer/data/systems/huggingface/components.html +346 -0
  185. package/dist/designer/data/systems/huggingface/tokens.css +125 -0
  186. package/dist/designer/data/systems/ibm/DESIGN.md +335 -0
  187. package/dist/designer/data/systems/ibm/components.html +342 -0
  188. package/dist/designer/data/systems/ibm/tokens.css +64 -0
  189. package/dist/designer/data/systems/intercom/DESIGN.md +149 -0
  190. package/dist/designer/data/systems/intercom/components.html +557 -0
  191. package/dist/designer/data/systems/intercom/tokens.css +150 -0
  192. package/dist/designer/data/systems/kami/DESIGN.md +410 -0
  193. package/dist/designer/data/systems/kami/components.html +601 -0
  194. package/dist/designer/data/systems/kami/tokens.css +272 -0
  195. package/dist/designer/data/systems/kraken/DESIGN.md +128 -0
  196. package/dist/designer/data/systems/kraken/components.html +342 -0
  197. package/dist/designer/data/systems/kraken/tokens.css +64 -0
  198. package/dist/designer/data/systems/lamborghini/DESIGN.md +291 -0
  199. package/dist/designer/data/systems/lamborghini/components.html +342 -0
  200. package/dist/designer/data/systems/lamborghini/tokens.css +64 -0
  201. package/dist/designer/data/systems/levels/DESIGN.md +71 -0
  202. package/dist/designer/data/systems/levels/components.html +154 -0
  203. package/dist/designer/data/systems/levels/tokens.css +63 -0
  204. package/dist/designer/data/systems/linear-app/DESIGN.md +370 -0
  205. package/dist/designer/data/systems/linear-app/components.html +370 -0
  206. package/dist/designer/data/systems/linear-app/tokens.css +130 -0
  207. package/dist/designer/data/systems/lingo/DESIGN.md +71 -0
  208. package/dist/designer/data/systems/lingo/components.html +154 -0
  209. package/dist/designer/data/systems/lingo/tokens.css +63 -0
  210. package/dist/designer/data/systems/loom/DESIGN.md +201 -0
  211. package/dist/designer/data/systems/loom/components.html +446 -0
  212. package/dist/designer/data/systems/loom/tokens.css +138 -0
  213. package/dist/designer/data/systems/lovable/DESIGN.md +301 -0
  214. package/dist/designer/data/systems/lovable/components.html +441 -0
  215. package/dist/designer/data/systems/lovable/tokens.css +258 -0
  216. package/dist/designer/data/systems/luxury/DESIGN.md +71 -0
  217. package/dist/designer/data/systems/luxury/components.html +154 -0
  218. package/dist/designer/data/systems/luxury/tokens.css +63 -0
  219. package/dist/designer/data/systems/mastercard/DESIGN.md +368 -0
  220. package/dist/designer/data/systems/mastercard/components.html +342 -0
  221. package/dist/designer/data/systems/mastercard/tokens.css +64 -0
  222. package/dist/designer/data/systems/material/DESIGN.md +71 -0
  223. package/dist/designer/data/systems/material/components.html +154 -0
  224. package/dist/designer/data/systems/material/tokens.css +63 -0
  225. package/dist/designer/data/systems/meta/DESIGN.md +369 -0
  226. package/dist/designer/data/systems/meta/components.html +398 -0
  227. package/dist/designer/data/systems/meta/tokens.css +263 -0
  228. package/dist/designer/data/systems/minimal/DESIGN.md +71 -0
  229. package/dist/designer/data/systems/minimal/components.html +154 -0
  230. package/dist/designer/data/systems/minimal/tokens.css +63 -0
  231. package/dist/designer/data/systems/minimax/DESIGN.md +260 -0
  232. package/dist/designer/data/systems/minimax/components.html +590 -0
  233. package/dist/designer/data/systems/minimax/tokens.css +148 -0
  234. package/dist/designer/data/systems/mintlify/DESIGN.md +329 -0
  235. package/dist/designer/data/systems/mintlify/components.html +737 -0
  236. package/dist/designer/data/systems/mintlify/tokens.css +256 -0
  237. package/dist/designer/data/systems/miro/DESIGN.md +111 -0
  238. package/dist/designer/data/systems/miro/components.html +342 -0
  239. package/dist/designer/data/systems/miro/tokens.css +64 -0
  240. package/dist/designer/data/systems/mission-control/DESIGN.md +474 -0
  241. package/dist/designer/data/systems/mission-control/components.html +136 -0
  242. package/dist/designer/data/systems/mission-control/tokens.css +63 -0
  243. package/dist/designer/data/systems/mistral-ai/DESIGN.md +264 -0
  244. package/dist/designer/data/systems/mistral-ai/components.html +338 -0
  245. package/dist/designer/data/systems/mistral-ai/tokens.css +125 -0
  246. package/dist/designer/data/systems/modern/DESIGN.md +71 -0
  247. package/dist/designer/data/systems/modern/components.html +154 -0
  248. package/dist/designer/data/systems/modern/tokens.css +63 -0
  249. package/dist/designer/data/systems/mongodb/DESIGN.md +269 -0
  250. package/dist/designer/data/systems/mongodb/components.html +462 -0
  251. package/dist/designer/data/systems/mongodb/tokens.css +176 -0
  252. package/dist/designer/data/systems/mono/DESIGN.md +71 -0
  253. package/dist/designer/data/systems/mono/components.html +136 -0
  254. package/dist/designer/data/systems/mono/tokens.css +63 -0
  255. package/dist/designer/data/systems/neobrutalism/DESIGN.md +71 -0
  256. package/dist/designer/data/systems/neobrutalism/components.html +136 -0
  257. package/dist/designer/data/systems/neobrutalism/tokens.css +63 -0
  258. package/dist/designer/data/systems/neon/DESIGN.md +71 -0
  259. package/dist/designer/data/systems/neon/components.html +136 -0
  260. package/dist/designer/data/systems/neon/tokens.css +63 -0
  261. package/dist/designer/data/systems/neumorphism/DESIGN.md +71 -0
  262. package/dist/designer/data/systems/neumorphism/components.html +136 -0
  263. package/dist/designer/data/systems/neumorphism/tokens.css +63 -0
  264. package/dist/designer/data/systems/nike/DESIGN.md +366 -0
  265. package/dist/designer/data/systems/nike/components.html +512 -0
  266. package/dist/designer/data/systems/nike/tokens.css +304 -0
  267. package/dist/designer/data/systems/notion/DESIGN.md +312 -0
  268. package/dist/designer/data/systems/notion/components.html +413 -0
  269. package/dist/designer/data/systems/notion/tokens.css +130 -0
  270. package/dist/designer/data/systems/nvidia/DESIGN.md +296 -0
  271. package/dist/designer/data/systems/nvidia/components.html +414 -0
  272. package/dist/designer/data/systems/nvidia/tokens.css +133 -0
  273. package/dist/designer/data/systems/ollama/DESIGN.md +270 -0
  274. package/dist/designer/data/systems/ollama/components.html +700 -0
  275. package/dist/designer/data/systems/ollama/tokens.css +242 -0
  276. package/dist/designer/data/systems/openai/DESIGN.md +140 -0
  277. package/dist/designer/data/systems/openai/components.html +382 -0
  278. package/dist/designer/data/systems/openai/tokens.css +133 -0
  279. package/dist/designer/data/systems/opencode-ai/DESIGN.md +284 -0
  280. package/dist/designer/data/systems/opencode-ai/components.html +389 -0
  281. package/dist/designer/data/systems/opencode-ai/tokens.css +126 -0
  282. package/dist/designer/data/systems/pacman/DESIGN.md +71 -0
  283. package/dist/designer/data/systems/pacman/components.html +342 -0
  284. package/dist/designer/data/systems/pacman/tokens.css +64 -0
  285. package/dist/designer/data/systems/paper/DESIGN.md +71 -0
  286. package/dist/designer/data/systems/paper/components.html +136 -0
  287. package/dist/designer/data/systems/paper/tokens.css +63 -0
  288. package/dist/designer/data/systems/perplexity/DESIGN.md +286 -0
  289. package/dist/designer/data/systems/perplexity/components.html +455 -0
  290. package/dist/designer/data/systems/perplexity/tokens.css +151 -0
  291. package/dist/designer/data/systems/perspective/DESIGN.md +71 -0
  292. package/dist/designer/data/systems/perspective/components.html +136 -0
  293. package/dist/designer/data/systems/perspective/tokens.css +63 -0
  294. package/dist/designer/data/systems/pinterest/DESIGN.md +233 -0
  295. package/dist/designer/data/systems/pinterest/components.html +865 -0
  296. package/dist/designer/data/systems/pinterest/tokens.css +262 -0
  297. package/dist/designer/data/systems/playstation/DESIGN.md +367 -0
  298. package/dist/designer/data/systems/playstation/components.html +414 -0
  299. package/dist/designer/data/systems/playstation/tokens.css +150 -0
  300. package/dist/designer/data/systems/posthog/DESIGN.md +259 -0
  301. package/dist/designer/data/systems/posthog/components.html +827 -0
  302. package/dist/designer/data/systems/posthog/tokens.css +272 -0
  303. package/dist/designer/data/systems/premium/DESIGN.md +71 -0
  304. package/dist/designer/data/systems/premium/components.html +154 -0
  305. package/dist/designer/data/systems/premium/tokens.css +63 -0
  306. package/dist/designer/data/systems/professional/DESIGN.md +71 -0
  307. package/dist/designer/data/systems/professional/components.html +136 -0
  308. package/dist/designer/data/systems/professional/tokens.css +63 -0
  309. package/dist/designer/data/systems/publication/DESIGN.md +71 -0
  310. package/dist/designer/data/systems/publication/components.html +154 -0
  311. package/dist/designer/data/systems/publication/tokens.css +63 -0
  312. package/dist/designer/data/systems/raycast/DESIGN.md +271 -0
  313. package/dist/designer/data/systems/raycast/components.html +507 -0
  314. package/dist/designer/data/systems/raycast/tokens.css +143 -0
  315. package/dist/designer/data/systems/refined/DESIGN.md +71 -0
  316. package/dist/designer/data/systems/refined/components.html +136 -0
  317. package/dist/designer/data/systems/refined/tokens.css +63 -0
  318. package/dist/designer/data/systems/renault/DESIGN.md +314 -0
  319. package/dist/designer/data/systems/renault/components.html +154 -0
  320. package/dist/designer/data/systems/renault/tokens.css +63 -0
  321. package/dist/designer/data/systems/replicate/DESIGN.md +264 -0
  322. package/dist/designer/data/systems/replicate/components.html +340 -0
  323. package/dist/designer/data/systems/replicate/tokens.css +125 -0
  324. package/dist/designer/data/systems/resend/DESIGN.md +306 -0
  325. package/dist/designer/data/systems/resend/components.html +839 -0
  326. package/dist/designer/data/systems/resend/tokens.css +353 -0
  327. package/dist/designer/data/systems/retro/DESIGN.md +71 -0
  328. package/dist/designer/data/systems/retro/components.html +136 -0
  329. package/dist/designer/data/systems/retro/tokens.css +63 -0
  330. package/dist/designer/data/systems/revolut/DESIGN.md +188 -0
  331. package/dist/designer/data/systems/revolut/components.html +342 -0
  332. package/dist/designer/data/systems/revolut/tokens.css +64 -0
  333. package/dist/designer/data/systems/runwayml/DESIGN.md +247 -0
  334. package/dist/designer/data/systems/runwayml/components.html +638 -0
  335. package/dist/designer/data/systems/runwayml/tokens.css +204 -0
  336. package/dist/designer/data/systems/sanity/DESIGN.md +360 -0
  337. package/dist/designer/data/systems/sanity/components.html +342 -0
  338. package/dist/designer/data/systems/sanity/tokens.css +64 -0
  339. package/dist/designer/data/systems/sentry/DESIGN.md +265 -0
  340. package/dist/designer/data/systems/sentry/components.html +387 -0
  341. package/dist/designer/data/systems/sentry/tokens.css +219 -0
  342. package/dist/designer/data/systems/shadcn/DESIGN.md +71 -0
  343. package/dist/designer/data/systems/shadcn/components.html +732 -0
  344. package/dist/designer/data/systems/shadcn/tokens.css +255 -0
  345. package/dist/designer/data/systems/shopify/DESIGN.md +353 -0
  346. package/dist/designer/data/systems/shopify/components.html +342 -0
  347. package/dist/designer/data/systems/shopify/tokens.css +141 -0
  348. package/dist/designer/data/systems/simple/DESIGN.md +71 -0
  349. package/dist/designer/data/systems/simple/components.html +136 -0
  350. package/dist/designer/data/systems/simple/tokens.css +63 -0
  351. package/dist/designer/data/systems/skeumorphism/DESIGN.md +71 -0
  352. package/dist/designer/data/systems/skeumorphism/components.html +136 -0
  353. package/dist/designer/data/systems/skeumorphism/tokens.css +63 -0
  354. package/dist/designer/data/systems/slack/DESIGN.md +363 -0
  355. package/dist/designer/data/systems/slack/components.html +387 -0
  356. package/dist/designer/data/systems/slack/tokens.css +127 -0
  357. package/dist/designer/data/systems/sleek/DESIGN.md +71 -0
  358. package/dist/designer/data/systems/sleek/components.html +136 -0
  359. package/dist/designer/data/systems/sleek/tokens.css +63 -0
  360. package/dist/designer/data/systems/spacex/DESIGN.md +197 -0
  361. package/dist/designer/data/systems/spacex/components.html +496 -0
  362. package/dist/designer/data/systems/spacex/tokens.css +154 -0
  363. package/dist/designer/data/systems/spacious/DESIGN.md +71 -0
  364. package/dist/designer/data/systems/spacious/components.html +136 -0
  365. package/dist/designer/data/systems/spacious/tokens.css +63 -0
  366. package/dist/designer/data/systems/spotify/DESIGN.md +249 -0
  367. package/dist/designer/data/systems/spotify/components.html +365 -0
  368. package/dist/designer/data/systems/spotify/tokens.css +127 -0
  369. package/dist/designer/data/systems/starbucks/DESIGN.md +583 -0
  370. package/dist/designer/data/systems/starbucks/components.html +493 -0
  371. package/dist/designer/data/systems/starbucks/tokens.css +182 -0
  372. package/dist/designer/data/systems/storytelling/DESIGN.md +71 -0
  373. package/dist/designer/data/systems/storytelling/components.html +136 -0
  374. package/dist/designer/data/systems/storytelling/tokens.css +63 -0
  375. package/dist/designer/data/systems/stripe/DESIGN.md +325 -0
  376. package/dist/designer/data/systems/stripe/components.html +1018 -0
  377. package/dist/designer/data/systems/stripe/tokens.css +295 -0
  378. package/dist/designer/data/systems/supabase/DESIGN.md +258 -0
  379. package/dist/designer/data/systems/supabase/components.html +741 -0
  380. package/dist/designer/data/systems/supabase/tokens.css +294 -0
  381. package/dist/designer/data/systems/superhuman/DESIGN.md +255 -0
  382. package/dist/designer/data/systems/superhuman/components.html +537 -0
  383. package/dist/designer/data/systems/superhuman/tokens.css +160 -0
  384. package/dist/designer/data/systems/tesla/DESIGN.md +289 -0
  385. package/dist/designer/data/systems/tesla/components.html +724 -0
  386. package/dist/designer/data/systems/tesla/tokens.css +285 -0
  387. package/dist/designer/data/systems/tetris/DESIGN.md +71 -0
  388. package/dist/designer/data/systems/tetris/components.html +342 -0
  389. package/dist/designer/data/systems/tetris/tokens.css +64 -0
  390. package/dist/designer/data/systems/theverge/DESIGN.md +342 -0
  391. package/dist/designer/data/systems/theverge/components.html +342 -0
  392. package/dist/designer/data/systems/theverge/tokens.css +64 -0
  393. package/dist/designer/data/systems/together-ai/DESIGN.md +266 -0
  394. package/dist/designer/data/systems/together-ai/components.html +422 -0
  395. package/dist/designer/data/systems/together-ai/tokens.css +127 -0
  396. package/dist/designer/data/systems/totality-festival/DESIGN.md +206 -0
  397. package/dist/designer/data/systems/totality-festival/components.html +136 -0
  398. package/dist/designer/data/systems/totality-festival/tokens.css +63 -0
  399. package/dist/designer/data/systems/trading-terminal/DESIGN.md +178 -0
  400. package/dist/designer/data/systems/trading-terminal/components.html +154 -0
  401. package/dist/designer/data/systems/trading-terminal/tokens.css +63 -0
  402. package/dist/designer/data/systems/uber/DESIGN.md +298 -0
  403. package/dist/designer/data/systems/uber/components.html +347 -0
  404. package/dist/designer/data/systems/uber/tokens.css +131 -0
  405. package/dist/designer/data/systems/urdu/DESIGN.md +1002 -0
  406. package/dist/designer/data/systems/urdu/components.html +136 -0
  407. package/dist/designer/data/systems/urdu/tokens.css +63 -0
  408. package/dist/designer/data/systems/vercel/DESIGN.md +313 -0
  409. package/dist/designer/data/systems/vercel/components.html +839 -0
  410. package/dist/designer/data/systems/vercel/tokens.css +270 -0
  411. package/dist/designer/data/systems/vibrant/DESIGN.md +71 -0
  412. package/dist/designer/data/systems/vibrant/components.html +136 -0
  413. package/dist/designer/data/systems/vibrant/tokens.css +63 -0
  414. package/dist/designer/data/systems/vintage/DESIGN.md +71 -0
  415. package/dist/designer/data/systems/vintage/components.html +136 -0
  416. package/dist/designer/data/systems/vintage/tokens.css +63 -0
  417. package/dist/designer/data/systems/vodafone/DESIGN.md +426 -0
  418. package/dist/designer/data/systems/vodafone/components.html +342 -0
  419. package/dist/designer/data/systems/vodafone/tokens.css +64 -0
  420. package/dist/designer/data/systems/voltagent/DESIGN.md +326 -0
  421. package/dist/designer/data/systems/voltagent/components.html +154 -0
  422. package/dist/designer/data/systems/voltagent/tokens.css +63 -0
  423. package/dist/designer/data/systems/warm-editorial/DESIGN.md +65 -0
  424. package/dist/designer/data/systems/warm-editorial/components.html +136 -0
  425. package/dist/designer/data/systems/warm-editorial/tokens.css +63 -0
  426. package/dist/designer/data/systems/warp/DESIGN.md +256 -0
  427. package/dist/designer/data/systems/warp/components.html +411 -0
  428. package/dist/designer/data/systems/warp/tokens.css +156 -0
  429. package/dist/designer/data/systems/webex/DESIGN.md +207 -0
  430. package/dist/designer/data/systems/webex/components.html +342 -0
  431. package/dist/designer/data/systems/webex/tokens.css +64 -0
  432. package/dist/designer/data/systems/webflow/DESIGN.md +95 -0
  433. package/dist/designer/data/systems/webflow/components.html +413 -0
  434. package/dist/designer/data/systems/webflow/tokens.css +191 -0
  435. package/dist/designer/data/systems/wechat/DESIGN.md +302 -0
  436. package/dist/designer/data/systems/wechat/components.html +507 -0
  437. package/dist/designer/data/systems/wechat/tokens.css +176 -0
  438. package/dist/designer/data/systems/wired/DESIGN.md +281 -0
  439. package/dist/designer/data/systems/wired/components.html +342 -0
  440. package/dist/designer/data/systems/wired/tokens.css +64 -0
  441. package/dist/designer/data/systems/wise/DESIGN.md +176 -0
  442. package/dist/designer/data/systems/wise/components.html +365 -0
  443. package/dist/designer/data/systems/wise/tokens.css +141 -0
  444. package/dist/designer/data/systems/x-ai/DESIGN.md +260 -0
  445. package/dist/designer/data/systems/x-ai/components.html +460 -0
  446. package/dist/designer/data/systems/x-ai/tokens.css +268 -0
  447. package/dist/designer/data/systems/xiaohongshu/DESIGN.md +402 -0
  448. package/dist/designer/data/systems/xiaohongshu/components.html +865 -0
  449. package/dist/designer/data/systems/xiaohongshu/tokens.css +193 -0
  450. package/dist/designer/data/systems/zapier/DESIGN.md +331 -0
  451. package/dist/designer/data/systems/zapier/components.html +342 -0
  452. package/dist/designer/data/systems/zapier/tokens.css +64 -0
  453. package/dist/designer/guidelines.js +176 -0
  454. package/dist/designer/index.js +236 -0
  455. package/dist/designer/skills.js +1675 -0
  456. package/dist/designer/systems.js +216 -0
  457. package/dist/server/pi-bridge.js +155 -5
  458. package/dist/server/session-stream.js +45 -1
  459. package/package.json +1 -1
package/dist/designer/data/systems/mintlify/components.html ADDED
@@ -0,0 +1,737 @@
1
+ <!doctype html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="utf-8" />
5
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
6
+ <title>Mintlify — reference components</title>
7
+ <meta
8
+ name="description"
9
+ content="Reference fixture for design-systems/mintlify. White-on-white
10
+ canvas, near-black text, signature mint accent (#18E299) used
11
+ sparingly, full-pill buttons / inputs / badges, ultra-subtle 5%
12
+ opacity borders carrying every separation."
13
+ />
14
+
15
+ <style>
16
+ :root {
17
+ --bg: #ffffff;
18
+ --surface: #ffffff;
19
+ --surface-warm: #fafafa;
20
+
21
+ --fg: #0d0d0d;
22
+ --fg-2: #333333;
23
+ --muted: #666666;
24
+ --meta: #888888;
25
+
26
+ --border: rgba(0, 0, 0, 0.05);
27
+ --border-soft: var(--border);
28
+
29
+ --accent: #18E299;
30
+ --accent-on: #0d0d0d;
31
+ --accent-hover: #0fa76e;
32
+ --accent-active: color-mix(in oklab, var(--accent-hover), black 12%);
33
+
34
+ --success: #16a34a;
35
+ --warn: #c37d0d;
36
+ --danger: #d45656;
37
+
38
+ --font-display: "Inter", "Inter Fallback", system-ui, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
39
+ --font-body: "Inter", "Inter Fallback", system-ui, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
40
+ --font-mono: "Geist Mono", "Geist Mono Fallback", ui-monospace, SFMono-Regular, "SF Mono", Menlo, Monaco, Consolas, monospace;
41
+
42
+ --text-xs: 12px;
43
+ --text-sm: 14px;
44
+ --text-base: 16px;
45
+ --text-lg: 18px;
46
+ --text-xl: 20px;
47
+ --text-2xl: 24px;
48
+ --text-3xl: 40px;
49
+ --text-4xl: 64px;
50
+
51
+ --leading-body: 1.5;
52
+ --leading-tight: 1.15;
53
+ --tracking-display: -0.02em;
54
+
55
+ --space-1: 4px;
56
+ --space-2: 8px;
57
+ --space-3: 12px;
58
+ --space-4: 16px;
59
+ --space-5: 20px;
60
+ --space-6: 24px;
61
+ --space-8: 32px;
62
+ --space-12: 48px;
63
+
64
+ --section-y-desktop: 96px;
65
+ --section-y-tablet: 64px;
66
+ --section-y-phone: 48px;
67
+
68
+ --radius-sm: 8px;
69
+ --radius-md: 16px;
70
+ --radius-lg: 24px;
71
+ --radius-pill: 9999px;
72
+
73
+ --elev-flat: none;
74
+ --elev-ring: 0 0 0 1px var(--border);
75
+ --elev-raised: 0 2px 4px rgba(0, 0, 0, 0.03);
76
+
77
+ --focus-ring: 0 0 0 2px var(--accent);
78
+
79
+ --motion-fast: 150ms;
80
+ --motion-base: 200ms;
81
+ --ease-standard: cubic-bezier(0.2, 0, 0, 1);
82
+
83
+ --container-max: 1200px;
84
+ --container-gutter-desktop: 32px;
85
+ --container-gutter-tablet: 24px;
86
+ --container-gutter-phone: 24px;
87
+ }
88
+
89
+ /* ─── Reset ─────────────────────────────────────────────── */
90
+ *, *::before, *::after { box-sizing: border-box; }
91
+ html, body { margin: 0; padding: 0; }
92
+ body {
93
+ background: var(--bg);
94
+ color: var(--fg);
95
+ font-family: var(--font-body);
96
+ font-size: var(--text-base);
97
+ line-height: var(--leading-body);
98
+ font-weight: 400;
99
+ -webkit-font-smoothing: antialiased;
100
+ text-rendering: optimizeLegibility;
101
+ }
102
+
103
+ /* ─── Layout primitives ─────────────────────────────────── */
104
+ .container {
105
+ max-width: var(--container-max);
106
+ margin-inline: auto;
107
+ padding-inline: var(--container-gutter-desktop);
108
+ }
109
+ section { padding-block: var(--section-y-desktop); }
110
+ section + section { border-top: 1px solid var(--border); }
111
+ @media (max-width: 1023px) {
112
+ .container { padding-inline: var(--container-gutter-tablet); }
113
+ section { padding-block: var(--section-y-tablet); }
114
+ }
115
+ @media (max-width: 639px) {
116
+ .container { padding-inline: var(--container-gutter-phone); }
117
+ section { padding-block: var(--section-y-phone); }
118
+ }
119
+
120
+ /* ─── Typography ────────────────────────────────────────────
121
+ * Three weights only — 400 (read), 500 (interact), 600
122
+ * (announce). Display sizes use --tracking-display; smaller
123
+ * tiers relax toward 0. Headings drop --leading-tight (1.15)
124
+ * to ~1.30 inline at the smaller sizes per DESIGN.md §3. */
125
+ h1, h2, h3, h4 {
126
+ font-family: var(--font-display);
127
+ line-height: var(--leading-tight);
128
+ margin: 0;
129
+ color: var(--fg);
130
+ }
131
+ h1 {
132
+ font-size: var(--text-4xl);
133
+ font-weight: 600;
134
+ letter-spacing: var(--tracking-display);
135
+ }
136
+ h2 {
137
+ font-size: var(--text-3xl);
138
+ font-weight: 600;
139
+ letter-spacing: -0.02em;
140
+ }
141
+ h3 {
142
+ font-size: var(--text-xl);
143
+ font-weight: 600;
144
+ line-height: 1.30;
145
+ letter-spacing: -0.01em;
146
+ }
147
+ h4 {
148
+ font-size: var(--text-lg);
149
+ font-weight: 500;
150
+ line-height: 1.30;
151
+ }
152
+ p { margin: 0; }
153
+
154
+ .lede {
155
+ font-size: var(--text-lg);
156
+ line-height: var(--leading-body);
157
+ color: var(--muted);
158
+ }
159
+ .body-muted { color: var(--fg-2); }
160
+ .body-meta { color: var(--muted); font-size: var(--text-sm); }
161
+ .body-sm { font-size: var(--text-sm); }
162
+
163
+ /* Eyebrow uses Geist Mono uppercase — DESIGN.md §3 names the
164
+ "terminal voice" for technical labels. Tracked-out 0.65px ≈
165
+ 0.05em at 13px. */
166
+ .eyebrow {
167
+ font-family: var(--font-mono);
168
+ font-size: var(--text-xs);
169
+ font-weight: 500;
170
+ line-height: 1;
171
+ color: var(--muted);
172
+ text-transform: uppercase;
173
+ letter-spacing: 0.05em;
174
+ }
175
+
176
+ .stack-3 > * + * { margin-block-start: var(--space-3); }
177
+ .stack-4 > * + * { margin-block-start: var(--space-4); }
178
+ .stack-5 > * + * { margin-block-start: var(--space-5); }
179
+ .stack-6 > * + * { margin-block-start: var(--space-6); }
180
+
181
+ /* ─── Buttons — full-pill, the signature shape ─────────────
182
+ * DESIGN.md §4: every CTA is `--radius-pill`. Primary is
183
+ * BLACK on white (the brand's documented dominant CTA),
184
+ * secondary is white-on-white with a subtle 8% border, ghost
185
+ * is transparent for nav use. The "brand-accent" variant is
186
+ * the rare promotional pill that paints the mint fill with
187
+ * dark text on top. */
188
+ .btn {
189
+ display: inline-flex;
190
+ align-items: center;
191
+ gap: var(--space-2);
192
+ padding: 8px 24px;
193
+ border: none;
194
+ border-radius: var(--radius-pill);
195
+ font-family: var(--font-display);
196
+ font-size: 15px;
197
+ font-weight: 500;
198
+ line-height: 1.5;
199
+ cursor: pointer;
200
+ text-decoration: none;
201
+ background: transparent;
202
+ color: inherit;
203
+ transition:
204
+ background-color var(--motion-fast) var(--ease-standard),
205
+ color var(--motion-fast) var(--ease-standard),
206
+ opacity var(--motion-fast) var(--ease-standard),
207
+ box-shadow var(--motion-fast) var(--ease-standard);
208
+ }
209
+ .btn:focus-visible {
210
+ outline: none;
211
+ box-shadow: var(--focus-ring);
212
+ }
213
+ .btn-primary {
214
+ background: var(--fg);
215
+ color: var(--bg);
216
+ box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
217
+ }
218
+ .btn-primary:hover { opacity: 0.9; }
219
+ .btn-secondary {
220
+ background: var(--surface);
221
+ color: var(--fg);
222
+ padding: 7px 24px;
223
+ box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.08);
224
+ }
225
+ .btn-secondary:hover {
226
+ opacity: 0.9;
227
+ box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.14);
228
+ }
229
+ .btn-accent {
230
+ background: var(--accent);
231
+ color: var(--accent-on);
232
+ }
233
+ .btn-accent:hover { background: var(--accent-hover); color: var(--bg); }
234
+ .btn-ghost {
235
+ background: transparent;
236
+ color: var(--fg);
237
+ border-radius: var(--radius-sm);
238
+ padding: 5px 12px;
239
+ }
240
+ .btn-ghost:hover { color: var(--accent-hover); }
241
+
242
+ /* ─── Inputs — full-pill, matches button silhouette ───────── */
243
+ .field {
244
+ display: flex;
245
+ flex-direction: column;
246
+ gap: var(--space-2);
247
+ }
248
+ .field label {
249
+ font-size: var(--text-sm);
250
+ font-weight: 500;
251
+ color: var(--fg);
252
+ }
253
+ .field input {
254
+ padding: 10px 16px;
255
+ border: 1px solid rgba(0, 0, 0, 0.08);
256
+ border-radius: var(--radius-pill);
257
+ background: var(--surface);
258
+ color: var(--fg);
259
+ font-family: inherit;
260
+ font-size: var(--text-sm);
261
+ line-height: 1.5;
262
+ outline: none;
263
+ transition:
264
+ border-color var(--motion-fast) var(--ease-standard),
265
+ box-shadow var(--motion-fast) var(--ease-standard);
266
+ }
267
+ .field input::placeholder { color: var(--meta); }
268
+ .field input:hover { border-color: rgba(0, 0, 0, 0.16); }
269
+ .field input:focus-visible {
270
+ border-color: var(--accent);
271
+ box-shadow: var(--focus-ring);
272
+ }
273
+ .field-help {
274
+ font-size: var(--text-xs);
275
+ color: var(--muted);
276
+ }
277
+
278
+ /* ─── Cards — border-defined, whisper shadow ────────────────
279
+ * DESIGN.md §4: standard card uses 16px radius + 5% border +
280
+ * the 0.03-alpha shadow whisper. Featured card jumps to 24px
281
+ * radius + 32px padding. Trust card uses --surface-warm to
282
+ * tint the logo container away from pure white. */
283
+ .card {
284
+ background: var(--surface);
285
+ border: 1px solid var(--border);
286
+ border-radius: var(--radius-md);
287
+ padding: var(--space-6);
288
+ display: flex;
289
+ flex-direction: column;
290
+ gap: var(--space-3);
291
+ box-shadow: var(--elev-raised);
292
+ transition:
293
+ border-color var(--motion-base) var(--ease-standard),
294
+ box-shadow var(--motion-base) var(--ease-standard);
295
+ }
296
+ .card:hover {
297
+ border-color: rgba(0, 0, 0, 0.08);
298
+ }
299
+ .card-featured {
300
+ border-radius: var(--radius-lg);
301
+ padding: var(--space-8);
302
+ }
303
+ .card-trust {
304
+ background: var(--surface-warm);
305
+ border: 1px solid var(--border);
306
+ border-radius: var(--radius-md);
307
+ padding: var(--space-5);
308
+ display: flex;
309
+ align-items: center;
310
+ justify-content: center;
311
+ min-height: 72px;
312
+ }
313
+
314
+ /* ─── Badges — pill, mint-tinted or muted ────────────────── */
315
+ .badge {
316
+ display: inline-flex;
317
+ align-items: center;
318
+ gap: var(--space-1);
319
+ padding: 4px 12px;
320
+ border-radius: var(--radius-pill);
321
+ font-size: 13px;
322
+ font-weight: 500;
323
+ line-height: 1.5;
324
+ font-family: var(--font-display);
325
+ }
326
+ .badge-mint {
327
+ color: var(--accent-hover);
328
+ background: color-mix(in oklab, var(--accent), white 78%);
329
+ }
330
+ .badge-muted {
331
+ color: var(--fg-2);
332
+ background: var(--surface-warm);
333
+ box-shadow: 0 0 0 1px var(--border);
334
+ }
335
+ .badge-success {
336
+ color: var(--success);
337
+ background: color-mix(in oklab, var(--success), white 88%);
338
+ }
339
+ .badge-dot {
340
+ width: 6px;
341
+ height: 6px;
342
+ border-radius: 50%;
343
+ background: currentColor;
344
+ }
345
+ /* Mono uppercase tag — DESIGN.md §3 "Mono Code / Mono Badge".
346
+ Used for technical / API labels where the "terminal voice"
347
+ is the right register. */
348
+ .tag-mono {
349
+ display: inline-flex;
350
+ align-items: center;
351
+ font-family: var(--font-mono);
352
+ font-size: var(--text-xs);
353
+ font-weight: 600;
354
+ line-height: 1;
355
+ text-transform: uppercase;
356
+ letter-spacing: 0.05em;
357
+ padding: 5px 10px;
358
+ border-radius: var(--radius-sm);
359
+ background: var(--surface-warm);
360
+ color: var(--fg-2);
361
+ box-shadow: 0 0 0 1px var(--border);
362
+ }
363
+
364
+ /* ─── Links ────────────────────────────────────────────────
365
+ * DESIGN.md §2: "Links match text color, relying on
366
+ * underline/context. Hover: brand green." Default link is
367
+ * --fg with underline; hover swaps to brand-green-deep so
368
+ * the underline stays legible on white. */
369
+ a {
370
+ color: var(--fg);
371
+ text-decoration: underline;
372
+ text-underline-offset: 3px;
373
+ text-decoration-thickness: 1px;
374
+ text-decoration-color: rgba(0, 0, 0, 0.20);
375
+ transition:
376
+ color var(--motion-fast) var(--ease-standard),
377
+ text-decoration-color var(--motion-fast) var(--ease-standard);
378
+ }
379
+ a:hover {
380
+ color: var(--accent-hover);
381
+ text-decoration-color: var(--accent-hover);
382
+ }
383
+ a:focus-visible {
384
+ outline: none;
385
+ border-radius: 4px;
386
+ box-shadow: var(--focus-ring);
387
+ }
388
+
389
+ /* ─── Kbd ──────────────────────────────────────────────── */
390
+ kbd {
391
+ font-family: var(--font-mono);
392
+ font-size: var(--text-xs);
393
+ padding: 2px 6px;
394
+ border-radius: 4px;
395
+ background: var(--surface-warm);
396
+ color: var(--fg-2);
397
+ box-shadow: 0 0 0 1px var(--border);
398
+ }
399
+
400
+ /* ─── Distinctive: Atmospheric hero gradient ───────────────
401
+ * DESIGN.md §1 + §4 name the "soft, cloud-like green-to-
402
+ * white gradient wash" as the hero's signature. We layer two
403
+ * blurred radial tints in the brand mint over the white
404
+ * background — barely registering as a hue shift, more
405
+ * "atmospheric intelligence" than overt colour. The wash
406
+ * fades to var(--bg) before reaching the section edges so
407
+ * the page stays visually white-on-white. */
408
+ .hero {
409
+ position: relative;
410
+ overflow: hidden;
411
+ }
412
+ .hero::before {
413
+ content: "";
414
+ position: absolute;
415
+ inset: -20% -10% 30% -10%;
416
+ background:
417
+ radial-gradient(60% 80% at 30% 20%, color-mix(in oklab, var(--accent), var(--bg) 78%) 0%, var(--bg) 70%),
418
+ radial-gradient(50% 60% at 75% 10%, color-mix(in oklab, var(--accent), var(--bg) 86%) 0%, var(--bg) 75%);
419
+ filter: blur(40px);
420
+ opacity: 0.9;
421
+ z-index: 0;
422
+ pointer-events: none;
423
+ }
424
+ .hero > * { position: relative; z-index: 1; }
425
+ .hero-eyebrow-row {
426
+ display: inline-flex;
427
+ align-items: center;
428
+ gap: var(--space-2);
429
+ }
430
+ .hero h1 { max-width: 18ch; }
431
+ .hero .lede {
432
+ max-width: 56ch;
433
+ margin-block-start: var(--space-5);
434
+ }
435
+ .hero-actions {
436
+ display: flex;
437
+ gap: var(--space-3);
438
+ margin-block-start: var(--space-8);
439
+ align-items: center;
440
+ flex-wrap: wrap;
441
+ }
442
+ .hero-meta {
443
+ display: inline-flex;
444
+ align-items: center;
445
+ gap: var(--space-3);
446
+ margin-block-start: var(--space-6);
447
+ color: var(--muted);
448
+ font-size: var(--text-sm);
449
+ flex-wrap: wrap;
450
+ }
451
+
452
+ /* ─── Trust bar — DESIGN.md §4 "Loved by your favorite
453
+ companies". A horizontal grid of muted logo containers,
454
+ each on the warm surface tint with the signature 5%
455
+ border. We render text wordmarks instead of real logos
456
+ to keep the fixture self-contained. */
457
+ .trust {
458
+ display: grid;
459
+ grid-template-columns: repeat(5, 1fr);
460
+ gap: var(--space-3);
461
+ margin-block-start: var(--space-8);
462
+ }
463
+ @media (max-width: 1023px) {
464
+ .trust { grid-template-columns: repeat(3, 1fr); }
465
+ }
466
+ @media (max-width: 639px) {
467
+ .trust { grid-template-columns: repeat(2, 1fr); }
468
+ }
469
+ .trust-mark {
470
+ font-family: var(--font-display);
471
+ font-size: var(--text-base);
472
+ font-weight: 500;
473
+ letter-spacing: -0.01em;
474
+ color: var(--muted);
475
+ }
476
+
477
+ /* ─── Feature cards grid ──────────────────────────────────── */
478
+ .features-grid {
479
+ display: grid;
480
+ grid-template-columns: repeat(3, 1fr);
481
+ gap: var(--space-5);
482
+ margin-block-start: var(--space-8);
483
+ }
484
+ @media (max-width: 1023px) {
485
+ .features-grid { grid-template-columns: 1fr 1fr; }
486
+ }
487
+ @media (max-width: 639px) {
488
+ .features-grid { grid-template-columns: 1fr; }
489
+ }
490
+ .feature-icon {
491
+ display: inline-flex;
492
+ align-items: center;
493
+ justify-content: center;
494
+ width: 36px;
495
+ height: 36px;
496
+ border-radius: var(--radius-pill);
497
+ background: color-mix(in oklab, var(--accent), white 78%);
498
+ color: var(--accent-hover);
499
+ margin-block-end: var(--space-2);
500
+ }
501
+ .feature-icon svg { width: 18px; height: 18px; }
502
+
503
+ /* ─── Form card section ───────────────────────────────────── */
504
+ .form-row {
505
+ display: grid;
506
+ grid-template-columns: 1.2fr 1fr;
507
+ gap: var(--space-12);
508
+ align-items: start;
509
+ margin-block-start: var(--space-8);
510
+ }
511
+ @media (max-width: 1023px) {
512
+ .form-row { grid-template-columns: 1fr; }
513
+ }
514
+ .form {
515
+ display: flex;
516
+ flex-direction: column;
517
+ gap: var(--space-4);
518
+ max-width: 440px;
519
+ padding: var(--space-6);
520
+ background: var(--surface);
521
+ border: 1px solid var(--border);
522
+ border-radius: var(--radius-lg);
523
+ box-shadow: var(--elev-raised);
524
+ }
525
+ .form-actions {
526
+ display: flex;
527
+ gap: var(--space-3);
528
+ margin-block-start: var(--space-2);
529
+ align-items: center;
530
+ flex-wrap: wrap;
531
+ }
532
+ .row-between {
533
+ display: flex;
534
+ align-items: center;
535
+ justify-content: space-between;
536
+ gap: var(--space-3);
537
+ }
538
+ .icon { width: 16px; height: 16px; flex-shrink: 0; }
539
+ </style>
540
+ </head>
541
+ <body>
542
+ <main class="container">
543
+ <!-- ════════════════════════════════════════════════════════════
544
+ HERO — exercises: atmospheric mint-on-white gradient wash
545
+ (DESIGN.md §1 hero signature), h1 at 64px Inter W600 with
546
+ -0.02em (≈ -1.28px) tracking, .lede in --muted, dual full-
547
+ pill CTAs (.btn-primary black + .btn-secondary white), kbd
548
+ hint and .badge-mint status pill. The gradient layers two
549
+ blurred radial tints in the brand green over the white
550
+ bg so it reads as "documentation that floats above the
551
+ noise" without overpowering the page.
552
+ ═══════════════════════════════════════════════════════════════ -->
553
+ <section class="hero" data-od-id="hero">
554
+ <div class="hero-eyebrow-row">
555
+ <span class="tag-mono">v1.0 · stable</span>
556
+ <p class="eyebrow">Reference fixture · mintlify</p>
557
+ </div>
558
+ <h1 style="margin-block-start: var(--space-6)">The documentation your users will love.</h1>
559
+ <p class="lede">
560
+ A token block distilled from Mintlify's published design system —
561
+ Inter with tight -0.02em display tracking, full-pill buttons and
562
+ inputs, mint accent used sparingly, and 5%-opacity hairlines
563
+ carrying every section break. The fixture you are reading paints
564
+ from the same <code style="font-family: var(--font-mono); font-size: 0.95em">:root</code>
565
+ block agents inline into every Mintlify artifact.
566
+ </p>
567
+ <div class="hero-actions">
568
+ <a href="./tokens.css" class="btn btn-primary">
569
+ View tokens
570
+ <svg
571
+ class="icon"
572
+ viewBox="0 0 24 24"
573
+ fill="none"
574
+ stroke="currentColor"
575
+ stroke-width="1.75"
576
+ stroke-linecap="round"
577
+ stroke-linejoin="round"
578
+ aria-hidden="true"
579
+ >
580
+ <path d="M5 12h14M13 6l6 6-6 6" />
581
+ </svg>
582
+ </a>
583
+ <a href="./DESIGN.md" class="btn btn-secondary">Read the spec</a>
584
+ <a href="#features" class="btn btn-ghost">Skip to components</a>
585
+ </div>
586
+ <p class="hero-meta">
587
+ <span class="badge badge-mint">
588
+ <span class="badge-dot" aria-hidden="true"></span>
589
+ 56 tokens · 0 C-extensions
590
+ </span>
591
+ <span>Press <kbd>⌘</kbd> <kbd>K</kbd> to search the docs.</span>
592
+ </p>
593
+
594
+ <div class="trust" aria-label="Loved by teams that ship docs">
595
+ <div class="card-trust"><span class="trust-mark">Anthropic</span></div>
596
+ <div class="card-trust"><span class="trust-mark">Resend</span></div>
597
+ <div class="card-trust"><span class="trust-mark">Cursor</span></div>
598
+ <div class="card-trust"><span class="trust-mark">Replicate</span></div>
599
+ <div class="card-trust"><span class="trust-mark">ElevenLabs</span></div>
600
+ </div>
601
+ </section>
602
+
603
+ <!-- ════════════════════════════════════════════════════════════
604
+ FEATURES — three cards demonstrating the standard card
605
+ treatment (16px radius, 5% border, 0.03-alpha shadow
606
+ whisper). Each card opens with a mint-tinted icon disc —
607
+ the rare moment the brand green is visible on a non-CTA
608
+ surface — followed by an h3 at 20px W600 with -0.01em
609
+ tracking and a body line in --fg-2.
610
+ ═══════════════════════════════════════════════════════════════ -->
611
+ <section data-od-id="features" id="features">
612
+ <div class="stack-3">
613
+ <p class="eyebrow">What this fixture exercises</p>
614
+ <h2 style="max-width: 22ch">Documentation as product, not afterthought.</h2>
615
+ <p class="body-muted" style="max-width: 56ch; margin-block-start: var(--space-4)">
616
+ Every component below pulls from <code style="font-family: var(--font-mono); font-size: 0.95em">var(--*)</code> —
617
+ no raw hex, no off-token type, no shadow heavier than the
618
+ documented 0.03-alpha whisper.
619
+ </p>
620
+ </div>
621
+
622
+ <div class="features-grid">
623
+ <article class="card">
624
+ <span class="feature-icon" aria-hidden="true">
625
+ <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
626
+ <path d="M4 6h16M4 12h10M4 18h16" />
627
+ </svg>
628
+ </span>
629
+ <h3>Whisper-thin separation.</h3>
630
+ <p class="body-muted body-sm">
631
+ 5% black hairlines (<code style="font-family: var(--font-mono); font-size: 0.95em">rgba(0,0,0,0.05)</code>)
632
+ carry every section break and card edge. No gray section
633
+ backgrounds, no heavy shadows — the depth system is
634
+ border-driven, paper-like.
635
+ </p>
636
+ <a href="./tokens.css" class="body-sm">Inspect <code style="font-family: var(--font-mono); font-size: 0.95em">--border</code> &rarr;</a>
637
+ </article>
638
+
639
+ <article class="card">
640
+ <span class="feature-icon" aria-hidden="true">
641
+ <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
642
+ <circle cx="12" cy="12" r="9" />
643
+ <path d="M3 12h18M12 3a13.5 13.5 0 0 1 0 18M12 3a13.5 13.5 0 0 0 0 18" />
644
+ </svg>
645
+ </span>
646
+ <h3>The pill is the signature.</h3>
647
+ <p class="body-muted body-sm">
648
+ Every button, input, and badge resolves to
649
+ <code style="font-family: var(--font-mono); font-size: 0.95em">--radius-pill</code>
650
+ (9999px). Cards step from 16 (standard) to 24 (featured) —
651
+ the four-tier radius scale is the silhouette grammar of
652
+ the system.
653
+ </p>
654
+ <a href="./DESIGN.md" class="body-sm">Read the rule &rarr;</a>
655
+ </article>
656
+
657
+ <article class="card">
658
+ <span class="feature-icon" aria-hidden="true">
659
+ <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
660
+ <path d="M4 7l4-3 4 3 4-3 4 3M4 17l4 3 4-3 4 3 4-3M4 7v10M20 7v10" />
661
+ </svg>
662
+ </span>
663
+ <h3>Inter runs tight on display.</h3>
664
+ <p class="body-muted body-sm">
665
+ Hero tracks at <code style="font-family: var(--font-mono); font-size: 0.95em">-0.02em</code>
666
+ (≈ -1.28px at 64px), section heads at -0.02em, body relaxes
667
+ to 0. Three weights only: 400 reads, 500 interacts, 600
668
+ announces. Geist Mono is reserved for the terminal voice.
669
+ </p>
670
+ <a href="./tokens.css" class="body-sm">Inspect typography &rarr;</a>
671
+ </article>
672
+ </div>
673
+ </section>
674
+
675
+ <!-- ════════════════════════════════════════════════════════════
676
+ FORM — full-pill input matching the button silhouette,
677
+ mint focus ring (--focus-ring is 2px var(--accent)), all
678
+ wrapped in a 24px-radius featured card to demonstrate the
679
+ large-radius tier. The dark + ghost button pair reuses
680
+ .btn-primary / .btn-secondary unchanged so the silhouette
681
+ stays consistent with the hero CTAs above.
682
+ ═══════════════════════════════════════════════════════════════ -->
683
+ <section data-od-id="form">
684
+ <p class="eyebrow">Form components</p>
685
+ <h2 style="margin-block-start: var(--space-3); max-width: 28ch">Inputs inherit the same tokens.</h2>
686
+
687
+ <div class="form-row">
688
+ <div class="stack-4">
689
+ <p class="body-muted" style="max-width: 48ch">
690
+ Focus ring, edge, and placeholder colour all derive from
691
+ <code style="font-family: var(--font-mono); font-size: 0.95em">--accent</code> and
692
+ <code style="font-family: var(--font-mono); font-size: 0.95em">--border</code>.
693
+ The submit button reuses
694
+ <code style="font-family: var(--font-mono); font-size: 0.95em">.btn-primary</code>
695
+ unchanged — black fill, white label, full-pill silhouette.
696
+ </p>
697
+ <p class="body-muted body-sm">
698
+ No new token is introduced for this section. The form card
699
+ uses the documented featured-card radius
700
+ (<code style="font-family: var(--font-mono); font-size: 0.95em">--radius-lg</code>, 24px)
701
+ and the same 0.03-alpha shadow whisper as everything else.
702
+ </p>
703
+ <p class="body-meta">
704
+ Full reference at <a href="./tokens.css">tokens.css</a> ·
705
+ spec at <a href="./DESIGN.md">DESIGN.md</a>.
706
+ </p>
707
+ </div>
708
+
709
+ <form class="form" onsubmit="event.preventDefault();">
710
+ <div class="row-between">
711
+ <p class="eyebrow">Get the spec</p>
712
+ <span class="badge badge-success">
713
+ <span class="badge-dot" aria-hidden="true"></span>
714
+ Open
715
+ </span>
716
+ </div>
717
+ <div class="field">
718
+ <label for="email">Work email</label>
719
+ <input
720
+ id="email"
721
+ type="email"
722
+ placeholder="you@team.dev"
723
+ autocomplete="email"
724
+ required
725
+ />
726
+ <p class="field-help">We'll send the spec PDF and nothing else.</p>
727
+ </div>
728
+ <div class="form-actions">
729
+ <button type="submit" class="btn btn-primary">Send the spec</button>
730
+ <button type="button" class="btn btn-secondary">Skip for now</button>
731
+ </div>
732
+ </form>
733
+ </div>
734
+ </section>
735
+ </main>
736
+ </body>
737
+ </html>