*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--color-bg: #f5f4f0;--color-surface: #ffffff;--color-border: rgba(0,0,0,.1);--color-border-strong: rgba(0,0,0,.18);--color-text: #1a1a18;--color-muted: #6b6b66;--color-subtle: #9a9a94;--color-primary: #3a8688;--color-primary-light: #e5f4f4;--color-primary-mid: #2e6e70;--color-nav-dark: #1c2d3a;--radius-sm: 6px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 18px}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#e8e7e3;color:var(--color-text);font-size:14px;min-height:100vh;padding:32px 16px 56px;display:flex;flex-direction:column;align-items:center}.page-title{font-size:13px;font-weight:600;color:var(--color-muted);letter-spacing:.04em;margin-bottom:32px;text-align:center}.flow,.step{display:flex;flex-direction:column;align-items:center}.step-label{font-size:10.5px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--color-subtle);margin-bottom:10px;text-align:center}.step-arrow{display:flex;flex-direction:column;align-items:center;gap:4px;padding:12px 0;color:var(--color-subtle)}.step-arrow svg{width:16px;height:16px}.step-arrow-label{font-size:10px;color:var(--color-subtle);letter-spacing:.03em}.step-row{display:flex;align-items:flex-start;gap:16px}.aside{width:175px;padding-top:48px;display:flex;flex-direction:column;gap:14px;flex-shrink:0}.aside-note{background:var(--color-surface);border:.5px solid var(--color-border);border-radius:var(--radius-lg);padding:10px 12px;font-size:11.5px;color:var(--color-muted);line-height:1.5}.aside-note strong{color:var(--color-text);font-weight:500;display:block;margin-bottom:3px}.phone{width:300px;border-radius:var(--radius-xl);border:.5px solid rgba(0,0,0,.12);overflow:hidden;background:var(--color-bg);box-shadow:0 2px 16px #00000014}.tip-header{background:var(--color-primary);padding:13px 14px 11px;display:flex;align-items:center;gap:9px}.tip-header-back{width:28px;height:28px;border-radius:50%;background:#ffffff26;display:flex;align-items:center;justify-content:center;flex-shrink:0;cursor:pointer;border:none}.tip-header-back svg{width:13px;height:13px;color:#fff}.tip-header-info{flex:1}.tip-header-name{font-size:13px;font-weight:600;color:#fff;margin-bottom:1px}.tip-header-sub{font-size:10.5px;color:#ffffff8c}.tip-header-icon{width:32px;height:32px;border-radius:var(--radius-md);background:#ffffff26;display:flex;align-items:center;justify-content:center;font-size:15px;flex-shrink:0}.tip-progress{padding:10px 14px 8px;background:var(--color-surface);border-bottom:.5px solid var(--color-border);display:flex;align-items:center;gap:5px}.progress-dot{height:3px;flex:1;border-radius:100px;background:var(--color-border)}.progress-dot.active{background:var(--color-primary)}.progress-dot.done{background:var(--color-primary);opacity:.4}.tip-body{padding:16px 14px 14px;display:flex;flex-direction:column;gap:14px;background:var(--color-surface)}.tip-question{font-size:15px;font-weight:600;color:var(--color-text);line-height:1.3}.tip-question-sub{font-size:11.5px;color:var(--color-muted);margin-top:3px;line-height:1.4}.group-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.group-card{border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:11px 10px;display:flex;flex-direction:column;align-items:flex-start;gap:6px;background:var(--color-bg);cursor:pointer;transition:border-color .15s}.group-card.selected{border-color:var(--color-primary);background:var(--color-primary-light)}.group-card-icon{width:32px;height:32px;border-radius:var(--radius-md);background:var(--color-surface);display:flex;align-items:center;justify-content:center;font-size:16px}.group-card.selected .group-card-icon{background:#ffffffb3}.group-card-name{font-size:11.5px;font-weight:600;color:var(--color-text);line-height:1.25}.group-card-sub{font-size:10px;color:var(--color-muted)}.group-card.selected .group-card-name{color:var(--color-primary-mid)}.amount-pills{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.amount-pill{padding:9px 4px;border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-bg);text-align:center;font-size:13px;font-weight:600;color:var(--color-text);cursor:pointer}.amount-pill.selected{border-color:var(--color-primary);background:var(--color-primary-light);color:var(--color-primary-mid)}.amount-custom{border:1px solid var(--color-border);border-radius:var(--radius-md);padding:9px 12px;background:var(--color-bg);display:flex;align-items:center;gap:6px}.amount-custom-label{font-size:12px;color:var(--color-muted);flex-shrink:0}.amount-custom-input{flex:1;border:none;background:transparent;font-size:13px;font-weight:600;color:var(--color-text);outline:none;font-family:inherit}.amount-custom-input::placeholder{color:var(--color-subtle);font-weight:400}.note-field{border:1px solid var(--color-border);border-radius:var(--radius-md);padding:9px 12px;background:var(--color-bg)}.note-field-label{font-size:10px;font-weight:600;color:var(--color-subtle);text-transform:uppercase;letter-spacing:.06em;margin-bottom:4px}.note-field-text{font-size:12px;color:var(--color-muted);font-family:inherit}.selected-group-pill{display:inline-flex;align-items:center;gap:5px;padding:3px 10px 3px 5px;background:var(--color-primary-light);border:.5px solid var(--color-primary);border-radius:100px;font-size:11px;font-weight:500;color:var(--color-primary-mid)}.selected-group-pill-icon{width:18px;height:18px;border-radius:50%;background:#3a86881f;display:flex;align-items:center;justify-content:center;font-size:11px}.fee-summary{background:var(--color-bg);border:.5px solid var(--color-border);border-radius:var(--radius-lg);padding:12px;display:flex;flex-direction:column;gap:6px}.fee-row{display:flex;justify-content:space-between;align-items:center;font-size:12px}.fee-row-label{color:var(--color-muted)}.fee-row-value{font-weight:500;color:var(--color-text)}.fee-row-value.muted{color:var(--color-muted);font-weight:400}.fee-divider{height:.5px;background:var(--color-border);margin:2px 0}.fee-row.total .fee-row-label{font-weight:600;color:var(--color-text);font-size:12.5px}.fee-row.total .fee-row-value{font-weight:700;font-size:13px;color:var(--color-text)}.fee-option{border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:11px 12px;cursor:pointer;background:var(--color-bg);display:flex;gap:10px;align-items:flex-start}.fee-option.selected{border-color:var(--color-primary);background:var(--color-primary-light)}.fee-option-radio{width:16px;height:16px;border-radius:50%;border:1.5px solid var(--color-border-strong);flex-shrink:0;margin-top:1px;display:flex;align-items:center;justify-content:center}.fee-option.selected .fee-option-radio{border-color:var(--color-primary);background:var(--color-primary)}.fee-option-radio-dot{width:6px;height:6px;border-radius:50%;background:#fff}.fee-option-body{flex:1}.fee-option-title{font-size:12.5px;font-weight:600;color:var(--color-text);margin-bottom:3px}.fee-option.selected .fee-option-title{color:var(--color-primary-mid)}.fee-option-rows{display:flex;flex-direction:column;gap:2px}.fee-option-row{display:flex;justify-content:space-between;font-size:11px;color:var(--color-muted)}.fee-option-row .val{font-weight:500;color:var(--color-text)}.fee-option-row .val.good{color:#1a7a4a}.checkout-summary{background:var(--color-bg);border:.5px solid var(--color-border);border-radius:var(--radius-lg);padding:11px 12px;display:flex;align-items:center;gap:10px}.checkout-summary-icon{width:34px;height:34px;border-radius:var(--radius-md);background:var(--color-primary-light);display:flex;align-items:center;justify-content:center;font-size:17px;flex-shrink:0}.checkout-summary-info{flex:1}.checkout-summary-title{font-size:12px;font-weight:600;color:var(--color-text)}.checkout-summary-sub{font-size:11px;color:var(--color-muted);margin-top:1px}.checkout-summary-amount{font-size:16px;font-weight:700;color:var(--color-text)}.stripe-form{display:flex;flex-direction:column;gap:7px}.stripe-field-label{font-size:10px;font-weight:600;color:var(--color-muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:4px}.stripe-input{width:100%;padding:9px 11px;border:1px solid var(--color-border-strong);border-radius:var(--radius-md);font-size:13px;font-family:inherit;background:var(--color-bg);color:var(--color-text);outline:none}.stripe-input.filled{border-color:var(--color-primary);background:#fff}.stripe-input-row{display:flex;gap:7px}.stripe-input-row .stripe-field{flex:1}.stripe-badge{display:flex;align-items:center;justify-content:center;gap:5px;padding:6px 0 0;font-size:10px;color:var(--color-subtle)}.stripe-badge svg{width:28px;height:auto;opacity:.5}.tip-cta{padding:10px 14px 14px;background:var(--color-surface);border-top:.5px solid var(--color-border)}.tip-cta-btn{width:100%;padding:12px;background:var(--color-primary);color:#fff;border:none;border-radius:var(--radius-lg);font-size:13.5px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px;font-family:inherit}.tip-cta-btn.disabled{opacity:.4;cursor:default}.tip-cta-btn svg{width:14px;height:14px}.success-body{padding:28px 18px 24px;display:flex;flex-direction:column;align-items:center;gap:14px;background:var(--color-surface);text-align:center}.success-ring{width:62px;height:62px;border-radius:50%;background:var(--color-primary-light);border:2px solid var(--color-primary);display:flex;align-items:center;justify-content:center;font-size:26px}.success-title{font-size:17px;font-weight:700;color:var(--color-text)}.success-sub{font-size:12.5px;color:var(--color-muted);line-height:1.5;max-width:220px}.success-detail{background:var(--color-bg);border:.5px solid var(--color-border);border-radius:var(--radius-lg);padding:11px 14px;width:100%;display:flex;flex-direction:column;gap:6px}.success-detail-row{display:flex;justify-content:space-between;font-size:12px}.success-detail-row .lbl{color:var(--color-muted)}.success-detail-row .val{font-weight:500;color:var(--color-text)}.success-back-btn{width:100%;padding:11px;background:transparent;color:var(--color-primary);border:1px solid var(--color-primary);border-radius:var(--radius-lg);font-size:13px;font-weight:600;cursor:pointer;font-family:inherit}body{display:block;padding:0}button,input,textarea,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #2e6e70;outline-offset:3px}h1:focus{outline:none}.guest-page{width:100%;padding:40px 16px}.phone{width:380px;max-width:100%;margin:0 auto}.demo-label{text-align:center;font-size:12px;color:#52605f;margin-bottom:18px}.demo-label span{display:block;margin-top:5px;font-size:11px}.guest-footer{margin-top:24px;text-align:center;font-size:11px;color:#6b6b66}.tip-body{padding:22px 18px;gap:17px}.tip-header{padding:17px 18px}.tip-header-sub{color:#ffffffd1}.tip-question{font-size:18px}.tip-question-sub{font-size:13px;line-height:1.6}.group-card{text-align:left;min-height:110px;gap:5px}.group-card-name{font-size:13px}.group-card-sub{font-size:11px}.group-card-icon{margin-bottom:5px}.amount-pill{min-height:44px}.amount-custom-input{width:100%;min-width:0;font-size:16px}.note-field-label,.stripe-field-label{display:block}.note-field-text{display:block;width:100%;min-height:62px;resize:vertical;background:transparent;border:0;margin-top:8px;font-size:14px}.selected-group-pill{align-self:flex-start}.fee-option input{accent-color:#3a8688;width:16px;height:16px;flex-shrink:0;margin-top:1px}.fee-option-title{display:block}.fee-option-row{margin-top:4px}.fee-row{gap:12px}.fee-row-value{white-space:nowrap}.fee-row-label{max-width:65%}.stripe-field{min-width:0}.demo-outcome{display:flex;align-items:center;justify-content:space-between;font-size:12px;gap:8px}.demo-outcome select{max-width:65%;padding:7px;border:1px solid #ccc;border-radius:6px}.tip-cta{padding:14px 18px 18px}.feedback{padding:12px 18px;background:#e5f4f4;font-size:13px;line-height:1.5}.error,.validation{color:#a12d28;background:#fff1ef}.validation{padding:8px;font-size:12px}.text-button{background:none;border:0;color:#2e6e70;padding:10px 0;text-decoration:underline;font-size:12px}.cancel{display:block;margin:4px auto 0}.landing{align-items:center;text-align:center;padding:32px 24px}.success-detail-row{gap:14px;align-items:flex-start}.success-detail-row .val{max-width:65%;overflow-wrap:anywhere;text-align:right}.good{color:#1a7a4a}.reference{font-family:monospace}@media (max-width: 480px){body{background:#f5f4f0}.guest-page{padding:16px 12px 28px}.phone{width:100%}.demo-label{margin-bottom:12px}}
