/* 复盘镜 售前 · 先翻一遍整份（WO-OPUS-019 三 · 定稿）
   一个动作：像拇指拨书页一样，把整份档案的 18 页从头到尾拨一遍——标题看得清，正文糊着；
   拨到尾，再拨回来，越拨越慢，停在“你替自己写的三条”；那一页变清楚，朱笔落下（接 evidence.css）。 */
.rf{position:relative;max-width:560px;margin-top:22px}
.rf-book{position:relative;width:min(300px,78vw);aspect-ratio:390/750;margin:0 auto;perspective:1600px}
.rf-book::before{content:"";position:absolute;inset:6px -8px -8px 6px;background:var(--paper-2);border:1px solid var(--rule);border-radius:2px 6px 6px 2px;box-shadow:0 26px 40px -24px var(--shadow)}
.rf-book::after{content:"";position:absolute;top:8px;bottom:-6px;right:-12px;width:10px;border-radius:0 4px 4px 0;
  background:repeating-linear-gradient(90deg,var(--paper) 0 1px,var(--rule) 1px 2px)}
.rf-pg{position:absolute;inset:0;background:var(--paper) center/cover no-repeat;border:1px solid var(--rule);border-radius:1px 3px 3px 1px;
  box-shadow:inset 12px 0 16px -14px rgba(58,44,24,.35);transform-origin:0 50%;backface-visibility:hidden;opacity:0}
.rf-pg.on{opacity:1}
.motion .rf-pg.fwd{animation:rfFwd var(--d,120ms) cubic-bezier(.3,.7,.3,1) both}
.motion .rf-pg.back{animation:rfBack var(--d,120ms) cubic-bezier(.3,.7,.3,1) both}
@keyframes rfFwd{from{transform:rotateY(-62deg) translateX(10%);opacity:.4;filter:brightness(1.08)}to{transform:none;opacity:1}}
@keyframes rfBack{from{transform:rotateY(48deg) translateX(-6%);opacity:.4}to{transform:none;opacity:1}}
.rf-no{position:absolute;right:-4px;top:-26px;font:700 11px/1 var(--type);letter-spacing:.16em;color:var(--muted)}
.rf-no b{color:var(--cin);font-size:13px}
/* 书口上的进度：18 道刻痕，拨到哪一页亮哪一道 */
.rf-ticks{position:absolute;right:-24px;top:8px;bottom:8px;width:6px;display:flex;flex-direction:column;justify-content:space-between}
.rf-ticks i{display:block;height:2px;background:var(--rule);border-radius:1px}
.rf-ticks i.on{background:var(--cin)}
.rf-stop{position:absolute;left:50%;bottom:-38px;transform:translateX(-50%);font:600 13px/1 var(--serif);letter-spacing:.2em;color:var(--cin);opacity:0;transition:opacity .4s;white-space:nowrap}
.rf.stopped .rf-stop{opacity:1}
/* 底下一行：这一份到底有多少 */
.rf-foot{max-width:560px}
.rf-count{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 18px;margin:52px auto 0;max-width:420px;text-align:center}
.rf-count div{min-width:72px}
.rf-count b{display:block;font:900 30px/1.1 var(--serif);font-variant-numeric:tabular-nums;color:var(--ink)}
.rf-count span{font:500 12px/1.5 var(--sans);letter-spacing:.08em;color:var(--muted)}
.rf-scroll{margin:12px auto 0;text-align:center;font:600 15px/1.7 var(--serif);color:var(--ink-2)}
.rf-again{display:block;margin:10px auto 0;background:none;border:0;border-bottom:1px solid var(--rule);color:var(--muted);font:500 13px/1 var(--sans);letter-spacing:.08em;padding:10px 2px;cursor:pointer}
/* 停下以后：那一页换成看得清的节选（evidence），翻书台收起 */
#evidence .ev-stage{display:none}
#evidence.rf-done .ev-stage{display:block}
@media (min-width:900px){#evidence.rf-done .ev-stage{display:grid}}
#evidence.rf-done .rf-book,#evidence.rf-done .rf-stop{display:none}
#evidence.rf-done .rf{margin-top:8px}
#evidence.rf-done .rf-count{margin-top:26px}
@media (min-width:900px){.rf-foot{max-width:560px}}
@media (prefers-reduced-motion:reduce){#evidence .ev-stage{display:block}#evidence .rf-book,#evidence .rf-stop,#evidence .rf-again{display:none}}