/* Approved oak leaf cursor. The trail is added only for a fine desktop pointer. */
@media (hover: hover) and (pointer: fine) {
  body { cursor: url('../cursors/oak-cursor-32.png') 1 1, auto; }
  a:not([aria-disabled='true']), button:not(:disabled), summary, label,
  [role='button']:not([aria-disabled='true']), [role='link'], [role='tab'],
  input[type='range'], input[type='checkbox'], input[type='radio'], input[type='file'], select {
    cursor: url('../cursors/oak-cursor-32.png') 1 1, pointer !important;
  }
}

.oak-cursor-echo {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 2147483646;
  width: 25px;
  height: 25px;
  opacity: 0;
  pointer-events: none;
  user-select: none;
  transition: transform 105ms ease-out, opacity 170ms ease-out;
}
.oak-cursor-echo img { display: block; width: 100%; height: 100%; }
.oak-cursor-echo[data-echo='2'] { width: 18px; height: 18px; transition-duration: 170ms, 170ms; }
.oak-cursor-echo[data-echo='3'] { width: 11px; height: 11px; transition-duration: 245ms, 170ms; }
.oak-cursor-echo.is-visible[data-echo='1'] { opacity: .46; }
.oak-cursor-echo.is-visible[data-echo='2'] { opacity: .27; }
.oak-cursor-echo.is-visible[data-echo='3'] { opacity: .13; }

@media (prefers-reduced-motion: reduce) {
  .oak-cursor-echo { display: none; }
}