.tech-cursor {
  --cursor-color: #68ddff;
  position: fixed;
  inset: 0;
  z-index: 100;
  overflow: hidden;
  pointer-events: none;
  user-select: none;
  opacity: 0;
  contain: strict;
}

html.tech-cursor-on,
html.tech-cursor-on * { cursor: none !important; }
html.tech-cursor-on .tech-cursor { opacity: 1; }

.tech-cursor-fx { position: absolute; inset: 0; width: 100%; height: 100%; }
.tech-cursor-core {
  position: absolute;
  top: 0;
  left: 0;
  width: 5px;
  height: 5px;
  background: #e3faff;
  border-radius: 1px;
  box-shadow: 0 0 6px #fff, 0 0 16px #27baff;
  pointer-events: none;
}

.tech-cursor-reticle {
  position: absolute;
  top: 0;
  left: 0;
  width: 64px;
  height: 64px;
  color: var(--cursor-color);
  filter: drop-shadow(0 0 5px #239cff80);
}

.tech-cursor-reticle svg { display: block; width: 100%; height: 100%; overflow: visible; }
.tech-cursor-brackets,
.tech-cursor-inner { transform-origin: 32px 32px; transition: transform .24s ease, opacity .24s ease; }
.tech-cursor-brackets { opacity: .75; }
.tech-cursor-orbit { transform-origin: 32px 32px; animation: tech-cursor-orbit 9s linear infinite; }
html:not(.tech-cursor-on) .tech-cursor-orbit { animation-play-state: paused; }
.tech-cursor-inner { opacity: .4; }

.tech-cursor-label {
  position: absolute;
  top: 54px;
  left: 47px;
  color: #a6e9ff;
  font-family: 'Space Grotesk', monospace;
  font-size: 8px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: .19em;
  white-space: nowrap;
  text-shadow: 0 1px 4px #000, 0 0 8px #006eff;
  opacity: .7;
}
.tech-cursor-label::before { content: ''; display: inline-block; width: 8px; height: 1px; margin: 0 5px 3px 0; background: currentColor; }
.tech-cursor-reticle.label-left .tech-cursor-label { left: auto; right: 47px; }
.tech-cursor-reticle.label-above .tech-cursor-label { top: auto; bottom: 54px; }
.tech-cursor.is-target { --cursor-color: #bcf6ff; }
.tech-cursor.is-target .tech-cursor-brackets { transform: rotate(45deg) scale(1.13); opacity: 1; }
.tech-cursor.is-target .tech-cursor-inner { transform: scale(1.17); opacity: .8; }
.tech-cursor.is-target .tech-cursor-label { opacity: 1; }
.tech-cursor.is-drag { --cursor-color: #94baff; }
.tech-cursor.is-drag .tech-cursor-brackets { transform: scale(1.2, .8); opacity: 1; }
.tech-cursor.is-pressed .tech-cursor-brackets { transform: scale(.8); opacity: 1; }

@keyframes tech-cursor-orbit { to { transform: rotate(360deg); } }

/* Preserve the native pointer whenever animated effects are disabled. */
@media (prefers-reduced-motion: reduce), (forced-colors: active) {
  html.tech-cursor-on, html.tech-cursor-on * { cursor: revert !important; }
  .tech-cursor { display: none; }
}