.hp-avatar{box-sizing:border-box;width:var(--hp-avatar);height:var(--hp-avatar);border:1px solid var(--hp-rule-2);background:var(--hp-surface-2);color:var(--hp-ink);font-family:var(--hp-font-display);font-weight:700;font-size:var(--hp-t-label);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;line-height:1;display:inline-flex;position:relative;overflow:hidden}.hp-avatar[data-size=floor]{width:var(--hp-type-mark-floor);height:var(--hp-type-mark-floor);font-size:var(--hp-t-eyebrow)}.hp-avatar[data-size=xs]{width:var(--hp-avatar-xs);height:var(--hp-avatar-xs);font-size:var(--hp-t-eyebrow)}.hp-avatar[data-size=sm]{width:var(--hp-avatar-sm);height:var(--hp-avatar-sm);font-size:var(--hp-t-small)}.hp-avatar[data-size=lg]{width:var(--hp-avatar-lg);height:var(--hp-avatar-lg)}.hp-avatar[data-size=xl]{width:var(--hp-avatar-xl);height:var(--hp-avatar-xl);font-size:var(--hp-t-h2)}.hp-avatar[data-size=xxl]{width:calc(var(--hp-avatar-xl) * 1.5);height:calc(var(--hp-avatar-xl) * 1.5);font-size:calc(var(--hp-t-h2) * 1.5)}.hp-avatar[data-type]{background:0 0;border:0}.hp-avatar[data-palette]{background:var(--hp-av-ground);color:var(--hp-av-ink);border:0}.hp-avatar[data-type]>svg,.hp-avatar>img{width:100%;height:100%}.hp-avatar>img{object-fit:cover}.hp-avatar[data-mark]>svg{width:50%;height:50%}.hp-avatar[data-mark=gm]{background:var(--hp-accent);color:var(--hp-accent-ink)}.hp-avatar[data-mark=system]{color:var(--hp-ink)}