.ds-pip{block-size:var(--ds-space-3);border:var(--ds-border-width-strong) solid var(--ds-color-border-strong);border-radius:var(--ds-radius-round);box-sizing:border-box;flex:none;inline-size:var(--ds-space-3)}.ds-pip--bar{block-size:var(--ds-space-2);border-radius:var(--ds-radius-pill);inline-size:var(--ds-space-4)}.ds-pip--lg{background:var(--ds-color-surface-sunken);block-size:calc(2rem*var(--ds-scale));border:var(--ds-border-width) solid var(--ds-color-border);color:var(--ds-color-text-muted);display:grid;inline-size:calc(2rem*var(--ds-scale));place-items:center;--_ds-pip-ring-offset:var(--ds-border-width-strong)}.ds-pip--accent{background:var(--ds-color-accent-fill);border-color:var(--ds-color-accent-fill);color:var(--ds-color-on-accent)}.ds-pip--success{background:var(--ds-color-success-fill);border-color:var(--ds-color-success-fill);color:var(--ds-color-on-accent)}.ds-pip--win{background:var(--ds-color-result-win);border-color:var(--ds-color-result-win)}.ds-pip--draw{background:var(--ds-color-result-draw);border-color:var(--ds-color-result-draw)}.ds-pip--loss{background:var(--ds-color-result-loss);border-color:var(--ds-color-result-loss)}.ds-pip--muted{background:var(--ds-color-border);border-color:var(--ds-color-border)}.ds-pip--future{background:transparent;border-style:dashed}.ds-pip--current{outline:var(--ds-border-width-strong) solid var(--ds-color-border-accent);outline-offset:var(--_ds-pip-ring-offset,var(--ds-border-width))}