oh-my-design-cli 1.8.6 → 1.9.0

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 (275) hide show
  1. package/.claude/hooks/lib/preferences-parser.cjs +1 -0
  2. package/.claude/hooks/lib/preferences-writer.cjs +1 -0
  3. package/.claude/hooks/post-edit-watch.cjs +1 -0
  4. package/.claude/hooks/session-end-foldin.cjs +1 -0
  5. package/.claude/hooks/session-state-loader.cjs +1 -0
  6. package/.claude/hooks/skill-activation.cjs +1 -0
  7. package/.claude/settings.json +10 -1
  8. package/.github/assets/logo-bg.png +0 -0
  9. package/AGENTS.md +20 -1
  10. package/CHANGELOG.md +482 -0
  11. package/MIGRATION.md +103 -0
  12. package/README.ja.md +56 -19
  13. package/README.ko.md +47 -30
  14. package/README.md +48 -30
  15. package/README.zh-TW.md +59 -22
  16. package/agents/AGENT.md +8 -7
  17. package/agents/omd-codex-image.md +1 -1
  18. package/agents/omd-critic.md +6 -7
  19. package/agents/omd-designer-review.md +1 -1
  20. package/agents/omd-final-qa.md +1 -1
  21. package/agents/omd-humanizer.md +38 -0
  22. package/agents/omd-kr-writer.md +3 -4
  23. package/agents/omd-locale-adapter.md +12 -16
  24. package/agents/omd-master.md +24 -19
  25. package/agents/omd-microcopy.md +1 -1
  26. package/agents/omd-orchestrator.md +7 -8
  27. package/agents/omd-slop-auditor.md +31 -0
  28. package/agents/omd-ux-researcher.md +1 -1
  29. package/data/reference-fingerprints.json +2761 -85
  30. package/dist/bin/oh-my-design.js +16 -8
  31. package/dist/bin/oh-my-design.js.map +1 -1
  32. package/dist/chunk-UJIHCEYF.js +99 -0
  33. package/dist/chunk-UJIHCEYF.js.map +1 -0
  34. package/dist/doctor-LDWSFM3I.js +763 -0
  35. package/dist/doctor-LDWSFM3I.js.map +1 -0
  36. package/dist/install-skills-ZZFNJ2II.js +1120 -0
  37. package/dist/install-skills-ZZFNJ2II.js.map +1 -0
  38. package/docs/CLI_QUICKSTART.md +157 -0
  39. package/package.json +25 -4
  40. package/scripts/postinstall.cjs +5 -4
  41. package/skills/claude-design/SKILL.md +38 -14
  42. package/skills/claude-design/references/claude-design-flow.md +11 -11
  43. package/skills/claude-design/references/codebase-analysis.md +5 -4
  44. package/skills/omd-final-qa/SKILL.md +1 -1
  45. package/skills/omd-harness/SKILL.md +51 -50
  46. package/skills/omd-humanize/SKILL.md +116 -0
  47. package/skills/omd-humanize/agents/openai.yaml +4 -0
  48. package/skills/omd-humanize/references/locale-playbooks.md +102 -0
  49. package/skills/omd-humanize/references/sources.md +11 -0
  50. package/skills/omd-init/SKILL.md +18 -12
  51. package/skills/omd-locale-adapter/SKILL.md +58 -91
  52. package/skills/omd-orchestrator/SKILL.md +11 -5
  53. package/skills/omd-reference-capture/SKILL.md +80 -26
  54. package/skills/omd-reference-capture/scripts/PLAYWRIGHT-LICENSE.txt +202 -0
  55. package/skills/omd-reference-capture/scripts/PLAYWRIGHT-NOTICE.txt +5 -0
  56. package/skills/omd-reference-capture/scripts/THIRD_PARTY_NOTICES.md +3 -0
  57. package/skills/omd-reference-capture/scripts/capture-reference-evidence.mjs +159906 -0
  58. package/skills/omd-slop-audit/SKILL.md +110 -0
  59. package/skills/omd-slop-audit/agents/openai.yaml +4 -0
  60. package/skills/omd-slop-audit/references/pattern-catalog.md +96 -0
  61. package/skills/omd-slop-audit/references/sources.md +24 -0
  62. package/web/references/104/DESIGN.md +354 -0
  63. package/web/references/11st/DESIGN.md +197 -316
  64. package/web/references/29cm/DESIGN.md +297 -393
  65. package/web/references/42dot/DESIGN.md +390 -0
  66. package/web/references/8percent/DESIGN.md +438 -0
  67. package/web/references/ably/DESIGN.md +267 -572
  68. package/web/references/acer/DESIGN.md +329 -0
  69. package/web/references/airbnb/DESIGN.md +219 -557
  70. package/web/references/airbridge/DESIGN.md +451 -0
  71. package/web/references/alipay/DESIGN.md +179 -420
  72. package/web/references/apple/DESIGN.md +224 -498
  73. package/web/references/asleep/DESIGN.md +402 -0
  74. package/web/references/au/DESIGN.md +334 -0
  75. package/web/references/autopedia/DESIGN.md +382 -0
  76. package/web/references/aws-cloudscape/DESIGN.md +241 -0
  77. package/web/references/baemin/DESIGN.md +332 -491
  78. package/web/references/banksalad/DESIGN.md +269 -180
  79. package/web/references/barogo/DESIGN.md +416 -0
  80. package/web/references/beusable/DESIGN.md +464 -0
  81. package/web/references/bigin/DESIGN.md +454 -0
  82. package/web/references/bilibili/DESIGN.md +206 -374
  83. package/web/references/bmw/DESIGN.md +162 -276
  84. package/web/references/brandi/DESIGN.md +184 -325
  85. package/web/references/buzzvil/DESIGN.md +457 -0
  86. package/web/references/cafe24/DESIGN.md +472 -0
  87. package/web/references/catchtable/DESIGN.md +219 -264
  88. package/web/references/cgv/DESIGN.md +317 -0
  89. package/web/references/channeltalk/DESIGN.md +210 -336
  90. package/web/references/china-airlines/DESIGN.md +291 -0
  91. package/web/references/cjonstyle/DESIGN.md +453 -0
  92. package/web/references/class101/DESIGN.md +168 -387
  93. package/web/references/classum/DESIGN.md +228 -203
  94. package/web/references/claude/DESIGN.md +242 -479
  95. package/web/references/clay/DESIGN.md +179 -377
  96. package/web/references/clickhouse/DESIGN.md +254 -343
  97. package/web/references/codeit/DESIGN.md +470 -0
  98. package/web/references/cohere/DESIGN.md +214 -324
  99. package/web/references/coinone/DESIGN.md +199 -179
  100. package/web/references/corca/DESIGN.md +414 -0
  101. package/web/references/coupang/DESIGN.md +205 -475
  102. package/web/references/cursor/DESIGN.md +240 -381
  103. package/web/references/dabang/DESIGN.md +248 -213
  104. package/web/references/dable/DESIGN.md +431 -0
  105. package/web/references/datarize/DESIGN.md +338 -0
  106. package/web/references/dealicious/DESIGN.md +402 -0
  107. package/web/references/drdiary/DESIGN.md +404 -0
  108. package/web/references/elastic/DESIGN.md +238 -0
  109. package/web/references/elevenlabs/DESIGN.md +183 -321
  110. package/web/references/elice/DESIGN.md +445 -0
  111. package/web/references/eslite/DESIGN.md +257 -0
  112. package/web/references/evaair/DESIGN.md +338 -0
  113. package/web/references/expo/DESIGN.md +238 -331
  114. package/web/references/familymart-tw/DESIGN.md +254 -0
  115. package/web/references/ferrari/DESIGN.md +160 -377
  116. package/web/references/figma/DESIGN.md +197 -451
  117. package/web/references/fitpet/DESIGN.md +445 -0
  118. package/web/references/flex/DESIGN.md +170 -253
  119. package/web/references/framer/DESIGN.md +197 -340
  120. package/web/references/freee/DESIGN.md +211 -533
  121. package/web/references/friendliai/DESIGN.md +431 -0
  122. package/web/references/frip/DESIGN.md +440 -0
  123. package/web/references/furiosaai/DESIGN.md +450 -0
  124. package/web/references/gangnamunni/DESIGN.md +154 -591
  125. package/web/references/gaudiolab/DESIGN.md +414 -0
  126. package/web/references/google/DESIGN.md +290 -398
  127. package/web/references/goorm/DESIGN.md +470 -0
  128. package/web/references/greencar/DESIGN.md +420 -0
  129. package/web/references/hackle/DESIGN.md +472 -0
  130. package/web/references/hashicorp/DESIGN.md +273 -318
  131. package/web/references/heydealer/DESIGN.md +429 -0
  132. package/web/references/humanscape/DESIGN.md +433 -0
  133. package/web/references/hwahae/DESIGN.md +453 -0
  134. package/web/references/hyundai/DESIGN.md +158 -368
  135. package/web/references/hyundaicard/DESIGN.md +171 -121
  136. package/web/references/ibm/DESIGN.md +227 -378
  137. package/web/references/idus/DESIGN.md +450 -0
  138. package/web/references/igaworks/DESIGN.md +437 -0
  139. package/web/references/inflearn/DESIGN.md +221 -366
  140. package/web/references/intuit/DESIGN.md +244 -0
  141. package/web/references/jandi/DESIGN.md +191 -291
  142. package/web/references/jobplanet/DESIGN.md +415 -0
  143. package/web/references/kakao/DESIGN.md +287 -475
  144. package/web/references/kakaobank/DESIGN.md +220 -521
  145. package/web/references/kakaogames/DESIGN.md +220 -0
  146. package/web/references/kakaopay/DESIGN.md +207 -526
  147. package/web/references/karrot/DESIGN.md +227 -251
  148. package/web/references/kb-kookmin/DESIGN.md +308 -0
  149. package/web/references/kbank/DESIGN.md +220 -175
  150. package/web/references/kcd/DESIGN.md +432 -0
  151. package/web/references/kmong/DESIGN.md +281 -356
  152. package/web/references/krds/DESIGN.md +245 -19
  153. package/web/references/kream/DESIGN.md +224 -359
  154. package/web/references/kurly/DESIGN.md +211 -533
  155. package/web/references/kyobobook/DESIGN.md +445 -0
  156. package/web/references/lablup/DESIGN.md +474 -0
  157. package/web/references/lamborghini/DESIGN.md +198 -360
  158. package/web/references/lemonbase/DESIGN.md +452 -0
  159. package/web/references/lguplus/DESIGN.md +259 -0
  160. package/web/references/likelion/DESIGN.md +283 -0
  161. package/web/references/line/DESIGN.md +396 -355
  162. package/web/references/linear.app/DESIGN.md +209 -562
  163. package/web/references/lotteon/DESIGN.md +386 -0
  164. package/web/references/lovable/DESIGN.md +255 -349
  165. package/web/references/makinarocks/DESIGN.md +242 -0
  166. package/web/references/maum-ai/DESIGN.md +423 -0
  167. package/web/references/medibloc/DESIGN.md +425 -0
  168. package/web/references/megabox/DESIGN.md +232 -0
  169. package/web/references/mercari/DESIGN.md +217 -434
  170. package/web/references/microsoft/DESIGN.md +234 -388
  171. package/web/references/mildang/DESIGN.md +411 -0
  172. package/web/references/millie/DESIGN.md +183 -504
  173. package/web/references/minimax/DESIGN.md +264 -322
  174. package/web/references/miricanvas/DESIGN.md +182 -355
  175. package/web/references/miro/DESIGN.md +234 -232
  176. package/web/references/mistral.ai/DESIGN.md +231 -314
  177. package/web/references/mixi/DESIGN.md +234 -0
  178. package/web/references/moin/DESIGN.md +445 -0
  179. package/web/references/mongodb/DESIGN.md +219 -316
  180. package/web/references/moreh/DESIGN.md +437 -0
  181. package/web/references/musinsa/DESIGN.md +184 -510
  182. package/web/references/mynavi/DESIGN.md +242 -0
  183. package/web/references/myrealtrip/DESIGN.md +169 -406
  184. package/web/references/naver/DESIGN.md +328 -499
  185. package/web/references/naverwebtoon/DESIGN.md +172 -395
  186. package/web/references/neosapience/DESIGN.md +441 -0
  187. package/web/references/nhn/DESIGN.md +169 -346
  188. package/web/references/nhncloud/DESIGN.md +185 -123
  189. package/web/references/nota/DESIGN.md +451 -0
  190. package/web/references/notion/DESIGN.md +271 -475
  191. package/web/references/nrise/DESIGN.md +417 -0
  192. package/web/references/ohouse/DESIGN.md +210 -549
  193. package/web/references/oliveyoung/DESIGN.md +217 -326
  194. package/web/references/ollama/DESIGN.md +241 -308
  195. package/web/references/onestore/DESIGN.md +248 -0
  196. package/web/references/palantir/DESIGN.md +256 -0
  197. package/web/references/panasonic/DESIGN.md +276 -0
  198. package/web/references/patternfly/DESIGN.md +259 -0
  199. package/web/references/payhere/DESIGN.md +438 -0
  200. package/web/references/pega/DESIGN.md +262 -0
  201. package/web/references/peoplefund/DESIGN.md +431 -0
  202. package/web/references/petfriends/DESIGN.md +428 -0
  203. package/web/references/pinkfong/DESIGN.md +199 -367
  204. package/web/references/pinterest/DESIGN.md +258 -308
  205. package/web/references/portone/DESIGN.md +446 -0
  206. package/web/references/poya/DESIGN.md +286 -0
  207. package/web/references/pozalabs/DESIGN.md +438 -0
  208. package/web/references/protopie/DESIGN.md +419 -0
  209. package/web/references/qraft/DESIGN.md +448 -0
  210. package/web/references/queenit/DESIGN.md +432 -0
  211. package/web/references/quotabook/DESIGN.md +449 -0
  212. package/web/references/rebellions/DESIGN.md +449 -0
  213. package/web/references/recruit/DESIGN.md +247 -0
  214. package/web/references/remember/DESIGN.md +202 -396
  215. package/web/references/resend/DESIGN.md +274 -348
  216. package/web/references/returnzero/DESIGN.md +460 -0
  217. package/web/references/sakura-internet/DESIGN.md +269 -0
  218. package/web/references/samsung/DESIGN.md +157 -359
  219. package/web/references/sandoll/DESIGN.md +445 -0
  220. package/web/references/sanity/DESIGN.md +241 -375
  221. package/web/references/saramin/DESIGN.md +465 -0
  222. package/web/references/scatterlab/DESIGN.md +412 -0
  223. package/web/references/selectstar/DESIGN.md +439 -0
  224. package/web/references/servicenow/DESIGN.md +289 -0
  225. package/web/references/shiftee/DESIGN.md +468 -0
  226. package/web/references/shinhanbank/DESIGN.md +161 -341
  227. package/web/references/shinhancard/DESIGN.md +208 -319
  228. package/web/references/sionic/DESIGN.md +454 -0
  229. package/web/references/sktelecom/DESIGN.md +310 -0
  230. package/web/references/socar/DESIGN.md +125 -32
  231. package/web/references/softbank/DESIGN.md +231 -0
  232. package/web/references/solapi/DESIGN.md +483 -0
  233. package/web/references/sony/DESIGN.md +234 -0
  234. package/web/references/soop/DESIGN.md +261 -0
  235. package/web/references/spacex/DESIGN.md +184 -323
  236. package/web/references/spotify/DESIGN.md +253 -394
  237. package/web/references/squeezebits/DESIGN.md +441 -0
  238. package/web/references/stayfolio/DESIGN.md +422 -0
  239. package/web/references/stripe/DESIGN.md +212 -491
  240. package/web/references/supabase/DESIGN.md +244 -316
  241. package/web/references/supertone/DESIGN.md +413 -0
  242. package/web/references/tabling/DESIGN.md +415 -0
  243. package/web/references/taishinbank/DESIGN.md +243 -0
  244. package/web/references/teamlab/DESIGN.md +240 -0
  245. package/web/references/teamsparta/DESIGN.md +472 -0
  246. package/web/references/tellingme/DESIGN.md +392 -0
  247. package/web/references/tesla/DESIGN.md +244 -427
  248. package/web/references/thsr/DESIGN.md +284 -0
  249. package/web/references/thumbtack/DESIGN.md +302 -0
  250. package/web/references/together.ai/DESIGN.md +257 -304
  251. package/web/references/toss/DESIGN.md +251 -593
  252. package/web/references/toss-securities/DESIGN.md +255 -178
  253. package/web/references/tossbank/DESIGN.md +195 -491
  254. package/web/references/toyota/DESIGN.md +238 -0
  255. package/web/references/tving/DESIGN.md +197 -245
  256. package/web/references/typed/DESIGN.md +413 -0
  257. package/web/references/uber/DESIGN.md +256 -333
  258. package/web/references/udn/DESIGN.md +250 -0
  259. package/web/references/upbit/DESIGN.md +145 -256
  260. package/web/references/upstage/DESIGN.md +211 -204
  261. package/web/references/uswds/DESIGN.md +287 -0
  262. package/web/references/vercel/DESIGN.md +236 -440
  263. package/web/references/vuno/DESIGN.md +413 -0
  264. package/web/references/wanted/DESIGN.md +215 -487
  265. package/web/references/weverse/DESIGN.md +437 -0
  266. package/web/references/wise/DESIGN.md +223 -231
  267. package/web/references/wisetracker/DESIGN.md +462 -0
  268. package/web/references/wooribank/DESIGN.md +245 -0
  269. package/web/references/yanolja/DESIGN.md +250 -419
  270. package/web/references/yeogiotte/DESIGN.md +235 -418
  271. package/web/references/zapier/DESIGN.md +256 -377
  272. package/web/references/zendesk/DESIGN.md +288 -0
  273. package/web/references/zigzag/DESIGN.md +200 -621
  274. package/dist/install-skills-7UUDOLG2.js +0 -734
  275. package/dist/install-skills-7UUDOLG2.js.map +0 -1
