/* The top of the note's stem is the native cursor hotspot (18, 2). */
@media (any-hover: hover) and (any-pointer: fine) {
  html.jam-note-cursor,
  html.jam-note-cursor body,
  html.jam-note-cursor body * {
    cursor: url("note-cursor.svg") 18 2, auto !important;
  }
  html.jam-note-cursor :is(a, button, [role="button"], summary, label) {
    cursor: url("note-cursor.svg") 18 2, pointer !important;
  }
  html.jam-note-cursor :is(input, textarea, [contenteditable="true"]) {
    cursor: text !important;
  }
}
.jam-note-trail {
  position: fixed;
  inset: 0;
  z-index: 2147483646;
  pointer-events: none !important;
  overflow: hidden;
  contain: strict;
}
.jam-note-trail *, .jam-note-trail::before, .jam-note-trail::after {
  pointer-events: none !important;
}
.jam-note-particle {
  position: absolute;
  width: 20px;
  height: 25px;
  opacity: 0;
  will-change: transform, opacity;
  animation: jam-note-fade 620ms ease-out forwards;
}
.jam-note-particle svg { display: block; width: 100%; height: 100%; }
@keyframes jam-note-fade {
  0% { opacity: .85; transform: translate(-50%, -50%) rotate(var(--note-turn)) scale(.92); }
  100% { opacity: 0; transform: translate(calc(-50% + var(--note-drift)), calc(-50% + 22px)) rotate(calc(var(--note-turn) + 18deg)) scale(.48); }
}
html.reduce-motion .jam-note-trail { display: none; }
@media (prefers-reduced-motion: reduce) {
  html:not(.motion-user-on) .jam-note-trail { display: none; }
}
@media (any-hover: none) {
  .jam-note-trail { display: none; }
}
