/* Fastdatafy - premium MoMo checkout (partials/momo-checkout-flow.blade.php) */
.mcp, .mcp *, .mcp *::before, .mcp *::after { box-sizing: border-box; }
.mcp {
    --mcp-blue: #2563EB;
    --mcp-violet: #7C3AED;
    --mcp-ink: #0F172A;
    --mcp-muted: #64748B;
    --mcp-line: #E2E8F0;
    --mcp-soft: #F8FAFC;
    --mcp-grad: linear-gradient(120deg, #2563EB, #7C3AED);
    color: var(--mcp-ink);
}
.mcp [hidden] { display: none !important; }
.mcp .mcp-sr { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; border: 0 !important; }

/* step transitions */
.mcp .momo-checkout-step:not([hidden]) { animation: mcpIn .45s cubic-bezier(.2, .8, .2, 1) both; }

.mcp .mcp-label { display: block; margin: 14px 0 7px; font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--mcp-muted); }

/* ---------- network cards ---------- */
.mcp .mcp-networks { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.mcp .mcp-net {
    position: relative; display: flex; flex-direction: column; align-items: center; gap: 7px;
    width: 100%; margin: 0; padding: 12px 6px 10px; border-radius: 14px; cursor: pointer;
    background: #fff; border: 2px solid var(--mcp-line); box-shadow: none; color: var(--mcp-ink);
    font: inherit; text-align: center;
    transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.mcp .mcp-net:hover { transform: translateY(-2px); border-color: #C7D2FE; }
.mcp .mcp-net__logo {
    width: 38px; height: 38px; border-radius: 11px; overflow: hidden; display: grid; place-items: center;
    background: #fff; box-shadow: 0 3px 10px -4px rgba(15, 23, 42, .3);
}
.mcp .mcp-net__logo img { width: 100%; height: 100%; object-fit: contain; }
.mcp .mcp-net__logo b { font-size: 12px; font-weight: 900; }
.mcp .mcp-net--mtn .mcp-net__logo b { color: #1E293B; background: #FFCC00; width: 100%; height: 100%; display: grid; place-items: center; }
.mcp .mcp-net--telecel .mcp-net__logo b { color: #fff; background: #E11D48; width: 100%; height: 100%; display: grid; place-items: center; }
.mcp .mcp-net--airteltigo .mcp-net__logo b { color: #fff; background: linear-gradient(135deg, #DC2626, #1D4ED8); width: 100%; height: 100%; display: grid; place-items: center; }
.mcp .mcp-net__name { font-size: 12px; font-weight: 800; line-height: 1.2; }
.mcp .mcp-net__tick { position: absolute; top: 6px; right: 6px; font-size: 17px; color: var(--mcp-blue); opacity: 0; transform: scale(.4); transition: opacity .2s ease, transform .25s cubic-bezier(.3, 1.6, .5, 1); }
.mcp .mcp-net.is-selected { border-color: var(--mcp-blue); background: linear-gradient(180deg, #F5F9FF, #fff); box-shadow: 0 8px 18px -10px rgba(37, 99, 235, .7); }
.mcp .mcp-net.is-selected .mcp-net__tick { opacity: 1; transform: scale(1); }
.mcp .mcp-net--mtn.is-selected { border-color: #EAB308; background: linear-gradient(180deg, #FFFBEB, #fff); box-shadow: 0 8px 18px -10px rgba(234, 179, 8, .8); }
.mcp .mcp-net--mtn.is-selected .mcp-net__tick { color: #CA8A04; }
.mcp .mcp-net--telecel.is-selected { border-color: #E11D48; background: linear-gradient(180deg, #FFF1F2, #fff); box-shadow: 0 8px 18px -10px rgba(225, 29, 72, .7); }
.mcp .mcp-net--telecel.is-selected .mcp-net__tick { color: #E11D48; }

/* ---------- phone input ---------- */
.mcp .mcp-phone { position: relative; display: block; }
.mcp .mcp-phone i { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); font-size: 20px; color: var(--mcp-violet); pointer-events: none; }
.mcp .mcp-phone input {
    width: 100%; margin: 0; padding: 14px 14px 14px 44px; font-size: 16px; font-weight: 700; letter-spacing: .04em;
    color: var(--mcp-ink); background: var(--mcp-soft); border: 2px solid var(--mcp-line); border-radius: 14px;
    transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.mcp .mcp-phone input:focus { outline: none; background: #fff; border-color: var(--mcp-violet); box-shadow: 0 0 0 5px rgba(124, 58, 237, .12); }
.mcp .mcp-hint { display: flex; align-items: flex-start; gap: 7px; margin: 9px 2px 0; font-size: 12.5px; color: var(--mcp-muted); line-height: 1.45; }
.mcp .mcp-hint i { color: #F59E0B; font-size: 16px; margin-top: 1px; animation: mcpRing 2.4s ease-in-out infinite; }

/* ---------- buttons ---------- */
.mcp .mcp-actions { display: flex; gap: 10px; margin-top: 16px; }
.mcp .mcp-actions > * { flex: 1; }
.mcp .guest-checkout__btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    min-height: 50px; padding: 12px 18px; border-radius: 14px; cursor: pointer;
    font-size: 15px; font-weight: 800; transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
}
.mcp .guest-checkout__btn--primary.mcp-pay {
    position: relative; overflow: hidden; color: #fff; border: 0;
    background: linear-gradient(120deg, #2563EB, #7C3AED, #DB2777, #2563EB); background-size: 300% 100%;
    box-shadow: 0 12px 24px -12px rgba(124, 58, 237, .9);
    animation: mcpGrad 6s ease infinite;
}
.mcp .guest-checkout__btn--primary.mcp-pay::after {
    content: ""; position: absolute; inset: 0;
    background: linear-gradient(110deg, transparent 25%, rgba(255, 255, 255, .35) 50%, transparent 75%);
    transform: translateX(-120%); animation: mcpShine 3.2s ease-in-out infinite;
}
.mcp .guest-checkout__btn--primary.mcp-pay:hover { transform: translateY(-2px); filter: saturate(1.15); }
.mcp .guest-checkout__btn--primary.mcp-pay:disabled { opacity: .6; animation: none; }
.mcp .guest-checkout__btn--ghost { color: #334155; background: #fff; border: 2px solid var(--mcp-line); }
.mcp .guest-checkout__btn--ghost:hover { border-color: #94A3B8; }
.mcp .guest-checkout__btn--full { width: 100%; }

.mcp .mcp-trust { display: flex; justify-content: center; flex-wrap: wrap; gap: 6px 14px; margin: 14px 0 0; font-size: 11.5px; font-weight: 700; color: var(--mcp-muted); }
.mcp .mcp-trust span { display: inline-flex; align-items: center; gap: 5px; }
.mcp .mcp-trust i { font-size: 15px; }
.mcp .mcp-trust span:nth-child(1) i { color: #059669; }
.mcp .mcp-trust span:nth-child(2) i { color: #F59E0B; }
.mcp .mcp-trust span:nth-child(3) i { color: var(--mcp-violet); }

/* ---------- status steps ---------- */
.mcp .mcp-status { text-align: center; padding: 8px 4px 4px; }
.mcp .mcp-status h4 { margin: 14px 0 6px; font-size: 20px; font-weight: 800; letter-spacing: -.01em; color: var(--mcp-ink); }
.mcp .mcp-status > p[data-momo-message] { margin: 0 auto; max-width: 340px; font-size: 14px; line-height: 1.5; color: var(--mcp-muted); }
.mcp .mcp-small { display: flex; align-items: center; justify-content: center; gap: 6px; margin: 12px 0 0; font-size: 12px; color: var(--mcp-muted); }

/* loading orbit */
.mcp .mcp-orbit { position: relative; width: 84px; height: 84px; margin: 6px auto 0; display: grid; place-items: center; }
.mcp .mcp-orbit span { position: absolute; inset: 0; border-radius: 50%; border: 4px solid #E0E7FF; border-top-color: var(--mcp-blue); border-right-color: var(--mcp-violet); animation: mcpSpin .9s linear infinite; }
.mcp .mcp-orbit i { font-size: 30px; color: var(--mcp-violet); animation: mcpFly 1.4s ease-in-out infinite; }
.mcp .mcp-dots { display: flex; justify-content: center; gap: 6px; margin-top: 14px; }
.mcp .mcp-dots span { width: 8px; height: 8px; border-radius: 50%; background: var(--mcp-grad); animation: mcpBounce 1.2s ease-in-out infinite; }
.mcp .mcp-dots span:nth-child(2) { animation-delay: .15s; }
.mcp .mcp-dots span:nth-child(3) { animation-delay: .3s; }

/* badges */
.mcp .mcp-badge { width: 68px; height: 68px; margin: 4px auto 0; border-radius: 22px; display: grid; place-items: center; font-size: 32px; color: #fff; animation: mcpPop .5s cubic-bezier(.3, 1.6, .5, 1) both; }
.mcp .mcp-badge--violet { background: linear-gradient(135deg, #A78BFA, #7C3AED); box-shadow: 0 14px 28px -14px rgba(124, 58, 237, .9); }
.mcp .mcp-badge--blue { background: linear-gradient(135deg, #60A5FA, #2563EB); box-shadow: 0 14px 28px -14px rgba(37, 99, 235, .9); }
.mcp .mcp-badge--red { background: linear-gradient(135deg, #F87171, #DC2626); box-shadow: 0 14px 28px -14px rgba(220, 38, 38, .9); }

.mcp .mcp-code {
    display: block; width: 100%; max-width: 280px; margin: 6px auto 0; padding: 14px;
    text-align: center; font-size: 24px; font-weight: 800; letter-spacing: .35em;
    color: var(--mcp-ink); background: var(--mcp-soft); border: 2px solid var(--mcp-line); border-radius: 14px;
}
.mcp .mcp-code:focus { outline: none; background: #fff; border-color: var(--mcp-violet); box-shadow: 0 0 0 5px rgba(124, 58, 237, .12); }
.mcp .mcp-status .mcp-label { text-align: center; margin-top: 16px; }

/* ---------- approve on phone ---------- */
.mcp .mcp-phone-anim { position: relative; width: 150px; height: 150px; margin: 0 auto; display: grid; place-items: center; }
.mcp .mcp-wave { position: absolute; inset: 22px; border-radius: 50%; border: 2px solid rgba(124, 58, 237, .45); animation: mcpWave 2.4s ease-out infinite; }
.mcp .mcp-wave:nth-child(2) { animation-delay: .8s; border-color: rgba(37, 99, 235, .45); }
.mcp .mcp-wave:nth-child(3) { animation-delay: 1.6s; border-color: rgba(219, 39, 119, .4); }
.mcp .mcp-device {
    position: relative; width: 70px; height: 122px; border-radius: 16px; padding: 5px;
    background: linear-gradient(160deg, #1E293B, #0F172A);
    box-shadow: 0 18px 30px -14px rgba(15, 23, 42, .7), inset 0 0 0 2px #334155;
    animation: mcpBuzz 2.4s ease-in-out infinite;
}
.mcp .mcp-device__notch { position: absolute; top: 7px; left: 50%; width: 20px; height: 4px; margin-left: -10px; border-radius: 4px; background: #334155; z-index: 2; }
.mcp .mcp-device__screen { height: 100%; border-radius: 12px; overflow: hidden; display: grid; place-items: center; background: linear-gradient(180deg, #312E81, #1D4ED8 60%, #7C3AED); }
.mcp .mcp-device__pop {
    width: 52px; padding: 6px 4px; border-radius: 8px; background: #fff; text-align: center;
    display: flex; flex-direction: column; align-items: center; gap: 2px;
    box-shadow: 0 6px 12px -4px rgba(0, 0, 0, .4);
    animation: mcpPopLoop 2.4s ease-in-out infinite;
}
.mcp .mcp-device__pop i { font-size: 12px; color: #F59E0B; }
.mcp .mcp-device__pop b { font-size: 6.5px; line-height: 1.1; color: #0F172A; }
.mcp .mcp-device__pop span { font-size: 6px; font-weight: 800; color: #fff; background: var(--mcp-grad); padding: 1px 5px; border-radius: 4px; }

.mcp .mcp-timer {
    display: inline-flex; align-items: center; gap: 8px; margin: 14px 0 0; padding: 7px 14px; border-radius: 99px;
    font-size: 12.5px; font-weight: 700; color: #4338CA; background: #EEF2FF; border: 1px solid #C7D2FE;
}
.mcp .mcp-timer b { font-variant-numeric: tabular-nums; color: var(--mcp-ink); }
.mcp .mcp-timer__dot { width: 8px; height: 8px; border-radius: 50%; background: #22C55E; box-shadow: 0 0 0 0 rgba(34, 197, 94, .6); animation: mcpLive 1.6s ease-out infinite; }

.mcp .mcp-steps-quick { list-style: none; margin: 16px auto 0; padding: 0; max-width: 320px; display: grid; gap: 8px; text-align: left; }
.mcp .mcp-steps-quick li { display: flex; align-items: center; gap: 10px; font-size: 13.5px; font-weight: 600; color: #334155; animation: mcpIn .5s cubic-bezier(.2, .8, .2, 1) both; }
.mcp .mcp-steps-quick li:nth-child(2) { animation-delay: .1s; }
.mcp .mcp-steps-quick li:nth-child(3) { animation-delay: .2s; }
.mcp .mcp-steps-quick span { width: 24px; height: 24px; flex: none; border-radius: 8px; display: grid; place-items: center; font-size: 12px; font-weight: 800; color: #fff; background: var(--mcp-grad); }

/* help accordion */
.mcp .mcp-help {
    margin: 18px 0 0; text-align: left; border-radius: 16px; overflow: hidden;
    background: #FFFBEB; border: 1.5px solid #FDE68A;
    transition: box-shadow .3s ease;
}
.mcp .mcp-help summary {
    list-style: none; cursor: pointer; display: flex; align-items: center; gap: 8px;
    padding: 13px 14px; font-size: 14px; font-weight: 800; color: #92400E;
}
.mcp .mcp-help summary::-webkit-details-marker { display: none; }
.mcp .mcp-help summary > i:first-child { font-size: 19px; color: #F59E0B; }
.mcp .mcp-help__chev { margin-left: auto; transition: transform .25s ease; }
.mcp .mcp-help[open] .mcp-help__chev { transform: rotate(180deg); }
.mcp .mcp-help--nudge { box-shadow: 0 0 0 4px rgba(245, 158, 11, .2); animation: mcpNudge .6s ease 2; }
.mcp .mcp-help__body { padding: 0 14px 14px; animation: mcpIn .35s ease both; }
.mcp .mcp-help__title { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; font-size: 13px; font-weight: 800; color: var(--mcp-ink); }
.mcp .mcp-help__title img { width: 22px; height: 22px; border-radius: 6px; object-fit: contain; background: #fff; }

.mcp .mcp-howto { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; position: relative; }
.mcp .mcp-howto li {
    position: relative; display: flex; align-items: center; gap: 10px;
    padding: 9px 10px; border-radius: 12px; background: #fff; border: 1px solid #FEF3C7;
    font-size: 13.5px; color: #334155;
}
.mcp .mcp-howto li b { color: var(--mcp-ink); }
.mcp .mcp-howto__n { width: 26px; height: 26px; flex: none; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 800; color: #fff; background: linear-gradient(135deg, #FBBF24, #F97316); }
.mcp .mcp-ussd {
    display: inline-block; margin-left: 2px; padding: 3px 10px; border-radius: 8px;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 15px; font-weight: 800; letter-spacing: .04em;
    color: #fff; background: linear-gradient(120deg, #2563EB, #7C3AED); text-decoration: none;
    box-shadow: 0 6px 14px -6px rgba(124, 58, 237, .8);
}
.mcp .mcp-ussd:hover { color: #fff; text-decoration: none; filter: saturate(1.2); }

.mcp .mcp-tips { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-top: 10px; }
.mcp .mcp-tips--compact { grid-template-columns: 1fr; margin: 14px auto 4px; max-width: 360px; text-align: left; }
.mcp .mcp-tip { display: flex; align-items: flex-start; gap: 7px; padding: 8px 9px; border-radius: 10px; background: rgba(255, 255, 255, .7); font-size: 12px; line-height: 1.35; color: #475569; }
.mcp .mcp-tips--compact .mcp-tip { background: #F8FAFC; border: 1px solid var(--mcp-line); }
.mcp .mcp-tip i { font-size: 16px; color: var(--mcp-violet); flex: none; margin-top: 1px; }
.mcp .mcp-keep { color: #B45309; font-weight: 600; }

/* ---------- success ---------- */
.mcp .mcp-success { position: relative; overflow: hidden; }
.mcp .mcp-check { width: 86px; height: 86px; margin: 4px auto 0; }
.mcp .mcp-check svg { width: 100%; height: 100%; }
.mcp .mcp-check circle { fill: #ECFDF5; stroke: #10B981; stroke-width: 3; stroke-dasharray: 151; stroke-dashoffset: 151; animation: mcpDraw .6s ease forwards; }
.mcp .mcp-check path { fill: none; stroke: #059669; stroke-width: 4.5; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 36; stroke-dashoffset: 36; animation: mcpDraw .4s .5s ease forwards; }
.mcp .mcp-success h4 { color: #047857; }
.mcp .mcp-confetti { position: absolute; inset: 0; pointer-events: none; }
.mcp .mcp-confetti i { position: absolute; top: 40%; left: 50%; width: 8px; height: 12px; border-radius: 2px; opacity: 0; animation: mcpBurst 1.4s .3s cubic-bezier(.2, .8, .2, 1) forwards; }
.mcp .mcp-confetti i:nth-child(1)  { --x: -120px; --y: -70px;  background: #2563EB; }
.mcp .mcp-confetti i:nth-child(2)  { --x: 120px;  --y: -80px;  background: #7C3AED; }
.mcp .mcp-confetti i:nth-child(3)  { --x: -90px;  --y: 40px;   background: #F59E0B; }
.mcp .mcp-confetti i:nth-child(4)  { --x: 100px;  --y: 50px;   background: #10B981; }
.mcp .mcp-confetti i:nth-child(5)  { --x: -40px;  --y: -110px; background: #DB2777; }
.mcp .mcp-confetti i:nth-child(6)  { --x: 40px;   --y: -105px; background: #0EA5E9; }
.mcp .mcp-confetti i:nth-child(7)  { --x: -150px; --y: -10px;  background: #FACC15; }
.mcp .mcp-confetti i:nth-child(8)  { --x: 150px;  --y: -20px;  background: #2563EB; }
.mcp .mcp-confetti i:nth-child(9)  { --x: -60px;  --y: 80px;   background: #7C3AED; }
.mcp .mcp-confetti i:nth-child(10) { --x: 60px;   --y: 85px;   background: #F97316; }
.mcp .mcp-confetti i:nth-child(11) { --x: -130px; --y: -100px; background: #10B981; }
.mcp .mcp-confetti i:nth-child(12) { --x: 130px;  --y: -110px; background: #DB2777; }

/* ---------- error ---------- */
.mcp .mcp-shake { animation: mcpPop .5s cubic-bezier(.3, 1.6, .5, 1) both, mcpShakeX .45s .5s ease both; }
.mcp .momo-checkout-error-actions { display: grid; gap: 8px; margin-top: 14px; }

/* ---------- keyframes ---------- */
@keyframes mcpIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes mcpGrad { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }
@keyframes mcpShine { 0%, 55% { transform: translateX(-120%); } 85%, 100% { transform: translateX(120%); } }
@keyframes mcpSpin { to { transform: rotate(360deg); } }
@keyframes mcpFly { 0%, 100% { transform: translate(0, 0) rotate(0); } 50% { transform: translate(4px, -4px) rotate(-8deg); } }
@keyframes mcpBounce { 0%, 80%, 100% { transform: scale(.6); opacity: .5; } 40% { transform: scale(1); opacity: 1; } }
@keyframes mcpPop { from { transform: scale(0) rotate(-20deg); } to { transform: scale(1) rotate(0); } }
@keyframes mcpWave { 0% { transform: scale(.7); opacity: .9; } 100% { transform: scale(1.5); opacity: 0; } }
@keyframes mcpBuzz { 0%, 70%, 100% { transform: rotate(0); } 74% { transform: rotate(-6deg); } 78% { transform: rotate(6deg); } 82% { transform: rotate(-5deg); } 86% { transform: rotate(4deg); } 90% { transform: rotate(0); } }
@keyframes mcpPopLoop { 0%, 15% { transform: scale(.4); opacity: 0; } 30%, 85% { transform: scale(1); opacity: 1; } 100% { transform: scale(.9); opacity: 0; } }
@keyframes mcpLive { 0% { box-shadow: 0 0 0 0 rgba(34, 197, 94, .6); } 100% { box-shadow: 0 0 0 9px rgba(34, 197, 94, 0); } }
@keyframes mcpRing { 0%, 70%, 100% { transform: rotate(0); } 75% { transform: rotate(16deg); } 80% { transform: rotate(-14deg); } 85% { transform: rotate(10deg); } 90% { transform: rotate(-6deg); } }
@keyframes mcpNudge { 0%, 100% { transform: translateX(0); } 25% { transform: translateX(-4px); } 75% { transform: translateX(4px); } }
@keyframes mcpDraw { to { stroke-dashoffset: 0; } }
@keyframes mcpBurst { 0% { opacity: 1; transform: translate(-50%, -50%) rotate(0); } 100% { opacity: 0; transform: translate(calc(-50% + var(--x)), calc(-50% + var(--y))) rotate(540deg); } }
@keyframes mcpShakeX { 0%, 100% { transform: translateX(0); } 20%, 60% { transform: translateX(-6px); } 40%, 80% { transform: translateX(6px); } }

@media (max-width: 380px) {
    .mcp .mcp-net__name { font-size: 11px; }
    .mcp .mcp-tips { grid-template-columns: 1fr; }
    .mcp .mcp-status h4 { font-size: 18px; }
}
@media (prefers-reduced-motion: reduce) {
    .mcp *, .mcp *::before, .mcp *::after { animation: none !important; transition: none !important; }
    .mcp .mcp-check circle, .mcp .mcp-check path { stroke-dashoffset: 0; }
}

/* ---------- registered name ---------- */
.mcp .mcp-name {
    display: flex; align-items: center; gap: 10px; margin: 8px 0 0; padding: 10px 12px; border-radius: 14px;
    background: #F8FAFC; border: 1.5px solid var(--mcp-line);
    animation: mcpIn .3s cubic-bezier(.2, .8, .2, 1) both;
}
.mcp .mcp-name__icon { width: 34px; height: 34px; flex: none; border-radius: 11px; display: grid; place-items: center; font-size: 18px; color: #fff; background: #94A3B8; }
.mcp .mcp-name__body { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.mcp .mcp-name__label { font-size: 10.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--mcp-muted); }
.mcp .mcp-name__value { font-size: 15px; font-weight: 800; color: var(--mcp-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mcp .mcp-name.is-loading .mcp-name__icon { background: var(--mcp-grad); }
.mcp .mcp-name.is-loading .mcp-name__icon i { animation: mcpSpin 1s linear infinite; }
.mcp .mcp-name.is-loading .mcp-name__value {
    width: 140px; height: 14px; margin-top: 3px; border-radius: 6px; color: transparent;
    background: linear-gradient(90deg, #E2E8F0, #F1F5F9, #E2E8F0); background-size: 200% 100%; animation: mcpShimmer 1.1s linear infinite;
}
.mcp .mcp-name.is-found { background: linear-gradient(90deg, #ECFDF5, #F0FDFA); border-color: #6EE7B7; }
.mcp .mcp-name.is-found .mcp-name__icon { background: linear-gradient(135deg, #34D399, #059669); animation: mcpPop .45s cubic-bezier(.3, 1.6, .5, 1) both; }
.mcp .mcp-name.is-found .mcp-name__label { color: #047857; }
.mcp .mcp-name.is-found .mcp-name__value { color: #064E3B; font-size: 16px; }
.mcp .mcp-name.is-missing { background: #FFFBEB; border-color: #FDE68A; }
.mcp .mcp-name.is-missing .mcp-name__icon { background: linear-gradient(135deg, #FBBF24, #F97316); }
.mcp .mcp-name.is-missing .mcp-name__label { color: #B45309; }
.mcp .mcp-name.is-missing .mcp-name__value { font-size: 13px; font-weight: 600; color: #92400E; white-space: normal; }
@keyframes mcpShimmer { to { background-position: -200% 0; } }

/* ---------- phones: nothing shares a cramped row ---------- */
.mcp, .mcp .momo-checkout-step { min-width: 0; max-width: 100%; }
.mcp .guest-checkout__btn { white-space: nowrap; }
@media (max-width: 480px) {
    .mcp .mcp-actions { flex-direction: column-reverse; gap: 8px; }
    .mcp .mcp-actions > * { width: 100%; flex: none; }
    .mcp .guest-checkout__btn { min-height: 52px; font-size: 15px; }
    .mcp .mcp-networks { gap: 6px; }
    .mcp .mcp-net { padding: 10px 4px 8px; border-radius: 12px; gap: 5px; }
    .mcp .mcp-net__logo { width: 32px; height: 32px; border-radius: 9px; }
    .mcp .mcp-net__name { font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
    .mcp .mcp-net__tick { top: 4px; right: 4px; font-size: 15px; }
    .mcp .mcp-phone input { font-size: 16px; padding: 13px 12px 13px 42px; }
    .mcp .mcp-trust { gap: 4px 10px; font-size: 11px; }
    .mcp .mcp-phone-anim { width: 128px; height: 128px; }
    .mcp .mcp-device { width: 62px; height: 108px; }
    .mcp .mcp-status h4 { font-size: 18px; }
    .mcp .mcp-steps-quick li { font-size: 13px; align-items: flex-start; }
    .mcp .mcp-help summary { padding: 12px; font-size: 13.5px; }
    .mcp .mcp-help__body { padding: 0 10px 12px; }
    .mcp .mcp-howto li { padding: 8px; font-size: 13px; }
    .mcp .mcp-tips { grid-template-columns: 1fr; }
    .mcp .mcp-name__value { font-size: 14px; }
}
@media (max-width: 340px) {
    .mcp .mcp-net__logo { width: 28px; height: 28px; }
    .mcp .mcp-net__name { font-size: 10px; }
    .mcp .mcp-ussd { font-size: 14px; padding: 2px 8px; }
}

/* ---------- floating chat bubbles step aside during payment (phones) ---------- */
@media (max-width: 760px) {
    body.mcp-active .fd-chat-stack { transform: scale(.72); transform-origin: bottom right; opacity: .9; transition: transform .3s ease, opacity .3s ease; }
    body.mcp-active.mcp-has-chat .mcp .momo-checkout-step:not([data-momo-step="form"]) { padding-bottom: 120px; }
}