/* One mint-green arrow for desktop browsing; keep native text and disabled cues. */
:root { --cursor-color: #72D4A1; --cursor-rgb: 114, 212, 161; }
@media (hover: hover) and (pointer: fine) {
  html, body,
  :root :is(a, button, summary, [role='button'], [role='link'], [role='tab'],
    input[type='button'], input[type='submit'], input[type='reset']) {
    cursor: url('assets/cursor-arrow.svg?v=20261114-mint') 3 3, auto;
  }
  :root :is(input:not([type='button']):not([type='submit']):not([type='reset']):not([type='checkbox']):not([type='radio']):not([type='range']):not([type='color']),
    textarea, [contenteditable='true']) { cursor: text; }
  :root :is(button:disabled, input:disabled, [aria-disabled='true']) { cursor: not-allowed; }
}

/* Selection is shared by prose, code and navigation labels. */
::selection { background: #335AF6; color: #FFFFFF; text-shadow: none; }

/* JavaScript enables this only after the arrow has a real pointer position. */
.site-cursor {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 2500;
  width: 24px;
  height: 24px;
  pointer-events: none;
  user-select: none;
  will-change: transform;
}
.site-cursor[hidden] { display: none !important; }
.site-cursor__icon {
  display: block;
  width: 24px;
  height: 24px;
  max-width: none;
  pointer-events: none;
  user-select: none;
  transform-origin: 3px 3px;
  transition: transform 90ms ease-out;
}
.site-cursor__icon.is-pressed { transform: scale(.72); }

.cursor-click-ring {
  position: fixed;
  /* The opaque bar occludes the sharp wave; its synchronized local copy is frosted. */
  z-index: 995;
  box-sizing: border-box;
  width: 52px;
  height: 52px;
  border: 2px solid var(--cursor-color, #72D4A1);
  border-radius: 50%;
  background: rgba(var(--cursor-rgb, 114, 212, 161), .16);
  pointer-events: none;
  user-select: none;
  animation: cursor-click-release 480ms cubic-bezier(.16, 1, .3, 1) both;
}
.cursor-click-ring--nav {
  position: absolute;
  z-index: 1;
}
.cursor-click-ring--nav-source {
  background: rgba(var(--cursor-rgb, 114, 212, 161), .3);
}
@keyframes cursor-click-release {
  0% { opacity: .95; transform: translate(-50%, -50%) scale(.24); }
  45% { opacity: .6; }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(1.45); }
}

@media (hover: hover) and (pointer: fine) {
  html.has-animated-cursor,
  html.has-animated-cursor body,
  html.has-animated-cursor :is(a, button, summary, [role='button'], [role='link'], [role='tab'],
    input[type='button'], input[type='submit'], input[type='reset']) { cursor: none; }
  html.has-animated-cursor :is(input:not([type='button']):not([type='submit']):not([type='reset']):not([type='checkbox']):not([type='radio']):not([type='range']):not([type='color']),
    textarea, [contenteditable='true']) { cursor: text; }
  html.has-animated-cursor :is(button:disabled, input:disabled, [aria-disabled='true']) { cursor: not-allowed; }

  /* Individual transforms leave the existing card tilt and fan transforms intact.
     JS can supply the resting values when an element already uses these properties. */
  .is-drag-lifted,
  .is-drag-settling {
    transition: var(--drag-rest-transition, transform 320ms ease-out, box-shadow 320ms ease-out),
      translate 140ms ease-out, scale 140ms ease-out, filter 140ms ease-out !important;
  }
  .is-drag-lifted {
    translate: var(--drag-rest-x, 0px) calc(var(--drag-rest-y, 0px) - 20px) !important;
    scale: calc(var(--drag-rest-scale-x, 1) * 1.045) calc(var(--drag-rest-scale-y, 1) * 1.045) !important;
    filter: var(--drag-rest-filter, brightness(1)) drop-shadow(0 26px 24px rgba(39, 61, 109, .32)) !important;
  }
  .is-drag-settling {
    translate: var(--drag-rest-x, 0px) var(--drag-rest-y, 0px) !important;
    scale: var(--drag-rest-scale-x, 1) var(--drag-rest-scale-y, 1) !important;
    filter: var(--drag-rest-filter, brightness(1)) drop-shadow(0 0 0 rgba(39, 61, 109, 0)) !important;
    transition: var(--drag-rest-transition, transform 320ms ease-out, box-shadow 320ms ease-out),
      translate 650ms cubic-bezier(.22, 1, .36, 1),
      scale 650ms cubic-bezier(.22, 1, .36, 1),
      filter 650ms cubic-bezier(.22, 1, .36, 1) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .site-cursor__icon { transition: none; }
  .site-cursor__icon.is-pressed { transform: none; }
  .cursor-click-ring { display: none; animation: none; }
  .is-drag-lifted,
  .is-drag-settling { transition: none !important; }
}