/* viz.css - per-scenario problem animations (generated). See docs/superpowers/specs/2026-06-19-scenario-animations-design.md
   Each scene root is <div class="viz viz-<id>">; ALL of a scene's selectors are scoped under .viz-<id>. */
.viz{position:relative;width:100%;min-width:0;min-height:124px;overflow:hidden;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);}
.viz-cap{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.04em;color:var(--muted);margin-top:7px;}

/* ----- stripe-insights ----- */
.viz-stripe-insights{display:flex;align-items:center;justify-content:center;width:100%;min-width:0;height:120px;font-family:var(--font-mono);}
.viz-stripe-insights .panel{box-sizing:border-box;width:100%;min-width:0;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:12px 16px;display:flex;flex-direction:column;gap:10px;}
.viz-stripe-insights .head{display:flex;align-items:center;gap:8px;}
.viz-stripe-insights .dot{width:7px;height:7px;border-radius:50%;background:var(--good);animation:vk_stripe_insights_pulse 1s ease-in-out infinite;}
.viz-stripe-insights .lbl{font-size:10px;letter-spacing:.04em;color:var(--muted);}
.viz-stripe-insights .track{position:relative;height:14px;display:flex;align-items:center;}
.viz-stripe-insights .rail{position:absolute;left:0;right:0;height:3px;border-radius:3px;background:var(--soft);border:1px solid var(--line);box-sizing:border-box;}
.viz-stripe-insights .n{position:absolute;width:6px;height:6px;border-radius:50%;background:var(--card);border:1px solid var(--line);box-sizing:border-box;}
.viz-stripe-insights .n1{left:8%;}
.viz-stripe-insights .n2{left:50%;}
.viz-stripe-insights .n3{left:92%;}
.viz-stripe-insights .packet{position:absolute;left:8%;width:9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px var(--accent-soft);animation:vk_stripe_insights_flow 1s linear infinite;}
.viz-stripe-insights .rows{display:flex;flex-direction:column;gap:6px;}
.viz-stripe-insights .row{height:6px;border-radius:3px;background:var(--soft);}
.viz-stripe-insights .r1{width:72%;}
.viz-stripe-insights .r2{width:54%;}
.viz-stripe-insights .r3{width:63%;}
.viz-stripe-insights .row{animation:vk_stripe_insights_refresh 1s ease-in-out infinite;}
.viz-stripe-insights .r2{animation-delay:.08s;}
.viz-stripe-insights .r3{animation-delay:.16s;}
@keyframes vk_stripe_insights_flow{0%{left:8%;}80%{left:92%;}100%{left:92%;}}
@keyframes vk_stripe_insights_pulse{0%,100%{opacity:.4;}50%{opacity:1;}}
@keyframes vk_stripe_insights_refresh{0%,70%{background:var(--soft);}82%{background:var(--accent-soft);}100%{background:var(--soft);}}
@media (prefers-reduced-motion:reduce){.viz-stripe-insights .packet,.viz-stripe-insights .dot,.viz-stripe-insights .row{animation:none;}.viz-stripe-insights .packet{left:50%;}}

/* ----- uber-surge ----- */
.viz-uber-surge{display:flex;align-items:center;justify-content:center;width:100%;min-width:0;height:120px;font-family:var(--font-mono)}
.viz-uber-surge .vk-stage{display:flex;align-items:center;gap:7%;width:100%;min-width:0;padding:0 6%;box-sizing:border-box}
.viz-uber-surge .vk-grid{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:6px;flex:0 0 auto;width:148px}
.viz-uber-surge .vk-hex{position:relative;width:30px;height:34px;background:var(--soft);border:1px solid var(--line);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)}
.viz-uber-surge .vk-hex.h1{animation:vk_uber_surge_shimmer 4s ease-in-out infinite}
.viz-uber-surge .vk-hex.h3{animation:vk_uber_surge_shimmer 4s ease-in-out -1.3s infinite}
.viz-uber-surge .vk-hex.h5{animation:vk_uber_surge_shimmer 4s ease-in-out -2.6s infinite}
.viz-uber-surge .vk-hex.h7{animation:vk_uber_surge_shimmer 4s ease-in-out -0.6s infinite}
.viz-uber-surge .vk-hex.sel{background:var(--accent-soft);border-color:var(--accent)}
.viz-uber-surge .vk-badge{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:9px;font-weight:600;color:var(--accent)}
.viz-uber-surge .vk-m{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);opacity:0;white-space:nowrap}
.viz-uber-surge .vk-m.m1{animation:vk_uber_surge_swap 6s steps(1) infinite}
.viz-uber-surge .vk-m.m2{animation:vk_uber_surge_swap 6s steps(1) -2s infinite}
.viz-uber-surge .vk-m.m3{animation:vk_uber_surge_swap 6s steps(1) -4s infinite}
.viz-uber-surge .vk-window{display:flex;flex-direction:column;gap:5px;flex:1 1 auto;min-width:0;max-width:240px}
.viz-uber-surge .vk-label{font-size:9px;color:var(--muted);letter-spacing:.06em}
.viz-uber-surge .vk-track{position:relative;height:6px;width:100%;background:var(--soft);border:1px solid var(--line);border-radius:6px;overflow:hidden}
.viz-uber-surge .vk-fill{position:absolute;inset:0;width:0;background:var(--accent);border-radius:6px;animation:vk_uber_surge_window 6s linear infinite}
.viz-uber-surge .vk-tick{align-self:flex-end;font-size:9px;color:var(--accent);opacity:0;animation:vk_uber_surge_pulse 6s ease-out infinite}
@keyframes vk_uber_surge_shimmer{0%,100%{background:var(--soft)}50%{background:var(--card)}}
@keyframes vk_uber_surge_window{0%{width:0}92%{width:100%}92.01%,100%{width:0}}
@keyframes vk_uber_surge_pulse{0%,86%{opacity:0}90%{opacity:1}100%{opacity:0}}
@keyframes vk_uber_surge_swap{0%,30%{opacity:1}30.01%,100%{opacity:0}}

/* ----- netflix-continue ----- */
.viz-netflix-continue{width:100%;min-width:0}
.viz-netflix-continue .stage{display:flex;flex-direction:column;gap:12px;width:100%;min-width:0;padding:14px 16px;box-sizing:border-box;font-family:var(--font-mono)}
.viz-netflix-continue .devices{display:flex;gap:14px;align-items:flex-end;height:26px}
.viz-netflix-continue .dev{display:block;border:1.5px solid var(--line);background:var(--soft);box-sizing:border-box}
.viz-netflix-continue .phone{width:14px;height:22px;border-radius:4px}
.viz-netflix-continue .tv{width:34px;height:21px;border-radius:3px}
.viz-netflix-continue .track{position:relative;width:100%;height:8px;border-radius:6px;background:var(--soft);border:1px solid var(--line);box-sizing:border-box}
.viz-netflix-continue .tick{position:absolute;top:-3px;width:1px;height:12px;background:var(--line);transform:translateX(-0.5px)}
.viz-netflix-continue .fill{position:absolute;top:0;left:0;height:100%;border-radius:6px;background:var(--accent-soft);width:18%;animation:vk_netflix_continue_fill 5s linear infinite}
.viz-netflix-continue .head{position:absolute;top:50%;left:18%;width:11px;height:11px;border-radius:50%;background:var(--accent);transform:translate(-50%,-50%);animation:vk_netflix_continue_head 5s linear infinite}
.viz-netflix-continue .cp{position:absolute;top:50%;left:18%;width:7px;height:7px;border-radius:2px;background:var(--card);border:2px solid var(--accent);transform:translate(-50%,-50%) rotate(45deg);animation:vk_netflix_continue_cp 5s steps(1) infinite}
.viz-netflix-continue .meta{display:flex;justify-content:space-between;gap:12px}
.viz-netflix-continue .lbl{font-size:10px;color:var(--muted);letter-spacing:.02em;white-space:nowrap}
@keyframes vk_netflix_continue_fill{0%{width:18%}92%{width:90%}100%{width:90%}}
@keyframes vk_netflix_continue_head{0%{left:18%}92%{left:90%}100%{left:90%}}
@keyframes vk_netflix_continue_cp{0%,24%{left:18%;opacity:.35}25%,49%{left:36%;opacity:.9}50%,74%{left:54%;opacity:.9}75%,99%{left:72%;opacity:.9}100%{left:18%;opacity:.35}}
@media (prefers-reduced-motion:reduce){.viz-netflix-continue .fill,.viz-netflix-continue .head,.viz-netflix-continue .cp{animation:none}.viz-netflix-continue .fill{width:54%}.viz-netflix-continue .head{left:54%}.viz-netflix-continue .cp{left:36%;opacity:.9}}

