oil-ui-pro 0.15.4 → 0.22.2（上游 ui.oiloil.org 正式包）＋ 记 P0-98 跨盘 rename 坑

- oil-ui-pro 升到 0.22.2：references 13→28 份（新增 16、删 imagery.md）、assets 增 cards/（22 组）与 fonts/、SKILL.md 顶层五步结构未改名。
- 升级路径：官方 `npx github:oil-oil/oil-cli update` 稳定失败（error=replace、报「检查目录权限」）。
  真身为 EXDEV —— 解压在 os.tmpdir()（C 盘）、技能目录在 E 盘，Windows 上 rename 不能跨盘；
  CLI 的 catch 把非 CliError 原生异常一律兜底成 replaceFailed，真错误一个字不吐。
  做法＝借其 prepare() 只做下载+校验，再 cp 到同盘 stage、rename 交换；官方命令复验 up_to_date。
- 回归：product-planning 按名引用的 visual-review.md／tools.md／design-direction.md／style-explorer.md 全部健在；命名闸门 2061｜0｜27。
- session-mechanism/references/pitfalls.md 新增 P0-98（含通则：更新器把原生错误兜底成指错方向的人话）。

oil-ui-pro/assets/cards/ui-slice/card.css

@@ -0,0 +1,15 @@
+.ui-slice {
+  & .card-stage { background:radial-gradient(ellipse at 45% 65% in oklab,color-mix(in oklab,var(--card-accent) 10%,transparent),transparent 74%); }
+  & .slice-back { position:absolute; width:91%; top:0; left:17%; height:98%; overflow:clip; background:var(--card-wash); border:1px solid var(--card-line); border-radius:calc(var(--_card-radius)*.8); color:var(--card-muted); mask-image:linear-gradient(in oklab,#000 68%,transparent); }
+  & .slice-toolbar { border-bottom:1px solid var(--card-line); font-size:12px; padding:16px; & > span:last-child { float:right; margin-right:50px; } }
+  & .slice-columns { display:grid; grid-template-columns:1fr 1fr; padding:14px; gap:12px; font-size:12px; & p { padding:15px 9px; margin:9px 0; background:var(--card-panel); border-radius:calc(var(--_card-radius)*.45); color:var(--card-ink); } }
+  & .slice-front { position:absolute; width:82%; left:5%; top:25%; background:var(--card-panel); border:1px solid var(--card-line); border-radius:calc(var(--_card-radius)*.8); box-shadow:0 22px 45px -15px #24324f30,0 3px 9px #24324f0a; padding:20px; font-size:14px; }
+  & .slice-front-heading { display:flex; align-items:center; gap:7px; font-weight:550; font-size:15px; margin-bottom:11px; }
+  & .slice-symbol,& .slice-more { color:var(--card-muted); } & .slice-more { margin-left:auto; }
+  & .slice-task { display:flex; gap:10px; align-items:center; padding:8px 0; margin:0; & i { width:16px; height:16px; border:1px solid var(--card-muted); border-radius:5px; font-size:10px; display:grid; place-items:center; font-style:normal; } & b { margin-left:auto; width:26px; height:26px; border-radius:50%; background:#dce9f7; display:grid; place-items:center; font-size:10px; font-weight:450; color:#385677; } &:nth-of-type(2) b { background:#f4dfdb; color:#7c514b; } &:nth-of-type(3) b { background:#dde9df; color:#48614d; } &.done,&.checked { & i { background:var(--card-accent); color:var(--_card-on-accent); border-color:var(--card-accent); } & > span { color:var(--card-muted); text-decoration:line-through; } } }
+  
+  & .slice-demo i { background:color-mix(in oklab,var(--card-accent) calc(var(--task-done,0)*100%),transparent);color:color-mix(in oklab,var(--_card-on-accent) calc(var(--task-done,0)*100%),transparent);border-color:color-mix(in oklab,var(--card-accent) calc(var(--task-done,0)*100%),var(--card-muted));transform:scale(calc(1 - sin(var(--task-done,0)*3.14159)*.12)); }
+  & .slice-demo > span { color:color-mix(in oklab,var(--card-muted) calc(var(--task-done,0)*100%),var(--card-ink)); }
+  & .slice-progress { display:flex; flex-wrap:wrap; justify-content:space-between; margin-top:15px; font-size:10px; color:var(--card-muted); & > div { width:100%; height:4px; margin-top:9px; background:var(--card-line); border-radius:3px; overflow:clip; & i { display:block; width:100%; height:100%; background:var(--card-accent); border-radius:inherit; transform-origin:left;transform:scaleX(.33333); } } }
+  @media(max-width:650px) { & .slice-front { padding:18px; font-size:13px; } & .slice-front-heading { font-size:13px; } & .slice-progress { font-size:10px; } }
+}

oil-ui-pro/assets/cards/ui-slice/card.html

@@ -0,0 +1,7 @@
+<article class="card bottom-title ui-slice" data-card="ui-slice" data-motion="auto">
+  <div class="card-stage">
+    <div class="slice-back"><div class="slice-toolbar"><span data-text="board">本周计划</span> <span>⋯</span></div><div class="slice-columns"><div><span data-text="columns.0">待开始</span><p data-text="backlog.0">整理首页内容</p><p data-text="backlog.1">确认品牌素材</p></div><div><span data-text="columns.1">进行中</span><p data-text="backlog.2">打磨购买体验</p><p data-text="backlog.3">移动端检查</p></div></div></div>
+    <div class="slice-front"><div class="slice-front-heading"><span class="slice-symbol">◈</span> <span data-text="listTitle">上线前的最后一公里</span> <span class="slice-more">⋯</span></div><p class="slice-task done"><i>✓</i><span data-text="tasks.0.title">确认首页文案</span><b data-text="tasks.0.owner">林</b></p><p class="slice-task slice-demo"><i></i><span data-text="tasks.1.title">检查移动端体验</span><b data-text="tasks.1.owner">周</b></p><p class="slice-task"><i></i><span data-text="tasks.2.title">准备发布素材</span><b data-text="tasks.2.owner">陈</b></p><div class="slice-progress"><span data-text="progressLabel">发布清单</span><span class="slice-count">1 / 3</span><div><i></i></div></div></div>
+  </div>
+  <div class="card-caption"><h2 data-text="title">让好想法，稳稳落地</h2><p data-text="description">从计划到完成，团队始终在同一页。</p></div>
+</article>

oil-ui-pro/assets/cards/ui-slice/card.js

@@ -0,0 +1,12 @@
+import {loop,shell,smooth,staticMotion} from '../shared/runtime.js';
+export function mount(element, options = {}) {
+  const clean=shell(element,options);
+  const row=element.querySelector('.slice-demo'),box=row.querySelector('i'),bar=element.querySelector('.slice-progress i'),count=element.querySelector('.slice-count'),still=staticMotion(element,options);
+  box.textContent='✓';
+  const clock=loop(element,time=>{
+    const staticState=still(),p=staticState?1:smooth((time-1.1)/.32),progress=staticState?1:smooth((time-1.2)/.90);
+    row.style.setProperty('--task-done',p);row.classList.toggle('checked',p===1);
+    bar.style.transform=`scaleX(${(1+progress)/3})`;count.textContent=progress===1?'2 / 3':'1 / 3';
+  },{...options,duration:2.3});
+  return {replay:()=>clock.restart(),destroy(){clock.destroy();clean();row.classList.remove('checked');row.style.removeProperty('--task-done');box.textContent='';bar.style.removeProperty('transform');count.textContent='1 / 3';}};
+}