.referral{aspect-ratio:1;position:relative}.referral .seg{left:calc(var(--x) * 1cqi);top:calc(var(--y) * 1cqi);background:color-mix(in srgb, var(--clr-black-900) 22%, var(--clr-mint-100));z-index:1;position:absolute}.referral .seg.h{width:calc(var(--l) * 1cqi);height:1px;translate:0 -.5px}.referral .seg.v{width:1px;height:calc(var(--l) * 1cqi);translate:-.5px}.referral .packet{background:var(--clr-black-900);opacity:0;z-index:4;will-change:transform;width:2.2cqi;height:2.2cqi;margin:-1.1cqi 0 0 -1.1cqi;position:absolute;top:0;left:0}.referral .packet.tip{background:var(--clr-celadon-400)}.referral .port{left:calc(var(--x) * 1cqi);top:calc(var(--y) * 1cqi);background:var(--clr-black-900);z-index:5;width:1.4cqi;height:1.4cqi;position:absolute;translate:-50% -50%}.referral .hub,.referral .ripple{width:18cqi;height:18cqi;position:absolute;top:41cqi;left:36cqi}.referral .ripple{border:1px solid var(--clr-celadon-400);opacity:0;z-index:2}.referral .hub{background:var(--clr-black-900);color:var(--clr-mint-50);z-index:3;place-items:center;display:grid}.referral .hub svg{width:50%;height:auto}.referral .box{left:calc(var(--x) * 1cqi);top:calc(var(--y) * 1cqi);width:calc(var(--w) * 1cqi);height:calc(var(--h) * 1cqi);border:1px solid var(--clr-mint-200);letter-spacing:-.02em;z-index:3;background:#fff;flex-direction:column;justify-content:center;padding:0 2em;font-size:1cqi;display:flex;position:absolute;box-shadow:0 1.2cqi 3.6cqi #1514140f}.referral .you{row-gap:1.6em}.referral .you .top{align-items:center;column-gap:1.4em;display:flex}.referral .you .avatar{background:var(--clr-black-900);width:5.8em;height:5.8em;color:var(--clr-mint-50);flex-shrink:0;place-items:center;display:grid}.referral .you .avatar svg{width:50%;height:50%}.referral .you b{font-size:3.4em;font-weight:600}.referral .you .chip{border:1px solid var(--clr-mint-200);background:var(--clr-mint-50);color:var(--clr-body);white-space:nowrap;padding:1em 1.1em;font-size:max(2em,9px)}.referral .hotel{row-gap:.9em}.referral .hotel b{white-space:nowrap;font-size:3em;font-weight:600}.referral .hotel .muted{font-size:2.3em}.referral .hotel .live,.referral .purse .tag{white-space:nowrap;align-self:flex-start;column-gap:.5em;height:auto;padding:.5em .7em;font-size:max(2em,9px)}.referral .hotel .live svg{width:.9em;height:.9em}.referral .purse{row-gap:.9em}.referral .purse .lbl{color:var(--clr-body-light);white-space:nowrap;font-size:max(2em,9px)}.referral .purse .amt{font-family:var(--font-display), Arial, sans-serif;font-weight:var(--display-weight);letter-spacing:-.045em;align-items:baseline;margin:0;font-size:7.6em;line-height:1;display:flex}.referral .purse .cur{margin-right:.08em;font-size:.62em}.referral .purse .num{font-variant-numeric:tabular-nums}.referral .purse .num+.cur{margin-left:.2em}.referral .toast{background:var(--clr-celadon-300);border:1px solid var(--clr-celadon-400);color:var(--clr-black-900);letter-spacing:-.02em;opacity:0;z-index:5;white-space:nowrap;padding:.5em .8em;font-size:2.2cqi;font-weight:600;position:absolute;top:55.5cqi;left:2cqi}@container (max-width:400px){.referral .box{padding:0 1.6em}.referral .you{top:calc((var(--y) - 3) * 1cqi);height:calc((var(--h) + 6) * 1cqi);row-gap:1.2em}.referral .hotel{top:calc((var(--y) - 2) * 1cqi);height:calc((var(--h) + 4) * 1cqi)}.referral .purse{top:calc((var(--y) - 4) * 1cqi);height:calc((var(--h) + 8) * 1cqi)}.referral .you b{font-size:3.8em}.referral .you .chip{white-space:normal;padding:.5em .6em;font-size:3.3em;line-height:1.25}.referral .hotel b{font-size:3.6em}.referral .hotel .muted{font-size:3.3em}.referral .hotel .live,.referral .purse .tag{white-space:normal;padding:.35em .5em;font-size:3.3em;line-height:1.25}.referral .purse .lbl{white-space:normal;font-size:3.3em;line-height:1.25}.referral .toast{font-size:3.3cqi;top:50cqi}}