/* Scene 11 · the AI agent runway (LỆNH 32). The canvas (.st-gl, pb-runway.js) and the shared pieces (.a10, .a10-still, .a10-scr, .a10-g,
   .a10-kp, .a10-pre, .a10-warm) are styled in pitch-stairs10.css; here the runway's own words: the hero line, the corner tag, the tiles'
   labels and status marks, the evidence word, the Zalo ticket, the draft, the confirm and its hand, the beats' big lines, the legend,
   the closing lines (≥ 72 px). Colours: blue = the AI, white = the model, amber = what people keep. */
#s-final .r11>*{position:absolute;margin:0;left:0;top:0}
#s-final .r11 *{box-sizing:border-box}
#s-final .r11 p,#s-final>.r11-line,#s-final .a10>.r11-big{margin:0}
#s-final :is(.r11-hero,.r11-tag,.r11-lab,.r11-evid,.r11-tk,.r11-bub,.r11-btn,.r11-hand,.r11-big,.r11-leg,.r11-line){opacity:0;will-change:opacity,transform}
#s-final .r11 .ic,#s-final .a10 .r11-big .ic{flex:none;width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
/* beat 1 · the trend */
#s-final .r11-hero{width:1200px;text-align:center;transform-origin:100% 0}
#s-final .r11-hero .ey{font-size:30px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#B5D3FF}
#s-final .r11-hero .an{margin-top:6px;font-size:132px;font-weight:800;line-height:1.02;letter-spacing:-.035em;color:#fff;text-shadow:0 0 60px rgba(80,140,255,.35)}
#s-final .r11-hero .sb{margin-top:14px;font-size:40px;font-weight:500;color:#DCE4F0;text-shadow:0 2px 16px rgba(4,8,20,.9)}
#s-final .r11-tag{white-space:nowrap;font-size:26px;font-weight:500;line-height:1.3;color:#B8C6DC}
#s-final .r11-tag b{color:#9FC2FF;font-weight:700}
/* the tiles' labels and their status marks (● đang có · ◐ một phần · ○ chưa kích hoạt) */
#s-final .r11-lab{display:flex;align-items:center;gap:10px;padding:4px 12px 5px;border-radius:8px;white-space:nowrap;font-size:28px;font-weight:700;line-height:1.2;color:#fff;background:rgba(4,8,20,.62);text-shadow:0 2px 12px rgba(4,8,20,.9)}
#s-final .r11-lab i{font:600 24px/1 "JetBrains Mono",ui-monospace,monospace;font-style:normal;color:#8FC0FF}
#s-final .r11-lab.vis{font-weight:600;color:#C9D5E8}
#s-final .r11-lab.vis b{color:#9FC2FF}
#s-final .r11-lab.hum{color:#FFC261}
#s-final .mk{display:inline-block;flex:none;width:16px;height:16px;border-radius:50%;box-sizing:border-box;vertical-align:-1px}
#s-final .mk.on{background:#5B95FF;box-shadow:0 0 12px rgba(91,149,255,.85)}
#s-final .mk.part{background:linear-gradient(90deg,#5B95FF 50%,transparent 50%);box-shadow:inset 0 0 0 2px #5B95FF}
#s-final .mk.off{box-shadow:inset 0 0 0 2px #E7C48A}
#s-final .r11-evid{white-space:nowrap;font-size:26px;font-weight:700;color:#BFD9FF;text-shadow:0 0 14px rgba(80,140,255,.8),0 2px 10px rgba(4,8,20,.9)}
/* 01's example: the customer's message (white, no logo) */
#s-final .r11-tk{width:440px;padding:14px 20px 16px;border-radius:10px;background:#F4F7FC;color:#0B1630;overflow:hidden;box-shadow:0 18px 40px rgba(0,0,0,.5)}
#s-final .r11-tk .hd{display:flex;align-items:center;gap:8px;font-size:24px;font-weight:600;color:#4A5C7C}
#s-final .r11-tk .hd .ic{width:22px;height:22px;color:#2456D6}
#s-final .r11-tk .hd .zl{display:block;flex:none;width:32px;height:32px}   /* the real Zalo tile (LỆNH 46) */
#s-final .r11-tk .mt{margin-top:6px;font-size:24px;font-weight:500;line-height:1.32}
#s-final .r11-tk .fs{display:grid;gap:6px;margin-top:12px;padding-top:12px;border-top:1px solid #D3DCEA}
#s-final .r11-tk .f{display:flex;align-items:center;gap:8px;width:max-content;padding:2px 10px 3px;border-radius:5px;font-size:24px;font-weight:600;line-height:1.3;opacity:0}
#s-final .r11-tk .f .ic{width:22px;height:22px;stroke-width:2.4}
#s-final .r11-tk .f.ok{color:#1747B8;background:#E3ECFD}
#s-final .r11-tk .f.am{color:#8A4E00;background:#FFEFD6;box-shadow:inset 0 0 0 1.5px #F0A63A}
#s-final .r11-tk .f.am .ic{color:#D88A1C}
#s-final .r11-tk .f.am.pulse{box-shadow:inset 0 0 0 1.5px #F0A63A,0 0 0 4px rgba(240,166,58,.3)}
#s-final .r11-tk .sc{position:absolute;left:0;right:0;top:0;height:40px;opacity:0;pointer-events:none;background:linear-gradient(180deg,rgba(80,140,255,0),rgba(80,140,255,.35) 60%,rgba(80,140,255,0));border-bottom:2px solid rgba(60,120,255,.85);will-change:transform,opacity}
/* 02: the AI's draft (blue), the person's confirm (white when pressed), the hand */
#s-final .r11-bub{padding:12px 20px 14px;border-radius:16px 16px 16px 4px;white-space:nowrap;font-size:30px;font-weight:600;line-height:1.25;color:#CFE0FF;background:rgba(8,16,40,.9);border:2px dashed #6AA5FF;transform-origin:0 100%;transition:background .25s,color .25s,border-color .25s}   /* a draft until the person confirms */
#s-final .r11-bub.sent{color:#fff;background:#2456D6;border:2px solid #6AA5FF;box-shadow:0 12px 30px rgba(20,60,180,.5)}
#s-final .r11-btn{display:flex;align-items:center;gap:10px;padding:10px 20px 11px;border-radius:10px;white-space:nowrap;font-size:30px;font-weight:700;line-height:1.2;color:#DCE4F2;background:rgba(9,16,34,.92);border:1.5px solid rgba(220,228,242,.6)}
#s-final .r11-btn .ic{width:24px;height:24px;opacity:.4}
#s-final .r11-btn.on{color:#0B1630;background:#F4F7FC;border-color:#fff;box-shadow:0 0 22px rgba(255,255,255,.5)}
#s-final .r11-btn.on .ic{opacity:1;color:#1747B8}
#s-final .r11-hand{width:62px;height:62px;color:#0B1630}
#s-final .r11-hand .ic{width:62px;height:62px;stroke-width:1.5;fill:#F1F3F7}
/* the beats' big lines, the legend, the closing words */
#s-final .r11-bscr{position:absolute;left:0;top:640px;width:1920px;height:440px;opacity:0;pointer-events:none;will-change:opacity;
  background:linear-gradient(0deg,rgba(3,6,14,.94) 0,rgba(3,6,14,.82) 42%,rgba(3,6,14,0) 100%)}
#s-final .r11-big{white-space:nowrap;font-size:60px;font-weight:800;line-height:1.1;letter-spacing:-.02em;color:#fff;text-shadow:0 4px 24px rgba(4,8,20,.85)}
#s-final .r11-big.b3{font-size:50px;color:#F1E3C8}
#s-final .r11-big b{color:#FFC261;font-weight:800}
#s-final .a10>.r11-big{position:absolute;left:0;top:0;z-index:3}
#s-final .r11-leg{display:flex;align-items:center;gap:10px;white-space:nowrap;font-size:24px;font-weight:500;line-height:1.2;color:#B8C6DC}
#s-final .r11-leg i{font-style:normal;color:#5F6F8C;margin:0 4px}
#s-final>.r11-line{position:absolute;left:0;top:0;z-index:6;pointer-events:none;font-size:84px;font-weight:800;line-height:1.06;letter-spacing:-.03em;color:#fff;white-space:nowrap}
#s-final.a10-warm>.r11-line{visibility:hidden}
#s-final .a10-kp.r11kp{left:auto;right:80px;top:540px}   /* the runway's empty lower right */
