@import url('/styles/common.css');

a.reference:link,
a.reference:visited {
  color: inherit;
  text-decoration: inherit;
}

@media (any-hover: hover) {
  a.reference:hover:link,
  a.reference:hover:visited {
    color: var(--accent);
  }
}

a.reference {
  display: inline-flex;
  align-items: center;
}

a.reference::before {
  content: '';
  mask: url('/assets/link.svg');
  mask-size: cover;
  background: var(--dark);
  opacity: 0;
  width: 0;
  height: 1em;
  transform: scale(0);
  display: inline-block;
}

@media (any-hover: hover) {
  a.reference:hover::before {
    opacity: 1;
    width: 1em;
    height: 1em;
    margin-right: -.1em;
    transform: scale(.7);
  }
}