/* ----- slack-scale ----- */
.viz-slack-scale{width:100%;min-width:0;}
.viz-slack-scale .stage{position:relative;width:100%;height:120px;overflow:hidden;}

.viz-slack-scale .hub{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:30px;height:30px;display:flex;align-items:center;justify-content:center;}
.viz-slack-scale .core{position:absolute;left:50%;top:50%;width:18px;height:18px;border-radius:50%;background:var(--accent);transform:translate(-50%,-50%);animation:vk_slack_scale_pulse 3.2s ease-in-out infinite;}
.viz-slack-scale .ring{position:absolute;left:50%;top:50%;width:18px;height:18px;border-radius:50%;border:1.5px solid var(--accent);transform:translate(-50%,-50%);animation:vk_slack_scale_ring 3.2s ease-out infinite;}
.viz-slack-scale .tag{position:absolute;top:24px;left:50%;transform:translateX(-50%);font-family:var(--font-mono);font-size:9px;color:var(--muted);white-space:nowrap;}

.viz-slack-scale .node{position:absolute;width:8px;height:8px;border-radius:50%;background:var(--card);border:1.5px solid var(--line);}
.viz-slack-scale .n1{left:8%;top:24%;}
.viz-slack-scale .n2{left:6%;top:62%;}
.viz-slack-scale .n3{left:26%;top:88%;}
.viz-slack-scale .n4{right:8%;top:22%;}
.viz-slack-scale .n5{right:6%;top:60%;}
.viz-slack-scale .n6{right:27%;top:90%;}

.viz-slack-scale .link{position:absolute;left:50%;top:50%;height:1.5px;background:var(--line);transform-origin:left center;}
.viz-slack-scale .link::after{content:"";position:absolute;top:50%;left:0;width:5px;height:5px;border-radius:50%;background:var(--accent);transform:translateY(-50%);opacity:0;animation:vk_slack_scale_flow 3.2s linear infinite;}

.viz-slack-scale .l1{width:43%;transform:rotate(207deg);}
.viz-slack-scale .l1::after{animation-delay:0s;}
.viz-slack-scale .l2{width:46%;transform:rotate(193deg);}
.viz-slack-scale .l2::after{animation-delay:.5s;}
.viz-slack-scale .l3{width:35%;transform:rotate(149deg);}
.viz-slack-scale .l3::after{animation-delay:1s;}
.viz-slack-scale .l4{width:43%;transform:rotate(-27deg);}
.viz-slack-scale .l4::after{animation-delay:1.6s;}
.viz-slack-scale .l5{width:46%;transform:rotate(-13deg);}
.viz-slack-scale .l5::after{animation-delay:2.1s;}
.viz-slack-scale .l6{width:34%;transform:rotate(-31deg);}
.viz-slack-scale .l6::after{animation-delay:2.6s;}

@keyframes vk_slack_scale_flow{
  0%{left:100%;opacity:0;}
  10%{opacity:1;}
  85%{opacity:1;}
  100%{left:0%;opacity:0;}
}
@keyframes vk_slack_scale_pulse{
  0%,100%{transform:translate(-50%,-50%) scale(1);}
  50%{transform:translate(-50%,-50%) scale(1.12);}
}
@keyframes vk_slack_scale_ring{
  0%{transform:translate(-50%,-50%) scale(1);opacity:.5;}
  70%{opacity:0;}
  100%{transform:translate(-50%,-50%) scale(2.4);opacity:0;}
}

@media (prefers-reduced-motion:reduce){
  .viz-slack-scale .core,.viz-slack-scale .ring,.viz-slack-scale .link::after{animation:none;}
  .viz-slack-scale .ring{opacity:.4;transform:translate(-50%,-50%) scale(1.6);}
  .viz-slack-scale .link::after{opacity:1;left:50%;}
}

/* ----- doordash-eta ----- */
.viz-doordash-eta{width:100%;min-width:0}
.viz-doordash-eta .viz-de-stage{display:flex;align-items:center;gap:14px;width:100%;min-width:0;padding:8px 4px;box-sizing:border-box}
.viz-doordash-eta .viz-de-map{position:relative;flex:1 1 auto;min-width:0;height:80px}
.viz-doordash-eta .viz-de-route{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.viz-doordash-eta .viz-de-track{fill:none;stroke:var(--line);stroke-width:2;stroke-linecap:round;stroke-dasharray:1 6}
.viz-doordash-eta .viz-de-trail{fill:none;stroke:var(--accent);stroke-width:2.4;stroke-linecap:round;stroke-dasharray:360;stroke-dashoffset:360;animation:vk_doordash_eta_draw 5s ease-in-out infinite}
.viz-doordash-eta .viz-de-courier{position:absolute;top:0;left:0;width:11px;height:11px;margin:-5.5px 0 0 -5.5px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px var(--accent-soft);offset-path:path("M14,62 C70,62 90,20 150,20 C210,20 230,58 286,18");offset-rotate:0deg;animation:vk_doordash_eta_move 5s ease-in-out infinite}
.viz-doordash-eta .viz-de-pin{position:absolute;right:0;top:14px;width:9px;height:9px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--card);border:2px solid var(--ink)}
.viz-doordash-eta .viz-de-readout{flex:0 0 auto;display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:8px 12px;border:1px solid var(--line);border-radius:var(--radius);background:var(--card);min-width:84px}
.viz-doordash-eta .viz-de-label{font-family:var(--font-mono);font-size:9px;letter-spacing:.14em;color:var(--muted)}
.viz-doordash-eta .viz-de-vals{position:relative;height:18px;width:64px}
.viz-doordash-eta .viz-de-v{position:absolute;left:0;top:0;font-family:var(--font-display);font-size:15px;font-weight:600;color:var(--ink);opacity:0;white-space:nowrap}
.viz-doordash-eta .viz-de-v1{animation:vk_doordash_eta_swap 5s steps(1,end) infinite}
.viz-doordash-eta .viz-de-v2{animation:vk_doordash_eta_swap 5s steps(1,end) infinite;animation-delay:1.66s}
.viz-doordash-eta .viz-de-v3{animation:vk_doordash_eta_swap 5s steps(1,end) infinite;animation-delay:3.33s}
.viz-doordash-eta .viz-de-tick{width:46px;height:3px;border-radius:2px;background:var(--soft);position:relative;overflow:hidden}
.viz-doordash-eta .viz-de-tick:after{content:"";position:absolute;left:0;top:0;height:100%;width:100%;background:var(--accent);transform-origin:left center;animation:vk_doordash_eta_tick 1.66s linear infinite}
@keyframes vk_doordash_eta_move{0%{offset-distance:0%}100%{offset-distance:100%}}
@keyframes vk_doordash_eta_draw{0%{stroke-dashoffset:360}100%{stroke-dashoffset:0}}
@keyframes vk_doordash_eta_swap{0%,33.33%{opacity:1}33.34%,100%{opacity:0}}
@keyframes vk_doordash_eta_tick{0%{transform:scaleX(0)}100%{transform:scaleX(1)}}
@media (prefers-reduced-motion:reduce){.viz-doordash-eta .viz-de-trail,.viz-doordash-eta .viz-de-courier,.viz-doordash-eta .viz-de-v,.viz-doordash-eta .viz-de-tick:after{animation:none}.viz-doordash-eta .viz-de-trail{stroke-dashoffset:120}.viz-doordash-eta .viz-de-courier{offset-distance:66%}.viz-doordash-eta .viz-de-v1{opacity:0}.viz-doordash-eta .viz-de-v2{opacity:0}.viz-doordash-eta .viz-de-v3{opacity:1}.viz-doordash-eta .viz-de-tick:after{transform:scaleX(.66)}}

