/* ══════════════════════════════════════════
   CURSOR & PROGRESS
══════════════════════════════════════════ */

#cur {
  position: fixed;
  width: 36px; height: 36px;
  border: 1.5px solid rgba(232, 86, 122, .5);
  border-radius: 50%;
  pointer-events: none;
  z-index: 9999;
  transform: translate(-50%, -50%);
  transition: width .32s var(--ease), height .32s var(--ease),
              background .32s ease, border-color .32s ease;
  mix-blend-mode: multiply;
}

#curDot {
  position: fixed;
  width: 5px; height: 5px;
  background: var(--rose);
  border-radius: 50%;
  pointer-events: none;
  z-index: 9999;
  transform: translate(-50%, -50%);
}

#cur.h {
  width: 62px; height: 62px;
  background: rgba(232, 86, 122, .08);
  border-color: var(--rose);
}

#cur.p {
  width: 76px; height: 76px;
  background: rgba(232, 86, 122, .12);
  border-color: var(--coral);
}

@media (hover: none) {
  #cur, #curDot { display: none; }
}

/* ── Progress bar ── */
#prog {
  position: fixed;
  top: 0; left: 0;
  height: 2.5px;
  width: 0%;
  z-index: 9997;
  background: linear-gradient(90deg, var(--rose), var(--coral), var(--gold));
  border-radius: 0 3px 3px 0;
  transition: width .06s linear;
  box-shadow: 0 0 10px rgba(232, 86, 122, .5);
}