agmon 0.2.1 → 0.2.2

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 (152) hide show
  1. package/.next/BUILD_ID +1 -1
  2. package/.next/build-manifest.json +3 -3
  3. package/.next/fallback-build-manifest.json +3 -3
  4. package/.next/prerender-manifest.json +8 -8
  5. package/.next/server/app/_global-error.html +1 -1
  6. package/.next/server/app/_global-error.rsc +1 -1
  7. package/.next/server/app/_global-error.segments/__PAGE__.segment.rsc +1 -1
  8. package/.next/server/app/_global-error.segments/_full.segment.rsc +1 -1
  9. package/.next/server/app/_global-error.segments/_tree.segment.rsc +1 -1
  10. package/.next/server/app/_not-found/page.js.nft.json +1 -1
  11. package/.next/server/app/_not-found/page_client-reference-manifest.js +1 -1
  12. package/.next/server/app/_not-found.html +1 -1
  13. package/.next/server/app/_not-found.rsc +16 -15
  14. package/.next/server/app/_not-found.segments/_full.segment.rsc +16 -15
  15. package/.next/server/app/_not-found.segments/_not-found/__PAGE__.segment.rsc +8 -7
  16. package/.next/server/app/_not-found.segments/_tree.segment.rsc +2 -2
  17. package/.next/server/app/api/media/route.js.nft.json +1 -1
  18. package/.next/server/app/api/reports/tokens/route.js.nft.json +1 -1
  19. package/.next/server/app/api/sessions/[id]/transcript/route.js +1 -1
  20. package/.next/server/app/api/sessions/[id]/transcript/route.js.nft.json +1 -1
  21. package/.next/server/app/api/traces/stream/route.js +1 -1
  22. package/.next/server/app/api/traces/stream/route.js.nft.json +1 -1
  23. package/.next/server/app/api/version/route.js.nft.json +1 -1
  24. package/.next/server/app/api/workspace/file-content/route.js.nft.json +1 -1
  25. package/.next/server/app/api/workspace/files/route.js.nft.json +1 -1
  26. package/.next/server/app/chat/page.js.nft.json +1 -1
  27. package/.next/server/app/chat/page_client-reference-manifest.js +1 -1
  28. package/.next/server/app/chat.html +1 -1
  29. package/.next/server/app/chat.rsc +4 -4
  30. package/.next/server/app/chat.segments/_full.segment.rsc +4 -4
  31. package/.next/server/app/chat.segments/_tree.segment.rsc +2 -2
  32. package/.next/server/app/chat.segments/chat/__PAGE__.segment.rsc +6 -5
  33. package/.next/server/app/index.html +1 -1
  34. package/.next/server/app/index.rsc +5 -5
  35. package/.next/server/app/index.segments/__PAGE__.segment.rsc +7 -6
  36. package/.next/server/app/index.segments/_full.segment.rsc +5 -5
  37. package/.next/server/app/index.segments/_tree.segment.rsc +2 -2
  38. package/.next/server/app/page.js.nft.json +1 -1
  39. package/.next/server/app/page_client-reference-manifest.js +1 -1
  40. package/.next/server/app/reports/page.js.nft.json +1 -1
  41. package/.next/server/app/reports/page_client-reference-manifest.js +1 -1
  42. package/.next/server/app/reports.html +1 -1
  43. package/.next/server/app/reports.rsc +2 -2
  44. package/.next/server/app/reports.segments/_full.segment.rsc +2 -2
  45. package/.next/server/app/reports.segments/_tree.segment.rsc +2 -2
  46. package/.next/server/app/reports.segments/reports/__PAGE__.segment.rsc +4 -3
  47. package/.next/server/app/store/page.js.nft.json +1 -1
  48. package/.next/server/app/store/page_client-reference-manifest.js +1 -1
  49. package/.next/server/app/store.html +1 -1
  50. package/.next/server/app/store.rsc +2 -2
  51. package/.next/server/app/store.segments/_full.segment.rsc +2 -2
  52. package/.next/server/app/store.segments/_tree.segment.rsc +2 -2
  53. package/.next/server/app/store.segments/store/__PAGE__.segment.rsc +4 -3
  54. package/.next/server/chunks/[root-of-the-server]__0dw97_pahi8uf._.js +3 -0
  55. package/.next/server/chunks/[root-of-the-server]__0dw97_pahi8uf._.js.map +1 -0
  56. package/.next/server/chunks/_0ao-_t4jkb46h._.js +2 -2
  57. package/.next/server/chunks/_0ao-_t4jkb46h._.js.map +1 -1
  58. package/.next/server/chunks/_1-8ipqazoyrrk._.js +1 -1
  59. package/.next/server/chunks/_1-8ipqazoyrrk._.js.map +1 -1
  60. package/.next/server/chunks/ssr/[root-of-the-server]__1jwplflwix8wi._.js +1 -1
  61. package/.next/server/chunks/ssr/[root-of-the-server]__1jwplflwix8wi._.js.map +1 -1
  62. package/.next/server/chunks/ssr/[root-of-the-server]__1kt7h7bz59mdn._.js +1 -1
  63. package/.next/server/chunks/ssr/[root-of-the-server]__1kt7h7bz59mdn._.js.map +1 -1
  64. package/.next/server/chunks/ssr/[root-of-the-server]__1otsvjy81s8my._.js +1 -1
  65. package/.next/server/chunks/ssr/[root-of-the-server]__1otsvjy81s8my._.js.map +1 -1
  66. package/.next/server/chunks/ssr/{_0--937zhi743v._.js → _0zel-n0h--cnl._.js} +1 -1
  67. package/.next/server/chunks/ssr/{node_modules_0jla9ugf1y6rb._.js → node_modules_01avo0bde3tpo._.js} +1 -1
  68. package/.next/server/chunks/ssr/{node_modules_0sjdrli5douui._.js → node_modules_01l0208e5kqic._.js} +1 -1
  69. package/.next/server/chunks/ssr/{node_modules_0lqovp8j8ld76._.js → node_modules_033x29yqle_sj._.js} +1 -1
  70. package/.next/server/chunks/ssr/{node_modules_05i69rc9pwcdx._.js → node_modules_03wbg__aslvui._.js} +1 -1
  71. package/.next/server/chunks/ssr/{node_modules_1ltys5mwtcv-n._.js → node_modules_08-bqkrz7sh0l._.js} +1 -1
  72. package/.next/server/chunks/ssr/{node_modules_09v49jhajmvl4._.js → node_modules_089w9jm7s2qa3._.js} +2 -2
  73. package/.next/server/chunks/ssr/{node_modules_0z1e37smavebg._.js → node_modules_0cy47-s63xjzh._.js} +2 -2
  74. package/.next/server/chunks/ssr/{node_modules_0dw0vozejrnml._.js → node_modules_0czh0jcnsm5e6._.js} +2 -2
  75. package/.next/server/chunks/ssr/{node_modules_0e3njj436xau-._.js → node_modules_0fv321j1nslkb._.js} +1 -1
  76. package/.next/server/chunks/ssr/{node_modules_0d2ios01ot1in._.js → node_modules_0g-wb7h-hsdwc._.js} +1 -1
  77. package/.next/server/chunks/ssr/{node_modules_1l46or7mgko0z._.js → node_modules_0oz_zzlh8exwx._.js} +1 -1
  78. package/.next/server/chunks/ssr/{node_modules_0b8zi3pbl-y9n._.js → node_modules_0so2agzqd9p8l._.js} +2 -2
  79. package/.next/server/chunks/ssr/{node_modules_1wew4nn7i1uup._.js → node_modules_0w2w61b8bh769._.js} +1 -1
  80. package/.next/server/chunks/ssr/{node_modules_07bjxeq9dfgn1._.js → node_modules_0wd6szix_zku7._.js} +2 -2
  81. package/.next/server/chunks/ssr/{node_modules_1aqaelh-8fme6._.js → node_modules_0wp7omf0xblv8._.js} +1 -1
  82. package/.next/server/chunks/ssr/{node_modules_0xh8tnq1niblb._.js → node_modules_10c51o2qv6mbi._.js} +1 -1
  83. package/.next/server/chunks/ssr/{node_modules_1d4sreyq0ubqg._.js → node_modules_19vqq7rvf-_ar._.js} +2 -2
  84. package/.next/server/chunks/ssr/{node_modules_1e_nc2eyg4djz._.js → node_modules_1hu83gui7_nj2._.js} +1 -1
  85. package/.next/server/chunks/ssr/{node_modules_1zbmc81s-4zsm._.js → node_modules_1j8hpoiygrs5e._.js} +1 -1
  86. package/.next/server/chunks/ssr/{node_modules_1pquu5wprusnc._.js → node_modules_1n4kig4mj6n4s._.js} +2 -2
  87. package/.next/server/chunks/ssr/{node_modules_1st9dwe66yx93._.js → node_modules_1s8oxeqa5_i3k._.js} +1 -1
  88. package/.next/server/chunks/ssr/{node_modules_01p9ctt-n2dxp._.js → node_modules_1xz1dstlo5ri-._.js} +1 -1
  89. package/.next/server/chunks/ssr/{node_modules_katex_dist_katex_mjs_0kqo9zl9cgwbo._.js → node_modules_katex_dist_katex_mjs_067omoj5szuys._.js} +1 -1
  90. package/.next/server/chunks/ssr/src_app_page_1vqfk0-j72fp6.js +1 -1
  91. package/.next/server/chunks/ssr/src_app_page_1vqfk0-j72fp6.js.map +1 -1
  92. package/.next/server/middleware-build-manifest.js +3 -3
  93. package/.next/server/pages/404.html +1 -1
  94. package/.next/server/pages/500.html +1 -1
  95. package/.next/server/preview-props.json +3 -3
  96. package/.next/server/server-reference-manifest.js +1 -1
  97. package/.next/server/server-reference-manifest.json +1 -1
  98. package/.next/static/chunks/0jo6fy2c_gmqn.js +1 -0
  99. package/.next/static/chunks/2q9cwykv6ox1t.css +1 -0
  100. package/.next/static/chunks/{3og0e9qcff393.js → 2zf44j8sjo0w0.js} +4 -4
  101. package/.next/trace +1 -1
  102. package/.next/trace-build +1 -1
  103. package/package.json +1 -1
  104. package/src/app/api/traces/stream/route.js +41 -5
  105. package/src/app/layout.js +2 -1
  106. package/src/app/page.js +17 -1
  107. package/src/components/chat/SessionChatView.js +1 -1
  108. package/src/components/factory/office-canvas.js +32 -1
  109. package/src/components/layout/BottomPanel.jsx +6 -6
  110. package/src/components/layout/LeftSidebar.jsx +62 -4
  111. package/src/components/layout/StatusBar.jsx +1 -1
  112. package/src/components/layout/TitleBar.jsx +71 -1
  113. package/src/components/layout/VSCodeWorkbench.jsx +21 -0
  114. package/src/lib/mockTraces.js +13 -11
  115. package/src/lib/parsers/codexParser.js +373 -0
  116. package/src/lib/parsers/transcriptParser.js +35 -3
  117. package/src/lib/useFactoryTraces.js +70 -5
  118. package/src/lib/watchers/antigravityWatcher.js +15 -1
  119. package/src/lib/watchers/claudeWatcher.js +64 -53
  120. package/src/lib/watchers/codexWatcher.js +482 -0
  121. package/src/lib/watchers/watcherManager.js +46 -30
  122. package/.next/server/chunks/src_lib_watchers_antigravityWatcher_0w1-atg39y__p.js +0 -3
  123. package/.next/server/chunks/src_lib_watchers_antigravityWatcher_0w1-atg39y__p.js.map +0 -1
  124. package/.next/static/chunks/17jorrh_pfel_.js +0 -1
  125. package/.next/static/chunks/25l0z48vlvdu4.css +0 -1
  126. /package/.next/server/chunks/ssr/{_0--937zhi743v._.js.map → _0zel-n0h--cnl._.js.map} +0 -0
  127. /package/.next/server/chunks/ssr/{node_modules_0jla9ugf1y6rb._.js.map → node_modules_01avo0bde3tpo._.js.map} +0 -0
  128. /package/.next/server/chunks/ssr/{node_modules_0sjdrli5douui._.js.map → node_modules_01l0208e5kqic._.js.map} +0 -0
  129. /package/.next/server/chunks/ssr/{node_modules_0lqovp8j8ld76._.js.map → node_modules_033x29yqle_sj._.js.map} +0 -0
  130. /package/.next/server/chunks/ssr/{node_modules_05i69rc9pwcdx._.js.map → node_modules_03wbg__aslvui._.js.map} +0 -0
  131. /package/.next/server/chunks/ssr/{node_modules_1ltys5mwtcv-n._.js.map → node_modules_08-bqkrz7sh0l._.js.map} +0 -0
  132. /package/.next/server/chunks/ssr/{node_modules_09v49jhajmvl4._.js.map → node_modules_089w9jm7s2qa3._.js.map} +0 -0
  133. /package/.next/server/chunks/ssr/{node_modules_0z1e37smavebg._.js.map → node_modules_0cy47-s63xjzh._.js.map} +0 -0
  134. /package/.next/server/chunks/ssr/{node_modules_0dw0vozejrnml._.js.map → node_modules_0czh0jcnsm5e6._.js.map} +0 -0
  135. /package/.next/server/chunks/ssr/{node_modules_0e3njj436xau-._.js.map → node_modules_0fv321j1nslkb._.js.map} +0 -0
  136. /package/.next/server/chunks/ssr/{node_modules_0d2ios01ot1in._.js.map → node_modules_0g-wb7h-hsdwc._.js.map} +0 -0
  137. /package/.next/server/chunks/ssr/{node_modules_0xh8tnq1niblb._.js.map → node_modules_0oz_zzlh8exwx._.js.map} +0 -0
  138. /package/.next/server/chunks/ssr/{node_modules_0b8zi3pbl-y9n._.js.map → node_modules_0so2agzqd9p8l._.js.map} +0 -0
  139. /package/.next/server/chunks/ssr/{node_modules_1wew4nn7i1uup._.js.map → node_modules_0w2w61b8bh769._.js.map} +0 -0
  140. /package/.next/server/chunks/ssr/{node_modules_07bjxeq9dfgn1._.js.map → node_modules_0wd6szix_zku7._.js.map} +0 -0
  141. /package/.next/server/chunks/ssr/{node_modules_1aqaelh-8fme6._.js.map → node_modules_0wp7omf0xblv8._.js.map} +0 -0
  142. /package/.next/server/chunks/ssr/{node_modules_1d4sreyq0ubqg._.js.map → node_modules_10c51o2qv6mbi._.js.map} +0 -0
  143. /package/.next/server/chunks/ssr/{node_modules_1l46or7mgko0z._.js.map → node_modules_19vqq7rvf-_ar._.js.map} +0 -0
  144. /package/.next/server/chunks/ssr/{node_modules_1e_nc2eyg4djz._.js.map → node_modules_1hu83gui7_nj2._.js.map} +0 -0
  145. /package/.next/server/chunks/ssr/{node_modules_1zbmc81s-4zsm._.js.map → node_modules_1j8hpoiygrs5e._.js.map} +0 -0
  146. /package/.next/server/chunks/ssr/{node_modules_1pquu5wprusnc._.js.map → node_modules_1n4kig4mj6n4s._.js.map} +0 -0
  147. /package/.next/server/chunks/ssr/{node_modules_1st9dwe66yx93._.js.map → node_modules_1s8oxeqa5_i3k._.js.map} +0 -0
  148. /package/.next/server/chunks/ssr/{node_modules_01p9ctt-n2dxp._.js.map → node_modules_1xz1dstlo5ri-._.js.map} +0 -0
  149. /package/.next/server/chunks/ssr/{node_modules_katex_dist_katex_mjs_0kqo9zl9cgwbo._.js.map → node_modules_katex_dist_katex_mjs_067omoj5szuys._.js.map} +0 -0
  150. /package/.next/static/{1y6Da0YgnPr2_6ncpWrbV → dGN2VKPk5TJgezxS3JvRc}/_buildManifest.js +0 -0
  151. /package/.next/static/{1y6Da0YgnPr2_6ncpWrbV → dGN2VKPk5TJgezxS3JvRc}/_clientMiddlewareManifest.js +0 -0
  152. /package/.next/static/{1y6Da0YgnPr2_6ncpWrbV → dGN2VKPk5TJgezxS3JvRc}/_ssgManifest.js +0 -0
package/.next/server/app/store.html CHANGED
@@ -1 +1 @@
1
- <!DOCTYPE html><html lang="en" class="dark"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"/><link rel="stylesheet" href="/_next/static/chunks/25l0z48vlvdu4.css" data-precedence="next"/><link rel="preload" as="script" fetchPriority="low" href="/_next/static/chunks/3xic34odrqk7-.js"/><script src="/_next/static/chunks/3-rp__fazq2qp.js" async=""></script><script src="/_next/static/chunks/3oyu3ojtboiqk.js" async=""></script><script src="/_next/static/chunks/27y6z1uobtyg2.js" async=""></script><script src="/_next/static/chunks/turbopack-3-ry682tkyiqk.js" async=""></script><script src="/_next/static/chunks/31d3_w6klkslg.js" async=""></script><script src="/_next/static/chunks/23uup1e8841av.js" async=""></script><script src="/_next/static/chunks/2rx7xvi55ohln.js" async=""></script><link rel="preload" href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;500;600;700&amp;family=Inter:wght@400;500;600;700&amp;family=JetBrains+Mono:wght@400;500;600;700&amp;family=Roboto:wght@400;500;700&amp;display=swap" as="style"/><meta name="theme-color" content="#070b12"/><title>AGMon - AI Agent Office &amp; Activity Visualizer</title><meta name="description" content="Realtime activity and token flow visualizer for Antigravity, Claude Code &amp; AI CLIs"/><link rel="manifest" href="/manifest.json"/><meta name="mobile-web-app-capable" content="yes"/><meta name="apple-mobile-web-app-title" content="AGMon"/><meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"/><link rel="icon" href="/favicon.svg"/><link rel="apple-touch-icon" href="/icons/icon.svg"/><link rel="manifest" href="/manifest.json"/><link rel="apple-touch-icon" href="/icons/icon.svg"/><meta name="apple-mobile-web-app-capable" content="yes"/><meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"/><link rel="preconnect" href="https://fonts.googleapis.com"/><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="anonymous"/><link href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;500;600;700&amp;family=Inter:wght@400;500;600;700&amp;family=JetBrains+Mono:wght@400;500;600;700&amp;family=Roboto:wght@400;500;700&amp;display=swap" rel="stylesheet"/><script>(function(){try{var raw=localStorage.getItem("agmon_theme_settings");var t="dark-plus";var fz="13";var uf="";var cf="";if(raw){var s=JSON.parse(raw);if(s.theme)t=s.theme;if(s.fontSize)fz=s.fontSize;if(s.uiFont)uf=s.uiFont;if(s.codeFont)cf=s.codeFont;}document.documentElement.setAttribute("data-theme",t);if(t==="light-plus"){document.documentElement.classList.remove("dark");document.documentElement.classList.add("light");}else{document.documentElement.classList.remove("light");document.documentElement.classList.add("dark");}document.documentElement.style.setProperty("--font-size-ui",fz+"px");document.documentElement.style.setProperty("--font-size-base",fz+"px");}catch(e){}})();</script><script src="/_next/static/chunks/0cz1d0mv5g_q7.js" noModule=""></script></head><body class="antialiased bg-[var(--bg-workbench)] text-[var(--text-main)] select-none"><div hidden=""><!--$--><!--/$--></div><div class="flex h-screen w-full bg-[#181818]"><div class="w-full h-full flex flex-col md:flex-row bg-[#141416] text-slate-300 overflow-hidden select-none"><aside data-testid="store-aside-menu" class="w-full md:w-64 lg:w-72 bg-[#18181c] border-b md:border-b-0 md:border-r border-[#26262b] flex flex-col shrink-0 h-auto md:h-full z-20 shadow-xl"><div class="p-4 border-b border-[#26262b] flex items-center justify-between bg-[#151518]"><div class="flex items-center gap-2.5"><div class="w-8 h-8 rounded-lg bg-gradient-to-br from-amber-500/30 to-amber-600/10 border border-amber-500/40 flex items-center justify-center text-amber-400 shadow-sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-shopping-bag w-4 h-4" aria-hidden="true"><path d="M16 10a4 4 0 0 1-8 0"></path><path d="M3.103 6.034h17.794"></path><path d="M3.4 5.467a2 2 0 0 0-.4 1.2V20a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6.667a2 2 0 0 0-.4-1.2l-2-2.667A2 2 0 0 0 17 2H7a2 2 0 0 0-1.6.8z"></path></svg></div><div><h2 class="text-sm font-bold text-white leading-tight">Supporter Store</h2><p class="text-[11px] text-amber-400 font-mono">148<!-- --> 3D Items &amp; Effects</p></div></div></div><div class="p-3 border-b border-[#26262b]"><div class="relative"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-search w-3.5 h-3.5 text-slate-500 absolute left-2.5 top-1/2 -translate-y-1/2" aria-hidden="true"><path d="m21 21-4.34-4.34"></path><circle cx="11" cy="11" r="8"></circle></svg><input type="text" placeholder="Search across 148 items..." class="w-full pl-8 pr-7 py-1.5 bg-[#202026] border border-[#33333d] rounded-lg text-xs text-white placeholder-slate-500 focus:outline-none focus:border-[#007acc] transition-colors" value=""/></div></div><nav class="flex-1 overflow-y-auto p-2 space-y-1 text-xs"><div class="px-2 py-1 text-[10px] font-bold text-slate-500 uppercase tracking-wider">Categories (<!-- -->148<!-- --> Items)</div><button class="w-full flex items-center justify-between px-3 py-2 rounded-lg text-left transition-all cursor-pointer bg-[#007acc] text-white font-semibold shadow-md shadow-[#007acc]/20"><div class="flex items-center gap-2.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-grid-3x3 lucide-grid lucide-grid-3-x-3 w-4 h-4 shrink-0 text-white" aria-hidden="true"><rect width="18" height="18" x="3" y="3" rx="2"></rect><path d="M3 9h18"></path><path d="M3 15h18"></path><path d="M9 3v18"></path><path d="M15 3v18"></path></svg><div><div class="leading-tight text-xs">All Items</div><div class="text-[10px] text-cyan-100 line-clamp-1">10 Themes · 50 Skins · 35 Props · 21 Pets · 16 Auras · 16 Trophies</div></div></div><span class="text-[10px] font-mono px-2 py-0.5 rounded-full bg-white/20 text-white font-bold">148</span></button><button class="w-full flex items-center justify-between px-3 py-2 rounded-lg text-left transition-all cursor-pointer text-slate-300 hover:text-white hover:bg-[#202026]"><div class="flex items-center gap-2.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-4 h-4 shrink-0 text-slate-400" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg><div><div class="leading-tight text-xs">Live Fitting Room</div><div class="text-[10px] text-slate-500 line-clamp-1">Interactive avatar sandbox, mix props &amp; test actions</div></div></div><span class="text-[9px] font-bold font-mono px-1.5 py-0.5 rounded bg-amber-500/20 text-amber-300 border border-amber-500/40">LIVE 3D</span></button><button class="w-full flex items-center justify-between px-3 py-2 rounded-lg text-left transition-all cursor-pointer text-slate-300 hover:text-white hover:bg-[#202026]"><div class="flex items-center gap-2.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-palette w-4 h-4 shrink-0 text-slate-400" aria-hidden="true"><path d="M12 22a1 1 0 0 1 0-20 10 9 0 0 1 10 9 5 5 0 0 1-5 5h-2.25a1.75 1.75 0 0 0-1.4 2.8l.3.4a1.75 1.75 0 0 1-1.4 2.8z"></path><circle cx="13.5" cy="6.5" r=".5" fill="currentColor"></circle><circle cx="17.5" cy="10.5" r=".5" fill="currentColor"></circle><circle cx="6.5" cy="12.5" r=".5" fill="currentColor"></circle><circle cx="8.5" cy="7.5" r=".5" fill="currentColor"></circle></svg><div><div class="leading-tight text-xs">Office Themes</div><div class="text-[10px] text-slate-500 line-clamp-1">Virtual office floor styles, neon grids &amp; wallpapers</div></div></div><span class="text-[10px] font-mono px-2 py-0.5 rounded-full bg-[#25252d] text-slate-400 border border-[#33333d]">10</span></button><button class="w-full flex items-center justify-between px-3 py-2 rounded-lg text-left transition-all cursor-pointer text-slate-300 hover:text-white hover:bg-[#202026]"><div class="flex items-center gap-2.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-bot w-4 h-4 shrink-0 text-slate-400" aria-hidden="true"><path d="M12 8V4H8"></path><rect width="16" height="12" x="4" y="8" rx="2"></rect><path d="M2 14h2"></path><path d="M20 14h2"></path><path d="M15 13v2"></path><path d="M9 13v2"></path></svg><div><div class="leading-tight text-xs">Agent Skins 3D</div><div class="text-[10px] text-slate-500 line-clamp-1">Cyborgs, mecha frames, and cyber armor</div></div></div><span class="text-[10px] font-mono px-2 py-0.5 rounded-full bg-[#25252d] text-slate-400 border border-[#33333d]">50</span></button><button class="w-full flex items-center justify-between px-3 py-2 rounded-lg text-left transition-all cursor-pointer text-slate-300 hover:text-white hover:bg-[#202026]"><div class="flex items-center gap-2.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-laptop w-4 h-4 shrink-0 text-slate-400" aria-hidden="true"><path d="M18 5a2 2 0 0 1 2 2v8.526a2 2 0 0 0 .212.897l1.068 2.127a1 1 0 0 1-.9 1.45H3.62a1 1 0 0 1-.9-1.45l1.068-2.127A2 2 0 0 0 4 15.526V7a2 2 0 0 1 2-2z"></path><path d="M20.054 15.987H3.946"></path></svg><div><div class="leading-tight text-xs">Tech Desk Props</div><div class="text-[10px] text-slate-500 line-clamp-1">Workstation gear, hardware, and servers</div></div></div><span class="text-[10px] font-mono px-2 py-0.5 rounded-full bg-[#25252d] text-slate-400 border border-[#33333d]">35</span></button><button class="w-full flex items-center justify-between px-3 py-2 rounded-lg text-left transition-all cursor-pointer text-slate-300 hover:text-white hover:bg-[#202026]"><div class="flex items-center gap-2.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-gift w-4 h-4 shrink-0 text-slate-400" aria-hidden="true"><path d="M12 7v14"></path><path d="M20 11v8a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2v-8"></path><path d="M7.5 7a1 1 0 0 1 0-5A4.8 8 0 0 1 12 7a4.8 8 0 0 1 4.5-5 1 1 0 0 1 0 5"></path><rect x="3" y="7" width="18" height="4" rx="1"></rect></svg><div><div class="leading-tight text-xs">Pets &amp; Companions</div><div class="text-[10px] text-slate-500 line-clamp-1">Cyber pets &amp; companion hover drones</div></div></div><span class="text-[10px] font-mono px-2 py-0.5 rounded-full bg-[#25252d] text-slate-400 border border-[#33333d]">21</span></button><button class="w-full flex items-center justify-between px-3 py-2 rounded-lg text-left transition-all cursor-pointer text-slate-300 hover:text-white hover:bg-[#202026]"><div class="flex items-center gap-2.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-4 h-4 shrink-0 text-slate-400" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg><div><div class="leading-tight text-xs">Auras &amp; Effects</div><div class="text-[10px] text-slate-500 line-clamp-1">Energy rings &amp; particle spectrums</div></div></div><span class="text-[10px] font-mono px-2 py-0.5 rounded-full bg-[#25252d] text-slate-400 border border-[#33333d]">16</span></button><button class="w-full flex items-center justify-between px-3 py-2 rounded-lg text-left transition-all cursor-pointer text-slate-300 hover:text-white hover:bg-[#202026]"><div class="flex items-center gap-2.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trophy w-4 h-4 shrink-0 text-slate-400" aria-hidden="true"><path d="M10 14.66V17a1 1 0 0 1-1 1 2 2 0 0 0-2 2v2"></path><path d="M14 14.66V17a1 1 0 0 0 1 1 2 2 0 0 1 2 2v2"></path><path d="M17.916 10H19.5A2.5 2.5 0 0 0 22 7.5V5a1 1 0 0 0-1-1h-3"></path><path d="M4 22h16"></path><path d="M6 9a6 6 0 0 0 12 0V3a1 1 0 0 0-1-1H7a1 1 0 0 0-1 1z"></path><path d="M6.084 10H4.5A2.5 2.5 0 0 1 2 7.5V5a1 1 0 0 1 1-1h3"></path></svg><div><div class="leading-tight text-xs">Trophies &amp; Badges</div><div class="text-[10px] text-slate-500 line-clamp-1">Commemorative awards, silicon wafers &amp; medals</div></div></div><span class="text-[10px] font-mono px-2 py-0.5 rounded-full bg-[#25252d] text-slate-400 border border-[#33333d]">16</span></button><button class="w-full flex items-center justify-between px-3 py-2 rounded-lg text-left transition-all cursor-pointer text-slate-300 hover:text-white hover:bg-[#202026]"><div class="flex items-center gap-2.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-volume-2 w-4 h-4 shrink-0 text-slate-400" aria-hidden="true"><path d="M11 4.702a.705.705 0 0 0-1.203-.498L6.413 7.587A1.4 1.4 0 0 1 5.416 8H3a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h2.416a1.4 1.4 0 0 1 .997.413l3.383 3.384A.705.705 0 0 0 11 19.298z"></path><path d="M16 9a5 5 0 0 1 0 6"></path><path d="M19.364 18.364a9 9 0 0 0 0-12.728"></path></svg><div><div class="leading-tight text-xs">Ambient Soundscapes</div><div class="text-[10px] text-slate-500 line-clamp-1">Lo-Fi beats &amp; focus background noise</div></div></div><span class="text-[10px] font-mono px-2 py-0.5 rounded-full bg-[#25252d] text-slate-400 border border-[#33333d]">6</span></button><button class="w-full flex items-center justify-between px-3 py-2 rounded-lg text-left transition-all cursor-pointer text-slate-300 hover:text-white hover:bg-[#202026]"><div class="flex items-center gap-2.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-coffee w-4 h-4 shrink-0 text-slate-400" aria-hidden="true"><path d="M10 2v2"></path><path d="M14 2v2"></path><path d="M16 8a1 1 0 0 1 1 1v8a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4V9a1 1 0 0 1 1-1h14a4 4 0 1 1 0 8h-1"></path><path d="M6 2v2"></path></svg><div><div class="leading-tight text-xs">Supporter Vault (VietQR)</div><div class="text-[10px] text-slate-500 line-clamp-1">Scan VietQR to unlock all VIP perks</div></div></div><span class="text-[9px] font-bold font-mono px-1.5 py-0.5 rounded bg-amber-500/20 text-amber-300 border border-amber-500/40">Buff Dev</span></button><div class="pt-3 px-2"><div class="text-[10px] font-bold text-slate-500 uppercase tracking-wider mb-1.5 flex items-center gap-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-funnel lucide-filter w-3 h-3 text-cyan-400" aria-hidden="true"><path d="M10 20a1 1 0 0 0 .553.895l2 1A1 1 0 0 0 14 21v-7a2 2 0 0 1 .517-1.341L21.74 4.67A1 1 0 0 0 21 3H3a1 1 0 0 0-.742 1.67l7.225 7.989A2 2 0 0 1 10 14z"></path></svg><span>Filter by Tier</span></div><div class="flex flex-wrap gap-1"><button class="px-2 py-1 text-[10px] rounded-md border transition-colors cursor-pointer bg-cyan-500/20 text-cyan-300 border-cyan-500/50 font-bold shadow-sm">All</button><button class="px-2 py-1 text-[10px] rounded-md border transition-colors cursor-pointer bg-[#202026] text-slate-400 border-[#2f2f38] hover:text-white">Free</button><button class="px-2 py-1 text-[10px] rounded-md border transition-colors cursor-pointer bg-[#202026] text-slate-400 border-[#2f2f38] hover:text-white">Coffee (20k)</button><button class="px-2 py-1 text-[10px] rounded-md border transition-colors cursor-pointer bg-[#202026] text-slate-400 border-[#2f2f38] hover:text-white">Lunch (50k)</button><button class="px-2 py-1 text-[10px] rounded-md border transition-colors cursor-pointer bg-[#202026] text-slate-400 border-[#2f2f38] hover:text-white">VIP (100k)</button></div></div><div class="pt-3 px-2"><button type="button" class="w-full flex items-center justify-center gap-1.5 px-3 py-1.5 bg-gradient-to-r from-amber-500/20 to-amber-600/20 hover:from-amber-500/30 hover:to-amber-600/30 border border-amber-500/40 text-amber-300 rounded-lg text-xs font-semibold cursor-pointer transition-all shadow-sm" title="Unlock all 148 items instantly to preview"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-zap w-3.5 h-3.5 text-amber-400" aria-hidden="true"><path d="M15.914 4a1.5 1.5 0 00-2.474-1.561l-9 9A1.5 1.5 0 005.5 14h4.002a.5.5 0 01.471.666L8.086 20a1.5 1.5 0 002.475 1.56l9-9A1.5 1.5 0 0018.5 10h-3.997a.5.5 0 01-.472-.667z"></path></svg><span>Unlock all <!-- -->148<!-- --> items (VIP Demo)</span></button></div></nav><div class="p-3 border-t border-[#26262b] bg-[#121215] text-xs space-y-2"><div class="flex items-center justify-between text-[11px] text-slate-400 font-semibold"><span>Current Avatar</span><span class="font-mono text-[9px] px-1.5 py-0.5 rounded font-bold bg-slate-800 text-slate-400 border border-slate-700">FREE AGENT</span></div><div class="flex items-center gap-3 p-2 rounded-xl bg-[#1d1d23] border border-[#2b2b34] shadow-inner"><div class="w-14 h-14 rounded-lg bg-[#141418] border border-[#33333d] flex items-center justify-center shrink-0 overflow-hidden relative shadow-inner"><div class="relative select-none flex items-center justify-center overflow-hidden w-full h-full"><svg viewBox="-65 -95 130 130" class="w-full h-full block" style="filter:drop-shadow(0 12px 24px rgba(0,0,0,0.5))"><defs><radialGradient id="lra__R_1kanpflb__ambientGlow" cx="50%" cy="50%" r="50%"><stop offset="0%" stop-color="#38bdf8" stop-opacity="0.25"></stop><stop offset="70%" stop-color="#14161a" stop-opacity="0.05"></stop><stop offset="100%" stop-color="transparent" stop-opacity="0"></stop></radialGradient><linearGradient id="lra__R_1kanpflb__bodyGradient" x1="0" y1="0" x2="0" y2="1"><stop offset="0%" stop-color="#ffffff"></stop><stop offset="50%" stop-color="#1e2430"></stop><stop offset="100%" stop-color="#111622"></stop></linearGradient><linearGradient id="lra__R_1kanpflb__headGradient" x1="0" y1="0" x2="0" y2="1"><stop offset="0%" stop-color="#2d3748"></stop><stop offset="60%" stop-color="#1e2430"></stop><stop offset="100%" stop-color="#111622"></stop></linearGradient><linearGradient id="lra__R_1kanpflb__deskGradient" x1="0" y1="0" x2="0" y2="1"><stop offset="0%" stop-color="#2b3443"></stop><stop offset="100%" stop-color="#181d26"></stop></linearGradient><linearGradient id="lra__R_1kanpflb__floorGradient" x1="0" y1="0" x2="0" y2="1"><stop offset="0%" stop-color="#1e222b"></stop><stop offset="100%" stop-color="#14161a"></stop></linearGradient></defs><g transform="translate(0, -42)"><g><g></g></g></g><g id="agent-root" transform="translate(0, -50)"><g><g id="staff-torso-cyber-suit"><polygon points="-18,-30 18,-30 15,-6 -15,-6" fill="url(#lra__R_1kanpflb__bodyGradient)" stroke="#00f0ff" stroke-width="1.2"></polygon><polygon points="-17,-30 -7,-14 -13,-14" fill="#0d1117" stroke="#00f0ff" stroke-width="0.8"></polygon><polygon points="17,-30 7,-14 13,-14" fill="#0d1117" stroke="#00f0ff" stroke-width="0.8"></polygon><line x1="0" y1="-30" x2="0" y2="-10" stroke="#00f0ff" stroke-width="1.4"></line><rect x="-14" y="-22" width="5" height="3" rx="1" fill="#1f2937" stroke="#00f0ff" stroke-width="0.6"></rect><rect x="9" y="-22" width="5" height="3" rx="1" fill="#1f2937" stroke="#00f0ff" stroke-width="0.6"></rect><path d="M -5 -30 Q 0 -18 5 -30" stroke="#ffffff" stroke-width="1.2" fill="none" opacity="0.85"></path><rect x="-4.5" y="-19" width="9" height="12" rx="1.5" fill="#090d16" stroke="#00f0ff" stroke-width="1"></rect><rect x="-3" y="-17.5" width="6" height="4.5" rx="0.5" fill="#00f0ff"></rect><line x1="-3" y1="-11" x2="3" y2="-11" stroke="#ffffff" stroke-width="0.8"></line><line x1="-3" y1="-9" x2="1" y2="-9" stroke="#ffffff" stroke-width="0.8"></line><rect x="-15" y="-10" width="30" height="4" fill="#020617"></rect><rect x="-3.5" y="-11" width="7" height="6" rx="1" fill="#1e293b" stroke="#00f0ff" stroke-width="1"></rect></g><g><rect x="-26" y="-26" width="8" height="24" rx="4" fill="#1e2430" stroke="#00f0ff" stroke-width="0.8"></rect><line x1="-25" y1="-6" x2="-19" y2="-6" stroke="#00f0ff" stroke-width="1"></line></g><g><rect x="18" y="-26" width="8" height="24" rx="4" fill="#1e2430" stroke="#00f0ff" stroke-width="0.8"></rect><line x1="19" y1="-6" x2="25" y2="-6" stroke="#00f0ff" stroke-width="1"></line></g><circle cx="-27" cy="-56" r="8" fill="#00f0ff"></circle><circle cx="27" cy="-56" r="8" fill="#00f0ff"></circle><ellipse cx="0" cy="-56" rx="26" ry="24" fill="url(#lra__R_1kanpflb__headGradient)" stroke="#00f0ff" stroke-width="2.2"></ellipse><ellipse cx="0" cy="-53" rx="20" ry="15.5" fill="#0f141c"></ellipse><g><polygon points="-26,-66 -34,-76 -26,-72" fill="#00f0ff"></polygon><polygon points="26,-66 34,-76 26,-72" fill="#00f0ff"></polygon><rect x="-24" y="-66" width="48" height="6" rx="2" fill="#00f0ff"></rect><circle cx="0" cy="-63" r="2.5" fill="#ffffff"></circle></g><g><ellipse cx="-8" cy="-57" rx="4.8" ry="4.4" fill="#00f0ff"></ellipse><ellipse cx="8" cy="-57" rx="4.8" ry="4.4" fill="#00f0ff"></ellipse></g><ellipse cx="0" cy="-46" rx="6.5" ry="3" fill="#00f0ff"></ellipse><g></g></g></g></svg></div></div><div class="space-y-0.5 flex-1 min-w-0"><div class="font-bold text-white text-xs truncate">Neon Enforcer</div><div class="text-[10px] text-purple-300 truncate flex items-center gap-1"><span>Theme:</span><span class="font-semibold truncate">Classic Charcoal Slate</span></div><div class="text-[10px] text-slate-400 truncate flex items-center gap-1"><span>Pet:</span><span class="text-pink-300 font-semibold truncate">None</span></div><div class="text-[10px] text-cyan-400 truncate flex items-center gap-1"><span>Props:</span><span class="font-bold">0<!-- --> equipped</span></div></div></div><button type="button" class="w-full flex items-center justify-center gap-1.5 py-1.5 px-3 rounded-lg bg-cyan-500/10 hover:bg-cyan-500/20 border border-cyan-500/30 text-cyan-300 text-xs font-semibold cursor-pointer transition-all shadow-sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5 text-cyan-400" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg><span>Open 3D Fitting Room</span></button></div></aside><main class="flex-1 flex flex-col h-full overflow-hidden bg-[#18181c]"><div class="px-6 py-4 border-b border-[#26262b] bg-[#151518] flex flex-wrap items-center justify-between gap-3 shrink-0"><div><div class="flex items-center gap-2"><span class="text-xs font-mono font-bold px-2 py-0.5 rounded bg-[#007acc]/20 text-cyan-300 border border-[#007acc]/40">CATALOG <!-- -->148</span><h1 class="text-base font-bold text-white flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-grid-3x3 lucide-grid lucide-grid-3-x-3 w-4 h-4 text-cyan-400" aria-hidden="true"><rect width="18" height="18" x="3" y="3" rx="2"></rect><path d="M3 9h18"></path><path d="M3 15h18"></path><path d="M9 3v18"></path><path d="M15 3v18"></path></svg><span>All 148 Tech Items &amp; 3D Effects</span></h1></div><p class="text-xs text-slate-400 mt-1">Collection of 148 high-precision 3D isometric items: cast shadows, directional lighting, and microchip details.</p></div><div class="flex items-center gap-2.5"><div class="flex items-center bg-[#202026] rounded-lg p-0.5 border border-[#2f2f38]"><button type="button" class="p-1.5 rounded text-xs transition-colors cursor-pointer bg-[#007acc] text-white" title="Standard grid layout (3-4 columns)"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-grid-3x3 lucide-grid lucide-grid-3-x-3 w-3.5 h-3.5" aria-hidden="true"><rect width="18" height="18" x="3" y="3" rx="2"></rect><path d="M3 9h18"></path><path d="M3 15h18"></path><path d="M9 3v18"></path><path d="M15 3v18"></path></svg></button><button type="button" class="p-1.5 rounded text-xs transition-colors cursor-pointer text-slate-400 hover:text-white" title="Compact grid layout (5-6 columns)"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-layout-grid w-3.5 h-3.5" aria-hidden="true"><rect width="7" height="7" x="3" y="3" rx="1"></rect><rect width="7" height="7" x="14" y="3" rx="1"></rect><rect width="7" height="7" x="14" y="14" rx="1"></rect><rect width="7" height="7" x="3" y="14" rx="1"></rect></svg></button></div><span class="text-xs font-mono text-cyan-300 bg-[#202026] px-3 py-1 rounded-md border border-[#2f2f38]">148 Items</span><button class="flex items-center gap-1.5 px-3 py-1 bg-gradient-to-r from-amber-500/20 to-amber-600/20 hover:from-amber-500/30 hover:to-amber-600/30 text-amber-300 border border-amber-500/40 rounded-md text-xs font-semibold cursor-pointer transition-all shadow-sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-coffee w-3.5 h-3.5" aria-hidden="true"><path d="M10 2v2"></path><path d="M14 2v2"></path><path d="M16 8a1 1 0 0 1 1 1v8a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4V9a1 1 0 0 1 1-1h14a4 4 0 1 1 0 8h-1"></path><path d="M6 2v2"></path></svg><span>Buff Dev</span></button></div></div><div class="px-6 py-2 bg-[#1b1b20] border-b border-[#26262b] flex items-center gap-1.5 overflow-x-auto text-xs shrink-0"><button class="flex items-center gap-1.5 px-3 py-1.5 rounded-lg font-medium transition-all cursor-pointer whitespace-nowrap bg-[#007acc] text-white font-bold shadow-sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-grid-3x3 lucide-grid lucide-grid-3-x-3 w-3.5 h-3.5 text-white" aria-hidden="true"><rect width="18" height="18" x="3" y="3" rx="2"></rect><path d="M3 9h18"></path><path d="M3 15h18"></path><path d="M9 3v18"></path><path d="M15 3v18"></path></svg><span>All (148)</span></button><button class="flex items-center gap-1.5 px-3 py-1.5 rounded-lg font-medium transition-all cursor-pointer whitespace-nowrap text-slate-400 hover:text-white hover:bg-[#25252e]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5 text-slate-400" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg><span>Fitting Room (3D)</span></button><button class="flex items-center gap-1.5 px-3 py-1.5 rounded-lg font-medium transition-all cursor-pointer whitespace-nowrap text-slate-400 hover:text-white hover:bg-[#25252e]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-palette w-3.5 h-3.5 text-slate-400" aria-hidden="true"><path d="M12 22a1 1 0 0 1 0-20 10 9 0 0 1 10 9 5 5 0 0 1-5 5h-2.25a1.75 1.75 0 0 0-1.4 2.8l.3.4a1.75 1.75 0 0 1-1.4 2.8z"></path><circle cx="13.5" cy="6.5" r=".5" fill="currentColor"></circle><circle cx="17.5" cy="10.5" r=".5" fill="currentColor"></circle><circle cx="6.5" cy="12.5" r=".5" fill="currentColor"></circle><circle cx="8.5" cy="7.5" r=".5" fill="currentColor"></circle></svg><span>Themes (10)</span></button><button class="flex items-center gap-1.5 px-3 py-1.5 rounded-lg font-medium transition-all cursor-pointer whitespace-nowrap text-slate-400 hover:text-white hover:bg-[#25252e]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-bot w-3.5 h-3.5 text-slate-400" aria-hidden="true"><path d="M12 8V4H8"></path><rect width="16" height="12" x="4" y="8" rx="2"></rect><path d="M2 14h2"></path><path d="M20 14h2"></path><path d="M15 13v2"></path><path d="M9 13v2"></path></svg><span>Skins (50)</span></button><button class="flex items-center gap-1.5 px-3 py-1.5 rounded-lg font-medium transition-all cursor-pointer whitespace-nowrap text-slate-400 hover:text-white hover:bg-[#25252e]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-laptop w-3.5 h-3.5 text-slate-400" aria-hidden="true"><path d="M18 5a2 2 0 0 1 2 2v8.526a2 2 0 0 0 .212.897l1.068 2.127a1 1 0 0 1-.9 1.45H3.62a1 1 0 0 1-.9-1.45l1.068-2.127A2 2 0 0 0 4 15.526V7a2 2 0 0 1 2-2z"></path><path d="M20.054 15.987H3.946"></path></svg><span>Props (35)</span></button><button class="flex items-center gap-1.5 px-3 py-1.5 rounded-lg font-medium transition-all cursor-pointer whitespace-nowrap text-slate-400 hover:text-white hover:bg-[#25252e]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-gift w-3.5 h-3.5 text-slate-400" aria-hidden="true"><path d="M12 7v14"></path><path d="M20 11v8a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2v-8"></path><path d="M7.5 7a1 1 0 0 1 0-5A4.8 8 0 0 1 12 7a4.8 8 0 0 1 4.5-5 1 1 0 0 1 0 5"></path><rect x="3" y="7" width="18" height="4" rx="1"></rect></svg><span>Pets (21)</span></button><button class="flex items-center gap-1.5 px-3 py-1.5 rounded-lg font-medium transition-all cursor-pointer whitespace-nowrap text-slate-400 hover:text-white hover:bg-[#25252e]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5 text-slate-400" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg><span>Auras (16)</span></button><button class="flex items-center gap-1.5 px-3 py-1.5 rounded-lg font-medium transition-all cursor-pointer whitespace-nowrap text-slate-400 hover:text-white hover:bg-[#25252e]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trophy w-3.5 h-3.5 text-slate-400" aria-hidden="true"><path d="M10 14.66V17a1 1 0 0 1-1 1 2 2 0 0 0-2 2v2"></path><path d="M14 14.66V17a1 1 0 0 0 1 1 2 2 0 0 1 2 2v2"></path><path d="M17.916 10H19.5A2.5 2.5 0 0 0 22 7.5V5a1 1 0 0 0-1-1h-3"></path><path d="M4 22h16"></path><path d="M6 9a6 6 0 0 0 12 0V3a1 1 0 0 0-1-1H7a1 1 0 0 0-1 1z"></path><path d="M6.084 10H4.5A2.5 2.5 0 0 1 2 7.5V5a1 1 0 0 1 1-1h3"></path></svg><span>Trophies (16)</span></button><button class="flex items-center gap-1.5 px-3 py-1.5 rounded-lg font-medium transition-all cursor-pointer whitespace-nowrap text-slate-400 hover:text-white hover:bg-[#25252e]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-volume-2 w-3.5 h-3.5 text-slate-400" aria-hidden="true"><path d="M11 4.702a.705.705 0 0 0-1.203-.498L6.413 7.587A1.4 1.4 0 0 1 5.416 8H3a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h2.416a1.4 1.4 0 0 1 .997.413l3.383 3.384A.705.705 0 0 0 11 19.298z"></path><path d="M16 9a5 5 0 0 1 0 6"></path><path d="M19.364 18.364a9 9 0 0 0 0-12.728"></path></svg><span>Ambient (6)</span></button><button class="flex items-center gap-1.5 px-3 py-1.5 rounded-lg font-medium transition-all cursor-pointer whitespace-nowrap text-slate-400 hover:text-white hover:bg-[#25252e]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-coffee w-3.5 h-3.5 text-slate-400" aria-hidden="true"><path d="M10 2v2"></path><path d="M14 2v2"></path><path d="M16 8a1 1 0 0 1 1 1v8a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4V9a1 1 0 0 1 1-1h14a4 4 0 1 1 0 8h-1"></path><path d="M6 2v2"></path></svg><span>VietQR Vault</span></button></div><div class="flex-1 overflow-y-auto p-4 sm:p-6"><div class="max-w-7xl mx-auto space-y-6"><section class="space-y-4"><div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-3.5 text-xs"><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#007acc] shadow-lg shadow-[#007acc]/15 ring-1 ring-[#007acc]"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #007acc25 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #007acc40)"><defs><linearGradient id="grad-theme_default-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#007acc"></stop><stop offset="100%" stop-color="#111827"></stop></linearGradient><linearGradient id="grad-theme_default-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#007acc"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-theme_default-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#007acc" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-theme_default" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g><defs><linearGradient id="grad-theme_default-floor-face" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#0b1018"></stop><stop offset="100%" stop-color="#161f2c"></stop></linearGradient></defs><polygon points="12,42 50,64 50,72 12,50" fill="#0b1018" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,64 88,42 88,50 50,72" fill="#161f2c" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,20 88,42 50,64 12,42" fill="url(#grad-theme_default-floor-face)" stroke="#263244" stroke-width="1.8"></polygon><line x1="31" y1="31" x2="69" y2="53" stroke="#1a2330" stroke-width="1" opacity="0.7"></line><line x1="69" y1="31" x2="31" y2="53" stroke="#1a2330" stroke-width="1" opacity="0.7"></line><line x1="40" y1="26" x2="78" y2="48" stroke="#1a2330" stroke-width="0.8" opacity="0.7"></line><line x1="60" y1="26" x2="22" y2="48" stroke="#1a2330" stroke-width="0.8" opacity="0.7"></line><polygon points="50,33 60,39 50,45 40,39" fill="#fde047" fill-opacity="0.25" stroke="#fde047" stroke-width="1"></polygon><circle cx="50" cy="39" r="2.5" fill="#fde047"></circle><polygon points="65,37 73,42 65,47 57,42" fill="#22d3ee" fill-opacity="0.2" stroke="#22d3ee" stroke-width="0.8"></polygon><polygon points="35,37 43,42 35,47 27,42" fill="#22d3ee" fill-opacity="0.2" stroke="#22d3ee" stroke-width="0.8"></polygon><circle cx="12" cy="42" r="1.5" fill="#263244"></circle><circle cx="88" cy="42" r="1.5" fill="#263244"></circle><circle cx="50" cy="20" r="1.5" fill="#263244"></circle><circle cx="50" cy="64" r="2" fill="#007acc"></circle><circle cx="50" cy="39" r="6" fill="#007acc" opacity="0.15"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#007acc;background-color:#007acc15;border-color:#007acc40">Classic Charcoal Slate</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Classic Charcoal Slate</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-emerald-500/20 text-emerald-300 border-emerald-500/40">free</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Default minimalist dark charcoal slate floor with subtle grid lines.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">EQUIPPED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" disabled="" class="px-3 py-1 rounded-lg text-xs font-semibold transition-all cursor-pointer bg-[#007acc]/20 text-[#007acc] border border-[#007acc]/30 opacity-70 cursor-default">Equipped</button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #a855f725 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #a855f740)"><defs><linearGradient id="grad-theme_cyberpunk-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#a855f7"></stop><stop offset="100%" stop-color="#111827"></stop></linearGradient><linearGradient id="grad-theme_cyberpunk-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#a855f7"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-theme_cyberpunk-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#a855f7" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-theme_cyberpunk" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g><defs><linearGradient id="grad-theme_cyberpunk-floor-face" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#0d071a"></stop><stop offset="100%" stop-color="#180b30"></stop></linearGradient></defs><polygon points="12,42 50,64 50,72 12,50" fill="#0d071a" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,64 88,42 88,50 50,72" fill="#180b30" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,20 88,42 50,64 12,42" fill="url(#grad-theme_cyberpunk-floor-face)" stroke="#a855f7" stroke-width="1.8"></polygon><line x1="31" y1="31" x2="69" y2="53" stroke="#6d28d9" stroke-width="1" opacity="0.75"></line><line x1="69" y1="31" x2="31" y2="53" stroke="#6d28d9" stroke-width="1" opacity="0.75"></line><line x1="40" y1="26" x2="78" y2="48" stroke="#6d28d9" stroke-width="0.8" opacity="0.75"></line><line x1="60" y1="26" x2="22" y2="48" stroke="#6d28d9" stroke-width="0.8" opacity="0.75"></line><polygon points="50,33 60,39 50,45 40,39" fill="#f43f5e" fill-opacity="0.25" stroke="#f43f5e" stroke-width="1"></polygon><circle cx="50" cy="39" r="2.5" fill="#f43f5e"></circle><polygon points="65,37 73,42 65,47 57,42" fill="#06b6d4" fill-opacity="0.2" stroke="#06b6d4" stroke-width="0.8"></polygon><polygon points="35,37 43,42 35,47 27,42" fill="#06b6d4" fill-opacity="0.2" stroke="#06b6d4" stroke-width="0.8"></polygon><circle cx="12" cy="42" r="1.5" fill="#a855f7"></circle><circle cx="88" cy="42" r="1.5" fill="#a855f7"></circle><circle cx="50" cy="20" r="1.5" fill="#a855f7"></circle><circle cx="50" cy="64" r="2" fill="#a855f7"></circle><circle cx="50" cy="39" r="6" fill="#a855f7" opacity="0.15"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#a855f7;background-color:#a855f715;border-color:#a855f740">Cyberpunk Neon Night</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Cyberpunk Neon Night</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-emerald-500/20 text-emerald-300 border-emerald-500/40">free</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Futuristic nighttime cyber alley with high-contrast violet grids and cyan radiance.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">UNLOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-3 py-1 rounded-lg text-xs font-semibold transition-all cursor-pointer bg-[#007acc] hover:bg-[#0088e0] text-white shadow-sm">Apply Floor</button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #10b98125 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #10b98140)"><defs><linearGradient id="grad-theme_matrix-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#10b981"></stop><stop offset="100%" stop-color="#111827"></stop></linearGradient><linearGradient id="grad-theme_matrix-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#10b981"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-theme_matrix-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#10b981" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-theme_matrix" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g><defs><linearGradient id="grad-theme_matrix-floor-face" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#030d07"></stop><stop offset="100%" stop-color="#071e11"></stop></linearGradient></defs><polygon points="12,42 50,64 50,72 12,50" fill="#030d07" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,64 88,42 88,50 50,72" fill="#071e11" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,20 88,42 50,64 12,42" fill="url(#grad-theme_matrix-floor-face)" stroke="#059669" stroke-width="1.8"></polygon><line x1="31" y1="31" x2="69" y2="53" stroke="#10b981" stroke-width="1" opacity="0.8"></line><line x1="69" y1="31" x2="31" y2="53" stroke="#10b981" stroke-width="1" opacity="0.8"></line><line x1="40" y1="26" x2="78" y2="48" stroke="#10b981" stroke-width="0.8" opacity="0.8"></line><line x1="60" y1="26" x2="22" y2="48" stroke="#10b981" stroke-width="0.8" opacity="0.8"></line><polygon points="50,33 60,39 50,45 40,39" fill="#34d399" fill-opacity="0.25" stroke="#34d399" stroke-width="1"></polygon><circle cx="50" cy="39" r="2.5" fill="#34d399"></circle><polygon points="65,37 73,42 65,47 57,42" fill="#10b981" fill-opacity="0.2" stroke="#10b981" stroke-width="0.8"></polygon><polygon points="35,37 43,42 35,47 27,42" fill="#10b981" fill-opacity="0.2" stroke="#10b981" stroke-width="0.8"></polygon><circle cx="12" cy="42" r="1.5" fill="#059669"></circle><circle cx="88" cy="42" r="1.5" fill="#059669"></circle><circle cx="50" cy="20" r="1.5" fill="#059669"></circle><circle cx="50" cy="64" r="2" fill="#10b981"></circle><circle cx="50" cy="39" r="6" fill="#10b981" opacity="0.15"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#10b981;background-color:#10b98115;border-color:#10b98140">Phosphor Matrix Terminal</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Phosphor Matrix Terminal</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-emerald-500/20 text-emerald-300 border-emerald-500/40">free</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Retro monochrome CRT terminal floor with glowing emerald phosphor matrix coordinates.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">UNLOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-3 py-1 rounded-lg text-xs font-semibold transition-all cursor-pointer bg-[#007acc] hover:bg-[#0088e0] text-white shadow-sm">Apply Floor</button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #f59e0b25 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #f59e0b40)"><defs><linearGradient id="grad-theme_cozy_loft-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#f59e0b"></stop><stop offset="100%" stop-color="#111827"></stop></linearGradient><linearGradient id="grad-theme_cozy_loft-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#f59e0b"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-theme_cozy_loft-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#f59e0b" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-theme_cozy_loft" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g><defs><linearGradient id="grad-theme_cozy_loft-floor-face" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#1c1612"></stop><stop offset="100%" stop-color="#2b211a"></stop></linearGradient></defs><polygon points="12,42 50,64 50,72 12,50" fill="#1c1612" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,64 88,42 88,50 50,72" fill="#2b211a" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,20 88,42 50,64 12,42" fill="url(#grad-theme_cozy_loft-floor-face)" stroke="#78563a" stroke-width="1.8"></polygon><line x1="31" y1="31" x2="69" y2="53" stroke="#453528" stroke-width="1" opacity="0.65"></line><line x1="69" y1="31" x2="31" y2="53" stroke="#453528" stroke-width="1" opacity="0.65"></line><line x1="40" y1="26" x2="78" y2="48" stroke="#453528" stroke-width="0.8" opacity="0.65"></line><line x1="60" y1="26" x2="22" y2="48" stroke="#453528" stroke-width="0.8" opacity="0.65"></line><polygon points="50,33 60,39 50,45 40,39" fill="#f59e0b" fill-opacity="0.25" stroke="#f59e0b" stroke-width="1"></polygon><circle cx="50" cy="39" r="2.5" fill="#f59e0b"></circle><polygon points="65,37 73,42 65,47 57,42" fill="#d97706" fill-opacity="0.2" stroke="#d97706" stroke-width="0.8"></polygon><polygon points="35,37 43,42 35,47 27,42" fill="#d97706" fill-opacity="0.2" stroke="#d97706" stroke-width="0.8"></polygon><circle cx="12" cy="42" r="1.5" fill="#78563a"></circle><circle cx="88" cy="42" r="1.5" fill="#78563a"></circle><circle cx="50" cy="20" r="1.5" fill="#78563a"></circle><circle cx="50" cy="64" r="2" fill="#f59e0b"></circle><circle cx="50" cy="39" r="6" fill="#f59e0b" opacity="0.15"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#f59e0b;background-color:#f59e0b15;border-color:#f59e0b40">Cozy Scandinavian Loft</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Cozy Scandinavian Loft</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">coffee</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Warm espresso and natural walnut wooden floor texture with amber ambient lighting.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #38bdf825 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #38bdf840)"><defs><linearGradient id="grad-theme_deep_space-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#38bdf8"></stop><stop offset="100%" stop-color="#111827"></stop></linearGradient><linearGradient id="grad-theme_deep_space-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#38bdf8"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-theme_deep_space-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#38bdf8" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-theme_deep_space" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g><defs><linearGradient id="grad-theme_deep_space-floor-face" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#050814"></stop><stop offset="100%" stop-color="#0e1429"></stop></linearGradient></defs><polygon points="12,42 50,64 50,72 12,50" fill="#050814" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,64 88,42 88,50 50,72" fill="#0e1429" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,20 88,42 50,64 12,42" fill="url(#grad-theme_deep_space-floor-face)" stroke="#0284c7" stroke-width="1.8"></polygon><line x1="31" y1="31" x2="69" y2="53" stroke="#38bdf8" stroke-width="1" opacity="0.65"></line><line x1="69" y1="31" x2="31" y2="53" stroke="#38bdf8" stroke-width="1" opacity="0.65"></line><line x1="40" y1="26" x2="78" y2="48" stroke="#38bdf8" stroke-width="0.8" opacity="0.65"></line><line x1="60" y1="26" x2="22" y2="48" stroke="#38bdf8" stroke-width="0.8" opacity="0.65"></line><polygon points="50,33 60,39 50,45 40,39" fill="#818cf8" fill-opacity="0.25" stroke="#818cf8" stroke-width="1"></polygon><circle cx="50" cy="39" r="2.5" fill="#818cf8"></circle><polygon points="65,37 73,42 65,47 57,42" fill="#38bdf8" fill-opacity="0.2" stroke="#38bdf8" stroke-width="0.8"></polygon><polygon points="35,37 43,42 35,47 27,42" fill="#38bdf8" fill-opacity="0.2" stroke="#38bdf8" stroke-width="0.8"></polygon><circle cx="12" cy="42" r="1.5" fill="#0284c7"></circle><circle cx="88" cy="42" r="1.5" fill="#0284c7"></circle><circle cx="50" cy="20" r="1.5" fill="#0284c7"></circle><circle cx="50" cy="64" r="2" fill="#38bdf8"></circle><circle cx="50" cy="39" r="6" fill="#38bdf8" opacity="0.15"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#38bdf8;background-color:#38bdf815;border-color:#38bdf840">Deep Cosmic Nebula</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Deep Cosmic Nebula</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">coffee</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Deep space observation deck with star cluster reflections and celestial indigo accents.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #94a3b825 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #94a3b840)"><defs><linearGradient id="grad-theme_cleanroom-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#94a3b8"></stop><stop offset="100%" stop-color="#111827"></stop></linearGradient><linearGradient id="grad-theme_cleanroom-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#94a3b8"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-theme_cleanroom-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#94a3b8" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-theme_cleanroom" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g><defs><linearGradient id="grad-theme_cleanroom-floor-face" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#141820"></stop><stop offset="100%" stop-color="#1e2430"></stop></linearGradient></defs><polygon points="12,42 50,64 50,72 12,50" fill="#141820" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,64 88,42 88,50 50,72" fill="#1e2430" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,20 88,42 50,64 12,42" fill="url(#grad-theme_cleanroom-floor-face)" stroke="#94a3b8" stroke-width="1.8"></polygon><line x1="31" y1="31" x2="69" y2="53" stroke="#475569" stroke-width="1" opacity="0.7"></line><line x1="69" y1="31" x2="31" y2="53" stroke="#475569" stroke-width="1" opacity="0.7"></line><line x1="40" y1="26" x2="78" y2="48" stroke="#475569" stroke-width="0.8" opacity="0.7"></line><line x1="60" y1="26" x2="22" y2="48" stroke="#475569" stroke-width="0.8" opacity="0.7"></line><polygon points="50,33 60,39 50,45 40,39" fill="#38bdf8" fill-opacity="0.25" stroke="#38bdf8" stroke-width="1"></polygon><circle cx="50" cy="39" r="2.5" fill="#38bdf8"></circle><polygon points="65,37 73,42 65,47 57,42" fill="#0ea5e9" fill-opacity="0.2" stroke="#0ea5e9" stroke-width="0.8"></polygon><polygon points="35,37 43,42 35,47 27,42" fill="#0ea5e9" fill-opacity="0.2" stroke="#0ea5e9" stroke-width="0.8"></polygon><circle cx="12" cy="42" r="1.5" fill="#94a3b8"></circle><circle cx="88" cy="42" r="1.5" fill="#94a3b8"></circle><circle cx="50" cy="20" r="1.5" fill="#94a3b8"></circle><circle cx="50" cy="64" r="2" fill="#94a3b8"></circle><circle cx="50" cy="39" r="6" fill="#94a3b8" opacity="0.15"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#94a3b8;background-color:#94a3b815;border-color:#94a3b840">Silicon Fab Cleanroom</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Silicon Fab Cleanroom</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">lunch</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">High-precision sterile semiconductor laboratory with sleek platinum and ice blue lines.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #f43f5e25 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #f43f5e40)"><defs><linearGradient id="grad-theme_synthwave-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#f43f5e"></stop><stop offset="100%" stop-color="#111827"></stop></linearGradient><linearGradient id="grad-theme_synthwave-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#f43f5e"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-theme_synthwave-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#f43f5e" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-theme_synthwave" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g><defs><linearGradient id="grad-theme_synthwave-floor-face" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#200720"></stop><stop offset="100%" stop-color="#360d2b"></stop></linearGradient></defs><polygon points="12,42 50,64 50,72 12,50" fill="#200720" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,64 88,42 88,50 50,72" fill="#360d2b" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,20 88,42 50,64 12,42" fill="url(#grad-theme_synthwave-floor-face)" stroke="#fb7185" stroke-width="1.8"></polygon><line x1="31" y1="31" x2="69" y2="53" stroke="#f43f5e" stroke-width="1" opacity="0.75"></line><line x1="69" y1="31" x2="31" y2="53" stroke="#f43f5e" stroke-width="1" opacity="0.75"></line><line x1="40" y1="26" x2="78" y2="48" stroke="#f43f5e" stroke-width="0.8" opacity="0.75"></line><line x1="60" y1="26" x2="22" y2="48" stroke="#f43f5e" stroke-width="0.8" opacity="0.75"></line><polygon points="50,33 60,39 50,45 40,39" fill="#fbbf24" fill-opacity="0.25" stroke="#fbbf24" stroke-width="1"></polygon><circle cx="50" cy="39" r="2.5" fill="#fbbf24"></circle><polygon points="65,37 73,42 65,47 57,42" fill="#ec4899" fill-opacity="0.2" stroke="#ec4899" stroke-width="0.8"></polygon><polygon points="35,37 43,42 35,47 27,42" fill="#ec4899" fill-opacity="0.2" stroke="#ec4899" stroke-width="0.8"></polygon><circle cx="12" cy="42" r="1.5" fill="#fb7185"></circle><circle cx="88" cy="42" r="1.5" fill="#fb7185"></circle><circle cx="50" cy="20" r="1.5" fill="#fb7185"></circle><circle cx="50" cy="64" r="2" fill="#f43f5e"></circle><circle cx="50" cy="39" r="6" fill="#f43f5e" opacity="0.15"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#f43f5e;background-color:#f43f5e15;border-color:#f43f5e40">Sunset Synthwave 80s</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Sunset Synthwave 80s</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">lunch</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Vibrant retro-wave sunset floor with magenta neon grid lines and warm golden horizon.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #6366f125 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #6366f140)"><defs><linearGradient id="grad-theme_quantum_void-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#6366f1"></stop><stop offset="100%" stop-color="#111827"></stop></linearGradient><linearGradient id="grad-theme_quantum_void-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#6366f1"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-theme_quantum_void-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#6366f1" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-theme_quantum_void" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g><defs><linearGradient id="grad-theme_quantum_void-floor-face" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#060608"></stop><stop offset="100%" stop-color="#0f0f14"></stop></linearGradient></defs><polygon points="12,42 50,64 50,72 12,50" fill="#060608" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,64 88,42 88,50 50,72" fill="#0f0f14" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,20 88,42 50,64 12,42" fill="url(#grad-theme_quantum_void-floor-face)" stroke="#4f46e5" stroke-width="1.8"></polygon><line x1="31" y1="31" x2="69" y2="53" stroke="#6366f1" stroke-width="1" opacity="0.75"></line><line x1="69" y1="31" x2="31" y2="53" stroke="#6366f1" stroke-width="1" opacity="0.75"></line><line x1="40" y1="26" x2="78" y2="48" stroke="#6366f1" stroke-width="0.8" opacity="0.75"></line><line x1="60" y1="26" x2="22" y2="48" stroke="#6366f1" stroke-width="0.8" opacity="0.75"></line><polygon points="50,33 60,39 50,45 40,39" fill="#a855f7" fill-opacity="0.25" stroke="#a855f7" stroke-width="1"></polygon><circle cx="50" cy="39" r="2.5" fill="#a855f7"></circle><polygon points="65,37 73,42 65,47 57,42" fill="#06b6d4" fill-opacity="0.2" stroke="#06b6d4" stroke-width="0.8"></polygon><polygon points="35,37 43,42 35,47 27,42" fill="#06b6d4" fill-opacity="0.2" stroke="#06b6d4" stroke-width="0.8"></polygon><circle cx="12" cy="42" r="1.5" fill="#4f46e5"></circle><circle cx="88" cy="42" r="1.5" fill="#4f46e5"></circle><circle cx="50" cy="20" r="1.5" fill="#4f46e5"></circle><circle cx="50" cy="64" r="2" fill="#6366f1"></circle><circle cx="50" cy="39" r="6" fill="#6366f1" opacity="0.15"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#6366f1;background-color:#6366f115;border-color:#6366f140">Quantum Obsidian Void</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Quantum Obsidian Void</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-purple-500/20 text-purple-300 border-purple-500/40">vip</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Deep obsidian black hole floor with holographic quantum interference lattice.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #f472b625 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #f472b640)"><defs><linearGradient id="grad-theme_sakura_cyber-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#f472b6"></stop><stop offset="100%" stop-color="#111827"></stop></linearGradient><linearGradient id="grad-theme_sakura_cyber-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#f472b6"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-theme_sakura_cyber-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#f472b6" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-theme_sakura_cyber" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g><defs><linearGradient id="grad-theme_sakura_cyber-floor-face" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#1f0c18"></stop><stop offset="100%" stop-color="#301326"></stop></linearGradient></defs><polygon points="12,42 50,64 50,72 12,50" fill="#1f0c18" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,64 88,42 88,50 50,72" fill="#301326" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,20 88,42 50,64 12,42" fill="url(#grad-theme_sakura_cyber-floor-face)" stroke="#ec4899" stroke-width="1.8"></polygon><line x1="31" y1="31" x2="69" y2="53" stroke="#f472b6" stroke-width="1" opacity="0.7"></line><line x1="69" y1="31" x2="31" y2="53" stroke="#f472b6" stroke-width="1" opacity="0.7"></line><line x1="40" y1="26" x2="78" y2="48" stroke="#f472b6" stroke-width="0.8" opacity="0.7"></line><line x1="60" y1="26" x2="22" y2="48" stroke="#f472b6" stroke-width="0.8" opacity="0.7"></line><polygon points="50,33 60,39 50,45 40,39" fill="#fda4af" fill-opacity="0.25" stroke="#fda4af" stroke-width="1"></polygon><circle cx="50" cy="39" r="2.5" fill="#fda4af"></circle><polygon points="65,37 73,42 65,47 57,42" fill="#f43f5e" fill-opacity="0.2" stroke="#f43f5e" stroke-width="0.8"></polygon><polygon points="35,37 43,42 35,47 27,42" fill="#f43f5e" fill-opacity="0.2" stroke="#f43f5e" stroke-width="0.8"></polygon><circle cx="12" cy="42" r="1.5" fill="#ec4899"></circle><circle cx="88" cy="42" r="1.5" fill="#ec4899"></circle><circle cx="50" cy="20" r="1.5" fill="#ec4899"></circle><circle cx="50" cy="64" r="2" fill="#f472b6"></circle><circle cx="50" cy="39" r="6" fill="#f472b6" opacity="0.15"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#f472b6;background-color:#f472b615;border-color:#f472b640">Sakura Cyber Garden</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Sakura Cyber Garden</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-purple-500/20 text-purple-300 border-purple-500/40">vip</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Neo-Tokyo cherry blossom sanctuary with vibrant soft pink particle gridlines.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #eab30825 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #eab30840)"><defs><linearGradient id="grad-theme_gold_vault-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#eab308"></stop><stop offset="100%" stop-color="#111827"></stop></linearGradient><linearGradient id="grad-theme_gold_vault-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#eab308"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-theme_gold_vault-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#eab308" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-theme_gold_vault" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g><defs><linearGradient id="grad-theme_gold_vault-floor-face" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#1a1608"></stop><stop offset="100%" stop-color="#2e250c"></stop></linearGradient></defs><polygon points="12,42 50,64 50,72 12,50" fill="#1a1608" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,64 88,42 88,50 50,72" fill="#2e250c" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,20 88,42 50,64 12,42" fill="url(#grad-theme_gold_vault-floor-face)" stroke="#facc15" stroke-width="1.8"></polygon><line x1="31" y1="31" x2="69" y2="53" stroke="#eab308" stroke-width="1" opacity="0.8"></line><line x1="69" y1="31" x2="31" y2="53" stroke="#eab308" stroke-width="1" opacity="0.8"></line><line x1="40" y1="26" x2="78" y2="48" stroke="#eab308" stroke-width="0.8" opacity="0.8"></line><line x1="60" y1="26" x2="22" y2="48" stroke="#eab308" stroke-width="0.8" opacity="0.8"></line><polygon points="50,33 60,39 50,45 40,39" fill="#fef08a" fill-opacity="0.25" stroke="#fef08a" stroke-width="1"></polygon><circle cx="50" cy="39" r="2.5" fill="#fef08a"></circle><polygon points="65,37 73,42 65,47 57,42" fill="#f59e0b" fill-opacity="0.2" stroke="#f59e0b" stroke-width="0.8"></polygon><polygon points="35,37 43,42 35,47 27,42" fill="#f59e0b" fill-opacity="0.2" stroke="#f59e0b" stroke-width="0.8"></polygon><circle cx="12" cy="42" r="1.5" fill="#facc15"></circle><circle cx="88" cy="42" r="1.5" fill="#facc15"></circle><circle cx="50" cy="20" r="1.5" fill="#facc15"></circle><circle cx="50" cy="64" r="2" fill="#eab308"></circle><circle cx="50" cy="39" r="6" fill="#eab308" opacity="0.15"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#eab308;background-color:#eab30815;border-color:#eab30840">Billion-Token Gold Vault</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Billion-Token Gold Vault</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-purple-500/20 text-purple-300 border-purple-500/40">vip</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Luxurious royal vault floor with gleaming gold circuitry and platinum accents.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#007acc] shadow-lg shadow-[#007acc]/15 ring-1 ring-[#007acc]"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #00f0ff25 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #00f0ff40)"><defs><linearGradient id="grad-skin_0-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#00f0ff"></stop><stop offset="100%" stop-color="#003b46"></stop></linearGradient><linearGradient id="grad-skin_0-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#00f0ff"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_0-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#00f0ff" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_0" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><polygon points="40,8 60,8 55,2 45,2" fill="#00f0ff"></polygon><line x1="50" y1="2" x2="50" y2="8" stroke="#ffffff" stroke-width="1.5"></line><polygon points="18,24 10,12 18,18" fill="#00f0ff"></polygon><polygon points="82,24 90,12 82,18" fill="#00f0ff"></polygon></g><g id="staff-3d-cyber-suit"><polygon points="28,54 72,54 65,74 35,74" fill="url(#grad-skin_0-left)" stroke="#00f0ff" stroke-width="1.4"></polygon><polygon points="30,54 44,66 38,66" fill="#090d16" stroke="#00f0ff" stroke-width="0.8"></polygon><polygon points="70,54 56,66 62,66" fill="#090d16" stroke="#00f0ff" stroke-width="0.8"></polygon><line x1="50" y1="54" x2="50" y2="70" stroke="#00f0ff" stroke-width="1.2"></line><path d="M 46 54 Q 50 63 54 54" stroke="#ffffff" stroke-width="1" fill="none" opacity="0.85"></path><rect x="46" y="61" width="8" height="10" rx="1" fill="#070a12" stroke="#00f0ff" stroke-width="0.8"></rect><rect x="47.5" y="62.5" width="5" height="3" fill="#00f0ff"></rect><line x1="47.5" y1="67" x2="52.5" y2="67" stroke="#ffffff" stroke-width="0.6"></line><rect x="47" y="71" width="6" height="3.5" rx="0.8" fill="#1e293b" stroke="#00f0ff" stroke-width="0.8"></rect></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#00f0ff" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#00f0ff" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#00f0ff" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#00f0ff"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#00f0ff" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#00f0ff"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#00f0ff;background-color:#00f0ff15;border-color:#00f0ff40">Neon Enforcer</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Neon Enforcer</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-emerald-500/20 text-emerald-300 border-emerald-500/40">free</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Standard tactical patrol armor with dual wing antennas, high-intensity neon cyan brow visor, and responsive reactor core.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">EQUIPPED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" disabled="" class="px-3 py-1 rounded-lg text-xs font-semibold transition-all cursor-pointer bg-[#007acc]/20 text-[#007acc] border border-[#007acc]/30 opacity-70 cursor-default">Equipped</button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #f43f5e25 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #f43f5e40)"><defs><linearGradient id="grad-skin_1-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#f43f5e"></stop><stop offset="100%" stop-color="#4c0519"></stop></linearGradient><linearGradient id="grad-skin_1-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#f43f5e"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_1-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#f43f5e" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_1" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><circle cx="60" cy="34" r="8" fill="none" stroke="#f43f5e" stroke-width="1.8"></circle><line x1="60" y1="22" x2="60" y2="46" stroke="#f43f5e" stroke-width="1" stroke-dasharray="1 2"></line><line x1="48" y1="34" x2="72" y2="34" stroke="#f43f5e" stroke-width="1" stroke-dasharray="1 2"></line><circle cx="60" cy="34" r="2.5" fill="#ff0000"></circle></g><g id="staff-3d-cyber-suit"><polygon points="28,54 72,54 65,74 35,74" fill="url(#grad-skin_1-left)" stroke="#f43f5e" stroke-width="1.4"></polygon><polygon points="30,54 44,66 38,66" fill="#090d16" stroke="#f43f5e" stroke-width="0.8"></polygon><polygon points="70,54 56,66 62,66" fill="#090d16" stroke="#f43f5e" stroke-width="0.8"></polygon><line x1="50" y1="54" x2="50" y2="70" stroke="#f43f5e" stroke-width="1.2"></line><path d="M 46 54 Q 50 63 54 54" stroke="#fb7185" stroke-width="1" fill="none" opacity="0.85"></path><rect x="46" y="61" width="8" height="10" rx="1" fill="#070a12" stroke="#f43f5e" stroke-width="0.8"></rect><rect x="47.5" y="62.5" width="5" height="3" fill="#f43f5e"></rect><line x1="47.5" y1="67" x2="52.5" y2="67" stroke="#ffffff" stroke-width="0.6"></line><rect x="47" y="71" width="6" height="3.5" rx="0.8" fill="#1e293b" stroke="#f43f5e" stroke-width="0.8"></rect></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#f43f5e" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#f43f5e" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#f43f5e" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#f43f5e"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#f43f5e" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#f43f5e"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#f43f5e;background-color:#f43f5e15;border-color:#f43f5e40">Crimson Striker</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Crimson Striker</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-emerald-500/20 text-emerald-300 border-emerald-500/40">free</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Lightweight urban reconnaissance armor with an asymmetric tactical monocle HUD and red crosshair targeting optic.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">UNLOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-3 py-1 rounded-lg text-xs font-semibold transition-all cursor-pointer bg-[#007acc] hover:bg-[#0088e0] text-white shadow-sm">Equip</button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #f59e0b25 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #f59e0b40)"><defs><linearGradient id="grad-skin_2-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#f59e0b"></stop><stop offset="100%" stop-color="#451a03"></stop></linearGradient><linearGradient id="grad-skin_2-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#f59e0b"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_2-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#f59e0b" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_2" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><rect x="22" y="18" width="56" height="10" rx="3" fill="#181824" stroke="#f59e0b" stroke-width="1.8"></rect><circle cx="32" cy="23" r="2.5" fill="#fef3c7"></circle><circle cx="68" cy="23" r="2.5" fill="#fef3c7"></circle></g><g id="staff-3d-cyber-suit"><polygon points="28,54 72,54 65,74 35,74" fill="url(#grad-skin_2-left)" stroke="#f59e0b" stroke-width="1.4"></polygon><polygon points="30,54 44,66 38,66" fill="#090d16" stroke="#f59e0b" stroke-width="0.8"></polygon><polygon points="70,54 56,66 62,66" fill="#090d16" stroke="#f59e0b" stroke-width="0.8"></polygon><line x1="50" y1="54" x2="50" y2="70" stroke="#f59e0b" stroke-width="1.2"></line><path d="M 46 54 Q 50 63 54 54" stroke="#fef3c7" stroke-width="1" fill="none" opacity="0.85"></path><rect x="46" y="61" width="8" height="10" rx="1" fill="#070a12" stroke="#f59e0b" stroke-width="0.8"></rect><rect x="47.5" y="62.5" width="5" height="3" fill="#f59e0b"></rect><line x1="47.5" y1="67" x2="52.5" y2="67" stroke="#ffffff" stroke-width="0.6"></line><rect x="47" y="71" width="6" height="3.5" rx="0.8" fill="#1e293b" stroke="#f59e0b" stroke-width="0.8"></rect></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#f59e0b" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#f59e0b" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#f59e0b" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#f59e0b"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#f59e0b" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#f59e0b"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#f59e0b;background-color:#f59e0b15;border-color:#f59e0b40">Amber Sentinel</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Amber Sentinel</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">coffee</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Heavy reinforced blast armor featuring a hardened ballistic neck gorget and dual flashing amber emergency strobes.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #a855f725 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #a855f740)"><defs><linearGradient id="grad-skin_3-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#a855f7"></stop><stop offset="100%" stop-color="#2e1065"></stop></linearGradient><linearGradient id="grad-skin_3-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#a855f7"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_3-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#a855f7" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_3" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><polygon points="28,20 16,2 34,14" fill="#a855f7" stroke="#2e1065" stroke-width="1"></polygon><polygon points="72,20 84,2 66,14" fill="#a855f7" stroke="#2e1065" stroke-width="1"></polygon><line x1="30" y1="16" x2="22" y2="6" stroke="#e9d5ff" stroke-width="1.5"></line><line x1="70" y1="16" x2="78" y2="6" stroke="#e9d5ff" stroke-width="1.5"></line></g><g id="staff-3d-cyber-suit"><polygon points="28,54 72,54 65,74 35,74" fill="url(#grad-skin_3-left)" stroke="#a855f7" stroke-width="1.4"></polygon><polygon points="30,54 44,66 38,66" fill="#090d16" stroke="#a855f7" stroke-width="0.8"></polygon><polygon points="70,54 56,66 62,66" fill="#090d16" stroke="#a855f7" stroke-width="0.8"></polygon><line x1="50" y1="54" x2="50" y2="70" stroke="#a855f7" stroke-width="1.2"></line><path d="M 46 54 Q 50 63 54 54" stroke="#e9d5ff" stroke-width="1" fill="none" opacity="0.85"></path><rect x="46" y="61" width="8" height="10" rx="1" fill="#070a12" stroke="#a855f7" stroke-width="0.8"></rect><rect x="47.5" y="62.5" width="5" height="3" fill="#a855f7"></rect><line x1="47.5" y1="67" x2="52.5" y2="67" stroke="#ffffff" stroke-width="0.6"></line><rect x="47" y="71" width="6" height="3.5" rx="0.8" fill="#1e293b" stroke="#a855f7" stroke-width="0.8"></rect></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#a855f7" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#a855f7" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#a855f7" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#a855f7"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#a855f7" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#a855f7"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#a855f7;background-color:#a855f715;border-color:#a855f740">Electric Specter</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Electric Specter</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">coffee</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Covert electronic warfare suit equipped with twin swept-back cyber horn sensor antennas and purple pulse conduits.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #fbbf2425 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #fbbf2440)"><defs><linearGradient id="grad-skin_4-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#fbbf24"></stop><stop offset="100%" stop-color="#78350f"></stop></linearGradient><linearGradient id="grad-skin_4-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#fbbf24"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_4-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#fbbf24" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_4" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g fill="#fbbf24"><polygon points="32,18 36,4 42,16"></polygon><polygon points="46,14 50,0 54,14"></polygon><polygon points="58,16 64,4 68,18"></polygon><circle cx="50" cy="18" r="3" fill="#ffffff"></circle></g><g id="staff-3d-cyber-suit"><polygon points="28,54 72,54 65,74 35,74" fill="url(#grad-skin_4-left)" stroke="#fbbf24" stroke-width="1.4"></polygon><polygon points="30,54 44,66 38,66" fill="#090d16" stroke="#fbbf24" stroke-width="0.8"></polygon><polygon points="70,54 56,66 62,66" fill="#090d16" stroke="#fbbf24" stroke-width="0.8"></polygon><line x1="50" y1="54" x2="50" y2="70" stroke="#fbbf24" stroke-width="1.2"></line><path d="M 46 54 Q 50 63 54 54" stroke="#ffffff" stroke-width="1" fill="none" opacity="0.85"></path><rect x="46" y="61" width="8" height="10" rx="1" fill="#070a12" stroke="#fbbf24" stroke-width="0.8"></rect><rect x="47.5" y="62.5" width="5" height="3" fill="#fbbf24"></rect><line x1="47.5" y1="67" x2="52.5" y2="67" stroke="#ffffff" stroke-width="0.6"></line><rect x="47" y="71" width="6" height="3.5" rx="0.8" fill="#1e293b" stroke="#fbbf24" stroke-width="0.8"></rect></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#fbbf24" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#fbbf24" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#fbbf24" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#fbbf24"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#fbbf24" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#fbbf24"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#fbbf24;background-color:#fbbf2415;border-color:#fbbf2440">Gilded Vanguard</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Gilded Vanguard</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">coffee</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Ceremonial commander battlesuit crowned with triple golden heatsink radiators and an auric gold arc reactor.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #84cc1625 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #84cc1640)"><defs><linearGradient id="grad-skin_5-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#84cc16"></stop><stop offset="100%" stop-color="#1a2e05"></stop></linearGradient><linearGradient id="grad-skin_5-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#84cc16"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_5-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#84cc16" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_5" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><circle cx="34" cy="46" r="7" fill="#181824" stroke="#84cc16" stroke-width="1.6"></circle><circle cx="66" cy="46" r="7" fill="#181824" stroke="#84cc16" stroke-width="1.6"></circle><circle cx="34" cy="46" r="3" fill="#84cc16"></circle><circle cx="66" cy="46" r="3" fill="#84cc16"></circle><rect x="42" y="44" width="16" height="6" rx="2" fill="#0f0f18" stroke="#84cc16" stroke-width="1"></rect></g><g id="staff-3d-cyber-suit"><polygon points="28,54 72,54 65,74 35,74" fill="url(#grad-skin_5-left)" stroke="#84cc16" stroke-width="1.4"></polygon><polygon points="30,54 44,66 38,66" fill="#090d16" stroke="#84cc16" stroke-width="0.8"></polygon><polygon points="70,54 56,66 62,66" fill="#090d16" stroke="#84cc16" stroke-width="0.8"></polygon><line x1="50" y1="54" x2="50" y2="70" stroke="#84cc16" stroke-width="1.2"></line><path d="M 46 54 Q 50 63 54 54" stroke="#bef264" stroke-width="1" fill="none" opacity="0.85"></path><rect x="46" y="61" width="8" height="10" rx="1" fill="#070a12" stroke="#84cc16" stroke-width="0.8"></rect><rect x="47.5" y="62.5" width="5" height="3" fill="#84cc16"></rect><line x1="47.5" y1="67" x2="52.5" y2="67" stroke="#ffffff" stroke-width="0.6"></line><rect x="47" y="71" width="6" height="3.5" rx="0.8" fill="#1e293b" stroke="#84cc16" stroke-width="0.8"></rect></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#84cc16" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#84cc16" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#84cc16" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#84cc16"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#84cc16" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#84cc16"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#84cc16;background-color:#84cc1615;border-color:#84cc1640">Acid Hazard</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Acid Hazard</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">lunch</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Contaminated zone exosuit with dual canister filtration respirators and high-visibility yellow hazard chevron stripes.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #38bdf825 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #38bdf840)"><defs><linearGradient id="grad-skin_6-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#38bdf8"></stop><stop offset="100%" stop-color="#082f49"></stop></linearGradient><linearGradient id="grad-skin_6-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#38bdf8"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_6-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#38bdf8" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_6" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><polygon points="30,28 40,24 48,28 48,40 40,44 30,40" fill="#0c4a6e" stroke="#38bdf8" stroke-width="1.8"></polygon><polygon points="52,28 60,24 70,28 70,40 60,44 52,40" fill="#0c4a6e" stroke="#38bdf8" stroke-width="1.8"></polygon><circle cx="39" cy="34" r="3" fill="#e0f2fe"></circle><circle cx="61" cy="34" r="3" fill="#e0f2fe"></circle></g><g id="staff-3d-cyber-suit"><polygon points="28,54 72,54 65,74 35,74" fill="url(#grad-skin_6-left)" stroke="#38bdf8" stroke-width="1.4"></polygon><polygon points="30,54 44,66 38,66" fill="#090d16" stroke="#38bdf8" stroke-width="0.8"></polygon><polygon points="70,54 56,66 62,66" fill="#090d16" stroke="#38bdf8" stroke-width="0.8"></polygon><line x1="50" y1="54" x2="50" y2="70" stroke="#38bdf8" stroke-width="1.2"></line><path d="M 46 54 Q 50 63 54 54" stroke="#e0f2fe" stroke-width="1" fill="none" opacity="0.85"></path><rect x="46" y="61" width="8" height="10" rx="1" fill="#070a12" stroke="#38bdf8" stroke-width="0.8"></rect><rect x="47.5" y="62.5" width="5" height="3" fill="#38bdf8"></rect><line x1="47.5" y1="67" x2="52.5" y2="67" stroke="#ffffff" stroke-width="0.6"></line><rect x="47" y="71" width="6" height="3.5" rx="0.8" fill="#1e293b" stroke="#38bdf8" stroke-width="0.8"></rect></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#38bdf8" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#38bdf8" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#38bdf8" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#38bdf8"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#38bdf8" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#38bdf8"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#38bdf8;background-color:#38bdf815;border-color:#38bdf840">Frost Phantom</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Frost Phantom</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">lunch</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Cryo-adapted high altitude armor featuring hexagonal dual prism goggles with icy blue internal laser refraction.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #e11d4825 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #e11d4840)"><defs><linearGradient id="grad-skin_7-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#e11d48"></stop><stop offset="100%" stop-color="#18181b"></stop></linearGradient><linearGradient id="grad-skin_7-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#e11d48"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_7-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#e11d48" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_7" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><path d="M 24 18 Q 50 -6 76 18 Q 50 6 24 18 Z" fill="#e11d48" stroke="#18181b" stroke-width="1.2"></path><circle cx="50" cy="10" r="3.5" fill="#fda4af"></circle></g><g id="staff-3d-cyber-suit"><polygon points="28,54 72,54 65,74 35,74" fill="url(#grad-skin_7-left)" stroke="#e11d48" stroke-width="1.4"></polygon><polygon points="30,54 44,66 38,66" fill="#090d16" stroke="#e11d48" stroke-width="0.8"></polygon><polygon points="70,54 56,66 62,66" fill="#090d16" stroke="#e11d48" stroke-width="0.8"></polygon><line x1="50" y1="54" x2="50" y2="70" stroke="#e11d48" stroke-width="1.2"></line><path d="M 46 54 Q 50 63 54 54" stroke="#fda4af" stroke-width="1" fill="none" opacity="0.85"></path><rect x="46" y="61" width="8" height="10" rx="1" fill="#070a12" stroke="#e11d48" stroke-width="0.8"></rect><rect x="47.5" y="62.5" width="5" height="3" fill="#e11d48"></rect><line x1="47.5" y1="67" x2="52.5" y2="67" stroke="#ffffff" stroke-width="0.6"></line><rect x="47" y="71" width="6" height="3.5" rx="0.8" fill="#1e293b" stroke="#e11d48" stroke-width="0.8"></rect></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#e11d48" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#e11d48" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#e11d48" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#e11d48"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#e11d48" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#e11d48"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#e11d48;background-color:#e11d4815;border-color:#e11d4840">Obsidian Ronin</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Obsidian Ronin</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">lunch</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Cybernetic kabuto armor with a forward-swept golden horn crest and dual neck-collar tantō blade sheaths.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #ff005525 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #ff005540)"><defs><linearGradient id="grad-skin_8-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#ff0055"></stop><stop offset="100%" stop-color="#3f0015"></stop></linearGradient><linearGradient id="grad-skin_8-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ff0055"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_8-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ff0055" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_8" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g stroke-linecap="round"><line x1="28" y1="16" x2="16" y2="2" stroke="#ff0055" stroke-width="3.5"></line><line x1="72" y1="16" x2="84" y2="2" stroke="#ff0055" stroke-width="3.5"></line><line x1="34" y1="18" x2="26" y2="6" stroke="#ffaa00" stroke-width="2"></line><line x1="66" y1="18" x2="74" y2="6" stroke="#ffaa00" stroke-width="2"></line></g><g id="staff-3d-cyber-suit"><polygon points="28,54 72,54 65,74 35,74" fill="url(#grad-skin_8-left)" stroke="#ff0055" stroke-width="1.4"></polygon><polygon points="30,54 44,66 38,66" fill="#090d16" stroke="#ff0055" stroke-width="0.8"></polygon><polygon points="70,54 56,66 62,66" fill="#090d16" stroke="#ff0055" stroke-width="0.8"></polygon><line x1="50" y1="54" x2="50" y2="70" stroke="#ff0055" stroke-width="1.2"></line><path d="M 46 54 Q 50 63 54 54" stroke="#ffaa00" stroke-width="1" fill="none" opacity="0.85"></path><rect x="46" y="61" width="8" height="10" rx="1" fill="#070a12" stroke="#ff0055" stroke-width="0.8"></rect><rect x="47.5" y="62.5" width="5" height="3" fill="#ff0055"></rect><line x1="47.5" y1="67" x2="52.5" y2="67" stroke="#ffffff" stroke-width="0.6"></line><rect x="47" y="71" width="6" height="3.5" rx="0.8" fill="#1e293b" stroke="#ff0055" stroke-width="0.8"></rect></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#ff0055" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#ff0055" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#ff0055" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#ff0055"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#ff0055" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#ff0055"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#ff0055;background-color:#ff005515;border-color:#ff005540">Solar Overdrive</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Solar Overdrive</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-purple-500/20 text-purple-300 border-purple-500/40">vip</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Hyper-clocked prototype suit featuring swept aerodynamic cooling fins glowing red-hot with plasma exhaust venting.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #ffffff25 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #ffffff40)"><defs><linearGradient id="grad-skin_9-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#ffffff"></stop><stop offset="100%" stop-color="#00f0ff"></stop></linearGradient><linearGradient id="grad-skin_9-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_9-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_9" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><ellipse cx="50" cy="18" rx="34" ry="14" fill="none" stroke="#ffffff" stroke-width="1.8" stroke-dasharray="5 3"></ellipse><circle cx="50" cy="4" r="4" fill="#38bdf8"></circle></g><g id="staff-3d-cyber-suit"><polygon points="28,54 72,54 65,74 35,74" fill="url(#grad-skin_9-left)" stroke="#ffffff" stroke-width="1.4"></polygon><polygon points="30,54 44,66 38,66" fill="#090d16" stroke="#ffffff" stroke-width="0.8"></polygon><polygon points="70,54 56,66 62,66" fill="#090d16" stroke="#ffffff" stroke-width="0.8"></polygon><line x1="50" y1="54" x2="50" y2="70" stroke="#ffffff" stroke-width="1.2"></line><path d="M 46 54 Q 50 63 54 54" stroke="#38bdf8" stroke-width="1" fill="none" opacity="0.85"></path><rect x="46" y="61" width="8" height="10" rx="1" fill="#070a12" stroke="#ffffff" stroke-width="0.8"></rect><rect x="47.5" y="62.5" width="5" height="3" fill="#ffffff"></rect><line x1="47.5" y1="67" x2="52.5" y2="67" stroke="#ffffff" stroke-width="0.6"></line><rect x="47" y="71" width="6" height="3.5" rx="0.8" fill="#1e293b" stroke="#ffffff" stroke-width="0.8"></rect></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#ffffff" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#ffffff" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#ffffff" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#ffffff"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#ffffff" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#ffffff"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#ffffff;background-color:#ffffff15;border-color:#ffffff40">Quantum Sovereign</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Quantum Sovereign</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-purple-500/20 text-purple-300 border-purple-500/40">vip</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Legendary supreme operative armor featuring a floating crystalline holographic shroud and dual quantum emitters.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #3b82f625 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #3b82f640)"><defs><linearGradient id="grad-skin_10-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#3b82f6"></stop><stop offset="100%" stop-color="#172554"></stop></linearGradient><linearGradient id="grad-skin_10-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#3b82f6"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_10-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#3b82f6" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_10" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><polygon points="20,-2 26,-6 50,14 74,-6 80,-2 50,20" fill="#3b82f6" stroke="#172554" stroke-width="1.2"></polygon><polygon points="46,18 50,10 54,18 50,22" fill="#ef4444"></polygon></g><g id="staff-3d-mecha-pilot"><polygon points="26,54 74,54 67,76 33,76" fill="#18181b" stroke="#3b82f6" stroke-width="1.6"></polygon><polygon points="22,54 30,52 28,62 20,62" fill="#27272a" stroke="#3b82f6" stroke-width="1"></polygon><polygon points="78,54 70,52 72,62 80,62" fill="#27272a" stroke="#3b82f6" stroke-width="1"></polygon><polygon points="36,57 41,57 37,62 32,62" fill="#eab308"></polygon><polygon points="43,57 48,57 44,62 39,62" fill="#18181b"></polygon><polygon points="52,57 57,57 53,62 48,62" fill="#eab308"></polygon><polygon points="59,57 64,57 60,62 55,62" fill="#18181b"></polygon><line x1="38" y1="54" x2="39" y2="76" stroke="#3b82f6" stroke-width="1.6"></line><line x1="62" y1="54" x2="61" y2="76" stroke="#3b82f6" stroke-width="1.6"></line><circle cx="50" cy="67" r="4.5" fill="#09090b" stroke="#3b82f6" stroke-width="1.2"></circle><circle cx="50" cy="67" r="2.5" fill="#3b82f6"></circle><line x1="46" y1="67" x2="54" y2="67" stroke="#ffffff" stroke-width="0.8"></line><line x1="50" y1="63" x2="50" y2="71" stroke="#ffffff" stroke-width="0.8"></line></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#3b82f6" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#3b82f6" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#3b82f6" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#3b82f6"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#3b82f6" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#3b82f6"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#3b82f6;background-color:#3b82f615;border-color:#3b82f640">Apex Frame</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Apex Frame</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-emerald-500/20 text-emerald-300 border-emerald-500/40">free</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Iconic military mobile suit frame featuring a prominent golden V-Fin antenna crest and reinforced chin guard.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">UNLOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-3 py-1 rounded-lg text-xs font-semibold transition-all cursor-pointer bg-[#007acc] hover:bg-[#0088e0] text-white shadow-sm">Equip</button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #94a3b825 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #94a3b840)"><defs><linearGradient id="grad-skin_11-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#94a3b8"></stop><stop offset="100%" stop-color="#1e293b"></stop></linearGradient><linearGradient id="grad-skin_11-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#94a3b8"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_11-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#94a3b8" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_11" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><rect x="22" y="22" width="56" height="18" rx="3" fill="#0f172a" stroke="#94a3b8" stroke-width="2"></rect><circle cx="28" cy="8" r="4" fill="#fde047" stroke="#94a3b8" stroke-width="1.5"></circle><circle cx="72" cy="8" r="4" fill="#fde047" stroke="#94a3b8" stroke-width="1.5"></circle><rect x="8" y="48" width="16" height="12" rx="3" fill="#1a1a26" stroke="#94a3b8" stroke-width="1.5"></rect><rect x="76" y="48" width="16" height="12" rx="3" fill="#1a1a26" stroke="#94a3b8" stroke-width="1.5"></rect></g><g id="staff-3d-mecha-pilot"><polygon points="26,54 74,54 67,76 33,76" fill="#18181b" stroke="#94a3b8" stroke-width="1.6"></polygon><polygon points="22,54 30,52 28,62 20,62" fill="#27272a" stroke="#94a3b8" stroke-width="1"></polygon><polygon points="78,54 70,52 72,62 80,62" fill="#27272a" stroke="#94a3b8" stroke-width="1"></polygon><polygon points="36,57 41,57 37,62 32,62" fill="#eab308"></polygon><polygon points="43,57 48,57 44,62 39,62" fill="#18181b"></polygon><polygon points="52,57 57,57 53,62 48,62" fill="#eab308"></polygon><polygon points="59,57 64,57 60,62 55,62" fill="#18181b"></polygon><line x1="38" y1="54" x2="39" y2="76" stroke="#94a3b8" stroke-width="1.6"></line><line x1="62" y1="54" x2="61" y2="76" stroke="#94a3b8" stroke-width="1.6"></line><circle cx="50" cy="67" r="4.5" fill="#09090b" stroke="#94a3b8" stroke-width="1.2"></circle><circle cx="50" cy="67" r="2.5" fill="#94a3b8"></circle><line x1="46" y1="67" x2="54" y2="67" stroke="#ffffff" stroke-width="0.8"></line><line x1="50" y1="63" x2="50" y2="71" stroke="#ffffff" stroke-width="0.8"></line></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#94a3b8" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#94a3b8" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#94a3b8" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#94a3b8"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#94a3b8" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#94a3b8"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#94a3b8;background-color:#94a3b815;border-color:#94a3b840">Heavy Colossus</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Heavy Colossus</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-emerald-500/20 text-emerald-300 border-emerald-500/40">free</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Super-heavy trench battlesuit equipped with a massive armored blast visor, dual searchlights, and boxy shoulder pods.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">UNLOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-3 py-1 rounded-lg text-xs font-semibold transition-all cursor-pointer bg-[#007acc] hover:bg-[#0088e0] text-white shadow-sm">Equip</button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #9333ea25 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #9333ea40)"><defs><linearGradient id="grad-skin_12-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#9333ea"></stop><stop offset="100%" stop-color="#22c55e"></stop></linearGradient><linearGradient id="grad-skin_12-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#9333ea"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_12-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#9333ea" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_12" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><polygon points="47,18 50,-14 53,18" fill="#9333ea" stroke="#22c55e" stroke-width="1"></polygon><rect x="12" y="32" width="6" height="24" rx="2" fill="#9333ea" stroke="#22c55e" stroke-width="1"></rect><rect x="82" y="32" width="6" height="24" rx="2" fill="#9333ea" stroke="#22c55e" stroke-width="1"></rect></g><g id="staff-3d-mecha-pilot"><polygon points="26,54 74,54 67,76 33,76" fill="#18181b" stroke="#9333ea" stroke-width="1.6"></polygon><polygon points="22,54 30,52 28,62 20,62" fill="#27272a" stroke="#9333ea" stroke-width="1"></polygon><polygon points="78,54 70,52 72,62 80,62" fill="#27272a" stroke="#9333ea" stroke-width="1"></polygon><polygon points="36,57 41,57 37,62 32,62" fill="#eab308"></polygon><polygon points="43,57 48,57 44,62 39,62" fill="#18181b"></polygon><polygon points="52,57 57,57 53,62 48,62" fill="#eab308"></polygon><polygon points="59,57 64,57 60,62 55,62" fill="#18181b"></polygon><line x1="38" y1="54" x2="39" y2="76" stroke="#9333ea" stroke-width="1.6"></line><line x1="62" y1="54" x2="61" y2="76" stroke="#9333ea" stroke-width="1.6"></line><circle cx="50" cy="67" r="4.5" fill="#09090b" stroke="#9333ea" stroke-width="1.2"></circle><circle cx="50" cy="67" r="2.5" fill="#9333ea"></circle><line x1="46" y1="67" x2="54" y2="67" stroke="#ffffff" stroke-width="0.8"></line><line x1="50" y1="63" x2="50" y2="71" stroke="#ffffff" stroke-width="0.8"></line></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#9333ea" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#9333ea" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#9333ea" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#9333ea"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#9333ea" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#9333ea"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#9333ea;background-color:#9333ea15;border-color:#9333ea40">Berserk EVA</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Berserk EVA</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">coffee</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Unstable biomechanical pilot suit sporting a tall frontal unicorn horn blade, neon green teeth slits, and shoulder pylons.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #d9770625 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #d9770640)"><defs><linearGradient id="grad-skin_13-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#d97706"></stop><stop offset="100%" stop-color="#451a03"></stop></linearGradient><linearGradient id="grad-skin_13-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#d97706"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_13-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#d97706" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_13" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><rect x="30" y="30" width="40" height="20" rx="3" fill="#18181b" stroke="#d97706" stroke-width="1.8"></rect><line x1="38" y1="30" x2="38" y2="50" stroke="#d97706" stroke-width="1.5"></line><line x1="46" y1="30" x2="46" y2="50" stroke="#d97706" stroke-width="1.5"></line><line x1="54" y1="30" x2="54" y2="50" stroke="#d97706" stroke-width="1.5"></line><line x1="62" y1="30" x2="62" y2="50" stroke="#d97706" stroke-width="1.5"></line><rect x="22" y="-2" width="6" height="22" rx="1" fill="#27272a" stroke="#d97706" stroke-width="1"></rect><rect x="72" y="-2" width="6" height="22" rx="1" fill="#27272a" stroke="#d97706" stroke-width="1"></rect></g><g id="staff-3d-mecha-pilot"><polygon points="26,54 74,54 67,76 33,76" fill="#18181b" stroke="#d97706" stroke-width="1.6"></polygon><polygon points="22,54 30,52 28,62 20,62" fill="#27272a" stroke="#d97706" stroke-width="1"></polygon><polygon points="78,54 70,52 72,62 80,62" fill="#27272a" stroke="#d97706" stroke-width="1"></polygon><polygon points="36,57 41,57 37,62 32,62" fill="#eab308"></polygon><polygon points="43,57 48,57 44,62 39,62" fill="#18181b"></polygon><polygon points="52,57 57,57 53,62 48,62" fill="#eab308"></polygon><polygon points="59,57 64,57 60,62 55,62" fill="#18181b"></polygon><line x1="38" y1="54" x2="39" y2="76" stroke="#d97706" stroke-width="1.6"></line><line x1="62" y1="54" x2="61" y2="76" stroke="#d97706" stroke-width="1.6"></line><circle cx="50" cy="67" r="4.5" fill="#09090b" stroke="#d97706" stroke-width="1.2"></circle><circle cx="50" cy="67" r="2.5" fill="#d97706"></circle><line x1="46" y1="67" x2="54" y2="67" stroke="#ffffff" stroke-width="0.8"></line><line x1="50" y1="63" x2="50" y2="71" stroke="#ffffff" stroke-width="0.8"></line></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#d97706" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#d97706" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#d97706" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#d97706"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#d97706" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#d97706"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#d97706;background-color:#d9770615;border-color:#d9770640">Iron Juggernaut</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Iron Juggernaut</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">coffee</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Hardened mining rig armor with a heavy industrial cage grille faceplate and twin vertical smokestack exhausts.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #dc262625 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #dc262640)"><defs><linearGradient id="grad-skin_14-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#dc2626"></stop><stop offset="100%" stop-color="#450a0a"></stop></linearGradient><linearGradient id="grad-skin_14-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#dc2626"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_14-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#dc2626" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_14" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><rect x="6" y="38" width="14" height="18" rx="3" fill="#1c1917" stroke="#dc2626" stroke-width="1.5"></rect><circle cx="13" cy="44" r="2" fill="#ef4444"></circle><circle cx="13" cy="50" r="2" fill="#ef4444"></circle><rect x="80" y="38" width="14" height="18" rx="3" fill="#1c1917" stroke="#dc2626" stroke-width="1.5"></rect><circle cx="87" cy="44" r="2" fill="#ef4444"></circle><circle cx="87" cy="50" r="2" fill="#ef4444"></circle></g><g id="staff-3d-mecha-pilot"><polygon points="26,54 74,54 67,76 33,76" fill="#18181b" stroke="#dc2626" stroke-width="1.6"></polygon><polygon points="22,54 30,52 28,62 20,62" fill="#27272a" stroke="#dc2626" stroke-width="1"></polygon><polygon points="78,54 70,52 72,62 80,62" fill="#27272a" stroke="#dc2626" stroke-width="1"></polygon><polygon points="36,57 41,57 37,62 32,62" fill="#eab308"></polygon><polygon points="43,57 48,57 44,62 39,62" fill="#18181b"></polygon><polygon points="52,57 57,57 53,62 48,62" fill="#eab308"></polygon><polygon points="59,57 64,57 60,62 55,62" fill="#18181b"></polygon><line x1="38" y1="54" x2="39" y2="76" stroke="#dc2626" stroke-width="1.6"></line><line x1="62" y1="54" x2="61" y2="76" stroke="#dc2626" stroke-width="1.6"></line><circle cx="50" cy="67" r="4.5" fill="#09090b" stroke="#dc2626" stroke-width="1.2"></circle><circle cx="50" cy="67" r="2.5" fill="#dc2626"></circle><line x1="46" y1="67" x2="54" y2="67" stroke="#ffffff" stroke-width="0.8"></line><line x1="50" y1="63" x2="50" y2="71" stroke="#ffffff" stroke-width="0.8"></line></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#dc2626" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#dc2626" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#dc2626" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#dc2626"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#dc2626" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#dc2626"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#dc2626;background-color:#dc262615;border-color:#dc262640">Crimson Warmachine</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Crimson Warmachine</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">coffee</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Artillery command rig with twin shoulder-mounted micro-missile pods and a crimson HUD targeting scope.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #06b6d425 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #06b6d440)"><defs><linearGradient id="grad-skin_15-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#06b6d4"></stop><stop offset="100%" stop-color="#083344"></stop></linearGradient><linearGradient id="grad-skin_15-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#06b6d4"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_15-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#06b6d4" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_15" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g stroke="#06b6d4" stroke-width="2"><line x1="24" y1="18" x2="16" y2="-4"></line><line x1="36" y1="14" x2="32" y2="-8"></line><line x1="64" y1="14" x2="68" y2="-8"></line><line x1="76" y1="18" x2="84" y2="-4"></line><circle cx="16" cy="-4" r="2.5" fill="#67e8f9" stroke="none"></circle><circle cx="32" cy="-8" r="2.5" fill="#67e8f9" stroke="none"></circle><circle cx="68" cy="-8" r="2.5" fill="#67e8f9" stroke="none"></circle><circle cx="84" cy="-4" r="2.5" fill="#67e8f9" stroke="none"></circle></g><g id="staff-3d-mecha-pilot"><polygon points="26,54 74,54 67,76 33,76" fill="#18181b" stroke="#06b6d4" stroke-width="1.6"></polygon><polygon points="22,54 30,52 28,62 20,62" fill="#27272a" stroke="#06b6d4" stroke-width="1"></polygon><polygon points="78,54 70,52 72,62 80,62" fill="#27272a" stroke="#06b6d4" stroke-width="1"></polygon><polygon points="36,57 41,57 37,62 32,62" fill="#eab308"></polygon><polygon points="43,57 48,57 44,62 39,62" fill="#18181b"></polygon><polygon points="52,57 57,57 53,62 48,62" fill="#eab308"></polygon><polygon points="59,57 64,57 60,62 55,62" fill="#18181b"></polygon><line x1="38" y1="54" x2="39" y2="76" stroke="#06b6d4" stroke-width="1.6"></line><line x1="62" y1="54" x2="61" y2="76" stroke="#06b6d4" stroke-width="1.6"></line><circle cx="50" cy="67" r="4.5" fill="#09090b" stroke="#06b6d4" stroke-width="1.2"></circle><circle cx="50" cy="67" r="2.5" fill="#06b6d4"></circle><line x1="46" y1="67" x2="54" y2="67" stroke="#ffffff" stroke-width="0.8"></line><line x1="50" y1="63" x2="50" y2="71" stroke="#ffffff" stroke-width="0.8"></line></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#06b6d4" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#06b6d4" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#06b6d4" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#06b6d4"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#06b6d4" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#06b6d4"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#06b6d4;background-color:#06b6d415;border-color:#06b6d440">Plasma Dreadnought</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Plasma Dreadnought</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">lunch</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Naval assault mech featuring a quad-mast sensor antenna array and a high-output chest plasma reactor core.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #10b98125 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #10b98140)"><defs><linearGradient id="grad-skin_16-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#10b981"></stop><stop offset="100%" stop-color="#064e3b"></stop></linearGradient><linearGradient id="grad-skin_16-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#10b981"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_16-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#10b981" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_16" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><polygon points="6,44 14,38 22,44 22,54 14,60 6,54" fill="#064e3b" stroke="#10b981" stroke-width="1.8"></polygon><polygon points="78,44 86,38 94,44 94,54 86,60 78,54" fill="#064e3b" stroke="#10b981" stroke-width="1.8"></polygon></g><g id="staff-3d-mecha-pilot"><polygon points="26,54 74,54 67,76 33,76" fill="#18181b" stroke="#10b981" stroke-width="1.6"></polygon><polygon points="22,54 30,52 28,62 20,62" fill="#27272a" stroke="#10b981" stroke-width="1"></polygon><polygon points="78,54 70,52 72,62 80,62" fill="#27272a" stroke="#10b981" stroke-width="1"></polygon><polygon points="36,57 41,57 37,62 32,62" fill="#eab308"></polygon><polygon points="43,57 48,57 44,62 39,62" fill="#18181b"></polygon><polygon points="52,57 57,57 53,62 48,62" fill="#eab308"></polygon><polygon points="59,57 64,57 60,62 55,62" fill="#18181b"></polygon><line x1="38" y1="54" x2="39" y2="76" stroke="#10b981" stroke-width="1.6"></line><line x1="62" y1="54" x2="61" y2="76" stroke="#10b981" stroke-width="1.6"></line><circle cx="50" cy="67" r="4.5" fill="#09090b" stroke="#10b981" stroke-width="1.2"></circle><circle cx="50" cy="67" r="2.5" fill="#10b981"></circle><line x1="46" y1="67" x2="54" y2="67" stroke="#ffffff" stroke-width="0.8"></line><line x1="50" y1="63" x2="50" y2="71" stroke="#ffffff" stroke-width="0.8"></line></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#10b981" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#10b981" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#10b981" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#10b981"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#10b981" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#10b981"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#10b981;background-color:#10b98115;border-color:#10b98140">Cyber Aegis</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Cyber Aegis</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">lunch</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Heavy defensive chassis armed with a hydraulic reinforced neck brace and dual hexagonal energy shields on shoulders.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #64748b25 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #64748b40)"><defs><linearGradient id="grad-skin_17-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#64748b"></stop><stop offset="100%" stop-color="#ef4444"></stop></linearGradient><linearGradient id="grad-skin_17-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#64748b"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_17-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#64748b" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_17" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><path d="M 28 16 C 6 2, 8 -16, 28 -10 C 20 -4, 20 8, 34 16 Z" fill="#64748b" stroke="#ef4444" stroke-width="1.2"></path><path d="M 72 16 C 94 2, 92 -16, 72 -10 C 80 -4, 80 8, 66 16 Z" fill="#64748b" stroke="#ef4444" stroke-width="1.2"></path></g><g id="staff-3d-mecha-pilot"><polygon points="26,54 74,54 67,76 33,76" fill="#18181b" stroke="#64748b" stroke-width="1.6"></polygon><polygon points="22,54 30,52 28,62 20,62" fill="#27272a" stroke="#64748b" stroke-width="1"></polygon><polygon points="78,54 70,52 72,62 80,62" fill="#27272a" stroke="#64748b" stroke-width="1"></polygon><polygon points="36,57 41,57 37,62 32,62" fill="#eab308"></polygon><polygon points="43,57 48,57 44,62 39,62" fill="#18181b"></polygon><polygon points="52,57 57,57 53,62 48,62" fill="#eab308"></polygon><polygon points="59,57 64,57 60,62 55,62" fill="#18181b"></polygon><line x1="38" y1="54" x2="39" y2="76" stroke="#64748b" stroke-width="1.6"></line><line x1="62" y1="54" x2="61" y2="76" stroke="#64748b" stroke-width="1.6"></line><circle cx="50" cy="67" r="4.5" fill="#09090b" stroke="#64748b" stroke-width="1.2"></circle><circle cx="50" cy="67" r="2.5" fill="#64748b"></circle><line x1="46" y1="67" x2="54" y2="67" stroke="#ffffff" stroke-width="0.8"></line><line x1="50" y1="63" x2="50" y2="71" stroke="#ffffff" stroke-width="0.8"></line></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#64748b" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#64748b" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#64748b" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#64748b"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#64748b" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#64748b"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#64748b;background-color:#64748b15;border-color:#64748b40">Dread Goliath</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Dread Goliath</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">lunch</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Demolition battlesuit with massive curved mecha ramming horns and an intimidating single-slit red mono-eye.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #eab30825 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #eab30840)"><defs><linearGradient id="grad-skin_18-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#eab308"></stop><stop offset="100%" stop-color="#1c1917"></stop></linearGradient><linearGradient id="grad-skin_18-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#eab308"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_18-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#eab308" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_18" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><ellipse cx="20" cy="2" rx="9" ry="16" fill="#18181b" stroke="#eab308" stroke-width="2" transform="rotate(-25 20 2)"></ellipse><circle cx="20" cy="2" r="3" fill="#fef08a"></circle></g><g id="staff-3d-mecha-pilot"><polygon points="26,54 74,54 67,76 33,76" fill="#18181b" stroke="#eab308" stroke-width="1.6"></polygon><polygon points="22,54 30,52 28,62 20,62" fill="#27272a" stroke="#eab308" stroke-width="1"></polygon><polygon points="78,54 70,52 72,62 80,62" fill="#27272a" stroke="#eab308" stroke-width="1"></polygon><polygon points="36,57 41,57 37,62 32,62" fill="#eab308"></polygon><polygon points="43,57 48,57 44,62 39,62" fill="#18181b"></polygon><polygon points="52,57 57,57 53,62 48,62" fill="#eab308"></polygon><polygon points="59,57 64,57 60,62 55,62" fill="#18181b"></polygon><line x1="38" y1="54" x2="39" y2="76" stroke="#eab308" stroke-width="1.6"></line><line x1="62" y1="54" x2="61" y2="76" stroke="#eab308" stroke-width="1.6"></line><circle cx="50" cy="67" r="4.5" fill="#09090b" stroke="#eab308" stroke-width="1.2"></circle><circle cx="50" cy="67" r="2.5" fill="#eab308"></circle><line x1="46" y1="67" x2="54" y2="67" stroke="#ffffff" stroke-width="0.8"></line><line x1="50" y1="63" x2="50" y2="71" stroke="#ffffff" stroke-width="0.8"></line></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#eab308" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#eab308" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#eab308" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#eab308"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#eab308" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#eab308"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#eab308;background-color:#eab30815;border-color:#eab30840">Orbital Titan</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Orbital Titan</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-purple-500/20 text-purple-300 border-purple-500/40">vip</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Deep-space defense frame with an orbital parabolic telemetry radar dish and dual high-gain comm masts.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #be123c25 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #be123c40)"><defs><linearGradient id="grad-skin_19-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#be123c"></stop><stop offset="100%" stop-color="#4c0519"></stop></linearGradient><linearGradient id="grad-skin_19-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#be123c"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_19-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#be123c" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_19" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><polygon points="20,44 -2,22 10,54" fill="#be123c" stroke="#4c0519" stroke-width="1.5"></polygon><polygon points="80,44 102,22 90,54" fill="#be123c" stroke="#4c0519" stroke-width="1.5"></polygon></g><g id="staff-3d-mecha-pilot"><polygon points="26,54 74,54 67,76 33,76" fill="#18181b" stroke="#be123c" stroke-width="1.6"></polygon><polygon points="22,54 30,52 28,62 20,62" fill="#27272a" stroke="#be123c" stroke-width="1"></polygon><polygon points="78,54 70,52 72,62 80,62" fill="#27272a" stroke="#be123c" stroke-width="1"></polygon><polygon points="36,57 41,57 37,62 32,62" fill="#eab308"></polygon><polygon points="43,57 48,57 44,62 39,62" fill="#18181b"></polygon><polygon points="52,57 57,57 53,62 48,62" fill="#eab308"></polygon><polygon points="59,57 64,57 60,62 55,62" fill="#18181b"></polygon><line x1="38" y1="54" x2="39" y2="76" stroke="#be123c" stroke-width="1.6"></line><line x1="62" y1="54" x2="61" y2="76" stroke="#be123c" stroke-width="1.6"></line><circle cx="50" cy="67" r="4.5" fill="#09090b" stroke="#be123c" stroke-width="1.2"></circle><circle cx="50" cy="67" r="2.5" fill="#be123c"></circle><line x1="46" y1="67" x2="54" y2="67" stroke="#ffffff" stroke-width="0.8"></line><line x1="50" y1="63" x2="50" y2="71" stroke="#ffffff" stroke-width="0.8"></line></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#be123c" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#be123c" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#be123c" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#be123c"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#be123c" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#be123c"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#be123c;background-color:#be123c15;border-color:#be123c40">Omega Destroyer</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Omega Destroyer</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-purple-500/20 text-purple-300 border-purple-500/40">vip</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Ultimate planetary assault mech featuring swept hyper-drive flight wings, twin head cannons, and red-shifted thrusters.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #6366f125 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #6366f140)"><defs><linearGradient id="grad-skin_20-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#6366f1"></stop><stop offset="100%" stop-color="#1e1b4b"></stop></linearGradient><linearGradient id="grad-skin_20-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#6366f1"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_20-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#6366f1" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_20" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><line x1="18" y1="52" x2="82" y2="12" stroke="#334155" stroke-width="3" stroke-linecap="round"></line><line x1="22" y1="48" x2="80" y2="14" stroke="#6366f1" stroke-width="1.5" stroke-linecap="round" opacity="0.8"></line><path d="M 74 32 Q 90 26 96 42 Q 84 38 72 36" fill="#6366f1" opacity="0.9"></path></g><g id="staff-3d-stealth-ninja"><polygon points="31,54 69,54 63,74 37,74" fill="#090d16" stroke="#6366f1" stroke-width="1.4"></polygon><line x1="32" y1="54" x2="55" y2="66" stroke="#6366f1" stroke-width="1.8" stroke-linecap="round"></line><line x1="68" y1="54" x2="48" y2="66" stroke="#6366f1" stroke-width="1.4" stroke-linecap="round" opacity="0.6"></line><polygon points="32,55 36,54 62,72 58,74" fill="#6366f1" opacity="0.9"></polygon><rect x="44" y="60" width="10" height="3" rx="1" fill="#1e293b" stroke="#ffffff" stroke-width="0.6" transform="rotate(-30 49 61.5)"></rect><rect x="36" y="69" width="28" height="5" rx="1.5" fill="#1e1b4b" stroke="#6366f1" stroke-width="1"></rect><path d="M 52 73 Q 54 78 53 82 Q 50 78 52 73" fill="#6366f1"></path></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#6366f1" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#6366f1" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#6366f1" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#6366f1"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#6366f1" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#6366f1"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#6366f1;background-color:#6366f115;border-color:#6366f140">Shadow Shinobi</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Shadow Shinobi</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-emerald-500/20 text-emerald-300 border-emerald-500/40">free</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Classic cyber shinobi gear with a polished titanium forehead hitai-ate plate and long flowing indigo cloth headband tails.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">UNLOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-3 py-1 rounded-lg text-xs font-semibold transition-all cursor-pointer bg-[#007acc] hover:bg-[#0088e0] text-white shadow-sm">Equip</button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #10b98125 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #10b98140)"><defs><linearGradient id="grad-skin_21-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#10b981"></stop><stop offset="100%" stop-color="#022c22"></stop></linearGradient><linearGradient id="grad-skin_21-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#10b981"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_21-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#10b981" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_21" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><path d="M 22 24 Q 50 14 78 24 L 74 52 Q 50 60 26 52 Z" fill="#0f172a" stroke="#10b981" stroke-width="1.6" opacity="0.85"></path><circle cx="58" cy="34" r="6" fill="none" stroke="#22c55e" stroke-width="2"></circle><circle cx="58" cy="34" r="2" fill="#22c55e"></circle></g><g id="staff-3d-stealth-ninja"><polygon points="31,54 69,54 63,74 37,74" fill="#090d16" stroke="#10b981" stroke-width="1.4"></polygon><line x1="32" y1="54" x2="55" y2="66" stroke="#10b981" stroke-width="1.8" stroke-linecap="round"></line><line x1="68" y1="54" x2="48" y2="66" stroke="#10b981" stroke-width="1.4" stroke-linecap="round" opacity="0.6"></line><polygon points="32,55 36,54 62,72 58,74" fill="#10b981" opacity="0.9"></polygon><rect x="44" y="60" width="10" height="3" rx="1" fill="#1e293b" stroke="#ffffff" stroke-width="0.6" transform="rotate(-30 49 61.5)"></rect><rect x="36" y="69" width="28" height="5" rx="1.5" fill="#1e1b4b" stroke="#10b981" stroke-width="1"></rect><path d="M 52 73 Q 54 78 53 82 Q 50 78 52 73" fill="#10b981"></path></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#10b981" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#10b981" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#10b981" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#10b981"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#10b981" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#10b981"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#10b981;background-color:#10b98115;border-color:#10b98140">Silent Infiltrator</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Silent Infiltrator</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-emerald-500/20 text-emerald-300 border-emerald-500/40">free</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Black-ops balaclava shroud featuring a single glowing emerald thermal-optical monocle sensor with target acquisition.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">UNLOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-3 py-1 rounded-lg text-xs font-semibold transition-all cursor-pointer bg-[#007acc] hover:bg-[#0088e0] text-white shadow-sm">Equip</button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #ef444425 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #ef444440)"><defs><linearGradient id="grad-skin_22-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#ef4444"></stop><stop offset="100%" stop-color="#450a0a"></stop></linearGradient><linearGradient id="grad-skin_22-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ef4444"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_22-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ef4444" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_22" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><polygon points="30,16 18,-4 34,8" fill="#ef4444" stroke="#450a0a" stroke-width="1.2"></polygon><polygon points="70,16 82,-4 66,8" fill="#ef4444" stroke="#450a0a" stroke-width="1.2"></polygon><path d="M 32 44 L 40 50 L 46 44 L 50 48 L 54 44 L 60 50 L 68 44 L 62 56 L 38 56 Z" fill="#ffffff" stroke="#ef4444" stroke-width="1.2"></path></g><g id="staff-3d-stealth-ninja"><polygon points="31,54 69,54 63,74 37,74" fill="#090d16" stroke="#ef4444" stroke-width="1.4"></polygon><line x1="32" y1="54" x2="55" y2="66" stroke="#ef4444" stroke-width="1.8" stroke-linecap="round"></line><line x1="68" y1="54" x2="48" y2="66" stroke="#ef4444" stroke-width="1.4" stroke-linecap="round" opacity="0.6"></line><polygon points="32,55 36,54 62,72 58,74" fill="#ef4444" opacity="0.9"></polygon><rect x="44" y="60" width="10" height="3" rx="1" fill="#1e293b" stroke="#ffffff" stroke-width="0.6" transform="rotate(-30 49 61.5)"></rect><rect x="36" y="69" width="28" height="5" rx="1.5" fill="#1e1b4b" stroke="#ef4444" stroke-width="1"></rect><path d="M 52 73 Q 54 78 53 82 Q 50 78 52 73" fill="#ef4444"></path></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#ef4444" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#ef4444" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#ef4444" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#ef4444"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#ef4444" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#ef4444"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#ef4444;background-color:#ef444415;border-color:#ef444440">Kage Oni</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Kage Oni</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">coffee</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Intimidating Japanese Oni demon half-mask equipped with glowing porcelain fangs and dual menacing crimson horns.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #f43f5e25 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #f43f5e40)"><defs><linearGradient id="grad-skin_23-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#f43f5e"></stop><stop offset="100%" stop-color="#ffe4e6"></stop></linearGradient><linearGradient id="grad-skin_23-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#f43f5e"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_23-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#f43f5e" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_23" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><polygon points="22,18 32,-4 42,12" fill="#1e2430"></polygon><polygon points="25,16 32,-1 39,12" fill="#f43f5e"></polygon><polygon points="58,12 68,-4 78,18" fill="#1e2430"></polygon><polygon points="61,12 68,-1 75,16" fill="#f43f5e"></polygon><line x1="36" y1="42" x2="22" y2="40" stroke="#f43f5e" stroke-width="1.5"></line><line x1="64" y1="42" x2="78" y2="40" stroke="#f43f5e" stroke-width="1.5"></line></g><g id="staff-3d-stealth-ninja"><polygon points="31,54 69,54 63,74 37,74" fill="#090d16" stroke="#f43f5e" stroke-width="1.4"></polygon><line x1="32" y1="54" x2="55" y2="66" stroke="#f43f5e" stroke-width="1.8" stroke-linecap="round"></line><line x1="68" y1="54" x2="48" y2="66" stroke="#f43f5e" stroke-width="1.4" stroke-linecap="round" opacity="0.6"></line><polygon points="32,55 36,54 62,72 58,74" fill="#f43f5e" opacity="0.9"></polygon><rect x="44" y="60" width="10" height="3" rx="1" fill="#1e293b" stroke="#ffffff" stroke-width="0.6" transform="rotate(-30 49 61.5)"></rect><rect x="36" y="69" width="28" height="5" rx="1.5" fill="#1e1b4b" stroke="#f43f5e" stroke-width="1"></rect><path d="M 52 73 Q 54 78 53 82 Q 50 78 52 73" fill="#f43f5e"></path></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#f43f5e" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#f43f5e" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#f43f5e" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#f43f5e"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#f43f5e" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#f43f5e"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#f43f5e;background-color:#f43f5e15;border-color:#f43f5e40">Cyber Kitsune</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Cyber Kitsune</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">coffee</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Agile spirit operative suit featuring pointed cybernetic fox ears and delicate sensor whisker decals along the cheeks.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #eab30825 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #eab30840)"><defs><linearGradient id="grad-skin_24-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#eab308"></stop><stop offset="100%" stop-color="#18181b"></stop></linearGradient><linearGradient id="grad-skin_24-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#eab308"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_24-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#eab308" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_24" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><polygon points="6,24 50,-8 94,24" fill="#18181b" stroke="#eab308" stroke-width="2"></polygon><line x1="6" y1="24" x2="94" y2="24" stroke="#fef08a" stroke-width="3"></line></g><g id="staff-3d-stealth-ninja"><polygon points="31,54 69,54 63,74 37,74" fill="#090d16" stroke="#eab308" stroke-width="1.4"></polygon><line x1="32" y1="54" x2="55" y2="66" stroke="#eab308" stroke-width="1.8" stroke-linecap="round"></line><line x1="68" y1="54" x2="48" y2="66" stroke="#eab308" stroke-width="1.4" stroke-linecap="round" opacity="0.6"></line><polygon points="32,55 36,54 62,72 58,74" fill="#eab308" opacity="0.9"></polygon><rect x="44" y="60" width="10" height="3" rx="1" fill="#1e293b" stroke="#ffffff" stroke-width="0.6" transform="rotate(-30 49 61.5)"></rect><rect x="36" y="69" width="28" height="5" rx="1.5" fill="#1e1b4b" stroke="#eab308" stroke-width="1"></rect><path d="M 52 73 Q 54 78 53 82 Q 50 78 52 73" fill="#eab308"></path></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#eab308" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#eab308" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#eab308" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#eab308"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#eab308" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#eab308"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#eab308;background-color:#eab30815;border-color:#eab30840">Cyber Ronin Kasa</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Cyber Ronin Kasa</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">coffee</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Masterless wanderer gear sporting a wide-brim conical cyber kasa straw hat with an under-rim glowing neon yellow circuit ring.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #14b8a625 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #14b8a640)"><defs><linearGradient id="grad-skin_25-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#14b8a6"></stop><stop offset="100%" stop-color="#042f2e"></stop></linearGradient><linearGradient id="grad-skin_25-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#14b8a6"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_25-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#14b8a6" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_25" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g stroke-linecap="round"><line x1="16" y1="56" x2="84" y2="-4" stroke="#475569" stroke-width="3.5"></line><line x1="20" y1="52" x2="82" y2="-2" stroke="#14b8a6" stroke-width="2"></line><line x1="84" y1="56" x2="16" y2="-4" stroke="#475569" stroke-width="3.5"></line><line x1="80" y1="52" x2="18" y2="-2" stroke="#14b8a6" stroke-width="2"></line></g><g id="staff-3d-stealth-ninja"><polygon points="31,54 69,54 63,74 37,74" fill="#090d16" stroke="#14b8a6" stroke-width="1.4"></polygon><line x1="32" y1="54" x2="55" y2="66" stroke="#14b8a6" stroke-width="1.8" stroke-linecap="round"></line><line x1="68" y1="54" x2="48" y2="66" stroke="#14b8a6" stroke-width="1.4" stroke-linecap="round" opacity="0.6"></line><polygon points="32,55 36,54 62,72 58,74" fill="#14b8a6" opacity="0.9"></polygon><rect x="44" y="60" width="10" height="3" rx="1" fill="#1e293b" stroke="#ffffff" stroke-width="0.6" transform="rotate(-30 49 61.5)"></rect><rect x="36" y="69" width="28" height="5" rx="1.5" fill="#1e1b4b" stroke="#14b8a6" stroke-width="1"></rect><path d="M 52 73 Q 54 78 53 82 Q 50 78 52 73" fill="#14b8a6"></path></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#14b8a6" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#14b8a6" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#14b8a6" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#14b8a6"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#14b8a6" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#14b8a6"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#14b8a6;background-color:#14b8a615;border-color:#14b8a640">Obsidian Blade</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Obsidian Blade</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">lunch</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Dual-wield assassin outfit featuring crossed holographic katana sheaths on the back and a blindfold-style sensory visor.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #8b5cf625 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #8b5cf640)"><defs><linearGradient id="grad-skin_26-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#8b5cf6"></stop><stop offset="100%" stop-color="#1e1b4b"></stop></linearGradient><linearGradient id="grad-skin_26-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#8b5cf6"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_26-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#8b5cf6" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_26" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><polygon points="36,42 50,58 64,42 50,46" fill="#0f172a" stroke="#8b5cf6" stroke-width="1.8"></polygon></g><g id="staff-3d-stealth-ninja"><polygon points="31,54 69,54 63,74 37,74" fill="#090d16" stroke="#8b5cf6" stroke-width="1.4"></polygon><line x1="32" y1="54" x2="55" y2="66" stroke="#8b5cf6" stroke-width="1.8" stroke-linecap="round"></line><line x1="68" y1="54" x2="48" y2="66" stroke="#8b5cf6" stroke-width="1.4" stroke-linecap="round" opacity="0.6"></line><polygon points="32,55 36,54 62,72 58,74" fill="#8b5cf6" opacity="0.9"></polygon><rect x="44" y="60" width="10" height="3" rx="1" fill="#1e293b" stroke="#ffffff" stroke-width="0.6" transform="rotate(-30 49 61.5)"></rect><rect x="36" y="69" width="28" height="5" rx="1.5" fill="#1e1b4b" stroke="#8b5cf6" stroke-width="1"></rect><path d="M 52 73 Q 54 78 53 82 Q 50 78 52 73" fill="#8b5cf6"></path></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#8b5cf6" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#8b5cf6" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#8b5cf6" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#8b5cf6"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#8b5cf6" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#8b5cf6"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#8b5cf6;background-color:#8b5cf615;border-color:#8b5cf640">Raven Tengu</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Raven Tengu</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">lunch</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Mountain phantom gear with an aerodynamic raven beak half-mask and razor-sharp feathered blade pauldrons.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #94a3b825 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #94a3b840)"><defs><linearGradient id="grad-skin_27-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#94a3b8"></stop><stop offset="100%" stop-color="#0f172a"></stop></linearGradient><linearGradient id="grad-skin_27-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#94a3b8"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_27-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#94a3b8" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_27" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><path d="M 22 30 Q 50 18 78 30 L 74 54 Q 50 64 26 54 Z" fill="#0f172a" opacity="0.85" stroke="#94a3b8" stroke-width="1.5" stroke-dasharray="4 2"></path></g><g id="staff-3d-stealth-ninja"><polygon points="31,54 69,54 63,74 37,74" fill="#090d16" stroke="#94a3b8" stroke-width="1.4"></polygon><line x1="32" y1="54" x2="55" y2="66" stroke="#94a3b8" stroke-width="1.8" stroke-linecap="round"></line><line x1="68" y1="54" x2="48" y2="66" stroke="#94a3b8" stroke-width="1.4" stroke-linecap="round" opacity="0.6"></line><polygon points="32,55 36,54 62,72 58,74" fill="#94a3b8" opacity="0.9"></polygon><rect x="44" y="60" width="10" height="3" rx="1" fill="#1e293b" stroke="#ffffff" stroke-width="0.6" transform="rotate(-30 49 61.5)"></rect><rect x="36" y="69" width="28" height="5" rx="1.5" fill="#1e1b4b" stroke="#94a3b8" stroke-width="1"></rect><path d="M 52 73 Q 54 78 53 82 Q 50 78 52 73" fill="#94a3b8"></path></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#94a3b8" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#94a3b8" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#94a3b8" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#94a3b8"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#94a3b8" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#94a3b8"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#94a3b8;background-color:#94a3b815;border-color:#94a3b840">Smoke Wraith</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Smoke Wraith</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">lunch</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Infiltration gear wrapped in a hooded dark nanofiber veil with glowing horizontal eye slits and faint smoke dissipation.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #ec489925 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #ec489940)"><defs><linearGradient id="grad-skin_28-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#ec4899"></stop><stop offset="100%" stop-color="#500724"></stop></linearGradient><linearGradient id="grad-skin_28-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ec4899"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_28-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ec4899" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_28" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><path d="M 50 -10 C 32 -10, 24 6, 32 18 C 24 10, 32 -4, 50 -4 C 68 -4, 76 10, 68 18 C 76 6, 68 -10, 50 -10 Z" fill="#ec4899" stroke="#500724" stroke-width="1.2"></path></g><g id="staff-3d-stealth-ninja"><polygon points="31,54 69,54 63,74 37,74" fill="#090d16" stroke="#ec4899" stroke-width="1.4"></polygon><line x1="32" y1="54" x2="55" y2="66" stroke="#ec4899" stroke-width="1.8" stroke-linecap="round"></line><line x1="68" y1="54" x2="48" y2="66" stroke="#ec4899" stroke-width="1.4" stroke-linecap="round" opacity="0.6"></line><polygon points="32,55 36,54 62,72 58,74" fill="#ec4899" opacity="0.9"></polygon><rect x="44" y="60" width="10" height="3" rx="1" fill="#1e293b" stroke="#ffffff" stroke-width="0.6" transform="rotate(-30 49 61.5)"></rect><rect x="36" y="69" width="28" height="5" rx="1.5" fill="#1e1b4b" stroke="#ec4899" stroke-width="1"></rect><path d="M 52 73 Q 54 78 53 82 Q 50 78 52 73" fill="#ec4899"></path></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#ec4899" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#ec4899" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#ec4899" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#ec4899"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#ec4899" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#ec4899"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#ec4899;background-color:#ec489915;border-color:#ec489940">Midnight Duelist</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Midnight Duelist</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-purple-500/20 text-purple-300 border-purple-500/40">vip</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Elite arena champion gear featuring an elegant crescent moon scythe crest on the forehead and twin kunai collar pins.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #00f0ff25 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #00f0ff40)"><defs><linearGradient id="grad-skin_29-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#00f0ff"></stop><stop offset="100%" stop-color="#020617"></stop></linearGradient><linearGradient id="grad-skin_29-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#00f0ff"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_29-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#00f0ff" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_29" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><rect x="28" y="24" width="44" height="24" rx="4" fill="#000000" stroke="#00f0ff" stroke-width="2"></rect><text x="50" y="42" fill="#00f0ff" font-size="14" font-family="monospace" text-anchor="middle" font-weight="bold">零</text></g><g id="staff-3d-stealth-ninja"><polygon points="31,54 69,54 63,74 37,74" fill="#090d16" stroke="#00f0ff" stroke-width="1.4"></polygon><line x1="32" y1="54" x2="55" y2="66" stroke="#00f0ff" stroke-width="1.8" stroke-linecap="round"></line><line x1="68" y1="54" x2="48" y2="66" stroke="#00f0ff" stroke-width="1.4" stroke-linecap="round" opacity="0.6"></line><polygon points="32,55 36,54 62,72 58,74" fill="#00f0ff" opacity="0.9"></polygon><rect x="44" y="60" width="10" height="3" rx="1" fill="#1e293b" stroke="#ffffff" stroke-width="0.6" transform="rotate(-30 49 61.5)"></rect><rect x="36" y="69" width="28" height="5" rx="1.5" fill="#1e1b4b" stroke="#00f0ff" stroke-width="1"></rect><path d="M 52 73 Q 54 78 53 82 Q 50 78 52 73" fill="#00f0ff"></path></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#00f0ff" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#00f0ff" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#00f0ff" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#00f0ff"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#00f0ff" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#00f0ff"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#00f0ff;background-color:#00f0ff15;border-color:#00f0ff40">Void Assassin</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Void Assassin</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-purple-500/20 text-purple-300 border-purple-500/40">vip</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Pitch-black stealth armor absorbing 99% of light, featuring glowing cyan runic kanji hovering mysteriously in front of the face.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #10b98125 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #10b98140)"><defs><linearGradient id="grad-skin_30-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#10b981"></stop><stop offset="100%" stop-color="#022c22"></stop></linearGradient><linearGradient id="grad-skin_30-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#10b981"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_30-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#10b981" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_30" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><path d="M 14,42 Q 14,8 50,8 Q 86,8 86,42 Q 70,48 50,48 Q 30,48 14,42 Z" fill="#081018" stroke="#10b981" stroke-width="1.8"></path><circle cx="28" cy="18" r="1.5" fill="#10b981" opacity="0.7"></circle><circle cx="36" cy="14" r="1.5" fill="#10b981" opacity="0.9"></circle><circle cx="64" cy="14" r="1.5" fill="#10b981" opacity="0.9"></circle><circle cx="72" cy="18" r="1.5" fill="#10b981" opacity="0.7"></circle></g><g id="staff-3d-matrix-hacker"><rect x="26" y="54" width="48" height="21" rx="6" fill="#121217" stroke="#10b981" stroke-width="1.5"></rect><path d="M 30 53 Q 50 58 70 53 Q 62 61 50 61 Q 38 61 30 53 Z" fill="#1f1f28" stroke="#10b981" stroke-width="1"></path><path d="M 44 59 Q 42 66 45 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="43.5" y="70" width="2.5" height="3.5" rx="0.5" fill="#10b981"></rect><path d="M 56 59 Q 58 66 55 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="54" y="70" width="2.5" height="3.5" rx="0.5" fill="#10b981"></rect><path d="M 35 66 L 65 66 L 62 73 L 38 73 Z" fill="#09090d" stroke="#27272a" stroke-width="0.8"></path><line x1="36" y1="66" x2="38" y2="70" stroke="#10b981" stroke-width="1"></line><line x1="64" y1="66" x2="62" y2="70" stroke="#10b981" stroke-width="1"></line><g transform="translate(56, 60)"><rect x="0" y="0" width="8" height="4" fill="#000000" stroke="#6ee7b7" stroke-width="0.6"></rect><line x1="2" y1="1" x2="2" y2="3" stroke="#10b981" stroke-width="0.6"></line><line x1="4" y1="1" x2="4" y2="3" stroke="#10b981" stroke-width="1"></line><line x1="6" y1="1" x2="6" y2="3" stroke="#10b981" stroke-width="0.6"></line></g></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#10b981" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#10b981" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#10b981" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#10b981"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#10b981" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#10b981"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#10b981;background-color:#10b98115;border-color:#10b98140">Root Netrunner</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Root Netrunner</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-emerald-500/20 text-emerald-300 border-emerald-500/40">free</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Underground hacker suit with a deep oversized hooded cowl dripping with vertical green phosphorescent digital code streams.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">UNLOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-3 py-1 rounded-lg text-xs font-semibold transition-all cursor-pointer bg-[#007acc] hover:bg-[#0088e0] text-white shadow-sm">Equip</button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #06b6d425 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #06b6d440)"><defs><linearGradient id="grad-skin_31-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#06b6d4"></stop><stop offset="100%" stop-color="#083344"></stop></linearGradient><linearGradient id="grad-skin_31-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#06b6d4"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_31-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#06b6d4" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_31" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><rect x="24" y="24" width="52" height="18" rx="4" fill="#083344" stroke="#06b6d4" stroke-width="2"></rect><line x1="36" y1="24" x2="30" y2="4" stroke="#06b6d4" stroke-width="2"></line><circle cx="30" cy="4" r="3" fill="#67e8f9"></circle><line x1="32" y1="33" x2="68" y2="33" stroke="#67e8f9" stroke-width="1.6"></line></g><g id="staff-3d-matrix-hacker"><rect x="26" y="54" width="48" height="21" rx="6" fill="#121217" stroke="#06b6d4" stroke-width="1.5"></rect><path d="M 30 53 Q 50 58 70 53 Q 62 61 50 61 Q 38 61 30 53 Z" fill="#1f1f28" stroke="#06b6d4" stroke-width="1"></path><path d="M 44 59 Q 42 66 45 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="43.5" y="70" width="2.5" height="3.5" rx="0.5" fill="#06b6d4"></rect><path d="M 56 59 Q 58 66 55 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="54" y="70" width="2.5" height="3.5" rx="0.5" fill="#06b6d4"></rect><path d="M 35 66 L 65 66 L 62 73 L 38 73 Z" fill="#09090d" stroke="#27272a" stroke-width="0.8"></path><line x1="36" y1="66" x2="38" y2="70" stroke="#06b6d4" stroke-width="1"></line><line x1="64" y1="66" x2="62" y2="70" stroke="#06b6d4" stroke-width="1"></line><g transform="translate(56, 60)"><rect x="0" y="0" width="8" height="4" fill="#000000" stroke="#67e8f9" stroke-width="0.6"></rect><line x1="2" y1="1" x2="2" y2="3" stroke="#06b6d4" stroke-width="0.6"></line><line x1="4" y1="1" x2="4" y2="3" stroke="#06b6d4" stroke-width="1"></line><line x1="6" y1="1" x2="6" y2="3" stroke="#06b6d4" stroke-width="0.6"></line></g></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#06b6d4" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#06b6d4" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#06b6d4" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#06b6d4"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#06b6d4" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#06b6d4"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#06b6d4;background-color:#06b6d415;border-color:#06b6d440">Binary Coder</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Binary Coder</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-emerald-500/20 text-emerald-300 border-emerald-500/40">free</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Classic retro cyberdeck enthusiast gear equipped with chunky rectangular VR goggles and an omnidirectional radio antenna.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">UNLOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-3 py-1 rounded-lg text-xs font-semibold transition-all cursor-pointer bg-[#007acc] hover:bg-[#0088e0] text-white shadow-sm">Equip</button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #ef444425 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #ef444440)"><defs><linearGradient id="grad-skin_32-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#ef4444"></stop><stop offset="100%" stop-color="#450a0a"></stop></linearGradient><linearGradient id="grad-skin_32-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ef4444"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_32-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ef4444" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_32" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><path d="M 22 20 Q 50 4 78 20" stroke="#ef4444" stroke-width="3.5" fill="none"></path><polygon points="32,20 24,0 40,14" fill="#ef4444" stroke="#450a0a" stroke-width="1.2"></polygon><polygon points="68,20 76,0 60,14" fill="#ef4444" stroke="#450a0a" stroke-width="1.2"></polygon></g><g id="staff-3d-matrix-hacker"><rect x="26" y="54" width="48" height="21" rx="6" fill="#121217" stroke="#ef4444" stroke-width="1.5"></rect><path d="M 30 53 Q 50 58 70 53 Q 62 61 50 61 Q 38 61 30 53 Z" fill="#1f1f28" stroke="#ef4444" stroke-width="1"></path><path d="M 44 59 Q 42 66 45 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="43.5" y="70" width="2.5" height="3.5" rx="0.5" fill="#ef4444"></rect><path d="M 56 59 Q 58 66 55 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="54" y="70" width="2.5" height="3.5" rx="0.5" fill="#ef4444"></rect><path d="M 35 66 L 65 66 L 62 73 L 38 73 Z" fill="#09090d" stroke="#27272a" stroke-width="0.8"></path><line x1="36" y1="66" x2="38" y2="70" stroke="#ef4444" stroke-width="1"></line><line x1="64" y1="66" x2="62" y2="70" stroke="#ef4444" stroke-width="1"></line><g transform="translate(56, 60)"><rect x="0" y="0" width="8" height="4" fill="#000000" stroke="#fca5a5" stroke-width="0.6"></rect><line x1="2" y1="1" x2="2" y2="3" stroke="#ef4444" stroke-width="0.6"></line><line x1="4" y1="1" x2="4" y2="3" stroke="#ef4444" stroke-width="1"></line><line x1="6" y1="1" x2="6" y2="3" stroke="#ef4444" stroke-width="0.6"></line></g></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#ef4444" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#ef4444" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#ef4444" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#ef4444"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#ef4444" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#ef4444"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#ef4444;background-color:#ef444415;border-color:#ef444440">ZeroDay Daemon</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">ZeroDay Daemon</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">coffee</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Malicious exploit runner sporting a dark beanie cowl with integrated red cyber devil horns and glowing memory fault LEDs.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #eab30825 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #eab30840)"><defs><linearGradient id="grad-skin_33-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#eab308"></stop><stop offset="100%" stop-color="#422006"></stop></linearGradient><linearGradient id="grad-skin_33-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#eab308"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_33-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#eab308" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_33" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><rect x="18" y="10" width="64" height="48" fill="none" stroke="#eab308" stroke-width="1.8" stroke-dasharray="8 4 3 5"></rect><rect x="28" y="4" width="16" height="8" fill="#eab308" opacity="0.8"></rect><rect x="62" y="46" width="14" height="6" fill="#eab308" opacity="0.8"></rect></g><g id="staff-3d-matrix-hacker"><rect x="26" y="54" width="48" height="21" rx="6" fill="#121217" stroke="#eab308" stroke-width="1.5"></rect><path d="M 30 53 Q 50 58 70 53 Q 62 61 50 61 Q 38 61 30 53 Z" fill="#1f1f28" stroke="#eab308" stroke-width="1"></path><path d="M 44 59 Q 42 66 45 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="43.5" y="70" width="2.5" height="3.5" rx="0.5" fill="#eab308"></rect><path d="M 56 59 Q 58 66 55 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="54" y="70" width="2.5" height="3.5" rx="0.5" fill="#eab308"></rect><path d="M 35 66 L 65 66 L 62 73 L 38 73 Z" fill="#09090d" stroke="#27272a" stroke-width="0.8"></path><line x1="36" y1="66" x2="38" y2="70" stroke="#eab308" stroke-width="1"></line><line x1="64" y1="66" x2="62" y2="70" stroke="#eab308" stroke-width="1"></line><g transform="translate(56, 60)"><rect x="0" y="0" width="8" height="4" fill="#000000" stroke="#fef08a" stroke-width="0.6"></rect><line x1="2" y1="1" x2="2" y2="3" stroke="#eab308" stroke-width="0.6"></line><line x1="4" y1="1" x2="4" y2="3" stroke="#eab308" stroke-width="1"></line><line x1="6" y1="1" x2="6" y2="3" stroke="#eab308" stroke-width="0.6"></line></g></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#eab308" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#eab308" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#eab308" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#eab308"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#eab308" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#eab308"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#eab308;background-color:#eab30815;border-color:#eab30840">Glitch Cracker</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Glitch Cracker</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">coffee</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Glitching outfit surrounded by jittering holographic wireframe shards and corrupted polygon artifacts hovering in 3D space.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #3b82f625 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #3b82f640)"><defs><linearGradient id="grad-skin_34-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#3b82f6"></stop><stop offset="100%" stop-color="#172554"></stop></linearGradient><linearGradient id="grad-skin_34-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#3b82f6"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_34-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#3b82f6" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_34" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><rect x="74" y="6" width="40" height="22" rx="3" fill="#09090b" stroke="#3b82f6" stroke-width="1.2"></rect><text x="78" y="20" fill="#3b82f6" font-size="8" font-family="monospace">root#_</text></g><g id="staff-3d-matrix-hacker"><rect x="26" y="54" width="48" height="21" rx="6" fill="#121217" stroke="#3b82f6" stroke-width="1.5"></rect><path d="M 30 53 Q 50 58 70 53 Q 62 61 50 61 Q 38 61 30 53 Z" fill="#1f1f28" stroke="#3b82f6" stroke-width="1"></path><path d="M 44 59 Q 42 66 45 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="43.5" y="70" width="2.5" height="3.5" rx="0.5" fill="#3b82f6"></rect><path d="M 56 59 Q 58 66 55 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="54" y="70" width="2.5" height="3.5" rx="0.5" fill="#3b82f6"></rect><path d="M 35 66 L 65 66 L 62 73 L 38 73 Z" fill="#09090d" stroke="#27272a" stroke-width="0.8"></path><line x1="36" y1="66" x2="38" y2="70" stroke="#3b82f6" stroke-width="1"></line><line x1="64" y1="66" x2="62" y2="70" stroke="#3b82f6" stroke-width="1"></line><g transform="translate(56, 60)"><rect x="0" y="0" width="8" height="4" fill="#000000" stroke="#93c5fd" stroke-width="0.6"></rect><line x1="2" y1="1" x2="2" y2="3" stroke="#3b82f6" stroke-width="0.6"></line><line x1="4" y1="1" x2="4" y2="3" stroke="#3b82f6" stroke-width="1"></line><line x1="6" y1="1" x2="6" y2="3" stroke="#3b82f6" stroke-width="0.6"></line></g></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#3b82f6" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#3b82f6" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#3b82f6" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#3b82f6"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#3b82f6" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#3b82f6"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#3b82f6;background-color:#3b82f615;border-color:#3b82f640">Defrag Nethead</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Defrag Nethead</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">coffee</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">High-spec sysadmin gear featuring a floating terminal prompt HUD window [root@sys ~]# hovering persistently beside the ear.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #a3e63525 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #a3e63540)"><defs><linearGradient id="grad-skin_35-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#a3e635"></stop><stop offset="100%" stop-color="#14532d"></stop></linearGradient><linearGradient id="grad-skin_35-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#a3e635"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_35-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#a3e635" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_35" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g stroke-width="2.5"><rect x="28" y="42" width="44" height="14" rx="4" fill="#0f172a" stroke="#a3e635" stroke-width="1.5"></rect><line x1="36" y1="52" x2="36" y2="46" stroke="#22c55e"></line><line x1="43" y1="52" x2="43" y2="44" stroke="#eab308"></line><line x1="50" y1="52" x2="50" y2="43" stroke="#ef4444"></line><line x1="57" y1="52" x2="57" y2="45" stroke="#eab308"></line><line x1="64" y1="52" x2="64" y2="47" stroke="#22c55e"></line></g><g id="staff-3d-matrix-hacker"><rect x="26" y="54" width="48" height="21" rx="6" fill="#121217" stroke="#a3e635" stroke-width="1.5"></rect><path d="M 30 53 Q 50 58 70 53 Q 62 61 50 61 Q 38 61 30 53 Z" fill="#1f1f28" stroke="#a3e635" stroke-width="1"></path><path d="M 44 59 Q 42 66 45 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="43.5" y="70" width="2.5" height="3.5" rx="0.5" fill="#a3e635"></rect><path d="M 56 59 Q 58 66 55 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="54" y="70" width="2.5" height="3.5" rx="0.5" fill="#a3e635"></rect><path d="M 35 66 L 65 66 L 62 73 L 38 73 Z" fill="#09090d" stroke="#27272a" stroke-width="0.8"></path><line x1="36" y1="66" x2="38" y2="70" stroke="#a3e635" stroke-width="1"></line><line x1="64" y1="66" x2="62" y2="70" stroke="#a3e635" stroke-width="1"></line><g transform="translate(56, 60)"><rect x="0" y="0" width="8" height="4" fill="#000000" stroke="#d9f99d" stroke-width="0.6"></rect><line x1="2" y1="1" x2="2" y2="3" stroke="#a3e635" stroke-width="0.6"></line><line x1="4" y1="1" x2="4" y2="3" stroke="#a3e635" stroke-width="1"></line><line x1="6" y1="1" x2="6" y2="3" stroke="#a3e635" stroke-width="0.6"></line></g></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#a3e635" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#a3e635" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#a3e635" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#a3e635"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#a3e635" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#a3e635"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#a3e635;background-color:#a3e63515;border-color:#a3e63540">Acid Breacher</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Acid Breacher</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">lunch</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Cybergoth infiltrator gear featuring a twin respirator mask fitted with responsive multi-color equalizer audio VU bars.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #f9731625 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #f9731640)"><defs><linearGradient id="grad-skin_36-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#f97316"></stop><stop offset="100%" stop-color="#431407"></stop></linearGradient><linearGradient id="grad-skin_36-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#f97316"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_36-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#f97316" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_36" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g fill="#ea580c" stroke="#fed7aa" stroke-width="1.2"><rect x="28" y="-2" width="6" height="18" rx="1.5"></rect><rect x="38" y="-6" width="6" height="22" rx="1.5"></rect><rect x="47" y="-8" width="6" height="24" rx="1.5"></rect><rect x="56" y="-6" width="6" height="22" rx="1.5"></rect><rect x="66" y="-2" width="6" height="18" rx="1.5"></rect></g><g id="staff-3d-matrix-hacker"><rect x="26" y="54" width="48" height="21" rx="6" fill="#121217" stroke="#f97316" stroke-width="1.5"></rect><path d="M 30 53 Q 50 58 70 53 Q 62 61 50 61 Q 38 61 30 53 Z" fill="#1f1f28" stroke="#f97316" stroke-width="1"></path><path d="M 44 59 Q 42 66 45 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="43.5" y="70" width="2.5" height="3.5" rx="0.5" fill="#f97316"></rect><path d="M 56 59 Q 58 66 55 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="54" y="70" width="2.5" height="3.5" rx="0.5" fill="#f97316"></rect><path d="M 35 66 L 65 66 L 62 73 L 38 73 Z" fill="#09090d" stroke="#27272a" stroke-width="0.8"></path><line x1="36" y1="66" x2="38" y2="70" stroke="#f97316" stroke-width="1"></line><line x1="64" y1="66" x2="62" y2="70" stroke="#f97316" stroke-width="1"></line><g transform="translate(56, 60)"><rect x="0" y="0" width="8" height="4" fill="#000000" stroke="#fed7aa" stroke-width="0.6"></rect><line x1="2" y1="1" x2="2" y2="3" stroke="#f97316" stroke-width="0.6"></line><line x1="4" y1="1" x2="4" y2="3" stroke="#f97316" stroke-width="1"></line><line x1="6" y1="1" x2="6" y2="3" stroke="#f97316" stroke-width="0.6"></line></g></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#f97316" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#f97316" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#f97316" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#f97316"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#f97316" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#f97316"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#f97316;background-color:#f9731615;border-color:#f9731640">Overclocked Phreak</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Overclocked Phreak</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">lunch</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Extreme liquid-cooled rig featuring exposed copper cranium heatsink cooling fins glowing brightly with molten thermal heat.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #8b5cf625 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #8b5cf640)"><defs><linearGradient id="grad-skin_37-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#8b5cf6"></stop><stop offset="100%" stop-color="#2e1065"></stop></linearGradient><linearGradient id="grad-skin_37-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#8b5cf6"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_37-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#8b5cf6" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_37" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g fill="none" stroke-linecap="round"><path d="M 24 30 C 12 46, 14 74, 16 90" stroke="#8b5cf6" stroke-width="3"></path><path d="M 30 26 C 22 50, 24 80, 26 94" stroke="#c4b5fd" stroke-width="2.5"></path><path d="M 70 26 C 78 50, 76 80, 74 94" stroke="#c4b5fd" stroke-width="2.5"></path><path d="M 76 30 C 88 46, 86 74, 84 90" stroke="#8b5cf6" stroke-width="3"></path></g><g id="staff-3d-matrix-hacker"><rect x="26" y="54" width="48" height="21" rx="6" fill="#121217" stroke="#8b5cf6" stroke-width="1.5"></rect><path d="M 30 53 Q 50 58 70 53 Q 62 61 50 61 Q 38 61 30 53 Z" fill="#1f1f28" stroke="#8b5cf6" stroke-width="1"></path><path d="M 44 59 Q 42 66 45 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="43.5" y="70" width="2.5" height="3.5" rx="0.5" fill="#8b5cf6"></rect><path d="M 56 59 Q 58 66 55 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="54" y="70" width="2.5" height="3.5" rx="0.5" fill="#8b5cf6"></rect><path d="M 35 66 L 65 66 L 62 73 L 38 73 Z" fill="#09090d" stroke="#27272a" stroke-width="0.8"></path><line x1="36" y1="66" x2="38" y2="70" stroke="#8b5cf6" stroke-width="1"></line><line x1="64" y1="66" x2="62" y2="70" stroke="#8b5cf6" stroke-width="1"></line><g transform="translate(56, 60)"><rect x="0" y="0" width="8" height="4" fill="#000000" stroke="#c4b5fd" stroke-width="0.6"></rect><line x1="2" y1="1" x2="2" y2="3" stroke="#8b5cf6" stroke-width="0.6"></line><line x1="4" y1="1" x2="4" y2="3" stroke="#8b5cf6" stroke-width="1"></line><line x1="6" y1="1" x2="6" y2="3" stroke="#8b5cf6" stroke-width="0.6"></line></g></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#8b5cf6" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#8b5cf6" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#8b5cf6" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#8b5cf6"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#8b5cf6" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#8b5cf6"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#8b5cf6;background-color:#8b5cf615;border-color:#8b5cf640">Fiber Cablehead</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Fiber Cablehead</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">lunch</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Deep-net diving suit with a cascade of glowing fiber-optic cable dreadlocks flowing down behind the helmet.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div></div><div class="pt-4 border-t border-[#26262b] flex flex-wrap items-center justify-between gap-3 text-xs"><span class="text-slate-400 font-mono text-[11px]">Showing <!-- -->1<!-- --> -<!-- --> <!-- -->48<!-- --> of <!-- -->148<!-- --> items</span><div class="flex items-center gap-1.5"><button type="button" disabled="" class="px-2.5 py-1.5 rounded-lg bg-[#202026] border border-[#2f2f38] text-slate-300 hover:text-white disabled:opacity-40 disabled:cursor-not-allowed flex items-center gap-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-left w-3.5 h-3.5" aria-hidden="true"><path d="m15 18-6-6 6-6"></path></svg><span>Prev</span></button><button class="w-7 h-7 rounded-lg text-xs font-mono font-bold transition-colors bg-[#007acc] text-white">1</button><button class="w-7 h-7 rounded-lg text-xs font-mono font-bold transition-colors bg-[#202026] text-slate-400 hover:text-white border border-[#2f2f38]">2</button><button class="w-7 h-7 rounded-lg text-xs font-mono font-bold transition-colors bg-[#202026] text-slate-400 hover:text-white border border-[#2f2f38]">3</button><button class="w-7 h-7 rounded-lg text-xs font-mono font-bold transition-colors bg-[#202026] text-slate-400 hover:text-white border border-[#2f2f38]">4</button><button type="button" class="px-2.5 py-1.5 rounded-lg bg-[#202026] border border-[#2f2f38] text-slate-300 hover:text-white disabled:opacity-40 disabled:cursor-not-allowed flex items-center gap-1"><span>Next</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-right w-3.5 h-3.5" aria-hidden="true"><path d="m9 18 6-6-6-6"></path></svg></button></div></div></section></div></div></main></div></div><!--$--><!--/$--><script id="_R_">(globalThis["TURBOPACK"] || (globalThis["TURBOPACK"] = [])).push({"otherChunks":["static/chunks/3xic34odrqk7-.js","static/chunks/3-rp__fazq2qp.js","static/chunks/3oyu3ojtboiqk.js","static/chunks/27y6z1uobtyg2.js"],"runtimeModuleIds":[94553]});</script><script src="/_next/static/chunks/3xic34odrqk7-.js" async=""></script><script>(self.__next_f=self.__next_f||[]).push([0])</script><script>self.__next_f.push([1,"1:\"$Sreact.fragment\"\n2:\"/_next/static/chunks/31d3_w6klkslg.js\"\n3:I[28761,[\"$2\"],\"default\"]\n4:I[39756,[\"$2\"],\"default\"]\n5:I[37457,[\"$2\"],\"default\"]\n9:I[47257,[\"$2\"],\"ClientPageRoot\"]\na:\"/_next/static/chunks/23uup1e8841av.js\"\nb:\"/_next/static/chunks/2rx7xvi55ohln.js\"\nc:I[30536,[\"$2\",\"$a\",\"$b\"],\"default\"]\nf:I[97367,[\"$2\"],\"OutletBoundary\"]\n10:\"$Sreact.suspense\"\n12:\"ViewportBoundary\"\n13:I[97367,[\"$2\"],\"$12\"]\n15:\"MetadataBoundary\"\n16:I[97367,[\"$2\"],\"$15\"]\n18:I[68027,[\"$2\"],\"default\",1]\n:HL[\"/_next/static/chunks/25l0z48vlvdu4.css\",\"style\"]\n:HL[\"https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;500;600;700\u0026family=Inter:wght@400;500;600;700\u0026family=JetBrains+Mono:wght@400;500;600;700\u0026family=Roboto:wght@400;500;700\u0026display=swap\",\"style\"]\n7:X\n8:[[\"children\",{\"s\":\"__PAGE__\",\"h\":512,\"d\":{\"r\":[\"$\",\"$1\",\"c\",{\"children\":[[\"$\",\"$L9\",null,{\"Component\":\"$c\",\"serverProvidedParams\":{\"searchParams\":{},\"params\":{},\"promises\":[\"$@d\",\"$@e\"]}}],[[\"$\",\"script\",\"script-0\",{\"src\":\"/_next/static/chunks/23uup1e8841av.js\",\"async\":true,\"nonce\":\"$undefined\"}],[\"$\",\"script\",\"script-1\",{\"src\":\"/_next/static/chunks/2rx7xvi55ohln.js\",\"async\":true,\"nonce\":\"$undefined\"}]],[\"$\",\"$Lf\",null,{\"children\":[\"$\",\"$10\",null,{\"name\":\"Next.MetadataOutlet\",\"children\":\"$@11\"}]}]]}],\"p\":false,\"v\":null}}]]\n6:[[\"children\",{\"s\":\"store\",\"h\":512,\"d\":{\"r\":[\"$\",\"$1\",\"c\",{\"children\":[null,[\"$\",\"$L4\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L5\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]]}],\"p\":false,\"v\":\"$7\"},\"c\":\"$Q8\"}]]\n0:{\"P\":null,\"c\":[\"\",\"store\"],\"q\":\"\",\"i\":false,\"t\":{\"t\":{\"s\":\"\",\"h\":528,\"d\":{\"r\":[\"$\",\"$1\",\"c\",{\"children\":[[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/chunks/25l0z48vlvdu4.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"script\",\"script-0\",{\"src\":\"/_next/static/chunks/31d3_w6klkslg.js\",\"async\":true,\"nonce\":\"$undefined\"}]],[\"$\",\"html\",null,{\"lang\":\"en\",\"className\":\"dark\",\"children\":[[\"$\",\"head\",null,{\"children\":[[\"$\",\"link\",null,{\"rel\":\"manifest\",\"href\":\"/manifest.json\"}],[\"$\",\"link\",null,{\"rel\":\"apple-touch-icon\",\"href\":\"/icons/icon.svg\"}],[\"$\",\"meta\",null,{\"name\":\"apple-mobile-web-app-capable\",\"content\":\"yes\"}],[\"$\",\"meta\",null,{\"name\":\"apple-mobile-web-app-status-bar-style\",\"content\":\"black-translucent\"}],[\"$\",\"link\",null,{\"rel\":\"preconnect\",\"href\":\"https://fonts.googleapis.com\"}],[\"$\",\"link\",null,{\"rel\":\"preconnect\",\"href\":\"https://fonts.gstatic.com\",\"crossOrigin\":\"anonymous\"}],[\"$\",\"link\",null,{\"href\":\"https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;500;600;700\u0026family=Inter:wght@400;500;600;700\u0026family=JetBrains+Mono:wght@400;500;600;700\u0026family=Roboto:wght@400;500;700\u0026display=swap\",\"rel\":\"stylesheet\"}],[\"$\",\"script\",null,{\"dangerouslySetInnerHTML\":{\"__html\":\"(function(){try{var raw=localStorage.getItem(\\\"agmon_theme_settings\\\");var t=\\\"dark-plus\\\";var fz=\\\"13\\\";var uf=\\\"\\\";var cf=\\\"\\\";if(raw){var s=JSON.parse(raw);if(s.theme)t=s.theme;if(s.fontSize)fz=s.fontSize;if(s.uiFont)uf=s.uiFont;if(s.codeFont)cf=s.codeFont;}document.documentElement.setAttribute(\\\"data-theme\\\",t);if(t===\\\"light-plus\\\"){document.documentElement.classList.remove(\\\"dark\\\");document.documentElement.classList.add(\\\"light\\\");}else{document.documentElement.classList.remove(\\\"light\\\");document.documentElement.classList.add(\\\"dark\\\");}document.documentElement.style.setProperty(\\\"--font-size-ui\\\",fz+\\\"px\\\");document.documentElement.style.setProperty(\\\"--font-size-base\\\",fz+\\\"px\\\");}catch(e){}})();\"}}]]}],[\"$\",\"body\",null,{\"className\":\"antialiased bg-[var(--bg-workbench)] text-[var(--text-main)] select-none\",\"children\":[[\"$\",\"$L3\",null,{}],[\"$\",\"$L4\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L5\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":[[[\"$\",\"title\",null,{\"children\":\"404: This page could not be found.\"}],[\"$\",\"div\",null,{\"style\":{\"fontFamily\":\"system-ui,\\\"Segoe UI\\\",Roboto,Helvetica,Arial,sans-serif,\\\"Apple Color Emoji\\\",\\\"Segoe UI Emoji\\\"\",\"height\":\"100vh\",\"textAlign\":\"center\",\"display\":\"flex\",\"flexDirection\":\"column\",\"alignItems\":\"center\",\"justifyContent\":\"center\"},\"children\":[\"$\",\"div\",null,{\"children\":[[\"$\",\"style\",null,{\"dangerouslySetInnerHTML\":{\"__html\":\"body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}\"}}],[\"$\",\"h1\",null,{\"className\":\"next-error-h1\",\"style\":{\"display\":\"inline-block\",\"margin\":\"0 20px 0 0\",\"padding\":\"0 23px 0 0\",\"fontSize\":24,\"fontWeight\":500,\"verticalAlign\":\"top\",\"lineHeight\":\"49px\"},\"children\":404}],[\"$\",\"div\",null,{\"style\":{\"display\":\"inline-block\"},\"children\":[\"$\",\"h2\",null,{\"style\":{\"fontSize\":14,\"fontWeight\":400,\"lineHeight\":\"49px\",\"margin\":0},\"children\":\"This page could not be found.\"}]}]]}]}]],[]],\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]]}]]}]]}],\"p\":false,\"v\":null},\"c\":\"$Q6\"},\"h\":{\"r\":[\"$\",\"$1\",\"h\",{\"children\":[null,[\"$\",\"$L13\",null,{\"children\":\"$L14\"}],[\"$\",\"$L16\",null,{\"children\":[[\"$\",\"div\",null,{\"hidden\":true,\"children\":[\"$\",\"$10\",null,{\"name\":\"Next.Metadata\",\"children\":\"$L17\"}]}],null]}],null]}],\"p\":false,\"v\":null}},\"m\":\"$undefined\",\"G\":[\"$18\",[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/chunks/25l0z48vlvdu4.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}]]],\"S\":true,\"r\":\"$undefined\",\"s\":\"$undefined\",\"a\":\"$undefined\",\"l\":\"$undefined\",\"p\":\"$undefined\",\"d\":\"$undefined\",\"b\":\"1y6Da0YgnPr2_6ncpWrbV\"}\n7:C\nd:{}\ne:\"$8:0:1:d:r:props:children:0:props:serverProvidedParams:params\"\n14:[[\"$\",\"meta\",\"0\",{\"charSet\":\"utf-8\"}],[\"$\",\"meta\",\"1\",{\"name\":\"viewport\",\"content\":\"width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no\"}],[\"$\",\"meta\",\"2\",{\"name\":\"theme-color\",\"content\":\"#070b12\"}]]\n19:I[27201,[\"$2\"],\"IconMark\"]\n11:null\n17:[[\"$\",\"title\",\"0\",{\"children\":\"AGMon - AI Agent Office \u0026 Activity Visualizer\"}],[\"$\",\"meta\",\"1\",{\"name\":\"description\",\"content\":\"Realtime activity and token flow visualizer for Antigravity, Claude Code \u0026 AI CLIs\"}],[\"$\",\"link\",\"2\",{\"rel\":\"manifest\",\"href\":\"/manifest.json\",\"crossOrigin\":\"$undefined\"}],[\"$\",\"meta\",\"3\",{\"name\":\"mobile-web-app-capable\",\"content\":\"yes\"}],[\"$\",\"meta\",\"4\",{\"name\":\"apple-mobile-web-app-title\",\"content\":\"AGMon\"}],[\"$\",\"meta\",\"5\",{\"name\":\"apple-mobile-web-app-status-bar-style\",\"content\":\"black-translucent\"}],[\"$\",\"link\",\"6\",{\"rel\":\"icon\",\"href\":\"/favicon.svg\"}],[\"$\",\"link\",\"7\",{\"rel\":\"apple-touch-icon\",\"href\":\"/icons/icon.svg\"}],[\"$\",\"$L19\",\"8\",{}]]\n"])</script></body></html>
1
+ <!DOCTYPE html><html lang="en" class="dark"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"/><link rel="stylesheet" href="/_next/static/chunks/2q9cwykv6ox1t.css" data-precedence="next"/><link rel="preload" as="script" fetchPriority="low" href="/_next/static/chunks/3xic34odrqk7-.js"/><script src="/_next/static/chunks/3-rp__fazq2qp.js" async=""></script><script src="/_next/static/chunks/3oyu3ojtboiqk.js" async=""></script><script src="/_next/static/chunks/27y6z1uobtyg2.js" async=""></script><script src="/_next/static/chunks/turbopack-3-ry682tkyiqk.js" async=""></script><script src="/_next/static/chunks/31d3_w6klkslg.js" async=""></script><script src="/_next/static/chunks/23uup1e8841av.js" async=""></script><script src="/_next/static/chunks/2rx7xvi55ohln.js" async=""></script><link rel="preload" href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;500;600;700&amp;family=Inter:wght@400;500;600;700&amp;family=JetBrains+Mono:wght@400;500;600;700&amp;family=Roboto:wght@400;500;700&amp;display=swap" as="style"/><meta name="theme-color" content="#070b12"/><title>AGMon - AI Agent Office &amp; Activity Visualizer</title><meta name="description" content="Realtime activity and token flow visualizer for Antigravity, Claude Code &amp; AI CLIs"/><link rel="manifest" href="/manifest.json"/><meta name="mobile-web-app-capable" content="yes"/><meta name="apple-mobile-web-app-title" content="AGMon"/><meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"/><link rel="icon" href="/favicon.svg"/><link rel="apple-touch-icon" href="/icons/icon.svg"/><link rel="manifest" href="/manifest.json"/><link rel="apple-touch-icon" href="/icons/icon.svg"/><meta name="apple-mobile-web-app-capable" content="yes"/><meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"/><link rel="preconnect" href="https://fonts.googleapis.com"/><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="anonymous"/><link href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;500;600;700&amp;family=Inter:wght@400;500;600;700&amp;family=JetBrains+Mono:wght@400;500;600;700&amp;family=Roboto:wght@400;500;700&amp;display=swap" rel="stylesheet"/><script>(function(){try{var raw=localStorage.getItem("agmon_theme_settings");var t="dark-plus";var fz="13";var uf="";var cf="";if(raw){var s=JSON.parse(raw);if(s.theme)t=s.theme;if(s.fontSize)fz=s.fontSize;if(s.uiFont)uf=s.uiFont;if(s.codeFont)cf=s.codeFont;}document.documentElement.setAttribute("data-theme",t);if(t==="light-plus"){document.documentElement.classList.remove("dark");document.documentElement.classList.add("light");}else{document.documentElement.classList.remove("light");document.documentElement.classList.add("dark");}document.documentElement.style.setProperty("--font-size-ui",fz+"px");document.documentElement.style.setProperty("--font-size-base",fz+"px");}catch(e){}})();</script><script src="/_next/static/chunks/0cz1d0mv5g_q7.js" noModule=""></script></head><body class="antialiased bg-[var(--bg-workbench)] text-[var(--text-main)] select-none"><div hidden=""><!--$--><!--/$--></div><div class="flex h-screen w-full bg-[#181818]"><div class="w-full h-full flex flex-col md:flex-row bg-[#141416] text-slate-300 overflow-hidden select-none"><aside data-testid="store-aside-menu" class="w-full md:w-64 lg:w-72 bg-[#18181c] border-b md:border-b-0 md:border-r border-[#26262b] flex flex-col shrink-0 h-auto md:h-full z-20 shadow-xl"><div class="p-4 border-b border-[#26262b] flex items-center justify-between bg-[#151518]"><div class="flex items-center gap-2.5"><div class="w-8 h-8 rounded-lg bg-gradient-to-br from-amber-500/30 to-amber-600/10 border border-amber-500/40 flex items-center justify-center text-amber-400 shadow-sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-shopping-bag w-4 h-4" aria-hidden="true"><path d="M16 10a4 4 0 0 1-8 0"></path><path d="M3.103 6.034h17.794"></path><path d="M3.4 5.467a2 2 0 0 0-.4 1.2V20a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6.667a2 2 0 0 0-.4-1.2l-2-2.667A2 2 0 0 0 17 2H7a2 2 0 0 0-1.6.8z"></path></svg></div><div><h2 class="text-sm font-bold text-white leading-tight">Supporter Store</h2><p class="text-[11px] text-amber-400 font-mono">148<!-- --> 3D Items &amp; Effects</p></div></div></div><div class="p-3 border-b border-[#26262b]"><div class="relative"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-search w-3.5 h-3.5 text-slate-500 absolute left-2.5 top-1/2 -translate-y-1/2" aria-hidden="true"><path d="m21 21-4.34-4.34"></path><circle cx="11" cy="11" r="8"></circle></svg><input type="text" placeholder="Search across 148 items..." class="w-full pl-8 pr-7 py-1.5 bg-[#202026] border border-[#33333d] rounded-lg text-xs text-white placeholder-slate-500 focus:outline-none focus:border-[#007acc] transition-colors" value=""/></div></div><nav class="flex-1 overflow-y-auto p-2 space-y-1 text-xs"><div class="px-2 py-1 text-[10px] font-bold text-slate-500 uppercase tracking-wider">Categories (<!-- -->148<!-- --> Items)</div><button class="w-full flex items-center justify-between px-3 py-2 rounded-lg text-left transition-all cursor-pointer bg-[#007acc] text-white font-semibold shadow-md shadow-[#007acc]/20"><div class="flex items-center gap-2.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-grid-3x3 lucide-grid lucide-grid-3-x-3 w-4 h-4 shrink-0 text-white" aria-hidden="true"><rect width="18" height="18" x="3" y="3" rx="2"></rect><path d="M3 9h18"></path><path d="M3 15h18"></path><path d="M9 3v18"></path><path d="M15 3v18"></path></svg><div><div class="leading-tight text-xs">All Items</div><div class="text-[10px] text-cyan-100 line-clamp-1">10 Themes · 50 Skins · 35 Props · 21 Pets · 16 Auras · 16 Trophies</div></div></div><span class="text-[10px] font-mono px-2 py-0.5 rounded-full bg-white/20 text-white font-bold">148</span></button><button class="w-full flex items-center justify-between px-3 py-2 rounded-lg text-left transition-all cursor-pointer text-slate-300 hover:text-white hover:bg-[#202026]"><div class="flex items-center gap-2.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-4 h-4 shrink-0 text-slate-400" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg><div><div class="leading-tight text-xs">Live Fitting Room</div><div class="text-[10px] text-slate-500 line-clamp-1">Interactive avatar sandbox, mix props &amp; test actions</div></div></div><span class="text-[9px] font-bold font-mono px-1.5 py-0.5 rounded bg-amber-500/20 text-amber-300 border border-amber-500/40">LIVE 3D</span></button><button class="w-full flex items-center justify-between px-3 py-2 rounded-lg text-left transition-all cursor-pointer text-slate-300 hover:text-white hover:bg-[#202026]"><div class="flex items-center gap-2.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-palette w-4 h-4 shrink-0 text-slate-400" aria-hidden="true"><path d="M12 22a1 1 0 0 1 0-20 10 9 0 0 1 10 9 5 5 0 0 1-5 5h-2.25a1.75 1.75 0 0 0-1.4 2.8l.3.4a1.75 1.75 0 0 1-1.4 2.8z"></path><circle cx="13.5" cy="6.5" r=".5" fill="currentColor"></circle><circle cx="17.5" cy="10.5" r=".5" fill="currentColor"></circle><circle cx="6.5" cy="12.5" r=".5" fill="currentColor"></circle><circle cx="8.5" cy="7.5" r=".5" fill="currentColor"></circle></svg><div><div class="leading-tight text-xs">Office Themes</div><div class="text-[10px] text-slate-500 line-clamp-1">Virtual office floor styles, neon grids &amp; wallpapers</div></div></div><span class="text-[10px] font-mono px-2 py-0.5 rounded-full bg-[#25252d] text-slate-400 border border-[#33333d]">10</span></button><button class="w-full flex items-center justify-between px-3 py-2 rounded-lg text-left transition-all cursor-pointer text-slate-300 hover:text-white hover:bg-[#202026]"><div class="flex items-center gap-2.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-bot w-4 h-4 shrink-0 text-slate-400" aria-hidden="true"><path d="M12 8V4H8"></path><rect width="16" height="12" x="4" y="8" rx="2"></rect><path d="M2 14h2"></path><path d="M20 14h2"></path><path d="M15 13v2"></path><path d="M9 13v2"></path></svg><div><div class="leading-tight text-xs">Agent Skins 3D</div><div class="text-[10px] text-slate-500 line-clamp-1">Cyborgs, mecha frames, and cyber armor</div></div></div><span class="text-[10px] font-mono px-2 py-0.5 rounded-full bg-[#25252d] text-slate-400 border border-[#33333d]">50</span></button><button class="w-full flex items-center justify-between px-3 py-2 rounded-lg text-left transition-all cursor-pointer text-slate-300 hover:text-white hover:bg-[#202026]"><div class="flex items-center gap-2.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-laptop w-4 h-4 shrink-0 text-slate-400" aria-hidden="true"><path d="M18 5a2 2 0 0 1 2 2v8.526a2 2 0 0 0 .212.897l1.068 2.127a1 1 0 0 1-.9 1.45H3.62a1 1 0 0 1-.9-1.45l1.068-2.127A2 2 0 0 0 4 15.526V7a2 2 0 0 1 2-2z"></path><path d="M20.054 15.987H3.946"></path></svg><div><div class="leading-tight text-xs">Tech Desk Props</div><div class="text-[10px] text-slate-500 line-clamp-1">Workstation gear, hardware, and servers</div></div></div><span class="text-[10px] font-mono px-2 py-0.5 rounded-full bg-[#25252d] text-slate-400 border border-[#33333d]">35</span></button><button class="w-full flex items-center justify-between px-3 py-2 rounded-lg text-left transition-all cursor-pointer text-slate-300 hover:text-white hover:bg-[#202026]"><div class="flex items-center gap-2.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-gift w-4 h-4 shrink-0 text-slate-400" aria-hidden="true"><path d="M12 7v14"></path><path d="M20 11v8a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2v-8"></path><path d="M7.5 7a1 1 0 0 1 0-5A4.8 8 0 0 1 12 7a4.8 8 0 0 1 4.5-5 1 1 0 0 1 0 5"></path><rect x="3" y="7" width="18" height="4" rx="1"></rect></svg><div><div class="leading-tight text-xs">Pets &amp; Companions</div><div class="text-[10px] text-slate-500 line-clamp-1">Cyber pets &amp; companion hover drones</div></div></div><span class="text-[10px] font-mono px-2 py-0.5 rounded-full bg-[#25252d] text-slate-400 border border-[#33333d]">21</span></button><button class="w-full flex items-center justify-between px-3 py-2 rounded-lg text-left transition-all cursor-pointer text-slate-300 hover:text-white hover:bg-[#202026]"><div class="flex items-center gap-2.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-4 h-4 shrink-0 text-slate-400" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg><div><div class="leading-tight text-xs">Auras &amp; Effects</div><div class="text-[10px] text-slate-500 line-clamp-1">Energy rings &amp; particle spectrums</div></div></div><span class="text-[10px] font-mono px-2 py-0.5 rounded-full bg-[#25252d] text-slate-400 border border-[#33333d]">16</span></button><button class="w-full flex items-center justify-between px-3 py-2 rounded-lg text-left transition-all cursor-pointer text-slate-300 hover:text-white hover:bg-[#202026]"><div class="flex items-center gap-2.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trophy w-4 h-4 shrink-0 text-slate-400" aria-hidden="true"><path d="M10 14.66V17a1 1 0 0 1-1 1 2 2 0 0 0-2 2v2"></path><path d="M14 14.66V17a1 1 0 0 0 1 1 2 2 0 0 1 2 2v2"></path><path d="M17.916 10H19.5A2.5 2.5 0 0 0 22 7.5V5a1 1 0 0 0-1-1h-3"></path><path d="M4 22h16"></path><path d="M6 9a6 6 0 0 0 12 0V3a1 1 0 0 0-1-1H7a1 1 0 0 0-1 1z"></path><path d="M6.084 10H4.5A2.5 2.5 0 0 1 2 7.5V5a1 1 0 0 1 1-1h3"></path></svg><div><div class="leading-tight text-xs">Trophies &amp; Badges</div><div class="text-[10px] text-slate-500 line-clamp-1">Commemorative awards, silicon wafers &amp; medals</div></div></div><span class="text-[10px] font-mono px-2 py-0.5 rounded-full bg-[#25252d] text-slate-400 border border-[#33333d]">16</span></button><button class="w-full flex items-center justify-between px-3 py-2 rounded-lg text-left transition-all cursor-pointer text-slate-300 hover:text-white hover:bg-[#202026]"><div class="flex items-center gap-2.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-volume-2 w-4 h-4 shrink-0 text-slate-400" aria-hidden="true"><path d="M11 4.702a.705.705 0 0 0-1.203-.498L6.413 7.587A1.4 1.4 0 0 1 5.416 8H3a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h2.416a1.4 1.4 0 0 1 .997.413l3.383 3.384A.705.705 0 0 0 11 19.298z"></path><path d="M16 9a5 5 0 0 1 0 6"></path><path d="M19.364 18.364a9 9 0 0 0 0-12.728"></path></svg><div><div class="leading-tight text-xs">Ambient Soundscapes</div><div class="text-[10px] text-slate-500 line-clamp-1">Lo-Fi beats &amp; focus background noise</div></div></div><span class="text-[10px] font-mono px-2 py-0.5 rounded-full bg-[#25252d] text-slate-400 border border-[#33333d]">6</span></button><button class="w-full flex items-center justify-between px-3 py-2 rounded-lg text-left transition-all cursor-pointer text-slate-300 hover:text-white hover:bg-[#202026]"><div class="flex items-center gap-2.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-coffee w-4 h-4 shrink-0 text-slate-400" aria-hidden="true"><path d="M10 2v2"></path><path d="M14 2v2"></path><path d="M16 8a1 1 0 0 1 1 1v8a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4V9a1 1 0 0 1 1-1h14a4 4 0 1 1 0 8h-1"></path><path d="M6 2v2"></path></svg><div><div class="leading-tight text-xs">Supporter Vault (VietQR)</div><div class="text-[10px] text-slate-500 line-clamp-1">Scan VietQR to unlock all VIP perks</div></div></div><span class="text-[9px] font-bold font-mono px-1.5 py-0.5 rounded bg-amber-500/20 text-amber-300 border border-amber-500/40">Buff Dev</span></button><div class="pt-3 px-2"><div class="text-[10px] font-bold text-slate-500 uppercase tracking-wider mb-1.5 flex items-center gap-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-funnel lucide-filter w-3 h-3 text-cyan-400" aria-hidden="true"><path d="M10 20a1 1 0 0 0 .553.895l2 1A1 1 0 0 0 14 21v-7a2 2 0 0 1 .517-1.341L21.74 4.67A1 1 0 0 0 21 3H3a1 1 0 0 0-.742 1.67l7.225 7.989A2 2 0 0 1 10 14z"></path></svg><span>Filter by Tier</span></div><div class="flex flex-wrap gap-1"><button class="px-2 py-1 text-[10px] rounded-md border transition-colors cursor-pointer bg-cyan-500/20 text-cyan-300 border-cyan-500/50 font-bold shadow-sm">All</button><button class="px-2 py-1 text-[10px] rounded-md border transition-colors cursor-pointer bg-[#202026] text-slate-400 border-[#2f2f38] hover:text-white">Free</button><button class="px-2 py-1 text-[10px] rounded-md border transition-colors cursor-pointer bg-[#202026] text-slate-400 border-[#2f2f38] hover:text-white">Coffee (20k)</button><button class="px-2 py-1 text-[10px] rounded-md border transition-colors cursor-pointer bg-[#202026] text-slate-400 border-[#2f2f38] hover:text-white">Lunch (50k)</button><button class="px-2 py-1 text-[10px] rounded-md border transition-colors cursor-pointer bg-[#202026] text-slate-400 border-[#2f2f38] hover:text-white">VIP (100k)</button></div></div><div class="pt-3 px-2"><button type="button" class="w-full flex items-center justify-center gap-1.5 px-3 py-1.5 bg-gradient-to-r from-amber-500/20 to-amber-600/20 hover:from-amber-500/30 hover:to-amber-600/30 border border-amber-500/40 text-amber-300 rounded-lg text-xs font-semibold cursor-pointer transition-all shadow-sm" title="Unlock all 148 items instantly to preview"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-zap w-3.5 h-3.5 text-amber-400" aria-hidden="true"><path d="M15.914 4a1.5 1.5 0 00-2.474-1.561l-9 9A1.5 1.5 0 005.5 14h4.002a.5.5 0 01.471.666L8.086 20a1.5 1.5 0 002.475 1.56l9-9A1.5 1.5 0 0018.5 10h-3.997a.5.5 0 01-.472-.667z"></path></svg><span>Unlock all <!-- -->148<!-- --> items (VIP Demo)</span></button></div></nav><div class="p-3 border-t border-[#26262b] bg-[#121215] text-xs space-y-2"><div class="flex items-center justify-between text-[11px] text-slate-400 font-semibold"><span>Current Avatar</span><span class="font-mono text-[9px] px-1.5 py-0.5 rounded font-bold bg-slate-800 text-slate-400 border border-slate-700">FREE AGENT</span></div><div class="flex items-center gap-3 p-2 rounded-xl bg-[#1d1d23] border border-[#2b2b34] shadow-inner"><div class="w-14 h-14 rounded-lg bg-[#141418] border border-[#33333d] flex items-center justify-center shrink-0 overflow-hidden relative shadow-inner"><div class="relative select-none flex items-center justify-center overflow-hidden w-full h-full"><svg viewBox="-65 -95 130 130" class="w-full h-full block" style="filter:drop-shadow(0 12px 24px rgba(0,0,0,0.5))"><defs><radialGradient id="lra__R_1kanpflb__ambientGlow" cx="50%" cy="50%" r="50%"><stop offset="0%" stop-color="#38bdf8" stop-opacity="0.25"></stop><stop offset="70%" stop-color="#14161a" stop-opacity="0.05"></stop><stop offset="100%" stop-color="transparent" stop-opacity="0"></stop></radialGradient><linearGradient id="lra__R_1kanpflb__bodyGradient" x1="0" y1="0" x2="0" y2="1"><stop offset="0%" stop-color="#ffffff"></stop><stop offset="50%" stop-color="#1e2430"></stop><stop offset="100%" stop-color="#111622"></stop></linearGradient><linearGradient id="lra__R_1kanpflb__headGradient" x1="0" y1="0" x2="0" y2="1"><stop offset="0%" stop-color="#2d3748"></stop><stop offset="60%" stop-color="#1e2430"></stop><stop offset="100%" stop-color="#111622"></stop></linearGradient><linearGradient id="lra__R_1kanpflb__deskGradient" x1="0" y1="0" x2="0" y2="1"><stop offset="0%" stop-color="#2b3443"></stop><stop offset="100%" stop-color="#181d26"></stop></linearGradient><linearGradient id="lra__R_1kanpflb__floorGradient" x1="0" y1="0" x2="0" y2="1"><stop offset="0%" stop-color="#1e222b"></stop><stop offset="100%" stop-color="#14161a"></stop></linearGradient></defs><g transform="translate(0, -42)"><g><g></g></g></g><g id="agent-root" transform="translate(0, -50)"><g><g id="staff-torso-cyber-suit"><polygon points="-18,-30 18,-30 15,-6 -15,-6" fill="url(#lra__R_1kanpflb__bodyGradient)" stroke="#00f0ff" stroke-width="1.2"></polygon><polygon points="-17,-30 -7,-14 -13,-14" fill="#0d1117" stroke="#00f0ff" stroke-width="0.8"></polygon><polygon points="17,-30 7,-14 13,-14" fill="#0d1117" stroke="#00f0ff" stroke-width="0.8"></polygon><line x1="0" y1="-30" x2="0" y2="-10" stroke="#00f0ff" stroke-width="1.4"></line><rect x="-14" y="-22" width="5" height="3" rx="1" fill="#1f2937" stroke="#00f0ff" stroke-width="0.6"></rect><rect x="9" y="-22" width="5" height="3" rx="1" fill="#1f2937" stroke="#00f0ff" stroke-width="0.6"></rect><path d="M -5 -30 Q 0 -18 5 -30" stroke="#ffffff" stroke-width="1.2" fill="none" opacity="0.85"></path><rect x="-4.5" y="-19" width="9" height="12" rx="1.5" fill="#090d16" stroke="#00f0ff" stroke-width="1"></rect><rect x="-3" y="-17.5" width="6" height="4.5" rx="0.5" fill="#00f0ff"></rect><line x1="-3" y1="-11" x2="3" y2="-11" stroke="#ffffff" stroke-width="0.8"></line><line x1="-3" y1="-9" x2="1" y2="-9" stroke="#ffffff" stroke-width="0.8"></line><rect x="-15" y="-10" width="30" height="4" fill="#020617"></rect><rect x="-3.5" y="-11" width="7" height="6" rx="1" fill="#1e293b" stroke="#00f0ff" stroke-width="1"></rect></g><g><rect x="-26" y="-26" width="8" height="24" rx="4" fill="#1e2430" stroke="#00f0ff" stroke-width="0.8"></rect><line x1="-25" y1="-6" x2="-19" y2="-6" stroke="#00f0ff" stroke-width="1"></line></g><g><rect x="18" y="-26" width="8" height="24" rx="4" fill="#1e2430" stroke="#00f0ff" stroke-width="0.8"></rect><line x1="19" y1="-6" x2="25" y2="-6" stroke="#00f0ff" stroke-width="1"></line></g><circle cx="-27" cy="-56" r="8" fill="#00f0ff"></circle><circle cx="27" cy="-56" r="8" fill="#00f0ff"></circle><ellipse cx="0" cy="-56" rx="26" ry="24" fill="url(#lra__R_1kanpflb__headGradient)" stroke="#00f0ff" stroke-width="2.2"></ellipse><ellipse cx="0" cy="-53" rx="20" ry="15.5" fill="#0f141c"></ellipse><g><polygon points="-26,-66 -34,-76 -26,-72" fill="#00f0ff"></polygon><polygon points="26,-66 34,-76 26,-72" fill="#00f0ff"></polygon><rect x="-24" y="-66" width="48" height="6" rx="2" fill="#00f0ff"></rect><circle cx="0" cy="-63" r="2.5" fill="#ffffff"></circle></g><g><ellipse cx="-8" cy="-57" rx="4.8" ry="4.4" fill="#00f0ff"></ellipse><ellipse cx="8" cy="-57" rx="4.8" ry="4.4" fill="#00f0ff"></ellipse></g><ellipse cx="0" cy="-46" rx="6.5" ry="3" fill="#00f0ff"></ellipse><g></g></g></g></svg></div></div><div class="space-y-0.5 flex-1 min-w-0"><div class="font-bold text-white text-xs truncate">Neon Enforcer</div><div class="text-[10px] text-purple-300 truncate flex items-center gap-1"><span>Theme:</span><span class="font-semibold truncate">Classic Charcoal Slate</span></div><div class="text-[10px] text-slate-400 truncate flex items-center gap-1"><span>Pet:</span><span class="text-pink-300 font-semibold truncate">None</span></div><div class="text-[10px] text-cyan-400 truncate flex items-center gap-1"><span>Props:</span><span class="font-bold">0<!-- --> equipped</span></div></div></div><button type="button" class="w-full flex items-center justify-center gap-1.5 py-1.5 px-3 rounded-lg bg-cyan-500/10 hover:bg-cyan-500/20 border border-cyan-500/30 text-cyan-300 text-xs font-semibold cursor-pointer transition-all shadow-sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5 text-cyan-400" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg><span>Open 3D Fitting Room</span></button></div></aside><main class="flex-1 flex flex-col h-full overflow-hidden bg-[#18181c]"><div class="px-6 py-4 border-b border-[#26262b] bg-[#151518] flex flex-wrap items-center justify-between gap-3 shrink-0"><div><div class="flex items-center gap-2"><span class="text-xs font-mono font-bold px-2 py-0.5 rounded bg-[#007acc]/20 text-cyan-300 border border-[#007acc]/40">CATALOG <!-- -->148</span><h1 class="text-base font-bold text-white flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-grid-3x3 lucide-grid lucide-grid-3-x-3 w-4 h-4 text-cyan-400" aria-hidden="true"><rect width="18" height="18" x="3" y="3" rx="2"></rect><path d="M3 9h18"></path><path d="M3 15h18"></path><path d="M9 3v18"></path><path d="M15 3v18"></path></svg><span>All 148 Tech Items &amp; 3D Effects</span></h1></div><p class="text-xs text-slate-400 mt-1">Collection of 148 high-precision 3D isometric items: cast shadows, directional lighting, and microchip details.</p></div><div class="flex items-center gap-2.5"><div class="flex items-center bg-[#202026] rounded-lg p-0.5 border border-[#2f2f38]"><button type="button" class="p-1.5 rounded text-xs transition-colors cursor-pointer bg-[#007acc] text-white" title="Standard grid layout (3-4 columns)"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-grid-3x3 lucide-grid lucide-grid-3-x-3 w-3.5 h-3.5" aria-hidden="true"><rect width="18" height="18" x="3" y="3" rx="2"></rect><path d="M3 9h18"></path><path d="M3 15h18"></path><path d="M9 3v18"></path><path d="M15 3v18"></path></svg></button><button type="button" class="p-1.5 rounded text-xs transition-colors cursor-pointer text-slate-400 hover:text-white" title="Compact grid layout (5-6 columns)"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-layout-grid w-3.5 h-3.5" aria-hidden="true"><rect width="7" height="7" x="3" y="3" rx="1"></rect><rect width="7" height="7" x="14" y="3" rx="1"></rect><rect width="7" height="7" x="14" y="14" rx="1"></rect><rect width="7" height="7" x="3" y="14" rx="1"></rect></svg></button></div><span class="text-xs font-mono text-cyan-300 bg-[#202026] px-3 py-1 rounded-md border border-[#2f2f38]">148 Items</span><button class="flex items-center gap-1.5 px-3 py-1 bg-gradient-to-r from-amber-500/20 to-amber-600/20 hover:from-amber-500/30 hover:to-amber-600/30 text-amber-300 border border-amber-500/40 rounded-md text-xs font-semibold cursor-pointer transition-all shadow-sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-coffee w-3.5 h-3.5" aria-hidden="true"><path d="M10 2v2"></path><path d="M14 2v2"></path><path d="M16 8a1 1 0 0 1 1 1v8a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4V9a1 1 0 0 1 1-1h14a4 4 0 1 1 0 8h-1"></path><path d="M6 2v2"></path></svg><span>Buff Dev</span></button></div></div><div class="px-6 py-2 bg-[#1b1b20] border-b border-[#26262b] flex items-center gap-1.5 overflow-x-auto text-xs shrink-0"><button class="flex items-center gap-1.5 px-3 py-1.5 rounded-lg font-medium transition-all cursor-pointer whitespace-nowrap bg-[#007acc] text-white font-bold shadow-sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-grid-3x3 lucide-grid lucide-grid-3-x-3 w-3.5 h-3.5 text-white" aria-hidden="true"><rect width="18" height="18" x="3" y="3" rx="2"></rect><path d="M3 9h18"></path><path d="M3 15h18"></path><path d="M9 3v18"></path><path d="M15 3v18"></path></svg><span>All (148)</span></button><button class="flex items-center gap-1.5 px-3 py-1.5 rounded-lg font-medium transition-all cursor-pointer whitespace-nowrap text-slate-400 hover:text-white hover:bg-[#25252e]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5 text-slate-400" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg><span>Fitting Room (3D)</span></button><button class="flex items-center gap-1.5 px-3 py-1.5 rounded-lg font-medium transition-all cursor-pointer whitespace-nowrap text-slate-400 hover:text-white hover:bg-[#25252e]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-palette w-3.5 h-3.5 text-slate-400" aria-hidden="true"><path d="M12 22a1 1 0 0 1 0-20 10 9 0 0 1 10 9 5 5 0 0 1-5 5h-2.25a1.75 1.75 0 0 0-1.4 2.8l.3.4a1.75 1.75 0 0 1-1.4 2.8z"></path><circle cx="13.5" cy="6.5" r=".5" fill="currentColor"></circle><circle cx="17.5" cy="10.5" r=".5" fill="currentColor"></circle><circle cx="6.5" cy="12.5" r=".5" fill="currentColor"></circle><circle cx="8.5" cy="7.5" r=".5" fill="currentColor"></circle></svg><span>Themes (10)</span></button><button class="flex items-center gap-1.5 px-3 py-1.5 rounded-lg font-medium transition-all cursor-pointer whitespace-nowrap text-slate-400 hover:text-white hover:bg-[#25252e]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-bot w-3.5 h-3.5 text-slate-400" aria-hidden="true"><path d="M12 8V4H8"></path><rect width="16" height="12" x="4" y="8" rx="2"></rect><path d="M2 14h2"></path><path d="M20 14h2"></path><path d="M15 13v2"></path><path d="M9 13v2"></path></svg><span>Skins (50)</span></button><button class="flex items-center gap-1.5 px-3 py-1.5 rounded-lg font-medium transition-all cursor-pointer whitespace-nowrap text-slate-400 hover:text-white hover:bg-[#25252e]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-laptop w-3.5 h-3.5 text-slate-400" aria-hidden="true"><path d="M18 5a2 2 0 0 1 2 2v8.526a2 2 0 0 0 .212.897l1.068 2.127a1 1 0 0 1-.9 1.45H3.62a1 1 0 0 1-.9-1.45l1.068-2.127A2 2 0 0 0 4 15.526V7a2 2 0 0 1 2-2z"></path><path d="M20.054 15.987H3.946"></path></svg><span>Props (35)</span></button><button class="flex items-center gap-1.5 px-3 py-1.5 rounded-lg font-medium transition-all cursor-pointer whitespace-nowrap text-slate-400 hover:text-white hover:bg-[#25252e]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-gift w-3.5 h-3.5 text-slate-400" aria-hidden="true"><path d="M12 7v14"></path><path d="M20 11v8a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2v-8"></path><path d="M7.5 7a1 1 0 0 1 0-5A4.8 8 0 0 1 12 7a4.8 8 0 0 1 4.5-5 1 1 0 0 1 0 5"></path><rect x="3" y="7" width="18" height="4" rx="1"></rect></svg><span>Pets (21)</span></button><button class="flex items-center gap-1.5 px-3 py-1.5 rounded-lg font-medium transition-all cursor-pointer whitespace-nowrap text-slate-400 hover:text-white hover:bg-[#25252e]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5 text-slate-400" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg><span>Auras (16)</span></button><button class="flex items-center gap-1.5 px-3 py-1.5 rounded-lg font-medium transition-all cursor-pointer whitespace-nowrap text-slate-400 hover:text-white hover:bg-[#25252e]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trophy w-3.5 h-3.5 text-slate-400" aria-hidden="true"><path d="M10 14.66V17a1 1 0 0 1-1 1 2 2 0 0 0-2 2v2"></path><path d="M14 14.66V17a1 1 0 0 0 1 1 2 2 0 0 1 2 2v2"></path><path d="M17.916 10H19.5A2.5 2.5 0 0 0 22 7.5V5a1 1 0 0 0-1-1h-3"></path><path d="M4 22h16"></path><path d="M6 9a6 6 0 0 0 12 0V3a1 1 0 0 0-1-1H7a1 1 0 0 0-1 1z"></path><path d="M6.084 10H4.5A2.5 2.5 0 0 1 2 7.5V5a1 1 0 0 1 1-1h3"></path></svg><span>Trophies (16)</span></button><button class="flex items-center gap-1.5 px-3 py-1.5 rounded-lg font-medium transition-all cursor-pointer whitespace-nowrap text-slate-400 hover:text-white hover:bg-[#25252e]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-volume-2 w-3.5 h-3.5 text-slate-400" aria-hidden="true"><path d="M11 4.702a.705.705 0 0 0-1.203-.498L6.413 7.587A1.4 1.4 0 0 1 5.416 8H3a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h2.416a1.4 1.4 0 0 1 .997.413l3.383 3.384A.705.705 0 0 0 11 19.298z"></path><path d="M16 9a5 5 0 0 1 0 6"></path><path d="M19.364 18.364a9 9 0 0 0 0-12.728"></path></svg><span>Ambient (6)</span></button><button class="flex items-center gap-1.5 px-3 py-1.5 rounded-lg font-medium transition-all cursor-pointer whitespace-nowrap text-slate-400 hover:text-white hover:bg-[#25252e]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-coffee w-3.5 h-3.5 text-slate-400" aria-hidden="true"><path d="M10 2v2"></path><path d="M14 2v2"></path><path d="M16 8a1 1 0 0 1 1 1v8a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4V9a1 1 0 0 1 1-1h14a4 4 0 1 1 0 8h-1"></path><path d="M6 2v2"></path></svg><span>VietQR Vault</span></button></div><div class="flex-1 overflow-y-auto p-4 sm:p-6"><div class="max-w-7xl mx-auto space-y-6"><section class="space-y-4"><div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-3.5 text-xs"><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#007acc] shadow-lg shadow-[#007acc]/15 ring-1 ring-[#007acc]"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #007acc25 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #007acc40)"><defs><linearGradient id="grad-theme_default-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#007acc"></stop><stop offset="100%" stop-color="#111827"></stop></linearGradient><linearGradient id="grad-theme_default-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#007acc"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-theme_default-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#007acc" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-theme_default" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g><defs><linearGradient id="grad-theme_default-floor-face" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#0b1018"></stop><stop offset="100%" stop-color="#161f2c"></stop></linearGradient></defs><polygon points="12,42 50,64 50,72 12,50" fill="#0b1018" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,64 88,42 88,50 50,72" fill="#161f2c" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,20 88,42 50,64 12,42" fill="url(#grad-theme_default-floor-face)" stroke="#263244" stroke-width="1.8"></polygon><line x1="31" y1="31" x2="69" y2="53" stroke="#1a2330" stroke-width="1" opacity="0.7"></line><line x1="69" y1="31" x2="31" y2="53" stroke="#1a2330" stroke-width="1" opacity="0.7"></line><line x1="40" y1="26" x2="78" y2="48" stroke="#1a2330" stroke-width="0.8" opacity="0.7"></line><line x1="60" y1="26" x2="22" y2="48" stroke="#1a2330" stroke-width="0.8" opacity="0.7"></line><polygon points="50,33 60,39 50,45 40,39" fill="#fde047" fill-opacity="0.25" stroke="#fde047" stroke-width="1"></polygon><circle cx="50" cy="39" r="2.5" fill="#fde047"></circle><polygon points="65,37 73,42 65,47 57,42" fill="#22d3ee" fill-opacity="0.2" stroke="#22d3ee" stroke-width="0.8"></polygon><polygon points="35,37 43,42 35,47 27,42" fill="#22d3ee" fill-opacity="0.2" stroke="#22d3ee" stroke-width="0.8"></polygon><circle cx="12" cy="42" r="1.5" fill="#263244"></circle><circle cx="88" cy="42" r="1.5" fill="#263244"></circle><circle cx="50" cy="20" r="1.5" fill="#263244"></circle><circle cx="50" cy="64" r="2" fill="#007acc"></circle><circle cx="50" cy="39" r="6" fill="#007acc" opacity="0.15"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#007acc;background-color:#007acc15;border-color:#007acc40">Classic Charcoal Slate</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Classic Charcoal Slate</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-emerald-500/20 text-emerald-300 border-emerald-500/40">free</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Default minimalist dark charcoal slate floor with subtle grid lines.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">EQUIPPED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" disabled="" class="px-3 py-1 rounded-lg text-xs font-semibold transition-all cursor-pointer bg-[#007acc]/20 text-[#007acc] border border-[#007acc]/30 opacity-70 cursor-default">Equipped</button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #a855f725 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #a855f740)"><defs><linearGradient id="grad-theme_cyberpunk-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#a855f7"></stop><stop offset="100%" stop-color="#111827"></stop></linearGradient><linearGradient id="grad-theme_cyberpunk-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#a855f7"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-theme_cyberpunk-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#a855f7" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-theme_cyberpunk" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g><defs><linearGradient id="grad-theme_cyberpunk-floor-face" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#0d071a"></stop><stop offset="100%" stop-color="#180b30"></stop></linearGradient></defs><polygon points="12,42 50,64 50,72 12,50" fill="#0d071a" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,64 88,42 88,50 50,72" fill="#180b30" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,20 88,42 50,64 12,42" fill="url(#grad-theme_cyberpunk-floor-face)" stroke="#a855f7" stroke-width="1.8"></polygon><line x1="31" y1="31" x2="69" y2="53" stroke="#6d28d9" stroke-width="1" opacity="0.75"></line><line x1="69" y1="31" x2="31" y2="53" stroke="#6d28d9" stroke-width="1" opacity="0.75"></line><line x1="40" y1="26" x2="78" y2="48" stroke="#6d28d9" stroke-width="0.8" opacity="0.75"></line><line x1="60" y1="26" x2="22" y2="48" stroke="#6d28d9" stroke-width="0.8" opacity="0.75"></line><polygon points="50,33 60,39 50,45 40,39" fill="#f43f5e" fill-opacity="0.25" stroke="#f43f5e" stroke-width="1"></polygon><circle cx="50" cy="39" r="2.5" fill="#f43f5e"></circle><polygon points="65,37 73,42 65,47 57,42" fill="#06b6d4" fill-opacity="0.2" stroke="#06b6d4" stroke-width="0.8"></polygon><polygon points="35,37 43,42 35,47 27,42" fill="#06b6d4" fill-opacity="0.2" stroke="#06b6d4" stroke-width="0.8"></polygon><circle cx="12" cy="42" r="1.5" fill="#a855f7"></circle><circle cx="88" cy="42" r="1.5" fill="#a855f7"></circle><circle cx="50" cy="20" r="1.5" fill="#a855f7"></circle><circle cx="50" cy="64" r="2" fill="#a855f7"></circle><circle cx="50" cy="39" r="6" fill="#a855f7" opacity="0.15"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#a855f7;background-color:#a855f715;border-color:#a855f740">Cyberpunk Neon Night</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Cyberpunk Neon Night</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-emerald-500/20 text-emerald-300 border-emerald-500/40">free</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Futuristic nighttime cyber alley with high-contrast violet grids and cyan radiance.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">UNLOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-3 py-1 rounded-lg text-xs font-semibold transition-all cursor-pointer bg-[#007acc] hover:bg-[#0088e0] text-white shadow-sm">Apply Floor</button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #10b98125 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #10b98140)"><defs><linearGradient id="grad-theme_matrix-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#10b981"></stop><stop offset="100%" stop-color="#111827"></stop></linearGradient><linearGradient id="grad-theme_matrix-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#10b981"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-theme_matrix-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#10b981" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-theme_matrix" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g><defs><linearGradient id="grad-theme_matrix-floor-face" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#030d07"></stop><stop offset="100%" stop-color="#071e11"></stop></linearGradient></defs><polygon points="12,42 50,64 50,72 12,50" fill="#030d07" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,64 88,42 88,50 50,72" fill="#071e11" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,20 88,42 50,64 12,42" fill="url(#grad-theme_matrix-floor-face)" stroke="#059669" stroke-width="1.8"></polygon><line x1="31" y1="31" x2="69" y2="53" stroke="#10b981" stroke-width="1" opacity="0.8"></line><line x1="69" y1="31" x2="31" y2="53" stroke="#10b981" stroke-width="1" opacity="0.8"></line><line x1="40" y1="26" x2="78" y2="48" stroke="#10b981" stroke-width="0.8" opacity="0.8"></line><line x1="60" y1="26" x2="22" y2="48" stroke="#10b981" stroke-width="0.8" opacity="0.8"></line><polygon points="50,33 60,39 50,45 40,39" fill="#34d399" fill-opacity="0.25" stroke="#34d399" stroke-width="1"></polygon><circle cx="50" cy="39" r="2.5" fill="#34d399"></circle><polygon points="65,37 73,42 65,47 57,42" fill="#10b981" fill-opacity="0.2" stroke="#10b981" stroke-width="0.8"></polygon><polygon points="35,37 43,42 35,47 27,42" fill="#10b981" fill-opacity="0.2" stroke="#10b981" stroke-width="0.8"></polygon><circle cx="12" cy="42" r="1.5" fill="#059669"></circle><circle cx="88" cy="42" r="1.5" fill="#059669"></circle><circle cx="50" cy="20" r="1.5" fill="#059669"></circle><circle cx="50" cy="64" r="2" fill="#10b981"></circle><circle cx="50" cy="39" r="6" fill="#10b981" opacity="0.15"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#10b981;background-color:#10b98115;border-color:#10b98140">Phosphor Matrix Terminal</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Phosphor Matrix Terminal</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-emerald-500/20 text-emerald-300 border-emerald-500/40">free</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Retro monochrome CRT terminal floor with glowing emerald phosphor matrix coordinates.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">UNLOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-3 py-1 rounded-lg text-xs font-semibold transition-all cursor-pointer bg-[#007acc] hover:bg-[#0088e0] text-white shadow-sm">Apply Floor</button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #f59e0b25 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #f59e0b40)"><defs><linearGradient id="grad-theme_cozy_loft-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#f59e0b"></stop><stop offset="100%" stop-color="#111827"></stop></linearGradient><linearGradient id="grad-theme_cozy_loft-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#f59e0b"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-theme_cozy_loft-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#f59e0b" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-theme_cozy_loft" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g><defs><linearGradient id="grad-theme_cozy_loft-floor-face" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#1c1612"></stop><stop offset="100%" stop-color="#2b211a"></stop></linearGradient></defs><polygon points="12,42 50,64 50,72 12,50" fill="#1c1612" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,64 88,42 88,50 50,72" fill="#2b211a" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,20 88,42 50,64 12,42" fill="url(#grad-theme_cozy_loft-floor-face)" stroke="#78563a" stroke-width="1.8"></polygon><line x1="31" y1="31" x2="69" y2="53" stroke="#453528" stroke-width="1" opacity="0.65"></line><line x1="69" y1="31" x2="31" y2="53" stroke="#453528" stroke-width="1" opacity="0.65"></line><line x1="40" y1="26" x2="78" y2="48" stroke="#453528" stroke-width="0.8" opacity="0.65"></line><line x1="60" y1="26" x2="22" y2="48" stroke="#453528" stroke-width="0.8" opacity="0.65"></line><polygon points="50,33 60,39 50,45 40,39" fill="#f59e0b" fill-opacity="0.25" stroke="#f59e0b" stroke-width="1"></polygon><circle cx="50" cy="39" r="2.5" fill="#f59e0b"></circle><polygon points="65,37 73,42 65,47 57,42" fill="#d97706" fill-opacity="0.2" stroke="#d97706" stroke-width="0.8"></polygon><polygon points="35,37 43,42 35,47 27,42" fill="#d97706" fill-opacity="0.2" stroke="#d97706" stroke-width="0.8"></polygon><circle cx="12" cy="42" r="1.5" fill="#78563a"></circle><circle cx="88" cy="42" r="1.5" fill="#78563a"></circle><circle cx="50" cy="20" r="1.5" fill="#78563a"></circle><circle cx="50" cy="64" r="2" fill="#f59e0b"></circle><circle cx="50" cy="39" r="6" fill="#f59e0b" opacity="0.15"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#f59e0b;background-color:#f59e0b15;border-color:#f59e0b40">Cozy Scandinavian Loft</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Cozy Scandinavian Loft</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">coffee</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Warm espresso and natural walnut wooden floor texture with amber ambient lighting.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #38bdf825 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #38bdf840)"><defs><linearGradient id="grad-theme_deep_space-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#38bdf8"></stop><stop offset="100%" stop-color="#111827"></stop></linearGradient><linearGradient id="grad-theme_deep_space-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#38bdf8"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-theme_deep_space-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#38bdf8" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-theme_deep_space" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g><defs><linearGradient id="grad-theme_deep_space-floor-face" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#050814"></stop><stop offset="100%" stop-color="#0e1429"></stop></linearGradient></defs><polygon points="12,42 50,64 50,72 12,50" fill="#050814" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,64 88,42 88,50 50,72" fill="#0e1429" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,20 88,42 50,64 12,42" fill="url(#grad-theme_deep_space-floor-face)" stroke="#0284c7" stroke-width="1.8"></polygon><line x1="31" y1="31" x2="69" y2="53" stroke="#38bdf8" stroke-width="1" opacity="0.65"></line><line x1="69" y1="31" x2="31" y2="53" stroke="#38bdf8" stroke-width="1" opacity="0.65"></line><line x1="40" y1="26" x2="78" y2="48" stroke="#38bdf8" stroke-width="0.8" opacity="0.65"></line><line x1="60" y1="26" x2="22" y2="48" stroke="#38bdf8" stroke-width="0.8" opacity="0.65"></line><polygon points="50,33 60,39 50,45 40,39" fill="#818cf8" fill-opacity="0.25" stroke="#818cf8" stroke-width="1"></polygon><circle cx="50" cy="39" r="2.5" fill="#818cf8"></circle><polygon points="65,37 73,42 65,47 57,42" fill="#38bdf8" fill-opacity="0.2" stroke="#38bdf8" stroke-width="0.8"></polygon><polygon points="35,37 43,42 35,47 27,42" fill="#38bdf8" fill-opacity="0.2" stroke="#38bdf8" stroke-width="0.8"></polygon><circle cx="12" cy="42" r="1.5" fill="#0284c7"></circle><circle cx="88" cy="42" r="1.5" fill="#0284c7"></circle><circle cx="50" cy="20" r="1.5" fill="#0284c7"></circle><circle cx="50" cy="64" r="2" fill="#38bdf8"></circle><circle cx="50" cy="39" r="6" fill="#38bdf8" opacity="0.15"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#38bdf8;background-color:#38bdf815;border-color:#38bdf840">Deep Cosmic Nebula</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Deep Cosmic Nebula</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">coffee</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Deep space observation deck with star cluster reflections and celestial indigo accents.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #94a3b825 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #94a3b840)"><defs><linearGradient id="grad-theme_cleanroom-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#94a3b8"></stop><stop offset="100%" stop-color="#111827"></stop></linearGradient><linearGradient id="grad-theme_cleanroom-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#94a3b8"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-theme_cleanroom-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#94a3b8" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-theme_cleanroom" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g><defs><linearGradient id="grad-theme_cleanroom-floor-face" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#141820"></stop><stop offset="100%" stop-color="#1e2430"></stop></linearGradient></defs><polygon points="12,42 50,64 50,72 12,50" fill="#141820" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,64 88,42 88,50 50,72" fill="#1e2430" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,20 88,42 50,64 12,42" fill="url(#grad-theme_cleanroom-floor-face)" stroke="#94a3b8" stroke-width="1.8"></polygon><line x1="31" y1="31" x2="69" y2="53" stroke="#475569" stroke-width="1" opacity="0.7"></line><line x1="69" y1="31" x2="31" y2="53" stroke="#475569" stroke-width="1" opacity="0.7"></line><line x1="40" y1="26" x2="78" y2="48" stroke="#475569" stroke-width="0.8" opacity="0.7"></line><line x1="60" y1="26" x2="22" y2="48" stroke="#475569" stroke-width="0.8" opacity="0.7"></line><polygon points="50,33 60,39 50,45 40,39" fill="#38bdf8" fill-opacity="0.25" stroke="#38bdf8" stroke-width="1"></polygon><circle cx="50" cy="39" r="2.5" fill="#38bdf8"></circle><polygon points="65,37 73,42 65,47 57,42" fill="#0ea5e9" fill-opacity="0.2" stroke="#0ea5e9" stroke-width="0.8"></polygon><polygon points="35,37 43,42 35,47 27,42" fill="#0ea5e9" fill-opacity="0.2" stroke="#0ea5e9" stroke-width="0.8"></polygon><circle cx="12" cy="42" r="1.5" fill="#94a3b8"></circle><circle cx="88" cy="42" r="1.5" fill="#94a3b8"></circle><circle cx="50" cy="20" r="1.5" fill="#94a3b8"></circle><circle cx="50" cy="64" r="2" fill="#94a3b8"></circle><circle cx="50" cy="39" r="6" fill="#94a3b8" opacity="0.15"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#94a3b8;background-color:#94a3b815;border-color:#94a3b840">Silicon Fab Cleanroom</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Silicon Fab Cleanroom</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">lunch</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">High-precision sterile semiconductor laboratory with sleek platinum and ice blue lines.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #f43f5e25 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #f43f5e40)"><defs><linearGradient id="grad-theme_synthwave-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#f43f5e"></stop><stop offset="100%" stop-color="#111827"></stop></linearGradient><linearGradient id="grad-theme_synthwave-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#f43f5e"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-theme_synthwave-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#f43f5e" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-theme_synthwave" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g><defs><linearGradient id="grad-theme_synthwave-floor-face" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#200720"></stop><stop offset="100%" stop-color="#360d2b"></stop></linearGradient></defs><polygon points="12,42 50,64 50,72 12,50" fill="#200720" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,64 88,42 88,50 50,72" fill="#360d2b" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,20 88,42 50,64 12,42" fill="url(#grad-theme_synthwave-floor-face)" stroke="#fb7185" stroke-width="1.8"></polygon><line x1="31" y1="31" x2="69" y2="53" stroke="#f43f5e" stroke-width="1" opacity="0.75"></line><line x1="69" y1="31" x2="31" y2="53" stroke="#f43f5e" stroke-width="1" opacity="0.75"></line><line x1="40" y1="26" x2="78" y2="48" stroke="#f43f5e" stroke-width="0.8" opacity="0.75"></line><line x1="60" y1="26" x2="22" y2="48" stroke="#f43f5e" stroke-width="0.8" opacity="0.75"></line><polygon points="50,33 60,39 50,45 40,39" fill="#fbbf24" fill-opacity="0.25" stroke="#fbbf24" stroke-width="1"></polygon><circle cx="50" cy="39" r="2.5" fill="#fbbf24"></circle><polygon points="65,37 73,42 65,47 57,42" fill="#ec4899" fill-opacity="0.2" stroke="#ec4899" stroke-width="0.8"></polygon><polygon points="35,37 43,42 35,47 27,42" fill="#ec4899" fill-opacity="0.2" stroke="#ec4899" stroke-width="0.8"></polygon><circle cx="12" cy="42" r="1.5" fill="#fb7185"></circle><circle cx="88" cy="42" r="1.5" fill="#fb7185"></circle><circle cx="50" cy="20" r="1.5" fill="#fb7185"></circle><circle cx="50" cy="64" r="2" fill="#f43f5e"></circle><circle cx="50" cy="39" r="6" fill="#f43f5e" opacity="0.15"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#f43f5e;background-color:#f43f5e15;border-color:#f43f5e40">Sunset Synthwave 80s</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Sunset Synthwave 80s</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">lunch</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Vibrant retro-wave sunset floor with magenta neon grid lines and warm golden horizon.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #6366f125 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #6366f140)"><defs><linearGradient id="grad-theme_quantum_void-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#6366f1"></stop><stop offset="100%" stop-color="#111827"></stop></linearGradient><linearGradient id="grad-theme_quantum_void-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#6366f1"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-theme_quantum_void-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#6366f1" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-theme_quantum_void" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g><defs><linearGradient id="grad-theme_quantum_void-floor-face" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#060608"></stop><stop offset="100%" stop-color="#0f0f14"></stop></linearGradient></defs><polygon points="12,42 50,64 50,72 12,50" fill="#060608" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,64 88,42 88,50 50,72" fill="#0f0f14" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,20 88,42 50,64 12,42" fill="url(#grad-theme_quantum_void-floor-face)" stroke="#4f46e5" stroke-width="1.8"></polygon><line x1="31" y1="31" x2="69" y2="53" stroke="#6366f1" stroke-width="1" opacity="0.75"></line><line x1="69" y1="31" x2="31" y2="53" stroke="#6366f1" stroke-width="1" opacity="0.75"></line><line x1="40" y1="26" x2="78" y2="48" stroke="#6366f1" stroke-width="0.8" opacity="0.75"></line><line x1="60" y1="26" x2="22" y2="48" stroke="#6366f1" stroke-width="0.8" opacity="0.75"></line><polygon points="50,33 60,39 50,45 40,39" fill="#a855f7" fill-opacity="0.25" stroke="#a855f7" stroke-width="1"></polygon><circle cx="50" cy="39" r="2.5" fill="#a855f7"></circle><polygon points="65,37 73,42 65,47 57,42" fill="#06b6d4" fill-opacity="0.2" stroke="#06b6d4" stroke-width="0.8"></polygon><polygon points="35,37 43,42 35,47 27,42" fill="#06b6d4" fill-opacity="0.2" stroke="#06b6d4" stroke-width="0.8"></polygon><circle cx="12" cy="42" r="1.5" fill="#4f46e5"></circle><circle cx="88" cy="42" r="1.5" fill="#4f46e5"></circle><circle cx="50" cy="20" r="1.5" fill="#4f46e5"></circle><circle cx="50" cy="64" r="2" fill="#6366f1"></circle><circle cx="50" cy="39" r="6" fill="#6366f1" opacity="0.15"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#6366f1;background-color:#6366f115;border-color:#6366f140">Quantum Obsidian Void</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Quantum Obsidian Void</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-purple-500/20 text-purple-300 border-purple-500/40">vip</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Deep obsidian black hole floor with holographic quantum interference lattice.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #f472b625 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #f472b640)"><defs><linearGradient id="grad-theme_sakura_cyber-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#f472b6"></stop><stop offset="100%" stop-color="#111827"></stop></linearGradient><linearGradient id="grad-theme_sakura_cyber-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#f472b6"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-theme_sakura_cyber-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#f472b6" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-theme_sakura_cyber" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g><defs><linearGradient id="grad-theme_sakura_cyber-floor-face" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#1f0c18"></stop><stop offset="100%" stop-color="#301326"></stop></linearGradient></defs><polygon points="12,42 50,64 50,72 12,50" fill="#1f0c18" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,64 88,42 88,50 50,72" fill="#301326" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,20 88,42 50,64 12,42" fill="url(#grad-theme_sakura_cyber-floor-face)" stroke="#ec4899" stroke-width="1.8"></polygon><line x1="31" y1="31" x2="69" y2="53" stroke="#f472b6" stroke-width="1" opacity="0.7"></line><line x1="69" y1="31" x2="31" y2="53" stroke="#f472b6" stroke-width="1" opacity="0.7"></line><line x1="40" y1="26" x2="78" y2="48" stroke="#f472b6" stroke-width="0.8" opacity="0.7"></line><line x1="60" y1="26" x2="22" y2="48" stroke="#f472b6" stroke-width="0.8" opacity="0.7"></line><polygon points="50,33 60,39 50,45 40,39" fill="#fda4af" fill-opacity="0.25" stroke="#fda4af" stroke-width="1"></polygon><circle cx="50" cy="39" r="2.5" fill="#fda4af"></circle><polygon points="65,37 73,42 65,47 57,42" fill="#f43f5e" fill-opacity="0.2" stroke="#f43f5e" stroke-width="0.8"></polygon><polygon points="35,37 43,42 35,47 27,42" fill="#f43f5e" fill-opacity="0.2" stroke="#f43f5e" stroke-width="0.8"></polygon><circle cx="12" cy="42" r="1.5" fill="#ec4899"></circle><circle cx="88" cy="42" r="1.5" fill="#ec4899"></circle><circle cx="50" cy="20" r="1.5" fill="#ec4899"></circle><circle cx="50" cy="64" r="2" fill="#f472b6"></circle><circle cx="50" cy="39" r="6" fill="#f472b6" opacity="0.15"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#f472b6;background-color:#f472b615;border-color:#f472b640">Sakura Cyber Garden</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Sakura Cyber Garden</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-purple-500/20 text-purple-300 border-purple-500/40">vip</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Neo-Tokyo cherry blossom sanctuary with vibrant soft pink particle gridlines.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #eab30825 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #eab30840)"><defs><linearGradient id="grad-theme_gold_vault-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#eab308"></stop><stop offset="100%" stop-color="#111827"></stop></linearGradient><linearGradient id="grad-theme_gold_vault-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#eab308"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-theme_gold_vault-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#eab308" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-theme_gold_vault" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g><defs><linearGradient id="grad-theme_gold_vault-floor-face" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#1a1608"></stop><stop offset="100%" stop-color="#2e250c"></stop></linearGradient></defs><polygon points="12,42 50,64 50,72 12,50" fill="#1a1608" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,64 88,42 88,50 50,72" fill="#2e250c" stroke="#070a10" stroke-width="1" opacity="0.9"></polygon><polygon points="50,20 88,42 50,64 12,42" fill="url(#grad-theme_gold_vault-floor-face)" stroke="#facc15" stroke-width="1.8"></polygon><line x1="31" y1="31" x2="69" y2="53" stroke="#eab308" stroke-width="1" opacity="0.8"></line><line x1="69" y1="31" x2="31" y2="53" stroke="#eab308" stroke-width="1" opacity="0.8"></line><line x1="40" y1="26" x2="78" y2="48" stroke="#eab308" stroke-width="0.8" opacity="0.8"></line><line x1="60" y1="26" x2="22" y2="48" stroke="#eab308" stroke-width="0.8" opacity="0.8"></line><polygon points="50,33 60,39 50,45 40,39" fill="#fef08a" fill-opacity="0.25" stroke="#fef08a" stroke-width="1"></polygon><circle cx="50" cy="39" r="2.5" fill="#fef08a"></circle><polygon points="65,37 73,42 65,47 57,42" fill="#f59e0b" fill-opacity="0.2" stroke="#f59e0b" stroke-width="0.8"></polygon><polygon points="35,37 43,42 35,47 27,42" fill="#f59e0b" fill-opacity="0.2" stroke="#f59e0b" stroke-width="0.8"></polygon><circle cx="12" cy="42" r="1.5" fill="#facc15"></circle><circle cx="88" cy="42" r="1.5" fill="#facc15"></circle><circle cx="50" cy="20" r="1.5" fill="#facc15"></circle><circle cx="50" cy="64" r="2" fill="#eab308"></circle><circle cx="50" cy="39" r="6" fill="#eab308" opacity="0.15"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#eab308;background-color:#eab30815;border-color:#eab30840">Billion-Token Gold Vault</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Billion-Token Gold Vault</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-purple-500/20 text-purple-300 border-purple-500/40">vip</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Luxurious royal vault floor with gleaming gold circuitry and platinum accents.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#007acc] shadow-lg shadow-[#007acc]/15 ring-1 ring-[#007acc]"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #00f0ff25 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #00f0ff40)"><defs><linearGradient id="grad-skin_0-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#00f0ff"></stop><stop offset="100%" stop-color="#003b46"></stop></linearGradient><linearGradient id="grad-skin_0-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#00f0ff"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_0-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#00f0ff" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_0" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><polygon points="40,8 60,8 55,2 45,2" fill="#00f0ff"></polygon><line x1="50" y1="2" x2="50" y2="8" stroke="#ffffff" stroke-width="1.5"></line><polygon points="18,24 10,12 18,18" fill="#00f0ff"></polygon><polygon points="82,24 90,12 82,18" fill="#00f0ff"></polygon></g><g id="staff-3d-cyber-suit"><polygon points="28,54 72,54 65,74 35,74" fill="url(#grad-skin_0-left)" stroke="#00f0ff" stroke-width="1.4"></polygon><polygon points="30,54 44,66 38,66" fill="#090d16" stroke="#00f0ff" stroke-width="0.8"></polygon><polygon points="70,54 56,66 62,66" fill="#090d16" stroke="#00f0ff" stroke-width="0.8"></polygon><line x1="50" y1="54" x2="50" y2="70" stroke="#00f0ff" stroke-width="1.2"></line><path d="M 46 54 Q 50 63 54 54" stroke="#ffffff" stroke-width="1" fill="none" opacity="0.85"></path><rect x="46" y="61" width="8" height="10" rx="1" fill="#070a12" stroke="#00f0ff" stroke-width="0.8"></rect><rect x="47.5" y="62.5" width="5" height="3" fill="#00f0ff"></rect><line x1="47.5" y1="67" x2="52.5" y2="67" stroke="#ffffff" stroke-width="0.6"></line><rect x="47" y="71" width="6" height="3.5" rx="0.8" fill="#1e293b" stroke="#00f0ff" stroke-width="0.8"></rect></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#00f0ff" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#00f0ff" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#00f0ff" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#00f0ff"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#00f0ff" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#00f0ff"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#00f0ff;background-color:#00f0ff15;border-color:#00f0ff40">Neon Enforcer</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Neon Enforcer</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-emerald-500/20 text-emerald-300 border-emerald-500/40">free</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Standard tactical patrol armor with dual wing antennas, high-intensity neon cyan brow visor, and responsive reactor core.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">EQUIPPED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" disabled="" class="px-3 py-1 rounded-lg text-xs font-semibold transition-all cursor-pointer bg-[#007acc]/20 text-[#007acc] border border-[#007acc]/30 opacity-70 cursor-default">Equipped</button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #f43f5e25 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #f43f5e40)"><defs><linearGradient id="grad-skin_1-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#f43f5e"></stop><stop offset="100%" stop-color="#4c0519"></stop></linearGradient><linearGradient id="grad-skin_1-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#f43f5e"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_1-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#f43f5e" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_1" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><circle cx="60" cy="34" r="8" fill="none" stroke="#f43f5e" stroke-width="1.8"></circle><line x1="60" y1="22" x2="60" y2="46" stroke="#f43f5e" stroke-width="1" stroke-dasharray="1 2"></line><line x1="48" y1="34" x2="72" y2="34" stroke="#f43f5e" stroke-width="1" stroke-dasharray="1 2"></line><circle cx="60" cy="34" r="2.5" fill="#ff0000"></circle></g><g id="staff-3d-cyber-suit"><polygon points="28,54 72,54 65,74 35,74" fill="url(#grad-skin_1-left)" stroke="#f43f5e" stroke-width="1.4"></polygon><polygon points="30,54 44,66 38,66" fill="#090d16" stroke="#f43f5e" stroke-width="0.8"></polygon><polygon points="70,54 56,66 62,66" fill="#090d16" stroke="#f43f5e" stroke-width="0.8"></polygon><line x1="50" y1="54" x2="50" y2="70" stroke="#f43f5e" stroke-width="1.2"></line><path d="M 46 54 Q 50 63 54 54" stroke="#fb7185" stroke-width="1" fill="none" opacity="0.85"></path><rect x="46" y="61" width="8" height="10" rx="1" fill="#070a12" stroke="#f43f5e" stroke-width="0.8"></rect><rect x="47.5" y="62.5" width="5" height="3" fill="#f43f5e"></rect><line x1="47.5" y1="67" x2="52.5" y2="67" stroke="#ffffff" stroke-width="0.6"></line><rect x="47" y="71" width="6" height="3.5" rx="0.8" fill="#1e293b" stroke="#f43f5e" stroke-width="0.8"></rect></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#f43f5e" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#f43f5e" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#f43f5e" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#f43f5e"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#f43f5e" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#f43f5e"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#f43f5e;background-color:#f43f5e15;border-color:#f43f5e40">Crimson Striker</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Crimson Striker</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-emerald-500/20 text-emerald-300 border-emerald-500/40">free</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Lightweight urban reconnaissance armor with an asymmetric tactical monocle HUD and red crosshair targeting optic.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">UNLOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-3 py-1 rounded-lg text-xs font-semibold transition-all cursor-pointer bg-[#007acc] hover:bg-[#0088e0] text-white shadow-sm">Equip</button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #f59e0b25 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #f59e0b40)"><defs><linearGradient id="grad-skin_2-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#f59e0b"></stop><stop offset="100%" stop-color="#451a03"></stop></linearGradient><linearGradient id="grad-skin_2-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#f59e0b"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_2-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#f59e0b" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_2" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><rect x="22" y="18" width="56" height="10" rx="3" fill="#181824" stroke="#f59e0b" stroke-width="1.8"></rect><circle cx="32" cy="23" r="2.5" fill="#fef3c7"></circle><circle cx="68" cy="23" r="2.5" fill="#fef3c7"></circle></g><g id="staff-3d-cyber-suit"><polygon points="28,54 72,54 65,74 35,74" fill="url(#grad-skin_2-left)" stroke="#f59e0b" stroke-width="1.4"></polygon><polygon points="30,54 44,66 38,66" fill="#090d16" stroke="#f59e0b" stroke-width="0.8"></polygon><polygon points="70,54 56,66 62,66" fill="#090d16" stroke="#f59e0b" stroke-width="0.8"></polygon><line x1="50" y1="54" x2="50" y2="70" stroke="#f59e0b" stroke-width="1.2"></line><path d="M 46 54 Q 50 63 54 54" stroke="#fef3c7" stroke-width="1" fill="none" opacity="0.85"></path><rect x="46" y="61" width="8" height="10" rx="1" fill="#070a12" stroke="#f59e0b" stroke-width="0.8"></rect><rect x="47.5" y="62.5" width="5" height="3" fill="#f59e0b"></rect><line x1="47.5" y1="67" x2="52.5" y2="67" stroke="#ffffff" stroke-width="0.6"></line><rect x="47" y="71" width="6" height="3.5" rx="0.8" fill="#1e293b" stroke="#f59e0b" stroke-width="0.8"></rect></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#f59e0b" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#f59e0b" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#f59e0b" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#f59e0b"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#f59e0b" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#f59e0b"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#f59e0b;background-color:#f59e0b15;border-color:#f59e0b40">Amber Sentinel</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Amber Sentinel</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">coffee</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Heavy reinforced blast armor featuring a hardened ballistic neck gorget and dual flashing amber emergency strobes.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #a855f725 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #a855f740)"><defs><linearGradient id="grad-skin_3-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#a855f7"></stop><stop offset="100%" stop-color="#2e1065"></stop></linearGradient><linearGradient id="grad-skin_3-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#a855f7"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_3-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#a855f7" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_3" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><polygon points="28,20 16,2 34,14" fill="#a855f7" stroke="#2e1065" stroke-width="1"></polygon><polygon points="72,20 84,2 66,14" fill="#a855f7" stroke="#2e1065" stroke-width="1"></polygon><line x1="30" y1="16" x2="22" y2="6" stroke="#e9d5ff" stroke-width="1.5"></line><line x1="70" y1="16" x2="78" y2="6" stroke="#e9d5ff" stroke-width="1.5"></line></g><g id="staff-3d-cyber-suit"><polygon points="28,54 72,54 65,74 35,74" fill="url(#grad-skin_3-left)" stroke="#a855f7" stroke-width="1.4"></polygon><polygon points="30,54 44,66 38,66" fill="#090d16" stroke="#a855f7" stroke-width="0.8"></polygon><polygon points="70,54 56,66 62,66" fill="#090d16" stroke="#a855f7" stroke-width="0.8"></polygon><line x1="50" y1="54" x2="50" y2="70" stroke="#a855f7" stroke-width="1.2"></line><path d="M 46 54 Q 50 63 54 54" stroke="#e9d5ff" stroke-width="1" fill="none" opacity="0.85"></path><rect x="46" y="61" width="8" height="10" rx="1" fill="#070a12" stroke="#a855f7" stroke-width="0.8"></rect><rect x="47.5" y="62.5" width="5" height="3" fill="#a855f7"></rect><line x1="47.5" y1="67" x2="52.5" y2="67" stroke="#ffffff" stroke-width="0.6"></line><rect x="47" y="71" width="6" height="3.5" rx="0.8" fill="#1e293b" stroke="#a855f7" stroke-width="0.8"></rect></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#a855f7" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#a855f7" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#a855f7" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#a855f7"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#a855f7" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#a855f7"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#a855f7;background-color:#a855f715;border-color:#a855f740">Electric Specter</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Electric Specter</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">coffee</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Covert electronic warfare suit equipped with twin swept-back cyber horn sensor antennas and purple pulse conduits.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #fbbf2425 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #fbbf2440)"><defs><linearGradient id="grad-skin_4-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#fbbf24"></stop><stop offset="100%" stop-color="#78350f"></stop></linearGradient><linearGradient id="grad-skin_4-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#fbbf24"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_4-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#fbbf24" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_4" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g fill="#fbbf24"><polygon points="32,18 36,4 42,16"></polygon><polygon points="46,14 50,0 54,14"></polygon><polygon points="58,16 64,4 68,18"></polygon><circle cx="50" cy="18" r="3" fill="#ffffff"></circle></g><g id="staff-3d-cyber-suit"><polygon points="28,54 72,54 65,74 35,74" fill="url(#grad-skin_4-left)" stroke="#fbbf24" stroke-width="1.4"></polygon><polygon points="30,54 44,66 38,66" fill="#090d16" stroke="#fbbf24" stroke-width="0.8"></polygon><polygon points="70,54 56,66 62,66" fill="#090d16" stroke="#fbbf24" stroke-width="0.8"></polygon><line x1="50" y1="54" x2="50" y2="70" stroke="#fbbf24" stroke-width="1.2"></line><path d="M 46 54 Q 50 63 54 54" stroke="#ffffff" stroke-width="1" fill="none" opacity="0.85"></path><rect x="46" y="61" width="8" height="10" rx="1" fill="#070a12" stroke="#fbbf24" stroke-width="0.8"></rect><rect x="47.5" y="62.5" width="5" height="3" fill="#fbbf24"></rect><line x1="47.5" y1="67" x2="52.5" y2="67" stroke="#ffffff" stroke-width="0.6"></line><rect x="47" y="71" width="6" height="3.5" rx="0.8" fill="#1e293b" stroke="#fbbf24" stroke-width="0.8"></rect></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#fbbf24" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#fbbf24" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#fbbf24" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#fbbf24"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#fbbf24" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#fbbf24"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#fbbf24;background-color:#fbbf2415;border-color:#fbbf2440">Gilded Vanguard</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Gilded Vanguard</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">coffee</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Ceremonial commander battlesuit crowned with triple golden heatsink radiators and an auric gold arc reactor.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #84cc1625 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #84cc1640)"><defs><linearGradient id="grad-skin_5-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#84cc16"></stop><stop offset="100%" stop-color="#1a2e05"></stop></linearGradient><linearGradient id="grad-skin_5-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#84cc16"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_5-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#84cc16" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_5" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><circle cx="34" cy="46" r="7" fill="#181824" stroke="#84cc16" stroke-width="1.6"></circle><circle cx="66" cy="46" r="7" fill="#181824" stroke="#84cc16" stroke-width="1.6"></circle><circle cx="34" cy="46" r="3" fill="#84cc16"></circle><circle cx="66" cy="46" r="3" fill="#84cc16"></circle><rect x="42" y="44" width="16" height="6" rx="2" fill="#0f0f18" stroke="#84cc16" stroke-width="1"></rect></g><g id="staff-3d-cyber-suit"><polygon points="28,54 72,54 65,74 35,74" fill="url(#grad-skin_5-left)" stroke="#84cc16" stroke-width="1.4"></polygon><polygon points="30,54 44,66 38,66" fill="#090d16" stroke="#84cc16" stroke-width="0.8"></polygon><polygon points="70,54 56,66 62,66" fill="#090d16" stroke="#84cc16" stroke-width="0.8"></polygon><line x1="50" y1="54" x2="50" y2="70" stroke="#84cc16" stroke-width="1.2"></line><path d="M 46 54 Q 50 63 54 54" stroke="#bef264" stroke-width="1" fill="none" opacity="0.85"></path><rect x="46" y="61" width="8" height="10" rx="1" fill="#070a12" stroke="#84cc16" stroke-width="0.8"></rect><rect x="47.5" y="62.5" width="5" height="3" fill="#84cc16"></rect><line x1="47.5" y1="67" x2="52.5" y2="67" stroke="#ffffff" stroke-width="0.6"></line><rect x="47" y="71" width="6" height="3.5" rx="0.8" fill="#1e293b" stroke="#84cc16" stroke-width="0.8"></rect></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#84cc16" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#84cc16" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#84cc16" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#84cc16"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#84cc16" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#84cc16"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#84cc16;background-color:#84cc1615;border-color:#84cc1640">Acid Hazard</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Acid Hazard</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">lunch</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Contaminated zone exosuit with dual canister filtration respirators and high-visibility yellow hazard chevron stripes.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #38bdf825 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #38bdf840)"><defs><linearGradient id="grad-skin_6-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#38bdf8"></stop><stop offset="100%" stop-color="#082f49"></stop></linearGradient><linearGradient id="grad-skin_6-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#38bdf8"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_6-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#38bdf8" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_6" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><polygon points="30,28 40,24 48,28 48,40 40,44 30,40" fill="#0c4a6e" stroke="#38bdf8" stroke-width="1.8"></polygon><polygon points="52,28 60,24 70,28 70,40 60,44 52,40" fill="#0c4a6e" stroke="#38bdf8" stroke-width="1.8"></polygon><circle cx="39" cy="34" r="3" fill="#e0f2fe"></circle><circle cx="61" cy="34" r="3" fill="#e0f2fe"></circle></g><g id="staff-3d-cyber-suit"><polygon points="28,54 72,54 65,74 35,74" fill="url(#grad-skin_6-left)" stroke="#38bdf8" stroke-width="1.4"></polygon><polygon points="30,54 44,66 38,66" fill="#090d16" stroke="#38bdf8" stroke-width="0.8"></polygon><polygon points="70,54 56,66 62,66" fill="#090d16" stroke="#38bdf8" stroke-width="0.8"></polygon><line x1="50" y1="54" x2="50" y2="70" stroke="#38bdf8" stroke-width="1.2"></line><path d="M 46 54 Q 50 63 54 54" stroke="#e0f2fe" stroke-width="1" fill="none" opacity="0.85"></path><rect x="46" y="61" width="8" height="10" rx="1" fill="#070a12" stroke="#38bdf8" stroke-width="0.8"></rect><rect x="47.5" y="62.5" width="5" height="3" fill="#38bdf8"></rect><line x1="47.5" y1="67" x2="52.5" y2="67" stroke="#ffffff" stroke-width="0.6"></line><rect x="47" y="71" width="6" height="3.5" rx="0.8" fill="#1e293b" stroke="#38bdf8" stroke-width="0.8"></rect></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#38bdf8" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#38bdf8" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#38bdf8" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#38bdf8"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#38bdf8" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#38bdf8"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#38bdf8;background-color:#38bdf815;border-color:#38bdf840">Frost Phantom</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Frost Phantom</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">lunch</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Cryo-adapted high altitude armor featuring hexagonal dual prism goggles with icy blue internal laser refraction.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #e11d4825 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #e11d4840)"><defs><linearGradient id="grad-skin_7-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#e11d48"></stop><stop offset="100%" stop-color="#18181b"></stop></linearGradient><linearGradient id="grad-skin_7-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#e11d48"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_7-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#e11d48" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_7" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><path d="M 24 18 Q 50 -6 76 18 Q 50 6 24 18 Z" fill="#e11d48" stroke="#18181b" stroke-width="1.2"></path><circle cx="50" cy="10" r="3.5" fill="#fda4af"></circle></g><g id="staff-3d-cyber-suit"><polygon points="28,54 72,54 65,74 35,74" fill="url(#grad-skin_7-left)" stroke="#e11d48" stroke-width="1.4"></polygon><polygon points="30,54 44,66 38,66" fill="#090d16" stroke="#e11d48" stroke-width="0.8"></polygon><polygon points="70,54 56,66 62,66" fill="#090d16" stroke="#e11d48" stroke-width="0.8"></polygon><line x1="50" y1="54" x2="50" y2="70" stroke="#e11d48" stroke-width="1.2"></line><path d="M 46 54 Q 50 63 54 54" stroke="#fda4af" stroke-width="1" fill="none" opacity="0.85"></path><rect x="46" y="61" width="8" height="10" rx="1" fill="#070a12" stroke="#e11d48" stroke-width="0.8"></rect><rect x="47.5" y="62.5" width="5" height="3" fill="#e11d48"></rect><line x1="47.5" y1="67" x2="52.5" y2="67" stroke="#ffffff" stroke-width="0.6"></line><rect x="47" y="71" width="6" height="3.5" rx="0.8" fill="#1e293b" stroke="#e11d48" stroke-width="0.8"></rect></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#e11d48" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#e11d48" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#e11d48" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#e11d48"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#e11d48" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#e11d48"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#e11d48;background-color:#e11d4815;border-color:#e11d4840">Obsidian Ronin</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Obsidian Ronin</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">lunch</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Cybernetic kabuto armor with a forward-swept golden horn crest and dual neck-collar tantō blade sheaths.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #ff005525 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #ff005540)"><defs><linearGradient id="grad-skin_8-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#ff0055"></stop><stop offset="100%" stop-color="#3f0015"></stop></linearGradient><linearGradient id="grad-skin_8-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ff0055"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_8-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ff0055" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_8" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g stroke-linecap="round"><line x1="28" y1="16" x2="16" y2="2" stroke="#ff0055" stroke-width="3.5"></line><line x1="72" y1="16" x2="84" y2="2" stroke="#ff0055" stroke-width="3.5"></line><line x1="34" y1="18" x2="26" y2="6" stroke="#ffaa00" stroke-width="2"></line><line x1="66" y1="18" x2="74" y2="6" stroke="#ffaa00" stroke-width="2"></line></g><g id="staff-3d-cyber-suit"><polygon points="28,54 72,54 65,74 35,74" fill="url(#grad-skin_8-left)" stroke="#ff0055" stroke-width="1.4"></polygon><polygon points="30,54 44,66 38,66" fill="#090d16" stroke="#ff0055" stroke-width="0.8"></polygon><polygon points="70,54 56,66 62,66" fill="#090d16" stroke="#ff0055" stroke-width="0.8"></polygon><line x1="50" y1="54" x2="50" y2="70" stroke="#ff0055" stroke-width="1.2"></line><path d="M 46 54 Q 50 63 54 54" stroke="#ffaa00" stroke-width="1" fill="none" opacity="0.85"></path><rect x="46" y="61" width="8" height="10" rx="1" fill="#070a12" stroke="#ff0055" stroke-width="0.8"></rect><rect x="47.5" y="62.5" width="5" height="3" fill="#ff0055"></rect><line x1="47.5" y1="67" x2="52.5" y2="67" stroke="#ffffff" stroke-width="0.6"></line><rect x="47" y="71" width="6" height="3.5" rx="0.8" fill="#1e293b" stroke="#ff0055" stroke-width="0.8"></rect></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#ff0055" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#ff0055" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#ff0055" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#ff0055"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#ff0055" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#ff0055"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#ff0055;background-color:#ff005515;border-color:#ff005540">Solar Overdrive</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Solar Overdrive</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-purple-500/20 text-purple-300 border-purple-500/40">vip</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Hyper-clocked prototype suit featuring swept aerodynamic cooling fins glowing red-hot with plasma exhaust venting.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #ffffff25 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #ffffff40)"><defs><linearGradient id="grad-skin_9-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#ffffff"></stop><stop offset="100%" stop-color="#00f0ff"></stop></linearGradient><linearGradient id="grad-skin_9-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_9-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_9" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><ellipse cx="50" cy="18" rx="34" ry="14" fill="none" stroke="#ffffff" stroke-width="1.8" stroke-dasharray="5 3"></ellipse><circle cx="50" cy="4" r="4" fill="#38bdf8"></circle></g><g id="staff-3d-cyber-suit"><polygon points="28,54 72,54 65,74 35,74" fill="url(#grad-skin_9-left)" stroke="#ffffff" stroke-width="1.4"></polygon><polygon points="30,54 44,66 38,66" fill="#090d16" stroke="#ffffff" stroke-width="0.8"></polygon><polygon points="70,54 56,66 62,66" fill="#090d16" stroke="#ffffff" stroke-width="0.8"></polygon><line x1="50" y1="54" x2="50" y2="70" stroke="#ffffff" stroke-width="1.2"></line><path d="M 46 54 Q 50 63 54 54" stroke="#38bdf8" stroke-width="1" fill="none" opacity="0.85"></path><rect x="46" y="61" width="8" height="10" rx="1" fill="#070a12" stroke="#ffffff" stroke-width="0.8"></rect><rect x="47.5" y="62.5" width="5" height="3" fill="#ffffff"></rect><line x1="47.5" y1="67" x2="52.5" y2="67" stroke="#ffffff" stroke-width="0.6"></line><rect x="47" y="71" width="6" height="3.5" rx="0.8" fill="#1e293b" stroke="#ffffff" stroke-width="0.8"></rect></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#ffffff" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#ffffff" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#ffffff" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#ffffff"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#ffffff" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#ffffff"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#ffffff;background-color:#ffffff15;border-color:#ffffff40">Quantum Sovereign</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Quantum Sovereign</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-purple-500/20 text-purple-300 border-purple-500/40">vip</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Legendary supreme operative armor featuring a floating crystalline holographic shroud and dual quantum emitters.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #3b82f625 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #3b82f640)"><defs><linearGradient id="grad-skin_10-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#3b82f6"></stop><stop offset="100%" stop-color="#172554"></stop></linearGradient><linearGradient id="grad-skin_10-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#3b82f6"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_10-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#3b82f6" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_10" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><polygon points="20,-2 26,-6 50,14 74,-6 80,-2 50,20" fill="#3b82f6" stroke="#172554" stroke-width="1.2"></polygon><polygon points="46,18 50,10 54,18 50,22" fill="#ef4444"></polygon></g><g id="staff-3d-mecha-pilot"><polygon points="26,54 74,54 67,76 33,76" fill="#18181b" stroke="#3b82f6" stroke-width="1.6"></polygon><polygon points="22,54 30,52 28,62 20,62" fill="#27272a" stroke="#3b82f6" stroke-width="1"></polygon><polygon points="78,54 70,52 72,62 80,62" fill="#27272a" stroke="#3b82f6" stroke-width="1"></polygon><polygon points="36,57 41,57 37,62 32,62" fill="#eab308"></polygon><polygon points="43,57 48,57 44,62 39,62" fill="#18181b"></polygon><polygon points="52,57 57,57 53,62 48,62" fill="#eab308"></polygon><polygon points="59,57 64,57 60,62 55,62" fill="#18181b"></polygon><line x1="38" y1="54" x2="39" y2="76" stroke="#3b82f6" stroke-width="1.6"></line><line x1="62" y1="54" x2="61" y2="76" stroke="#3b82f6" stroke-width="1.6"></line><circle cx="50" cy="67" r="4.5" fill="#09090b" stroke="#3b82f6" stroke-width="1.2"></circle><circle cx="50" cy="67" r="2.5" fill="#3b82f6"></circle><line x1="46" y1="67" x2="54" y2="67" stroke="#ffffff" stroke-width="0.8"></line><line x1="50" y1="63" x2="50" y2="71" stroke="#ffffff" stroke-width="0.8"></line></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#3b82f6" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#3b82f6" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#3b82f6" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#3b82f6"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#3b82f6" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#3b82f6"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#3b82f6;background-color:#3b82f615;border-color:#3b82f640">Apex Frame</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Apex Frame</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-emerald-500/20 text-emerald-300 border-emerald-500/40">free</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Iconic military mobile suit frame featuring a prominent golden V-Fin antenna crest and reinforced chin guard.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">UNLOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-3 py-1 rounded-lg text-xs font-semibold transition-all cursor-pointer bg-[#007acc] hover:bg-[#0088e0] text-white shadow-sm">Equip</button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #94a3b825 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #94a3b840)"><defs><linearGradient id="grad-skin_11-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#94a3b8"></stop><stop offset="100%" stop-color="#1e293b"></stop></linearGradient><linearGradient id="grad-skin_11-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#94a3b8"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_11-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#94a3b8" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_11" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><rect x="22" y="22" width="56" height="18" rx="3" fill="#0f172a" stroke="#94a3b8" stroke-width="2"></rect><circle cx="28" cy="8" r="4" fill="#fde047" stroke="#94a3b8" stroke-width="1.5"></circle><circle cx="72" cy="8" r="4" fill="#fde047" stroke="#94a3b8" stroke-width="1.5"></circle><rect x="8" y="48" width="16" height="12" rx="3" fill="#1a1a26" stroke="#94a3b8" stroke-width="1.5"></rect><rect x="76" y="48" width="16" height="12" rx="3" fill="#1a1a26" stroke="#94a3b8" stroke-width="1.5"></rect></g><g id="staff-3d-mecha-pilot"><polygon points="26,54 74,54 67,76 33,76" fill="#18181b" stroke="#94a3b8" stroke-width="1.6"></polygon><polygon points="22,54 30,52 28,62 20,62" fill="#27272a" stroke="#94a3b8" stroke-width="1"></polygon><polygon points="78,54 70,52 72,62 80,62" fill="#27272a" stroke="#94a3b8" stroke-width="1"></polygon><polygon points="36,57 41,57 37,62 32,62" fill="#eab308"></polygon><polygon points="43,57 48,57 44,62 39,62" fill="#18181b"></polygon><polygon points="52,57 57,57 53,62 48,62" fill="#eab308"></polygon><polygon points="59,57 64,57 60,62 55,62" fill="#18181b"></polygon><line x1="38" y1="54" x2="39" y2="76" stroke="#94a3b8" stroke-width="1.6"></line><line x1="62" y1="54" x2="61" y2="76" stroke="#94a3b8" stroke-width="1.6"></line><circle cx="50" cy="67" r="4.5" fill="#09090b" stroke="#94a3b8" stroke-width="1.2"></circle><circle cx="50" cy="67" r="2.5" fill="#94a3b8"></circle><line x1="46" y1="67" x2="54" y2="67" stroke="#ffffff" stroke-width="0.8"></line><line x1="50" y1="63" x2="50" y2="71" stroke="#ffffff" stroke-width="0.8"></line></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#94a3b8" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#94a3b8" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#94a3b8" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#94a3b8"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#94a3b8" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#94a3b8"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#94a3b8;background-color:#94a3b815;border-color:#94a3b840">Heavy Colossus</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Heavy Colossus</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-emerald-500/20 text-emerald-300 border-emerald-500/40">free</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Super-heavy trench battlesuit equipped with a massive armored blast visor, dual searchlights, and boxy shoulder pods.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">UNLOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-3 py-1 rounded-lg text-xs font-semibold transition-all cursor-pointer bg-[#007acc] hover:bg-[#0088e0] text-white shadow-sm">Equip</button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #9333ea25 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #9333ea40)"><defs><linearGradient id="grad-skin_12-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#9333ea"></stop><stop offset="100%" stop-color="#22c55e"></stop></linearGradient><linearGradient id="grad-skin_12-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#9333ea"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_12-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#9333ea" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_12" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><polygon points="47,18 50,-14 53,18" fill="#9333ea" stroke="#22c55e" stroke-width="1"></polygon><rect x="12" y="32" width="6" height="24" rx="2" fill="#9333ea" stroke="#22c55e" stroke-width="1"></rect><rect x="82" y="32" width="6" height="24" rx="2" fill="#9333ea" stroke="#22c55e" stroke-width="1"></rect></g><g id="staff-3d-mecha-pilot"><polygon points="26,54 74,54 67,76 33,76" fill="#18181b" stroke="#9333ea" stroke-width="1.6"></polygon><polygon points="22,54 30,52 28,62 20,62" fill="#27272a" stroke="#9333ea" stroke-width="1"></polygon><polygon points="78,54 70,52 72,62 80,62" fill="#27272a" stroke="#9333ea" stroke-width="1"></polygon><polygon points="36,57 41,57 37,62 32,62" fill="#eab308"></polygon><polygon points="43,57 48,57 44,62 39,62" fill="#18181b"></polygon><polygon points="52,57 57,57 53,62 48,62" fill="#eab308"></polygon><polygon points="59,57 64,57 60,62 55,62" fill="#18181b"></polygon><line x1="38" y1="54" x2="39" y2="76" stroke="#9333ea" stroke-width="1.6"></line><line x1="62" y1="54" x2="61" y2="76" stroke="#9333ea" stroke-width="1.6"></line><circle cx="50" cy="67" r="4.5" fill="#09090b" stroke="#9333ea" stroke-width="1.2"></circle><circle cx="50" cy="67" r="2.5" fill="#9333ea"></circle><line x1="46" y1="67" x2="54" y2="67" stroke="#ffffff" stroke-width="0.8"></line><line x1="50" y1="63" x2="50" y2="71" stroke="#ffffff" stroke-width="0.8"></line></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#9333ea" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#9333ea" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#9333ea" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#9333ea"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#9333ea" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#9333ea"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#9333ea;background-color:#9333ea15;border-color:#9333ea40">Berserk EVA</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Berserk EVA</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">coffee</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Unstable biomechanical pilot suit sporting a tall frontal unicorn horn blade, neon green teeth slits, and shoulder pylons.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #d9770625 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #d9770640)"><defs><linearGradient id="grad-skin_13-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#d97706"></stop><stop offset="100%" stop-color="#451a03"></stop></linearGradient><linearGradient id="grad-skin_13-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#d97706"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_13-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#d97706" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_13" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><rect x="30" y="30" width="40" height="20" rx="3" fill="#18181b" stroke="#d97706" stroke-width="1.8"></rect><line x1="38" y1="30" x2="38" y2="50" stroke="#d97706" stroke-width="1.5"></line><line x1="46" y1="30" x2="46" y2="50" stroke="#d97706" stroke-width="1.5"></line><line x1="54" y1="30" x2="54" y2="50" stroke="#d97706" stroke-width="1.5"></line><line x1="62" y1="30" x2="62" y2="50" stroke="#d97706" stroke-width="1.5"></line><rect x="22" y="-2" width="6" height="22" rx="1" fill="#27272a" stroke="#d97706" stroke-width="1"></rect><rect x="72" y="-2" width="6" height="22" rx="1" fill="#27272a" stroke="#d97706" stroke-width="1"></rect></g><g id="staff-3d-mecha-pilot"><polygon points="26,54 74,54 67,76 33,76" fill="#18181b" stroke="#d97706" stroke-width="1.6"></polygon><polygon points="22,54 30,52 28,62 20,62" fill="#27272a" stroke="#d97706" stroke-width="1"></polygon><polygon points="78,54 70,52 72,62 80,62" fill="#27272a" stroke="#d97706" stroke-width="1"></polygon><polygon points="36,57 41,57 37,62 32,62" fill="#eab308"></polygon><polygon points="43,57 48,57 44,62 39,62" fill="#18181b"></polygon><polygon points="52,57 57,57 53,62 48,62" fill="#eab308"></polygon><polygon points="59,57 64,57 60,62 55,62" fill="#18181b"></polygon><line x1="38" y1="54" x2="39" y2="76" stroke="#d97706" stroke-width="1.6"></line><line x1="62" y1="54" x2="61" y2="76" stroke="#d97706" stroke-width="1.6"></line><circle cx="50" cy="67" r="4.5" fill="#09090b" stroke="#d97706" stroke-width="1.2"></circle><circle cx="50" cy="67" r="2.5" fill="#d97706"></circle><line x1="46" y1="67" x2="54" y2="67" stroke="#ffffff" stroke-width="0.8"></line><line x1="50" y1="63" x2="50" y2="71" stroke="#ffffff" stroke-width="0.8"></line></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#d97706" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#d97706" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#d97706" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#d97706"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#d97706" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#d97706"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#d97706;background-color:#d9770615;border-color:#d9770640">Iron Juggernaut</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Iron Juggernaut</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">coffee</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Hardened mining rig armor with a heavy industrial cage grille faceplate and twin vertical smokestack exhausts.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #dc262625 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #dc262640)"><defs><linearGradient id="grad-skin_14-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#dc2626"></stop><stop offset="100%" stop-color="#450a0a"></stop></linearGradient><linearGradient id="grad-skin_14-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#dc2626"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_14-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#dc2626" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_14" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><rect x="6" y="38" width="14" height="18" rx="3" fill="#1c1917" stroke="#dc2626" stroke-width="1.5"></rect><circle cx="13" cy="44" r="2" fill="#ef4444"></circle><circle cx="13" cy="50" r="2" fill="#ef4444"></circle><rect x="80" y="38" width="14" height="18" rx="3" fill="#1c1917" stroke="#dc2626" stroke-width="1.5"></rect><circle cx="87" cy="44" r="2" fill="#ef4444"></circle><circle cx="87" cy="50" r="2" fill="#ef4444"></circle></g><g id="staff-3d-mecha-pilot"><polygon points="26,54 74,54 67,76 33,76" fill="#18181b" stroke="#dc2626" stroke-width="1.6"></polygon><polygon points="22,54 30,52 28,62 20,62" fill="#27272a" stroke="#dc2626" stroke-width="1"></polygon><polygon points="78,54 70,52 72,62 80,62" fill="#27272a" stroke="#dc2626" stroke-width="1"></polygon><polygon points="36,57 41,57 37,62 32,62" fill="#eab308"></polygon><polygon points="43,57 48,57 44,62 39,62" fill="#18181b"></polygon><polygon points="52,57 57,57 53,62 48,62" fill="#eab308"></polygon><polygon points="59,57 64,57 60,62 55,62" fill="#18181b"></polygon><line x1="38" y1="54" x2="39" y2="76" stroke="#dc2626" stroke-width="1.6"></line><line x1="62" y1="54" x2="61" y2="76" stroke="#dc2626" stroke-width="1.6"></line><circle cx="50" cy="67" r="4.5" fill="#09090b" stroke="#dc2626" stroke-width="1.2"></circle><circle cx="50" cy="67" r="2.5" fill="#dc2626"></circle><line x1="46" y1="67" x2="54" y2="67" stroke="#ffffff" stroke-width="0.8"></line><line x1="50" y1="63" x2="50" y2="71" stroke="#ffffff" stroke-width="0.8"></line></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#dc2626" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#dc2626" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#dc2626" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#dc2626"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#dc2626" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#dc2626"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#dc2626;background-color:#dc262615;border-color:#dc262640">Crimson Warmachine</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Crimson Warmachine</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">coffee</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Artillery command rig with twin shoulder-mounted micro-missile pods and a crimson HUD targeting scope.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #06b6d425 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #06b6d440)"><defs><linearGradient id="grad-skin_15-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#06b6d4"></stop><stop offset="100%" stop-color="#083344"></stop></linearGradient><linearGradient id="grad-skin_15-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#06b6d4"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_15-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#06b6d4" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_15" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g stroke="#06b6d4" stroke-width="2"><line x1="24" y1="18" x2="16" y2="-4"></line><line x1="36" y1="14" x2="32" y2="-8"></line><line x1="64" y1="14" x2="68" y2="-8"></line><line x1="76" y1="18" x2="84" y2="-4"></line><circle cx="16" cy="-4" r="2.5" fill="#67e8f9" stroke="none"></circle><circle cx="32" cy="-8" r="2.5" fill="#67e8f9" stroke="none"></circle><circle cx="68" cy="-8" r="2.5" fill="#67e8f9" stroke="none"></circle><circle cx="84" cy="-4" r="2.5" fill="#67e8f9" stroke="none"></circle></g><g id="staff-3d-mecha-pilot"><polygon points="26,54 74,54 67,76 33,76" fill="#18181b" stroke="#06b6d4" stroke-width="1.6"></polygon><polygon points="22,54 30,52 28,62 20,62" fill="#27272a" stroke="#06b6d4" stroke-width="1"></polygon><polygon points="78,54 70,52 72,62 80,62" fill="#27272a" stroke="#06b6d4" stroke-width="1"></polygon><polygon points="36,57 41,57 37,62 32,62" fill="#eab308"></polygon><polygon points="43,57 48,57 44,62 39,62" fill="#18181b"></polygon><polygon points="52,57 57,57 53,62 48,62" fill="#eab308"></polygon><polygon points="59,57 64,57 60,62 55,62" fill="#18181b"></polygon><line x1="38" y1="54" x2="39" y2="76" stroke="#06b6d4" stroke-width="1.6"></line><line x1="62" y1="54" x2="61" y2="76" stroke="#06b6d4" stroke-width="1.6"></line><circle cx="50" cy="67" r="4.5" fill="#09090b" stroke="#06b6d4" stroke-width="1.2"></circle><circle cx="50" cy="67" r="2.5" fill="#06b6d4"></circle><line x1="46" y1="67" x2="54" y2="67" stroke="#ffffff" stroke-width="0.8"></line><line x1="50" y1="63" x2="50" y2="71" stroke="#ffffff" stroke-width="0.8"></line></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#06b6d4" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#06b6d4" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#06b6d4" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#06b6d4"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#06b6d4" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#06b6d4"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#06b6d4;background-color:#06b6d415;border-color:#06b6d440">Plasma Dreadnought</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Plasma Dreadnought</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">lunch</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Naval assault mech featuring a quad-mast sensor antenna array and a high-output chest plasma reactor core.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #10b98125 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #10b98140)"><defs><linearGradient id="grad-skin_16-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#10b981"></stop><stop offset="100%" stop-color="#064e3b"></stop></linearGradient><linearGradient id="grad-skin_16-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#10b981"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_16-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#10b981" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_16" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><polygon points="6,44 14,38 22,44 22,54 14,60 6,54" fill="#064e3b" stroke="#10b981" stroke-width="1.8"></polygon><polygon points="78,44 86,38 94,44 94,54 86,60 78,54" fill="#064e3b" stroke="#10b981" stroke-width="1.8"></polygon></g><g id="staff-3d-mecha-pilot"><polygon points="26,54 74,54 67,76 33,76" fill="#18181b" stroke="#10b981" stroke-width="1.6"></polygon><polygon points="22,54 30,52 28,62 20,62" fill="#27272a" stroke="#10b981" stroke-width="1"></polygon><polygon points="78,54 70,52 72,62 80,62" fill="#27272a" stroke="#10b981" stroke-width="1"></polygon><polygon points="36,57 41,57 37,62 32,62" fill="#eab308"></polygon><polygon points="43,57 48,57 44,62 39,62" fill="#18181b"></polygon><polygon points="52,57 57,57 53,62 48,62" fill="#eab308"></polygon><polygon points="59,57 64,57 60,62 55,62" fill="#18181b"></polygon><line x1="38" y1="54" x2="39" y2="76" stroke="#10b981" stroke-width="1.6"></line><line x1="62" y1="54" x2="61" y2="76" stroke="#10b981" stroke-width="1.6"></line><circle cx="50" cy="67" r="4.5" fill="#09090b" stroke="#10b981" stroke-width="1.2"></circle><circle cx="50" cy="67" r="2.5" fill="#10b981"></circle><line x1="46" y1="67" x2="54" y2="67" stroke="#ffffff" stroke-width="0.8"></line><line x1="50" y1="63" x2="50" y2="71" stroke="#ffffff" stroke-width="0.8"></line></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#10b981" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#10b981" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#10b981" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#10b981"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#10b981" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#10b981"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#10b981;background-color:#10b98115;border-color:#10b98140">Cyber Aegis</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Cyber Aegis</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">lunch</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Heavy defensive chassis armed with a hydraulic reinforced neck brace and dual hexagonal energy shields on shoulders.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #64748b25 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #64748b40)"><defs><linearGradient id="grad-skin_17-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#64748b"></stop><stop offset="100%" stop-color="#ef4444"></stop></linearGradient><linearGradient id="grad-skin_17-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#64748b"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_17-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#64748b" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_17" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><path d="M 28 16 C 6 2, 8 -16, 28 -10 C 20 -4, 20 8, 34 16 Z" fill="#64748b" stroke="#ef4444" stroke-width="1.2"></path><path d="M 72 16 C 94 2, 92 -16, 72 -10 C 80 -4, 80 8, 66 16 Z" fill="#64748b" stroke="#ef4444" stroke-width="1.2"></path></g><g id="staff-3d-mecha-pilot"><polygon points="26,54 74,54 67,76 33,76" fill="#18181b" stroke="#64748b" stroke-width="1.6"></polygon><polygon points="22,54 30,52 28,62 20,62" fill="#27272a" stroke="#64748b" stroke-width="1"></polygon><polygon points="78,54 70,52 72,62 80,62" fill="#27272a" stroke="#64748b" stroke-width="1"></polygon><polygon points="36,57 41,57 37,62 32,62" fill="#eab308"></polygon><polygon points="43,57 48,57 44,62 39,62" fill="#18181b"></polygon><polygon points="52,57 57,57 53,62 48,62" fill="#eab308"></polygon><polygon points="59,57 64,57 60,62 55,62" fill="#18181b"></polygon><line x1="38" y1="54" x2="39" y2="76" stroke="#64748b" stroke-width="1.6"></line><line x1="62" y1="54" x2="61" y2="76" stroke="#64748b" stroke-width="1.6"></line><circle cx="50" cy="67" r="4.5" fill="#09090b" stroke="#64748b" stroke-width="1.2"></circle><circle cx="50" cy="67" r="2.5" fill="#64748b"></circle><line x1="46" y1="67" x2="54" y2="67" stroke="#ffffff" stroke-width="0.8"></line><line x1="50" y1="63" x2="50" y2="71" stroke="#ffffff" stroke-width="0.8"></line></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#64748b" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#64748b" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#64748b" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#64748b"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#64748b" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#64748b"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#64748b;background-color:#64748b15;border-color:#64748b40">Dread Goliath</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Dread Goliath</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">lunch</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Demolition battlesuit with massive curved mecha ramming horns and an intimidating single-slit red mono-eye.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #eab30825 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #eab30840)"><defs><linearGradient id="grad-skin_18-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#eab308"></stop><stop offset="100%" stop-color="#1c1917"></stop></linearGradient><linearGradient id="grad-skin_18-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#eab308"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_18-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#eab308" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_18" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><ellipse cx="20" cy="2" rx="9" ry="16" fill="#18181b" stroke="#eab308" stroke-width="2" transform="rotate(-25 20 2)"></ellipse><circle cx="20" cy="2" r="3" fill="#fef08a"></circle></g><g id="staff-3d-mecha-pilot"><polygon points="26,54 74,54 67,76 33,76" fill="#18181b" stroke="#eab308" stroke-width="1.6"></polygon><polygon points="22,54 30,52 28,62 20,62" fill="#27272a" stroke="#eab308" stroke-width="1"></polygon><polygon points="78,54 70,52 72,62 80,62" fill="#27272a" stroke="#eab308" stroke-width="1"></polygon><polygon points="36,57 41,57 37,62 32,62" fill="#eab308"></polygon><polygon points="43,57 48,57 44,62 39,62" fill="#18181b"></polygon><polygon points="52,57 57,57 53,62 48,62" fill="#eab308"></polygon><polygon points="59,57 64,57 60,62 55,62" fill="#18181b"></polygon><line x1="38" y1="54" x2="39" y2="76" stroke="#eab308" stroke-width="1.6"></line><line x1="62" y1="54" x2="61" y2="76" stroke="#eab308" stroke-width="1.6"></line><circle cx="50" cy="67" r="4.5" fill="#09090b" stroke="#eab308" stroke-width="1.2"></circle><circle cx="50" cy="67" r="2.5" fill="#eab308"></circle><line x1="46" y1="67" x2="54" y2="67" stroke="#ffffff" stroke-width="0.8"></line><line x1="50" y1="63" x2="50" y2="71" stroke="#ffffff" stroke-width="0.8"></line></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#eab308" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#eab308" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#eab308" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#eab308"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#eab308" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#eab308"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#eab308;background-color:#eab30815;border-color:#eab30840">Orbital Titan</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Orbital Titan</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-purple-500/20 text-purple-300 border-purple-500/40">vip</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Deep-space defense frame with an orbital parabolic telemetry radar dish and dual high-gain comm masts.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #be123c25 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #be123c40)"><defs><linearGradient id="grad-skin_19-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#be123c"></stop><stop offset="100%" stop-color="#4c0519"></stop></linearGradient><linearGradient id="grad-skin_19-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#be123c"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_19-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#be123c" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_19" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><polygon points="20,44 -2,22 10,54" fill="#be123c" stroke="#4c0519" stroke-width="1.5"></polygon><polygon points="80,44 102,22 90,54" fill="#be123c" stroke="#4c0519" stroke-width="1.5"></polygon></g><g id="staff-3d-mecha-pilot"><polygon points="26,54 74,54 67,76 33,76" fill="#18181b" stroke="#be123c" stroke-width="1.6"></polygon><polygon points="22,54 30,52 28,62 20,62" fill="#27272a" stroke="#be123c" stroke-width="1"></polygon><polygon points="78,54 70,52 72,62 80,62" fill="#27272a" stroke="#be123c" stroke-width="1"></polygon><polygon points="36,57 41,57 37,62 32,62" fill="#eab308"></polygon><polygon points="43,57 48,57 44,62 39,62" fill="#18181b"></polygon><polygon points="52,57 57,57 53,62 48,62" fill="#eab308"></polygon><polygon points="59,57 64,57 60,62 55,62" fill="#18181b"></polygon><line x1="38" y1="54" x2="39" y2="76" stroke="#be123c" stroke-width="1.6"></line><line x1="62" y1="54" x2="61" y2="76" stroke="#be123c" stroke-width="1.6"></line><circle cx="50" cy="67" r="4.5" fill="#09090b" stroke="#be123c" stroke-width="1.2"></circle><circle cx="50" cy="67" r="2.5" fill="#be123c"></circle><line x1="46" y1="67" x2="54" y2="67" stroke="#ffffff" stroke-width="0.8"></line><line x1="50" y1="63" x2="50" y2="71" stroke="#ffffff" stroke-width="0.8"></line></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#be123c" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#be123c" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#be123c" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#be123c"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#be123c" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#be123c"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#be123c;background-color:#be123c15;border-color:#be123c40">Omega Destroyer</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Omega Destroyer</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-purple-500/20 text-purple-300 border-purple-500/40">vip</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Ultimate planetary assault mech featuring swept hyper-drive flight wings, twin head cannons, and red-shifted thrusters.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #6366f125 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #6366f140)"><defs><linearGradient id="grad-skin_20-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#6366f1"></stop><stop offset="100%" stop-color="#1e1b4b"></stop></linearGradient><linearGradient id="grad-skin_20-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#6366f1"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_20-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#6366f1" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_20" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><line x1="18" y1="52" x2="82" y2="12" stroke="#334155" stroke-width="3" stroke-linecap="round"></line><line x1="22" y1="48" x2="80" y2="14" stroke="#6366f1" stroke-width="1.5" stroke-linecap="round" opacity="0.8"></line><path d="M 74 32 Q 90 26 96 42 Q 84 38 72 36" fill="#6366f1" opacity="0.9"></path></g><g id="staff-3d-stealth-ninja"><polygon points="31,54 69,54 63,74 37,74" fill="#090d16" stroke="#6366f1" stroke-width="1.4"></polygon><line x1="32" y1="54" x2="55" y2="66" stroke="#6366f1" stroke-width="1.8" stroke-linecap="round"></line><line x1="68" y1="54" x2="48" y2="66" stroke="#6366f1" stroke-width="1.4" stroke-linecap="round" opacity="0.6"></line><polygon points="32,55 36,54 62,72 58,74" fill="#6366f1" opacity="0.9"></polygon><rect x="44" y="60" width="10" height="3" rx="1" fill="#1e293b" stroke="#ffffff" stroke-width="0.6" transform="rotate(-30 49 61.5)"></rect><rect x="36" y="69" width="28" height="5" rx="1.5" fill="#1e1b4b" stroke="#6366f1" stroke-width="1"></rect><path d="M 52 73 Q 54 78 53 82 Q 50 78 52 73" fill="#6366f1"></path></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#6366f1" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#6366f1" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#6366f1" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#6366f1"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#6366f1" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#6366f1"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#6366f1;background-color:#6366f115;border-color:#6366f140">Shadow Shinobi</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Shadow Shinobi</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-emerald-500/20 text-emerald-300 border-emerald-500/40">free</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Classic cyber shinobi gear with a polished titanium forehead hitai-ate plate and long flowing indigo cloth headband tails.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">UNLOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-3 py-1 rounded-lg text-xs font-semibold transition-all cursor-pointer bg-[#007acc] hover:bg-[#0088e0] text-white shadow-sm">Equip</button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #10b98125 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #10b98140)"><defs><linearGradient id="grad-skin_21-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#10b981"></stop><stop offset="100%" stop-color="#022c22"></stop></linearGradient><linearGradient id="grad-skin_21-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#10b981"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_21-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#10b981" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_21" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><path d="M 22 24 Q 50 14 78 24 L 74 52 Q 50 60 26 52 Z" fill="#0f172a" stroke="#10b981" stroke-width="1.6" opacity="0.85"></path><circle cx="58" cy="34" r="6" fill="none" stroke="#22c55e" stroke-width="2"></circle><circle cx="58" cy="34" r="2" fill="#22c55e"></circle></g><g id="staff-3d-stealth-ninja"><polygon points="31,54 69,54 63,74 37,74" fill="#090d16" stroke="#10b981" stroke-width="1.4"></polygon><line x1="32" y1="54" x2="55" y2="66" stroke="#10b981" stroke-width="1.8" stroke-linecap="round"></line><line x1="68" y1="54" x2="48" y2="66" stroke="#10b981" stroke-width="1.4" stroke-linecap="round" opacity="0.6"></line><polygon points="32,55 36,54 62,72 58,74" fill="#10b981" opacity="0.9"></polygon><rect x="44" y="60" width="10" height="3" rx="1" fill="#1e293b" stroke="#ffffff" stroke-width="0.6" transform="rotate(-30 49 61.5)"></rect><rect x="36" y="69" width="28" height="5" rx="1.5" fill="#1e1b4b" stroke="#10b981" stroke-width="1"></rect><path d="M 52 73 Q 54 78 53 82 Q 50 78 52 73" fill="#10b981"></path></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#10b981" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#10b981" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#10b981" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#10b981"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#10b981" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#10b981"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#10b981;background-color:#10b98115;border-color:#10b98140">Silent Infiltrator</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Silent Infiltrator</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-emerald-500/20 text-emerald-300 border-emerald-500/40">free</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Black-ops balaclava shroud featuring a single glowing emerald thermal-optical monocle sensor with target acquisition.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">UNLOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-3 py-1 rounded-lg text-xs font-semibold transition-all cursor-pointer bg-[#007acc] hover:bg-[#0088e0] text-white shadow-sm">Equip</button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #ef444425 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #ef444440)"><defs><linearGradient id="grad-skin_22-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#ef4444"></stop><stop offset="100%" stop-color="#450a0a"></stop></linearGradient><linearGradient id="grad-skin_22-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ef4444"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_22-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ef4444" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_22" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><polygon points="30,16 18,-4 34,8" fill="#ef4444" stroke="#450a0a" stroke-width="1.2"></polygon><polygon points="70,16 82,-4 66,8" fill="#ef4444" stroke="#450a0a" stroke-width="1.2"></polygon><path d="M 32 44 L 40 50 L 46 44 L 50 48 L 54 44 L 60 50 L 68 44 L 62 56 L 38 56 Z" fill="#ffffff" stroke="#ef4444" stroke-width="1.2"></path></g><g id="staff-3d-stealth-ninja"><polygon points="31,54 69,54 63,74 37,74" fill="#090d16" stroke="#ef4444" stroke-width="1.4"></polygon><line x1="32" y1="54" x2="55" y2="66" stroke="#ef4444" stroke-width="1.8" stroke-linecap="round"></line><line x1="68" y1="54" x2="48" y2="66" stroke="#ef4444" stroke-width="1.4" stroke-linecap="round" opacity="0.6"></line><polygon points="32,55 36,54 62,72 58,74" fill="#ef4444" opacity="0.9"></polygon><rect x="44" y="60" width="10" height="3" rx="1" fill="#1e293b" stroke="#ffffff" stroke-width="0.6" transform="rotate(-30 49 61.5)"></rect><rect x="36" y="69" width="28" height="5" rx="1.5" fill="#1e1b4b" stroke="#ef4444" stroke-width="1"></rect><path d="M 52 73 Q 54 78 53 82 Q 50 78 52 73" fill="#ef4444"></path></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#ef4444" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#ef4444" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#ef4444" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#ef4444"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#ef4444" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#ef4444"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#ef4444;background-color:#ef444415;border-color:#ef444440">Kage Oni</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Kage Oni</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">coffee</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Intimidating Japanese Oni demon half-mask equipped with glowing porcelain fangs and dual menacing crimson horns.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #f43f5e25 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #f43f5e40)"><defs><linearGradient id="grad-skin_23-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#f43f5e"></stop><stop offset="100%" stop-color="#ffe4e6"></stop></linearGradient><linearGradient id="grad-skin_23-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#f43f5e"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_23-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#f43f5e" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_23" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><polygon points="22,18 32,-4 42,12" fill="#1e2430"></polygon><polygon points="25,16 32,-1 39,12" fill="#f43f5e"></polygon><polygon points="58,12 68,-4 78,18" fill="#1e2430"></polygon><polygon points="61,12 68,-1 75,16" fill="#f43f5e"></polygon><line x1="36" y1="42" x2="22" y2="40" stroke="#f43f5e" stroke-width="1.5"></line><line x1="64" y1="42" x2="78" y2="40" stroke="#f43f5e" stroke-width="1.5"></line></g><g id="staff-3d-stealth-ninja"><polygon points="31,54 69,54 63,74 37,74" fill="#090d16" stroke="#f43f5e" stroke-width="1.4"></polygon><line x1="32" y1="54" x2="55" y2="66" stroke="#f43f5e" stroke-width="1.8" stroke-linecap="round"></line><line x1="68" y1="54" x2="48" y2="66" stroke="#f43f5e" stroke-width="1.4" stroke-linecap="round" opacity="0.6"></line><polygon points="32,55 36,54 62,72 58,74" fill="#f43f5e" opacity="0.9"></polygon><rect x="44" y="60" width="10" height="3" rx="1" fill="#1e293b" stroke="#ffffff" stroke-width="0.6" transform="rotate(-30 49 61.5)"></rect><rect x="36" y="69" width="28" height="5" rx="1.5" fill="#1e1b4b" stroke="#f43f5e" stroke-width="1"></rect><path d="M 52 73 Q 54 78 53 82 Q 50 78 52 73" fill="#f43f5e"></path></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#f43f5e" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#f43f5e" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#f43f5e" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#f43f5e"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#f43f5e" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#f43f5e"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#f43f5e;background-color:#f43f5e15;border-color:#f43f5e40">Cyber Kitsune</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Cyber Kitsune</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">coffee</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Agile spirit operative suit featuring pointed cybernetic fox ears and delicate sensor whisker decals along the cheeks.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #eab30825 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #eab30840)"><defs><linearGradient id="grad-skin_24-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#eab308"></stop><stop offset="100%" stop-color="#18181b"></stop></linearGradient><linearGradient id="grad-skin_24-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#eab308"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_24-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#eab308" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_24" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><polygon points="6,24 50,-8 94,24" fill="#18181b" stroke="#eab308" stroke-width="2"></polygon><line x1="6" y1="24" x2="94" y2="24" stroke="#fef08a" stroke-width="3"></line></g><g id="staff-3d-stealth-ninja"><polygon points="31,54 69,54 63,74 37,74" fill="#090d16" stroke="#eab308" stroke-width="1.4"></polygon><line x1="32" y1="54" x2="55" y2="66" stroke="#eab308" stroke-width="1.8" stroke-linecap="round"></line><line x1="68" y1="54" x2="48" y2="66" stroke="#eab308" stroke-width="1.4" stroke-linecap="round" opacity="0.6"></line><polygon points="32,55 36,54 62,72 58,74" fill="#eab308" opacity="0.9"></polygon><rect x="44" y="60" width="10" height="3" rx="1" fill="#1e293b" stroke="#ffffff" stroke-width="0.6" transform="rotate(-30 49 61.5)"></rect><rect x="36" y="69" width="28" height="5" rx="1.5" fill="#1e1b4b" stroke="#eab308" stroke-width="1"></rect><path d="M 52 73 Q 54 78 53 82 Q 50 78 52 73" fill="#eab308"></path></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#eab308" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#eab308" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#eab308" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#eab308"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#eab308" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#eab308"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#eab308;background-color:#eab30815;border-color:#eab30840">Cyber Ronin Kasa</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Cyber Ronin Kasa</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">coffee</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Masterless wanderer gear sporting a wide-brim conical cyber kasa straw hat with an under-rim glowing neon yellow circuit ring.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #14b8a625 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #14b8a640)"><defs><linearGradient id="grad-skin_25-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#14b8a6"></stop><stop offset="100%" stop-color="#042f2e"></stop></linearGradient><linearGradient id="grad-skin_25-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#14b8a6"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_25-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#14b8a6" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_25" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g stroke-linecap="round"><line x1="16" y1="56" x2="84" y2="-4" stroke="#475569" stroke-width="3.5"></line><line x1="20" y1="52" x2="82" y2="-2" stroke="#14b8a6" stroke-width="2"></line><line x1="84" y1="56" x2="16" y2="-4" stroke="#475569" stroke-width="3.5"></line><line x1="80" y1="52" x2="18" y2="-2" stroke="#14b8a6" stroke-width="2"></line></g><g id="staff-3d-stealth-ninja"><polygon points="31,54 69,54 63,74 37,74" fill="#090d16" stroke="#14b8a6" stroke-width="1.4"></polygon><line x1="32" y1="54" x2="55" y2="66" stroke="#14b8a6" stroke-width="1.8" stroke-linecap="round"></line><line x1="68" y1="54" x2="48" y2="66" stroke="#14b8a6" stroke-width="1.4" stroke-linecap="round" opacity="0.6"></line><polygon points="32,55 36,54 62,72 58,74" fill="#14b8a6" opacity="0.9"></polygon><rect x="44" y="60" width="10" height="3" rx="1" fill="#1e293b" stroke="#ffffff" stroke-width="0.6" transform="rotate(-30 49 61.5)"></rect><rect x="36" y="69" width="28" height="5" rx="1.5" fill="#1e1b4b" stroke="#14b8a6" stroke-width="1"></rect><path d="M 52 73 Q 54 78 53 82 Q 50 78 52 73" fill="#14b8a6"></path></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#14b8a6" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#14b8a6" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#14b8a6" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#14b8a6"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#14b8a6" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#14b8a6"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#14b8a6;background-color:#14b8a615;border-color:#14b8a640">Obsidian Blade</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Obsidian Blade</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">lunch</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Dual-wield assassin outfit featuring crossed holographic katana sheaths on the back and a blindfold-style sensory visor.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #8b5cf625 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #8b5cf640)"><defs><linearGradient id="grad-skin_26-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#8b5cf6"></stop><stop offset="100%" stop-color="#1e1b4b"></stop></linearGradient><linearGradient id="grad-skin_26-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#8b5cf6"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_26-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#8b5cf6" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_26" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><polygon points="36,42 50,58 64,42 50,46" fill="#0f172a" stroke="#8b5cf6" stroke-width="1.8"></polygon></g><g id="staff-3d-stealth-ninja"><polygon points="31,54 69,54 63,74 37,74" fill="#090d16" stroke="#8b5cf6" stroke-width="1.4"></polygon><line x1="32" y1="54" x2="55" y2="66" stroke="#8b5cf6" stroke-width="1.8" stroke-linecap="round"></line><line x1="68" y1="54" x2="48" y2="66" stroke="#8b5cf6" stroke-width="1.4" stroke-linecap="round" opacity="0.6"></line><polygon points="32,55 36,54 62,72 58,74" fill="#8b5cf6" opacity="0.9"></polygon><rect x="44" y="60" width="10" height="3" rx="1" fill="#1e293b" stroke="#ffffff" stroke-width="0.6" transform="rotate(-30 49 61.5)"></rect><rect x="36" y="69" width="28" height="5" rx="1.5" fill="#1e1b4b" stroke="#8b5cf6" stroke-width="1"></rect><path d="M 52 73 Q 54 78 53 82 Q 50 78 52 73" fill="#8b5cf6"></path></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#8b5cf6" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#8b5cf6" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#8b5cf6" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#8b5cf6"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#8b5cf6" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#8b5cf6"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#8b5cf6;background-color:#8b5cf615;border-color:#8b5cf640">Raven Tengu</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Raven Tengu</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">lunch</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Mountain phantom gear with an aerodynamic raven beak half-mask and razor-sharp feathered blade pauldrons.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #94a3b825 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #94a3b840)"><defs><linearGradient id="grad-skin_27-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#94a3b8"></stop><stop offset="100%" stop-color="#0f172a"></stop></linearGradient><linearGradient id="grad-skin_27-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#94a3b8"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_27-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#94a3b8" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_27" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><path d="M 22 30 Q 50 18 78 30 L 74 54 Q 50 64 26 54 Z" fill="#0f172a" opacity="0.85" stroke="#94a3b8" stroke-width="1.5" stroke-dasharray="4 2"></path></g><g id="staff-3d-stealth-ninja"><polygon points="31,54 69,54 63,74 37,74" fill="#090d16" stroke="#94a3b8" stroke-width="1.4"></polygon><line x1="32" y1="54" x2="55" y2="66" stroke="#94a3b8" stroke-width="1.8" stroke-linecap="round"></line><line x1="68" y1="54" x2="48" y2="66" stroke="#94a3b8" stroke-width="1.4" stroke-linecap="round" opacity="0.6"></line><polygon points="32,55 36,54 62,72 58,74" fill="#94a3b8" opacity="0.9"></polygon><rect x="44" y="60" width="10" height="3" rx="1" fill="#1e293b" stroke="#ffffff" stroke-width="0.6" transform="rotate(-30 49 61.5)"></rect><rect x="36" y="69" width="28" height="5" rx="1.5" fill="#1e1b4b" stroke="#94a3b8" stroke-width="1"></rect><path d="M 52 73 Q 54 78 53 82 Q 50 78 52 73" fill="#94a3b8"></path></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#94a3b8" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#94a3b8" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#94a3b8" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#94a3b8"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#94a3b8" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#94a3b8"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#94a3b8;background-color:#94a3b815;border-color:#94a3b840">Smoke Wraith</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Smoke Wraith</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">lunch</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Infiltration gear wrapped in a hooded dark nanofiber veil with glowing horizontal eye slits and faint smoke dissipation.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #ec489925 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #ec489940)"><defs><linearGradient id="grad-skin_28-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#ec4899"></stop><stop offset="100%" stop-color="#500724"></stop></linearGradient><linearGradient id="grad-skin_28-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ec4899"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_28-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ec4899" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_28" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><path d="M 50 -10 C 32 -10, 24 6, 32 18 C 24 10, 32 -4, 50 -4 C 68 -4, 76 10, 68 18 C 76 6, 68 -10, 50 -10 Z" fill="#ec4899" stroke="#500724" stroke-width="1.2"></path></g><g id="staff-3d-stealth-ninja"><polygon points="31,54 69,54 63,74 37,74" fill="#090d16" stroke="#ec4899" stroke-width="1.4"></polygon><line x1="32" y1="54" x2="55" y2="66" stroke="#ec4899" stroke-width="1.8" stroke-linecap="round"></line><line x1="68" y1="54" x2="48" y2="66" stroke="#ec4899" stroke-width="1.4" stroke-linecap="round" opacity="0.6"></line><polygon points="32,55 36,54 62,72 58,74" fill="#ec4899" opacity="0.9"></polygon><rect x="44" y="60" width="10" height="3" rx="1" fill="#1e293b" stroke="#ffffff" stroke-width="0.6" transform="rotate(-30 49 61.5)"></rect><rect x="36" y="69" width="28" height="5" rx="1.5" fill="#1e1b4b" stroke="#ec4899" stroke-width="1"></rect><path d="M 52 73 Q 54 78 53 82 Q 50 78 52 73" fill="#ec4899"></path></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#ec4899" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#ec4899" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#ec4899" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#ec4899"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#ec4899" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#ec4899"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#ec4899;background-color:#ec489915;border-color:#ec489940">Midnight Duelist</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Midnight Duelist</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-purple-500/20 text-purple-300 border-purple-500/40">vip</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Elite arena champion gear featuring an elegant crescent moon scythe crest on the forehead and twin kunai collar pins.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #00f0ff25 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #00f0ff40)"><defs><linearGradient id="grad-skin_29-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#00f0ff"></stop><stop offset="100%" stop-color="#020617"></stop></linearGradient><linearGradient id="grad-skin_29-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#00f0ff"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_29-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#00f0ff" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_29" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><rect x="28" y="24" width="44" height="24" rx="4" fill="#000000" stroke="#00f0ff" stroke-width="2"></rect><text x="50" y="42" fill="#00f0ff" font-size="14" font-family="monospace" text-anchor="middle" font-weight="bold">零</text></g><g id="staff-3d-stealth-ninja"><polygon points="31,54 69,54 63,74 37,74" fill="#090d16" stroke="#00f0ff" stroke-width="1.4"></polygon><line x1="32" y1="54" x2="55" y2="66" stroke="#00f0ff" stroke-width="1.8" stroke-linecap="round"></line><line x1="68" y1="54" x2="48" y2="66" stroke="#00f0ff" stroke-width="1.4" stroke-linecap="round" opacity="0.6"></line><polygon points="32,55 36,54 62,72 58,74" fill="#00f0ff" opacity="0.9"></polygon><rect x="44" y="60" width="10" height="3" rx="1" fill="#1e293b" stroke="#ffffff" stroke-width="0.6" transform="rotate(-30 49 61.5)"></rect><rect x="36" y="69" width="28" height="5" rx="1.5" fill="#1e1b4b" stroke="#00f0ff" stroke-width="1"></rect><path d="M 52 73 Q 54 78 53 82 Q 50 78 52 73" fill="#00f0ff"></path></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#00f0ff" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#00f0ff" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#00f0ff" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#00f0ff"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#00f0ff" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#00f0ff"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#00f0ff;background-color:#00f0ff15;border-color:#00f0ff40">Void Assassin</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Void Assassin</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-purple-500/20 text-purple-300 border-purple-500/40">vip</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Pitch-black stealth armor absorbing 99% of light, featuring glowing cyan runic kanji hovering mysteriously in front of the face.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #10b98125 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #10b98140)"><defs><linearGradient id="grad-skin_30-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#10b981"></stop><stop offset="100%" stop-color="#022c22"></stop></linearGradient><linearGradient id="grad-skin_30-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#10b981"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_30-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#10b981" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_30" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><path d="M 14,42 Q 14,8 50,8 Q 86,8 86,42 Q 70,48 50,48 Q 30,48 14,42 Z" fill="#081018" stroke="#10b981" stroke-width="1.8"></path><circle cx="28" cy="18" r="1.5" fill="#10b981" opacity="0.7"></circle><circle cx="36" cy="14" r="1.5" fill="#10b981" opacity="0.9"></circle><circle cx="64" cy="14" r="1.5" fill="#10b981" opacity="0.9"></circle><circle cx="72" cy="18" r="1.5" fill="#10b981" opacity="0.7"></circle></g><g id="staff-3d-matrix-hacker"><rect x="26" y="54" width="48" height="21" rx="6" fill="#121217" stroke="#10b981" stroke-width="1.5"></rect><path d="M 30 53 Q 50 58 70 53 Q 62 61 50 61 Q 38 61 30 53 Z" fill="#1f1f28" stroke="#10b981" stroke-width="1"></path><path d="M 44 59 Q 42 66 45 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="43.5" y="70" width="2.5" height="3.5" rx="0.5" fill="#10b981"></rect><path d="M 56 59 Q 58 66 55 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="54" y="70" width="2.5" height="3.5" rx="0.5" fill="#10b981"></rect><path d="M 35 66 L 65 66 L 62 73 L 38 73 Z" fill="#09090d" stroke="#27272a" stroke-width="0.8"></path><line x1="36" y1="66" x2="38" y2="70" stroke="#10b981" stroke-width="1"></line><line x1="64" y1="66" x2="62" y2="70" stroke="#10b981" stroke-width="1"></line><g transform="translate(56, 60)"><rect x="0" y="0" width="8" height="4" fill="#000000" stroke="#6ee7b7" stroke-width="0.6"></rect><line x1="2" y1="1" x2="2" y2="3" stroke="#10b981" stroke-width="0.6"></line><line x1="4" y1="1" x2="4" y2="3" stroke="#10b981" stroke-width="1"></line><line x1="6" y1="1" x2="6" y2="3" stroke="#10b981" stroke-width="0.6"></line></g></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#10b981" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#10b981" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#10b981" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#10b981"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#10b981" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#10b981"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#10b981;background-color:#10b98115;border-color:#10b98140">Root Netrunner</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Root Netrunner</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-emerald-500/20 text-emerald-300 border-emerald-500/40">free</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Underground hacker suit with a deep oversized hooded cowl dripping with vertical green phosphorescent digital code streams.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">UNLOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-3 py-1 rounded-lg text-xs font-semibold transition-all cursor-pointer bg-[#007acc] hover:bg-[#0088e0] text-white shadow-sm">Equip</button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #06b6d425 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #06b6d440)"><defs><linearGradient id="grad-skin_31-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#06b6d4"></stop><stop offset="100%" stop-color="#083344"></stop></linearGradient><linearGradient id="grad-skin_31-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#06b6d4"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_31-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#06b6d4" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_31" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><rect x="24" y="24" width="52" height="18" rx="4" fill="#083344" stroke="#06b6d4" stroke-width="2"></rect><line x1="36" y1="24" x2="30" y2="4" stroke="#06b6d4" stroke-width="2"></line><circle cx="30" cy="4" r="3" fill="#67e8f9"></circle><line x1="32" y1="33" x2="68" y2="33" stroke="#67e8f9" stroke-width="1.6"></line></g><g id="staff-3d-matrix-hacker"><rect x="26" y="54" width="48" height="21" rx="6" fill="#121217" stroke="#06b6d4" stroke-width="1.5"></rect><path d="M 30 53 Q 50 58 70 53 Q 62 61 50 61 Q 38 61 30 53 Z" fill="#1f1f28" stroke="#06b6d4" stroke-width="1"></path><path d="M 44 59 Q 42 66 45 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="43.5" y="70" width="2.5" height="3.5" rx="0.5" fill="#06b6d4"></rect><path d="M 56 59 Q 58 66 55 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="54" y="70" width="2.5" height="3.5" rx="0.5" fill="#06b6d4"></rect><path d="M 35 66 L 65 66 L 62 73 L 38 73 Z" fill="#09090d" stroke="#27272a" stroke-width="0.8"></path><line x1="36" y1="66" x2="38" y2="70" stroke="#06b6d4" stroke-width="1"></line><line x1="64" y1="66" x2="62" y2="70" stroke="#06b6d4" stroke-width="1"></line><g transform="translate(56, 60)"><rect x="0" y="0" width="8" height="4" fill="#000000" stroke="#67e8f9" stroke-width="0.6"></rect><line x1="2" y1="1" x2="2" y2="3" stroke="#06b6d4" stroke-width="0.6"></line><line x1="4" y1="1" x2="4" y2="3" stroke="#06b6d4" stroke-width="1"></line><line x1="6" y1="1" x2="6" y2="3" stroke="#06b6d4" stroke-width="0.6"></line></g></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#06b6d4" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#06b6d4" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#06b6d4" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#06b6d4"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#06b6d4" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#06b6d4"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#06b6d4;background-color:#06b6d415;border-color:#06b6d440">Binary Coder</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Binary Coder</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-emerald-500/20 text-emerald-300 border-emerald-500/40">free</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Classic retro cyberdeck enthusiast gear equipped with chunky rectangular VR goggles and an omnidirectional radio antenna.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">UNLOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-3 py-1 rounded-lg text-xs font-semibold transition-all cursor-pointer bg-[#007acc] hover:bg-[#0088e0] text-white shadow-sm">Equip</button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #ef444425 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #ef444440)"><defs><linearGradient id="grad-skin_32-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#ef4444"></stop><stop offset="100%" stop-color="#450a0a"></stop></linearGradient><linearGradient id="grad-skin_32-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ef4444"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_32-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ef4444" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_32" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><path d="M 22 20 Q 50 4 78 20" stroke="#ef4444" stroke-width="3.5" fill="none"></path><polygon points="32,20 24,0 40,14" fill="#ef4444" stroke="#450a0a" stroke-width="1.2"></polygon><polygon points="68,20 76,0 60,14" fill="#ef4444" stroke="#450a0a" stroke-width="1.2"></polygon></g><g id="staff-3d-matrix-hacker"><rect x="26" y="54" width="48" height="21" rx="6" fill="#121217" stroke="#ef4444" stroke-width="1.5"></rect><path d="M 30 53 Q 50 58 70 53 Q 62 61 50 61 Q 38 61 30 53 Z" fill="#1f1f28" stroke="#ef4444" stroke-width="1"></path><path d="M 44 59 Q 42 66 45 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="43.5" y="70" width="2.5" height="3.5" rx="0.5" fill="#ef4444"></rect><path d="M 56 59 Q 58 66 55 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="54" y="70" width="2.5" height="3.5" rx="0.5" fill="#ef4444"></rect><path d="M 35 66 L 65 66 L 62 73 L 38 73 Z" fill="#09090d" stroke="#27272a" stroke-width="0.8"></path><line x1="36" y1="66" x2="38" y2="70" stroke="#ef4444" stroke-width="1"></line><line x1="64" y1="66" x2="62" y2="70" stroke="#ef4444" stroke-width="1"></line><g transform="translate(56, 60)"><rect x="0" y="0" width="8" height="4" fill="#000000" stroke="#fca5a5" stroke-width="0.6"></rect><line x1="2" y1="1" x2="2" y2="3" stroke="#ef4444" stroke-width="0.6"></line><line x1="4" y1="1" x2="4" y2="3" stroke="#ef4444" stroke-width="1"></line><line x1="6" y1="1" x2="6" y2="3" stroke="#ef4444" stroke-width="0.6"></line></g></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#ef4444" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#ef4444" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#ef4444" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#ef4444"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#ef4444" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#ef4444"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#ef4444;background-color:#ef444415;border-color:#ef444440">ZeroDay Daemon</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">ZeroDay Daemon</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">coffee</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Malicious exploit runner sporting a dark beanie cowl with integrated red cyber devil horns and glowing memory fault LEDs.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #eab30825 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #eab30840)"><defs><linearGradient id="grad-skin_33-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#eab308"></stop><stop offset="100%" stop-color="#422006"></stop></linearGradient><linearGradient id="grad-skin_33-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#eab308"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_33-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#eab308" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_33" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><rect x="18" y="10" width="64" height="48" fill="none" stroke="#eab308" stroke-width="1.8" stroke-dasharray="8 4 3 5"></rect><rect x="28" y="4" width="16" height="8" fill="#eab308" opacity="0.8"></rect><rect x="62" y="46" width="14" height="6" fill="#eab308" opacity="0.8"></rect></g><g id="staff-3d-matrix-hacker"><rect x="26" y="54" width="48" height="21" rx="6" fill="#121217" stroke="#eab308" stroke-width="1.5"></rect><path d="M 30 53 Q 50 58 70 53 Q 62 61 50 61 Q 38 61 30 53 Z" fill="#1f1f28" stroke="#eab308" stroke-width="1"></path><path d="M 44 59 Q 42 66 45 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="43.5" y="70" width="2.5" height="3.5" rx="0.5" fill="#eab308"></rect><path d="M 56 59 Q 58 66 55 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="54" y="70" width="2.5" height="3.5" rx="0.5" fill="#eab308"></rect><path d="M 35 66 L 65 66 L 62 73 L 38 73 Z" fill="#09090d" stroke="#27272a" stroke-width="0.8"></path><line x1="36" y1="66" x2="38" y2="70" stroke="#eab308" stroke-width="1"></line><line x1="64" y1="66" x2="62" y2="70" stroke="#eab308" stroke-width="1"></line><g transform="translate(56, 60)"><rect x="0" y="0" width="8" height="4" fill="#000000" stroke="#fef08a" stroke-width="0.6"></rect><line x1="2" y1="1" x2="2" y2="3" stroke="#eab308" stroke-width="0.6"></line><line x1="4" y1="1" x2="4" y2="3" stroke="#eab308" stroke-width="1"></line><line x1="6" y1="1" x2="6" y2="3" stroke="#eab308" stroke-width="0.6"></line></g></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#eab308" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#eab308" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#eab308" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#eab308"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#eab308" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#eab308"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#eab308;background-color:#eab30815;border-color:#eab30840">Glitch Cracker</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Glitch Cracker</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">coffee</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Glitching outfit surrounded by jittering holographic wireframe shards and corrupted polygon artifacts hovering in 3D space.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #3b82f625 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #3b82f640)"><defs><linearGradient id="grad-skin_34-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#3b82f6"></stop><stop offset="100%" stop-color="#172554"></stop></linearGradient><linearGradient id="grad-skin_34-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#3b82f6"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_34-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#3b82f6" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_34" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g><rect x="74" y="6" width="40" height="22" rx="3" fill="#09090b" stroke="#3b82f6" stroke-width="1.2"></rect><text x="78" y="20" fill="#3b82f6" font-size="8" font-family="monospace">root#_</text></g><g id="staff-3d-matrix-hacker"><rect x="26" y="54" width="48" height="21" rx="6" fill="#121217" stroke="#3b82f6" stroke-width="1.5"></rect><path d="M 30 53 Q 50 58 70 53 Q 62 61 50 61 Q 38 61 30 53 Z" fill="#1f1f28" stroke="#3b82f6" stroke-width="1"></path><path d="M 44 59 Q 42 66 45 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="43.5" y="70" width="2.5" height="3.5" rx="0.5" fill="#3b82f6"></rect><path d="M 56 59 Q 58 66 55 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="54" y="70" width="2.5" height="3.5" rx="0.5" fill="#3b82f6"></rect><path d="M 35 66 L 65 66 L 62 73 L 38 73 Z" fill="#09090d" stroke="#27272a" stroke-width="0.8"></path><line x1="36" y1="66" x2="38" y2="70" stroke="#3b82f6" stroke-width="1"></line><line x1="64" y1="66" x2="62" y2="70" stroke="#3b82f6" stroke-width="1"></line><g transform="translate(56, 60)"><rect x="0" y="0" width="8" height="4" fill="#000000" stroke="#93c5fd" stroke-width="0.6"></rect><line x1="2" y1="1" x2="2" y2="3" stroke="#3b82f6" stroke-width="0.6"></line><line x1="4" y1="1" x2="4" y2="3" stroke="#3b82f6" stroke-width="1"></line><line x1="6" y1="1" x2="6" y2="3" stroke="#3b82f6" stroke-width="0.6"></line></g></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#3b82f6" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#3b82f6" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#3b82f6" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#3b82f6"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#3b82f6" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#3b82f6"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#3b82f6;background-color:#3b82f615;border-color:#3b82f640">Defrag Nethead</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Defrag Nethead</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">coffee</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">High-spec sysadmin gear featuring a floating terminal prompt HUD window [root@sys ~]# hovering persistently beside the ear.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #a3e63525 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #a3e63540)"><defs><linearGradient id="grad-skin_35-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#a3e635"></stop><stop offset="100%" stop-color="#14532d"></stop></linearGradient><linearGradient id="grad-skin_35-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#a3e635"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_35-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#a3e635" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_35" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g stroke-width="2.5"><rect x="28" y="42" width="44" height="14" rx="4" fill="#0f172a" stroke="#a3e635" stroke-width="1.5"></rect><line x1="36" y1="52" x2="36" y2="46" stroke="#22c55e"></line><line x1="43" y1="52" x2="43" y2="44" stroke="#eab308"></line><line x1="50" y1="52" x2="50" y2="43" stroke="#ef4444"></line><line x1="57" y1="52" x2="57" y2="45" stroke="#eab308"></line><line x1="64" y1="52" x2="64" y2="47" stroke="#22c55e"></line></g><g id="staff-3d-matrix-hacker"><rect x="26" y="54" width="48" height="21" rx="6" fill="#121217" stroke="#a3e635" stroke-width="1.5"></rect><path d="M 30 53 Q 50 58 70 53 Q 62 61 50 61 Q 38 61 30 53 Z" fill="#1f1f28" stroke="#a3e635" stroke-width="1"></path><path d="M 44 59 Q 42 66 45 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="43.5" y="70" width="2.5" height="3.5" rx="0.5" fill="#a3e635"></rect><path d="M 56 59 Q 58 66 55 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="54" y="70" width="2.5" height="3.5" rx="0.5" fill="#a3e635"></rect><path d="M 35 66 L 65 66 L 62 73 L 38 73 Z" fill="#09090d" stroke="#27272a" stroke-width="0.8"></path><line x1="36" y1="66" x2="38" y2="70" stroke="#a3e635" stroke-width="1"></line><line x1="64" y1="66" x2="62" y2="70" stroke="#a3e635" stroke-width="1"></line><g transform="translate(56, 60)"><rect x="0" y="0" width="8" height="4" fill="#000000" stroke="#d9f99d" stroke-width="0.6"></rect><line x1="2" y1="1" x2="2" y2="3" stroke="#a3e635" stroke-width="0.6"></line><line x1="4" y1="1" x2="4" y2="3" stroke="#a3e635" stroke-width="1"></line><line x1="6" y1="1" x2="6" y2="3" stroke="#a3e635" stroke-width="0.6"></line></g></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#a3e635" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#a3e635" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#a3e635" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#a3e635"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#a3e635" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#a3e635"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#a3e635;background-color:#a3e63515;border-color:#a3e63540">Acid Breacher</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Acid Breacher</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">lunch</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Cybergoth infiltrator gear featuring a twin respirator mask fitted with responsive multi-color equalizer audio VU bars.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #f9731625 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #f9731640)"><defs><linearGradient id="grad-skin_36-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#f97316"></stop><stop offset="100%" stop-color="#431407"></stop></linearGradient><linearGradient id="grad-skin_36-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#f97316"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_36-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#f97316" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_36" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g fill="#ea580c" stroke="#fed7aa" stroke-width="1.2"><rect x="28" y="-2" width="6" height="18" rx="1.5"></rect><rect x="38" y="-6" width="6" height="22" rx="1.5"></rect><rect x="47" y="-8" width="6" height="24" rx="1.5"></rect><rect x="56" y="-6" width="6" height="22" rx="1.5"></rect><rect x="66" y="-2" width="6" height="18" rx="1.5"></rect></g><g id="staff-3d-matrix-hacker"><rect x="26" y="54" width="48" height="21" rx="6" fill="#121217" stroke="#f97316" stroke-width="1.5"></rect><path d="M 30 53 Q 50 58 70 53 Q 62 61 50 61 Q 38 61 30 53 Z" fill="#1f1f28" stroke="#f97316" stroke-width="1"></path><path d="M 44 59 Q 42 66 45 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="43.5" y="70" width="2.5" height="3.5" rx="0.5" fill="#f97316"></rect><path d="M 56 59 Q 58 66 55 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="54" y="70" width="2.5" height="3.5" rx="0.5" fill="#f97316"></rect><path d="M 35 66 L 65 66 L 62 73 L 38 73 Z" fill="#09090d" stroke="#27272a" stroke-width="0.8"></path><line x1="36" y1="66" x2="38" y2="70" stroke="#f97316" stroke-width="1"></line><line x1="64" y1="66" x2="62" y2="70" stroke="#f97316" stroke-width="1"></line><g transform="translate(56, 60)"><rect x="0" y="0" width="8" height="4" fill="#000000" stroke="#fed7aa" stroke-width="0.6"></rect><line x1="2" y1="1" x2="2" y2="3" stroke="#f97316" stroke-width="0.6"></line><line x1="4" y1="1" x2="4" y2="3" stroke="#f97316" stroke-width="1"></line><line x1="6" y1="1" x2="6" y2="3" stroke="#f97316" stroke-width="0.6"></line></g></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#f97316" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#f97316" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#f97316" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#f97316"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#f97316" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#f97316"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#f97316;background-color:#f9731615;border-color:#f9731640">Overclocked Phreak</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Overclocked Phreak</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">lunch</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Extreme liquid-cooled rig featuring exposed copper cranium heatsink cooling fins glowing brightly with molten thermal heat.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div><div class="p-3 rounded-2xl border flex flex-col justify-between transition-all group bg-[#1d1d22] hover:bg-[#22222a] border-[#2c2c36] hover:border-cyan-500/50 hover:shadow-md hover:shadow-cyan-950/20"><div class="mb-2.5"><div class="w-full h-28 sm:h-32 rounded-xl bg-gradient-to-b from-[#1c1c24] to-[#0e0e14] border border-[#2a2a36] hover:border-cyan-400/80 transition-all duration-300 flex items-center justify-center relative overflow-hidden group shadow-lg"><div class="absolute inset-0 opacity-40 group-hover:opacity-70 transition-opacity pointer-events-none" style="background:radial-gradient(circle at 50% 50%, #8b5cf625 0%, transparent 70%)"></div><svg viewBox="0 0 100 85" class="w-24 h-24 relative z-10 transition-transform duration-300 group-hover:scale-105 select-none" style="filter:drop-shadow(0 6px 14px #8b5cf640)"><defs><linearGradient id="grad-skin_37-top" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"></stop><stop offset="30%" stop-color="#8b5cf6"></stop><stop offset="100%" stop-color="#2e1065"></stop></linearGradient><linearGradient id="grad-skin_37-left" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#8b5cf6"></stop><stop offset="100%" stop-color="#0a0a14"></stop></linearGradient><linearGradient id="grad-skin_37-right" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#8b5cf6" stop-opacity="0.7"></stop><stop offset="100%" stop-color="#05050a"></stop></linearGradient><filter id="glow-skin_37" x="-20%" y="-20%" width="140%" height="140%"><feGaussianBlur stdDeviation="2" result="blur"></feGaussianBlur><feComposite in="SourceGraphic" in2="blur" operator="over"></feComposite></filter></defs><ellipse cx="50" cy="72" rx="36" ry="7" fill="#000000" opacity="0.55"></ellipse><g transform="translate(0, 2)"><g fill="none" stroke-linecap="round"><path d="M 24 30 C 12 46, 14 74, 16 90" stroke="#8b5cf6" stroke-width="3"></path><path d="M 30 26 C 22 50, 24 80, 26 94" stroke="#c4b5fd" stroke-width="2.5"></path><path d="M 70 26 C 78 50, 76 80, 74 94" stroke="#c4b5fd" stroke-width="2.5"></path><path d="M 76 30 C 88 46, 86 74, 84 90" stroke="#8b5cf6" stroke-width="3"></path></g><g id="staff-3d-matrix-hacker"><rect x="26" y="54" width="48" height="21" rx="6" fill="#121217" stroke="#8b5cf6" stroke-width="1.5"></rect><path d="M 30 53 Q 50 58 70 53 Q 62 61 50 61 Q 38 61 30 53 Z" fill="#1f1f28" stroke="#8b5cf6" stroke-width="1"></path><path d="M 44 59 Q 42 66 45 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="43.5" y="70" width="2.5" height="3.5" rx="0.5" fill="#8b5cf6"></rect><path d="M 56 59 Q 58 66 55 71" stroke="#ffffff" stroke-width="1.2" fill="none" stroke-linecap="round"></path><rect x="54" y="70" width="2.5" height="3.5" rx="0.5" fill="#8b5cf6"></rect><path d="M 35 66 L 65 66 L 62 73 L 38 73 Z" fill="#09090d" stroke="#27272a" stroke-width="0.8"></path><line x1="36" y1="66" x2="38" y2="70" stroke="#8b5cf6" stroke-width="1"></line><line x1="64" y1="66" x2="62" y2="70" stroke="#8b5cf6" stroke-width="1"></line><g transform="translate(56, 60)"><rect x="0" y="0" width="8" height="4" fill="#000000" stroke="#c4b5fd" stroke-width="0.6"></rect><line x1="2" y1="1" x2="2" y2="3" stroke="#8b5cf6" stroke-width="0.6"></line><line x1="4" y1="1" x2="4" y2="3" stroke="#8b5cf6" stroke-width="1"></line><line x1="6" y1="1" x2="6" y2="3" stroke="#8b5cf6" stroke-width="0.6"></line></g></g><ellipse cx="50" cy="34" rx="30" ry="22" fill="#171724" stroke="#8b5cf6" stroke-width="2"></ellipse><path d="M30,20 Q50,12 70,20" stroke="#ffffff" stroke-width="1.8" fill="none" opacity="0.6" stroke-linecap="round"></path><path d="M26,34 Q50,22 74,34 L70,44 Q50,38 30,44 Z" fill="#06060c" stroke="#1f1f2e" stroke-width="1.2"></path><path d="M30,36 Q50,27 70,36" stroke="#8b5cf6" stroke-width="3" fill="none" stroke-linecap="round"></path><circle cx="40" cy="34" r="1.8" fill="#ffffff"></circle><circle cx="60" cy="34" r="1.8" fill="#ffffff"></circle><ellipse cx="20" cy="34" rx="4" ry="7" fill="#12121d" stroke="#8b5cf6" stroke-width="1.5"></ellipse><circle cx="20" cy="34" r="2" fill="#8b5cf6"></circle><ellipse cx="80" cy="34" rx="4" ry="7" fill="#12121d" stroke="#8b5cf6" stroke-width="1.5"></ellipse><circle cx="80" cy="34" r="2" fill="#8b5cf6"></circle></g></svg><span class="absolute bottom-1.5 right-2 text-[9px] font-mono px-2 py-0.5 rounded-full border uppercase tracking-wider font-bold shadow-sm" style="color:#8b5cf6;background-color:#8b5cf615;border-color:#8b5cf640">Fiber Cablehead</span></div></div><div class="space-y-1 flex-1"><div class="flex items-center justify-between gap-1"><span class="font-bold text-white text-xs truncate">Fiber Cablehead</span><span class="text-[9px] font-mono uppercase px-1.5 py-0.5 rounded font-bold border shrink-0 bg-amber-500/20 text-amber-300 border-amber-500/40">lunch</span></div><p class="text-slate-400 text-[11px] leading-relaxed line-clamp-2">Deep-net diving suit with a cascade of glowing fiber-optic cable dreadlocks flowing down behind the helmet.</p></div><div class="mt-3 pt-2.5 border-t border-[#2a2a34] flex items-center justify-between"><div class="flex items-center gap-1.5"><span class="text-[10px] text-slate-500 uppercase font-mono font-bold">LOCKED</span><button type="button" class="p-1 rounded hover:bg-cyan-500/20 text-slate-400 hover:text-cyan-300 transition-colors cursor-pointer" title="Test in 3D Fitting Room"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles lucide-stars w-3.5 h-3.5" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg></button></div><button type="button" class="px-2.5 py-1 bg-[#252530] hover:bg-amber-500/20 hover:border-amber-500/40 border border-[#373748] text-amber-300 rounded-lg text-[11px] font-semibold flex items-center gap-1 cursor-pointer transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-3 h-3 text-amber-400" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg><span>Unlock</span></button></div></div></div><div class="pt-4 border-t border-[#26262b] flex flex-wrap items-center justify-between gap-3 text-xs"><span class="text-slate-400 font-mono text-[11px]">Showing <!-- -->1<!-- --> -<!-- --> <!-- -->48<!-- --> of <!-- -->148<!-- --> items</span><div class="flex items-center gap-1.5"><button type="button" disabled="" class="px-2.5 py-1.5 rounded-lg bg-[#202026] border border-[#2f2f38] text-slate-300 hover:text-white disabled:opacity-40 disabled:cursor-not-allowed flex items-center gap-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-left w-3.5 h-3.5" aria-hidden="true"><path d="m15 18-6-6 6-6"></path></svg><span>Prev</span></button><button class="w-7 h-7 rounded-lg text-xs font-mono font-bold transition-colors bg-[#007acc] text-white">1</button><button class="w-7 h-7 rounded-lg text-xs font-mono font-bold transition-colors bg-[#202026] text-slate-400 hover:text-white border border-[#2f2f38]">2</button><button class="w-7 h-7 rounded-lg text-xs font-mono font-bold transition-colors bg-[#202026] text-slate-400 hover:text-white border border-[#2f2f38]">3</button><button class="w-7 h-7 rounded-lg text-xs font-mono font-bold transition-colors bg-[#202026] text-slate-400 hover:text-white border border-[#2f2f38]">4</button><button type="button" class="px-2.5 py-1.5 rounded-lg bg-[#202026] border border-[#2f2f38] text-slate-300 hover:text-white disabled:opacity-40 disabled:cursor-not-allowed flex items-center gap-1"><span>Next</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-right w-3.5 h-3.5" aria-hidden="true"><path d="m9 18 6-6-6-6"></path></svg></button></div></div></section></div></div></main></div></div><!--$--><!--/$--><script id="_R_">(globalThis["TURBOPACK"] || (globalThis["TURBOPACK"] = [])).push({"otherChunks":["static/chunks/3xic34odrqk7-.js","static/chunks/3-rp__fazq2qp.js","static/chunks/3oyu3ojtboiqk.js","static/chunks/27y6z1uobtyg2.js"],"runtimeModuleIds":[94553]});</script><script src="/_next/static/chunks/3xic34odrqk7-.js" async=""></script><script>(self.__next_f=self.__next_f||[]).push([0])</script><script>self.__next_f.push([1,"1:\"$Sreact.fragment\"\n2:\"/_next/static/chunks/31d3_w6klkslg.js\"\n3:I[28761,[\"$2\"],\"default\"]\n4:I[39756,[\"$2\"],\"default\"]\n5:I[37457,[\"$2\"],\"default\"]\n9:I[47257,[\"$2\"],\"ClientPageRoot\"]\na:\"/_next/static/chunks/23uup1e8841av.js\"\nb:\"/_next/static/chunks/2rx7xvi55ohln.js\"\nc:I[30536,[\"$2\",\"$a\",\"$b\"],\"default\"]\nf:I[97367,[\"$2\"],\"OutletBoundary\"]\n10:\"$Sreact.suspense\"\n12:\"ViewportBoundary\"\n13:I[97367,[\"$2\"],\"$12\"]\n15:\"MetadataBoundary\"\n16:I[97367,[\"$2\"],\"$15\"]\n18:I[68027,[\"$2\"],\"default\",1]\n:HL[\"/_next/static/chunks/2q9cwykv6ox1t.css\",\"style\"]\n:HL[\"https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;500;600;700\u0026family=Inter:wght@400;500;600;700\u0026family=JetBrains+Mono:wght@400;500;600;700\u0026family=Roboto:wght@400;500;700\u0026display=swap\",\"style\"]\n7:X\n8:[[\"children\",{\"s\":\"__PAGE__\",\"h\":512,\"d\":{\"r\":[\"$\",\"$1\",\"c\",{\"children\":[[\"$\",\"$L9\",null,{\"Component\":\"$c\",\"serverProvidedParams\":{\"searchParams\":{},\"params\":{},\"promises\":[\"$@d\",\"$@e\"]}}],[[\"$\",\"script\",\"script-0\",{\"src\":\"/_next/static/chunks/23uup1e8841av.js\",\"async\":true,\"nonce\":\"$undefined\"}],[\"$\",\"script\",\"script-1\",{\"src\":\"/_next/static/chunks/2rx7xvi55ohln.js\",\"async\":true,\"nonce\":\"$undefined\"}]],[\"$\",\"$Lf\",null,{\"children\":[\"$\",\"$10\",null,{\"name\":\"Next.MetadataOutlet\",\"children\":\"$@11\"}]}]]}],\"p\":false,\"v\":null}}]]\n6:[[\"children\",{\"s\":\"store\",\"h\":512,\"d\":{\"r\":[\"$\",\"$1\",\"c\",{\"children\":[null,[\"$\",\"$L4\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L5\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]]}],\"p\":false,\"v\":\"$7\"},\"c\":\"$Q8\"}]]\n0:{\"P\":null,\"c\":[\"\",\"store\"],\"q\":\"\",\"i\":false,\"t\":{\"t\":{\"s\":\"\",\"h\":528,\"d\":{\"r\":[\"$\",\"$1\",\"c\",{\"children\":[[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/chunks/2q9cwykv6ox1t.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"script\",\"script-0\",{\"src\":\"/_next/static/chunks/31d3_w6klkslg.js\",\"async\":true,\"nonce\":\"$undefined\"}]],[\"$\",\"html\",null,{\"lang\":\"en\",\"className\":\"dark\",\"suppressHydrationWarning\":true,\"children\":[[\"$\",\"head\",null,{\"children\":[[\"$\",\"link\",null,{\"rel\":\"manifest\",\"href\":\"/manifest.json\"}],[\"$\",\"link\",null,{\"rel\":\"apple-touch-icon\",\"href\":\"/icons/icon.svg\"}],[\"$\",\"meta\",null,{\"name\":\"apple-mobile-web-app-capable\",\"content\":\"yes\"}],[\"$\",\"meta\",null,{\"name\":\"apple-mobile-web-app-status-bar-style\",\"content\":\"black-translucent\"}],[\"$\",\"link\",null,{\"rel\":\"preconnect\",\"href\":\"https://fonts.googleapis.com\"}],[\"$\",\"link\",null,{\"rel\":\"preconnect\",\"href\":\"https://fonts.gstatic.com\",\"crossOrigin\":\"anonymous\"}],[\"$\",\"link\",null,{\"href\":\"https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;500;600;700\u0026family=Inter:wght@400;500;600;700\u0026family=JetBrains+Mono:wght@400;500;600;700\u0026family=Roboto:wght@400;500;700\u0026display=swap\",\"rel\":\"stylesheet\"}],[\"$\",\"script\",null,{\"suppressHydrationWarning\":true,\"dangerouslySetInnerHTML\":{\"__html\":\"(function(){try{var raw=localStorage.getItem(\\\"agmon_theme_settings\\\");var t=\\\"dark-plus\\\";var fz=\\\"13\\\";var uf=\\\"\\\";var cf=\\\"\\\";if(raw){var s=JSON.parse(raw);if(s.theme)t=s.theme;if(s.fontSize)fz=s.fontSize;if(s.uiFont)uf=s.uiFont;if(s.codeFont)cf=s.codeFont;}document.documentElement.setAttribute(\\\"data-theme\\\",t);if(t===\\\"light-plus\\\"){document.documentElement.classList.remove(\\\"dark\\\");document.documentElement.classList.add(\\\"light\\\");}else{document.documentElement.classList.remove(\\\"light\\\");document.documentElement.classList.add(\\\"dark\\\");}document.documentElement.style.setProperty(\\\"--font-size-ui\\\",fz+\\\"px\\\");document.documentElement.style.setProperty(\\\"--font-size-base\\\",fz+\\\"px\\\");}catch(e){}})();\"}}]]}],[\"$\",\"body\",null,{\"className\":\"antialiased bg-[var(--bg-workbench)] text-[var(--text-main)] select-none\",\"children\":[[\"$\",\"$L3\",null,{}],[\"$\",\"$L4\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L5\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":[[[\"$\",\"title\",null,{\"children\":\"404: This page could not be found.\"}],[\"$\",\"div\",null,{\"style\":{\"fontFamily\":\"system-ui,\\\"Segoe UI\\\",Roboto,Helvetica,Arial,sans-serif,\\\"Apple Color Emoji\\\",\\\"Segoe UI Emoji\\\"\",\"height\":\"100vh\",\"textAlign\":\"center\",\"display\":\"flex\",\"flexDirection\":\"column\",\"alignItems\":\"center\",\"justifyContent\":\"center\"},\"children\":[\"$\",\"div\",null,{\"children\":[[\"$\",\"style\",null,{\"dangerouslySetInnerHTML\":{\"__html\":\"body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}\"}}],[\"$\",\"h1\",null,{\"className\":\"next-error-h1\",\"style\":{\"display\":\"inline-block\",\"margin\":\"0 20px 0 0\",\"padding\":\"0 23px 0 0\",\"fontSize\":24,\"fontWeight\":500,\"verticalAlign\":\"top\",\"lineHeight\":\"49px\"},\"children\":404}],[\"$\",\"div\",null,{\"style\":{\"display\":\"inline-block\"},\"children\":[\"$\",\"h2\",null,{\"style\":{\"fontSize\":14,\"fontWeight\":400,\"lineHeight\":\"49px\",\"margin\":0},\"children\":\"This page could not be found.\"}]}]]}]}]],[]],\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]]}]]}]]}],\"p\":false,\"v\":null},\"c\":\"$Q6\"},\"h\":{\"r\":[\"$\",\"$1\",\"h\",{\"children\":[null,[\"$\",\"$L13\",null,{\"children\":\"$L14\"}],[\"$\",\"$L16\",null,{\"children\":[[\"$\",\"div\",null,{\"hidden\":true,\"children\":[\"$\",\"$10\",null,{\"name\":\"Next.Metadata\",\"children\":\"$L17\"}]}],null]}],null]}],\"p\":false,\"v\":null}},\"m\":\"$undefined\",\"G\":[\"$18\",[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/chunks/2q9cwykv6ox1t.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}]]],\"S\":true,\"r\":\"$undefined\",\"s\":\"$undefined\",\"a\":\"$undefined\",\"l\":\"$undefined\",\"p\":\"$undefined\",\"d\":\"$undefined\",\"b\":\"dGN2VKPk5TJgezxS3JvRc\"}\n7:C\nd:{}\ne:\"$8:0:1:d:r:props:children:0:props:serverProvidedParams:params\"\n14:[[\"$\",\"meta\",\"0\",{\"charSet\":\"utf-8\"}],[\"$\",\"meta\",\"1\",{\"name\":\"viewport\",\"content\":\"width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no\"}],[\"$\",\"meta\",\"2\",{\"name\":\"theme-color\",\"content\":\"#070b12\"}]]\n19:I[27201,[\"$2\"],\"IconMark\"]\n11:null\n17:[[\"$\",\"title\",\"0\",{\"children\":\"AGMon - AI Agent Office \u0026 Activity Visualizer\"}],[\"$\",\"meta\",\"1\",{\"name\":\"description\",\"content\":\"Realtime activity and token flow visualizer for Antigravity, Claude Code \u0026 AI CLIs\"}],[\"$\",\"link\",\"2\",{\"rel\":\"manifest\",\"href\":\"/manifest.json\",\"crossOrigin\":\"$undefined\"}],[\"$\",\"meta\",\"3\",{\"name\":\"mobile-web-app-capable\",\"content\":\"yes\"}],[\"$\",\"meta\",\"4\",{\"name\":\"apple-mobile-web-app-title\",\"content\":\"AGMon\"}],[\"$\",\"meta\",\"5\",{\"name\":\"apple-mobile-web-app-status-bar-style\",\"content\":\"black-translucent\"}],[\"$\",\"link\",\"6\",{\"rel\":\"icon\",\"href\":\"/favicon.svg\"}],[\"$\",\"link\",\"7\",{\"rel\":\"apple-touch-icon\",\"href\":\"/icons/icon.svg\"}],[\"$\",\"$L19\",\"8\",{}]]\n"])</script></body></html>