.profile-picture-container{cursor:pointer}.profile-picture-border{position:relative;width:100%;height:100%;padding:2px;background:linear-gradient(135deg,rgba(156,163,175,.4),rgba(156,163,175,.3) 50%,rgba(156,163,175,.4));border-radius:50%;transition:all .4s cubic-bezier(.25,.46,.45,.94)}.profile-picture-border:before{top:-3px;left:-3px;right:-3px;bottom:-3px;background:linear-gradient(135deg,rgba(255,76,77,.4),rgba(255,107,107,.3) 20%,rgba(139,92,246,.3) 40%,rgba(59,130,246,.3) 60%,rgba(255,107,107,.3) 80%,rgba(255,76,77,.4));z-index:-1;transform:scale(.95)}.profile-picture-border:after,.profile-picture-border:before{content:"";position:absolute;border-radius:50%;opacity:0;transition:all .4s cubic-bezier(.25,.46,.45,.94)}.profile-picture-border:after{top:-6px;left:-6px;right:-6px;bottom:-6px;background:linear-gradient(135deg,rgba(255,76,77,.15),rgba(139,92,246,.1) 40%,rgba(59,130,246,.1) 60%,rgba(255,76,77,.15));z-index:-2;transform:scale(.9)}.profile-picture-container:focus .profile-picture-border,.profile-picture-container:hover .profile-picture-border{padding:4px;background:linear-gradient(135deg,#ff4c4d,#ff6b6b 20%,#8b5cf6 40%,#3b82f6 60%,#ff6b6b 80%,#ff4c4d);transform:scale(1.03)}.profile-picture-container:focus .profile-picture-border:after,.profile-picture-container:focus .profile-picture-border:before,.profile-picture-container:hover .profile-picture-border:after,.profile-picture-container:hover .profile-picture-border:before{opacity:1;transform:scale(1)}.profile-picture-inner{position:relative;width:100%;height:100%;border-radius:50%;overflow:hidden;background:#1e293b}.profile-picture-image{object-fit:cover;object-position:center top;border-radius:50%;filter:saturate(.85) contrast(1.05);transition:all .4s cubic-bezier(.25,.46,.45,.94)}.profile-picture-container:focus .profile-picture-image,.profile-picture-container:hover .profile-picture-image{filter:saturate(1) contrast(1);transform:scale(1.05)}.profile-picture-fallback{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;border-radius:50%;background:radial-gradient(circle at top,rgba(34,211,238,.18),transparent 48%),linear-gradient(135deg,#0f172a,#111827 60%,#1e293b);color:#f8fafc;font-size:clamp(1rem,2vw,1.75rem);font-weight:700;letter-spacing:.08em;text-transform:uppercase}.profile-picture-sheen{position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(110deg,transparent 40%,rgba(255,255,255,.4) 50%,rgba(255,255,255,.3) 55%,transparent 65%);border-radius:50%;opacity:0;transition:all .4s cubic-bezier(.25,.46,.45,.94);pointer-events:none;transform:skewX(-15deg)}.profile-picture-container:hover .profile-picture-sheen{opacity:1;left:120%}.profile-picture-vignette{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:50%;background:radial-gradient(circle at center,transparent 50%,rgba(0,0,0,.2) 85%,rgba(0,0,0,.35) 100%);opacity:1;transition:opacity .3s cubic-bezier(.4,0,.2,1);pointer-events:none}.profile-picture-container:hover .profile-picture-vignette{opacity:.3}.profile-picture-container:focus-visible{outline:2px solid #22d3ee;outline-offset:4px;border-radius:50%}.profile-picture-container:focus{outline:none}@media (prefers-reduced-motion:reduce){.profile-picture-container:hover .profile-picture-border,.profile-picture-container:hover .profile-picture-border:after,.profile-picture-container:hover .profile-picture-border:before,.profile-picture-container:hover .profile-picture-image,.profile-picture-container:hover .profile-picture-sheen,.profile-picture-container:hover .profile-picture-vignette{transition:none;animation:none}.profile-picture-container:hover .profile-picture-sheen{opacity:0}}