.viz-card{--viz-card-pad:clamp(12px, 2.5vw + 4px, 20px);--viz-card-bleed:var(--figure-bleed,var(--page-bleed,0px));--viz-inset:clamp(0px, 18px - 2.8125vw, 9px);--viz-node-font:clamp(11px, .625vw + 9px, var(--type-diagram,13px));--viz-node-pad:clamp(8px, 1.25vw + 4px, 12px);--viz-badge-size:clamp(14px, 1.25vw + 10px, 18px);--viz-badge-out:clamp(6px, 1.875vw, 12px);margin:2rem var(--viz-card-bleed,0px);padding:var(--viz-card-pad,20px);border:1px solid var(--line);background:var(--bg-card);box-shadow:var(--shadow);border-radius:6px;transition:background .35s,border-color .35s}.viz-card--hero{--viz-card-bleed:var(--page-bleed,0px);--type-diagram:13px;--type-caption:14px;--type-legend:12px;margin:0 var(--viz-card-bleed,0px);box-shadow:none;background:0 0;border:0;border-radius:0;padding:0}.viz-card__kicker{font-family:var(--font-sans);letter-spacing:.18em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:12px;font-size:12px;display:block}viz-player{display:block}.viz-legend{font-family:var(--font-sans);font-size:var(--type-legend,12px);color:var(--ink-faint);margin:-2px 0 10px;line-height:1.5}.viz-legend__dot{color:var(--accent)}.viz-scene{border:1px solid var(--line);background-color:var(--viz-stage);background-image:radial-gradient(var(--viz-dot) 1px, transparent 1px);background-position:8px 8px;background-size:16px 16px;border-radius:4px;transition:background-color .35s,border-color .35s;position:relative;overflow:hidden}.viz-scene__field{inset:0 var(--viz-inset,0px);position:absolute}.viz-lanes{position:absolute;inset:0}.viz-lanes:before{content:"";border-top:1px dashed var(--line);transition:border-color .35s;position:absolute;top:50%;left:0;right:0}.viz-lanes__label{font-family:var(--font-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint);margin:0;font-size:11px;line-height:1;position:absolute;left:10px}.viz-lanes__label--top{top:9px}.viz-lanes__label--bottom{bottom:9px}.viz-scene__edges{width:100%;height:100%;position:absolute;inset:0}.viz-edge line{stroke:var(--ink-faint);stroke-opacity:calc(var(--viz-edge-ink,.45) * var(--viz-edge-fade,1));stroke-width:1px;transition:stroke .35s,stroke-opacity .25s}.viz-arrowhead{fill:var(--ink-faint);fill-opacity:.45}.viz-scene__edges .viz-arrowhead{fill:context-stroke}.viz-scene [data-viz-tone=caution]{--viz-tone:var(--tone-caution)}.viz-scene [data-viz-tone=safe]{--viz-tone:var(--tone-safe)}.viz-scene [data-viz-tone=warn]{--viz-tone:var(--tone-warn)}.viz-scene [data-viz-tone=inactive]{--viz-tone:var(--tone-inactive)}.viz-edge[data-viz-tone] line{stroke:var(--viz-tone);--viz-edge-ink:1}.viz-node{z-index:2;padding:8px var(--viz-node-pad,12px);border:1.5px solid var(--ink);background:var(--bg-card);box-shadow:var(--shadow);color:var(--ink);font-family:var(--font-sans);font-size:var(--viz-node-font,13px);white-space:nowrap;border-radius:3px;line-height:1;transition:border-color .35s,background .35s,color .35s,box-shadow .35s,opacity .28s;position:absolute;transform:translate(-50%,-50%)}.viz-node--circle{aspect-ratio:1;border-radius:50%;place-items:center;padding:8px;display:grid}.viz-node--pill{padding:8px calc(var(--viz-node-pad,12px) + 4px);border-radius:999px}.viz-node--cylinder{padding:19px var(--viz-node-pad,12px) 11px;background:var(--bg-code);border-radius:50%/9px}.viz-node--cylinder:before{content:"";border:1.5px solid var(--ink);background:var(--bg-code);border-radius:50%;height:18px;transition:border-color .35s,background .35s;position:absolute;top:-1.5px;left:-1.5px;right:-1.5px}.viz-node--queue{padding:7px var(--viz-node-pad,12px) 13px;background-image:linear-gradient(to right, transparent calc(25% - .75px), var(--line) calc(25% - .75px) calc(25% + .75px), transparent calc(25% + .75px) calc(50% - .75px), var(--line) calc(50% - .75px) calc(50% + .75px), transparent calc(50% + .75px) calc(75% - .75px), var(--line) calc(75% - .75px) calc(75% + .75px), transparent calc(75% + .75px)), linear-gradient(var(--bg-code), var(--bg-code));background-position:0 100%,0 100%;background-repeat:no-repeat;background-size:100% 13px,100% 13px}.viz-node[data-viz-tone],.viz-node--cylinder[data-viz-tone]:before{border-color:var(--viz-tone)}.viz-node[data-viz-tone=inactive]{box-shadow:none;color:var(--ink-faint)}.viz-node.is-glow{box-shadow:0 0 0 3px color-mix(in srgb, var(--viz-glow,var(--accent)) 22%, transparent), var(--shadow)}.viz-node.is-glow:not([data-viz-tone]){border-color:var(--viz-glow,var(--accent))}.viz-node.is-flash{border-color:var(--viz-flash,var(--accent));box-shadow:0 0 0 3px color-mix(in srgb, var(--viz-flash,var(--accent)) 34%, transparent), var(--shadow);animation:.6s ease-out viz-flash}@keyframes viz-flash{0%{box-shadow:0 0 0 0 color-mix(in srgb, var(--viz-flash,var(--accent)) 55%, transparent), var(--shadow)}to{box-shadow:0 0 0 10px transparent, var(--shadow)}}.viz-scene[data-viz-transit] .viz-node:not(.is-path):not(.is-glow):not(.is-flash){opacity:.78}.viz-scene[data-viz-transit] .viz-edge:not(.is-live){--viz-edge-fade:.75}.viz-edge.is-live line{stroke:var(--viz-live,var(--accent));stroke-opacity:1;stroke-width:1.5px}.viz-node__count{top:calc(var(--viz-badge-size,18px) / -2);right:calc(-1 * var(--viz-badge-out,12px));z-index:3;min-width:var(--viz-badge-size,18px);height:var(--viz-badge-size,18px);background:var(--accent);color:var(--bg);font-family:var(--font-sans);font-size:10px;font-weight:700;line-height:var(--viz-badge-size,18px);text-align:center;opacity:0;border-radius:999px;padding:0 4px;transition:opacity .25s cubic-bezier(.34,1.56,.64,1),transform .25s cubic-bezier(.34,1.56,.64,1);position:absolute;transform:scale(.5)}.viz-node__count.is-on{opacity:1;transform:scale(1)}.viz-node--cylinder .viz-node__count{top:3px;right:calc(3px - var(--viz-badge-out,12px))}.viz-node--pill .viz-node__count{top:calc(2px - var(--viz-badge-size,18px) / 2);right:calc(4px - var(--viz-badge-out,12px))}.viz-bars{grid-template-columns:auto 1fr auto;align-content:space-evenly;align-items:center;column-gap:8px;padding:4px 2px;display:grid;position:absolute;inset:0}.viz-bar{display:contents}.viz-bar>*{transition:opacity .28s}.viz-bar__label{color:var(--ink);font-family:var(--font-sans);font-size:var(--viz-node-font,13px);white-space:nowrap;line-height:1}.viz-bar__track{background:var(--bg-code);border-radius:3px;height:18px;overflow:hidden}.viz-bar__fill{background:var(--accent);border-radius:3px;height:100%;display:block}.viz-bar__value{min-width:calc(var(--viz-bar-digits,3) * 1ch);color:var(--ink);font-family:var(--font-sans);font-size:var(--viz-node-font,13px);font-variant-numeric:tabular-nums;text-align:right;line-height:1}.viz-scene[data-viz-transit] .viz-bar:not(.is-path)>*{opacity:.78}.viz-queues{grid-template-columns:auto 1fr;align-content:space-evenly;align-items:center;column-gap:8px;padding:4px 2px;display:grid;position:absolute;inset:0}.viz-queue{display:contents}.viz-queue>*{transition:opacity .28s}.viz-queue__label{color:var(--ink);font-family:var(--font-sans);font-size:var(--viz-node-font,13px);white-space:nowrap;line-height:1}.viz-queue__lane{background:var(--bg-code);border-radius:3px;justify-content:flex-start;align-items:center;gap:5px;max-width:380px;min-height:26px;padding:0 5px;display:flex;overflow:hidden}.viz-queue__chip{border:1.5px solid var(--ink);background:var(--bg-card);color:var(--ink);font-family:var(--font-sans);white-space:nowrap;border-radius:999px;flex:none;padding:3px 7px;font-size:11px;line-height:1.2}.viz-queue__chip[data-viz-tone]{border-color:var(--viz-tone)}.viz-scene[data-viz-transit] .viz-queue:not(.is-path)>*{opacity:.78}.viz-ledger{padding:6px 4px;position:absolute;inset:0;overflow:hidden}.viz-ledger__table{border-collapse:collapse;background:var(--bg-card);border:1px solid var(--line);width:100%;max-width:560px;font-family:var(--font-sans);font-variant-numeric:tabular-nums;border-radius:3px;margin:0 auto}.viz-ledger__head{border-bottom:1px solid var(--line);color:var(--ink-faint);letter-spacing:.06em;text-align:right;text-transform:uppercase;padding:0 6px 5px;font-size:10px;font-weight:600}.viz-ledger__cell{color:var(--ink);text-align:right;white-space:nowrap;padding:4px 6px;font-size:12px;line-height:1.25}.viz-ledger__head--first,.viz-ledger__cell--first{text-align:left;width:1%}.viz-ledger__row[data-viz-ledger-state=open] .viz-ledger__cell{border-bottom:1px dashed var(--ink-faint);color:var(--ink-soft)}.viz-ledger__row[data-viz-ledger-state] .viz-ledger__cell--first{color:var(--viz-tone,var(--ink))}.viz-ledger__row[data-viz-ledger-state=rollback] .viz-ledger__cell{color:var(--ink-faint);text-decoration:line-through;text-decoration-color:var(--viz-tone);text-decoration-thickness:1.5px}.viz-ledger__row[data-viz-ledger-state=rollback] .viz-ledger__cell--first{color:var(--viz-tone)}.viz-ledger__cell{transition:color .3s,border-color .3s}@media (prefers-reduced-motion:reduce){.viz-ledger__cell{transition:none}}.viz-scene[data-viz-sweep] .viz-token{opacity:0;transition:opacity .35s}.viz-scene[data-viz-sweep] .viz-bar__fill{transition:width .35s}.viz-tokens{z-index:1;position:absolute;inset:0}.viz-token{background:var(--accent);border-radius:50%;width:12px;height:12px;position:absolute;transform:translate(-50%,-50%)}.viz-token[data-viz-tone]{background:var(--viz-tone)}.viz-caption{min-height:3em;font-family:var(--font-sans);font-size:var(--type-caption,14px);color:var(--ink-soft);margin-top:12px;line-height:1.5;position:relative}.viz-caption.is-conclusion{color:var(--ink)}.viz-caption.is-conclusion:before{content:"";background:var(--accent);width:28px;height:2px;position:absolute;top:-8px;left:0}.viz-controls{flex-direction:column;gap:8px;margin-top:12px;display:flex}.viz-controls__row{align-items:center;gap:8px;display:flex}.viz-controls__row--primary{flex-wrap:nowrap}.viz-controls__row--secondary{flex-wrap:wrap;row-gap:8px}.viz-controls__button{border:1px solid var(--ink);color:var(--ink);font-family:var(--font-sans);white-space:nowrap;cursor:pointer;background:0 0;border-radius:3px;padding:6px 15px;font-size:13px;line-height:1.4;transition:background .15s,color .15s,border-color .35s}.viz-controls__button:hover:not(:disabled){background:var(--ink);color:var(--bg-card)}.viz-controls__button:disabled{opacity:.45;cursor:default}.viz-controls__button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.viz-controls__button--play{border-color:var(--accent);background:var(--accent);color:var(--bg)}.viz-controls__button--play:hover:not(:disabled){border-color:var(--accent-strong);background:var(--accent-strong);color:var(--bg)}.viz-controls__button--reset{color:var(--ink-soft);border-color:#0000;padding:6px 11px}.viz-controls__button--reset:hover:not(:disabled){border-color:var(--ink-soft);color:var(--ink);background:0 0}.viz-controls__counter{min-width:10.5ch;font-family:var(--font-sans);font-variant-numeric:tabular-nums;color:var(--ink-faint);text-align:right;white-space:nowrap;margin-left:auto;font-size:12px;line-height:1.4}.viz-speed{border:1px solid var(--line);border-radius:3px;flex:none;margin-left:auto;transition:border-color .35s;display:flex}.viz-speed__option{padding:4px var(--viz-speed-pad,6px);color:var(--ink-faint);font-family:var(--font-sans);font-size:var(--viz-speed-font,11px);font-variant-numeric:tabular-nums;white-space:nowrap;cursor:pointer;background:0 0;border:0;line-height:1.4;transition:background .15s,color .15s}.viz-speed__option:first-child{border-radius:2px 0 0 2px}.viz-speed__option:last-child{border-radius:0 2px 2px 0}.viz-speed__option+.viz-speed__option{border-left:1px solid var(--line)}.viz-speed__option:hover{color:var(--ink)}.viz-speed__option[aria-pressed=true]{background:var(--accent-soft);color:var(--accent-strong);font-weight:600}.viz-speed__option:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.viz-controls__actions{border-left:1px solid var(--line);flex-wrap:wrap;align-self:stretch;align-items:center;gap:8px;padding-left:12px;transition:border-color .35s;display:flex}.viz-controls__button--action,.viz-card--hero .viz-controls__button--step{border-color:var(--line);color:var(--ink-soft);padding:5px 12px;font-size:12px}.viz-controls__button--action:hover:not(:disabled),.viz-card--hero .viz-controls__button--step:hover:not(:disabled){border-color:var(--ink-soft);color:var(--ink);background:0 0}.viz-card--hero .viz-controls__button{padding:5px 12px;font-size:12px}.viz-card--hero .viz-controls__counter{display:none}@media (width<=639px){.viz-controls__row--secondary{--viz-speed-font:10px;--viz-speed-pad:4px;gap:6px}.viz-controls__button--reset{padding:6px 8px}.viz-controls__actions{padding-left:10px}.viz-controls__button--action{padding:5px 10px}}@media (prefers-reduced-motion:reduce){.viz-controls__button--play{display:none}.viz-node.is-flash{animation:none}}