/* ===========================================================================
   Arena Rise — interactive cursor.

   Two parts moving at different rates, which is what makes it read as one
   object with weight rather than as a sticker glued to the pointer:

     dot   primary   tracks the pointer exactly, no lag
     ring  secondary trails behind, settles after the dot has stopped

   States: rest → hover (ring opens around the target, dot recedes)
           → press (ring contracts, the impact) → release (settles back).

   Only mounted for a fine, hovering pointer, and never under reduced motion —
   a trailing cursor is precisely the motion that setting exists to suppress.
   =========================================================================== */

.cur{
  position:fixed;top:0;left:0;z-index:200;pointer-events:none;
  border-radius:50%;
  opacity:0;
  will-change:transform,opacity;
}
.cur--dot{
  width:6px;height:6px;margin:-3px 0 0 -3px;
  background:var(--ar-teal-400);
  transition:opacity 220ms linear,width 260ms var(--ease-out),height 260ms var(--ease-out),
             margin 260ms var(--ease-out),background-color 260ms var(--ease-standard);
}
.cur--ring{
  width:36px;height:36px;margin:-18px 0 0 -18px;
  border:1px solid rgba(69,195,194,.55);
  background:rgba(69,195,194,0);
  transition:opacity 220ms linear,width 320ms var(--ease-out),height 320ms var(--ease-out),
             margin 320ms var(--ease-out),border-color 260ms var(--ease-standard),
             background-color 320ms var(--ease-standard);
}

html.has-cursor .cur{opacity:1}
html.has-cursor.cur-hidden .cur{opacity:0}

/* the native pointer steps aside, except where a caret is the better signal */
html.has-cursor,
html.has-cursor *{cursor:none}
html.has-cursor input,
html.has-cursor textarea,
html.has-cursor select{cursor:auto}

/* hover: the ring opens around whatever is under it and the dot recedes */
html.has-cursor.cur-hot .cur--ring{
  width:62px;height:62px;margin:-31px 0 0 -31px;
  border-color:rgba(69,195,194,.9);
  background:rgba(69,195,194,.10);
}
html.has-cursor.cur-hot .cur--dot{
  width:4px;height:4px;margin:-2px 0 0 -2px;
  background:rgba(69,195,194,.7);
}

/* press: the ring contracts — the impact the release then recovers from */
html.has-cursor.cur-down .cur--ring{
  width:30px;height:30px;margin:-15px 0 0 -15px;
  background:rgba(69,195,194,.20);
}
html.has-cursor.cur-hot.cur-down .cur--ring{
  width:52px;height:52px;margin:-26px 0 0 -26px;
}

@media (hover:none),(pointer:coarse),(prefers-reduced-motion:reduce){
  .cur{display:none}
  html.has-cursor,html.has-cursor *{cursor:auto}
}
