.retention{display:flex;flex-direction:column;gap:var(--space-12);margin:0;--retention-plot-height: calc(var(--space-48) * 4);--retention-axis-width: var(--space-48)}.retention__empty.empty{padding:var(--space-24) var(--space-16);align-items:flex-start;text-align:left}.retention__chart{display:grid;grid-template-columns:var(--retention-axis-width) minmax(0,1fr);grid-template-rows:var(--retention-plot-height) auto;column-gap:var(--space-12);row-gap:var(--space-8)}.retention__y-axis{display:flex;flex-direction:column;justify-content:space-between;align-items:flex-end;margin-block:calc(var(--text-caption-lh) / -2)}.retention__y-label,.retention__x-label{font-variant-numeric:tabular-nums;font-size:var(--text-caption-size);line-height:var(--text-caption-lh);color:var(--text-secondary)}.retention__plot{position:relative;height:var(--retention-plot-height);border-radius:var(--radius-lg);outline:none;cursor:crosshair;touch-action:pan-y}.retention__plot:focus-visible{outline:var(--border-width-strong) solid var(--border-focus);outline-offset:var(--space-2)}.retention__svg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;overflow:visible}.retention__grid{stroke:var(--border-subtle);stroke-width:var(--border-width-default)}.retention__line{fill:none;stroke:var(--viz-1);stroke-width:var(--space-2);stroke-linejoin:miter;stroke-linecap:butt}.retention__drop-marker{position:absolute;left:var(--retention-x);top:var(--retention-y);box-sizing:border-box;width:var(--space-12);height:var(--space-12);transform:translate(-50%,-50%);border-radius:var(--radius-0);border:var(--space-2) solid var(--surface-default);background:var(--viz-1);pointer-events:none}.retention__drop-label{position:absolute;left:var(--retention-x);top:var(--retention-y);transform:translate(var(--space-8),calc(-50% + var(--space-4)));padding:var(--space-2) var(--space-6);font-size:var(--text-body-sm-size);line-height:var(--text-body-sm-lh);font-weight:var(--weight-medium);color:var(--text-primary);background:var(--surface-default);border-radius:var(--radius-md);white-space:nowrap;pointer-events:none}.retention__crosshair{position:absolute;top:0;bottom:0;left:var(--retention-x);width:var(--border-width-default);background:var(--text-tertiary);pointer-events:none}.retention__x-axis{grid-column:2;display:flex;justify-content:space-between}.retention__readout{min-height:var(--text-body-lh);font-variant-numeric:tabular-nums;font-size:var(--text-body-size);line-height:var(--text-body-lh);color:var(--text-primary)}.retention__drop-text{font-size:var(--text-body-size);line-height:var(--text-body-lh);color:var(--text-secondary)}.retention__caption{font-size:var(--text-body-sm-size);line-height:var(--text-body-sm-lh);color:var(--text-tertiary)}.retention__sr{position:absolute;width:var(--border-width-default);height:var(--border-width-default);padding:0;margin:calc(var(--border-width-default) * -1);overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
