/* 使用系统默认箭头指针，不再隐藏 cursor */

.cursor-fx-layer {
  position: fixed;
  inset: 0;
  z-index: 10050;
  pointer-events: none;
  overflow: hidden;
}

.cursor-fx-canvas {
  display: block;
  width: 100%;
  height: 100%;
}

.cursor-fx-dot,
.cursor-fx-ring {
  display: none !important;
}

.cursor-fx-dot {
  width: 6px;
  height: 6px;
  margin: -3px 0 0 -3px;
  border-radius: 50%;
  transition: width 0.2s ease, height 0.2s ease, margin 0.2s ease;
  background: radial-gradient(circle at 35% 35%, #fff 0%, #7ee8ff 45%, #2b9bff 100%);
  box-shadow: 0 0 12px rgba(43, 155, 255, 0.85), 0 0 24px rgba(126, 232, 255, 0.35);
}

.cursor-fx-ring {
  width: 36px;
  height: 36px;
  margin: -18px 0 0 -18px;
  border-radius: 50%;
  border: 1.5px solid rgba(126, 232, 255, 0.75);
  background: radial-gradient(circle, rgba(43, 155, 255, 0.12) 0%, rgba(43, 155, 255, 0) 70%);
  box-shadow: 0 0 20px rgba(43, 155, 255, 0.25);
  transition: width 0.22s ease, height 0.22s ease, margin 0.22s ease, border-color 0.22s ease, opacity 0.22s ease;
}

html.cursor-fx-active.cursor-fx--down .cursor-fx-ring {
  width: 28px;
  height: 28px;
  margin: -14px 0 0 -14px;
  border-color: rgba(255, 255, 255, 0.9);
  background: radial-gradient(circle, rgba(43, 155, 255, 0.35) 0%, rgba(43, 155, 255, 0) 70%);
}

html.cursor-fx-active.cursor-fx--hover .cursor-fx-ring {
  width: 48px;
  height: 48px;
  margin: -24px 0 0 -24px;
  border-color: rgba(43, 155, 255, 0.95);
  background: rgba(43, 155, 255, 0.08);
}

html.cursor-fx-active.cursor-fx--hover .cursor-fx-dot {
  width: 8px;
  height: 8px;
  margin: -4px 0 0 -4px;
}

@media (prefers-reduced-motion: reduce) {
  html.cursor-fx-active,
  html.cursor-fx-active * {
    cursor: revert !important;
  }

  .cursor-fx-dot,
  .cursor-fx-ring {
    display: none !important;
  }
}
