:root{--pointer-x:50%;--pointer-y:50%;--rotate-x:0deg;--rotate-y:0deg}.card-wrapper{perspective:1200px;position:relative;display:flex;flex-direction:column;align-items:center;gap:20px}.profile-card{width:120px;height:120px;position:relative;border-radius:12px;transform-style:preserve-3d;transition:transform .1s ease;cursor:pointer;touch-action:none}.profile-card:not(.hovered){animation:gentleFloat 8s ease-in-out infinite}.profile-card:not(.hovered) .shine-layer{animation:gentleFloat 8s ease-in-out infinite,hologram-pulse 3s ease-in-out infinite,idleHologram 8s ease-in-out infinite}.profile-card:not(.hovered) .glare-layer{animation:gentleFloat 8s ease-in-out infinite,idleGlare 8s ease-in-out infinite}.profile-card.hovered,.profile-card.hovered .glare-layer,.profile-card.hovered .shine-layer{animation:none}.card-inner{width:100%;height:100%;position:relative;border-radius:12px;overflow:visible;background:radial-gradient(circle at 30% 30%,rgba(255,0,255,.15),transparent 60%),radial-gradient(circle at 70% 70%,rgba(0,255,255,.15),transparent 60%),linear-gradient(145deg,#000000,#0a0a0a);border:2px solid rgba(255,255,255,.3);box-shadow:0 4px 12px rgba(0,0,0,.3),0 2px 6px rgba(255,255,255,.05),inset 0 1px 0 rgba(255,255,255,.2),inset 0 -1px 0 rgba(0,0,0,.4)}.shine-layer{position:absolute;top:0;left:0;right:0;bottom:0;border-radius:12px;background:conic-gradient(from calc(var(--rotate-y) * 8) at var(--pointer-x) var(--pointer-y),rgba(255,0,0,.8) 0deg,rgba(255,165,0,.8) 51deg,rgba(255,255,0,.8) 102deg,rgba(0,255,0,.8) 153deg,rgba(0,0,255,.8) 204deg,rgba(75,0,130,.8) 255deg,rgba(238,130,238,.8) 306deg,rgba(255,0,0,.8) 1turn),radial-gradient(circle at var(--pointer-x) var(--pointer-y),rgba(255,255,255,1) 0,rgba(255,255,255,.6) 15%,rgba(255,0,255,.4) 30%,transparent 60%),repeating-linear-gradient(calc(var(--rotate-y) * 6 + 45deg),transparent 0,rgba(255,255,255,.2) 1px,rgba(255,255,255,.8) 2px,rgba(255,255,255,.2) 3px,transparent 4px,transparent 6px),conic-gradient(from calc(var(--rotate-x) * -5) at var(--pointer-x) var(--pointer-y),rgba(255,0,255,.6) 0deg,rgba(0,255,255,.6) 120deg,rgba(255,255,0,.6) 240deg,rgba(255,0,255,.6) 1turn);opacity:.7;transition:opacity .2s ease,background .15s ease;pointer-events:none;mix-blend-mode:screen;animation:hologram-pulse 3s ease-in-out infinite}.profile-card.hovered .shine-layer{opacity:1;animation:none}.glare-layer{position:absolute;top:0;left:0;right:0;bottom:0;border-radius:12px;background:radial-gradient(ellipse 120px 60px at var(--pointer-x) var(--pointer-y),rgba(255,255,255,.9) 0,rgba(255,255,255,.6) 20%,rgba(255,255,255,.3) 40%,transparent 70%),radial-gradient(circle at var(--pointer-x) var(--pointer-y),rgba(255,255,255,.5) 0,rgba(255,255,255,.2) 30%,transparent 60%),linear-gradient(calc(var(--rotate-y) * 10 + 90deg),transparent 30%,rgba(255,255,255,.4) 50%,transparent 70%);opacity:.6;transition:opacity .2s ease,background .12s ease;pointer-events:none;mix-blend-mode:screen}.profile-card.hovered .glare-layer{opacity:.9}.avatar-container{position:absolute;top:0;left:0;right:0;bottom:0;z-index:1000;pointer-events:none;transform-style:preserve-3d;overflow:visible;mix-blend-mode:normal;filter:none;-webkit-backdrop-filter:none;backdrop-filter:none;background:none}.avatar-container,.avatar-placeholder{display:flex;align-items:center;justify-content:center}.avatar-placeholder{width:72%;aspect-ratio:1;max-width:120px;border-radius:1rem;font-size:2.25rem;font-weight:700;color:#286dcc;background:linear-gradient(145deg,#f0f7ff,#e2edfb);border:2px solid rgba(40,109,204,.2);transform:translateZ(20px)}.avatar{width:140%;height:auto;max-width:170px;-o-object-fit:contain;object-fit:contain;transition:transform .3s ease,filter .3s ease;transform:translateZ(20px);mix-blend-mode:normal!important;filter:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;background:none!important;border:none!important;box-shadow:none!important}.profile-card.hovered .avatar{transform:translateZ(30px) scale(1.1);filter:drop-shadow(0 6px 25px rgba(0,0,0,.4))}.content{display:none}.details h3{font-size:24px;font-weight:700;margin:0 0 8px;color:#ffffff;text-shadow:0 2px 4px rgba(0,0,0,.3)}.details p{font-size:14px;font-weight:500;margin:0;color:rgba(255,255,255,.8);text-shadow:0 1px 2px rgba(0,0,0,.3)}.user-info{display:none}.user-details{display:flex;align-items:center;gap:12px}.mini-avatar{width:40px;height:40px;border-radius:50%;overflow:hidden;border:2px solid rgba(255,255,255,.2)}.mini-avatar img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.user-text{display:flex;flex-direction:column;gap:2px}.handle{font-size:14px;font-weight:600;color:#ffffff}.status{font-size:12px;color:rgba(255,255,255,.7)}.contact-btn{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:10px;padding:8px 16px;font-size:12px;font-weight:600;color:#ffffff;cursor:pointer;transition:all .2s ease;pointer-events:auto}.contact-btn:hover{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.4);transform:translateY(-1px)}.small-variant .profile-card{width:80px;height:80px}.small-variant .avatar{width:130%;transform:translateZ(15px)}.small-variant .profile-card.hovered .avatar{transform:translateZ(20px) scale(1.05)}.theme-indicator{display:none}.profile-card[data-theme=holographic] .card-inner{background:radial-gradient(circle at 30% 20%,rgba(255,0,150,.15),transparent 50%),radial-gradient(circle at 70% 80%,rgba(0,255,255,.15),transparent 50%),linear-gradient(145deg,#0a0a0a,#1a1a2e)}.profile-card[data-theme=holographic] .shine-layer{background:conic-gradient(from calc(var(--rotate-y) * 3) at var(--pointer-x) var(--pointer-y),rgba(255,0,0,.4) 0deg,rgba(255,165,0,.4) 51deg,rgba(255,255,0,.4) 102deg,rgba(0,255,0,.4) 153deg,rgba(0,0,255,.4) 204deg,rgba(75,0,130,.4) 255deg,rgba(238,130,238,.4) 306deg,rgba(255,0,0,.4) 1turn),radial-gradient(circle at var(--pointer-x) var(--pointer-y),rgba(255,255,255,.6) 0,rgba(255,0,150,.3) 20%,rgba(0,255,255,.2) 40%,transparent 70%),repeating-linear-gradient(calc(var(--rotate-y) * 2 + 45deg),transparent 0,rgba(255,255,255,.05) 1px,rgba(255,255,255,.15) 2px,rgba(255,255,255,.05) 3px,transparent 4px,transparent 8px);opacity:.6;mix-blend-mode:screen}.profile-card[data-theme=holographic].hovered .shine-layer{opacity:.95}.profile-card[data-theme=chrome] .card-inner{background:radial-gradient(circle at 20% 20%,rgba(255,255,255,.3),transparent 50%),radial-gradient(circle at 80% 80%,rgba(200,200,200,.3),transparent 50%),linear-gradient(145deg,#c0c0c0,#f0f0f0);border-color:rgba(0,0,0,.2)}.profile-card[data-theme=chrome] .shine-layer{background:radial-gradient(ellipse 180px 90px at var(--pointer-x) var(--pointer-y),rgba(255,255,255,.9) 0,rgba(255,255,255,.4) 40%,transparent 70%),repeating-linear-gradient(calc(var(--rotate-y) * 2 + 45deg),transparent 0,rgba(255,255,255,.1) 1px,rgba(255,255,255,.6) 2px,rgba(255,255,255,.1) 3px,transparent 4px,transparent 8px),linear-gradient(calc(var(--rotate-y) * 3 + 45deg),transparent 20%,rgba(255,255,255,.7) 50%,transparent 80%);opacity:.7;mix-blend-mode:overlay}.profile-card[data-theme=chrome].hovered .shine-layer{opacity:1}.profile-card[data-theme=chrome] .details h3{color:#333333}.profile-card[data-theme=chrome] .details p{color:rgba(0,0,0,.7)}.profile-card[data-theme=gold] .card-inner{background:linear-gradient(145deg,#b8860b,#daa520)}.profile-card[data-theme=gold] .shine-layer{background:radial-gradient(circle at var(--pointer-x) var(--pointer-y),rgba(255,215,0,.4) 0,transparent 60%),linear-gradient(45deg,transparent 30%,rgba(255,255,255,.3) 50%,transparent 70%)}.profile-card[data-theme=rainbow-foil] .card-inner{background:radial-gradient(circle at 25% 25%,rgba(255,0,0,.1),transparent 50%),radial-gradient(circle at 75% 75%,rgba(0,0,255,.1),transparent 50%),linear-gradient(145deg,#0a0a0a,#1a1a2e)}.profile-card[data-theme=rainbow-foil] .shine-layer{background:conic-gradient(from calc(var(--rotate-y) * 5 + var(--rotate-x) * 3) at var(--pointer-x) var(--pointer-y),rgba(255,0,0,.5) 0deg,rgba(255,165,0,.5) 51deg,rgba(255,255,0,.5) 102deg,rgba(0,255,0,.5) 153deg,rgba(0,0,255,.5) 204deg,rgba(75,0,130,.5) 255deg,rgba(238,130,238,.5) 306deg,rgba(255,0,0,.5) 1turn),radial-gradient(ellipse 150px 75px at var(--pointer-x) var(--pointer-y),rgba(255,255,255,.8) 0,rgba(255,255,255,.3) 30%,transparent 70%),repeating-linear-gradient(calc(var(--rotate-y) * 3 + 30deg),transparent 0,rgba(255,255,255,.1) 1px,rgba(255,255,255,.2) 2px,rgba(255,255,255,.1) 3px,transparent 4px,transparent 6px);opacity:.7;mix-blend-mode:screen}.profile-card[data-theme=rainbow-foil].hovered .shine-layer{opacity:1}.profile-card[data-theme=ocean-blue] .card-inner{background:linear-gradient(145deg,#1e3a8a,#3b82f6)}.profile-card[data-theme=ocean-blue] .shine-layer{background:radial-gradient(circle at var(--pointer-x) var(--pointer-y),rgba(59,130,246,.4) 0,transparent 60%)}.profile-card[data-theme=purple-elegance] .card-inner{background:linear-gradient(145deg,#581c87,#7c3aed)}.profile-card[data-theme=purple-elegance] .shine-layer{background:radial-gradient(circle at var(--pointer-x) var(--pointer-y),rgba(124,58,237,.4) 0,transparent 60%)}.profile-card[data-theme=aurora-borealis] .card-inner{background:linear-gradient(145deg,#0f172a,#1e293b)}.profile-card[data-theme=aurora-borealis] .shine-layer{background:radial-gradient(ellipse at var(--pointer-x) var(--pointer-y),rgba(34,197,94,.3) 0,rgba(59,130,246,.3) 25%,rgba(168,85,247,.3) 50%,rgba(236,72,153,.3) 75%,transparent 100%)}.profile-card[data-theme=rose-gold] .card-inner{background:linear-gradient(145deg,#be185d,#ec4899)}.profile-card[data-theme=rose-gold] .shine-layer{background:radial-gradient(circle at var(--pointer-x) var(--pointer-y),rgba(236,72,153,.4) 0,transparent 60%)}.profile-card[data-theme=mint-green] .card-inner{background:linear-gradient(145deg,#047857,#10b981)}.profile-card[data-theme=mint-green] .shine-layer{background:radial-gradient(circle at var(--pointer-x) var(--pointer-y),rgba(16,185,129,.4) 0,transparent 60%)}.profile-card[data-theme=elegant-black] .card-inner{background:linear-gradient(145deg,#000000,#1f2937)}.profile-card[data-theme=pure-white] .card-inner{background:linear-gradient(145deg,#ffffff,#f8fafc);border-color:rgba(0,0,0,.1)}.profile-card[data-theme=pure-white] .details h3{color:#1f2937}.profile-card[data-theme=pure-white] .details p{color:rgba(0,0,0,.7)}.profile-card[data-theme=primary-red] .card-inner{background:linear-gradient(145deg,#b91c1c,#dc2626)}.profile-card[data-theme=primary-green] .card-inner{background:linear-gradient(145deg,#15803d,#16a34a)}.profile-card[data-theme=primary-yellow] .card-inner{background:linear-gradient(145deg,#ca8a04,#eab308)}.profile-card[data-theme="Plain White"] .card-inner{background:#ffffff;border:none;box-shadow:none}.profile-card[data-theme="Plain White"] .glare-layer,.profile-card[data-theme="Plain White"] .shine-layer{display:none}.profile-card[data-theme="Plain White"] .details h3{color:#000000}.profile-card[data-theme="Plain White"] .details p{color:rgba(0,0,0,.7)}.profile-card[data-theme="Plain White"] .avatar{filter:none!important}.profile-card[data-theme="Plain White"].hovered .avatar{transform:scale(1.05);filter:drop-shadow(0 2px 8px rgba(0,0,0,.1))}@keyframes gentleFloat{0%,to{transform:translateY(0) rotateX(0deg) rotateY(0deg)}25%{transform:translateY(-3px) rotateX(4deg) rotateY(-3deg)}50%{transform:translateY(-6px) rotateX(0deg) rotateY(0deg)}75%{transform:translateY(-3px) rotateX(-4deg) rotateY(3deg)}}@keyframes hologram-pulse{0%,to{filter:brightness(1) saturate(1.2)}50%{filter:brightness(1.2) saturate(1.5)}}@keyframes idleHologram{0%,to{background-position:50% 50%,50% 50%,50% 50%,50% 50%}25%{background-position:47% 53%,53% 47%,47% 53%,53% 47%}50%{background-position:50% 50%,50% 50%,50% 50%,50% 50%}75%{background-position:53% 47%,47% 53%,53% 47%,47% 53%}}@keyframes idleGlare{0%,to{background-position:50% 50%,50% 50%,50% 50%}25%{background-position:47% 53%,53% 47%,47% 53%}50%{background-position:50% 50%,50% 50%,50% 50%}75%{background-position:53% 47%,47% 53%,53% 47%}}@media (max-width:768px){.profile-card{width:200px;height:200px}.details h3{font-size:.9rem}.details p{font-size:.75rem}.avatar{width:130%;max-width:240px}}@media (max-width:640px){.profile-card{width:160px;height:160px}.avatar{width:120%;max-width:192px}}@media (max-width:480px){.profile-card{width:140px;height:140px}.details h3{font-size:.8rem}.details p{font-size:.7rem}.user-info{bottom:12px;left:12px;right:12px;padding:8px 12px}.avatar{width:110%;max-width:154px}.card-wrapper{gap:16px}}