/* JquanUI atomic-first residual CSS: visual, responsive and interaction-only. Demo V3.44 */
:root {
  --cursor-gold: #b89865;
  --cursor-green: #4a7c75;
  --cursor-ink: #102b2c;
}

@media (pointer: fine) and (prefers-reduced-motion: no-preference) {
  body.ql-custom-cursor,
  body.ql-custom-cursor * {
    cursor: none !important;
  }
}

.ql-cursor-dot,
.ql-cursor-ring {
  transform: translate3d(-100px, -100px, 0);
  transition: opacity 180ms ease;
  will-change: transform, opacity;
}

.ql-cursor-dot::before,
.ql-cursor-ring::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  transition: transform 120ms ease, border-color 180ms ease, background-color 180ms ease;
}

.ql-cursor-dot {
  background: transparent;
}

.ql-cursor-dot::before {
  background: var(--cursor-gold);
  box-shadow: 0 0 14px rgb(184 152 101 / 35%);
}

.ql-cursor-ring {
  background: transparent;
}

.ql-cursor-ring::before {
  border: 1px solid rgb(184 152 101 / 58%);
  background: rgb(74 124 117 / 0%);
}



.ql-cursor-hover .ql-cursor-ring {
}

.ql-cursor-hover .ql-cursor-ring::before {
  border-color: var(--cursor-gold);
  background: rgb(74 124 117 / 13%);
  transform: scale(1.52);
}

.ql-cursor-down .ql-cursor-dot::before {
  transform: scale(0.65);
}

.ql-cursor-down .ql-cursor-ring::before {
  transform: scale(0.86);
}

.ql-ink-canvas {
  contain: strict;
}

.ql-ink-drop {
  border-radius: 50%;
  filter: url("#ql-paper-bleed");
  background: radial-gradient(circle, rgb(36 91 89 / 88%) 0%, rgb(74 124 117 / 48%) 48%, transparent 80%);
  transform: translate3d(var(--ink-x, -400px), var(--ink-y, -400px), 0) translate(-50%, -50%) scale(0);
  transition: transform 1.2s cubic-bezier(.1, .9, .2, 1), opacity 600ms ease-in-out;
  will-change: transform, opacity;
}

.ql-ink-drop::before,
.ql-ink-drop::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  border-radius: 50%;
  transform: translate(-50%, -50%);
}

.ql-ink-drop::before {
  width: 180px;
  height: 180px;
  background: radial-gradient(circle, #071718 0%, var(--cursor-ink) 58%, transparent 80%);
}

.ql-ink-drop::after {
  width: 112px;
  height: 112px;
  opacity: 0.72;
  mix-blend-mode: color-dodge;
  background: radial-gradient(circle, #dbc38f 0%, var(--cursor-gold) 38%, transparent 72%);
  transition: transform 1.35s cubic-bezier(.1, .9, .2, 1);
}

.ql-ink-drop.is-open {
  transform: translate3d(var(--ink-x, -400px), var(--ink-y, -400px), 0) translate(-50%, -50%) scale(var(--ink-scale, 1));
}

.ql-ink-drop.is-open::after {
  transform: translate(-50%, -50%) scale(1.25);
}





@media (prefers-reduced-motion: reduce), (pointer: coarse) {
  .ql-cursor-dot,
  .ql-cursor-ring,
  .ql-ink-canvas,
  .ql-effects-defs {
    display: none !important;
  }
}