:root{--pointer-x:50%;--pointer-y:50%;--pointer-from-center:0;--pointer-from-top:.5;--pointer-from-left:.5;--card-opacity:0;--rotate-x:0deg;--rotate-y:0deg;--background-x:50%;--background-y:50%;--behind-glow-color:#6366f166;--behind-glow-size:50%;--inner-gradient:radial-gradient(circle at 50% 30%, #1e293b 0%, #0f172a 60%, #020617 100%);--card-radius:24px}.pc-card-wrapper{perspective:1000px;width:100%;max-width:380px;margin:0 auto;position:relative}.pc-behind{z-index:0;pointer-events:none;background:radial-gradient(circle at var(--pointer-x) var(--pointer-y), var(--behind-glow-color) 0%, transparent var(--behind-glow-size));filter:blur(48px);opacity:calc(.6 * var(--card-opacity));transition:opacity .4s;position:absolute;inset:-16px}.pc-card-wrapper:hover{--card-opacity:1}.pc-card-shell{z-index:1;border-radius:var(--card-radius);position:relative;overflow:visible}.pc-card{border-radius:var(--card-radius);width:100%;height:520px;transform:rotateX(var(--rotate-x)) rotateY(var(--rotate-y));will-change:transform;background:#020617;border:1px solid #ffffff1a;transition:transform .12s ease-out;position:relative;overflow:hidden;box-shadow:0 25px 50px -12px #000c,inset 0 1px #ffffff14}.pc-card.active,.pc-card:hover{transition:none}.pc-inside{background-image:var(--inner-gradient);border-radius:var(--card-radius);position:absolute;inset:0;overflow:hidden}.pc-shine{z-index:2;pointer-events:none;opacity:.25;mix-blend-mode:soft-light;background:radial-gradient(circle at var(--pointer-x) var(--pointer-y), #fff9 0%, #6366f126 50%, transparent 80%);transition:opacity .4s;position:absolute;inset:0}.pc-card:hover .pc-shine,.pc-card.active .pc-shine{opacity:.45}.pc-glare{z-index:3;pointer-events:none;opacity:.12;mix-blend-mode:overlay;background:radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y), #fffc 0%, transparent 60%);position:absolute;inset:0}.pc-avatar-container{z-index:4;pointer-events:none;justify-content:center;align-items:flex-end;display:flex;position:absolute;inset:0}.pc-avatar-container .avatar{object-fit:contain;object-position:bottom center;filter:contrast(1.05)saturate(.85)brightness(.94)drop-shadow(0 12px 24px #0009);width:92%;height:auto;max-height:75%;-webkit-mask-image:linear-gradient(#000 50%,#0000 100%);mask-image:linear-gradient(#000 50%,#0000 100%)}.pc-header-content{z-index:5;text-align:center;pointer-events:none;position:absolute;top:24px;left:0;right:0}.pc-header-content h3{letter-spacing:-.02em;background:linear-gradient(#fff 0%,#cbd5e1 70%,#94a3b8 100%);-webkit-text-fill-color:transparent;filter:drop-shadow(0 2px 6px #000c);-webkit-background-clip:text;background-clip:text;margin:0;font-size:1.75rem;font-weight:700}.pc-header-content p{color:#94a3b8;letter-spacing:.01em;text-shadow:0 1px 4px #000000e6;margin-top:4px;font-size:.875rem;font-weight:500}.pc-user-info{z-index:6;-webkit-backdrop-filter:blur(16px);background:#0f172ab3;border:1px solid #ffffff1f;border-radius:12px;justify-content:space-between;align-items:center;padding:10px 12px;display:flex;position:absolute;bottom:14px;left:14px;right:14px;box-shadow:0 8px 24px #0006}.pc-user-details{align-items:center;gap:10px;display:flex}.pc-mini-avatar{background:#0f172a;border:1px solid #fff3;border-radius:50%;flex-shrink:0;width:36px;height:36px;overflow:hidden}.pc-mini-avatar img{object-fit:cover;width:100%;height:100%}.pc-user-text{flex-direction:column;display:flex}.pc-handle{color:#f8fafc;font-size:.825rem;font-weight:600;line-height:1.2}.pc-status{color:#94a3b8;font-size:.7rem;line-height:1.2}.pc-contact-btn{color:#f8fafc;cursor:pointer;pointer-events:auto;background:#ffffff14;border:1px solid #ffffff2e;border-radius:6px;padding:7px 12px;font-size:.75rem;font-weight:600;transition:all .2s}.pc-contact-btn:hover{background:#ffffff2e;border-color:#ffffff59;transform:translateY(-1px)}@media (max-width:768px){.pc-card{height:70svh;max-height:420px}.pc-header-content h3{font-size:1.4rem}.pc-header-content p{font-size:.8rem}.pc-user-info{padding:8px 10px}.pc-mini-avatar{width:28px;height:28px}.pc-handle{font-size:.75rem}.pc-status{font-size:.65rem}.pc-contact-btn{padding:5px 10px;font-size:.7rem}}@media (max-width:480px){.pc-card{height:60svh;max-height:340px}.pc-header-content h3{font-size:1.2rem}.pc-header-content p{font-size:.7rem}.pc-user-info{padding:6px 8px}.pc-mini-avatar{width:24px;height:24px}.pc-handle{font-size:.7rem}.pc-status{font-size:.6rem}.pc-contact-btn{padding:4px 8px;font-size:.65rem}}
