.toile-global-cursor {
  --toile-global-cursor-width: 92px;
  --toile-global-cursor-height: 92px;
  --toile-global-cursor-primary: #111111;
  --toile-global-cursor-secondary: rgba(255, 255, 255, 0.24);
  --toile-global-cursor-opacity: 1;
  --toile-global-cursor-blend-mode: normal;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 2147483000;
  width: 0;
  height: 0;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.14s ease, visibility 0.14s ease;
}

.toile-global-cursor.is-ready {
  visibility: visible;
}

.toile-global-cursor.is-visible {
  opacity: 1;
}

.toile-global-cursor__inner {
  position: absolute;
  left: 0;
  top: 0;
  width: var(--toile-global-cursor-width);
  height: var(--toile-global-cursor-height);
  transform: translate3d(-50%, -50%, 0);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: var(--toile-global-cursor-opacity);
  mix-blend-mode: var(--toile-global-cursor-blend-mode);
}

.toile-global-cursor__bg {
  position: absolute;
  inset: 0;
  border-radius: 999px;
  background: var(--toile-global-cursor-secondary);
  backdrop-filter: blur(6px);
}

.toile-global-cursor__icon {
  position: relative;
  z-index: 1;
  display: inline-flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  color: var(--toile-global-cursor-primary);
}

.toile-global-cursor__icon svg {
  display: block;
  width: 70%;
  height: 70%;
  overflow: visible;
}

.toile-global-cursor__icon svg [fill]:not([fill="none"]),
.toile-global-cursor__icon svg [stroke]:not([stroke="none"]) {
  color: inherit;
}

.toile-global-cursor__icon svg [fill]:not([fill="none"]) {
  fill: currentColor !important;
}

.toile-global-cursor__icon svg [stroke]:not([stroke="none"]) {
  stroke: currentColor !important;
}

html.has-toile-global-cursor,
html.has-toile-global-cursor body,
html.has-toile-global-cursor body a,
html.has-toile-global-cursor body button,
html.has-toile-global-cursor body input,
html.has-toile-global-cursor body select,
html.has-toile-global-cursor body textarea,
html.has-toile-global-cursor body [role="button"] {
  cursor: none !important;
}

html.has-toile-global-cursor [data-fp3-cursor="1"],
html.has-toile-global-cursor [data-fp3-cursor="1"] * {
  cursor: none !important;
}

@media (pointer: coarse), (prefers-reduced-motion: reduce) {
  .toile-global-cursor {
    display: none !important;
  }
}