/* ============================ КУРСОРЫ ============================

   Пиксельные стрелка и рука вместо системных. Собраны 9 сентября 2026
   из скриншота Анастасии — сетка снята по клеткам, цвета те же, что
   в макете: #353535 (наш --ink) и белый.

   Файлы в assets/: стрелка 24×38, рука 34×44 — это исходный арт,
   увеличенный вдвое (по-пиксельно, nearest neighbor), плюс копии ×2
   для ретины: 48×76 и 68×88. Все четыре весят вместе 1.2 КБ.

   Почему ровно вдвое, а не крупнее: ретина-копия — это уже ×4 от арта,
   и у руки это 68×88. На ×3 она была бы 102×132, а 132 больше лимита
   в 128 (см. ниже) — на маке рука просто отвалилась бы к системной.

   Важные ограничения, из-за которых всё написано именно так:

   · Браузер НЕ масштабирует курсор — PNG показывается в своих
     пикселях, поэтому на ретине без версии ×2 картинка мыльная.
     Отсюда image-set: в трёх строках подряд, от простого к сложному.
     Первая строка (обычный url) — для браузеров без image-set,
     вторая — для Safari до 17, третья — современный синтаксис.
     Кто не понял строку, тот её выбрасывает и остаётся на предыдущей.

   · Курсор больше 128×128 браузеры игнорируют молча — если когда-нибудь
     будем рисовать крупнее, дальше 128 не уходить.

   · После картинки ОБЯЗАТЕЛЕН запасной ключ (default / pointer): без
     него правило невалидно целиком. Он же сработает, если PNG не
     загрузится.

   · Точка нажатия (два числа после url) — в пикселях от левого верхнего
     угла картинки: у стрелки это остриё 0 0, у руки — кончик
     указательного пальца 12 0 (в арте это 6-й пиксель, картинка вдвое
     крупнее — отсюда 12). Считается по той картинке, что стоит в url
     первой; для ретина-копии координаты удваивать НЕ нужно.

   · Курсор крупнее 32×32 Chrome с M74 подменяет системным, если тот
     задевает интерфейс браузера. Наши 34×44 в это правило попадают, но
     хотспоты в левом верхнем углу — картинка растёт вправо-вниз и до
     адресной строки не достаёт; задеть может только нижний и правый
     край окна. Если начнёт мешать — вернуться к ×1.
   ================================================================= */

/* стрелка — на всём документе */
html {
  cursor: url("../assets/cursor-arrow.png") 0 0, default;
  cursor: -webkit-image-set(
      url("../assets/cursor-arrow.png") 1x,
      url("../assets/cursor-arrow-2x.png") 2x) 0 0, default;
  cursor: image-set(
      url("../assets/cursor-arrow.png") 1x,
      url("../assets/cursor-arrow-2x.png") 2x) 0 0, default;
}

/* рука — на всём кликабельном.
   Перечислены ТИПЫ, а не классы: так под правило попадают и кнопки
   в клоне шапки внутри липкой полосы, и всё, что появится потом.

   Два класса дописаны отдельно, и это не про красоту: .menu-btn
   (styles.css) и .faq__row (claude/faq.css) ставят себе cursor: pointer
   сами, а селектор по классу весомее селектора по тегу — порядок
   подключения тут не спасает, тег `button` проиграет классу в любом
   случае. Если у нового элемента появится свой cursor по классу —
   дописать его в этот список, иначе на нём останется системная рука. */
a[href],
button,
summary,
label[for],
[role="button"],
[onclick],
.menu-btn,
.faq__row {
  cursor: url("../assets/cursor-pointer.png") 12 0, pointer;
  cursor: -webkit-image-set(
      url("../assets/cursor-pointer.png") 1x,
      url("../assets/cursor-pointer-2x.png") 2x) 12 0, pointer;
  cursor: image-set(
      url("../assets/cursor-pointer.png") 1x,
      url("../assets/cursor-pointer-2x.png") 2x) 12 0, pointer;
}

/* на неактивном элементе рука обманывает — возвращаем стрелку */
button:disabled,
[aria-disabled="true"] {
  cursor: url("../assets/cursor-arrow.png") 0 0, default;
  cursor: -webkit-image-set(
      url("../assets/cursor-arrow.png") 1x,
      url("../assets/cursor-arrow-2x.png") 2x) 0 0, default;
  cursor: image-set(
      url("../assets/cursor-arrow.png") 1x,
      url("../assets/cursor-arrow-2x.png") 2x) 0 0, default;
}

/* поля ввода и выделяемый текст оставляем системными: там курсор —
   не украшение, а подсказка, что можно печатать и выделять */
input,
textarea,
select {
  cursor: auto;
}
