.mk-root .mk-billing-input{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.mk-root .mk-billing-ui{flex-wrap:wrap;align-items:center;gap:12px 16px;display:flex}.mk-root .mk-billing-pill{border-radius:var(--mk-radius-pill);background-color:var(--mk-mist);padding:4px;display:inline-flex}.mk-root .mk-billing-pill label{border-radius:var(--mk-radius-pill);min-width:104px;min-height:40px;color:var(--mk-slate);cursor:pointer;-webkit-tap-highlight-color:transparent;border:1px solid #0000;justify-content:center;align-items:center;padding:0 20px;font-size:.9375rem;font-weight:500;line-height:1.3334;transition:background-color .15s,color .15s;display:inline-flex;position:relative}.mk-root .mk-billing-pill label:after{content:"";position:absolute;inset:-2px 0}.mk-root .mk-billing-input[value=annual]:checked~.mk-billing-ui label[for=billing-annual],.mk-root .mk-billing-input[value=monthly]:checked~.mk-billing-ui label[for=billing-monthly]{border-color:var(--mk-line-strong);background-color:var(--mk-paper);color:var(--mk-ink);font-weight:600}.mk-root .mk-billing-input[value=annual]:focus-visible~.mk-billing-ui label[for=billing-annual],.mk-root .mk-billing-input[value=monthly]:focus-visible~.mk-billing-ui label[for=billing-monthly]{outline:2px solid var(--mk-river);outline-offset:2px}@media (hover:hover) and (pointer:fine){.mk-root .mk-billing-pill label:hover{color:var(--mk-ink)}}.mk-root .mk-billing-input[value=annual]:checked~.mk-plan-grid .mk-when-monthly,.mk-root .mk-billing-input[value=monthly]:checked~.mk-plan-grid .mk-when-annual{display:none}
