:root {
  font-family: var(--ui-font,system-ui,-apple-system,"Segoe UI",sans-serif);
  color: #12213a;
  background: #f4f6fa;
  line-height: 1.6;
  --blue: #2167e8;
  --line: #dce5f1;
}
* {box-sizing:border-box}
body {margin:0}
main {max-width:860px;margin:0 auto;padding:32px 24px 48px}
a {color:#1858bd;text-underline-offset:3px}
.billing-nav {display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:14px}
.brand {display:flex;align-items:center;gap:10px;font-weight:750;color:inherit;text-decoration:none}
.logo {display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:var(--blue);color:white}
header {margin:32px 0 24px}
h1 {font-size:clamp(26px,5vw,36px);line-height:1.2;margin:8px 0 16px}
h2 {font-size:21px;margin:0 0 16px}
.eyebrow {font-size:12px;letter-spacing:.12em;color:#526781}
section {padding:28px;background:white;border:1px solid var(--line);border-radius:16px;margin:20px 0;box-shadow:0 10px 30px rgba(34,59,92,.04)}
label {display:block;font-weight:600}
select {width:100%;padding:12px;border:1px solid #b8c7db;border-radius:8px;font:inherit;background:white;margin:8px 0}
fieldset {border:0;padding:0;margin:24px 0}
legend {font-weight:600;margin-bottom:12px}
.prices {display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.price {padding:16px;border:1px solid #c5d2e3;border-radius:12px;cursor:pointer}
.price:has(input:checked) {border-color:var(--blue);background:#edf4ff;box-shadow:0 0 0 1px var(--blue)}
.price strong,.price small {display:block}
.price strong {font-size:24px;margin-top:8px}
.price small {font-weight:400}
.consent {display:flex;align-items:flex-start;gap:10px;font-weight:400;margin:24px 0}
.consent input {margin-top:7px;flex-shrink:0}
button,.button {display:inline-flex;align-items:center;justify-content:center;gap:8px;font:inherit;font-size:14px;font-weight:600;line-height:1.4;border:1px solid transparent;border-radius:10px;padding:11px 16px;background:var(--blue);color:white;text-decoration:none;cursor:pointer;min-height:44px}
button:hover:not(:disabled),.button:hover {background:#1858bd}
.secondary {background:white;color:#31415c;border-color:var(--line)}
.secondary:hover:not(:disabled) {background:#f0f5ff;border-color:#aac7ee;color:#1754a7}
.subscription button {background:white;color:#31415c;border-color:var(--line)}
.subscription button:hover:not(:disabled) {background:#f0f5ff;color:#1754a7}
button:disabled {opacity:.55;cursor:not-allowed}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible {outline:3px solid #bd8300;outline-offset:3px}
.muted {font-size:14px;color:#53657c}
#checkoutStatus {font:inherit;color:#53657c;line-height:1.5}
#checkoutStatus:empty {display:none}
#checkoutStatus.is-error {color:#b42318}
.sandbox,#notice {padding:12px 16px;border-radius:10px;background:#fff5db;font-size:14px;overflow-wrap:anywhere}
#unavailable p {color:#53657c;margin-bottom:24px}
#refresh {margin-top:8px}
.subscription {border-top:1px solid #e2e8f0;padding:16px 0}
.subscription button {margin:8px 10px 0 0}
[hidden] {display:none!important}
@media(max-width:600px) {
  main {padding:20px 16px 32px}
  section {padding:20px}
  .prices {grid-template-columns:1fr}
  .price strong {font-size:21px}
  button,.button {width:100%;margin-bottom:8px}
  .billing-nav {align-items:flex-start;flex-wrap:wrap}
  .billing-nav .button {width:auto;font-size:12px;padding:8px 10px}
}