/* ----- x-fanout ----- */
.viz-x-fanout{width:100%;min-width:0;}
.viz-x-fanout .vk-stage{position:relative;width:100%;min-width:0;height:108px;display:flex;align-items:center;gap:0;font-family:var(--font-mono);}
.viz-x-fanout .vk-src{position:relative;z-index:2;flex:0 0 22%;display:flex;flex-direction:column;align-items:center;gap:6px;}
.viz-x-fanout .vk-srcnode{width:26px;height:26px;border-radius:50%;background:var(--accent);border:1px solid var(--accent);animation:vk_x_fanout_emit 3.6s ease-in-out infinite;}
.viz-x-fanout .vk-lbl{font-size:9px;color:var(--muted);letter-spacing:.05em;}
.viz-x-fanout .vk-wires{position:absolute;left:0;top:0;width:100%;height:100%;z-index:1;overflow:visible;}
.viz-x-fanout .vk-w{fill:none;stroke:var(--line);stroke-width:1.2;vector-effect:non-scaling-stroke;}
.viz-x-fanout .vk-w.vk-w0,.viz-x-fanout .vk-w.vk-w1,.viz-x-fanout .vk-w.vk-w2,.viz-x-fanout .vk-w.vk-w3,.viz-x-fanout .vk-w.vk-w4{stroke-dasharray:6 8;animation:vk_x_fanout_flow 3.6s linear infinite;}
.viz-x-fanout .vk-w.vk-w1{animation-delay:.12s;}
.viz-x-fanout .vk-w.vk-w2{animation-delay:.24s;}
.viz-x-fanout .vk-w.vk-w3{animation-delay:.36s;}
.viz-x-fanout .vk-w.vk-w4{animation-delay:.48s;}
.viz-x-fanout .vk-rows{position:relative;z-index:2;flex:1 1 auto;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:6px;padding-left:4px;}
.viz-x-fanout .vk-row{display:flex;gap:5px;align-items:center;}
.viz-x-fanout .vk-cell{flex:1 1 0;min-width:0;height:11px;border-radius:4px;background:var(--soft);border:1px solid var(--line);}
.viz-x-fanout .vk-cell.vk-c0,.viz-x-fanout .vk-cell.vk-c1,.viz-x-fanout .vk-cell.vk-c2,.viz-x-fanout .vk-cell.vk-c3,.viz-x-fanout .vk-cell.vk-c4{animation:vk_x_fanout_fill 3.6s ease-in-out infinite;}
.viz-x-fanout .vk-cell.vk-c1{animation-delay:.12s;}
.viz-x-fanout .vk-cell.vk-c2{animation-delay:.24s;}
.viz-x-fanout .vk-cell.vk-c3{animation-delay:.36s;}
.viz-x-fanout .vk-cell.vk-c4{animation-delay:.48s;}
@keyframes vk_x_fanout_emit{0%,18%{transform:scale(1);}30%{transform:scale(1.14);}55%,100%{transform:scale(1);}}
@keyframes vk_x_fanout_flow{0%{stroke-dashoffset:0;opacity:.45;}25%{opacity:1;}60%,100%{stroke-dashoffset:-28;opacity:.45;}}
@keyframes vk_x_fanout_fill{0%,30%{background:var(--soft);border-color:var(--line);}55%{background:var(--accent-soft);border-color:var(--accent);}90%,100%{background:var(--accent-soft);border-color:var(--accent);}}
@media (prefers-reduced-motion:reduce){.viz-x-fanout *{animation:none !important;}.viz-x-fanout .vk-cell.vk-c0,.viz-x-fanout .vk-cell.vk-c1,.viz-x-fanout .vk-cell.vk-c2,.viz-x-fanout .vk-cell.vk-c3,.viz-x-fanout .vk-cell.vk-c4{background:var(--accent-soft);border-color:var(--accent);}}

/* ----- paypal-webhook ----- */
.viz-paypal-webhook{display:flex;align-items:center;justify-content:center;width:100%;min-width:0;padding:14px 4px;box-sizing:border-box;font-family:var(--font-mono);}
.viz-paypal-webhook .vscene{display:flex;align-items:center;justify-content:center;width:100%;max-width:560px;min-width:0;}
.viz-paypal-webhook .node{display:flex;flex-direction:column;align-items:center;gap:7px;flex:0 0 auto;}
.viz-paypal-webhook .lbl{font-size:9px;letter-spacing:.06em;color:var(--muted);text-transform:uppercase;}
.viz-paypal-webhook .dot{width:16px;height:16px;border-radius:50%;background:var(--ink);}
.viz-paypal-webhook .box{width:30px;height:30px;border-radius:7px;border:1.5px solid var(--line);background:var(--soft);animation:vk_paypal_webhook_flash 4s ease-in-out infinite;}
.viz-paypal-webhook .wire{position:relative;flex:1 1 auto;min-width:0;height:60px;margin:0 8px;display:flex;align-items:center;}
.viz-paypal-webhook .track{position:absolute;left:0;right:0;top:42px;height:1.5px;background:var(--line);border-radius:2px;}
.viz-paypal-webhook .arc{position:absolute;left:0;right:0;top:0;width:100%;height:60px;overflow:visible;}
.viz-paypal-webhook .arcpath{stroke:var(--line);stroke-width:1.5;stroke-dasharray:4 4;}
.viz-paypal-webhook .pkt{position:absolute;top:38px;width:9px;height:9px;border-radius:2px;background:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);}
.viz-paypal-webhook .pkt1{animation:vk_paypal_webhook_flow 4s ease-in-out infinite;}
.viz-paypal-webhook .rpkt{position:absolute;width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 2px var(--accent-soft);opacity:0;offset-path:path('M10,42 C60,-8 140,-8 190,42');offset-distance:0%;animation:vk_paypal_webhook_retry 4s ease-in-out infinite;}
@keyframes vk_paypal_webhook_flow{0%{left:0;opacity:0;}8%{opacity:1;}40%{left:calc(100% - 9px);opacity:1;}48%{left:calc(100% - 9px);opacity:0;}100%{left:calc(100% - 9px);opacity:0;}}
@keyframes vk_paypal_webhook_flash{0%,40%{background:var(--soft);border-color:var(--line);}46%{background:var(--accent-soft);border-color:var(--accent);}58%,100%{background:var(--soft);border-color:var(--line);}}
@keyframes vk_paypal_webhook_retry{0%,52%{offset-distance:0%;opacity:0;}58%{offset-distance:0%;opacity:1;}90%{offset-distance:100%;opacity:1;}98%,100%{offset-distance:100%;opacity:0;}}
@media (prefers-reduced-motion:reduce){.viz-paypal-webhook .pkt1,.viz-paypal-webhook .box,.viz-paypal-webhook .rpkt{animation:none;}.viz-paypal-webhook .pkt1{left:40%;opacity:1;}.viz-paypal-webhook .rpkt{offset-distance:50%;opacity:1;}}

/* ----- shopify-retry ----- */
.viz-shopify-retry{display:flex;align-items:center;justify-content:center;width:100%;min-width:0;height:120px;font-family:var(--font-mono);}
.viz-shopify-retry .stage{display:flex;align-items:center;width:100%;min-width:0;gap:0;padding:0 4%;box-sizing:border-box;}
.viz-shopify-retry .node{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px 12px;min-width:0;}
.viz-shopify-retry .cap{font-size:10px;color:var(--muted);letter-spacing:.04em;white-space:nowrap;}
.viz-shopify-retry .ctr{font-size:11px;color:var(--ink);background:var(--soft);border:1px solid var(--line);border-radius:8px;padding:2px 8px;white-space:nowrap;}
.viz-shopify-retry .wire{position:relative;flex:1 1 auto;min-width:0;height:2px;background:var(--line);margin:0 -1px;align-self:center;}
.viz-shopify-retry .tok{position:absolute;top:50%;left:0;width:9px;height:9px;margin-top:-4.5px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px var(--accent-soft);opacity:0;animation:vk_shopify_retry_flow 5s linear infinite;}
.viz-shopify-retry .tok.t2{animation-delay:1.6s;}
.viz-shopify-retry .tok.t3{animation-delay:3.2s;}
.viz-shopify-retry .svc{position:relative;}
.viz-shopify-retry .pulse{position:absolute;top:8px;right:8px;width:7px;height:7px;border-radius:50%;background:var(--good);animation:vk_shopify_retry_beat 2.5s ease-in-out infinite;}
@keyframes vk_shopify_retry_flow{0%{left:0;opacity:0;}8%{opacity:1;}88%{opacity:1;}100%{left:100%;opacity:0;}}
@keyframes vk_shopify_retry_beat{0%,100%{opacity:.4;transform:scale(.85);}50%{opacity:1;transform:scale(1.15);}}
@media (prefers-reduced-motion:reduce){.viz-shopify-retry .tok,.viz-shopify-retry .pulse{animation:none;}.viz-shopify-retry .tok{opacity:1;}.viz-shopify-retry .tok.t1{left:22%;}.viz-shopify-retry .tok.t2{left:52%;}.viz-shopify-retry .tok.t3{left:80%;}.viz-shopify-retry .pulse{opacity:1;}}

