body {
  -webkit-user-select: none;
  user-select: none;
}

.skill-cursor-layer {
  position: fixed;
  inset: 0;
  z-index: 1000;
  pointer-events: none;
  overflow: hidden;
  contain: strict;
}
.skill-cursor, .cursor-particle { position: absolute; top: 0; left: 0; pointer-events: none; }
.skill-cursor { width: 32px; height: 32px; z-index: 1; }
.skill-cursor[hidden] { display: none; }
.skill-cursor svg {
  display: block;
  width: 32px;
  height: 32px;
  translate: -5.4px -5.4px;
  filter: drop-shadow(0 2px 2px #33204726);
}
.skill-cursor-label {
  position: absolute;
  top: 23px;
  left: 21px;
  padding: 4px 9px;
  border-radius: 4px 11px 11px 11px;
  background: linear-gradient(125deg, #8757e5, #357ed5);
  color: #fff;
  font: 400 11px/1.5 'Geist', sans-serif;
  white-space: nowrap;
  box-shadow: 0 2px 6px #33204726;
}
.skill-cursor.near-right .skill-cursor-label { left: auto; right: 29px; }
.skill-cursor.near-bottom .skill-cursor-label { top: auto; bottom: 29px; }
html.has-skill-cursor, html.has-skill-cursor * { cursor: none !important; }
.cursor-particle { opacity: 0; will-change: transform, opacity; }
.cursor-particle--skill { object-fit: contain; }
.cursor-particle--star {
  background: var(--accent);
  clip-path: polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 92%,50% 71%,21% 92%,32% 57%,2% 35%,39% 35%);
}
.cursor-particle--spark::before, .cursor-particle--spark::after {
  content: '';
  position: absolute;
  top: calc(50% - .7px);
  left: 0;
  width: 100%;
  height: 1.4px;
  border-radius: 2px;
  background: light-dark(#5793dc, #82b8ff);
}
.cursor-particle--spark::after { rotate: 90deg; }
#cursor-toggle {
  padding: 0;
  background: none;
  border: 0;
  color: inherit;
  font: inherit;
  text-decoration: underline;
  text-underline-offset: 3px;
}
#cursor-toggle[aria-pressed="false"] { text-decoration-style: dotted; }
@media (prefers-reduced-motion: reduce) {
  .skill-cursor-layer { display: none; }
  html.has-skill-cursor, html.has-skill-cursor * { cursor: revert !important; }
}