/* Browser-drawn pointers keep their exact hotspot, including without JavaScript. */
.cursor-reticle { display: none; }

@media (forced-colors: none) {
  input, textarea, [contenteditable]:not([contenteditable="false"]) { caret-color: #ff956f; }
  .contact-form input, .contact-form textarea { caret-color: #984323; }
}

@media (hover: hover) and (pointer: fine) and (forced-colors: none) {
  html { cursor: url('assets/cursor-precision.svg?v=3') 4 3, default; }
  /* An I-beam makes ordinary copy feel naturally selectable, too. */
  :is(p, h1, h2, h3, h4, blockquote, pre, code, figcaption, dt, dd) {
    cursor: url('assets/cursor-text.svg?v=3') 10 13, text;
  }
  :is(a[href], button, summary, [role="button"]),
  :is(a[href], button, summary, [role="button"]) * {
    cursor: url('assets/cursor-link.svg?v=3') 4 3, pointer;
  }
  /* Keep native controls and resize affordances available. */
  :is(input, textarea, select, video, audio, iframe, [contenteditable]) { cursor: auto; }
  :is(input:not([type]), input[type="text"], input[type="email"], input[type="search"],
      input[type="url"], input[type="tel"], input[type="password"], textarea,
      [contenteditable]:not([contenteditable="false"])),
  [contenteditable]:not([contenteditable="false"]) * {
    cursor: url('assets/cursor-text.svg?v=3') 10 13, text;
  }
  :is(button:disabled, input:disabled, select:disabled, textarea:disabled, [aria-disabled="true"]),
  :is(button:disabled, [aria-disabled="true"]) * { cursor: not-allowed; }
}

/* The halo responds to input; it has no perpetual animation. */
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) and (forced-colors: none) {
  .cursor-reticle {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 0;
    height: 0;
    z-index: 1000;
    pointer-events: none;
    opacity: 0;
  }
  .cursor-reticle.is-visible { opacity: 1; }
  .cursor-reticle::before {
    content: '';
    position: absolute;
    inset: -12px;
    border: 1px solid #ff956f99;
    border-radius: 50%;
    background: #ff956f08;
    box-shadow: 0 0 0 1px #10140f40;
    opacity: .7;
    transition: transform .2s cubic-bezier(.16, 1, .3, 1), border-color .2s, background-color .2s, opacity .2s;
  }
  .cursor-reticle.is-link::before { border-color: #8ad5c2cc; background: #8ad5c20a; transform: scale(1.35); opacity: .95; }
  .cursor-reticle.is-pressed::before { transform: scale(.85); opacity: 1; }
}
.motion-paused .cursor-reticle { display: none; }