/* ----- youtube-p50 ----- */
.viz-youtube-p50{width:100%;min-width:0;box-sizing:border-box}
.viz-youtube-p50 *{box-sizing:border-box}
.viz-youtube-p50 .chart{width:100%;display:flex;flex-direction:column;gap:6px;padding:8px 4px 2px}
.viz-youtube-p50 .plot{position:relative;width:100%;height:78px;border-bottom:1px solid var(--line);border-left:1px solid var(--line)}
.viz-youtube-p50 .bars{position:absolute;inset:0;display:flex;align-items:flex-end;gap:2.2%;padding:0 1% 0 1.5%}
.viz-youtube-p50 .bar{flex:1 1 0;min-width:0;background:var(--accent-soft);border:1px solid var(--accent);border-bottom:none;border-radius:3px 3px 0 0;transform-origin:bottom;transform:scaleY(0);animation:vk_youtube_p50_grow 4.5s ease-in-out infinite}
.viz-youtube-p50 .b1{height:14%;animation-delay:0s}
.viz-youtube-p50 .b2{height:34%;animation-delay:.08s}
.viz-youtube-p50 .b3{height:62%;animation-delay:.16s}
.viz-youtube-p50 .b4{height:88%;animation-delay:.24s}
.viz-youtube-p50 .b5{height:100%;animation-delay:.32s}
.viz-youtube-p50 .b6{height:82%;animation-delay:.4s}
.viz-youtube-p50 .b7{height:58%;animation-delay:.48s}
.viz-youtube-p50 .b8{height:40%;animation-delay:.56s}
.viz-youtube-p50 .b9{height:26%;animation-delay:.64s}
.viz-youtube-p50 .b10{height:17%;animation-delay:.72s}
.viz-youtube-p50 .b11{height:11%;animation-delay:.8s}
.viz-youtube-p50 .b12{height:7%;animation-delay:.88s}
.viz-youtube-p50 .marker{position:absolute;top:-4px;bottom:0;width:0}
.viz-youtube-p50 .marker .mline{position:absolute;top:0;bottom:0;left:0;width:1px;border-left:1px dashed var(--muted)}
.viz-youtube-p50 .marker .mtag{position:absolute;top:-2px;left:3px;font-family:var(--font-mono);font-size:8px;line-height:1;color:var(--muted);letter-spacing:.02em}
.viz-youtube-p50 .p50{left:36%}
.viz-youtube-p50 .p50 .mline{border-left-color:var(--accent);opacity:.9}
.viz-youtube-p50 .p50 .mtag{color:var(--accent)}
.viz-youtube-p50 .p99{left:80%;opacity:.5}
.viz-youtube-p50 .axis{display:flex;justify-content:space-between;font-family:var(--font-mono);font-size:8px;color:var(--muted);padding:0 2px;letter-spacing:.03em}
@keyframes vk_youtube_p50_grow{0%{transform:scaleY(0)}30%,70%{transform:scaleY(1)}100%{transform:scaleY(1)}}
@media (prefers-reduced-motion:reduce){.viz-youtube-p50 .bar{animation:none;transform:scaleY(1)}}

/* ----- instagram-likes ----- */
.viz-instagram-likes{display:flex;align-items:center;justify-content:center;width:100%;min-width:0;height:120px;box-sizing:border-box;font-family:var(--font-mono);}
.viz-instagram-likes .stage{display:flex;align-items:center;gap:7%;width:100%;min-width:0;padding:0 6%;box-sizing:border-box;}
.viz-instagram-likes .heart-wrap{position:relative;flex:0 0 auto;width:46px;height:46px;display:flex;align-items:center;justify-content:center;}
.viz-instagram-likes .heart{width:30px;height:30px;overflow:visible;animation:vk_instagram_likes_beat 2.4s ease-in-out infinite;}
.viz-instagram-likes .heart path{fill:var(--accent-soft);stroke:var(--accent);stroke-width:2;}
.viz-instagram-likes .ring{position:absolute;top:50%;left:50%;width:30px;height:30px;border-radius:50%;border:1.5px solid var(--accent);transform:translate(-50%,-50%) scale(.5);opacity:0;}
.viz-instagram-likes .r1{animation:vk_instagram_likes_pop 2.4s ease-out infinite;}
.viz-instagram-likes .r2{animation:vk_instagram_likes_pop 2.4s ease-out infinite;animation-delay:1.2s;}
.viz-instagram-likes .readout{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:7px;}
.viz-instagram-likes .track{position:relative;height:42px;background:var(--soft);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;}
.viz-instagram-likes .ticker{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;animation:vk_instagram_likes_roll 2.4s steps(1) infinite;}
.viz-instagram-likes .t{height:42px;line-height:42px;font-size:19px;color:var(--ink);font-family:var(--font-display);letter-spacing:.5px;}
.viz-instagram-likes .lbl{font-size:10px;color:var(--muted);letter-spacing:.5px;padding-left:4px;}
@keyframes vk_instagram_likes_beat{0%,18%{transform:scale(1);}9%{transform:scale(1.22);}28%,46%{transform:scale(1);}37%{transform:scale(1.22);}55%,100%{transform:scale(1);}}
@keyframes vk_instagram_likes_pop{0%{transform:translate(-50%,-50%) scale(.5);opacity:.6;}40%{opacity:.25;}60%,100%{transform:translate(-50%,-50%) scale(1.7);opacity:0;}}
@keyframes vk_instagram_likes_roll{0%{transform:translateY(0);}15%{transform:translateY(-42px);}30%{transform:translateY(-84px);}45%{transform:translateY(-126px);}60%,100%{transform:translateY(-126px);}}

/* ----- zoom-retention ----- */
.viz-zoom-retention{width:100%;min-width:0}
.viz-zoom-retention .viz-zoom-retention-stage{display:grid;grid-template-columns:18px 1fr;grid-template-rows:1fr auto;gap:4px 8px;width:100%;min-width:0;box-sizing:border-box;padding:8px 10px;height:104px;font-family:var(--font-mono)}
.viz-zoom-retention .viz-zoom-retention-yaxis{grid-column:1;grid-row:1;display:flex;align-items:flex-start;justify-content:flex-end}
.viz-zoom-retention .viz-zoom-retention-unit{font-size:8px;color:var(--muted);letter-spacing:.04em}
.viz-zoom-retention .viz-zoom-retention-plot{grid-column:2;grid-row:1;position:relative;min-width:0;border-left:1px solid var(--line)}
.viz-zoom-retention .viz-zoom-retention-axis{position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--line)}
.viz-zoom-retention .viz-zoom-retention-bars{position:absolute;left:6px;right:6px;bottom:1px;top:2px;display:flex;align-items:flex-end;justify-content:space-between;gap:3%}
.viz-zoom-retention .viz-zoom-retention-bar{flex:1 1 0;min-width:0;height:100%;background:var(--accent-soft);border:1px solid var(--accent);border-bottom:none;border-radius:3px 3px 0 0;transform-origin:bottom;transform:scaleY(.18);animation:vk_zoom_retention_grow 5s ease-in-out infinite}
.viz-zoom-retention .viz-zoom-retention-b1{--h:.18;animation-delay:0s}
.viz-zoom-retention .viz-zoom-retention-b2{--h:.30;animation-delay:.22s}
.viz-zoom-retention .viz-zoom-retention-b3{--h:.40;animation-delay:.44s}
.viz-zoom-retention .viz-zoom-retention-b4{--h:.52;animation-delay:.66s}
.viz-zoom-retention .viz-zoom-retention-b5{--h:.64;animation-delay:.88s}
.viz-zoom-retention .viz-zoom-retention-b6{--h:.76;animation-delay:1.10s}
.viz-zoom-retention .viz-zoom-retention-b7{--h:.88;animation-delay:1.32s}
.viz-zoom-retention .viz-zoom-retention-b8{--h:1;animation-delay:1.54s}
.viz-zoom-retention .viz-zoom-retention-sweep{position:absolute;top:0;bottom:1px;width:2px;background:var(--accent);left:6px;opacity:.55;animation:vk_zoom_retention_sweep 5s ease-in-out infinite}
.viz-zoom-retention .viz-zoom-retention-sweep::after{content:"";position:absolute;left:1px;bottom:0;width:7px;height:7px;border-radius:50%;background:var(--good);transform:translateX(-50%)}
.viz-zoom-retention .viz-zoom-retention-xaxis{grid-column:2;grid-row:2;display:flex;justify-content:space-between;font-size:8px;color:var(--muted);letter-spacing:.04em;padding:0 6px}
.viz-zoom-retention .viz-zoom-retention-arrow{color:var(--muted)}
@keyframes vk_zoom_retention_grow{0%{transform:scaleY(.18)}40%,100%{transform:scaleY(var(--h))}}
@keyframes vk_zoom_retention_sweep{0%{left:6px}40%,100%{left:calc(100% - 8px)}}
@media (prefers-reduced-motion: reduce){.viz-zoom-retention .viz-zoom-retention-bar{animation:none;transform:scaleY(var(--h))}.viz-zoom-retention .viz-zoom-retention-sweep{animation:none;left:calc(100% - 8px)}}

