/* Branching scenario v2 — cinematic */
.intro{position:relative;min-height:min(86vh,720px);display:flex;align-items:center;overflow:hidden;isolation:isolate}
.ibg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;animation:kb 26s ease-in-out infinite alternate}
.intro:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#0b1026f2 0%,#0b1026d0 40%,#0b102655 75%,#0b102633),linear-gradient(0deg,#0b1026 0%,#0b102600 35%)}
@keyframes kb{to{transform:scale(1.1) translate(1%,-1%)}}
.iin{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:40px;align-items:center;padding-top:48px;padding-bottom:48px;width:100%}
.introtxt h1.t{font-size:clamp(2.2rem,5vw,3.8rem);line-height:1.04;letter-spacing:-.03em}
.how{list-style:none;padding:0;margin:18px 0 26px;display:flex;flex-wrap:wrap;gap:8px}
.how li{padding:8px 14px;border-radius:999px;background:#ffffff10;border:1px solid #ffffff1f;font-size:.9rem;backdrop-filter:blur(6px)}
.cast{position:relative;height:440px}
.who{position:absolute;margin:0;width:62%;border-radius:26px;overflow:hidden;box-shadow:0 40px 80px -30px #000,0 0 0 1px #ffffff22;transition:transform .6s cubic-bezier(.2,.9,.3,1)}
.who img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover}
.who figcaption{position:absolute;left:0;right:0;bottom:0;padding:40px 16px 14px;background:linear-gradient(0deg,#0b1026ee,#0b102600)}
.who b{display:block;font-size:1.05rem}.who small{color:#a5b4fc}
.who.p{left:0;top:0;transform:rotate(-3deg);z-index:2}.who.t{right:0;bottom:0;width:48%;transform:rotate(4deg)}
.cast:hover .who.p{transform:rotate(-1deg) translateY(-6px)}.cast:hover .who.t{transform:rotate(2deg) translateY(-4px)}
/* play */
.play{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:20px;align-items:start;padding-top:20px;padding-bottom:40px}
.stage{position:relative;border-radius:28px;overflow:hidden;background:#0b1026;box-shadow:0 40px 80px -40px #000,0 0 0 1px #ffffff18;transition:box-shadow .5s}
.stage.good{box-shadow:0 40px 80px -40px #000,0 0 0 2px #34d39988,0 0 40px -6px #34d39955}
.stage.bad{box-shadow:0 40px 80px -40px #000,0 0 0 2px #f43f5e88,0 0 40px -6px #f43f5e55}
.stage.mid{box-shadow:0 40px 80px -40px #000,0 0 0 2px #fbbf2488}
.scene{position:relative;aspect-ratio:16/9;overflow:hidden}
.sbg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:blur(3px) brightness(.55) saturate(1.1);transform:scale(1.06)}
.pf{position:absolute;left:0;top:0;bottom:0;aspect-ratio:1;max-width:66%;-webkit-mask-image:linear-gradient(90deg,#000 70%,transparent);mask-image:linear-gradient(90deg,#000 70%,transparent)}
.pf img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.04);transition:opacity .7s ease,transform 6s ease-out}
.pf img.on{opacity:1;transform:scale(1)}
.scene:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0b102600 30%,#0b1026cc 75%),linear-gradient(0deg,#0b1026 0%,#0b102600 30%);pointer-events:none}
.hudrow{position:absolute;top:16px;left:16px;right:16px;display:flex;justify-content:space-between;gap:8px;z-index:3}
.mood{padding:7px 14px;border-radius:999px;font-weight:800;font-size:.85rem;background:#0b1026b3;border:1px solid #ffffff33;backdrop-filter:blur(8px);transition:background .4s,border-color .4s}
.mood.m-frustrated,.mood.m-upset{border-color:#fb7185;color:#fecdd3;background:#4c0519b3}
.mood.m-worried{border-color:#fbbf24;color:#fde68a;background:#451a03b3}
.mood.m-opening{border-color:#a78bfa;color:#ddd6fe;background:#2e1065b3}
.mood.m-hopeful{border-color:#34d399;color:#a7f3d0;background:#022c22b3}
.dlg{position:absolute;right:20px;top:64px;width:min(46%,440px);z-index:3;padding:20px 22px;border-radius:22px;background:linear-gradient(160deg,#141b45e6,#0f1033e6);border:1px solid #ffffff26;box-shadow:0 20px 50px -20px #000;backdrop-filter:blur(10px)}
.dlg .nm{display:flex;align-items:center;gap:10px;margin-bottom:8px;color:#67e8f9;font-size:.85rem;text-transform:uppercase;letter-spacing:.12em}
.dots{display:none;gap:4px}.dlg.speaking .dots{display:inline-flex}
.dots i{width:6px;height:6px;border-radius:50%;background:#67e8f9;animation:dot 1s infinite}.dots i:nth-child(2){animation-delay:.15s}.dots i:nth-child(3){animation-delay:.3s}
@keyframes dot{50%{opacity:.25;transform:translateY(-3px)}}
.line{margin:0;font-size:clamp(1.05rem,1.6vw,1.3rem);line-height:1.5;font-weight:600;color:#fff;min-height:3em;cursor:default}
.line.typing:after{content:"▍";color:#22d3ee;animation:blink .7s steps(2) infinite;margin-left:2px}
@keyframes blink{50%{opacity:0}}
.choices{padding:18px;display:grid;gap:10px;background:linear-gradient(180deg,#0b1026,#0d1230)}
.choices:empty{display:none}
.choices .note{margin:0 0 2px}
.choice{display:flex;gap:14px;align-items:flex-start;text-align:left;padding:15px 16px;border-radius:18px;border:1px solid #ffffff22;background:linear-gradient(160deg,#ffffff10,#ffffff04);color:#fff;font:inherit;font-size:1rem;line-height:1.45;cursor:pointer;transition:transform .2s,border-color .2s,background .2s;opacity:0;animation:rise .4s var(--d) both}
.choice:hover{transform:translateX(4px);border-color:#22d3ee;background:linear-gradient(160deg,#22d3ee1f,#7c3aed1a)}
.choice .k{flex:none;width:30px;height:30px;border-radius:10px;display:grid;place-items:center;background:var(--grad);font-weight:800;font-size:.85rem}
@keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.fbcard{padding:18px;border-radius:20px;border:1px solid #ffffff22;background:#ffffff08;animation:rise .4s both}
.fbcard .you{display:flex;gap:12px;align-items:center;margin-bottom:12px}
.fbcard .you img{width:48px;height:48px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 2px #22d3ee}
.fbcard q{font-style:italic;color:#c7d2fe;line-height:1.45}
.fbcard .tag{display:inline-block;padding:5px 12px;border-radius:999px;font-weight:800;font-size:.8rem}
.fbcard.good{border-color:#34d39966;background:linear-gradient(160deg,#064e3b55,#ffffff05)}.fbcard.good .tag{background:#34d399;color:#022c22}
.fbcard.mid{border-color:#fbbf2466;background:linear-gradient(160deg,#78350f55,#ffffff05)}.fbcard.mid .tag{background:#fbbf24;color:#451a03}
.fbcard.bad{border-color:#f43f5e66;background:linear-gradient(160deg,#88133755,#ffffff05)}.fbcard.bad .tag{background:#fb7185;color:#4c0519}
.fbcard p{line-height:1.55;margin:10px 0}
.deltas{display:flex;gap:8px;margin-bottom:14px}.d{padding:4px 10px;border-radius:8px;font-weight:800;font-size:.85rem}.d.up{background:#34d39922;color:#6ee7b7}.d.dn{background:#f43f5e22;color:#fda4af}
/* side */
.side{display:grid;gap:14px;position:sticky;top:80px}
.meters{padding:18px;border-radius:22px;display:grid;gap:14px}
.pulse{position:relative;display:flex;justify-content:space-between;align-items:center;padding:10px 12px;border-radius:14px;background:#ffffff08;overflow:hidden;--h:50}
.pulse span{font-size:.78rem;color:#a5b4fc;text-transform:uppercase;letter-spacing:.1em}.pulse b{position:relative;z-index:1}
.pulse i{position:absolute;inset:0;background:linear-gradient(90deg,#f43f5e,#fbbf24 45%,#34d399);opacity:.18;clip-path:inset(0 calc(100% - var(--h)*1%) 0 0);transition:clip-path .8s}
.ml{display:flex;justify-content:space-between;margin-bottom:6px;font-weight:700}.ml b{font-variant-numeric:tabular-nums}
.meter.up .ml b{animation:bump .6s;color:#6ee7b7}.meter.dn .ml b{animation:bump .6s;color:#fda4af}
@keyframes bump{40%{transform:scale(1.35)}}
.mbar{height:10px;border-radius:9px;background:#ffffff14;overflow:hidden}.mbar i{display:block;height:100%;background:linear-gradient(90deg,#22d3ee,#7c3aed);border-radius:9px;transition:width .8s cubic-bezier(.2,.9,.3,1.2)}.mbar.c i{background:linear-gradient(90deg,#7c3aed,#ec4899)}
.coach{padding:16px 18px;border-radius:22px}.coach p{margin:.4em 0 0;line-height:1.5}.coach.in{animation:rise .45s both}
.tx{padding:16px;border-radius:22px}
.log{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:8px;max-height:260px;overflow:auto;scroll-behavior:smooth}
.msg{display:flex;gap:8px;align-items:flex-end;font-size:.84rem;line-height:1.4;animation:rise .3s both}
.msg img{width:28px;height:28px;border-radius:50%;object-fit:cover;flex:none}
.msg .bub{padding:8px 11px;border-radius:14px;background:#ffffff0f}
.msg.me{justify-content:flex-end}.msg.me .bub{background:linear-gradient(135deg,#0e749088,#5b21b688)}
.msg.sys .bub{background:none;color:#94a3b8;font-style:italic;padding:0}
/* debrief */
.deb{display:grid;gap:20px;padding:24px 0 40px}
.ohero{position:relative;overflow:hidden;border-radius:28px;padding:0;isolation:isolate}
.obg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;filter:brightness(.45)}
.ohero:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#0b102655,#0b1026ee 55%)}
.oin{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:30px;align-items:center;padding:30px}
.oface{width:100%;height:auto;border-radius:24px;box-shadow:0 30px 60px -20px #000,0 0 0 1px #ffffff33;animation:rise .6s both}
.ohero h2{font-size:clamp(1.8rem,4vw,2.8rem);margin:.15em 0 .3em}
.ring{--p:50;width:110px;height:110px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#22d3ee,#7c3aed calc(var(--p)*.5%),#ec4899 calc(var(--p)*1%),#ffffff14 0);margin:8px 0;position:relative}
.ring:before{content:"";position:absolute;inset:9px;border-radius:50%;background:#0f1435}.ring b{position:relative;font-size:1.9rem}
.tc{color:#a5b4fc;font-weight:700}
.row{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.path{padding:24px;border-radius:24px}
.path ol{list-style:none;padding:0;margin:12px 0 0;display:grid;gap:10px}
.path li{display:flex;gap:12px;align-items:flex-start;padding:12px;border-radius:16px;background:#ffffff08;border-left:4px solid #94a3b8;line-height:1.45}
.path li img{width:44px;height:44px;border-radius:12px;object-fit:cover;flex:none}
.path li.good{border-color:#34d399}.path li.mid{border-color:#fbbf24}.path li.bad{border-color:#fb7185}
.path small{display:block;color:#a5b4fc;margin-top:4px}
.skills{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}.skills span{padding:7px 12px;border-radius:999px;border:1px solid #ffffff22;color:#94a3b8;font-size:.88rem}.skills .on{background:linear-gradient(90deg,#22d3ee33,#7c3aed33);border-color:#22d3ee;color:#fff}
.eyebrow{display:block}
@media(max-width:1080px){.play{grid-template-columns:1fr}.side{position:static;grid-template-columns:1fr 1fr}.tx{grid-column:1/-1}.side>.btn{grid-column:1/-1;justify-self:start}}
@media(max-width:820px){.iin{grid-template-columns:1fr}.cast{height:300px;max-width:420px}
 .scene{aspect-ratio:auto;height:auto}.pf{position:relative;max-width:none;width:100%;aspect-ratio:4/3.4;-webkit-mask-image:linear-gradient(0deg,transparent,#000 30%);mask-image:linear-gradient(0deg,transparent,#000 30%)}.pf img{object-position:50% 20%}.sbg{display:none}
 .scene:after{background:linear-gradient(0deg,#0b1026 0%,#0b102600 40%)}
 .dlg{position:relative;right:auto;top:auto;width:auto;margin:-70px 12px 0;padding:16px}
 .oin{grid-template-columns:1fr;padding:20px}.oface{max-width:220px}}
@media(max-width:620px){.intro{min-height:0}.iin{padding-top:28px;gap:24px}.cast{height:250px}.side{grid-template-columns:1fr}.choices{padding:12px}.choice{padding:13px;font-size:.95rem}.hudrow{top:10px;left:10px;right:10px}}
@media(prefers-reduced-motion:reduce){.ibg,.dots i{animation:none}.pf img{transition:opacity .2s}.choice,.fbcard,.msg,.coach.in{animation:none;opacity:1}}