.test-payment{width:min(460px,calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 48px);margin:auto;padding:0;border:0;border-radius:var(--r-card);background:var(--surface);color:var(--ink);overflow:hidden;text-align:left}.test-payment[open]{display:flex;flex-direction:column;animation:tp-in .18s ease-out}.test-payment::backdrop{background:rgba(20,33,28,.6)}@keyframes tp-in{0%{opacity:0;transform:translateY(8px)}}@keyframes tp-up{0%{transform:translateY(100%)}}.test-payment p{margin:0}.test-payment svg{flex:none}.test-payment .tp-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:20px 18px 14px 24px;border-bottom:1px solid var(--line)}.test-payment .tp-head h2{margin-top:8px;font:700 var(--fs-20)/1.25 var(--font-head);outline:0;overflow-wrap:anywhere}.test-payment .tp-head>div{min-width:0}.test-payment .tp-badge{display:inline-block;padding:4px 8px;border-radius:var(--r-tag);background:var(--coral-tint);color:var(--coral-ink);font-size:var(--fs-12);font-weight:700}.test-payment .tp-close{display:grid;place-items:center;width:var(--tap);height:var(--tap);padding:0;border:0;border-radius:50%;background:var(--soft);color:var(--ink)}.test-payment .tp-close:hover:not(:disabled){background:var(--line)}.test-payment .tp-body{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;display:flex;flex-direction:column;gap:14px;padding:18px 24px 4px}.test-payment .tp-summary{display:flex;align-items:center;gap:14px}.test-payment .tp-thumbs{display:flex;align-items:center;flex:none}.test-payment .tp-thumbs img{width:52px;height:52px;border-radius:var(--r-thumb);object-fit:cover;background:var(--soft);border:2px solid var(--surface)}.test-payment .tp-thumbs img+.tp-more,.test-payment .tp-thumbs img+img{margin-left:-12px}.test-payment .tp-more{display:grid;place-items:center;width:52px;height:52px;padding:2px;border:2px solid var(--surface);border-radius:var(--r-thumb);background:var(--soft);font-size:var(--fs-12);font-weight:700;line-height:1.15;text-align:center}.test-payment .tp-facts{display:grid;gap:4px;min-width:0}.test-payment .tp-count{font-weight:700}.test-payment .tp-count span{color:var(--muted);font-weight:400}.test-payment .tp-pickup{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:var(--fs-13)}.test-payment .tp-amount{padding:16px 18px;border-radius:var(--r-card);background:var(--soft)}.test-payment .tp-amount-label{display:block;color:var(--muted);font-size:var(--fs-13);font-weight:600}.test-payment .tp-amount-value{margin-top:4px}.test-payment .tp-amount-value .payable-main{display:block;font-size:var(--fs-30);line-height:1.1}.test-payment .tp-amount-value .price-sub{margin-top:4px}.test-payment .tp-amount-note{margin-top:10px;color:var(--muted);font-size:var(--fs-13)}.test-payment .tp-callout,.test-payment .tp-error{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border-radius:var(--r-thumb);font-size:var(--fs-13);line-height:1.5}.test-payment .tp-callout{background:var(--green-tint);color:var(--ink)}.test-payment .tp-error{background:var(--danger-tint);color:#7A1A14}.test-payment .tp-error svg{color:var(--danger)}.test-payment .tp-actions{flex:none;display:flex;flex-direction:column;gap:8px;padding:16px 24px 20px}.test-payment .tp-primary{width:100%;min-height:52px;font-size:var(--fs-17)}.test-payment .tp-primary:disabled{background:var(--green);border-color:var(--green);color:#fff;opacity:.75;cursor:progress}.test-payment .tp-secondary{width:100%}.test-payment .tp-expiry{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:4px;color:var(--muted);font-size:var(--fs-13);text-align:center}.test-payment .tp-spinner{width:18px;height:18px;border-radius:50%;border:2px solid rgba(255,255,255,.4);border-top-color:#fff;animation:tp-spin .8s linear infinite}@keyframes tp-spin{to{transform:rotate(1turn)}}.test-payment .tp-success{align-items:flex-start;gap:10px;padding-top:24px}.test-payment .tp-check{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--green);color:#fff}.test-payment .tp-success .tp-success-title{margin-top:6px;font:700 var(--fs-24)/1.2 var(--font-head)}.test-payment .tp-success p{max-width:360px;line-height:1.5}.test-payment .tp-success .tp-fine{color:var(--muted);font-size:var(--fs-13)}@media (max-width:639px){.test-payment{width:100%;max-width:100%;max-height:90dvh;margin:auto 0 0;border-radius:var(--r-card) var(--r-card) 0 0}.test-payment[open]{animation:tp-up .22s ease-out}.test-payment .tp-head{position:relative;padding:20px 16px 12px 20px}.test-payment .tp-head:before{content:"";position:absolute;top:8px;left:50%;width:40px;height:4px;margin-left:-20px;border-radius:2px;background:var(--line-strong)}.test-payment .tp-body{padding:16px 20px 4px}.test-payment .tp-amount-value .payable-main{font-size:var(--fs-24)}.test-payment .tp-actions{padding:12px 20px calc(16px + env(safe-area-inset-bottom));border-top:1px solid var(--line)}}