@@ -0,0 +1,438 @@
1
+ ---
2
+ id: pozalabs
3
+ name: POZAlabs
4
+ display_name_kr: 포자랩스
5
+ country: KR
6
+ category: ai
7
+ homepage: "https://www.pozalabs.com/"
8
+ primary_color: "#aba1fa"
9
+ logo:
10
+ type: favicon
11
+ slug: "https://www.google.com/s2/favicons?domain=pozalabs.com&sz=128"
12
+ verified: "2026-07-02"
13
+ added: "2026-07-02"
14
+ omd: "0.1"
15
+ tokens:
16
+ source: live-extract
17
+ extracted: "2026-07-02"
18
+ note: "Two-surface system. Corporate pozalabs.com is monochrome (black #000000 on white #ffffff, oversized Garet display). Product musia.ai carries the purple identity: signature periwinkle #aba1fa accent + saturated violet #6242e1, deep purple-ink surfaces (#030112 / #150e2d / #201d30 / #090719), grey inactive chips #cecdd5, big pill geometry."
19
+ colors:
20
+ primary: "#aba1fa"
21
+ violet: "#6242e1"
22
+ ink: "#030112"
23
+ ink-deep: "#150e2d"
24
+ surface-dark: "#201d30"
25
+ surface-darkest: "#090719"
26
+ black: "#000000"
27
+ canvas: "#ffffff"
28
+ chip-muted: "#cecdd5"
29
+ surface-light: "#eeedf2"
30
+ muted: "#9f9daa"
31
+ hairline: "#eeeeee"
32
+ typography:
33
+ family: { display: "Garet", ui: "Inter", kr: "Pretendard", body: "Source Sans Pro", serif: "Sanchez", mono: "Hack" }
34
+ display-hero: { size: 130, weight: 400, lineHeight: 1.22, use: "Corporate hero headline, Garet — 'Ignite your creativity'" }
35
+ heading-lg: { size: 24, weight: 700, use: "Product feature + CTA labels, Inter bold" }
36
+ nav-ui: { size: 18, weight: 400, tracking: 0.99, use: "MUSIA product nav links, Inter (uppercase, wide tracking)" }
37
+ nav-corp: { size: 16, weight: 400, use: "Corporate nav items, Garet" }
38
+ body: { size: 16, weight: 400, lineHeight: 1.5, use: "Body / paragraph text, Source Sans Pro + Noto Sans KR" }
39
+ caption: { size: 12, weight: 700, tracking: 0.06, use: "Language selector / small uppercase labels, Inter" }
40
+ spacing: { xs: 4, sm: 8, md: 12, base: 16, lg: 20, chip: 28, cta: 40, section: 64 }
41
+ rounded: { sm: 8, md: 20, lg: 28, xl: 40, full: 9999 }
42
+ shadow:
43
+ none: "none"
44
+ components:
45
+ button-primary: { type: button, bg: "#000000", fg: "#ffffff", radius: "20px", height: "72px", font: "24px / 700 Inter", use: "Primary CTA — 'TRY FOR FREE' on light hero" }
46
+ button-invert: { type: button, bg: "#ffffff", fg: "#150e2d", radius: "20px", padding: "16px 40px", height: "68px", font: "24px / 700 Inter", use: "Inverted CTA on dark purple section" }
47
+ chip-selected: { type: badge, bg: "#030112", fg: "#ffffff", radius: "28px", padding: "12px 28px", font: "24px / 700 Inter", use: "Selected segmented feature chip (Songwriting / Instrument / Download)" }
48
+ chip-unselected: { type: badge, bg: "#cecdd5", fg: "#030112", radius: "28px", padding: "12px 28px", font: "24px / 700 Inter", use: "Unselected segmented feature chip" }
49
+ lang-button: { type: button, fg: "#aba1fa", border: "3px solid #aba1fa", radius: "8px", padding: "11px 16px", height: "40px", font: "12px / 700 Inter", use: "Language selector outline button (ENGLISH)" }
50
+ nav-link: { type: tab, fg: "#ffffff", font: "18px / 400 Inter", active: "text #ffffff (inactive links at 50% white)", use: "MUSIA product top nav (PRODUCTS / PRICING / CONTENTS / SUPPORT)" }
51
+ input-search: { type: input, fg: "#333333", font: "14px Source Sans Pro", use: "Minimal inline text/search field — transparent, no visible chrome until focus" }
52
+ card-canvas: { type: card, bg: "#ffffff", radius: "8px", use: "White content panel / product card" }
53
+ card-dark: { type: card, bg: "#201d30", fg: "#ffffff", radius: "20px", use: "Dark purple feature card / immersive section block" }
54
+ corp-nav-link: { type: listItem, fg: "#000000", font: "16px / 400 Garet", use: "Corporate site nav (About / Service / Research / Contact / Recruit)" }
55
+ components_harvested: true
56
+ ---
57
+
58
+ # Design System Inspiration of POZAlabs
59
+
60
+ ## 1. Visual Theme & Atmosphere
61
+
62
+ POZAlabs (포자랩스) is Korea's leading generative-music AI company, and its design language lives in two deliberately different registers. The corporate site (`pozalabs.com`) is austere and gallery-like: a pure white canvas (`#ffffff`) carrying a single oversized Garet display headline in pure black (`#000000`) — "Ignite your creativity" set at roughly 129.6px, weight 400, with a 158px line-height that lets the words breathe like a museum wall label. Beneath it, a code-syntax tagline — `with pozalabs as technology: expand(your_creativity)` — is typeset in the Hack monospace face, signalling that this is an engineering house that treats creativity as something you can call like a function. The result reads as confident, artful, and unhurried: no gradients, no chrome, no shadow — just type, black, and white.
63
+
64
+ The product surface (`musia.ai`, the MUSIA AI-composition app) is where the brand's chromatic identity appears. Here the palette turns purple: a signature periwinkle (`#aba1fa`) is the pervasive accent — it colors links, the language selector, and every product wordmark (MUSIA ONE, MUSIA PLUGIN) — while a saturated violet (`#6242e1`) anchors accent blocks and gradients. The UI is built on deep purple-inks: near-black `#030112` for selected controls, a dark purple-ink `#150e2d` for text on inverted CTAs, and immersive dark sections in `#201d30` and `#090719`. Interactive chrome is unmistakably pill-shaped — segmented feature chips at 28px radius, primary CTAs at 20px — rendered in Inter/Pretendard at a bold 24px/700. The font stack shifts from the editorial Garet + Sanchez + Hack trio on the corporate site to a functional Inter + Pretendard + Source Sans Pro system in the app.
65
+
66
+ What unifies the two surfaces is restraint with depth. Both are essentially shadow-free — live inspection returned `box-shadow: none` across heroes, nav, and cards on both domains. Separation is achieved through flat contrast (black type on white, white chips on dark purple) and generous whitespace rather than elevation. The overall impression is of a company that is technically serious but creatively warm: the monochrome corporate face says "research lab," the periwinkle product face says "for creators," and the pill geometry keeps a professional AI tool from feeling intimidating.
67
+
68
+ **Key Characteristics:**
69
+ - Two-register system: monochrome black-on-white corporate site, periwinkle-purple MUSIA product
70
+ - Oversized Garet display headline (~130px, weight 400) as the corporate hero anchor
71
+ - Code-syntax tagline in Hack monospace — `expand(your_creativity)` — an engineering-house signature
72
+ - Signature periwinkle accent (`#aba1fa`) reserved for links, wordmarks, and the language selector
73
+ - Saturated violet (`#6242e1`) for accent blocks; deep purple-inks (`#030112`, `#150e2d`, `#201d30`, `#090719`) for surfaces
74
+ - Pill-everything product geometry — 28px feature chips, 20px CTAs, 8px small controls
75
+ - Bold Inter/Pretendard at 24px/700 for product feature labels; quiet Source Sans Pro body
76
+ - Flat, shadow-free depth on both surfaces — contrast and whitespace do the separating
77
+
78
+ ## 2. Color Palette & Roles
79
+
80
+ ### Primary & Brand
81
+ - **Periwinkle** (`#aba1fa`): The signature brand accent. The most pervasive color on the MUSIA product surface — links, product wordmarks, the language-selector outline, and active nav text. This is POZAlabs' "brand purple."
82
+ - **Saturated Violet** (`#6242e1`): Deeper, more saturated companion violet used for accent blocks, highlight fills, and gradient anchors.
83
+
84
+ ### Ink & Dark Surfaces
85
+ - **Ink** (`#030112`): Near-black purple-tinted ink. Background of selected segmented chips and the darkest control fills; also primary body ink on the product.
86
+ - **Deep Purple-Ink** (`#150e2d`): A dark purple-black used for text on inverted (white) CTAs sitting inside dark sections.
87
+ - **Dark Surface** (`#201d30`): The workhorse dark section / feature-card background — a muted purple-charcoal.
88
+ - **Darkest** (`#090719`): The deepest immersive section background, near-black with a violet undertone.
89
+ - **Pure Black** (`#000000`): The corporate site's headline and body ink, and the fill of the light-hero primary CTA.
90
+
91
+ ### Neutral & Surface
92
+ - **White** (`#ffffff`): Page background on both surfaces, text on dark/purple, and inverted-CTA fill.
93
+ - **Muted Chip Grey** (`#cecdd5`): Fill for unselected segmented chips — a cool light grey that recedes behind the ink-filled selected chip.
94
+ - **Light Surface** (`#eeedf2`): A soft off-white surface for alternating light panels and card grounds.
95
+ - **Hairline** (`#eeeeee`): Thin borders and dividers on light surfaces.
96
+ - **Muted Grey Text** (`#9f9daa`): Tertiary text, captions, and metadata on light backgrounds.
97
+
98
+ ## 3. Typography Rules
99
+
100
+ ### Font Family
101
+ - **Display (corporate)**: `Garet` — a geometric sans used for the oversized corporate hero headline and nav. Weight 400 even at display sizes, giving the black type an even, poster-like presence.
102
+ - **Editorial companions (corporate)**: `Sanchez` (a slab serif) and `Hack` (monospace, used for the `expand(your_creativity)` code-syntax tagline).
103
+ - **UI (product)**: `Inter` (with `Pretendard` as the Korean companion) — carries all MUSIA nav, buttons, and feature chips.
104
+ - **Body (product)**: `Source Sans Pro` with `Noto Sans KR` fallback — the document default for paragraph and reading text.
105
+
106
+ ### Hierarchy
107
+
108
+ | Role | Font | Size | Weight | Line Height | Tracking | Notes |
109
+ |------|------|------|--------|-------------|----------|-------|
110
+ | Display Hero | Garet | ~130px (129.6px) | 400 | 158px (1.22) | normal | Corporate hero "Ignite your creativity" |
111
+ | Feature / CTA Label | Inter | 24px | 700 | normal | normal | Product chips + primary CTAs |
112
+ | Product Nav | Inter | 18px | 400 | 24px | 0.99px | MUSIA top nav, uppercase, wide tracking |
113
+ | Corporate Nav | Garet | 16px | 400 | 28px | normal | About / Service / Research / Contact |
114
+ | Body | Source Sans Pro | 16px | 400 | 24px (1.5) | normal | Paragraph / reading text |
115
+ | Caption / Language | Inter | 12px | 700 | normal | 0.06px | Language selector, small uppercase labels |
116
+
117
+ ### Principles
118
+ - **Two type systems, two jobs**: Garet (plus Sanchez/Hack) is the editorial, brand-poster voice of the corporate site; Inter/Pretendard is the functional product voice. They never swap surfaces.
119
+ - **Display lives at weight 400**: The corporate hero does not shout with heavy weight — it uses sheer scale (~130px) and generous line-height instead. Boldness (700) is reserved for the product's 24px feature labels.
120
+ - **Uppercase + wide tracking for product nav**: MUSIA nav items are uppercase Inter at 18px with a deliberate 0.99px tracking, giving the app a crisp, technical header.
121
+ - **Monospace as a brand signal**: The Hack code-syntax tagline is a typographic statement of identity — music generation framed as a callable function.
122
+
123
+ ## 4. Component Stylings
124
+
125
+ ### Buttons
126
+
127
+ **Primary CTA (Light Hero)**
128
+ - Background: `#000000`
129
+ - Text: `#ffffff`
130
+ - Radius: 20px
131
+ - Height: 72px
132
+ - Font: 24px / 700 / Inter
133
+ - Use: Primary call-to-action on the light hero — "TRY FOR FREE"
134
+
135
+ **Inverted CTA (Dark Section)**
136
+ - Background: `#ffffff`
137
+ - Text: `#150e2d`
138
+ - Radius: 20px
139
+ - Padding: 16px 40px
140
+ - Height: 68px
141
+ - Font: 24px / 700 / Inter
142
+ - Use: "TRY FOR FREE" on a dark purple section — inverts to white fill
143
+
144
+ **Language Selector (Outline)**
145
+ - Text: `#aba1fa`
146
+ - Border: 3px solid `#aba1fa`
147
+ - Radius: 8px
148
+ - Padding: 11px 16px
149
+ - Height: 40px
150
+ - Font: 12px / 700 / Inter
151
+ - Use: Language toggle ("ENGLISH") — periwinkle outline button
152
+
153
+ ### Inputs
154
+
155
+ **Inline Text / Search**
156
+ - Text: `#333333`
157
+ - Font: 14px Source Sans Pro
158
+ - Use: Minimal inline text/search field — transparent background, no visible chrome until focus (the marketing surface keeps form fields deliberately bare)
159
+
160
+ ### Cards & Containers
161
+
162
+ **White Panel**
163
+ - Background: `#ffffff`
164
+ - Radius: 8px
165
+ - Use: White content panel / product card on light sections (shadow-free)
166
+
167
+ **Dark Feature Card**
168
+ - Background: `#201d30`
169
+ - Text: `#ffffff`
170
+ - Radius: 20px
171
+ - Use: Immersive dark purple feature card / section block
172
+
173
+ ### Badges
174
+
175
+ **Selected Feature Chip**
176
+ - Background: `#030112`
177
+ - Text: `#ffffff`
178
+ - Radius: 28px
179
+ - Padding: 12px 28px
180
+ - Font: 24px / 700 / Inter
181
+ - Use: Selected segmented chip ("Songwriting", "AI Recommended Music", "Simple UI/UX")
182
+
183
+ **Unselected Feature Chip**
184
+ - Background: `#cecdd5`
185
+ - Text: `#030112`
186
+ - Radius: 28px
187
+ - Padding: 12px 28px
188
+ - Font: 24px / 700 / Inter
189
+ - Use: Unselected segmented chip in the same feature row
190
+
191
+ ### Navigation
192
+
193
+ **Product Nav (MUSIA)**
194
+ - Background: transparent (over dark hero)
195
+ - Text: `#ffffff`
196
+ - Font: 18px / 400 / Inter
197
+ - Active: `#ffffff` text; inactive links at 50% white opacity
198
+ - Use: MUSIA top nav — "PRODUCTS", "PRICING", "CONTENTS", "SUPPORT"
199
+
200
+ **Corporate Nav**
201
+ - Text: `#000000`
202
+ - Font: 16px / 400 / Garet
203
+ - Use: Corporate site nav — "About", "Service", "Research", "Contact", "Recruit"
204
+
205
+ ---
206
+
207
+ **Verified:** 2026-07-02 (omd:add-reference CREATE — Tier 1 live inspect, 2 surfaces)
208
+ **Tier 1 sources:** https://www.pozalabs.com/ (corporate, live computed style); https://musia.ai/ (MUSIA product, live computed style); https://blog.pozalabs.com/ (official brand blog)
209
+ **Tier 2 sources:** getdesign.md/pozalabs — SPA shell only, no brand tokens; styles.refero.design/?q=pozalabs — no genuine POZAlabs/MUSIA entry (search returns unrelated brands)
210
+ **Conflicts unresolved:** none
211
+
212
+ ## 5. Layout Principles
213
+
214
+ ### Spacing System
215
+ - Base unit: 4px
216
+ - Scale: 4px, 8px, 12px, 16px, 20px, 28px, 40px, 64px
217
+ - Notable: Feature chips use 12px 28px padding; primary CTAs use 16px 40px — generous, tappable hit areas that keep the pill controls comfortable at 24px type
218
+
219
+ ### Grid & Container
220
+ - Corporate: centered single-column, the ~130px Garet headline as the sole anchor with vast surrounding whitespace
221
+ - Product: alternating light and dark full-width bands; feature options presented as a horizontal row of segmented pill chips
222
+ - Dark immersive sections (`#201d30`, `#090719`) break up light content bands for rhythm
223
+ - Rounded section masks: the product hero uses a large bottom radius (up to 120px) to soften the transition between bands
224
+
225
+ ### Whitespace Philosophy
226
+ - **Gallery over density**: the corporate site treats emptiness as content — the headline floats in negative space like a poster
227
+ - **Flat segmentation**: sections separate by background swap (white ↔ dark purple) and light-surface tint (`#eeedf2`), not by shadow
228
+ - **Pill rhythm**: the repeated 28px-radius chip creates a consistent horizontal cadence across feature/tool rows
229
+
230
+ ### Border Radius Scale
231
+ - Small (8px): language selector, small white panels
232
+ - Medium (20px): primary and inverted CTAs
233
+ - Large (28px): segmented feature chips — the product workhorse
234
+ - XL (40px): larger media/cards
235
+ - Full (9999px): fully-round pills where used
236
+
237
+ ## 6. Depth & Elevation
238
+
239
+ | Level | Treatment | Use |
240
+ |-------|-----------|-----|
241
+ | Flat (Level 0) | No shadow | Almost everything — page bg, hero, nav, chips |
242
+ | Contrast (Level 1) | Background swap (white ↔ `#201d30` / `#090719`) | Section separation without elevation |
243
+ | Tint (Level 2) | `#eeedf2` light surface / `#eeeeee` hairline | Panel/card separation on light bands |
244
+
245
+ **Shadow Philosophy**: POZAlabs is a shadow-free system on both surfaces. Live inspection returned `box-shadow: none` across the corporate hero and nav and across the MUSIA product hero, chips, and cards. Depth is communicated entirely through flat contrast — pure black type on white, white chips on deep purple-ink (`#030112`), and immersive dark bands (`#201d30`, `#090719`) — plus generous whitespace. When emphasis is needed the system reaches for color (periwinkle `#aba1fa`, saturated violet `#6242e1`) or scale, never elevation. This keeps the AI tool feeling clean, fast, and modern rather than skeuomorphic.
246
+
247
+ ## 7. Do's and Don'ts
248
+
249
+ ### Do
250
+ - Keep the corporate face monochrome — black (`#000000`) type on white (`#ffffff`), no color
251
+ - Use oversized Garet at weight 400 for corporate display headlines — scale is the emphasis, not weight
252
+ - Reserve periwinkle (`#aba1fa`) as the product's signature accent — links, wordmarks, outlines
253
+ - Use pill geometry throughout the product — 28px chips, 20px CTAs, 8px small controls
254
+ - Build dark sections from the purple-ink family (`#030112`, `#201d30`, `#090719`), not neutral black
255
+ - Use bold Inter/Pretendard at 24px/700 for product feature labels
256
+ - Separate sections with flat contrast and `#eeedf2` tint, not shadows
257
+ - Keep the Hack monospace code-syntax voice for taglines — it signals the engineering identity
258
+
259
+ ### Don't
260
+ - Introduce drop shadows for elevation — POZAlabs is flat on every surface
261
+ - Mix the corporate monochrome and product purple on the same surface — the registers stay separate
262
+ - Spread periwinkle across many product elements — it dilutes the single-accent signal
263
+ - Use heavy weights for the corporate display headline — Garet stays at weight 400
264
+ - Use neutral grey/black for dark sections — reach for the purple-ink family
265
+ - Use sharp square corners on product controls — chips and CTAs are pills
266
+ - Swap the font systems (Garet into the product, Inter into the corporate hero)
267
+ - Add a second saturated accent hue — violet is the only brand color
268
+
269
+ ## 8. Responsive Behavior
270
+
271
+ ### Breakpoints
272
+ | Name | Width | Key Changes |
273
+ |------|-------|-------------|
274
+ | Mobile | <640px | Single column; corporate headline scales down from ~130px; feature chips wrap/scroll |
275
+ | Tablet | 640-1024px | Moderate padding; 2-up feature layout |
276
+ | Desktop | 1024-1440px | Full layout, centered corporate hero, multi-band product page |
277
+
278
+ ### Touch Targets
279
+ - Primary CTAs at 68-72px height, full pill — unmistakable targets
280
+ - Feature chips at 56px height with 12px 28px padding — comfortably tappable
281
+ - Language selector at 40px height with a 3px periwinkle outline
282
+
283
+ ### Collapsing Strategy
284
+ - Corporate hero: Garet headline scales down on mobile, weight 400 maintained
285
+ - Product feature chip row: horizontal wrap/scroll on narrow viewports
286
+ - Light/dark alternating bands maintain full-width treatment
287
+ - Rounded section masks reduce their radius on smaller viewports
288
+
289
+ ### Image Behavior
290
+ - Product screenshots and media sit in shadow-free cards at 8-20px radius across breakpoints
291
+ - Corporate imagery/animation carries no shadow, consistent with the flat system
292
+
293
+ ## 9. Agent Prompt Guide
294
+
295
+ ### Quick Color Reference
296
+ - Brand accent: Periwinkle (`#aba1fa`)
297
+ - Saturated accent: Violet (`#6242e1`)
298
+ - Corporate ink / primary CTA: Pure Black (`#000000`)
299
+ - Product ink / selected chip: Ink (`#030112`)
300
+ - Dark section text-on-CTA: Deep Purple-Ink (`#150e2d`)
301
+ - Dark surfaces: `#201d30`, `#090719`
302
+ - Background: White (`#ffffff`)
303
+ - Light surface: `#eeedf2`
304
+ - Unselected chip: Muted Chip Grey (`#cecdd5`)
305
+ - Muted text: `#9f9daa`; Hairline: `#eeeeee`
306
+
307
+ ### Example Component Prompts
308
+ - "Create a corporate hero on pure white. Single Garet headline at 130px weight 400, line-height 158px, pure black #000000: 'Ignite your creativity'. Below it a monospace (Hack) code-syntax tagline in black. Vast surrounding whitespace, no shadow."
309
+ - "Design a MUSIA feature selector: a horizontal row of pill chips at 28px radius, 12px 28px padding, 24px/700 Inter. Selected chip is #030112 background with white text; unselected chips are #cecdd5 background with #030112 text."
310
+ - "Build a primary CTA: black #000000 fill, white text, 20px radius, 24px/700 Inter, ~72px tall — 'TRY FOR FREE'. On a dark purple section, invert it: white #ffffff fill with #150e2d text, 16px 40px padding."
311
+ - "Create a dark feature section: #201d30 background, white text, 20px radius cards. Accent links and the language-selector outline in periwinkle #aba1fa (3px border, 8px radius)."
312
+
313
+ ### Iteration Guide
314
+ 1. Corporate = monochrome black/white + Garet; product = periwinkle purple + Inter/Pretendard. Keep them separate.
315
+ 2. Periwinkle (`#aba1fa`) is the single product accent — don't spread it
316
+ 3. No shadows — separate with contrast, `#eeedf2` tint, and whitespace
317
+ 4. Pill geometry — 28px chips, 20px CTAs, 8px small controls
318
+ 5. Dark sections come from the purple-ink family (`#030112`, `#201d30`, `#090719`), never neutral
319
+ 6. Display headlines use scale (weight 400); product labels use weight 700
320
+ 7. Keep the Hack monospace code-syntax voice for brand taglines
321
+
322
+ ---
323
+
324
+ ## 10. Voice & Tone
325
+
326
+ POZAlabs' voice is **creative, technologist, and quietly ambitious** — an engineering house that talks about music the way a developer talks about tools. The corporate headline "Ignite your creativity" and the code-syntax tagline `expand(your_creativity)` set the register: aspirational about human creativity, playful about the technology underneath, never hype-driven. On the product (MUSIA) the copy turns plain and functional — feature chips are labeled with concrete verbs and nouns ("Songwriting", "AI Recommended Music", "Simple UI/UX", "Web Based") — treating the creator as a maker who wants to get to work, not a lead to be closed.
327
+
328
+ | Context | Tone |
329
+ |---|---|
330
+ | Corporate hero | Aspirational, spare. "Ignite your creativity." Poster-like, never salesy. |
331
+ | Corporate tagline | Playful-technical code syntax: `with pozalabs as technology: expand(your_creativity)`. |
332
+ | Product feature labels | Plain and concrete. "Songwriting", "Instrument", "Download Sheet Music". |
333
+ | CTAs | Direct, low-pressure. "TRY FOR FREE", "See the Price Guide". |
334
+ | Newsroom / blog | Confident but factual — collaborations and research stated plainly, not spun. |
335
+
336
+ **Voice samples (verbatim from live surfaces):**
337
+ - "Ignite your creativity" — corporate hero headline (aspirational). *(verified live 2026-07-02, pozalabs.com)*
338
+ - "with pozalabs as technology: expand(your_creativity)" — corporate tagline in Hack monospace (technologist-playful). *(verified live 2026-07-02, pozalabs.com)*
339
+ - "TRY FOR FREE" — MUSIA primary CTA (direct, low-pressure). *(verified live 2026-07-02, musia.ai)*
340
+
341
+ **Forbidden register**: hype superlatives about "revolutionary AI", fear-of-missing-out urgency, undefined ML jargon left unexplained, exclamation-heavy marketing. The brand's confidence comes from spare type and real collaborations, not adjectives.
342
+
343
+ ## 11. Brand Narrative
344
+
345
+ POZAlabs (포자랩스) was founded in **2018** in Seoul as an AI music-generation company, with **허원길 (Heo Won-gil)** as CEO. Its founding premise is captured in the homepage headline — to "ignite" and "expand" human creativity — by using generative models to make original, commercially usable music accessible to anyone, not just trained composers. The name and the code-syntax tagline (`expand(your_creativity)`) frame the mission as an engineering problem: creativity as a capability you can amplify with technology.
346
+
347
+ The company's flagship is **MUSIA** (`musia.ai`) — an AI composition platform spanning MUSIA ONE (a web app for generating royalty-free music) and MUSIA PLUGIN (a DAW plugin for producers). Around it POZAlabs runs **Poza Studio** for commercial music and sound production and **Viodio**, a background-music subscription aimed at creators and small businesses. The design system's two registers mirror this dual audience: the monochrome corporate site speaks to partners and press as a research lab, while the periwinkle MUSIA product speaks to creators as an approachable tool.
348
+
349
+ POZAlabs positions itself at the frontier of generative audio through visible, verifiable collaboration rather than marketing claims. Its official newsroom documents work with **Samsung, Google, and SM Entertainment** on aespa spatial-audio content powered by Eclipsa/IAMF audio technology at **CES 2025** (announced as a world-first application of IAMF technology to AI music generation), alongside commercial projects with partners such as Pinkfong ("Baby Shark") and major Korean construction and media brands. What the brand refuses, visible in its design: the busy, gradient-heavy chrome of typical AI startups (it stays flat and monochrome on the corporate face) and hype-driven copy (it lets scale, restraint, and real partnerships carry the message).
350
+
351
+ ## 12. Principles
352
+
353
+ 1. **Creativity is a capability to amplify.** The mission is to expand what people can make, not to replace them. *UI implication:* frame AI features as creator tools ("Songwriting", "Instrument"), keep the interface approachable with friendly pill controls.
354
+ 2. **Two audiences, two registers.** A research lab for partners; an approachable tool for creators. *UI implication:* keep the corporate monochrome face and the periwinkle product face visually distinct — never blend them.
355
+ 3. **Confidence through restraint.** Spare type and real collaborations, not superlatives. *UI implication:* oversized Garet headlines in negative space; no decorative shadow or gradient clutter.
356
+ 4. **Flat and fast.** Modern, shadow-free surfaces signal a contemporary AI product. *UI implication:* separate with contrast and whitespace; reserve depth cues for color, not elevation.
357
+ 5. **One accent, one signal.** Periwinkle (`#aba1fa`) means brand and action on the product. *UI implication:* reserve the accent for links, wordmarks, and key outlines so the identity reads instantly.
358
+
359
+ ## 13. Personas
360
+
361
+ *Personas below are fictional archetypes informed by publicly observable POZAlabs / MUSIA user segments (indie video creators, music producers, small-business marketers, enterprise media partners), not individual people.*
362
+
363
+ **정하늘, 27, 서울.** A YouTube creator who needs royalty-free background music for weekly uploads. Uses MUSIA ONE to generate mood-matched tracks in minutes. Chose it because the pill-chip feature selector made composing feel like picking options, not learning a DAW.
364
+
365
+ **Marcus Lee, 34, Los Angeles.** An indie music producer who runs the MUSIA PLUGIN inside his DAW for quick idea starters and stems. Values that the tool feels professional and unfussy — bold labels, no gimmicks — and that outputs are commercially clearable.
366
+
367
+ **김서연, 41, 경기.** A marketing lead at a mid-size brand sourcing custom sound for campaigns through Poza Studio. Trusts POZAlabs because its newsroom shows real, named collaborations (CES, major partners) rather than vague AI promises.
368
+
369
+ ## 14. States
370
+
371
+ | State | Treatment |
372
+ |---|---|
373
+ | **Empty (no generated tracks yet)** | White canvas with a single Ink (`#030112`) line explaining nothing has been generated, and one dark primary CTA to start. No illustration clutter. |
374
+ | **Empty (saved list, none yet)** | Muted Grey (`#9f9daa`) single line: nothing saved yet, plus a path back to generation. Calm and honest. |
375
+ | **Loading (music generation)** | Inline progress within the active feature chip; the periwinkle accent (`#aba1fa`) carries the progress indicator. Previous selections stay visible. Flat pulse — no shadow shimmer. |
376
+ | **Loading (page/section)** | Skeleton blocks at final dimensions on `#eeedf2` light surface, 8-20px radius, flat pulse consistent with the shadowless system. |
377
+ | **Error (generation failed)** | Inline message in Ink (`#030112`) with a plain-language explanation and a retry. No generic "오류가 발생했습니다" alone — states the next step. |
378
+ | **Error (form validation)** | Field-level message below the input; describes what is valid, not just "required". |
379
+ | **Success (track generated / exported)** | Brief inline confirmation in calm tone; the result (play/download) appears immediately below. No celebratory emoji. |
380
+ | **Skeleton** | `#eeedf2` blocks at final dimensions, 8-20px radius, flat pulse. |
381
+ | **Disabled** | Muted Grey (`#9f9daa`) text on reduced-opacity surface; periwinkle actions fade rather than turn grey to preserve brand read. |
382
+
383
+ ## 15. Motion & Easing
384
+
385
+ **Durations**:
386
+
387
+ | Token | Value | Use |
388
+ |---|---|---|
389
+ | `motion-fast` | 120ms | Chip select, hover, focus |
390
+ | `motion-standard` | 220ms | Section/card reveal, band transition |
391
+ | `motion-slow` | 340ms | Page-level transitions, hero reveal |
392
+
393
+ **Easings**:
394
+
395
+ | Token | Curve | Use |
396
+ |---|---|---|
397
+ | `ease-enter` | `cubic-bezier(0.2, 0.6, 0.25, 1)` | Arriving — cards, chips, sections |
398
+ | `ease-exit` | `cubic-bezier(0.4, 0.0, 1, 1)` | Dismissals |
399
+ | `ease-standard` | `cubic-bezier(0.25, 0.1, 0.25, 1)` | Two-way transitions |
400
+
401
+ **Motion rules**: Motion is quiet and functional, consistent with the flat aesthetic. Segmented chips respond to selection with a subtle scale/opacity shift as the fill swaps from `#cecdd5` to `#030112`; content bands and cards fade-in from below at `motion-standard / ease-enter`. The rounded section masks (large bottom radii) reveal as bands scroll into view. No bounce or spring — a professional AI tool signals steadiness, not gimmickry. Under `prefers-reduced-motion: reduce`, all transitions collapse to instant; the product remains fully functional.
402
+
403
+ <!--
404
+ OmD v0.1 Sources — Philosophy Layer (sections 10–15)
405
+
406
+ Tier 1 live inspect (2026-07-02) via playwright getComputedStyle:
407
+ - https://www.pozalabs.com/ — corporate hero "Ignite your creativity" (Garet ~129.6px / weight 400 /
408
+ line-height 158px / black rgb(0,0,0)); code-syntax tagline "with pozalabs as technology:
409
+ expand(your_creativity)" (Hack monospace); nav items About/Service/Research/Contact/Recruit (Garet 16px);
410
+ box-shadow none.
411
+ - https://musia.ai/ — MUSIA product. Nav PRODUCTS/PRICING/CONTENTS/SUPPORT (Inter 18px, active white,
412
+ inactive rgba(255,255,255,0.5)); primary CTA "TRY FOR FREE" bg rgb(0,0,0) radius 20px 24px/700;
413
+ inverted CTA bg rgb(255,255,255) text rgb(21,14,45) #150e2d 16px 40px; segmented chips selected
414
+ bg rgb(3,1,18) #030112 / unselected bg rgb(206,205,213) #cecdd5, radius 28px, 12px 28px padding;
415
+ language selector text+border rgb(171,161,250) #aba1fa 3px radius 8px; accent periwinkle #aba1fa 43×
416
+ as foreground; saturated violet rgb(98,66,225) #6242e1 as bg block; dark surfaces rgb(32,29,48) #201d30,
417
+ rgb(9,7,25) #090719; light surface rgb(238,237,242) #eeedf2; muted text rgb(159,157,170) #9f9daa;
418
+ box-shadow none across hero/chips/cards.
419
+
420
+ Token-level claims (§1-9) are sourced from this live inspection (see .verification.md Proof block).
421
+
422
+ Voice samples (§10) are verbatim from the live surfaces (corporate hero + tagline; MUSIA CTA).
423
+
424
+ Brand narrative (§11): POZAlabs (포자랩스), founded 2018 in Seoul, AI music-generation company; CEO
425
+ 허원길 (Heo Won-gil); products MUSIA ONE / MUSIA PLUGIN / Poza Studio / Viodio. The CES 2025
426
+ collaboration with Samsung, Google, and SM Entertainment on aespa spatial audio (Eclipsa/IAMF, announced
427
+ as a world-first IAMF application to AI music generation), Poza Studio launch, and Viodio are confirmed
428
+ via the official blog (blog.pozalabs.com) verified this turn. Founding year and CEO are widely documented
429
+ public facts, not directly quoted from a verified POZAlabs statement in this turn.
430
+
431
+ Personas (§13) are fictional archetypes informed by publicly observable POZAlabs/MUSIA user segments
432
+ (indie creators, producers, marketers, enterprise partners). Names are illustrative; they do not refer
433
+ to real people.
434
+
435
+ Interpretive claims (e.g., "two audiences, two registers", "confidence through restraint", "creativity as
436
+ a callable function") are editorial readings connecting POZAlabs' observed design to its positioning, not
437
+ directly sourced POZAlabs statements.
438
+ -->