.xl-person-content{padding:32px 0 100px;display:flex;flex-direction:column;gap:48px}.xl-person-intro{display:flex;flex-direction:column;gap:24px}.xl-breadcrumb{display:flex;align-items:center;gap:4px;font-size:16px;line-height:22px;color:var(--text-secondary)}.xl-breadcrumb img{width:11px;height:11px;flex:none}.xl-breadcrumb [aria-current]{color:var(--text-primary);font-weight:600}.xl-person-profile{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:1fr auto;align-items:center;column-gap:24px;padding:24px;background:var(--bg-surface);border-radius:12px}.xl-person-info{grid-column:1;grid-row:1 / 3;display:flex;align-items:center;gap:20px;min-width:0}.xl-person-avatar-frame{position:relative;width:160px;height:160px;border-radius:8px;overflow:hidden;flex:none}.xl-person-info .xl-person-avatar{display:block;width:100%!important;height:100%!important;margin:0;object-fit:cover;border-radius:inherit}.xl-person-avatar[data-src]{opacity:0}.xl-person-avatar-skeleton{position:absolute;inset:0;background:var(--bg-emphasis);animation:xl-person-avatar-pulse 1.6s ease-in-out infinite;pointer-events:none}.xl-person-avatar:not([data-src])+.xl-person-avatar-skeleton{display:none}.xl-person-copy{min-width:0;overflow-wrap:anywhere;gap:24px;display:flex;flex-direction:column;justify-content:space-between;min-height:160px}.xl-person-copy h1{font-size:32px;line-height:45px;font-weight:600;margin-bottom:8px}.xl-person-profile .xl-tags{display:flex;flex-wrap:wrap;gap:6px}.xl-person-profile .xl-tags a,.xl-person-profile .xl-tags .xl-tag-label{background:var(--bg-emphasis)}.xl-person-copy p{font-size:16px;line-height:22px}.xl-person-copy .xl-person-description{font-size:14px;line-height:20px;color:var(--text-tertiary);margin-top:8px}.xl-person-follow{grid-column:2;grid-row:1 / 3;justify-self:end;align-self:center;display:flex;align-items:center;justify-content:center;gap:4px;padding:10px 16px;font-size:14px!important;white-space:nowrap;flex:none}.xl-person-follow img{width:20px;height:20px;flex:none}.xl-person-reminder{grid-column:2;grid-row:2;align-self:end;text-align:right;font-size:12px;line-height:17px;color:var(--text-muted)}.xl-person-section{display:flex;flex-direction:column;gap:24px}.xl-person-section h2{font-size:24px;line-height:34px;font-weight:600}.xl-person-detail a:focus-visible,.xl-person-follow:focus-visible{outline:2px solid #5c7bff;outline-offset:3px}
@media(max-width:900px){.xl-person-profile{display:flex;flex-wrap:wrap;gap:16px}.xl-person-info{width:100%}.xl-person-reminder{flex:1;min-width:0}}
@media(max-width:640px){.xl-person-content{padding:24px 0 48px;gap:32px}.xl-breadcrumb{font-size:14px}.xl-person-profile{padding:16px;flex-wrap:wrap;gap:16px}.xl-person-info{gap:12px;width:100%}.xl-person-avatar-frame{width:100px;height:100px}.xl-person-copy{min-height:100px}.xl-person-copy h1{font-size:24px;line-height:34px}.xl-person-copy p{font-size:14px}.xl-person-copy .xl-person-description{font-size:12px}.xl-person-reminder{position:static;flex:1;min-width:0}.xl-person-section{gap:16px}.xl-person-section h2{font-size:20px;line-height:28px}}

.xl-person-profile .xl-person-follow{width:auto;height:auto;padding:10px 16px;min-height:40px}
.xl-person-follow[aria-pressed="false"]:not(:disabled)::before{content:"";width:20px;height:20px;flex:none;background:url("/static/web/images/redesign/actor-detail/follow-plus.svg") center/20px 20px no-repeat}

/* Figma 2164:22308: 8 recommendations reuse the shared 4-column video grid. */
.xl-person-recommendations-heading{display:flex;align-items:center;gap:12px}
.xl-person-recommendations-note{font-size:12px;color:var(--text-muted);font-weight:400}

/* H5 profile follows the annotated vertical reading order. */
@media(max-width:640px){
 .xl-person-profile{flex-direction:column;align-items:center;gap:calc(16 * var(--xl-h5-unit));text-align:center}
 .xl-person-info{flex-direction:column;align-items:center;gap:calc(16 * var(--xl-h5-unit))}
 .xl-person-copy{min-height:0;width:100%;gap:calc(16 * var(--xl-h5-unit));justify-content:flex-start}
 .xl-person-copy h1{margin-bottom:0}
 .xl-person-profile .xl-tags{justify-content:center;margin-top:calc(8 * var(--xl-h5-unit))}
 .xl-person-copy .xl-person-description{margin-top:calc(16 * var(--xl-h5-unit));text-align:center}
 .xl-person-profile .xl-person-follow{align-self:center}
 .xl-person-reminder{flex:none;width:100%;text-align:center}
}

@keyframes xl-person-avatar-pulse{50%{opacity:.45}}
@media(prefers-reduced-motion:reduce){.xl-person-avatar-skeleton{animation:none}}
