scrum-skills 0.3.2 → 0.3.4

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 (365) hide show
  1. package/.agents/skills/diagram-design/LICENSE +4 -0
  2. package/.agents/skills/diagram-design/SKILL.md +423 -0
  3. package/.agents/skills/diagram-design/UPSTREAM.json +88 -0
  4. package/.agents/skills/diagram-design/UPSTREAM.md +23 -0
  5. package/.agents/skills/diagram-design/assets/example-architecture-containment.html +205 -0
  6. package/.agents/skills/diagram-design/assets/example-architecture-delta.html +193 -0
  7. package/.agents/skills/diagram-design/assets/example-architecture.html +183 -0
  8. package/.agents/skills/diagram-design/assets/example-axonometric-plan-campus.html +108 -0
  9. package/.agents/skills/diagram-design/assets/example-axonometric-plan-coffee-shop.html +121 -0
  10. package/.agents/skills/diagram-design/assets/example-axonometric-plan-warehouse.html +127 -0
  11. package/.agents/skills/diagram-design/assets/example-axonometric-plan.html +114 -0
  12. package/.agents/skills/diagram-design/assets/example-bar.html +129 -0
  13. package/.agents/skills/diagram-design/assets/example-beeswarm.html +384 -0
  14. package/.agents/skills/diagram-design/assets/example-box-plot.html +127 -0
  15. package/.agents/skills/diagram-design/assets/example-bubble.html +147 -0
  16. package/.agents/skills/diagram-design/assets/example-bump.html +142 -0
  17. package/.agents/skills/diagram-design/assets/example-data-flow.html +143 -0
  18. package/.agents/skills/diagram-design/assets/example-datalake.html +269 -0
  19. package/.agents/skills/diagram-design/assets/example-db-schema.html +302 -0
  20. package/.agents/skills/diagram-design/assets/example-dependency.html +224 -0
  21. package/.agents/skills/diagram-design/assets/example-deployment.html +190 -0
  22. package/.agents/skills/diagram-design/assets/example-dp-integration.html +81 -0
  23. package/.agents/skills/diagram-design/assets/example-dp-security-matrix.html +88 -0
  24. package/.agents/skills/diagram-design/assets/example-er.html +202 -0
  25. package/.agents/skills/diagram-design/assets/example-exploded-ai-stack.html +85 -0
  26. package/.agents/skills/diagram-design/assets/example-exploded-keyboard.html +84 -0
  27. package/.agents/skills/diagram-design/assets/example-exploded-phone.html +83 -0
  28. package/.agents/skills/diagram-design/assets/example-exploded-unboxing.html +84 -0
  29. package/.agents/skills/diagram-design/assets/example-exploded.html +83 -0
  30. package/.agents/skills/diagram-design/assets/example-fishbone.html +152 -0
  31. package/.agents/skills/diagram-design/assets/example-flowchart.html +163 -0
  32. package/.agents/skills/diagram-design/assets/example-gantt.html +137 -0
  33. package/.agents/skills/diagram-design/assets/example-heatmap.html +224 -0
  34. package/.agents/skills/diagram-design/assets/example-high-level-vertical.html +325 -0
  35. package/.agents/skills/diagram-design/assets/example-high-level.html +301 -0
  36. package/.agents/skills/diagram-design/assets/example-import-drawio.html +185 -0
  37. package/.agents/skills/diagram-design/assets/example-import-excalidraw.html +70 -0
  38. package/.agents/skills/diagram-design/assets/example-import-mermaid.html +70 -0
  39. package/.agents/skills/diagram-design/assets/example-it-state.html +128 -0
  40. package/.agents/skills/diagram-design/assets/example-journey.html +148 -0
  41. package/.agents/skills/diagram-design/assets/example-kanban.html +174 -0
  42. package/.agents/skills/diagram-design/assets/example-layers.html +123 -0
  43. package/.agents/skills/diagram-design/assets/example-line.html +111 -0
  44. package/.agents/skills/diagram-design/assets/example-loop.html +100 -0
  45. package/.agents/skills/diagram-design/assets/example-marimekko.html +148 -0
  46. package/.agents/skills/diagram-design/assets/example-medallion.html +159 -0
  47. package/.agents/skills/diagram-design/assets/example-nested.html +136 -0
  48. package/.agents/skills/diagram-design/assets/example-org-chart.html +45 -0
  49. package/.agents/skills/diagram-design/assets/example-polar.html +116 -0
  50. package/.agents/skills/diagram-design/assets/example-process.html +64 -0
  51. package/.agents/skills/diagram-design/assets/example-pyramid.html +119 -0
  52. package/.agents/skills/diagram-design/assets/example-quadrant-consultant.html +166 -0
  53. package/.agents/skills/diagram-design/assets/example-quadrant.html +135 -0
  54. package/.agents/skills/diagram-design/assets/example-radar.html +139 -0
  55. package/.agents/skills/diagram-design/assets/example-ridgeline.html +104 -0
  56. package/.agents/skills/diagram-design/assets/example-sankey.html +150 -0
  57. package/.agents/skills/diagram-design/assets/example-scatter.html +141 -0
  58. package/.agents/skills/diagram-design/assets/example-sequence-oauth.html +227 -0
  59. package/.agents/skills/diagram-design/assets/example-sequence.html +222 -0
  60. package/.agents/skills/diagram-design/assets/example-service-blueprint.html +185 -0
  61. package/.agents/skills/diagram-design/assets/example-slopegraph.html +119 -0
  62. package/.agents/skills/diagram-design/assets/example-state-lifecycle.html +92 -0
  63. package/.agents/skills/diagram-design/assets/example-state.html +147 -0
  64. package/.agents/skills/diagram-design/assets/example-story-map.html +184 -0
  65. package/.agents/skills/diagram-design/assets/example-streamgraph.html +99 -0
  66. package/.agents/skills/diagram-design/assets/example-swimlane.html +172 -0
  67. package/.agents/skills/diagram-design/assets/example-timeline.html +135 -0
  68. package/.agents/skills/diagram-design/assets/example-tree-block-decomposition.html +151 -0
  69. package/.agents/skills/diagram-design/assets/example-tree.html +173 -0
  70. package/.agents/skills/diagram-design/assets/example-treemap.html +107 -0
  71. package/.agents/skills/diagram-design/assets/example-uml-class.html +188 -0
  72. package/.agents/skills/diagram-design/assets/example-venn.html +110 -0
  73. package/.agents/skills/diagram-design/assets/example-wardley.html +153 -0
  74. package/.agents/skills/diagram-design/assets/example-waterfall.html +129 -0
  75. package/.agents/skills/diagram-design/assets/template-dark.html +99 -0
  76. package/.agents/skills/diagram-design/assets/template-full.html +421 -0
  77. package/.agents/skills/diagram-design/assets/template-motion.html +448 -0
  78. package/.agents/skills/diagram-design/assets/template-terminal.html +188 -0
  79. package/.agents/skills/diagram-design/assets/template.html +100 -0
  80. package/.agents/skills/diagram-design/references/animation.md +143 -0
  81. package/.agents/skills/diagram-design/references/export-registry.md +78 -0
  82. package/.agents/skills/diagram-design/references/export.md +376 -0
  83. package/.agents/skills/diagram-design/references/import-drawio.md +181 -0
  84. package/.agents/skills/diagram-design/references/import-excalidraw.md +130 -0
  85. package/.agents/skills/diagram-design/references/import-mermaid.md +137 -0
  86. package/.agents/skills/diagram-design/references/layout-budget.md +97 -0
  87. package/.agents/skills/diagram-design/references/onboarding.md +368 -0
  88. package/.agents/skills/diagram-design/references/output-spec.md +277 -0
  89. package/.agents/skills/diagram-design/references/primitive-annotation.md +36 -0
  90. package/.agents/skills/diagram-design/references/primitive-icons.md +827 -0
  91. package/.agents/skills/diagram-design/references/primitive-sketchy.md +43 -0
  92. package/.agents/skills/diagram-design/references/primitive-terminal.md +76 -0
  93. package/.agents/skills/diagram-design/references/primitives-core.md +150 -0
  94. package/.agents/skills/diagram-design/references/profiles.md +183 -0
  95. package/.agents/skills/diagram-design/references/semantic-patterns.md +154 -0
  96. package/.agents/skills/diagram-design/references/style-guide.md +236 -0
  97. package/.agents/skills/diagram-design/references/style-vivid.md +148 -0
  98. package/.agents/skills/diagram-design/references/type-architecture-delta.md +143 -0
  99. package/.agents/skills/diagram-design/references/type-architecture.md +117 -0
  100. package/.agents/skills/diagram-design/references/type-axonometric-plan.md +83 -0
  101. package/.agents/skills/diagram-design/references/type-bar.md +108 -0
  102. package/.agents/skills/diagram-design/references/type-data-flow.md +371 -0
  103. package/.agents/skills/diagram-design/references/type-db-schema.md +48 -0
  104. package/.agents/skills/diagram-design/references/type-dependency.md +44 -0
  105. package/.agents/skills/diagram-design/references/type-deployment.md +45 -0
  106. package/.agents/skills/diagram-design/references/type-dp-integration.md +407 -0
  107. package/.agents/skills/diagram-design/references/type-dp-security-matrix.md +379 -0
  108. package/.agents/skills/diagram-design/references/type-er.md +25 -0
  109. package/.agents/skills/diagram-design/references/type-exploded.md +115 -0
  110. package/.agents/skills/diagram-design/references/type-fishbone.md +75 -0
  111. package/.agents/skills/diagram-design/references/type-flowchart.md +23 -0
  112. package/.agents/skills/diagram-design/references/type-gantt.md +45 -0
  113. package/.agents/skills/diagram-design/references/type-heatmap.md +80 -0
  114. package/.agents/skills/diagram-design/references/type-high-level.md +470 -0
  115. package/.agents/skills/diagram-design/references/type-it-state.md +468 -0
  116. package/.agents/skills/diagram-design/references/type-journey.md +55 -0
  117. package/.agents/skills/diagram-design/references/type-kanban.md +49 -0
  118. package/.agents/skills/diagram-design/references/type-layers.md +26 -0
  119. package/.agents/skills/diagram-design/references/type-line.md +337 -0
  120. package/.agents/skills/diagram-design/references/type-loop.md +223 -0
  121. package/.agents/skills/diagram-design/references/type-medallion.md +356 -0
  122. package/.agents/skills/diagram-design/references/type-nested.md +22 -0
  123. package/.agents/skills/diagram-design/references/type-org-chart.md +44 -0
  124. package/.agents/skills/diagram-design/references/type-polar.md +136 -0
  125. package/.agents/skills/diagram-design/references/type-process.md +490 -0
  126. package/.agents/skills/diagram-design/references/type-pyramid.md +33 -0
  127. package/.agents/skills/diagram-design/references/type-quadrant.md +81 -0
  128. package/.agents/skills/diagram-design/references/type-radar.md +82 -0
  129. package/.agents/skills/diagram-design/references/type-sankey.md +75 -0
  130. package/.agents/skills/diagram-design/references/type-scatter.md +276 -0
  131. package/.agents/skills/diagram-design/references/type-sequence.md +130 -0
  132. package/.agents/skills/diagram-design/references/type-service-blueprint.md +103 -0
  133. package/.agents/skills/diagram-design/references/type-state.md +30 -0
  134. package/.agents/skills/diagram-design/references/type-story-map.md +46 -0
  135. package/.agents/skills/diagram-design/references/type-swimlane.md +22 -0
  136. package/.agents/skills/diagram-design/references/type-timeline.md +20 -0
  137. package/.agents/skills/diagram-design/references/type-tree.md +24 -0
  138. package/.agents/skills/diagram-design/references/type-treemap.md +137 -0
  139. package/.agents/skills/diagram-design/references/type-uml-class.md +65 -0
  140. package/.agents/skills/diagram-design/references/type-venn.md +26 -0
  141. package/.agents/skills/diagram-design/references/type-wardley.md +39 -0
  142. package/.agents/skills/diagram-design/references/type-waterfall.md +75 -0
  143. package/.agents/skills/scrum-meta/SKILL.md +36 -36
  144. package/.agents/skills/scrum-planning/SKILL.md +61 -61
  145. package/.agents/skills/scrum-planning/references/schema.md +384 -336
  146. package/.agents/skills/scrum-report/SKILL.md +42 -42
  147. package/.agents/skills/scrum-sprint/SKILL.md +49 -49
  148. package/.agents/skills/scrum-tdd/SKILL.md +140 -127
  149. package/README.md +24 -1
  150. package/assets/board/200.html +1 -1
  151. package/assets/board/404.html +1 -1
  152. package/assets/board/_nuxt/4gQF_HS3.js +1 -0
  153. package/assets/board/_nuxt/5okfNy5D.js +1 -0
  154. package/assets/board/_nuxt/{Bb3Limos.js → B0C2jsdk.js} +1 -1
  155. package/assets/board/_nuxt/B1j6UC4U.js +1 -0
  156. package/assets/board/_nuxt/B3LKy6o2.js +1 -0
  157. package/assets/board/_nuxt/BAQQngAq.js +13 -0
  158. package/assets/board/_nuxt/BE6t7Q2m.js +1 -0
  159. package/assets/board/_nuxt/BGwhkDRl.js +1 -0
  160. package/assets/board/_nuxt/BLvbupFS.js +1 -0
  161. package/assets/board/_nuxt/BQgzP7ur.js +1 -0
  162. package/assets/board/_nuxt/BRZIF_wo.js +1 -0
  163. package/assets/board/_nuxt/BU8vdZUs.js +95 -0
  164. package/assets/board/_nuxt/BW3xJdEx.js +1 -0
  165. package/assets/board/_nuxt/{Cm9lkUvP.js → BY36DFyj.js} +1 -1
  166. package/assets/board/_nuxt/BZlZD94i.js +1 -0
  167. package/assets/board/_nuxt/BZvXNwev.js +3 -0
  168. package/assets/board/_nuxt/BiWrMOsL.js +1 -0
  169. package/assets/board/_nuxt/BkoKCNUY.js +1 -0
  170. package/assets/board/_nuxt/BlKmZhhF.js +1 -0
  171. package/assets/board/_nuxt/BmBpmU73.js +1 -0
  172. package/assets/board/_nuxt/BmrSh0rL.js +1 -0
  173. package/assets/board/_nuxt/BrWE0up6.js +1 -0
  174. package/assets/board/_nuxt/Bs52qkgk.js +1 -0
  175. package/assets/board/_nuxt/BuBzMkFZ.js +1 -0
  176. package/assets/board/_nuxt/Bubk0xn-.js +1 -0
  177. package/assets/board/_nuxt/BxuBMtk_.js +3 -0
  178. package/assets/board/_nuxt/By1KXXLR.js +1 -0
  179. package/assets/board/_nuxt/BygIGL69.js +2 -0
  180. package/assets/board/_nuxt/C-fx-vFO.js +1 -0
  181. package/assets/board/_nuxt/C1iO5KH3.js +1 -0
  182. package/assets/board/_nuxt/C2YPmTzt.js +1 -0
  183. package/assets/board/_nuxt/C3SpAhCW.js +1 -0
  184. package/assets/board/_nuxt/C3ZRWz5L.js +1 -0
  185. package/assets/board/_nuxt/C4WdPP6K.js +1 -0
  186. package/assets/board/_nuxt/C6o03JHe.js +1 -0
  187. package/assets/board/_nuxt/C8qB5llI.js +1 -0
  188. package/assets/board/_nuxt/C9MgRdhu.js +1 -0
  189. package/assets/board/_nuxt/CCA81-4P.js +1 -0
  190. package/assets/board/_nuxt/{D2O8Q8x9.js → CFCM18fF.js} +1 -1
  191. package/assets/board/_nuxt/CGXljzd_.js +1 -0
  192. package/assets/board/_nuxt/CI0scS-N.js +1 -0
  193. package/assets/board/_nuxt/CJs9B42o.js +1 -0
  194. package/assets/board/_nuxt/COmtTtfB.js +1 -0
  195. package/assets/board/_nuxt/CPYm4J_K.js +1 -0
  196. package/assets/board/_nuxt/CXG7GZes.js +1 -0
  197. package/assets/board/_nuxt/CYGiZn-X.js +1 -0
  198. package/assets/board/_nuxt/CaE8VlUp.js +1 -0
  199. package/assets/board/_nuxt/Cajxc4Dw.js +1 -0
  200. package/assets/board/_nuxt/CcGiNUgA.js +1 -0
  201. package/assets/board/_nuxt/Ccgv3lDj.js +1 -0
  202. package/assets/board/_nuxt/CdPGFZyy.js +1 -0
  203. package/assets/board/_nuxt/{DfR3IZN_.js → Cdf_T8Xa.js} +1 -1
  204. package/assets/board/_nuxt/CgQ30j_6.js +1 -0
  205. package/assets/board/_nuxt/Ck0-FqVI.js +1 -0
  206. package/assets/board/_nuxt/CkWKLtjO.js +1 -0
  207. package/assets/board/_nuxt/CoipdpDu.js +1 -0
  208. package/assets/board/_nuxt/Cq7hsCKB.js +1 -0
  209. package/assets/board/_nuxt/D166WVUG.js +1 -0
  210. package/assets/board/_nuxt/D1V1gysQ.js +1 -0
  211. package/assets/board/_nuxt/D4Dpzo9e.js +1 -0
  212. package/assets/board/_nuxt/D5i92OZO.js +1 -0
  213. package/assets/board/_nuxt/D6dUp4Nm.js +9 -0
  214. package/assets/board/_nuxt/DFQDFspC.js +1 -0
  215. package/assets/board/_nuxt/DHX2tw9J.js +1 -0
  216. package/assets/board/_nuxt/DJM7u8P3.js +1 -0
  217. package/assets/board/_nuxt/{BPTrRhcw.js → DLr85ebo.js} +1 -1
  218. package/assets/board/_nuxt/DOMM1wfl.js +1 -0
  219. package/assets/board/_nuxt/DU6ArlUN.js +1 -0
  220. package/assets/board/_nuxt/{B_SlFcWp.js → DUgGsde6.js} +1 -1
  221. package/assets/board/_nuxt/DV4ti-Pq.js +1 -0
  222. package/assets/board/_nuxt/D_ct-Stz.js +2 -0
  223. package/assets/board/_nuxt/DbWAComO.js +1 -0
  224. package/assets/board/_nuxt/DbwlcHAt.js +1 -0
  225. package/assets/board/_nuxt/Dki9VkAL.js +3 -0
  226. package/assets/board/_nuxt/DlNJhOoc.js +1 -0
  227. package/assets/board/_nuxt/Dmg78zOY.js +3 -0
  228. package/assets/board/_nuxt/DqG7CtD4.js +1 -0
  229. package/assets/board/_nuxt/DqUSsCJ2.js +1 -0
  230. package/assets/board/_nuxt/Du2F4WXh.js +1 -0
  231. package/assets/board/_nuxt/DuRiEXn4.js +1 -0
  232. package/assets/board/_nuxt/DwCE3305.js +1 -0
  233. package/assets/board/_nuxt/DwzGxoX2.js +1 -0
  234. package/assets/board/_nuxt/DxBwVNyP.js +2 -0
  235. package/assets/board/_nuxt/DzmVW5-D.js +1 -0
  236. package/assets/board/_nuxt/I-sGtDIB.js +6 -0
  237. package/assets/board/_nuxt/JU9-x68N.js +1 -0
  238. package/assets/board/_nuxt/Lozm7hhE.js +1 -0
  239. package/assets/board/_nuxt/MMsTMkcB.js +1 -0
  240. package/assets/board/_nuxt/MS7CGmCB.js +1 -0
  241. package/assets/board/_nuxt/OKKaKILz.js +1 -0
  242. package/assets/board/_nuxt/{Csqgy925.js → P6qlvBHA.js} +1 -1
  243. package/assets/board/_nuxt/SrNUvNwO.js +1 -0
  244. package/assets/board/_nuxt/{DSaWoFHS.js → SywdkA98.js} +1 -1
  245. package/assets/board/_nuxt/TBIRpVLG.js +1 -0
  246. package/assets/board/_nuxt/TlTrMIMm.js +1 -0
  247. package/assets/board/_nuxt/Utb4TVOl.js +1 -0
  248. package/assets/board/_nuxt/Zv9-SOQF.js +1 -0
  249. package/assets/board/_nuxt/_id_.B6iqDPxe.css +1 -0
  250. package/assets/board/_nuxt/b7xtxFRl.js +1 -0
  251. package/assets/board/_nuxt/builds/latest.json +1 -1
  252. package/assets/board/_nuxt/builds/meta/08bebe14-0f1b-4d2a-8de4-e84e122d10e9.json +1 -0
  253. package/assets/board/_nuxt/diagrams.pyhqNtmr.css +1 -0
  254. package/assets/board/_nuxt/{entry.CKHePurH.css → entry.BBv-sBnP.css} +1 -1
  255. package/assets/board/_nuxt/error-404.CgJNdpB5.css +1 -0
  256. package/assets/board/_nuxt/error-500.WYSoH44y.css +1 -0
  257. package/assets/board/_nuxt/jbri6q1p.js +1 -0
  258. package/assets/board/_nuxt/q_8bxRMt.js +1 -0
  259. package/assets/board/burndown/index.html +1 -1
  260. package/assets/board/diagrams/index.html +1 -0
  261. package/assets/board/epics/index.html +1 -1
  262. package/assets/board/gantt/index.html +1 -1
  263. package/assets/board/index.html +1 -1
  264. package/assets/board/last-change/index.html +1 -1
  265. package/assets/board/milestones/index.html +1 -1
  266. package/assets/board/tests/index.html +1 -1
  267. package/bin/scrum-skills.mjs +13 -0
  268. package/package.json +2 -1
  269. package/templates/AGENTS.md +10 -0
  270. package/tools/diagram-import.mjs +238 -0
  271. package/tools/diagram-lint.mjs +518 -0
  272. package/tools/diagram.mjs +299 -0
  273. package/tools/last-change.mjs +326 -326
  274. package/tools/projects.mjs +29 -4
  275. package/tools/serve.mjs +27 -1
  276. package/tools/validate.mjs +781 -664
  277. package/assets/board/_nuxt/1eqboJxR.js +0 -1
  278. package/assets/board/_nuxt/2K7ag6ES.js +0 -1
  279. package/assets/board/_nuxt/51OWHj8c.js +0 -2
  280. package/assets/board/_nuxt/6gFtTBwm.js +0 -1
  281. package/assets/board/_nuxt/B3jkABw9.js +0 -1
  282. package/assets/board/_nuxt/B5n2_jZN.js +0 -1
  283. package/assets/board/_nuxt/BDK2Hj7B.js +0 -1
  284. package/assets/board/_nuxt/BDcnzXHq.js +0 -1
  285. package/assets/board/_nuxt/BaG8y0Wt.js +0 -1
  286. package/assets/board/_nuxt/BbwJq5pb.js +0 -1
  287. package/assets/board/_nuxt/BgLeKwx0.js +0 -1
  288. package/assets/board/_nuxt/Bi9Axj3V.js +0 -1
  289. package/assets/board/_nuxt/BmxvtaMq.js +0 -1
  290. package/assets/board/_nuxt/BodFvto3.js +0 -1
  291. package/assets/board/_nuxt/BpWeHLuN.js +0 -1
  292. package/assets/board/_nuxt/BuOKDFiJ.js +0 -1
  293. package/assets/board/_nuxt/C40iTe-x.js +0 -1
  294. package/assets/board/_nuxt/C7K0R7F-.js +0 -2
  295. package/assets/board/_nuxt/C8vL692X.js +0 -1
  296. package/assets/board/_nuxt/C9StZL3D.js +0 -3
  297. package/assets/board/_nuxt/CGI_ZV79.js +0 -1
  298. package/assets/board/_nuxt/CJ2mz0WY.js +0 -1
  299. package/assets/board/_nuxt/CJMBJQuf.js +0 -1
  300. package/assets/board/_nuxt/CK-lOYG9.js +0 -1
  301. package/assets/board/_nuxt/CK9_veoz.js +0 -1
  302. package/assets/board/_nuxt/CLBcBrYf.js +0 -1
  303. package/assets/board/_nuxt/CMUi2-Lj.js +0 -1
  304. package/assets/board/_nuxt/COf6E6h4.js +0 -1
  305. package/assets/board/_nuxt/CPCUMJnF.js +0 -1
  306. package/assets/board/_nuxt/CPcKlmSm.js +0 -1
  307. package/assets/board/_nuxt/CQTvWh4i.js +0 -1
  308. package/assets/board/_nuxt/CSEEUF8S.js +0 -1
  309. package/assets/board/_nuxt/CSSb154I.js +0 -13
  310. package/assets/board/_nuxt/CgDTd7jS.js +0 -1
  311. package/assets/board/_nuxt/ChG76uh9.js +0 -1
  312. package/assets/board/_nuxt/Ci0qbkgh.js +0 -1
  313. package/assets/board/_nuxt/CqoQ__I_.js +0 -1
  314. package/assets/board/_nuxt/CuJUHLl8.js +0 -1
  315. package/assets/board/_nuxt/CvLiA4_O.js +0 -1
  316. package/assets/board/_nuxt/Cvs12oA0.js +0 -3
  317. package/assets/board/_nuxt/CyEXFe3V.js +0 -1
  318. package/assets/board/_nuxt/Cz6rZcLK.js +0 -1
  319. package/assets/board/_nuxt/D2FhHl1o.js +0 -1
  320. package/assets/board/_nuxt/D3YCAmfu.js +0 -1
  321. package/assets/board/_nuxt/D5CE81jK.js +0 -1
  322. package/assets/board/_nuxt/D75vbfSb.js +0 -1
  323. package/assets/board/_nuxt/D99LbGfb.js +0 -9
  324. package/assets/board/_nuxt/DEfLc7p3.js +0 -6
  325. package/assets/board/_nuxt/DF-nsa1Z.js +0 -1
  326. package/assets/board/_nuxt/DIc8yx98.js +0 -1
  327. package/assets/board/_nuxt/DLkAKotw.js +0 -1
  328. package/assets/board/_nuxt/DRPlYvb3.js +0 -1
  329. package/assets/board/_nuxt/DRlQgul3.js +0 -1
  330. package/assets/board/_nuxt/DSLbmoWa.js +0 -1
  331. package/assets/board/_nuxt/DWO9c9yp.js +0 -1
  332. package/assets/board/_nuxt/DZo3dYLJ.js +0 -3
  333. package/assets/board/_nuxt/D_S6N7_b.js +0 -1
  334. package/assets/board/_nuxt/DajA-Tkt.js +0 -1
  335. package/assets/board/_nuxt/DbHiyab-.js +0 -1
  336. package/assets/board/_nuxt/Dc7Ql6eE.js +0 -1
  337. package/assets/board/_nuxt/Dd9ZukPU.js +0 -1
  338. package/assets/board/_nuxt/Dg2LiqmN.js +0 -1
  339. package/assets/board/_nuxt/DhuleNnm.js +0 -1
  340. package/assets/board/_nuxt/DkI1Qxpp.js +0 -95
  341. package/assets/board/_nuxt/DnDHGSYI.js +0 -1
  342. package/assets/board/_nuxt/DpXJ_tCU.js +0 -1
  343. package/assets/board/_nuxt/DqZgF3hU.js +0 -1
  344. package/assets/board/_nuxt/DqcxvfbD.js +0 -1
  345. package/assets/board/_nuxt/DsA2lVci.js +0 -1
  346. package/assets/board/_nuxt/Dtsa-1NS.js +0 -1
  347. package/assets/board/_nuxt/Du91iq0p.js +0 -1
  348. package/assets/board/_nuxt/Dx1wcYFo.js +0 -1
  349. package/assets/board/_nuxt/EYTShbt4.js +0 -1
  350. package/assets/board/_nuxt/MaXJprwN.js +0 -1
  351. package/assets/board/_nuxt/P9x67aq2.js +0 -1
  352. package/assets/board/_nuxt/S08nFESZ.js +0 -3
  353. package/assets/board/_nuxt/V0uynWE2.js +0 -1
  354. package/assets/board/_nuxt/Vo4wMbnS.js +0 -1
  355. package/assets/board/_nuxt/ZVTqot-_.js +0 -1
  356. package/assets/board/_nuxt/ZngEd3HB.js +0 -1
  357. package/assets/board/_nuxt/_id_.B2NDKSlX.css +0 -1
  358. package/assets/board/_nuxt/assMu_Wn.js +0 -1
  359. package/assets/board/_nuxt/builds/meta/8e23aec9-5b67-4569-b8bf-d4f07e50ffdf.json +0 -1
  360. package/assets/board/_nuxt/error-404.BFmXOnCT.css +0 -1
  361. package/assets/board/_nuxt/error-500.BZ-DdjQ6.css +0 -1
  362. package/assets/board/_nuxt/rlePnzpc.js +0 -1
  363. package/assets/board/_nuxt/uKzCKCTq.js +0 -1
  364. package/assets/board/_nuxt/vwxaNGfc.js +0 -1
  365. package/assets/board/_nuxt/yh6sf_D5.js +0 -1
