.rowglyph{color:#9ca3af;opacity:0;transition:opacity .2s}
.agent:hover .rowglyph,.agent.active .rowglyph{opacity:1}
.agent.active .rowglyph{color:var(--ink)}
@keyframes pulse{0%{opacity:1}50%{opacity:.35}100%{opacity:1}}
.glyph{color:var(--ink);flex:none}
@keyframes b{0%,80%,100%{transform:translateY(0)}40%{transform:translateY(-4px)}}
/* ---- Tab faces ---- */
  .face{position:relative;display:inline-block;flex:none;line-height:0}
.face svg{display:block;width:100%;height:100%;overflow:visible}
.face .eyes{transform-origin:50% 50%;animation:blink 5.5s infinite}
.face.busy .eyes{animation:scan 1.1s ease-in-out infinite}
.face.pending .eyes{animation:none;transform:scale(1.15)}
.face .ring{transition:transform .6s}
.agent:hover .face .ring{transform:rotate(30deg)}
.face.pending .ring{animation:pulsering 1.4s ease-in-out infinite}
@keyframes spinring{to{transform:rotate(360deg)}}
@keyframes pulsering{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
.face .badge{position:absolute;right:-4px;bottom:-4px;width:36%;height:36%;border-radius:50%;background:var(--yellow);border:2px solid #fff;display:grid;place-items:center;font-size:9px;font-weight:800;color:#111}
.face .badge.busy{background:#fff;border-color:var(--line)}
.face .badge.busy i{width:55%;height:55%;border-radius:50%;border:2px solid var(--blue);border-right-color:transparent;animation:spin .9s linear infinite}
@keyframes blink{0%,92%,100%{transform:scaleY(1)}95%{transform:scaleY(.1)}}
@keyframes scan{0%,100%{transform:translateX(-6%)}50%{transform:translateX(6%)}}
@keyframes spin{to{transform:rotate(360deg)}}
/* ---- logo bloom: dot -> cluster -> ring ---- */
  .face .ring{transform-origin:50% 50%}
.face .core{transform-origin:50% 50%}
.face.boot .ring{animation:bloom 1.1s cubic-bezier(.2,.9,.25,1) both;animation-delay:inherit}
.face.boot .core{animation:coregrow 1.1s cubic-bezier(.2,.9,.25,1) both;animation-delay:inherit}
.face.boot .eyes{animation:eyesin 1.1s both;animation-delay:inherit}
.face.busy .ring{animation:breathe 1.6s ease-in-out infinite alternate !important}
.face.busy .eyeI{animation:spinI 1.2s ease-in-out infinite;transform-origin:42.5px 49.5px}
.face.busy .eyeO{animation:spinO 1.2s ease-in-out infinite;transform-origin:58px 49.5px}
@keyframes spinI{0%,100%{transform:scaleX(1)}50%{transform:scaleX(1.85)}}
@keyframes spinO{0%,100%{transform:scaleX(1)}50%{transform:scaleX(.55)}}
@keyframes bloom{0%{transform:scale(.06) rotate(-90deg);opacity:0}25%{opacity:1}55%{transform:scale(.42) rotate(-30deg)}100%{transform:scale(1) rotate(0)}}
@keyframes coregrow{0%{transform:scale(.25)}50%{transform:scale(.25)}100%{transform:scale(1)}}
@keyframes eyesin{0%,60%{opacity:0;transform:scale(.6)}100%{opacity:1;transform:scale(1)}}
@keyframes breathe{0%{transform:scale(.42) rotate(-30deg)}100%{transform:scale(1) rotate(0)}}