.checkoutDemo{padding-top:36px}.demoBanner{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px 0}.demoBanner strong{font-size:var(--s2);font-weight:500}.demoBanner p{color:var(--muted);max-width:72ch;margin-top:6px}.demoSteps{color:var(--muted);gap:32px;margin:26px 0 36px;padding:0;list-style:none;display:flex}.demoSteps li{gap:8px;display:flex}.demoSteps li[aria-current]{color:var(--ink);text-underline-offset:7px;text-decoration:underline}.demoFlow{min-width:0}.demoFlow h2{font-family:var(--display);margin:0 0 16px;font-size:30px;font-weight:400}.demoFlow h3{font-family:var(--display);margin:28px 0 16px;font-size:25px;font-weight:400}.demoForm label{font-size:var(--s2);margin:18px 0;font-weight:400;display:block}.demoForm input{border:0;border-bottom:1px solid var(--control-line);width:100%;min-width:0;color:var(--ink);font:inherit;background:0 0;border-radius:0;padding:12px 0;display:block}.demoRow{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;display:grid}.demoForm .button{margin-top:20px}.demoControls{border-top:1px solid var(--line);margin-top:38px;padding-top:26px}.demoControls h2{font-size:25px}.demoActions{flex-wrap:wrap;gap:12px;margin:18px 0;display:flex}.demoActions button{border:1px solid var(--line);min-height:44px;color:var(--ink);font:inherit;cursor:pointer;background:0 0;padding:9px 14px}.demoActions button:disabled{opacity:.4;cursor:not-allowed}.demoActions button:not(:disabled):hover{border-color:var(--ink)}.demoRestart{color:var(--ink);font:inherit;cursor:pointer;background:0 0;border:0;min-height:44px;padding:8px 0}.demoResult{min-height:240px}.demoCode,.demoReceipt{border-top:1px solid var(--line);margin-top:26px;padding-top:20px}.demoCode code{overflow-wrap:anywhere;background:0 0;margin:14px 0;padding:0;display:block}.demoResult>.button{margin-top:24px}.demoObject{border:1px solid var(--line);min-height:160px;color:var(--muted);font-family:var(--display);letter-spacing:.12em;place-items:center;margin-bottom:22px;font-size:34px;display:grid}body:has(.checkoutDemo) .compareTray{display:none}@media (max-width:767px){.checkoutDemo{padding-top:26px}.demoSteps{gap:14px;font-size:13px}.demoSteps li{gap:5px}.demoRow{gap:14px}.demoObject{min-height:100px}.demoActions{grid-template-columns:1fr;display:grid}.demoActions button{text-align:left}}