.profile-image{background:var(--muted);width:2.75rem;height:2.75rem;color:var(--primary);vertical-align:middle;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:.85rem;font-weight:600;display:inline-flex;overflow:hidden}.profile-image img{object-fit:cover;width:100%;height:100%;display:block}.profile-image-logo{background:var(--card);border:1px solid var(--border);border-radius:.65rem}.profile-image-logo img{object-fit:contain;padding:.2rem}.profile-image-uploader{border:1px solid var(--border);background:var(--card);color:var(--card-foreground);border-radius:.85rem;align-items:flex-start;gap:1rem;margin-block:1rem;padding:1.1rem;display:flex}.profile-upload-preview,.profile-upload-preview>.profile-image{border-radius:.75rem;flex-shrink:0;width:4rem;height:4rem;overflow:hidden}.profile-upload-preview>img{object-fit:cover;width:100%;height:100%}.profile-upload-content{flex:1;min-width:0}.profile-upload-content h2{margin:0;font-size:.95rem;font-weight:600;line-height:1.4}.profile-upload-content p{color:var(--muted-foreground);margin:.25rem 0;font-size:.8rem}.profile-upload-actions{flex-wrap:wrap;gap:.4rem;margin-top:.6rem;display:flex}.profile-upload-actions>button{border-radius:.55rem;gap:.4rem;width:auto;height:2rem;min-height:2rem;padding:.3rem .65rem;font-size:.8rem}.profile-upload-content .profile-image-error{color:var(--destructive)}.profile-image-skeleton{background:var(--muted);animation:1.5s ease-in-out infinite profile-image-loading}@keyframes profile-image-loading{50%{opacity:.5}}@media (prefers-reduced-motion:reduce){.profile-image-skeleton{animation:none}}.image-frame{border-radius:var(--radius);background:var(--muted);cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;margin:0 auto;position:relative;overflow:hidden}.image-frame:active{cursor:grabbing}.image-frame:focus-visible{outline:2px solid var(--ring);outline-offset:3px}.image-frame-logo{background-color:var(--muted);background-image:linear-gradient(45deg, var(--border) 25%, transparent 25%, transparent 75%, var(--border) 75%), linear-gradient(45deg, var(--border) 25%, transparent 25%, transparent 75%, var(--border) 75%);background-position:0 0,8px 8px;background-size:16px 16px}.image-frame>img{pointer-events:none;max-width:none;position:absolute}.image-frame-mask{box-shadow:0 0 0 999px color-mix(in oklab, var(--background) 60%, transparent);border:2px solid var(--background);pointer-events:none;border-radius:50%;position:absolute;inset:0}.image-frame-zoom{align-items:center;gap:.5rem;display:flex}
