<style>
@keyframes ex-scroll   { 0%{transform:translateY(0);} 100%{transform:translateY(-50%);} }
@keyframes ex-arrow-flow { 0%,100%{opacity:0.25;} 50%{opacity:0.75;} }

@keyframes ex-step-bg {
  0%,6%,47%,100% { background:rgba(255,255,255,0.04); border-color:rgba(255,255,255,0.07); }
  10%,43%        { background:rgba(60,80,220,0.28);   border-color:rgba(60,80,220,0.6); }
}
@keyframes ex-dot-on {
  0%,6%,47%,100% { background:rgba(255,255,255,0.18); box-shadow:none; }
  10%,43%        { background:#3c50dc; box-shadow:0 0 8px rgba(60,80,220,0.9); }
}
@keyframes ex-label-on {
  0%,6%,47%,100% { color:rgba(255,255,255,0.4); }
  10%,43%        { color:rgba(255,255,255,0.95); }
}
@keyframes ex-target-bg {
  0%,3%,22%,100% { background:rgba(255,255,255,0.04); border-color:rgba(255,255,255,0.07); }
  5%,20%         { background:rgba(60,80,220,0.22);   border-color:rgba(60,80,220,0.6); }
}
@keyframes ex-icon-on {
  0%,3%,22%,100% { background:rgba(255,255,255,0.06); color:rgba(255,255,255,0.35); }
  5%,20%         { background:rgba(60,80,220,0.35);   color:rgba(255,255,255,0.9); }
}
@keyframes ex-tlabel-on {
  0%,3%,22%,100% { color:rgba(255,255,255,0.4); }
  5%,20%         { color:rgba(255,255,255,0.92); }
}

#ex-diagram .ex-trigger-row { display:flex; align-items:center; gap:8px; padding:7px 10px; border-bottom:1px solid rgba(255,255,255,0.04); }
#ex-diagram .ex-type-tag { font-size:9px; font-weight:700; padding:2px 5px; border-radius:3px; letter-spacing:0.8px; flex-shrink:0; width:54px; text-align:center; font-family:'Courier New',monospace; }
#ex-diagram .ex-trigger-text { color:rgba(255,255,255,0.5); font-size:11px; font-family:'Courier New',monospace; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; flex:1; }
#ex-diagram .ex-step { display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:7px; margin-bottom:7px; border:1px solid rgba(255,255,255,0.07); }
#ex-diagram .ex-step-dot { width:8px; height:8px; border-radius:50%; flex-shrink:0; }
#ex-diagram .ex-step-label { font-size:12px; font-weight:500; }
#ex-diagram .ex-target { display:flex; align-items:center; gap:10px; padding:9px 12px; border-radius:8px; margin-bottom:7px; border:1px solid rgba(255,255,255,0.07); }
#ex-diagram .ex-target-icon { width:32px; height:32px; border-radius:7px; flex-shrink:0; display:flex; align-items:center; justify-content:center; }
#ex-diagram .ex-target-label { font-size:12px; font-weight:500; }
#ex-diagram .ex-arrow { display:flex; flex-direction:column; justify-content:center; padding:0 6px; padding-top:26px; flex-shrink:0; animation:ex-arrow-flow 2s ease-in-out infinite; }
</style>