/* Refer & earn: homepage pill + white modal */
.bf-ref-pill{display:inline-flex;align-items:center;gap:8px;height:32px;padding:0 14px 0 6px;margin-left:8px;border:0;border-radius:999px;background:#fff;box-shadow:inset 0 0 0 1px var(--line-2);font:500 13.5px/1 var(--f);letter-spacing:-.01em;color:var(--ink);cursor:pointer;vertical-align:middle;transition:box-shadow .25s,transform .25s}
.bf-ref-pill:hover{box-shadow:inset 0 0 0 1px rgba(225,6,58,.35),0 6px 18px -8px rgba(225,6,58,.35);transform:translateY(-1px)}
.bf-ref-pill .ic{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:#fdecef;color:var(--red)}
.bf-ref-pill .ic svg{width:13px;height:13px}
.bf-ref-pill b{font-weight:600;color:var(--red)}
.bf-ref-pill:focus-visible{outline:2px solid var(--blue,#0071e3);outline-offset:2px}
.bf-ref{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:20px}
.bf-ref[hidden]{display:none}
.bf-ref-bg{position:absolute;inset:0;background:rgba(29,29,31,.32);-webkit-backdrop-filter:blur(10px) saturate(140%);backdrop-filter:blur(10px) saturate(140%);opacity:0;transition:opacity .35s}
.bf-ref-card{position:relative;width:100%;max-width:440px;max-height:calc(100vh - 40px);overflow:auto;background:#fff;border-radius:32px;padding:30px 36px 30px;text-align:center;box-shadow:0 40px 90px -30px rgba(0,0,0,.35),0 0 0 1px rgba(0,0,0,.04);transform:translateY(24px) scale(.97);opacity:0;transition:transform .5s cubic-bezier(.2,.8,.2,1),opacity .35s}
.bf-ref.on .bf-ref-bg{opacity:1}.bf-ref.on .bf-ref-card{transform:none;opacity:1}
.bf-ref-x{position:absolute;top:14px;right:14px;width:36px;height:36px;border:0;border-radius:50%;background:#f5f5f7;color:#1d1d1f;font-size:22px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.bf-ref-x:hover{background:#ebebef}
.bf-ref-gift{display:block;width:190px;height:190px;margin:0 auto 4px;mix-blend-mode:multiply;animation:bfRefFloat 5s ease-in-out infinite}
@keyframes bfRefFloat{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-8px) rotate(2deg)}}
.bf-ref h2{font:700 34px/1.06 var(--f);letter-spacing:-.045em;color:#1d1d1f;margin:0}
.bf-ref h2 span{color:var(--red)}
.bf-ref-p{margin:14px auto 0;max-width:340px;font-size:16.5px;line-height:1.5;color:#424245;letter-spacing:-.01em}
.bf-ref-acts{display:flex;flex-direction:column;gap:10px;margin-top:24px}
.bf-ref-acts .btn{width:100%;justify-content:center;height:50px;font-size:16px}
.bf-ref-wa svg{width:19px;height:19px;color:#25d366;margin-right:8px}
.bf-ref-fine{margin:16px auto 0;max-width:320px;font-size:12.5px;line-height:1.45;color:#86868b}
html.bf-ref-lock,html.bf-ref-lock body{overflow:hidden}
@media (max-width:560px){
  .bf-ref-pill{margin:10px 0 0}
  .bf-ref{align-items:flex-end;padding:0}
  .bf-ref-card{max-width:none;border-radius:28px 28px 0 0;padding:24px 22px calc(22px + env(safe-area-inset-bottom));max-height:92vh;transform:translateY(100%)}
  .bf-ref-gift{width:150px;height:150px}
  .bf-ref h2{font-size:30px}
  .bf-ref-p{font-size:16px}
}
@media (prefers-reduced-motion:reduce){.bf-ref-gift{animation:none}.bf-ref-card,.bf-ref-bg{transition:none}}