@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/nvidia/components.html ADDED
@@ -0,0 +1,414 @@
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>NVIDIA — reference components</title>
7
+ <meta
8
+ name="description"
9
+ content="Reference fixture for design-systems/nvidia. GPU computing aesthetic:
10
+ true black canvas, NVIDIA Green (#76b900) as signal-only accent,
11
+ bold NVIDIA-EMEA typography, minimal 2px radius, teal hover surprise."
12
+ />
13
+
14
+ <style>
15
+ :root {
16
+ --bg: #000000;
17
+ --surface: #1a1a1a;
18
+ --surface-warm: var(--surface);
19
+
20
+ --fg: #ffffff;
21
+ --fg-2: #a7a7a7;
22
+ --muted: #757575;
23
+ --meta: #898989;
24
+
25
+ --border: #5e5e5e;
26
+ --border-soft: #2a2a2a;
27
+
28
+ /* NVIDIA Green — SIGNAL only: borders, underlines, outlines, NOT fills */
29
+ --accent: #76b900;
30
+ --accent-on: #000000;
31
+ --accent-hover: #1eaedb; /* Teal — the NVIDIA button hover surprise */
32
+ --accent-active: #007fff; /* Bright Blue — pressed state */
33
+
34
+ --success: #3f8500;
35
+ --warn: #ef9100;
36
+ --danger: #e52020;
37
+
38
+ --font-display: "NVIDIA-EMEA", Arial, Helvetica, sans-serif;
39
+ --font-body: "NVIDIA-EMEA", Arial, Helvetica, sans-serif;
40
+ --font-mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;
41
+
42
+ --text-xs: 10px;
43
+ --text-sm: 12px;
44
+ --text-base: 16px;
45
+ --text-lg: 18px;
46
+ --text-xl: 22px;
47
+ --text-2xl: 24px;
48
+ --text-3xl: 32px;
49
+ --text-4xl: 36px;
50
+
51
+ --leading-body: 1.5;
52
+ --leading-tight: 1.25;
53
+ --tracking-display: 0em;
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: 64px;
65
+ --section-y-tablet: 48px;
66
+ --section-y-phone: 32px;
67
+
68
+ --radius-sm: 2px; /* Everything — precision-engineered, no softness */
69
+ --radius-md: 2px;
70
+ --radius-lg: 4px;
71
+ --radius-pill: 9999px;
72
+
73
+ --elev-flat: none;
74
+ --elev-ring: 0 0 0 2px var(--accent); /* Green ring — the NVIDIA signal */
75
+ --elev-raised: rgba(0, 0, 0, 0.3) 0px 0px 5px 0px;
76
+
77
+ --focus-ring: 0 0 0 2px #ffffff;
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: 24px;
85
+ --container-gutter-tablet: 16px;
86
+ --container-gutter-phone: 12px;
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
+ -webkit-font-smoothing: antialiased;
99
+ }
100
+
101
+ /* ─── Layout ─────────────────────────────────────────────── */
102
+ .container { max-width: var(--container-max); margin-inline: auto; padding-inline: var(--container-gutter-desktop); }
103
+ section { padding-block: var(--section-y-desktop); }
104
+ section + section { border-top: 1px solid var(--border-soft); }
105
+ @media (max-width: 1023px) {
106
+ .container { padding-inline: var(--container-gutter-tablet); }
107
+ section { padding-block: var(--section-y-tablet); }
108
+ }
109
+ @media (max-width: 639px) {
110
+ .container { padding-inline: var(--container-gutter-phone); }
111
+ section { padding-block: var(--section-y-phone); }
112
+ }
113
+
114
+ /* ─── Typography — Bold dominant voice ──────────────────── */
115
+ h1, h2, h3 {
116
+ font-family: var(--font-display);
117
+ font-weight: 700; /* Bold is the NVIDIA voice */
118
+ line-height: var(--leading-tight);
119
+ margin: 0;
120
+ letter-spacing: 0;
121
+ }
122
+ h1 { font-size: var(--text-4xl); } /* 36px display */
123
+ h2 { font-size: var(--text-3xl); } /* 32px */
124
+ h3 { font-size: var(--text-2xl); } /* 24px */
125
+ p { margin: 0; font-weight: 400; } /* 400 for body only */
126
+ .lead { font-size: var(--text-lg); color: var(--fg-2); line-height: var(--leading-body); }
127
+ .body-muted { color: var(--muted); }
128
+ .body-sm { font-size: var(--text-sm); }
129
+ .eyebrow {
130
+ font-family: var(--font-body);
131
+ font-size: var(--text-xs);
132
+ font-weight: 700;
133
+ color: var(--accent); /* Green eyebrow — signal, not decoration */
134
+ text-transform: uppercase;
135
+ letter-spacing: 0.08em;
136
+ }
137
+ /* NVIDIA Green underline treatment — brand rule */
138
+ .green-underline { text-decoration: underline; text-decoration-color: var(--accent); text-underline-offset: 3px; }
139
+
140
+ .stack-3 > * + * { margin-block-start: var(--space-3); }
141
+ .stack-4 > * + * { margin-block-start: var(--space-4); }
142
+ .stack-6 > * + * { margin-block-start: var(--space-6); }
143
+
144
+ /* ─── Buttons — green border, teal hover ────────────────── */
145
+ .btn {
146
+ display: inline-flex;
147
+ align-items: center;
148
+ gap: var(--space-2);
149
+ padding: 10px 20px;
150
+ border-radius: var(--radius-sm); /* 2px — precision hardware */
151
+ font-family: var(--font-body);
152
+ font-size: var(--text-base);
153
+ font-weight: 700; /* Bold — NVIDIA voice */
154
+ line-height: 1;
155
+ cursor: pointer;
156
+ border: 2px solid transparent;
157
+ transition: background-color var(--motion-fast) var(--ease-standard),
158
+ border-color var(--motion-fast) var(--ease-standard),
159
+ color var(--motion-fast) var(--ease-standard);
160
+ text-decoration: none;
161
+ }
162
+ .btn:active { transform: translateY(1px); }
163
+ .btn:focus-visible { outline: none; box-shadow: var(--focus-ring); }
164
+ /* Primary: transparent + 2px green border → teal fill on hover */
165
+ .btn-primary {
166
+ background: transparent;
167
+ color: var(--fg);
168
+ border-color: var(--accent); /* Green border IS the primary signal */
169
+ }
170
+ .btn-primary:hover {
171
+ background: var(--accent-hover); /* Teal fill — the NVIDIA surprise */
172
+ border-color: var(--accent-hover);
173
+ color: #ffffff;
174
+ }
175
+ .btn-primary:active {
176
+ background: var(--accent-active);
177
+ border-color: var(--accent-active);
178
+ }
179
+ /* Secondary: dark surface fill, gray border */
180
+ .btn-secondary {
181
+ background: var(--surface);
182
+ color: var(--fg-2);
183
+ border-color: var(--border);
184
+ }
185
+ .btn-secondary:hover { background: #2a2a2a; color: var(--fg); border-color: var(--fg-2); }
186
+
187
+ /* ─── Light section override ─────────────────────────────── */
188
+ .section-light {
189
+ background: #ffffff;
190
+ color: #000000;
191
+ }
192
+ .section-light .eyebrow { color: var(--accent); }
193
+ .section-light p { color: #333333; }
194
+ .section-light .card {
195
+ background: #f5f5f5;
196
+ border-color: #e0e0e0;
197
+ }
198
+ .section-light .btn-primary {
199
+ background: transparent;
200
+ color: #000000;
201
+ border-color: var(--accent);
202
+ }
203
+ .section-light .btn-primary:hover {
204
+ background: var(--accent-hover);
205
+ border-color: var(--accent-hover);
206
+ color: #ffffff;
207
+ }
208
+
209
+ /* ─── Inputs ────────────────────────────────────────────── */
210
+ .field { display: flex; flex-direction: column; gap: var(--space-2); }
211
+ .field label {
212
+ font-family: var(--font-body);
213
+ font-size: var(--text-sm);
214
+ font-weight: 700;
215
+ color: var(--fg-2);
216
+ }
217
+ .field input {
218
+ padding: 10px 14px;
219
+ border-radius: var(--radius-sm); /* 2px */
220
+ border: 1px solid var(--border);
221
+ background: var(--surface);
222
+ color: var(--fg);
223
+ font-family: var(--font-body);
224
+ font-size: var(--text-base);
225
+ outline: none;
226
+ transition: border-color var(--motion-fast) var(--ease-standard),
227
+ box-shadow var(--motion-fast) var(--ease-standard);
228
+ }
229
+ .field input:focus-visible {
230
+ border-color: var(--accent); /* Green border on focus */
231
+ box-shadow: 0 0 0 1px var(--accent);
232
+ }
233
+ .field input::placeholder { color: var(--muted); }
234
+ .field-help { font-size: var(--text-xs); color: var(--meta); }
235
+
236
+ /* ─── Cards ─────────────────────────────────────────────── */
237
+ .card {
238
+ background: var(--surface);
239
+ border: 1px solid var(--border-soft);
240
+ border-radius: var(--radius-md);
241
+ padding: 20px 24px;
242
+ display: flex;
243
+ flex-direction: column;
244
+ gap: var(--space-3);
245
+ box-shadow: var(--elev-raised);
246
+ }
247
+ /* Green-accented card: left border signal */
248
+ .card.accent-border { border-left: 3px solid var(--accent); }
249
+
250
+ /* ─── Badges ─────────────────────────────────────────────── */
251
+ .badge {
252
+ display: inline-flex; align-items: center; gap: var(--space-2);
253
+ padding: 2px 8px;
254
+ border-radius: var(--radius-sm);
255
+ font-family: var(--font-body);
256
+ font-size: var(--text-xs); font-weight: 700; line-height: 1.2;
257
+ text-transform: uppercase; letter-spacing: 0.06em;
258
+ }
259
+ .badge-green { color: var(--accent); background: rgba(118, 185, 0, 0.12); border: 1px solid rgba(118,185,0,0.3); }
260
+ .badge-muted { color: var(--muted); background: rgba(94,94,94,0.2); }
261
+
262
+ /* ─── Links ─────────────────────────────────────────────── */
263
+ a { color: var(--accent); text-decoration: none; }
264
+ a:hover { text-decoration: underline; text-decoration-color: var(--accent); }
265
+
266
+ /* ─── Layout helpers ────────────────────────────────────── */
267
+ .hero-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: var(--space-12); align-items: center; }
268
+ @media (max-width: 1023px) { .hero-grid { grid-template-columns: 1fr; gap: var(--space-8); } }
269
+ .hero-actions { display: flex; gap: var(--space-3); margin-block-start: var(--space-6); flex-wrap: wrap; }
270
+ .features-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-5); }
271
+ @media (max-width: 1023px) { .features-grid { grid-template-columns: 1fr 1fr; } }
272
+ @media (max-width: 639px) { .features-grid { grid-template-columns: 1fr; } }
273
+ .form-row { display: grid; grid-template-columns: 1.2fr 1fr; gap: var(--space-12); align-items: start; }
274
+ @media (max-width: 1023px) { .form-row { grid-template-columns: 1fr; } }
275
+ .form { display: flex; flex-direction: column; gap: var(--space-4); max-width: 420px; }
276
+ .form-actions { display: flex; gap: var(--space-3); margin-block-start: var(--space-2); }
277
+ .row-between { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); }
278
+ .icon { width: 16px; height: 16px; flex-shrink: 0; }
279
+ /* GPU spec row */
280
+ .spec-row {
281
+ display: flex; gap: var(--space-4); flex-wrap: wrap;
282
+ border-top: 1px solid var(--border-soft);
283
+ padding-block-start: var(--space-4);
284
+ margin-block-start: var(--space-4);
285
+ }
286
+ .spec { display: flex; flex-direction: column; gap: 2px; }
287
+ .spec .num { font-size: var(--text-xl); font-weight: 700; color: var(--accent); }
288
+ .spec .lbl { font-size: var(--text-xs); color: var(--muted); text-transform: uppercase; letter-spacing: 0.06em; }
289
+ </style>
290
+ </head>
291
+ <body>
292
+ <main>
293
+ <!-- Dark section — primary NVIDIA canvas -->
294
+ <section data-od-id="hero">
295
+ <div class="container">
296
+ <div class="hero-grid">
297
+ <div class="stack-4">
298
+ <p class="eyebrow">reference-fixture · nvidia</p>
299
+ <h1>Accelerated<br><span class="green-underline">intelligence.</span></h1>
300
+ <p class="lead" style="max-width: 48ch">
301
+ True black canvas. NVIDIA Green (#76b900) used only as signal —
302
+ borders, underlines, outlines. Never filled. Hover reveals
303
+ teal (#1eaedb) — the brand surprise.
304
+ </p>
305
+ <div class="hero-actions">
306
+ <a href="./tokens.css" class="btn btn-primary">
307
+ View tokens
308
+ <svg class="icon" viewBox="0 0 24 24" fill="none"
309
+ stroke="currentColor" stroke-width="1.75"
310
+ stroke-linecap="round" stroke-linejoin="round"
311
+ aria-hidden="true"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
312
+ </a>
313
+ <a href="./DESIGN.md" class="btn btn-secondary">Read design</a>
314
+ </div>
315
+ <div class="spec-row">
316
+ <div class="spec"><span class="num">2px</span><span class="lbl">radius</span></div>
317
+ <div class="spec"><span class="num">700</span><span class="lbl">weight</span></div>
318
+ <div class="spec"><span class="num">#76b900</span><span class="lbl">green</span></div>
319
+ <div class="spec"><span class="num">#1eaedb</span><span class="lbl">hover</span></div>
320
+ </div>
321
+ </div>
322
+ <aside style="display: flex; flex-direction: column; gap: var(--space-4);">
323
+ <div class="card accent-border">
324
+ <div class="row-between">
325
+ <span class="eyebrow">key rule</span>
326
+ <span class="badge badge-green">A1-identity</span>
327
+ </div>
328
+ <h3>Green = signal, not fill</h3>
329
+ <p class="body-muted body-sm">
330
+ --accent: #76b900 appears as 2px borders and underlines only.
331
+ The primary button is transparent with a green border — hover
332
+ fills it with teal (#1eaedb), not green.
333
+ </p>
334
+ </div>
335
+ </aside>
336
+ </div>
337
+ </div>
338
+ </section>
339
+
340
+ <!-- Features — dark cards -->
341
+ <section data-od-id="features">
342
+ <div class="container">
343
+ <div class="stack-3">
344
+ <p class="eyebrow">what-this-fixture-exercises</p>
345
+ <h2>2px radius. Bold hierarchy. Green borders.</h2>
346
+ </div>
347
+ <div class="features-grid" style="margin-block-start: var(--space-8)">
348
+ <article class="card">
349
+ <span class="badge badge-green">A1-identity</span>
350
+ <h3>NVIDIA-EMEA Bold</h3>
351
+ <p class="body-muted body-sm">
352
+ Arial/Helvetica fallback. Font-weight 700 is the dominant voice
353
+ for headings, buttons, nav, labels. Weight 400 reserved for body
354
+ copy and descriptions only.
355
+ </p>
356
+ <a href="./tokens.css" class="body-sm">Inspect typography →</a>
357
+ </article>
358
+ <article class="card">
359
+ <span class="badge badge-green">A1-identity</span>
360
+ <h3>Teal hover surprise</h3>
361
+ <p class="body-muted body-sm">
362
+ Primary CTA: transparent + 2px green border at rest.
363
+ Hover: teal fill (#1eaedb). Active: bright blue (#007fff).
364
+ No dark-green variation — it's a horizontal color shift.
365
+ </p>
366
+ <a href="./DESIGN.md" class="body-sm">Read the rule →</a>
367
+ </article>
368
+ <article class="card">
369
+ <span class="badge badge-muted">A1-structure</span>
370
+ <h3>Dense 64px sections</h3>
371
+ <p class="body-muted body-sm">
372
+ --section-y-desktop: 64px — tighter than typical SaaS.
373
+ Technical product catalogs require density. 1200px container,
374
+ full-width alternating dark/light sections.
375
+ </p>
376
+ <a href="./tokens.css" class="body-sm">Inspect spacing →</a>
377
+ </article>
378
+ </div>
379
+ </div>
380
+ </section>
381
+
382
+ <!-- Light section override — NVIDIA alternates black/white -->
383
+ <section data-od-id="light-world" class="section-light">
384
+ <div class="container">
385
+ <div class="form-row">
386
+ <div class="stack-4">
387
+ <p class="eyebrow">light-section-override</p>
388
+ <h2 style="color: #000000;">Same green signal. White canvas.</h2>
389
+ <p style="color: #333333; max-width: 48ch">
390
+ NVIDIA alternate sections use white backgrounds. Green accent
391
+ remains #76b900 — it works identically on both dark and light.
392
+ Button behavior is identical: transparent + green border,
393
+ teal fill on hover.
394
+ </p>
395
+ </div>
396
+ <form class="form" onsubmit="event.preventDefault();">
397
+ <div class="field" style="--border: #d0d0d0; --surface: #f5f5f5;">
398
+ <label for="api-key" style="color: #333;">API key</label>
399
+ <input id="api-key" type="text"
400
+ style="background: #f5f5f5; color: #000; border-color: #d0d0d0;"
401
+ placeholder="nvapi-..." autocomplete="off" />
402
+ <p class="field-help" style="color: #666;">Access NVIDIA NIM inference endpoints.</p>
403
+ </div>
404
+ <div class="form-actions">
405
+ <button type="submit" class="btn btn-primary" style="color: #000;">Save</button>
406
+ <button type="button" class="btn" style="border-color: #999; color: #333; background: transparent;">Cancel</button>
407
+ </div>
408
+ </form>
409
+ </div>
410
+ </div>
411
+ </section>
412
+ </main>
413
+ </body>
414
+ </html>
package/dist/designer/data/systems/nvidia/tokens.css ADDED
@@ -0,0 +1,133 @@
1
+ /* ─────────────────────────────────────────────────────────────────────────
2
+ * design-systems/nvidia/tokens.css
3
+ *
4
+ * Structured token bindings for "Design System Inspired by NVIDIA".
5
+ * GPU computing power aesthetic: black canvas, NVIDIA Green (#76b900) as
6
+ * pure signal accent, industrial NVIDIA-EMEA font, minimal 2px radius.
7
+ *
8
+ * Key brand decisions encoded here:
9
+ * - True black (#000000) primary canvas — maximum energy contrast
10
+ * - NVIDIA Green (#76b900) as SIGNAL ONLY: borders, underlines, outlines
11
+ * — never as large surface fills (that's the rule from the brand)
12
+ * - Bold (700) as the dominant voice for headings, buttons, nav, labels
13
+ * - Minimal radius (2px) — precision-engineered hardware aesthetic
14
+ * - Primary button is transparent with 2px green border (NOT filled green)
15
+ * - Hover shifts: green-border → teal fill (#1eaedb) — the NVIDIA surprise
16
+ * - Dark/light section alternation — green works identically on both
17
+ * ─────────────────────────────────────────────────────────────────── */
18
+
19
+ :root {
20
+ /* ─── Surface ─────────────────────────────────────────────────────
21
+ * True black as the dominant page canvas. Cards and content areas
22
+ * alternate with white sections. Near Black (#1a1a1a) for dark cards. */
23
+ --bg: #000000; /* True Black — dominant dark canvas */
24
+ --surface: #1a1a1a; /* Near Black — card backgrounds on black pages */
25
+ --surface-warm: var(--surface); /* alias — no warm tier; system is monochromatic */
26
+
27
+ /* ─── Foreground (on dark) ────────────────────────────────────────
28
+ * White primary text. Gray scale for hierarchy on dark backgrounds. */
29
+ --fg: #ffffff; /* Pure White — primary text on dark backgrounds */
30
+ --fg-2: #a7a7a7; /* Gray 300 — muted heading variants */
31
+ --muted: #757575; /* Gray 500 — tertiary text, placeholders, footers */
32
+ --meta: #898989; /* Gray 400 — secondary text, metadata */
33
+
34
+ /* ─── Border ──────────────────────────────────────────────────────
35
+ * Gray borders for structure; NVIDIA Green for emphasis/accent borders.
36
+ * The 2px green border IS the primary interactive signal. */
37
+ --border: #5e5e5e; /* Gray Border — subtle borders, divider lines */
38
+ --border-soft: #2a2a2a; /* Barely visible inner divider on dark */
39
+
40
+ /* ─── Accent ──────────────────────────────────────────────────────
41
+ * NVIDIA Green — the brand fingerprint. Use ONLY for borders, underlines,
42
+ * outlines, and active indicators. Never as a filled surface.
43
+ *
44
+ * Note on hover/active: NVIDIA's CTA hover shifts to TEAL (#1eaedb),
45
+ * not a darker green. This is the NVIDIA brand surprise — document it.
46
+ * --accent-hover: teal fill for hover state
47
+ * --accent-active: bright blue for active/pressed */
48
+ --accent: #76b900; /* NVIDIA Green — the signature */
49
+ --accent-on: #000000; /* Dark text on green (if ever used as fill) */
50
+ --accent-hover: #1eaedb; /* Teal — NVIDIA button hover color */
51
+ --accent-active: #007fff; /* Bright Blue — NVIDIA button active color */
52
+
53
+ /* ─── Semantic ────────────────────────────────────────────────────
54
+ * Success uses a darker green (#3f8500) — clearly distinct from the
55
+ * brand NVIDIA Green (#76b900) while remaining in the green family. */
56
+ --success: #3f8500; /* Green 500 — success (darker than brand green) */
57
+ --warn: #ef9100; /* Yellow 300 — advisory states */
58
+ --danger: #e52020; /* Red 500 — error states */
59
+
60
+ /* ─── Typography ──────────────────────────────────────────────────
61
+ * NVIDIA-EMEA font (Arial/Helvetica fallbacks) — European, pragmatic,
62
+ * engineering-focused. Bold (700) as the dominant voice.
63
+ * 400 reserved for body text and descriptions only. */
64
+ --font-display: "NVIDIA-EMEA", Arial, Helvetica, sans-serif;
65
+ --font-body: "NVIDIA-EMEA", Arial, Helvetica, sans-serif;
66
+ --font-mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;
67
+
68
+ /* Type scale — DESIGN.md §3. Display at 36px (modest by GPU standards).
69
+ * Dense technical content doesn't need massive display typography. */
70
+ --text-xs: 10px; /* Micro Label — uppercase tiny badges */
71
+ --text-sm: 12px; /* Caption Small — fine print, legal */
72
+ --text-base: 16px; /* Body — standard reading text */
73
+ --text-lg: 18px; /* Body Large — emphasized lead paragraphs */
74
+ --text-xl: 22px; /* Sub-heading — feature descriptions */
75
+ --text-2xl: 24px; /* Section Heading */
76
+ --text-3xl: 32px; /* Below display — intermediate heading */
77
+ --text-4xl: 36px; /* Display Hero — maximum impact headlines */
78
+
79
+ --leading-body: 1.5; /* Body text */
80
+ --leading-tight: 1.25; /* Tight headings — dense authoritative blocks */
81
+ --tracking-display: 0em; /* No decorative tracking — font carries industrial character */
82
+
83
+ /* ─── Spacing ─────────────────────────────────────────────────────
84
+ * Tighter than typical SaaS — technical content requires density.
85
+ * Primary padding values: 8px, 11px, 13px, 16px, 24px, 32px. */
86
+ --space-1: 4px;
87
+ --space-2: 8px;
88
+ --space-3: 12px;
89
+ --space-4: 16px;
90
+ --space-5: 20px;
91
+ --space-6: 24px;
92
+ --space-8: 32px;
93
+ --space-12: 48px;
94
+
95
+ --section-y-desktop: 64px; /* Denser than typical — GPU catalog feel */
96
+ --section-y-tablet: 48px;
97
+ --section-y-phone: 32px;
98
+
99
+ /* ─── Radius ──────────────────────────────────────────────────────
100
+ * 2px for virtually everything — precision-engineered appearance.
101
+ * No rounding that would soften the hardware character. */
102
+ --radius-sm: 2px; /* Everything — buttons, cards, inputs */
103
+ --radius-md: 2px; /* Same — minimal variation */
104
+ --radius-lg: 4px; /* Rare larger containers */
105
+ --radius-pill: 9999px; /* Declared for schema compliance */
106
+
107
+ /* ─── Elevation ───────────────────────────────────────────────────
108
+ * One shadow value in the system: 5px ambient blur at 30% opacity.
109
+ * The primary depth signal is color contrast (black vs white sections)
110
+ * and green accent borders. */
111
+ --elev-flat: none;
112
+ --elev-ring: 0 0 0 2px var(--accent); /* Green border ring — NVIDIA signal */
113
+ --elev-raised: rgba(0, 0, 0, 0.3) 0px 0px 5px 0px; /* Ambient card shadow */
114
+
115
+ /* ─── Focus ring ──────────────────────────────────────────────────
116
+ * Black outline focus — crisp, hardware-like. The green accent
117
+ * is already used for elev-ring; focus uses black for distinction. */
118
+ --focus-ring: 0 0 0 2px #ffffff; /* White ring on dark surface for visibility */
119
+
120
+ /* ─── Motion ──────────────────────────────────────────────────────
121
+ * Standard durations — GPU software feels solid and instantaneous. */
122
+ --motion-fast: 150ms;
123
+ --motion-base: 200ms;
124
+ --ease-standard: cubic-bezier(0.2, 0, 0, 1);
125
+
126
+ /* ─── Layout ──────────────────────────────────────────────────────
127
+ * 1200px container with full-width hero sections.
128
+ * Feature sections: 2–3 column product card grids. */
129
+ --container-max: 1200px;
130
+ --container-gutter-desktop: 24px;
131
+ --container-gutter-tablet: 16px;
132
+ --container-gutter-phone: 12px;
133
+ }