/* INFINEX APEX – gift box + referral reveal (gift.js) */
.gx-fab{position:fixed;left:18px;bottom:22px;z-index:125;width:58px;height:58px;border:0;border-radius:50%;cursor:pointer;display:grid;place-items:center;font-size:28px;color:#fff;
  background:linear-gradient(135deg,#f36b21,#e5560d);box-shadow:0 10px 28px rgba(229,86,13,.45);animation:gx-fab 3.2s ease-in-out infinite;transition:transform .2s;touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab}
.gx-fab.drag{cursor:grabbing;animation:none;transform:scale(1.12);transition:none;box-shadow:0 16px 36px rgba(229,86,13,.55)}
.gx-fab:hover{transform:scale(1.08)}
.gx-fab::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid rgba(243,107,33,.45);animation:gx-ring 2.4s ease-out infinite}
@keyframes gx-fab{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@keyframes gx-ring{from{transform:scale(.85);opacity:.9}to{transform:scale(1.5);opacity:0}}
.gx-ov{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:16px;background:rgba(18,14,10,.62);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);opacity:0;pointer-events:none;transition:opacity .35s}
.gx-ov.open{opacity:1;pointer-events:auto}
.gx-card{position:relative;width:min(420px,100%);max-height:calc(100vh - 32px);overflow:hidden;border-radius:26px;padding:26px 22px 24px;text-align:center;color:#242424;
  background:linear-gradient(160deg,#fffaf5,#ffe8d6);box-shadow:0 30px 90px rgba(0,0,0,.4);transform:translateY(24px) scale(.92);opacity:0;transition:transform .5s cubic-bezier(.2,.9,.3,1.2),opacity .35s}
.gx-ov.open .gx-card{transform:none;opacity:1}
.gx-x{position:absolute;right:12px;top:12px;z-index:5;width:36px;height:36px;border:0;border-radius:50%;background:rgba(0,0,0,.07);font-size:22px;cursor:pointer;line-height:1}
.gx-x:hover{background:rgba(0,0,0,.12)}
.gx-cv{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:4}
.gx-title{margin:0 0 4px;font-size:22px;font-weight:900;letter-spacing:-.01em;position:relative;z-index:2}
.gx-sub{margin:0 0 6px;font-size:14px;color:#6b6b6b;position:relative;z-index:2;transition:opacity .4s}

/* the box */
.gx-stage{position:relative;height:170px;margin:6px auto 0;width:170px;z-index:2}
.gx-box{position:absolute;inset:0;border:0;background:none;cursor:pointer;padding:0;-webkit-tap-highlight-color:transparent}
.gx-box:focus-visible{outline:3px solid #f36b21;outline-offset:6px;border-radius:16px}
.gx-body,.gx-lid{position:absolute;left:50%;transform:translateX(-50%)}
.gx-body{bottom:6px;width:120px;height:92px;border-radius:10px;background:linear-gradient(#ff7d33,#d9480f);box-shadow:inset 0 -14px 0 rgba(0,0,0,.14),0 18px 28px rgba(217,72,15,.35)}
.gx-body::before,.gx-lid::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:20px;transform:translateX(-50%);background:linear-gradient(#ffe27a,#f2a900)}
.gx-lid{bottom:92px;width:136px;height:34px;border-radius:9px;background:linear-gradient(#ff9a52,#f36b21);transform-origin:8% 100%;box-shadow:0 5px 10px rgba(0,0,0,.2);transition:transform .9s cubic-bezier(.3,1.35,.5,1),opacity .5s .5s}
.gx-lid::after{content:"";position:absolute;left:50%;top:-16px;width:38px;height:22px;transform:translateX(-50%);border:5px solid #ffc933;border-bottom:0;border-radius:26px 26px 0 0}
.gx-glow{position:absolute;left:50%;bottom:70px;width:110px;height:110px;margin-left:-55px;border-radius:50%;background:radial-gradient(circle,rgba(255,226,122,.95),rgba(255,226,122,0) 68%);opacity:0;transform:scale(.4);transition:opacity .6s .15s,transform .8s .15s}
.gx-hint{position:absolute;left:0;right:0;bottom:-24px;font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#e5560d;animation:gx-blink 1.6s ease-in-out infinite}
@keyframes gx-blink{50%{opacity:.35}}
.gx-card:not(.opened) .gx-box{animation:gx-wiggle 2.8s ease-in-out infinite}
@keyframes gx-wiggle{0%,86%,100%{transform:rotate(0)}89%{transform:rotate(-5deg)}92%{transform:rotate(5deg)}95%{transform:rotate(-3deg)}}
.gx-card.opened .gx-lid{transform:translate(-4px,-58px) rotate(-26deg);opacity:0}
.gx-card.opened .gx-glow{opacity:1;transform:scale(1.25)}
.gx-card.opened .gx-hint{display:none}
.gx-card.opened .gx-stage{animation:gx-shrink .7s .9s ease forwards}
@keyframes gx-shrink{to{height:86px;transform:scale(.62);margin-bottom:-20px}}

/* referral reveal */
.gx-ref{position:relative;z-index:2;margin-top:10px;max-height:0;opacity:0;overflow:hidden;transform:translateY(18px);transition:max-height .7s ease,opacity .6s,transform .6s}
.gx-card.revealed .gx-ref{max-height:420px;opacity:1;transform:none}
.gx-lbl{display:block;text-align:left;font-size:10.5px;font-weight:900;letter-spacing:.14em;text-transform:uppercase;color:#e5560d;margin:12px 4px 5px}
.gx-row{display:flex;align-items:center;gap:8px;background:#fff;border:1.5px dashed #f6a977;border-radius:14px;padding:6px 6px 6px 14px}
.gx-val{flex:1;min-width:0;text-align:left;font-weight:900;font-size:19px;letter-spacing:.08em;color:#1d2024;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gx-val.link{font-size:13px;letter-spacing:0;font-weight:700}
.gx-copy{flex:none;border:0;border-radius:10px;background:#f36b21;color:#fff;font-weight:800;font-size:12.5px;padding:10px 14px;cursor:pointer;transition:transform .15s,background .2s}
.gx-copy:hover{transform:translateY(-1px);background:#e5560d}
.gx-copy.ok{background:#16a34a}
.gx-share{display:flex;gap:8px;margin-top:14px}
.gx-share a,.gx-share button{flex:1;border:0;border-radius:12px;padding:12px;font-weight:800;font-size:13px;cursor:pointer;text-decoration:none;text-align:center;transition:transform .15s}
.gx-share a{background:#25d366;color:#fff}.gx-share button{background:#1d2024;color:#fff}
.gx-share a:hover,.gx-share button:hover{transform:translateY(-1px)}
.gx-ref>*{opacity:0;transform:translateY(10px)}
.gx-card.revealed .gx-ref>*{animation:gx-up .55s cubic-bezier(.2,.9,.3,1) forwards}
.gx-card.revealed .gx-ref>*:nth-child(1){animation-delay:.1s}.gx-card.revealed .gx-ref>*:nth-child(2){animation-delay:.2s}
.gx-card.revealed .gx-ref>*:nth-child(3){animation-delay:.3s}.gx-card.revealed .gx-ref>*:nth-child(4){animation-delay:.4s}
.gx-card.revealed .gx-ref>*:nth-child(5){animation-delay:.5s}
@keyframes gx-up{to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.gx-fab,.gx-fab::after,.gx-card:not(.opened) .gx-box,.gx-hint{animation:none}.gx-card,.gx-lid,.gx-ref{transition-duration:.01s}}
@media(max-width:700px){.gx-fab{bottom:84px;left:12px;width:52px;height:52px;font-size:25px}}

.gx-invite{margin:14px 2px 0;padding:11px 13px;border-radius:12px;background:#fff3ec;font-size:12.5px;line-height:1.5;color:#5b3a25;text-align:left}
.gx-ok{padding-top:30px}
.gx-tick{width:74px;height:74px;margin:0 auto 10px;position:relative;z-index:2}
.gx-tick svg{width:100%;height:100%;fill:none;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round}
.gx-tick circle{stroke:#16a34a;fill:#e8f8ee;stroke-dasharray:152;stroke-dashoffset:152;animation:gx-draw .7s .25s ease forwards}
.gx-tick path{stroke:#16a34a;stroke-dasharray:44;stroke-dashoffset:44;animation:gx-draw .5s .8s ease forwards}
@keyframes gx-draw{to{stroke-dashoffset:0}}
.gx-promise{position:relative;z-index:2;margin:14px 0 16px;padding:14px;border-radius:14px;background:#fff;border:1px solid #f1e4d8;text-align:left;font-size:13px;line-height:1.55;color:#4a4a4a}
.gx-promise b{display:block;color:#e5560d;margin-bottom:3px;font-size:14px}
.gx-done{position:relative;z-index:2;width:100%;padding:13px;font-size:14px}
