/* ============================================================
   Akdeniz — управляемое: курсор-крючок и карточки-непоседы
   ============================================================ */

/* ---------- Курсор-крючок ---------- */
.has-hook,
.has-hook a,
.has-hook button,
.has-hook .card,
.has-hook .box{ cursor:none; }
/* в местах ввода текста родной курсор нужнее красивого */
.has-hook input,
.has-hook textarea,
.has-hook .term__prompt{ cursor:text; }

.cursor-hook{
  position:fixed; left:0; top:0; z-index:200;
  width:25px; height:44px; margin:-7px 0 0 -12px;
  pointer-events:none;
  will-change:transform;
  opacity:0;                       /* до первого движения мыши крючка нет */
  transition:opacity .25s;
}
.cursor-hook.born{ opacity:1; }
.cursor-hook svg{
  width:100%; height:100%;
  fill:none; stroke:var(--accent); stroke-width:2;
  stroke-linecap:round; stroke-linejoin:round;
  filter:drop-shadow(0 0 7px rgba(53,224,200,.55));
  transition:transform .22s var(--ease-out), stroke .22s;
}
/* курсор на бирюзовой кнопке — перекрашиваем в тёмный */
.cursor-hook.on-accent svg{
  stroke:#03202b;
  filter:drop-shadow(0 0 5px rgba(3,32,43,.5));
}

/* навёлся на то, что можно подцепить */
.cursor-hook.catch svg{ transform:scale(1.22) rotate(-8deg); }
/* нажал — крючок дёрнул */
.cursor-hook.pull svg{ transform:scale(.88) rotate(6deg); }

.hooked{ position:relative; }
a.hooked,
button.hooked{ text-shadow:0 0 18px rgba(53,224,200,.35); }

/* ---------- Карточки, которые можно расшвырять ---------- */
.tossable{
  position:relative;
  cursor:grab;
  touch-action:pan-y;          /* вертикальный скролл остаётся за страницей */
  will-change:transform;
}
.has-hook .tossable{ cursor:none; }

/* намёк, что карточку можно взять */
.tossable::after{
  content:"⠿";
  position:absolute; top:10px; right:12px;
  font-size:13px; line-height:1; color:var(--foam-dim);
  opacity:0; transform:translateY(-2px);
  transition:opacity .25s var(--ease-out), transform .25s var(--ease-out);
  pointer-events:none;
}
.tossable:hover::after{ opacity:.55; transform:translateY(0); }

/* карточка едет поверх всего и не обрезается границами сцены */
.tossable.grabbed{
  z-index:120;
  box-shadow:0 26px 60px -24px rgba(0,0,0,.75);
  border-color:rgba(53,224,200,.45);
}
.stage.dragging{ overflow:visible; }

/* разовое покачивание — «меня можно взять» */
.tossable.hint{ animation:toss-hint 1.3s var(--ease-out); }
.tossable.hint::after{ opacity:.55; }
@keyframes toss-hint{
  0%,100%{ transform:none; }
  22%    { transform:translate(7px,-4px) rotate(1.5deg); }
  48%    { transform:translate(-4px,1px) rotate(-.9deg); }
  72%    { transform:translate(2px,0) rotate(.4deg); }
}

/* ---------- Уважаем настройки движения ---------- */
@media (prefers-reduced-motion:reduce){
  .cursor-hook{ display:none; }
  .has-hook,.has-hook *{ cursor:auto; }
  .tossable{ cursor:auto; }
  .tossable::after{ display:none; }
}
