.prototype-ui .payment-band{gap:8px;margin-top:8px;display:grid}.prototype-ui .payment-band-bars{align-items:stretch;gap:4px;height:40px;display:flex}.prototype-ui .payment-band-bar{all:unset;box-sizing:border-box;cursor:pointer;background:var(--green);border-radius:4px;flex:1}.prototype-ui .payment-band-bar:disabled{cursor:default}.prototype-ui .payment-band-bar.is-late{background:var(--amber)}.prototype-ui .payment-band-bar.is-dunned{background:var(--red)}.prototype-ui .payment-band-bar.is-open{border:1.5px dashed var(--muted);background:0 0}.prototype-ui .payment-band-bar.is-unknown{background:var(--line)}.prototype-ui .payment-band-bar:focus-visible,.prototype-ui .payment-band-bar[aria-pressed=true]{outline:2px solid var(--ink);outline-offset:2px}.prototype-ui .payment-band-foot{color:var(--muted);justify-content:space-between;font-size:11px;display:flex}.prototype-ui .payment-band-tip{min-height:20px;color:var(--ink);margin:0;font-size:13px}.prototype-ui .payment-band-legend{color:var(--muted);flex-wrap:wrap;gap:12px;font-size:11px;display:flex}.prototype-ui .payment-band-legend span:before{content:"";vertical-align:middle;background:var(--green);border-radius:2px;width:8px;height:8px;margin-right:6px;display:inline-block}.prototype-ui .payment-band-legend .is-late:before{background:var(--amber)}.prototype-ui .payment-band-legend .is-dunned:before{background:var(--red)}.prototype-ui .payment-band-legend .is-open:before{border:1px dashed var(--muted);box-sizing:border-box;background:0 0}.prototype-ui .payment-band-legend .is-unknown:before{background:var(--line)}