/* PLAYS — worked-example chains (theme-aware) */
.pb{ display:flex; flex-direction:column; gap:10px; }
.pb-card{ background:var(--card); border:1px solid var(--line); border-radius:13px; overflow:hidden; transition:border-color .15s; }
.pb-card.open{ border-color:color-mix(in srgb,var(--neon) 42%,var(--line)); box-shadow:var(--sh-glow,0 20px 60px -36px rgba(34,224,200,.4)); }
.pb-card.violet.open{ border-color:color-mix(in srgb,var(--violet) 45%,var(--line)); }
.pb-head{ display:flex; align-items:center; gap:11px; width:100%; text-align:left; cursor:pointer; font:inherit; background:none; border:none; color:var(--ink); padding:13px 15px; }
.pb-ic{ font-size:19px; flex:0 0 auto; }
.pb-tag{ flex:0 0 auto; font-size:10.5px; font-weight:800; letter-spacing:.5px; text-transform:uppercase; color:#05050a; background:linear-gradient(120deg,var(--neon),var(--violet)); border-radius:6px; padding:3px 8px; }
.pb-card.violet .pb-tag{ background:linear-gradient(120deg,var(--violet),var(--neon)); }
.pb-signal{ flex:1; font-size:13.5px; font-weight:600; line-height:1.35; }
.pb-chev{ flex:0 0 auto; color:var(--mut); font-size:13px; }
.pb-body{ padding:0 15px 15px; animation:pb-rise .22s ease both; }
.pb-chain{ display:flex; flex-direction:column; gap:11px; border-top:1px solid var(--hair,var(--line)); padding-top:13px; }
.pb-step{ display:flex; flex-direction:column; gap:5px; }
.pb-k{ font-size:10px; font-weight:800; letter-spacing:.6px; text-transform:uppercase; color:var(--mut); }
.pb-step p{ margin:0; font-size:13.5px; line-height:1.5; color:var(--ink); }
.pb-srcs{ display:flex; flex-wrap:wrap; gap:7px; align-items:center; }
.pb-src{ font-size:12px; font-weight:700; background:#0c0c18; border:1px solid color-mix(in srgb,var(--neon) 32%,var(--line)); border-radius:8px; padding:5px 10px; color:var(--ink); }
.pb-plus{ color:var(--neon); font-weight:800; }
.pb-result{ background:color-mix(in srgb,var(--neon) 8%,transparent); border:1px solid color-mix(in srgb,var(--neon) 26%,var(--line)); border-radius:11px; padding:11px 13px; }
.pb-result b{ font-family:var(--font-display,inherit); font-size:16px; color:var(--neon); display:block; }
.pb-result em{ font-style:normal; font-size:11.5px; color:var(--mut); display:block; margin-top:3px; }
@keyframes pb-rise{ from{opacity:0; transform:translateY(4px)} to{opacity:1; transform:none} }