/* Network scene: the canvas holds the agents; bubbles and names are real text. */
#handoff{padding-bottom:0;overflow-x:clip}
#handoff .hf-heading{display:grid;gap:20px;justify-items:center;max-width:760px;margin:auto;text-align:center}
#handoff .hf-heading h2{max-width:20ch}
#handoff .hf-heading .lead{max-width:50ch}
#handoff .nt-stage{position:relative;height:clamp(640px,60.8vw,876px);margin-top:0;overflow:hidden}
#handoff .nt-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
#handoff .nt-bubble{position:absolute;left:0;top:0;z-index:2;margin:0;width:max-content;max-width:220px;padding:6px 10px;border-radius:8px;background:var(--frame);color:var(--ink);font-size:13px;line-height:1.4;opacity:0;transition:opacity 240ms var(--ease);pointer-events:none}
#handoff .nt-name{position:absolute;left:0;top:0;z-index:2;margin:0;font-size:13px;font-weight:400;color:var(--muted);opacity:0;transition:opacity 300ms var(--ease);pointer-events:none}
#handoff .nt-bubble.on,#handoff .nt-name.on{opacity:1}
/* designkit-allow stagger-entry: вход секции сайта */
#handoff.nt-armed .nt-w{opacity:0}
/* designkit-allow stagger-entry: вход секции сайта */
#handoff[data-playing=true] .nt-w{animation:nt-w .64s var(--ease) forwards;animation-delay:calc(var(--i)*90ms)}
@keyframes nt-w{from{opacity:0;filter:blur(2px);color:var(--muted)}to{opacity:1;filter:none;color:var(--ink)}}
@media(max-width:768px){#handoff .hf-heading h2{max-width:15ch}#handoff .nt-bubble{max-width:180px}}
@media(prefers-reduced-motion:reduce){#handoff .nt-w{animation:none;opacity:1}#handoff .nt-bubble,#handoff .nt-name{transition:none}}
