.po-overlay{position:fixed;inset:0;z-index:22000;display:flex;align-items:center;justify-content:center;padding:18px;background:rgba(8,10,16,.72);backdrop-filter:blur(6px);opacity:0;pointer-events:none;transition:opacity .25s ease}
.po-overlay.show{opacity:1;pointer-events:auto}
.po-modal{--po:#28c76f;--po-rgb:40,199,111;position:relative;z-index:2;width:100%;max-width:360px;overflow:hidden;border:1px solid var(--bs-border-color);border-radius:22px;background:var(--bs-body-bg,#16181d);box-shadow:0 24px 70px rgba(0,0,0,.6);transform:translateY(16px) scale(.96);opacity:0;transition:transform .3s cubic-bezier(.2,.9,.25,1.2),opacity .3s ease}
.po-overlay.show .po-modal{transform:none;opacity:1}
.po-modal.balance{--po:#ffae00;--po-rgb:255,174,0}
.po-fx{position:absolute;inset:0;z-index:1;overflow:hidden;pointer-events:none}
.po-confetti{position:absolute;left:50%;top:47%;width:8px;height:13px;border-radius:2px;background:var(--pc);box-shadow:0 0 10px color-mix(in srgb,var(--pc) 65%,transparent);opacity:0;animation:poConfetti var(--dur) cubic-bezier(.12,.72,.2,1) var(--delay) forwards}
.po-confetti.round{width:7px;height:7px;border-radius:50%}
@keyframes poConfetti{0%{opacity:0;transform:translate(-50%,-50%) scale(.35) rotate(0deg)}10%{opacity:1}72%{opacity:1}100%{opacity:0;transform:translate(-50%,-50%) translate(var(--px),var(--py)) scale(1) rotate(var(--rot))}}
@media(prefers-reduced-motion:reduce){.po-confetti{display:none}}
.po-hero{position:relative;height:158px;display:flex;align-items:center;justify-content:center;overflow:hidden;background:radial-gradient(120% 120% at 50% 0%,rgba(var(--po-rgb),.55),rgba(var(--po-rgb),.18) 45%,rgba(var(--po-rgb),.04))}
.po-hero:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.07),transparent 42%)}
.po-spark{position:absolute;color:#fff;opacity:.85;text-shadow:0 0 8px rgba(var(--po-rgb),.9);animation:poTwinkle 2.4s ease-in-out infinite}
.po-spark.s1{top:20px;left:34px;font-size:16px}.po-spark.s2{top:42px;right:40px;font-size:11px;animation-delay:.3s}.po-spark.s3{bottom:46px;left:52px;font-size:10px;animation-delay:.6s}.po-spark.s4{top:26px;right:68px;font-size:14px;animation-delay:.9s}.po-spark.s5{bottom:52px;right:46px;font-size:15px;animation-delay:1.2s}.po-spark.s6{top:58px;left:24px;font-size:11px;animation-delay:1.5s}
@keyframes poTwinkle{0%,100%{opacity:.25;transform:scale(.8)}50%{opacity:.95;transform:scale(1.15)}}
.po-icon{position:relative;width:92px;height:92px;border-radius:24px;display:flex;align-items:center;justify-content:center;background:linear-gradient(150deg,rgba(var(--po-rgb),.95),rgba(var(--po-rgb),.5));box-shadow:0 10px 30px rgba(var(--po-rgb),.55),inset 0 1px 0 rgba(255,255,255,.35);color:#fff;font-size:46px;animation:poPop .45s cubic-bezier(.2,.9,.25,1.4) both}
@keyframes poPop{from{transform:scale(.4);opacity:0}to{transform:scale(1);opacity:1}}
.po-strip{position:absolute;bottom:13px;left:50%;width:54px;height:5px;border-radius:5px;background:rgba(255,255,255,.55);box-shadow:0 0 16px rgba(var(--po-rgb),.85);transform:translateX(-50%)}
.po-body{padding:20px 22px 22px;text-align:center}
.po-eyebrow{font-size:11px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;color:var(--po)}
.po-title{margin:7px 0 2px;font-size:21px;font-weight:700;color:var(--bs-heading-color,#fff);line-height:1.2}
.po-detail{font-size:13px;color:var(--bs-secondary-color);min-height:1px}
.po-message{margin:9px 0 18px;color:var(--bs-secondary-color);font-size:13.5px;line-height:1.5}
.po-actions{display:flex;gap:8px}
.po-button{display:flex;flex:1;align-items:center;justify-content:center;min-height:46px;padding:0 14px;border:0;border-radius:13px;background:#fff;color:#16181d;font-size:15px;font-weight:600;cursor:pointer;transition:transform .12s,box-shadow .2s}
.po-button:hover{color:#16181d;transform:translateY(-1px);box-shadow:0 8px 22px rgba(255,255,255,.18)}
.po-button.secondary{background:rgba(var(--bs-body-color-rgb),.08);color:var(--bs-body-color)}
.po-button[hidden]{display:none}