/* ----- reddit-stampede ----- */
.viz-reddit-stampede{width:100%;min-width:0;display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);}
.viz-reddit-stampede .stage{width:100%;display:flex;align-items:center;justify-content:center;padding:8px 0;}
.viz-reddit-stampede .tile{display:flex;align-items:center;gap:16px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px 20px;min-width:0;}
.viz-reddit-stampede .ring{position:relative;width:62px;height:62px;flex:0 0 auto;}
.viz-reddit-stampede .dial{width:100%;height:100%;transform:rotate(-90deg);}
.viz-reddit-stampede .track{fill:none;stroke:var(--soft);stroke-width:3;}
.viz-reddit-stampede .sweep{fill:none;stroke:var(--accent);stroke-width:3;stroke-linecap:round;stroke-dasharray:97.4;stroke-dashoffset:0;animation:vk_reddit_stampede_sweep 5s linear infinite;}
.viz-reddit-stampede .phase{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;font-size:10px;color:var(--good);font-weight:600;animation:vk_reddit_stampede_phase 5s linear infinite;}
.viz-reddit-stampede .meta{display:flex;flex-direction:column;gap:5px;min-width:0;}
.viz-reddit-stampede .key{font-size:12px;color:var(--ink);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.viz-reddit-stampede .ttl{font-size:10px;color:var(--muted);background:var(--soft);border:1px solid var(--line);border-radius:6px;padding:1px 7px;align-self:flex-start;}
@keyframes vk_reddit_stampede_sweep{0%{stroke-dashoffset:0;stroke:var(--accent);}74%{stroke-dashoffset:97.4;stroke:var(--accent);}75%{stroke-dashoffset:97.4;stroke:var(--accent-soft);}85%{stroke-dashoffset:0;stroke:var(--accent-soft);}86%{stroke-dashoffset:0;stroke:var(--accent);}100%{stroke-dashoffset:0;stroke:var(--accent);}}
@keyframes vk_reddit_stampede_phase{0%,74%{color:var(--good);}75%,85%{color:var(--accent);}86%,100%{color:var(--good);}}
.viz-reddit-stampede .ring::after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;border-radius:50%;animation:vk_reddit_stampede_pulse 5s linear infinite;}
@keyframes vk_reddit_stampede_pulse{0%,74%{box-shadow:0 0 0 0 rgba(0,0,0,0);}80%{box-shadow:0 0 0 3px var(--accent-soft);}86%,100%{box-shadow:0 0 0 0 rgba(0,0,0,0);}}
@media (prefers-reduced-motion:reduce){.viz-reddit-stampede .sweep{animation:none;stroke-dashoffset:34;}.viz-reddit-stampede .phase{animation:none;}.viz-reddit-stampede .ring::after{animation:none;}}

/* ----- notion-lock ----- */
.viz-notion-lock{display:flex;align-items:center;justify-content:center;width:100%;min-width:0;height:120px;box-sizing:border-box;font-family:var(--font-mono);}
.viz-notion-lock .vk_wrap{display:flex;align-items:center;gap:14px;width:100%;min-width:0;max-width:460px;padding:0 16px;box-sizing:border-box;}
.viz-notion-lock .vk_block{position:relative;flex:1 1 auto;min-width:0;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:16px 14px 14px;display:flex;flex-direction:column;gap:9px;}
.viz-notion-lock .vk_label{position:absolute;top:-8px;left:12px;background:var(--card);padding:0 5px;font-size:9px;letter-spacing:.08em;color:var(--muted);}
.viz-notion-lock .vk_line{display:flex;align-items:center;height:9px;}
.viz-notion-lock .vk_typed{height:7px;border-radius:4px;background:var(--accent-soft);}
.viz-notion-lock .vk_t1{animation:vk_notion_lock_grow1 3.6s ease-in-out infinite;}
.viz-notion-lock .vk_t2{animation:vk_notion_lock_grow2 3.6s ease-in-out infinite;}
.viz-notion-lock .vk_t3{animation:vk_notion_lock_grow3 3.6s ease-in-out infinite;}
.viz-notion-lock .vk_caret{width:2px;height:11px;margin-left:2px;border-radius:1px;flex:0 0 auto;}
.viz-notion-lock .vk_c1{background:var(--accent);animation:vk_notion_lock_blink 1.1s steps(1,end) infinite;}
.viz-notion-lock .vk_c2{background:var(--good);animation:vk_notion_lock_blink 1.1s steps(1,end) infinite .4s;}
.viz-notion-lock .vk_c3{background:var(--amber);animation:vk_notion_lock_blink 1.1s steps(1,end) infinite .75s;}
.viz-notion-lock .vk_avatars{display:flex;flex-direction:column;gap:8px;flex:0 0 auto;}
.viz-notion-lock .vk_dot{width:13px;height:13px;border-radius:50%;border:2px solid var(--card);}
.viz-notion-lock .vk_d1{background:var(--accent);animation:vk_notion_lock_pulse 3.6s ease-in-out infinite;}
.viz-notion-lock .vk_d2{background:var(--good);animation:vk_notion_lock_pulse 3.6s ease-in-out infinite .4s;}
.viz-notion-lock .vk_d3{background:var(--amber);animation:vk_notion_lock_pulse 3.6s ease-in-out infinite .75s;}
@keyframes vk_notion_lock_grow1{0%{width:18%}45%{width:74%}55%{width:74%}100%{width:18%}}
@keyframes vk_notion_lock_grow2{0%{width:30%}50%{width:60%}60%{width:60%}100%{width:30%}}
@keyframes vk_notion_lock_grow3{0%{width:12%}40%{width:50%}60%{width:50%}100%{width:12%}}
@keyframes vk_notion_lock_blink{0%,49%{opacity:1}50%,100%{opacity:.15}}
@keyframes vk_notion_lock_pulse{0%,100%{transform:scale(1);opacity:.85}50%{transform:scale(1.15);opacity:1}}
@media(prefers-reduced-motion:reduce){.viz-notion-lock *{animation:none!important}.viz-notion-lock .vk_t1{width:74%}.viz-notion-lock .vk_t2{width:60%}.viz-notion-lock .vk_t3{width:50%}}

