.af-panel{--af-line:#11111114;--af-muted:#8a8a8a;--af-ease:cubic-bezier(.22, 1, .36, 1);width:100%;max-width:40rem;box-shadow:0 0 0 1px var(--af-line), 0 1px 2px #1111110a, 0 24px 48px -24px #1111112e;background:#fff;border-radius:14px;margin:0 0 0 auto;padding:1.75rem 1.5rem}.af-stage{aspect-ratio:640/420;position:relative;container-type:inline-size}.af-stage>*{font-size:2.5cqw}.af-wires{width:100%;height:100%;position:absolute;inset:0;overflow:visible}.af-track{fill:none;stroke:#1111111a;stroke-width:1px;transition:stroke .4s}.af-flow{fill:none;stroke:var(--spot);stroke-width:2px;stroke-linecap:round;stroke-dasharray:.1 4.9;opacity:0;transition:opacity .4s;animation:1.1s linear infinite af-flow}.af-wire[data-active=true] .af-track{stroke:#8b1a2440}.af-wire[data-active=true] .af-flow{opacity:1}.af-sources{width:26.25%;position:absolute;inset:0 auto 0 0}.af-source{height:2.6em;color:var(--ink-soft);background:#fff;border-radius:999px;align-items:center;gap:.55em;padding:0 .8em;font-size:.8125em;transition:color .3s,box-shadow .3s;display:flex;position:absolute;left:0;right:0;transform:translateY(-50%);box-shadow:inset 0 0 0 1px #1111111a}.af-logo{color:#b4b4b4;flex:none;width:1.15em;height:1.15em;transition:color .3s}.af-source[data-active=true]{color:var(--ink);box-shadow:inset 0 0 0 1px #1111112e,0 2px 8px -2px #1111111f}.af-source[data-active=true] .af-logo{color:var(--brand)}.af-agent{justify-items:center;display:grid;position:absolute;top:50%;transform:translate(-50%,-50%)}.af-core{letter-spacing:.02em;width:4.25em;height:4.25em;color:var(--paper);background:var(--ink);border-radius:50%;place-items:center;font-size:1em;font-weight:600;display:grid;position:relative;box-shadow:0 0 0 .45em #1111110a}.af-ring{border:1.5px solid #0000;border-top-color:var(--spot);border-radius:50%;transition:opacity .3s;animation:1.2s linear infinite af-spin;position:absolute;inset:-.5em}.af-panel[data-phase=hold] .af-ring{opacity:0}.af-status{color:var(--af-muted);white-space:nowrap;font-size:.75em;animation:.4s both af-fade;position:absolute;top:calc(100% + 1.1em)}.af-card{animation:af-card-in .5s var(--af-ease) both;background:#fff;border-radius:10px;padding:.95em 1em .9em;position:absolute;top:50%;right:0;transform:translateY(-50%);box-shadow:0 0 0 1px #1111111a,0 10px 24px -14px #11111140}.af-card-head{justify-content:space-between;align-items:baseline;gap:.5em;margin-bottom:.7em;display:flex}.af-card-title{color:var(--ink);font-size:.8125em;font-weight:600}.af-card-time{color:var(--af-muted);white-space:nowrap;font-size:.6875em}.af-lines{gap:.55em;display:grid}.af-lines li{color:var(--ink);align-items:flex-start;gap:.45em;font-size:.75em;line-height:1.35;transition:color .3s;display:flex}.af-tick{width:1.05em;height:1.05em;color:var(--spot);transition:opacity .3s, transform .3s var(--af-ease);flex:none;margin-top:.08em}.af-lines li[data-shown=false]{color:#0000;background:linear-gradient(#ececec,#ececec) 1.5em/70% .7em no-repeat}.af-lines li[data-shown=false] .af-tick{opacity:0;transform:scale(.5)}.af-sent{color:var(--af-muted);border-top:1px solid var(--af-line);margin-top:.85em;padding-top:.7em;font-size:.6875em;transition:opacity .4s}.af-sent[data-shown=false]{opacity:0}@keyframes af-flow{to{stroke-dashoffset:-10px}}@keyframes af-spin{to{transform:rotate(360deg)}}@keyframes af-fade{0%{opacity:0}}@keyframes af-card-in{0%{opacity:0;transform:translateY(calc(8px - 50%))}}@media (max-width:640px){.af-panel{padding:1.25rem 1rem}}@media (prefers-reduced-motion:reduce){.af-panel *,.af-panel :before{transition:none!important;animation:none!important}}
