/* Center explicitly: the original app resets every element's margin. */
dialog.sm-checkout{--pay-bg:#101013;--pay-line:#ffffff20;--pay-text:#f0eeeb;--pay-muted:#a4a2ac;box-sizing:border-box;position:fixed;inset:0;top:0;right:0;bottom:0;left:0;margin:auto!important;width:min(510px,calc(100vw - 32px));height:fit-content;max-height:calc(100dvh - 32px);padding:22px;background:var(--pay-bg);color:var(--pay-text);border:1px solid #bd668344;border-radius:22px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;box-shadow:0 28px 100px #000b,0 0 48px #ff4f9a05;font:14px/1.5 Geist,Arial,sans-serif;color-scheme:dark}
dialog.sm-checkout:not([open]){display:none}
dialog.sm-checkout::backdrop{background:#000b;backdrop-filter:blur(8px)}
.sm-checkout *{box-sizing:border-box}
.sm-checkout [hidden]{display:none!important}
.sm-checkout .sm-pay-header{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:0 0 18px;padding:0;border:0}
.sm-pay-brand{display:flex;align-items:center;gap:12px}
.sm-pay-brand-mark{display:grid;place-items:center;width:38px;height:38px;flex:none;border:1px solid #ff4f9a77;border-radius:11px;color:#f0edef;background:#ff4f9a06;font:18px 'Geist Mono',monospace}
.sm-pay-eyebrow{font:9px/1.6 'Geist Mono',monospace;letter-spacing:.12em;color:var(--pay-muted)}
.sm-checkout h2{margin:3px 0 0;font:500 19px/1.3 Geist,Arial,sans-serif;letter-spacing:-.025em;color:var(--pay-text)}
.sm-checkout .sm-pay-close{display:grid;place-items:center;min-width:32px;width:32px;height:32px;padding:0;border:1px solid var(--pay-line);border-radius:50%;background:transparent;color:#a6a4af;font:23px/1 Arial;cursor:pointer}
.sm-pay-close:hover{color:white;border-color:#ffffff60}
.sm-checkout :focus-visible{outline:2px solid #ff4f9a88;outline-offset:3px}
.sm-pay-body{display:flex;flex-direction:column;gap:12px;padding:0;min-width:0}
.sm-pay-body>*{min-width:0}
.sm-pay-summary{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,auto);column-gap:16px;align-items:center;padding:0}
.sm-pay-summary>.sm-pay-token{grid-column:1;grid-row:1/span 2}
.sm-pay-summary>.sm-pay-label{grid-column:2;grid-row:1;text-align:right}
.sm-pay-summary>.sm-pay-amount-row{grid-column:2;grid-row:2;justify-content:flex-end}
.sm-pay-token{display:flex;align-items:center;gap:10px;margin:0;min-width:0}
.sm-pay-token>div{min-width:0}
.sm-pay-token-mark{display:grid;place-items:center;flex:none;width:33px;height:33px;border:1px solid var(--pay-line);border-radius:9px;font:11px 'Geist Mono',monospace;background:#ffffff04}
.sm-pay-token strong{display:block;font:500 13px/1.5 Geist,Arial;overflow-wrap:anywhere}
.sm-pay-token small{display:block;font:9px/1.6 'Geist Mono',monospace;color:var(--pay-muted);letter-spacing:.06em;overflow-wrap:anywhere}
.sm-pay-label{font:9px/1.5 'Geist Mono',monospace;letter-spacing:.1em;color:var(--pay-muted)}
.sm-pay-amount-row{display:flex;align-items:baseline;gap:7px;margin:2px 0 0;min-width:0}
.sm-pay-amount{font:400 34px/1.15 'Geist Mono',monospace;letter-spacing:-.07em;color:#fff;overflow-wrap:anywhere;min-width:0}
.sm-pay-currency{font:12px 'Geist Mono',monospace;color:var(--pay-muted)}
.sm-pay-network{display:flex;align-items:center;gap:9px;border:1px solid var(--pay-line);border-radius:9px;padding:7px 10px;font:11px 'Geist Mono',monospace}
.sm-pay-sol-mark{font:20px/1 monospace;transform:skew(-12deg);color:#e8e5e7}
.sm-pay-network strong{font-weight:500}
.sm-pay-network-name{margin-left:auto!important;color:#aaa7b2;font-size:10px;text-align:right}
.sm-pay-note{margin:0;color:var(--pay-muted);font:12px/1.55 Geist,Arial,sans-serif;overflow-wrap:anywhere}
.sm-pay-note.center{text-align:center}
.sm-pay-release-note{padding:11px;border:1px solid #ffffff18;border-radius:11px;background:#ffffff03}
/* Reset form-wide input sizing: the consent checkbox must stay beside its label. */
.sm-checkout .sm-pay-consent{display:grid;grid-template-columns:16px minmax(0,1fr);align-items:start;gap:10px;margin:0;padding:0;font:12px/1.6 Geist,Arial;color:#bdbbc5;letter-spacing:0;cursor:pointer}
.sm-checkout .sm-pay-consent input{appearance:auto;display:block;position:static;width:16px;min-width:16px;max-width:16px;height:16px;min-height:16px;max-height:16px;margin:2px 0 0!important;padding:0;border-radius:3px;box-shadow:none;accent-color:#e7d9df}
.sm-checkout .sm-pay-consent>span{display:block;min-width:0}
.sm-pay-policy-link{color:#f0eeeb;text-decoration:underline;text-decoration-color:#d780a366;text-underline-offset:3px}
.sm-pay-policy-link:hover{color:#fff;text-decoration-color:#d780a3}
.sm-pay-button{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:40px;margin:0;padding:9px 12px;border:1px solid #eeece9;border-radius:10px;background:#eeece9;color:#101013;font:500 12px/1.5 'Geist Mono',monospace;text-align:center;text-decoration:none;cursor:pointer;transition:background .18s,border-color .18s}
.sm-pay-button:hover{background:#fff;border-color:#ff4f9a99}
.sm-pay-button.secondary{background:transparent;color:#c8c5cf;border-color:var(--pay-line)}
.sm-pay-button.secondary:hover{background:#ffffff05;border-color:#ff4f9a66}
.sm-pay-button:disabled{opacity:.4;cursor:default}
.sm-pay-qr-wrap{display:grid;place-items:center;margin:0;padding:0}
.sm-pay-qr{display:block;width:164px;height:164px;max-width:100%;margin:0 auto;border:8px solid white;border-radius:13px;background:white;image-rendering:pixelated}
.sm-pay-expiry{text-align:center;margin:0!important;font:10px/1.5 'Geist Mono',monospace;color:#b9b3be;font-variant-numeric:tabular-nums}
.sm-pay-address{display:grid;gap:7px;padding:11px;border:1px solid #ffffff27;border-radius:11px;background:#ffffff03;align-content:start}
.sm-pay-address code{display:block;min-width:0;overflow-wrap:anywhere;word-break:break-word;user-select:all;font:11px/1.55 'Geist Mono',monospace;color:#e5e1e8}
.sm-pay-address .sm-pay-button{min-height:32px;padding:6px;font-size:10px}
.sm-pay-status{display:flex;align-items:center;gap:11px;padding-top:1px}
.sm-pay-status-dot{flex:none;width:17px;height:17px;border:1px solid #ffffff26;border-top-color:#ff4f9a99;border-radius:50%;animation:sm-pay-spin 2s linear infinite}
.sm-pay-status strong{display:block;color:#e4e1e8;font:400 12px/1.5 Geist,Arial}
.sm-pay-status small{display:block;margin-top:2px;color:#8f8b99;font:10px/1.5 Geist,Arial}
.sm-pay-feedback{margin:10px 0 0!important;padding:0;color:#d4a6b8;font:11px/1.5 Geist,Arial;overflow-wrap:anywhere}
.sm-pay-feedback:empty{display:none}
.sm-checkout .sm-pay-footer{display:flex;justify-content:center;align-items:center;gap:7px;width:100%;padding:11px 0 0;margin:13px 0 0;border-top:1px solid #ffffff0e;font:9px/1.5 'Geist Mono',monospace;color:#8a8592}
.sm-pay-security-dot{width:4px;height:4px;border-radius:50%;background:#ff4f9a88}
.sm-pay-orb{width:36px;height:36px;margin:25px auto 8px;border:1px solid #ffffff25;border-top-color:#ff4f9a88;border-radius:50%;animation:sm-pay-spin 1.8s linear infinite}
.sm-pay-success{display:grid;place-items:center;width:48px;height:48px;margin:3px auto 0;border:1px solid #ff4f9a66;border-radius:50%;background:#ff4f9a05;color:#f0e7ec;font:24px Geist,Arial;animation:sm-pay-arrive .4s ease-out}
.sm-pay-state-title{margin:0;text-align:center;font:500 20px/1.3 Geist,Arial}
.sm-pay-receipt{display:grid;gap:8px;padding:11px;border:1px solid var(--pay-line);border-radius:11px}
.sm-pay-line{display:flex;justify-content:space-between;gap:14px;font:10px/1.6 'Geist Mono',monospace}
.sm-pay-line>span:first-child{color:var(--pay-muted);flex:none}
.sm-pay-line>span:last-child{text-align:right;overflow-wrap:anywhere;min-width:0}
.sm-pay-explorer{color:#b9b0bd;text-align:center;font:10px/1.5 'Geist Mono',monospace;text-underline-offset:3px}
.sm-pay-copy-helper{position:fixed;left:-9999px;top:0;opacity:0}
@keyframes sm-pay-spin{to{transform:rotate(360deg)}}
@keyframes sm-pay-arrive{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}
/* A real invoice keeps the QR beside the address and payment action. All other
   states retain their natural reading order and have no empty grid tracks. */
.sm-checkout[data-payment-stage="invoice"] .sm-pay-body:has(>.sm-pay-qr-wrap){display:grid;grid-template-columns:164px minmax(0,1fr);gap:10px 16px;align-items:start}
.sm-pay-body:has(>.sm-pay-qr-wrap)>.sm-pay-summary{grid-column:1/-1;grid-row:1}
.sm-pay-body:has(>.sm-pay-qr-wrap)>.sm-pay-network{grid-column:1/-1;grid-row:2;margin-bottom:3px}
.sm-pay-body:has(>.sm-pay-qr-wrap)>.sm-pay-qr-wrap{grid-column:1;grid-row:3/span 2;align-self:center}
.sm-pay-body:has(>.sm-pay-qr-wrap)>.sm-pay-address{grid-column:2;grid-row:3}
.sm-pay-body:has(>.sm-pay-qr-wrap)>.sm-pay-check{grid-column:2;grid-row:4;font-size:11px}
.sm-pay-body:has(>.sm-pay-qr-wrap)>.sm-pay-expiry{grid-column:1;grid-row:5}
.sm-pay-body:has(>.sm-pay-qr-wrap)>.sm-pay-instructions{grid-column:2;grid-row:5;font-size:11px;line-height:1.5}
.sm-pay-body:has(>.sm-pay-qr-wrap)>.sm-pay-status{grid-column:1/-1;grid-row:6;padding-top:9px;border-top:1px solid #ffffff0e}
.sm-checkout[data-payment-stage="paid"] .sm-pay-body{display:flex;flex-direction:column;gap:10px}
.sm-pay-actions{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:stretch;gap:10px;width:100%}
.sm-pay-actions>.sm-pay-button{margin:0;min-width:0;min-height:42px;height:100%;font-size:11px}
.sm-checkout[data-payment-stage="paid"] .sm-pay-success{width:40px;height:40px;margin:0 auto;font-size:22px}
@media(max-width:480px){
  dialog.sm-checkout{width:calc(100vw - 24px);padding:16px;border-radius:18px;max-height:calc(100dvh - 24px)}
  .sm-checkout .sm-pay-header{margin-bottom:15px;gap:10px}
  .sm-pay-brand{gap:9px}.sm-checkout h2{font-size:18px}
  .sm-pay-brand-mark{width:34px;height:34px;font-size:16px}
  .sm-pay-body{gap:10px}.sm-pay-summary{column-gap:10px}
  .sm-pay-token{gap:7px}.sm-pay-token strong{font-size:12px}.sm-pay-token small{font-size:8px}
  .sm-pay-token-mark{width:29px;height:29px;font-size:10px}
  .sm-pay-amount{font-size:30px}.sm-pay-currency{font-size:10px}
  .sm-checkout[data-payment-stage="invoice"] .sm-pay-body:has(>.sm-pay-qr-wrap){grid-template-columns:144px minmax(0,1fr);gap:10px}
  .sm-pay-qr{width:144px;height:144px;border-width:6px;border-radius:10px}
  .sm-pay-address{padding:9px;gap:6px}.sm-pay-address code{font-size:10.5px;line-height:1.6}
  .sm-pay-address .sm-pay-button{font-size:10px;min-height:34px}
  .sm-pay-body:has(>.sm-pay-qr-wrap)>.sm-pay-check{font-size:10px;min-height:40px;padding:8px 5px}
  .sm-pay-expiry{font-size:9px}.sm-pay-body:has(>.sm-pay-qr-wrap)>.sm-pay-instructions{font-size:10.5px}
  .sm-checkout .sm-pay-footer{margin-top:11px;padding-top:10px}
}
/* Narrow windows / high zoom use a readable stacked layout. Short viewports
   may scroll the dialog instead of clipping a control or shrinking the QR. */
@media(max-width:359px){
  .sm-checkout[data-payment-stage="invoice"] .sm-pay-body:has(>.sm-pay-qr-wrap){display:flex;gap:10px}
  .sm-pay-body:has(>.sm-pay-qr-wrap)>.sm-pay-instructions{text-align:center}
  .sm-pay-summary{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
}
@media(max-height:560px){dialog.sm-checkout{max-height:calc(100dvh - 16px);padding-block:14px}.sm-checkout .sm-pay-header{margin-bottom:12px}}
@media(prefers-reduced-motion:reduce){.sm-pay-orb,.sm-pay-status-dot,.sm-pay-success{animation:none}.sm-pay-button{transition:none}}

/* Receipt history is a separate full view; checkout stays compact. */
.sm-pay-footer{flex-wrap:wrap}
.sm-pay-history-link{color:#e5c1d2;text-decoration:underline;text-underline-offset:3px;margin-left:5px}