/* =============================================================
   ENYED — Cursor Styles (3. Modül)
   ============================================================= */
.cursor {
  position: fixed; top: 0; left: 0; width: 36px; height: 36px;
  border: 1px solid #fff; border-radius: 50%;
  transform: translate(-50%, -50%); pointer-events: none; z-index: 9999;
  mix-blend-mode: difference;
  display: flex; align-items: center; justify-content: center;
  transition: width .25s cubic-bezier(.22,1,.36,1), height .25s cubic-bezier(.22,1,.36,1),
              background .25s, border-color .25s, opacity .2s;
}
.cursor .dot { width: 4px; height: 4px; background: #fff; border-radius: 50%; transition: opacity .2s, transform .25s; }
.cursor.hot { width: 58px; height: 58px; background: #fff; }
.cursor.hot .dot { opacity: 0; }
.cursor.pin { width: 46px; height: 46px; border-color: #fff; background: transparent; }
.cursor.pin .dot { opacity: 0; }
.cursor .cross { position: absolute; opacity: 0; transition: opacity .2s; }
.cursor .cross::before, .cursor .cross::after { content: ""; position: absolute; background: #fff; }
.cursor .cross::before { width: 14px; height: 1px; left: -7px; top: 0; }
.cursor .cross::after { height: 14px; width: 1px; top: -7px; left: 0; }
.cursor.pin .cross { opacity: 1; }
.cursor.grab { width: 44px; height: 44px; }
.cursor.drag { width: 24px; height: 24px; background: #fff; }
.cursor.drag .dot { opacity: 0; }

.cursor-label {
  position: fixed; top: 0; left: 0; z-index: 9998; pointer-events: none;
  font-family: "Space Grotesk", sans-serif; font-size: 10px; letter-spacing: 2px;
  text-transform: uppercase; color: #fff; padding: 4px 9px; border-radius: 20px;
  background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .35);
  backdrop-filter: blur(4px); transform: translate(18px, 18px);
  opacity: 0; transition: opacity .18s; white-space: nowrap;
}
.cursor-label.show { opacity: 1; }

.cursor-ring {
  position: fixed; top: 0; left: 0; width: 64px; height: 64px;
  border: 1px solid rgba(255, 255, 255, .35); border-radius: 50%;
  pointer-events: none; z-index: 9996; mix-blend-mode: difference;
  transform: translate(-50%, -50%); transition: width .3s, height .3s, opacity .3s, border-color .3s;
}
.cursor-ring.hot { width: 88px; height: 88px; border-color: rgba(255, 255, 255, .6); }
.cursor-ring.hidden { opacity: 0; }

@media (hover: none), (pointer: coarse), (max-width: 900px) {
  .cursor, .cursor-label, .cursor-ring {
    display: none !important;
  }
}