.article-page .variability-loads,.article-page .variability-strips{display:grid;grid-gap:var(--cf-space-100);gap:var(--cf-space-100)}.article-page .variability-row,.article-page .variability-strip-row{display:grid;grid-template-columns:var(--cf-space-400) minmax(0,1fr) auto;grid-gap:var(--cf-space-200);gap:var(--cf-space-200);align-items:center}.article-page .variability-strip-row{grid-template-columns:calc(var(--cf-space-2000)*1.2) minmax(0,1fr) auto;gap:var(--cf-space-300)}.article-page .variability-number,.article-page .variability-strip-label,.article-page .variability-time{color:var(--cf-color-text-secondary);font-size:var(--cf-font-size-200)}.article-page .variability-number,.article-page .variability-time{font-family:var(--cf-font-mono);text-align:end}.article-page .variability-lane,.article-page .variability-strip{position:relative;display:block;block-size:var(--cf-space-300);border-radius:var(--cf-radius-050);background:var(--cf-color-surface-raised)}.article-page .variability-strip{block-size:var(--cf-space-500)}.article-page .variability-startup{position:absolute;inset-block:0;min-inline-size:var(--cf-space-050);border-radius:var(--cf-radius-050);background:var(--cf-color-success)}.article-page .variability-dot.is-short,.article-page .variability-row.is-short .variability-startup,.article-page .variability-swatch.is-short{background:var(--cf-color-warning)}.article-page .variability-dot.is-long,.article-page .variability-row.is-long .variability-startup,.article-page .variability-swatch.is-long{background:var(--cf-color-danger)}.article-page .variability-lcp,.article-page .variability-swatch.is-lcp{background:var(--cf-color-text-strong)}.article-page .variability-lcp{position:absolute;inset-block:calc(var(--cf-space-050)*-1);inline-size:var(--cf-space-100)}.article-page .variability-key{display:flex;flex-wrap:wrap;gap:var(--cf-space-100) var(--cf-space-200);align-items:center;margin:var(--cf-space-100) 0 0;color:var(--cf-color-text-secondary);font-size:var(--cf-font-size-200)}.article-page .variability-swatch{display:inline-block;inline-size:var(--cf-space-300);block-size:var(--cf-space-200);border-radius:var(--cf-radius-050);background:var(--cf-color-success)}.article-page .variability-swatch.is-lcp{inline-size:var(--cf-space-100);block-size:var(--cf-space-300)}.article-page .variability-swatch.is-median{block-size:var(--cf-space-050);background:var(--cf-color-text-strong)}.article-page .variability-chart{position:relative;block-size:calc(var(--cf-space-2000)*3);-webkit-margin-start:var(--cf-space-500);margin-inline-start:var(--cf-space-500);-webkit-border-after:1px solid var(--cf-color-border);border-block-end:1px solid var(--cf-color-border)}.article-page .variability-gridline{position:absolute;inset-inline:0;-webkit-border-before:1px dashed var(--cf-color-border);border-block-start:1px dashed var(--cf-color-border)}.article-page .variability-gridline span{position:absolute;inset-inline-end:calc(100% + var(--cf-space-100));transform:translateY(-50%);color:var(--cf-color-text-secondary);font-family:var(--cf-font-mono);font-size:var(--cf-font-size-200)}.article-page .variability-dot{position:absolute;inline-size:var(--cf-space-150);block-size:var(--cf-space-150);border-radius:var(--cf-radius-full);background:var(--cf-color-success);transform:translate(-50%,50%)}.article-page .variability-median{position:absolute;block-size:var(--cf-space-050);background:var(--cf-color-text-strong);transform:translateY(50%)}.article-page .variability-strip-median,.article-page .variability-tick{position:absolute;inset-block:var(--cf-space-100);inline-size:var(--cf-space-050);background:var(--cf-color-primary-solid);opacity:.6;transform:translateX(-50%)}.article-page .variability-strip-median{inset-block:calc(var(--cf-space-050)*-1);inline-size:var(--cf-space-100);background:var(--cf-color-text-strong);opacity:1}.article-page .illo-figure .variability-lcp-line{stroke:var(--cf-color-illo-arrow);stroke-dasharray:none;stroke-width:3}