/* A 组第二轮批注（2026-11-11）的改版：P12、P19、P20、P22、P27、P30、P32、P34。
   直接在正式稿里改的，之后别再跑 tools/batch/merge.py（会把这些页盖回旧版）。
   放在 deck_B.css 后、deck_C.css 前。章节眉标统一用 deck_B.css 里的 .crumb（放到 logo 那一行）。 */

/* 共用：瓷白图标圆、AI 头像（.ai-av 定义在 deck_B.css） */
.r2-ic{display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#dcdeea 60%,#b9bccd);box-shadow:0 0 40px rgba(237,237,243,.22)}
.r2-ic svg{fill:none;stroke:#2b2b3a;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}

/* ---------- P12 第 2 下：2020 + 浏览器里「Flash 已不再受支持」 ---------- */
.c12 .fl-end{position:absolute;inset:0}
.c12 .yr{position:absolute;left:160px;top:300px;width:620px}
.c12 .yr b{display:block;font:500 220px/1 var(--serif);letter-spacing:-.02em}
.c12 .yr p{margin-top:28px;font-size:44px;color:var(--t1)}
.c12 .brw{position:absolute;left:860px;top:220px;width:900px;height:520px;border-radius:24px;overflow:hidden;background:#1b1b26;border:1px solid rgba(237,237,243,.14);box-shadow:0 50px 100px rgba(0,0,0,.45)}
.c12 .brw .bar{display:flex;align-items:center;gap:10px;height:64px;padding:0 24px;background:#22222f;border-bottom:1px solid var(--ln)}
.c12 .brw .bar i{width:14px;height:14px;border-radius:50%;background:#3a3a4c}
.c12 .brw .bar span{margin-left:18px;flex:1;height:38px;line-height:38px;padding:0 18px;border-radius:19px;background:#171721;font-size:22px;color:var(--t3)}
.c12 .brw .bar em{font-style:normal;font-size:22px;color:var(--t3);border:1px solid var(--ln);border-radius:99px;padding:3px 14px}
.c12 .brw .body{height:456px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:30px;background:repeating-linear-gradient(135deg,rgba(237,237,243,.025) 0 18px,transparent 18px 36px)}
.c12 .brw svg{width:150px;height:150px;fill:none;stroke:var(--t3);stroke-width:4;stroke-linejoin:round}
.c12 .brw svg .x{stroke:#ff6b81;stroke-width:6;stroke-linecap:round}
.c12 .brw .body b{font-size:34px;font-weight:500;color:var(--t1)}

/* ---------- P19 第 2 下：人物在照片里居中；第 3 下：三条岔路 ---------- */
.c19 .voice-photo::before{background-position:88% center}
.c19 .so .me{position:absolute;left:160px;top:330px;width:340px;display:flex;flex-direction:column;align-items:center;text-align:center}
.c19 .so .me .avatar{width:200px;height:200px;border:4px solid rgba(237,237,243,.25)}
.c19 .so .me b{margin-top:24px;font:700 56px var(--serif)}
.c19 .so .me small{margin-top:10px;font-size:26px;color:var(--t3)}
.c19 .so .br3{position:absolute;left:500px;top:220px;width:700px;height:480px;overflow:visible}
.c19 .so .br3 path{fill:none;stroke:rgba(237,237,243,.35);stroke-width:2.5;stroke-dasharray:8 10}
.c19 .so .opts{position:absolute;left:1140px;top:220px;width:620px;height:480px}
.c19 .so .opts div{position:absolute;left:0;width:620px;height:120px;display:flex;align-items:center;gap:30px;padding:0 34px;border-radius:24px;background:var(--k1);border:1px solid var(--ln);box-shadow:0 24px 50px rgba(0,0,0,.3)}
.c19 .so .opts div:nth-child(1){top:0}.c19 .so .opts div:nth-child(2){top:180px}.c19 .so .opts div:nth-child(3){top:360px}
.c19 .so .opts i{flex:none;width:76px;height:76px;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#dcdeea 60%,#b9bccd)}
.c19 .so .opts i svg{width:42px;height:42px;fill:none;stroke:#2b2b3a;stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round}
.c19 .so .opts b{font:700 50px var(--serif)}

/* ---------- P20 第 0 下：面板里放配图；第 1 下：去掉外框，三步流程 ---------- */
.c20 .question{overflow:hidden;padding:0;align-content:end;justify-items:start}
.c20 .question .qimg{position:absolute;inset:0;background:linear-gradient(180deg,rgba(23,23,33,0) 35%,rgba(23,23,33,.9)),url(img/a_agent.png) 60% 40%/cover}
.c20 .question h2{position:relative;margin:0 0 44px 50px;font:700 72px var(--serif);text-shadow:0 2px 30px rgba(23,23,33,.6)}
.c20 .flow2{position:absolute;left:820px;top:235px;width:960px;height:490px;display:flex;align-items:center;justify-content:space-between;filter:none;transform:none}
.c20 .flow2 .demo{position:absolute;right:0;top:0;color:var(--t3);border:1px solid var(--ln);border-radius:99px;padding:4px 14px;font-size:22px}
.c20 .flow2 .nd{width:260px;display:flex;flex-direction:column;align-items:center;text-align:center}
.c20 .flow2 .nd i{width:150px;height:150px;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#dcdeea 60%,#b9bccd);box-shadow:0 0 50px rgba(237,237,243,.2)}
.c20 .flow2 .nd i svg{width:72px;height:72px;fill:none;stroke:#2b2b3a;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.c20 .flow2 .nd.hi i{background:radial-gradient(circle at 35% 30%,#fff,#c9d0ff 50%,#5266eb);box-shadow:0 0 60px rgba(142,162,255,.55)}
.c20 .flow2 .nd b{margin-top:28px;font:700 38px/1.3 var(--serif)}
.c20 .flow2 .nd small{margin-top:10px;font-size:26px;color:var(--t3)}
.c20 .flow2 u{flex:1;align-self:flex-start;margin-top:74px;height:3px;background:repeating-linear-gradient(90deg,rgba(237,237,243,.5) 0 10px,transparent 10px 20px);background-size:20px 3px;animation:a2flow 1s linear infinite;filter:none;transform:none}
@keyframes a2flow{to{background-position:20px 0}}

/* ---------- P22 第 1 下：那张截图，做成手机聊天截图（同 P45） ---------- */
.c22 .sp{position:absolute;left:300px;top:150px;width:480px}
.c22 .sp .tag{position:absolute;right:-20px;top:-6px;z-index:2;font-size:22px;color:var(--t3);border:1px solid var(--ln);border-radius:99px;padding:4px 14px;background:var(--k0)}
.c22 .pledge{left:880px;right:160px;top:330px;text-align:left;font:700 72px/1.4 var(--serif)}
.sp .phone{width:440px;height:600px;padding:7px;border-radius:32px;background:#fff;box-shadow:0 30px 60px rgba(0,0,0,.5);rotate:-3deg}
.sp .scr{position:relative;height:100%;border-radius:26px;overflow:hidden;background:#f4f4f7;color:#171721;display:flex;flex-direction:column}
.sp .sb{display:flex;justify-content:space-between;align-items:center;padding:12px 22px 6px;font:600 22px var(--sans)}
.sp .sb span{display:flex;gap:6px;align-items:center}
.sp .sig{width:16px;height:10px;background:#171721;clip-path:polygon(0 70%,25% 50%,50% 30%,100% 0,100% 100%,0 100%)}
.sp .wifi{width:14px;height:10px;border-radius:14px 14px 0 0;border:2.5px solid #171721;border-bottom:0}
.sp .bat{width:24px;height:11px;border-radius:3px;border:1.5px solid #171721;background:linear-gradient(90deg,#171721 0 30%,transparent 30%)}
.sp .nav{display:flex;align-items:center;gap:12px;padding:10px 18px 12px;background:#fff;border-bottom:1px solid #e6e6ee}
.sp .nav u{text-decoration:none;font:300 34px/1 var(--sans);color:#5266eb}
.sp .nav .ai-av{width:40px;height:40px}.sp .nav .ai-av::after{inset:10px}
.sp .nav b{display:block;font:600 24px var(--sans)}
.sp .nav small{font-size:22px;color:#1f8a5b}
.sp .day{margin:16px auto 6px;font-size:22px;color:#8b8b9e}
.sp .m{display:flex;align-items:flex-end;gap:8px;padding:8px 16px}
.sp .m.me{justify-content:flex-end}
.sp .m p{max-width:310px;padding:12px 18px;font-size:26px;line-height:1.45;border-radius:22px}
.sp .m.me p{background:#5266eb;color:#fff;border-bottom-right-radius:6px}
.sp .m.ai p{background:#fff;border:1px solid #e6e6ee;border-bottom-left-radius:6px}
.sp .m .ai-av{width:34px;height:34px}.sp .m .ai-av::after{inset:9px;border-width:1.5px}
.sp .inp{margin:auto 12px 14px;display:flex;align-items:center;height:52px;padding:0 6px 0 18px;border-radius:26px;background:#fff;border:1px solid #e6e6ee;font-size:22px;color:#a3a3b3}
.sp .inp i{margin-left:auto;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#5266eb;color:#fff;font:700 22px var(--sans);font-style:normal}

/* ---------- P27 第 0 下：产品 / 设计 / 开发，换成职业人像 ---------- */
.c27 .roles{position:absolute;left:340px;right:340px;top:290px;display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.c27 .roles .r{display:flex;flex-direction:column;align-items:center}
.c27 .roles i{display:block;width:100%;height:400px;border-radius:24px;border:1px solid rgba(237,237,243,.14);background:center 20%/cover;box-shadow:0 30px 60px rgba(0,0,0,.35)}
.c27 .roles .pm i{background-image:url(img/a_role_pm.png)}
.c27 .roles .ds i{background-image:url(img/a_role_design.png)}
.c27 .roles .dv i{background-image:url(img/a_role_dev.png)}
.c27 .roles p{margin-top:26px;font:700 44px var(--serif)}

/* ---------- P30 第 0 下：需求一直在，满足它的人换了 ---------- */
.c30 .dm{position:absolute;z-index:1;left:300px;right:300px;top:190px;height:300px;display:flex;align-items:center;justify-content:center;gap:28px;transform:none;filter:none}
.c30 .dm .who{display:flex;flex-direction:column;align-items:center;gap:14px;width:200px}
.c30 .dm .who svg{width:120px;height:150px}
.c30 .dm .who small{font-size:26px;color:var(--t3);white-space:nowrap}
.c30 .dm .old svg{fill:none;stroke:rgba(237,237,243,.35);stroke-width:3;stroke-dasharray:7 8}
.c30 .dm .new svg{fill:#e9eaf3;filter:drop-shadow(0 0 24px rgba(142,162,255,.6))}
.c30 .dm .new small{color:var(--acc2)}
.c30 .dm u{width:150px;height:3px;position:relative}
.c30 .dm u.out{background:linear-gradient(90deg,transparent,rgba(237,237,243,.35))}
.c30 .dm u.out::before{content:"";position:absolute;left:0;top:-7px;width:14px;height:14px;border-left:3px solid rgba(237,237,243,.35);border-bottom:3px solid rgba(237,237,243,.35);transform:rotate(45deg)}
.c30 .dm u.in{background:linear-gradient(90deg,var(--acc2),transparent)}
.c30 .dm u.in::before{content:"";position:absolute;left:0;top:-7px;width:14px;height:14px;border-left:3px solid var(--acc2);border-bottom:3px solid var(--acc2);transform:rotate(45deg)}
.c30 .dm .need{width:300px;height:200px;border-radius:28px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(160deg,#fff,#dcdeea);color:#171721;box-shadow:0 0 80px rgba(237,237,243,.25)}
.c30 .dm .need b{font:700 76px var(--serif)}
.c30 .dm .need small{margin-top:6px;font-size:26px;color:#4a4a5e}
.c30 .carry{top:620px}

/* ---------- P32 第 3 下：写代码 —— 编辑器 + 测试通过 + 写测改循环 ---------- */
.c32 .ed{position:absolute;left:820px;top:190px;width:640px;border-radius:22px;overflow:hidden;background:#15151f;border:1px solid rgba(237,237,243,.14);box-shadow:0 40px 90px rgba(0,0,0,.45)}
.c32 .ed .bar{display:flex;align-items:center;gap:10px;height:56px;padding:0 22px;background:#1e1e2a;border-bottom:1px solid var(--ln)}
.c32 .ed .bar i{width:13px;height:13px;border-radius:50%;background:#3a3a4c}
.c32 .ed .bar span{margin-left:14px;font-size:22px;color:var(--t2)}
.c32 .ed .bar em{margin-left:auto;font-style:normal;font-size:22px;color:var(--t3);border:1px solid var(--ln);border-radius:99px;padding:2px 12px}
.c32 .ed .code{padding:22px 0;font:400 28px/1.75 "SF Mono",Menlo,monospace;color:#d6d8e6}
.c32 .ed .code p{padding:0 26px;white-space:pre}
.c32 .ed .code u{display:inline-block;width:40px;text-decoration:none;color:#55556a}
.c32 .ed .code .k{font-weight:400;color:#c4a7ff}.c32 .ed .code .f{font-weight:400;color:#8ea2ff}.c32 .ed .code .n{font-weight:400;color:#ffb38a}
.c32 .ed .term{padding:18px 26px 22px;border-top:1px solid var(--ln);background:#101018;font:400 26px/1.7 "SF Mono",Menlo,monospace;color:var(--t3)}
.c32 .ed .term .ok{color:#7fe3b0}
.c32 .loop{position:absolute;left:1500px;top:250px;width:260px;height:260px}
.c32 .loop svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.c32 .loop circle{fill:none;stroke:rgba(142,162,255,.5);stroke-width:3;stroke-dasharray:10 8;transform-origin:100px 100px;animation:a2spin 14s linear infinite}
.c32 .loop .ar{fill:none;stroke:var(--acc2);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
@keyframes a2spin{to{transform:rotate(360deg)}}
.c32 .loop span{position:absolute;display:grid;place-items:center;width:84px;height:84px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#dcdeea 60%,#b9bccd);color:#171721;font:700 36px var(--serif);box-shadow:0 0 30px rgba(237,237,243,.25)}
.c32 .loop .a{left:88px;top:-12px}.c32 .loop .b{right:-18px;top:150px}.c32 .loop .c{left:-18px;top:150px}
.c32 .one{position:absolute;left:820px;right:160px;top:720px;font:700 44px var(--serif);color:var(--t1)}

/* ---------- P34 第 1 下：「事儿」词条 + 差不多 / 还差一点 ---------- */
.c34 .dict2{position:absolute;left:260px;top:200px;width:1400px;height:590px;border-radius:28px;padding:56px 70px 50px;display:grid;grid-template-columns:520px 1fr;grid-template-rows:1fr auto;column-gap:70px;row-gap:40px;
  background:radial-gradient(ellipse 60% 70% at 15% 30%,#eef0fb,transparent 70%),var(--L0);color:var(--Lt1);box-shadow:0 50px 100px rgba(0,0,0,.4)}
.c34 .dict2 .hd small{font-size:24px;letter-spacing:.4em;color:var(--Lt3)}
.c34 .dict2 .hd h1{margin-top:18px;font:700 150px/1.1 var(--serif);margin-left:-.5em}
.c34 .dict2 .hd span{display:block;margin-top:18px;font-size:30px;color:var(--Lt2);letter-spacing:.08em}
.c34 .dict2 .defs{display:flex;flex-direction:column;justify-content:center;border-left:1px solid var(--Lln);padding-left:60px}
.c34 .dict2 .defs div{display:flex;align-items:center;gap:26px;padding:20px 0;border-bottom:1px solid var(--L1)}
.c34 .dict2 .defs div:last-child{border-bottom:0}
.c34 .dict2 .defs i{flex:none;display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--acc);color:#fff;font:500 22px var(--sans);font-style:normal}
.c34 .dict2 .defs b{font:700 50px var(--serif)}
.c34 .dict2 .bar2{grid-column:1 / -1}
.c34 .dict2 .track{position:relative;height:22px;border-radius:11px;background:var(--L1);border:1px solid var(--Lln)}
.c34 .dict2 .track i{position:absolute;left:0;top:0;bottom:0;width:0;border-radius:11px;background:linear-gradient(90deg,#c3c3cc,#8b8b9e);transition:width 1.6s var(--out)}
.c34 .dict2 .track em{position:absolute;left:86%;top:0;bottom:0;width:0;border-radius:0 11px 11px 0;background:var(--acc);transition:width .8s var(--out)}
.c34.st1 .dict2 .track i{width:86%;transition-delay:1s}
.c34.st1 .dict2 .track em{width:14%;transition-delay:2.8s}
.c34 .dict2 .lb{display:flex;justify-content:space-between;margin-top:18px;font-size:32px}
.c34 .dict2 .lb .a{color:var(--Lt2)}
.c34 .dict2 .lb .b{font-family:var(--serif);font-weight:700;color:var(--acc)}
