:root{color:#f4f6fb;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#101117;font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html{background:#101117;min-width:320px;min-height:100%}body{background:#101117;min-width:320px;min-height:100svh;margin:0}button,input,textarea,select{font:inherit}#root{min-height:100svh}.payment-shell{background:radial-gradient(circle at 50% -10%,#28c29a29,#0000 34%),linear-gradient(#14161d 0%,#101117 100%);place-items:center;min-height:100svh;padding:18px;display:grid}.payment-card{color:#f4f6fb;background:#17191f;border:1px solid #ffffff12;border-radius:18px;width:min(100%,390px);min-height:min(760px,100svh - 36px);overflow:hidden;box-shadow:0 22px 70px #00000061}.payment-hero{border-bottom:1px solid #262932;flex-direction:column;align-items:center;padding:18px 16px 14px;display:flex;position:relative}.language-switch{color:#8d94a4;background:#272a33;border-radius:8px;grid-template-columns:1fr 1fr;gap:2px;margin-bottom:12px;padding:3px;font-size:11px;font-weight:800;display:inline-grid}.language-switch span{border-radius:6px;place-items:center;min-width:28px;min-height:20px;display:grid}.language-switch .active{color:#e7fff6;background:linear-gradient(135deg,#2c8f79,#2f6e65)}.coin-mark{background:linear-gradient(145deg,#36d69b,#168d74);border-radius:999px;place-items:center;width:38px;height:38px;margin-bottom:9px;display:grid;box-shadow:inset 0 0 0 4px #ffffff14,0 12px 24px #1cc8973d}.coin-mark span{border:2px solid #ffffffc7;border-radius:7px;place-items:center;width:20px;height:20px;font-size:14px;font-weight:900;line-height:1;display:grid}.payment-hero h1{color:#f2f4fa;margin:0 0 12px;font-size:18px;font-weight:800}.network-pill{color:#31b990;background:#1f846f2b;border:1px solid #30cda02b;border-radius:999px;align-items:center;gap:7px;min-height:28px;padding:0 14px;font-size:12px;font-weight:900;display:inline-flex}.network-dot{background:#2bd69a;border-radius:999px;width:6px;height:6px;box-shadow:0 0 12px #2bd69acc}.amount-panel{border-bottom:1px solid #262932;place-items:center;padding:18px 18px 17px;display:grid}.amount-panel p,.panel-title{color:#818896;letter-spacing:1.5px;margin:0;font-size:12px;font-weight:900}.amount-panel strong{color:#f6f7fb;margin-top:6px;font-size:30px;font-weight:900;line-height:1.05}.amount-panel span{color:#20c394;margin-top:6px;font-size:13px;font-weight:800}.details-panel,.wallet-panel,.risk-panel{margin:0 14px}.details-panel{background:#1f2128;border:1px solid #292c35;border-radius:10px;margin-top:0;overflow:hidden}.panel-title{align-items:center;gap:8px;padding:14px 14px 12px;display:flex}.panel-icon{color:#7f8794;letter-spacing:0;font-size:14px}.details-panel dl{margin:0}.details-panel div{border-top:1px solid #2a2d36;grid-template-columns:102px 1fr;gap:10px;padding:13px 14px;display:grid}.details-panel dt,.details-panel dd{margin:0;font-size:12px;line-height:1.35}.details-panel dt{color:#8f96a3;font-weight:800}.details-panel dd{color:#dfe3eb;text-align:right;word-break:break-word;font-weight:850}.wallet-panel{padding-top:3px}.wallet-panel .panel-title,.risk-panel .panel-title{padding-inline:0;padding-bottom:10px}.wallet-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;display:grid}.wallet-card{color:#eff2f6;cursor:pointer;min-width:0;min-height:96px;font:inherit;background:#20232b;border:1px solid #2d313b;border-radius:10px;place-items:center;padding:10px 6px 13px;transition:border-color .18s,box-shadow .18s,transform .18s;display:grid;position:relative}.wallet-card:hover,.wallet-card:focus-visible{border-color:color-mix(in srgb, var(--wallet-accent), #fff 10%);outline:none;transform:translateY(-1px)}.wallet-card[aria-pressed=true]{border-color:var(--wallet-accent);box-shadow:0 0 0 1px color-mix(in srgb, var(--wallet-accent), transparent 26%), 0 13px 28px color-mix(in srgb, var(--wallet-accent), transparent 84%)}.wallet-logo{color:#fff;background:var(--wallet-accent);border-radius:11px;place-items:center;width:40px;height:40px;display:grid;box-shadow:inset 0 -12px 18px #0000001f}.wallet-logo span{font-size:13px;font-weight:950;line-height:1}.okx .wallet-logo span{color:#111}.wallet-name{color:#f0f3f8;text-overflow:ellipsis;white-space:nowrap;width:100%;margin-top:7px;font-size:11px;font-weight:850;line-height:1.15;overflow:hidden}.wallet-card small{color:#89919f;text-overflow:ellipsis;white-space:nowrap;width:100%;margin-top:4px;font-size:9px;font-weight:800;line-height:1;overflow:hidden}.wallet-dot{background:#f2f4f7;border-radius:999px;width:8px;height:8px;position:absolute;bottom:7px;left:50%;transform:translate(-50%);box-shadow:0 0 0 2px #ffffff14}.wallet-card[aria-pressed=true] .wallet-dot{background:#39e0a5;box-shadow:0 0 0 2px #39e0a52e,0 0 12px #39e0a5b3}.risk-panel{background:#f59e0b14;border:1px solid #f59e0b38;border-radius:10px;margin-top:13px;padding:0 12px 12px}.risk-panel .panel-title{color:#f6b85d}.risk-panel p{color:#f2d8ae;margin:0;font-size:11px;font-weight:750;line-height:1.45}.risk-panel strong{color:#ffd58a}.risk-panel dl{gap:8px;margin:10px 0 0;display:grid}.risk-panel div{grid-template-columns:92px 1fr;gap:8px;display:grid}.risk-panel dt,.risk-panel dd{min-width:0;margin:0;font-size:10px;line-height:1.35}.risk-panel dt{color:#b8a27f;font-weight:900}.risk-panel dd{overflow-wrap:anywhere;color:#f6efe3;text-align:right;font-weight:850}.payment-actions{gap:9px;margin:20px 14px 0;display:grid}.pay-button,.pay-later-button{cursor:pointer;border:0;border-radius:9px;place-items:center;width:100%;min-height:46px;font-size:14px;font-weight:900;display:grid}.pay-button{color:#f6fffb;background:linear-gradient(135deg,#31c59a,#22a979);box-shadow:0 12px 26px #1dc89340}.pay-later-button{color:#c6d1dc;background:#23262e;border:1px solid #30343e}.pay-button:disabled{cursor:progress;opacity:.78}.pay-button:active:not(:disabled){transform:translateY(1px)}.pay-button:focus-visible,.pay-later-button:focus-visible{outline-offset:3px;outline:3px solid #34dfa661}.dapp-pay-shell{background:#eef1f7;place-items:center;min-height:100svh;display:grid}.dapp-phone{color:#717784;background:#f3f5fa;width:min(100%,393px);min-height:100svh;box-shadow:0 20px 70px #1d2a411f}.dapp-topbar{color:#4f5665;text-align:center;background:#fff;border-bottom:1px solid #e4e8ef;grid-template-columns:72px 1fr 72px;align-items:center;min-height:50px;padding:0 10px;display:grid}.dapp-topbar strong{font-size:13px;font-weight:850}.dapp-window-actions{color:#384151;background:#fff;border:1px solid #edf0f5;border-radius:22px;justify-self:end;align-items:center;min-height:38px;display:inline-flex;overflow:hidden;box-shadow:0 1px 2px #1823360a}.dapp-window-actions span{place-items:center;width:38px;height:38px;font-size:18px;font-weight:800;display:grid}.dapp-window-actions span+span{border-left:1px solid #edf0f5}.dapp-form{gap:16px;padding:16px 10px 0;display:grid}.dapp-field{gap:9px;display:grid}.dapp-field span,.dapp-row-label,.fee-panel h2{color:#9aa0ab;font-size:14px;font-weight:850}.dapp-field input{color:#313743;background:#fff;border:1px solid #eceff5;border-radius:10px;outline:none;width:100%;min-height:52px;padding:0 14px;font-size:12px;font-weight:800}.dapp-row-label{justify-content:space-between;padding:0 10px 0 11px;display:flex}.amount-entry{background:#fff;border:1px solid #eceff5;border-radius:10px;padding:22px 13px 18px;display:grid}.amount-entry strong{color:#3b424e;letter-spacing:0;font-size:40px;font-weight:500;line-height:1}.amount-entry small{color:#c7cbd3;margin-top:10px;font-size:14px;font-weight:750}.amount-entry div{background:#edf1f6;height:1px;margin:17px 0 16px}.amount-entry span{color:#c2c6cf;font-size:14px;font-weight:800}.fee-panel{gap:10px;display:grid}.fee-panel h2{margin:0;padding-left:10px}.fee-box{background:#fff;border:1px solid #eceff5;border-radius:10px;padding:22px 12px 14px;display:grid}.fee-box>strong{color:#717784;font-size:22px;font-weight:800}.fee-box>span{color:#9aa0ab;margin-top:8px;font-size:14px;font-weight:750}.resource-tabs{grid-template-columns:1fr .65fr;gap:10px;margin-top:18px;display:grid}.resource-tabs button{color:#14a8ef;cursor:pointer;background:#fff;border:2px solid #25b8ff;border-radius:10px;min-height:45px;font-size:14px;font-weight:900}.resource-tabs button:disabled{color:#b8bdc7;cursor:not-allowed;background:#f0f1f4;border-color:#f0f1f4}.selected-resource{justify-content:center;align-items:center;gap:16px;display:inline-flex}.selected-resource span{color:#fff;background:#20aef5;border-radius:999px;place-items:center;width:16px;height:16px;font-size:11px;line-height:1;display:grid}.fee-panel p{color:#afb4bf;margin:0;padding:0 10px;font-size:13px;font-weight:800;line-height:1.55}.dapp-bottom{gap:12px;padding:37px 9px 24px;display:grid}.next-button{color:#fff;cursor:pointer;background:#227cf8;border:0;border-radius:10px;min-height:54px;font-size:17px;font-weight:900;box-shadow:0 14px 28px #227cf842}.next-button:disabled{cursor:progress;opacity:.74}.dapp-bottom p{color:#9198a4;text-align:center;min-height:36px;margin:0;font-size:12px;font-weight:750;line-height:1.45}.payment-notice{color:#8d95a3;text-align:center;min-height:34px;margin:10px 16px 16px;font-size:11px;font-weight:700;line-height:1.45}@media (width<=430px){.payment-shell{padding:0}.payment-card{border:0;border-radius:0;width:100%;min-height:100svh}}@media (width<=340px){.wallet-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.amount-entry strong{font-size:34px}.resource-tabs{grid-template-columns:1fr}}
