body dialog.payment-dialog{--payment-size:240px;--cashier-scale:.9375;position:fixed;inset:auto;left:50%;top:50%;transform:translate(-50%,-50%);margin:0!important;box-sizing:border-box;width:min(440px,calc(100vw - 24px));max-width:none;max-height:calc(100dvh - 24px);padding:0!important;overflow:hidden!important;border:1px solid #46515b!important;border-radius:14px!important;background:#1b2025!important;color:#edf0f3;text-align:left;box-shadow:0 24px 100px #0006;font-size:14px}
body dialog.payment-dialog:not([open]){display:none}body dialog.payment-dialog[open]{display:flex;flex-direction:column}body dialog.payment-dialog::backdrop{background:#080c11bd;backdrop-filter:blur(3px)}
body .payment-dialog .hh-frame-heading{display:flex;align-items:center;justify-content:space-between;flex:none;gap:16px;padding:18px 22px;margin:0;border-bottom:1px solid #333c44}
body .payment-dialog .hh-frame-heading :is(h2,h3){margin:0;font-size:17px;line-height:1.4}
body .payment-dialog .payment-close{position:static;display:flex;align-items:center;justify-content:center;flex:none;width:34px!important;min-height:34px!important;padding:0!important;border:1px solid #333c44!important;border-radius:7px;background:#252c33!important;color:#edf0f3!important;font-size:24px!important;line-height:1;cursor:pointer}
body .payment-dialog .hh-frame-body{flex:1 1 auto;min-height:0;min-width:0;padding:22px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-gutter:auto}
body .payment-dialog .payment-summary{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:20px}
body .payment-dialog .payment-product{min-width:0;margin:0;color:#edf0f3;font-size:14px;line-height:1.6;overflow-wrap:anywhere}
body .payment-dialog .payment-price{flex:none;text-align:right}body .payment-dialog .payment-price small{display:block;color:#a3adb7;font-size:12px}body .payment-dialog .payment-price strong{display:block;color:#efb47f;font-size:28px;line-height:1.3;font-weight:600;font-variant-numeric:tabular-nums}
body .payment-dialog .payment-methods{min-width:0;margin:0;padding:0;border:0}body .payment-dialog .payment-methods legend{margin:0 0 10px;padding:0;color:#a3adb7;font-size:12px}
body .payment-dialog .payment-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
body .payment-dialog .payment-choice{display:flex;align-items:center;gap:8px;min-width:0;min-height:54px;margin:0;padding:10px;border:1px solid #424a50;border-radius:8px;background:#24292d;cursor:pointer;font-size:13px}
body .payment-dialog .payment-choice>img{width:24px;height:24px;flex:none}body .payment-dialog .payment-choice>span{flex:1;min-width:0;color:#edf0f3}body .payment-dialog .payment-choice input{width:15px;height:15px;min-height:0;margin:0;accent-color:#efb47f;flex:none}body .payment-dialog .payment-choice:has(input:checked){border-color:#efb47f;background:#efb47f0d}body .payment-dialog .payment-choice.unavailable{opacity:.45}body .payment-dialog .payment-choice:has(input:focus-visible){outline:2px solid #efb47f;outline-offset:3px}
body .payment-dialog .payment-instruction{margin:18px 0 12px;color:#bbc5cb;text-align:center;font-size:13px;line-height:1.6}body .payment-dialog .payment-media:empty{display:none}
body .payment-dialog :is(.payment-code,#payment-code){box-sizing:content-box;width:var(--payment-size);height:var(--payment-size);margin:0 auto;border:8px solid #fff;border-radius:10px;overflow:hidden;background:#fff;flex:none}
body .payment-dialog :is(.payment-code img,#payment-code #qr){display:block;width:var(--payment-size);max-width:none;height:var(--payment-size);margin:0;border:0;border-radius:0;object-fit:contain;background:#fff}
body .payment-dialog :is(.payment-cashier,#alipay-cashier){width:var(--payment-size);height:var(--payment-size);overflow:hidden;margin:0}
body .payment-dialog :is(.payment-cashier iframe,#cashier-frame){display:block;width:256px;max-width:none;height:256px;margin:0;border:0;background:#fff;color-scheme:light;transform:scale(var(--cashier-scale)) translate(8px,8px);transform-origin:top left}
body .payment-dialog .payment-cashier-link{display:block;margin:12px 0 0;text-align:center;font-size:12px;color:#efb47f;text-decoration:underline}
body .payment-dialog :is(.payment-order,#order-summary){margin:16px 0 0;color:#909da5;font-size:12px;line-height:1.6;overflow-wrap:anywhere}
body .payment-dialog :is(.payment-status,#order-status){margin:10px 0 0;color:#d5dde1;font-size:13px;line-height:1.6;overflow-wrap:anywhere}
body .payment-dialog .payment-hint{display:block;margin-top:8px;font-size:12px;color:#909da5;line-height:1.6}body .payment-dialog :is(.payment-hint,.payment-order):empty{display:none}
body .payment-dialog .hh-frame-footer{display:flex;flex:none;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap;padding:16px 22px;margin:0;border-top:1px solid #333c44}
body .payment-dialog .hh-frame-footer button{width:auto;min-height:38px;margin:0;padding:8px 13px;border:1px solid #efb47f;border-radius:7px;background:#efb47f;color:#241a12;font:inherit;font-size:13px;cursor:pointer}
body .payment-dialog .hh-frame-footer button.secondary{background:#252c33;color:#edf0f3;border-color:#424a50}body .payment-dialog button:disabled{opacity:.5;cursor:default}
body .payment-dialog #payment-details{margin:0;max-height:none;overflow:visible}body .payment-dialog #payment-help{margin-top:12px;text-align:center;font-size:12px}body .payment-dialog #payment-notice{margin:8px 0;color:#efb47f;font-size:12px;line-height:1.6}
@media(max-width:380px){body dialog.payment-dialog{--payment-size:220px;--cashier-scale:.859375}body .payment-dialog :is(.hh-frame-heading,.hh-frame-body,.hh-frame-footer){padding:16px}body .payment-dialog .payment-choices{gap:8px}body .payment-dialog .payment-choice{gap:6px;padding:8px}body .payment-dialog .payment-choice>img{width:22px;height:22px}}
body .payment-dialog [hidden]{display:none!important}

/* Match the preceding membership cashier: compact centered heading, code, details and one query button. */
body dialog.payment-dialog{padding:16px!important;border-color:#566166!important;border-radius:18px!important;background:#202426!important;text-align:center}
body .payment-dialog .hh-frame-heading{justify-content:center;gap:10px;min-height:32px;margin:0 28px 10px;padding:0;border:0}
body .payment-dialog .hh-frame-heading :is(h2,h3){font-size:20px;line-height:1.5}
body .payment-dialog .payment-provider-icon{width:28px;height:28px;flex:none}
body .payment-dialog .payment-close{position:absolute;top:8px;right:8px}
body .payment-dialog .hh-frame-body{padding:0;scrollbar-gutter:stable both-edges}
body .payment-dialog .payment-instruction{margin:0 0 14px;min-height:23px;color:#dce2e0;font-size:13px;line-height:1.7}
body .payment-dialog .payment-summary{margin:12px 0 20px;text-align:left}
body .payment-dialog .payment-methods{text-align:left;margin-bottom:16px}
body .payment-dialog.payment-code-stage .payment-summary,body .payment-dialog.payment-code-stage .hh-frame-footer .secondary{display:none}
body .payment-dialog :is(.payment-hint,#payment-help){display:flex;align-items:center;justify-content:center;flex-wrap:wrap;min-height:42px;margin:12px 0;color:#a3afa9;font-size:12px;line-height:1.7}
body .payment-dialog :is(.payment-order,.payment-status,#order-summary,#order-status){margin:0 0 12px;color:#adb3bd;font-size:12px;line-height:1.8;overflow-wrap:anywhere;text-align:center}
body .payment-dialog #payment-details{padding:0;margin:0}
body .payment-dialog .hh-frame-footer{padding:0;margin:12px 0 0;border:0}
body .payment-dialog.payment-code-stage .hh-frame-footer>button{width:100%;min-height:46px;margin:0}
@media(max-height:650px){body dialog.payment-dialog{--payment-size:208px;--cashier-scale:.8125;padding:16px!important}body .payment-dialog .payment-instruction{margin-bottom:10px}body .payment-dialog .hh-frame-heading{margin-bottom:6px}body .payment-dialog.payment-code-stage .hh-frame-footer>button{min-height:42px}}
@media(max-height:520px){body dialog.payment-dialog{--payment-size:176px;--cashier-scale:.6875;padding:12px 20px!important}body .payment-dialog .hh-frame-heading{min-height:28px}body .payment-dialog .hh-frame-heading :is(h2,h3){font-size:18px}body .payment-dialog .payment-instruction{font-size:12px;margin-bottom:8px}body .payment-dialog.payment-code-stage .hh-frame-footer>button{min-height:40px}body .payment-dialog :is(.payment-hint,#payment-help){min-height:28px;margin:8px 0}}
@media(max-height:380px){body dialog.payment-dialog{--payment-size:128px;--cashier-scale:.5;padding:8px 16px!important}body .payment-dialog .hh-frame-heading{margin-bottom:2px}body .payment-dialog .payment-instruction{margin-bottom:4px}body .payment-dialog.payment-code-stage .hh-frame-footer>button{min-height:36px}}

/* Before generating a code, use the site's framed selection dialog. */
body dialog.payment-dialog:not(.payment-code-stage){padding:0!important;text-align:left}
body .payment-dialog:not(.payment-code-stage) .hh-frame-heading{justify-content:space-between;gap:16px;min-height:0;margin:0;padding:18px 22px;border-bottom:1px solid #333c44}
body .payment-dialog:not(.payment-code-stage) .hh-frame-heading :is(h2,h3){font-size:18px}
body .payment-dialog:not(.payment-code-stage) .payment-close{position:static}
body .payment-dialog:not(.payment-code-stage) :is(.payment-provider-icon,.payment-instruction,.hh-frame-footer .secondary){display:none}
body .payment-dialog:not(.payment-code-stage) .hh-frame-body{padding:22px;scrollbar-gutter:auto}
body .payment-dialog:not(.payment-code-stage) .payment-summary{margin:0 0 24px}
body .payment-dialog:not(.payment-code-stage) .payment-methods{margin-bottom:16px}
body .payment-dialog:not(.payment-code-stage) :is(.payment-hint,.payment-order,.payment-status):empty{display:none}
body .payment-dialog:not(.payment-code-stage) .payment-status{margin:16px 0 0}
body .payment-dialog:not(.payment-code-stage) .hh-frame-footer{justify-content:center;padding:18px 22px;margin:0;border-top:1px solid #333c44}
body .payment-dialog:not(.payment-code-stage) .hh-frame-footer>button:not(.secondary){width:100%;min-height:46px;margin:0}
@media(max-width:380px){body .payment-dialog:not(.payment-code-stage) :is(.hh-frame-heading,.hh-frame-body,.hh-frame-footer){padding:16px}}
