@layer base {
  action-text-attachment[content-type~="application/vnd.beep.mention"],
  action-text-attachment[content-type~="application/vnd.actiontext.mention"] {
    display: inline-flex;
    margin: 0;
    padding: 0;
    position: relative;
  }

  .mention:not(.ds-mention) {
    --avatar-size: 1.35em;
    --avatar-border-radius: var(--avatar-size);

    align-items: center;
    color: inherit !important;
    display: inline-flex;
    font-weight: 600 !important;
    line-height: var(--avatar-size);
    margin: 0;
    padding-inline-start: calc(
      var(--avatar-size) + var(--inline-space) / 3
    ) !important;
    position: relative;
    text-decoration: none !important;

    /* A draft saved before the editor drew ds-mention still carries this face. */
    .avatar {
      aspect-ratio: 1;
      block-size: var(--avatar-size);
      border-radius: 50%;
      inline-size: var(--avatar-size);
      inset-block-start: 0;
      inset-inline-start: 0;
      margin: 0;
      overflow: clip;
      position: absolute;

      > img,
      > .avatar-monogram + img {
        block-size: 100%;
        inline-size: 100%;
        object-fit: cover;
      }

    }

    figcaption {
      display: none;
    }
  }

  .mention--everyone {
    padding-inline-start: 0 !important;
  }
}

blockquote .attachment--preview {
  --avatar-size: 2.5ch;
  --avatar-border-radius: 2em;

  color: inherit;
  display: inline-flex;
  margin: 0;
  padding-inline-start: 2.75ch !important;
  position: relative;
  z-index: 2;

  img {
    aspect-ratio: 1;
    block-size: auto;
    border-radius: var(--avatar-border-radius);
    inline-size: var(--avatar-size);
    inset-block-start: -1em;
    inset-inline-start: 0;
    margin: 0;
    overflow: clip;
    position: absolute;
  }

  figcaption {
    display: none;
  }
}
