/* B256: the live moments (see /js/play-b256.js). Nothing here hides anything until the script says it is playing. */
.pl .sx-m{opacity:0;transform:translateY(10px);transition:opacity .45s,transform .45s cubic-bezier(.2,.7,.2,1)}
.pl .sx-m.on{opacity:1;transform:none}
.pl .sx-did li{opacity:0;transform:translateX(-6px);transition:opacity .35s,transform .35s}
.pl .sx-did li.on{opacity:1;transform:none}
.pl .pl-hide{opacity:0;transition:opacity .35s}
.pl .pl-hide.on{opacity:1}
.sx-chat .pri{transition:transform .18s,box-shadow .18s}
.sx-chat .pri.press{transform:scale(.93);box-shadow:0 0 0 5px rgba(21,89,245,.25)}
.pl-typing{display:none;align-items:center;gap:4px;margin:6px 0 6px 46px;width:fit-content;padding:10px 12px;border-radius:14px;background:#eef2fa}
.pl-typing.on{display:flex}
.pl-typing i{width:6px;height:6px;border-radius:50%;background:#8a96b2;animation:pl-dot 1s infinite ease-in-out}
.pl-typing i:nth-child(2){animation-delay:.15s}.pl-typing i:nth-child(3){animation-delay:.3s}
@keyframes pl-dot{0%,80%,100%{opacity:.3;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
.pl-replay{display:block;margin:12px 0 0 auto;border:0;background:none;color:var(--sx-blue,#1559f5);font:500 14px/1 Rubik,system-ui,sans-serif;padding:8px 4px;cursor:pointer}
.pl-replay:hover{text-decoration:underline;text-underline-offset:3px}
.pl-replay:focus-visible{outline:2px solid #1559f5;outline-offset:2px;border-radius:6px}
[data-build].pl>*{opacity:.25;transition:opacity .5s}
[data-build].pl>*.on{opacity:1}
.pf-app.pl-cur{box-shadow:0 0 0 2px var(--sx-blue),0 24px 48px -28px rgba(21,89,245,.45)}
@media (prefers-reduced-motion:reduce){.pl-replay{display:none}}
.ok-work>.pl-replay{grid-column:2;justify-self:end}@media (max-width:900px){.ok-work>.pl-replay{grid-column:auto}}