#mvp-pay-v2-root {
    --mvp-pay-accent: var(--merchant-theme-accent, #2878f0);
    --mvp-pay-accent2: var(--merchant-theme-accent-2, #6c5ce7);
    position: fixed;
    inset: 0;
    z-index: 2147483500;
    display: none;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
}
#mvp-pay-v2-root.mvp-pay-open { display: block; }
#mvp-pay-v2-root .mvp-pay-mask {
    position: absolute;
    inset: 0;
    background: rgba(11, 18, 33, .58);
    backdrop-filter: blur(3px);
}
#mvp-pay-v2-root .mvp-pay-sheet {
    position: absolute;
    left: 50%;
    bottom: 0;
    width: min(560px, 100%);
    transform: translateX(-50%);
    background: #fff;
    color: #162033;
    border-radius: 24px 24px 0 0;
    box-shadow: 0 -20px 55px rgba(15, 31, 56, .24);
    padding: 20px 20px calc(20px + env(safe-area-inset-bottom));
    animation: mvpPaySlide .22s ease-out;
}
@keyframes mvpPaySlide { from { transform: translate(-50%, 28px); opacity: 0; } to { transform: translate(-50%, 0); opacity: 1; } }
#mvp-pay-v2-root .mvp-pay-head { display:flex; align-items:center; justify-content:space-between; gap:12px; }
#mvp-pay-v2-root .mvp-pay-head h3 { margin:0; font-size:20px; font-weight:800; }
#mvp-pay-v2-root .mvp-pay-close {
    width:36px; height:36px; border:0; border-radius:12px; background:#f1f4f8; color:#536176;
    font-size:22px; line-height:1; cursor:pointer;
}
#mvp-pay-v2-root .mvp-pay-summary {
    margin-top:14px; padding:14px 16px; border:1px solid #e7ecf3; border-radius:16px;
    background:linear-gradient(135deg, #f7faff, #f8f6ff); display:flex; align-items:center; justify-content:space-between; gap:14px;
}
#mvp-pay-v2-root .mvp-pay-summary small { display:block; color:#7a8799; margin-bottom:4px; }
#mvp-pay-v2-root .mvp-pay-product { font-size:14px; font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:340px; }
#mvp-pay-v2-root .mvp-pay-price { font-size:24px; font-weight:900; color:var(--mvp-pay-accent); white-space:nowrap; }
#mvp-pay-v2-root .mvp-pay-tip { margin:16px 0 10px; text-align:center; color:#68768a; font-size:13px; }
#mvp-pay-v2-root .mvp-pay-dots { display:grid; grid-template-columns:repeat(6, 1fr); gap:9px; max-width:390px; margin:0 auto 16px; }
#mvp-pay-v2-root .mvp-pay-dot {
    height:48px; border:1px solid #dce3ed; border-radius:13px; background:#fafbfd;
    display:flex; align-items:center; justify-content:center; font-size:24px; font-weight:900;
}
#mvp-pay-v2-root .mvp-pay-dot.filled::after { content:'•'; }
#mvp-pay-v2-root .mvp-pay-keyboard { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; }
#mvp-pay-v2-root .mvp-pay-key {
    height:48px; border:1px solid #e3e8ef; border-radius:13px; background:#f7f9fc; color:#172238;
    font-size:19px; font-weight:750; cursor:pointer; user-select:none;
}
#mvp-pay-v2-root .mvp-pay-key:active { transform:scale(.98); background:#edf3fb; }
#mvp-pay-v2-root .mvp-pay-submit {
    width:100%; height:48px; margin-top:12px; border:0; border-radius:14px; color:#fff;
    background:linear-gradient(90deg, var(--mvp-pay-accent), var(--mvp-pay-accent2)); font-size:16px; font-weight:800; cursor:pointer;
}
#mvp-pay-v2-root .mvp-pay-submit:disabled { opacity:.48; cursor:not-allowed; }
#mvp-pay-v2-toast {
    position:fixed; left:50%; top:48%; transform:translate(-50%,-50%); z-index:2147483600;
    min-width:210px; max-width:calc(100vw - 40px); padding:15px 20px; border-radius:14px;
    color:#fff; text-align:center; font-weight:750; box-shadow:0 16px 40px rgba(0,0,0,.22); opacity:0; pointer-events:none;
    transition:opacity .18s ease, transform .18s ease;
}
#mvp-pay-v2-toast.show { opacity:1; transform:translate(-50%,-54%); }
#mvp-pay-v2-toast.success { background:#10a66a; }
#mvp-pay-v2-toast.error { background:#e5484d; }
html[data-merchant-theme-dark="1"] #mvp-pay-v2-root .mvp-pay-sheet,
html[data-theme-mode="dark"] #mvp-pay-v2-root .mvp-pay-sheet { background:#172039; color:#f7f9ff; }
html[data-merchant-theme-dark="1"] #mvp-pay-v2-root .mvp-pay-summary,
html[data-theme-mode="dark"] #mvp-pay-v2-root .mvp-pay-summary { background:#202b49; border-color:#34405f; }
html[data-merchant-theme-dark="1"] #mvp-pay-v2-root .mvp-pay-dot,
html[data-theme-mode="dark"] #mvp-pay-v2-root .mvp-pay-dot,
html[data-merchant-theme-dark="1"] #mvp-pay-v2-root .mvp-pay-key,
html[data-theme-mode="dark"] #mvp-pay-v2-root .mvp-pay-key { background:#202b49; border-color:#34405f; color:#fff; }
@media (min-width: 760px) {
    #mvp-pay-v2-root .mvp-pay-sheet { bottom:50%; transform:translate(-50%,50%); border-radius:24px; }
    @keyframes mvpPaySlide { from { transform:translate(-50%,44%); opacity:0; } to { transform:translate(-50%,50%); opacity:1; } }
}