/* ----- kafka-ordering ----- */
.viz-kafka-ordering{width:100%;min-width:0;display:flex;align-items:center;justify-content:center;padding:6px 4px;box-sizing:border-box;}
.viz-kafka-ordering .stage{width:100%;min-width:0;display:flex;align-items:center;gap:10px;font-family:var(--font-mono);}
.viz-kafka-ordering .producers{display:flex;flex-direction:column;gap:9px;flex:0 0 38%;min-width:0;}
.viz-kafka-ordering .prod{display:flex;align-items:center;gap:7px;min-width:0;}
.viz-kafka-ordering .lbl{font-size:8px;color:var(--muted);white-space:nowrap;letter-spacing:.02em;flex:0 0 auto;}
.viz-kafka-ordering .lane{position:relative;flex:1 1 auto;min-width:0;height:2px;border-radius:2px;background:var(--soft);overflow:hidden;}
.viz-kafka-ordering .lane::before{content:"";position:absolute;inset:0;border-top:1px dashed var(--line);height:0;top:50%;}
.viz-kafka-ordering .tick{position:absolute;top:50%;left:0;width:6px;height:6px;margin-top:-3px;border-radius:50%;background:var(--accent);transform:translateX(-3px);}
.viz-kafka-ordering .t1{animation:vk_kafka_ordering_emit 4s linear infinite;}
.viz-kafka-ordering .t2{animation:vk_kafka_ordering_emit 4s linear infinite;animation-delay:1.3s;}
.viz-kafka-ordering .t3{animation:vk_kafka_ordering_emit 4s linear infinite;animation-delay:2.6s;}
.viz-kafka-ordering .join{flex:0 0 14px;height:60px;border-left:1px solid var(--line);border-radius:0;position:relative;}
.viz-kafka-ordering .join::before,.viz-kafka-ordering .join::after{content:"";position:absolute;left:0;width:13px;height:18px;border-right:1px solid var(--line);}
.viz-kafka-ordering .join::before{top:6px;border-top:1px solid var(--line);border-top-right-radius:8px;}
.viz-kafka-ordering .join::after{bottom:6px;border-bottom:1px solid var(--line);border-bottom-right-radius:8px;}
.viz-kafka-ordering .merged{display:flex;align-items:center;gap:7px;flex:1 1 46%;min-width:0;}
.viz-kafka-ordering .rail{position:relative;flex:1 1 auto;min-width:0;height:18px;border:1px solid var(--line);border-radius:var(--radius);background:var(--card);display:flex;align-items:center;overflow:hidden;}
.viz-kafka-ordering .rail::before{content:"";position:absolute;inset:0;background:var(--accent-soft);opacity:.35;}
.viz-kafka-ordering .ev{position:absolute;top:50%;width:7px;height:7px;margin-top:-3.5px;border-radius:2px;background:var(--accent);animation:vk_kafka_ordering_stream 4s linear infinite;}
.viz-kafka-ordering .e1{animation-delay:0s;}
.viz-kafka-ordering .e2{animation-delay:1s;}
.viz-kafka-ordering .e3{animation-delay:2s;}
.viz-kafka-ordering .e4{animation-delay:3s;}
@keyframes vk_kafka_ordering_emit{0%{left:0;opacity:0;}12%{opacity:1;}88%{opacity:1;}100%{left:100%;opacity:0;}}
@keyframes vk_kafka_ordering_stream{0%{left:-4%;opacity:0;}10%{opacity:1;}90%{opacity:1;}100%{left:100%;opacity:0;}}
@media (prefers-reduced-motion:reduce){
.viz-kafka-ordering .tick,.viz-kafka-ordering .ev{animation:none;}
.viz-kafka-ordering .t1{left:62%;}
.viz-kafka-ordering .t2{left:40%;}
.viz-kafka-ordering .t3{left:18%;}
.viz-kafka-ordering .e1{left:14%;}
.viz-kafka-ordering .e2{left:40%;}
.viz-kafka-ordering .e3{left:62%;}
.viz-kafka-ordering .e4{left:84%;}
}

/* ----- cloudinary-workers ----- */
.viz-cloudinary-workers{width:100%;min-width:0;height:120px;display:flex;align-items:center;font-family:var(--font-mono);}
.viz-cloudinary-workers .vk-stage{display:flex;align-items:center;justify-content:space-between;gap:2%;width:100%;padding:0 4%;box-sizing:border-box;}
.viz-cloudinary-workers .vk-queue{position:relative;display:flex;flex-direction:column;gap:5px;padding:8px 6px 6px;border:1px solid var(--line);border-radius:var(--radius);background:var(--soft);flex:0 0 auto;}
.viz-cloudinary-workers .vk-qlabel,.viz-cloudinary-workers .vk-wlabel,.viz-cloudinary-workers .vk-dlabel{position:absolute;top:-15px;left:2px;font-size:8px;color:var(--muted);letter-spacing:.5px;}
.viz-cloudinary-workers .vk-tile{width:30px;height:9px;border-radius:3px;background:var(--accent-soft);border:1px solid var(--line);}
.viz-cloudinary-workers .vk-tile:nth-child(2){animation:vk_cloudinary_workers_drain 4s ease-in-out infinite;}
.viz-cloudinary-workers .vk-tile:nth-child(3){animation:vk_cloudinary_workers_drain 4s ease-in-out infinite 1s;}
.viz-cloudinary-workers .vk-rail{position:relative;flex:1 1 auto;height:2px;background:var(--line);border-radius:2px;min-width:18px;}
.viz-cloudinary-workers .vk-job{position:absolute;top:-3px;width:7px;height:7px;border-radius:2px;background:var(--accent);}
.viz-cloudinary-workers .vk-j1{animation:vk_cloudinary_workers_flow 4s linear infinite;}
.viz-cloudinary-workers .vk-j2{animation:vk_cloudinary_workers_flow 4s linear infinite 2s;}
.viz-cloudinary-workers .vk-j3{animation:vk_cloudinary_workers_flow 4s linear infinite 1s;}
.viz-cloudinary-workers .vk-workers{position:relative;display:flex;gap:5px;padding:8px 6px 6px;border:1px solid var(--line);border-radius:var(--radius);background:var(--card);flex:0 0 auto;}
.viz-cloudinary-workers .vk-worker{width:18px;height:24px;border-radius:5px;border:1px solid var(--line);background:var(--accent-soft);}
.viz-cloudinary-workers .vk-worker:nth-child(2){animation:vk_cloudinary_workers_pulse 4s ease-in-out infinite;}
.viz-cloudinary-workers .vk-worker:nth-child(3){animation:vk_cloudinary_workers_pulse 4s ease-in-out infinite 1.3s;}
.viz-cloudinary-workers .vk-worker:nth-child(4){animation:vk_cloudinary_workers_pulse 4s ease-in-out infinite 2.6s;}
.viz-cloudinary-workers .vk-rail2{flex:0 1 14%;}
.viz-cloudinary-workers .vk-db{position:relative;flex:0 0 auto;}
.viz-cloudinary-workers .vk-cyl{display:block;width:34px;height:40px;border:1px solid var(--line);border-radius:9px/14px;background:var(--soft);position:relative;}
.viz-cloudinary-workers .vk-cyl::before{content:"";position:absolute;left:0;right:0;top:3px;height:6px;border:1px solid var(--line);border-radius:50%;background:var(--card);}
.viz-cloudinary-workers .vk-cyl::after{content:"";position:absolute;left:3px;right:3px;bottom:4px;height:8px;border-radius:4px;background:var(--accent);opacity:.55;animation:vk_cloudinary_workers_fill 4s ease-in-out infinite;}
@keyframes vk_cloudinary_workers_flow{0%{left:0;opacity:0;}10%{opacity:1;}90%{opacity:1;}100%{left:calc(100% - 7px);opacity:0;}}
@keyframes vk_cloudinary_workers_drain{0%,100%{opacity:1;}50%{opacity:.35;}}
@keyframes vk_cloudinary_workers_pulse{0%,100%{background:var(--accent-soft);}50%{background:var(--accent);}}
@keyframes vk_cloudinary_workers_fill{0%,100%{height:8px;}50%{height:13px;}}
@media(prefers-reduced-motion:reduce){.viz-cloudinary-workers *{animation:none!important;}}

