.kafka-fig{color:var(--hv-ink);font-family:var(--hv-sans);gap:var(--space-stack-xl);letter-spacing:var(--text-body-tracking);display:grid;container-type:inline-size}.kafka-fig :where(p,ul,ol){margin:0;padding:0}.kafka-fig.kafka-fig :where(ul,ol),.kafka-fig--compare.kafka-fig--compare .site-v2-kafka__bars{padding:0;list-style:none}.kafka-fig.kafka-fig li,.kafka-fig.kafka-fig li>*{margin-top:0}.kafka-fig__head{align-items:center;gap:var(--space-stack-lg) var(--space-inline-xl);flex-wrap:wrap;justify-content:space-between;display:flex}.kafka-fig__copy{gap:var(--space-stack-xs);flex:18rem;display:grid}.kafka-fig .kafka-fig__title{color:var(--hv-ink);font-size:var(--text-body-lg-size);font-weight:500;line-height:var(--text-small-leading)}.kafka-fig .kafka-fig__sub{color:var(--hv-ink-muted);font-size:var(--text-body-size);line-height:var(--text-small-leading)}.kafka-fig .kafka-fig__note{color:var(--hv-ink-muted);font-size:var(--text-small-size);line-height:var(--text-body-leading)}.kafka-fig .kafka-fig__note a{color:var(--hv-ink);text-decoration:underline;text-decoration-thickness:1px;-webkit-text-decoration-color:var(--hv-rule-strong);text-decoration-color:var(--hv-rule-strong);text-underline-offset:3px}.kafka-fig__pills{border:1px solid var(--hv-rule-edge);gap:var(--space-inline-xs);padding:var(--space-inline-xs);border-radius:999px;flex:none;display:inline-flex}.kafka-fig .kafka-fig__pills button{color:var(--hv-ink-secondary);cursor:pointer;font:inherit;font-size:var(--text-body-size);font-variant-numeric:tabular-nums;min-height:2.25rem;padding-inline:var(--space-inline-lg);white-space:nowrap;transition:background-color var(--hv-dur-feedback) var(--hv-ease-response), color var(--hv-dur-feedback) var(--hv-ease-response);background:0 0;border:0;border-radius:999px}@media (hover:hover) and (pointer:fine){.kafka-fig .kafka-fig__pills button:hover{background:var(--hv-surface);color:var(--hv-ink)}}.kafka-fig .kafka-fig__pills button[aria-pressed=true]{background:var(--hv-ink);color:var(--hv-bg)}.kafka-fig .kafka-fig__pills button:focus-visible{outline-offset:2px}.kafka-fig__sr{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.kafka-fig__chart{--name:5.5rem;--value:2.5rem;--col-gap:var(--space-inline-lg);border-block:1px solid var(--hv-rule);gap:var(--space-stack-lg);padding-block:var(--space-stack-xl);display:grid;position:relative}.kafka-fig__chart:after{border-left:1px dashed var(--hv-ink-muted);bottom:var(--space-stack-lg);content:"";top:var(--space-stack-lg);left:calc(var(--name) + var(--col-gap) + (100% - var(--name) - var(--value) - 2 * var(--col-gap)) * var(--even));transition:left .6s var(--hv-ease-grow);position:absolute}.kafka-fig__group{gap:var(--space-stack-sm);display:grid}.kafka-fig .kafka-fig__group-name{color:var(--hv-ink-secondary);font-size:var(--text-small-size)}.kafka-fig .kafka-fig__group[data-added] .kafka-fig__group-name{color:var(--hv-label,var(--hv-accent-mark,var(--hv-green)));font-weight:500}.kafka-fig__rows{gap:var(--space-stack-sm);display:grid}.kafka-fig__row{align-items:center;column-gap:var(--col-gap);grid-template-columns:var(--name) minmax(0, 1fr) var(--value);display:grid}.kafka-fig__name{color:var(--hv-ink-secondary);font-size:var(--text-body-size);white-space:nowrap}.kafka-fig__track{height:1rem;display:block}.kafka-fig__fill{background:var(--hv-rule-strong);min-width:2px;height:100%;transition:width .6s var(--hv-ease-grow);width:calc(var(--w) * 100%);display:block}.kafka-fig__group[data-added] .kafka-fig__fill{background:var(--hv-green)}.kafka-fig__value{color:var(--hv-ink);font-size:var(--text-body-size);font-variant-numeric:tabular-nums;justify-self:end;font-weight:460}.kafka-fig__brokers{border-top:1px solid var(--hv-rule);gap:var(--space-stack-xl) var(--space-inline-lg);grid-template-columns:repeat(var(--brokers), minmax(0, 1fr));padding-top:var(--space-stack-lg);display:grid}.kafka-fig__broker{align-content:start;gap:var(--space-stack-sm);min-width:0;display:grid}.kafka-fig__broker-name{color:var(--hv-ink);font-size:var(--text-body-size);white-space:nowrap;font-weight:500}.kafka-fig__broker-state{color:var(--hv-ink-muted);font-size:var(--text-small-size);white-space:nowrap}.kafka-fig__broker[data-state=down] .kafka-fig__broker-state{color:var(--hv-ink);font-weight:500}.kafka-fig__broker[data-state=catching-up] .kafka-fig__broker-state{color:var(--hv-label,var(--hv-accent-mark,var(--hv-green)));font-weight:500}.kafka-fig__chips{gap:var(--space-inline-xs);flex-wrap:wrap;min-height:1.5rem;display:flex}.kafka-fig__chip{border:1px solid var(--hv-rule-strong);color:var(--hv-ink-secondary);font-family:var(--hv-mono);font-size:var(--text-caption-size);height:1.5rem;letter-spacing:var(--primitive-tracking-mono-label,.03em);min-width:1.75rem;transition:background-color var(--hv-dur-control) var(--hv-ease-response), border-color var(--hv-dur-control) var(--hv-ease-response), opacity var(--hv-dur-control) var(--hv-ease-response);justify-content:center;align-items:center;display:inline-flex}.kafka-fig__chip[data-leader]{background:var(--hv-green);border-color:var(--hv-green);color:var(--hv-on-accent)}.kafka-fig__broker[data-state=down] .kafka-fig__chip{opacity:.35}.kafka-fig__broker[data-state=catching-up] .kafka-fig__chip{border-style:dashed}.kafka-fig__node{color:var(--hv-ink-muted);font-size:var(--text-caption-size);white-space:nowrap}.kafka-fig__stepper{gap:var(--space-stack-md);display:grid}.kafka-fig__steps{gap:var(--space-inline-sm);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.kafka-fig .kafka-fig__steps button{border:0;border-top:2px solid var(--hv-rule);color:var(--hv-ink-muted);cursor:pointer;font:inherit;font-size:var(--text-small-size);padding:var(--space-stack-sm) 0 0;text-align:left;width:100%;transition:border-color var(--hv-dur-control) var(--hv-ease-response), color var(--hv-dur-feedback) var(--hv-ease-response);background:0 0;border-radius:0}.kafka-fig .kafka-fig__steps button[data-done]{border-top-color:var(--hv-green)}.kafka-fig .kafka-fig__steps button[aria-current=step]{border-top-color:var(--hv-green);color:var(--hv-ink);font-weight:500}@media (hover:hover) and (pointer:fine){.kafka-fig .kafka-fig__steps button:hover{color:var(--hv-ink)}}.kafka-fig .kafka-fig__steps button:focus-visible{outline-offset:2px}.kafka-fig .kafka-fig__caption{color:var(--hv-ink-secondary);font-size:var(--text-body-lg-size);line-height:var(--text-body-leading);text-wrap:pretty;min-height:3lh}.kafka-fig__auth{border-collapse:collapse;table-layout:fixed;width:100%}.kafka-fig .kafka-fig__auth :is(th,td){border-top:1px solid var(--hv-rule);color:var(--hv-ink);padding:var(--space-stack-lg) 0;text-align:left;vertical-align:top;font-weight:420}.kafka-fig .kafka-fig__auth :is(th,td)+:is(th,td){padding-left:var(--space-inline-lg)}.kafka-fig .kafka-fig__auth thead th{color:var(--hv-ink-muted);font-size:var(--text-small-size);padding-block:0 var(--space-stack-sm);border-top:0}.kafka-fig .kafka-fig__auth thead th:first-child{width:8.5rem}.kafka-fig .kafka-fig__auth tbody tr:last-child>*{border-bottom:1px solid var(--hv-rule)}.kafka-fig__auth-name{color:var(--hv-ink);font-size:var(--text-body-size);font-weight:500;display:block}.kafka-fig__auth-note{color:var(--hv-ink-muted);font-size:var(--text-small-size);line-height:var(--text-small-leading);display:block}.kafka-fig__marks{align-items:flex-end;gap:var(--space-inline-xs);flex-wrap:wrap;min-height:1rem;display:flex}.kafka-fig__mark{background:var(--hv-rule-strong);width:.375rem;height:.375rem;display:block}.kafka-fig__mark[data-heavy]{background:var(--hv-green);width:1rem;height:1rem}.kafka-fig__auth-work{color:var(--hv-ink-secondary);font-size:var(--text-small-size);line-height:var(--text-small-leading);padding-top:var(--space-stack-sm);display:block}.kafka-fig__auth td[data-heavy] .kafka-fig__auth-work{color:var(--hv-ink)}.kafka-fig--compare .site-v2-kafka__bar-row{padding-block:var(--space-stack-xl)}@container (min-width:36rem){.kafka-fig--compare .site-v2-kafka__bar-row{grid-template-columns:7rem minmax(0,1fr)}.kafka-fig--compare .site-v2-kafka__key{grid-column:2}}@container (max-width:35.99rem){.kafka-fig--compare .site-v2-kafka__bar-row{grid-template-columns:minmax(0,1fr)}.kafka-fig--compare .site-v2-kafka__key{grid-column:auto}}.kafka-fig__cpu{gap:var(--space-stack-sm);display:grid}.kafka-fig__readout{color:var(--hv-ink-secondary);font-size:var(--text-small-size);align-items:baseline;gap:var(--space-stack-xs) var(--space-inline-lg);flex-wrap:wrap;display:flex}.kafka-fig__readout-time{color:var(--hv-ink);font-variant-numeric:tabular-nums;min-width:4.5em;font-weight:500}.kafka-fig__readout-item{align-items:baseline;gap:var(--space-inline-xs);white-space:nowrap;display:inline-flex}.kafka-fig__readout-value{color:var(--hv-ink);font-variant-numeric:tabular-nums;font-weight:500}.kafka-fig__swatch{background:var(--hv-ink-muted);align-self:center;width:.875rem;height:2px;display:inline-block}.kafka-fig__readout-item[data-lead] .kafka-fig__swatch{background:var(--hv-green)}.kafka-fig__plot-row{gap:var(--space-inline-sm);grid-template-columns:2.75rem minmax(0,1fr);display:grid}.kafka-fig__yaxis,.kafka-fig__xaxis{color:var(--hv-ink-muted);font-size:var(--text-small-size);font-variant-numeric:tabular-nums;position:relative}.kafka-fig__yaxis span{right:0;top:calc((1 - var(--at)) * 100%);line-height:1;position:absolute;transform:translateY(-50%)}.kafka-fig__xaxis{height:1.25em;margin-left:calc(2.75rem + var(--space-inline-sm))}.kafka-fig__xaxis span{left:calc(var(--at) * 100%);white-space:nowrap;position:absolute;transform:translate(-50%)}.kafka-fig__plot{height:15rem;position:relative}.kafka-fig__plot svg{width:100%;height:100%;display:block;overflow:visible}.kafka-fig__grid{stroke:var(--hv-rule);stroke-width:1px}.kafka-fig__threshold{stroke:var(--hv-ink-muted);stroke-dasharray:4 4;stroke-width:1px}.kafka-fig__threshold-label{background:var(--hv-bg);color:var(--hv-ink-muted);font-size:var(--text-small-size);padding-left:var(--space-inline-xs);right:0;top:calc((1 - var(--at)) * 100%);line-height:1;position:absolute;transform:translateY(-50%)}.kafka-fig .kafka-fig__lines{clip-path:inset(-4px 100% -4px 0);transition:clip-path 1.6s var(--hv-ease-grow);position:absolute;inset:0}.kafka-fig[data-revealed] .kafka-fig__lines{clip-path:inset(-4px 0)}.kafka-fig__line{fill:none;stroke:var(--hv-ink-muted);stroke-linejoin:round;stroke-width:1.25px}.kafka-fig__line[data-lead]{stroke:var(--hv-green);stroke-width:2px}.kafka-fig__playhead{stroke:var(--hv-ink);stroke-width:1px}.kafka-fig__dot{background:var(--hv-bg);border:2px solid var(--hv-ink-muted);height:.625rem;left:calc(var(--x) * 100%);pointer-events:none;top:calc((1 - var(--y)) * 100%);border-radius:50%;width:.625rem;position:absolute;transform:translate(-50%,-50%)}.kafka-fig__dot[data-lead]{border-color:var(--hv-green)}.kafka-fig .kafka-fig__scrub{appearance:none;cursor:crosshair;opacity:0;touch-action:pan-y;background:0 0;width:100%;height:100%;margin:0;position:absolute;inset:0}.kafka-fig__plot:has(.kafka-fig__scrub:focus-visible){outline:2px solid var(--hv-green);outline-offset:4px}@container (max-width:34rem){.kafka-fig__pills{width:100%;display:flex}.kafka-fig .kafka-fig__pills button{padding-inline:var(--space-inline-sm);flex:1}.kafka-fig__chart{--name:4.5rem;--col-gap:var(--space-inline-md)}.kafka-fig .kafka-fig__caption{min-height:4lh}.kafka-fig .kafka-fig__auth thead th:first-child{width:5.5rem}.kafka-fig .kafka-fig__auth :is(th,td)+:is(th,td){padding-left:var(--space-inline-md)}.kafka-fig__plot{height:11rem}}@media (prefers-reduced-motion:reduce){.kafka-fig .kafka-fig__pills button,.kafka-fig__chip,.kafka-fig .kafka-fig__steps button,.kafka-fig__fill,.kafka-fig__chart:after,.kafka-fig .kafka-fig__lines{transition:none}.kafka-fig .kafka-fig__lines{clip-path:none}}
