:root{--pointer-x:50%;--pointer-y:50%;--pointer-from-center:0;--pointer-from-top:0.5;--pointer-from-left:0.5;--card-opacity:0.12;--rotate-x:0deg;--rotate-y:0deg;--background-x:50%;--background-y:50%;--grain:none;--icon:none;--behind-gradient:none;--inner-gradient:none;--bop-pink-1:hsl(330,100%,73%);--bop-pink-2:hsl(335,100%,75%);--bop-pink-3:hsl(340,100%,77%);--bop-pink-4:hsl(345,100%,79%);--bop-pink-5:hsl(350,100%,81%);--bop-pink-6:hsl(355,100%,83%);--card-radius:30px}.bop-card-wrapper{perspective:500px;transform:translateZ(.1px);position:relative;touch-action:pan-y}@media (pointer:fine){.bop-card-wrapper{touch-action:none}}.bop-card-wrapper:before{display:none}.bop-card-wrapper.active,.bop-card-wrapper:hover{--card-opacity:0.35}.bop-card{height:80svh;max-height:540px;display:grid;aspect-ratio:.718;border-radius:var(--card-radius);position:relative;background-image:var(--behind-gradient);background-size:cover;background-position:50%;background-repeat:no-repeat;background-blend-mode:soft-light;animation:none;box-shadow:rgba(0,0,0,.35) calc((var(--pointer-from-left) * 8px) - 3px) calc((var(--pointer-from-top) * 16px) - 6px) 18px -6px;transition:transform 1s ease;transform:translateZ(.1px) rotateX(0deg) rotateY(0deg);overflow:hidden}.bop-card.active,.bop-card:hover{transition:none;transform:translateZ(.1px) rotateX(var(--rotate-y)) rotateY(var(--rotate-x))}@media (hover:none){.bop-card{height:auto;max-height:none;min-height:420px;transition:transform .3s ease}.bop-card.active,.bop-card:hover{transform:translateZ(.1px)}}.bop-card *{display:grid;grid-area:1/-1;border-radius:var(--card-radius);transform:translateZ(.1px);pointer-events:none}.bop-inside{inset:1px;position:absolute;background-image:var(--inner-gradient);background-color:rgba(0,0,0,.9);transform:translateZ(.01px)}.bop-glare{transform:translateZ(1.1px);overflow:hidden;background-image:radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),hsla(330,35%,85%,.35) 12%,hsla(330,25%,40%,.2) 90%);mix-blend-mode:overlay;filter:brightness(.95) contrast(1.05);z-index:4}.bop-avatar-content{position:relative;overflow:hidden;isolation:isolate;mix-blend-mode:normal;z-index:2;height:100%;width:100%}.bop-avatar-content .avatar{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;-o-object-position:top center;object-position:top center;position:absolute;left:0;top:0;transform:scale(1.05);transition:transform .6s ease,filter .6s ease;filter:saturate(1.02) contrast(1.03);opacity:calc(1.08 - var(--pointer-from-center) * .25);z-index:1}.bop-card.active .bop-avatar-content .avatar,.bop-card:hover .bop-avatar-content .avatar{transform:scale(1.08) translate3d(calc((var(--pointer-from-left) - .5) * 12px),calc((var(--pointer-from-top) - .5) * 18px),0);filter:saturate(1.2) contrast(1.1)}.bop-avatar-content:before{content:"";position:absolute;inset:0;z-index:1;background:radial-gradient(110% 110% at 32% 12%,rgba(255,255,255,.25),transparent 55%),linear-gradient(180deg,rgba(18,10,18,0),rgba(18,10,18,.35) 75%,rgba(18,10,18,.6));pointer-events:none;mix-blend-mode:soft-light}.bop-user-info{position:absolute;bottom:20px;left:20px;right:20px;z-index:2;display:flex;flex-direction:column;gap:14px;background:linear-gradient(160deg,rgba(18,10,18,.85),rgba(32,18,32,.65));backdrop-filter:blur(30px);border:1px solid rgba(255,255,255,.14);border-radius:18px;padding:18px 20px;box-shadow:0 12px 30px rgba(0,0,0,.35);pointer-events:auto}.bop-user-details{display:flex;align-items:flex-start;gap:16px}.bop-mini-avatar{width:48px;height:48px;border-radius:50%;overflow:hidden;border:2px solid rgba(255,105,180,.3);flex-shrink:0}.bop-mini-avatar img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;border-radius:50%}.bop-user-text{display:flex;align-items:flex-start;flex-direction:column;gap:8px}.bop-status-pill{display:inline-flex;align-items:center;justify-content:center;padding:6px 12px;border-radius:999px;background:linear-gradient(135deg,rgba(255,105,180,.35),rgba(255,197,211,.25));border:1px solid rgba(255,255,255,.18);font-size:11px;font-weight:700;letter-spacing:.6px;color:#ffe6f1;text-transform:uppercase}.bop-handle{font-size:13px;font-weight:600;color:rgba(255,255,255,.7);line-height:1.1;letter-spacing:.04em}.bop-name{font-size:20px;font-weight:700;color:#fff;line-height:1.1}.bop-bio{margin:0;font-size:13px;line-height:1.4;color:rgba(255,255,255,.75);max-width:280px}.bop-content:not(.bop-avatar-content){max-height:100%;overflow:hidden;text-align:center;position:relative;transform:translate3d(calc(var(--pointer-from-left) * -6px + 3px),calc(var(--pointer-from-top) * -6px + 3px),.1px)!important;z-index:5;mix-blend-mode:normal;opacity:0;pointer-events:none}.bop-social-links{display:flex;align-items:center;gap:12px}.bop-social-link{pointer-events:auto;display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:14px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);color:#ffe6f1;transition:transform .2s ease,box-shadow .2s ease,background .2s ease;box-shadow:0 4px 16px rgba(255,105,180,.15)}.bop-social-link:hover{transform:translateY(-2px);background:rgba(255,255,255,.2);box-shadow:0 10px 28px rgba(255,105,180,.25)}.bop-social-link--instagram{background:linear-gradient(145deg,rgba(255,105,180,.45),rgba(255,197,211,.25))}.bop-social-link--tiktok{background:linear-gradient(145deg,rgba(96,196,255,.35),rgba(255,105,180,.35))}.bop-details{width:100%;position:absolute;top:3em;display:none;flex-direction:column}.bop-details h3{font-weight:800;margin:0;font-size:min(5svh,3em);background-image:linear-gradient(180deg,#fff,#ff69b4);font-family:Space Grotesk,sans-serif}.bop-details h3,.bop-details p{background-size:1em 1.5em;-webkit-text-fill-color:transparent;background-clip:text;-webkit-background-clip:text}.bop-details p{font-weight:600;position:relative;top:-8px;white-space:nowrap;font-size:18px;margin:0 auto;width:-moz-min-content;width:min-content;background-image:linear-gradient(180deg,#ffc5d3,#ff1493);font-family:Inter,sans-serif}@keyframes glow-bg{0%{--bgrotate:0deg}to{--bgrotate:360deg}}@keyframes holo-bg{0%{background-position:0 var(--background-y),0 0,50%}to{background-position:0 var(--background-y),90% 90%,50%}}@media (max-width:768px){.bop-card{height:70svh;max-height:450px}.bop-card-wrapper{margin-left:auto;margin-right:auto;max-width:320px}.bop-card{width:100%}.bop-details{top:2em}.bop-details h3{font-size:min(4svh,2.5em)}.bop-details p{font-size:16px}.bop-user-info{bottom:15px;left:15px;right:15px;padding:16px}.bop-mini-avatar{width:40px;height:40px}.bop-user-details{gap:12px}.bop-handle{font-size:13px}.bop-name{font-size:18px}.bop-bio{font-size:12px}}@media (max-width:480px){.bop-card{height:60svh;max-height:380px}.bop-details{top:1.5em}.bop-details h3{font-size:min(3.5svh,2em)}.bop-details p{font-size:14px;top:-6px}.bop-user-info{bottom:12px;left:12px;right:12px;padding:14px 16px;border-radius:14px}.bop-mini-avatar{width:32px;height:32px}.bop-user-details{gap:10px}.bop-handle{font-size:12px}.bop-name{font-size:16px}.bop-bio{font-size:11px}}.bop-shine{mask-image:var(--icon);mask-mode:alpha;-webkit-mask-image:var(--icon);-webkit-mask-mode:alpha;mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;mask-size:140%;-webkit-mask-size:140%;mask-position:center;-webkit-mask-position:center;transform:translateZ(1px);overflow:hidden;z-index:3;background-image:radial-gradient(55% 55% at calc(var(--pointer-x) + 10%) calc(var(--pointer-y) - 12%),rgba(255,255,255,.38),rgba(255,255,255,0) 70%),linear-gradient(160deg,rgba(255,214,236,.18),rgba(170,115,169,.08));background-size:140% 140%,100% 100%;transition:opacity .4s ease,filter .4s ease;filter:brightness(1) contrast(1.05) saturate(.8);mix-blend-mode:screen;opacity:.18}.bop-shine,.bop-shine:after,.bop-shine:before{background-position:50%;background-repeat:no-repeat}.bop-shine:after,.bop-shine:before{content:"";grid-area:1/1;transition:opacity .4s ease;opacity:.12}.bop-shine:before{background-image:linear-gradient(120deg,rgba(255,255,255,.35) 20%,rgba(255,255,255,0) 75%);mix-blend-mode:screen}.bop-shine:after{background-image:radial-gradient(60% 60% at calc(var(--pointer-x) - 12%) calc(var(--pointer-y) + 18%),rgba(255,255,255,.18),rgba(255,255,255,0) 90%);mix-blend-mode:lighten}.bop-card.active .bop-shine,.bop-card:hover .bop-shine{filter:brightness(1.05) contrast(1.08) saturate(.85);opacity:.25}.bop-card.active .bop-shine:after,.bop-card.active .bop-shine:before,.bop-card:hover .bop-shine:after,.bop-card:hover .bop-shine:before{opacity:.2}