/* ----- datadog-logs ----- */
.viz-datadog-logs{width:100%;min-width:0;box-sizing:border-box}
.viz-datadog-logs .stage{display:grid;grid-template-columns:1fr auto auto;grid-template-rows:auto auto;gap:10px 14px;align-items:center;width:100%;min-width:0;padding:6px 4px;font-family:var(--font-mono)}
.viz-datadog-logs .lane{position:relative;height:34px;min-width:0;background:var(--soft);border:1px solid var(--line);border-radius:8px;overflow:hidden}
.viz-datadog-logs .dot{position:absolute;top:50%;left:0;width:8px;height:8px;margin-top:-4px;border-radius:50%;background:var(--accent);animation:vk_datadog_logs_flow 3s linear infinite}
.viz-datadog-logs .d2{animation-delay:1s}
.viz-datadog-logs .d3{animation-delay:2s}
.viz-datadog-logs .handler{position:relative;width:118px;height:46px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);display:flex;align-items:center;justify-content:center}
.viz-datadog-logs .hlabel{font-size:9px;color:var(--ink);letter-spacing:.2px}
.viz-datadog-logs .tick{position:absolute;top:-3px;right:-3px;width:7px;height:7px;border-radius:50%;background:var(--accent-soft);border:1px solid var(--line);animation:vk_datadog_logs_tick 3s ease-in-out infinite}
.viz-datadog-logs .out{display:flex;flex-direction:column;gap:5px;align-items:flex-start}
.viz-datadog-logs .ret{font-size:9px;padding:2px 6px;border-radius:6px;border:1px solid var(--line)}
.viz-datadog-logs .r-ok{color:var(--good);background:var(--card)}
.viz-datadog-logs .r-err{color:var(--muted);background:var(--soft);animation:vk_datadog_logs_blip 3s ease-in-out infinite}
.viz-datadog-logs .logwrap{grid-column:1 / -1;display:flex;align-items:center;gap:10px;background:var(--soft);border:1px solid var(--line);border-radius:8px;padding:7px 10px;min-width:0}
.viz-datadog-logs .logmark{font-size:9px;color:var(--muted);flex:none}
.viz-datadog-logs .logline{position:relative;display:flex;gap:6px;flex:1;min-width:0;overflow:hidden}
.viz-datadog-logs .bar{height:7px;border-radius:4px;background:var(--accent-soft);opacity:0;transform:translateX(-6px);animation:vk_datadog_logs_write 3s ease-in-out infinite}
.viz-datadog-logs .b1{width:18%}
.viz-datadog-logs .b2{width:30%;animation-delay:.12s}
.viz-datadog-logs .b3{width:14%;animation-delay:.24s}
.viz-datadog-logs .b4{width:24%;animation-delay:.36s}
@keyframes vk_datadog_logs_flow{0%{left:-10px;opacity:0}12%{opacity:1}88%{opacity:1}100%{left:100%;opacity:0}}
@keyframes vk_datadog_logs_tick{0%,72%{transform:scale(1);background:var(--accent-soft)}80%{transform:scale(1.5);background:var(--accent)}92%,100%{transform:scale(1);background:var(--accent-soft)}}
@keyframes vk_datadog_logs_blip{0%,74%{opacity:.35}82%{opacity:1}94%,100%{opacity:.35}}
@keyframes vk_datadog_logs_write{0%,28%{opacity:0;transform:translateX(-6px)}40%{opacity:1;transform:translateX(0)}90%{opacity:1;transform:translateX(0)}100%{opacity:0;transform:translateX(-6px)}}
@media (prefers-reduced-motion:reduce){.viz-datadog-logs .dot,.viz-datadog-logs .tick,.viz-datadog-logs .r-err,.viz-datadog-logs .bar{animation:none}.viz-datadog-logs .bar{opacity:1;transform:none}.viz-datadog-logs .d1{left:30%}.viz-datadog-logs .d2{left:60%}.viz-datadog-logs .d3{left:88%}}

/* ----- robinhood-dualwrite ----- */
.viz-robinhood-dualwrite{width:100%;min-width:0;}
.viz-robinhood-dualwrite .vk-stage{
  display:flex;align-items:center;justify-content:center;gap:0;
  width:100%;min-width:0;height:120px;padding:0 16px;box-sizing:border-box;
  font-family:var(--font-mono);
}
.viz-robinhood-dualwrite .vk-src{
  position:relative;flex:0 0 auto;
  display:flex;flex-direction:column;align-items:center;gap:6px;
  width:78px;
}
.viz-robinhood-dualwrite .vk-srclabel{
  display:inline-block;
  padding:4px 9px;border:1px solid var(--line);border-radius:8px;
  background:var(--card);color:var(--ink);
  font-size:10px;letter-spacing:.04em;
}
.viz-robinhood-dualwrite .vk-token{
  position:absolute;left:50%;top:50%;
  width:9px;height:9px;border-radius:50%;
  background:var(--accent);margin:-4.5px 0 0 -4.5px;
}
.viz-robinhood-dualwrite .vk-token-up{
  animation:vk_robinhood_dualwrite_flowup 3.2s ease-in-out infinite;
}
.viz-robinhood-dualwrite .vk-token-dn{
  animation:vk_robinhood_dualwrite_flowdn 3.2s ease-in-out infinite;
}
.viz-robinhood-dualwrite .vk-lines{
  position:relative;flex:1 1 auto;min-width:0;
  align-self:stretch;
}
.viz-robinhood-dualwrite .vk-line{
  position:absolute;left:0;right:0;height:2px;
  background:var(--line);
}
.viz-robinhood-dualwrite .vk-line-up{
  top:34%;transform:rotate(-7deg);transform-origin:left center;
}
.viz-robinhood-dualwrite .vk-line-dn{
  top:66%;transform:rotate(7deg);transform-origin:left center;
}
.viz-robinhood-dualwrite .vk-stores{
  flex:0 0 auto;
  display:flex;flex-direction:column;justify-content:space-between;
  gap:14px;height:104px;width:auto;
}
.viz-robinhood-dualwrite .vk-store{
  display:flex;align-items:center;gap:8px;
}
.viz-robinhood-dualwrite .vk-cyl{
  position:relative;flex:0 0 auto;
  width:26px;height:30px;
  border:1.5px solid var(--muted);
  border-top:none;
  border-radius:0 0 13px 13px / 0 0 7px 7px;
  background:var(--soft);
}
.viz-robinhood-dualwrite .vk-cyl-top{
  position:absolute;left:-1.5px;right:-1.5px;top:-5px;height:9px;
  border:1.5px solid var(--muted);border-radius:50%;
  background:var(--accent-soft);
}
.viz-robinhood-dualwrite .vk-storelabel{
  color:var(--muted);font-size:9.5px;letter-spacing:.03em;white-space:nowrap;
}
@keyframes vk_robinhood_dualwrite_flowup{
  0%{left:50%;top:50%;opacity:0;}
  12%{opacity:1;}
  50%{left:118%;top:8%;opacity:1;}
  62%{left:118%;top:8%;opacity:0;}
  100%{left:118%;top:8%;opacity:0;}
}
@keyframes vk_robinhood_dualwrite_flowdn{
  0%{left:50%;top:50%;opacity:0;}
  12%{opacity:1;}
  50%{left:118%;top:92%;opacity:1;}
  62%{left:118%;top:92%;opacity:0;}
  100%{left:118%;top:92%;opacity:0;}
}
@media (prefers-reduced-motion:reduce){
  .viz-robinhood-dualwrite .vk-token-up,
  .viz-robinhood-dualwrite .vk-token-dn{
    animation:none;left:84%;opacity:1;
  }
  .viz-robinhood-dualwrite .vk-token-up{top:18%;}
  .viz-robinhood-dualwrite .vk-token-dn{top:82%;}
}

