Progressively enhanced focus visible CSS

focus-visible.css

a,
button,
input {
  &:focus {
    /* More subtle style for older browsers */
    outline: 1px dashed black;
  }
  &:focus:not(:focus-visible) {
    outline: none;
  }
  &:focus-visible {
    outline: 4px dashed #fd0;
    outline-offset: 2px;
  }
}