.volume-bar{margin-block-end:var(--space-3);padding:var(--space-1) var(--space-3);border:1px solid var(--color-border, rgba(34, 38, 43, .12));border-radius:var(--radius-card, 8px);background:color-mix(in srgb,var(--color-accent) 6%,transparent)}.volume-bar__status{margin:0 0 var(--space-1);text-align:center;font-size:var(--text-small);font-weight:var(--font-weight-heading)}.volume-bar__ladder{display:flex;flex-wrap:wrap;gap:var(--space-1);justify-content:center;margin:0 0 var(--space-1);padding:0;list-style:none}.volume-bar__tier{display:flex;flex-direction:row;align-items:baseline;gap:.3em;min-width:0;padding:1px var(--space-2);border:1px solid var(--color-border, rgba(34, 38, 43, .16));border-radius:var(--radius-input, 4px);font-size:calc(var(--text-small) - 1px);white-space:nowrap;transition:border-color .15s ease,background-color .15s ease}.volume-bar__tier-qty{color:var(--color-foreground-muted)}.volume-bar__tier.is-reached{border-color:var(--color-accent);background:color-mix(in srgb,var(--color-accent) 12%,transparent)}.volume-bar__tier.is-next{border-color:var(--color-primary)}.volume-bar__tier-value{font-weight:var(--font-weight-heading)}.volume-bar__track{height:4px;border-radius:999px;background:color-mix(in srgb,var(--color-foreground) 10%,transparent);overflow:hidden}.volume-bar__fill{display:block;height:100%;background:var(--color-accent);transition:width .2s ease}@media(prefers-reduced-motion:reduce){.volume-bar__fill,.volume-bar__tier{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/40/assets/component-volume-bar.css.map */