/* ----- airbnb-normalize ----- */
.viz-airbnb-normalize{width:100%;min-width:0;}
.viz-airbnb-normalize .stage{display:grid;grid-template-columns:1fr 30% 28%;align-items:center;gap:0;width:100%;min-width:0;height:120px;font-family:var(--font-mono);box-sizing:border-box;padding:6px 4px;}
.viz-airbnb-normalize .page{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:8px;min-width:0;}
.viz-airbnb-normalize .phead{display:flex;align-items:center;gap:6px;margin-bottom:6px;}
.viz-airbnb-normalize .dot{width:6px;height:6px;border-radius:50%;background:var(--good);animation:vk_airbnb_normalize_pulse 3s ease-in-out infinite;}
.viz-airbnb-normalize .ttl{font-size:9px;color:var(--muted);letter-spacing:.5px;}
.viz-airbnb-normalize .rows{display:flex;flex-direction:column;gap:5px;}
.viz-airbnb-normalize .row{display:flex;gap:4px;height:16px;background:var(--soft);border:1px solid var(--line);border-radius:6px;padding:3px;}
.viz-airbnb-normalize .cell{flex:1;border-radius:3px;background:var(--accent-soft);opacity:.45;}
.viz-airbnb-normalize .r1 .cell{animation:vk_airbnb_normalize_fill 4s ease-in-out infinite;}
.viz-airbnb-normalize .r2 .cell{animation:vk_airbnb_normalize_fill 4s ease-in-out infinite;animation-delay:.5s;}
.viz-airbnb-normalize .r3 .cell{animation:vk_airbnb_normalize_fill 4s ease-in-out infinite;animation-delay:1s;}
.viz-airbnb-normalize .links{position:relative;height:80px;}
.viz-airbnb-normalize .ln{position:absolute;left:0;right:0;height:1px;background:var(--line);overflow:hidden;}
.viz-airbnb-normalize .ln::after{content:"";position:absolute;top:0;left:-30%;width:30%;height:100%;background:var(--accent);animation:vk_airbnb_normalize_flow 4s ease-in-out infinite;}
.viz-airbnb-normalize .l1{top:14%;}
.viz-airbnb-normalize .l2{top:38%;}
.viz-airbnb-normalize .l3{top:62%;}
.viz-airbnb-normalize .l4{top:86%;}
.viz-airbnb-normalize .l1::after{animation-delay:0s;}
.viz-airbnb-normalize .l2::after{animation-delay:.25s;}
.viz-airbnb-normalize .l3::after{animation-delay:.5s;}
.viz-airbnb-normalize .l4::after{animation-delay:.75s;}
.viz-airbnb-normalize .tables{display:flex;flex-direction:column;gap:6px;min-width:0;}
.viz-airbnb-normalize .tbl{font-size:8px;color:var(--ink);background:var(--card);border:1px solid var(--line);border-radius:6px;padding:3px 6px;letter-spacing:.3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.viz-airbnb-normalize .tbl::before{content:"";display:inline-block;width:5px;height:5px;border-radius:1px;background:var(--accent);margin-right:5px;vertical-align:middle;}
@keyframes vk_airbnb_normalize_flow{0%{left:-30%;}45%{left:100%;}100%{left:100%;}}
@keyframes vk_airbnb_normalize_fill{0%,100%{opacity:.4;}50%{opacity:.9;}}
@keyframes vk_airbnb_normalize_pulse{0%,100%{opacity:.4;}50%{opacity:1;}}
@media (prefers-reduced-motion:reduce){.viz-airbnb-normalize *{animation:none!important;}.viz-airbnb-normalize .ln::after{left:40%;}.viz-airbnb-normalize .cell{opacity:.7;}}

/* ----- spotify-tail ----- */
.viz-spotify-tail{width:100%;min-width:0;box-sizing:border-box;display:flex;align-items:center;justify-content:center;padding:14px 10px;font-family:var(--font-mono)}
.viz-spotify-tail .vstage{width:100%;min-width:0;display:flex;flex-direction:column;gap:10px;align-items:center}
.viz-spotify-tail .grid{width:100%;min-width:0;display:grid;grid-template-columns:repeat(10,1fr);gap:6px}
.viz-spotify-tail .slot{position:relative;height:48px;border:1px solid var(--line);border-radius:6px;background:var(--soft);display:flex;align-items:flex-end;justify-content:center;overflow:hidden}
.viz-spotify-tail .blk{display:block;width:78%;border-radius:4px;background:var(--accent-soft);border:1px solid var(--accent);box-sizing:border-box;animation:vk_spotify_tail_drop 3.5s ease-in-out var(--d) infinite}
.viz-spotify-tail .b1{--h:34%}
.viz-spotify-tail .b2{--h:58%}
.viz-spotify-tail .b3{--h:82%}
.viz-spotify-tail .blk{height:var(--h)}
.viz-spotify-tail .cap{display:flex;align-items:center;gap:6px;font-size:10px;color:var(--muted)}
.viz-spotify-tail .dot{width:6px;height:6px;border-radius:50%;background:var(--good);animation:vk_spotify_tail_pulse 2.4s ease-in-out infinite}
.viz-spotify-tail .lbl{letter-spacing:.04em}
@keyframes vk_spotify_tail_drop{0%{transform:translateY(-150%);opacity:0}14%{transform:translateY(0);opacity:1}88%{transform:translateY(0);opacity:1}100%{transform:translateY(0);opacity:1}}
@keyframes vk_spotify_tail_pulse{0%,100%{opacity:.4}50%{opacity:1}}
@media(prefers-reduced-motion:reduce){.viz-spotify-tail .blk,.viz-spotify-tail .dot{animation:none}.viz-spotify-tail .blk{opacity:1;transform:none}}

/* ----- cloudflare-ratelimit ----- */
.viz-cloudflare-ratelimit{width:100%;min-width:0;}
.viz-cloudflare-ratelimit .rl-stage{display:flex;align-items:center;width:100%;min-width:0;height:120px;gap:0;font-family:var(--font-mono);}
.viz-cloudflare-ratelimit .rl-source{position:relative;flex:0 0 22%;height:84px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;}
.viz-cloudflare-ratelimit .rl-srclabel{font-size:9px;color:var(--muted);letter-spacing:.05em;margin-bottom:6px;}
.viz-cloudflare-ratelimit .rl-tok{position:absolute;left:0;font-size:9px;color:var(--accent);background:var(--accent-soft);border:1px solid var(--line);border-radius:5px;padding:2px 5px;opacity:0;}
.viz-cloudflare-ratelimit .rl-t1{top:6px;animation:vk_cloudflare_ratelimit_emit 4.4s ease-in-out infinite;}
.viz-cloudflare-ratelimit .rl-t2{top:30px;animation:vk_cloudflare_ratelimit_emit 4.4s ease-in-out infinite 1.1s;}
.viz-cloudflare-ratelimit .rl-t3{top:54px;animation:vk_cloudflare_ratelimit_emit 4.4s ease-in-out infinite 2.2s;}
.viz-cloudflare-ratelimit .rl-t4{top:78px;animation:vk_cloudflare_ratelimit_emit 4.4s ease-in-out infinite 3.3s;}
.viz-cloudflare-ratelimit .rl-rail{flex:1 1 0;min-width:0;height:0;border-top:1px dashed var(--line);position:relative;}
.viz-cloudflare-ratelimit .rl-rail::after{content:"";position:absolute;top:-3px;left:0;width:6px;height:6px;border-radius:50%;background:var(--accent);opacity:0;animation:vk_cloudflare_ratelimit_travel 4.4s linear infinite;}
.viz-cloudflare-ratelimit .rl-rail2::after{animation:vk_cloudflare_ratelimit_travel2 4.4s linear infinite;}
.viz-cloudflare-ratelimit .rl-gate{flex:0 0 24%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:8px 4px;}
.viz-cloudflare-ratelimit .rl-gatelabel{font-size:9px;color:var(--muted);letter-spacing:.04em;}
.viz-cloudflare-ratelimit .rl-bucket{width:42px;height:34px;background:var(--soft);border:1px solid var(--line);border-radius:4px;overflow:hidden;display:flex;align-items:flex-end;}
.viz-cloudflare-ratelimit .rl-fill{width:100%;background:var(--accent-soft);border-top:1px solid var(--accent);animation:vk_cloudflare_ratelimit_bucket 4.4s ease-in-out infinite;}
.viz-cloudflare-ratelimit .rl-meter{font-size:9px;color:var(--ink);}
.viz-cloudflare-ratelimit .rl-out{flex:0 0 16%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;}
.viz-cloudflare-ratelimit .rl-passdot{width:9px;height:9px;border-radius:50%;background:var(--good);animation:vk_cloudflare_ratelimit_pulse 4.4s ease-in-out infinite;}
.viz-cloudflare-ratelimit .rl-passlabel{font-size:9px;color:var(--muted);}
@keyframes vk_cloudflare_ratelimit_emit{0%,8%{opacity:0;transform:translateX(0);}14%{opacity:1;}26%{opacity:1;transform:translateX(14px);}34%,100%{opacity:0;transform:translateX(20px);}}
@keyframes vk_cloudflare_ratelimit_travel{0%,12%{opacity:0;left:0;}16%{opacity:1;}48%{opacity:1;left:calc(100% - 6px);}52%,100%{opacity:0;}}
@keyframes vk_cloudflare_ratelimit_travel2{0%,50%{opacity:0;left:0;}56%{opacity:1;}82%{opacity:1;left:calc(100% - 6px);}86%,100%{opacity:0;}}
@keyframes vk_cloudflare_ratelimit_bucket{0%{height:30%;}45%{height:75%;}55%{height:35%;}100%{height:30%;}}
@keyframes vk_cloudflare_ratelimit_pulse{0%,55%{transform:scale(1);opacity:.55;}70%{transform:scale(1.35);opacity:1;}85%,100%{transform:scale(1);opacity:.55;}}