/* Shared square pointer reticle, with no circular fallback. */
:root { --cursor-size: 26px; }

/* A pointer that has not moved has no position worth drawing: the reticle
   would park at 0,0 and read as a stray mark in the corner. `mo-cursor-live`
   is set on the first real pointer movement and cleared whenever the pointer
   leaves the window, so the reticle is only ever drawn where it genuinely is.
   The native cursor is hidden from mount (see tokens.css), which is the point:
   before the first move there is nothing to point AT. */
html:not(.custom-cursor) .cursor,
html.mo-origin-on .cursor,
html:not(.mo-cursor-live) .cursor {
  visibility: hidden !important;
  opacity: 0 !important;
}
html.custom-cursor.mo-cursor-live:not(.mo-origin-on) .cursor {
  visibility: visible !important;
  opacity: 1;
}
/* Cursor() commits its node before its effect sets `custom-cursor`. Keep the
   hidden node out of flow meanwhile, or its readout pushes the page down. */
html:not(.custom-cursor) .cursor { position: fixed; }

html.custom-cursor .cursor {
  position: fixed;
  top: 0;
  left: 0;
  width: var(--cursor-size, 26px);
  height: var(--cursor-size, 26px);
  z-index: 9000;
  pointer-events: none;
  color: var(--ash, #9aa4b4);
  mix-blend-mode: normal;
  filter: drop-shadow(0 0 2px rgba(2, 4, 9, 0.65));
  transition: width var(--d-fast, 120ms) var(--e-out, ease-out),
              height var(--d-fast, 120ms) var(--e-out, ease-out),
              opacity var(--d-fast, 120ms) var(--e-out, ease-out);
}

html.custom-cursor .cursor__ring {
  position: absolute;
  inset: 0;
  border: 0 !important;
  border-radius: 0 !important;
  opacity: 1;
  color: var(--ash, #9aa4b4);
  --bw: 1.5px;
  --bl: 7px;
  background:
    linear-gradient(currentColor, currentColor) 0 0 / var(--bl) var(--bw) no-repeat,
    linear-gradient(currentColor, currentColor) 0 0 / var(--bw) var(--bl) no-repeat,
    linear-gradient(currentColor, currentColor) 100% 0 / var(--bl) var(--bw) no-repeat,
    linear-gradient(currentColor, currentColor) 100% 0 / var(--bw) var(--bl) no-repeat,
    linear-gradient(currentColor, currentColor) 0 100% / var(--bl) var(--bw) no-repeat,
    linear-gradient(currentColor, currentColor) 0 100% / var(--bw) var(--bl) no-repeat,
    linear-gradient(currentColor, currentColor) 100% 100% / var(--bl) var(--bw) no-repeat,
    linear-gradient(currentColor, currentColor) 100% 100% / var(--bw) var(--bl) no-repeat;
  transition: transform var(--d-fast, 120ms) var(--e-snap, ease-out),
              color var(--d-fast, 120ms);
}

html.custom-cursor .cursor__center {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 2px;
  height: 2px;
  border: 0 !important;
  border-radius: 0 !important;
  background: var(--ash, #9aa4b4);
  transform: translate(-50%, -50%);
  transition: background var(--d-fast, 120ms),
              width var(--d-fast, 120ms),
              height var(--d-fast, 120ms);
}

html.custom-cursor .cursor__hLine,
html.custom-cursor .cursor__vLine {
  position: absolute;
  background: var(--signal, #00d8b5);
  opacity: 0;
  transition: opacity var(--d-fast, 120ms);
}
html.custom-cursor .cursor__hLine {
  left: 50%;
  top: 50%;
  width: 14px;
  height: 1px;
  transform: translate(-50%, -50%);
}
html.custom-cursor .cursor__vLine {
  left: 50%;
  top: 50%;
  width: 1px;
  height: 14px;
  transform: translate(-50%, -50%);
}

html.custom-cursor .cursor__coords {
  position: absolute;
  top: auto;
  right: auto;
  bottom: -16px;
  left: 0;
  transform: none;
  font-family: var(--ff-mono, ui-monospace, monospace);
  font-size: var(--fs-nano);
  color: var(--ghost, #657083);
  white-space: nowrap;
  letter-spacing: var(--tr-caps);
  text-align: left;
  text-transform: uppercase;
}
html.custom-cursor .cursor__coords::before { content: "⁂ "; color: var(--signal, #00d8b5); }

html.custom-cursor .cursor--idle .cursor__ring { transform: scale(0.92); opacity: 1; }
html.custom-cursor .cursor--hot .cursor__ring { transform: scale(0.66); color: var(--signal, #00d8b5); }
html.custom-cursor .cursor--hot .cursor__center { background: var(--signal, #00d8b5); }
html.custom-cursor .cursor--grab .cursor__ring { transform: scale(1.32); color: var(--signal, #00d8b5); --bl: 9px; }
html.custom-cursor .cursor--grab .cursor__center { background: var(--signal, #00d8b5); }
html.custom-cursor .cursor--probe .cursor__ring { transform: scale(1.55); color: var(--signal, #00d8b5); }
html.custom-cursor .cursor--probe .cursor__center { background: var(--signal, #00d8b5); }
html.custom-cursor .cursor--probe .cursor__hLine,
html.custom-cursor .cursor--probe .cursor__vLine { opacity: 0.85; }

@media (pointer: coarse) {
  html.custom-cursor .cursor { display: none; }
}

/* A native modal is above every document z-index. Cursor() lends its one
   existing node to the dialog, including when the origin hides field probes. */
html.custom-cursor.mo-cursor-live dialog .cursor {
  visibility:visible!important;
  opacity:1!important;
}