/* Colored pixel cursors retain precise hotspots and work without a JS follower. */
@media (hover: hover) and (pointer: fine) {
 :root {
  --pixel-arrow: url("assets/cursor-arrow.svg?v=2") 5 3, default;
  --pixel-hand: url("assets/cursor-hand.svg?v=2") 14 3, pointer;
 }
 html, body { cursor: var(--pixel-arrow); }
 body * { cursor: inherit; }
 body a,
 body button,
 body [role="button"],
 body summary,
 body label[for],
 body select,
 body input[type="checkbox"],
 body input[type="radio"],
 body input[type="range"],
 body .brick,
 body .hero .word,
 body .play-tile { cursor: var(--pixel-hand); }
 body input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="button"]):not([type="submit"]),
 body textarea,
 body [contenteditable="true"] { cursor: text; }
 body :is(button, input, select):disabled,
 body [aria-disabled="true"] { cursor: var(--pixel-arrow); }
 #signature-canvas { cursor: crosshair; }
}