# Boutique：可直接交给其他 Agent 的复现提示词

独立实现球面弯曲的服饰网格，可拖动/滚轮旋转，点击模特弹出玻璃单品面板并选择、加购。使用looks.json顺序/名称/价格/材质/季节/颜色；图片为../../boutique-gallery/assets/person-{num}.png及person-{num}-{top|bottom|shoes}.jpg。保留当前基线实际8×8=64卡（旧描述72不代表当前数量）。不要调用旧JS或iframe。独立球面模型、详情状态及输入渲染。

全屏背景#fafafa、文字#16150f，Geist/Geist Mono。模特图透明背景、无圆角阴影、cover。左上32/26品牌：9px/.14em的BOUTIQUE — RESORT 2026，下方30px/1.1 italic Georgia Boutique；左下32/26提示Click a look to magnify，10px mono/.24em、opacity.38。旧分类标签、购物袋、卡片号码/色点、计数隐藏但保留功能。网格独立z1层叠上下文，详情开启透明度.25 transition .4s。

球面lon/lat及target初始0，每帧lon/lat以.09追随target，然后latTarget限制±(.205*8*.5)。W<767时R=max(min(W,H),780)*1.35，cardW=max(min(W,H),850)*.11；其他R=min(W,H)*1.35，cardW=min(W,H)*.11。h=w*1.34。每卡lon=(col−3.5)*.135+view.lon，按span=.135*8包裹到[−span/2,span/2)；lat=(row−3.5)*.205+view.lat。x=Rsin(lon)cos(lat)，y=Rsin(lat)，z=Rcos(lon)cos(lat)，depth=clamp((z/R+.2)/1.2)，scale=.55+.75depth，opacity=clamp((depth−.06)/.3)。屏幕左上(W/2+x−w/2,H/2+y−h/2)，位置1位，scale/opacity3位，zIndex=round(100depth)，brightness=.72+.38depth取2位。隐藏计数显示实际DOM中心最近的Look num · name。

滚轮preventDefault，targetY+=deltaY*.0008，targetX+=deltaX*.0008；按下非sheet/tabs/cart区域开始拖动，targetX/Y−=dx/dy*.0016；累计|dx|+|dy|，松开/cancel<8命中卡则打开。分类model/top/bottom/shoes更新aria-pressed和64张图，GSAP opacity.2/scale.94→1/1，.5s、stagger.004、power3.out。首次卡入场opacity0/scale.9、.8s、stagger.006、power3.out；rAF继续写球面位置。

详情左模特left22%/top20%/width26%/height62%、contain、z50。右面板right19%/top12%/width min(30vw,420px)/max-height82%、padding22，背景#f0f0eced、白.6边框1、圆角30、shadow0 18px35黑.2、blur24、z60，纵向滚动。打开时translateX100%→0、.5s power3.out；关闭移100%、.4s power3.in，并立刻去detail-open使面板visibility hidden。上方8px mono季节，主单品图margin18、高34vh/min180、背景#e2e3df、contain；3个缩略按钮间距8、52×52、圆角8、选中灰边。标题italic20px/1.2 Georgia、margin22，材质10px；Add this piece为9px mono/.1em胶囊细边，margin20/padding10。Full look行margin24、10px，金额italic20；底部整套加购黑色9px mono/.15em、padding12/margin12。关闭right16/top12。手机面板right3%/width66%/padding14/圆角22，主图29vh/min140、缩略38、标题18/margin15；左模特left0/top12%/width34%/height70%。

打开默认top单品；点击缩略更新名称、材质优先material再category、主图/alt、价格按钮、selected样式。美元金额按price/100使用en-US格式；总价top+bottom+shoes。单件加购bag+=1并显示Added to bag；整套bag+=3；购物袋文字Bag · N，GSAP scale1→1.08、.16s、yoyo/repeat1、power2.out。只保留内存计数，不连接支付。Escape或关闭按钮退出；滚动/拖动仍按原事件范围工作。

销毁清理rAF/事件/卡片/面板/购物袋tween。验收1440×1000和390×844：初始64卡、滚轮/拖动、四分类、打开、切裤装和鞋、单件+整套得到Bag · 4、Escape。上述全部几何、图源、详情文字/选中/购物数量状态精确对照通过，脚本rewrite/scripts/check-boutique.mjs，证据artifacts/rewrite-validation/boutique/。

## 本地图片与中英文（2026-09-21 更新）

本轮已接入本地公开图片和中英双语。复现时同时遵循 [共享规范](../../shared/README.md)：沿用当前本地图片路径，使用共享词典与语言偏好（`zh` / `en`），覆盖动态内容、辅助标签和 Canvas 文字；不要恢复旧的远程图片链接。中文拆字标题应先翻译再拆分，并保持原有动画机制。图片来源与替换映射在共享规范中列出。