:root {
    --primary: #5b5ce2;
    --primary-dark: #4546c8;
    --primary-soft: #f0f0ff;
    --accent: #7c5cfc;
    --text: #171a2b;
    --text-secondary: #667085;
    --muted: #98a2b3;
    --border: #e7e9f2;
    --surface: #ffffff;
    --surface-soft: #f7f8fc;
    --success: #16a36a;
    --danger: #dc3f4f;
    --warning: #e77918;
    --radius-lg: 20px;
    --radius-md: 14px;
    --shadow: 0 12px 36px rgba(31, 35, 70, .09);
}

html { background: #f3f5fb; scroll-behavior: smooth; }
body {
    min-height: 100vh;
    min-height: 100dvh;
    color: var(--text);
    background:
        radial-gradient(circle at 8% 0%, rgba(124, 92, 252, .16), transparent 30rem),
        radial-gradient(circle at 100% 16%, rgba(91, 92, 226, .12), transparent 28rem),
        #f3f5fb;
    padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
}
button, input { font: inherit; }
button, [onclick] { -webkit-tap-highlight-color: transparent; }
button:focus-visible, input:focus-visible, [onclick]:focus-visible {
    outline: 3px solid rgba(91, 92, 226, .25);
    outline-offset: 2px;
}

.container { max-width: 620px; padding: 20px 18px 32px; }
.hero {
    position: relative;
    overflow: hidden;
    margin-bottom: 16px;
    padding: 26px 24px;
    color: #fff;
    border-radius: 24px;
    background: linear-gradient(135deg, #5152d9 0%, #7c5cfc 100%);
    box-shadow: 0 16px 42px rgba(83, 72, 190, .25);
}
.hero::after {
    content: '';
    position: absolute;
    width: 170px;
    height: 170px;
    right: -62px;
    top: -92px;
    border: 30px solid rgba(255, 255, 255, .09);
    border-radius: 50%;
}
.hero-kicker { font-size: 13px; font-weight: 700; letter-spacing: .1em; opacity: .78; }
.hero h1 { margin: 7px 0 6px; font-size: 27px; line-height: 1.2; }
.hero p { font-size: 14px; opacity: .84; }

.step-list { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin-top: 20px; }
.step-item { position: relative; text-align: center; font-size: 11px; color: rgba(255,255,255,.72); }
.step-number {
    display: grid;
    place-items: center;
    width: 27px;
    height: 27px;
    margin: 0 auto 6px;
    border-radius: 50%;
    font-weight: 800;
    color: #5b5ce2;
    background: #fff;
}
.user-card, .section {
    margin-bottom: 16px;
    padding: 22px;
    border: 1px solid rgba(231, 233, 242, .9);
    border-radius: var(--radius-lg);
    background: rgba(255,255,255,.96);
    box-shadow: var(--shadow);
}
.user-card h2 { margin: 0 0 5px; font-size: 18px; color: var(--text); }
.card-eyebrow { margin-bottom: 16px; font-size: 12px; color: var(--text-secondary); }
.section-title {
    margin-bottom: 16px;
    font-size: 17px;
    font-weight: 750;
    color: var(--text);
}
.section-title::before { width: 5px; height: 19px; background: linear-gradient(var(--primary), var(--accent)); }
.section-hint { display: block; margin: -9px 0 16px; font-size: 12px; line-height: 1.6; color: var(--text-secondary); }
#amountRange { margin-left: auto; padding: 2px 9px; border-radius: 10px; color: #0284c7 !important; background: #ecfeff; font-size: 12px; font-weight: 700; }
.field-label { display: block; margin-bottom: 8px; font-size: 13px; font-weight: 650; color: var(--text-secondary); }
.uid-input-wrap { margin: 0; }
.uid-input-wrap input, .custom-amount input {
    min-width: 0;
    min-height: 52px;
    border: 1.5px solid var(--border);
    border-radius: var(--radius-md);
    color: var(--text);
    background: var(--surface-soft);
    box-shadow: inset 0 1px 2px rgba(16,24,40,.03);
    transition: border-color .18s, box-shadow .18s, background .18s;
}
.uid-input-wrap input { padding: 0 16px; font-size: 16px; }
.uid-input-wrap input:focus, .custom-amount input:focus {
    border-color: var(--primary);
    background: #fff;
    box-shadow: 0 0 0 4px rgba(91,92,226,.1);
}
.error-msg { min-height: 18px; margin-top: 7px; color: var(--danger); font-size: 12px; line-height: 1.5; }
.custom-amount::before { left: 18px; z-index: 1; color: var(--primary); font-weight: 800; }
.custom-amount input { padding: 15px 48px; font-size: 24px; color: var(--text); }
.quick-amount { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-top: 14px; }
.quick-btn {
    display: grid;
    place-items: center;
    min-height: 46px;
    padding: 8px;
    border: 1.5px solid var(--border);
    border-radius: 12px;
    color: var(--text-secondary);
    background: var(--surface-soft);
    font-weight: 700;
    transition: transform .16s, border-color .16s, color .16s, background .16s;
}
.quick-btn:hover { border-color: var(--primary); color: var(--primary); background: var(--primary-soft); }
.quick-btn:active { transform: scale(.97); }
.quick-btn.active { border-color: var(--primary); color: #fff; background: linear-gradient(135deg,var(--primary),var(--accent)); box-shadow: 0 6px 16px rgba(91,92,226,.22); }
.channel-list { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; }
.channel-list > .pay-type-tab {
    justify-content: flex-start;
    min-height: 58px;
    padding: 12px 14px;
    border-radius: 14px;
    font-size: 14px;
}
.pay-type-tabs { flex-wrap: nowrap; gap: 8px; margin-bottom: 0; padding: 2px 2px 5px; overflow-x: auto; scrollbar-width: none; }
.pay-type-tabs::-webkit-scrollbar { display: none; }
.pay-type-tab { min-height: 44px; padding: 9px 15px; border: 1.5px solid var(--border); white-space: nowrap; }
.pay-type-tab.active { border-color: transparent; box-shadow: 0 5px 14px rgba(91,92,226,.2); }
.pay-type-tab .tab-icon { display: grid; place-items: center; width: 25px; height: 25px; border-radius: 8px; background: rgba(91,92,226,.09); }
.pay-type-tab.active .tab-icon { background: rgba(255,255,255,.18); }
.channel-loading {
    grid-column: 1 / -1;
    min-height: 86px;
    display: grid;
    place-items: center;
    border: 1px dashed var(--border);
    border-radius: 14px;
    color: var(--text-secondary);
    background: linear-gradient(90deg,#f7f8fc 25%,#eef0f8 50%,#f7f8fc 75%);
    background-size: 200% 100%;
    animation: loading-shimmer 1.4s infinite linear;
}
.sub-channel-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.sub-channel-item {
    position: relative;
    display: flex;
    min-height: 68px;
    padding: 13px 12px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border: 1.5px solid var(--border);
    border-radius: 14px;
    background: var(--surface-soft);
}
.sub-channel-item:hover { border-color: #b7b8ef; background: #f5f5ff; }
.sub-channel-item.active { border-color: var(--primary); background: var(--primary-soft); box-shadow: inset 0 0 0 1px var(--primary); }
.sub-channel-item.active::after { content: '✓'; position: absolute; top: 6px; right: 8px; color: var(--primary); font-size: 12px; font-weight: 900; }
.sub-channel-item .sc-name { font-size: 14px; color: var(--text); line-height: 1.35; }
.sub-channel-item .sc-type { min-height: 14px; margin-top: 4px; color: var(--text-secondary); font-size: 12px; }
.sub-channel-item .sc-type.sc-type-amount { color: var(--warning); font-size: 13px; }
.pay-preview { margin-top: 0; padding: 6px 16px; border: 1px solid #e6e2ff; border-radius: 16px; background: linear-gradient(145deg,#fafaff,#f4f1ff); }
.preview-row { min-height: 45px; padding: 11px 0; align-items: center; border-bottom: 1px solid #e8e5f5; }
.preview-row .label { color: var(--text-secondary); font-size: 14px; }
.preview-row .value { max-width: 62%; color: var(--text); text-align: right; overflow-wrap: anywhere; }
.preview-row.total .value, #previewMoney, #previewCoin { color: var(--primary); font-size: 17px; }
.checkout-action { position: sticky; bottom: max(10px,env(safe-area-inset-bottom)); z-index: 20; margin: 18px -7px -7px; padding: 7px; border-radius: 17px; background: rgba(255,255,255,.86); box-shadow: 0 8px 28px rgba(31,35,70,.13); backdrop-filter: blur(14px); }
.btn-pay { min-height: 54px; margin: 0; border-radius: 13px; background: linear-gradient(135deg,var(--primary),var(--accent)); box-shadow: 0 9px 20px rgba(91,92,226,.25); }
.btn-pay:hover { transform: translateY(-1px); box-shadow: 0 12px 24px rgba(91,92,226,.3); }
.btn-pay:active { transform: scale(.99); }
.btn-pay:disabled { box-shadow: none; }
.safe-tip { margin: 2px 0 8px; color: var(--text-secondary); font-size: 12px; }
.safe-tip span { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; color: var(--success); background: #eaf9f2; }
.modal { padding: 18px; background: rgba(17,20,38,.68); backdrop-filter: blur(8px); }
.modal-content { width: min(430px,100%); max-width: 430px; max-height: min(90vh,780px); max-height: min(90dvh,780px); padding: 28px; overflow-y: auto; border: 1px solid rgba(255,255,255,.5); border-radius: 24px; box-shadow: 0 24px 70px rgba(12,15,36,.28); animation: modal-in .22s ease-out; }
.modal-close { display: grid; place-items: center; width: 44px; height: 44px; top: 8px; right: 8px; border: 0; border-radius: 50%; color: var(--text-secondary); background: transparent; font-size: 27px; line-height: 1; }
.modal-close:hover { color: var(--text); background: var(--surface-soft); }
.modal-title { margin: 2px 42px 16px; font-size: 20px; color: var(--text); }
.amount-highlight { margin: 10px 0 18px; color: var(--primary); font-size: 30px; }
.amount-unit { color: var(--text-secondary); font-size: 14px; }
.qr-container { padding: 18px; border: 1px solid var(--border); border-radius: 18px; background: var(--surface-soft); }
.qr-code { width: min(210px,56vw); height: min(210px,56vw); }
.qr-code img { border-radius: 8px; }
.wallet-address { width: 100%; padding: 13px; border: 1px solid var(--border); border-radius: 12px; color: var(--text); background: var(--surface-soft); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 13px; line-height: 1.55; overflow-wrap: anywhere; cursor: pointer; }
.wallet-address:hover { border-color: var(--primary); background: var(--primary-soft); }
.copy-tip { color: var(--text-secondary); }
.btn-copy { min-height: 48px; border-radius: 12px; background: var(--primary); font-weight: 700; }
.btn-copy:hover { background: var(--primary-dark); }
.warning-text { color: #b93845; background: #fff2f3; line-height: 1.55; }
.warning-text:empty { display: none; }
.status-msg { padding: 12px; border-radius: 12px; line-height: 1.5; }
.status-success { color: #087a4b; background: #eaf9f2; }
.status-error { color: #b42335; background: #fff0f1; }
.status-waiting { color: #a45109; background: #fff6e9; }
#payStatus .btn { min-height: 40px; padding: 8px 18px !important; border: 1px solid var(--border); border-radius: 10px; color: var(--primary); background: #fff; font-weight: 700; }
#payStatus .btn:hover { border-color: var(--primary); background: var(--primary-soft); }
.expire-tip { margin-top: 15px; color: var(--text-secondary); font-size: 12px; }
.expire-tip span { color: var(--warning); font-weight: 800; }
#inlineErrorTip { top: auto !important; bottom: max(18px,env(safe-area-inset-bottom)) !important; width: min(420px,calc(100% - 28px)); border-radius: 12px !important; }
@keyframes modal-in { from { opacity: 0; transform: translateY(16px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes loading-shimmer { from { background-position: 200% 0; } to { background-position: -200% 0; } }
@media (max-width: 479px) {
    .container { padding: 12px 12px 26px; }
    .hero { padding: 22px 18px; border-radius: 20px; }
    .hero h1 { font-size: 24px; }
    .user-card, .section { padding: 18px; border-radius: 17px; }
    .quick-amount { grid-template-columns: repeat(3,1fr); gap: 8px; }
    .quick-btn { min-height: 45px; }
    .channel-list { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
    .channel-list > .pay-type-tab { min-height: 55px; padding: 10px; }
    .sub-channel-grid { gap: 8px; }
    .sub-channel-item { min-height: 66px; padding: 12px 9px; }
    .modal { align-items: flex-end; padding: 0; }
    .modal-content { width: 100%; max-width: none; max-height: 92dvh; padding: 25px 18px max(22px,env(safe-area-inset-bottom)); border-radius: 24px 24px 0 0; animation-name: sheet-in; }
    .checkout-action { bottom: max(6px,env(safe-area-inset-bottom)); }
}
@media (max-width: 359px) {
    .container { padding-inline: 9px; }
    .hero { padding-inline: 15px; }
    .hero h1 { font-size: 22px; }
    .step-item { font-size: 10px; }
    .user-card, .section { padding: 15px; }
    .channel-list, .sub-channel-grid { grid-template-columns: 1fr; }
    .quick-amount { grid-template-columns: repeat(2,1fr); }
}
@media (min-width: 768px) {
    .container { padding-top: 32px; padding-bottom: 44px; }
    .hero { padding: 30px; }
    .quick-amount { grid-template-columns: repeat(4,1fr); }
}
@media (max-height: 520px) and (orientation: landscape) {
    .modal-content { max-height: 96dvh; padding-block: 18px; }
    .qr-code { width: 150px; height: 150px; }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}
@keyframes sheet-in { from { opacity: 0; transform: translateY(36px); } to { opacity: 1; transform: none; } }

/* 彩色主题增强 V2 */
:root {
    --primary: #4f46e5;
    --primary-dark: #3730a3;
    --primary-soft: #eef2ff;
    --accent: #8b5cf6;
    --cyan: #06b6d4;
    --pink: #ec4899;
    --gold: #f59e0b;
    --shadow: 0 14px 40px rgba(67,56,202,.11);
}
body {
    background:
        radial-gradient(circle at 4% 4%, rgba(99,102,241,.24), transparent 25rem),
        radial-gradient(circle at 98% 18%, rgba(6,182,212,.18), transparent 24rem),
        radial-gradient(circle at 50% 100%, rgba(236,72,153,.10), transparent 30rem),
        linear-gradient(145deg,#eef2ff 0%,#f8f7ff 48%,#ecfeff 100%);
}
.hero {
    background: linear-gradient(125deg,#4338ca 0%,#6366f1 43%,#8b5cf6 72%,#06b6d4 130%);
    box-shadow: 0 20px 50px rgba(79,70,229,.32);
}
.hero::before { content:''; position:absolute; inset:0; background:linear-gradient(105deg,rgba(255,255,255,.13),transparent 40%); pointer-events:none; }
.step-number { box-shadow: 0 6px 16px rgba(36,32,110,.22); }
.user-card, .section {
    position: relative;
    overflow: hidden;
    border-color: rgba(129,140,248,.19);
    background: linear-gradient(145deg,rgba(255,255,255,.98),rgba(248,250,255,.94));
    box-shadow: 0 15px 42px rgba(67,56,202,.10), inset 0 1px rgba(255,255,255,.9);
}
.user-card::after, .section::after { content:''; position:absolute; width:100px; height:100px; right:-60px; top:-65px; border-radius:50%; background:radial-gradient(circle,rgba(99,102,241,.12),transparent 70%); pointer-events:none; }
.section-title { align-items:center; }
.section-title::before { width:7px; height:22px; border-radius:8px; background:linear-gradient(180deg,#06b6d4,#6366f1 55%,#a855f7); box-shadow:0 4px 10px rgba(79,70,229,.28); }
:root { --text: #21204a; --text-secondary: #5b6788; }
.user-card h2 { color:#3730a3; }
.card-eyebrow, .section-hint { color:#6d6a9c; }
.uid-input-wrap input::placeholder, .custom-amount input::placeholder { color:#a5abd6; }
.section-title { color:#3730a3; }
.field-label { color:#4f46e5; }
.uid-input-wrap input, .custom-amount input { border-color:#dbe3ff; background:linear-gradient(135deg,#f8faff,#f4f7ff); }
.uid-input-wrap input:focus, .custom-amount input:focus { border-color:#6366f1; box-shadow:0 0 0 4px rgba(99,102,241,.13),0 8px 20px rgba(79,70,229,.08); }
.custom-amount::before { color:#6366f1; text-shadow:0 2px 8px rgba(99,102,241,.2); }
.quick-amount { gap: 11px; padding: 4px; }
.quick-btn {
    position: relative;
    min-height: 54px;
    overflow: hidden;
    border: 1px solid rgba(99,102,241,.22);
    border-radius: 15px;
    color: #4338ca;
    background: linear-gradient(145deg,#f5f7ff,#e9edff);
    box-shadow: 0 7px 18px rgba(79,70,229,.09), inset 0 1px rgba(255,255,255,.85);
    font-size: 15px;
    font-weight: 800;
}
.quick-btn::before { content:''; position:absolute; width:38px; height:38px; right:-19px; top:-21px; border-radius:50%; background:currentColor; opacity:.10; }
.quick-btn:nth-child(2), .quick-btn:nth-child(6) { color:#0284c7; border-color:rgba(14,165,233,.24); background:linear-gradient(145deg,#f0f9ff,#e0f2fe); }
.quick-btn:nth-child(3), .quick-btn:nth-child(7) { color:#7c3aed; border-color:rgba(139,92,246,.24); background:linear-gradient(145deg,#faf5ff,#f3e8ff); }
.quick-btn:nth-child(4) { color:#db2777; border-color:rgba(236,72,153,.23); background:linear-gradient(145deg,#fdf2f8,#fce7f3); }
.quick-btn:nth-child(5) { color:#d97706; border-color:rgba(245,158,11,.27); background:linear-gradient(145deg,#fffbeb,#fef3c7); }
.quick-btn:nth-child(5)::after { content:'热门'; position:absolute; right:5px; top:4px; padding:1px 5px; border-radius:8px; color:#fff; background:linear-gradient(135deg,#f59e0b,#f97316); font-size:8px; font-weight:800; }
.quick-btn:hover { transform:translateY(-2px); border-color:currentColor; color:inherit; background:linear-gradient(145deg,#fff,#eef2ff); box-shadow:0 11px 24px rgba(79,70,229,.16); }
.quick-btn.active, .quick-btn:nth-child(n).active {
    transform: translateY(-2px);
    border-color: transparent;
    color: #fff;
    background: linear-gradient(135deg,#4338ca,#6366f1 48%,#8b5cf6);
    box-shadow: 0 12px 26px rgba(79,70,229,.32), inset 0 1px rgba(255,255,255,.24);
}
.quick-btn.active::after { content:'✓'; top:5px; right:7px; padding:0; color:#fff; background:transparent; font-size:12px; }
.channel-list { gap: 12px; }
.pay-type-tab {
    position: relative;
    overflow: hidden;
    border-color: rgba(99,102,241,.18);
    color: #475569;
    background: linear-gradient(145deg,#ffffff,#f3f6ff);
    box-shadow: 0 6px 16px rgba(79,70,229,.07);
}
.pay-type-tab::after { content:''; position:absolute; width:50px; height:50px; right:-32px; bottom:-33px; border-radius:50%; background:linear-gradient(135deg,#06b6d4,#8b5cf6); opacity:.15; }
.pay-type-tab .tab-icon { color:#4f46e5; background:linear-gradient(135deg,#e0e7ff,#ede9fe); box-shadow:inset 0 1px rgba(255,255,255,.9); }
.pay-type-tab:nth-child(2n) .tab-icon { color:#0284c7; background:linear-gradient(135deg,#cffafe,#e0f2fe); }
.pay-type-tab:nth-child(3n) .tab-icon { color:#db2777; background:linear-gradient(135deg,#fce7f3,#fae8ff); }
.pay-type-tab:hover { transform:translateY(-2px); border-color:#818cf8; color:#4338ca; box-shadow:0 10px 24px rgba(79,70,229,.14); }
.pay-type-tab.active {
    color:#fff;
    background:linear-gradient(125deg,#4338ca,#6366f1 55%,#8b5cf6);
    box-shadow:0 12px 26px rgba(79,70,229,.28);
}
.pay-type-tab.active .tab-icon { color:#fff; background:rgba(255,255,255,.18); box-shadow:inset 0 0 0 1px rgba(255,255,255,.2); }
.channel-loading { position:relative; overflow:hidden; border-color:rgba(99,102,241,.25); color:#6366f1; background:linear-gradient(110deg,#eef2ff 18%,#f5f3ff 38%,#ecfeff 58%,#eef2ff 78%); background-size:250% 100%; font-weight:700; }
.channel-loading::before { content:'◌'; margin-right:8px; color:#8b5cf6; animation:spin 1.2s linear infinite; }
.sub-channel-item {
    overflow:hidden;
    border-color:rgba(99,102,241,.18);
    background:linear-gradient(145deg,#fff,#f5f7ff);
    box-shadow:0 6px 17px rgba(79,70,229,.07);
}
.sub-channel-item::before { content:''; position:absolute; width:44px; height:44px; left:-26px; bottom:-26px; border-radius:50%; background:linear-gradient(135deg,#06b6d4,#8b5cf6); opacity:.15; }
.sub-channel-item:hover { transform:translateY(-2px); border-color:#818cf8; background:linear-gradient(145deg,#fff,#eef2ff); box-shadow:0 10px 23px rgba(79,70,229,.14); }
.sub-channel-item.active { border-color:#6366f1; background:linear-gradient(145deg,#eef2ff,#f5f3ff); box-shadow:0 9px 22px rgba(79,70,229,.17),inset 0 0 0 1px #818cf8; }
.sub-channel-item.active::after { display:grid; place-items:center; width:19px; height:19px; top:6px; right:7px; border-radius:50%; color:#fff; background:linear-gradient(135deg,#4f46e5,#8b5cf6); box-shadow:0 4px 10px rgba(79,70,229,.3); }
.sub-channel-item.active .sc-name { color:#4338ca; }
.sub-channel-item .sc-name { color:#21204a; }
.sub-channel-item .sc-type { color:#6b7aa8; }
.sub-channel-item .sc-type.sc-type-amount { display:inline-flex; padding:2px 7px; border-radius:8px; color:#c2410c; background:#fff7ed; }
.pay-preview {
    position: relative;
    overflow: hidden;
    border-color: rgba(99,102,241,.25);
    background:
        radial-gradient(circle at 100% 0,rgba(139,92,246,.13),transparent 11rem),
        linear-gradient(145deg,#f8faff,#f5f3ff 55%,#ecfeff);
    box-shadow: inset 0 1px rgba(255,255,255,.9),0 9px 24px rgba(79,70,229,.08);
}
.pay-preview::before { content:'订单信息'; position:absolute; right:13px; top:9px; padding:3px 8px; border-radius:10px; color:#6366f1; background:rgba(238,242,255,.9); font-size:10px; font-weight:800; letter-spacing:.08em; }
.preview-row { border-bottom-color:rgba(99,102,241,.13); }
.preview-row .label { color:#64748b; }
.preview-row .value { color:#312e81; }
#previewMoney { color:#db2777; }
#previewCoin { color:#7c3aed; }
#previewChannel { color:#0284c7; }
.checkout-action { border:1px solid rgba(129,140,248,.18); background:linear-gradient(145deg,rgba(255,255,255,.92),rgba(238,242,255,.88)); box-shadow:0 14px 35px rgba(79,70,229,.18); }
.btn-pay {
    position:relative;
    overflow:hidden;
    border:1px solid rgba(255,255,255,.22);
    background:linear-gradient(110deg,#3730a3 0%,#4f46e5 28%,#7c3aed 66%,#06b6d4 130%);
    box-shadow:0 11px 26px rgba(79,70,229,.34),inset 0 1px rgba(255,255,255,.25);
    letter-spacing:.08em;
}
.btn-pay::before { content:''; position:absolute; inset:0; transform:translateX(-115%) skewX(-20deg); background:linear-gradient(90deg,transparent,rgba(255,255,255,.27),transparent); animation:button-shine 3.8s ease-in-out infinite; }
.btn-pay:hover { box-shadow:0 15px 32px rgba(79,70,229,.42); }
.btn-pay:disabled { color:#94a3b8; border-color:#e2e8f0; background:linear-gradient(145deg,#eef2f7,#e2e8f0); }
.btn-pay:disabled::before { display:none; }
.safe-tip { color:#53627a; }
.safe-tip span { color:#059669; background:linear-gradient(135deg,#d1fae5,#ccfbf1); box-shadow:0 5px 13px rgba(16,185,129,.16); }
.modal { background:rgba(30,27,75,.72); }
.modal-content { border-color:rgba(196,181,253,.5); background:radial-gradient(circle at 100% 0,rgba(139,92,246,.13),transparent 14rem),linear-gradient(150deg,#fff,#f8f7ff 68%,#ecfeff); box-shadow:0 28px 85px rgba(30,27,75,.38); }
.modal-title { color:#312e81; }
.amount-highlight { color:#4f46e5; text-shadow:0 4px 14px rgba(79,70,229,.16); }
.qr-container { border-color:#c7d2fe; background:linear-gradient(145deg,#eef2ff,#f5f3ff); box-shadow:inset 0 0 0 5px rgba(255,255,255,.65); }
.wallet-address { border-color:#c7d2fe; color:#4338ca; background:linear-gradient(145deg,#f8faff,#eef2ff); }
.wallet-address:hover { border-color:#6366f1; background:#eef2ff; box-shadow:0 6px 16px rgba(79,70,229,.11); }
.btn-copy { background:linear-gradient(135deg,#4f46e5,#7c3aed); box-shadow:0 9px 20px rgba(79,70,229,.23); }
.btn-copy:hover { background:linear-gradient(135deg,#3730a3,#6d28d9); }
.status-success { border:1px solid #a7f3d0; background:linear-gradient(135deg,#ecfdf5,#d1fae5); }
.status-error { border:1px solid #fecdd3; background:linear-gradient(135deg,#fff1f2,#ffe4e6); }
.status-waiting { border:1px solid #fde68a; background:linear-gradient(135deg,#fffbeb,#fef3c7); }
.warning-text { border:1px solid #fecdd3; background:linear-gradient(135deg,#fff1f2,#fff7ed); }
@keyframes button-shine { 0%,62% { transform:translateX(-115%) skewX(-20deg); } 82%,100% { transform:translateX(125%) skewX(-20deg); } }