:root{color-scheme:light;--paystack-navy: #011b33;--paystack-navy-soft: #0a2744;--paystack-green: #3bb75e;--paystack-green-dark: #2f9a4c;--paystack-green-soft: #e6f7ec;--paystack-mint: #eaf7ee;--convex-black: #17101a;--convex-black-soft: #241a27;--convex-red: #ee342f;--convex-yellow: #f3b01c;--convex-purple: #8d2676;--convex-cream: #f7f2e7;--ink: #0b1220;--ink-soft: #4a5568;--paper: #f6faf7;--card: #ffffff;--border: #e0e7e2;--danger: #d1372d;--danger-soft: #fdeceb;--radius-lg: 20px;--radius-md: 14px;--radius-sm: 10px;--shadow-soft: 0 1px 2px rgba(1, 27, 51, .06), 0 12px 32px -16px rgba(1, 27, 51, .18);--shadow-lift: 0 4px 10px rgba(1, 27, 51, .08), 0 20px 48px -20px rgba(1, 27, 51, .28);--brand-gradient: linear-gradient(135deg, var(--convex-red) 0%, var(--convex-yellow) 100%);--mono-font: "SFMono-Regular", ui-monospace, Menlo, Consolas, "Liberation Mono", monospace}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--paper);color:var(--ink);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}button{font-family:inherit}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--paystack-green-dark);outline-offset:2px}code{font-family:var(--mono-font)}.app-shell{min-height:100vh;display:flex;flex-direction:column;transition:padding-right .25s ease}.app-shell--console-open{padding-right:380px}@media(max-width:780px){.app-shell--console-open{padding-right:0}}.top-banner{background:var(--paystack-navy);background-image:linear-gradient(180deg,var(--paystack-navy-soft) 0%,var(--paystack-navy) 100%);color:#ffffffeb;font-size:.82rem;padding:.65rem 1rem;border-bottom:1px solid rgba(255,255,255,.08)}.top-banner__inner{max-width:1080px;margin:0 auto;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:.4rem .5rem}.top-banner__badge{display:inline-flex;align-items:center;gap:.35rem;padding:.15rem .6rem;border-radius:999px;background:#3bb75e2e;color:var(--paystack-green);font-weight:700;white-space:nowrap}.top-banner__text{color:#ffffffc7}.top-banner__code{background:#ffffff1a;border:1px solid rgba(255,255,255,.14);color:#fff;padding:.15rem .5rem;border-radius:6px;font-size:.78rem;letter-spacing:.01em;white-space:nowrap}.site-header{background:#ffffffe0;backdrop-filter:saturate(180%) blur(14px);-webkit-backdrop-filter:saturate(180%) blur(14px);border-bottom:1px solid var(--border);box-shadow:0 1px #011b3305;position:sticky;top:0;z-index:20}.site-header__inner{max-width:1080px;margin:0 auto;padding:.9rem 1.5rem;display:flex;align-items:center;gap:1.5rem}.site-header__brand{display:flex;align-items:center;gap:.6rem;background:none;border:none;cursor:pointer;padding:0;transition:opacity .15s ease}.site-header__brand:hover{opacity:.8}.brand-mark{display:inline-flex;border-radius:9px;overflow:hidden;font-weight:800;font-size:.85rem;box-shadow:var(--shadow-soft)}.brand-mark__half{width:20px;height:28px;display:flex;align-items:center;justify-content:center}.brand-mark__half--paystack{background:var(--paystack-green);color:var(--paystack-navy)}.brand-mark__half--convex{background:var(--convex-black);color:var(--convex-yellow);font-style:italic}.site-header__name{font-weight:700;color:var(--ink);font-size:.98rem}.site-header__nav{display:flex;gap:.25rem;flex:1}.site-header__nav button{background:none;border:none;color:var(--ink-soft);font-size:.9rem;font-weight:500;padding:.5rem .9rem;border-radius:999px;cursor:pointer;transition:background .15s ease,color .15s ease}.site-header__nav button:hover{color:var(--ink);background:var(--paper)}.site-header__nav button.is-active{background:var(--paystack-green-soft);color:var(--paystack-green-dark);font-weight:700}.site-header__right{display:flex;align-items:center;gap:.5rem}.stat-pill{display:inline-flex;align-items:center;gap:.4rem;padding:.35rem .7rem;border-radius:999px;background:linear-gradient(180deg,#fff,var(--paper));border:1px solid var(--border);box-shadow:0 1px 2px #011b330a;font-size:.78rem;font-weight:600;color:var(--ink-soft);white-space:nowrap}.stat-pill--muted{opacity:.85}.stat-pill__dot{width:6px;height:6px;border-radius:50%;background:var(--paystack-green);animation:pulse 2.2s infinite}@keyframes pulse{0%{box-shadow:0 0 #3bb75e8c}70%{box-shadow:0 0 0 7px #3bb75e00}to{box-shadow:0 0 #3bb75e00}}.cta-pill{background:var(--paystack-green);color:var(--paystack-navy);border:none;font-weight:700;font-size:.85rem;padding:.55rem 1.1rem;border-radius:999px;cursor:pointer;white-space:nowrap;box-shadow:0 1px 2px #011b3314,0 8px 18px -10px #3bb75e99;transition:transform .15s ease,box-shadow .15s ease,background .15s ease,color .15s ease}.cta-pill:hover{background:var(--paystack-green-dark);color:#fff;transform:translateY(-1px);box-shadow:0 4px 10px -2px #011b331f,0 16px 30px -12px #3bb75eb3}.cta-pill:active{transform:translateY(0)}.app-main{flex:1;width:100%}.banner{max-width:880px;margin:0 auto 1.5rem;padding:.85rem 1.1rem;border-radius:var(--radius-sm);font-size:.92rem}.banner--error{background:var(--danger-soft);color:var(--danger);border:1px solid rgba(209,55,45,.25)}.app-footer{text-align:center;font-size:.8rem;color:var(--ink-soft);padding:1.5rem 1rem 2.5rem}.app-footer__brand{font-weight:700;color:var(--ink)}.app-footer__sep{margin:0 .4rem;color:var(--border)}.app-footer code{background:var(--card);border:1px solid var(--border);border-radius:6px;padding:.1rem .4rem}.link-button{background:none;border:none;padding:0;color:var(--paystack-green-dark);font-weight:600;cursor:pointer;text-decoration:underline;font-size:inherit;transition:color .15s ease}.link-button:hover{color:var(--paystack-navy)}.link-button--light{color:var(--convex-yellow)}.link-button--light:hover{color:#fff}.hero{position:relative;background:var(--paystack-mint);padding:4rem 1.5rem 5rem;overflow:hidden}.hero__dots{position:absolute;inset:0;background-image:radial-gradient(rgba(1,27,51,.09) 1.4px,transparent 1.4px);background-size:22px 22px;mask-image:radial-gradient(ellipse 70% 60% at 70% 30%,black,transparent);-webkit-mask-image:radial-gradient(ellipse 70% 60% at 70% 30%,black,transparent)}.hero__content{position:relative;max-width:640px;margin:0 auto;text-align:center}.hero h1{font-size:2.2rem;line-height:1.2;margin:1rem 0;color:var(--paystack-navy);letter-spacing:-.01em}.hero p{color:var(--ink-soft);font-size:1.02rem;line-height:1.6;margin:0 auto 1.75rem;max-width:540px}.hero__actions{display:flex;align-items:center;justify-content:center;gap:1.25rem;flex-wrap:wrap}.hero__secondary{background:none;border:none;color:var(--paystack-navy);font-weight:700;font-size:.95rem;cursor:pointer;padding:.7rem .5rem;border-radius:var(--radius-sm);transition:background .15s ease}.hero__secondary:hover{background:#011b330f;text-decoration:underline}.eyebrow-pill{display:inline-flex;align-items:center;padding:.3rem .85rem;border-radius:999px;background:#fff;border:1px solid rgba(1,27,51,.12);box-shadow:0 1px 2px #011b330d;color:var(--paystack-navy);font-size:.75rem;font-weight:700;letter-spacing:.02em;margin-bottom:1rem}.eyebrow-pill--dark{background:#ffffff14;border-color:#ffffff29;color:#fff}.brand-stripe{display:flex;height:6px}.brand-stripe span{flex:1}.brand-stripe span:nth-child(1){background:var(--convex-yellow)}.brand-stripe span:nth-child(2){background:var(--convex-red)}.brand-stripe span:nth-child(3){background:var(--convex-purple)}.dev-panel{background:var(--convex-black);color:#fff;padding:3.5rem 1.5rem;display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;align-items:center}.dev-panel__intro{max-width:420px}.dev-panel__intro h2{font-size:1.7rem;margin:0 0 .75rem}.dev-panel__intro p{color:#ffffffb8;line-height:1.6;font-size:.95rem;margin:0 0 1rem}.terminal-card{background:#0d0910;border:1px solid rgba(255,255,255,.08);border-radius:var(--radius-md);padding:1.1rem 1.3rem 1.4rem;box-shadow:var(--shadow-lift)}.terminal-card__dots{display:flex;gap:.4rem;margin-bottom:.9rem}.terminal-card__dots span{width:9px;height:9px;border-radius:50%;background:#ffffff2e}.terminal-card__dots span:nth-child(1){background:var(--convex-red)}.terminal-card__dots span:nth-child(2){background:var(--convex-yellow)}.terminal-card__dots span:nth-child(3){background:var(--paystack-green)}.terminal-card pre{margin:0;font-family:var(--mono-font);font-size:.78rem;line-height:1.65;color:#d9f7e3;white-space:pre-wrap;word-break:break-word}.ui-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft)}.ui-button{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem 1.4rem;border-radius:999px;font-size:.95rem;font-weight:600;border:none;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,background .15s ease,color .15s ease,opacity .15s ease}.ui-button:hover:not(:disabled){transform:translateY(-1px)}.ui-button:active:not(:disabled){transform:translateY(0) scale(.98)}.ui-button:focus-visible{outline:2px solid var(--paystack-green-dark);outline-offset:2px}.ui-button:disabled{opacity:.5;cursor:not-allowed;transform:none}.ui-button--primary{background:var(--paystack-green);color:var(--paystack-navy);box-shadow:0 1px 2px #011b3314,0 12px 24px -14px #3bb75e99}.ui-button--primary:hover:not(:disabled){background:var(--paystack-green-dark);box-shadow:0 4px 10px -2px #011b331f,0 18px 32px -14px #3bb75ebf}.ui-button--secondary{background:var(--paystack-navy);color:#fff;box-shadow:0 1px 2px #011b331f,0 12px 24px -16px #011b33b3}.ui-button--secondary:hover:not(:disabled){background:var(--paystack-navy-soft)}.ui-button--ghost{background:transparent;color:var(--paystack-navy);border:1px solid var(--border)}.ui-button--ghost:hover:not(:disabled){background:var(--paper);border-color:var(--paystack-navy)}.ui-button--danger{background:var(--danger);color:#fff;box-shadow:0 1px 2px #011b331a,0 12px 24px -16px #d1372d99}.ui-button--danger:hover:not(:disabled){background:#b82f26}.ui-badge{display:inline-flex;align-items:center;padding:.2rem .7rem;border-radius:999px;font-size:.75rem;font-weight:700;text-transform:capitalize}.ui-badge--neutral{background:#eef1f5;color:var(--ink-soft)}.ui-badge--success{background:var(--paystack-green-soft);color:var(--paystack-green-dark)}.ui-badge--danger{background:var(--danger-soft);color:var(--danger)}.ui-badge--brand{background:var(--brand-gradient);color:#fff}.ui-spinner{display:inline-block;border-radius:50%;border-style:solid;border-color:var(--border);border-top-color:var(--paystack-green);animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.ui-chip-row{display:flex;flex-wrap:wrap;gap:.5rem}.ui-chip{padding:.4rem .85rem;border-radius:999px;border:1px solid var(--border);background:var(--card);color:var(--ink-soft);font-size:.85rem;cursor:pointer;transition:border-color .15s ease,color .15s ease,background .15s ease,box-shadow .15s ease}.ui-chip:hover{border-color:var(--paystack-navy);color:var(--ink)}.ui-chip--active{background:var(--paystack-navy);border-color:var(--paystack-navy);color:#fff;box-shadow:0 1px 2px #011b3326}.ui-chip--active:hover{color:#fff}.ui-status-icon{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;font-size:.75rem;font-weight:800;margin-right:.5rem}.ui-status-icon--success{background:var(--paystack-green-soft);color:var(--paystack-green-dark)}.ui-status-icon--danger{background:var(--danger-soft);color:var(--danger)}.ui-status-icon--neutral{background:#eef1f5;color:var(--ink-soft)}.flow-card{padding:2rem;max-width:560px;margin:3rem auto;display:flex;flex-direction:column;gap:1.1rem;box-shadow:var(--shadow-lift)}.flow-card h2{margin:0}.flow-card__lede{color:var(--ink-soft);font-size:.92rem;line-height:1.55;margin:-.6rem 0 0}.field{display:flex;flex-direction:column;gap:.35rem;font-size:.88rem;font-weight:600;color:var(--ink)}.field input,.field select{font-family:inherit;padding:.7rem .85rem;border-radius:var(--radius-sm);border:1px solid var(--border);font-size:.95rem;font-weight:400;background:var(--card);color:var(--ink);-webkit-text-fill-color:var(--ink);color-scheme:light;transition:border-color .15s ease,box-shadow .15s ease}.field input:hover,.field select:hover{border-color:#011b333d}.field input::placeholder{color:var(--ink-soft);opacity:.7}.field select{appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%234a5568'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .9rem center;padding-right:2.2rem}.field input:focus,.field select:focus{outline:none;border-color:var(--paystack-green);box-shadow:0 0 0 3px #3bb75e2e}.field-row{display:flex;gap:1rem}.field-hint{margin:-.7rem 0 0;font-size:.78rem;font-weight:400;color:var(--ink-soft);line-height:1.5}.field--amount{flex:1.4}.field--currency{flex:1}.amount-input{display:flex;align-items:center;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--card);padding-left:.8rem;transition:border-color .15s ease,box-shadow .15s ease}.amount-input:hover{border-color:#011b333d}.amount-input:focus-within{border-color:var(--paystack-green);box-shadow:0 0 0 3px #3bb75e2e}.amount-input__symbol{color:var(--ink-soft);font-weight:700}.amount-input input{border:none;padding-left:.4rem}.amount-input input:focus{outline:none}.plan-loading{display:flex;align-items:center;gap:.6rem;color:var(--ink-soft);font-size:.9rem}.plan-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.plan-card{position:relative;border:1px solid var(--border);border-radius:var(--radius-md);padding:1.4rem;display:flex;flex-direction:column;gap:.7rem;background:var(--paper);transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease}.plan-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-lift);border-color:var(--paystack-green)}.plan-card--highlight{border-color:var(--paystack-green);box-shadow:var(--shadow-lift);background:#fff}.plan-card__ribbon{position:absolute;top:-10px;right:1rem;background:var(--convex-yellow);color:var(--ink);font-size:.7rem;font-weight:800;padding:.2rem .6rem;border-radius:999px}.plan-card h3{margin:0;font-size:1rem;color:var(--ink-soft);font-weight:700;text-transform:uppercase;letter-spacing:.04em}.plan-card__price{font-size:1.6rem;font-weight:800;color:var(--ink);margin:0}.plan-card__price span{font-size:.85rem;font-weight:500;color:var(--ink-soft)}.result-card{text-align:center;align-items:center}.result-card .ui-status-icon{width:52px;height:52px;font-size:1.5rem;margin:0 0 .4rem}.result-card--success .ui-status-icon{background:var(--paystack-green-soft);color:var(--paystack-green-dark)}.result-card--failed .ui-status-icon{background:var(--danger-soft);color:var(--danger)}.result-card__amount{font-size:1.8rem;font-weight:800;margin:0}.result-card__label{color:var(--ink-soft);margin:-.6rem 0 0}.result-card__meta{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:.8rem 1.5rem;text-align:left;margin:.5rem 0 0;padding:1rem;background:var(--paper);border-radius:var(--radius-md)}.result-card__meta dt{font-size:.72rem;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-soft);margin-bottom:.15rem}.result-card__meta dd{margin:0;font-size:.92rem;word-break:break-all}.result-card__actions{display:flex;gap:.75rem;margin-top:.5rem}.history-section{border-top:1px solid var(--border);padding-top:1rem}.history-section h3{margin:0;font-size:.85rem;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-soft)}.history-section__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.6rem}.history-section__header .link-button{font-size:.8rem;text-decoration:none}.history-section__note{font-size:.85rem;color:var(--ink-soft);background:var(--paper);border-radius:var(--radius-sm);padding:.5rem .75rem;margin:0 0 .75rem}.webhook-note{background:var(--paystack-navy);color:#ffffffe6;border-radius:var(--radius-md);padding:.9rem 1.1rem;font-size:.85rem}.webhook-note__label{display:block;font-weight:700;font-size:.78rem;text-transform:uppercase;letter-spacing:.03em;color:var(--paystack-green);margin-bottom:.35rem}.webhook-note__row{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}.webhook-note code{background:#ffffff1a;padding:.25rem .5rem;border-radius:6px;font-size:.78rem;word-break:break-all}.webhook-note .link-button{color:var(--convex-yellow);font-size:.78rem;white-space:nowrap}.webhook-note p{margin:.6rem 0 0;color:#ffffffa6;font-size:.78rem;line-height:1.5}.history-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.5rem}.history-row{display:flex;align-items:center;justify-content:space-between;padding:.75rem .9rem;background:var(--paper);border-radius:var(--radius-sm);font-size:.9rem;gap:1rem;transition:background .15s ease}.history-row:hover{background:var(--paystack-green-soft)}.history-row__meta{font-size:.75rem;color:var(--ink-soft)}.history-row__right{display:flex;align-items:center;gap:.6rem}.history-row__reference{margin-left:.3rem}.console-toggle{position:fixed;right:20px;bottom:20px;z-index:45;display:flex;align-items:center;gap:.5rem;padding:.6rem 1rem;background:var(--convex-black);color:#fff;border:1px solid rgba(255,255,255,.14);border-radius:999px;box-shadow:0 10px 28px #0000004d;cursor:pointer;font-size:.82rem;font-weight:600;transition:transform .15s ease,box-shadow .15s ease}.console-toggle:hover{transform:translateY(-2px);box-shadow:0 14px 34px #0006}.console-toggle__label{color:#ffffffeb}.console-toggle__count{color:#ffffff80;font-weight:500}.console-scrim{position:fixed;inset:0;background:#011b3373;z-index:35;display:none}@media(max-width:780px){.console-scrim{display:block}}.console{position:fixed;top:0;right:0;bottom:0;z-index:40;width:380px;max-width:92vw;display:flex;flex-direction:column;background:var(--convex-black);color:#fff;border-left:1px solid rgba(255,255,255,.1);box-shadow:-12px 0 32px #00000040;transform:translate(100%);transition:transform .25s ease}.console--open{transform:translate(0)}.console__bar{width:100%;flex-shrink:0;display:flex;align-items:center;gap:.6rem;padding:.9rem 1.1rem;background:none;border:none;border-bottom:1px solid rgba(255,255,255,.08);color:#fff;cursor:pointer;font-size:.85rem}.console__dot{width:8px;height:8px;border-radius:50%;background:var(--paystack-green);animation:pulse 2.2s infinite}.console__title{font-weight:700}.console__count{margin-left:auto;color:#ffffff8c;font-size:.78rem}.console__chevron{color:#ffffff8c}.console__body{flex:1;min-height:0;display:flex;flex-direction:column}.console__log{flex:1;min-height:0;overflow-y:auto;padding:.5rem .5rem .25rem;font-family:var(--mono-font);font-size:.8rem}.console__empty{color:#ffffff73;padding:1rem;margin:0;font-family:var(--mono-font);font-size:.82rem}.console__entry{border-bottom:1px solid rgba(255,255,255,.05)}.console__row{width:100%;display:flex;align-items:center;gap:.7rem;padding:.4rem .75rem;background:none;border:none;color:#ffffffd9;cursor:default;text-align:left;font-family:inherit;font-size:inherit}.console__row:has(.console__expand){cursor:pointer}.console__row:hover{background:#ffffff0a}.console__time{color:#fff6;flex-shrink:0}.console__tag{flex-shrink:0;padding:.05rem .5rem;border-radius:999px;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em}.console__tag--webhook{background:#3bb75e2e;color:#7fe3a0}.console__tag--client{background:#f3b01c2e;color:var(--convex-yellow)}.console__message{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.console__row--error .console__message{color:#ff9a92}.console__row--success .console__message{color:#7fe3a0}.console__expand{flex-shrink:0;color:#fff6;font-size:.72rem;text-decoration:underline}.console__payload{margin:0 .75rem .5rem 2.6rem;padding:.6rem .8rem;background:#ffffff0a;border-radius:var(--radius-sm);font-size:.72rem;color:#ffffffbf;overflow-x:auto;max-height:200px;overflow-y:auto}.console__footer{flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:.5rem 1.25rem;font-size:.75rem;color:#ffffff73;border-top:1px solid rgba(255,255,255,.08)}.link-button--console{color:var(--convex-yellow);font-size:.75rem}@media(max-width:640px){.site-header__inner{padding:.8rem 1rem;flex-wrap:wrap}.site-header__nav{order:3;flex-basis:100%}.stat-pill{display:none}.dev-panel,.plan-grid,.result-card__meta{grid-template-columns:1fr}.field-row{flex-direction:column}.flow-card{padding:1.5rem;margin:2rem auto}.hero{padding:2.75rem 1.25rem 3.5rem}.hero h1{font-size:1.7rem}}:root{color-scheme:light dark}body{margin:0}