package/.agents/skills/diagram-design/assets/example-exploded-phone.html ADDED
@@ -0,0 +1,83 @@
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.0">
6
+ <title>Phone teardown · What sits under the glass</title>
7
+ <link href="https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Geist:wght@400;500;600&family=Geist+Mono:wght@400;500;600&display=swap" rel="stylesheet">
8
+ <style>
9
+ *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
10
+ :root {
11
+ --color-paper: #f5f5f5;
12
+ --color-ink: #2d3142;
13
+ --color-muted: #4f5d75;
14
+ --color-accent: #bf4520;
15
+ --font-sans: 'Geist', system-ui, sans-serif;
16
+ --font-serif: 'Instrument Serif', serif;
17
+ --font-mono: 'Geist Mono', ui-monospace, monospace;
18
+ }
19
+
20
+ body {
21
+ font-family: var(--font-sans);
22
+ background: var(--color-paper);
23
+ color: var(--color-ink);
24
+ min-height: 100vh;
25
+ display: flex;
26
+ align-items: center;
27
+ justify-content: center;
28
+ padding: 3rem 2rem;
29
+ }
30
+
31
+ .frame { max-width: 1200px; width: 100%; }
32
+ .diagram-container { width: 100%; overflow-x: auto; }
33
+
34
+ .eyebrow {
35
+ font-family: var(--font-mono);
36
+ font-size: 0.66rem;
37
+ font-weight: 500;
38
+ letter-spacing: 0.18em;
39
+ text-transform: uppercase;
40
+ color: var(--color-muted);
41
+ margin-bottom: 0.5rem;
42
+ }
43
+
44
+ h1 {
45
+ font-family: var(--font-serif);
46
+ font-size: clamp(1.5rem, 2.4vw + 0.75rem, 2rem);
47
+ font-weight: 400;
48
+ letter-spacing: -0.02em;
49
+ line-height: 1.15;
50
+ color: var(--color-ink);
51
+ margin-bottom: 1.5rem;
52
+ }
53
+
54
+ svg { width: 100%; min-width: 1000px; display: block; }
55
+ @media print {
56
+ .diagram-container { overflow-x: visible; }
57
+ svg { min-width: 0; }
58
+ }
59
+ </style>
60
+ </head>
61
+ <body>
62
+ <div class="frame">
63
+ <p class="eyebrow">Exploded axonometric · Diagram Design</p>
64
+ <h1>Phone teardown · What sits under the glass</h1>
65
+
66
+ <div class="diagram-container">
67
+ <svg viewBox="0 0 1000 624" xmlns="http://www.w3.org/2000/svg" role="img" aria-labelledby="exploded-phone-title exploded-phone-desc">
68
+ <title id="exploded-phone-title">Phone teardown · What sits under the glass</title>
69
+ <desc id="exploded-phone-desc">Exploded view of a phone: the display lifts off the housing to show the logic board and battery inside, with the logic board as the focal part.</desc>
70
+ <rect width="100%" height="100%" fill="#f5f5f5"/>
71
+ <g data-exploded data-origin="416 388" data-gap="160">
72
+ <line data-role="trace" x1="150.06" y1="508" x2="150.06" y2="180" stroke="rgba(45,49,66,0.30)" stroke-width="0.8" stroke-dasharray="4,3"/><line data-role="trace" x1="541.94" y1="438" x2="541.94" y2="110" stroke="rgba(45,49,66,0.30)" stroke-width="0.8" stroke-dasharray="4,3"/>
73
+ <g data-part="housing" data-name="Housing" data-rect="0 0 140 280 24" data-z="0" data-t="20" data-level="0" data-kind="housing"><path data-role="silhouette" d="M 150.06 508 A 33.94 16.97 0 0 1 160 496 L 392 380 A 33.94 16.97 0 0 1 440 380 L 532 426 A 33.94 16.97 0 0 1 541.94 438 L 541.94 458 A 33.94 16.97 0 0 1 532 470 L 300 586 A 33.94 16.97 0 0 1 252 586 L 160 540 A 33.94 16.97 0 0 1 150.06 528 Z" fill="#ffffff"/><path d="M 300 566 A 33.94 16.97 0 0 1 252 566 L 160 520 A 33.94 16.97 0 0 1 160 496 L 392 380 A 33.94 16.97 0 0 1 440 380 L 532 426 A 33.94 16.97 0 0 1 532 450 Z" fill="#ffffff"/><path d="M 295 563.5 A 26.87 13.44 0 0 1 257 563.5 L 165 517.5 A 26.87 13.44 0 0 1 165 498.5 L 397 382.5 A 26.87 13.44 0 0 1 435 382.5 L 527 428.5 A 26.87 13.44 0 0 1 527 447.5 Z" fill="#ffffff"/><path d="M 295 563.5 A 26.87 13.44 0 0 1 257 563.5 L 165 517.5 A 26.87 13.44 0 0 1 165 498.5 L 397 382.5 A 26.87 13.44 0 0 1 435 382.5 L 527 428.5 A 26.87 13.44 0 0 1 527 447.5 Z" fill="rgba(45,49,66,0.10)"/><clipPath id="exploded-phone-housing-cavity"><path d="M 295 563.5 A 26.87 13.44 0 0 1 257 563.5 L 165 517.5 A 26.87 13.44 0 0 1 165 498.5 L 397 382.5 A 26.87 13.44 0 0 1 435 382.5 L 527 428.5 A 26.87 13.44 0 0 1 527 447.5 Z"/></clipPath><g clip-path="url(#exploded-phone-housing-cavity)"><path d="M 295 580.5 A 26.87 13.44 0 0 1 257 580.5 L 165 534.5 A 26.87 13.44 0 0 1 165 515.5 L 397 399.5 A 26.87 13.44 0 0 1 435 399.5 L 527 445.5 A 26.87 13.44 0 0 1 527 464.5 Z" fill="#ffffff"/><path d="M 295 580.5 A 26.87 13.44 0 0 1 257 580.5 L 165 534.5 A 26.87 13.44 0 0 1 165 515.5 L 397 399.5 A 26.87 13.44 0 0 1 435 399.5 L 527 445.5 A 26.87 13.44 0 0 1 527 464.5 Z" fill="rgba(45,49,66,0.04)"/><path d="M 295 580.5 A 26.87 13.44 0 0 1 257 580.5 L 165 534.5 A 26.87 13.44 0 0 1 165 515.5 L 397 399.5 A 26.87 13.44 0 0 1 435 399.5 L 527 445.5 A 26.87 13.44 0 0 1 527 464.5 Z" fill="none" stroke="rgba(45,49,66,0.55)" stroke-width="0.8"/></g><path d="M 295 563.5 A 26.87 13.44 0 0 1 257 563.5 L 165 517.5 A 26.87 13.44 0 0 1 165 498.5 L 397 382.5 A 26.87 13.44 0 0 1 435 382.5 L 527 428.5 A 26.87 13.44 0 0 1 527 447.5 Z" fill="none" stroke="rgba(45,49,66,0.55)" stroke-width="0.8"/><path d="M 150.06 508 A 33.94 16.97 0 0 1 160 496 L 392 380 A 33.94 16.97 0 0 1 440 380 L 532 426 A 33.94 16.97 0 0 1 541.94 438" fill="none" stroke="#2d3142" stroke-width="1.2" stroke-linejoin="round"/><g data-role="label"><line data-role="leader" x1="547.94" y1="448" x2="593.94" y2="448" stroke="rgba(45,49,66,0.40)" stroke-width="0.8"/><circle cx="541.94" cy="448" r="2" fill="#2d3142"/><text data-role="name" x="605.94" y="447" fill="#2d3142" font-size="16" font-weight="600" font-family="'Geist', sans-serif">Housing</text><text x="605.94" y="463" fill="#4f5d75" font-size="10" font-family="'Geist Mono', monospace" letter-spacing="0.08em">aluminium frame</text></g></g>
74
+ <g data-part="board" data-name="Logic board" data-rect="8 8 132 112 4" data-z="180" data-t="4" data-level="1" data-focal><path data-role="silhouette" d="M 314.34 264 A 5.66 2.83 0 0 1 316 262 L 412 214 A 5.66 2.83 0 0 1 420 214 L 536 272 A 5.66 2.83 0 0 1 537.66 274 L 537.66 278 A 5.66 2.83 0 0 1 536 280 L 440 328 A 5.66 2.83 0 0 1 432 328 L 316 270 A 5.66 2.83 0 0 1 314.34 268 Z" fill="#ffffff"/><path d="M 440 324 A 5.66 2.83 0 0 1 432 324 L 316 266 A 5.66 2.83 0 0 1 316 262 L 412 214 A 5.66 2.83 0 0 1 420 214 L 536 272 A 5.66 2.83 0 0 1 536 276 Z" fill="rgba(191,69,32,0.10)"/><path d="M 314.34 264 A 5.66 2.83 0 0 0 316 266 L 432 324 A 5.66 2.83 0 0 0 436 324.83 L 436 328.83 A 5.66 2.83 0 0 1 432 328 L 316 270 A 5.66 2.83 0 0 1 314.34 268 Z" fill="rgba(191,69,32,0.20)"/><path d="M 436 324.83 A 5.66 2.83 0 0 0 440 324 L 536 276 A 5.66 2.83 0 0 0 537.66 274 L 537.66 278 A 5.66 2.83 0 0 1 536 280 L 440 328 A 5.66 2.83 0 0 1 436 328.83 Z" fill="rgba(191,69,32,0.32)"/><path d="M 314.34 264 A 5.66 2.83 0 0 0 316 266 L 432 324 A 5.66 2.83 0 0 0 440 324 L 536 276 A 5.66 2.83 0 0 0 537.66 274" fill="none" stroke="rgba(191,69,32,0.70)" stroke-width="0.8"/><path d="M 314.34 264 A 5.66 2.83 0 0 1 316 262 L 412 214 A 5.66 2.83 0 0 1 420 214 L 536 272 A 5.66 2.83 0 0 1 537.66 274 L 537.66 278 A 5.66 2.83 0 0 1 536 280 L 440 328 A 5.66 2.83 0 0 1 432 328 L 316 270 A 5.66 2.83 0 0 1 314.34 268 Z" fill="none" stroke="#bf4520" stroke-width="1.2" stroke-linejoin="round"/><path d="M 376.69 236 A 11.31 5.66 0 0 1 380 232 L 408 218 A 11.31 5.66 0 0 1 424 218 L 452 232 A 11.31 5.66 0 0 1 455.31 236 L 455.31 242 A 11.31 5.66 0 0 1 452 246 L 424 260 A 11.31 5.66 0 0 1 408 260 L 380 246 A 11.31 5.66 0 0 1 376.69 242 Z" fill="#ffffff"/><path d="M 376.69 236 A 11.31 5.66 0 0 0 380 240 L 408 254 A 11.31 5.66 0 0 0 416 255.66 L 416 261.66 A 11.31 5.66 0 0 1 408 260 L 380 246 A 11.31 5.66 0 0 1 376.69 242 Z" fill="rgba(45,49,66,0.07)"/><path d="M 416 255.66 A 11.31 5.66 0 0 0 424 254 L 452 240 A 11.31 5.66 0 0 0 455.31 236 L 455.31 242 A 11.31 5.66 0 0 1 452 246 L 424 260 A 11.31 5.66 0 0 1 416 261.66 Z" fill="rgba(45,49,66,0.15)"/><path d="M 376.69 236 A 11.31 5.66 0 0 0 380 240 L 408 254 A 11.31 5.66 0 0 0 424 254 L 452 240 A 11.31 5.66 0 0 0 455.31 236" fill="none" stroke="rgba(45,49,66,0.55)" stroke-width="0.8"/><path d="M 376.69 236 A 11.31 5.66 0 0 1 380 232 L 408 218 A 11.31 5.66 0 0 1 424 218 L 452 232 A 11.31 5.66 0 0 1 455.31 236 L 455.31 242 A 11.31 5.66 0 0 1 452 246 L 424 260 A 11.31 5.66 0 0 1 408 260 L 380 246 A 11.31 5.66 0 0 1 376.69 242 Z" fill="none" stroke="#2d3142" stroke-width="1" stroke-linejoin="round"/><path d="M 404.69 224 A 11.31 5.66 0 0 1 408 220 L 408 220 A 11.31 5.66 0 0 1 424 220 L 424 220 A 11.31 5.66 0 0 1 427.31 224 L 427.31 227 A 11.31 5.66 0 0 1 424 231 L 424 231 A 11.31 5.66 0 0 1 408 231 L 408 231 A 11.31 5.66 0 0 1 404.69 227 Z" fill="#2d3142"/><path d="M 421 226.5 A 7.07 3.54 0 0 1 411 226.5 L 411 226.5 A 7.07 3.54 0 0 1 411 221.5 L 411 221.5 A 7.07 3.54 0 0 1 421 221.5 L 421 221.5 A 7.07 3.54 0 0 1 421 226.5 Z" fill="none" stroke="rgba(245,245,245,0.35)" stroke-width="0.8"/><path d="M 404.69 242 A 11.31 5.66 0 0 1 408 238 L 408 238 A 11.31 5.66 0 0 1 424 238 L 424 238 A 11.31 5.66 0 0 1 427.31 242 L 427.31 245 A 11.31 5.66 0 0 1 424 249 L 424 249 A 11.31 5.66 0 0 1 408 249 L 408 249 A 11.31 5.66 0 0 1 404.69 245 Z" fill="#2d3142"/><path d="M 421 244.5 A 7.07 3.54 0 0 1 411 244.5 L 411 244.5 A 7.07 3.54 0 0 1 411 239.5 L 411 239.5 A 7.07 3.54 0 0 1 421 239.5 L 421 239.5 A 7.07 3.54 0 0 1 421 244.5 Z" fill="none" stroke="rgba(245,245,245,0.35)" stroke-width="0.8"/><path d="M 428.59 267 A 1.41 0.71 0 0 1 429 266.5 L 463 249.5 A 1.41 0.71 0 0 1 465 249.5 L 499 266.5 A 1.41 0.71 0 0 1 499.41 267 L 499.41 270 A 1.41 0.71 0 0 1 499 270.5 L 465 287.5 A 1.41 0.71 0 0 1 463 287.5 L 429 270.5 A 1.41 0.71 0 0 1 428.59 270 Z" fill="#2d3142"/><path d="M 465 284.5 A 1.41 0.71 0 0 1 463 284.5 L 429 267.5 A 1.41 0.71 0 0 1 429 266.5 L 463 249.5 A 1.41 0.71 0 0 1 465 249.5 L 499 266.5 A 1.41 0.71 0 0 1 499 267.5 Z" fill="#4f5d75"/><path d="M 344.59 266 A 1.41 0.71 0 0 1 345 265.5 L 371 252.5 A 1.41 0.71 0 0 1 373 252.5 L 395 263.5 A 1.41 0.71 0 0 1 395.41 264 L 395.41 266 A 1.41 0.71 0 0 1 395 266.5 L 369 279.5 A 1.41 0.71 0 0 1 367 279.5 L 345 268.5 A 1.41 0.71 0 0 1 344.59 268 Z" fill="#2d3142"/><path d="M 369 277.5 A 1.41 0.71 0 0 1 367 277.5 L 345 266.5 A 1.41 0.71 0 0 1 345 265.5 L 371 252.5 A 1.41 0.71 0 0 1 373 252.5 L 395 263.5 A 1.41 0.71 0 0 1 395 264.5 Z" fill="#4f5d75"/><path d="M 396.59 284 A 1.41 0.71 0 0 1 397 283.5 L 415 274.5 A 1.41 0.71 0 0 1 417 274.5 L 459 295.5 A 1.41 0.71 0 0 1 459.41 296 L 459.41 298 A 1.41 0.71 0 0 1 459 298.5 L 441 307.5 A 1.41 0.71 0 0 1 439 307.5 L 397 286.5 A 1.41 0.71 0 0 1 396.59 286 Z" fill="#2d3142"/><path d="M 441 305.5 A 1.41 0.71 0 0 1 439 305.5 L 397 284.5 A 1.41 0.71 0 0 1 397 283.5 L 415 274.5 A 1.41 0.71 0 0 1 417 274.5 L 459 295.5 A 1.41 0.71 0 0 1 459 296.5 Z" fill="#4f5d75"/><g data-role="label"><line data-role="leader" x1="543.66" y1="276" x2="593.94" y2="276" stroke="rgba(191,69,32,0.60)" stroke-width="0.8"/><circle cx="537.66" cy="276" r="2" fill="#bf4520"/><text data-role="name" x="605.94" y="275" fill="#2d3142" font-size="16" font-weight="600" font-family="'Geist', sans-serif">Logic board</text><text x="605.94" y="291" fill="#bf4520" font-size="10" font-family="'Geist Mono', monospace" letter-spacing="0.08em">soc, cameras</text></g></g>
75
+ <g data-part="battery" data-name="Battery" data-rect="10 136 130 268 6" data-z="180" data-t="8" data-level="1"><path data-role="silhouette" d="M 161.51 339 A 8.49 4.24 0 0 1 164 336 L 284 276 A 8.49 4.24 0 0 1 296 276 L 404 330 A 8.49 4.24 0 0 1 406.49 333 L 406.49 341 A 8.49 4.24 0 0 1 404 344 L 284 404 A 8.49 4.24 0 0 1 272 404 L 164 350 A 8.49 4.24 0 0 1 161.51 347 Z" fill="#ffffff"/><path d="M 161.51 339 A 8.49 4.24 0 0 0 164 342 L 272 396 A 8.49 4.24 0 0 0 278 397.24 L 278 405.24 A 8.49 4.24 0 0 1 272 404 L 164 350 A 8.49 4.24 0 0 1 161.51 347 Z" fill="rgba(45,49,66,0.07)"/><path d="M 278 397.24 A 8.49 4.24 0 0 0 284 396 L 404 336 A 8.49 4.24 0 0 0 406.49 333 L 406.49 341 A 8.49 4.24 0 0 1 404 344 L 284 404 A 8.49 4.24 0 0 1 278 405.24 Z" fill="rgba(45,49,66,0.15)"/><path d="M 278 391 L 278 391 L 174 339 L 174 339 L 290 281 L 290 281 L 394 333 L 394 333 Z" fill="none" stroke="rgba(45,49,66,0.55)" stroke-width="0.8"/><path d="M 316 296 L 316 296 L 292 284 L 292 284 L 298 281 L 298 281 L 322 293 L 322 293 Z" fill="#4f5d75"/><path d="M 161.51 339 A 8.49 4.24 0 0 0 164 342 L 272 396 A 8.49 4.24 0 0 0 284 396 L 404 336 A 8.49 4.24 0 0 0 406.49 333" fill="none" stroke="rgba(45,49,66,0.55)" stroke-width="0.8"/><path d="M 161.51 339 A 8.49 4.24 0 0 1 164 336 L 284 276 A 8.49 4.24 0 0 1 296 276 L 404 330 A 8.49 4.24 0 0 1 406.49 333 L 406.49 341 A 8.49 4.24 0 0 1 404 344 L 284 404 A 8.49 4.24 0 0 1 272 404 L 164 350 A 8.49 4.24 0 0 1 161.51 347 Z" fill="none" stroke="#2d3142" stroke-width="1.2" stroke-linejoin="round"/><g data-role="label"><line data-role="leader" x1="412.49" y1="337" x2="593.94" y2="337" stroke="rgba(45,49,66,0.40)" stroke-width="0.8"/><circle cx="406.49" cy="337" r="2" fill="#2d3142"/><text data-role="name" x="605.94" y="336" fill="#2d3142" font-size="16" font-weight="600" font-family="'Geist', sans-serif">Battery</text><text x="605.94" y="352" fill="#4f5d75" font-size="10" font-family="'Geist Mono', monospace" letter-spacing="0.08em">li-ion cell</text></g></g>
76
+ <g data-part-front="housing"><path d="M 150.06 508 A 33.94 16.97 0 0 0 160 520 L 252 566 A 33.94 16.97 0 0 0 300 566 L 532 450 A 33.94 16.97 0 0 0 541.94 438 L 541.94 458 A 33.94 16.97 0 0 1 532 470 L 300 586 A 33.94 16.97 0 0 1 252 586 L 160 540 A 33.94 16.97 0 0 1 150.06 528 Z" fill="#ffffff"/><path d="M 150.06 508 A 33.94 16.97 0 0 0 160 520 L 252 566 A 33.94 16.97 0 0 0 300 566 L 532 450 A 33.94 16.97 0 0 0 541.94 438 L 534.87 438 A 26.87 13.44 0 0 1 527 447.5 L 295 563.5 A 26.87 13.44 0 0 1 257 563.5 L 165 517.5 A 26.87 13.44 0 0 1 157.13 508 Z" fill="#ffffff"/><path d="M 150.06 508 A 33.94 16.97 0 0 0 160 520 L 252 566 A 33.94 16.97 0 0 0 276 570.97 L 276 590.97 A 33.94 16.97 0 0 1 252 586 L 160 540 A 33.94 16.97 0 0 1 150.06 528 Z" fill="rgba(45,49,66,0.07)"/><path d="M 276 570.97 A 33.94 16.97 0 0 0 300 566 L 532 450 A 33.94 16.97 0 0 0 541.94 438 L 541.94 458 A 33.94 16.97 0 0 1 532 470 L 300 586 A 33.94 16.97 0 0 1 276 590.97 Z" fill="rgba(45,49,66,0.15)"/><polygon points="497.5,473.75 457.5,493.75 457.5,501.75 497.5,481.75" fill="#ffffff" stroke="rgba(45,49,66,0.55)" stroke-width="0.8"/><polygon points="445.5,499.75 425.5,509.75 425.5,517.75 445.5,507.75" fill="#ffffff" stroke="rgba(45,49,66,0.55)" stroke-width="0.8"/><path d="M 157.13 508 A 26.87 13.44 0 0 0 165 517.5 L 257 563.5 A 26.87 13.44 0 0 0 295 563.5 L 527 447.5 A 26.87 13.44 0 0 0 534.87 438" fill="none" stroke="rgba(45,49,66,0.55)" stroke-width="0.8"/><path d="M 150.06 508 A 33.94 16.97 0 0 0 160 520 L 252 566 A 33.94 16.97 0 0 0 300 566 L 532 450 A 33.94 16.97 0 0 0 541.94 438" fill="none" stroke="#2d3142" stroke-width="1.2"/><path d="M 150.06 508 L 150.06 528 A 33.94 16.97 0 0 0 160 540 L 252 586 A 33.94 16.97 0 0 0 300 586 L 532 470 A 33.94 16.97 0 0 0 541.94 458 L 541.94 438" fill="none" stroke="#2d3142" stroke-width="1.2" stroke-linejoin="round"/></g>
77
+ <g data-part="display" data-name="Display" data-rect="0 0 140 280 24" data-z="348" data-t="6" data-level="2"><path data-role="silhouette" d="M 150.06 174 A 33.94 16.97 0 0 1 160 162 L 392 46 A 33.94 16.97 0 0 1 440 46 L 532 92 A 33.94 16.97 0 0 1 541.94 104 L 541.94 110 A 33.94 16.97 0 0 1 532 122 L 300 238 A 33.94 16.97 0 0 1 252 238 L 160 192 A 33.94 16.97 0 0 1 150.06 180 Z" fill="#ffffff"/><path d="M 150.06 174 A 33.94 16.97 0 0 0 160 186 L 252 232 A 33.94 16.97 0 0 0 276 236.97 L 276 242.97 A 33.94 16.97 0 0 1 252 238 L 160 192 A 33.94 16.97 0 0 1 150.06 180 Z" fill="rgba(45,49,66,0.07)"/><path d="M 276 236.97 A 33.94 16.97 0 0 0 300 232 L 532 116 A 33.94 16.97 0 0 0 541.94 104 L 541.94 110 A 33.94 16.97 0 0 1 532 122 L 300 238 A 33.94 16.97 0 0 1 276 242.97 Z" fill="rgba(45,49,66,0.15)"/><path d="M 296 230 A 28.28 14.14 0 0 1 256 230 L 164 184 A 28.28 14.14 0 0 1 164 164 L 396 48 A 28.28 14.14 0 0 1 436 48 L 528 94 A 28.28 14.14 0 0 1 528 114 Z" fill="#2d3142"/><path d="M 485 85.5 A 7.07 3.54 0 0 1 475 85.5 L 453 74.5 A 7.07 3.54 0 0 1 453 69.5 L 453 69.5 A 7.07 3.54 0 0 1 463 69.5 L 485 80.5 A 7.07 3.54 0 0 1 485 85.5 Z" fill="#111111"/><path d="M 150.06 174 A 33.94 16.97 0 0 0 160 186 L 252 232 A 33.94 16.97 0 0 0 300 232 L 532 116 A 33.94 16.97 0 0 0 541.94 104" fill="none" stroke="rgba(45,49,66,0.55)" stroke-width="0.8"/><path d="M 150.06 174 A 33.94 16.97 0 0 1 160 162 L 392 46 A 33.94 16.97 0 0 1 440 46 L 532 92 A 33.94 16.97 0 0 1 541.94 104 L 541.94 110 A 33.94 16.97 0 0 1 532 122 L 300 238 A 33.94 16.97 0 0 1 252 238 L 160 192 A 33.94 16.97 0 0 1 150.06 180 Z" fill="none" stroke="#2d3142" stroke-width="1.2" stroke-linejoin="round"/><g data-role="label"><line data-role="leader" x1="547.94" y1="107" x2="593.94" y2="107" stroke="rgba(45,49,66,0.40)" stroke-width="0.8"/><circle cx="541.94" cy="107" r="2" fill="#2d3142"/><text data-role="name" x="605.94" y="106" fill="#2d3142" font-size="16" font-weight="600" font-family="'Geist', sans-serif">Display</text><text x="605.94" y="122" fill="#4f5d75" font-size="10" font-family="'Geist Mono', monospace" letter-spacing="0.08em">oled, cover glass</text></g></g>
78
+ </g>
79
+ </svg>
80
+ </div>
81
+ </div>
82
+ </body>
83
+ </html>
package/.agents/skills/diagram-design/assets/example-exploded-unboxing.html ADDED
@@ -0,0 +1,84 @@
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.0">
6
+ <title>Unboxing · What you see, in the order you see it</title>
7
+ <link href="https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Geist:wght@400;500;600&family=Geist+Mono:wght@400;500;600&display=swap" rel="stylesheet">
8
+ <style>
9
+ *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
10
+ :root {
11
+ --color-paper: #f5f5f5;
12
+ --color-ink: #2d3142;
13
+ --color-muted: #4f5d75;
14
+ --color-accent: #bf4520;
15
+ --font-sans: 'Geist', system-ui, sans-serif;
16
+ --font-serif: 'Instrument Serif', serif;
17
+ --font-mono: 'Geist Mono', ui-monospace, monospace;
18
+ }
19
+
20
+ body {
21
+ font-family: var(--font-sans);
22
+ background: var(--color-paper);
23
+ color: var(--color-ink);
24
+ min-height: 100vh;
25
+ display: flex;
26
+ align-items: center;
27
+ justify-content: center;
28
+ padding: 3rem 2rem;
29
+ }
30
+
31
+ .frame { max-width: 1200px; width: 100%; }
32
+ .diagram-container { width: 100%; overflow-x: auto; }
33
+
34
+ .eyebrow {
35
+ font-family: var(--font-mono);
36
+ font-size: 0.66rem;
37
+ font-weight: 500;
38
+ letter-spacing: 0.18em;
39
+ text-transform: uppercase;
40
+ color: var(--color-muted);
41
+ margin-bottom: 0.5rem;
42
+ }
43
+
44
+ h1 {
45
+ font-family: var(--font-serif);
46
+ font-size: clamp(1.5rem, 2.4vw + 0.75rem, 2rem);
47
+ font-weight: 400;
48
+ letter-spacing: -0.02em;
49
+ line-height: 1.15;
50
+ color: var(--color-ink);
51
+ margin-bottom: 1.5rem;
52
+ }
53
+
54
+ svg { width: 100%; min-width: 1000px; display: block; }
55
+ @media print {
56
+ .diagram-container { overflow-x: visible; }
57
+ svg { min-width: 0; }
58
+ }
59
+ </style>
60
+ </head>
61
+ <body>
62
+ <div class="frame">
63
+ <p class="eyebrow">Exploded axonometric · Diagram Design</p>
64
+ <h1>Unboxing · What you see, in the order you see it</h1>
65
+
66
+ <div class="diagram-container">
67
+ <svg viewBox="0 0 1000 964" xmlns="http://www.w3.org/2000/svg" role="img" aria-labelledby="exploded-unboxing-title exploded-unboxing-desc">
68
+ <title id="exploded-unboxing-title">Unboxing · What you see, in the order you see it</title>
69
+ <desc id="exploded-unboxing-desc">Exploded view of product packaging: printed lid, the speaker and its cable, the moulded insert that holds them, and the rigid box, with the speaker as the focal part.</desc>
70
+ <rect width="100%" height="100%" fill="#f5f5f5"/>
71
+ <g data-exploded data-origin="348 752" data-gap="180">
72
+ <line data-role="trace" x1="170.34" y1="770" x2="170.34" y2="158" stroke="rgba(45,49,66,0.30)" stroke-width="0.8" stroke-dasharray="4,3"/><line data-role="trace" x1="525.66" y1="770" x2="525.66" y2="158" stroke="rgba(45,49,66,0.30)" stroke-width="0.8" stroke-dasharray="4,3"/>
73
+ <g data-part="box" data-name="Box" data-rect="0 0 180 180 4" data-z="0" data-t="72" data-level="0" data-kind="housing"><path data-role="silhouette" d="M 170.34 770 A 5.66 2.83 0 0 1 172 768 L 344 682 A 5.66 2.83 0 0 1 352 682 L 524 768 A 5.66 2.83 0 0 1 525.66 770 L 525.66 842 A 5.66 2.83 0 0 1 524 844 L 352 930 A 5.66 2.83 0 0 1 344 930 L 172 844 A 5.66 2.83 0 0 1 170.34 842 Z" fill="#ffffff"/><path d="M 352 858 A 5.66 2.83 0 0 1 344 858 L 172 772 A 5.66 2.83 0 0 1 172 768 L 344 682 A 5.66 2.83 0 0 1 352 682 L 524 768 A 5.66 2.83 0 0 1 524 772 Z" fill="#ffffff"/><path d="M 348 855 L 348 855 L 178 770 L 178 770 L 348 685 L 348 685 L 518 770 L 518 770 Z" fill="#ffffff"/><path d="M 348 855 L 348 855 L 178 770 L 178 770 L 348 685 L 348 685 L 518 770 L 518 770 Z" fill="rgba(45,49,66,0.10)"/><clipPath id="exploded-unboxing-box-cavity"><path d="M 348 855 L 348 855 L 178 770 L 178 770 L 348 685 L 348 685 L 518 770 L 518 770 Z"/></clipPath><g clip-path="url(#exploded-unboxing-box-cavity)"><path d="M 348 924 L 348 924 L 178 839 L 178 839 L 348 754 L 348 754 L 518 839 L 518 839 Z" fill="#ffffff"/><path d="M 348 924 L 348 924 L 178 839 L 178 839 L 348 754 L 348 754 L 518 839 L 518 839 Z" fill="rgba(45,49,66,0.04)"/><path d="M 348 924 L 348 924 L 178 839 L 178 839 L 348 754 L 348 754 L 518 839 L 518 839 Z" fill="none" stroke="rgba(45,49,66,0.55)" stroke-width="0.8"/></g><path d="M 348 855 L 348 855 L 178 770 L 178 770 L 348 685 L 348 685 L 518 770 L 518 770 Z" fill="none" stroke="rgba(45,49,66,0.55)" stroke-width="0.8"/><path d="M 170.34 770 A 5.66 2.83 0 0 1 172 768 L 344 682 A 5.66 2.83 0 0 1 352 682 L 524 768 A 5.66 2.83 0 0 1 525.66 770" fill="none" stroke="#2d3142" stroke-width="1.2" stroke-linejoin="round"/><g data-role="label"><line data-role="leader" x1="531.66" y1="806" x2="582.49" y2="806" stroke="rgba(45,49,66,0.40)" stroke-width="0.8"/><circle cx="525.66" cy="806" r="2" fill="#2d3142"/><text data-role="name" x="594.49" y="805" fill="#2d3142" font-size="16" font-weight="600" font-family="'Geist', sans-serif">Box</text><text x="594.49" y="821" fill="#4f5d75" font-size="10" font-family="'Geist Mono', monospace" letter-spacing="0.08em">rigid board</text></g></g>
74
+ <g data-part="insert" data-name="Insert" data-rect="6 6 174 174 2" data-z="252" data-t="12" data-level="1"><path data-role="silhouette" d="M 181.17 578 A 2.83 1.41 0 0 1 182 577 L 346 495 A 2.83 1.41 0 0 1 350 495 L 514 577 A 2.83 1.41 0 0 1 514.83 578 L 514.83 590 A 2.83 1.41 0 0 1 514 591 L 350 673 A 2.83 1.41 0 0 1 346 673 L 182 591 A 2.83 1.41 0 0 1 181.17 590 Z" fill="#ffffff"/><path d="M 181.17 578 A 2.83 1.41 0 0 0 182 579 L 346 661 A 2.83 1.41 0 0 0 348 661.41 L 348 673.41 A 2.83 1.41 0 0 1 346 673 L 182 591 A 2.83 1.41 0 0 1 181.17 590 Z" fill="rgba(45,49,66,0.07)"/><path d="M 348 661.41 A 2.83 1.41 0 0 0 350 661 L 514 579 A 2.83 1.41 0 0 0 514.83 578 L 514.83 590 A 2.83 1.41 0 0 1 514 591 L 350 673 A 2.83 1.41 0 0 1 348 673.41 Z" fill="rgba(45,49,66,0.15)"/><path d="M 382 603 A 70.71 35.36 0 0 1 282 603 L 282 603 A 70.71 35.36 0 0 1 282 553 L 282 553 A 70.71 35.36 0 0 1 382 553 L 382 553 A 70.71 35.36 0 0 1 382 603 Z" fill="rgba(45,49,66,0.14)" stroke="rgba(45,49,66,0.55)" stroke-width="0.8"/><path d="M 451 609.5 A 7.07 3.54 0 0 1 441 609.5 L 413 595.5 A 7.07 3.54 0 0 1 413 590.5 L 441 576.5 A 7.07 3.54 0 0 1 451 576.5 L 479 590.5 A 7.07 3.54 0 0 1 479 595.5 Z" fill="rgba(45,49,66,0.14)" stroke="rgba(45,49,66,0.55)" stroke-width="0.8"/><path d="M 181.17 578 A 2.83 1.41 0 0 0 182 579 L 346 661 A 2.83 1.41 0 0 0 350 661 L 514 579 A 2.83 1.41 0 0 0 514.83 578" fill="none" stroke="rgba(45,49,66,0.55)" stroke-width="0.8"/><path d="M 181.17 578 A 2.83 1.41 0 0 1 182 577 L 346 495 A 2.83 1.41 0 0 1 350 495 L 514 577 A 2.83 1.41 0 0 1 514.83 578 L 514.83 590 A 2.83 1.41 0 0 1 514 591 L 350 673 A 2.83 1.41 0 0 1 346 673 L 182 591 A 2.83 1.41 0 0 1 181.17 590 Z" fill="none" stroke="#2d3142" stroke-width="1.2" stroke-linejoin="round"/><g data-role="label"><line data-role="leader" x1="520.83" y1="584" x2="582.49" y2="584" stroke="rgba(45,49,66,0.40)" stroke-width="0.8"/><circle cx="514.83" cy="584" r="2" fill="#2d3142"/><text data-role="name" x="594.49" y="583" fill="#2d3142" font-size="16" font-weight="600" font-family="'Geist', sans-serif">Insert</text><text x="594.49" y="599" fill="#4f5d75" font-size="10" font-family="'Geist Mono', monospace" letter-spacing="0.08em">moulded pulp</text></g></g>
75
+ <g data-part="cable" data-name="Cable" data-rect="138 40 170 72 4" data-z="444" data-t="14" data-level="2"><path data-role="silhouette" d="M 416.34 399 A 5.66 2.83 0 0 1 418 397 L 442 385 A 5.66 2.83 0 0 1 450 385 L 474 397 A 5.66 2.83 0 0 1 475.66 399 L 475.66 413 A 5.66 2.83 0 0 1 474 415 L 450 427 A 5.66 2.83 0 0 1 442 427 L 418 415 A 5.66 2.83 0 0 1 416.34 413 Z" fill="#ffffff"/><path d="M 416.34 399 A 5.66 2.83 0 0 0 418 401 L 442 413 A 5.66 2.83 0 0 0 446 413.83 L 446 427.83 A 5.66 2.83 0 0 1 442 427 L 418 415 A 5.66 2.83 0 0 1 416.34 413 Z" fill="rgba(45,49,66,0.07)"/><path d="M 446 413.83 A 5.66 2.83 0 0 0 450 413 L 474 401 A 5.66 2.83 0 0 0 475.66 399 L 475.66 413 A 5.66 2.83 0 0 1 474 415 L 450 427 A 5.66 2.83 0 0 1 446 427.83 Z" fill="rgba(45,49,66,0.15)"/><path d="M 450 407 A 5.66 2.83 0 0 1 442 407 L 430 401 A 5.66 2.83 0 0 1 430 397 L 442 391 A 5.66 2.83 0 0 1 450 391 L 462 397 A 5.66 2.83 0 0 1 462 401 Z" fill="none" stroke="rgba(45,49,66,0.55)" stroke-width="0.8"/><path d="M 450 402 A 5.66 2.83 0 0 1 442 402 L 440 401 A 5.66 2.83 0 0 1 440 397 L 442 396 A 5.66 2.83 0 0 1 450 396 L 452 397 A 5.66 2.83 0 0 1 452 401 Z" fill="none" stroke="rgba(45,49,66,0.55)" stroke-width="0.8"/><path d="M 416.34 399 A 5.66 2.83 0 0 0 418 401 L 442 413 A 5.66 2.83 0 0 0 450 413 L 474 401 A 5.66 2.83 0 0 0 475.66 399" fill="none" stroke="rgba(45,49,66,0.55)" stroke-width="0.8"/><path d="M 416.34 399 A 5.66 2.83 0 0 1 418 397 L 442 385 A 5.66 2.83 0 0 1 450 385 L 474 397 A 5.66 2.83 0 0 1 475.66 399 L 475.66 413 A 5.66 2.83 0 0 1 474 415 L 450 427 A 5.66 2.83 0 0 1 442 427 L 418 415 A 5.66 2.83 0 0 1 416.34 413 Z" fill="none" stroke="#2d3142" stroke-width="1.2" stroke-linejoin="round"/><g data-role="label"><line data-role="leader" x1="481.66" y1="406" x2="582.49" y2="406" stroke="rgba(45,49,66,0.40)" stroke-width="0.8"/><circle cx="475.66" cy="406" r="2" fill="#2d3142"/><text data-role="name" x="594.49" y="405" fill="#2d3142" font-size="16" font-weight="600" font-family="'Geist', sans-serif">Cable</text><text x="594.49" y="421" fill="#4f5d75" font-size="10" font-family="'Geist Mono', monospace" letter-spacing="0.08em">usb-c, 1 m</text></g></g>
76
+ <g data-part="speaker" data-name="Speaker" data-rect="36 52 128 144 46" data-z="444" data-t="60" data-level="2" data-focal><path data-role="silhouette" d="M 266.95 338 A 65.05 32.53 0 0 1 286 315 L 286 315 A 65.05 32.53 0 0 1 378 315 L 378 315 A 65.05 32.53 0 0 1 397.05 338 L 397.05 398 A 65.05 32.53 0 0 1 378 421 L 378 421 A 65.05 32.53 0 0 1 286 421 L 286 421 A 65.05 32.53 0 0 1 266.95 398 Z" fill="#ffffff"/><path d="M 378 361 A 65.05 32.53 0 0 1 286 361 L 286 361 A 65.05 32.53 0 0 1 286 315 L 286 315 A 65.05 32.53 0 0 1 378 315 L 378 315 A 65.05 32.53 0 0 1 378 361 Z" fill="rgba(191,69,32,0.10)"/><path d="M 266.95 338 A 65.05 32.53 0 0 0 286 361 L 286 361 A 65.05 32.53 0 0 0 332 370.53 L 332 430.53 A 65.05 32.53 0 0 1 286 421 L 286 421 A 65.05 32.53 0 0 1 266.95 398 Z" fill="rgba(191,69,32,0.20)"/><path d="M 332 370.53 A 65.05 32.53 0 0 0 378 361 L 378 361 A 65.05 32.53 0 0 0 397.05 338 L 397.05 398 A 65.05 32.53 0 0 1 378 421 L 378 421 A 65.05 32.53 0 0 1 332 430.53 Z" fill="rgba(191,69,32,0.32)"/><path d="M 266.95 388 A 65.05 32.53 0 0 0 286 411 L 286 411 A 65.05 32.53 0 0 0 378 411 L 378 411 A 65.05 32.53 0 0 0 397.05 388" fill="none" stroke="rgba(191,69,32,0.70)" stroke-width="0.6"/><path d="M 266.95 380 A 65.05 32.53 0 0 0 286 403 L 286 403 A 65.05 32.53 0 0 0 378 403 L 378 403 A 65.05 32.53 0 0 0 397.05 380" fill="none" stroke="rgba(191,69,32,0.70)" stroke-width="0.6"/><path d="M 266.95 372 A 65.05 32.53 0 0 0 286 395 L 286 395 A 65.05 32.53 0 0 0 378 395 L 378 395 A 65.05 32.53 0 0 0 397.05 372" fill="none" stroke="rgba(191,69,32,0.70)" stroke-width="0.6"/><path d="M 266.95 364 A 65.05 32.53 0 0 0 286 387 L 286 387 A 65.05 32.53 0 0 0 378 387 L 378 387 A 65.05 32.53 0 0 0 397.05 364" fill="none" stroke="rgba(191,69,32,0.70)" stroke-width="0.6"/><path d="M 266.95 356 A 65.05 32.53 0 0 0 286 379 L 286 379 A 65.05 32.53 0 0 0 378 379 L 378 379 A 65.05 32.53 0 0 0 397.05 356" fill="none" stroke="rgba(191,69,32,0.70)" stroke-width="0.6"/><path d="M 368 356 A 50.91 25.46 0 0 1 296 356 L 296 356 A 50.91 25.46 0 0 1 296 320 L 296 320 A 50.91 25.46 0 0 1 368 320 L 368 320 A 50.91 25.46 0 0 1 368 356 Z" fill="none" stroke="rgba(191,69,32,0.70)" stroke-width="0.8"/><path d="M 342 343 A 14.14 7.07 0 0 1 322 343 L 322 343 A 14.14 7.07 0 0 1 322 333 L 322 333 A 14.14 7.07 0 0 1 342 333 L 342 333 A 14.14 7.07 0 0 1 342 343 Z" fill="#bf4520"/><path d="M 266.95 338 A 65.05 32.53 0 0 0 286 361 L 286 361 A 65.05 32.53 0 0 0 378 361 L 378 361 A 65.05 32.53 0 0 0 397.05 338" fill="none" stroke="rgba(191,69,32,0.70)" stroke-width="0.8"/><path d="M 266.95 338 A 65.05 32.53 0 0 1 286 315 L 286 315 A 65.05 32.53 0 0 1 378 315 L 378 315 A 65.05 32.53 0 0 1 397.05 338 L 397.05 398 A 65.05 32.53 0 0 1 378 421 L 378 421 A 65.05 32.53 0 0 1 286 421 L 286 421 A 65.05 32.53 0 0 1 266.95 398 Z" fill="none" stroke="#bf4520" stroke-width="1.2" stroke-linejoin="round"/><g data-role="label"><line data-role="leader" x1="403.05" y1="368" x2="582.49" y2="368" stroke="rgba(191,69,32,0.60)" stroke-width="0.8"/><circle cx="397.05" cy="368" r="2" fill="#bf4520"/><text data-role="name" x="594.49" y="367" fill="#2d3142" font-size="16" font-weight="600" font-family="'Geist', sans-serif">Speaker</text><text x="594.49" y="383" fill="#bf4520" font-size="10" font-family="'Geist Mono', monospace" letter-spacing="0.08em">the product</text></g></g>
77
+ <g data-part-front="box"><path d="M 170.34 770 A 5.66 2.83 0 0 0 172 772 L 344 858 A 5.66 2.83 0 0 0 352 858 L 524 772 A 5.66 2.83 0 0 0 525.66 770 L 525.66 842 A 5.66 2.83 0 0 1 524 844 L 352 930 A 5.66 2.83 0 0 1 344 930 L 172 844 A 5.66 2.83 0 0 1 170.34 842 Z" fill="#ffffff"/><path d="M 170.34 770 A 5.66 2.83 0 0 0 172 772 L 344 858 A 5.66 2.83 0 0 0 352 858 L 524 772 A 5.66 2.83 0 0 0 525.66 770 L 518 770 L 518 770 L 348 855 L 348 855 L 178 770 L 178 770 Z" fill="#ffffff"/><path d="M 170.34 770 A 5.66 2.83 0 0 0 172 772 L 344 858 A 5.66 2.83 0 0 0 348 858.83 L 348 930.83 A 5.66 2.83 0 0 1 344 930 L 172 844 A 5.66 2.83 0 0 1 170.34 842 Z" fill="rgba(45,49,66,0.07)"/><path d="M 348 858.83 A 5.66 2.83 0 0 0 352 858 L 524 772 A 5.66 2.83 0 0 0 525.66 770 L 525.66 842 A 5.66 2.83 0 0 1 524 844 L 352 930 A 5.66 2.83 0 0 1 348 930.83 Z" fill="rgba(45,49,66,0.15)"/><path d="M 178 770 L 178 770 L 348 855 L 348 855 L 518 770 L 518 770" fill="none" stroke="rgba(45,49,66,0.55)" stroke-width="0.8"/><path d="M 170.34 770 A 5.66 2.83 0 0 0 172 772 L 344 858 A 5.66 2.83 0 0 0 352 858 L 524 772 A 5.66 2.83 0 0 0 525.66 770" fill="none" stroke="#2d3142" stroke-width="1.2"/><path d="M 170.34 770 L 170.34 842 A 5.66 2.83 0 0 0 172 844 L 344 930 A 5.66 2.83 0 0 0 352 930 L 524 844 A 5.66 2.83 0 0 0 525.66 842 L 525.66 770" fill="none" stroke="#2d3142" stroke-width="1.2" stroke-linejoin="round"/></g>
78
+ <g data-part="lid" data-name="Lid" data-rect="-3 -3 183 183 6" data-z="684" data-t="28" data-level="3"><path data-role="silhouette" d="M 165.51 130 A 8.49 4.24 0 0 1 168 127 L 342 40 A 8.49 4.24 0 0 1 354 40 L 528 127 A 8.49 4.24 0 0 1 530.49 130 L 530.49 158 A 8.49 4.24 0 0 1 528 161 L 354 248 A 8.49 4.24 0 0 1 342 248 L 168 161 A 8.49 4.24 0 0 1 165.51 158 Z" fill="#ffffff"/><path d="M 165.51 130 A 8.49 4.24 0 0 0 168 133 L 342 220 A 8.49 4.24 0 0 0 348 221.24 L 348 249.24 A 8.49 4.24 0 0 1 342 248 L 168 161 A 8.49 4.24 0 0 1 165.51 158 Z" fill="rgba(45,49,66,0.07)"/><path d="M 348 221.24 A 8.49 4.24 0 0 0 354 220 L 528 133 A 8.49 4.24 0 0 0 530.49 130 L 530.49 158 A 8.49 4.24 0 0 1 528 161 L 354 248 A 8.49 4.24 0 0 1 348 249.24 Z" fill="rgba(45,49,66,0.15)"/><path d="M 348 209 L 348 209 L 190 130 L 190 130 L 348 51 L 348 51 L 506 130 L 506 130 Z" fill="none" stroke="rgba(45,49,66,0.55)" stroke-width="0.8"/><path d="M 362 137 A 19.8 9.9 0 0 1 334 137 L 334 137 A 19.8 9.9 0 0 1 334 123 L 334 123 A 19.8 9.9 0 0 1 362 123 L 362 123 A 19.8 9.9 0 0 1 362 137 Z" fill="none" stroke="#2d3142" stroke-width="1.2"/><path d="M 353 132.5 A 7.07 3.54 0 0 1 343 132.5 L 343 132.5 A 7.07 3.54 0 0 1 343 127.5 L 343 127.5 A 7.07 3.54 0 0 1 353 127.5 L 353 127.5 A 7.07 3.54 0 0 1 353 132.5 Z" fill="#2d3142"/><path d="M 165.51 130 A 8.49 4.24 0 0 0 168 133 L 342 220 A 8.49 4.24 0 0 0 354 220 L 528 133 A 8.49 4.24 0 0 0 530.49 130" fill="none" stroke="rgba(45,49,66,0.55)" stroke-width="0.8"/><path d="M 165.51 130 A 8.49 4.24 0 0 1 168 127 L 342 40 A 8.49 4.24 0 0 1 354 40 L 528 127 A 8.49 4.24 0 0 1 530.49 130 L 530.49 158 A 8.49 4.24 0 0 1 528 161 L 354 248 A 8.49 4.24 0 0 1 342 248 L 168 161 A 8.49 4.24 0 0 1 165.51 158 Z" fill="none" stroke="#2d3142" stroke-width="1.2" stroke-linejoin="round"/><g data-role="label"><line data-role="leader" x1="536.49" y1="144" x2="582.49" y2="144" stroke="rgba(45,49,66,0.40)" stroke-width="0.8"/><circle cx="530.49" cy="144" r="2" fill="#2d3142"/><text data-role="name" x="594.49" y="143" fill="#2d3142" font-size="16" font-weight="600" font-family="'Geist', sans-serif">Lid</text><text x="594.49" y="159" fill="#4f5d75" font-size="10" font-family="'Geist Mono', monospace" letter-spacing="0.08em">printed sleeve</text></g></g>
79
+ </g>
80
+ </svg>
81
+ </div>
82
+ </div>
83
+ </body>
84
+ </html>
package/.agents/skills/diagram-design/assets/example-exploded.html ADDED
@@ -0,0 +1,83 @@
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.0">
6
+ <title>App stack · Three layers, one product</title>
7
+ <link href="https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Geist:wght@400;500;600&family=Geist+Mono:wght@400;500;600&display=swap" rel="stylesheet">
8
+ <style>
9
+ *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
10
+ :root {
11
+ --color-paper: #f5f5f5;
12
+ --color-ink: #2d3142;
13
+ --color-muted: #4f5d75;
14
+ --color-accent: #bf4520;
15
+ --font-sans: 'Geist', system-ui, sans-serif;
16
+ --font-serif: 'Instrument Serif', serif;
17
+ --font-mono: 'Geist Mono', ui-monospace, monospace;
18
+ }
19
+
20
+ body {
21
+ font-family: var(--font-sans);
22
+ background: var(--color-paper);
23
+ color: var(--color-ink);
24
+ min-height: 100vh;
25
+ display: flex;
26
+ align-items: center;
27
+ justify-content: center;
28
+ padding: 3rem 2rem;
29
+ }
30
+
31
+ .frame { max-width: 1200px; width: 100%; }
32
+ .diagram-container { width: 100%; overflow-x: auto; }
33
+
34
+ .eyebrow {
35
+ font-family: var(--font-mono);
36
+ font-size: 0.66rem;
37
+ font-weight: 500;
38
+ letter-spacing: 0.18em;
39
+ text-transform: uppercase;
40
+ color: var(--color-muted);
41
+ margin-bottom: 0.5rem;
42
+ }
43
+
44
+ h1 {
45
+ font-family: var(--font-serif);
46
+ font-size: clamp(1.5rem, 2.4vw + 0.75rem, 2rem);
47
+ font-weight: 400;
48
+ letter-spacing: -0.02em;
49
+ line-height: 1.15;
50
+ color: var(--color-ink);
51
+ margin-bottom: 1.5rem;
52
+ }
53
+
54
+ svg { width: 100%; min-width: 1000px; display: block; }
55
+ @media print {
56
+ .diagram-container { overflow-x: visible; }
57
+ svg { min-width: 0; }
58
+ }
59
+ </style>
60
+ </head>
61
+ <body>
62
+ <div class="frame">
63
+ <p class="eyebrow">Exploded axonometric · Diagram Design</p>
64
+ <h1>App stack · Three layers, one product</h1>
65
+
66
+ <div class="diagram-container">
67
+ <svg viewBox="0 0 1000 556" xmlns="http://www.w3.org/2000/svg" role="img" aria-labelledby="exploded-title exploded-desc">
68
+ <title id="exploded-title">App stack · Three layers, one product</title>
69
+ <desc id="exploded-desc">Exploded view of a three-layer app stack: data at the base, logic in the middle, interface on top, with logic as the focal layer.</desc>
70
+ <rect width="100%" height="100%" fill="#f5f5f5"/>
71
+ <g data-exploded data-origin="344 284" data-gap="100">
72
+ <line data-role="trace" x1="151.03" y1="368" x2="151.03" y2="152" stroke="rgba(45,49,66,0.30)" stroke-width="0.8" stroke-dasharray="4,3"/><line data-role="trace" x1="536.97" y1="368" x2="536.97" y2="152" stroke="rgba(45,49,66,0.30)" stroke-width="0.8" stroke-dasharray="4,3"/>
73
+ <g data-part="data" data-name="Data" data-rect="0 0 200 200 12" data-z="0" data-t="16" data-level="0"><path data-role="silhouette" d="M 151.03 368 A 16.97 8.49 0 0 1 156 362 L 332 274 A 16.97 8.49 0 0 1 356 274 L 532 362 A 16.97 8.49 0 0 1 536.97 368 L 536.97 384 A 16.97 8.49 0 0 1 532 390 L 356 478 A 16.97 8.49 0 0 1 332 478 L 156 390 A 16.97 8.49 0 0 1 151.03 384 Z" fill="#ffffff"/><path d="M 151.03 368 A 16.97 8.49 0 0 0 156 374 L 332 462 A 16.97 8.49 0 0 0 344 464.49 L 344 480.49 A 16.97 8.49 0 0 1 332 478 L 156 390 A 16.97 8.49 0 0 1 151.03 384 Z" fill="rgba(45,49,66,0.07)"/><path d="M 344 464.49 A 16.97 8.49 0 0 0 356 462 L 532 374 A 16.97 8.49 0 0 0 536.97 368 L 536.97 384 A 16.97 8.49 0 0 1 532 390 L 356 478 A 16.97 8.49 0 0 1 344 480.49 Z" fill="rgba(45,49,66,0.15)"/><path d="M 151.03 368 A 16.97 8.49 0 0 0 156 374 L 332 462 A 16.97 8.49 0 0 0 356 462 L 532 374 A 16.97 8.49 0 0 0 536.97 368" fill="none" stroke="rgba(45,49,66,0.55)" stroke-width="0.8"/><path d="M 151.03 368 A 16.97 8.49 0 0 1 156 362 L 332 274 A 16.97 8.49 0 0 1 356 274 L 532 362 A 16.97 8.49 0 0 1 536.97 368 L 536.97 384 A 16.97 8.49 0 0 1 532 390 L 356 478 A 16.97 8.49 0 0 1 332 478 L 156 390 A 16.97 8.49 0 0 1 151.03 384 Z" fill="none" stroke="#2d3142" stroke-width="1.2" stroke-linejoin="round"/><g data-role="label"><line data-role="leader" x1="542.97" y1="376" x2="588.97" y2="376" stroke="rgba(45,49,66,0.40)" stroke-width="0.8"/><circle cx="536.97" cy="376" r="2" fill="#2d3142"/><text data-role="name" x="600.97" y="375" fill="#2d3142" font-size="16" font-weight="600" font-family="'Geist', sans-serif">Data</text><text x="600.97" y="391" fill="#4f5d75" font-size="10" font-family="'Geist Mono', monospace" letter-spacing="0.08em">postgres, object store</text></g></g>
74
+ <g data-part="logic" data-name="Logic" data-rect="0 0 200 200 12" data-z="116" data-t="16" data-level="1" data-focal><path data-role="silhouette" d="M 151.03 252 A 16.97 8.49 0 0 1 156 246 L 332 158 A 16.97 8.49 0 0 1 356 158 L 532 246 A 16.97 8.49 0 0 1 536.97 252 L 536.97 268 A 16.97 8.49 0 0 1 532 274 L 356 362 A 16.97 8.49 0 0 1 332 362 L 156 274 A 16.97 8.49 0 0 1 151.03 268 Z" fill="#ffffff"/><path d="M 356 346 A 16.97 8.49 0 0 1 332 346 L 156 258 A 16.97 8.49 0 0 1 156 246 L 332 158 A 16.97 8.49 0 0 1 356 158 L 532 246 A 16.97 8.49 0 0 1 532 258 Z" fill="rgba(191,69,32,0.10)"/><path d="M 151.03 252 A 16.97 8.49 0 0 0 156 258 L 332 346 A 16.97 8.49 0 0 0 344 348.49 L 344 364.49 A 16.97 8.49 0 0 1 332 362 L 156 274 A 16.97 8.49 0 0 1 151.03 268 Z" fill="rgba(191,69,32,0.20)"/><path d="M 344 348.49 A 16.97 8.49 0 0 0 356 346 L 532 258 A 16.97 8.49 0 0 0 536.97 252 L 536.97 268 A 16.97 8.49 0 0 1 532 274 L 356 362 A 16.97 8.49 0 0 1 344 364.49 Z" fill="rgba(191,69,32,0.32)"/><path d="M 151.03 252 A 16.97 8.49 0 0 0 156 258 L 332 346 A 16.97 8.49 0 0 0 356 346 L 532 258 A 16.97 8.49 0 0 0 536.97 252" fill="none" stroke="rgba(191,69,32,0.70)" stroke-width="0.8"/><path d="M 151.03 252 A 16.97 8.49 0 0 1 156 246 L 332 158 A 16.97 8.49 0 0 1 356 158 L 532 246 A 16.97 8.49 0 0 1 536.97 252 L 536.97 268 A 16.97 8.49 0 0 1 532 274 L 356 362 A 16.97 8.49 0 0 1 332 362 L 156 274 A 16.97 8.49 0 0 1 151.03 268 Z" fill="none" stroke="#bf4520" stroke-width="1.2" stroke-linejoin="round"/><g data-role="label"><line data-role="leader" x1="542.97" y1="260" x2="588.97" y2="260" stroke="rgba(191,69,32,0.60)" stroke-width="0.8"/><circle cx="536.97" cy="260" r="2" fill="#bf4520"/><text data-role="name" x="600.97" y="259" fill="#2d3142" font-size="16" font-weight="600" font-family="'Geist', sans-serif">Logic</text><text x="600.97" y="275" fill="#bf4520" font-size="10" font-family="'Geist Mono', monospace" letter-spacing="0.08em">api, workers, queue</text></g></g>
75
+ <g data-part="interface" data-name="Interface" data-rect="0 0 200 200 12" data-z="232" data-t="16" data-level="2"><path data-role="silhouette" d="M 151.03 136 A 16.97 8.49 0 0 1 156 130 L 332 42 A 16.97 8.49 0 0 1 356 42 L 532 130 A 16.97 8.49 0 0 1 536.97 136 L 536.97 152 A 16.97 8.49 0 0 1 532 158 L 356 246 A 16.97 8.49 0 0 1 332 246 L 156 158 A 16.97 8.49 0 0 1 151.03 152 Z" fill="#ffffff"/><path d="M 151.03 136 A 16.97 8.49 0 0 0 156 142 L 332 230 A 16.97 8.49 0 0 0 344 232.49 L 344 248.49 A 16.97 8.49 0 0 1 332 246 L 156 158 A 16.97 8.49 0 0 1 151.03 152 Z" fill="rgba(45,49,66,0.07)"/><path d="M 344 232.49 A 16.97 8.49 0 0 0 356 230 L 532 142 A 16.97 8.49 0 0 0 536.97 136 L 536.97 152 A 16.97 8.49 0 0 1 532 158 L 356 246 A 16.97 8.49 0 0 1 344 248.49 Z" fill="rgba(45,49,66,0.15)"/><path d="M 151.03 136 A 16.97 8.49 0 0 0 156 142 L 332 230 A 16.97 8.49 0 0 0 356 230 L 532 142 A 16.97 8.49 0 0 0 536.97 136" fill="none" stroke="rgba(45,49,66,0.55)" stroke-width="0.8"/><path d="M 151.03 136 A 16.97 8.49 0 0 1 156 130 L 332 42 A 16.97 8.49 0 0 1 356 42 L 532 130 A 16.97 8.49 0 0 1 536.97 136 L 536.97 152 A 16.97 8.49 0 0 1 532 158 L 356 246 A 16.97 8.49 0 0 1 332 246 L 156 158 A 16.97 8.49 0 0 1 151.03 152 Z" fill="none" stroke="#2d3142" stroke-width="1.2" stroke-linejoin="round"/><g data-role="label"><line data-role="leader" x1="542.97" y1="144" x2="588.97" y2="144" stroke="rgba(45,49,66,0.40)" stroke-width="0.8"/><circle cx="536.97" cy="144" r="2" fill="#2d3142"/><text data-role="name" x="600.97" y="143" fill="#2d3142" font-size="16" font-weight="600" font-family="'Geist', sans-serif">Interface</text><text x="600.97" y="159" fill="#4f5d75" font-size="10" font-family="'Geist Mono', monospace" letter-spacing="0.08em">web app, mobile</text></g></g>
76
+ </g>
77
+ <text x="152" y="528" fill="#4f5d75" font-size="8" font-family="'Geist Mono', monospace" letter-spacing="0.18em">FOCAL LAYER</text>
78
+ <text x="256" y="528" fill="#4f5d75" font-size="8.5" font-family="'Geist', sans-serif" font-style="italic">Logic is where the product decisions live; the other two layers are swappable.</text>
79
+ </svg>
80
+ </div>
81
+ </div>
82
+ </body>
83
+ </html>
package/.agents/skills/diagram-design/assets/example-fishbone.html ADDED
@@ -0,0 +1,152 @@
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.0">
6
+ <title>Checkout p99 latency · Root-cause fishbone</title>
7
+ <link href="https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Geist:wght@400;500;600&family=Geist+Mono:wght@400;500;600&display=swap" rel="stylesheet">
8
+ <style>
9
+ *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
10
+ :root {
11
+ --color-paper: #f5f5f5;
12
+ --color-ink: #2d3142;
13
+ --color-muted: #4f5d75;
14
+ --color-accent: #bf4520;
15
+ --font-sans: 'Geist', system-ui, sans-serif;
16
+ --font-serif: 'Instrument Serif', serif;
17
+ --font-mono: 'Geist Mono', ui-monospace, monospace;
18
+ }
19
+
20
+ body {
21
+ font-family: var(--font-sans);
22
+ background: var(--color-paper);
23
+ color: var(--color-ink);
24
+ min-height: 100vh;
25
+ display: flex;
26
+ align-items: center;
27
+ justify-content: center;
28
+ padding: 3rem 2rem;
29
+ }
30
+
31
+ .frame { max-width: 1320px; width: 100%; }
32
+
33
+ .eyebrow {
34
+ font-family: var(--font-mono);
35
+ font-size: 0.66rem;
36
+ font-weight: 500;
37
+ letter-spacing: 0.18em;
38
+ text-transform: uppercase;
39
+ color: var(--color-muted);
40
+ margin-bottom: 0.5rem;
41
+ }
42
+
43
+ h1 {
44
+ font-family: var(--font-serif);
45
+ font-size: clamp(1.5rem, 2.4vw + 0.75rem, 2rem);
46
+ font-weight: 400;
47
+ letter-spacing: -0.02em;
48
+ line-height: 1.15;
49
+ color: var(--color-ink);
50
+ margin-bottom: 1.5rem;
51
+ }
52
+
53
+ svg { width: 100%; min-width: 1080px; display: block; }
54
+ </style>
55
+ </head>
56
+ <body>
57
+ <div class="frame">
58
+ <p class="eyebrow">Fishbone · Diagram Design</p>
59
+ <h1>Checkout p99 latency · Root-cause fishbone</h1>
60
+
61
+ <svg viewBox="-40 0 1480 600" xmlns="http://www.w3.org/2000/svg" role="img" aria-labelledby="fishbone-title fishbone-desc">
62
+ <title id="fishbone-title">Checkout p99 latency · Root-cause fishbone</title>
63
+ <desc id="fishbone-desc">Fishbone diagram tracing a checkout latency incident to five candidate cause categories, with a missing database index under Data confirmed as the root cause.</desc>
64
+ <defs>
65
+ <marker id="fishbone-arrow" markerWidth="8" markerHeight="6" refX="7" refY="3" orient="auto">
66
+ <polygon points="0 0, 8 3, 0 6" fill="#2d3142"/>
67
+ </marker>
68
+ </defs>
69
+
70
+ <rect x="-40" y="0" width="1480" height="600" fill="#f5f5f5"/>
71
+
72
+ <!-- Spine -->
73
+ <line x1="120" y1="320" x2="1200" y2="320" stroke="#2d3142" stroke-width="1.2" marker-end="url(#fishbone-arrow)"/>
74
+
75
+ <!-- Bones -->
76
+ <line x1="880" y1="320" x2="784" y2="152" stroke="#2d3142" stroke-width="1.2"/>
77
+ <line x1="720" y1="320" x2="624" y2="488" stroke="#bf4520" stroke-width="1.2"/>
78
+ <line x1="560" y1="320" x2="464" y2="152" stroke="#2d3142" stroke-width="1.2"/>
79
+ <line x1="400" y1="320" x2="304" y2="488" stroke="#2d3142" stroke-width="1.2"/>
80
+ <line x1="240" y1="320" x2="144" y2="152" stroke="#2d3142" stroke-width="1.2"/>
81
+
82
+ <!-- Sub-cause ticks + labels · Deploy -->
83
+ <line x1="848" y1="264" x2="816" y2="264" stroke="#4f5d75" stroke-width="1"/>
84
+ <text x="812" y="260" fill="#4f5d75" font-size="9" font-family="'Geist Mono', monospace" text-anchor="end">canary skipped</text>
85
+ <line x1="816" y1="208" x2="784" y2="208" stroke="#4f5d75" stroke-width="1"/>
86
+ <text x="780" y="204" fill="#4f5d75" font-size="9" font-family="'Geist Mono', monospace" text-anchor="end">config drift</text>
87
+
88
+ <!-- Sub-cause ticks + labels · Data (root cause) -->
89
+ <line x1="688" y1="376" x2="656" y2="376" stroke="#4f5d75" stroke-width="1"/>
90
+ <text x="652" y="388" fill="#4f5d75" font-size="9" font-family="'Geist Mono', monospace" text-anchor="end">index missing on orders.created_at</text>
91
+ <line x1="656" y1="432" x2="624" y2="432" stroke="#4f5d75" stroke-width="1"/>
92
+ <text x="620" y="444" fill="#4f5d75" font-size="9" font-family="'Geist Mono', monospace" text-anchor="end">table 3x forecast</text>
93
+
94
+ <!-- Sub-cause ticks + labels · Runtime -->
95
+ <line x1="528" y1="264" x2="496" y2="264" stroke="#4f5d75" stroke-width="1"/>
96
+ <text x="492" y="260" fill="#4f5d75" font-size="9" font-family="'Geist Mono', monospace" text-anchor="end">connection pool cap 20</text>
97
+ <line x1="496" y1="208" x2="464" y2="208" stroke="#4f5d75" stroke-width="1"/>
98
+ <text x="460" y="204" fill="#4f5d75" font-size="9" font-family="'Geist Mono', monospace" text-anchor="end">GC pauses</text>
99
+
100
+ <!-- Sub-cause ticks + labels · Observability -->
101
+ <line x1="368" y1="376" x2="336" y2="376" stroke="#4f5d75" stroke-width="1"/>
102
+ <text x="332" y="388" fill="#4f5d75" font-size="9" font-family="'Geist Mono', monospace" text-anchor="end">no p99 alert</text>
103
+ <line x1="336" y1="432" x2="304" y2="432" stroke="#4f5d75" stroke-width="1"/>
104
+ <text x="300" y="444" fill="#4f5d75" font-size="9" font-family="'Geist Mono', monospace" text-anchor="end">dashboard sampled at 5m</text>
105
+
106
+ <!-- Sub-cause tick + label · People -->
107
+ <line x1="192" y1="236" x2="160" y2="236" stroke="#4f5d75" stroke-width="1"/>
108
+ <text x="156" y="232" fill="#4f5d75" font-size="9" font-family="'Geist Mono', monospace" text-anchor="end">on-call handover mid-incident</text>
109
+
110
+ <!-- Category tag boxes -->
111
+ <rect x="724" y="116" width="120" height="28" rx="4" fill="#f5f5f5" stroke="#2d3142" stroke-width="0.8"/>
112
+ <text x="784" y="134" fill="#2d3142" font-size="12" font-weight="600" font-family="'Geist', sans-serif" text-anchor="middle">DEPLOY</text>
113
+
114
+ <rect x="564" y="496" width="120" height="28" rx="4" fill="rgba(191,69,32,0.08)" stroke="#bf4520" stroke-width="0.8"/>
115
+ <text x="624" y="514" fill="#bf4520" font-size="12" font-weight="600" font-family="'Geist', sans-serif" text-anchor="middle">DATA</text>
116
+
117
+ <rect x="404" y="116" width="120" height="28" rx="4" fill="#f5f5f5" stroke="#2d3142" stroke-width="0.8"/>
118
+ <text x="464" y="134" fill="#2d3142" font-size="12" font-weight="600" font-family="'Geist', sans-serif" text-anchor="middle">RUNTIME</text>
119
+
120
+ <rect x="244" y="496" width="120" height="28" rx="4" fill="#f5f5f5" stroke="#2d3142" stroke-width="0.8"/>
121
+ <text x="304" y="514" fill="#2d3142" font-size="12" font-weight="600" font-family="'Geist', sans-serif" text-anchor="middle">OBSERVABILITY</text>
122
+
123
+ <rect x="84" y="116" width="120" height="28" rx="4" fill="#f5f5f5" stroke="#2d3142" stroke-width="0.8"/>
124
+ <text x="144" y="134" fill="#2d3142" font-size="12" font-weight="600" font-family="'Geist', sans-serif" text-anchor="middle">PEOPLE</text>
125
+
126
+ <!-- Effect box -->
127
+ <rect x="1200" y="272" width="200" height="96" rx="6" fill="#f5f5f5"/>
128
+ <rect x="1200" y="272" width="200" height="96" rx="6" fill="rgba(191,69,32,0.08)" stroke="#bf4520" stroke-width="1"/>
129
+ <rect x="1208" y="280" width="48" height="12" rx="2" fill="transparent" stroke="rgba(191,69,32,0.40)" stroke-width="0.8"/>
130
+ <text x="1232" y="289" fill="#bf4520" font-size="7" font-family="'Geist Mono', monospace" text-anchor="middle" letter-spacing="0.08em">EFFECT</text>
131
+ <text x="1300" y="324" fill="#2d3142" font-size="12" font-weight="600" font-family="'Geist', sans-serif" text-anchor="middle">Checkout p99 latency</text>
132
+ <text x="1300" y="340" fill="#2d3142" font-size="12" font-weight="600" font-family="'Geist', sans-serif" text-anchor="middle">4x for 90 minutes</text>
133
+
134
+ <!-- Legend -->
135
+ <line x1="40" y1="560" x2="1400" y2="560" stroke="rgba(45,49,66,0.10)" stroke-width="0.8"/>
136
+ <text x="40" y="576" fill="#4f5d75" font-size="8" font-family="'Geist Mono', monospace" letter-spacing="0.18em">LEGEND</text>
137
+
138
+ <line x1="40" y1="588" x2="56" y2="588" stroke="#2d3142" stroke-width="1.2"/>
139
+ <text x="64" y="592" fill="#4f5d75" font-size="8.5" font-family="'Geist', sans-serif">Category (bone)</text>
140
+
141
+ <line x1="260" y1="588" x2="276" y2="588" stroke="#bf4520" stroke-width="1.2"/>
142
+ <text x="284" y="592" fill="#4f5d75" font-size="8.5" font-family="'Geist', sans-serif">Confirmed root cause</text>
143
+
144
+ <line x1="480" y1="588" x2="496" y2="588" stroke="#4f5d75" stroke-width="1"/>
145
+ <text x="504" y="592" fill="#4f5d75" font-size="8.5" font-family="'Geist', sans-serif">Sub-cause</text>
146
+
147
+ <rect x="700" y="584" width="16" height="8" fill="rgba(191,69,32,0.08)" stroke="#bf4520" stroke-width="1"/>
148
+ <text x="724" y="592" fill="#4f5d75" font-size="8.5" font-family="'Geist', sans-serif">Observed effect</text>
149
+ </svg>
150
+ </div>
151
+ </body>
152
+ </html>