:root {
  --clipo-cursor-default: url("/_instatic/assets/clipo-cursor-blue-48.svg?v=20260907-2") 4 2, auto;
  --clipo-rabbit-cursor-size: 68px;
}

html,
body,
body * {
  cursor: var(--clipo-cursor-default);
}

body :where(
  a[href],
  button,
  summary,
  select,
  [role="button"],
  input[type="button"],
  input[type="submit"],
  input[type="reset"],
  input[type="checkbox"],
  input[type="radio"],
  input[type="range"]
) {
  cursor: pointer;
}

body :where(input:not([type]), input[type="text"], input[type="email"], input[type="search"], input[type="url"], input[type="tel"], input[type="password"], textarea, [contenteditable="true"]) {
  cursor: text;
}

.clipo-rive-cursor {
  position: fixed;
  z-index: 2147483646;
  top: 0;
  left: 0;
  width: var(--clipo-rabbit-cursor-size);
  height: var(--clipo-rabbit-cursor-size);
  contain: layout style;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transform: translate3d(-200px, -200px, 0);
  will-change: transform;
}

.clipo-rive-cursor.is-visible {
  visibility: visible;
  opacity: 1;
}

.clipo-rive-cursor__rabbit {
  width: 100%;
  height: 100%;
  transform-origin: 22% 14%;
  will-change: transform;
}

.clipo-rive-cursor__canvas {
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

/* Figma 4366:36992, resized to 16px at the user's request; tracking -4%.
   SVG round joins preserve the sticker outline without a second text layer. */
.clipo-cursor-tooltip {
  position: absolute;
  top: 0;
  left: 0;
  overflow: visible;
  pointer-events: none;
}

.clipo-cursor-tooltip text {
  font-family: "Ronzino", Arial, sans-serif;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: -0.64px;
  white-space: pre;
  fill: var(--clipo-tooltip-text, #131c18);
  stroke: var(--clipo-tooltip-stroke, #00e887);
  stroke-width: 4.57px;
  stroke-linejoin: round;
  paint-order: stroke fill;
}

.clipo-cursor-tooltip__caret {
  fill: var(--clipo-tooltip-text, #131c18);
  stroke: var(--clipo-tooltip-stroke, #00e887);
  stroke-width: 4.57px;
  stroke-linejoin: round;
  paint-order: stroke fill;
  opacity: 0;
  pointer-events: none;
}

.clipo-cursor-tooltip__caret.is-visible {
  opacity: 1;
}

.clipo-cursor-tooltip__caret.is-complete {
  animation: clipo-tooltip-caret-blink 0.5s steps(1, end) infinite;
}

@keyframes clipo-tooltip-caret-blink {
  50% { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .clipo-cursor-tooltip__caret.is-complete { animation: none; }
}

.clipo-svg-cursor {
  position: fixed;
  z-index: 2147483647;
  top: 0;
  left: 0;
  width: 28.8px;
  height: 29.4px;
  contain: layout style;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transform: translate3d(-100px, -100px, 0);
  will-change: transform;
}

.clipo-svg-cursor.is-visible {
  visibility: visible;
  opacity: 1;
}

.clipo-svg-cursor__hover,
.clipo-svg-cursor__press,
.clipo-svg-cursor__image {
  display: block;
  width: 100%;
  height: 100%;
  transform-origin: 4px 2px;
}

.clipo-svg-cursor__hover {
  transform: scale(1);
  transition: transform 110ms cubic-bezier(0.22, 1, 0.36, 1);
}

.clipo-svg-cursor.is-interactive .clipo-svg-cursor__hover {
  transform: scale(1.2);
}

.clipo-svg-cursor.is-clicking .clipo-svg-cursor__press {
  animation: clipo-svg-cursor-click 150ms cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes clipo-svg-cursor-click {
  0% { transform: scale(1); }
  38% { transform: scale(0.8); }
  100% { transform: scale(1); }
}

@media (hover: hover) and (pointer: fine) {
  html.is-clipo-svg-cursor-ready,
  html.is-clipo-svg-cursor-ready body,
  html.is-clipo-svg-cursor-ready body * {
    cursor: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .clipo-svg-cursor__hover {
    transition: none;
  }
}