.client-portrait{position:relative;display:inline-block;box-sizing:content-box;flex-shrink:0;vertical-align:middle;overflow:hidden;isolation:isolate;background:var(--surface,#fff);border:1px solid color-mix(in srgb,var(--accent) 24%,var(--line));box-shadow:0 2px 7px #4d142018}
.client-portrait-small{width:42px;height:42px;border-radius:11px;padding:2px}
.client-portrait-large{width:128px;height:144px;padding:5px;border-radius:19px;border-color:#fff9;background:#fffafa;box-shadow:0 9px 25px #430b2540,0 0 0 4px #ffffff13}
.client-portrait-fallback{position:absolute;inset:2px;border-radius:8px;background:var(--accent-soft,#f6e9ec);color:var(--accent,#982538);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:15px;font-weight:700;line-height:1}
.client-portrait-large .client-portrait-fallback{inset:5px;border-radius:13px;font-size:36px}.client-portrait-fallback small{font-size:11px;font-weight:500;line-height:1.4;margin-top:4px;color:var(--accent)}
.client-portrait-image{position:relative;z-index:1;display:block;width:100%;height:100%;object-fit:cover;object-position:center 30%;image-orientation:from-image;border-radius:8px;background:var(--surface,#fff)}
.client-portrait-large .client-portrait-image{border-radius:13px}.client-portrait-image[hidden]{display:none!important}.client-portrait[data-photo-ready=true] .client-portrait-fallback{visibility:hidden}
.client-profile-banner{padding:24px;gap:24px;min-height:168px;box-sizing:border-box}.client-profile-identity{display:flex;align-items:center;gap:24px;min-width:0}.client-profile-title{min-width:0}.client-profile-banner .client-profile-title h1{font-size:clamp(1.2rem,2vw,1.65rem);line-height:1.25;margin:8px 0;overflow-wrap:anywhere;color:inherit}.client-profile-eyebrow{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.065em;color:#ffffffd9}.client-profile-banner .client-profile-title p{font-size:13px;margin:0;color:#ffffffe3}.client-profile-banner>.actions{flex-shrink:0;margin-left:auto}
.client-directory-identity{display:flex;align-items:center;gap:12px;min-width:190px}.client-directory-avatar{display:inline-flex;flex-shrink:0;border-radius:11px;text-decoration:none}.client-directory-avatar:hover .client-portrait{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.client-directory-avatar:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.client-directory-label{min-width:0}.client-directory-label small{display:block}.client-directory-label strong{line-height:1.4}.client-directory-avatar .client-portrait{transition:box-shadow .16s,border-color .16s}
@media(max-width:700px){.client-profile-banner{padding:20px;flex-wrap:wrap;gap:18px}.client-profile-identity{gap:17px;width:100%}.client-portrait-large{width:96px;height:112px;padding:4px;border-radius:16px}.client-portrait-large .client-portrait-fallback{inset:4px}.client-profile-banner>.actions{margin-left:0;width:100%;justify-content:flex-end}.client-profile-banner .client-profile-title h1{font-size:1.2rem}.client-profile-eyebrow{font-size:9px}.client-profile-banner .client-profile-title p{font-size:11px}}
@media(max-width:400px){.client-profile-banner{padding:16px}.client-profile-identity{gap:13px}.client-portrait-large{width:76px;height:90px}.client-profile-banner .client-profile-title h1{font-size:1.05rem}}
@media(prefers-reduced-motion:reduce){.client-directory-avatar .client-portrait{transition:none}}html[data-motion=off] .client-directory-avatar .client-portrait{transition:none}
@media print{.client-profile-banner{break-inside:avoid}.client-portrait{box-shadow:none;print-color-adjust:exact}.client-portrait-large{width:84px;height:94px}.client-profile-banner .client-profile-eyebrow,.client-profile-banner .client-profile-title p{color:inherit}}